html,body{overscroll-behavior:none;overflow-x:clip}
/*
Theme Name: OMICall 2026
Theme URI: https://omicall.com
Author: ViHAT Group — Marketing
Description: Theme OMICall dựng từ bộ template HTML mới (Be Vietnam Pro, xanh #00B1FF/#56cc6e). Trang marketing chạy bằng code, giữ blog WordPress. Có cổng chặn IP khi build.
Version: 0.8.1
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: omicall2026
*/

/* ======= KHUNG CHUNG (root vars + body) ======= */
*{box-sizing:border-box;margin:0;padding:0;-webkit-hyphens:none!important;hyphens:none!important}
:root{--blue:#00B1FF;--green:#56cc6e;--bd:#0080c0;--bl:#e6f7fe;--gl:#eef7dc;--tx:#1e3150;--mu:#6b7280;--li:#9ca3af;--bg:#fff;--sf:#f8fafc;--mi:#f1f5f9;--br:#e5eaf0;--gold:#d97706;--gold-lt:#fef3c7;--r:12px;--rl:20px;--sh:0 4px 24px rgba(0,0,0,.06)}
body{font-family:'Be Vietnam Pro',sans-serif;color:var(--tx);background:var(--bg);line-height:1.7;font-size:16px;position:relative}
button,input,select,textarea{font-family:inherit;color:inherit}
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 70% 50% at 80% 5%, rgba(0,177,255,.1) 0%, transparent 60%),
    radial-gradient(ellipse 55% 45% at 10% 85%, rgba(86,204,110,.06) 0%, transparent 60%),
    #f8fcff}
a{text-decoration:none;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 2rem}

/* ======= HEADER ======= */
header.site-header{position:sticky;top:0;z-index:100;background:rgba(248,252,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--br)}
.hdr{display:flex;align-items:center;justify-content:space-between;height:72px;max-width:1280px;margin:0 auto;padding:0 2rem;white-space:nowrap;gap:1.5rem}
.hdr > div:first-child{display:flex;align-items:center;height:100%}
.logo{font-size:0;line-height:0;display:inline-flex;align-items:center}
.logo .b{color:var(--blue)}.logo .g{color:var(--green)}
.logo img{height:40px;width:auto;display:block}
.mnv-header .logo img{height:34px}
footer.site-footer .logo img{height:34px}
@media(max-width:640px){.logo img{height:32px}}
nav.mainnav{display:flex;gap:.75rem;align-items:center;white-space:nowrap}
nav.mainnav a{font-size:.84rem;font-weight:600;color:var(--mu);transition:color .2s;white-space:nowrap;text-transform:uppercase;letter-spacing:.2px}
nav.mainnav a:hover,nav.mainnav a.active{color:var(--blue)}
.hdr-group{display:flex;align-items:center;gap:.75rem}
.hdr-right{display:flex;align-items:center;gap:.75rem;flex-shrink:0}
.hdr-login{font-size:.72rem;font-weight:600;color:var(--tx);padding:.35rem .875rem;border-radius:7px;border:1px solid rgba(0,0,0,.15);transition:all .2s}
.hdr-login:hover{border-color:var(--blue);color:var(--blue)}
.hdr-register{font-size:.72rem;font-weight:700;color:#fff;padding:.35rem .875rem;border-radius:7px;border:1px solid var(--blue);background:var(--blue);transition:all .2s}
.hdr-register:hover{opacity:.88}

/* ======= FOOTER ======= */
footer.site-footer{background:linear-gradient(180deg,#f8fcff,#eef6fb);padding:60px 0 28px;border-top:1px solid var(--br);margin-top:80px}
.fgrid2{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:3rem;align-items:start}
.fdesc2{font-size:.84rem;line-height:1.55;color:var(--mu);max-width:34ch;margin-top:.75rem}
.fhd{font-size:.82rem;font-weight:800;color:var(--tx);margin-bottom:.875rem;letter-spacing:.3px}
.flinks{list-style:none;display:flex;flex-direction:column;gap:.7rem}
.flinks a{font-size:.82rem;color:var(--mu);transition:color .2s}
.flinks a:hover{color:var(--blue)}
.fbot{border-top:1px solid var(--br);padding-top:1.5rem;display:flex;justify-content:center;align-items:center;text-align:center;font-size:.78rem;color:var(--li)}
.fbrand-line{display:inline-flex;align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.72rem;color:var(--mu);font-weight:600;background:#fff;padding:4px 12px;border-radius:100px;border:1px solid var(--br)}
.fbrand-line::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--blue)}

/* ======= MOBILE MENU (rút gọn) ======= */
.mnv-toggle{display:none;background:none;border:none;padding:8px;cursor:pointer;margin-left:auto;color:var(--tx);border-radius:8px}
.mnv-toggle svg{width:24px;height:24px;display:block}
@media(max-width:960px){
  .hdr nav.mainnav,.hdr-right{display:none}
  .hdr-group{margin-left:auto}
  .mnv-toggle{display:flex;align-items:center;justify-content:center}
  .fgrid2{grid-template-columns:1fr 1fr;gap:2rem}
}
@media(max-width:640px){
  .hdr{padding:0 1rem;height:60px}
  .fgrid2{grid-template-columns:1fr;gap:1.5rem}
  .fbot{flex-direction:column;gap:.5rem;text-align:center}
  .wrap{padding:0 1.25rem}
}

/* Ẩn hẳn nút gọi hotline nổi (theo yêu cầu) — đồng thời hết khoảng trống dưới footer */
.hotline-phone-ring-wrap{display:none!important}

/* Badge "Tiết kiệm" (value) cho menu Dịch vụ — định nghĩa toàn cục để mọi trang đều có màu */
.nav-dd-badge.value{background:linear-gradient(135deg,#16a34a,#65a30d)!important;color:#fff!important}
.mnv-sub-badge.value{background:linear-gradient(135deg,#16a34a,#65a30d)!important;color:#fff!important}

/* Phân trang blog (WP paginate_links) — tách số, bo nút cho dễ đọc */
.bg-page-wrap .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;margin:0 5px;border-radius:10px;border:1px solid var(--br);background:#fff;color:var(--tx);font-weight:700;font-size:.92rem;text-decoration:none;transition:all .2s;line-height:1}
.bg-page-wrap a.page-numbers:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-1px)}
.bg-page-wrap .page-numbers.current{background:var(--blue);color:#fff;border-color:var(--blue)}
.bg-page-wrap .page-numbers.dots{border:none;background:transparent;min-width:auto;padding:0 2px;color:var(--li)}

/* Ảnh trong nội dung bài viết: ép vừa cột (tránh tràn), bo góc */
.pt-content img,.pt-content figure{max-width:100%!important;height:auto!important}
.pt-content figure img{width:100%!important}
.pt-content img{border-radius:12px;margin:1.25rem 0;display:block}
.pt-content figure{margin:1.5rem 0}
.pt-content figure figcaption{font-size:.82rem;color:var(--mu);text-align:center;margin-top:.5rem}

/* Lightbox: bấm ảnh minh hoạ -> phóng to xem full */
.pt-content img{cursor:zoom-in}
#omiLb{position:fixed;inset:0;z-index:99999;background:rgba(8,20,35,.92);display:none;align-items:center;justify-content:center;padding:8px;cursor:zoom-out;opacity:0;transition:opacity .2s;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
#omiLb.open{display:flex;opacity:1}
#omiLb img{max-width:99vw;max-height:98vh;width:auto;height:auto;border-radius:10px;box-shadow:0 30px 90px rgba(0,0,0,.55);cursor:default}
#omiLb .omiLb-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.32);color:#fff;font-size:24px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}
#omiLb .omiLb-close:hover{background:rgba(255,255,255,.3)}

/* NOTE: CSS riêng của từng trang marketing nằm trong file template tương ứng
   (template-*.php) — giữ nguyên như bản HTML mẫu. */

/* ── Màu link chân trang ĐỒNG NHẤT (anh chốt 17/8, sửa lần 2) ─────────────────
   LẦN 1 mình đặt rule này rồi mà anh vẫn thấy lẫn màu. Lần 2 đã tìm ra ĐÚNG hai lý do:

   (1) CACHE. Tệp này nạp qua `style.css?ver=<hằng>` mà mình KHÔNG bump hằng phiên bản
       → URL không đổi → trình duyệt dùng lại bản CSS CŨ (chưa có rule này). curl thì
       luôn thấy rule vì curl không cache. Đã bump hằng cùng lượt sửa này.

   (2) `:visited`. Nhóm link anh thấy XANH — Bảng giá, Blog, Voice Brandname, SMS
       Brandname, Tổng đài AI — đều là URL **đã tồn tại trên .com từ trước**, tức nằm
       trong history trình duyệt của anh. Nhóm ĐEN — /tinh-nang/…, Case study — là URL
       MỚI, chưa từng bấm. Đó là khác biệt đã-thăm / chưa-thăm, không phải khác class.
       Nên phải khai cả `:link` và `:visited`.
       Và dùng MÀU LITERAL, không `var()`: trình duyệt giới hạn thuộc tính cho `:visited`
       (chống dò history) và biến CSS trong `:visited` không được bảo đảm hoạt động.

   Đặt ở `style.css` vì tệp này enqueue trên CẢ .vn lẫn .com và nạp sau phần <style>
   trong đầu trang → một tệp phủ 34 trang, hai site. */
footer .flinks a,
footer .flinks a:link,
footer .flinks a:visited,
footer .fcontact a,
footer .fcontact a:link,
footer .fcontact a:visited { color: #6b7280; text-decoration: none; }

footer .flinks a:hover,
footer .flinks a:focus,
footer .fcontact a:hover,
footer .fcontact a:focus { color: #00B1FF; }

footer .fbot a,
footer .fbot a:link,
footer .fbot a:visited { color: #9ca3af; }

/* Số điện thoại ở cột Liên hệ là link `tel:` — đậm hơn các link khác, giữ đúng như lúc
   còn là <span>. Đặt SAU khối trên để thắng ở cùng độ ưu tiên. */
footer .fcontact a.fc-val,
footer .fcontact a.fc-val:link,
footer .fcontact a.fc-val:visited { color: #1e3150; font-weight: 700; text-decoration: none; }
footer .fcontact a.fc-val:hover { color: #00B1FF; }

/* ── Ô TÌM KIẾM BLOG: ép phông, đừng tin `inherit` ───────────────────────────
   `button,input,select,textarea{font-family:inherit}` đã có sẵn mà placeholder vẫn ra
   SERIF. Lý do: `input[type=search]` mang `-webkit-appearance:searchfield` — ở dạng đó
   WebKit áp phông của hệ điều hành và bỏ qua `inherit`. Nên phải tắt appearance VÀ khai
   phông tên rõ ràng, khai riêng cho `::placeholder` (nó không luôn thừa hưởng từ input). */
.bg-search input,
.bg-search input[type="search"] {
  -webkit-appearance: none; appearance: none;
  font-family: 'Be Vietnam Pro', sans-serif;
}
.bg-search input::placeholder { font-family: 'Be Vietnam Pro', sans-serif; opacity: 1; }
.bg-search input::-webkit-input-placeholder { font-family: 'Be Vietnam Pro', sans-serif; }

/* ======= ĐỔI NGÔN NGỮ (VI/LO — chèn bởi omicom_chen_doi_ngon_ngu, chrome.php) =======
   Khối HTML chèn lúc chạy nên KHÔNG có trong CSS inline của 51 tệp trang. Chỉ khai
   phần RIÊNG ở đây; khuôn chung (`.nav-dropdown`, `.nav-dd-menu`, mở khi hover,
   `.nav-dd-item`, `.nav-dd-item.active`, `.mnv-link`) đã có inline trong từng trang,
   dùng lại nguyên, không viết đè. Màu chỉ lấy từ :root — không đẻ màu mới. */

/* -- Cờ: 18×12 (đúng tỉ lệ 2:3 của viewBox 30×20), viền mờ cho cờ nền trắng khỏi lẫn -- */
.nav-lang-flag {
  display: inline-block; width: 18px; height: 12px; flex-shrink: 0;
  border-radius: 2px; overflow: hidden; box-shadow: 0 0 0 1px rgba(0,0,0,.08);
}
.nav-lang-flag svg { width: 100%; height: 100%; display: block; }

/* -- Máy tính: dropdown thứ 5 trên thanh nav, cùng cỡ/màu 4 cái đang có -- */
.nav-lang .nav-dd-trigger { gap: 5px; }
.nav-lang-menu { min-width: 176px; padding: .5rem; }
/* `header nav a` ép uppercase — tên ngôn ngữ ("Tiếng Việt", "ລາວ") phải gỡ ép đó. */
.nav-lang-menu .nav-dd-item {
  justify-content: flex-start; gap: .5rem;
  text-transform: none; letter-spacing: 0; font-size: .78rem;
}
.nav-lang-ma  { font-weight: 700; min-width: 1.6em; }
.nav-lang-ten { margin-left: auto; padding-left: .75rem; color: var(--mu); font-weight: 500; font-size: .74rem; }
.nav-lang-menu .nav-dd-item.active .nav-lang-ten { color: var(--bd); }

/* -- Điện thoại: hai ô cạnh nhau ngay trên cụm nút Đăng nhập/Đăng ký của ngăn kéo -- */
.mnv-lang { padding: .75rem 1.25rem 1rem; border-top: 1px solid var(--br); }
.mnv-lang-nhan {
  display: block; font-size: .72rem; font-weight: 600; color: var(--mu);
  text-transform: uppercase; letter-spacing: .3px; margin-bottom: .5rem;
}
.mnv-lang-ds { display: flex; gap: .5rem; }
.mnv-lang-item {
  flex: 1; display: flex; align-items: center; gap: .5rem;
  padding: .6rem .75rem; border: 1.5px solid var(--br); border-radius: 10px;
  font-size: .85rem; color: var(--tx); text-decoration: none; min-width: 0;
}
.mnv-lang-item b { font-weight: 700; }
.mnv-lang-item small {
  font-weight: 500; color: var(--mu); font-size: .74rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mnv-lang-item.active { border-color: var(--blue); background: var(--bl); color: var(--bd); }

/* Chữ Lào cần phông riêng, 'Be Vietnam Pro' không có dấu thanh Lào → rơi về phông hệ. */
[lang="lo"] .nav-lang-ten,
[lang="lo"] small { font-family: 'Noto Sans Lao', 'Be Vietnam Pro', sans-serif; }
