/* Gadkey theme · Arah B · dibangun Tech AI dari desain Design AI (tokens.css + komponen.css) */
/* Plus Jakarta Sans (OFL) — host lokal, variable 400–800, subset latin */
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url('../fonts/plus-jakarta-sans-latin.woff2') format('woff2')}
/* =========================================================================
   GADKEY DESIGN TOKENS · Arah B "Bersih Terang" · v1.0 (Design AI, 4 Okt 2026)
   Satu sumber kebenaran untuk theme WooCommerce gadkey.com (dibangun Tech AI).
   Aturan: komponen HANYA memakai variabel semantik (--c-*, --fs-*, --sp-*, dst.),
   bukan kode HEX langsung. Ganti nilai di sini = seluruh website ikut berubah.
   Kontras sudah dicek dengan rumus WCAG (lihat SPEC-UNTUK-TECH.md bagian 2).
   ========================================================================= */

/* Font: Plus Jakarta Sans (OFL, gratis). Muat 400/500/600/700/800 saja.
   Produksi: host lokal (woff2) + font-display:swap. Cadangan: system-ui. */

:root {
  /* ---------- 1. PALET DASAR (jangan dipakai langsung di komponen) ---------- */
  --gk-hijau-900: #0E2510;   /* footer, blok "Sejak 2006" bagian gelap */
  --gk-hijau-800: #143216;   /* WARNA UTAMA: tombol, judul aktif, header pita */
  --gk-hijau-600: #3E5940;   /* ikon sekunder, tautan "Lihat semua" */
  --gk-hijau-100: #E7EEE4;   /* latar pilihan aktif, label "Cocok" */
  --gk-hijau-50:  #F1F5EF;
  --gk-emas-500:  #CDAB3D;   /* HANYA garis, ikon, titik aksen. Bukan teks di latar terang */
  --gk-emas-200:  #E5D196;   /* teks aksen HANYA di atas hijau-800/900 */
  --gk-krem-100:  #F4F1EA;   /* permukaan alternatif (kolom cari, blok) */
  --gk-krem-200:  #EAE5D8;
  --gk-putih:     #FFFFFF;
  --gk-arang-900: #1C1F1C;   /* teks utama */
  --gk-abu-600:   #5E625C;   /* teks sekunder (6,2:1 di putih) */
  --gk-abu-400:   #8C8F88;   /* border input, ikon nonaktif */
  --gk-abu-300:   #E3DFD4;   /* garis/border */
  --gk-abu-100:   #F7F6F2;
  --gk-sukses-700:#2F7D3A;  --gk-sukses-100:#EAF6EA;
  --gk-awas-700:  #8A5A00;  --gk-awas-100:  #FFF4D6;
  --gk-bahaya-700:#B42318;  --gk-bahaya-100:#FDECEA;
  --gk-diskon-700:#B4561F;   /* label diskon (putih di atasnya 4,9:1) */

  /* ---------- 2. WARNA SEMANTIK (dipakai komponen) ---------- */
  --c-bg:            var(--gk-putih);
  --c-surface:       var(--gk-putih);
  --c-surface-alt:   var(--gk-krem-100);
  --c-surface-dark:  var(--gk-hijau-800);
  --c-surface-darker:var(--gk-hijau-900);
  --c-text:          var(--gk-arang-900);
  --c-text-2:        var(--gk-abu-600);
  --c-text-invert:   var(--gk-putih);
  --c-text-invert-2: #C3CDBF;               /* teks sekunder di hijau gelap (8,5:1) */
  --c-text-accent-on-dark: var(--gk-emas-200);
  --c-primary:       var(--gk-hijau-800);
  --c-primary-hover: #0B2A0E;
  --c-on-primary:    var(--gk-putih);
  --c-link:          var(--gk-hijau-600);
  --c-border:        var(--gk-abu-300);
  --c-border-strong: #8C8F88;             /* border input & checkbox: 3,3:1 (syarat WCAG 1.4.11 ≥3:1) */
  --c-placeholder:   #6F736B;             /* teks placeholder: 4,8:1 */
  --c-selected-bg:   var(--gk-hijau-100);
  --c-selected-border: var(--gk-hijau-800);
  --c-accent-line:   var(--gk-emas-500);
  --c-focus:         #2B6CB0;               /* cincin fokus keyboard, beda dari brand agar jelas */
  --c-success: var(--gk-sukses-700); --c-success-bg: var(--gk-sukses-100);
  --c-warning: var(--gk-awas-700);   --c-warning-bg: var(--gk-awas-100);
  --c-danger:  var(--gk-bahaya-700); --c-danger-bg:  var(--gk-bahaya-100);
  --c-sale:    var(--gk-diskon-700);
  --c-overlay: rgba(14, 37, 16, .45);       /* latar di balik drawer/sheet */
  --c-wa:      var(--gk-hijau-800);         /* tombol WhatsApp memakai warna brand, bukan hijau WA */

  /* ---------- 3. TIPOGRAFI ---------- */
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extrabold: 800;
  /* Skala (px → rem, 1rem = 16px). Teks isi minimal 13px di HP. */
  --fs-11: .6875rem;  /* label kecil: badge, keterangan foto */
  --fs-12: .75rem;    /* teks bantuan, meta kartu */
  --fs-13: .8125rem;  /* nama produk di kartu, chip */
  --fs-14: .875rem;   /* teks isi HP, tombol kecil */
  --fs-15: .9375rem;  /* tombol utama, isi desktop */
  --fs-16: 1rem;      /* input (WAJIB ≥16px agar iPhone tidak zoom) */
  --fs-18: 1.125rem;
  --fs-20: 1.25rem;   /* judul bagian HP */
  --fs-24: 1.5rem;    /* judul bagian desktop, harga produk HP */
  --fs-28: 1.75rem;   /* H1 HP */
  --fs-36: 2.25rem;   /* H1 desktop */
  --fs-48: 3rem;      /* angka "2006" */
  --lh-tight: 1.15; --lh-snug: 1.3; --lh-normal: 1.5; --lh-relaxed: 1.65;
  --ls-tight: -.02em; --ls-normal: 0; --ls-caps: .08em;
  /* Peran (pakai ini di komponen) */
  --t-h1: var(--fw-extrabold) var(--fs-28)/var(--lh-tight) var(--font-sans);
  --t-h2: var(--fw-extrabold) var(--fs-20)/var(--lh-snug) var(--font-sans);
  --t-h3: var(--fw-bold) var(--fs-16)/var(--lh-snug) var(--font-sans);
  --t-body: var(--fw-regular) var(--fs-14)/var(--lh-normal) var(--font-sans);
  --t-small: var(--fw-medium) var(--fs-12)/var(--lh-normal) var(--font-sans);
  --t-price: var(--fw-extrabold) var(--fs-15)/1 var(--font-sans);
  --t-price-lg: var(--fw-extrabold) var(--fs-28)/1 var(--font-sans);
  --t-btn: var(--fw-bold) var(--fs-15)/1 var(--font-sans);
  --t-caps: var(--fw-bold) var(--fs-11)/1 var(--font-sans); /* + letter-spacing caps */

  /* ---------- 4. SPASI (kelipatan 4px) ---------- */
  --sp-0: 0; --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-16: 64px; --sp-20: 80px;
  --gutter: 16px;            /* tepi kiri-kanan halaman (HP) */
  --section-gap: 32px;       /* jarak antar bagian (HP) */
  --container: 1200px;       /* lebar konten maks. desktop */

  /* ---------- 5. RADIUS ---------- */
  --r-xs: 6px;   /* badge */
  --r-sm: 8px;   /* thumbnail kecil */
  --r-md: 12px;  /* chip model, input */
  --r-lg: 16px;  /* tombol, kartu info */
  --r-xl: 20px;  /* kartu produk, banner, galeri */
  --r-2xl: 28px; /* bottom sheet atas */
  --r-full: 999px;

  /* ---------- 6. BAYANGAN (diwarnai hijau, bukan hitam) ---------- */
  --sh-1: 0 1px 2px rgba(20, 50, 22, .06);
  --sh-2: 0 6px 20px rgba(20, 50, 22, .08);       /* bar beli menempel, header saat digulir */
  --sh-3: 0 18px 48px rgba(20, 50, 22, .18);      /* drawer, mega menu, sheet */
  --sh-focus: 0 0 0 3px rgba(43, 108, 176, .45);

  /* ---------- 7. UKURAN KOMPONEN ---------- */
  --tap-min: 44px;           /* target sentuh minimum */
  --btn-h: 52px;  --btn-h-sm: 40px;
  --input-h: 52px;
  --chip-h: 40px;
  --header-h: 60px;          /* baris logo HP */
  --buybar-h: 76px;          /* bar beli menempel (tanpa safe-area) */
  --drawer-w: min(88vw, 360px);
  --card-img-ratio: 1 / 1;

  /* ---------- 8. GERAK ---------- */
  --dur-1: 120ms; --dur-2: 200ms; --dur-3: 320ms;
  --ease: cubic-bezier(.2, .7, .2, 1);

  /* ---------- 9. LAPISAN ---------- */
  --z-header: 50; --z-buybar: 60; --z-overlay: 90; --z-drawer: 100; --z-toast: 120;
}

/* ---------- 10. BREAKPOINT (CSS belum mendukung variabel di @media; pakai angka ini) ----------
   HP      : 0 – 599px      (desain acuan 390px)
   Tablet  : 600 – 1023px   (gutter 24px, grid produk 3 kolom)
   Desktop : ≥ 1024px       (header 2 baris, grid 4 kolom, sidebar filter)
   Lebar   : ≥ 1280px       (container 1200px di tengah, desain acuan 1440px) */
@media (min-width: 600px) {
  :root { --gutter: 24px; --section-gap: 40px; }
}
@media (min-width: 1024px) {
  :root {
    --gutter: 32px; --section-gap: 56px;
    --t-h1: var(--fw-extrabold) var(--fs-36)/var(--lh-tight) var(--font-sans);
    --t-h2: var(--fw-extrabold) var(--fs-24)/var(--lh-snug) var(--font-sans);
    --t-body: var(--fw-regular) var(--fs-15)/var(--lh-normal) var(--font-sans);
    --btn-h: 48px;
  }
}

/* Hormati pengguna yang mematikan animasi */
@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; }
}

/* Gadkey Arah B · komponen & tata letak mockup Tahap 2 (Design AI, 4 Okt 2026)
   Semua nilai dari ../tokens.css. Nama kelas memakai awalan gk- agar aman di theme WooCommerce. */


*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;background:var(--c-bg)}
body{font:var(--t-body);color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}
:focus-visible{outline:none;box-shadow:var(--sh-focus);border-radius:var(--r-sm)}
.ic{width:22px;height:22px;flex:none;fill:none} /* isi ikon diatur CSS (symbol tidak memaku fill), mis. ♡ aktif & bintang */
.ic-s{width:16px;height:16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}
.hp-saja{display:block}.desk-saja{display:none!important}
@media(min-width:1024px){.hp-saja{display:none!important}.desk-saja{display:revert!important}}


/* ================= HEADER ================= */
.gk-pita{background:var(--c-surface-dark);color:var(--c-text-invert);font:600 var(--fs-12)/1.2 var(--font-sans);text-align:center;padding:9px var(--gutter)}
.gk-pita b{color:var(--c-text-accent-on-dark)}
.gk-hdr{background:var(--c-surface);position:sticky;top:0;z-index:var(--z-header);border-bottom:1px solid var(--c-border)}
.gk-hdr .r1{display:flex;align-items:center;gap:4px;height:var(--header-h)}
.gk-logo img{height:28px;width:auto}
.gk-ibtn{width:var(--tap-min);height:var(--tap-min);display:grid;place-items:center;border-radius:var(--r-md);position:relative;color:var(--c-primary);flex:none}
.gk-ibtn:hover{background:var(--c-surface-alt)}
.gk-hitung{position:absolute;top:4px;right:2px;min-width:18px;height:18px;border-radius:9px;background:var(--c-primary);color:#fff;font:700 10px/18px var(--font-sans);text-align:center;padding:0 5px}
.gk-cari{display:flex;align-items:center;gap:10px;height:46px;border-radius:var(--r-lg);background:var(--c-surface-alt);padding:0 14px;color:var(--c-text-2);font-size:var(--fs-14);border:1.5px solid transparent;width:100%}
.gk-cari .ic{color:var(--c-primary)}
.gk-cari input{border:0;background:none;outline:none;flex:1;font-size:var(--fs-16);color:var(--c-text)}
.gk-cari:focus-within{border-color:var(--c-primary);background:#fff}
.gk-hdr .r2{padding-bottom:10px}
.gk-hpbar{display:flex;align-items:center;gap:8px;background:var(--c-surface-alt);border-radius:var(--r-md);padding:9px 12px;margin-top:8px;font-size:var(--fs-13)}
.gk-hpbar .ic{width:18px;height:18px;color:var(--c-primary)}
.gk-hpbar b{font-weight:800;color:var(--c-primary)}
.gk-hpbar .ganti{margin-left:auto;font-weight:700;color:var(--c-link);display:flex;align-items:center;gap:2px}
.gk-hpbar.kosong{background:var(--c-selected-bg);color:var(--c-primary);font-weight:700}
/* desktop */
.gk-hdr .r1d{display:none}
.gk-nav{display:none}
@media(min-width:1024px){
  .gk-hdr .r1,.gk-hdr .r2{display:none}
  .gk-hdr .r1d{display:flex;align-items:center;gap:20px;height:76px}
  .gk-hdr .r1d .gk-logo img{height:34px}
  .gk-hdr .r1d .gk-cari{max-width:520px;height:48px}
  .gk-hpchip{display:flex;align-items:center;gap:8px;height:48px;padding:0 14px;border-radius:var(--r-lg);border:1.5px solid var(--c-border);font-size:var(--fs-13);white-space:nowrap}
  .gk-hpchip small{display:block;font-size:var(--fs-11);color:var(--c-text-2);font-weight:600}
  .gk-hpchip b{font-weight:800;color:var(--c-primary)}
  .gk-hpchip .ic{color:var(--c-primary)}
  .gk-hdr .aksi{display:flex;gap:4px;margin-left:auto}
  .gk-nav{display:block;border-top:1px solid var(--c-border)}
  .gk-nav .wrap{display:flex;align-items:center;gap:4px;height:50px}
  .gk-nav a{display:flex;align-items:center;gap:4px;height:50px;padding:0 12px;font:700 var(--fs-14)/1 var(--font-sans);color:var(--c-text);border-bottom:2.5px solid transparent}
  .gk-nav a .ic{width:16px;height:16px;color:var(--c-text-2)}
  .gk-nav a.on{border-color:var(--c-primary);color:var(--c-primary)}
  .gk-nav .kanan{margin-left:auto;padding-left:12px;flex:none;white-space:nowrap;font:600 var(--fs-13) var(--font-sans);color:var(--c-success);display:flex;align-items:center;gap:6px}
  .gk-nav .kanan.sembunyi{display:none}
  .gk-nav .wrap>a{flex:none;white-space:nowrap}
  .gk-nav .kanan .ic{width:18px;height:18px}
}

/* ================= TOMBOL, CHIP, BADGE, INPUT ================= */
.gk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--btn-h);padding:0 22px;border-radius:var(--r-lg);font:var(--t-btn);background:var(--c-primary);color:var(--c-on-primary);border:1.5px solid var(--c-primary);white-space:nowrap;transition:background var(--dur-1)}
.gk-btn:hover{background:var(--c-primary-hover)}
.gk-btn.blok{display:flex;width:100%}
.gk-btn.garis{background:#fff;color:var(--c-primary)}
.gk-btn.garis:hover{background:var(--c-selected-bg)}
.gk-btn.krem{background:var(--c-surface-alt);border-color:var(--c-surface-alt);color:var(--c-primary)}
.gk-btn.kecil{height:var(--btn-h-sm);padding:0 14px;font-size:var(--fs-13);border-radius:var(--r-md)}
.gk-btn[disabled],.gk-btn.mati{background:var(--gk-abu-300);border-color:var(--gk-abu-300);color:var(--c-text-2);cursor:not-allowed}
.gk-btn .ic{width:19px;height:19px}
.gk-link{font:700 var(--fs-13)/1 var(--font-sans);color:var(--c-link);display:inline-flex;align-items:center;gap:2px;white-space:nowrap;flex:none}
.gk-link .ic{width:16px;height:16px}

.gk-chip{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:var(--chip-h);padding:0 16px;border-radius:var(--r-md);border:1.5px solid var(--c-border);background:#fff;font:600 var(--fs-13)/1 var(--font-sans);white-space:nowrap;color:var(--c-text)}
.gk-chip small{font-weight:500;color:var(--c-text-2);font-size:var(--fs-11)}
.gk-chip.on{border-color:var(--c-selected-border);background:var(--c-selected-bg);color:var(--c-primary)}
.gk-chip.on small{color:var(--c-primary)}
.gk-chip.bulat{border-radius:var(--r-full)}
.gk-chip .ic{width:16px;height:16px}
.gk-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gutter)*-1);padding:0 var(--gutter)}
.gk-chips::-webkit-scrollbar{display:none}
@media(min-width:1024px){.gk-chips{flex-wrap:wrap;overflow:visible;margin:0;padding:0}}

.gk-badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 7px;border-radius:var(--r-xs);font:700 var(--fs-11)/1 var(--font-sans);white-space:nowrap}
.gk-badge .ic{width:12px;height:12px}
.gk-badge.cocok{background:var(--c-selected-bg);color:var(--c-primary)}
.gk-badge.universal{background:var(--gk-krem-200);color:#4A4A3A}
.gk-badge.diskon{background:var(--c-sale);color:#fff}
.gk-badge.habis{background:var(--gk-arang-900);color:#fff}
.gk-badge.baru{background:var(--c-primary);color:#fff}
.gk-badge.ongkir{background:var(--c-warning-bg);color:var(--c-warning)}
.gk-badge.tidak{background:var(--c-danger-bg);color:var(--c-danger)}

.gk-field{display:block;margin-bottom:14px}
.gk-field label{display:block;font:700 var(--fs-13)/1.2 var(--font-sans);margin-bottom:6px}
.gk-field label small{font-weight:500;color:var(--c-text-2)}
.gk-input{display:flex;align-items:center;width:100%;height:var(--input-h);border:1.5px solid var(--c-border-strong);border-radius:var(--r-md);padding:0 14px;font-size:var(--fs-16);background:#fff;color:var(--c-text)}
.gk-input.isi{color:var(--c-text)}
.gk-input.ph{color:var(--c-placeholder)}
.gk-input.pilih{justify-content:space-between}
.gk-input.pilih .ic{width:18px;height:18px;color:var(--c-text-2)}
.gk-input.area{height:84px;align-items:flex-start;padding-top:14px}
.gk-input.fokus{border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-selected-bg)}
.gk-input.salah{border-color:var(--c-danger)}
.gk-field .bantu{font-size:var(--fs-12);color:var(--c-text-2);margin-top:5px}
.gk-field .err{font-size:var(--fs-12);color:var(--c-danger);margin-top:5px;font-weight:600}
.gk-2kol{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}

.gk-qty{display:inline-flex;align-items:center;border:1.5px solid var(--c-border);border-radius:var(--r-md);height:38px}
.gk-qty button{width:38px;height:100%;display:grid;place-items:center;color:var(--c-primary)}
.gk-qty button .ic{width:16px;height:16px}
.gk-qty span{min-width:28px;text-align:center;font-weight:700;font-size:var(--fs-14)}

/* ================= SECTION & KARTU PRODUK ================= */
.gk-sec{padding-top:var(--section-gap)}
.gk-sec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}
.gk-sec-h h2{font:var(--t-h2);letter-spacing:var(--ls-tight)}
.gk-sec-h p{font-size:var(--fs-13);color:var(--c-text-2);margin-top:3px}
.gk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:600px){.gk-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.gk-grid{grid-template-columns:repeat(4,1fr);gap:20px}.gk-grid.lima{grid-template-columns:repeat(5,1fr)}}
.gk-rail{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gutter)*-1);padding:0 var(--gutter) 4px;scroll-snap-type:x mandatory}
.gk-rail::-webkit-scrollbar{display:none}
.gk-rail>*{flex:0 0 158px;scroll-snap-align:start}
@media(min-width:1024px){.gk-rail{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;margin:0;padding:0;overflow:visible}.gk-rail>*{flex:none}}

.gk-kartu{display:flex;flex-direction:column;border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;background:#fff;position:relative;transition:box-shadow var(--dur-2)}
.gk-kartu:hover{box-shadow:var(--sh-2)}
.gk-kartu .foto{aspect-ratio:var(--card-img-ratio);background:#fff;position:relative}
.gk-kartu .foto img{width:100%;height:100%;object-fit:contain}
.gk-kartu .bdg{position:absolute;left:8px;top:8px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.gk-kartu .bd{padding:10px 12px 14px;border-top:1px solid var(--c-border);display:flex;flex-direction:column;flex:1}
.gk-kartu .br{font:var(--t-caps);letter-spacing:var(--ls-caps);color:var(--c-link);text-transform:uppercase}
.gk-kartu .nm{font:500 var(--fs-13)/1.4 var(--font-sans);margin-top:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.gk-kartu .hr{font:var(--t-price);margin-top:8px}
.gk-kartu .hr small{font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2);margin-right:3px}
.gk-kartu .hr s{font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2);margin-left:5px}
.gk-kartu .mt{font-size:var(--fs-11);color:var(--c-text-2);margin-top:6px}
.gk-kartu .bw{margin-top:auto;padding-top:8px;min-height:30px}
.gk-kartu.habis .foto img{opacity:.45}
.gk-kartu.habis .hr{color:var(--c-text-2)}
@media(min-width:1024px){.gk-kartu .nm{font-size:var(--fs-14)}.gk-kartu .hr{font-size:var(--fs-16)}}

/* ================= BERANDA ================= */
.gk-atas{padding-top:22px}
.gk-atas h1{font:var(--t-h1);letter-spacing:var(--ls-tight);color:var(--c-primary)}
.gk-atas>p,.gk-atas .lead{font-size:var(--fs-14);color:var(--c-text-2);margin-top:6px}
.gk-dev{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px}
.gk-dev button,.gk-dev a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 0 12px;border-radius:var(--r-xl);background:var(--c-surface-alt);font:700 var(--fs-12)/1.1 var(--font-sans);color:var(--c-text);text-align:center}
.gk-dev .ic{width:30px;height:30px;stroke-width:1.5;color:var(--c-link)}
.gk-dev .on{background:var(--c-primary);color:#fff}
.gk-dev .on .ic{color:var(--gk-emas-200)}
.gk-dev button{padding-left:4px;padding-right:4px}
.gk-mdl-h{display:flex;justify-content:space-between;align-items:center;margin:16px 0 10px;font:700 var(--fs-13)/1 var(--font-sans)}
.gk-mdl-h span{font-weight:500;color:var(--c-text-2);font-size:var(--fs-12)}
.gk-lain{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.gk-lain a{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:var(--r-full);background:var(--c-surface-alt);font:600 var(--fs-12) var(--font-sans)}
.gk-lain .ic{width:16px;height:16px;color:var(--c-link)}
.gk-banner{display:block;position:relative;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:3/2;background:linear-gradient(135deg,#DDE6D8 0%,#F4F1EA 70%)}
.gk-banner .tx{position:absolute;left:18px;top:20px;width:54%}
.gk-banner small{font:var(--t-caps);letter-spacing:.14em;color:var(--c-link)}
.gk-banner b{display:block;font:800 22px/1.15 var(--font-sans);color:var(--c-primary);margin:8px 0 14px;letter-spacing:var(--ls-tight)}
.gk-banner .tx span{display:inline-flex;align-items:center;gap:6px;background:var(--c-primary);color:#fff;font:700 12.5px/1 var(--font-sans);padding:10px 14px;border-radius:var(--r-full)}
.gk-banner img{position:absolute;right:-8px;bottom:-14px;height:112%;filter:drop-shadow(0 14px 18px rgba(20,50,22,.25))}
.gk-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}
.gk-dots i{width:6px;height:6px;border-radius:3px;background:var(--c-border)}.gk-dots i.on{width:18px;background:var(--c-primary)}
.gk-jenis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 8px}
.gk-jenis a{display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;font:600 var(--fs-12)/1.25 var(--font-sans)}
.gk-jenis .bul{width:62px;height:62px;border-radius:50%;background:var(--c-surface-alt);display:grid;place-items:center;color:var(--c-primary)}
.gk-jenis .bul .ic{width:28px;height:28px;stroke-width:1.5}
.gk-jenis small{font-weight:500;color:var(--c-text-2);font-size:var(--fs-11);margin-top:-4px}
.gk-jenis .semua .bul{background:var(--c-primary);color:var(--gk-emas-200)}
.gk-perlain{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.gk-perlain a{display:flex;align-items:center;gap:10px;padding:12px;border-radius:var(--r-lg);border:1px solid var(--c-border);font:700 var(--fs-13)/1.25 var(--font-sans)}
.gk-perlain a small{display:block;font-weight:500;color:var(--c-text-2);font-size:var(--fs-11)}
.gk-perlain .ic{width:28px;height:28px;color:var(--c-primary);background:var(--c-surface-alt);border-radius:10px;padding:5px;box-sizing:content-box}
@media(min-width:1024px){.gk-perlain{grid-template-columns:repeat(6,1fr)}}

/* Blok "Sejak 2006" (dari Arah A) */
.gk-2006{background:linear-gradient(180deg,var(--c-surface-dark),var(--c-surface-darker));color:#fff;padding:36px var(--gutter) 30px;margin-top:var(--section-gap)}
.gk-2006 .in{max-width:var(--container);margin:0 auto}
.gk-2006 .angka{font:800 var(--fs-48)/.9 var(--font-sans);color:var(--c-text-accent-on-dark);letter-spacing:-.03em}
.gk-2006 h2{font:800 var(--fs-24)/1.2 var(--font-sans);margin:10px 0 6px}
.gk-2006 .lead{font-size:var(--fs-13);color:var(--c-text-invert-2);margin-bottom:20px}
.gk-2006 .al{display:grid;gap:10px}
.gk-2006 .al div{display:flex;gap:14px;align-items:flex-start;padding:15px;border-radius:var(--r-lg);background:rgba(255,255,255,.05);border:1px solid rgba(229,209,150,.18)}
.gk-2006 .al .ic{width:28px;height:28px;color:var(--gk-emas-500)}
.gk-2006 .al b{display:block;font:700 var(--fs-14)/1.3 var(--font-sans);margin-bottom:3px}
.gk-2006 .al p{font-size:var(--fs-12);color:var(--c-text-invert-2);line-height:1.5}
@media(min-width:1024px){.gk-2006{padding:56px var(--gutter)}.gk-2006 .in{display:grid;grid-template-columns:340px 1fr;gap:48px;align-items:start}.gk-2006 .angka{font-size:88px}.gk-2006 .al{grid-template-columns:repeat(2,1fr);gap:14px}}

/* Kata pembeli */
.gk-rating{display:flex;align-items:center;gap:14px;padding:16px;border-radius:var(--r-xl);background:var(--c-surface-alt);margin-bottom:12px}
.gk-rating .nil{font:800 34px/1 var(--font-sans);color:var(--c-primary)}
.gk-rating .bin{color:var(--gk-emas-500);display:flex;gap:2px}
.gk-rating .bin .ic{width:16px;height:16px;fill:currentColor}
.gk-rating p{font-size:var(--fs-12);color:var(--c-text-2);margin-top:4px}
.gk-ulasan{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gutter)*-1);padding:0 var(--gutter)}
.gk-ulasan::-webkit-scrollbar{display:none}
.gk-ulasan .u{flex:0 0 270px;border:1px solid var(--c-border);border-radius:var(--r-xl);padding:14px;position:relative}
.gk-ulasan .u .bin{color:var(--gk-emas-500);display:flex;gap:2px;margin-bottom:8px}
.gk-ulasan .u .bin .ic{width:14px;height:14px;fill:currentColor}
.gk-ulasan .u p{font-size:var(--fs-13);line-height:1.5}
.gk-ulasan .u .oleh{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:var(--fs-11);color:var(--c-text-2)}
.gk-ulasan .u .sumber{display:inline-flex;align-items:center;gap:4px;font-weight:700;color:var(--c-text-2)}
.gk-ulasan .u .contoh{position:absolute;right:10px;top:10px}
@media(min-width:1024px){.gk-ulasan{display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding:0}.gk-ulasan .u{flex:none}}

.gk-brand{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.gk-brand a{height:54px;border-radius:var(--r-lg);background:var(--c-surface-alt);display:grid;place-items:center;font:800 var(--fs-12)/1 var(--font-sans);color:#3a3f3a}
@media(min-width:1024px){.gk-brand{grid-template-columns:repeat(8,1fr)}.gk-brand a{height:64px;font-size:var(--fs-14)}}

/* ================= FOOTER ================= */
.gk-ftr{background:var(--c-surface-dark);color:#fff;padding:30px 0 120px}
.gk-ftr .logo{height:32px;width:auto}
.gk-ftr p{font-size:var(--fs-13);color:var(--c-text-invert-2);line-height:1.6;margin-top:10px}
.gk-wa{display:flex;align-items:center;gap:12px;margin:20px 0;padding:14px 16px;border-radius:var(--r-lg);background:#fff;color:var(--c-primary);font:700 var(--fs-14)/1.3 var(--font-sans)}
.gk-wa small{display:block;font:500 var(--fs-12) var(--font-sans);color:var(--c-text-2)}
.gk-ftr .kol{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.gk-ftr .kol b{font:700 var(--fs-13)/1 var(--font-sans);color:var(--c-text-accent-on-dark);display:block;margin-bottom:10px}
.gk-ftr .kol a{display:block;font-size:var(--fs-13);color:#E3E9E1;padding:5px 0}
.gk-bayar{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 16px}
.gk-bayar span{font:700 10.5px/1 var(--font-sans);padding:7px 9px;border-radius:7px;background:#fff;color:var(--c-primary)}
.gk-ftr .cr{font-size:var(--fs-12)}
@media(min-width:1024px){.gk-ftr{padding:56px 0 40px}.gk-ftr .wrap{display:grid;grid-template-columns:1.2fr 2fr 1.2fr;gap:48px}.gk-ftr .kol{grid-template-columns:repeat(3,1fr);margin:0}.gk-wa{margin:0 0 16px}}
.gk-fab{position:fixed;right:16px;bottom:20px;height:52px;padding:0 18px 0 14px;border-radius:26px;background:#fff;color:var(--c-primary);display:flex;align-items:center;gap:8px;font:700 var(--fs-14) var(--font-sans);box-shadow:var(--sh-2);border:1px solid var(--c-border);z-index:40}
.gk-fab .ic{width:24px;height:24px}

/* ================= HALAMAN KATEGORI ================= */
.gk-crumb{display:flex;gap:4px;align-items:center;font-size:var(--fs-12);color:var(--c-text-2);padding:12px 0 0;white-space:nowrap;overflow:hidden}
.gk-crumb .ic{width:12px;height:12px}
.gk-crumb b{color:var(--c-text);font-weight:600}
.gk-kat-h{padding:10px 0 14px}
.gk-kat-h h1{font:var(--t-h1);letter-spacing:var(--ls-tight)}
.gk-kat-h p{font-size:var(--fs-13);color:var(--c-text-2);margin-top:4px}
.gk-toolbar{display:flex;gap:8px;align-items:center;padding:12px 0;position:sticky;top:var(--header-h);background:#fff;z-index:5}
.gk-toolbar .gk-btn{flex:1}
.gk-toolbar .jml{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-aktif{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:12px}
.gk-aktif span{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 6px 0 10px;border-radius:var(--r-full);background:var(--c-selected-bg);color:var(--c-primary);font:700 var(--fs-12) var(--font-sans)}
.gk-aktif span .ic{width:14px;height:14px}
.gk-aktif a{font:700 var(--fs-12)/30px var(--font-sans);color:var(--c-link);margin-left:4px}
.gk-muat{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 0 8px;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-muat .bar{width:180px;height:4px;border-radius:2px;background:var(--c-border);overflow:hidden}
.gk-muat .bar i{display:block;height:100%;width:43%;background:var(--c-primary)}
.gk-kat-lay{display:block}
.gk-side{display:none}
@media(min-width:1024px){
  .gk-kat-lay{display:grid;grid-template-columns:260px 1fr;gap:32px;align-items:start}
  .gk-side{display:block;position:sticky;top:140px}
  .gk-toolbar{position:static;padding:0 0 16px}
  .gk-toolbar .gk-btn{flex:none}
}
.gk-fgrp{border-bottom:1px solid var(--c-border);padding:16px 0}
.gk-fgrp h3{font:var(--t-h3);display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.gk-fgrp h3 .ic{width:18px;height:18px;color:var(--c-text-2)}
.gk-cek{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:var(--fs-14)}
.gk-cek i{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--c-border-strong);display:grid;place-items:center;flex:none}
.gk-cek.on i{background:var(--c-primary);border-color:var(--c-primary);color:#fff}
.gk-cek i .ic{width:14px;height:14px;stroke-width:2.6}
.gk-cek small{margin-left:auto;color:var(--c-text-2);font-size:var(--fs-12)}
.gk-radio i{border-radius:50%}
.gk-radio.on i{background:#fff;box-shadow:inset 0 0 0 5px var(--c-primary)}
.gk-harga2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gk-harga2 .gk-input{height:44px;font-size:var(--fs-14)}

/* Bottom sheet (filter HP) */
.gk-sheet-bg{position:fixed;inset:0;background:var(--c-overlay);z-index:var(--z-overlay);opacity:0;pointer-events:none;transition:opacity var(--dur-2)}
.gk-sheet{position:fixed;left:0;right:0;bottom:0;transform:translateY(105%);transition:transform var(--dur-3) var(--ease);background:#fff;border-radius:var(--r-2xl) var(--r-2xl) 0 0;z-index:var(--z-drawer);box-shadow:var(--sh-3);max-height:88%;display:flex;flex-direction:column}
.gk-sheet .grip{width:40px;height:5px;border-radius:3px;background:var(--c-border);margin:10px auto 4px}
.gk-sheet .sh-h{display:flex;align-items:center;justify-content:space-between;padding:6px 16px 10px;border-bottom:1px solid var(--c-border)}
.gk-sheet .sh-h b{font:var(--t-h2)}
.gk-sheet .sh-b{padding:0 16px;overflow-y:auto;flex:1}
.gk-sheet .sh-f{display:flex;gap:10px;padding:12px 16px 16px;border-top:1px solid var(--c-border)}
.gk-sheet .sh-f .gk-btn{flex:1}

/* ================= HALAMAN PRODUK ================= */
.gk-p-lay{display:block}
.gk-galeri{border-radius:var(--r-xl);overflow:hidden;position:relative;border:1px solid var(--c-border);background:#fff}
.gk-galeri img{width:100%;aspect-ratio:1;object-fit:contain}
.gk-galeri .gk-dots{position:absolute;left:0;right:0;bottom:12px;margin:0}
.gk-galeri .aksi{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:8px}
.gk-galeri .aksi span{width:40px;height:40px;border-radius:50%;background:#fff;color:var(--c-primary);display:grid;place-items:center;box-shadow:var(--sh-1);border:1px solid var(--c-border)}
.gk-galeri .aksi .ic{width:19px;height:19px}
.gk-thumbs{display:none}
.gk-pinfo{padding-top:18px}
.gk-pinfo .brd{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.gk-pinfo h1{font:700 var(--fs-20)/1.35 var(--font-sans);margin:10px 0;letter-spacing:-.01em}
.gk-harga{font:var(--t-price-lg);color:var(--c-primary)}
.gk-stok{display:inline-flex;align-items:center;gap:6px;font:600 var(--fs-12) var(--font-sans);color:var(--c-success);margin-left:10px;vertical-align:5px}
.gk-stok i{width:7px;height:7px;border-radius:50%;background:#3BA14B}
.gk-cocok{margin-top:16px;padding:14px;border-radius:var(--r-lg);background:var(--c-selected-bg);display:flex;gap:12px;align-items:flex-start}
.gk-cocok .ic{width:26px;height:26px;color:var(--c-primary)}
.gk-cocok b{font:700 var(--fs-14)/1.3 var(--font-sans);display:block;color:var(--c-primary)}
.gk-cocok p{font-size:var(--fs-12);color:var(--c-text-2);line-height:1.45;margin-top:2px}
.gk-opsi{margin-top:22px}
.gk-opsi .lbl{display:flex;justify-content:space-between;font:700 var(--fs-14)/1 var(--font-sans);margin-bottom:10px}
.gk-opsi .lbl span{font-weight:500;color:var(--c-text-2);font-size:var(--fs-13)}
.gk-tipe{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gk-tipe .gk-chip{height:48px;border-radius:var(--r-lg);font-size:var(--fs-14)}
.gk-warna{display:flex;gap:8px;flex-wrap:wrap}
.gk-warna .gk-chip{height:44px;padding:0 14px 0 8px;border-radius:var(--r-full)}
.gk-warna i{width:26px;height:26px;border-radius:50%;border:1px solid rgba(0,0,0,.12)}
.gk-jamin{margin-top:22px;display:grid;gap:8px}
.gk-jamin>div{display:flex;gap:12px;padding:12px 14px;border-radius:var(--r-lg);border:1px solid var(--c-border);align-items:center}
.gk-jamin .ic{color:var(--c-primary);width:26px;height:26px;stroke-width:1.6}
.gk-jamin b{display:block;font:700 var(--fs-13)/1.35 var(--font-sans)}
.gk-jamin p{font-size:var(--fs-12);color:var(--c-text-2);line-height:1.4;margin-top:1px}
.gk-jamin .kirim{background:var(--c-selected-bg);border-color:transparent}
.gk-jamin .kirim b{color:var(--c-primary)}
.gk-jamin .ori{border-color:var(--gk-emas-500)}
.gk-tab{display:flex;gap:18px;margin-top:28px;border-bottom:1px solid var(--c-border);overflow-x:auto;scrollbar-width:none}
.gk-tab span{padding:12px 0;font:700 var(--fs-14) var(--font-sans);color:var(--c-text-2);white-space:nowrap}
.gk-tab span.on{color:var(--c-primary);box-shadow:inset 0 -2.5px 0 var(--c-primary)}
.gk-isi{padding:16px 0;font-size:var(--fs-14);line-height:1.6;color:#363a35}
/* Isi tab (deskripsi produk): tampil seperti di editor admin — poin berbulat, nomor, judul, teks tebal (owner 8 Okt 2026) */
.gk-isi ul,.gk-isi ol{margin:8px 0 12px;padding-left:1.4em}
.gk-isi ul{list-style:disc}
.gk-isi ol{list-style:decimal}
.gk-isi li{margin:6px 0;padding-left:2px}
.gk-isi li::marker{color:var(--c-text-2)}
.gk-isi strong,.gk-isi b{font-weight:700;color:var(--c-text)}
.gk-isi h1,.gk-isi h2,.gk-isi h3,.gk-isi h4{margin:18px 0 6px;font:700 var(--fs-16,16px)/1.35 var(--font-sans);color:var(--c-text)}
.gk-isi h2{font-size:var(--fs-18,18px)}
.gk-isi>:first-child{margin-top:0}
.gk-isi p{margin:0}
.gk-isi table{width:100%;border-collapse:collapse;margin:10px 0}
.gk-isi td,.gk-isi th{border:1px solid var(--c-border);padding:6px 10px;text-align:left}
.gk-spek{display:grid;grid-template-columns:120px 1fr;margin-top:14px;border:1px solid var(--c-border);border-radius:var(--r-md);overflow:hidden}
.gk-spek dt,.gk-spek dd{padding:10px 12px;border-bottom:1px solid var(--c-border);font-size:var(--fs-13)}
.gk-spek dt{background:var(--c-surface-alt);color:var(--c-text-2)}
.gk-spek dt:last-of-type,.gk-spek dd:last-of-type{border-bottom:0}
.gk-buybar{position:sticky;bottom:0;z-index:var(--z-buybar);display:flex;align-items:center;gap:10px;padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -6px 20px rgba(20,50,22,.08);border-top:1px solid var(--c-border)}
.gk-buybar .gk-ibtn{width:52px;height:52px;border-radius:var(--r-lg);border:1.5px solid var(--c-border)}
.gk-buybar .gk-btn{flex:1;min-width:0;padding:0 12px}
.gk-pinfo .gk-buybar{margin:22px calc(var(--gutter)*-1) 0}
.gk-buybar .ringkas{display:none}
@media(min-width:1024px){
  .gk-p-lay{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start;padding-top:8px}
  .gk-p-kiri{display:grid;grid-template-columns:76px 1fr;gap:14px;position:sticky;top:140px}
  .gk-thumbs{display:flex;flex-direction:column;gap:10px}
  .gk-thumbs img{width:76px;height:76px;border-radius:var(--r-md);border:1px solid var(--c-border);object-fit:contain;background:#fff}
  .gk-thumbs img.on{border:2px solid var(--c-primary)}
  .gk-pinfo{padding-top:0}
  .gk-pinfo h1{font-size:var(--fs-24)}
  .gk-buybar,.gk-pinfo .gk-buybar{position:static;box-shadow:none;border:0;padding:0;margin:20px 0 0}
  .gk-buybar .gk-ibtn{width:52px}
}

/* ================= KERANJANG ================= */
.gk-item{display:grid;grid-template-columns:84px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--c-border)}
.gk-item img{width:84px;height:84px;border-radius:var(--r-md);border:1px solid var(--c-border);object-fit:contain;background:#fff}
.gk-item .nm{font:600 var(--fs-13)/1.4 var(--font-sans);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gk-item .var{font-size:var(--fs-12);color:var(--c-text-2);margin-top:4px}
.gk-item .bwh{display:flex;align-items:center;justify-content:space-between;margin-top:10px}
.gk-item .hr{font:800 var(--fs-15)/1 var(--font-sans)}
.gk-item .hapus{font:600 var(--fs-12) var(--font-sans);color:var(--c-text-2);display:flex;align-items:center;gap:4px;margin-top:8px}
.gk-item .hapus .ic{width:14px;height:14px}
.gk-ring{border:1px solid var(--c-border);border-radius:var(--r-xl);padding:16px}
.gk-ring .bar{display:flex;justify-content:space-between;font-size:var(--fs-14);padding:6px 0}
.gk-ring .bar span:first-child{color:var(--c-text-2)}
.gk-ring .tot{border-top:1px solid var(--c-border);margin-top:8px;padding-top:12px;font:800 var(--fs-18)/1 var(--font-sans)}
.gk-ring .tot span:first-child{color:var(--c-text);font-size:var(--fs-15)}
.gk-voucher{display:flex;align-items:center;gap:10px;padding:14px;border-radius:var(--r-lg);border:1.5px dashed var(--c-border-strong);font:700 var(--fs-13) var(--font-sans);color:var(--c-primary)}
.gk-voucher .ic{color:var(--c-primary)}
.gk-voucher .ic.r{margin-left:auto;width:18px;height:18px;color:var(--c-text-2)}
.gk-info{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-lg);font-size:var(--fs-12);line-height:1.45}
.gk-info .ic{width:20px;height:20px}
.gk-info b{font-weight:700;display:block;font-size:var(--fs-13)}
.gk-info.hijau{background:var(--c-selected-bg);color:var(--c-primary)}
.gk-info.kuning{background:var(--c-warning-bg);color:var(--c-warning)}
.gk-info.krem{background:var(--c-surface-alt);color:var(--c-text)}
.gk-cart-lay{display:block}
@media(min-width:1024px){.gk-cart-lay{display:grid;grid-template-columns:1fr 400px;gap:40px;align-items:start}.gk-cart-side{position:sticky;top:140px}.gk-item{grid-template-columns:110px 1fr}.gk-item img{width:110px;height:110px}}

/* ================= CHECKOUT ================= */
.gk-co-hdr{display:flex;align-items:center;gap:8px;height:var(--header-h);border-bottom:1px solid var(--c-border);background:#fff;position:sticky;top:0;z-index:var(--z-header)}
.gk-co-hdr .aman{margin-left:auto;display:flex;align-items:center;gap:6px;font:600 var(--fs-12) var(--font-sans);color:var(--c-success)}
.gk-co-hdr .aman .ic{width:18px;height:18px}
.gk-langkah{display:flex;gap:6px;align-items:center;padding:14px 0 4px;font:700 var(--fs-12) var(--font-sans);color:var(--c-text-2)}
.gk-langkah i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:var(--c-border);color:var(--c-text);font-size:var(--fs-11)}
.gk-langkah>span:not(.garis){display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.gk-langkah .on{color:var(--c-primary)}.gk-langkah .on i{background:var(--c-primary);color:#fff}
.gk-langkah .garis{flex:1;height:2px;background:var(--c-border)}
.gk-co-sec{padding:18px 0;border-bottom:8px solid var(--c-surface-alt);margin:0 calc(var(--gutter)*-1);padding-left:var(--gutter);padding-right:var(--gutter)}
.gk-co-sec h2{font:var(--t-h3);font-size:var(--fs-18);display:flex;align-items:center;gap:10px;margin-bottom:14px}
.gk-co-sec h2 i{width:26px;height:26px;border-radius:50%;background:var(--c-primary);color:#fff;font:800 var(--fs-12)/26px var(--font-sans);text-align:center;font-style:normal}
.gk-opsi-kirim{display:grid;gap:8px}
.gk-ok{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:var(--r-lg);border:1.5px solid var(--c-border)}
.gk-ok.on{border-color:var(--c-primary);background:var(--c-selected-bg)}
.gk-ok .rd{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--c-border-strong);flex:none;margin-top:1px}
.gk-ok.on .rd{border-color:var(--c-primary);box-shadow:inset 0 0 0 5px #fff;background:var(--c-primary)}
.gk-ok b{display:block;font:700 var(--fs-14)/1.3 var(--font-sans)}
.gk-ok p{font-size:var(--fs-12);color:var(--c-text-2);margin-top:2px}
.gk-ok .hg{margin-left:auto;font:800 var(--fs-14) var(--font-sans);text-align:right;white-space:nowrap}
.gk-ok .hg small{display:block;font:600 var(--fs-11) var(--font-sans);color:var(--c-text-2)}
.gk-ok .logo-b{width:44px;height:30px;border-radius:6px;border:1px solid var(--c-border);display:grid;place-items:center;font:800 9.5px/1 var(--font-sans);color:var(--c-primary);background:#fff;flex:none;text-align:center}
.gk-bayar-grp{font:700 var(--fs-12)/1 var(--font-sans);color:var(--c-text-2);margin:14px 0 8px;text-transform:uppercase;letter-spacing:var(--ls-caps)}
.gk-co-lay{display:block}
@media(min-width:1024px){
  .gk-co-lay{display:grid;grid-template-columns:1fr 420px;gap:40px;align-items:start}
  .gk-co-sec{margin:0 0 20px;border:1px solid var(--c-border);border-radius:var(--r-xl);padding:24px}
  .gk-co-side{position:sticky;top:90px}
  .gk-opsi-kirim.dua{grid-template-columns:1fr 1fr}
}

/* ================= DRAWER & MEGA MENU ================= */
.gk-drawer-bg{position:fixed;inset:0;background:var(--c-overlay);z-index:var(--z-overlay);opacity:0;pointer-events:none;transition:opacity var(--dur-2)}
.gk-drawer{position:fixed;left:0;top:0;bottom:0;z-index:var(--z-drawer);transform:translateX(-105%);transition:transform var(--dur-3) var(--ease);width:var(--drawer-w);background:#fff;box-shadow:var(--sh-3);display:flex;flex-direction:column;overflow:hidden}
.gk-drawer .dh{display:flex;align-items:center;justify-content:space-between;padding:10px 8px 10px 16px;border-bottom:1px solid var(--c-border)}
.gk-drawer .dh img{height:24px;width:auto}
.gk-drawer .db{padding:14px 16px 24px;overflow-y:auto;flex:1;overscroll-behavior:contain}
.gk-dgrp{margin-top:18px}
.gk-dgrp h4{font:var(--t-caps);letter-spacing:var(--ls-caps);color:var(--c-text-2);text-transform:uppercase;margin-bottom:6px}
.gk-drow{display:flex;align-items:center;gap:12px;min-height:48px;font:600 var(--fs-14)/1.2 var(--font-sans);border-bottom:1px solid var(--gk-abu-100)}
.gk-drow .ic{width:22px;height:22px;color:var(--c-link)}
.gk-drow .ic.r{margin-left:auto;width:18px;height:18px;color:var(--c-text-2)}
.gk-drow small{margin-left:auto;font-size:var(--fs-12);color:var(--c-text-2);font-weight:500}
.gk-drow small+.ic.r{margin-left:4px}
.gk-dgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gk-dgrid a{display:flex;align-items:center;gap:8px;padding:10px;border-radius:var(--r-md);background:var(--c-surface-alt);font:700 var(--fs-12)/1.2 var(--font-sans)}
.gk-dgrid .ic{width:22px;height:22px;color:var(--c-primary)}
.gk-dback{display:flex;align-items:center;gap:6px;font:700 var(--fs-14) var(--font-sans);color:var(--c-primary);padding:4px 0 12px}
.gk-mega{position:absolute;left:0;right:0;top:100%;background:#fff;box-shadow:var(--sh-3);border-top:1px solid var(--c-border);z-index:70}
.gk-mega .wrap{display:grid;grid-template-columns:repeat(4,1fr) 1.2fr;gap:32px;padding-top:28px;padding-bottom:32px;height:auto;align-items:start}
.gk-mega h4{font:var(--t-caps);letter-spacing:var(--ls-caps);color:var(--c-text-2);text-transform:uppercase;margin-bottom:12px}
.gk-mega a.m{display:flex;align-items:center;gap:10px;padding:8px 0;font:600 var(--fs-14) var(--font-sans)}
.gk-mega a.m .ic{width:20px;height:20px;color:var(--c-link)}
.gk-mega a.m small{color:var(--c-text-2);font-weight:500;font-size:var(--fs-12);margin-left:auto}
.gk-mega .promo{border-radius:var(--r-xl);background:var(--c-surface-alt);padding:20px;position:relative;overflow:hidden;min-height:220px}
.gk-mega .promo b{font:800 var(--fs-18)/1.25 var(--font-sans);color:var(--c-primary);display:block;width:60%}
.gk-mega .promo img{position:absolute;right:-10px;bottom:-20px;height:210px}

/* ================= PENCARIAN & KEADAAN KOSONG ================= */
.gk-kosong{text-align:center;padding:36px 8px 8px}
.gk-kosong .ilu{width:88px;height:88px;border-radius:50%;background:var(--c-surface-alt);display:grid;place-items:center;margin:0 auto 16px;color:var(--c-primary)}
.gk-kosong .ilu .ic{width:40px;height:40px;stroke-width:1.4}
.gk-kosong h1,.gk-kosong h2{font:var(--t-h2);font-size:var(--fs-20)}
.gk-kosong p{font-size:var(--fs-14);color:var(--c-text-2);margin:8px auto 0;max-width:340px}
.gk-saran{text-align:left;margin-top:22px;padding:16px;border-radius:var(--r-xl);background:var(--c-surface-alt)}
.gk-saran b{font:700 var(--fs-14) var(--font-sans)}
.gk-saran ul{margin:8px 0 0 18px;font-size:var(--fs-13);color:var(--c-text-2);display:grid;gap:4px}
.gk-riwayat{display:flex;align-items:center;gap:12px;min-height:46px;border-bottom:1px solid var(--gk-abu-100);font-size:var(--fs-14)}
.gk-riwayat .ic{width:18px;height:18px;color:var(--c-text-2)}
.gk-riwayat .ic.r{margin-left:auto}
.gk-sub{font:700 var(--fs-14) var(--font-sans);margin:22px 0 10px;display:flex;justify-content:space-between;align-items:center}

/* Halaman pilih HP */
.gk-langkah-hp{display:flex;align-items:center;gap:8px;font:700 var(--fs-12) var(--font-sans);color:var(--c-text-2);margin:16px 0 10px}
.gk-langkah-hp i{width:22px;height:22px;border-radius:50%;background:var(--c-primary);color:#fff;font-style:normal;display:grid;place-items:center;font-size:var(--fs-11)}
.gk-langkah-hp.abu i{background:var(--c-border);color:var(--c-text-2)}
.gk-fam{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.gk-fam a{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--r-xl);border:1.5px solid var(--c-border);font:700 var(--fs-14)/1.2 var(--font-sans)}
.gk-fam a small{display:block;font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2);margin-top:3px}
.gk-fam .ic{width:34px;height:34px;color:var(--c-primary);stroke-width:1.4}
@media(min-width:1024px){.gk-fam{grid-template-columns:repeat(4,1fr)}}

/* Lembar perbandingan foto */
.gk-banding{display:grid;grid-template-columns:1fr;gap:28px}
.gk-banding h2{font:var(--t-h2);margin-bottom:4px}
.gk-banding .sub{font-size:var(--fs-13);color:var(--c-text-2);margin-bottom:12px}
@media(min-width:1024px){.gk-banding{grid-template-columns:1fr 1fr;gap:48px}.gk-banding .gk-grid{grid-template-columns:repeat(3,1fr)}}

/* ================= TAMBAHAN THEME (Tech AI) ================= */
[hidden]{display:none!important}
.sr:focus{position:fixed;left:8px;top:8px;width:auto;height:auto;clip:auto;z-index:999;background:#fff;padding:10px 14px;border-radius:var(--r-md);box-shadow:var(--sh-2)}
body.gk-kunci{overflow:hidden}
.gk-hdr form.gk-cari{margin:0}
.gk-cari input::placeholder{color:var(--c-placeholder)}
.gk-cari input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}
/* Drawer & sheet terbuka */
.gk-drawer.buka{transform:none}
.gk-drawer-bg.buka,.gk-sheet-bg.buka{opacity:1;pointer-events:auto}
.gk-sheet.buka{transform:none}
.gk-dpanel{display:flex;flex-direction:column;height:100%}
.gk-dback{background:none;border:0;cursor:pointer}
.m-hp{border-radius:var(--r-lg);background:var(--c-surface-alt);padding:12px;margin-top:12px}
.m-hp .r{display:flex;align-items:center;gap:10px}
.m-hp .r .ic{color:var(--c-primary);width:26px;height:26px}
.m-hp small{display:block;font-size:var(--fs-11);color:var(--c-text-2);font-weight:600}
.m-hp b{font:800 var(--fs-15) var(--font-sans);color:var(--c-primary)}
.m-hp .ab{display:grid;grid-template-columns:1.4fr 1fr;gap:8px;margin-top:10px}
/* Layar sempit (mis. layar luar Fold ±340px): tombol tidak boleh mendorong "Ganti" keluar kotak */
.m-hp .ab .gk-btn{display:block;min-width:0;padding:0 10px;overflow:hidden;text-overflow:ellipsis;text-align:center;line-height:calc(var(--btn-h-sm) - 3px)}
.m-brand{display:flex;flex-wrap:wrap;gap:6px}
.m-brand a{height:34px;padding:0 12px;border-radius:var(--r-full);border:1px solid var(--c-border);font:700 var(--fs-12)/32px var(--font-sans)}
/* Mega menu desktop */
.gk-nav{position:relative}
.gk-nav .gk-mega a{height:auto;border:0;padding:8px 0}
.gk-nav a[aria-expanded=true]{border-color:var(--c-primary);color:var(--c-primary)}
/* Beranda */
.gk-dev button{border:0;cursor:pointer}
.gk-btn.mati{pointer-events:auto}
.gk-banner .prd{position:absolute;right:12px;top:12px;bottom:12px;width:42%;height:calc(100% - 24px);object-fit:contain;background:#fff;border-radius:16px;filter:none}
.gk-banner .tx{z-index:1}
.gk-banner.gambar,.b-strip.gambar{background:var(--c-surface-alt)}
.gk-banner.gambar img,.b-strip.gambar img{position:static;width:100%;height:100%;object-fit:cover;filter:none;border-radius:0}
.gk-slide{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--r-xl)}
.gk-slide::-webkit-scrollbar{display:none}
.gk-slide>*{flex:0 0 100%;scroll-snap-align:start}
.b-strip{display:block;position:relative;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:3/1;background:var(--c-surface-dark);color:#fff}
.gk-ulasan figure{margin:0}
.gk-ulasan blockquote{margin:0}
.gk-rating .bin .ic,.gk-ulasan .bin .ic{fill:currentColor}
@media(min-width:1024px){
  .b-hero{display:grid;grid-template-columns:5fr 7fr;gap:40px;align-items:center;padding-top:32px}
  .b-hero .gk-banner{aspect-ratio:2/1}
  .b-hero .gk-banner b{font-size:34px}
  .b-hero .gk-banner .tx{left:40px;top:44px;width:48%}
  .b-hero .gk-banner .prd{right:20px;top:20px;bottom:20px;height:calc(100% - 40px);width:40%}
  .gk-jenis{grid-template-columns:repeat(8,1fr)}
  .gk-jenis .bul{width:84px;height:84px}
  .b-strip{aspect-ratio:6/1}
  .gk-drawer,.gk-drawer-bg{display:none}
}
/* Konten halaman WordPress biasa */
.gk-halaman{padding-top:24px;padding-bottom:48px;max-width:824px}
.gk-halaman h1{font:var(--t-h1);color:var(--c-primary);margin-bottom:16px}
.gk-halaman .isi>*+*{margin-top:12px}
.gk-halaman .isi ul,.gk-halaman .isi ol{padding-left:20px}
.gk-halaman .isi a{color:var(--c-link);text-decoration:underline}
.gk-halaman .isi{font-size:var(--fs-15);line-height:var(--lh-relaxed)}
.gk-halaman .isi .lead{font-size:var(--fs-16);color:var(--c-text-2)}
.gk-halaman .isi h2{font:var(--t-h2);color:var(--c-primary);letter-spacing:var(--ls-tight);margin-top:32px}
.gk-halaman .isi h3{font:var(--t-h3);margin-top:22px}
.gk-halaman .isi h2+*,.gk-halaman .isi h3+*{margin-top:8px}
.gk-halaman .isi table{width:100%;border-collapse:collapse;font-size:var(--fs-14)}
.gk-halaman .isi th,.gk-halaman .isi td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--c-border);vertical-align:top}
.gk-halaman .isi th{background:var(--c-surface-alt);font-weight:700}
.gk-halaman .isi .tabel{overflow-x:auto;border:1px solid var(--c-border);border-radius:var(--r-lg)}
.gk-halaman .isi .tabel tr:last-child td{border-bottom:0}
.gk-halaman .isi .catatan{background:var(--c-selected-bg);border-radius:var(--r-lg);padding:14px 16px;font-size:var(--fs-14)}
.gk-halaman .isi .catatan.awas{background:var(--c-warning-bg)}
.gk-halaman .isi .gk-btn{text-decoration:none;color:var(--c-on-primary)}
.gk-halaman .isi .gk-btn.garis{color:var(--c-primary)}
.gk-halaman .isi .aksi{display:flex;flex-wrap:wrap;gap:10px}
.gk-halaman .isi details{border:1px solid var(--c-border);border-radius:var(--r-lg);padding:0 16px}
.gk-halaman .isi details+details{margin-top:8px}
.gk-halaman .isi summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 0;font-weight:700;min-height:var(--tap-min)}
.gk-halaman .isi summary::-webkit-details-marker{display:none}
.gk-halaman .isi summary::after{content:"+";font-size:22px;font-weight:500;color:var(--c-link);flex:none}
.gk-halaman .isi details[open] summary::after{content:"–"}
.gk-halaman .isi details>:not(summary){margin-bottom:14px}
.gk-halaman .isi details>summary+*{margin-top:0}
.gk-halaman .isi .langkah{counter-reset:lk;list-style:none;padding-left:0}
.gk-halaman .isi .langkah>li{counter-increment:lk;position:relative;padding-left:44px;margin-top:18px}
.gk-halaman .isi .langkah>li::before{content:counter(lk);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--c-primary);color:#fff;font-weight:800;display:grid;place-items:center;font-size:var(--fs-14)}
.gk-halaman .isi .langkah>li>b:first-child{display:block;font-size:var(--fs-16)}
.gk-halaman .isi .kartu-2{display:grid;gap:10px}
@media(min-width:768px){.gk-halaman .isi .kartu-2{grid-template-columns:1fr 1fr}}
.gk-halaman .isi .kartu-2>div{border:1px solid var(--c-border);border-radius:var(--r-lg);padding:14px 16px}
.gk-halaman .isi .kartu-2>div>b{display:block;margin-bottom:4px}
/* Toast */
.gk-toast{position:fixed;left:50%;bottom:96px;transform:translate(-50%,20px);opacity:0;z-index:var(--z-toast);background:var(--gk-arang-900);color:#fff;border-radius:var(--r-lg);padding:12px 16px;font:600 var(--fs-14) var(--font-sans);display:flex;gap:12px;align-items:center;transition:all var(--dur-2);pointer-events:none;max-width:calc(100% - 32px)}
.gk-toast.buka{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.gk-toast a{color:var(--gk-emas-200);font-weight:800;white-space:nowrap}
.gk-chips.salah .gk-chip{border-color:var(--c-danger)}
symbol#i-star{fill:currentColor}
@media(min-width:1024px){
  .gk-rail>*:nth-child(n+6){display:none}
  .gk-ulasan{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
}
/* ================= ARSIP / KATEGORI (Tech AI) ================= */
.gk-crumb a{color:var(--c-text-2)}
.gk-crumb a:hover{color:var(--c-primary)}
.k-ganti{display:inline-flex;align-items:center;gap:4px;font:700 var(--fs-13) var(--font-sans);color:var(--c-link);margin-left:6px}
.k-jenis{padding:2px var(--gutter) 4px;scroll-padding-left:var(--gutter)}
.k-jenis::after{content:"";flex:0 0 calc(var(--gutter) - 8px)}
@media(min-width:1024px){.k-jenis{padding:2px 0 4px}.k-jenis::after{display:none}}
.k-sel{display:none}
.k-tb-hp{position:relative}
.k-urut-hp select{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}
.k-urut-hp::after{content:'Urutkan'}
.gk-cb input,.gk-pil input{position:absolute;opacity:0;width:1px;height:1px}
.gk-cek{cursor:pointer;position:relative}
.gk-cek i .ic{display:none}
.gk-cek.on i .ic{display:block}
.gk-pil{cursor:pointer;position:relative}
.gk-filter .gk-fgrp:first-child{padding-top:0}
.di-sheet{display:flex;flex-direction:column;min-height:0;flex:1}
.gk-aktif a.gk-aktif-x{margin:0}
.gk-aktif a.gk-aktif-x span{cursor:pointer}
.gk-grid.muat{opacity:.6}
@media(min-width:1024px){
  .k-sel{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:var(--fs-13);color:var(--c-text-2)}
  .k-sel .gk-input{height:42px;width:220px;font-size:var(--fs-14);font-weight:600;appearance:auto}
  .k-tb-hp{display:none!important}
  .gk-sheet,.gk-sheet-bg{display:none}
}
/* ================= PRODUK (Tech AI) ================= */
.gk-geser{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gk-geser::-webkit-scrollbar{display:none}
.gk-geser img{flex:0 0 100%;scroll-snap-align:start;width:100%;aspect-ratio:1;object-fit:contain;background:#fff}
.gk-galeri .aksi button{width:40px;height:40px;border-radius:50%;background:#fff;color:var(--c-primary);display:grid;place-items:center;box-shadow:var(--sh-1);border:1px solid var(--c-border)}
.gk-galeri .aksi .ic{width:19px;height:19px}
.gk-thumbs button{padding:0;border:0;background:none;border-radius:var(--r-md)}
.gk-thumbs button img{width:76px;height:76px;border-radius:var(--r-md);border:1px solid var(--c-border);object-fit:contain;background:#fff}
.gk-thumbs button.on img{border:2px solid var(--c-primary)}
.gk-harga .mulai{font:600 var(--fs-13) var(--font-sans);color:var(--c-text-2);margin-right:4px;vertical-align:4px}
.gk-coret{font:500 var(--fs-14) var(--font-sans);color:var(--c-text-2);margin-left:8px;vertical-align:4px}
.gk-stok.habis{color:var(--c-danger)}.gk-stok.habis i{background:var(--c-danger)}
.gk-cocok a{color:var(--c-link);font-weight:700;text-decoration:underline}
.gk-cocok.kuning{background:var(--c-warning-bg)}.gk-cocok.kuning .ic,.gk-cocok.kuning b{color:var(--c-warning)}
.gk-cocok.krem{background:var(--c-surface-alt)}
.gk-opsi .gk-chip[aria-checked=true]{border-color:var(--c-selected-border);background:var(--c-selected-bg);color:var(--c-primary)}
.gk-opsi .gk-chip.kosong{opacity:.45;text-decoration:line-through}
.gk-opsi.salah .gk-tipe .gk-chip,.gk-opsi.salah .gk-warna .gk-chip{border-color:var(--c-danger)}
.gk-err{font:600 var(--fs-12) var(--font-sans);color:var(--c-danger);margin-top:8px}
.p-tip{display:flex;gap:8px;font-size:var(--fs-12);color:var(--c-text-2);margin-top:10px;line-height:1.45}
.p-tip .ic{width:16px;height:16px;color:var(--c-link);margin-top:1px}
.p-qty{display:none}
.gk-qty input{width:40px;text-align:center;border:0;font-weight:700;font-size:var(--fs-14);-moz-appearance:textfield;background:none}
.gk-qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.gk-tab button{padding:12px 0;font:700 var(--fs-14) var(--font-sans);color:var(--c-text-2);white-space:nowrap;background:none;border:0}
.gk-tab button.on{color:var(--c-primary);box-shadow:inset 0 -2.5px 0 var(--c-primary)}
.gk-isi p+p{margin-top:10px}
.gk-isi a{color:var(--c-link)}
.gk-isi img{max-width:100%;height:auto}
@media(max-width:1023px){
  .gk-produk .gk-buybar{position:fixed;left:0;right:0;bottom:0;margin:0!important}
  body.single-product{padding-bottom:calc(var(--buybar-h) + env(safe-area-inset-bottom))}
}
@media(min-width:1024px){.p-qty{display:flex;align-items:center;gap:12px;margin-top:22px;font:700 var(--fs-14) var(--font-sans)}.p-qty .gk-qty{height:48px}.p-qty .gk-qty button{width:46px}.gk-p-kiri{grid-template-columns:76px 1fr}.gk-p-kiri>.gk-galeri:first-child{grid-column:1/-1}}
.gk-geser img{height:auto}
.gk-toast{width:max-content;white-space:nowrap}
/* ================= KERANJANG (Tech AI) ================= */
.c-h{display:flex;align-items:baseline;gap:10px;padding:18px 0 4px}
.c-h h1{font:var(--t-h1);font-size:var(--fs-24)}
.c-h span{font-size:var(--fs-13);color:var(--c-text-2)}
.gk-item img{width:84px;height:84px;border-radius:var(--r-md);border:1px solid var(--c-border);object-fit:contain;background:#fff}
.gk-item .nm{display:-webkit-box}
.gk-item .hr .woocommerce-Price-amount{font:inherit}
.gk-item .hapus{background:none;border:0}
[data-keranjang].muat{opacity:.55;pointer-events:none}
.c-upsell{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:12px;border-radius:var(--r-lg);border:1px solid var(--c-border);margin-top:10px}
.c-upsell img{width:64px;height:64px;border-radius:var(--r-md);object-fit:contain;border:1px solid var(--c-border)}
.c-upsell .nm{font:600 var(--fs-12)/1.35 var(--font-sans);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c-upsell b{font:800 var(--fs-13) var(--font-sans);display:block;margin-top:4px}
.c-bar{position:sticky;bottom:0;z-index:var(--z-buybar);background:#fff;border-top:1px solid var(--c-border);box-shadow:0 -6px 20px rgba(20,50,22,.08);padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;margin:12px calc(var(--gutter)*-1) 0}
.c-bar .t small{display:block;font-size:var(--fs-11);color:var(--c-text-2)}
.c-bar .t b{font:800 var(--fs-18)/1.2 var(--font-sans)}
.c-bar .gk-btn{flex:1}
.gk-voucher-d{margin-top:18px}
.gk-voucher-d summary{list-style:none;cursor:pointer}
.gk-voucher-d summary::-webkit-details-marker{display:none}
.gk-voucher-f{display:flex;gap:8px;margin-top:10px}
.gk-voucher-f .gk-input{height:44px;text-transform:uppercase}
.gk-aman{font-size:var(--fs-12);color:var(--c-text-2);margin-top:10px;justify-content:center;gap:6px;align-items:center}
@media(min-width:1024px){.gk-aman{display:flex!important}}
.woocommerce-notices-wrapper,.woocommerce-message,.woocommerce-error,.woocommerce-info{margin:12px 0}
.woocommerce-message,.woocommerce-info{list-style:none;padding:12px 14px;border-radius:var(--r-lg);background:var(--c-selected-bg);color:var(--c-primary);font-size:var(--fs-13);font-weight:600}
.woocommerce-error{list-style:none;padding:12px 14px;border-radius:var(--r-lg);background:var(--c-danger-bg);color:var(--c-danger);font-size:var(--fs-13);font-weight:600}
.woocommerce-message .button{display:none}
@media(min-width:1024px){.c-bar{position:static;box-shadow:none;border:0;padding:0;margin:16px 0 0}.c-bar .t{display:none}.gk-item img{width:110px;height:110px}}
/* ================= CHECKOUT (Tech AI) ================= */
.gk-co-hdr .wrap{height:var(--header-h)}
.gk-checkout{padding-bottom:24px}
.gk-checkout .woocommerce-billing-fields>h3,.gk-checkout .woocommerce-additional-fields>h3,.gk-checkout #ship-to-different-address{display:none}
.gk-checkout .form-row{display:block;margin:0 0 14px;padding:0}
.gk-checkout .form-row label{display:block;font:700 var(--fs-13)/1.2 var(--font-sans);margin-bottom:6px}
.gk-checkout .form-row label small{font-weight:500;color:var(--c-text-2)}
.gk-checkout .form-row .required{color:var(--c-danger);text-decoration:none;border:0}
.gk-checkout .form-row .optional{font-weight:500;color:var(--c-text-2)}
.gk-checkout .input-text,.gk-checkout select,.gk-checkout textarea,.gk-voucher-f .gk-input{width:100%;height:var(--input-h);border:1.5px solid var(--c-border-strong);border-radius:var(--r-md);padding:0 14px;font:400 var(--fs-16) var(--font-sans);background:#fff;color:var(--c-text)}
.gk-checkout .input-text::placeholder{color:var(--c-placeholder)}
.gk-checkout .input-text:focus,.gk-checkout select:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-selected-bg)}
.gk-checkout .woocommerce-invalid .input-text,.gk-checkout .woocommerce-invalid .select2-selection{border-color:var(--c-danger)!important}
.gk-checkout .description{display:block!important;font-size:var(--fs-12);color:var(--c-text-2);margin-top:5px;position:static!important;background:none!important;padding:0!important}
.gk-checkout .description::before{display:none}
.gk-checkout .woocommerce-billing-fields__field-wrapper,.gk-checkout .woocommerce-additional-fields__field-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.gk-checkout .form-row-wide,.gk-checkout #order_comments_field{grid-column:1/-1}
.gk-checkout #billing_country_field{grid-column:1/-1}
.gk-checkout #billing_country_field strong{display:block;font-weight:600;color:var(--c-text-2);font-size:var(--fs-14)}
.gk-checkout .select2-container .select2-selection--single{height:var(--input-h);border:1.5px solid var(--c-border-strong);border-radius:var(--r-md);display:flex;align-items:center}
.gk-checkout .select2-container .select2-selection--single .select2-selection__rendered{padding-left:14px;font-size:var(--fs-16);line-height:1.2;color:var(--c-text)}
.gk-checkout .select2-container .select2-selection--single .select2-selection__arrow{height:100%;right:8px}
.select2-dropdown{border-color:var(--c-border-strong)!important;border-radius:var(--r-md)!important;font-family:var(--font-sans)}
.select2-results__option--highlighted{background:var(--c-primary)!important}
.gk-checkout .woocommerce-account-fields{grid-column:1/-1;margin-top:4px}
.gk-checkout .woocommerce-form__label-for-checkbox,.gk-checkout .woocommerce-form__label{display:flex!important;gap:8px;align-items:flex-start;font-weight:600!important;font-size:var(--fs-13)!important}
.gk-checkout input[type=checkbox]{width:20px;height:20px;accent-color:var(--c-primary);flex:none}
/* Kartu pilihan pengiriman & pembayaran */
.gk-ok{cursor:pointer;position:relative}
.gk-ok input[type=radio]{position:absolute;opacity:0;width:1px;height:1px}
.gk-ok:has(input:checked){border-color:var(--c-primary);background:var(--c-selected-bg)}
.gk-ok:has(input:checked) .rd{border-color:var(--c-primary);box-shadow:inset 0 0 0 5px #fff;background:var(--c-primary)}
.gk-ok:has(input:focus-visible){box-shadow:var(--sh-focus)}
.gk-ok .hg .woocommerce-Price-amount{font:inherit}
.gk-checkout ul.payment_methods{list-style:none;display:grid;gap:8px;margin:0;padding:0}
.gk-checkout ul.payment_methods li.gk-bayar-grp{margin:10px 0 0}
.gk-checkout ul.payment_methods li.gk-bayar-grp:first-child{margin-top:0}
.gk-checkout .payment_box{margin-top:8px;padding:12px 14px;border-radius:var(--r-md);background:var(--c-surface-alt);font-size:var(--fs-13);color:var(--c-text-2)}
.gk-checkout .gk-kirim-opsi .gk-opsi-kirim{display:grid;gap:8px}
/* Ringkasan */
.co-it{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:8px 0}
.co-it img{width:56px;height:56px;border-radius:10px;border:1px solid var(--c-border);object-fit:contain;background:#fff}
.co-it .nm{font:600 var(--fs-12)/1.35 var(--font-sans);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.co-it small{font-size:var(--fs-11);color:var(--c-text-2)}
.co-it b{font:800 var(--fs-13) var(--font-sans);white-space:nowrap}
.co-it b .woocommerce-Price-amount,.gk-ring .woocommerce-Price-amount{font:inherit}
.co-bar{position:sticky;bottom:0;z-index:var(--z-buybar);background:#fff;border-top:1px solid var(--c-border);box-shadow:0 -6px 20px rgba(20,50,22,.08);padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;margin:12px calc(var(--gutter)*-1) 0}
.co-bar .t small{display:block;font-size:var(--fs-11);color:var(--c-text-2)}
.co-bar .t b{font:800 var(--fs-18)/1.2 var(--font-sans)}
.co-bar .gk-btn{flex:1}
.co-setuju{font-size:var(--fs-11);color:var(--c-text-2);text-align:center;margin-top:10px;line-height:1.5}
.co-setuju a{color:var(--c-link);text-decoration:underline}
.gk-co-aksi .woocommerce-terms-and-conditions-wrapper{margin-top:12px;font-size:var(--fs-12)}
.gk-co-aksi .woocommerce-privacy-policy-text{font-size:var(--fs-11);color:var(--c-text-2);line-height:1.5}
.gk-checkout .woocommerce-form-coupon-toggle .woocommerce-info,.gk-checkout .woocommerce-form-login-toggle .woocommerce-info{background:var(--c-surface-alt);color:var(--c-text);font-weight:600}
.gk-checkout .woocommerce-info a{color:var(--c-link);text-decoration:underline}
.gk-checkout form.checkout_coupon{display:flex;gap:8px;margin:0 0 12px;padding:12px;border:1.5px dashed var(--c-border-strong);border-radius:var(--r-lg)}
.gk-checkout form.checkout_coupon p{margin:0;flex:1}
.gk-checkout form.checkout_coupon p.form-row-last{flex:none}
.gk-checkout form.checkout_coupon .button{height:var(--input-h);padding:0 18px;border-radius:var(--r-md);background:var(--c-primary);color:#fff;font:var(--t-btn);border:0}
.gk-checkout .blockUI.blockOverlay{background:rgba(255,255,255,.6)!important}
@media(min-width:1024px){.co-bar{position:static;box-shadow:none;border:0;padding:0;margin:16px 0 0}.co-bar .t{display:none}.gk-checkout .gk-kirim-opsi .gk-opsi-kirim{grid-template-columns:1fr 1fr}}
.gk-checkout #billing_country_field{display:none!important}
.gk-checkout form.login,.gk-checkout form.checkout_coupon{display:none}
.gk-checkout form.login{padding:14px;border:1px solid var(--c-border);border-radius:var(--r-lg);margin-bottom:12px}
.gk-checkout form.login .button{height:44px;padding:0 18px;border-radius:var(--r-md);background:var(--c-primary);color:#fff;font:var(--t-btn);border:0;margin-top:6px}
/* Pesanan diterima */
.gk-selesai{max-width:640px;margin:0 auto;padding-bottom:40px}
.gk-selesai .gk-kosong .ilu{background:var(--c-selected-bg)}
.gk-selesai-info{margin-top:20px}
.gk-selesai-info .woocommerce-Price-amount{font:inherit}
.gk-selesai-aksi{display:grid;gap:10px;margin:20px auto 0;max-width:420px}
.gk-selesai-detail{margin-top:20px;font-size:var(--fs-14)}
.gk-selesai-detail h2{font:var(--t-h3);font-size:var(--fs-18);margin:22px 0 10px}
.gk-selesai-detail ul{list-style:none;display:grid;gap:6px;padding:14px;border-radius:var(--r-lg);background:var(--c-surface-alt)}
.gk-selesai-detail table{width:100%;border-collapse:collapse;font-size:var(--fs-13)}
.gk-selesai-detail th,.gk-selesai-detail td{padding:8px 0;border-bottom:1px solid var(--c-border);text-align:left;vertical-align:top}
.gk-selesai-detail td:last-child,.gk-selesai-detail th:last-child{text-align:right}
.gk-selesai-detail address{font-style:normal;padding:14px;border-radius:var(--r-lg);border:1px solid var(--c-border);line-height:1.6}
.gk-selesai-detail .woocommerce-customer-details{margin-top:8px}
/* ================= PILIH HP (Tech AI) ================= */
.ph-in{max-width:900px;margin:0 auto}
.ph-why{display:grid;gap:8px;margin-top:16px}
.ph-why div{display:flex;gap:10px;align-items:center;font-size:var(--fs-13)}
.ph-why .ic{width:20px;height:20px;color:var(--c-primary);background:var(--c-selected-bg);border-radius:50%;padding:3px;box-sizing:content-box}
.ph-skrg{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;padding:12px 14px;border-radius:var(--r-lg);background:var(--c-surface-alt)}
.ph-skrg>.ic{width:26px;height:26px;color:var(--c-primary)}
.ph-skrg small{display:block;font-size:var(--fs-11);color:var(--c-text-2);font-weight:600}
.ph-skrg b{font:800 var(--fs-15) var(--font-sans);color:var(--c-primary)}
.ph-skrg span{flex:1;min-width:140px}
.ph-ketik{margin-top:20px;background:#fff!important;border-color:var(--c-border-strong)!important}
.ph-hasil{margin-top:8px;border:1px solid var(--c-border);border-radius:var(--r-lg);padding:0 12px}
.ph-hasil .gk-drow:last-child{border-bottom:0}
.ph-tidak{padding:14px 0;font-size:var(--fs-13);color:var(--c-text-2)}
.ph-tidak a{color:var(--c-link);font-weight:700}
.gk-fam button{display:flex;align-items:center;gap:12px;padding:14px;border-radius:var(--r-xl);border:1.5px solid var(--c-border);font:700 var(--fs-14)/1.2 var(--font-sans);text-align:left;background:#fff;cursor:pointer}
.gk-fam button small{display:block;font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2);margin-top:3px}
.gk-fam button .ic{width:34px;height:34px;color:var(--c-primary);stroke-width:1.4;flex:none}
.gk-fam button.on{border-color:var(--c-primary);background:var(--c-selected-bg)}
.ph-model{border:1.5px dashed var(--c-border-strong);border-radius:var(--r-xl);padding:22px;text-align:center;font-size:var(--fs-13);color:var(--c-text-2)}
.ph-model.isi{border-style:solid;border-color:var(--c-border);text-align:left;color:var(--c-text)}
.ph-model.isi b{font:var(--t-h3);display:block;margin-bottom:12px}
.ph-model .gk-chips{flex-wrap:wrap;margin:0;padding:0;overflow:visible}
@media(min-width:1024px){.ph-why{grid-template-columns:repeat(3,1fr)}}
/* ================= AKUN (Tech AI) ================= */
.gk-akun{padding-top:24px;padding-bottom:48px;max-width:1024px}
.gk-akun>h1{font:var(--t-h1);color:var(--c-primary);margin-bottom:16px}
.gk-akun .u-columns,.gk-akun #customer_login{display:grid;gap:20px}
.gk-akun #customer_login>div{border:1px solid var(--c-border);border-radius:var(--r-xl);padding:20px}
.gk-akun h2{font:var(--t-h2);margin-bottom:12px}
.gk-akun .form-row{display:block;margin:0 0 14px}
.gk-akun label{display:block;font:700 var(--fs-13)/1.2 var(--font-sans);margin-bottom:6px}
.gk-akun .input-text,.gk-akun select{width:100%;height:var(--input-h);border:1.5px solid var(--c-border-strong);border-radius:var(--r-md);padding:0 14px;font:400 var(--fs-16) var(--font-sans)}
.gk-akun .input-text:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-selected-bg)}
.gk-akun .button,.gk-akun button[type=submit]{display:inline-flex;align-items:center;justify-content:center;height:var(--btn-h);padding:0 22px;border-radius:var(--r-lg);font:var(--t-btn);background:var(--c-primary);color:#fff;border:0;cursor:pointer}
.gk-akun .woocommerce-form-login__rememberme{display:flex!important;gap:8px;align-items:center;font-weight:600;margin:4px 0 12px}
.gk-akun .lost_password a,.gk-akun a{color:var(--c-link)}
.gk-akun .woocommerce-MyAccount-navigation ul{list-style:none;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 calc(var(--gutter)*-1) 16px;padding:0 var(--gutter)}
.gk-akun .woocommerce-MyAccount-navigation li a{display:inline-flex;align-items:center;height:40px;padding:0 14px;border-radius:var(--r-md);border:1.5px solid var(--c-border);font:600 var(--fs-13) var(--font-sans);color:var(--c-text);white-space:nowrap}
.gk-akun .woocommerce-MyAccount-navigation li.is-active a{border-color:var(--c-primary);background:var(--c-selected-bg);color:var(--c-primary)}
.gk-akun .woocommerce-MyAccount-content table{width:100%;border-collapse:collapse;font-size:var(--fs-13)}
.gk-akun .woocommerce-MyAccount-content th,.gk-akun .woocommerce-MyAccount-content td{padding:10px 8px;border-bottom:1px solid var(--c-border);text-align:left}
.gk-akun .woocommerce-MyAccount-content p{margin-bottom:10px;font-size:var(--fs-14)}
.gk-akun address{font-style:normal;line-height:1.6}
@media(min-width:1024px){.gk-akun #customer_login{grid-template-columns:1fr 1fr}.gk-akun .woocommerce:has(>.woocommerce-MyAccount-navigation){display:grid;grid-template-columns:220px 1fr;gap:32px}.gk-akun .woocommerce-MyAccount-navigation ul{flex-direction:column;margin:0;padding:0}.gk-akun .woocommerce>.woocommerce-notices-wrapper{grid-column:1/-1}}
.password-input{position:relative;display:block}
.show-password-input{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:0;width:32px;height:32px;cursor:pointer;font-size:0}
.show-password-input::after{content:'Lihat';font:700 var(--fs-12) var(--font-sans);color:var(--c-link)}
.show-password-input.display-password::after{content:'Tutup'}
.gk-akun .password-input .input-text{padding-right:64px}
.show-password-input{width:auto}
/* Stok sedikit, bintang & tab ulasan (4 Okt 2026) */
.gk-stok.sedikit{color:var(--c-danger)}.gk-stok.sedikit i{background:var(--c-danger)}
.bin svg[data-k="0"],.gk-p-rating svg[data-k="0"]{fill:var(--c-border) !important;color:var(--c-border)}
.gk-p-rating{display:inline-flex;align-items:center;gap:6px;margin:6px 0 2px;font-size:var(--fs-13);color:var(--c-text-2)}
.gk-p-rating .bin{display:flex;gap:1px;color:var(--gk-emas-500)}
.gk-p-rating .bin .ic{width:15px;height:15px;fill:currentColor}
.gk-p-rating b{color:var(--c-text)}
.gk-p-rating span{text-decoration:underline}
.gk-kartu .rt{display:flex;align-items:center;gap:3px;font-size:var(--fs-11);color:var(--c-text-2);margin-top:4px}
.gk-kartu .rt .ic{width:12px;height:12px;fill:var(--gk-emas-500);color:var(--gk-emas-500)}
.gk-kartu .rt b{color:var(--c-text)}
.gk-ulas .bin{display:inline-flex;gap:1px;color:var(--gk-emas-500)}
.gk-ulas .bin .ic{width:14px;height:14px;fill:currentColor}
.gk-ulas .ul-ring{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.gk-ulas .ul-ring>b{font:800 var(--fs-36)/1 var(--font-sans);color:var(--c-primary)}
.gk-ulas .ul-ring small{display:block;font-size:var(--fs-12);color:var(--c-text-2);margin-top:4px}
.gk-ulas .ul-list{display:grid;gap:10px}
.gk-ulas .ul{border:1px solid var(--c-border);border-radius:var(--r-lg);padding:12px 14px}
.gk-ulas .ul .atas{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-11);color:var(--c-text-2)}
.gk-ulas .ul .src{background:var(--c-surface-alt);border-radius:var(--r-full);padding:2px 8px}
.gk-ulas .ul blockquote{margin:8px 0;font-size:var(--fs-14);line-height:1.5}
.gk-ulas .ul figcaption{display:flex;align-items:center;gap:8px;font:600 var(--fs-12) var(--font-sans);color:var(--c-text-2)}
.gk-ulas .ul .ver{display:inline-flex;align-items:center;gap:3px;color:var(--c-success);font-weight:600}
.gk-ulas .ul .ver .ic{width:12px;height:12px}
.gk-ulas .ul-kosong{font-weight:700}
.gk-ulas .ul-toko{display:flex;align-items:center;gap:8px;font-size:var(--fs-13);color:var(--c-text-2);margin-top:6px}
.gk-ulas .ul-cat{display:flex;gap:8px;align-items:flex-start;font-size:var(--fs-12);color:var(--c-text-2);background:var(--c-surface-alt);border-radius:var(--r-lg);padding:10px 12px;margin-top:14px}
.gk-ulas .ul-cat .ic{width:16px;height:16px;flex:none;margin-top:1px}
.gk-ulas .ul-form{margin-top:18px;border-top:1px solid var(--c-border);padding-top:14px}
.gk-ulas .ul-judul{font:var(--t-h3);margin-bottom:10px}
.gk-ulas .ul-bintang{border:0;padding:0;margin:0 0 12px;display:flex;flex-wrap:wrap;gap:6px}
.gk-ulas .ul-bintang legend{font-weight:700;font-size:var(--fs-13);margin-bottom:6px;width:100%}
.gk-ulas .ul-bintang label{cursor:pointer}
.gk-ulas .ul-bintang input{position:absolute;opacity:0}
.gk-ulas .ul-bintang span{display:inline-flex;height:36px;align-items:center;padding:0 12px;border:1.5px solid var(--c-border);border-radius:var(--r-full);font-weight:700;font-size:var(--fs-13)}
.gk-ulas .ul-bintang input:checked+span{border-color:var(--c-primary);background:var(--c-selected-bg);color:var(--c-primary)}
.gk-ulas .ul-bintang input:focus-visible+span{box-shadow:var(--sh-focus)}
.gk-ulas .ul-form label[for=comment]{display:block;font-weight:700;font-size:var(--fs-13);margin-bottom:6px}
.gk-ulas .ul-form textarea{width:100%;height:auto;padding:10px 12px}
.gk-ulas .ul-form .form-submit{margin-top:12px}
.gk-produk .gk-tab{scroll-margin-top:calc(var(--header-h,120px) + 70px)}
.gk-halaman .isi .gk-btn{white-space:normal;height:auto;min-height:var(--btn-h);padding-top:10px;padding-bottom:10px;text-align:center;max-width:100%}
/* Lightbox foto produk (zoom) */
.gk-geser img{cursor:zoom-in}
.gk-lb{position:fixed;inset:0;z-index:calc(var(--z-toast) + 1);background:#fff;display:flex;flex-direction:column}
.gk-lb .lb-atas{display:flex;align-items:center;gap:12px;height:56px;padding:0 8px 0 16px;border-bottom:1px solid var(--c-border);font:700 var(--fs-14) var(--font-sans);flex:none}
.gk-lb .lb-tip{color:var(--c-text-2);font-weight:500;font-size:var(--fs-12);margin-left:auto}
.gk-lb [data-lb-tutup]{width:44px;height:44px;display:grid;place-items:center;border-radius:50%}
.gk-lb [data-lb-tutup] .ic{width:22px;height:22px}
.gk-lb .lb-jalur{flex:1;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;min-height:0}
.gk-lb .lb-jalur::-webkit-scrollbar{display:none}
.gk-lb.zoom .lb-jalur{overflow-x:hidden}
.gk-lb .lb-s{flex:0 0 100%;scroll-snap-align:start;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0}
.gk-lb .lb-s img{max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;user-select:none;-webkit-user-select:none}
.gk-lb .lb-s.zoom{overflow:auto;display:block}
.gk-lb .lb-s.zoom img{max-width:none;max-height:none;width:250%;height:auto;cursor:zoom-out}
@media(min-width:1024px){.gk-lb .lb-s.zoom img{width:auto;height:240%}}
.gk-lb .lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--c-border);box-shadow:var(--sh-1);display:grid;place-items:center}
.gk-lb .lb-nav.kiri{left:12px}.gk-lb .lb-nav.kanan{right:12px}
.gk-lb .lb-nav .ic{width:20px;height:20px}
.gk-lb.zoom .lb-nav{display:none}
.ph-aksi{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ph-aksi .gk-btn{flex:1 1 140px}
/* Wishlist (♡) */
.gk-suka{position:absolute;right:6px;top:6px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;color:var(--c-text-2);box-shadow:var(--sh-1);cursor:pointer;z-index:2}
.gk-suka .ic{width:18px;height:18px}
.gk-suka.on,.gk-suka-p.on{color:var(--c-sale)}
.gk-suka.on .ic,.gk-suka-p.on .ic{fill:currentColor}
.gk-suka:focus-visible{box-shadow:var(--sh-focus)}
@media(hover:hover){.gk-suka:hover{color:var(--c-sale)}}
.gk-galeri .aksi .gk-suka-p .ic{width:19px;height:19px}
.gk-suka-hal .gk-grid{margin-top:16px}
.gk-suka-hal .gk-muat{grid-column:1/-1;color:var(--c-text-2);font-size:var(--fs-14)}
.gk-suka-cat{display:flex;gap:8px;align-items:flex-start;font-size:var(--fs-13);color:var(--c-text-2);background:var(--c-surface-alt);border-radius:var(--r-lg);padding:10px 12px;margin-top:20px}
.gk-suka-cat .ic{width:16px;height:16px;flex:none;margin-top:2px}
.gk-suka-cat a{color:var(--c-link);text-decoration:underline}
.gk-toast .ic{width:18px;height:18px;fill:var(--c-sale);color:var(--c-sale);flex:none}
.gk-kat-lay.kosong{grid-template-columns:1fr}
.gk-mdl-kosong{font-size:var(--fs-14);color:var(--c-text-2);padding:6px 0}
/* Mega menu: daftar kiri → panel kanan + promo (Gadkey › Mega Menu, 5 Okt 2026) */
.gk-mega.mg .wrap{display:grid;grid-template-columns:240px minmax(0,1fr);gap:32px;padding-top:24px;padding-bottom:28px;align-items:stretch}
#mega-brand.mg .wrap{display:block}
.mg-kiri{display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--c-border);padding-right:16px}
.mg-it{display:flex;align-items:center;gap:12px;height:44px;padding:0 12px;border:0;border-radius:12px;background:none;font:600 var(--fs-14) var(--font-sans);color:var(--c-text);text-align:left;cursor:pointer}
.mg-it .ic{width:20px;height:20px;color:var(--c-link)}
.mg-it span{flex:1}
.mg-it .r{width:14px;height:14px;opacity:.35}
.mg-it.on{background:var(--c-selected-bg);color:var(--c-primary)}
.mg-it.on .r{opacity:1}
.mg-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;min-height:280px}
.mg-panel.ada-promo{grid-template-columns:minmax(0,1fr) 300px}
.mg-panel[hidden]{display:none}
.mg-panel section{display:flex;flex-direction:column;gap:14px;min-width:0}
.mg-h{display:flex;align-items:baseline;gap:12px}
.mg-h h3{font:800 var(--fs-20)/1.2 var(--font-sans);color:var(--c-primary);margin:0}
.mg-h span{font-size:var(--fs-13);color:var(--c-text-2)}
.mg-model{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px}
.gk-nav .gk-mega .mg-model a{display:block;height:auto;padding:9px 0;border:0;border-bottom:1px solid var(--c-surface-alt);font:500 var(--fs-14) var(--font-sans);color:var(--c-text)}
.gk-nav .gk-mega .mg-model a:hover{color:var(--c-primary)}
.mg-kosong{color:var(--c-text-2);font-size:var(--fs-14)}
.gk-nav .gk-mega .mg-semua{margin-top:auto;align-self:flex-start;color:var(--c-link)}
.mg-kartu{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.gk-nav .gk-mega .mg-kartu a{display:flex;flex-direction:column;align-items:center;gap:10px;height:auto;padding:18px 12px;border:1px solid var(--c-border);border-radius:16px;text-align:center;font:600 var(--fs-14)/1.3 var(--font-sans);color:var(--c-text)}
.gk-nav .gk-mega .mg-kartu a:hover,.gk-nav .gk-mega .mg-brand a:hover{border-color:var(--c-primary)}
.mg-kartu .bul{width:64px;height:64px;border-radius:50%;background:var(--c-surface-alt);display:grid;place-items:center}
.gk-nav .gk-mega .mg-kartu .bul .ic{width:30px;height:30px;color:var(--c-primary);stroke-width:1.5}
.mg-brand{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gk-nav .gk-mega .mg-brand a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:96px;padding:0 12px;border:1px solid var(--c-border);border-radius:16px;font:700 var(--fs-14) var(--font-sans);color:var(--c-text)}
.mg-brand img{max-width:130px;max-height:40px;object-fit:contain}
.mg-promo{border-radius:18px;background:var(--c-surface-alt);overflow:hidden;display:flex;flex-direction:column;align-self:start}
.mg-promo img{width:100%;height:210px;object-fit:cover;display:block}
.mg-promo .tx{padding:18px 20px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.mg-promo .lbl{font:700 11px var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--c-link)}
.mg-promo b{font:800 var(--fs-18)/1.25 var(--font-sans);color:var(--c-primary)}
.gk-nav .gk-mega .mg-promo .gk-btn{height:40px;padding:0 16px;border:0;color:var(--c-on-primary)}
.gk-nav .gk-mega .mg-promo .gk-btn .ic{color:currentColor}
/* Mega menu: subjudul kelompok model (dari kategori induk) */
.mg-grup{display:flex;align-items:center;gap:12px;margin-top:14px}
.mg-grup:first-of-type{margin-top:2px}
.mg-grup span{flex:none;padding:5px 12px;border-radius:var(--r-full);background:var(--c-surface-alt);font:700 11px/1.2 var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--c-primary)}
.mg-grup::after{content:"";flex:1;height:1px;background:var(--c-border)}
.gk-nav .gk-mega .mg-model.grup a{border-bottom-color:transparent}
.gk-dgrp.grup-model h4{margin:14px 0 4px;padding:9px 12px;border-radius:10px;background:var(--c-surface-alt);color:var(--c-primary);font-weight:700}
.mg-model.grup{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 18px}
.gk-nav .gk-mega .mg-model.grup a{padding:7px 0}
.mg-panel section{overflow:auto;max-height:70vh}
/* Subjudul merek (induk kategori device) di mega menu & menu HP */
.mg-merek{display:block;font:700 11px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--c-text-2);padding:10px 12px 4px}
.mg-merek:first-child{padding-top:2px}
/* Judul merek di menu HP: teks biasa (bukan kapsul) supaya tidak terlihat seperti tombol (owner 8 Okt 2026) */
.gk-dmerek{display:block;margin:14px 0 8px;font:700 var(--fs-13)/1.2 var(--font-sans);color:var(--c-primary)}
.gk-dgrp h4+.gk-dmerek{margin-top:2px}

/* ---------- Promo (inc/promo.php · mockup papan 11–12, 6 Okt 2026) ---------- */
:root{--c-sale-bg:#FBEFE7;--c-sale-tx:#8A3F14}
.gk-kartu .gk-promo-lbl{position:absolute;left:0;bottom:10px;display:inline-flex;align-items:center;height:26px;padding:0 10px 0 8px;border-radius:0 var(--r-xs) var(--r-xs) 0;background:var(--c-sale);color:#fff;font:800 var(--fs-12)/1 var(--font-sans);letter-spacing:.02em;box-shadow:0 2px 8px rgba(0,0,0,.18);white-space:nowrap}
.gk-kartu .hr.promo{color:var(--c-sale)}
.gk-kartu .hm{margin-top:4px;font:700 var(--fs-12)/1.2 var(--font-sans);color:var(--c-sale)}
.gk-kartu .hb,.gk-p-promo .ak{display:flex;align-items:center;gap:4px;margin-top:4px;font:500 var(--fs-11)/1.2 var(--font-sans);color:var(--c-text-2)}
.gk-kartu .hb .ic,.gk-p-promo .ak .ic{width:13px;height:13px}
.gk-kartu .hb[hidden],.gk-p-promo .ak[hidden],.gk-p-promo[hidden]{display:none}
@media(min-width:1024px){.gk-kartu .gk-promo-lbl{height:30px;font-size:var(--fs-14);padding:0 12px 0 10px}}
.gk-harga.promo{color:var(--c-sale)}
.gk-p-promo{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:10px;padding:10px 12px;border-radius:var(--r-md,10px);background:var(--c-sale-bg);color:var(--c-sale-tx)}
.gk-p-promo .pc{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:var(--r-xs);background:var(--c-sale);color:#fff;font:800 var(--fs-12)/1 var(--font-sans)}
.gk-p-promo b{font:700 var(--fs-14)/1.2 var(--font-sans)}
.gk-p-promo .ak{margin:0 0 0 auto;color:var(--c-sale-tx)}
.gk-promo-pill{display:inline-flex;align-items:center;height:24px;padding:0 9px;margin-left:8px;border-radius:var(--r-xs);background:var(--c-sale);color:#fff;font:800 var(--fs-12)/1 var(--font-sans);letter-spacing:0;vertical-align:4px}
.gk-nav a.gk-nav-promo{color:var(--c-sale)}
.gk-nav a.gk-nav-promo::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c-sale);margin-right:2px}
.gk-drow.gk-nav-promo,.gk-drow.gk-nav-promo .ic{color:var(--c-sale)}
.gk-cek-promo{color:var(--c-sale);font-weight:700}
.gk-item .hr.promo,.co-it b.promo{color:var(--c-sale)}
.gk-item .hr s{display:block;margin:3px 0 0;font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2)}
.co-it b s{margin-left:6px;font:500 var(--fs-11) var(--font-sans);color:var(--c-text-2)}
.co-it b.promo s{display:block;margin:2px 0 0;text-align:right}
.gk-hemat-box{display:flex;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border-radius:var(--r-md,10px);background:var(--c-sale-bg);color:var(--c-sale-tx);font-size:var(--fs-14)}
.gk-hemat-box i{flex:none;display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--c-sale);color:#fff;font:800 var(--fs-13)/1 var(--font-sans);font-style:normal}
.gk-kartu .hr.promo{display:flex;flex-wrap:wrap;align-items:baseline;row-gap:2px}
.gk-sec-promo .gk-sec-h h2{display:flex;align-items:center;flex-wrap:wrap;gap:6px 0}
@media(max-width:600px){.gk-promo-pill{height:22px;font-size:var(--fs-11);padding:0 7px}}
.gk-sec-promo .gk-sec-h>div{flex:1;min-width:0}
.gk-akun .woocommerce-privacy-policy-text{margin-bottom:16px}

/* Masuk/Daftar dengan Google (inc/akun.php, plugin Nextend Social Login) */
.gk-sosial{margin:4px 0 16px}
.gk-sosial .nsl-container{display:block!important}
.gk-sosial .nsl-container-buttons{display:flex!important;flex-direction:column;gap:8px;padding:0!important}
.gk-sosial .nsl-container-buttons a{display:block!important;margin:0!important;max-width:none!important;text-decoration:none}
.gk-sosial .nsl-button{display:flex!important;align-items:center;justify-content:center;gap:10px;height:var(--btn-h);border-radius:var(--r-lg)!important;background:#fff!important;border:1.5px solid var(--c-border-strong);box-shadow:none!important;color:var(--c-text)!important;font:700 var(--fs-15)/1 var(--font-sans)!important}
.gk-sosial .nsl-button:hover{border-color:var(--c-primary)}
.gk-sosial .nsl-button-svg-container{display:flex;padding:0!important}
.gk-sosial .nsl-button-svg-container svg{width:20px;height:20px}
.gk-sosial .nsl-button-label-container{flex:0 0 auto!important;margin:0!important;padding:0!important;color:var(--c-text)!important;font:inherit!important;text-align:left}
.gk-atau{display:flex;align-items:center;gap:10px;margin-top:16px;color:var(--c-text-2);font-size:var(--fs-12)}
.gk-atau::before,.gk-atau::after{content:"";flex:1;height:1px;background:var(--c-border)}

/* ---------- Daftar voucher (template-parts/voucher.php · mockup papan 13) ---------- */
.gk-vrow{display:flex;align-items:center;gap:10px;width:100%;margin-top:12px;padding:12px 14px;border:1.5px dashed var(--c-border-strong);border-radius:var(--r-lg);background:#fff;font:inherit;text-align:left;cursor:pointer;color:var(--c-text)}
.gk-vrow>i{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:var(--c-primary);color:#fff;font:800 var(--fs-14)/1 var(--font-sans);font-style:normal}
.gk-vrow>span{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.gk-vrow b{font:700 var(--fs-14)/1.25 var(--font-sans);color:var(--c-primary)}
.gk-vrow small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-vrow .ic.r{width:18px;height:18px;color:var(--c-text-2)}
.gk-vrow.ada small{color:var(--c-sale);font-weight:600}
.gk-vrow.on{border-style:solid;border-color:var(--c-success,#1f7a3a);background:var(--c-selected-bg)}
.gk-vrow.on small{color:var(--c-success,#1f7a3a);font-weight:600}
.co-it+.gk-vrow,.woocommerce-checkout-review-order-table>.gk-vrow{margin:12px 0 4px}
.gk-vdlg{width:min(460px,100%);max-height:86vh;margin:auto;padding:0;border:0;border-radius:var(--r-2xl,20px);box-shadow:var(--sh-3);color:var(--c-text);overflow:hidden}
.gk-vdlg[open]{display:flex;flex-direction:column}
.gk-vdlg::backdrop{background:rgba(20,32,22,.45)}
@media(max-width:600px){.gk-vdlg{margin:auto 0 0;max-width:100%;width:100%;border-radius:var(--r-2xl,20px) var(--r-2xl,20px) 0 0}}
.gk-vdlg .vd-h{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 8px 18px;font-size:var(--fs-18,18px)}
.gk-vdlg .vd-b{overflow-y:auto;padding:0 16px 20px;display:flex;flex-direction:column;gap:10px}
.gk-vdlg .vd-kode{display:flex;gap:8px}
.gk-vdlg .vd-kode .gk-input{flex:1;min-width:0}
.gk-vdlg .vd-pesan{margin:0;padding:8px 12px;border-radius:var(--r-md);background:var(--c-danger-bg);color:var(--c-danger);font-size:var(--fs-13)}
.gk-vdlg .vd-pesan[hidden]{display:none}
.gk-vdlg h3{margin:8px 0 0;font:700 var(--fs-12)/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-text-2)}
.gk-vdlg .vd-kartu{display:flex;align-items:center;border:1.5px solid var(--c-border);border-radius:14px;overflow:hidden;background:#fff}
.gk-vdlg .vd-kartu.on{border-color:var(--c-primary);background:var(--c-selected-bg)}
.gk-vdlg .vd-kartu.mati{opacity:.72}
.gk-vdlg .vd-kiri{align-self:stretch;flex:none;width:76px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:var(--c-primary);color:#fff;border-right:2px dashed #fff;text-align:center;padding:8px 4px}
.gk-vdlg .vd-kartu.mati .vd-kiri{background:var(--c-text-2)}
.gk-vdlg .vd-kiri b{font:800 var(--fs-16)/1.1 var(--font-sans)}
.gk-vdlg .vd-kiri small{font:700 10px/1 var(--font-sans);letter-spacing:.06em}
.gk-vdlg .vd-isi{flex:1;min-width:0;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.gk-vdlg .vd-isi b{font:700 var(--fs-14)/1.3 var(--font-sans)}
.gk-vdlg .vd-isi span,.gk-vdlg .vd-isi small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-vdlg .vd-isi .vd-alasan{color:var(--c-sale);font-weight:700}
.gk-vdlg .vd-terbaik{align-self:flex-start;padding:2px 6px;border-radius:4px;background:var(--c-sale);color:#fff!important;font:800 10px/1.2 var(--font-sans)!important}
.gk-vdlg .vd-kartu>.gk-btn{flex:none;margin-right:12px}
/* Akun: tombol utama selebar tombol Google, teks Google tidak terpotong, centang bergaya Gadkey */
.gk-sosial .nsl-button-label-container{line-height:1.35!important;overflow:visible!important;padding:2px 0!important}
.gk-akun .woocommerce-form-login__submit,.gk-akun .woocommerce-form-register__submit{width:100%}
.gk-akun .woocommerce-form-login__rememberme input{width:18px;height:18px;margin:0;accent-color:var(--c-primary)}
.gk-akun .lost_password{text-align:center;margin-top:12px}

/* ---------- Masuk / Daftar satu kartu (woocommerce/myaccount/form-login.php · mockup papan 14) ---------- */
.gk-akun #customer_login.gk-masuk{display:flex;flex-direction:column;gap:16px;max-width:460px;margin:8px auto 0;padding:24px;border:1px solid var(--c-border);border-radius:var(--r-2xl,20px);background:#fff;grid-template-columns:none}
.gk-akun #customer_login.gk-masuk>div{border:0;border-radius:0;padding:0}
@media(max-width:600px){.gk-akun #customer_login.gk-masuk{padding:20px 16px;margin-top:0}}
.gk-masuk-tab{display:flex;padding:4px;border-radius:var(--r-lg);background:var(--gk-krem-100,#F4F1EA)}
.gk-masuk-tab a{flex:1;display:flex;align-items:center;justify-content:center;height:40px;border-radius:calc(var(--r-lg) - 3px);font:700 var(--fs-14)/1 var(--font-sans);color:var(--c-text-2);text-decoration:none}
.gk-masuk-tab a[aria-selected=true]{background:#fff;color:var(--c-primary);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.gk-masuk-h h2{margin:0;font:800 var(--fs-24,24px)/1.2 var(--font-sans);color:var(--c-primary)}
.gk-masuk-h p{margin:4px 0 0;font-size:var(--fs-14);color:var(--c-text-2)}
.gk-masuk .gk-sosial{margin:0}
.gk-masuk .gk-label-baris{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:6px}
.gk-masuk .gk-label-baris label{margin:0}
.gk-masuk .gk-label-baris a{font-size:var(--fs-13);font-weight:600;color:var(--c-primary)}
.gk-masuk .gk-masuk-ket,.gk-masuk .woocommerce-privacy-policy-text{font-size:var(--fs-13);line-height:1.5;color:var(--c-text-2)}
.gk-masuk .gk-masuk-ket{margin:0 0 8px}
.gk-masuk-ajak{margin:14px 0 0;text-align:center;font-size:var(--fs-14);color:var(--c-text-2)}
.gk-masuk-ajak a{font-weight:700;color:var(--c-primary)}
.gk-masuk .form-row:last-of-type{margin-bottom:0}
.gk-akun #customer_login.gk-masuk>.gk-masuk-tab{padding:4px;border-radius:var(--r-lg)}

/* ---------- Halaman akun saat login (Dasbor, Pesanan, Alamat, Detail akun) ---------- */
@media(min-width:1024px){
	.gk-akun .woocommerce-MyAccount-navigation ul{gap:4px}
	.gk-akun .woocommerce-MyAccount-navigation li a{display:flex;width:100%;height:44px;border-color:transparent;border-radius:var(--r-md);font-size:var(--fs-14)}
	.gk-akun .woocommerce-MyAccount-navigation li a:hover{background:var(--gk-krem-100)}
	.gk-akun .woocommerce-MyAccount-navigation li.is-active a{border-color:var(--c-primary)}
	.gk-akun .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout{margin-top:8px;padding-top:8px;border-top:1px solid var(--c-border)}
}
.gk-akun .woocommerce-MyAccount-navigation-link--customer-logout a{color:var(--c-text-2)}
.gk-akun .woocommerce-MyAccount-content{min-width:0}
.gk-akun .woocommerce-MyAccount-content fieldset{margin:8px 0 16px;padding:16px 18px 2px;border:1px solid var(--c-border);border-radius:var(--r-xl)}
.gk-akun .woocommerce-MyAccount-content legend{padding:0 6px;margin-left:-6px;font:700 var(--fs-15)/1.2 var(--font-sans);color:var(--c-primary)}
.gk-akun .woocommerce-MyAccount-content .form-row em,.gk-akun #account_display_name_description{display:block;margin-top:6px;font-style:normal;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-akun .woocommerce-MyAccount-content .form-row-first,.gk-akun .woocommerce-MyAccount-content .form-row-last{width:100%}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Button,.gk-akun .woocommerce-MyAccount-content button[type=submit]{min-width:200px}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Addresses{display:grid;gap:16px}
@media(min-width:768px){.gk-akun .woocommerce-MyAccount-content .woocommerce-Addresses{grid-template-columns:1fr 1fr}}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Address{border:1px solid var(--c-border);border-radius:var(--r-xl);padding:16px 18px}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Address-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Address-title h2,.gk-akun .woocommerce-MyAccount-content .woocommerce-Address-title h3{margin:0;font:700 var(--fs-16)/1.2 var(--font-sans)}
.gk-akun .woocommerce-MyAccount-content .woocommerce-Address-title a{font-size:var(--fs-13);font-weight:600;color:var(--c-primary)}
.gk-akun .woocommerce-MyAccount-content address{font-style:normal;font-size:var(--fs-14);line-height:1.6;color:var(--c-text)}
.gk-akun .woocommerce-EditAccountForm .form-row-first,.gk-akun .woocommerce-EditAccountForm .form-row-last{float:none;width:100%}
.gk-akun .woocommerce-orders-table .button,.gk-akun .woocommerce-MyAccount-content table .button{height:36px;padding:0 14px;font-size:var(--fs-13);border-radius:var(--r-md);min-width:0}
/* Akun saya › Wishlist */
.gk-suka-akun .gk-suka-akun-ket{margin:0 0 4px;font-size:var(--fs-14);color:var(--c-text-2)}
@media(min-width:1024px){.gk-akun .woocommerce-MyAccount-content .gk-grid{grid-template-columns:repeat(3,1fr);gap:16px}}
.gk-suka-akun .gk-kosong{padding:24px 0}

/* ---------- Poin Gadkey (inc/poin.php · mockup papan 15) ---------- */
.gk-poin-produk i,.gk-poin i,.gk-poin-dapat i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#B8901F;color:#fff;font:800 12px/1 var(--font-sans);font-style:normal}
.gk-poin-produk{display:flex;align-items:center;gap:10px;margin:10px 0 0;padding:10px 12px;border-radius:var(--r-md);background:var(--gk-krem-100);font-size:var(--fs-14)}
.gk-poin-produk span{display:flex;flex-wrap:wrap;gap:0 4px;align-items:baseline}
.gk-poin-produk small{flex-basis:100%;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-poin-produk [hidden]{display:none}
.gk-poin{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.gk-poin-pakai{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1.5px solid var(--c-border);border-radius:var(--r-lg);background:#fff;cursor:pointer}
.gk-poin-pakai.on{border-color:var(--c-primary);background:var(--c-selected-bg)}
.gk-poin-pakai>span:first-of-type{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.gk-poin-pakai b{font:700 var(--fs-14)/1.25 var(--font-sans)}
.gk-poin-pakai small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-poin-sw{position:relative;flex:none;display:inline-flex}
.gk-poin-sw input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.gk-poin-sw span[aria-hidden]{width:40px;height:24px;border-radius:999px;background:var(--c-border-strong);position:relative;transition:background var(--dur-1)}
.gk-poin-sw span[aria-hidden]::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left var(--dur-1)}
.gk-poin-sw input:checked+span{background:var(--c-primary)}
.gk-poin-sw input:checked+span::after{left:19px}
.gk-poin-sw input:focus-visible+span{outline:2px solid var(--c-primary);outline-offset:2px}
.gk-poin-pesan{margin:0;padding:8px 12px;border-radius:var(--r-md);background:var(--c-danger-bg);color:var(--c-danger);font-size:var(--fs-13)}
.gk-poin-pesan[hidden]{display:none}
.gk-poin-dapat{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--fs-13);color:var(--c-text-2)}
.gk-poin-dapat i{width:20px;height:20px;font-size:10px}
.gk-poin-dapat b{color:var(--c-text)}
.gk-poin-dapat.ajak{padding:8px 12px;border-radius:var(--r-md);background:var(--c-sale-bg,#FBEFE7);color:var(--c-sale-tx,#8A3F14)}
.gk-poin-dapat.ajak a{font-weight:700;color:inherit;text-decoration:underline}
.gk-poin-akun .gk-poin-kartu{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:600px){.gk-poin-akun .gk-poin-kartu{grid-template-columns:1fr 1fr}}
.gk-poin-kartu>div{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:var(--r-xl)}
.gk-poin-kartu .utama{background:var(--c-primary);color:#fff}
.gk-poin-kartu .segera{background:var(--gk-krem-100)}
.gk-poin-kartu b{font:800 28px/1.15 var(--font-sans)}
.gk-poin-kartu small{font-size:var(--fs-12);opacity:.85}
.gk-poin-cara{margin:14px 0;font-size:var(--fs-13);color:var(--c-text-2);line-height:1.55}
.gk-poin-akun h3{margin:18px 0 6px;font:700 var(--fs-16)/1.2 var(--font-sans)}
.gk-poin-riwayat{list-style:none;margin:0;padding:0}
.gk-poin-riwayat li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--c-border);font-size:var(--fs-14)}
.gk-poin-riwayat li span{display:flex;flex-direction:column;gap:2px}
.gk-poin-riwayat small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-poin-riwayat .plus b{color:var(--c-success,#1f7a3a)}
.gk-poin-riwayat .minus b{color:var(--c-text-2)}
.gk-poin-riwayat .tunggu b{color:var(--c-text-2)}
.gk-poin-riwayat .tunggu span::after{content:"menunggu";align-self:flex-start;margin-top:2px;padding:1px 6px;border-radius:4px;background:var(--gk-krem-100);font-size:10px;font-weight:700;color:var(--c-text-2)}
.gk-poin-kosong{color:var(--c-text-2);font-size:var(--fs-14)}

/* ---------- Akun saya baru (navigation.php + dashboard.php · mockup papan 16) ---------- */
@media(min-width:1024px){.gk-akun .woocommerce:has(>.woocommerce-MyAccount-navigation){grid-template-columns:290px minmax(0,1fr);gap:28px;align-items:start}}
.gk-akun .gk-akun-nav{display:flex;flex-direction:column;gap:14px}
.gk-akun-kembali{display:none;align-items:center;gap:6px;font:700 var(--fs-14)/1 var(--font-sans);color:var(--c-primary)}
.gk-akun-kembali .ic{width:16px;height:16px}
.gk-akun-profil{border-radius:var(--r-2xl,20px);background:var(--c-primary);color:#fff;overflow:hidden}
.gk-akun-profil .atas{display:flex;align-items:center;gap:12px;padding:18px 18px 14px}
.gk-akun-profil .av{flex:none;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%;background:var(--gk-emas-200);color:var(--c-primary);font:800 20px/1 var(--font-sans)}
.gk-akun-profil .id{display:flex;flex-direction:column;gap:2px;min-width:0}
.gk-akun-profil .id b{font:700 var(--fs-16)/1.2 var(--font-sans)}
.gk-akun-profil .id small{font-size:var(--fs-12);opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gk-akun-profil .stat{display:flex;border-top:1px solid rgba(255,255,255,.15)}
.gk-akun-profil .stat a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:11px 4px;color:#fff;text-decoration:none}
.gk-akun-profil .stat a+a{border-left:1px solid rgba(255,255,255,.12)}
.gk-akun-profil .stat a:hover{background:rgba(255,255,255,.06)}
.gk-akun-profil .stat b{font:800 var(--fs-18,18px)/1.1 var(--font-sans)}
.gk-akun-profil .stat a.emas b{color:var(--gk-emas-200)}
.gk-akun-profil .stat small{font-size:11px;opacity:.75}
.gk-akun-menu{padding:8px;border:1px solid var(--c-border);border-radius:var(--r-2xl,20px);background:#fff}
.gk-akun-menu .judul{display:block;padding:10px 10px 4px;font:700 10px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--c-text-2)}
.gk-akun .gk-akun-nav ul{display:flex;flex-direction:column;gap:2px;margin:0 0 4px;padding:0;overflow:visible;list-style:none}
.gk-akun .gk-akun-nav li a,.gk-akun-menu .keluar{display:flex;align-items:center;gap:10px;width:100%;height:44px;padding:0 10px;border:0;border-radius:var(--r-md);background:none;font:600 var(--fs-14)/1 var(--font-sans);color:var(--c-text);white-space:nowrap;text-decoration:none}
.gk-akun .gk-akun-nav li a .ic{flex:none;width:19px;height:19px;color:var(--c-text-2)}
.gk-akun .gk-akun-nav li a span{flex:1}
.gk-akun .gk-akun-nav li a small{font-size:11px;font-weight:700;color:var(--c-text-2)}
.gk-akun .gk-akun-nav li a .ic.r{width:16px;height:16px;opacity:.5}
.gk-akun .gk-akun-nav li a:hover{background:var(--gk-krem-100)}
.gk-akun .gk-akun-nav li.is-active a{background:var(--c-selected-bg);color:var(--c-primary)}
.gk-akun .gk-akun-nav li.is-active a .ic{color:var(--c-primary)}
.gk-akun .gk-akun-nav li.woocommerce-MyAccount-navigation-link--customer-logout{margin:0;padding:0;border:0}
.gk-akun-menu .keluar{margin-top:4px;border-top:1px solid var(--c-border);border-radius:0 0 var(--r-md) var(--r-md);color:var(--c-danger)}
.gk-akun-menu .keluar .ic{width:19px;height:19px}
@media(min-width:1024px){.gk-akun .gk-akun-nav li a .ic.r{display:none}}
/* HP: menu hanya di Ringkasan; halaman lain cukup tautan kembali */
@media(max-width:1023px){
	.gk-akun .gk-akun-nav.di-sub .gk-akun-profil,.gk-akun .gk-akun-nav.di-sub .gk-akun-menu{display:none}
	.gk-akun .gk-akun-nav.di-sub .gk-akun-kembali{display:inline-flex;margin-bottom:4px}
	.gk-akun .gk-akun-nav.di-ringkas{margin-bottom:16px}
	.gk-akun .gk-akun-nav.di-ringkas li.is-active a{background:none;color:var(--c-text)}
}
/* Judul halaman di atas isi */
.gk-akun-h{margin-bottom:16px}
.gk-akun-h h2{margin:0;font:800 var(--fs-28,28px)/1.15 var(--font-sans);color:var(--c-primary)}
.gk-akun-h p{margin:4px 0 0;font-size:var(--fs-14);color:var(--c-text-2)}
/* Ringkasan */
.gk-ringkas{display:grid;gap:14px}
@media(min-width:768px){.gk-ringkas{grid-template-columns:1fr 1fr}.gk-rk-device,.gk-rk-pintas{grid-column:1/-1}}
.gk-rk-kartu{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border:1px solid var(--c-border);border-radius:var(--r-xl);background:#fff}
.gk-rk-kartu .label{font:700 11px/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--c-text-2)}
.gk-rk-kartu .besar{font:800 var(--fs-18,18px)/1.25 var(--font-sans)}
.gk-rk-kartu small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-rk-kartu .gk-link{margin-top:auto;padding-top:4px}
.gk-rk-status{align-self:flex-start;padding:3px 10px;border-radius:999px;font:700 var(--fs-12)/1.3 var(--font-sans)}
.gk-rk-status.hijau{background:#E8F3EA;color:#1f7a3a}
.gk-rk-status.biru{background:#E6EFF8;color:#1E4E8C}
.gk-rk-status.kuning{background:var(--c-warning-bg);color:var(--c-warning)}
.gk-rk-status.abu{background:var(--gk-krem-100);color:var(--c-text-2)}
.gk-rk-voucher ul{list-style:none;margin:2px 0 4px;padding:0;display:flex;flex-direction:column;gap:8px}
.gk-rk-voucher li{display:flex;border:1px solid var(--c-border);border-radius:12px;overflow:hidden}
.gk-rk-voucher .tiket{flex:none;width:68px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px 4px;background:var(--c-primary);color:#fff;border-right:2px dashed #fff}
.gk-rk-voucher .tiket b{font:800 var(--fs-15)/1.1 var(--font-sans)}
.gk-rk-voucher .tiket small{font:700 9px/1 var(--font-sans);letter-spacing:.06em;color:#fff}
.gk-rk-voucher .isi{display:flex;flex-direction:column;gap:2px;padding:8px 10px;min-width:0}
.gk-rk-voucher .isi b{font:700 var(--fs-13)/1.3 var(--font-sans)}
.gk-rk-device{flex-direction:row;align-items:center;gap:12px}
.gk-rk-device .ikon{flex:none;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:var(--gk-krem-100);color:var(--c-primary)}
.gk-rk-device .ikon .ic{width:22px;height:22px}
.gk-rk-device .isi{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.gk-rk-device .isi b{font:700 var(--fs-14)/1.3 var(--font-sans)}
.gk-rk-device .gk-link{margin:0;padding:0;white-space:nowrap}
@media(max-width:600px){.gk-rk-device{flex-wrap:wrap}.gk-rk-device .gk-link{flex-basis:100%;padding-left:54px}}
.gk-rk-pintas{display:grid;gap:12px}
@media(min-width:600px){.gk-rk-pintas{grid-template-columns:1fr 1fr}}
.gk-rk-pintas a{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:14px 16px;border:1px solid var(--c-border);border-radius:var(--r-xl);background:#fff;color:var(--c-text);text-decoration:none}
.gk-rk-pintas a .ic{grid-row:1/3;width:22px;height:22px;color:var(--c-primary)}
.gk-rk-pintas a b{font:700 var(--fs-14)/1.3 var(--font-sans)}
.gk-rk-pintas a small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-rk-pintas a:hover{border-color:var(--c-primary)}
/* Pesanan saya: status berwarna; di HP tabel jadi kartu per pesanan */
.gk-akun .woocommerce-orders-table__cell-order-status{font-weight:700}
.gk-akun .woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status{color:#1f7a3a}
.gk-akun .woocommerce-orders-table__row--status-processing .woocommerce-orders-table__cell-order-status{color:#1E4E8C}
.gk-akun .woocommerce-orders-table__row--status-on-hold .woocommerce-orders-table__cell-order-status,.gk-akun .woocommerce-orders-table__row--status-pending .woocommerce-orders-table__cell-order-status{color:var(--c-warning)}
.gk-akun .woocommerce-orders-table__row--status-cancelled .woocommerce-orders-table__cell-order-status,.gk-akun .woocommerce-orders-table__row--status-failed .woocommerce-orders-table__cell-order-status{color:var(--c-text-2)}
@media(max-width:767px){
	.gk-akun .woocommerce-orders-table thead{display:none}
	.gk-akun .woocommerce-orders-table,.gk-akun .woocommerce-orders-table tbody{display:block}
	.gk-akun .woocommerce-orders-table tr{display:grid;grid-template-columns:1fr auto;gap:4px 12px;margin-bottom:10px;padding:12px 14px;border:1px solid var(--c-border);border-radius:var(--r-lg)}
	.gk-akun .woocommerce-orders-table td,.gk-akun .woocommerce-orders-table th{display:block;padding:0;border:0;text-align:left}
	.gk-akun .woocommerce-orders-table__cell-order-number{font-weight:800}
	.gk-akun .woocommerce-orders-table__cell-order-status{grid-column:2;grid-row:1;text-align:right}
	.gk-akun .woocommerce-orders-table__cell-order-date,.gk-akun .woocommerce-orders-table__cell-order-total{grid-column:1/-1;font-size:var(--fs-13);color:var(--c-text-2)}
	.gk-akun .woocommerce-orders-table__cell-order-actions{grid-column:1/-1;margin-top:6px}
	.gk-akun .woocommerce-orders-table__cell-order-actions .button{width:100%;justify-content:center}
}
/* Ringkasan: kartu pesanan selebar penuh bila tidak ada voucher */
@media(min-width:768px){.gk-rk-kartu.lebar{grid-column:1/-1}}
/* Avatar: foto menutup huruf; huruf tampil bila foto tidak ada / gagal dimuat */
.gk-akun-profil .av,.gk-foto-ganti .av{position:relative;overflow:hidden}
.gk-akun-profil .av img,.gk-foto-ganti .av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}
/* Profil saya: ganti foto */
.gk-foto-ganti{display:flex;align-items:center;gap:16px;margin-bottom:18px;padding:14px 16px;border:1px solid var(--c-border);border-radius:var(--r-xl)}
.gk-foto-ganti .av{flex:none;display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--c-primary);color:var(--gk-emas-200);font:800 28px/1 var(--font-sans)}
.gk-foto-ganti .isi{display:flex;flex-direction:column;gap:4px;min-width:0}
.gk-foto-ganti .isi b{font:700 var(--fs-15)/1.2 var(--font-sans)}
.gk-foto-ganti .isi small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-foto-ganti .aksi{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:4px}
.gk-foto-ganti .aksi .gk-btn{cursor:pointer}
.gk-akun .gk-foto-ganti label.hapus{display:inline-flex;align-items:center;gap:6px;margin:0;font:500 var(--fs-13)/1 var(--font-sans);color:var(--c-danger)}
.gk-foto-ganti .pesan{color:var(--c-danger)}
.gk-foto-ganti .pesan.ok{color:var(--c-success,#1f7a3a)}
.gk-foto-ganti .pesan[hidden]{display:none}
/* Akun saya tanpa Ringkasan: di HP halaman utama akun hanya kartu profil + menu */
@media(max-width:1023px){.gk-akun .woocommerce:has(.gk-akun-nav.di-ringkas)>.woocommerce-MyAccount-content{display:none}}

/* Checkout: pesan error selebar penuh di atas (tidak menggeser susunan 2 kolom) + kolom salah merah */
.gk-co-lay>.woocommerce-NoticeGroup,.gk-co-lay>.woocommerce-error,.gk-co-lay>.woocommerce-message,.gk-co-lay>.woocommerce-info{grid-column:1/-1}
.gk-co-lay .woocommerce-NoticeGroup .woocommerce-error{margin:0 0 4px}
.woocommerce-checkout .form-row.woocommerce-invalid input.input-text,.woocommerce-checkout .form-row.woocommerce-invalid select,.woocommerce-checkout .form-row.woocommerce-invalid .select2-selection{border-color:var(--c-danger)!important;background:var(--c-danger-bg)}
.woocommerce-checkout .form-row.woocommerce-invalid label{color:var(--c-danger)}

/* Halaman bayar Midtrans */
.gk-bayar-hal{max-width:460px;margin:24px auto 48px;padding:28px 24px;border:1px solid var(--c-border);border-radius:var(--r-2xl,20px);background:#fff;text-align:center}
.gk-bayar-hal .ikon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--c-selected-bg);color:var(--c-primary)}
.gk-bayar-hal .ikon .ic{width:24px;height:24px}
.gk-bayar-hal h1{margin:12px 0 6px;font:800 var(--fs-24,24px)/1.2 var(--font-sans);color:var(--c-primary)}
.gk-bayar-hal .sub{margin:0 0 18px;font-size:var(--fs-14);color:var(--c-text-2);line-height:1.5}
.gk-bayar-ring{margin:0 0 18px;padding:14px 16px;border-radius:var(--r-lg);background:var(--gk-krem-100);text-align:left}
.gk-bayar-ring div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:var(--fs-14)}
.gk-bayar-ring dt{color:var(--c-text-2)}
.gk-bayar-ring dd{margin:0;font-weight:700}
.gk-bayar-ring .tot{margin-top:4px;padding-top:10px;border-top:1px solid var(--c-border)}
.gk-bayar-ring .tot dd{font:800 var(--fs-20,20px)/1.2 var(--font-sans);color:var(--c-primary)}
.gk-bayar-aksi>div{text-align:center!important}
.gk-bayar-aksi #pay-button,.gk-bayar-aksi #payment-instruction-btn{display:flex;align-items:center;justify-content:center;width:100%;height:var(--btn-h);border-radius:var(--r-lg);background:var(--c-primary);color:#fff;font:var(--t-btn);text-decoration:none;cursor:pointer;border:0}
.gk-bayar-aksi #payment-instruction-btn{background:#fff;color:var(--c-primary);border:1.5px solid var(--c-primary)}
.gk-bayar-aksi #payment-instruction p{font-size:var(--fs-13);color:var(--c-text-2);line-height:1.5}
.gk-bayar-aksi #payment-instruction br{display:none}
.gk-bayar-hal .bantu{margin:16px 0 0;font-size:var(--fs-13);color:var(--c-text-2)}
.gk-bayar-hal .bantu a{font-weight:700;color:var(--c-primary)}
.gk-bayar-hal .aman{display:flex;align-items:center;justify-content:center;gap:6px;margin:10px 0 0;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-bayar-hal .aman .ic{width:14px;height:14px}
.woocommerce-checkout .checkout-inline-error-message{margin:6px 0 0;font-size:var(--fs-12);font-weight:600;color:var(--c-danger)}
/* Pesanan saya: tombol aksi dibedakan (Bayar utama, Lihat garis, Batal tautan merah) — masukan owner 7 Okt 2026 */
.gk-akun .woocommerce-orders-table__cell-order-actions{white-space:nowrap}
.gk-akun .woocommerce-orders-table__cell-order-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px}
.gk-akun .woocommerce-orders-table__cell-order-actions .button{margin:0}
.gk-akun .woocommerce-orders-table__cell-order-actions .button.view{background:#fff;color:var(--c-primary);border:1.5px solid var(--c-primary)}
.gk-akun .woocommerce-orders-table__cell-order-actions .button.view:hover{background:var(--c-selected-bg)}
.gk-akun .woocommerce-orders-table__cell-order-actions .button.cancel{height:auto;min-width:0;padding:4px 2px;background:none;border:0;color:var(--c-danger);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media(min-width:768px){.gk-akun .woocommerce-orders-table th.woocommerce-orders-table__header-order-actions,.gk-akun .woocommerce-orders-table__cell-order-actions{min-width:220px}}
@media(max-width:767px){
	.gk-akun .woocommerce-orders-table__cell-order-actions{display:flex!important}
	.gk-akun .woocommerce-orders-table__cell-order-actions .button.pay,.gk-akun .woocommerce-orders-table__cell-order-actions .button.view{flex:1;width:auto}
	.gk-akun .woocommerce-orders-table__cell-order-actions .button.cancel{flex-basis:100%;text-align:center}
}
/* Batal = tombol garis merah (masukan owner); sel aksi tetap table-cell agar garis baris sejajar */
@media(min-width:768px){
	.gk-akun .woocommerce-orders-table__cell-order-actions{display:table-cell;vertical-align:middle}
	.gk-akun .woocommerce-orders-table__cell-order-actions .button{display:inline-flex;vertical-align:middle;margin:3px 8px 3px 0}
}
.gk-akun .woocommerce-orders-table__cell-order-actions .button.cancel{height:var(--btn-h-sm);padding:0 14px;background:#fff;border:1.5px solid var(--c-danger);border-radius:var(--r-md);color:var(--c-danger);font-weight:700;text-decoration:none}
.gk-akun .woocommerce-orders-table__cell-order-actions .button.cancel:hover{background:var(--c-danger-bg)}
@media(max-width:767px){.gk-akun .woocommerce-orders-table__cell-order-actions .button.cancel{flex:1;flex-basis:100%;display:inline-flex;justify-content:center}}

/* ---------- Detail pesanan (myaccount/view-order.php) ---------- */
.gk-btn.merah{background:#fff;color:var(--c-danger);border-color:var(--c-danger)}
.gk-btn.merah:hover{background:var(--c-danger-bg)}
.gk-pesanan{display:flex;flex-direction:column;gap:14px}
.gk-ps-status,.gk-ps-kartu{padding:16px 18px;border:1px solid var(--c-border);border-radius:var(--r-xl);background:#fff}
.gk-ps-status .atas{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.gk-ps-status .tgl{font-size:var(--fs-13);color:var(--c-text-2)}
.gk-ps-langkah{display:grid;grid-template-columns:repeat(4,1fr);margin:16px 0 4px;padding:0;list-style:none;counter-reset:none}
.gk-ps-langkah li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-ps-langkah li::before{content:"";position:absolute;top:13px;left:-50%;width:100%;height:2px;background:var(--c-border);z-index:0}
.gk-ps-langkah li:first-child::before{display:none}
.gk-ps-langkah li.lewat::before,.gk-ps-langkah li.kini::before{background:var(--c-primary)}
.gk-ps-langkah i{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#fff;border:2px solid var(--c-border);font:700 12px/1 var(--font-sans);font-style:normal;color:var(--c-text-2)}
.gk-ps-langkah li.lewat i{background:var(--c-primary);border-color:var(--c-primary);color:#fff}
.gk-ps-langkah li.lewat i .ic{width:14px;height:14px}
.gk-ps-langkah li.kini i{border-color:var(--c-primary);color:var(--c-primary)}
.gk-ps-langkah li.lewat span,.gk-ps-langkah li.kini span{color:var(--c-text);font-weight:600}
.gk-ps-status .pesan{margin:12px 0 0;padding:10px 12px;border-radius:var(--r-md);background:var(--gk-krem-100);font-size:var(--fs-13);line-height:1.5}
.gk-ps-status .pesan.batal{background:var(--c-danger-bg);color:var(--c-danger)}
.gk-ps-aksi{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.gk-ps-aksi:empty{display:none}
.gk-ps-aksi .gk-btn .ic{width:16px;height:16px}
.gk-ps-kartu h3{margin:0 0 10px;font:700 var(--fs-15)/1.2 var(--font-sans)}
.gk-ps-item{list-style:none;margin:0;padding:0}
.gk-ps-item li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--c-border)}
.gk-ps-item li:first-child{padding-top:0}
.gk-ps-item img,.gk-ps-item .foto-kosong{flex:none;width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--gk-krem-100);border:1px solid var(--c-border)}
.gk-ps-item .isi{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.gk-ps-item .nm{font:600 var(--fs-14)/1.35 var(--font-sans);color:var(--c-text);text-decoration:none}
.gk-ps-item small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-ps-item b{flex:none;font:700 var(--fs-14)/1.2 var(--font-sans)}
.gk-ps-ring{margin-top:12px;border:0;padding:0}
.gk-ps-ring .hemat{color:var(--c-success,#1f7a3a)}
.gk-ps-info{display:grid;gap:14px}
@media(min-width:768px){.gk-ps-info{grid-template-columns:1fr 1fr}}
.gk-ps-info address{font-style:normal;font-size:var(--fs-14);line-height:1.6}
.gk-ps-info small{display:block;margin-top:4px;font-size:var(--fs-13);color:var(--c-text-2)}
.gk-ps-info small.catatan{margin-top:8px;color:var(--c-text)}
.gk-ps-info p{margin:0;font-size:var(--fs-14);font-weight:600}
.gk-ps-info .poin{display:flex;align-items:center;gap:8px;margin-top:10px;font-weight:500;font-size:var(--fs-13)}
.gk-ps-info .poin i{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:#B8901F;color:#fff;font:800 11px/1 var(--font-sans);font-style:normal}
.gk-ps-catatan{list-style:none;margin:0;padding:0}
.gk-ps-catatan li{padding:8px 0;border-bottom:1px solid var(--c-border);font-size:var(--fs-14)}
.gk-ps-catatan li p{margin:2px 0 0}
.gk-ps-catatan small{font-size:var(--fs-12);color:var(--c-text-2)}
.gk-ps-aksi .gk-btn{text-decoration:none}
.gk-ps-aksi .gk-btn:not(.garis):not(.merah),.gk-ps-aksi .gk-btn:not(.garis):not(.merah):hover{color:#fff}
@media(max-width:1023px){.gk-bayar-ulang .co-bar{position:fixed;left:0;right:0;bottom:0;margin:0}.gk-bayar-ulang{padding-bottom:84px}}
/* Selesaikan pembayaran: produk ringkas + batas bayar */
.gk-bayar-produk{display:flex;align-items:center;gap:12px;margin:0 0 10px;padding:12px 14px;border:1px solid var(--c-border);border-radius:var(--r-lg);text-align:left}
.gk-bayar-produk .foto{flex:none;display:flex}
.gk-bayar-produk .foto img{width:44px;height:44px;border-radius:10px;object-fit:cover;border:2px solid #fff;background:var(--gk-krem-100);box-shadow:0 0 0 1px var(--c-border)}
.gk-bayar-produk .foto img+img{margin-left:-14px}
.gk-bayar-produk .nama{min-width:0;display:flex;flex-direction:column;gap:2px;font-size:var(--fs-13);color:var(--c-text-2);overflow:hidden}
.gk-bayar-produk .nama b{font-size:var(--fs-14);color:var(--c-text)}
.gk-bayar-hal .batas{display:flex;align-items:flex-start;justify-content:center;gap:6px;margin:12px 0 0;padding:8px 12px;border-radius:var(--r-md);background:var(--c-warning-bg);color:var(--c-warning);font-size:var(--fs-12);line-height:1.5;text-align:left}
.gk-bayar-hal .batas .ic{flex:none;width:14px;height:14px;margin-top:2px}
/* "Bayar nanti" menggantikan tautan kecil "Lihat pesanan" (owner 8 Okt 2026): tombol sekunder di bawah tombol bayar */
.gk-bayar-hal .gk-bayar-nanti{display:flex;width:100%;justify-content:center;margin-top:10px}
.gk-bayar-hal .nanti-ket{margin:8px 0 0;font-size:var(--fs-12);color:var(--c-text-2);line-height:1.5}
.gk-bayar-produk .nama .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Bayar pesanan (form-pay.php): tombol bayar di dalam aside → desktop ringkasan + tombol menempel bersama (sticky);
   HP: aside "display:contents" sehingga urutan = ringkasan → pilihan pembayaran → tombol (masukan owner 7 Okt 2026) */
@media(min-width:1024px){
	.gk-bayar-ulang .gk-co-side>.gk-co-sec{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:0;padding-bottom:4px;margin-bottom:0}
	.gk-bayar-ulang .gk-bayar-tombol>.gk-co-sec{border-top-left-radius:0;border-top-right-radius:0;border-top:0;padding-top:4px}
}
@media(max-width:1023px){
	.gk-bayar-ulang{display:flex;flex-direction:column}
	.gk-bayar-ulang>.gk-co-side{display:contents}
	.gk-bayar-ulang .gk-co-side>.gk-co-sec{order:-1}
	.gk-bayar-ulang .gk-bayar-tombol{order:2}
}

/* Menu HP: Promo/kampanye di atas, bagian lipat (Jenis produk, Brand, Bantuan) — owner 8 Okt 2026 */
.gk-dpintas{margin-top:12px}
.gk-dpintas .gk-drow:last-child{border-bottom:0}
.gk-dlipat{margin-top:18px;border-top:1px solid var(--gk-abu-100)}
.gk-dlipat+.gk-dlipat{margin-top:0;border-top:0}
.gk-dlipat summary{display:flex;align-items:center;min-height:52px;border-bottom:1px solid var(--gk-abu-100);font:700 var(--fs-15,15px)/1.2 var(--font-sans);color:var(--c-text);cursor:pointer;list-style:none}
.gk-dlipat summary::-webkit-details-marker{display:none}
.gk-dlipat summary .ic.r{margin-left:auto;width:18px;height:18px;color:var(--c-text-2);transition:transform .2s}
.gk-dlipat[open] summary .ic.r{transform:rotate(180deg)}
.gk-dlipat[open]>summary{border-bottom-color:transparent}
.gk-dlipat>.gk-dgrp:first-of-type{margin-top:4px}
.gk-dlipat>.m-brand{padding:4px 0 14px}
.gk-dlipat[open]{padding-bottom:6px;border-bottom:1px solid var(--gk-abu-100)}

/* Banner campaign di atas pilihan device (HP saja; desktop tetap berdampingan) — owner 8 Okt 2026 */
@media(max-width:1023px){
  .b-hero.banner-atas{display:flex;flex-direction:column}
  .b-hero.banner-atas .b-banner{order:-1;padding-top:16px!important}
}
/* Titik banner bisa diketuk: area sentuh diperbesar tanpa mengubah ukuran titik */
#gk-dots i{position:relative;cursor:pointer;transition:width var(--dur-2,.2s)}
#gk-dots i::after{content:"";position:absolute;inset:-10px -4px}

/* "Kenapa belanja di Gadkey?" (pengganti blok 2006) — owner 8 Okt 2026 */
.gk-kenapa h2{margin-top:0;font-size:var(--fs-24)}
@media(max-width:599px){
  .gk-kenapa .al{gap:0}
  .gk-kenapa .al div{padding:14px 0;border:0;border-top:1px solid rgba(229,209,150,.16);border-radius:0;background:none}
  .gk-kenapa .al .ic{width:24px;height:24px;margin-top:1px}
}
@media(min-width:600px) and (max-width:1023px){.gk-kenapa .al{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.gk-kenapa .in{grid-template-columns:420px 1fr;align-items:center}.gk-kenapa h2{font-size:32px;line-height:1.15}}

/* Kartu jaminan halaman produk: 1 kartu, 3 baris ringkas (owner 8 Okt 2026) */
.gk-jamin{gap:0;border:1px solid var(--c-border);border-radius:var(--r-lg);overflow:hidden}
.gk-jamin>div{border:0;border-radius:0;padding:11px 14px;align-items:flex-start}
.gk-jamin>div+div{border-top:1px solid var(--c-border)}
.gk-jamin .ori{border-color:var(--c-border)}
.gk-jamin .kirim{align-items:center}
.gk-jamin>div:not(.kirim) .ic{width:22px;height:22px;margin:0 2px;color:var(--gk-hijau-600)}
.gk-jamin>div:not(.kirim) b,.gk-jamin>div:not(.kirim) p{display:inline;margin:0}
.gk-jamin>div:not(.kirim) p::before{content:" · "}
.gk-jamin>div:not(.kirim) span{line-height:1.45;font-size:var(--fs-12)}

/* Halaman produk: hemat & poin jadi baris ringan, bukan kotak (owner 8 Okt 2026) — pilihan varian naik ±120px */
.gk-p-promo{margin-top:6px;padding:0;background:none;gap:4px 8px}
.gk-p-promo b{font-size:var(--fs-14);color:var(--c-sale)}
.gk-p-promo .ak{margin:0}
.gk-poin-produk{margin-top:6px;padding:0;background:none;gap:8px;font-size:var(--fs-13)}
.gk-poin-produk i{width:20px;height:20px;font-size:11px}
.gk-poin-produk span{gap:0 6px}
.gk-poin-produk small{flex-basis:auto;font-size:var(--fs-12)}
.gk-poin-produk small::before{content:"· "}

/* Baris poin: teks mengalir biasa (tanpa jarak flex antar kata) */
.gk-poin-produk>span{display:block}
.gk-poin-produk small{display:inline;color:var(--c-text-2)}
/* Baris kirim di kartu jaminan: tidak berlatar hijau (tidak tertukar dengan kotak "Cocok"), cukup judul hijau tebal */
.gk-jamin .kirim{background:none}
.gk-jamin .kirim .ic{color:var(--c-primary)}

/* Galeri produk (owner 8 Okt 2026): desktop — foto utama tidak ikut memanjang, kolom thumbnail setinggi foto & bisa digulir;
   HP — strip thumbnail kecil di bawah foto (menggantikan titik) */
@media(min-width:1024px){
  .gk-p-kiri{align-items:start}
  .gk-p-kiri>.gk-thumbs{height:0;min-height:100%;overflow-y:auto;scrollbar-width:thin;padding-right:2px}
}
@media(max-width:1023px){
  .gk-p-kiri{display:flex;flex-direction:column}
  .gk-p-kiri>.gk-thumbs{order:2;display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .gk-p-kiri>.gk-thumbs::-webkit-scrollbar{display:none}
  .gk-p-kiri>.gk-thumbs button{flex:none}
  .gk-p-kiri>.gk-thumbs button img{width:60px;height:60px}
}
.gk-p-kiri>.gk-thumbs~.gk-galeri .gk-dots{display:none}
.gk-cocok .gk-link{padding:0;border:0;background:none;font:inherit;font-weight:700;text-decoration:underline;cursor:pointer;color:inherit}

.gk-poin-produk span span{display:inline}

/* Harga berbeda per varian (owner 8 Okt 2026): rentang di halaman produk */
.gk-harga.rentang{font-size:clamp(22px,6.2vw,30px)}

/* Tautan kebijakan di bawah kartu jaminan (pengganti tab Pengiriman & Garansi) */
.gk-jamin-lanjut{margin:8px 2px 0;font-size:var(--fs-12);color:var(--c-text-2)}
.gk-jamin-lanjut a{color:var(--c-link);font-weight:600;text-decoration:underline;text-underline-offset:2px}

/* Baris stok & SKU di bawah harga */
.p-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:6px}
.p-meta .gk-stok{margin-left:0;vertical-align:baseline}
.p-sku{font-size:var(--fs-12);color:var(--c-text-2)}
.p-sku b{font-weight:600;color:var(--c-text);letter-spacing:.02em}
.p-sku[hidden]{display:none}