/* =====================================================================
   BangKurir — gaya halaman toko penjual (sisi pembeli)
   ===================================================================== */

/* gambar menu yang sudah diisi penjual */
.mitem .thumb{background-size:cover;background-position:center}
.mitem .thumb.adafoto{color:transparent}

/* tanda favorit dari penjual */
.mitem .favmark{display:inline-block;font-size:11px;font-weight:800;color:#8A5A00;background:#FFF4D6;
  border-radius:999px;padding:2px 9px;margin-bottom:5px;letter-spacing:.2px}
.mitem.favorit{border-color:#F2DDA8;box-shadow:0 8px 22px rgba(138,90,0,.08)}

/* menu habis: tetap tampil, tapi tidak bisa dipesan */
.mitem.off .thumb{filter:grayscale(1);opacity:.55}
.mitem.off b{color:#6C7A76}
.mitem.off .price{color:#8FA39C;text-decoration:line-through}
.mitem.off .addbtn{background:#EDF2F0;color:#9BAEA8;box-shadow:none;cursor:not-allowed}
.mitem.off .sub{color:#9A2B1E;font-weight:700}

/* pil status buka/tutup */
.open-pill.tutup{background:#FDECEA;color:#9A2B1E}
.open-pill.tutup .dotlive{background:#D64545;box-shadow:0 0 0 4px rgba(214,69,69,.16)}

/* spanduk toko tutup */
.spanduk-tutup{display:flex;flex-wrap:wrap;justify-content:center;text-align:center;gap:2px 8px;align-items:center;background:#FFF8F7;border:1px solid #F6E2DE;
  color:#A65B52;border-radius:11px;padding:7px 12px;margin:10px 0 2px;font-size:12px;line-height:1.5}
.spanduk-tutup b{font-size:12px;font-weight:600}
.spanduk-tutup b::first-letter{opacity:.85}
/* Cartbar tetap tampil saat tutup — teksnya diganti pesan tutup (jangan display:none) */
body.toko-tutup .mitem .addbtn{background:#EDF2F0;color:#9BAEA8;box-shadow:none;cursor:not-allowed}

/* --- kotak cari menu (muncul saat menu sudah banyak) --- */
.cari-menu{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid #DCE7E2;
  border-radius:14px;padding:0 6px 0 12px;min-height:44px;margin:2px 0 9px;color:#6B7C77}
.cari-menu input{flex:1;min-width:0;min-height:42px;border:0;outline:none;background:transparent;
  font-family:inherit;font-size:14.5px;color:#12312A}
.cari-menu input::placeholder{color:#93A69F}
.cari-menu button{flex:0 0 44px;min-width:44px;min-height:44px;border:0;border-radius:11px;background:#F1F5F4;
  color:#54656F;font-size:13px;font-weight:700;cursor:pointer}
.cari-kosong{text-align:center;color:#4A5A56;font-size:14px;background:#fff;border:1px dashed #CFE3D6;
  border-radius:16px;padding:18px 14px;margin:6px 0}

/* --- lencana menu paling laris (otomatis dari penjualan) --- */
.mitem .larismark{display:inline-block;font-size:11px;font-weight:800;color:#B42318;background:#FFE9E4;
  border-radius:999px;padding:2px 9px;margin:0 6px 5px 0;letter-spacing:.2px}

/* --- sampul & galeri toko (sisi pembeli) --- */
.toko-hias{margin:14px auto 0}
.hsampul img{width:100%;height:170px;object-fit:cover;border-radius:20px;display:block}
.hgaleri{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.hgaleri img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px;display:block}

/* --- tombol buka di Google Maps --- */
.mapslink{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:8px 0 2px;
  padding:10px 16px;border-radius:999px;border:1px solid #CFE3D6;background:#fff;color:#0B5B2E;
  font-size:13.5px;font-weight:700;text-decoration:none}
.mapslink:active{transform:translateY(1px)}

/* --- sampul ala Facebook: banner di kepala toko, logo bulat menimpa --- */
.shophero{position:relative}
.shophero.ada-sampul{padding-top:0}
.shopcover{width:100%;max-width:1440px;margin:0 auto;aspect-ratio:16/9;border-radius:0;overflow:hidden;position:relative;z-index:0;background:linear-gradient(135deg,#0B5B2E,#25D366)}
.shopcover img{display:block}
.shopcover img.sh-latar{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(16px) saturate(1.32);transform:scale(1.12);z-index:0;pointer-events:none}
.shopcover img.sh-foto{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;background:transparent}
@media (min-width:601px){ .shopcover{aspect-ratio:3/1} }

/* --- foto profil toko di atas, ala dashboard penjual --- */
.shophero .top{display:flex;flex-direction:column;align-items:center;text-align:center;gap:13px}
.shophero .top > div{min-width:0;width:100%}
.shophero .top .shoplogo{width:96px;height:96px;border-radius:50%;order:-1;font-size:38px;flex:0 0 auto}
.shophero .top .shoplogo.ada-foto{font-size:0;padding:0;overflow:hidden}
.shophero .top .shoplogo img{width:100%;height:100%;object-fit:cover;display:block}
.shophero h1{text-align:center}

.shophero .cta-wa{width:100%;max-width:380px;justify-content:center;margin-top:2px;min-height:46px}
.shophero .mapslink{min-height:46px}
/* cincin putih foto profil: SELALU tampil (dulu hanya saat ada sampul) */
.shophero .top .shoplogo{border:4px solid #fff;box-shadow:0 12px 28px rgba(0,0,0,.22);position:relative;z-index:2}
.shophero.ada-sampul .top .shoplogo{margin-top:-58px}
@media (max-width:600px){
  .shophero .top{display:flex;grid-template-columns:none}
  .shophero .top .shoplogo{width:88px;height:88px}
}

/* --- popup lihat foto besar --- */
.hgaleri img, .hsampul img, .shopcover img{cursor:zoom-in}
.fotopop{position:fixed;inset:0;background:rgba(7,20,14,.9);z-index:400;display:flex;
  align-items:center;justify-content:center;padding:18px;animation:fotopopMasuk .18s ease}
.fotopop img{max-width:100%;max-height:84vh;object-fit:contain;border-radius:18px;box-shadow:0 26px 70px rgba(0,0,0,.55)}   /* foto UTUH */
.fotopop-tutup{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;border-radius:50%;
  background:#fff;color:#0B3B24;font-size:19px;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.35)}
@keyframes fotopopMasuk{from{opacity:0}to{opacity:1}}

/* --- popup detail menu --- */
.menupop{flex-direction:column}
.menupop-foto{width:min(88vw,420px);height:min(62vh,380px);object-fit:contain;background:#0E1F1A;border-radius:18px 18px 0 0;display:block}   /* foto tampil UTUH (dulu cover = terpotong) */
.menupop-ikon{display:grid;place-items:center;font-size:66px;background:linear-gradient(135deg,#E7F6EE,#D3EFE1)}
.menupop-isi{width:min(88vw,420px);background:#fff;border-radius:0 0 18px 18px;padding:16px 18px;display:flex;flex-direction:column;gap:7px}
.menupop-isi b{font-family:var(--font-head);font-size:18px;color:#0B3B24;line-height:1.3}
.menupop-sub{font-size:13.5px;color:#4A5A56;line-height:1.55}
.menupop-harga{font-family:var(--font-head);font-weight:800;font-size:17px;color:#0B5B2E}
.menupop-tambah{margin-top:8px;width:100%;min-height:48px}
/* --- chip status rapi 2 baris --- */
.open-pill{align-items:flex-start;padding:9px 15px;border-radius:14px;gap:10px}
.open-pill .dotlive{margin-top:5px}
.open-pill .opill-teks{display:flex;flex-direction:column;gap:2px;line-height:1.35}
.open-pill .opill-teks b{font-size:13.5px;font-weight:800}
.open-pill .opill-teks small{font-size:11.5px;opacity:.88}


/* --- chip status: titik indikator di tengah atas, teks rata tengah --- */
.open-pill{flex-direction:column;align-items:center;gap:8px;text-align:center;padding:13px 18px}
.open-pill .dotlive{width:11px;height:11px}
.open-pill .opill-teks{align-items:center;text-align:center;gap:4px}
.open-pill .opill-teks b{width:100%;text-align:center}
.open-pill .opill-teks small{width:100%;text-align:center;white-space:normal}

/* ---------------- tema warna toko (fitur Premium) ---------------- */

/* lapisan kaya untuk semua tema Premium: pola + cahaya + gradasi */
/* Tema HANYA di sampul — area nama/kategori/info di bawahnya tetap netral */
body[data-tema] .shophero .shopcover{
  background-image:
    var(--pola, none),
    radial-gradient(circle at 84% -18%, rgba(255,255,255,.20) 0 20%, transparent 21%),
    var(--grad, linear-gradient(135deg, var(--wa-teal) 0%, var(--wa-green-dark) 62%, var(--wa-green) 130%));
  background-size: var(--pola-size, auto), auto, auto;
}
body[data-tema] .shophero{background:transparent}
body[data-tema] .open-pill{
  background:rgba(255,255,255,.17); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.30); box-shadow:0 10px 26px rgba(0,0,0,.16);
}
body[data-tema] .shophero .top .shoplogo{box-shadow:0 16px 34px rgba(0,0,0,.26)}
body[data-tema] .shopcover{filter:saturate(1.08) contrast(1.03)}

body[data-tema="hijau_pastel"]{--wa-green:#2E7D32;--wa-green-dark:#1B5E20;--wa-teal:#2E7D32;--wa-bubble:#F0F7ED;--bg:#EFF7EC;--text:#172117;--sub:#667766;
  --grad:linear-gradient(135deg,#2E7D32,#1B5E20);--pola:none}

body[data-tema="langit_cerah"]{--wa-green:#0369A1;--wa-green-dark:#075985;--wa-teal:#0369A1;--wa-bubble:#D9EAF7;--bg:#E8F3FB;--text:#0F172A;--sub:#5B7083;
  --grad:linear-gradient(135deg,#0369A1,#075985);--pola:none}

body[data-tema="sakura"]{--wa-green:#DB2777;--wa-green-dark:#BE185D;--wa-teal:#DB2777;--wa-bubble:#F7DEEA;--bg:#FDF2F7;--text:#23121C;--sub:#836074;
  --grad:linear-gradient(135deg,#DB2777,#BE185D);--pola:none}

body[data-tema="senja"]{--wa-green:#EA580C;--wa-green-dark:#C2410C;--wa-teal:#EA580C;--wa-bubble:#F8E4CE;--bg:#FFF4EA;--text:#2A1608;--sub:#8A6A50;
  --grad:linear-gradient(135deg,#EA580C,#C2410C);--pola:none}

body[data-tema="toska_segar"]{--wa-green:#0F766E;--wa-green-dark:#0D5D56;--wa-teal:#0F766E;--wa-bubble:#D2EEE6;--bg:#EAF9F5;--text:#0E201D;--sub:#53756F;
  --grad:linear-gradient(135deg,#0F766E,#0D5D56);--pola:none}

body[data-tema="lavender"]{--wa-green:#6D28D9;--wa-green-dark:#5B21B6;--wa-teal:#6D28D9;--wa-bubble:#E4DDF6;--bg:#F4F1FB;--text:#191228;--sub:#6B6187;
  --grad:linear-gradient(135deg,#6D28D9,#5B21B6);--pola:none}

body[data-tema="krem_klasik"]{--wa-green:#075E54;--wa-green-dark:#0B5B2E;--wa-teal:#075E54;--wa-bubble:#F0F2F5;--bg:#ECE5DD;--text:#1A2E26;--sub:#63786E;
  --grad:linear-gradient(135deg,#075E54,#0B5B2E);--pola:none}

body[data-tema="beige_pastel"]{--wa-green:#25D366;--wa-green-dark:#128C7E;--wa-teal:#25D366;--wa-bubble:#D8FDD2;--bg:#F5F2EB;--text:#111111;--sub:#667781;
  --grad:linear-gradient(135deg,#25D366,#128C7E);--pola:none}

body[data-tema="abu_sejuk"]{--wa-green:#229ED9;--wa-green-dark:#1A7FB5;--wa-teal:#229ED9;--wa-bubble:#E7EBF0;--bg:#F4F4F5;--text:#1A1A1A;--sub:#6B7280;
  --grad:linear-gradient(135deg,#229ED9,#1A7FB5);--pola:none}

body[data-tema="green_light"]{--wa-green:#2E7D32;--wa-green-dark:#1B5E20;--wa-teal:#2E7D32;--wa-bubble:#F0F5EC;--bg:#C5D189;--text:#172117;--sub:#667766;
  --grad:linear-gradient(135deg,#8DB883,#2E7D32);--pola:none}

body[data-tema="merah"]{--wa-green:#DC2626;--wa-green-dark:#B91C1C;--wa-teal:#DC2626;--wa-bubble:#FDE8E8;--bg:#F5F2EB;--text:#111111;--sub:#667781;
  --grad:linear-gradient(135deg,#DC2626,#B91C1C);--pola:none}

body[data-tema="madu"]{--wa-green:#B45309;--wa-green-dark:#92400E;--wa-teal:#B45309;--wa-bubble:#F5E9C8;--bg:#FFF8E7;--text:#1F1503;--sub:#857248;
  --grad:linear-gradient(135deg,#B45309,#92400E);--pola:none}

body[data-tema="kopi_susu"]{--wa-green:#7C4A21;--wa-green-dark:#5C3A1E;--wa-teal:#7C4A21;--wa-bubble:#EDE0D3;--bg:#FAF6F1;--text:#1F150F;--sub:#85705E;
  --grad:linear-gradient(135deg,#7C4A21,#5C3A1E);--pola:none}

body[data-tema="mint_segar"]{--wa-green:#10B981;--wa-green-dark:#059669;--wa-teal:#10B981;--wa-bubble:#D1FAE5;--bg:#E6F7F0;--text:#0B2B22;--sub:#4B6B60;
  --grad:linear-gradient(135deg,#10B981,#059669);--pola:none}

body[data-tema="nilam"]{--wa-green:#1E3A8A;--wa-green-dark:#172554;--wa-teal:#1E3A8A;--wa-bubble:#DBEAFE;--bg:#E8EEF7;--text:#101A33;--sub:#4A5A7A;
  --grad:linear-gradient(135deg,#1E3A8A,#172554);--pola:none}

body[data-tema="terakota"]{--wa-green:#C2410C;--wa-green-dark:#7C2D12;--wa-teal:#C2410C;--wa-bubble:#FFE8DC;--bg:#FBF0EA;--text:#2E1206;--sub:#8A5A44;
  --grad:linear-gradient(135deg,#C2410C,#7C2D12);--pola:none}

body[data-tema="zaitun"]{--wa-green:#4D7C0F;--wa-green-dark:#365314;--wa-teal:#4D7C0F;--wa-bubble:#ECFCCB;--bg:#F1F3E8;--text:#1C2410;--sub:#5F6B47;
  --grad:linear-gradient(135deg,#4D7C0F,#365314);--pola:none}

body[data-tema="peach"]{--wa-green:#E11D48;--wa-green-dark:#E11D48;--wa-teal:#E11D48;--wa-bubble:#FFE4E6;--bg:#FFF1EC;--text:#33130A;--sub:#8E5A46;
  --grad:linear-gradient(135deg,#FB7185,#E11D48);--pola:none}

body[data-tema="anggur"]{--wa-green:#7C3AED;--wa-green-dark:#4C1D95;--wa-teal:#7C3AED;--wa-bubble:#EDE9FE;--bg:#F3EDF9;--text:#1E1030;--sub:#6B5B87;
  --grad:linear-gradient(135deg,#7C3AED,#4C1D95);--pola:none}

body[data-tema="pandan"]{--wa-green:#3F9142;--wa-green-dark:#2F7A32;--wa-teal:#3F9142;--wa-bubble:#DFF3D0;--bg:#EAF7E1;--text:#16260F;--sub:#55704B;
  --grad:linear-gradient(135deg,#6ABF4B,#2F7A32);--pola:none}

body[data-tema="batik"]{--wa-green:#3730A3;--wa-green-dark:#1E1B4B;--wa-teal:#3730A3;--wa-bubble:#E0E7FF;--bg:#E9EBF4;--text:#14152E;--sub:#4E5273;
  --grad:linear-gradient(135deg,#3730A3,#1E1B4B);--pola:none}

body[data-tema="sage"]{--wa-green:#6B7F63;--wa-green-dark:#4F6049;--wa-teal:#6B7F63;--wa-bubble:#E4EADF;--bg:#EFF2EE;--text:#1D231B;--sub:#5C6B57;
  --grad:linear-gradient(135deg,#7D9174,#4F6049);--pola:none}

body[data-tema="granit"]{--wa-green:#4B5563;--wa-green-dark:#374151;--wa-teal:#4B5563;--wa-bubble:#E5E7EB;--bg:#F2F3F5;--text:#171A1F;--sub:#5A626D;
  --grad:linear-gradient(135deg,#6B7280,#374151);--pola:none}

body[data-tema="mawar"]{--wa-green:#BE123C;--wa-green-dark:#9F1239;--wa-teal:#BE123C;--wa-bubble:#FFE4E6;--bg:#FDEDF1;--text:#2E0A14;--sub:#8A4B5E;
  --grad:linear-gradient(135deg,#E11D48,#9F1239);--pola:none}

body[data-tema="naga"]{--wa-green:#A21CAF;--wa-green-dark:#86198F;--wa-teal:#A21CAF;--wa-bubble:#FAE8FF;--bg:#FBEFF8;--text:#2A0A2E;--sub:#7C4A80;
  --grad:linear-gradient(135deg,#C026D3,#86198F);--pola:none}

body[data-tema="kunyit"]{--wa-green:#CA8A04;--wa-green-dark:#A16207;--wa-teal:#CA8A04;--wa-bubble:#FEF3C7;--bg:#FEF9E7;--text:#241C05;--sub:#7A6A33;
  --grad:linear-gradient(135deg,#EAB308,#A16207);--pola:none}

body[data-tema="samudra"]{--wa-green:#0E7490;--wa-green-dark:#0C5F78;--wa-teal:#0E7490;--wa-bubble:#D5ECF1;--bg:#EDF7F9;--text:#0B1D22;--sub:#4F7078;
  --grad:linear-gradient(135deg,#0E7490,#0C5F78);--pola:none}

/* ------- motif batik & grain (peningkatan tampilan tema) ------- */
body[data-tema] .shophero::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27140%27%20height%3D%27140%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%27.85%27%20numOctaves%3D%272%27/%3E%3C/filter%3E%3Crect%20width%3D%27140%27%20height%3D%27140%27%20filter%3D%27url%28%23n%29%27%20opacity%3D%27.55%27/%3E%3C/svg%3E");
  background-size:140px 140px; opacity:.12; mix-blend-mode:soft-light;
}

/* ------- STUDIO TAMPILAN: pilihan terpisah (warna/gradasi/pola/animasi/dll) ------- */
body[data-warna="hijau_pastel"]{--wa-green:#2E7D32;--wa-green-dark:#1B5E20;--wa-teal:#2E7D32;--wa-bubble:#F0F7ED;--bg:#EFF7EC}
body[data-warna="langit_cerah"]{--wa-green:#0369A1;--wa-green-dark:#075985;--wa-teal:#0369A1;--wa-bubble:#D9EAF7;--bg:#E8F3FB}
body[data-warna="sakura"]{--wa-green:#DB2777;--wa-green-dark:#BE185D;--wa-teal:#DB2777;--wa-bubble:#F7DEEA;--bg:#FDF2F7}
body[data-warna="senja"]{--wa-green:#EA580C;--wa-green-dark:#C2410C;--wa-teal:#EA580C;--wa-bubble:#F8E4CE;--bg:#FFF4EA}
body[data-warna="toska_segar"]{--wa-green:#0F766E;--wa-green-dark:#0D5D56;--wa-teal:#0F766E;--wa-bubble:#D2EEE6;--bg:#EAF9F5}
body[data-warna="lavender"]{--wa-green:#6D28D9;--wa-green-dark:#5B21B6;--wa-teal:#6D28D9;--wa-bubble:#E4DDF6;--bg:#F4F1FB}
body[data-warna="krem_klasik"]{--wa-green:#075E54;--wa-green-dark:#0B5B2E;--wa-teal:#075E54;--wa-bubble:#F0F2F5;--bg:#ECE5DD}
body[data-warna="beige_pastel"]{--wa-green:#25D366;--wa-green-dark:#128C7E;--wa-teal:#25D366;--wa-bubble:#D8FDD2;--bg:#F5F2EB}
body[data-warna="abu_sejuk"]{--wa-green:#229ED9;--wa-green-dark:#1A7FB5;--wa-teal:#229ED9;--wa-bubble:#E7EBF0;--bg:#F4F4F5}
body[data-warna="green_light"]{--wa-green:#2E7D32;--wa-green-dark:#1B5E20;--wa-teal:#2E7D32;--wa-bubble:#F0F5EC;--bg:#C5D189}
body[data-warna="merah"]{--wa-green:#DC2626;--wa-green-dark:#B91C1C;--wa-teal:#DC2626;--wa-bubble:#FDE8E8;--bg:#F5F2EB}
body[data-warna="madu"]{--wa-green:#B45309;--wa-green-dark:#92400E;--wa-teal:#B45309;--wa-bubble:#F5E9C8;--bg:#FFF8E7}
body[data-warna="kopi_susu"]{--wa-green:#7C4A21;--wa-green-dark:#5C3A1E;--wa-teal:#7C4A21;--wa-bubble:#EDE0D3;--bg:#FAF6F1}
body[data-warna="samudra"]{--wa-green:#0E7490;--wa-green-dark:#0C5F78;--wa-teal:#0E7490;--wa-bubble:#D5ECF1;--bg:#EDF7F9}
body[data-gradasi="polos"]{--grad:linear-gradient(135deg, var(--wa-teal) 0%, var(--wa-green-dark) 120%);--pola-size: var(--ukuran-pola, auto), auto, auto, auto, auto, auto, auto}
body[data-gradasi="mesh"]{--grad:radial-gradient(70% 80% at 15% 14%, rgba(255,255,255,.18) 0%, transparent 62%), radial-gradient(62% 72% at 86% 26%, rgba(255,255,255,.12) 0%, transparent 65%), linear-gradient(140deg, var(--wa-teal), var(--wa-green-dark) 55%, var(--wa-green) 130%);--pola-size: var(--ukuran-pola, auto), auto, auto, auto, auto, auto, auto}
body[data-gradasi="senja"]{--grad:linear-gradient(135deg, var(--wa-teal) 0%, var(--wa-green-dark) 42%, #FF8A4C 108%);--pola-size: var(--ukuran-pola, auto), auto, auto, auto, auto, auto, auto}
body[data-gradasi="metalik"]{--grad:linear-gradient(115deg, var(--wa-teal), var(--wa-green-dark) 26%, rgba(255,255,255,.30) 47%, var(--wa-green-dark) 62%, var(--wa-teal));--pola-size: var(--ukuran-pola, auto), auto, auto, auto, auto, auto, auto}
body[data-gradasi="aurora"]{--grad:radial-gradient(58% 70% at 18% 18%, rgba(120,255,220,.30) 0%, transparent 62%), radial-gradient(52% 64% at 82% 20%, rgba(190,140,255,.26) 0%, transparent 62%), linear-gradient(140deg, var(--wa-teal), var(--wa-green-dark) 55%, var(--wa-green) 130%);--pola-size: var(--ukuran-pola, auto), auto, auto, auto, auto, auto, auto}
body[data-pola="polos"]{--pola:none;--ukuran-pola:auto}
body[data-pola="kawung"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2732%27%20height%3D%2732%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27rgba%28255%2C255%2C255%2C.17%29%27%20stroke-width%3D%271.5%27%3E%3Cellipse%20cx%3D%278%27%20cy%3D%278%27%20rx%3D%275%27%20ry%3D%276.6%27/%3E%3Cellipse%20cx%3D%2724%27%20cy%3D%2724%27%20rx%3D%275%27%20ry%3D%276.6%27/%3E%3Cellipse%20cx%3D%2724%27%20cy%3D%278%27%20rx%3D%276.6%27%20ry%3D%275%27/%3E%3Cellipse%20cx%3D%278%27%20cy%3D%2724%27%20rx%3D%276.6%27%20ry%3D%275%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:32px 32px}
body[data-pola="parang"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2732%27%20height%3D%2732%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27rgba%28255%2C255%2C255%2C.15%29%27%20stroke-width%3D%272%27%3E%3Cpath%20d%3D%27M-8%2014%20Q%204%202%2016%2014%20T%2040%2014%27/%3E%3Cpath%20d%3D%27M-8%2030%20Q%204%2018%2016%2030%20T%2040%2030%27/%3E%3Cpath%20d%3D%27M-8%2046%20Q%204%2034%2016%2046%20T%2040%2046%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:32px 32px}
body[data-pola="mega"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2736%27%20height%3D%2736%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27rgba%28255%2C255%2C255%2C.15%29%27%20stroke-width%3D%271.7%27%3E%3Cpath%20d%3D%27M0%2034%20q%209%20-11%2018%200%20t%2018%200%20t%2018%200%27/%3E%3Cpath%20d%3D%27M0%2025%20q%209%20-11%2018%200%20t%2018%200%20t%2018%200%27/%3E%3Cpath%20d%3D%27M0%2016%20q%209%20-11%2018%200%20t%2018%200%27/%3E%3Cpath%20d%3D%27M0%207%20q%209%20-11%2018%200%20t%2018%200%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:36px 36px}
body[data-pola="titik"]{--pola:radial-gradient(rgba(255,255,255,.15) 2.2px, transparent 3px);--ukuran-pola:24px 24px}
body[data-pola="grid"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2724%27%20height%3D%2724%27%3E%3Cg%20stroke%3D%27rgba%28255%2C255%2C255%2C.10%29%27%20stroke-width%3D%271%27%3E%3Cpath%20d%3D%27M0%200%20H24%20M0%2012%20H24%20M0%200%20V24%20M12%200%20V24%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:24px 24px}
body[data-pola="konfeti"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2726%27%20height%3D%2726%27%3E%3Cg%20fill%3D%27rgba%28255%2C255%2C255%2C.16%29%27%3E%3Ccircle%20cx%3D%276%27%20cy%3D%278%27%20r%3D%271.8%27/%3E%3Ccircle%20cx%3D%2718%27%20cy%3D%275%27%20r%3D%271.3%27/%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2716%27%20r%3D%271.6%27/%3E%3Ccircle%20cx%3D%2722%27%20cy%3D%2718%27%20r%3D%271.2%27/%3E%3Crect%20x%3D%273%27%20y%3D%2719%27%20width%3D%272.4%27%20height%3D%272.4%27%20transform%3D%27rotate%2824%204%2020%29%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:26px 26px}
body[data-pola="salju"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2726%27%20height%3D%2726%27%3E%3Cg%20fill%3D%27rgba%28255%2C255%2C255%2C.22%29%27%3E%3Ccircle%20cx%3D%277%27%20cy%3D%279%27%20r%3D%271.4%27/%3E%3Ccircle%20cx%3D%2719%27%20cy%3D%2717%27%20r%3D%271.1%27/%3E%3Ccircle%20cx%3D%2714%27%20cy%3D%274%27%20r%3D%271%27/%3E%3Cpath%20d%3D%27M20%205%20l1%202%202%201%20-2%201%20-1%202%20-1-2%20-2-1%202-1z%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:26px 26px}
body[data-pola="garis"]{--pola:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2732%27%20height%3D%2712%27%3E%3Cg%20stroke%3D%27rgba%28255%2C255%2C255%2C.11%29%27%20stroke-width%3D%272%27%3E%3Cpath%20d%3D%27M0%206%20H32%27/%3E%3C/g%3E%3C/svg%3E");--ukuran-pola:32px 12px}
body[data-font="elegan"] .shophero h1, body[data-font="elegan"] .open-pill b{font-family:Georgia, 'Times New Roman', serif}
body[data-font="playful"] .shophero h1, body[data-font="playful"] .open-pill b{font-family:ui-rounded, 'Arial Rounded MT Bold', 'Trebuchet MS', sans-serif}
body[data-font="klasik"] .shophero h1, body[data-font="klasik"] .open-pill b{font-family:'Palatino Linotype', Palatino, Georgia, serif}
body[data-sudut="sangat"] .mitem, body[data-sudut="sangat"] .open-pill, body[data-sudut="sangat"] .catbar .chip{border-radius:26px}
body[data-sudut="membulat"] .mitem, body[data-sudut="membulat"] .open-pill, body[data-sudut="membulat"] .catbar .chip{border-radius:14px}
body[data-sudut="kotak"] .mitem, body[data-sudut="kotak"] .open-pill, body[data-sudut="kotak"] .catbar .chip{border-radius:6px}
body[data-tombol="outline"] .cta-wa{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.75);box-shadow:none}
body[data-tombol="kaca"] .cta-wa{background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.42);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);box-shadow:0 10px 26px rgba(0,0,0,.16)}
/* (mode 'foto profil ke kiri' DIHAPUS — selalu tampilan tengah) */

@keyframes bkAurora{0%{transform:translate3d(-5%,0,0) scale(1)}100%{transform:translate3d(5%,-4%,0) scale(1.12)}}
@keyframes bkKedip{0%,100%{opacity:.25}50%{opacity:.95}}
@keyframes bkNaik{0%{transform:translateY(30%);opacity:0}20%{opacity:.85}100%{transform:translateY(-120%);opacity:0}}
@keyframes bkKilau{0%{transform:translateX(-130%) skewX(-18deg)}55%,100%{transform:translateX(230%) skewX(-18deg)}}
body[data-animasi="aurora"] .shophero::before{content:'';position:absolute;inset:-10%;z-index:0;pointer-events:none;
  background:radial-gradient(42% 56% at 22% 28%, rgba(255,255,255,.22), transparent 62%), radial-gradient(38% 52% at 78% 22%, rgba(255,255,255,.15), transparent 62%);
  filter:blur(12px);animation:bkAurora 16s ease-in-out infinite alternate}
body[data-animasi="bintang"] .shophero::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.85) 1.4px, transparent 1.8px), radial-gradient(rgba(255,255,255,.6) 1.1px, transparent 1.5px);
  background-size:84px 84px, 56px 56px; background-position:0 0, 22px 14px;
  animation:bkKedip 3.8s ease-in-out infinite}
body[data-animasi="gelembung"] .shophero::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background-image:radial-gradient(rgba(255,255,255,.30) 7px, transparent 8px), radial-gradient(rgba(255,255,255,.22) 11px, transparent 12px);
  background-size:120px 120px, 170px 170px; background-position:0 0, 60px 40px;
  animation:bkNaik 13s linear infinite}
body[data-animasi="kilau"] .shophero::before{content:'';position:absolute;top:-20%;bottom:-20%;width:36%;z-index:0;pointer-events:none;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.30), transparent);
  animation:bkKilau 6.5s ease-in-out infinite}


.dekor{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.dekor-item{position:absolute;opacity:.22;font-size:30px;line-height:1}
.dekor .d1{top:14px;left:14px;transform:rotate(-12deg)}
.dekor .d2{top:22px;right:18px;transform:rotate(14deg);opacity:.18}
.dekor .d3{bottom:16px;left:26px;transform:rotate(8deg);opacity:.16}
body[data-dekorasi="emas"] .dekor-item{opacity:.30;font-size:22px}

/* --- anti-kedip: konten hero baru tampil setelah data penjual terpasang --- */
body[data-siap="0"] .shophero .top{opacity:0}
.shophero .top{transition:opacity .22s ease}

/* chip kategori: tanpa scrollbar (mobile) */
#kategori, .catbar{scrollbar-width:none;-ms-overflow-style:none}
#kategori::-webkit-scrollbar, .catbar::-webkit-scrollbar{display:none}