:root{--kuning:#FFC83D;--coklat:#4A2511;--krem:#FFF6D6;--krem2:#FFEBA8}
body{font-family:'Poppins',sans-serif;background:var(--krem);color:var(--coklat);padding-bottom:5rem}
a{color:var(--coklat)}
.nk-h{font-family:'Baloo 2',cursive;font-weight:800;letter-spacing:-.01em}
.nk-nav{background:var(--kuning);box-shadow:0 2px 10px rgba(74,37,17,.15);z-index:1030} /* di atas .nk-livebar (1025) agar dropdown akun tidak tertutup */
.nk-brand{font-family:'Baloo 2';font-weight:800;font-size:1.4rem;color:var(--coklat)}
.nk-btn{background:var(--coklat);color:var(--krem);border-radius:50rem;font-weight:600;padding:.55rem 1.4rem}
.nk-btn:hover,.nk-btn:focus-visible{background:#33190b;color:#fff}
.nk-btn-outline{border:2px solid var(--coklat);color:var(--coklat);border-radius:50rem;font-weight:600}
.nk-btn-outline:hover{background:var(--coklat);color:var(--krem)}
:focus-visible{outline:3px solid var(--coklat);outline-offset:2px}
.nk-announce{background:var(--coklat);color:var(--krem)}

/* Pencarian & filter menu */
.nk-cari .form-control{border-radius:50rem;border:2px solid var(--krem2);padding:.6rem 1.1rem;font-size:.95rem}
.nk-cari .form-control:focus{border-color:var(--coklat);box-shadow:none}
.nk-chip-btn{background:var(--krem2);color:var(--coklat);border:2px solid transparent;border-radius:50rem;font-weight:600;padding:.25rem .9rem}
.nk-chip-btn.is-on{background:var(--coklat);color:var(--krem)}
.nk-hero{position:relative;overflow:hidden;background:var(--kuning);padding:3rem 0 5rem;border-radius:0 0 2.5rem 2.5rem}
.nk-hero-banana{position:absolute;right:4%;bottom:-1.5rem;font-size:11rem;transform:rotate(-18deg);opacity:.9}
@media(max-width:576px){.nk-hero-banana{font-size:6rem;right:-.5rem}}
.nk-status{font-weight:600;padding:.5rem .9rem;border-radius:50rem}
.is-open{background:#1f7a3a;color:#fff}.is-closed{background:var(--coklat);color:var(--krem)}
.nk-perks{margin-top:-2.5rem;position:relative}
.nk-perk{background:#fff;border-radius:1.25rem;padding:1.1rem;box-shadow:0 6px 18px rgba(74,37,17,.12);display:flex;flex-direction:column;gap:.2rem;font-size:.9rem;height:100%}
.nk-perk b{font-family:'Baloo 2';font-size:1.1rem}
.nk-section{padding-top:2.5rem;padding-bottom:.5rem} /* jangan pakai shorthand: padding kiri-kanan .container harus tetap */
.nk-tabs .nav-link{color:var(--coklat);font-weight:600;border-radius:50rem;margin-right:.5rem;background:var(--krem2)}
.nk-acc-menu a .nk-acc-badge{display:inline-block;min-width:1.2em;padding:0 .35em;margin-left:.35rem;border-radius:50rem;background:#B02A2A;color:#fff;font-size:.72rem;font-weight:700;text-align:center}
.nk-tabs .nav-link.active{background:var(--coklat);color:var(--krem)}
.nk-card{border:0;border-radius:1.25rem;overflow:hidden;box-shadow:0 6px 18px rgba(74,37,17,.12)}
.nk-thumb{position:relative;aspect-ratio:4/3;background:var(--krem2)}
.nk-thumb img{width:100%;height:100%;object-fit:cover}
.is-habis .nk-thumb img,.is-habis .card-body{filter:grayscale(1);opacity:.55}
.nk-habis{position:absolute;left:.5rem;bottom:.5rem;background:var(--coklat);color:#fff;padding:.15rem .7rem;border-radius:50rem;font-size:.8rem;font-weight:600}
.nk-stepper{display:inline-flex;align-items:center;gap:.5rem;background:var(--krem2);border-radius:50rem;padding:.2rem}
.nk-stepper button{width:2.75rem;height:2.75rem;border:0;border-radius:50%;background:var(--coklat);color:var(--krem);font-weight:700;line-height:1} /* 44px: target sentuh minimal utk ponsel */
.nk-stepper button:disabled{background:#b9a48f}
.nk-stepper span{min-width:1.6rem;text-align:center;font-weight:600}
/* Kontras: text-muted bawaan Bootstrap (~4.1:1) gagal WCAG AA di latar krem */
body .text-muted{color:#5c5347}
.nk-gal{width:100%;aspect-ratio:1;object-fit:cover;border-radius:1rem;cursor:zoom-in}
.nk-testi{background:#fff;border-radius:1.25rem;padding:1.1rem;box-shadow:0 6px 18px rgba(74,37,17,.12)}
.nk-avatar{width:2.6rem;height:2.6rem;border-radius:50%;object-fit:cover;background:var(--krem2);display:inline-flex;align-items:center;justify-content:center}
.nk-stars{color:#e0a100;letter-spacing:.1em}
.nk-shot{max-height:200px;border-radius:.75rem;cursor:zoom-in}
.nk-shot-gal{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:1rem;cursor:zoom-in;background:#fff;box-shadow:0 6px 18px rgba(74,37,17,.12)}
.nk-jam-kartu{background:#fff;border-radius:1.25rem;padding:.75rem 1rem;box-shadow:0 6px 18px rgba(74,37,17,.12)}
.nk-jam-kartu table{--bs-table-bg:transparent;margin:0;width:100%}
.nk-jam-kartu td{padding:.6rem 0;border-bottom:1px solid var(--krem2)}
.nk-jam-kartu tr:last-child td{border-bottom:0}
.nk-jam-kartu .jam{text-align:right;font-weight:700;color:var(--coklat);white-space:nowrap}
.nk-peta{position:relative;border-radius:1.25rem;overflow:hidden;min-height:340px;box-shadow:0 6px 18px rgba(74,37,17,.12);background:var(--krem2)}
.nk-peta iframe{width:100%;height:100%;min-height:340px;border:0;display:block}
@media (max-width:767px){.nk-peta,.nk-peta iframe{min-height:260px}}
.nk-step{background:var(--krem2);border-radius:1.25rem;padding:1rem;height:100%;font-weight:500}
.nk-step span{display:flex;width:2.2rem;height:2.2rem;margin-bottom:.5rem;border-radius:50%;background:var(--coklat);color:var(--krem);align-items:center;justify-content:center;font-family:'Baloo 2';font-weight:800}
.nk-jam{--bs-table-bg:transparent;max-width:320px}
.nk-faq .accordion-button:not(.collapsed){background:var(--krem2);color:var(--coklat)}
.nk-footer{background:var(--coklat);color:var(--krem);margin-top:3rem;padding-bottom:5rem!important}
.nk-fab{position:fixed;right:1rem;bottom:1rem;z-index:1040;border:0;border-radius:50rem;background:var(--coklat);color:var(--krem);padding:.8rem 1.3rem;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.3)}
.cart-line{border-bottom:1px dashed #d8c7a0;padding:.7rem 0}
.opt-box{background:var(--krem);border-radius:.75rem;padding:.6rem .8rem;margin-bottom:.8rem}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Banner pesanan berlangsung (di bawah navbar) */
.nk-livebar{display:flex;align-items:center;gap:.5rem;background:var(--coklat);color:var(--krem);
  padding:.5rem 1rem;font-size:.9rem;text-decoration:none;position:sticky;top:56px;z-index:1025}
.nk-livebar:hover,.nk-livebar:focus-visible{color:#fff}
.nk-livebar b{font-family:'Baloo 2'}
.nk-livebar-dot{width:.6rem;height:.6rem;border-radius:50%;background:#7ee08a;animation:nkPulse 1.6s infinite}
.nk-livebar-cta{margin-left:auto;background:var(--kuning);color:var(--coklat);border-radius:50rem;padding:.1rem .7rem;font-weight:600;font-size:.8rem}
@keyframes nkPulse{0%,100%{box-shadow:0 0 0 0 rgba(126,224,138,.6)}50%{box-shadow:0 0 0 6px rgba(126,224,138,0)}}
/* Saat pesanan aktif + bar pesan muncul bersamaan, bar kedua ditumpuk di bawah bar
   pertama. Tinggi bar pertama diukur JS ke --nk-bar1-h (fallback 2.4rem bila JS mati).
   Selektor saudara menangkap baik markup statis maupun bar yang disuntik JS. */
a.nk-livebar + div#nkInboxBar .nk-livebar{top:calc(56px + var(--nk-bar1-h,2.4rem))}

/* Navigasi bawah (mobile) */
.nk-bnav{position:fixed;left:0;right:0;bottom:0;z-index:1040;display:flex;background:#fff;
  box-shadow:0 -4px 16px rgba(74,37,17,.15);padding:.35rem 0 max(.35rem,env(safe-area-inset-bottom))}
.nk-bnav a,.nk-bnav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:.1rem;
  background:none;border:0;color:var(--coklat);font-size:1.15rem;text-decoration:none;padding:.3rem 0;position:relative;min-height:3rem}
.nk-bnav span{font-size:.68rem;font-weight:600}
.nk-bnav .is-on{color:#8a5a00}
.nk-bnav .is-on span{font-weight:700}
.nk-bnav-count{position:absolute;top:0;right:22%;background:var(--coklat);color:var(--krem);font-size:.62rem;
  font-style:normal;min-width:1.1rem;height:1.1rem;border-radius:50rem;display:flex;align-items:center;justify-content:center;padding:0 .2rem}
.nk-bnav-count:empty{display:none}
body{padding-bottom:5rem}

/* Menu akun di navbar (tanpa JavaScript) */
.nk-acc{position:relative}
.nk-acc summary{list-style:none;cursor:pointer}
.nk-acc summary::-webkit-details-marker{display:none}
.nk-acc-menu{position:absolute;right:0;top:calc(100% + .4rem);min-width:10rem;background:#fff;border-radius:1rem;box-shadow:0 6px 18px rgba(74,37,17,.18);padding:.4rem;z-index:1030}
.nk-acc-menu a,.nk-acc-menu button{display:block;width:100%;text-align:left;background:none;border:0;padding:.5rem .8rem;border-radius:.6rem;color:var(--coklat);text-decoration:none;font:inherit}
.nk-acc-menu a:hover,.nk-acc-menu button:hover{background:var(--krem2)}

/* ===== Perbaikan tampilan HP ===== */
html,body{overflow-x:hidden}
.nk-box{background:#fff;border-radius:1.25rem;padding:1.5rem;box-shadow:0 6px 18px rgba(74,37,17,.12)}
.nk-aksi{display:flex;flex-wrap:wrap;gap:.5rem}

@media(max-width:576px){
  /* Harga di atas, stepper di bawah (kartu 2 kolom terlalu sempit untuk satu baris) */
  .nk-card .card-body{padding:.85rem}
  .nk-card .card-body>.d-flex{flex-wrap:wrap;gap:.5rem}
  .nk-card .nk-stepper{width:100%;justify-content:space-between}
  .nk-card .nk-stepper span{flex:1}

  /* Tab kategori tidak terpotong */
  .nk-tabs{flex-wrap:wrap;gap:.5rem}
  .nk-tabs .nav-link{margin-right:0}
}