/* ==========================================================================
   Chế độ SÁNG cho web khách / người làm / quản trị / đăng nhập (html[data-theme="light"], đặt bởi js/theme-init.js).
   Giữ nguyên bố cục; chỉ đổi biến màu và các bề mặt tối cố định. Mặc định vẫn là giao diện tối.
   ========================================================================== */
html[data-theme="light"] {
  color-scheme: light;
  --glass: rgba(255, 255, 255, .82);
  --glass-strong: rgba(255, 255, 255, .95);
  --border: rgba(15, 23, 42, .12);
  --text: #0f172a;
  --muted: #566176;
  --shadow: 0 18px 44px rgba(30, 41, 80, .14);
  --g-surface: linear-gradient(155deg, rgba(255,255,255,.96), rgba(255,255,255,.82));
  --g-tint: rgba(255, 255, 255, .9);
  --g-line: rgba(15, 23, 42, .14);
  --g-hi: inset 0 1px 0 rgba(255,255,255,.9);
  --g-shadow: 0 18px 44px rgba(30, 41, 80, .16);
}
html[data-theme="light"][data-accent="admin"] { --bg-0: #eef2fb; --bg-1: #f7f9ff; --accent-soft: rgba(91, 124, 255, .13); --glow-a: rgba(91, 124, 255, .16); --glow-b: rgba(155, 107, 255, .10); }
html[data-theme="light"][data-accent="staff"] { --bg-0: #edf4f8; --bg-1: #f6fafc; --accent-soft: rgba(23, 150, 184, .13); --glow-a: rgba(23, 150, 184, .14); --glow-b: rgba(79, 125, 240, .09); }
html[data-theme="light"][data-accent="customer"] { --bg-0: #eef6f3; --bg-1: #f7fbf9; --accent-soft: rgba(20, 184, 140, .14); --glow-a: rgba(20, 184, 140, .14); --glow-b: rgba(34, 197, 214, .10); }

/* chữ & liên kết */
html[data-theme="light"] body { color: var(--text); }
html[data-theme="light"] .muted, html[data-theme="light"] .text-muted, html[data-theme="light"] .card-sub, html[data-theme="light"] small { color: var(--muted) !important; }
html[data-theme="light"] .nav-item:hover { color: var(--text); background: rgba(15, 23, 42, .05); }
html[data-theme="light"] .nav-item.active, html[data-theme="light"] .btn-glow, html[data-theme="light"] .role-tabs a.on { color: #fff; }

/* bề mặt tối cố định → sáng */
html[data-theme="light"] .modal-box, html[data-theme="light"] .welcome-box, html[data-theme="light"] .gs-res, html[data-theme="light"] .cam-box { background: #ffffff; color: var(--text); border-color: var(--border); }
html[data-theme="light"] .sidebar, html[data-theme="light"] .topbar, html[data-theme="light"] .glass, html[data-theme="light"] .cnav, html[data-theme="light"] .gsheet { background: var(--glass); border-color: var(--border); box-shadow: var(--shadow); }
html[data-theme="light"] .cnav a { color: var(--muted); } html[data-theme="light"] .cnav a.on { color: var(--text); }
html[data-theme="light"] .ap-panel { background: rgba(255, 255, 255, .92); } html[data-theme="light"] .ap-stage.collapsed .ap-panel { background: rgba(255, 255, 255, .95); }
html[data-theme="light"] .ap-legend { background: rgba(255, 255, 255, .92); color: var(--text); }

/* ô nhập */
html[data-theme="light"] input:not([type=checkbox]):not([type=radio]):not([type=range]), html[data-theme="light"] select, html[data-theme="light"] textarea,
html[data-theme="light"] .form-glass, html[data-theme="light"] .pin-input { background: #fff; color: var(--text); border-color: rgba(15, 23, 42, .18); }
html[data-theme="light"] input::placeholder, html[data-theme="light"] textarea::placeholder { color: #8791a5; }
html[data-theme="light"] select option { background: #fff; color: #0f172a; }
html[data-theme="light"] .field label { color: var(--muted); }

/* ô nhập nằm trong khung riêng (tìm kiếm...) giữ nền trong suốt như bản tối */
html[data-theme="light"] .search, html[data-theme="light"] .od-search input, html[data-theme="light"] .trips-search input, html[data-theme="light"] .help-search input { background: rgba(15, 23, 42, .05); }
html[data-theme="light"] .search input { background: transparent !important; border: 0 !important; }

/* nút, chip, viên thuốc, thẻ con */
html[data-theme="light"] .btn-ghost, html[data-theme="light"] .btn-line, html[data-theme="light"] .icon-btn, html[data-theme="light"] .alt-chip, html[data-theme="light"] .chip, html[data-theme="light"] .map-theme-btn { background: rgba(15, 23, 42, .05); color: var(--text); border-color: var(--border); }
html[data-theme="light"] .btn-ghost:hover, html[data-theme="light"] .icon-btn:hover { background: rgba(15, 23, 42, .09); }
html[data-theme="light"] .seg, html[data-theme="light"] .role-tabs { background: rgba(15, 23, 42, .06); border-color: var(--border); }
html[data-theme="light"] .seg button, html[data-theme="light"] .role-tabs a { color: var(--muted); }
html[data-theme="light"] .seg button.on { color: #fff; }
html[data-theme="light"] .pill { background: rgba(15, 23, 42, .07); color: var(--text); border-color: var(--border); }
html[data-theme="light"] .pbox, html[data-theme="light"] .tile, html[data-theme="light"] .tr-card, html[data-theme="light"] .as-row, html[data-theme="light"] .addr-row, html[data-theme="light"] .row-item, html[data-theme="light"] .goal-card, html[data-theme="light"] .pin-box,
html[data-theme="light"] .shot, html[data-theme="light"] .contract-box, html[data-theme="light"] .kyc-note, html[data-theme="light"] .kyc-sw, html[data-theme="light"] .ob-steps li { background: rgba(255, 255, 255, .7); border-color: var(--border); }
html[data-theme="light"] .meter { background: rgba(15, 23, 42, .08); }
html[data-theme="light"] .alert-glass { background: rgba(251, 93, 110, .10); color: #7f1d2b; border-color: rgba(251, 93, 110, .35); }
html[data-theme="light"] .alert-glass.alert-ok { background: rgba(34, 197, 94, .12); color: #14532d; border-color: rgba(34, 197, 94, .4); }
html[data-theme="light"] .hint.ok, html[data-theme="light"] .as-ok { color: #15803d; } html[data-theme="light"] .hint.bad, html[data-theme="light"] .as-bad { color: #be123c; }
html[data-theme="light"] .pill.lv-ok { color: #15803d; } html[data-theme="light"] .pill.lv-warn { color: #b45309; } html[data-theme="light"] .pill.lv-bad { color: #be123c; }
html[data-theme="light"] .sys-matrix .yes { color: #15803d; }

/* bản đồ: nền sáng thật, không đảo màu, không tối viền */
html[data-theme="light"] .dark-tiles .leaflet-tile-pane { filter: none !important; }
html[data-theme="light"] .gmap::after { display: none; }
html[data-theme="light"] .leaflet-bar a { background: #fff !important; color: #1f2937 !important; border-color: #e5e7eb !important; }
html[data-theme="light"] .leaflet-tooltip { background: #fff; color: #111827; border-color: #e5e7eb; }
html[data-theme="light"] .leaflet-control-attribution { background: rgba(255, 255, 255, .85) !important; color: #374151; }

/* thông báo nổi, khung xương, trạng thái */
html[data-theme="light"] .toast { background: #0f172a; color: #fff; }
html[data-theme="light"] .welcome-dots span { background: rgba(15, 23, 42, .2); } html[data-theme="light"] .welcome-dots span.on { background: var(--accent); }
html[data-theme="light"] .welcome-back, html[data-theme="light"] .cam-back { background: rgba(240, 244, 250, .85); }

/* trang đăng nhập/đăng ký */
html[data-theme="light"] .pw-eye { color: var(--muted); } html[data-theme="light"] .pw-meter i { background: rgba(15, 23, 42, .12); }
html[data-theme="light"] .otp-box { background: var(--accent-soft); }

/* bề mặt kính của màn hình bản đồ (khách /app, người làm /staff, bản đồ trực tiếp): specificity cao hơn :root[data-accent] và quy tắc !important trên điện thoại */
html[data-theme="light"][data-accent] { --g-tint: rgba(255, 255, 255, .9); }
html[data-theme="light"] .gsheet, html[data-theme="light"] .lm-panel, html[data-theme="light"] .lm-card, html[data-theme="light"] .lm-pop { background: rgba(255, 255, 255, .96) !important; color: var(--text); }
html[data-theme="light"] .gchip, html[data-theme="light"] .big-toggle, html[data-theme="light"] .legend, html[data-theme="light"] .live-panel, html[data-theme="light"] .lm-btn, html[data-theme="light"] .lm-search { background: rgba(255, 255, 255, .94) !important; color: var(--text); border-color: var(--border); }
html[data-theme="light"] #centerBtn { background: #fff !important; color: var(--text); }
html[data-theme="light"] body[data-page="customer"].map-off .gscreen, html[data-theme="light"] .gscreen { background: var(--bg-0); }
html[data-theme="light"] .banner-link { background: var(--accent-soft); color: var(--text); }
html[data-theme="light"] .trust span, html[data-theme="light"] .trust-item, html[data-theme="light"] .svc-card, html[data-theme="light"] .svc { color: var(--text); }

/* tiêu đề dạng chữ chuyển màu (trắng → màu nhấn) và nhãn trắng cố định không đọc được trên nền sáng */
html[data-theme="light"] .gsheet h2 { background: linear-gradient(100deg, var(--text), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
html[data-theme="light"] .eta b { background: linear-gradient(100deg, var(--text), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
html[data-theme="light"] .gsheet h3, html[data-theme="light"] .svc small { color: var(--muted); }
html[data-theme="light"] .loc-card { background: rgba(15, 23, 42, .04); border-color: var(--border); color: var(--text); }
html[data-theme="light"] .svc { background: #fff; border-color: var(--border); box-shadow: 0 6px 18px rgba(30, 41, 80, .08); }