/* MỚI (01/10/2026): GIAO DIỆN TUỲ CHỌN cho khách trên insolar.vn (kính mờ + bảng màu nổi tiếng).
   Mặc định KHÔNG bật (giao diện "sang trọng kem – vàng" hiện tại giữ nguyên 100%). Khách tự chọn bằng nút
   bảng màu ở góc dưới bên trái; lựa chọn chỉ lưu trong trình duyệt/thiết bị của chính khách (localStorage
   'insCkTheme'), không gửi lên máy chủ. Mọi quy tắc nằm dưới html[data-glass]. Bảng màu dùng chung với
   insolar.uk (theme-kinh.css). */
html[data-glass] {
  --k-bg: #060a1a;
  --k-glass: rgba(255,255,255,.07);
  --k-glass-strong: rgba(14,22,52,.82);
  --k-line: rgba(255,255,255,.14);
  --k-text: #e8edff;
  --k-t1: #f1f5ff;
  --k-t2: #d3dcf7;
  --k-muted: rgba(203,213,245,.68);
  --k-cyan: #67e8f9;
  --k-grad: linear-gradient(100deg, #38bdf8 0%, #2563eb 55%, #7c3aed 100%);
  --k-grad-soft: linear-gradient(100deg, rgba(56,189,248,.30), rgba(124,58,237,.30));
  --k-ring: rgba(34,211,238,.22);
  --k-glow: rgba(59,130,246,.7);
  --k-input-bg: rgba(8,15,35,.55);
  --k-input-line: rgba(125,211,252,.35);
  --k-focus: #67e8f9;
  --k-blob-a: radial-gradient(circle at 30% 30%, #22d3ee, #2563eb 70%);
  --k-blob-b: radial-gradient(circle at 40% 40%, #4ade80, #10b981 70%);
  --k-blob-c: radial-gradient(circle at 50% 40%, #c026d3, #7c3aed 70%);
  --k-page-bg1: rgba(37,99,235,.55);
  --k-page-bg2: rgba(124,58,237,.5);
  --k-nav-text: #bfe3ff;
  color-scheme: dark;
}
/* ---- bảng màu từng giao diện (chỉ đổi biến, cấu trúc dùng chung) ---- */
html[data-theme="hoang-hon"] {
  --k-bg: #1a0a10; --k-glass-strong: rgba(48,16,22,.84); --k-text: #ffeee4; --k-t1: #fff3ea; --k-t2: #fbdcc8; --k-muted: rgba(253,214,190,.7);
  --k-cyan: #fdba74; --k-grad: linear-gradient(100deg, #fb923c 0%, #ef4444 55%, #c026d3 100%); --k-grad-soft: linear-gradient(100deg, rgba(251,146,60,.32), rgba(236,72,153,.28));
  --k-ring: rgba(251,146,60,.25); --k-glow: rgba(249,115,22,.65); --k-input-bg: rgba(40,12,16,.55); --k-input-line: rgba(253,186,116,.4); --k-focus: #fdba74;
  --k-blob-a: radial-gradient(circle at 30% 30%, #fb923c, #dc2626 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #fde047, #f59e0b 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #f472b6, #be185d 70%);
  --k-page-bg1: rgba(234,88,12,.5); --k-page-bg2: rgba(190,24,93,.5); --k-nav-text: #ffd9bd;
}
html[data-theme="ngoc-luc"] {
  --k-bg: #03130f; --k-glass-strong: rgba(8,36,30,.84); --k-text: #e4fff4; --k-t1: #effff8; --k-t2: #c9efdd; --k-muted: rgba(180,232,208,.7);
  --k-cyan: #6ee7b7; --k-grad: linear-gradient(100deg, #34d399 0%, #059669 55%, #0e7490 100%); --k-grad-soft: linear-gradient(100deg, rgba(52,211,153,.30), rgba(14,116,144,.30));
  --k-ring: rgba(52,211,153,.25); --k-glow: rgba(16,185,129,.65); --k-input-bg: rgba(4,26,21,.55); --k-input-line: rgba(110,231,183,.38); --k-focus: #6ee7b7;
  --k-blob-a: radial-gradient(circle at 30% 30%, #34d399, #047857 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #2dd4bf, #0e7490 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #a3e635, #4d7c0f 70%);
  --k-page-bg1: rgba(5,150,105,.5); --k-page-bg2: rgba(14,116,144,.5); --k-nav-text: #c8f5e0;
}
/* Kính đen — Graphite (MỚI 06/10/2026, theo video mẫu: kính khói đen, viền sáng, icon 2 tông; phần cấu trúc ở glass-black.css + icons-kinh-den.js) */
html[data-theme="kinh-den"] {
  --k-bg: #0b0b0e; --k-glass-strong: rgba(20,20,26,.9); --k-line: rgba(255,255,255,.16); --k-text: #f4f4f6; --k-t1: #ffffff; --k-t2: #d9d9de; --k-muted: rgba(235,235,240,.62);
  --k-cyan: #e4e4ea; --k-grad: linear-gradient(100deg, #5c5c68 0%, #3b3b45 55%, #2a2a32 100%); /* SỬA (08/10/2026): nền bạc sáng #f4f4f6→#a1a1aa + chữ trắng bị loá, khó đọc (thẻ chào, nút chính, tab đang chọn) → đổi sang ghi đậm, chữ trắng tương phản ≥ 6:1 */ --k-grad-soft: linear-gradient(100deg, rgba(255,255,255,.22), rgba(161,161,170,.18));
  --k-ring: rgba(255,255,255,.22); --k-glow: rgba(0,0,0,.65); --k-input-bg: rgba(10,10,14,.6); --k-input-line: rgba(255,255,255,.35); --k-focus: #ffffff;
  --k-blob-a: radial-gradient(circle at 30% 30%, #4b4b55, #1c1c22 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #62626d, #25252c 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #35353d, #121216 70%);
  --k-page-bg1: rgba(70,70,80,.5); --k-page-bg2: rgba(40,40,48,.5); --k-nav-text: #ececf1;
}
/* Dracula (github.com/dracula/dracula-theme, ~23,6 nghìn sao) */
html[data-theme="dracula"] {
  --k-bg: #1e1f29; --k-glass-strong: rgba(40,42,54,.9); --k-line: rgba(189,147,249,.22); --k-text: #f8f8f2; --k-t1: #f8f8f2; --k-t2: #dcdce6; --k-muted: rgba(248,248,242,.62);
  --k-cyan: #8be9fd; --k-grad: linear-gradient(100deg, #bd93f9 0%, #ff79c6 100%); --k-grad-soft: linear-gradient(100deg, rgba(189,147,249,.32), rgba(255,121,198,.26));
  --k-ring: rgba(189,147,249,.3); --k-glow: rgba(189,147,249,.6); --k-input-bg: rgba(30,31,41,.7); --k-input-line: rgba(189,147,249,.45); --k-focus: #bd93f9;
  --k-blob-a: radial-gradient(circle at 30% 30%, #bd93f9, #6d4bd8 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #ff79c6, #b83a82 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #50fa7b, #1f8f4a 70%);
  --k-page-bg1: rgba(109,75,216,.5); --k-page-bg2: rgba(184,58,130,.45); --k-nav-text: #e6dcff;
}
/* Catppuccin Mocha (github.com/catppuccin/catppuccin, ~19,8 nghìn sao) */
html[data-theme="catppuccin"] {
  --k-bg: #11111b; --k-glass-strong: rgba(24,24,37,.9); --k-line: rgba(180,190,254,.2); --k-text: #cdd6f4; --k-t1: #e3e8fb; --k-t2: #bac2de; --k-muted: rgba(166,173,200,.8);
  --k-cyan: #89dceb; --k-grad: linear-gradient(100deg, #89b4fa 0%, #cba6f7 100%); --k-grad-soft: linear-gradient(100deg, rgba(137,180,250,.3), rgba(203,166,247,.3));
  --k-ring: rgba(137,180,250,.28); --k-glow: rgba(203,166,247,.55); --k-input-bg: rgba(17,17,27,.65); --k-input-line: rgba(180,190,254,.4); --k-focus: #b4befe;
  --k-blob-a: radial-gradient(circle at 30% 30%, #cba6f7, #7a5fc2 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #89b4fa, #3b6bc9 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #f5c2e7, #d77fb3 70%);
  --k-page-bg1: rgba(122,95,194,.5); --k-page-bg2: rgba(59,107,201,.45); --k-nav-text: #cfd8ff;
}
/* Solarized Dark (github.com/altercation/solarized, ~16 nghìn sao) */
html[data-theme="solarized"] {
  --k-bg: #001f27; --k-glass-strong: rgba(0,43,54,.92); --k-line: rgba(147,161,161,.22); --k-text: #93a1a1; --k-t1: #eee8d5; --k-t2: #b9c3c3; --k-muted: rgba(147,161,161,.78);
  --k-cyan: #2aa198; --k-grad: linear-gradient(100deg, #268bd2 0%, #2aa198 100%); --k-grad-soft: linear-gradient(100deg, rgba(38,139,210,.3), rgba(42,161,152,.3));
  --k-ring: rgba(42,161,152,.3); --k-glow: rgba(38,139,210,.55); --k-input-bg: rgba(0,31,39,.7); --k-input-line: rgba(42,161,152,.5); --k-focus: #2aa198;
  --k-blob-a: radial-gradient(circle at 30% 30%, #268bd2, #0a4a73 70%); --k-blob-b: radial-gradient(circle at 40% 40%, #2aa198, #0b5b57 70%); --k-blob-c: radial-gradient(circle at 50% 40%, #d33682, #7d1d4b 70%);
  --k-page-bg1: rgba(10,74,115,.6); --k-page-bg2: rgba(125,29,75,.45); --k-nav-text: #cfd9d9;
}
html[data-glass], html[data-glass] body { background: var(--k-bg) !important; color: var(--k-text); }

/* ---- khối màu chất lỏng phía sau (do app-68 chèn #insThemeBlobs) ---- */
#insThemeBlobs { display: none; }
html[data-glass] #insThemeBlobs { display: block; position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
#insThemeBlobs i { position: absolute; border-radius: 50%; filter: blur(14px); opacity: .7; will-change: transform; }
#insThemeBlobs .a { width: 420px; height: 420px; left: -110px; top: 12%; background: var(--k-blob-a); animation: insKA 8s ease-in-out infinite; }
#insThemeBlobs .b { width: 320px; height: 320px; right: -70px; top: -50px; background: var(--k-blob-b); animation: insKB 9.5s ease-in-out infinite; }
#insThemeBlobs .c { width: 380px; height: 380px; right: -90px; bottom: -80px; background: var(--k-blob-c); animation: insKC 11s ease-in-out infinite; }
@keyframes insKA { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(70px,50px) scale(1.12); } }
@keyframes insKB { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-60px,70px) scale(.92); } }
@keyframes insKC { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-80px,-50px) scale(1.1); } }
@media (prefers-reduced-motion: reduce) { #insThemeBlobs i { animation: none; } }


html[data-glass], html[data-glass] body { background: var(--k-bg) !important; color: var(--k-text); }
/* biến màu của trang cửa hàng đổi sang tông kính mờ */
html[data-glass] {
  --noir: var(--k-t1); --ivory: transparent; --paper: rgba(255,255,255,.08); --mist: var(--k-line); --gold: var(--k-cyan); --olive: transparent;
  --ckh-olive: rgba(255,255,255,.16); --ckh-gold: var(--k-cyan); --ckh-paper: rgba(255,255,255,.08); --ckh-line: var(--k-line); --ckh-text: var(--k-t1); --ckh-muted: var(--k-muted); --ckh-price: #fda4af;
}
html[data-glass] .luxury-page { background: transparent !important; position: relative; z-index: 1; }
html[data-glass] .luxury-page::before { display: none; }
html[data-glass] .luxury-brand, html[data-glass] .luxury-copy h1, html[data-glass] .luxury-copy h1 em { color: var(--k-t1) !important; }
html[data-glass] .luxury-copy > p, html[data-glass] .luxury-promise div, html[data-glass] .luxury-nav, html[data-glass] #warrEmptyState { color: var(--k-muted) !important; }
html[data-glass] .luxury-promise strong, html[data-glass] #warrSearchForm label { color: var(--k-t1) !important; }
html[data-glass] .luxury-eyebrow, html[data-glass] .card-kicker, html[data-glass] .luxury-nav span:first-child { color: var(--k-cyan) !important; }
html[data-glass] .luxury-eyebrow::before { background: var(--k-cyan); }
html[data-glass] .luxury-promise { border-color: var(--k-line) !important; }
html[data-glass] .luxury-footer { color: var(--k-muted) !important; }
html[data-glass] .luxury-mark, html[data-glass] .ckh-logo { border-color: var(--k-cyan) !important; }

/* thẻ / bảng → kính mờ */
html[data-glass] .warranty-card, html[data-glass] .ckh-panel, html[data-glass] #ckPanelBody .bg-white, html[data-glass] #warrChatPanel, html[data-glass] .bg-white {
  background: linear-gradient(150deg, rgba(255,255,255,.12), rgba(255,255,255,.04)) !important; border: 1px solid var(--k-line) !important;
  border-radius: 20px !important; -webkit-backdrop-filter: blur(18px) saturate(130%); backdrop-filter: blur(18px) saturate(130%);
  box-shadow: 0 16px 44px -18px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
html[data-glass] .warranty-card::before { display: none; }
html[data-glass] #warrResultBox .bg-ink-50, html[data-glass] #ckPanelBody .bg-ink-50, html[data-glass] #ckPanelBody .bg-brand-50, html[data-glass] .bg-ink-50 { background: rgba(255,255,255,.06) !important; border-color: var(--k-line) !important; border-radius: 12px !important; }

/* lớp phủ cửa hàng + thanh trên + thanh dưới */
html[data-glass] #ckOverlay { background: radial-gradient(900px 600px at 10% 15%, var(--k-page-bg1), transparent 60%), radial-gradient(800px 560px at 92% 92%, var(--k-page-bg2), transparent 60%), var(--k-bg) !important; color: var(--k-t1); }
/* SỬA (02/10/2026): thanh trên giờ cố định nên nội dung cuộn dưới nó — lớp kính trong suốt khiến chữ/giờ/pin ở trên cùng bị mờ, thấy bóng nội dung xuyên qua. Đặt lớp kính lên NỀN ĐẶC (--k-bg) để chữ sắc nét. */
html[data-glass] #ckOverlay > div:first-child { background: linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.04)), var(--k-bg) !important; border-color: var(--k-line) !important; -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); box-shadow: none !important; }
html[data-glass] #ckPanelTitle { color: var(--k-t1) !important; }
html[data-glass] #ckCloseBtn, html[data-glass] #ckBackBtn, html[data-glass] #ckMenuBtn, html[data-glass] .ckh-iconbtn { border-color: var(--k-line) !important; color: var(--k-t1) !important; background: rgba(255,255,255,.08) !important; border-radius: 14px !important; }
html[data-glass] #ckBottomNav { background: var(--k-glass-strong) !important; border-color: var(--k-line) !important; -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); }
html[data-glass] #ckBottomNav button { color: var(--k-muted) !important; }
html[data-glass] #ckBottomNav button.ckh-nav-active { color: var(--k-cyan) !important; }
html[data-glass] #ckBottomNav button.ckh-nav-active::before { background: var(--k-cyan) !important; }
html[data-glass] #ckPanelBody [data-ckopen] { background: linear-gradient(150deg, rgba(255,255,255,.12), rgba(255,255,255,.04)) !important; border-color: var(--k-line) !important; border-radius: 16px !important; }
html[data-glass] #ckPanelBody [data-ckopen]:hover { border-color: var(--k-cyan) !important; background: rgba(255,255,255,.14) !important; }
html[data-glass] #ckPanelBody [data-ckopen] p:first-child { color: var(--k-t1) !important; }
html[data-glass] #ckPanelBody [data-ckopen] p:nth-child(2) { color: var(--k-muted) !important; }
html[data-glass] #ckPanelBody [data-ckopen] > div:first-child { background: rgba(255,255,255,.1) !important; border-color: var(--k-line) !important; border-radius: 12px !important; color: var(--k-cyan) !important; }
html[data-glass] #ckPanelBody [data-ckopen] > i { color: var(--k-cyan) !important; }

/* chữ Tailwind dùng trong trang */
html[data-glass] .text-ink-900, html[data-glass] .text-ink-800, html[data-glass] .text-ink-700, html[data-glass] #ckPanelBody .text-ink-900, html[data-glass] #ckPanelBody .text-brand-600 { color: var(--k-t1) !important; }
html[data-glass] .text-ink-600, html[data-glass] .text-ink-500 { color: var(--k-t2) !important; }
html[data-glass] .text-ink-400, html[data-glass] .text-ink-300 { color: var(--k-muted) !important; }
html[data-glass] .border-ink-100, html[data-glass] .border-ink-200, html[data-glass] .border-ink-50 { border-color: var(--k-line) !important; }
html[data-glass] .hover\:bg-ink-50:hover { background-color: rgba(255,255,255,.1) !important; }
html[data-glass] .divide-y > :not([hidden]) ~ :not([hidden]) { border-color: var(--k-line) !important; }

/* nút + ô nhập */
html[data-glass] #warrSearchForm button[type="submit"], html[data-glass] #ckPanelBody button.bg-brand-600, html[data-glass] .bg-brand-600, html[data-glass] #warrChatBubble, html[data-glass] #ckCartFab {
  background: var(--k-grad) !important; color: #fff !important; border-radius: 14px !important; box-shadow: 0 10px 28px -10px var(--k-glow) !important; border: 0 !important;
}
html[data-glass] #warrChatBubble, html[data-glass] #ckCartFab { border-radius: 9999px !important; }
html[data-glass] #warrChatPanel > div:first-child { background: var(--k-grad) !important; }
html[data-glass] input:not([type="checkbox"]):not([type="radio"]), html[data-glass] select, html[data-glass] textarea, html[data-glass] #warrSerialInput, html[data-glass] #ckPanelBody input, html[data-glass] #ckPanelBody textarea, html[data-glass] #ckPanelBody select, html[data-glass] .ckh-search-box input {
  background: var(--k-input-bg) !important; color: var(--k-t1) !important; border: 1px solid var(--k-input-line) !important; border-radius: 14px !important;
}
html[data-glass] .ckh-search-box input { border-radius: 999px !important; }
html[data-glass] input:focus, html[data-glass] textarea:focus, html[data-glass] select:focus { outline: none !important; border-color: var(--k-focus) !important; box-shadow: 0 0 0 3px var(--k-ring), 0 0 20px var(--k-ring) !important; }
html[data-glass] ::placeholder { color: rgba(203,213,245,.5) !important; }
html[data-glass] select option { background: var(--k-bg); color: var(--k-t1); }
html[data-glass] #warrScanBtn { background: rgba(255,255,255,.08) !important; border-radius: 14px !important; color: var(--k-t1) !important; }
html[data-glass] #warrChatPanel { background: var(--k-glass-strong) !important; }
html[data-glass] .warr-chat-bubble-assistant { background: rgba(255,255,255,.1) !important; color: var(--k-t1) !important; }
html[data-glass] .warr-chat-bubble-user { background: var(--k-grad) !important; }

/* giá, nhãn */
html[data-glass] .ckh { color: var(--k-t1); }
html[data-glass] .text-brand-700, html[data-glass] .text-brand-500 { color: var(--k-cyan) !important; }
html[data-glass] .bg-brand-50, html[data-glass] .bg-brand-100 { background-color: rgba(255,255,255,.1) !important; }
html[data-glass] .bg-emerald-50, html[data-glass] .bg-green-50 { background-color: rgba(52,211,153,.16) !important; }
html[data-glass] .bg-rose-50, html[data-glass] .bg-red-50 { background-color: rgba(251,113,133,.16) !important; }
html[data-glass] .bg-amber-50, html[data-glass] .bg-yellow-50 { background-color: rgba(251,191,36,.16) !important; }
html[data-glass] .text-emerald-600, html[data-glass] .text-emerald-700 { color: #6ee7b7 !important; }
html[data-glass] .text-rose-600, html[data-glass] .text-red-600 { color: #fda4af !important; }
html[data-glass] .text-amber-600, html[data-glass] .text-amber-700 { color: #fcd34d !important; }


/* chữ có màu cố định trong trang cửa hàng → đổi theo bảng màu */
html[data-glass] .ckh-sc-label, html[data-glass] .ckh-mini-name, html[data-glass] .ckh-pname, html[data-glass] .ckh-news-title, html[data-glass] .ckh-field, html[data-glass] .ckh-stages button, html[data-glass] .ckh-stage-ic svg, html[data-glass] .ckh-qty button, html[data-glass] .ck-qty-input, html[data-glass] .ckh-typepick button { color: var(--k-t1) !important; }
html[data-glass] .ckh-cats button, html[data-glass] .ckh-qty-total, html[data-glass] .ckh-pd-desc, html[data-glass] .ckh-consent, html[data-glass] .ckh-search-head, html[data-glass] .ckh-seg button, html[data-glass] .ckh-chip-muted { color: var(--k-t2) !important; }
html[data-glass] .ckh-empty, html[data-glass] .ckh-was, html[data-glass] .ckh-chat-day span, html[data-glass] .ckh-noimg-wrap span, html[data-glass] .ckh-row-chev { color: var(--k-muted) !important; }
html[data-glass] .ckh-more-link, html[data-glass] .ckh-link, html[data-glass] .ckh-row > svg:first-child, html[data-glass] .ckh-typepick button svg, html[data-glass] .ckh-msg-who, html[data-glass] .card-kicker i { color: var(--k-cyan) !important; }
html[data-glass] .ckh-search-box > svg, html[data-glass] .ckh-search-box > i { color: var(--k-muted) !important; }
html[data-glass] .ckh-tone-rose, html[data-glass] .ckh-tone-gold, html[data-glass] .ckh-tone-amber, html[data-glass] .ckh-tone-olive, html[data-glass] .ckh-tone-plum, html[data-glass] .ckh-tone-sky { background: rgba(255,255,255,.1) !important; color: var(--k-cyan) !important; border: 1px solid var(--k-line); }
html[data-glass] .ckh-chip, html[data-glass] .ckh-okbox, html[data-glass] .ckh-ostatus-done { background: rgba(52,211,153,.16) !important; color: #6ee7b7 !important; border-color: rgba(52,211,153,.35) !important; }
html[data-glass] .ckh-ostatus-pending, html[data-glass] .ckh-push { background: rgba(251,191,36,.16) !important; color: #fcd34d !important; border-color: rgba(251,191,36,.35) !important; }
html[data-glass] .ckh-ostatus-processing { background: rgba(56,189,248,.16) !important; color: #7dd3fc !important; }
html[data-glass] .ckh-ostatus-cancelled { background: rgba(255,255,255,.08) !important; color: var(--k-muted) !important; }
html[data-glass] .ckh-btn-primary, html[data-glass] .ckh-cats button.on, html[data-glass] .ckbot-head, html[data-glass] .ckbot-me .ckbot-bubble, html[data-glass] .ckh-seg button.on { background: var(--k-grad) !important; color: #fff !important; border-color: transparent !important; }
/* SỬA (08/10/2026): Kính đen — nút chính/mục đang chọn nay nền ghi đậm, thêm viền sáng mảnh để vẫn nổi bật. */
html[data-theme="kinh-den"] #warrSearchForm button[type="submit"], html[data-theme="kinh-den"] .bg-brand-600, html[data-theme="kinh-den"] #ckCartFab, html[data-theme="kinh-den"] #warrChatBubble, html[data-theme="kinh-den"] .ckh-btn-primary, html[data-theme="kinh-den"] .ckh-cats button.on, html[data-theme="kinh-den"] .ckh-seg button.on, html[data-theme="kinh-den"] .ckh-pd-buy, html[data-theme="kinh-den"] .ckbot-buy { border: 1px solid rgba(255,255,255,.38) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 8px 22px -10px rgba(0,0,0,.7) !important; }
html[data-glass] .ckh-typepick button, html[data-glass] .ckh-qty button { background: rgba(255,255,255,.08) !important; border-color: var(--k-line) !important; }
html[data-glass] .ckh-me-head, html[data-glass] .ckh-slide-voucher { background: var(--k-grad) !important; }
html[data-glass] .ckh-slide-lucky { background: linear-gradient(118deg, rgba(255,255,255,.14), var(--k-glow)) !important; }
html[data-glass] .ckh-slide-tag { color: #fff !important; }

/* ảnh sản phẩm: giữ nền trắng để ảnh rõ, bo góc cho hợp kính mờ */
html[data-glass] #ckPanelBody .ck-product-image-stage, html[data-glass] #ckPanelBody .ck-product-image-stage-sm { border-radius: 14px 14px 0 0; border-color: var(--k-line) !important; }
html[data-glass] ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 8px; }

/* ---- nút chọn giao diện (nổi, góc dưới trái) + bảng chọn ---- */
#insCkThemeBtn { position: fixed; left: 10px; bottom: 76px; z-index: 90; width: 38px; height: 38px; opacity: .88; border-radius: 50%; border: 1px solid rgba(0,0,0,.12); background: rgba(255,255,255,.92); color: #444; display: grid; place-items: center; cursor: pointer; box-shadow: 0 8px 22px -8px rgba(0,0,0,.35); font-size: 18px; line-height: 1; }
html[data-glass] #insCkThemeBtn { background: rgba(255,255,255,.12); color: #fff; border-color: var(--k-line); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
#insCkThemePanel { position: fixed; left: 14px; bottom: 126px; z-index: 91; width: min(300px, calc(100vw - 28px)); max-height: 60vh; overflow-y: auto; border-radius: 18px; padding: 12px; background: rgba(255,255,255,.97); color: #222; border: 1px solid rgba(0,0,0,.1); box-shadow: 0 24px 60px -16px rgba(0,0,0,.45); display: none; }
#insCkThemePanel.open { display: block; }
html[data-glass] #insCkThemePanel { background: var(--k-glass-strong); color: var(--k-t1); border-color: var(--k-line); -webkit-backdrop-filter: blur(26px); backdrop-filter: blur(26px); }
#insCkThemePanel h4 { margin: 0 0 8px; font-size: 13px; font-weight: 700; }
#insCkThemePanel button { width: 100%; display: flex; align-items: center; gap: 10px; text-align: left; padding: 8px; margin-bottom: 6px; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); background: transparent; color: inherit; cursor: pointer; font-size: 12.5px; }
html[data-glass] #insCkThemePanel button { border-color: var(--k-line); }
#insCkThemePanel button.on { border-color: #3b66f5; box-shadow: 0 0 0 2px rgba(59,102,245,.25); }
html[data-glass] #insCkThemePanel button.on { border-color: var(--k-cyan); box-shadow: 0 0 0 2px var(--k-ring); }
#insCkThemePanel .sw { width: 30px; height: 30px; border-radius: 9px; flex: 0 0 30px; }
#insCkThemePanel small { display: block; opacity: .65; font-size: 11px; line-height: 1.3; }
@media (max-width: 820px) { #insCkThemeBtn { bottom: 72px; width: 34px; height: 34px; font-size: 16px; opacity: .8; } #insCkThemePanel { bottom: 114px; } }

html[data-glass] .ckh-slide-cta { background: rgba(255,255,255,.92) !important; color: #1b2340 !important; }
html[data-glass] .ckh-news { border-top-color: var(--k-line) !important; }
html[data-glass] .ckh hr, html[data-glass] .ckh [class*="border-t"], html[data-glass] .ckh [class*="border-b"] { border-color: var(--k-line) !important; }
html[data-glass] .ckh-sec-head h3 svg { color: var(--k-cyan) !important; }
html[data-glass] .ckh-pd-bar { background: var(--k-glass-strong) !important; border-top-color: var(--k-line) !important; -webkit-backdrop-filter: blur(22px); backdrop-filter: blur(22px); }
html[data-glass] .ckh-pd-cart { background: rgba(255,255,255,.1) !important; border-color: var(--k-line) !important; color: var(--k-t1) !important; }
html[data-glass] .ckh-pd-buy, html[data-glass] .ckbot-buy { background: var(--k-grad) !important; color: #fff !important; }
html[data-glass] .ckh-pd-bar button { border-radius: 14px !important; }
