/* ============================================================
   T2P AISoft — Unified site chrome (header + footer + floating)
   Prefixed .t2p-* classes so it can load globally WITHOUT
   colliding with Bootstrap. Safe on every page during the
   gradual migration away from Bootstrap.
   Palette mirrors template/theme.css design tokens.
   ============================================================ */
:root{
  --t2p-brand:#1E40AF;
  --t2p-brand-2:#3b82f6;
  --t2p-brand-dark:#1B3A9E;
  --t2p-teal:#2fe6d6;
  --t2p-blue:#3d8bff;
  --t2p-accent:#F5A623;
  --t2p-yellow:#F6BE00;
  --t2p-danger:#ef4444;
  --t2p-text:#171717;
  --t2p-muted:#52525b;
  --t2p-muted-2:#71717a;
  --t2p-line:#e4e4e7;
  --t2p-line-soft:#f4f4f5;
  --t2p-foot:#16213E;
  --t2p-grad-video:linear-gradient(135deg,#1E40AF,#3d8bff 60%,#2fe6d6);
  --t2p-grad-brand:linear-gradient(135deg,#1E40AF,#3b82f6);
}

/* ---------- Header ---------- */
header.t2p-header{position:sticky;top:0;z-index:1030;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--t2p-line-soft);font-family:'Be Vietnam Pro',system-ui,-apple-system,sans-serif}
.t2p-nav{display:flex;align-items:center;gap:24px;height:64px;max-width:1280px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.t2p-logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:23px;color:var(--t2p-brand);white-space:nowrap;text-decoration:none}
.t2p-logo .ico{width:42px;height:42px;border-radius:12px;background:var(--t2p-grad-video);display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px}
.t2p-logo small{display:block;font-size:9px;font-weight:600;color:var(--t2p-muted-2);letter-spacing:.6px;text-transform:uppercase}
.t2p-logo .brand-t2p{color:var(--t2p-brand)}
.t2p-logo .brand-ai{color:var(--t2p-yellow)}
.t2p-logo .brand-soft{color:var(--t2p-brand)}
.t2p-menu{display:flex;gap:22px;align-items:center;font-size:14px;font-weight:600;margin-left:10px}
.t2p-menu a{position:relative;display:flex;align-items:center;gap:5px;padding:6px 0;color:var(--t2p-text);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;text-decoration:none}
.t2p-menu a:hover{color:var(--t2p-brand)}
/* Highlight mục menu đang xem */
.t2p-menu a.t2p-active{color:var(--t2p-brand);font-weight:800}
.t2p-menu a.t2p-active::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;border-radius:3px;background:var(--t2p-brand)}
.t2p-badge{font-size:9px;font-weight:800;padding:2px 7px;border-radius:20px;color:#fff;letter-spacing:.3px;background:var(--t2p-danger)}
.t2p-navright{margin-left:auto;display:flex;gap:10px;align-items:center}

/* Buttons in chrome */
.t2p-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;font-weight:700;font-size:14px;border-radius:8px;padding:9px 16px;cursor:pointer;border:none;transition:.2s;white-space:nowrap;text-decoration:none;line-height:1.2}
.t2p-btn:hover{transform:translateY(-1px)}
.t2p-btn-orange{background:var(--t2p-accent);color:#fff}
.t2p-btn-orange:hover{filter:brightness(.96);color:#fff}
.t2p-btn-outline{border:1.5px solid var(--t2p-brand);color:var(--t2p-brand);background:#fff}
.t2p-btn-outline:hover{background:var(--t2p-brand);color:#fff}

/* Wallet pill */
.t2p-wallet{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:14px;color:var(--t2p-accent);padding:6px 12px;border-radius:20px;background:rgba(245,166,35,.12);text-decoration:none;white-space:nowrap}
.t2p-wallet:hover{background:rgba(245,166,35,.2);color:var(--t2p-accent)}

/* User + lang dropdown reuse Bootstrap .dropdown-menu (globally loaded) */
.t2p-userbtn{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:14px;color:var(--t2p-text);background:transparent;border:1px solid var(--t2p-line);border-radius:20px;padding:6px 13px;cursor:pointer;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none}
.t2p-userbtn:hover{border-color:var(--t2p-brand);color:var(--t2p-brand)}
.t2p-langbtn{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px;color:var(--t2p-muted);background:#fff;border:1px solid var(--t2p-line);border-radius:20px;padding:6px 11px;cursor:pointer;text-decoration:none}
.t2p-langbtn:hover{color:var(--t2p-brand);border-color:var(--t2p-brand)}

/* Mobile toggler + collapse */
.t2p-toggler{display:none;background:none;border:none;color:var(--t2p-brand);font-size:22px;cursor:pointer;margin-left:auto}
.t2p-collapse{display:contents}

@media(max-width:992px){
  .t2p-toggler{display:block}
  .t2p-collapse{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--t2p-line);box-shadow:0 12px 30px rgba(10,20,60,.08);flex-direction:column;padding:14px clamp(16px,4vw,40px);gap:12px;z-index:1029}
  .t2p-collapse.open{display:flex}
  header.t2p-header{position:relative}
  .t2p-menu{flex-direction:column;align-items:flex-start;gap:10px;margin-left:0;width:100%}
  .t2p-navright{margin-left:0;flex-wrap:wrap;width:100%}
}
@media(max-width:520px){
  .t2p-logo small{display:none}
  .t2p-logo{font-size:18px}
  .t2p-logo .ico{width:34px;height:34px;font-size:16px}
}

/* ---------- Footer ---------- */
footer.t2p-footer{background:var(--t2p-foot);color:#fff;padding:50px 0 20px;font-family:'Be Vietnam Pro',system-ui,-apple-system,sans-serif}
.t2p-foot-wrap{max-width:1280px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.t2p-foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:30px}
.t2p-foot-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:22px;color:#fff;text-decoration:none}
.t2p-foot-brand .ico{width:40px;height:40px;border-radius:11px;background:var(--t2p-grad-video);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}
.t2p-foot-brand .brand-t2p,.t2p-foot-brand .brand-soft{color:#fff !important}
.t2p-foot-brand .brand-ai{color:var(--t2p-yellow)}
.t2p-foot-desc{font-size:14px;color:rgba(255,255,255,.75);margin:14px 0;max-width:340px;line-height:1.6}
.t2p-foot-social{display:flex;gap:10px;margin-top:12px}
/* Nút tròn: khoá kích thước + căn giữa tuyệt đối để không xê dịch khi bấm.
   color !important để chặn rule cũ site.css `a:hover,a:focus{color:#000}` bôi đen icon. */
.t2p-foot-social a{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;color:#fff !important;text-decoration:none !important;line-height:1;border:0;transition:background .2s;transform:none !important}
.t2p-foot-social a i{line-height:1;pointer-events:none} /* click luôn trúng nút, icon không chặn */
.t2p-foot-social a:hover,.t2p-foot-social a:active,.t2p-foot-social a:focus,.t2p-foot-social a:visited{color:#fff !important}
.t2p-foot-social a:hover,.t2p-foot-social a:active{background:var(--t2p-brand)}
.t2p-foot-social a:focus{outline:none;background:rgba(255,255,255,.1)}
.t2p-foot-social a:focus:hover{background:var(--t2p-brand)}
.t2p-foot-social a:focus-visible{outline:2px solid var(--t2p-brand-2);outline-offset:2px}
.t2p-foot-col h4{font-size:15px;font-weight:700;margin-bottom:16px;color:#fff}
.t2p-foot-col ul{list-style:none;display:flex;flex-direction:column;gap:11px;padding:0;margin:0}
.t2p-foot-col li{font-size:14px}
.t2p-foot-col a{color:rgba(255,255,255,.75);display:flex;align-items:center;gap:9px;text-decoration:none;transition:.2s}
.t2p-foot-col a:hover{color:#fff}
.t2p-foot-col a i{color:var(--t2p-accent);width:16px;text-align:center}
.t2p-foot-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:34px;padding-top:20px;display:flex;justify-content:space-between;font-size:13px;color:rgba(255,255,255,.7);flex-wrap:wrap;gap:8px}
/* !important để thắng inline grid-template-columns (số cột động theo DB) trên mobile */
@media(max-width:960px){.t2p-foot-grid{grid-template-columns:1fr 1fr !important;gap:24px}}
@media(max-width:520px){.t2p-foot-grid{grid-template-columns:1fr !important}}

/* ---------- Floating contacts ---------- */
.t2p-floating{position:fixed;right:18px;bottom:18px;z-index:1040;display:flex;flex-direction:column;gap:12px}
.t2p-floating a{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:21px;box-shadow:0 8px 20px rgba(0,0,0,.25);transition:.2s;text-decoration:none}
.t2p-floating a:hover{transform:scale(1.08);color:#fff}
.t2p-floating .zalo{background:#0068ff}
.t2p-floating .phone{background:#16a34a}
.t2p-floating .mess{background:#7c3aed}

/* ---------- Toastr: hiển thị DƯỚI header sticky (64px), không đè menu ---------- */
#toast-container.toast-top-right,
#toast-container.toast-top-left,
#toast-container.toast-top-center{ top:78px !important; }
@media(max-width:520px){
  #toast-container.toast-top-right,
  #toast-container.toast-top-left,
  #toast-container.toast-top-center{ top:70px !important; }
}

/* Header sticky (không fixed) — đảm bảo không còn offset bù navbar cũ dù bundle bị cache */
.wrapper{ padding-top:0 }

/* ---------- Language dropdown menu (tinh tế hơn) ---------- */
.t2p-langmenu{min-width:184px;padding:6px;border:1px solid var(--t2p-line);border-radius:14px;box-shadow:0 14px 34px rgba(10,20,60,.14);margin-top:8px}
.t2p-langmenu li{list-style:none}
.t2p-langitem{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;font-size:14px;font-weight:600;color:var(--t2p-text);text-decoration:none;transition:.15s;cursor:pointer}
.t2p-langitem img{border-radius:3px;flex-shrink:0}
.t2p-langitem:hover{background:var(--t2p-line-soft);color:var(--t2p-brand)}
.t2p-langitem.active{background:rgba(30,64,175,.08);color:var(--t2p-brand);font-weight:700}
.t2p-langitem.active::after{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;margin-left:auto;font-size:11px;color:var(--t2p-brand)}

/* ---------- User dropdown menu (đồng bộ design) ---------- */
.t2p-ddmenu{min-width:212px;padding:6px;border:1px solid var(--t2p-line);border-radius:14px;box-shadow:0 14px 34px rgba(10,20,60,.14);margin-top:8px}
.t2p-ddmenu li{list-style:none}
.t2p-dditem{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;font-size:14px;font-weight:600;color:var(--t2p-text);text-decoration:none;transition:.15s}
.t2p-dditem i{width:18px;text-align:center;color:var(--t2p-muted-2);font-size:15px}
.t2p-dditem:hover{background:var(--t2p-line-soft);color:var(--t2p-brand)}
.t2p-dditem:hover i{color:var(--t2p-brand)}
.t2p-dditem.danger{color:var(--t2p-danger)}
.t2p-dditem.danger i{color:var(--t2p-danger)}
.t2p-dditem.danger:hover{background:rgba(239,68,68,.08);color:var(--t2p-danger)}
.t2p-dddivider{height:1px;background:var(--t2p-line-soft);margin:6px 8px;border:0}