/* ==========================================================================
   TRẦN LUÂN APPLE — Sửa điện thoại Vĩnh Long
   Type system: Big Shoulders Display (industrial condensed, workshop signage)
                + IBM Plex Sans (engineered body) + IBM Plex Mono (data/ticket)
   ========================================================================== */

:root{
  --bg: #f7fcf8;
  --bg-soft: #edf8f0;
  --card: #ffffff;
  --card-hi: #f6fbf7;
  --line: #d6e8db;
  --line-strong: #b9d8c0;
  --text: #183b2d;
  --text-dim: #637a6b;
  --amber: #198754;
  --teal: #35a96d;
  --radius: 8px;
  --maxw: 1160px;

  --f-display: 'Be Vietnam Pro', sans-serif;
  --f-body: 'Be Vietnam Pro', sans-serif;
  --f-mono: 'Be Vietnam Pro', sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
button,input,textarea,select{ font:inherit; font-family:var(--f-body); }
html{ scroll-behavior:smooth; }
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--f-body);
  font-weight:400;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* fade the grid so it stays a texture, not a foreground pattern */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background:radial-gradient(ellipse 68% 36% at 92% 0%, rgba(57, 169, 105, .1), transparent 70%), radial-gradient(ellipse 45% 30% at 0% 45%, rgba(44, 154, 91, .07), transparent 70%);
  opacity:1;
}

h1,h2,h3,h4{
  font-family:var(--f-display);
  font-weight:700;
  line-height:1.13;
  letter-spacing:-0.045em;
  text-transform:none;
}
.mono{ font-family:var(--f-mono); }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--f-body);
  font-size:12px; font-weight:700; letter-spacing:.01em; text-transform:none;
  color:var(--teal);
  margin-bottom:16px;
}
.eyebrow::before{ content:"●"; font-size:8px; }
.eyebrow::after{ content:""; height:1px; flex:1; max-width:40px; background:var(--line-strong); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 22px; border-radius:5px;
  font-family:var(--f-body); font-weight:700; font-size:13px; letter-spacing:0; text-transform:none;
  cursor:pointer; border:1px solid transparent;
  transition:transform .15s ease, background .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.btn:active{ transform:scale(0.97); }
.btn-primary{ background:var(--amber); color:#fff; box-shadow:0 9px 20px -12px rgba(25,135,84,.55); }
.btn-primary:hover{ background:#157347; transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--text); border-color:var(--line-strong); }
.btn-ghost:hover{ border-color:var(--text-dim); }

.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ---------- HEADER ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(7,39,25,.88); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
header .logo{ color:#f7fcf8; }
header nav.links{ color:#c8e0d0; }
header nav.links a:hover{ color:#fff; }
header .header-qr-button{ border-color:#6fa88a; color:#effaf3; }
header .header-logout{ color:#c8e0d0; }
.nav{ display:flex; align-items:center; justify-content:space-between; height:78px; }
.logo{ display:flex; align-items:center; gap:10px; font-family:var(--f-display); font-weight:800; font-size:21px; letter-spacing:-.04em; }
.logo-mark{
  display:block; flex:0 0 38px; width:38px; height:43px;
  background:url('../tl.png') center / contain no-repeat;
}
nav.links{ display:flex; gap:27px; font-family:var(--f-body); font-weight:600; font-size:13px; letter-spacing:0; color:var(--text-dim); }
nav.links a{ display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
nav.links a svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
nav.links a:hover{ color:var(--amber); }
.nav-cta{ display:flex; align-items:center; gap:16px; }
.header-logout{ color:var(--text-dim); font-size:13px; font-weight:600; }
.header-logout:hover{ color:var(--amber); }
.header-qr-button{ display:inline-flex; align-items:center; gap:7px; min-height:auto; padding:0; border:0; border-radius:0; background:transparent; color:var(--text); font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.header-qr-button:hover{ color:var(--amber); }
.header-qr-button svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.header-notification-button{ display:inline-flex; align-items:center; gap:6px; min-height:auto; padding:0; border:0; background:transparent; color:#c0ecd2; font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.header-notification-button:hover{ color:#fff; }
.header-notification-button:disabled{ color:#7eae91; cursor:default; }
.header-notification-button svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.header-notification-status{ display:none; }
.header-admin-link{ position:relative; }
.header-notification-badge,.app-notification-badge{ display:inline-grid; min-width:18px; height:18px; padding:0 5px; place-items:center; border-radius:99px; background:#f0445d; color:#fff; font-size:10px; font-weight:800; line-height:1; }
.header-notification-badge{ position:absolute; top:-8px; right:-9px; border:2px solid #092d20; }
body.admin-interface .header-notification-button,body.admin-interface .header-notification-status{ display:none; }
.admin-exit-button{ border-color:#86d3a8; color:#86d3a8; }
.admin-exit-button:hover{ border-color:#a9e1c0; color:#ddf4e4; background:rgba(55,162,100,.14); }
.hide-mobile{ display:flex; }
.menu-toggle{ display:none; width:42px; height:42px; border:1px solid var(--line); background:var(--card); border-radius:5px; cursor:pointer; padding:0; }
.menu-toggle span{ display:block; width:17px; height:1.5px; background:var(--text); margin:4px auto; transition:transform .2s ease; }
@media(max-width:860px){
  .nav{ height:68px; }
  nav.links{
    display:flex; position:fixed; top:68px; left:16px; right:16px; z-index:60;
    flex-direction:column; gap:0; padding:12px; background:rgba(10,51,34,.98);
    border:1px solid var(--line); border-radius:18px; box-shadow:0 20px 40px -28px rgba(28,43,42,.48);
    opacity:0; visibility:hidden; transform:translateY(-10px); pointer-events:none;
    transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
  }
  nav.links.is-open{ opacity:1; visibility:visible; transform:translateY(0); pointer-events:auto; }
  nav.links a{ padding:13px 10px; border-bottom:1px solid var(--line); color:var(--text); }
  nav.links a:last-child{ border-bottom:none; }
  .hide-mobile{ display:none; }
  .menu-toggle{ display:block; }
  .nav-cta .btn-primary{ padding:10px 14px; font-size:12px; }
  body.menu-open{ overflow:hidden; }
}

/* ---------- HERO ---------- */
.hero{ position:relative; padding:106px 0 90px; }
.hero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; }
@media(max-width:900px){ .hero-grid{ grid-template-columns:1fr; } }
.hero h1{ font-size:clamp(43px, 6.2vw, 74px); margin-bottom:24px; max-width:680px; }
.hero h1 em{ font-style:normal; color:var(--amber); }
.hero p.lead{ font-size:16px; color:var(--text-dim); max-width:500px; margin-bottom:34px; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:38px; }
.trust-row{ display:flex; gap:26px; flex-wrap:wrap; }
.trust-item{ display:flex; align-items:center; gap:8px; font-family:var(--f-body); font-size:12px; font-weight:600; letter-spacing:0; color:var(--text-dim); }
.trust-item svg{ flex:0 0 17px; width:17px; height:17px; color:var(--teal); fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* repair ticket — signature element, schematic/annotation styling */
.ticket-wrap{ position:relative; display:flex; justify-content:center; }
.ticket{
  width:100%; max-width:380px; background:var(--card);
  border:1px solid var(--line); border-radius:var(--radius); padding:0;
  position:relative; box-shadow:0 30px 70px -24px rgba(0,0,0,0.65);
  transform:rotate(2deg);
  font-family:var(--f-mono);
}
.ticket-top{ display:flex; justify-content:space-between; align-items:flex-start; padding:20px 22px; border-bottom:1px solid var(--line); }
.ticket-top .tt-label{ font-size:10.5px; color:var(--text-dim); letter-spacing:0.1em; }
.ticket-top .tt-id{ font-size:13px; color:var(--text); margin-top:5px; }
.stamp{
  font-weight:500; font-size:10px; color:var(--teal);
  border:1px solid var(--teal); border-radius:999px; padding:5px 9px; transform:rotate(-4deg);
  letter-spacing:0.05em;
}
.ticket-body{ padding:4px 22px; }
.ticket-row{ display:flex; justify-content:space-between; font-size:13px; padding:10px 0; border-bottom:1px dashed var(--line); }
.ticket-row span:first-child{ color:var(--text-dim); }
.ticket-total{ display:flex; justify-content:space-between; align-items:center; margin:0 22px; padding:18px 0; border-top:1px solid var(--line-strong); }
.ticket-total .tt-price{ font-family:var(--f-display); font-weight:700; font-size:28px; color:var(--amber); text-transform:none; }
.ticket-badge-float{
  position:absolute; bottom:-16px; left:-14px; background:var(--amber); color:#fff;
  font-family:var(--f-body); font-size:10px; font-weight:700; padding:9px 13px; border-radius:999px;
  box-shadow:0 12px 24px -8px rgba(25,135,84,.42);
  transform:rotate(-3deg);
}
.badge-float-anim{ animation: floaty 4.5s ease-in-out infinite; }
@keyframes floaty{ 0%,100%{ transform:translateY(0) rotate(-3deg);} 50%{ transform:translateY(-8px) rotate(-3deg);} }

/* Hero visual */
.hero-media{
  position:relative; width:100%; aspect-ratio:16 / 9; min-height:0; overflow:hidden;
  border-radius:8px; background:#092d20; border:1px solid rgba(72,190,125,.28);
  box-shadow:0 28px 60px -30px rgba(13,55,35,.55);
}
.hero-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(4,40,25,.15), transparent 65%), linear-gradient(0deg, rgba(4,40,25,.55), transparent 43%); pointer-events:none; }
.hero-media img{ width:100%; height:100%; min-height:0; object-fit:cover; object-position:left 34%; transform:none; opacity:1; }
.hero-media-caption{ position:absolute; z-index:1; left:24px; bottom:23px; display:flex; flex-direction:column; color:#fff; }
.hero-media-caption span{ font-family:var(--f-body); font-size:11px; font-weight:600; letter-spacing:.01em; text-transform:none; opacity:.76; }
.hero-media-caption strong{ font-size:19px; letter-spacing:-.04em; }

/* Truy cập nhanh: một dải hành động nối tiếp trực tiếp với dock/header phía trên. */
.quick-actions{ position:relative; overflow:hidden; padding:28px 0 34px; background:linear-gradient(128deg,#072719 0%,#0e3b29 58%,#115e3c 100%); border-bottom:1px solid rgba(111,211,151,.26); }
.quick-actions::before{ content:""; position:absolute; top:-160px; right:-70px; width:390px; height:390px; border:46px solid rgba(57,169,105,.16); border-radius:50%; pointer-events:none; }
.quick-actions .wrap{ position:relative; z-index:1; }
.quick-actions-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.quick-action-card{ position:relative; display:flex; align-items:center; gap:15px; min-height:112px; padding:20px 22px; overflow:hidden; border:1px solid rgba(214,244,225,.22); border-radius:12px; color:#fff; box-shadow:0 18px 35px -25px rgba(0,10,31,.82); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.quick-action-card:hover{ color:#fff; transform:translateY(-3px); border-color:rgba(239,248,255,.62); box-shadow:0 22px 40px -23px rgba(0,7,23,.95); }
.quick-action-lookup{ background:linear-gradient(135deg,#198754,#36a86c); }
.quick-action-request{ background:linear-gradient(135deg,#1e9b63,#1c8050); }
.quick-action-news{ background:linear-gradient(135deg,#155438,#24764b); }
.quick-action-icon{ display:grid; flex:0 0 52px; width:52px; height:52px; place-items:center; border-radius:14px; background:rgba(255,255,255,.16); }
.quick-action-icon svg{ width:28px; height:28px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.quick-action-copy{ display:flex; min-width:0; flex-direction:column; gap:5px; }
.quick-action-copy strong{ font-size:18px; line-height:1.2; }
.quick-action-copy small{ color:rgba(255,255,255,.76); font-size:12px; line-height:1.4; }
.quick-action-arrow{ flex:0 0 21px; width:21px; height:21px; margin-left:auto; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:.8; }
.quick-product-strip{ margin-top:24px; padding-top:20px; border-top:1px solid rgba(205,237,216,.2); }
.quick-product-strip-head{ display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:12px; color:#fff; }
.quick-product-strip-head span,.quick-product-strip-head strong{ display:block; }
.quick-product-strip-head span{ color:#b0e6c6; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.quick-product-strip-head strong{ margin-top:2px; color:#fff; font-size:19px; font-weight:800; }
.quick-product-more{ display:inline-flex; align-items:center; gap:5px; color:#b8ebd0; font-size:12px; font-weight:800; white-space:nowrap; }
.quick-product-more span{ font-size:20px; line-height:.8; }
.quick-product-more:hover{ color:#fff; }
.quick-product-rail-wrap{ position:relative; }
.quick-product-rail-nav{ position:absolute; top:50%; z-index:3; display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(238,248,255,.78); border-radius:50%; background:#19814d; color:#fff; box-shadow:0 9px 18px -8px rgba(0,9,31,.9); font:inherit; font-size:31px; line-height:1; cursor:pointer; transform:translateY(-58%); }
.quick-product-rail-nav:hover{ background:#2bae69; transform:translateY(-58%) scale(1.07); }
.quick-product-rail-nav:disabled{ pointer-events:none; opacity:.32; transform:translateY(-58%) scale(.94); }
.quick-product-rail-nav.is-prev{ left:-20px; }
.quick-product-rail-nav.is-next{ right:-20px; }
.quick-product-rail{ display:flex; gap:12px; overflow-x:auto; padding:2px 24px 9px; overscroll-behavior-x:contain; scroll-behavior:smooth; scroll-snap-type:x proximity; scrollbar-width:none; touch-action:pan-x pan-y; -webkit-overflow-scrolling:touch; cursor:grab; }
.quick-product-rail.is-drag-ready{ scroll-behavior:auto; user-select:none; }
.quick-product-rail.is-dragging{ cursor:grabbing; scroll-behavior:auto; scroll-snap-type:none; user-select:none; }
.quick-product-rail.is-drag-ready .product-card{ user-select:none; -webkit-user-drag:none; }
.quick-product-rail::-webkit-scrollbar{ display:none; }
.quick-product-rail > .product-card{ flex:0 0 min(340px,78vw); scroll-snap-align:start; }
.quick-product-rail > p{ padding:16px 0; color:#cce9d6; font-size:13px; }
.quick-product-rail .product-card{ border-color:#9bd3ae; background:#fff; color:#0e3a25; box-shadow:0 14px 26px -23px rgba(0,8,28,.95); }
.quick-product-rail .product-info h2{ color:#0a3322; font-weight:800; }
.quick-product-rail .product-brand{ color:#167044; font-weight:900; }
.quick-product-rail .product-condition{ color:#075c31; font-weight:800; }
.quick-product-rail .product-meta{ color:#365d46; font-weight:600; }
.quick-product-rail .product-bottom strong{ color:#167044; font-weight:900; }
.quick-product-rail .product-contact{ border-color:#197a49; background:#197a49; color:#fff; }
.quick-product-rail .product-contact:hover{ background:#11613b; color:#fff; }
.quick-product-pagination{ display:flex; min-height:12px; align-items:center; justify-content:center; gap:6px; margin-top:4px; }
.quick-product-page{ width:7px; height:7px; padding:0; border:0; border-radius:99px; background:rgba(191,231,207,.46); cursor:pointer; transition:width .18s ease, background .18s ease, transform .18s ease; }
.quick-product-page:hover{ background:#daf3e3; transform:scale(1.12); }
.quick-product-page.is-active{ width:23px; background:#fff; }

/* ---------- STATS ---------- */
.stats{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--card); padding:36px 0; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media(max-width:700px){ .stats-grid{ grid-template-columns:repeat(2,1fr); } }
.stat-cell{ text-align:center; border-left:1px solid var(--line); }
.stat-cell:first-child{ border-left:none; }
@media(max-width:700px){ .stat-cell:nth-child(odd){ border-left:none; } }
.stat-num{ font-family:var(--f-display); font-size:clamp(30px,4vw,42px); font-weight:800; color:var(--amber); }
.stat-label{ font-family:var(--f-body); font-size:11px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--text-dim); margin-top:2px; }

/* ---------- WORKSHOP GALLERY ---------- */
.workshop-gallery{ background:var(--bg); }
.gallery-heading{ display:flex; align-items:end; justify-content:space-between; gap:28px; margin-bottom:28px; }
.gallery-heading .eyebrow{ margin-bottom:10px; }
.gallery-heading h2{ font-size:clamp(25px,3vw,39px); }
.gallery-heading p{ max-width:240px; color:var(--text-dim); font-size:13px; }
.gallery-grid{ position:relative; aspect-ratio:16 / 9; overflow:hidden; border:1px solid var(--line); border-radius:7px; background:var(--card); }
.gallery-item{ position:absolute; inset:0; overflow:hidden; margin:0; opacity:0; pointer-events:none; transition:opacity .55s ease; }
.gallery-item.is-active{ opacity:1; pointer-events:auto; }
.gallery-item-wide{ grid-column:span 2; }
.gallery-item img{ width:100%; height:100%; min-height:0; object-fit:cover; transition:transform .35s ease; }
.gallery-item:hover img{ transform:scale(1.035); }
.gallery-item figcaption{ position:absolute; right:0; bottom:0; left:0; padding:26px 14px 12px; background:linear-gradient(transparent,rgba(3,13,31,.82)); color:#fff; font-size:12px; font-weight:600; }

/* ---------- SECTION GENERIC ---------- */
section{ padding:100px 0; }
.sec-head{ max-width:640px; margin-bottom:56px; }
.sec-head h2{ font-size:clamp(32px,4.4vw,52px); margin-bottom:14px; }
.sec-head p{ color:var(--text-dim); font-size:15.5px; font-family:var(--f-body); text-transform:none; }

/* ---------- SERVICES ---------- */
.svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; background:transparent; border:none; }
@media(max-width:900px){ .svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .svc-grid{ grid-template-columns:1fr; } }
.svc-card{
  background:var(--card); padding:28px 24px; border:1px solid var(--line); border-radius:var(--radius);
  transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.svc-card:hover{ background:var(--card-hi); transform:translateY(-3px); box-shadow:0 14px 30px -24px rgba(23,99,50,.2); border-color:var(--teal); }
.svc-index{ font-family:var(--f-body); font-weight:700; font-size:11px; color:var(--amber); letter-spacing:.01em; margin-bottom:18px; display:block; }
.svc-card h3{ color:var(--text); font-size:17px; margin-bottom:9px; text-transform:none; letter-spacing:-.025em; font-weight:700; font-family:var(--f-body); }
.svc-card p{ font-size:13.5px; color:var(--text-dim); }

/* ---------- PRICING ---------- */
.price-tabs{ display:flex; justify-content:center; gap:4px; margin:0 auto 14px; flex-wrap:wrap; background:transparent; border:none; width:100%; }
.tab-btn{
  font-family:var(--f-body); font-weight:600; font-size:12px; letter-spacing:0; text-transform:none; padding:11px 18px;
  color:var(--text-dim); cursor:pointer; background:var(--card); border:1px solid var(--line); border-radius:999px;
}
.tab-btn.active{ background:var(--amber); color:#fff; border-color:var(--amber); }
.price-table{ width:100%; border-collapse:separate; border-spacing:0; background:var(--card); color:var(--text); border:1px solid var(--line-strong); border-radius:6px; overflow:hidden; }
.price-table thead th{
  text-align:left; font-family:var(--f-body); font-weight:700; font-size:11px; text-transform:none; letter-spacing:0;
  color:#3b6549; background:#e8f6ec; padding:15px 22px; border-bottom:1px solid var(--line-strong);
}
.price-table td{ padding:16px 22px; font-size:14.5px; border-bottom:1px solid var(--line); font-family:var(--f-body); }
.price-table tr:last-child td{ border-bottom:none; }
.price-table td:last-child{ font-family:var(--f-body); color:var(--amber); text-align:right; font-weight:700; }
.price-note{ margin-top:18px; font-size:13px; color:var(--text-dim); font-family:var(--f-body); }
.price-panel{ display:none; }
.price-panel.active{ display:block; }

/* ---------- PROCESS ---------- */
.process{ display:grid; grid-template-columns:repeat(4,1fr); }
@media(max-width:900px){ .process{ grid-template-columns:1fr; gap:32px; } }
.proc-step{ position:relative; padding:0 24px 0 0; border-right:1px dashed var(--line); }
.proc-step:last-child{ border-right:none; padding-right:0; }
@media(max-width:900px){ .proc-step{ border-right:none; padding-right:0; } }
.proc-num{ font-family:var(--f-display); font-size:40px; font-weight:700; color:var(--line-strong); margin-bottom:12px; display:block; }
.proc-step h3{ font-size:18px; margin-bottom:10px; text-transform:none; font-weight:600; font-family:var(--f-body); letter-spacing:0; }
.proc-step p{ font-size:13.5px; color:var(--text-dim); }

/* ---------- WHY US ---------- */
.why-grid{ display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; }
@media(max-width:900px){ .why-grid{ grid-template-columns:1fr; gap:36px; } }
.why-list{ display:flex; flex-direction:column; }
.why-item{ display:flex; gap:18px; padding:20px 0; border-bottom:1px solid var(--line); }
.why-item:first-child{ padding-top:0; }
.why-num{ font-family:var(--f-display); font-weight:700; font-size:28px; color:var(--amber); flex-shrink:0; width:40px; }
.why-item h4{ font-size:16.5px; margin-bottom:6px; text-transform:none; font-weight:600; font-family:var(--f-body); letter-spacing:0; }
.why-item p{ font-size:13.5px; color:var(--text-dim); }
.why-visual{
  background:var(--card); border:1px solid var(--line); border-radius:6px; padding:32px;
  display:flex; flex-direction:column; gap:2px;
}
.why-visual-row{ display:flex; justify-content:space-between; align-items:center; padding:16px 0; border-bottom:1px solid var(--bg-soft); font-family:var(--f-body); }
.why-visual-row:last-child{ border-bottom:none; }
.why-visual-row span:first-child{ font-size:12.5px; color:var(--text-dim); text-transform:none; letter-spacing:0; }
.why-visual-row span:last-child{ color:var(--teal); font-size:15px; font-weight:600; }

/* ---------- TESTIMONIALS ---------- */
.test-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; background:transparent; border:none; }
@media(max-width:900px){ .test-grid{ grid-template-columns:1fr; } }
.test-card{ background:var(--card); padding:28px; border:1px solid var(--line); border-radius:6px; }
.stars{ display:flex; gap:2px; color:var(--amber); margin-bottom:16px; }
.stars svg{ width:15px; height:15px; fill:currentColor; stroke:currentColor; stroke-width:1.2; stroke-linejoin:round; }
.test-card p{ font-size:14.5px; color:var(--text); margin-bottom:20px; font-family:var(--f-body); }
.test-who{ display:flex; align-items:center; gap:11px; }
.test-avatar{ width:34px; height:34px; border-radius:3px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; font-family:var(--f-display); font-weight:700; color:var(--amber); font-size:14px; }
.test-who-name{ font-size:13.5px; font-weight:600; font-family:var(--f-body); }
.test-who-meta{ font-size:11px; color:var(--text-dim); font-family:var(--f-body); }

/* ---------- LOCATION ---------- */
.location-panel{ display:grid; grid-template-columns:1.35fr 1fr 1fr auto; align-items:stretch; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--card); }
.location-panel > div{ display:flex; flex-direction:column; gap:7px; padding:22px; border-right:1px solid var(--line); }
.location-label{ color:var(--text-dim); font-size:11px; font-weight:600; }
.location-panel strong,.location-panel a{ color:var(--text); font-size:14px; font-weight:700; line-height:1.5; }
.location-panel a:hover{ color:var(--amber); }
.location-map-link{ display:flex; align-items:center; gap:8px; padding:0 20px; background:var(--amber); color:#fff !important; white-space:nowrap; }
.location-map-link:hover{ background:#157347; color:#fff !important; }
.location-map-link span{ display:grid; place-items:center; }
.location-map-link svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- FAQ ---------- */
.faq-list{ max-width:780px; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{ display:flex; justify-content:space-between; align-items:center; padding:24px 0; cursor:pointer; font-size:17px; font-weight:600; font-family:var(--f-body); text-transform:none; }
.faq-q .plus{ font-family:var(--f-body); color:var(--amber); font-size:19px; transition:transform .2s ease; }
.faq-item.open .plus{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a p{ padding-bottom:24px; color:var(--text-dim); font-size:14px; max-width:640px; font-family:var(--f-body); }

/* ---------- CONTACT ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; }
@media(max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-card{ background:var(--card); border:1px solid var(--line); border-radius:6px; padding:36px; }
.contact-row{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--bg-soft); }
.contact-row:last-child{ border-bottom:none; }
.contact-row .ci{ width:38px; height:38px; border-radius:4px; background:var(--bg-soft); display:flex; align-items:center; justify-content:center; color:var(--teal); flex-shrink:0; }
.contact-row .ci svg{ width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.contact-row h4{ font-size:14.5px; margin-bottom:4px; text-transform:none; font-weight:600; font-family:var(--f-body); letter-spacing:0; }
.contact-row p{ font-size:13.5px; color:var(--text-dim); font-family:var(--f-body); }
.map-frame{ overflow:hidden; border:1px solid var(--line); min-height:320px; }
.map-frame iframe{ width:100%; height:100%; min-height:320px; border:0; filter:grayscale(.2) saturate(.78) brightness(.78) contrast(1.04); }

/* ---------- CONTACT FORM ---------- */
.contact-form{ display:flex; flex-direction:column; gap:16px; }
.form-row{ display:flex; flex-direction:column; gap:7px; }
.form-row label{ font-family:var(--f-body); font-weight:600; font-size:11px; letter-spacing:0; text-transform:none; color:var(--text-dim); }
.form-row input, .form-row textarea{
  background:var(--bg-soft); border:1px solid var(--line); border-radius:4px;
  padding:12px 14px; color:var(--text); font-family:var(--f-body); font-size:14px;
  outline:none; resize:vertical;
}
.form-row input:focus, .form-row textarea:focus{ border-color:var(--amber); }
.form-alert{
  display:flex; align-items:center; gap:9px; font-family:var(--f-body); font-size:13px; padding:12px 14px; border-radius:10px; margin-bottom:18px;
}
.form-alert svg{ flex:0 0 18px; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.form-alert-ok{ background:rgba(52,216,198,0.12); color:var(--teal); border:1px solid rgba(52,216,198,0.35); }
.form-alert-err{ background:rgba(255,107,107,0.12); color:#FF6B6B; border:1px solid rgba(255,107,107,0.35); }

/* ---------- CTA ---------- */
.cta-band{ background:linear-gradient(135deg, #0e402b, #176b40); color:#fff; padding:64px 44px; text-align:center; margin:0 24px; border:1px solid #528d6a; border-radius:8px; }
.cta-band h2{ font-size:clamp(28px,3.6vw,44px); margin-bottom:14px; }
.cta-band p{ font-size:15px; margin-bottom:28px; opacity:0.85; font-family:var(--f-body); text-transform:none; }
.cta-band .btn-primary{ background:#fff; color:#176b40; }
.cta-band .btn-primary:hover{ background:#eaf7ee; }

/* ---------- FOOTER ---------- */
footer{ --text:#f7fcf8; --text-dim:#bfdfca; --line:#36714f; border-top:1px solid var(--line); padding:60px 0 28px; background:#0d3a27; color:var(--text); }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:44px; }
@media(max-width:700px){ .footer-grid{ grid-template-columns:1fr; } }
.footer-grid h4{ font-family:var(--f-body); font-size:12px; font-weight:700; text-transform:none; letter-spacing:0; color:var(--text-dim); margin-bottom:18px; }
.footer-grid ul{ list-style:none; display:flex; flex-direction:column; gap:11px; font-size:13.8px; font-family:var(--f-body); }
.footer-grid ul a:hover{ color:var(--amber); }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:26px; border-top:1px solid var(--line); font-family:var(--f-body); font-size:11.5px; color:var(--text-dim); flex-wrap:wrap; gap:12px; }

/* ---------- ADMIN ---------- */
.admin-page{ min-height:calc(100vh - 78px); padding:70px 0 100px; }
.admin-heading{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.admin-heading h1{ margin:4px 0 8px; font-size:clamp(36px,5vw,58px); }
.admin-heading p{ color:var(--text-dim); font-size:16px; }
.admin-heading-actions{ display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px; }
.admin-heading-actions form{ margin:0; }
.admin-notification-button{ min-height:40px; padding:0 13px; border:1px solid #299b5f; border-radius:5px; background:#198754; color:#fff; font:inherit; font-size:12px; font-weight:800; cursor:pointer; }
.admin-notification-button:hover{ background:#176e43; }
.admin-notification-button:disabled{ border-color:#afd4be; background:#edf8f0; color:#547d60; cursor:default; }
.admin-notification-status{ max-width:190px; color:var(--text-dim); font-size:11px; line-height:1.4; }
.admin-tabs{ display:flex; gap:8px; margin:0 0 24px; padding:8px; overflow-x:auto; border:1px solid var(--line); border-radius:8px; background:var(--card); }
.admin-tab{ flex:1 0 max-content; min-height:42px; padding:0 16px; border:0; border-radius:5px; background:transparent; color:var(--text-dim); font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.admin-tab:hover{ background:var(--bg-soft); color:var(--text); }
.admin-tab.is-active{ background:var(--amber); color:#fff; box-shadow:0 8px 18px -14px rgba(25,135,84,.7); }
.admin-panel{ display:none; }
.admin-panel.is-active{ display:block; }
.admin-panel > .admin-card:first-child{ margin-top:0; }
.admin-card{ margin-top:20px; padding:28px; border:1px solid var(--line); border-radius:8px; background:var(--card); }
.admin-card h2{ margin-bottom:22px; font-size:25px; }
.admin-settings{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.admin-settings label{ display:flex; flex-direction:column; gap:7px; color:var(--text-dim); font-size:13px; font-weight:600; }
.admin-settings input{ width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--text); font:inherit; font-size:14px; outline:none; }
.admin-settings .btn{ width:max-content; }
.admin-message{ margin:0 0 18px; padding:12px 14px; border:1px solid rgba(72,190,125,.4); border-radius:5px; background:rgba(72,190,125,.1); color:var(--teal); }
.admin-notification-list{ display:grid; gap:10px; }
.admin-notification-row{ display:flex; flex-direction:column; gap:3px; padding:14px 16px; border:1px solid #cee6d5; border-left:4px solid #198754; border-radius:6px; background:#f7fcf8; color:#204a35; }
.admin-notification-row:hover{ border-color:#76bd94; background:#e9f7ee; color:#174d32; }
.admin-notification-row span{ color:#198754; font-size:11px; font-weight:800; text-transform:uppercase; }
.admin-notification-row strong{ font-size:14px; }
.admin-notification-row small{ color:#637f6c; font-size:12px; line-height:1.5; }
.admin-kpi-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:20px; }
.admin-kpi{ display:flex; flex-direction:column; gap:4px; padding:17px 18px; border:1px solid var(--line); border-radius:6px; background:var(--card); }
.admin-kpi span{ color:var(--text-dim); font-size:12px; }
.admin-kpi strong{ color:var(--text); font-size:28px; line-height:1.1; }
.admin-kpi-attention strong{ color:var(--amber); }
.admin-visitor-card{ margin-top:20px; }
.admin-visitor-today-count{ display:flex; flex-direction:column; align-items:flex-end; color:var(--amber); font-size:32px; line-height:1; }
.admin-visitor-today-count small{ margin-top:5px; color:var(--text-dim); font-size:11px; font-weight:600; }
.admin-visitor-history{ display:grid; gap:12px; margin-top:4px; }
.admin-visitor-row{ display:grid; grid-template-columns:72px minmax(0,1fr) 42px; align-items:center; gap:12px; color:var(--text-dim); font-size:13px; }
.admin-visitor-row strong{ color:var(--text); text-align:right; }
.admin-visitor-row.is-today{ color:var(--text); font-weight:700; }
.admin-visitor-track{ height:9px; overflow:hidden; border-radius:99px; background:var(--bg-soft); }
.admin-visitor-track i{ display:block; height:100%; min-width:2px; border-radius:inherit; background:var(--amber); }
.admin-table-wrap{ overflow-x:auto; }
.admin-table{ width:100%; border-collapse:collapse; font-size:14px; }
.admin-table th,.admin-table td{ padding:14px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.admin-table th{ color:var(--text-dim); font-size:12px; }
.admin-table td small{ display:block; max-width:280px; margin-top:3px; color:var(--text-dim); font-size:12px; line-height:1.45; }
.admin-inline-form{ display:flex; gap:7px; align-items:center; }
.admin-inline-form select,.admin-inline-form button{ min-height:34px; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--text); font:inherit; font-size:12px; padding:0 9px; }
.admin-inline-form button{ border-color:var(--amber); color:var(--amber); cursor:pointer; }
.admin-role{ color:var(--amber); font-weight:700; }
.admin-warranty-create{ margin:0 0 22px; padding:18px; border:1px solid #b1dcc0; border-radius:7px; background:#f1faf4; }
.admin-warranty-create h3{ margin:0 0 5px; color:#174d32; font-size:19px; }
.admin-warranty-create p{ margin:0 0 14px; color:#5b8069; font-size:12px; }
.admin-warranty-form{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.admin-warranty-form label{ display:flex; flex-direction:column; gap:6px; color:#536f5a; font-size:12px; font-weight:700; }
.admin-warranty-form input{ width:100%; min-height:40px; padding:9px 11px; border:1px solid #cfe1d4; border-radius:4px; background:#fff; color:#183b2d; font:inherit; font-size:13px; }
.admin-warranty-note-field{ grid-column:span 2; }
.admin-warranty-form .btn{ align-self:end; min-height:40px; }
.admin-document-upload{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; gap:12px; align-items:end; margin:0 0 20px; padding:16px; border:1px solid var(--line); border-radius:7px; background:var(--bg-soft); }
.admin-document-upload label{ display:flex; flex-direction:column; gap:6px; color:var(--text-dim); font-size:11px; font-weight:700; }
.admin-document-upload input:not([type=file]){ width:100%; min-height:42px; padding:9px 12px; border:1px solid var(--line); border-radius:4px; background:var(--card); color:var(--text); font:inherit; }
.admin-document-upload input[type=file]{ width:100%; min-height:42px; padding:7px 0; color:var(--text-dim); font:inherit; font-size:12px; }
.admin-document-file-label small{ color:var(--text-dim); font-size:10px; font-weight:500; }
.admin-upload-progress{ grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 12px; align-items:center; color:#527096; font-size:12px; font-weight:700; }
.admin-upload-progress[hidden]{ display:none; }
.admin-upload-cancel{ min-height:30px; padding:5px 10px; border:1px solid currentColor; border-radius:4px; background:transparent; color:inherit; font:inherit; font-size:11px; font-weight:700; cursor:pointer; }
.admin-upload-progress-bar{ grid-column:1 / -1; height:7px; overflow:hidden; border-radius:99px; background:#dfede3; }
.admin-upload-progress-bar span{ display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#198754,#55c98a); transition:width .15s ease; }
.admin-product-form .admin-upload-progress{ grid-column:1 / -1; }
.admin-upload-progress.is-indeterminate .admin-upload-progress-bar span{ width:38%; animation:admin-upload-indeterminate 1.1s ease-in-out infinite alternate; }
@keyframes admin-upload-indeterminate{ from{ transform:translateX(-35%); } to{ transform:translateX(220%); } }
.admin-document-list{ display:flex; flex-direction:column; gap:8px; }
.admin-document-edit-form{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) auto; gap:10px; align-items:end; padding:0 12px 12px; }
.admin-document-edit-form label{ display:flex; flex-direction:column; gap:5px; color:var(--text-dim); font-size:11px; font-weight:700; }
.admin-document-edit-form input{ width:100%; box-sizing:border-box; min-height:38px; padding:8px 10px; border:1px solid var(--line); border-radius:4px; background:var(--card); color:var(--text); font:inherit; }
.admin-document-actions{ display:flex; align-items:center; gap:8px; }
.admin-document-edit-inline{ position:relative; display:inline-block; }
.admin-document-edit-button{ display:grid; width:30px; height:30px; place-items:center; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--amber); cursor:pointer; list-style:none; }
.admin-document-edit-button::-webkit-details-marker{ display:none; }
.admin-document-edit-button svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }
.admin-document-edit-inline[open] .admin-document-edit-form{ position:absolute; z-index:5; top:calc(100% + 8px); right:0; width:min(420px, 70vw); padding:12px; border:1px solid var(--line); border-radius:5px; background:var(--card); box-shadow:0 10px 28px rgba(0,0,0,.14); }
.admin-document-row{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:13px 14px; border:1px solid var(--line); border-radius:5px; background:var(--card); }
.admin-document-row strong,.admin-document-row small{ display:block; }
.admin-document-row small{ margin-top:3px; color:var(--text-dim); font-size:12px; }
.admin-document-link{ margin-right:10px; color:var(--amber); font-weight:700; font-size:13px; }
.document-library-card{ margin-top:20px; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:var(--card); box-shadow:0 22px 44px -40px rgba(16,60,34,.5); }
.document-library-head{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 26px; border-bottom:1px solid var(--line); background:linear-gradient(135deg,#0e3b29,#1a7147); color:#fff; }
.document-library-head span{ display:block; margin-bottom:4px; color:#b9ead0; font-size:10px; font-weight:800; letter-spacing:.08em; }
.document-library-head h2{ font-size:23px; }
.document-library-head small{ padding:6px 10px; border:1px solid rgba(189,232,205,.35); border-radius:99px; color:#daf3e3; font-size:11px; font-weight:700; white-space:nowrap; }
.document-library-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:18px; }
.document-library-item{ display:flex; align-items:center; gap:13px; min-width:0; padding:15px; border:1px solid var(--line); border-radius:7px; background:var(--card-hi); transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease; }
.document-library-item:hover{ border-color:#95d0ad; box-shadow:0 14px 26px -24px rgba(17,95,50,.7); transform:translateY(-1px); }
.document-file-mark{ display:grid; flex:0 0 46px; width:46px; height:46px; place-items:center; border-radius:6px; background:#e8f5eb; color:#198754; font-size:10px; font-weight:800; }
.document-file-mark{ grid-template-rows:30px auto; gap:1px; align-content:center; text-align:center; }
.document-file-mark b{ display:block; max-width:100%; overflow:hidden; font-size:8px; line-height:1; text-overflow:ellipsis; white-space:nowrap; }
.document-file-icon{ display:block; width:29px; height:29px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.55; }
.document-file-icon b{ font-size:8px; }
.admin-document-summary{ display:flex; min-width:0; align-items:center; gap:11px; }
.admin-document-summary > div{ min-width:0; }
.admin-document-summary .document-file-mark{ flex-basis:42px; width:42px; height:42px; }
.document-library-copy{ min-width:0; flex:1; }
.document-library-copy strong,.document-library-copy small{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.document-library-copy strong{ color:var(--text); font-size:14px; }
.document-library-copy small{ margin-top:4px; color:var(--text-dim); font-size:11px; }
.document-open-action{ color:var(--amber); font-size:12px; font-weight:800; white-space:nowrap; }
.document-open-action b{ margin-left:3px; font-size:18px; line-height:0; }
.document-empty{ grid-column:1 / -1; padding:28px; color:var(--text-dim); text-align:center; }
.document-library-item{ width:100%; border:1px solid var(--line); color:inherit; font:inherit; text-align:left; cursor:pointer; }
.document-viewer[hidden]{ display:none; }
.document-viewer{ position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:0; }
.document-viewer-backdrop{ position:absolute; inset:0; background:rgba(3,35,22,.72); backdrop-filter:blur(5px); }
.document-viewer-panel{ position:relative; z-index:1; display:flex; width:100vw; height:100dvh; flex-direction:column; overflow:hidden; border:0; border-radius:0; background:#fff; box-shadow:none; }
.document-viewer-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:58px; padding:0 18px; background:#0e3b29; color:#fff; }
.document-viewer-head h2{ overflow:hidden; font-size:16px; text-overflow:ellipsis; white-space:nowrap; }
.document-viewer-close{ width:34px; height:34px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:transparent; color:#fff; font-size:25px; line-height:1; cursor:pointer; }
.document-viewer-panel iframe{ flex:1; width:100%; min-height:0; border:0; background:#eef8f2; }
body.document-viewer-open{ overflow:hidden; }
.repair-workbench,.lookup-page{ min-height:calc(100vh - 78px); padding:68px 0 110px; background:var(--bg); color:var(--text); }
.repair-workbench-head,.lookup-heading{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:28px; }
.repair-workbench h1,.lookup-heading h1{ margin:6px 0 8px; font-size:clamp(38px,5vw,62px); }
.repair-workbench-head p,.lookup-heading p{ color:var(--text-dim); font-size:16px; }
.repair-card{ margin-top:20px; padding:28px; border:1px solid var(--line); border-radius:8px; background:var(--card); }
.repair-card h2{ margin-bottom:20px; font-size:25px; }
.repair-form{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.repair-form label{ display:flex; flex-direction:column; gap:7px; color:var(--text-dim); font-size:13px; font-weight:700; }
.repair-form input,.repair-form textarea{ width:100%; padding:12px 13px; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--text); font:inherit; }
.repair-form label:nth-child(3),.repair-form label:nth-child(4),.repair-form button{ grid-column:1 / -1; }
.repair-alert,.repair-created{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; padding:14px 16px; border-radius:6px; }
.repair-alert-error{ border:1px solid #9dcea9; background:#e8f6ec; color:#24764b; }
.repair-alert-ok,.repair-created{ border:1px solid #9dcea9; background:#edf9f1; color:#24764b; }
.repair-ticket-list{ display:flex; flex-direction:column; gap:10px; }
.repair-ticket-row{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px; border:1px solid var(--line); border-radius:6px; background:var(--card); }
.repair-ticket-row strong,.repair-ticket-row span,.repair-ticket-row small{ display:block; }
.repair-ticket-row strong{ color:var(--amber); }
.repair-ticket-row span{ margin-top:3px; color:var(--text); font-weight:600; }
.repair-ticket-row small{ margin-top:3px; color:var(--text-dim); }
.repair-ticket-row form{ display:flex; align-items:center; gap:8px; }
.repair-ticket-row select{ min-height:38px; padding:0 9px; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--text); font:inherit; }
.repair-print-link{ color:var(--amber); font-weight:700; }
.lookup-form{ display:flex; max-width:720px; gap:10px; margin-bottom:24px; }
.lookup-form input{ flex:1; min-height:52px; padding:0 15px; border:1px solid var(--line); border-radius:5px; background:var(--card); color:var(--text); font:inherit; }
.lookup-result{ max-width:820px; padding:20px; border:1px solid var(--line); border-radius:7px; background:var(--card); }
.lookup-result-error{ border-color:#9dcea9; background:#e8f6ec; color:#24764b; }
.lookup-ticket-top{ display:flex; justify-content:space-between; align-items:center; gap:18px; padding-bottom:17px; border-bottom:1px solid var(--line); }
.lookup-ticket-top span{ display:block; color:var(--text-dim); font-size:11px; letter-spacing:.08em; }
.lookup-ticket-top strong{ display:block; margin-top:4px; color:var(--amber); font-size:24px; }
.lookup-ticket-top b{ padding:8px 12px; border-radius:999px; background:#e8f6ec; color:#198754; font-size:13px; }
.lookup-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; padding-top:18px; }
.lookup-grid small{ display:block; margin-bottom:4px; color:var(--text-dim); }
.lookup-grid strong{ color:var(--text); }
.lookup-warranty{ margin:0 28px; padding:18px 20px; border:1px solid #b3dfc3; border-radius:8px; background:linear-gradient(135deg,#eaf7ee,#f7fcf8); color:#174d32; }
.lookup-warranty span{ display:block; margin-bottom:4px; color:#399365; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.lookup-warranty strong{ display:block; color:#177547; font-size:20px; line-height:1.3; }
.lookup-warranty p{ margin:5px 0 0; color:#557b62; font-size:13px; }
.lookup-my-tickets{ max-width:820px; margin-top:28px; }
.lookup-my-tickets h2{ margin-bottom:12px; }
.lookup-my-tickets a{ display:flex; justify-content:space-between; gap:14px; padding:13px 15px; border:1px solid var(--line); border-radius:5px; background:var(--card); }
.lookup-my-tickets a + a{ margin-top:8px; }
.lookup-my-tickets span{ color:var(--text-dim); }
.lookup-hero{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:26px; align-items:stretch; max-width:1000px; margin-bottom:24px; }
.lookup-page .lookup-heading{ display:block; margin:0; padding:36px 38px; border-radius:10px; background:linear-gradient(135deg,#0c3e26,#218750); color:#fff; }
.lookup-page .lookup-heading .eyebrow{ color:#b0e6c6; }
.lookup-page .lookup-heading h1{ margin:12px 0; color:#fff; font-size:clamp(42px,5vw,64px); line-height:1.04; }
.lookup-page .lookup-heading p{ max-width:520px; color:rgba(255,255,255,.78); font-size:16px; line-height:1.7; }
.lookup-help-card{ display:flex; flex-direction:column; justify-content:center; gap:11px; padding:28px; border:1px solid #d1e7d8; border-radius:10px; background:#fff; box-shadow:0 20px 45px -38px rgba(20,100,52,.42); }
.lookup-help-card strong{ margin-bottom:4px; color:#174c34; font-size:18px; }
.lookup-help-card span{ display:flex; align-items:center; gap:9px; color:#5d8067; font-size:13px; line-height:1.45; }
.lookup-help-card span::before{ content:""; flex:0 0 7px; width:7px; height:7px; border-radius:50%; background:#299b5a; }
.lookup-search-card{ max-width:1000px; margin-bottom:24px; padding:18px; border:1px solid #d0e6d6; border-radius:8px; background:#fff; box-shadow:0 18px 38px -34px rgba(20,100,52,.45); }
.lookup-search-card label{ display:block; margin-bottom:9px; color:#526d92; font-size:13px; font-weight:700; }
.lookup-search-card > div{ display:flex; gap:10px; }
.lookup-search-card input{ background:#f7fcf8; }
.panic-search-card{ margin-bottom:28px; }
.panic-search-field{ position:relative; }
.panic-suggestions{ position:absolute; z-index:10; top:100%; right:0; left:0; display:block !important; margin-top:7px; overflow:hidden; border:1px solid #cce8d5; border-radius:7px; background:#fff; box-shadow:0 18px 34px -20px rgba(20,100,52,.55); }
.panic-suggestions[hidden]{ display:none !important; }
.panic-suggestions-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 13px; border-bottom:1px solid #e5f1e8; background:#f7fcf8; }
.panic-suggestions-head span{ color:#174d32; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.panic-suggestions-head small{ color:#66856f; font-size:11px; }
.panic-suggestion-list{ display:grid; max-height:340px; overflow:auto; }
.panic-suggestion{ display:grid; grid-template-columns:minmax(145px,220px) minmax(0,1fr) auto; align-items:center; gap:13px; width:100%; padding:12px 13px; border:0; border-bottom:1px solid #eff6f1; background:#fff; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.panic-suggestion:last-child{ border-bottom:0; }
.panic-suggestion:hover,.panic-suggestion:focus-visible{ background:#f0faf3; outline:none; }
.panic-suggestion code{ overflow:hidden; color:#167a48; font-family:var(--f-mono); font-size:12px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.panic-suggestion > span{ overflow:hidden; color:#386348; font-size:12px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.panic-suggestion small{ padding:4px 7px; border-radius:99px; background:#edf8f1; color:#398a5c; font-size:10px; font-weight:800; white-space:nowrap; }
.panic-live-status{ min-height:20px; margin:-17px 0 12px; color:#5d8067; font-size:12px; font-weight:700; }
.panic-empty-state{ margin-bottom:20px; }
.panic-results{ max-width:1000px; }
.panic-results-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:13px; }
.panic-results-head h2{ color:#174d32; font-size:22px; }
.panic-results-head span{ color:#5d8067; font-size:13px; font-weight:700; }
.panic-result-list{ display:grid; gap:12px; }
.panic-result-card{ border:1px solid #d0e6d6; border-radius:8px; background:#fff; box-shadow:0 16px 34px -32px rgba(20,100,52,.65); }
.panic-result-card details{ width:100%; }
.panic-result-card summary{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 22px; cursor:pointer; list-style:none; }
.panic-result-card summary::-webkit-details-marker{ display:none; }
.panic-result-card summary::after{ content:"＋"; order:2; color:#249b5a; font-size:20px; font-weight:400; line-height:1; }
.panic-result-card details[open] summary::after{ content:"−"; }
.panic-result-summary-copy{ display:grid; grid-template-columns:minmax(145px,220px) minmax(0,1fr); align-items:center; gap:20px; min-width:0; }
.panic-result-summary-copy code{ display:inline-flex; width:max-content; max-width:100%; padding:7px 10px; overflow:hidden; border:1px solid #b1ddc0; border-radius:5px; background:#e9f7ee; color:#167a48; font-family:var(--f-mono); font-size:13px; font-weight:800; line-height:1.35; overflow-wrap:anywhere; }
.panic-result-summary-copy b{ display:block; margin-bottom:4px; color:#66856f; font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
.panic-result-summary-copy em{ display:block; overflow:hidden; color:#386348; font-size:13px; font-style:normal; font-weight:600; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }
.panic-result-toggle{ order:1; color:#249b5a; font-size:11px; font-weight:800; white-space:nowrap; }
.panic-result-card details[open] .panic-result-toggle{ font-size:0; }
.panic-result-card details[open] .panic-result-toggle::after{ content:"Đóng chi tiết"; font-size:11px; }
.panic-result-detail{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:start; padding:0 22px 20px; }
.panic-result-detail > div{ padding-top:17px; border-top:1px solid #e5f1e8; }
.panic-result-detail div span{ display:block; margin-bottom:5px; color:#66856f; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.panic-result-detail p{ color:#1c4c32; font-size:14px; font-weight:600; line-height:1.6; white-space:pre-line; }
.panic-result-detail small{ align-self:start; margin-top:17px; padding:5px 9px; border-radius:99px; background:#edf8f1; color:#398a5c; font-size:10px; font-weight:800; white-space:nowrap; }
.lookup-result{ max-width:1000px; }
.lookup-ticket{ padding:0; overflow:hidden; border-color:#d0e6d6; box-shadow:0 22px 50px -42px rgba(20,100,52,.45); }
.lookup-ticket-top{ padding:24px 28px; background:#f2faf5; }
.lookup-ticket-top b{ border:1px solid #b7e2c9; background:#e8f6ec; }
.lookup-grid{ padding:24px 28px; }
.lookup-progress{ padding:24px 28px 28px; border-top:1px solid #dfede3; background:#fbfefa; }
.lookup-progress h2{ margin-bottom:17px; color:#174d32; font-size:19px; }
.lookup-stage-list{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; }
.lookup-stage{ position:relative; min-width:0; padding:0 8px 0 0; color:#90aa96; }
.lookup-stage:not(:last-child)::after{ content:""; position:absolute; top:14px; right:0; left:31px; height:2px; background:#d7e8dc; }
.lookup-stage > span{ position:relative; z-index:1; display:grid; width:30px; height:30px; place-items:center; border:2px solid #c6ddca; border-radius:50%; background:#fff; color:#6f9278; font-size:10px; font-weight:800; }
.lookup-stage strong{ display:block; margin-top:9px; color:inherit; font-size:12px; line-height:1.3; }
.lookup-stage p{ max-width:180px; margin-top:5px; color:#5d8067; font-size:11px; line-height:1.45; }
.lookup-stage.is-done{ color:#258a53; }
.lookup-stage.is-done > span{ border-color:#249b5a; background:#249b5a; color:#fff; }
.lookup-stage.is-done:not(:last-child)::after{ background:#73c999; }
.lookup-stage.is-current strong{ color:#174c34; }
.repair-print-sheet{ display:none; }
.admin-section-heading{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.admin-section-heading p{ margin-top:5px; color:var(--text-dim); font-size:13px; }
.admin-section-action{ flex:0 0 auto; margin:0; }
.admin-request-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:7px; }
.admin-call-button{ display:inline-flex; align-items:center; gap:5px; min-height:34px; padding:0 9px; border:1px solid #80cba0; border-radius:4px; color:#198754; font-size:12px; font-weight:700; text-decoration:none; white-space:nowrap; }
.admin-call-button:hover{ border-color:#198754; background:#eaf7ee; color:#146c43; }
.admin-call-button svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.admin-price-group{ margin-top:24px; padding:20px; border:1px solid var(--line); border-radius:6px; background:rgba(7,39,25,.32); }
.admin-price-tab-form,.admin-price-row-form,.admin-price-add-form,.admin-price-new-tab{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.admin-price-tab-form{ margin-bottom:14px; }
.admin-price-tab-form input,.admin-price-row-form input,.admin-price-add-form input,.admin-price-new-tab input{ min-height:38px; padding:8px 10px; border:1px solid var(--line); border-radius:4px; background:var(--bg-soft); color:var(--text); font:inherit; font-size:13px; }
.admin-price-tab-form input:first-of-type{ flex:1 1 150px; font-weight:700; }
.admin-price-tab-form input:not(:first-of-type){ flex:1 1 130px; }
.admin-price-row-form input:nth-of-type(1){ flex:2 1 180px; }
.admin-price-row-form input:nth-of-type(2){ flex:1 1 150px; }
.admin-price-row-form input:nth-of-type(3){ flex:0 1 140px; }
.admin-action-button,.admin-delete-button{ min-height:38px; padding:8px 12px; border:1px solid var(--amber); border-radius:4px; background:transparent; color:var(--amber); font:inherit; font-size:12px; font-weight:700; cursor:pointer; }
.admin-action-button:hover{ background:rgba(25,135,84,.12); }
.admin-delete-button{ border-color:#80cba0; color:#51906b; }
.admin-price-table td{ padding:8px; }
.admin-price-table td[colspan]{ padding:8px; }
.admin-price-add-form{ margin-top:12px; }
.admin-price-add-form input{ flex:1 1 150px; }
.admin-price-delete-tab{ margin-top:12px; }
.admin-price-new-tab{ margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }
.admin-price-new-tab input{ flex:1 1 220px; }
body .admin-page + .mobile-tabs{ display:none !important; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}

/* ---------- MOBILE FIRST REFINEMENTS ---------- */
.mobile-tabs{ display:none; }
.mobile-app-screen{ display:none; }
.tab-app-head{ display:none; }
.floating-socials{ position:fixed; right:24px; bottom:24px; z-index:65; display:flex; align-items:center; gap:10px; }
.floating-social{ display:flex; align-items:center; gap:8px; padding:11px 15px 11px 11px; border-radius:999px; color:#fff; box-shadow:0 14px 28px -12px rgba(0,120,63,.6); font-size:13px; font-weight:700; transition:transform .2s ease, box-shadow .2s ease; }
.floating-social:hover{ color:#fff; transform:translateY(-2px); box-shadow:0 18px 32px -12px rgba(0,120,63,.7); }
.floating-facebook{ background:#218c54; }
.floating-facebook svg{ width:24px; height:24px; fill:currentColor; }
.floating-zalo{ background:#168f57; }
.floating-zalo:hover{ color:#fff; transform:translateY(-2px); box-shadow:0 18px 32px -12px rgba(0,120,63,.7); }
.floating-zalo svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.floating-zalo > svg,.floating-zalo > span{ position:relative; z-index:1; }
.floating-zalo-ripple,.floating-zalo-ripple::after{ position:absolute; inset:-3px; border:2px solid rgba(0,135,75,.48); border-radius:inherit; pointer-events:none; }
.floating-zalo-ripple{ z-index:0; animation:zalo-ripple 2.6s ease-out infinite; }
.floating-zalo-ripple::after{ content:""; inset:-2px; animation:zalo-ripple 2.6s ease-out 1.3s infinite; }
@keyframes zalo-ripple{ 0%,12%{ opacity:0; transform:scale(.86); } 22%{ opacity:.75; } 76%,100%{ opacity:0; transform:scale(1.65); } }
.qr-scanner-modal[hidden]{ display:none !important; }
.qr-scanner-modal{ position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding:20px; }
.qr-scanner-backdrop{ position:absolute; inset:0; background:rgba(2,32,20,.72); backdrop-filter:blur(4px); }
.qr-scanner-card{ position:relative; z-index:1; width:min(100%,500px); padding:28px; border:1px solid #7cc99c; border-radius:10px; background:#fff; color:#183b2d; box-shadow:0 30px 70px -32px rgba(0,0,0,.65); }
.qr-scanner-card h2{ margin:7px 0 6px; color:#174d32; font-size:30px; }
.qr-scanner-status{ min-height:24px; margin:0 0 14px; color:#5d8067; font-size:13px; }
.qr-scanner-close{ position:absolute; top:11px; right:12px; width:32px; height:32px; border:0; border-radius:50%; background:#e8f6ec; color:#198754; font-size:24px; line-height:1; cursor:pointer; }
.qr-video-wrap{ position:relative; overflow:hidden; aspect-ratio:1/1; border:1px solid #c9e1d2; border-radius:8px; background:#0d3a28; }
.qr-video-wrap video{ width:100%; height:100%; object-fit:cover; }
.qr-frame{ position:absolute; top:50%; left:50%; width:64%; aspect-ratio:1/1; transform:translate(-50%,-50%); border:2px solid #89d5aa; border-radius:10px; box-shadow:0 0 0 999px rgba(3,40,25,.25); }
.qr-manual-form{ margin-top:16px; }
.qr-manual-form label{ display:block; margin-bottom:8px; color:#53775f; font-size:12px; font-weight:700; }
.qr-manual-form > div{ display:flex; gap:8px; }
.qr-manual-form input{ flex:1; min-width:0; height:42px; padding:0 12px; border:1px solid #c9e1d2; border-radius:4px; color:#183b2d; font:inherit; }
.qr-manual-form .btn{ padding:0 15px; }

/* Mặt hàng hot tại cửa hàng */
.product-brand-filter{ display:flex; gap:8px; margin-bottom:16px; }
.product-filter{ min-height:38px; padding:0 14px; border:1px solid #d0e4d6; border-radius:999px; background:#fff; color:#587b66; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.product-filter.is-active{ border-color:#198754; background:#198754; color:#fff; }
.product-list{ display:grid; gap:13px; }
.product-card{ display:grid; grid-template-columns:104px minmax(0,1fr); gap:15px; align-items:center; padding:14px; border:1px solid #dbece1; border-radius:10px; background:#fff; box-shadow:0 13px 28px -29px rgba(12,67,36,.65); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.product-card:hover{ color:inherit; transform:translateY(-2px); border-color:#99d3b0; box-shadow:0 18px 35px -27px rgba(12,67,36,.36); }
.product-visual{ position:relative; display:grid; min-height:148px; place-items:center; overflow:hidden; border-radius:8px; background:linear-gradient(145deg,#e0f4e6,#acd9bd); }
.product-visual.is-samsung{ background:linear-gradient(145deg,#d7f1e9,#a8d9c8); }
.product-visual::after{ content:""; position:absolute; right:-22px; bottom:-27px; width:92px; height:92px; border:16px solid rgba(255,255,255,.28); border-radius:50%; }
.product-image{ position:relative; z-index:1; width:100%; height:100%; object-fit:contain; padding:8px; }
.product-no-image{ position:relative; z-index:1; padding:8px; color:#46755b; font-size:11px; font-weight:700; text-align:center; }
.product-device{ position:relative; z-index:1; display:block; width:57px; height:111px; border:4px solid #193b2b; border-radius:12px; background:linear-gradient(145deg,#2b4336,#0b2419); box-shadow:inset 0 0 0 2px rgba(255,255,255,.22),0 11px 14px -10px rgba(5,40,26,.7); }
.is-samsung .product-device{ border-radius:10px; border-color:#305a58; background:linear-gradient(145deg,#5e7d7a,#183b40); }
.product-device::before{ content:""; position:absolute; top:8px; left:8px; width:18px; height:18px; border:3px solid rgba(230,245,255,.85); border-radius:50%; box-shadow:20px 0 0 -3px #10251b,20px 0 0 0 rgba(230,245,255,.85),0 20px 0 -3px #10251b,0 20px 0 0 rgba(230,245,255,.85); }
.is-samsung .product-device::before{ top:9px; left:50%; width:9px; height:9px; border-width:2px; transform:translateX(-50%); box-shadow:none; }
.product-device i{ display:none; }
.product-brand{ display:block; color:#198754; font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }
.product-info h2{ margin:4px 0 6px; color:#183b2d; font-size:17px; line-height:1.28; letter-spacing:-.025em; }
.product-condition{ margin:0; color:#397657; font-size:12px; font-weight:700; }
.product-meta{ margin:4px 0 12px; color:#718878; font-size:12px; }
.product-bottom{ display:flex; align-items:center; gap:8px; }
.product-bottom strong{ color:#198754; font-size:13px; }
.product-contact{ min-height:33px; padding:0 10px; border:1px solid #c0ddca; border-radius:5px; background:#f7fcf8; color:#198754; font:inherit; font-size:11px; font-weight:700; cursor:pointer; }
.product-contact:hover{ border-color:#198754; background:#e8f6ec; }
.products-status,.products-note{ margin:0; color:#718878; font-size:12px; line-height:1.6; }
.products-status{ padding:22px 0; text-align:center; }
.products-note{ margin-top:16px; padding:12px 14px; border-left:3px solid #72cda0; background:#e8f6ec; }
.product-detail-page{ min-height:calc(100vh - 78px); padding:54px 0 92px; background:#f7faf8; color:#183b2d; }
.product-back-link{ display:inline-flex; margin-bottom:24px; color:#198754; font-size:14px; font-weight:700; }
.product-detail-card{ display:grid; grid-template-columns:minmax(280px,.75fr) minmax(0,1.25fr); gap:44px; max-width:980px; padding:30px; border:1px solid #d9eae0; border-radius:12px; background:#fff; box-shadow:0 28px 54px -48px rgba(12,67,36,.5); }
.product-detail-visual{ position:relative; display:grid; min-height:410px; place-items:center; overflow:hidden; border-radius:9px; background:linear-gradient(145deg,#e0f4e6,#acd9bd); }
.product-detail-visual.is-samsung{ background:linear-gradient(145deg,#d7f1e9,#a8d9c8); }
.product-detail-visual::after{ content:""; position:absolute; right:-62px; bottom:-72px; width:255px; height:255px; border:36px solid rgba(255,255,255,.28); border-radius:50%; }
.product-detail-image{ position:relative; z-index:1; width:100%; height:100%; object-fit:contain; padding:28px; }
.product-detail-visual .product-device{ width:154px; height:300px; border-radius:26px; border-width:8px; }
.product-detail-visual .product-device::before{ top:21px; left:21px; width:43px; height:43px; border-width:6px; box-shadow:51px 0 0 -6px #10251b,51px 0 0 0 rgba(230,245,255,.85),0 51px 0 -6px #10251b,0 51px 0 0 rgba(230,245,255,.85); }
.product-detail-visual.is-samsung .product-device{ border-radius:20px; }
.product-detail-visual.is-samsung .product-device::before{ top:22px; width:20px; height:20px; border-width:4px; box-shadow:none; }
.product-detail-stock{ position:absolute; z-index:2; top:18px; left:18px; padding:7px 10px; border-radius:999px; background:rgba(255,255,255,.8); color:#28704a; font-size:11px; font-weight:800; }
.product-detail-info{ align-self:center; }
.product-detail-info h1{ margin:5px 0 11px; color:#183b2d; font-size:clamp(29px,4vw,45px); line-height:1.12; }
.product-detail-condition{ margin:0 0 25px; color:#397657; font-size:14px; font-weight:700; }
.product-store-condition{ margin:-15px 0 17px; color:#198754; font-size:14px; font-weight:800; }
.product-detail-description{ margin:-6px 0 19px; color:#526d90; font-size:14px; line-height:1.7; }
.product-spec-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.product-spec-grid > div{ padding:13px; border:1px solid #deeee2; border-radius:6px; background:#f9fdfa; }
.product-spec-grid span,.product-detail-price span{ display:block; margin-bottom:3px; color:#718878; font-size:11px; }
.product-spec-grid strong{ color:#2b513a; font-size:14px; line-height:1.45; }
.product-detail-price{ margin-top:20px; padding:17px; border-left:4px solid #198754; background:#e9f7ee; }
.product-detail-price strong{ display:block; color:#198754; font-size:21px; }
.product-detail-price del{ display:block; margin-top:4px; color:#718878; font-size:13px; }
.product-detail-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.product-detail-note{ margin:15px 0 0; color:#718878; font-size:12px; }
.product-not-found{ max-width:600px; padding:44px; border:1px solid #d9eae0; border-radius:10px; background:#fff; }
.product-not-found h1{ margin-bottom:10px; font-size:35px; }
.product-not-found p{ margin-bottom:22px; color:#718878; }
.product-full-specs{ max-width:980px; margin-top:22px; padding:28px; border:1px solid #d9eae0; border-radius:10px; background:#fff; }
.product-full-specs h2{ margin-bottom:17px; color:#183b2d; font-size:24px; }
.product-full-specs > div{ columns:2; column-gap:28px; }
.product-full-specs p{ break-inside:avoid; display:flex; justify-content:space-between; gap:16px; margin:0; padding:10px 0; border-bottom:1px solid #e3efe6; font-size:13px; }
.product-full-specs span{ color:#718878; }
.product-full-specs strong{ color:#2d513b; text-align:right; }
.admin-product-form{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; padding:18px; border:1px solid #ddecdf; border-radius:7px; background:#f9fdfa; }
.admin-product-import{ margin-bottom:15px; padding:15px; border:1px solid #c0e2ce; border-radius:7px; background:#e9f7ee; }
.admin-product-import label{ display:block; margin-bottom:7px; color:#236e49; font-size:13px; font-weight:800; }
.admin-product-import > div{ display:flex; gap:8px; }
.admin-product-import input{ flex:1; min-width:0; min-height:38px; padding:8px 10px; border:1px solid #c8dfcf; border-radius:4px; background:#fff; color:#183b2d; font:inherit; font-size:13px; }
.admin-product-import small{ display:block; margin-top:8px; color:#557b62; font-size:11px; line-height:1.5; }
.admin-product-search-results{ margin-bottom:16px; }
.admin-product-search-results > h3{ margin:14px 0 9px; color:#286447; font-size:17px; }
.admin-product-search-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.admin-product-search-item{ display:flex; align-items:center; gap:10px; min-width:0; padding:10px; border:1px solid #d5e7db; border-radius:7px; background:#fff; color:#2d533d; text-align:left; cursor:pointer; }
.admin-product-search-item:hover{ border-color:#82cda3; background:#f6fbf7; }
.admin-product-search-item:disabled{ cursor:wait; opacity:.6; }
.admin-product-search-item img{ flex:0 0 48px; width:48px; height:48px; object-fit:contain; }
.admin-product-search-item span{ min-width:0; }
.admin-product-search-item strong,.admin-product-search-item small{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.admin-product-search-item strong{ font-size:13px; }
.admin-product-search-item small{ margin-top:3px; color:#718878; font-size:11px; }
.admin-product-preview{ position:relative; padding:18px; border:1px solid #96cdae; border-radius:8px; background:#f6fbf7; }
.admin-product-preview h3{ margin-bottom:4px; color:#1e6645; font-size:18px; }
.admin-product-preview > p{ max-width:680px; margin:0 0 14px; color:#587d68; font-size:12px; line-height:1.55; }
.admin-product-preview-image{ position:absolute; top:18px; right:18px; width:92px; height:92px; object-fit:contain; }
.admin-product-preview .admin-product-form{ padding:0; border:0; background:transparent; }
.admin-product-form label{ display:flex; flex-direction:column; gap:6px; color:#536f5a; font-size:12px; font-weight:700; }
.admin-product-form input:not([type="checkbox"]),.admin-product-form textarea,.admin-product-form select{ width:100%; border:1px solid #cfe1d4; border-radius:4px; background:#fff; color:#183b2d; font:inherit; font-size:13px; padding:9px 10px; resize:vertical; }
.admin-product-wide{ grid-column:1 / -1; }
.admin-product-check{ flex-direction:row !important; align-items:center; grid-column:1 / -1; }
.admin-product-check input{ width:16px; height:16px; accent-color:#198754; }
.admin-product-form > .btn{ justify-self:start; }
.admin-product-list{ display:grid; gap:10px; margin-top:20px; }
.admin-product-item{ border:1px solid #ddecdf; border-radius:7px; background:#fff; }
.admin-product-item summary{ display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:12px; cursor:pointer; list-style:none; }
.admin-product-item summary::-webkit-details-marker{ display:none; }
.admin-product-item summary > span:first-child{ display:grid; flex:0 0 46px; width:46px; height:46px; place-items:center; overflow:hidden; border-radius:5px; background:#e8f6ec; }
.admin-product-item summary img{ width:100%; height:100%; object-fit:contain; }
.admin-product-item summary div{ flex:1 1 180px; min-width:0; }
.admin-product-item summary strong,.admin-product-item summary small{ display:block; }
.admin-product-item summary strong{ color:#2b513a; font-size:14px; }
.admin-product-item summary small{ margin-top:2px; color:#718878; font-size:11px; }
.admin-product-summary-actions{ display:flex; flex:0 0 auto; align-items:center; gap:8px; margin-left:auto; }
.admin-product-item summary em{ color:#198754; font-size:12px; font-style:normal; font-weight:700; }
.admin-product-summary-actions .admin-delete-button{ min-height:31px; padding:5px 9px; background:#fff; }
.admin-product-summary-actions .admin-delete-button:hover{ border-color:#198754; background:#eaf7ee; color:#198754; }
.admin-product-edit{ margin:0 12px 12px; }
.admin-product-actions{ display:flex; align-items:center; gap:12px; }
.admin-product-delete{ display:none; }
.admin-empty-products{ margin-top:15px; color:#718878; font-size:13px; }

/* Desktop reading scale: ưu tiên nội dung dễ đọc, bớt cảm giác poster. */
@media(min-width:701px){
  /* Dock PC: logo luôn một hàng, menu ở giữa; các hành động phụ sẽ tự thu gọn
     ở màn desktop vừa để không đẩy logo xuống hàng thứ hai. */
  .nav{ gap:20px; }
  .logo{ flex:0 0 auto; white-space:nowrap; }
  nav.links{ flex:1 1 auto; justify-content:center; gap:clamp(14px,1.8vw,27px); }
  .nav-cta{ flex:0 0 auto; gap:14px; }
  nav.links{ font-size:13px; }
  .eyebrow{ font-size:13px; margin-bottom:18px; }
  .btn{ padding:15px 24px; font-size:14px; }
  .hero p.lead{ font-size:18px; line-height:1.75; }
  .trust-item{ font-size:13px; }
  .gallery-heading p{ max-width:300px; font-size:15px; line-height:1.6; }
  .gallery-item figcaption{ padding:34px 20px 16px; font-size:14px; }
  section{ padding:88px 0; }
  .sec-head{ margin-bottom:42px; }
  .sec-head p{ font-size:17px; line-height:1.7; }
  .svc-card{ padding:32px 28px; }
  .svc-index{ font-size:13px; margin-bottom:20px; }
  .svc-card h3{ font-size:20px; }
  .svc-card p{ font-size:15px; line-height:1.65; }
  .tab-btn{ font-size:14px; padding:13px 21px; }
  .price-table thead th{ font-size:13px; }
  .price-table td{ font-size:16px; padding:18px 24px; }
  .price-note{ font-size:14px; }
  .proc-step h3{ font-size:20px; }
  .proc-step p,.why-item p{ font-size:15px; line-height:1.7; }
  .why-item h4{ font-size:19px; }
  .test-card p{ font-size:16px; line-height:1.7; }
  .test-who-name{ font-size:15px; }
  .location-label{ font-size:13px; }
  .location-panel strong,.location-panel a{ font-size:16px; }
  .faq-q{ font-size:19px; }
  .faq-a p{ font-size:16px; line-height:1.75; }
  .contact-row h4{ font-size:17px; }
  .contact-row p{ font-size:15px; }
  .form-row label{ font-size:13px; }
  .form-row input,.form-row textarea{ font-size:16px; }
  .footer-grid h4{ font-size:14px; }
  .footer-grid ul{ font-size:15px; }

  /* Trang chủ PC dùng cùng nền sáng xanh-trắng như giao diện mobile. */
  body:not(.desktop-tab-view){
    --bg:#f7faf8; --bg-soft:#f2f7f3; --card:#fff; --card-hi:#f7fcf8;
    --line:#dce9df; --line-strong:#cadfd0; --text:#183b2d; --text-dim:#718878;
    --amber:#198754; --teal:#198754;
    background:#f7faf8; color:#183b2d;
  }
  body:not(.desktop-tab-view)::before{ display:none; }
  body:not(.desktop-tab-view) header{
    --text:#f7faf8; --text-dim:#acd2b7; --line:#285e40; --line-strong:#477a61;
    --amber:#63c996; --teal:#90d5ac;
    background:rgba(5,39,25,.98); color:#f7faf8;
  }
  body:not(.desktop-tab-view) header .logo{ color:#f7faf8; }
  body:not(.desktop-tab-view) header nav.links{ color:#acd2b7; }
  body:not(.desktop-tab-view) header .header-logout{ color:#acd2b7; }

  body.desktop-tab-view{
    --bg:#f7faf8; --bg-soft:#f2f7f3; --card:#fff; --card-hi:#f7fcf8;
    --line:#dce9df; --line-strong:#cadfd0; --text:#183b2d; --text-dim:#718878;
    --amber:#198754; --teal:#198754;
    background:#f7faf8; color:#183b2d;
  }
  body.desktop-tab-view header{
    --text:#f7faf8; --text-dim:#acd2b7; --line:#285e40; --line-strong:#477a61;
    --amber:#63c996; --teal:#90d5ac;
    background:rgba(5,39,25,.98); color:#f7faf8;
  }
  body.desktop-tab-view header .logo{ color:#f7faf8; }
  body.desktop-tab-view header nav.links{ color:#acd2b7; }
  body.desktop-tab-view header .header-logout{ color:#acd2b7; }
  /* PC dùng chính xác trạng thái is-active của dock mobile. */
  body.desktop-tab-view [data-mobile-screen]{ display:none !important; }
  body.desktop-tab-view [data-mobile-screen].is-active{ display:block !important; }
  body.desktop-tab-view #bangia.tab-screen.is-active{ min-height:calc(100vh - 188px); padding:0 0 72px !important; border:0 !important; background:#f7faf8 !important; color:#183b2d; }
  body.desktop-tab-view .tab-app-head{ display:block; position:relative; overflow:hidden; padding:62px max(28px,calc((100vw - 1104px) / 2)) 52px; color:#fff; background:linear-gradient(135deg,#0b3322,#146440); }
  body.desktop-tab-view .tab-app-head::after{ content:""; position:absolute; right:7%; top:-120px; width:330px; height:330px; border:48px solid rgba(48,165,94,.23); border-radius:50%; }
  body.desktop-tab-view .tab-app-head > *{ position:relative; z-index:1; }
  body.desktop-tab-view .tab-app-head .app-kicker{ display:inline-block; padding:7px 12px; border:1px solid rgba(255,255,255,.3); border-radius:5px; color:#b8ebd0; font-size:12px; font-weight:700; }
  body.desktop-tab-view .tab-app-head h1{ margin:18px 0 10px; color:#fff; font-size:clamp(42px,5vw,68px); line-height:1.05; }
  body.desktop-tab-view .tab-app-head p{ max-width:620px; margin:0; color:rgba(255,255,255,.76); font-size:17px; line-height:1.7; }
  body.desktop-tab-view .mobile-app-screen{ display:none !important; min-height:calc(100vh - 78px); padding-bottom:60px; background:#f7faf8; color:#183b2d; }
  body.desktop-tab-view .mobile-app-screen.is-active{ display:block !important; }
  body.desktop-tab-view .app-page-head{ position:relative; overflow:hidden; padding:62px max(28px,calc((100vw - 1104px) / 2)) 52px; color:#fff; background:linear-gradient(135deg,#0b3322,#146440); }
  body.desktop-tab-view .app-page-head::after{ content:""; position:absolute; right:7%; top:-120px; width:330px; height:330px; border:48px solid rgba(48,165,94,.23); border-radius:50%; }
  body.desktop-tab-view .app-page-head > *{ position:relative; z-index:1; }
  body.desktop-tab-view .app-kicker{ display:inline-block; padding:7px 12px; border:1px solid rgba(255,255,255,.3); border-radius:5px; color:#b8ebd0; font-size:12px; font-weight:700; }
  body.desktop-tab-view .app-page-head h1{ margin:18px 0 10px; color:#fff; font-size:clamp(42px,5vw,68px); line-height:1.05; }
  body.desktop-tab-view .app-page-head p{ max-width:620px; margin:0; color:rgba(255,255,255,.76); font-size:17px; line-height:1.7; }
  body.desktop-tab-view .app-page-body{ max-width:1104px; margin:0 auto; padding:34px 28px 60px; }
  body.desktop-tab-view .app-form-card{ max-width:650px; padding:28px; border:1px solid #dfeae2; border-radius:8px; background:#fff; box-shadow:0 20px 42px -36px rgba(16,60,34,.45); }
  body.desktop-tab-view .app-form-card label{ display:block; margin-bottom:9px; color:#536e5a; font-size:14px; font-weight:700; }
  body.desktop-tab-view .app-form-card input{ width:100%; height:50px; padding:0 14px; border:1px solid #d1e3d6; border-radius:5px; color:#183b2d; font:inherit; font-size:15px; }
  body.desktop-tab-view .app-primary-button{ display:flex; align-items:center; justify-content:center; width:100%; min-height:50px; margin-top:16px; border:1px solid #198754; border-radius:5px; background:#198754; color:#fff; font-family:var(--f-body); font-size:15px; font-weight:700; cursor:pointer; box-shadow:0 12px 24px -16px rgba(25,135,84,.65); transition:background .2s ease, transform .2s ease; }
  body.desktop-tab-view .app-primary-button:hover{ background:#157347; transform:translateY(-1px); }
  body.desktop-tab-view .app-note{ max-width:650px; font-size:14px; }
  body.desktop-tab-view .app-note{ display:flex; gap:12px; margin-top:18px; padding:15px; border-left:3px solid #72cda0; background:#e8f6ec; color:#557c66; line-height:1.6; }
  body.desktop-tab-view .app-note span{ display:grid; flex:0 0 20px; width:20px; height:20px; place-items:center; border-radius:50%; background:#198754; color:#fff; }
  body.desktop-tab-view .app-note span svg{ width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  body.desktop-tab-view .app-note p{ margin:0; }
  body.desktop-tab-view .app-page-body{ color:#183b2d; }
  body.desktop-tab-view .app-page-body .price-tabs{ justify-content:flex-start; width:auto; margin:0 0 18px; }
  body.desktop-tab-view .app-page-body .price-table{ background:#fff; border-color:#d2e5d8; color:#183b2d; box-shadow:0 18px 38px -34px rgba(16,60,34,.45); }
  body.desktop-tab-view .app-page-body .price-table thead th{ background:#eff7f1; color:#536e5a; border-bottom-color:#cae2d4; }
  body.desktop-tab-view .app-page-body .price-table td{ border-bottom-color:#ddeadf; }
  body.desktop-tab-view .app-page-body .price-table td:last-child{ color:#198754; }
  body.desktop-tab-view .app-page-body .price-note{ color:#718878; }
  body.desktop-tab-view .app-news-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  body.desktop-tab-view .app-news-card{ display:grid; grid-template-columns:40px 100px 1fr 20px; gap:14px; align-items:start; padding:18px; border:1px solid #dfeae2; border-radius:8px; background:#fff; color:#183b2d; }
  body.desktop-tab-view .app-news-thumb{ width:100px; height:80px; border-radius:5px; object-fit:cover; }
  body.desktop-tab-view .app-news-index{ color:#198754; font-size:13px; font-weight:800; }
  body.desktop-tab-view .app-news-tag{ color:#198754; font-size:11px; font-weight:700; }
  body.desktop-tab-view .app-news-card h2{ margin:6px 0; color:#183b2d; font-size:18px; line-height:1.35; }
  body.desktop-tab-view .app-news-card p{ margin:0; color:#718878; font-size:13px; line-height:1.55; }
  body.desktop-tab-view .app-arrow svg{ width:20px; height:20px; }
  body.desktop-tab-view .product-list{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
  body.desktop-tab-view .product-card{ grid-template-columns:126px minmax(0,1fr); min-height:190px; padding:18px; }
  body.desktop-tab-view .product-visual{ min-height:150px; }
  body.desktop-tab-view .product-info h2{ font-size:20px; }
  body.desktop-tab-view .product-brand-filter{ margin-bottom:22px; }
  body.desktop-tab-view .account-switch{ max-width:650px; }
  body.desktop-tab-view .account-switch{ display:grid; grid-template-columns:1fr 1fr; margin-bottom:22px; border-bottom:1px solid #d9e8dd; }
  body.desktop-tab-view .account-switch-btn{ position:relative; padding:13px 4px; border:0; background:transparent; color:#718878; font:inherit; font-size:15px; font-weight:700; cursor:pointer; }
  body.desktop-tab-view .account-switch-btn.is-active{ color:#198754; }
  body.desktop-tab-view .account-switch-btn.is-active::after{ content:""; position:absolute; right:26px; bottom:-1px; left:26px; height:2px; background:#198754; }
  body.desktop-tab-view .account-form{ display:none; max-width:650px; }
  body.desktop-tab-view .account-form.is-active{ display:flex; flex-direction:column; }
  body.desktop-tab-view .account-form label{ margin:16px 0 8px; color:#536e5a; font-size:14px; }
  body.desktop-tab-view .account-form input{ width:100%; height:50px; padding:0 14px; border:1px solid #d1e3d6; border-radius:5px; background:#fff; color:#183b2d; font-family:var(--f-body); font-size:15px; outline:0; }
  body.desktop-tab-view .account-form input:focus{ border-color:#198754; box-shadow:0 0 0 3px rgba(25,135,84,.12); }
  body.desktop-tab-view .account-helper{ max-width:650px; font-size:13px; color:#718878; }
  body.desktop-tab-view .account-forgot{ align-self:flex-end; margin-top:10px; color:#198754; font-size:13px; font-weight:600; }
  body.desktop-tab-view .app-auth-message{ max-width:650px; margin-bottom:16px; padding:13px 15px; border-radius:5px; font-size:14px; }
  body.desktop-tab-view .app-auth-message-ok{ border:1px solid #9dcaaf; background:#eaf8ef; color:#31724a; }
  body.desktop-tab-view .app-auth-message-err{ border:1px solid #edb4b4; background:#fff0f0; color:#a34141; }
  body.desktop-tab-view .app-admin-link{ display:flex; align-items:center; justify-content:center; max-width:650px; min-height:48px; margin-bottom:16px; border:1px solid #198754; border-radius:5px; color:#198754; font-size:14px; font-weight:700; }
  body.desktop-tab-view .app-logout-link{ display:flex; align-items:center; justify-content:center; max-width:650px; min-height:48px; border:1px solid #d1e3d6; border-radius:5px; color:#536e5a; font-size:14px; font-weight:700; }
  body.desktop-tab-view .account-signed-in{ display:flex; align-items:center; gap:14px; max-width:650px; margin-bottom:16px; padding:18px; border:1px solid #dceee2; border-radius:7px; background:#fff; }
  body.desktop-tab-view .account-signed-in strong{ display:block; color:#183b2d; font-size:17px; }
  body.desktop-tab-view .account-signed-in p{ margin:3px 0 0; color:#718878; font-size:13px; }
  body.desktop-tab-view .account-user-icon{ display:grid; width:44px; height:44px; place-items:center; border-radius:50%; background:#e8f6ec; color:#198754; }
  body.desktop-tab-view .account-user-icon svg{ width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  body:not(.menu-open) .mobile-tabs{ display:grid; grid-template-columns:repeat(6,1fr); position:fixed; left:50%; right:auto; bottom:22px; z-index:70; width:min(650px,calc(100vw - 48px)); min-height:70px; padding:8px 10px; transform:translateX(-50%); border:1px solid rgba(105,170,125,.38); border-radius:18px; background:rgba(5,39,25,.96); box-shadow:0 18px 42px -22px rgba(0,0,0,.72); backdrop-filter:blur(16px); }
  body:not(.menu-open) .mobile-tab{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-width:0; color:#acd2b7; font-size:10px; font-weight:700; line-height:1.25; }
  body:not(.menu-open) .mobile-tab svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  body:not(.menu-open) .mobile-tab.active{ color:#6bcd98; }
  body.desktop-tab-view{ padding-bottom:110px; }
}

/* Cụm menu PC luôn nằm đúng tâm màn hình, không bị kéo lệch bởi logo hoặc nút tài khoản. */
@media (min-width:1200px){
  .nav{ display:grid; grid-template-columns:minmax(max-content,1fr) auto minmax(max-content,1fr); justify-content:initial; }
  .nav .logo{ justify-self:start; }
  .nav > .links{ width:max-content; justify-self:center; }
  .nav .nav-cta{ justify-self:end; }
}

@media (min-width:701px) and (max-width:2600px){
  .nav{ gap:13px; }
  nav.links{ gap:15px; font-size:12px; }
  header .hide-mobile{ display:none; }
  .header-qr-button,.header-notification-button{ display:grid; width:30px; height:34px; place-items:center; }
  .header-qr-button span,.header-notification-button [data-notifications-label]{ display:none; }
  .header-qr-button svg,.header-notification-button svg{ width:19px; height:19px; }
}

@media(max-width:700px){
  /* Các trang độc lập (tra cứu, chi tiết sản phẩm...) không dùng dock vẫn giữ header tương phản. */
  body:not(.tab-ui-active) header{ --text:#f7faf8; --text-dim:#acd2b7; --line:#285e40; --line-strong:#477a61; --amber:#63c996; background:rgba(5,39,25,.98); color:#f7faf8; }
  body:not(.tab-ui-active) header .logo{ color:#f7faf8; }
  body:not(.tab-ui-active) header nav.links,body:not(.tab-ui-active) header .header-logout{ color:#acd2b7; }
  body:not(.tab-ui-active) header .menu-toggle{ border-color:#477a61; background:#0e3d29; }
  body:not(.tab-ui-active) header .menu-toggle span{ background:#f7faf8; }
  .header-qr-button{ min-height:auto; padding:0; font-size:10px; }
  .header-qr-button svg{ width:16px; height:16px; }
  .header-qr-button span{ display:inline; }
  .header-notification-button{ font-size:10px; }
  .header-notification-button svg{ width:16px; height:16px; }
  .qr-scanner-card{ padding:24px 18px 18px; border-radius:8px; }
  .qr-scanner-card h2{ font-size:26px; }
  .qr-manual-form > div{ flex-direction:column; }
  .qr-manual-form .btn{ width:100%; min-height:42px; }
  .product-detail-page{ min-height:100dvh; padding:24px 0 94px; }
  .product-back-link{ margin-bottom:16px; font-size:13px; }
  .product-detail-card{ grid-template-columns:1fr; gap:22px; padding:16px; border-radius:8px; }
  .product-detail-visual{ min-height:285px; }
  .product-detail-visual .product-device{ width:108px; height:210px; border-width:6px; border-radius:19px; }
  .product-detail-visual .product-device::before{ top:14px; left:14px; width:30px; height:30px; border-width:4px; box-shadow:36px 0 0 -4px #10251b,36px 0 0 0 rgba(230,245,255,.85),0 36px 0 -4px #10251b,0 36px 0 0 rgba(230,245,255,.85); }
  .product-detail-visual.is-samsung .product-device{ border-radius:15px; }
  .product-detail-visual.is-samsung .product-device::before{ top:15px; width:14px; height:14px; border-width:3px; box-shadow:none; }
  .product-detail-info h1{ font-size:29px; }
  .product-store-condition{ margin-top:-13px; }
  .product-detail-actions{ display:grid; grid-template-columns:1fr; }
  .product-detail-actions .btn{ width:100%; }
  .product-detail-image{ padding:18px; }
  .product-full-specs{ margin-top:16px; padding:18px; border-radius:8px; }
  .product-full-specs h2{ font-size:20px; }
  .product-full-specs > div{ columns:1; }
  .product-full-specs p{ align-items:flex-start; flex-direction:column; gap:2px; }
  .product-full-specs strong{ text-align:left; }
  .admin-product-form{ grid-template-columns:1fr; padding:14px; }
  .admin-warranty-form{ grid-template-columns:1fr; }
  .admin-warranty-note-field{ grid-column:auto; }
  .admin-warranty-form .btn{ width:100%; }
  .admin-product-item summary{ gap:9px; }
  .admin-product-item summary div{ flex-basis:130px; }
  .admin-product-summary-actions{ width:100%; justify-content:flex-end; margin-left:0; padding-top:3px; border-top:1px solid #e4f0e7; }
  .admin-product-import > div{ align-items:stretch; flex-direction:column; }
  .admin-product-search-list{ grid-template-columns:1fr; }
  .admin-product-preview-image{ position:static; display:block; width:100%; max-width:150px; height:150px; margin:0 auto 12px; }
  .admin-product-wide,.admin-product-check{ grid-column:auto; }
  .repair-workbench,.lookup-page{ min-height:100dvh; padding:30px 0 92px; }
  .repair-workbench-head,.lookup-heading{ display:block; margin-bottom:20px; }
  .repair-workbench-head .btn{ margin-top:15px; }
  .repair-workbench h1,.lookup-heading h1{ font-size:33px; }
  .repair-workbench-head p,.lookup-heading p{ font-size:14px; }
  .repair-card{ padding:18px; border-color:#dfeae2; border-radius:6px; background:#fff; }
  .repair-card h2{ font-size:19px; }
  .repair-form{ grid-template-columns:1fr; gap:13px; }
  .repair-form label:nth-child(3),.repair-form label:nth-child(4),.repair-form button{ grid-column:auto; }
  .repair-alert,.repair-created{ align-items:flex-start; flex-direction:column; }
  .repair-ticket-row{ align-items:flex-start; flex-direction:column; }
  .repair-ticket-row form{ flex-wrap:wrap; }
  .admin-document-upload{ grid-template-columns:1fr; align-items:stretch; }
  .admin-document-upload input,.admin-document-upload .btn{ width:100%; }
  .admin-document-edit summary{ grid-template-columns:minmax(0,1fr) auto; gap:5px 10px; }
  .admin-document-edit summary small{ grid-column:1; }
  .admin-document-edit summary span{ grid-column:2; grid-row:1 / span 2; }
  .admin-document-edit-form{ grid-template-columns:1fr; }
  .admin-document-edit-form .admin-action-button{ width:100%; }
  .admin-document-actions{ width:100%; justify-content:flex-end; }
  .admin-document-edit-inline[open] .admin-document-edit-form{ width:min(320px, calc(100vw - 48px)); }
  .admin-document-row{ align-items:flex-start; flex-direction:column; }
  .document-library-head{ align-items:flex-start; flex-direction:column; padding:20px; }
  .document-library-grid{ grid-template-columns:1fr; padding:12px; }
  .document-viewer{ padding:0; }
  .document-viewer-panel{ height:100dvh; border-radius:0; }
  .admin-tabs{ margin-bottom:16px; }
  .lookup-form{ flex-direction:column; }
  .lookup-form .btn{ width:100%; }
  .lookup-hero{ grid-template-columns:1fr; gap:12px; }
  .lookup-page .lookup-heading{ padding:28px 22px; border-radius:7px; }
  .lookup-page .lookup-heading h1{ font-size:36px; }
  .lookup-help-card{ padding:19px; border-radius:7px; }
  .lookup-search-card{ padding:14px; border-radius:7px; }
  .lookup-search-card > div{ flex-direction:column; }
  .lookup-ticket-top{ align-items:flex-start; flex-direction:column; }
  .lookup-ticket-top,.lookup-grid,.lookup-progress{ padding-right:18px; padding-left:18px; }
  .lookup-grid{ grid-template-columns:1fr; gap:13px; }
  .lookup-warranty{ margin-right:18px; margin-left:18px; padding:16px; }
  .panic-results-head{ align-items:flex-start; flex-direction:column; gap:3px; }
  .panic-suggestion{ grid-template-columns:1fr auto; gap:6px 10px; }
  .panic-suggestion > span{ grid-column:1 / -1; grid-row:2; }
  .panic-result-card{ border-radius:7px; }
  .panic-result-card summary{ align-items:flex-start; gap:8px; padding:16px; }
  .panic-result-summary-copy{ grid-template-columns:1fr; gap:9px; }
  .panic-result-summary-copy em{ white-space:normal; }
  .panic-result-toggle{ display:none; }
  .panic-result-detail{ grid-template-columns:1fr; gap:0; padding:0 16px 16px; }
  .panic-result-detail small{ justify-self:start; margin-top:12px; }
  .lookup-stage-list{ grid-template-columns:1fr; gap:0; }
  .lookup-stage{ display:grid; grid-template-columns:31px 1fr; gap:10px; padding:0 0 16px; }
  .lookup-stage:not(:last-child)::after{ top:30px; right:auto; bottom:0; left:14px; width:2px; height:auto; }
  .lookup-stage strong{ margin-top:5px; }
  .lookup-stage p{ max-width:none; }
  .lookup-my-tickets a{ align-items:flex-start; flex-direction:column; gap:4px; }
}

@media print{
  body:has(.repair-print-sheet) > *:not(.repair-print-sheet){ display:none !important; }
  .repair-print-sheet{ display:block; width:80mm; margin:0 auto; padding:5mm; color:#111; background:#fff; font-family:Arial,sans-serif; text-align:center; }
  .repair-print-sheet > img:first-child{ width:13mm; height:13mm; margin:0 auto 2mm; }
  .repair-print-sheet h1{ margin:0 0 2mm; color:#176d42; font-size:15px; }
  .repair-print-sheet > strong{ font-size:10px; }
  .repair-print-code{ margin:4mm 0 2mm; color:#176d42; font-size:18px; font-weight:800; letter-spacing:.08em; }
  .repair-print-sheet .repair-qr{ width:38mm; height:38mm; margin:0 auto 3mm; }
  .repair-print-sheet p{ margin:1.5mm 0; font-size:10px; line-height:1.35; text-align:left; }
}

@media(max-width:700px){
  body{ padding-bottom:76px; background:#062719; background-image:none; }
  body.tab-ui-active{ background:#f7faf8; }
  body.tab-ui-active header{
    --text:#f7faf8; --text-dim:#acd2b7; --line:#285e40; --line-strong:#477a61; --amber:#63c996;
    background:rgba(5,39,25,.98); border-bottom:0; color:#f7faf8;
  }
  body.tab-ui-active header .logo{ color:#f7faf8; }
  body.tab-ui-active header nav.links{ color:#acd2b7; }
  body.tab-ui-active header .header-logout{ color:#acd2b7; }
  body.tab-ui-active header .menu-toggle{ border-color:#477a61; background:#0e3d29; }
  body.tab-ui-active header .menu-toggle span{ background:#f7faf8; }
  body.tab-ui-active [data-mobile-screen="home"],
  body.tab-ui-active [data-mobile-screen="pricing"],
  body.tab-ui-active [data-mobile-screen="request"]{
    --bg:#f7faf8; --bg-soft:#f2f7f3; --card:#fff; --card-hi:#f7fcf8;
    --line:#dce9df; --line-strong:#cadfd0; --text:#183b2d; --text-dim:#718878;
    --amber:#198754; --teal:#198754;
    background:#f7faf8 !important; color:#183b2d;
  }
  body.tab-ui-active [data-mobile-screen="services"],
  body.tab-ui-active [data-mobile-screen="pricing"],
  body.tab-ui-active [data-mobile-screen="request"]{
    padding-top:30px;
    padding-bottom:42px;
  }
  body.tab-ui-active [data-mobile-screen="services"] .sec-head,
  body.tab-ui-active [data-mobile-screen="pricing"] .sec-head,
  body.tab-ui-active [data-mobile-screen="request"] .sec-head{ margin-bottom:24px; }
  body.tab-ui-active .tab-screen-with-app-head{ padding-top:0 !important; }
  body.tab-ui-active #bangia{ border-top:0 !important; border-bottom:0 !important; }
  body.tab-ui-active footer{ border-top-color:transparent; }
  body.tab-ui-active footer .footer-bottom{ border-top-color:transparent; }
  body.tab-ui-active .tab-app-head{ display:block; }
  body.tab-ui-active .tab-screen-with-app-head > .wrap:not(.app-page-body){ padding-top:28px; }
  body.tab-ui-active .tab-screen-with-app-head .sec-head{ display:none; }
  body.tab-ui-active .tab-screen-with-app-head .cta-band{ margin-top:0; }
  body.tab-ui-active .hero{ padding-top:48px; }
  body.tab-ui-active .btn-primary{ background:#198754; color:#fff; box-shadow:0 9px 20px -12px rgba(25,135,84,.7); }
  body.tab-ui-active .btn-ghost{ border-color:#bed8c8; color:#183b2d; background:#fff; }
  body.tab-ui-active .tab-btn{ background:#fff; border:1px solid #d4e6da; color:#5d8069; }
  body.tab-ui-active .tab-btn.active{ background:#198754; border-color:#198754; color:#fff; }
  body.tab-ui-active .price-tabs{ gap:6px; margin-bottom:16px; padding:0; background:transparent; border:0; }
  body.tab-ui-active .tab-btn{ min-height:38px; border-radius:4px; box-shadow:none; }
  body.tab-ui-active .price-table{ border-color:#d4e6da; background:#fff; box-shadow:0 10px 24px -24px rgba(16,60,34,.45); }
  body.tab-ui-active .price-table thead th{ background:#eff7f1; color:#536e5a; }
  body.tab-ui-active .price-table td:last-child{ color:#198754; }
  body.tab-ui-active .hero-media{ border-color:#d9e9df; box-shadow:0 18px 34px -28px rgba(16,60,34,.55); }
  body.tab-ui-active .stats{ background:#fff; }
  body.tab-ui-active .svc-card,
  body.tab-ui-active .test-card,
  body.tab-ui-active .why-visual{ box-shadow:none; }
  .wrap{ padding:0 20px; }
  .logo{ font-size:19px; }
  .logo-mark{ flex-basis:35px; width:35px; height:40px; }
  .hero{ padding:60px 0 70px; }
  .hero-grid{ gap:50px; }
  .hero h1{ font-size:clamp(39px, 11vw, 52px); line-height:1.08; letter-spacing:-.052em; }
  .hero p.lead{ font-size:15px; line-height:1.7; }
  .hero-actions{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:28px; }
  .hero-actions .btn{ padding:13px 10px; font-size:12px; }
  .trust-row{ display:grid; grid-template-columns:1fr; gap:8px; }
  .trust-item{ font-size:11px; }
  .hero-media{ min-height:0; aspect-ratio:16 / 9; border-radius:7px; }
  .hero-media img{ min-height:0; object-position:left 34%; transform:none; }
  .workshop-gallery{ padding:50px 0; }
  .gallery-heading{ display:block; margin-bottom:20px; }
  .gallery-heading p{ margin-top:7px; }
  .gallery-grid{ display:grid; position:static; aspect-ratio:auto; overflow:visible; grid-template-columns:1fr 1fr; gap:8px; border:0; border-radius:0; background:transparent; }
  .gallery-item, .gallery-item-wide{ position:relative; inset:auto; grid-column:span 1; min-height:142px; border:1px solid var(--line); border-radius:6px; opacity:1; pointer-events:auto; }
  .gallery-item img{ min-height:142px; }
  .gallery-item figcaption{ padding:21px 9px 8px; font-size:10px; }
  .hero-media-caption{ left:18px; bottom:17px; }
  .hero-media-caption strong{ font-size:16px; }
  .quick-actions{ padding:18px 0 24px; }
  .quick-actions::before{ top:-220px; right:-185px; width:340px; height:340px; border-width:38px; }
  .quick-actions-grid{ grid-template-columns:1fr; gap:10px; }
  .quick-action-card{ min-height:96px; padding:16px; border-radius:12px; }
  .quick-action-icon{ flex-basis:50px; width:50px; height:50px; }
  .quick-action-copy strong{ font-size:17px; }
  .quick-action-copy small{ font-size:11px; }
  .quick-product-strip{ margin-top:18px; padding-top:16px; }
  /* Mobile dùng nền sáng nên đổi riêng về thang xanh/navy giống phần hero bên dưới. */
  body.tab-ui-active .quick-product-strip{ border-top-color:#dbeae0; }
  body.tab-ui-active .quick-product-strip-head span{ color:#198754; }
  body.tab-ui-active .quick-product-strip-head strong{ color:#183b2d; }
  body.tab-ui-active .quick-product-more{ color:#198754; }
  body.tab-ui-active .quick-product-more:hover{ color:#156b40; }
  .quick-product-strip-head strong{ font-size:17px; }
  .quick-product-more{ font-size:10px; text-align:right; }
  .quick-product-more span{ font-size:17px; }
  .quick-product-rail-nav{ width:36px; height:36px; font-size:27px; }
  .quick-product-rail-nav.is-prev{ left:3px; }
  .quick-product-rail-nav.is-next{ right:3px; }
  .quick-product-rail{ gap:10px; }
  .quick-product-pagination{ margin-top:2px; }
  body.tab-ui-active .quick-product-page{ background:#b2dfc5; }
  body.tab-ui-active .quick-product-page.is-active{ background:#198754; }
  .quick-product-rail > .product-card{ flex-basis:286px; grid-template-columns:84px minmax(0,1fr); gap:11px; padding:11px; }
  .quick-product-rail .product-visual{ min-height:122px; }
  .quick-product-rail .product-info h2{ font-size:15px; }
  .stats{ padding:28px 0; }
  .stats-grid{ gap:22px 8px; }
  .stat-cell{ padding:0 6px; }
  .stat-num{ font-size:31px; }
  .stat-label{ font-size:10px; line-height:1.35; }
  section{ padding:68px 0; }
  .sec-head{ margin-bottom:32px; }
  .sec-head h2{ font-size:33px; line-height:1.15; }
  .sec-head p{ font-size:14px; }
  .svc-grid{ gap:10px; }
  .svc-card{ padding:22px 20px; border-radius:6px; }
  .svc-index{ margin-bottom:12px; }
  .svc-card p{ font-size:13px; }
  .price-tabs{ flex-wrap:nowrap; width:calc(100% + 40px); overflow-x:auto; margin-left:-20px; padding:0 20px 5px; }
  .price-tabs{ justify-content:center; width:100%; margin-left:0; padding-left:0; padding-right:0; }
  .tab-btn{ white-space:nowrap; padding:10px 15px; }
  .price-panel{ overflow-x:auto; margin:0 -20px; padding:0 20px; }
  .price-table{ min-width:590px; border-radius:6px; }
  .price-table thead th, .price-table td{ padding:13px 15px; font-size:12px; }
  .price-note{ font-size:12px; }
  .process{ gap:0; }
  .proc-step{ display:grid; grid-template-columns:58px 1fr; column-gap:14px; padding:0 0 25px; margin-bottom:25px; border-bottom:1px dashed var(--line); }
  .proc-step:last-child{ margin-bottom:0; padding-bottom:0; border-bottom:none; }
  .proc-num{ grid-row:span 2; font-size:31px; margin:0; }
  .proc-step h3{ margin:5px 0 7px; font-size:16px; }
  .proc-step p{ font-size:13px; }
  .why-grid{ gap:30px; }
  .why-item{ gap:12px; padding:16px 0; }
  .why-num{ width:30px; font-size:23px; }
  .why-item h4{ font-size:15px; }
  .why-visual{ padding:20px; border-radius:6px; }
  .why-visual-row{ padding:13px 0; }
  .why-visual-row span:first-child{ font-size:11px; }
  .why-visual-row span:last-child{ font-size:13px; }
  .test-grid{ gap:10px; }
  .test-card{ padding:22px; border-radius:6px; }
  .location-panel{ grid-template-columns:1fr; }
  .location-panel > div{ padding:15px; border-right:none; border-bottom:1px solid var(--line); }
  .location-map-link{ justify-content:space-between; min-height:48px; padding:0 15px; }
  .faq-q{ padding:18px 0; font-size:15px; gap:16px; }
  .contact-grid{ gap:14px; }
  .contact-card{ padding:22px 20px; border-radius:6px; }
  .contact-row{ padding:14px 0; }
  .contact-row .ci{ width:34px; height:34px; }
  .map-frame, .map-frame iframe{ min-height:250px; }
  .cta-band{ margin:0 20px; border-radius:7px; padding:46px 22px; }
  .cta-band h2{ font-size:30px; }
  .cta-band p{ font-size:14px; }
  footer{ padding:48px 0 24px; }
  .footer-grid{ gap:28px; margin-bottom:30px; }
  .footer-bottom{ font-size:10px; line-height:1.55; }
  .nav-cta .btn-primary, .menu-toggle{ display:none; }
  body.tab-ui-active .tab-screen,
  body.tab-ui-active .mobile-app-screen{ display:none !important; }
  body.tab-ui-active .tab-screen.is-active,
  body.tab-ui-active .mobile-app-screen.is-active{ display:block !important; }
  header{ padding-bottom:50px; }
  header .nav{ height:60px; }
  header nav.links{ position:absolute; top:60px; left:0; right:0; z-index:60; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; padding:7px 6px; border:0; border-top:1px solid #235b3d; border-radius:0; background:#092d20; box-shadow:0 10px 18px -18px rgba(0,0,0,.8); opacity:1; visibility:visible; transform:none; pointer-events:auto; }
  header nav.links a{ min-height:35px; justify-content:center; gap:4px; padding:0 3px; border:0; border-radius:0; color:#e6f4e9; font-size:10px; }
  header nav.links a svg{ width:16px; height:16px; color:#87d3a8; }
  header .menu-toggle{ display:none; }
  /* Giữ cả thanh điều hướng trên và dock dưới trên trang quản trị như các giao diện khác. */
  body.admin-interface header{ display:block; }
  .mobile-tabs{ display:grid; grid-template-columns:repeat(6,1fr); position:fixed; left:0; right:0; width:100%; bottom:0; z-index:70; min-height:68px; padding:6px 2px calc(6px + env(safe-area-inset-bottom)); background:rgba(5,39,25,.98); border-top:0; box-shadow:0 -10px 24px -24px rgba(0,0,0,.65); backdrop-filter:blur(14px); }
  .mobile-tab{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-width:0; color:#acd2b7; font-size:9px; font-weight:700; line-height:1.25; }
  .mobile-tab svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
  .mobile-tab.active{ color:#6bcd98; }
  .floating-socials{ right:14px; bottom:82px; gap:8px; }
  .floating-social{ width:52px; height:52px; justify-content:center; padding:0; border-radius:50%; }
  .floating-social span{ display:none; }
  .floating-social svg{ width:25px; height:25px; }

  .mobile-app-screen{ min-height:0; background:#f7faf8; color:#183b2d; padding:0 0 28px; }
  .app-page-head{ position:relative; overflow:hidden; padding:34px 20px 30px; color:#fff; background:linear-gradient(135deg,#0b3322,#146440); }
  .app-page-head::after{ content:""; position:absolute; right:-54px; top:-62px; width:190px; height:190px; border:30px solid rgba(48,165,94,.23); border-radius:50%; }
  .app-page-head > *{ position:relative; z-index:1; }
  .app-kicker{ display:inline-block; padding:5px 9px; border:1px solid rgba(255,255,255,.25); border-radius:4px; color:#b8ebd0; font-size:10px; font-weight:700; letter-spacing:.03em; }
  .app-page-head h1{ margin:14px 0 8px; color:#fff; font-size:31px; line-height:1.1; letter-spacing:-.04em; }
  .app-page-head p{ max-width:340px; margin:0; color:rgba(255,255,255,.72); font-size:13px; line-height:1.65; }
  .app-page-head-compact{ padding-bottom:27px; }
  .app-page-body{ padding:18px 16px 28px; }
  .app-form-card{ padding:18px; border:1px solid #e1ece4; border-radius:7px; background:#fff; box-shadow:0 12px 30px -28px rgba(16,60,34,.55); }
  .app-form-card label{ display:block; margin-bottom:8px; color:#536e5a; font-size:12px; font-weight:700; }
  .app-form-card input{ width:100%; height:46px; padding:0 13px; border:1px solid #d1e3d6; border-radius:4px; color:#183b2d; font:inherit; font-size:14px; outline:0; }
  .app-form-card input:focus{ border-color:#198754; box-shadow:0 0 0 3px rgba(25,135,84,.12); }
  .app-primary-button,.app-map-button{ display:flex; align-items:center; justify-content:center; width:100%; min-height:45px; margin-top:12px; border:0; border-radius:4px; background:#198754; color:#fff; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
  .app-note{ display:flex; gap:10px; margin-top:16px; padding:13px; border-left:3px solid #72cda0; background:#e8f6ec; color:#557c66; font-size:12px; line-height:1.55; }
  .app-note span{ display:grid; flex:0 0 18px; width:18px; height:18px; place-items:center; border-radius:50%; background:#198754; color:#fff; }
  .app-note span svg{ width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .app-note p{ margin:0; }
  .app-news-list{ display:grid; gap:11px; }
  .app-news-card{ display:grid; grid-template-columns:31px 62px 1fr 18px; gap:10px; align-items:start; padding:12px; border:1px solid #e1ece4; border-radius:6px; background:#fff; color:inherit; }
  .app-news-card:hover{ border-color:#9dcea9; }
  .app-news-index{ color:#198754; font-size:11px; font-weight:800; }
  .app-news-thumb{ width:62px; height:62px; border-radius:4px; object-fit:cover; background:#edf2ee; }
  .app-news-tag{ color:#198754; font-size:10px; font-weight:700; }
  .app-news-card h2{ margin:5px 0; color:#183b2d; font-size:15px; line-height:1.35; letter-spacing:-.02em; }
  .app-news-card p{ margin:0; color:#718878; font-size:11px; line-height:1.5; }
  .app-arrow{ display:grid; align-self:center; color:#198754; }
  .app-arrow svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .news-status{ padding:20px 0; color:#718878; font-size:13px; text-align:center; }
  .app-store-card{ display:flex; align-items:center; gap:12px; padding:18px 0; border-bottom:1px solid #dfeae2; }
  .app-store-mark{ display:grid; width:45px; height:45px; place-items:center; border-radius:5px; background:#198754; color:#fff; font-size:13px; font-weight:800; }
  .app-store-card strong{ display:block; color:#183b2d; font-size:16px; }
  .app-store-card p{ margin:3px 0 0; color:#718878; font-size:11px; }
  .app-detail-row{ padding:15px 0; border-bottom:1px solid #dfeae2; }
  .app-detail-row span{ display:block; margin-bottom:4px; color:#718878; font-size:11px; }
  .app-detail-row strong{ display:block; color:#294f3a; font-size:13px; line-height:1.5; }
  .app-map-button{ justify-content:space-between; padding:0 15px; text-decoration:none; }
  .app-map-button span{ font-size:17px; }
  .account-switch{ display:grid; grid-template-columns:1fr 1fr; margin-bottom:18px; border-bottom:1px solid #d9e8dd; }
  .account-switch-btn{ position:relative; padding:11px 4px; border:0; background:transparent; color:#718878; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
  .account-switch-btn.is-active{ color:#198754; }
  .account-switch-btn.is-active::after{ content:""; position:absolute; right:22px; bottom:-1px; left:22px; height:2px; background:#198754; }
  .account-form{ display:none; }
  .account-form.is-active{ display:flex; flex-direction:column; }
  .account-form label{ margin:14px 0 7px; color:#536e5a; font-size:12px; font-weight:700; }
  .account-form input{ width:100%; height:46px; padding:0 13px; border:1px solid #d1e3d6; border-radius:4px; color:#183b2d; font:inherit; font-size:14px; outline:0; }
  .account-form input:focus{ border-color:#198754; box-shadow:0 0 0 3px rgba(25,135,84,.12); }
  .account-form .app-primary-button{ margin-top:20px; }
  .account-forgot{ align-self:flex-end; margin-top:10px; color:#198754; font-size:12px; font-weight:600; }
  .account-helper{ margin:20px 0 0; color:#718878; font-size:11px; line-height:1.55; text-align:center; }
  .app-auth-message{ margin-bottom:13px; padding:11px 12px; border-radius:4px; font-size:12px; line-height:1.5; }
  .app-auth-message-ok{ border:1px solid #9dcaaf; background:#eaf8ef; color:#31724a; }
  .app-auth-message-err{ border:1px solid #edb4b4; background:#fff0f0; color:#a34141; }
.app-admin-link{ display:flex; align-items:center; justify-content:center; min-height:42px; margin-bottom:14px; border:1px solid #198754; border-radius:4px; color:#198754; font-size:13px; font-weight:700; }
.app-notification-badge{ margin-left:8px; }
  .app-logout-link{ display:flex; align-items:center; justify-content:center; min-height:42px; border:1px solid #d1e3d6; border-radius:4px; color:#536e5a; font-size:13px; font-weight:700; }
  .account-signed-in{ display:flex; align-items:center; gap:12px; margin-bottom:14px; padding:15px; border:1px solid #dceee2; border-radius:6px; background:#fff; }
  .account-signed-in strong{ display:block; color:#183b2d; font-size:15px; }
  .account-signed-in p{ margin:2px 0 0; color:#718878; font-size:11px; }
  .account-user-icon{ display:grid; width:38px; height:38px; place-items:center; border-radius:50%; background:#e8f6ec; color:#198754; }
  .account-user-icon svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .mobile-tab.is-signed-in:not(.active){ color:#acd2b7; }
  .admin-page{ min-height:100dvh; padding:28px 0 92px; background:#f7faf8; color:#183b2d; }
  .admin-heading{ display:block; margin-bottom:20px; }
  .admin-heading h1{ font-size:33px; color:#183b2d; }
  .admin-heading p{ color:#718878; font-size:14px; }
  .admin-heading form{ margin-top:16px; }
  .admin-heading-actions{ align-items:flex-start; justify-content:flex-start; margin-top:14px; }
  .admin-heading-actions form{ margin-top:0; }
  .admin-notification-status{ max-width:none; flex:1 1 150px; }
  .admin-heading .btn{ border-color:#bed8c8; color:#183b2d; background:#fff; }
  .admin-tabs{ gap:5px; margin-bottom:16px; padding:5px; border-color:#dfeae2; border-radius:6px; background:#fff; }
  .admin-tab{ min-height:38px; padding:0 12px; font-size:11px; }
  .admin-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .admin-kpi{ padding:13px; border-color:#dfeae2; background:#fff; }
  .admin-kpi span{ color:#718878; font-size:11px; }
  .admin-kpi strong{ color:#183b2d; font-size:23px; }
  .admin-kpi-attention strong{ color:#198754; }
  .admin-visitor-today-count{ align-items:flex-start; margin-top:14px; font-size:28px; }
  .admin-visitor-row{ grid-template-columns:56px minmax(0,1fr) 34px; gap:8px; font-size:12px; }
  .admin-card{ margin-top:14px; padding:18px; border-color:#dfeae2; border-radius:6px; background:#fff; }
  .admin-card h2{ color:#183b2d; font-size:19px; }
  .admin-settings{ grid-template-columns:1fr; gap:13px; }
  .admin-settings label{ color:#536e5a; }
  .admin-settings input{ border-color:#d1e3d6; background:#fff; color:#183b2d; }
  .admin-table{ color:#294f3a; font-size:12px; }
  .admin-table th,.admin-table td{ min-width:120px; padding:11px 9px; border-color:#e3ece5; }
  .admin-table td small{ color:#718878; }
  .admin-inline-form select,.admin-inline-form button{ border-color:#d1e3d6; background:#fff; color:#536e5a; }
  .admin-inline-form button{ color:#198754; border-color:#198754; }
  .admin-section-heading{ display:block; }
  .admin-section-heading p{ color:#718878; font-size:12px; }
  .admin-section-action{ margin-top:12px; }
  .admin-price-group{ padding:12px; border-color:#dfeae2; background:#f7faf8; }
  .admin-price-tab-form input,.admin-price-row-form input,.admin-price-add-form input,.admin-price-new-tab input{ border-color:#d1e3d6; background:#fff; color:#183b2d; }
  .admin-price-tab-form input,.admin-price-add-form input{ flex:1 1 100%; }
  .admin-price-tab-form button,.admin-price-add-form button{ width:100%; }
  .admin-price-row-form{ align-items:stretch; }
  .admin-price-row-form input{ flex:1 1 100% !important; }
  .admin-price-row-form button{ flex:1 1 calc(50% - 4px); }
  .admin-price-new-tab input,.admin-price-new-tab .btn{ flex:1 1 100%; width:100%; }
}

/* iPad dọc: không giữ card desktop hai cột quá rộng, tránh cảm giác toàn bộ nội dung dồn về bên trái. */
@media (min-width:701px) and (max-width:900px){
  html,body{ width:100%; max-width:100%; overflow-x:hidden; }
  .wrap{ width:100%; padding-right:24px; padding-left:24px; }
  header{ padding-bottom:48px; }
  header .nav{ height:62px; gap:12px; }
  .nav-cta{ gap:10px; }
  /* iPad cũng hiển thị thẳng hai lối tắt quan trọng, không giấu trong menu hamburger. */
  header nav.links{ position:absolute; top:62px; right:0; left:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:7px 24px; border:0; border-top:1px solid #235b3d; border-radius:0; background:#092d20; box-shadow:0 10px 18px -18px rgba(0,0,0,.8); opacity:1; visibility:visible; transform:none; pointer-events:auto; }
  header nav.links a{ min-height:33px; justify-content:center; padding:0 8px; border:0; color:#e6f4e9; font-size:11px; }
  header nav.links a svg{ width:17px; height:17px; color:#87d3a8; }
  header .menu-toggle{ display:none; }
  body.desktop-tab-view .app-page-body{ width:100%; max-width:100%; padding:28px 24px 60px; }
  /* Các tab Tra cứu / Tài khoản trước đây dùng khung 650px canh trái như PC.
     Trên iPad, đưa về trục giữa để các tab đều cân với header và dock. */
  body.desktop-tab-view .app-form-card,
  body.desktop-tab-view .app-note,
  body.desktop-tab-view .account-switch,
  body.desktop-tab-view .account-form,
  body.desktop-tab-view .account-helper,
  body.desktop-tab-view .app-auth-message,
  body.desktop-tab-view .app-admin-link,
  body.desktop-tab-view .app-logout-link,
  body.desktop-tab-view .account-signed-in{ width:100%; max-width:680px; margin-right:auto; margin-left:auto; }
  body.desktop-tab-view .app-page-body .price-tabs{ justify-content:center; }
  body.desktop-tab-view .app-news-list{ grid-template-columns:1fr; }
  body.desktop-tab-view .product-list{ grid-template-columns:1fr; max-width:680px; margin-right:auto; margin-left:auto; }
  body.desktop-tab-view .product-card{ grid-template-columns:142px minmax(0,1fr); }
  body:not(.menu-open) .mobile-tabs{ width:calc(100vw - 32px); }
}

.news-reader{ min-height:calc(100vh - 78px); padding:76px 24px; background:var(--bg); }
.news-reader-card{ max-width:820px; margin:0 auto; padding:48px; border:1px solid var(--line); border-radius:10px; background:var(--card); box-shadow:0 24px 60px -48px rgba(0,0,0,.5); }
.news-reader-back{ display:inline-flex; align-items:center; gap:7px; margin-bottom:28px; color:var(--amber); font-size:12px; font-weight:700; text-decoration:none; }
.news-reader-back svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.news-reader-kicker{ display:block; margin-bottom:12px; color:var(--amber); font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.news-reader h1{ max-width:760px; margin:0; color:var(--text); font-size:clamp(31px,4.4vw,52px); line-height:1.08; letter-spacing:-.045em; }
.news-reader-date{ margin:16px 0 30px; color:var(--text-dim); font-size:13px; }
.news-reader-image{ display:block; width:100%; max-height:470px; margin:0 0 30px; border-radius:7px; object-fit:cover; background:#e9efe9; }
.news-reader-summary{ padding:24px 26px; border-left:3px solid var(--amber); background:rgba(206,169,91,.1); }
.news-reader-summary h2{ margin:0 0 9px; color:var(--text); font-size:17px; }
.news-reader-summary p{ margin:0; color:var(--text-dim); font-size:15px; line-height:1.8; }
.news-reader-summary .news-reader-paragraph{ margin-top:16px; }

@media(max-width:700px){
  .news-reader{ min-height:100dvh; padding:28px 16px 92px; background:#f7faf8; }
  .news-reader-card{ padding:24px 18px; border-color:#e1ece4; border-radius:7px; background:#fff; }
  .news-reader-back{ margin-bottom:24px; color:#198754; }
  .news-reader-kicker{ margin-bottom:9px; color:#198754; font-size:10px; }
  .news-reader h1{ color:#183b2d; font-size:31px; }
  .news-reader-date{ margin:12px 0 22px; color:#718878; font-size:12px; }
  .news-reader-image{ max-height:280px; margin-bottom:22px; border-radius:5px; }
  .news-reader-summary{ padding:18px; border-left-color:#198754; background:#e8f6ec; }
  .news-reader-summary h2{ color:#183b2d; font-size:15px; }
  .news-reader-summary p{ color:#536e5a; font-size:13px; line-height:1.7; }
  .news-reader-summary .news-reader-paragraph{ margin-top:14px; }
}

@media(max-width:380px){
  header nav.links a{ gap:3px; padding-right:1px; padding-left:1px; font-size:9px; }
  .nav-cta .btn-primary{ display:none; }
  .hero h1{ font-size:38px; }
  .ticket-top, .ticket-body{ padding-left:16px; padding-right:16px; }
  .ticket-total{ margin:0 16px; }
}

/* ---------- DARK GREEN THEME ---------- */
:root{
  --bg:#07140e;
  --bg-soft:#0c2116;
  --card:#10281b;
  --card-hi:#153622;
  --line:#25543a;
  --line-strong:#3b8058;
  --text:#f0faf2;
  --text-dim:#bad6c1;
  --amber:#5cdb8f;
  --teal:#8af0b2;
}

body{ background:var(--bg); color:var(--text); }
body::before{ background:radial-gradient(ellipse 68% 36% at 92% 0%,rgba(64,190,112,.12),transparent 70%),radial-gradient(ellipse 45% 30% at 0% 45%,rgba(39,142,79,.1),transparent 70%); }
header{ background:rgba(5,25,15,.92); border-bottom-color:var(--line); }
header nav.links,header .header-logout{ color:#b8d6c1; }
header .header-qr-button{ border-color:#5e9e76; color:#d8eee0; }
.nav-links a:hover,.header-logout:hover,.header-qr-button:hover{ color:var(--amber); }
.btn-primary{ background:var(--amber); color:#04100a; box-shadow:0 9px 20px -12px rgba(40,190,105,.62); }
.btn-primary:hover{ background:#76e9a3; color:#04100a; }
.btn-ghost{ color:var(--text); border-color:var(--line-strong); }
.menu-toggle{ background:var(--card); border-color:var(--line); }
.menu-toggle span{ background:var(--text); }

.ticket,.stats,.svc-card,.test-card,.location-panel,.contact-card,.repair-card,.repair-ticket-row,
.lookup-result,.lookup-help-card,.lookup-search-card,.panic-result-card,.news-reader-card,
.admin-tabs,.admin-card,.admin-kpi,.admin-document-row,.document-library-card,.qr-scanner-card,
.product-card,.product-detail-card,.product-not-found,.product-full-specs,.app-form-card,
.app-news-card,.account-signed-in{ background:var(--card) !important; color:var(--text); border-color:var(--line); }
.ticket-top,.ticket-row,.location-panel > div{ border-color:var(--line); }
.ticket-top .tt-id,.location-panel strong,.location-panel a,.lookup-grid strong,.repair-ticket-row span,
.product-info h2,.product-detail-info h1,.app-news-card h2,.account-signed-in strong{ color:var(--text); }
.ticket-top .tt-label,.ticket-row span:first-child,.hero p.lead,.trust-item,.sec-head p,
.lookup-help-card span,.lookup-grid small,.news-reader-date,.product-meta,.app-news-card p,
.account-signed-in p{ color:var(--text-dim); }

.quick-actions{ background:linear-gradient(128deg,#061c10 0%,#0e3b25 58%,#14613c 100%); border-bottom-color:#347b53; }
.quick-action-lookup{ background:linear-gradient(135deg,#198754,#36a86c); }
.quick-action-request{ background:linear-gradient(135deg,#1e9b63,#1c8050); }
.quick-action-news{ background:linear-gradient(135deg,#155438,#24764b); }
.hero-media,.gallery-grid{ border-color:var(--line); }
.svc-card:hover{ background:var(--card-hi) !important; border-color:var(--teal); }
.tab-btn,.product-filter{ background:var(--card); color:var(--text-dim); border-color:var(--line); }
.tab-btn.active,.product-filter.is-active{ background:var(--amber); color:#04100a; border-color:var(--amber); }
.price-table{ background:var(--card); color:var(--text); border-color:var(--line-strong); }
.price-table thead th{ background:var(--bg-soft); color:var(--text-dim); border-color:var(--line); }
.price-table td{ border-color:var(--line); }
.price-table td:last-child{ color:var(--amber); }
.why-visual-row,.lookup-progress{ border-color:var(--line); }
.why-visual-row span:first-child,.price-note,.proc-step p,.why-item p{ color:var(--text-dim); }
.why-visual-row span:last-child{ color:var(--teal); }
.cta-band{ background:linear-gradient(135deg,#0b301e,#176b40); border-color:#3e8b5c; }
.cta-band .btn-primary{ background:#e8f5eb; color:#176b40; }
footer{ --text:#f0faf2; --text-dim:#c0ddc8; --line:#25543a; background:#081b10; }

.repair-form input,.repair-form textarea,.repair-ticket-row select,.admin-settings input,
.admin-inline-form select,.admin-inline-form button,.admin-price-tab-form input,
.admin-price-row-form input,.admin-price-add-form input,.admin-price-new-tab input,
.lookup-search-card input,.qr-manual-form input,.app-form-card input,
.account-form input{ background:var(--bg-soft) !important; color:var(--text) !important; border-color:var(--line-strong) !important; }
input::placeholder,textarea::placeholder{ color:#789985; }
.lookup-result-error,.repair-alert-error,.repair-alert-ok,.repair-created{ background:#102f20 !important; border-color:#3c8a5d; color:#bce8c9; }
.lookup-ticket-top{ background:#0e2a1b; }
.lookup-ticket-top b{ background:#194d31; border-color:#3c8a5d; color:#8be0a9; }
.lookup-warranty,.product-detail-price,.products-note,.app-note,.news-reader-summary,
.admin-warranty-create,.admin-product-import{ background:#123621 !important; border-color:#3c8a5d; color:#c6ead0; }
.lookup-warranty p,.news-reader-summary p,.app-note,.products-note{ color:#afd0b8; }
.lookup-stage{ color:#6f9278; }
.lookup-stage:not(:last-child)::after{ background:#285d40; }
.lookup-stage > span{ background:var(--card); border-color:#477a61; color:#a8c9b1; }
.lookup-stage.is-done > span{ background:#249b5a; border-color:#249b5a; color:#fff; }
.lookup-stage.is-current strong,.lookup-progress h2{ color:var(--text); }
.panic-suggestions{ background:var(--card); border-color:var(--line-strong); }
.panic-suggestions-head{ background:var(--bg-soft); border-color:var(--line); }
.panic-suggestions-head span{ color:#c8ead2; }
.panic-suggestion{ background:var(--card); border-color:#1d4430; }
.panic-suggestion:hover,.panic-suggestion:focus-visible{ background:var(--card-hi); }
.panic-result-card summary:hover{ background:var(--card-hi); }
.panic-result-summary-copy em{ color:#b8d6c1; }
.panic-result-detail > div{ border-color:var(--line); }
.panic-result-detail p{ color:#e0f4e5; }
.panic-result-detail small,.panic-suggestion small{ background:#194d31; color:#9de2b4; }
.panic-result-card code,.panic-suggestion code{ background:#173d29; border-color:#398a5c; color:#8fe2aa; }

.document-viewer-panel{ background:var(--card); }
.document-viewer-panel iframe{ background:var(--bg-soft); }
.document-file-mark,.qr-scanner-close,.product-contact{ background:#194d31; color:#9de2b4; }
.product-contact{ border-color:#398a5c; }
.product-contact:hover{ background:#236b42; border-color:#62d891; }
.product-visual,.product-detail-visual{ background:linear-gradient(145deg,#123b25,#1b6841); }
.product-visual.is-samsung,.product-detail-visual.is-samsung{ background:linear-gradient(145deg,#154536,#26785b); }
.product-detail-stock{ background:rgba(9,30,18,.82); color:#bce8c9; }
.admin-product-item,.admin-product-search-item{ background:var(--card) !important; border-color:var(--line); color:var(--text); }
.admin-product-form input:not([type="checkbox"]),.admin-product-form textarea,.admin-product-form select{ background:var(--bg-soft) !important; color:var(--text); border-color:var(--line-strong); }
.admin-price-group{ background:#0c2116; border-color:var(--line); }
.admin-notification-row{ background:#102f20; color:#c5e8cf; border-color:#347b53; }
.admin-notification-row:hover{ background:#153d27; border-color:#55b779; color:#e8f5eb; }
.admin-notification-row small{ color:#a8c3af; }
.admin-notification-button{ background:var(--amber); border-color:#54bf7c; color:#06150c; }
.admin-notification-button:disabled{ background:var(--bg-soft); color:#8eaf99; border-color:var(--line); }

body.tab-ui-active [data-mobile-screen="home"],body.tab-ui-active [data-mobile-screen="pricing"],
body.tab-ui-active [data-mobile-screen="request"],body.tab-ui-active #bangia.tab-screen.is-active,
body.desktop-tab-view .mobile-app-screen,.mobile-app-screen,.admin-page,.news-reader{ background:var(--bg) !important; color:var(--text); }
body.tab-ui-active .app-form-card,body.tab-ui-active .app-news-card,body.tab-ui-active .account-signed-in,
body.desktop-tab-view .app-form-card,body.desktop-tab-view .app-news-card,
body.desktop-tab-view .account-signed-in,.news-reader-card{ background:var(--card) !important; color:var(--text); border-color:var(--line); }
body.tab-ui-active .price-table,body.desktop-tab-view .app-page-body .price-table{ background:var(--card); color:var(--text); border-color:var(--line); }
body.tab-ui-active .price-table thead th,body.desktop-tab-view .app-page-body .price-table thead th{ background:var(--bg-soft); color:var(--text-dim); }
body.tab-ui-active .stats{ background:var(--card); }
.app-page-body,.products-page-body{ color:var(--text); }
.app-form-card label,.account-form label,.app-news-card p,.news-status,.products-status,.products-note,
.account-helper{ color:var(--text-dim); }
.app-auth-message-ok{ background:#123621 !important; border-color:#3c8a5d; color:#bce8c9; }
.app-auth-message-err{ background:#3b1b1b !important; }
.account-switch{ border-color:var(--line); }
.account-switch-btn{ color:var(--text-dim); }
.account-switch-btn.is-active{ color:var(--amber); }
.account-switch-btn.is-active::after{ background:var(--amber); }
.mobile-tabs{ background:rgba(5,25,15,.98); border-color:#285d40; }
.mobile-tab{ color:#acd2b7; }
.mobile-tab.active{ color:#8af0b2; }

/* ---------- BURGUNDY DARK THEME ---------- */
:root{
  --bg:#10080b;
  --bg-soft:#1c0e13;
  --card:#26131a;
  --card-hi:#321923;
  --line:#5a2937;
  --line-strong:#8b4054;
  --text:#f7ecef;
  --text-dim:#d0b5bd;
  --amber:#c44762;
  --teal:#eb8197;
}

body,body.tab-ui-active,body.desktop-tab-view{ background:var(--bg) !important; color:var(--text); }
body::before{ background:radial-gradient(ellipse 68% 36% at 92% 0%,rgba(196,71,98,.13),transparent 70%),radial-gradient(ellipse 45% 30% at 0% 45%,rgba(120,38,61,.12),transparent 70%); }
header{ background:rgba(22,7,12,.94); border-bottom-color:var(--line); }
header nav.links,header .header-logout{ color:#e0c4ca; }
header nav.links{ background:rgba(28,14,19,.98); border-color:var(--line); }
header .header-qr-button{ border-color:#9b5367; color:#f2dfe3; }
header nav.links a:hover,.header-logout:hover,.header-qr-button:hover{ color:#ff9aae; }
.btn-primary{ background:var(--amber); color:#fff; box-shadow:0 9px 20px -12px rgba(196,71,98,.65); }
.btn-primary:hover{ background:#e0647e; color:#fff; }
.btn-ghost{ color:var(--text); border-color:var(--line-strong); }
.menu-toggle{ background:var(--card); border-color:var(--line); }
.menu-toggle span{ background:var(--text); }

body [class*="-card"]{ background:var(--card) !important; color:var(--text); border-color:var(--line); }
body .quick-action-card{ color:#fff; }
body .quick-action-lookup{ background:linear-gradient(135deg,#9f304b,#c44762) !important; }
body .quick-action-request{ background:linear-gradient(135deg,#9b3a58,#7d2944) !important; }
body .quick-action-news{ background:linear-gradient(135deg,#68253a,#963c55) !important; }
.ticket-top,.ticket-row,.location-panel > div{ border-color:var(--line); }
.ticket-top .tt-id,.location-panel strong,.location-panel a,.lookup-grid strong,.repair-ticket-row span,
.product-info h2,.product-detail-info h1,.app-news-card h2,.account-signed-in strong,
.news-reader h1,.news-reader-summary h2{ color:var(--text); }
.ticket-top .tt-label,.ticket-row span:first-child,.hero p.lead,.trust-item,.sec-head p,
.lookup-help-card span,.lookup-grid small,.news-reader-date,.product-meta,.app-news-card p,
.account-signed-in p,.price-note,.proc-step p,.why-item p{ color:var(--text-dim); }
.stats,.svc-card,.test-card,.location-panel,.contact-card,.repair-card,.repair-ticket-row,
.lookup-result,.lookup-help-card,.lookup-search-card,.news-reader-card,.admin-tabs,.admin-card,
.admin-kpi,.admin-document-row,.document-library-card,.qr-scanner-card,.product-card,
.product-detail-card,.product-not-found,.product-full-specs,.app-form-card,.app-news-card,
.account-signed-in{ background:var(--card) !important; }
.svc-card:hover{ background:var(--card-hi) !important; border-color:var(--teal); }
.tab-btn,.product-filter{ background:var(--card); color:var(--text-dim); border-color:var(--line); }
.tab-btn.active,.product-filter.is-active{ background:var(--amber); color:#fff; border-color:var(--amber); }
.price-table{ background:var(--card); color:var(--text); border-color:var(--line-strong); }
.price-table thead th{ background:var(--bg-soft); color:var(--text-dim); border-color:var(--line); }
.price-table td{ border-color:var(--line); }
.price-table td:last-child,.stat-num,.svc-index,.test-avatar{ color:var(--amber); }
.why-visual-row{ border-color:var(--line); }
.why-visual-row span:first-child{ color:var(--text-dim); }
.why-visual-row span:last-child{ color:var(--teal); }
.cta-band{ background:linear-gradient(135deg,#411622,#79263e); border-color:#98465d; }
.cta-band .btn-primary{ background:#f7ecef; color:#8b3048; }
.cta-band .btn-primary:hover{ background:#fff; }
.lookup-page .lookup-heading,.tab-app-head,.app-page-head{ background:linear-gradient(135deg,#3d1421,#8c304b) !important; }
footer{ --text:#f7ecef; --text-dim:#d0b5bd; --line:#5a2937; background:#16070c; }

body input,body textarea,body select{ background:var(--bg-soft) !important; color:var(--text) !important; border-color:var(--line-strong) !important; }
input::placeholder,textarea::placeholder{ color:#a77d88; }
.lookup-result-error,.repair-alert-error,.repair-alert-ok,.repair-created{ background:#3a1822 !important; border-color:#a14b62; color:#f2cbd3; }
.lookup-ticket-top{ background:#32131e; }
.lookup-ticket-top b{ background:#64263a; border-color:#b45a70; color:#ffc2ce; }
.lookup-warranty,.product-detail-price,.products-note,.app-note,.news-reader-summary,
.admin-warranty-create,.admin-product-import{ background:#3a1822 !important; border-color:#a14b62; color:#f2cbd3; }
.lookup-warranty p,.news-reader-summary p,.app-note,.products-note{ color:#dfbfc7; }
.lookup-stage{ color:#b17a89; }
.lookup-stage:not(:last-child)::after{ background:#6b3043; }
.lookup-stage > span{ background:var(--card); border-color:#9a5367; color:#e0b8c2; }
.lookup-stage.is-done > span{ background:#a33852; border-color:#c75b73; color:#fff; }
.lookup-stage.is-current strong,.lookup-progress h2{ color:var(--text); }

.panic-suggestions{ background:var(--card); border-color:var(--line-strong); }
.panic-suggestions-head{ background:var(--bg-soft); border-color:var(--line); }
.panic-suggestions-head span{ color:#f1cbd3; }
.panic-suggestion{ background:var(--card); border-color:#4a202e; }
.panic-suggestion:hover,.panic-suggestion:focus-visible,.panic-result-card summary:hover{ background:var(--card-hi); }
.panic-suggestion > span,.panic-result-summary-copy em{ color:#dfbec6; }
.panic-result-card code,.panic-suggestion code{ background:#4b1e2c; border-color:#a34a61; color:#ffb3c1; }
.panic-result-detail > div{ border-color:var(--line); }
.panic-result-detail p{ color:#f0dce0; }
.panic-result-detail small,.panic-suggestion small{ background:#64263a; color:#ffc0cc; }
.panic-result-toggle,.panic-result-card summary::after{ color:#f07f97; }

.document-viewer-panel{ background:var(--card); }
.document-viewer-panel iframe{ background:var(--bg-soft); }
.document-library-head,.document-viewer-head{ background:linear-gradient(135deg,#3d1421,#8c304b) !important; }
.document-file-mark,.qr-scanner-close,.product-contact{ background:#64263a; color:#ffc0cc; }
.product-contact{ border-color:#a34a61; }
.product-contact:hover{ background:#8d3049; border-color:#ee7890; }
.product-visual,.product-detail-visual{ background:linear-gradient(145deg,#3c1924,#762d45); }
.product-visual.is-samsung,.product-detail-visual.is-samsung{ background:linear-gradient(145deg,#3b202b,#75405a); }
.product-detail-stock{ background:rgba(29,8,14,.86); color:#f2cbd3; }
.floating-facebook,.floating-zalo{ background:#8c304b; }
.floating-zalo-ripple,.floating-zalo-ripple::after{ border-color:rgba(235,129,151,.5); }
.product-brand,.product-bottom strong,.product-store-condition,.product-back-link,
.product-detail-condition,.product-condition{ color:#ef8398; }
.admin-product-item,.admin-product-search-item{ background:var(--card) !important; border-color:var(--line); color:var(--text); }
.admin-price-group{ background:#1c0e13; border-color:var(--line); }
.admin-notification-row{ background:#3a1822; color:#f0dce0; border-color:#8f4056; }
.admin-notification-row:hover{ background:#52202f; border-color:#c15a73; color:#fff; }
.admin-notification-row small{ color:#d0b5bd; }
.admin-notification-button{ background:var(--amber); border-color:#e06a82; color:#fff; }
.admin-notification-button:disabled{ background:var(--bg-soft); color:#b58c97; border-color:var(--line); }

body.tab-ui-active .tab-screen,body.tab-ui-active .mobile-app-screen,
body.tab-ui-active [data-mobile-screen],body.desktop-tab-view .mobile-app-screen,
.mobile-app-screen,.admin-page,.news-reader{ background:var(--bg) !important; color:var(--text); }
body.tab-ui-active .app-form-card,body.tab-ui-active .app-news-card,body.tab-ui-active .account-signed-in,
body.desktop-tab-view .app-form-card,body.desktop-tab-view .app-news-card,
body.desktop-tab-view .account-signed-in,.news-reader-card{ background:var(--card) !important; color:var(--text); border-color:var(--line); }
body.tab-ui-active .price-table,body.desktop-tab-view .app-page-body .price-table{ background:var(--card); color:var(--text); border-color:var(--line); }
body.tab-ui-active .price-table thead th,body.desktop-tab-view .app-page-body .price-table thead th{ background:var(--bg-soft); color:var(--text-dim); }
body.tab-ui-active .stats{ background:var(--card); }
.app-page-body,.products-page-body{ color:var(--text); }
.app-form-card label,.account-form label,.app-news-card p,.news-status,.products-status,.account-helper{ color:var(--text-dim); }
.app-auth-message-ok{ background:#3a1822 !important; border-color:#a14b62; color:#f2cbd3; }
.app-auth-message-err{ background:#3b151b !important; }
.account-switch{ border-color:var(--line); }
.account-switch-btn{ color:var(--text-dim); }
.account-switch-btn.is-active{ color:var(--teal); }
.account-switch-btn.is-active::after{ background:var(--teal); }
.mobile-tabs{ background:rgba(22,7,12,.98); border-color:#6b3043; }
.mobile-tab{ color:#d8aeb8; }
.mobile-tab.active{ color:#ff9aae; }

/* ---------- BURGUNDY COVERAGE FOR ALL TABS ---------- */
body main,
body.tab-ui-active main,
body.desktop-tab-view main,
body .tab-screen,
body.tab-ui-active .tab-screen,
body.desktop-tab-view .tab-screen,
body .mobile-app-screen,
body .lookup-page,
body .repair-workbench,
body .product-detail-page,
body .news-reader,
body .admin-page{
  background:var(--bg) !important;
  color:var(--text) !important;
}

body .quick-actions{
  background:linear-gradient(128deg,#24101a 0%,#4a1a2b 58%,#762940 100%) !important;
  border-bottom-color:#8f4056 !important;
}
body .hero,
body .workshop-gallery,
body .stats,
body .why-visual,
body .location-panel,
body .contact-card,
body .map-frame,
body .faq-item,
body .app-page-body,
body .products-page-body{
  background:var(--card) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .tab-screen[style],
body [data-mobile-screen][style]{
  background:var(--bg) !important;
  border-color:var(--line) !important;
}
body .tab-app-head,
body .app-page-head,
body .lookup-page .lookup-heading{
  background:linear-gradient(135deg,#3d1421,#8c304b) !important;
  color:#fff !important;
}
body .quick-actions .quick-action-lookup{ background:linear-gradient(135deg,#9f304b,#c44762) !important; }
body .quick-actions .quick-action-request{ background:linear-gradient(135deg,#9b3a58,#7d2944) !important; }
body .quick-actions .quick-action-news{ background:linear-gradient(135deg,#68253a,#963c55) !important; }
body .quick-actions::before{ border-color:rgba(196,71,98,.2) !important; }
body .quick-product-strip{ border-top-color:rgba(196,71,98,.35) !important; }
body .hero-media::after{ background:linear-gradient(90deg,rgba(48,12,24,.18),transparent 65%),linear-gradient(0deg,rgba(48,12,24,.58),transparent 43%) !important; }
body .quick-product-rail .product-card,
body .lookup-help-card,
body .lookup-search-card,
body .panic-suggestions,
body .panic-result-card,
body .qr-scanner-card,
body .product-card,
body .product-detail-card,
body .product-not-found,
body .product-full-specs{
  background:var(--card) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .lookup-search-card input,
body .lookup-form input,
body .panic-suggestion,
body .panic-suggestions-head,
body .lookup-ticket-top,
body .lookup-progress,
body .product-spec-grid > div,
body .admin-product-form,
body .admin-product-preview{
  background:var(--bg-soft) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .panic-suggestion:hover,
body .panic-suggestion:focus-visible{ background:var(--card-hi) !important; }
body .mobile-tabs{ background:rgba(22,7,12,.98) !important; border-color:#6b3043 !important; }
body .mobile-tab{ color:#d8aeb8 !important; }
body .mobile-tab.active{ color:#ff9aae !important; }
body .hero-media{ background:#24101a !important; border-color:var(--line) !important; }
body .quick-product-rail-nav{ background:#8c304b !important; border-color:#c56a7d !important; }
body .quick-product-rail-nav:hover{ background:#b94661 !important; }
body .quick-product-page{ background:#8a5262 !important; }
body .quick-product-page.is-active{ background:#f7ecef !important; }
body .quick-product-rail > p,
body .quick-product-strip-head span,
body .quick-product-more{ color:#e4bbc4 !important; }
body .quick-product-rail .product-info h2{ color:var(--text) !important; }
body .quick-product-rail .product-brand,
body .quick-product-rail .product-condition,
body .quick-product-rail .product-bottom strong{ color:#ef8398 !important; }
body .quick-product-rail .product-meta{ color:var(--text-dim) !important; }
body .quick-product-rail .product-contact{ background:#64263a !important; border-color:#a34a61 !important; color:#ffc0cc !important; }
body .quick-product-rail .product-contact:hover{ background:#8d3049 !important; }
body .app-primary-button,
body .app-map-button,
body .app-admin-link{ background:var(--amber) !important; border-color:var(--amber) !important; color:#fff !important; }
body .app-primary-button:hover,
body .app-map-button:hover{ background:#e0647e !important; }
body .app-store-mark,
body .account-user-icon{ background:#64263a !important; color:#ffc0cc !important; }
body .account-switch-btn.is-active,
body .account-forgot,
body .app-news-index,
body .app-news-tag{ color:#ef8398 !important; }
body .account-switch-btn.is-active::after{ background:#ef8398 !important; }
body .lookup-search-card label,
body .panic-live-status,
body .panic-results-head span,
body .panic-result-summary-copy b,
body .panic-result-detail div span{ color:var(--text-dim) !important; }
body .panic-results-head h2,
body .product-detail-description,
body .admin-product-import label,
body .admin-product-search-results > h3{ color:var(--text) !important; }
body .product-detail-page .product-detail-description,
body .product-detail-page .product-detail-note,
body .product-full-specs span,
body .product-full-specs strong{ color:var(--text-dim) !important; }
body .location-map-link{ background:var(--amber) !important; color:#fff !important; }
body .location-map-link:hover{ background:#e0647e !important; }
body .admin-product-item summary > span:first-child{ background:#64263a !important; }
body .admin-product-summary-actions{ border-color:var(--line) !important; }
body .admin-product-check input{ accent-color:var(--amber) !important; }
body header .logo,
body header nav.links a,
body header .header-logout,
body header .header-qr-button,
body header .header-notification-button{ color:#f2dfe3 !important; }
body header nav.links a:hover,
body header .header-logout:hover,
body header .header-qr-button:hover,
body header .header-notification-button:hover{ color:#ff9aae !important; }
body header nav.links a svg,
body header .header-qr-button svg,
body header .header-notification-button svg{ color:#ef8398 !important; stroke:currentColor !important; }
body header .header-notification-badge{ border-color:#16070c !important; }

body.admin-interface .admin-message{
  background:#3a1822 !important;
  border-color:#a14b62 !important;
  color:#f2cbd3 !important;
}
body.admin-interface .admin-tab{
  background:transparent !important;
  color:var(--text-dim) !important;
}
body.admin-interface .admin-tab:hover{ background:var(--bg-soft) !important; color:var(--text) !important; }
body.admin-interface .admin-tab.is-active{
  background:var(--amber) !important;
  color:#fff !important;
}
body.admin-interface .admin-exit-button,
body.admin-interface .admin-delete-button,
body.admin-interface .admin-action-button{
  background:transparent !important;
  border-color:var(--line-strong) !important;
  color:#ef8398 !important;
}
body.admin-interface .admin-delete-button:hover,
body.admin-interface .admin-action-button:hover{
  background:#3a1822 !important;
  border-color:#c15a73 !important;
  color:#ffc0cc !important;
}
body.admin-interface .admin-notification-row span,
body.admin-interface .admin-role,
body.admin-interface .admin-kpi-attention strong{ color:#ef8398 !important; }
body.admin-interface .admin-warranty-create h3{ color:#f7ecef !important; }
body.admin-interface .admin-warranty-create p,
body.admin-interface .admin-warranty-form label,
body.admin-interface .admin-settings label{ color:var(--text-dim) !important; }
body.admin-interface .admin-upload-progress-bar{ background:#4b202e !important; }
body.admin-interface .admin-upload-progress-bar span{ background:linear-gradient(90deg,#9f304b,#e0647e) !important; }
body.admin-interface .admin-document-library-item:hover{ border-color:#c15a73 !important; }
body.admin-interface .admin-tabs,
body.admin-interface .admin-card,
body.admin-interface .admin-kpi,
body.admin-interface .admin-document-row,
body.admin-interface .admin-product-item,
body.admin-interface .admin-product-search-item{
  background:var(--card) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
body.admin-interface .admin-table th,
body.admin-interface .admin-table td{ border-color:var(--line) !important; }
body.admin-interface .admin-table th,
body.admin-interface .admin-table td,
body.admin-interface .admin-document-upload label,
body.admin-interface .admin-notification-status{ color:var(--text-dim) !important; }
body.admin-interface .admin-warranty-form input,
body.admin-interface .admin-document-upload input:not([type="file"]),
body.admin-interface .admin-product-form input:not([type="checkbox"]),
body.admin-interface .admin-product-form textarea,
body.admin-interface .admin-product-form select{
  background:var(--bg-soft) !important;
  border-color:var(--line-strong) !important;
  color:var(--text) !important;
}
body.admin-interface .admin-warranty-form button,
body.admin-interface .admin-settings .btn,
body.admin-interface .admin-product-form .btn,
body.admin-interface .admin-price-new-tab .btn{ background:var(--amber) !important; border-color:var(--amber) !important; color:#fff !important; }

/* Các media query cũ có biến màu riêng cho từng tab; đồng bộ lại cả biến lẫn nền. */
body.tab-ui-active:not(.desktop-tab-view),
body.desktop-tab-view,
body:not(.desktop-tab-view){
  --bg:#10080b !important;
  --bg-soft:#1c0e13 !important;
  --card:#26131a !important;
  --card-hi:#321923 !important;
  --line:#5a2937 !important;
  --line-strong:#8b4054 !important;
  --text:#f7ecef !important;
  --text-dim:#d0b5bd !important;
  --amber:#c44762 !important;
  --teal:#eb8197 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
}
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="home"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="services"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="pricing"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="request"]{
  --bg:#10080b !important;
  --bg-soft:#1c0e13 !important;
  --card:#26131a !important;
  --card-hi:#321923 !important;
  --line:#5a2937 !important;
  --line-strong:#8b4054 !important;
  --text:#f7ecef !important;
  --text-dim:#d0b5bd !important;
  --amber:#c44762 !important;
  --teal:#eb8197 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
}
body.desktop-tab-view #bangia.tab-screen.is-active{
  background:var(--bg) !important;
  color:var(--text) !important;
}
body.tab-ui-active header,
body.desktop-tab-view header,
body:not(.tab-ui-active) header{
  --bg:#10080b;
  --bg-soft:#1c0e13;
  --card:#26131a;
  --line:#5a2937;
  --line-strong:#8b4054;
  --text:#f7ecef;
  --text-dim:#d0b5bd;
  --amber:#c44762;
  --teal:#eb8197;
  background:rgba(22,7,12,.98) !important;
  color:#f7ecef !important;
  border-bottom-color:var(--line) !important;
}
body.tab-ui-active header nav.links,
body.desktop-tab-view header nav.links,
body:not(.tab-ui-active) header nav.links{
  background:rgba(28,14,19,.98) !important;
  color:#e0c4ca !important;
  border-color:var(--line) !important;
}
body.tab-ui-active .btn-ghost,
body:not(.tab-ui-active) .btn-ghost{
  background:transparent !important;
  color:var(--text) !important;
  border-color:var(--line-strong) !important;
}
body.tab-ui-active .tab-btn,
body.desktop-tab-view .tab-btn,
body:not(.tab-ui-active) .tab-btn{
  background:var(--card) !important;
  color:var(--text-dim) !important;
  border-color:var(--line) !important;
}
body.tab-ui-active .tab-btn.active,
body.desktop-tab-view .tab-btn.active,
body:not(.tab-ui-active) .tab-btn.active{
  background:var(--amber) !important;
  color:#fff !important;
  border-color:var(--amber) !important;
}
body.tab-ui-active header .menu-toggle,
body.desktop-tab-view header .menu-toggle,
body:not(.tab-ui-active) header .menu-toggle{
  background:var(--card) !important;
  border-color:var(--line) !important;
}
body.tab-ui-active header .menu-toggle span,
body.desktop-tab-view header .menu-toggle span,
body:not(.tab-ui-active) header .menu-toggle span{ background:var(--text) !important; }
body .quick-product-strip{ border-top-color:var(--line) !important; }
body .quick-product-strip-head strong{ color:#f7ecef !important; }
body .app-store-card,
body .app-detail-row,
body .account-switch{ border-color:var(--line) !important; }
body .app-store-card strong,
body .app-detail-row strong,
body .admin-heading h1,
body .admin-card h2,
body .admin-kpi strong{ color:var(--text) !important; }
body .app-store-card p,
body .app-detail-row span,
body .admin-heading p,
body .admin-section-heading p,
body .admin-kpi span,
body .admin-table,
body .admin-table td small{ color:var(--text-dim) !important; }
body .admin-heading .btn,
body .admin-inline-form select,
body .admin-inline-form button,
body .admin-price-tab-form input,
body .admin-price-row-form input,
body .admin-price-add-form input,
body .admin-price-new-tab input{
  background:var(--bg-soft) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .admin-inline-form button{ color:#ef8398 !important; }
body .admin-kpi-attention strong{ color:#ef8398 !important; }

/* Chốt màu cho mọi button còn dùng rule cũ ở các breakpoint. */
body button{
  background:var(--card) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
body .btn-primary,
body .app-primary-button,
body .app-map-button,
body .admin-notification-button,
body .admin-warranty-form button,
body .admin-settings .btn,
body .admin-product-form .btn,
body .admin-price-new-tab .btn,
body .tab-btn.active,
body .product-filter.is-active,
body .admin-tab.is-active{
  background:var(--amber) !important;
  border-color:var(--amber) !important;
  color:#fff !important;
}
body .quick-product-rail-nav{ background:#8c304b !important; border-color:#c56a7d !important; color:#fff !important; }
body .quick-product-rail-nav:hover{ background:#b94661 !important; }
body .quick-product-page{ background:#8a5262 !important; border-color:transparent !important; }
body .quick-product-page.is-active{ background:#f7ecef !important; }
body .admin-delete-button,
body .admin-action-button{ background:transparent !important; border-color:var(--line-strong) !important; color:#ef8398 !important; }
body .admin-delete-button:hover,
body .admin-action-button:hover{ background:#3a1822 !important; border-color:#c15a73 !important; color:#ffc0cc !important; }

/* ---------- SPACE ORANGE LIGHT THEME ---------- */
:root{
  --bg:#fff8f1;
  --bg-soft:#fff0e2;
  --card:#ffffff;
  --card-hi:#fff7ed;
  --line:#f2d3bc;
  --line-strong:#e8a77d;
  --text:#2b1a14;
  --text-dim:#76584a;
  --amber:#f26b2c;
  --teal:#d65357;
}

body.tab-ui-active:not(.desktop-tab-view),
body.desktop-tab-view,
body:not(.desktop-tab-view){
  --bg:#fff8f1 !important;
  --bg-soft:#fff0e2 !important;
  --card:#ffffff !important;
  --card-hi:#fff7ed !important;
  --line:#f2d3bc !important;
  --line-strong:#e8a77d !important;
  --text:#2b1a14 !important;
  --text-dim:#76584a !important;
  --amber:#f26b2c !important;
  --teal:#d65357 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
}
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="home"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="services"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="pricing"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="request"]{
  --bg:#fff8f1 !important;
  --bg-soft:#fff0e2 !important;
  --card:#ffffff !important;
  --card-hi:#fff7ed !important;
  --line:#f2d3bc !important;
  --line-strong:#e8a77d !important;
  --text:#2b1a14 !important;
  --text-dim:#76584a !important;
  --amber:#f26b2c !important;
  --teal:#d65357 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
}
body::before{
  background:radial-gradient(ellipse 68% 36% at 92% 0%,rgba(242,107,44,.13),transparent 70%),radial-gradient(ellipse 45% 30% at 0% 45%,rgba(205,82,112,.09),transparent 70%) !important;
}
body main,
body .tab-screen,
body .mobile-app-screen,
body .lookup-page,
body .repair-workbench,
body .product-detail-page,
body .news-reader,
body .admin-page{
  background:var(--bg) !important;
  color:var(--text) !important;
}
body .hero,
body .workshop-gallery,
body .stats,
body .why-visual,
body .location-panel,
body .contact-card,
body .map-frame,
body .faq-item,
body .app-page-body,
body .products-page-body{
  background:var(--card) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .tab-screen[style],body [data-mobile-screen][style]{ background:var(--bg) !important; border-color:var(--line) !important; }
body .quick-actions{
  background:linear-gradient(135deg,#ff9b4a 0%,#f26b2c 52%,#cc5572 100%) !important;
  border-bottom-color:#e6a07b !important;
}
body .quick-actions::before{ border-color:rgba(255,255,255,.34) !important; }
body .quick-actions .quick-action-lookup{ background:linear-gradient(135deg,#ff9b4a,#f26b2c) !important; }
body .quick-actions .quick-action-request{ background:linear-gradient(135deg,#f07852,#d65357) !important; }
body .quick-actions .quick-action-news{ background:linear-gradient(135deg,#d65357,#a95178) !important; }
body .tab-app-head,
body .app-page-head,
body .lookup-page .lookup-heading,
body .document-library-head,
body .document-viewer-head{
  background:linear-gradient(135deg,#f26b2c,#d65357) !important;
  color:#fff !important;
}
body .quick-product-rail .product-card,
body .lookup-help-card,
body .lookup-search-card,
body .panic-suggestions,
body .panic-result-card,
body .qr-scanner-card,
body .product-card,
body .product-detail-card,
body .product-not-found,
body .product-full-specs,
body .admin-tabs,
body .admin-card,
body .admin-kpi,
body .admin-document-row{
  background:var(--card) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .lookup-search-card input,
body .lookup-form input,
body .panic-suggestion,
body .panic-suggestions-head,
body .lookup-ticket-top,
body .lookup-progress,
body .product-spec-grid > div,
body .admin-product-form,
body .admin-product-preview{
  background:var(--bg-soft) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
body .panic-suggestion:hover,body .panic-suggestion:focus-visible{ background:var(--card-hi) !important; }
body .lookup-result-error,
body .repair-alert-error,
body .repair-alert-ok,
body .repair-created,
body .lookup-warranty,
body .product-detail-price,
body .products-note,
body .app-note,
body .news-reader-summary,
body .admin-warranty-create,
body .admin-product-import,
body .admin-message{
  background:#fff0e2 !important;
  border-color:#e8a77d !important;
  color:#7f3d2b !important;
}
body .lookup-ticket-top b,
body .lookup-stage.is-done > span,
body .document-file-mark,
body .qr-scanner-close,
body .product-contact,
body .app-store-mark,
body .account-user-icon{ background:#f26b2c !important; color:#fff !important; }
body .lookup-stage:not(:last-child)::after{ background:#edb18a !important; }
body .lookup-stage > span{ background:var(--card) !important; border-color:#e8a77d !important; color:#9c654f !important; }
body .lookup-stage.is-done > span{ border-color:#f26b2c !important; }
body .panic-result-card code,
body .panic-suggestion code{ background:#ffe2cd !important; border-color:#ed9f72 !important; color:#bc4b25 !important; }
body .panic-result-detail > div{ border-color:var(--line) !important; }
body .panic-result-detail p{ color:#4b2b20 !important; }
body .panic-result-detail small,
body .panic-suggestion small{ background:#ffd9c0 !important; color:#a74428 !important; }
body .lookup-warranty p,
body .news-reader-summary p,
body .app-note,
body .products-note{ color:#8a5948 !important; }
body .document-viewer-panel{ background:var(--card) !important; }
body .document-viewer-panel iframe{ background:var(--bg-soft) !important; }
body .product-visual,body .product-detail-visual{ background:linear-gradient(145deg,#ffe1c5,#f49a68) !important; }
body .product-visual.is-samsung,body .product-detail-visual.is-samsung{ background:linear-gradient(145deg,#ffe0d0,#df8d8e) !important; }
body .floating-facebook,body .floating-zalo{ background:#f26b2c !important; }
body .mobile-tabs{ background:rgba(255,255,255,.96) !important; border-color:#edb18a !important; }
body .mobile-tab{ color:#976a58 !important; }
body .mobile-tab.active{ color:#f26b2c !important; }
body .quick-product-rail-nav{ background:#f26b2c !important; border-color:#fff !important; color:#fff !important; }
body .quick-product-rail-nav:hover{ background:#d65357 !important; }
body .quick-product-page{ background:#e7a17e !important; }
body .quick-product-page.is-active{ background:#fff !important; }
body .quick-product-strip{ border-top-color:rgba(255,255,255,.45) !important; }
body .quick-product-rail > p,
body .quick-product-strip-head span,
body .quick-product-more{ color:#fff1e8 !important; }
body .quick-product-rail .product-info h2{ color:var(--text) !important; }
body .quick-product-rail .product-brand,
body .quick-product-rail .product-condition,
body .quick-product-rail .product-bottom strong,
body .product-brand,
body .product-bottom strong,
body .product-store-condition,
body .product-back-link,
body .product-detail-condition,
body .product-condition{ color:#d65357 !important; }
body .quick-product-rail .product-meta{ color:var(--text-dim) !important; }
body .quick-product-rail .product-contact{ background:#d65357 !important; border-color:#d65357 !important; color:#fff !important; }
body .quick-product-rail .product-contact:hover{ background:#b84557 !important; }
body .location-map-link{ background:var(--amber) !important; color:#fff !important; }
body .location-map-link:hover{ background:#d65357 !important; }
body .cta-band{ background:linear-gradient(135deg,#f26b2c,#d65357) !important; border-color:#e8a77d !important; }
body .cta-band .btn-primary{ background:#fff !important; color:#c94f35 !important; }
body footer{ --text:#2b1a14; --text-dim:#76584a; --line:#f2d3bc; background:#fff0e2 !important; color:var(--text) !important; }
body footer .footer-grid h4,body footer .footer-bottom{ color:var(--text-dim) !important; }
body header,
body.tab-ui-active header,
body.desktop-tab-view header,
body:not(.tab-ui-active) header{
  --bg:#fff8f1;
  --bg-soft:#fff0e2;
  --card:#fff;
  --line:#f2d3bc;
  --line-strong:#e8a77d;
  --text:#2b1a14;
  --text-dim:#76584a;
  --amber:#f26b2c;
  --teal:#d65357;
  background:rgba(255,255,255,.96) !important;
  color:#2b1a14 !important;
  border-bottom-color:#f2d3bc !important;
}
body header nav.links,
body.tab-ui-active header nav.links,
body.desktop-tab-view header nav.links,
body:not(.tab-ui-active) header nav.links{
  background:#fff !important;
  color:#76584a !important;
  border-color:#f2d3bc !important;
}
body header nav.links a,
body header .header-logout,
body header .header-qr-button,
body header .header-notification-button{ color:#76584a !important; }
body header nav.links a:hover,
body header .header-logout:hover,
body header .header-qr-button:hover,
body header .header-notification-button:hover{ color:#f26b2c !important; }
body header nav.links a svg,
body header .header-qr-button svg,
body header .header-notification-button svg{ color:#f26b2c !important; stroke:currentColor !important; }
body header .menu-toggle{ background:#fff !important; border-color:#e8a77d !important; }
body header .menu-toggle span{ background:#f26b2c !important; }
body input,body textarea,body select{ background:var(--bg-soft) !important; color:var(--text) !important; border-color:var(--line-strong) !important; }
body input::placeholder,body textarea::placeholder{ color:#aa816e !important; }
body button{ background:var(--card) !important; border-color:var(--line) !important; color:var(--text) !important; }
body .btn-primary,
body .app-primary-button,
body .app-map-button,
body .admin-notification-button,
body .admin-warranty-form button,
body .admin-settings .btn,
body .admin-product-form .btn,
body .admin-price-new-tab .btn,
body .tab-btn.active,
body .product-filter.is-active,
body .admin-tab.is-active{
  background:var(--amber) !important;
  border-color:var(--amber) !important;
  color:#fff !important;
}
body .btn-primary:hover,
body .app-primary-button:hover,
body .app-map-button:hover{ background:#d65357 !important; color:#fff !important; }
body .btn-ghost,
body.admin-interface .admin-delete-button,
body.admin-interface .admin-action-button{ background:transparent !important; color:#c6533d !important; border-color:#e8a77d !important; }
body header .logo{ color:#2b1a14 !important; }
body .tab-btn,body .product-filter,body.admin-interface .admin-tab{ background:var(--card) !important; color:var(--text-dim) !important; border-color:var(--line) !important; }
body .tab-btn.active,body .product-filter.is-active,body.admin-interface .admin-tab.is-active{ background:var(--amber) !important; color:#fff !important; border-color:var(--amber) !important; }
body.admin-interface .admin-message{ color:#8c4935 !important; }
body.admin-interface .admin-notification-row{ background:#fff0e2 !important; border-color:#e8a77d !important; color:#5b3427 !important; }
body.admin-interface .admin-notification-row span,
body.admin-interface .admin-role,
body.admin-interface .admin-kpi-attention strong{ color:#d65357 !important; }
body.admin-interface .admin-notification-row:hover{ background:#ffe2cd !important; border-color:#d65357 !important; color:#4b2b20 !important; }
body.admin-interface .admin-warranty-create h3{ color:#4b2b20 !important; }
body.admin-interface .admin-warranty-create p,
body.admin-interface .admin-warranty-form label,
body.admin-interface .admin-settings label{ color:var(--text-dim) !important; }
body.admin-interface .admin-upload-progress-bar{ background:#ffe2cd !important; }
body.admin-interface .admin-upload-progress-bar span{ background:linear-gradient(90deg,#f26b2c,#d65357) !important; }
body.admin-interface .admin-document-library-item:hover{ border-color:#d65357 !important; }
body.admin-interface .admin-delete-button:hover,
body.admin-interface .admin-action-button:hover{ background:#ffe4d8 !important; border-color:#d97970 !important; color:#9d4f3e !important; }
body.tab-ui-active:not(.desktop-tab-view) .quick-actions[data-mobile-screen="home"]{
  background:linear-gradient(135deg,#ff9b4a 0%,#f26b2c 52%,#cc5572 100%) !important;
  border-bottom-color:#e6a07b !important;
}
body.desktop-tab-view .quick-actions[data-mobile-screen="home"]{
  background:linear-gradient(135deg,#ff9b4a 0%,#f26b2c 52%,#cc5572 100%) !important;
  border-bottom-color:#e6a07b !important;
}
body .quick-actions[data-mobile-screen="home"] .quick-product-strip-head span,
body .quick-actions[data-mobile-screen="home"] .quick-product-strip-head strong,
body .quick-actions[data-mobile-screen="home"] .quick-product-more{ color:#fff1e8 !important; }
body .product-no-image{ color:#a64d39 !important; }
body .quick-action-card{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  color:#fff !important;
  text-decoration:none !important;
}
body .quick-action-card .quick-action-icon{ background:rgba(255,255,255,.2) !important; }
body .quick-action-card .quick-action-copy strong{ color:#fff !important; }
body .quick-action-card .quick-action-copy small{ color:rgba(255,255,255,.82) !important; }
body .quick-action-card .quick-action-icon svg,
body .quick-action-card .quick-action-arrow{ color:#fff !important; stroke:currentColor !important; }

/* ---------- SOFT SPACE ORANGE / IPHONE-STYLE LIGHT UI ---------- */
:root{
  --bg:#f5f5f7;
  --bg-soft:#fafafa;
  --card:#ffffff;
  --card-hi:#f7f7f8;
  --line:#e5e5ea;
  --line-strong:#d1d1d6;
  --text:#1d1d1f;
  --text-dim:#6e6e73;
  --amber:#f28c52;
  --teal:#d97970;
}
body,
body.tab-ui-active:not(.desktop-tab-view),
body.desktop-tab-view,
body:not(.desktop-tab-view){
  --bg:#f5f5f7 !important;
  --bg-soft:#fafafa !important;
  --card:#ffffff !important;
  --card-hi:#f7f7f8 !important;
  --line:#e5e5ea !important;
  --line-strong:#d1d1d6 !important;
  --text:#1d1d1f !important;
  --text-dim:#6e6e73 !important;
  --amber:#f28c52 !important;
  --teal:#d97970 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;
}
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="home"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="services"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="pricing"],
body.tab-ui-active:not(.desktop-tab-view) [data-mobile-screen="request"]{
  --bg:#f5f5f7 !important;
  --bg-soft:#fafafa !important;
  --card:#fff !important;
  --card-hi:#f7f7f8 !important;
  --line:#e5e5ea !important;
  --line-strong:#d1d1d6 !important;
  --text:#1d1d1f !important;
  --text-dim:#6e6e73 !important;
  --amber:#f28c52 !important;
  --teal:#d97970 !important;
  background:var(--bg) !important;
  color:var(--text) !important;
}
body::before{ background:radial-gradient(ellipse 68% 36% at 92% 0%,rgba(242,140,82,.1),transparent 70%),radial-gradient(ellipse 45% 30% at 0% 45%,rgba(217,121,112,.06),transparent 70%) !important; }
body main,
body .tab-screen,
body .mobile-app-screen,
body .lookup-page,
body .repair-workbench,
body .product-detail-page,
body .news-reader,
body .admin-page{ background:var(--bg) !important; color:var(--text) !important; }
body .hero,
body .workshop-gallery,
body .stats,
body .why-visual,
body .location-panel,
body .contact-card,
body .map-frame,
body .faq-item,
body .app-page-body,
body .products-page-body{ background:var(--bg) !important; color:var(--text) !important; border-color:var(--line) !important; }
body .tab-screen[style],body [data-mobile-screen][style]{ background:var(--bg) !important; border-color:var(--line) !important; }
body .quick-actions,
body.tab-ui-active:not(.desktop-tab-view) .quick-actions[data-mobile-screen="home"],
body.desktop-tab-view .quick-actions[data-mobile-screen="home"]{
  background:linear-gradient(135deg,#fff8f3 0%,#fffdfb 54%,#fff5f1 100%) !important;
  border-bottom-color:#f0d8cb !important;
}
body .quick-actions::before{ border-color:rgba(242,140,82,.14) !important; }
body .quick-actions .quick-action-lookup{ background:linear-gradient(135deg,#f6b078,#ee9362) !important; }
body .quick-actions .quick-action-request{ background:linear-gradient(135deg,#f1a184,#df8580) !important; }
body .quick-actions .quick-action-news{ background:linear-gradient(135deg,#dc8b91,#bf8ba0) !important; }
body .quick-action-card{ border-color:rgba(255,255,255,.64) !important; box-shadow:0 16px 30px -24px rgba(105,65,47,.34) !important; }
body .quick-action-card .quick-action-copy strong{ color:#fff !important; }
body .quick-action-card .quick-action-copy small{ color:rgba(255,255,255,.86) !important; }
body .quick-action-card .quick-action-icon{ background:rgba(255,255,255,.22) !important; }
body .tab-app-head,
body .app-page-head,
body .lookup-page .lookup-heading,
body .document-library-head,
body .document-viewer-head{ background:linear-gradient(135deg,#f28c52,#d97970) !important; color:#fff !important; }
body .tab-app-head,body .app-page-head{ border-radius:0 0 24px 24px; }
body [class*="-card"],
body .admin-tabs,
body .admin-card,
body .admin-kpi,
body .admin-document-row,
body .lookup-result,
body .lookup-help-card,
body .lookup-search-card,
body .panic-suggestions,
body .panic-result-card,
body .product-card,
body .product-detail-card,
body .product-not-found,
body .product-full-specs{ background:var(--card) !important; color:var(--text) !important; border-color:var(--line) !important; border-radius:18px; box-shadow:0 12px 30px -26px rgba(0,0,0,.32); }
body .app-form-card,body .app-news-card,body .account-signed-in{ border-radius:18px !important; box-shadow:0 12px 30px -26px rgba(0,0,0,.32) !important; }
body input,body textarea,body select{ background:var(--card) !important; color:var(--text) !important; border-color:var(--line-strong) !important; border-radius:12px !important; }
body button,
body .btn,
body .app-primary-button,
body .app-map-button{ font-family:inherit; border-radius:12px !important; }
body button{ background:var(--card) !important; border-color:var(--line) !important; color:var(--text) !important; box-shadow:0 5px 14px -12px rgba(0,0,0,.32); }
body .btn-primary,
body .app-primary-button,
body .app-map-button,
body .admin-notification-button,
body .admin-warranty-form button,
body .admin-settings .btn,
body .admin-product-form .btn,
body .admin-price-new-tab .btn,
body .tab-btn.active,
body .product-filter.is-active,
body .admin-tab.is-active,
body .location-map-link{ background:var(--amber) !important; border-color:var(--amber) !important; color:#fff !important; }
body .btn-primary:hover,
body .app-primary-button:hover,
body .app-map-button:hover,
body .location-map-link:hover{ background:#d97970 !important; color:#fff !important; }
body .btn-ghost,
body.admin-interface .admin-delete-button,
body.admin-interface .admin-action-button{ background:transparent !important; color:#c86e55 !important; border-color:#e8b29c !important; }
body .quick-product-rail-nav{ background:#f28c52 !important; border-color:#fff !important; color:#fff !important; }
body .quick-product-rail-nav:hover{ background:#d97970 !important; }
body .quick-product-page{ background:#e8b39a !important; }
body .quick-product-page.is-active{ background:#f28c52 !important; }
body .quick-product-rail .product-contact{ background:#d97970 !important; border-color:#d97970 !important; color:#fff !important; }
body .quick-product-rail .product-contact:hover{ background:#c46867 !important; }
body .quick-product-strip{ border-top-color:#f0d8cb !important; }
body .quick-product-rail > p,
body .quick-product-strip-head span,
body .quick-product-more{ color:#a76b59 !important; }
body .quick-product-strip-head strong{ color:#1d1d1f !important; }
body .mobile-tabs{ background:rgba(255,255,255,.82) !important; border-color:rgba(209,209,214,.88) !important; box-shadow:0 12px 35px -20px rgba(0,0,0,.38) !important; backdrop-filter:blur(22px) saturate(1.2); }
body .mobile-tab{ color:#7b6b65 !important; }
body .mobile-tab.active{ color:#f28c52 !important; }
body .lookup-result-error,
body .repair-alert-error,
body .repair-alert-ok,
body .repair-created,
body .lookup-warranty,
body .product-detail-price,
body .products-note,
body .app-note,
body .news-reader-summary,
body .admin-warranty-create,
body .admin-product-import,
body .admin-message{ background:#fff0e8 !important; border-color:#edc0aa !important; color:#7b4b3e !important; }
body .lookup-ticket-top b,
body .lookup-stage.is-done > span,
body .document-file-mark,
body .qr-scanner-close,
body .product-contact,
body .app-store-mark,
body .account-user-icon{ background:#f28c52 !important; color:#fff !important; }
body .lookup-stage > span{ background:#fff !important; border-color:#edb18f !important; color:#a8755e !important; }
body .lookup-stage:not(:last-child)::after{ background:#edc0aa !important; }
body .panic-result-card code,body .panic-suggestion code{ background:#ffe8dc !important; border-color:#edb18f !important; color:#b65b3d !important; }
body .panic-result-detail p{ color:#4b3028 !important; }
body .document-viewer-panel{ background:#fff !important; }
body .document-viewer-panel iframe{ background:#f5f5f7 !important; }
body .product-visual,body .product-detail-visual{ background:linear-gradient(145deg,#ffe9d7,#f4b08b) !important; }
body .product-visual.is-samsung,body .product-detail-visual.is-samsung{ background:linear-gradient(145deg,#ffe8df,#e9b1b0) !important; }
body .floating-facebook,body .floating-zalo{ background:#f28c52 !important; }
body footer{ --text:#1d1d1f; --text-dim:#6e6e73; --line:#e5e5ea; background:#fafafa !important; color:var(--text) !important; }
body header,
body.tab-ui-active header,
body.desktop-tab-view header,
body:not(.tab-ui-active) header{ --bg:#f5f5f7; --bg-soft:#fafafa; --card:#fff; --line:#e5e5ea; --line-strong:#d1d1d6; --text:#1d1d1f; --text-dim:#6e6e73; --amber:#f28c52; --teal:#d97970; background:rgba(255,255,255,.82) !important; color:#1d1d1f !important; border-bottom-color:rgba(209,209,214,.8) !important; backdrop-filter:blur(22px) saturate(1.2); }
body header nav.links,
body.tab-ui-active header nav.links,
body.desktop-tab-view header nav.links,
body:not(.tab-ui-active) header nav.links{ background:rgba(255,255,255,.94) !important; color:#6e6e73 !important; border-color:#e5e5ea !important; }
body header .logo{ color:#1d1d1f !important; }
body header nav.links a,body header .header-logout,body header .header-qr-button,body header .header-notification-button{ color:#6e6e73 !important; }
body header nav.links a:hover,body header .header-logout:hover,body header .header-qr-button:hover,body header .header-notification-button:hover{ color:#f28c52 !important; }
body header nav.links a svg,body header .header-qr-button svg,body header .header-notification-button svg{ color:#f28c52 !important; stroke:currentColor !important; }
body header .menu-toggle{ background:#fff !important; border-color:#e8b29c !important; }
body header .menu-toggle span{ background:#f28c52 !important; }
body.admin-interface .admin-tab{ background:transparent !important; color:var(--text-dim) !important; }
body.admin-interface .admin-tab:hover{ background:var(--bg-soft) !important; color:var(--text) !important; }
body.admin-interface .admin-tab.is-active{ background:var(--amber) !important; color:#fff !important; }
body.admin-interface .admin-notification-row{ background:#fff0e8 !important; border-color:#edc0aa !important; color:#5b3427 !important; }
body.admin-interface .admin-notification-row span,body.admin-interface .admin-role,body.admin-interface .admin-kpi-attention strong{ color:#d97970 !important; }
body.admin-interface .admin-notification-row:hover{ background:#ffe4d8 !important; border-color:#d97970 !important; }
body.admin-interface .admin-upload-progress-bar{ background:#ffe4d8 !important; }
body.admin-interface .admin-upload-progress-bar span{ background:linear-gradient(90deg,#f28c52,#d97970) !important; }
body .sec-head h2,
body .gallery-heading h2,
body .why-item h3,
body .contact-row h4,
body .faq-q,
body .lookup-help-card strong,
body .lookup-progress h2,
body .panic-results-head h2,
body .product-info h2,
body .product-detail-info h1,
body .product-full-specs h2,
body .admin-heading h1,
body .admin-card h2,
body .admin-section-heading h2,
body .admin-kpi strong{ color:#1d1d1f !important; }
body .hero p.lead,
body .trust-item,
body .gallery-heading p,
body .sec-head p,
body .why-item p,
body .proc-step p,
body .price-note,
body .contact-row p,
body .faq-a p,
body .lookup-help-card span,
body .lookup-search-card label,
body .panic-live-status,
body .panic-results-head span,
body .panic-result-summary-copy b,
body .panic-result-detail div span,
body .product-meta,
body .product-detail-description,
body .product-detail-note,
body .product-full-specs span,
body .admin-heading p,
body .admin-section-heading p,
body .admin-kpi span,
body .admin-table,
body .admin-table td small,
body .admin-upload-progress{ color:#6e6e73 !important; }
body .lookup-help-card span::before{ background:#f28c52 !important; }
body .lookup-warranty span,
body .lookup-warranty strong,
body .lookup-ticket-top strong,
body .panic-result-toggle,
body .panic-result-card summary::after,
body .product-brand,
body .product-condition,
body .product-bottom strong,
body .product-store-condition,
body .product-back-link,
body .product-detail-condition,
body .admin-role{ color:#d97970 !important; }
body .panic-suggestion > span,
body .panic-result-summary-copy em,
body .lookup-stage p,
body .lookup-stage strong,
body .lookup-warranty p,
body .lookup-grid small,
body .qr-scanner-status,
body .qr-manual-form label{ color:#6e6e73 !important; }
body .app-page-head .app-kicker,
body .app-page-head h1,
body .app-page-head p,
body .tab-app-head .app-kicker,
body .tab-app-head h1,
body .tab-app-head p{ color:#fff !important; }

/* ---------- FINAL CONTRAST + MOBILE APP DOCK ALIGNMENT ---------- */
/* Nội dung trang chủ dùng màu chữ ổn định, không phụ thuộc các theme cũ ở phía trên. */
body .hero h1,
body .sec-head h2,
body .gallery-heading h2,
body .why-grid h2,
body .svc-card h3,
body .proc-step h3,
body .why-item h4,
body .test-card p,
body .test-who-name,
body .location-panel strong,
body .location-panel a,
body .faq-q,
body .contact-row h4,
body .contact-row a,
body .price-table td,
body .app-news-card h2,
body .app-store-card strong,
body .app-detail-row strong,
body .account-signed-in strong,
body .product-info h2{ color:#1d1d1f !important; }

body .hero p.lead,
body .trust-item,
body .gallery-heading p,
body .sec-head p,
body .svc-card p,
body .proc-step p,
body .why-item p,
body .why-visual-row span:first-child,
body .stat-label,
body .test-who-meta,
body .location-label,
body .contact-row p,
body .faq-a p,
body .price-note,
body .form-row label,
body .app-news-card p,
body .app-store-card p,
body .app-detail-row span,
body .account-form label,
body .account-helper,
body .news-status,
body .products-status,
body .products-note{ color:#5f6065 !important; }

/* Màu nhấn đủ đậm khi đứng trên nền sáng. */
body .eyebrow,
body .svc-index,
body .why-num,
body .why-visual-row span:last-child,
body .stars,
body .app-news-index,
body .app-news-tag,
body .account-switch-btn.is-active,
body .account-forgot,
body .app-admin-link,
body .product-brand,
body .product-condition,
body .product-bottom strong{ color:#a84f45 !important; }
body .hero h1 em{ color:#c15f35 !important; }

/* Các chữ phụ trên nền màu/gradient vẫn giữ màu sáng và tăng độ rõ. */
body .quick-action-card .quick-action-copy strong{ color:#fff !important; }
body .quick-action-card .quick-action-copy small{ color:rgba(255,255,255,.92) !important; }
body .app-page-head .app-kicker,
body .app-page-head h1,
body .tab-app-head .app-kicker,
body .tab-app-head h1{ color:#fff !important; }
body .app-page-head p,
body .tab-app-head p{ color:rgba(255,255,255,.9) !important; }

/* Dải sản phẩm trên trang chủ là nền sáng, không dùng chữ trắng nhạt. */
body .quick-actions[data-mobile-screen="home"] .quick-product-rail > p,
body .quick-actions[data-mobile-screen="home"] .quick-product-strip-head span,
body .quick-actions[data-mobile-screen="home"] .quick-product-strip-head strong,
body .quick-actions[data-mobile-screen="home"] .quick-product-more{ color:#3e302c !important; }
body .quick-actions[data-mobile-screen="home"] .quick-product-strip-head span,
body .quick-actions[data-mobile-screen="home"] .quick-product-more{ color:#6a5149 !important; }
body .quick-actions[data-mobile-screen="home"] .quick-product-rail .product-info h2{ color:#1d1d1f !important; }
body .quick-actions[data-mobile-screen="home"] .quick-product-rail .product-meta{ color:#5f6065 !important; }

/* Nút cam có chữ trắng đủ tương phản; vẫn giữ sắc cam mềm của giao diện. */
body .btn-primary,
body .app-primary-button,
body .app-map-button,
body .admin-notification-button,
body .admin-warranty-form button,
body .admin-settings .btn,
body .admin-product-form .btn,
body .admin-price-new-tab .btn,
body .tab-btn.active,
body .product-filter.is-active,
body .admin-tab.is-active,
body .location-map-link{ background:#c9633d !important; border-color:#c9633d !important; color:#fff !important; }
body .btn-primary:hover,
body .app-primary-button:hover,
body .app-map-button:hover,
body .location-map-link:hover{ background:#a84f45 !important; border-color:#a84f45 !important; color:#fff !important; }

@media(max-width:700px){
  /* Dock trên kết thúc đúng tại mép nội dung, tránh khe trắng trước các tab app. */
  body.tab-ui-active .mobile-app-screen.is-active,
  body.tab-ui-active .tab-screen-with-app-head.is-active{
    margin-top:0 !important;
    padding-top:0 !important;
  }
  body.tab-ui-active .mobile-app-screen.is-active .app-page-head,
  body.tab-ui-active .tab-screen-with-app-head.is-active .tab-app-head{
    margin-top:0 !important;
  }
  body.tab-ui-active .mobile-app-screen.is-active .app-page-body{ padding-top:20px !important; }
  body.tab-ui-active .app-page-head-compact{ padding-top:28px !important; }
}

/* ---------- QUICK ACTION CONTRAST + FLAT REQUEST CALLOUT ---------- */
/* Ba lối tắt đầu trang dùng nền đủ sâu để chữ trắng không bị chìm. */
body .quick-actions .quick-action-lookup,
body.tab-ui-active .quick-actions .quick-action-lookup{
  background:linear-gradient(135deg,#cf713e 0%,#b95b38 100%) !important;
}
body .quick-actions .quick-action-request,
body.tab-ui-active .quick-actions .quick-action-request{
  background:linear-gradient(135deg,#c66d60 0%,#ad5755 100%) !important;
}
body .quick-actions .quick-action-news,
body.tab-ui-active .quick-actions .quick-action-news{
  background:linear-gradient(135deg,#b87589 0%,#9f6079 100%) !important;
}
body .quick-actions .quick-action-card .quick-action-copy strong,
body .quick-actions .quick-action-card .quick-action-copy small,
body .quick-actions .quick-action-card .quick-action-icon,
body .quick-actions .quick-action-card .quick-action-arrow{ color:#fff !important; }
body .quick-actions .quick-action-card .quick-action-copy small{ opacity:.96; }
body .quick-actions .quick-action-card .quick-action-icon{ background:rgba(255,255,255,.2) !important; }

/* Tab Yêu cầu: giữ nội dung nhưng bỏ hoàn toàn box màu cam phía sau. */
body .request-callout{
  margin:0 !important;
  padding:30px 20px 38px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#1d1d1f !important;
  text-align:center;
}
body .request-callout h2{ color:#1d1d1f !important; }
body .request-callout p{ color:#5f6065 !important; opacity:1 !important; }
body .request-callout .btn-primary{ background:#c9633d !important; color:#fff !important; }

/* CTA tab Yêu cầu: tách rõ tiêu đề, mô tả và nút hành động. */
body .request-callout{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}
body .request-callout h2{
  margin:0 !important;
  line-height:1.2;
}
body .request-callout p{
  margin:0 !important;
  line-height:1.55;
}
body .request-callout .btn-primary{
  min-height:48px;
  margin-top:4px;
  padding:0 24px;
  border:1px solid rgba(255,255,255,.42) !important;
  border-radius:12px;
  box-shadow:0 10px 22px -14px rgba(116,57,38,.7), inset 0 1px 0 rgba(255,255,255,.24);
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}
body .request-callout .btn-primary:hover{
  background:#b95435 !important;
  box-shadow:0 13px 24px -14px rgba(116,57,38,.8), inset 0 1px 0 rgba(255,255,255,.28);
}
body .request-callout .btn-primary:focus-visible{
  outline:3px solid rgba(201,99,61,.24);
  outline-offset:3px;
}
@media(max-width:700px){
  body .request-callout{ padding-right:20px !important; padding-left:20px !important; gap:14px; }
  body .request-callout h2{ font-size:30px; }
  body .request-callout .btn-primary{ width:min(100%,320px); white-space:normal; text-align:center; }
}

/* Logo: quả táo cân màu với tên thương hiệu ở header và footer. */
body header .logo,
body footer .logo{ color:#1d1d1f !important; gap:4px; }
body header .logo-mark{
  flex-basis:36px;
  width:36px;
  height:40px;
}
body footer .logo-mark{
  flex-basis:36px;
  width:36px;
  height:40px;
}

@media(min-width:701px){
  /* section có padding desktop mặc định 88px; màn hình app phải nối thẳng với header. */
  body.desktop-tab-view .mobile-app-screen.is-active{
    padding-top:0 !important;
    margin-top:0 !important;
  }
  body.desktop-tab-view .mobile-app-screen.is-active .app-page-head{ margin-top:0 !important; }

  /* Khối đăng nhập/đăng ký có max-width nhưng trước đây vẫn bám mép trái. */
  body.desktop-tab-view .account-switch,
  body.desktop-tab-view .account-form,
  body.desktop-tab-view .account-helper,
  body.desktop-tab-view .app-auth-message,
  body.desktop-tab-view .app-admin-link,
  body.desktop-tab-view .app-logout-link,
  body.desktop-tab-view .account-signed-in{
    margin-right:auto !important;
    margin-left:auto !important;
  }
}

/* Ghi đè cuối theme: dock trên dùng nền kính chung, QR/thông báo không phải
   là các nút card màu trắng. */
body header .header-qr-button,
body header .header-notification-button{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
body header .header-qr-button:disabled,
body header .header-notification-button:disabled{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
body header .header-logout{
  display:inline-grid !important;
  width:32px;
  height:32px;
  place-items:center;
  font-size:0 !important;
  line-height:1;
}
body header .header-logout svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Thanh dung lượng trong tab Tài liệu. */
body .admin-storage-card{
  margin:0 0 20px;
  padding:17px 18px;
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  background:var(--bg-soft) !important;
  box-shadow:none !important;
}
body .admin-storage-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
body .admin-storage-head > div{ display:flex; flex-direction:column; gap:5px; }
body .admin-storage-kicker{ color:var(--text-dim); font-size:10px; font-weight:800; letter-spacing:.1em; }
body .admin-storage-head strong{ color:var(--text); font-size:17px; }
body .admin-storage-head small{ color:var(--text-dim); font-size:12px; }
body .admin-storage-track{ height:10px; margin:15px 0 10px; overflow:hidden; border-radius:99px; background:#f0ddd4; }
body .admin-storage-track span{ display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#f28c52,#c9633d); }
body .admin-storage-meta{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 18px; color:var(--text-dim); font-size:11px; }
body .admin-storage-meta b{ color:var(--text); font-weight:800; }
body .admin-storage-unavailable{ margin:12px 0 0; color:var(--text-dim); font-size:12px; line-height:1.5; }

/* Đồng bộ thông báo đăng nhập/đăng xuất với tông cam đào hiện tại. */
body .app-auth-message-ok{
  background:#fff0e8 !important;
  border:1px solid #edc0aa !important;
  color:#8f4d3b !important;
}
body .app-auth-message-err{
  background:#fff0f0 !important;
  border:1px solid #e9b3b3 !important;
  color:#a34d4d !important;
}

/* Tab Bảng giá trong quản trị không dùng lại nền xanh của theme cũ. */
body.admin-interface .admin-price-group{
  background:#fff8f3 !important;
  border-color:#efcdbc !important;
  color:#1d1d1f !important;
}
body.admin-interface .admin-price-tab-form input,
body.admin-interface .admin-price-row-form input,
body.admin-interface .admin-price-add-form input,
body.admin-interface .admin-price-new-tab input{
  background:#fff !important;
  border-color:#e8c9bb !important;
  color:#1d1d1f !important;
}
body.admin-interface .admin-price-tab-form input::placeholder,
body.admin-interface .admin-price-row-form input::placeholder,
body.admin-interface .admin-price-add-form input::placeholder,
body.admin-interface .admin-price-new-tab input::placeholder{ color:#9b8075 !important; }
body.admin-interface .admin-price-table{
  background:#fff !important;
  border-color:#e8c9bb !important;
  color:#1d1d1f !important;
}
body.admin-interface .admin-price-table th{
  background:#ffe8dc !important;
  border-color:#edc0aa !important;
  color:#6e4a3e !important;
}
body.admin-interface .admin-price-table td{ color:#1d1d1f !important; border-color:#f0ddd4 !important; }
body.admin-interface .admin-price-table td:last-child{ color:#a84f45 !important; }
body.admin-interface .admin-price-group .admin-action-button,
body.admin-interface .admin-price-group .admin-delete-button{
  background:transparent !important;
  border-color:#d98d73 !important;
  color:#a84f45 !important;
}
body.admin-interface .admin-price-group .admin-action-button:hover,
body.admin-interface .admin-price-group .admin-delete-button:hover{
  background:#ffe4d8 !important;
  border-color:#c9633d !important;
  color:#8f4d3b !important;
}
/* Tab quản trị đang chọn có nền cam thì chữ và mọi nội dung bên trong phải trắng. */
body.admin-interface .admin-tabs .admin-tab.is-active,
body.admin-interface .admin-tabs .admin-tab.is-active:hover,
body.admin-interface .admin-tabs .admin-tab.is-active:focus,
body.admin-interface .admin-tabs .admin-tab.is-active *{
  background:#c9633d !important;
  border-color:#c9633d !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
/* Các liên kết quản trị trong tab Tài khoản: nền cam phải đi cùng chữ trắng. */
body .app-admin-link,
body .app-admin-link:hover,
body .app-admin-link:focus,
body .app-admin-link *{
  background:#c9633d !important;
  border-color:#c9633d !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
body .app-admin-link .app-notification-badge{
  background:#ef4964 !important;
  border-color:#ef4964 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
body .app-logout-link{
  display:flex !important;
  width:100%;
  max-width:680px;
  min-height:45px !important;
  margin:12px auto 0 !important;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border:0 !important;
  border-radius:12px !important;
  background:#c9633d !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:700;
  text-decoration:none;
  box-shadow:0 12px 24px -16px rgba(201,99,61,.65);
}
body .app-logout-link:hover{
  background:#d97970 !important;
  color:#fff !important;
  transform:translateY(-1px);
}
body.desktop-tab-view .app-logout-link{
  min-height:50px !important;
  margin-top:16px !important;
  border:1px solid #c9633d !important;
  font-size:15px !important;
}

/* Header PC: menu dùng chung một mặt kính với header, không còn khung trắng riêng. */
@media (min-width:701px){
  body header nav.links,
  body.tab-ui-active header nav.links,
  body.desktop-tab-view header nav.links,
  body:not(.tab-ui-active) header nav.links{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
  }
  body header nav.links a,
  body.tab-ui-active header nav.links a,
  body.desktop-tab-view header nav.links a,
  body:not(.tab-ui-active) header nav.links a{
    background:transparent !important;
    border:0 !important;
    border-radius:10px !important;
  }
  body header nav.links a:hover,
  body header nav.links a:focus-visible{
    background:rgba(242,140,82,.12) !important;
  }
}

/* Dock dưới kiểu liquid glass, dùng highlight nhẹ thay cho một hộp trắng đặc. */
body .mobile-tabs{
  isolation:isolate;
  overflow:hidden;
  background:rgba(255,255,255,.48) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 18px 42px -20px rgba(46,32,27,.36), inset 0 1px 0 rgba(255,255,255,.9), inset 0 -1px 0 rgba(255,255,255,.28) !important;
  -webkit-backdrop-filter:blur(28px) saturate(1.65);
  backdrop-filter:blur(28px) saturate(1.65);
}
body .mobile-tabs::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.68),rgba(255,255,255,.22));
  pointer-events:none;
}
body .mobile-tab{
  position:relative;
  z-index:1;
  border-radius:14px !important;
  color:#665650 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.8);
}
body .mobile-tab.active{
  color:#c9633d !important;
}
body .mobile-tab.active::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:4px 5px;
  border:1px solid rgba(242,140,82,.22);
  border-radius:13px;
  background:rgba(255,255,255,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68), 0 5px 12px -10px rgba(201,99,61,.7);
}
body.admin-interface .admin-video-status{
  color:#a84f45 !important;
  font-size:11px;
}
body.admin-interface .admin-video-progress{ display:flex; align-items:center; gap:8px; width:min(100%,320px); margin-top:7px; }
body.admin-interface .admin-video-progress-track{ flex:1; height:7px; overflow:hidden; border-radius:99px; background:#ffe4d8; }
body.admin-interface .admin-video-progress-track span{ display:block; height:100%; min-width:2px; border-radius:inherit; background:#f28c52; transition:width .35s ease; }
body.admin-interface .admin-video-progress > b{ min-width:34px; color:#a84f45; font-size:11px; text-align:right; }
body.admin-interface .admin-video-progress.is-indeterminate .admin-video-progress-track span{ width:38% !important; animation:admin-upload-indeterminate 1.1s ease-in-out infinite alternate; }
body.admin-interface .admin-video-document[data-video-status="ready"] .admin-video-status{
  color:#4b7a5e !important;
}
body.admin-interface .admin-video-document[data-video-status="error"] .admin-video-status{
  color:#a34d4d !important;
}
body.admin-interface .admin-video-document .admin-document-link[aria-disabled="true"]{
  opacity:.6;
}

/* Thư viện tài liệu dùng nền cam; các nhãn trên nền này cần màu sáng. */
body .lookup-page .lookup-heading .eyebrow,
body .lookup-page .lookup-heading .eyebrow::before{ color:rgba(255,255,255,.9) !important; }
body .document-library-head > div > span{ color:rgba(255,255,255,.9) !important; }
body .document-library-head small{ border-color:rgba(255,255,255,.5) !important; color:rgba(255,255,255,.95) !important; }
body .lookup-page .lookup-heading .document-account-back{ display:inline-flex; margin-top:18px; border-color:rgba(255,255,255,.6) !important; background:transparent !important; color:#fff !important; }
body .lookup-page .lookup-heading .document-account-back:hover{ border-color:#fff !important; background:rgba(255,255,255,.14) !important; color:#fff !important; }

/* Biểu tượng tài liệu theo định dạng. */
.admin-document-summary{ flex:1; }
body .document-file-mark.file-type-pdf{ background:#fff0ef !important; color:#c64f4d !important; }
body .document-file-mark.file-type-doc,
body .document-file-mark.file-type-docx{ background:#edf3ff !important; color:#3971c6 !important; }
body .document-file-mark.file-type-xls,
body .document-file-mark.file-type-xlsx{ background:#eaf8f0 !important; color:#23885d !important; }
body .document-file-mark.file-type-jpg,
body .document-file-mark.file-type-jpeg,
body .document-file-mark.file-type-png,
body .document-file-mark.file-type-webp{ background:#f8effd !important; color:#9b56bd !important; }
body .document-file-mark.file-type-mp4,
body .document-file-mark.file-type-webm,
body .document-file-mark.file-type-ogg,
body .document-file-mark.file-type-ogv,
body .document-file-mark.file-type-m4v,
body .document-file-mark.file-type-mov{ background:#fff1e8 !important; color:#d66b37 !important; }
body .document-file-mark.file-type-txt{ background:#f0f3f7 !important; color:#66758b !important; }
body .document-file-mark.file-type-file{ background:#f7f1eb !important; color:#927057 !important; }