/* Tampilan disamakan dengan source asli (zip): krem #F7F6F2 / #F7F5EF, gelap #1C1B19 / #111416,
   emas #B8860B / #C5962C / #D4AF37, Playfair Display + Plus Jakarta Sans.
   Demo ini vanilla, tanpa Supabase, tanpa tombol Hapus menu. */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#F7F6F2;color:#1C1B19;font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:"Playfair Display",Georgia,serif}
a{color:#B8860B}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font:inherit}
.hidden{display:none!important}
.muted{color:#77736C;font-size:13px}
.gold{color:#C5962C}
.demo-bar{max-width:1080px;margin:8px auto 24px;padding:14px 20px;background:#111;color:#f5d97a;border-radius:12px;font-size:13px;line-height:1.6}
.demo-bar code{background:#333;padding:2px 6px;border-radius:6px}

/* ---------- Header asli (menu/checkout) ---------- */
.orig-header{position:sticky;top:0;z-index:30;background:#1C1B19;color:#fff;border-bottom:1px solid #33312E;box-shadow:0 1px 2px rgba(0,0,0,.1)}
.orig-header-in{max-width:72rem;margin:0 auto;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px}
@media(max-width:480px){.orig-header-in{padding:8px 10px;gap:6px}.orig-brand img{height:28px}.orig-brand h1{font-size:9px;white-space:nowrap}.orig-brand p{white-space:nowrap;font-size:7px}.kamar-badge{padding:3px 6px;font-size:11px;margin-left:0}.kamar-badge b{display:none}.countdown .st{display:none}.countdown .tm{font-size:10px}.cart-icon-btn{padding:6px}}
.orig-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.orig-brand img{height:36px;width:auto;object-fit:contain;flex-shrink:0}
@media(min-width:640px){.orig-brand img{height:44px}}
.orig-brand h1{font-size:12px;letter-spacing:.08em;margin:0;line-height:1}
@media(min-width:640px){.orig-brand h1{font-size:14px}}
.orig-brand p{font-size:8px;color:#B8860B;font-weight:600;letter-spacing:.15em;text-transform:uppercase;margin:3px 0 0}
@media(min-width:640px){.orig-brand p{font-size:9px}}
.kamar-badge{padding:4px 10px;border-radius:8px;background:#2A2926;border:1px solid #3A3834;font-size:12px;font-weight:600;color:#fff;display:flex;align-items:center;gap:6px;margin-left:4px}
.kamar-badge b{color:#B8860B;font-family:ui-monospace,monospace;font-size:10px}
.kamar-badge span{color:#fbbf24;font-weight:700}
.countdown{text-align:right;font-family:"Plus Jakarta Sans",sans-serif}
.countdown .st{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700}
.countdown .dot{width:8px;height:8px;border-radius:999px;animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.countdown .tm{font-size:11px;font-family:ui-monospace,monospace;color:#d6d3d1}
.cart-icon-btn{position:relative;padding:8px;border-radius:12px;background:#2A2926;border:1px solid #3A3834;color:#B8860B;display:flex;align-items:center;justify-content:center}
.cart-icon-btn .n{position:absolute;top:-6px;right:-6px;background:#B8860B;color:#fff;font-size:10px;font-weight:800;width:16px;height:16px;border-radius:999px;display:flex;align-items:center;justify-content:center;border:2px solid #1C1B19}

/* ---------- Locked / Home asli ---------- */
.locked{min-height:100vh;background:#111416;color:#F7F5EF;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:20px;position:relative;overflow:hidden}
.locked::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),url('images/hotel-alia-lobby.webp') center/cover no-repeat;z-index:0}
.locked>*{position:relative;z-index:20}
.locked-head{padding-top:8px;text-align:center;display:flex;flex-direction:column;align-items:center;width:100%;max-width:480px;gap:10px}
.locked-head-row{width:100%;display:flex;align-items:center;justify-content:space-between}
.locked-head-row .spacer{width:96px}
.locked-head img.logo{height:48px;width:auto;object-fit:contain;max-width:200px}
@media(min-width:768px){.locked-head img.logo{height:56px}}
.btn-staff{padding:6px 12px;border-radius:12px;background:rgba(30,29,26,.9);border:1px solid rgba(197,150,44,.5);color:#C5962C;font-size:12px;font-weight:700;display:flex;gap:6px;align-items:center;text-decoration:none}
.btn-staff:hover{background:#C5962C;color:#1E1D1A}
.locked-eyebrow{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#C5962C;line-height:1}
.locked-sub{font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#F7F5EF}
.locked-pill{display:inline-block;padding:4px 12px;background:rgba(30,29,26,.8);border:1px solid rgba(197,150,44,.3);border-radius:999px;font-size:9px;color:#C5962C;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.locked-card{background:#F7F5EF;border:1px solid #E5DFD0;border-radius:24px;padding:24px;box-shadow:0 20px 40px rgba(0,0,0,.3);text-align:center;color:#242321;width:100%;max-width:480px;margin:auto 0}
@media(min-width:640px){.locked-card{padding:32px}}
.locked-icon{margin:0 auto;width:56px;height:56px;border-radius:999px;background:rgba(197,150,44,.1);border:1px solid rgba(197,150,44,.25);display:flex;align-items:center;justify-content:center;color:#C5962C;font-size:24px}
.locked-card h1{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin:12px 0 0}
@media(min-width:640px){.locked-card h1{font-size:30px}}
.locked-div{width:32px;height:2px;background:#C5962C;margin:12px auto}
.locked-card p.sub{font-size:13px;color:#6E6B64;line-height:1.6;max-width:320px;margin:0 auto}
.btn-scan{width:100%;height:56px;background:#C5962C;color:#1E1D1A;font-weight:700;font-size:14px;letter-spacing:.08em;border:0;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.btn-scan:hover{background:#D9B15A}
.security-box{background:#F0ECE1;border:1px solid #E5DFD0;border-radius:12px;padding:14px;display:flex;gap:10px;text-align:left;font-size:11px;color:#6E6B64;line-height:1.5}
.locked-benefits{width:100%;max-width:64rem;margin:0 auto;padding:8px 4px 16px;display:grid;grid-template-columns:1fr;gap:20px;max-width:42rem}
@media(min-width:640px){.locked-benefits{grid-template-columns:repeat(3,1fr)}}
.benefit{display:flex;gap:12px;align-items:flex-start}
@media(min-width:640px){.benefit{flex-direction:column;align-items:center;text-align:center}}
.benefit .ic{width:32px;height:32px;border-radius:999px;border:1px solid rgba(197,150,44,.3);display:flex;align-items:center;justify-content:center;color:#C5962C;flex-shrink:0}
.benefit h4{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin:0;color:#F7F5EF}
.benefit p{font-size:11px;color:#A39F95;margin:2px 0 0;line-height:1.5}
.locked-foot{padding:24px 8px 8px;text-align:center;border-top:1px solid rgba(247,245,239,.1);width:100%;max-width:480px}
.locked-foot p{font-size:10px;color:#A39F95;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin:0}
.locked-input{width:100%;padding:12px 14px;border:1px solid #E5DFD0;border-radius:12px;background:#fff;color:#1C1B19;font-size:14px}
.locked-input:focus{outline:2px solid rgba(197,150,44,.4);border-color:#C5962C}

/* ---------- Menu asli ---------- */
.menu-page{min-height:100vh;background:#F7F6F2;color:#1C1B19;padding-bottom:128px}
.menu-main{max-width:72rem;margin:0 auto;padding:16px;space-y:24px}
.menu-main>*+*{margin-top:24px}
.hero-banner{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.08);border:1px solid #E5E3DC;height:170px;display:flex;align-items:center;padding:20px}
@media(min-width:640px){.hero-banner{height:200px;padding:32px}}
.hero-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-banner .grad{position:absolute;inset:0;background:linear-gradient(to right,rgba(28,27,25,.9),rgba(28,27,25,.8),rgba(28,27,25,.45))}
.hero-banner .txt{position:relative;z-index:10;max-width:32rem;color:#fff}
.hero-banner .txt .lbl{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.2em;color:#B8860B;text-transform:uppercase}
.hero-banner .txt h2{font-size:20px;font-weight:700;letter-spacing:.02em;margin:6px 0}
@media(min-width:640px){.hero-banner .txt h2{font-size:24px}}
.hero-banner .txt p{color:#d6d3d1;font-size:12px;line-height:1.6;margin:0}
@media(min-width:640px){.hero-banner .txt p{font-size:14px}}
.search-wrap{position:relative;max-width:36rem;margin:0 auto}
.search-wrap .ic{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#B8860B}
.search-wrap input{width:100%;padding:12px 40px 12px 44px;background:#fff;border-radius:16px;border:1px solid #E6E3D8;font-size:14px;font-weight:500;color:#1C1B19}
.search-wrap input:focus{outline:2px solid rgba(184,134,11,.3);border-color:#B8860B}
.search-wrap button{position:absolute;right:14px;top:50%;transform:translateY(-50%);border:0;background:none;color:#a8a29e;font-size:16px}
.cat-row{display:flex;gap:10px;overflow-x:auto;padding:4px}
.cat-row button{white-space:nowrap;padding:8px 20px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.02em;border:1px solid #E6E3D8;background:#fff;color:#1C1B19}
@media(min-width:640px){.cat-row button{font-size:13px}}
.cat-row button.on{background:#B8860B;color:#fff;border-color:#B8860B;box-shadow:0 4px 12px rgba(184,134,11,.2);transform:scale(1.02)}
.section-head{display:flex;align-items:center;justify-content:space-between;padding:8px 0 4px}
.section-head h3{font-size:16px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin:0;display:flex;align-items:center;gap:10px}
@media(min-width:640px){.section-head h3{font-size:18px}}
.count-pill{padding:2px 10px;border-radius:999px;background:rgba(184,134,11,.1);color:#B8860B;font-size:11px;font-weight:700;border:1px solid rgba(184,134,11,.2);font-family:"Plus Jakarta Sans",sans-serif}
.link-gold{background:none;border:0;color:#B8860B;font-size:12px;font-weight:700}
.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;align-items:stretch}
@media(min-width:640px){.menu-grid{grid-template-columns:repeat(3,1fr);gap:20px}}
@media(min-width:1024px){.menu-grid{grid-template-columns:repeat(4,1fr);gap:24px}}
.menu-card{background:#fff;border:1px solid #E6E3D8;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;height:100%;box-shadow:0 4px 20px -2px rgba(28,27,25,.05);transition:all .3s;cursor:pointer;position:relative}
.menu-card:hover{box-shadow:0 12px 32px -4px rgba(184,134,11,.22);transform:translateY(-4px)}
.menu-visual{position:relative;aspect-ratio:4/3;width:100%;background:#FAF8F5;border-bottom:1px solid #F0EEE6;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.menu-visual img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.menu-card:hover .menu-visual img{transform:scale(1.05)}
.cat-badge{position:absolute;top:10px;left:10px;z-index:10;padding:4px 10px;background:rgba(28,27,25,.75);color:#E5C378;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;border-radius:999px;border:1px solid rgba(229,195,120,.3);backdrop-filter:blur(4px)}
@media(min-width:640px){.cat-badge{font-size:10px}}
.stock-overlay{position:absolute;inset:0;background:rgba(28,27,25,.7);display:flex;align-items:center;justify-content:center;z-index:10;padding:12px}
.stock-overlay span{padding:4px 12px;background:#e11d48;color:#fff;font-size:10px;font-weight:800;border-radius:999px;text-transform:uppercase;letter-spacing:.15em;border:1px solid rgba(251,113,133,.4)}
.menu-body{padding:14px;display:flex;flex-direction:column;flex:1;justify-content:space-between;gap:10px}
@media(min-width:640px){.menu-body{padding:16px}}
.menu-body h3{font-size:14px;font-weight:700;line-height:1.4;margin:0;min-height:2.4rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:640px){.menu-body h3{font-size:15px;min-height:2.6rem}}
.menu-body p.desc{color:#77736C;font-size:11px;line-height:1.6;margin:4px 0 0;min-height:2.1rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(min-width:640px){.menu-body p.desc{font-size:12px;min-height:2.25rem}}
.menu-foot{margin-top:auto;padding-top:12px;border-top:1px solid #F0EEE6;display:flex;align-items:center;justify-content:space-between;gap:8px}
.price{font-weight:800;color:#1C1B19;font-size:12px;white-space:nowrap;letter-spacing:-.02em}
@media(min-width:640px){.price{font-size:15px}}
.price small{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#a8a29e;font-weight:700}
.btn-add{width:32px;height:32px;border-radius:12px;background:#B8860B;color:#fff;border:0;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 2px 6px rgba(184,134,11,.3);flex-shrink:0}
.btn-add:hover{background:#997321}
.qty-control{display:inline-flex;align-items:center;border-radius:8px;background:#F7F6F2;border:1px solid #E5E3DC;padding:2px}
.qty-control button{width:24px;height:24px;border-radius:6px;border:1px solid #E5E3DC;background:#fff;color:#1C1B19;font-weight:700;display:flex;align-items:center;justify-content:center}
.qty-control button.plus{background:#B8860B;color:#fff;border-color:#B8860B}
.qty-control button:disabled{background:#d6d3d1;color:#78716c;cursor:not-allowed}
.qty-control span{width:20px;text-align:center;font-size:12px;font-weight:600}

/* ---------- CartBar + Cart modal asli ---------- */
.cartbar{position:fixed;bottom:16px;left:16px;right:16px;max-width:36rem;margin:0 auto;z-index:40}
.cartbar button{width:100%;background:#1C1B19;color:#fff;padding:12px;border-radius:16px;box-shadow:0 20px 40px rgba(0,0,0,.3);border:1px solid #33312E;display:flex;align-items:center;justify-content:space-between;gap:12px}
.cartbar .left{display:flex;align-items:center;gap:12px;text-align:left}
.cartbar .bag{position:relative;width:40px;height:40px;border-radius:12px;background:#2A2926;border:1px solid #3A3834;color:#B8860B;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.cartbar .bag .n{position:absolute;top:-6px;right:-6px;background:#B8860B;color:#fff;font-size:10px;font-weight:800;width:20px;height:20px;border-radius:999px;display:flex;align-items:center;justify-content:center;border:2px solid #1C1B19}
.cartbar .ct{font-size:12px;color:#d6d3d1;font-weight:500}
.cartbar .tot{font-weight:800;font-size:14px}
@media(min-width:640px){.cartbar .tot{font-size:16px}}
.cartbar .go{display:flex;align-items:center;gap:6px;background:#B8860B;color:#fff;font-weight:700;font-size:12px;padding:10px 14px;border-radius:12px;flex-shrink:0}
.modal-bg{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center}
@media(min-width:640px){.modal-bg{align-items:center;padding:16px}}
.modal-box{background:#F7F6F2;width:100%;max-width:32rem;border-radius:24px 24px 0 0;border:1px solid #E6E3D8;box-shadow:0 20px 40px rgba(0,0,0,.3);max-height:85vh;display:flex;flex-direction:column;overflow:hidden}
@media(min-width:640px){.modal-box{border-radius:24px}}
.modal-head{padding:16px;border-bottom:1px solid #E6E3D8;background:#fff;display:flex;align-items:center;justify-content:space-between}
.modal-head b{font-size:16px}
.modal-head .kb{background:rgba(184,134,11,.15);color:#B8860B;font-weight:700;font-size:12px;padding:2px 10px;border-radius:999px}
.modal-head button{border:0;background:none;font-size:20px;color:#78716c}
.modal-list{padding:16px;display:flex;flex-direction:column;gap:12px;overflow-y:auto;flex:1}
.cart-line-item{display:flex;gap:12px;padding:12px;background:#fff;border-radius:12px;border:1px solid #E5E3DC;align-items:flex-start}
.cart-line-item img{width:64px;height:64px;border-radius:8px;object-fit:cover;flex-shrink:0;background:#FAF9F5;border:1px solid #F0EEE6}
.cart-line-item h4{font-size:14px;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-line-item .row2{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}
.cart-line-item .row2 b{font-size:12px}
@media(min-width:640px){.cart-line-item .row2 b{font-size:14px}}
.btn-trash{border:0;background:none;color:#a8a29e;padding:4px;flex-shrink:0}
.btn-trash:hover{color:#dc2626}
.modal-foot{padding:16px;border-top:1px solid #E6E3D8;background:#fff;display:flex;flex-direction:column;gap:12px}
.modal-foot .sub{display:flex;justify-content:space-between;font-size:14px}
.modal-foot .sub b{font-weight:800}
.modal-foot .acts{display:flex;gap:8px}
.btn-light{padding:12px 16px;background:#f5f5f4;color:#44403c;font-weight:700;font-size:12px;border:0;border-radius:12px}
.btn-gold{flex:1;padding:12px 16px;background:#B8860B;color:#fff;font-weight:800;font-size:12px;border:0;border-radius:12px;box-shadow:0 4px 12px rgba(184,134,11,.3)}
.btn-gold:hover{background:#997321}
.btn-green{width:100%;padding:14px 16px;background:#25D366;color:#fff;font-weight:700;font-size:14px;border:0;border-radius:12px;box-shadow:0 4px 12px rgba(37,211,102,.3);display:flex;align-items:center;justify-content:center;gap:10px}
.btn-green:hover{background:#20bd5a}

/* ---------- Detail modal ---------- */
.detail-img{position:relative;aspect-ratio:16/9;height:220px;width:100%;background:#FAF9F5;border-bottom:1px solid #F0EEE6;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-shrink:0}
@media(min-width:640px){.detail-img{height:240px}}
.detail-img img{width:100%;height:100%;object-fit:cover}
.detail-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:999px;background:rgba(28,27,25,.7);color:#fff;border:0;display:flex;align-items:center;justify-content:center;z-index:10}
.detail-body{padding:20px;overflow-y:auto;flex:1}
.detail-body h2{font-size:20px;font-weight:700;line-height:1.3;margin:0}
@media(min-width:640px){.detail-body h2{font-size:24px}}
.detail-price{font-size:20px;font-weight:700;color:#B8860B;margin-top:4px}
@media(min-width:640px){.detail-price{font-size:24px}}

/* ---------- Checkout / Success asli ---------- */
.page-cream{min-height:100vh;background:#F7F6F2;color:#1C1B19;padding-bottom:96px}
.page-narrow{max-width:36rem;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;gap:20px}
.back-row{display:flex;align-items:center;gap:12px}
.back-btn{padding:8px;border-radius:12px;background:#fff;border:1px solid #E5E3DC;color:#1C1B19;display:flex;align-items:center;justify-content:center;text-decoration:none}
.back-row h2{font-size:18px;font-weight:700;margin:0}
.back-row p{font-size:12px;color:#77736C;margin:0}
.white-card{background:#fff;border-radius:16px;padding:20px;border:1px solid #E5E3DC;box-shadow:0 1px 2px rgba(0,0,0,.03);display:flex;flex-direction:column;gap:16px}
.white-card h3{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#B8860B;padding-bottom:8px;border-bottom:1px solid #F0EEE6;margin:0}
.kamar-box{display:flex;justify-content:space-between;align-items:center;background:#F7F6F2;padding:12px;border-radius:12px;border:1px solid #E5E3DC}
.kamar-box b{font-size:14px}
.field label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;margin-bottom:4px}
.field input,.field textarea,.field select{width:100%;padding:10px 14px;border-radius:12px;border:1px solid #E5E3DC;background:#fff;color:#1C1B19;font-size:14px}
.field input:focus,.field textarea:focus{outline:2px solid rgba(184,134,11,.3);border-color:#B8860B}
.field .err{font-size:11px;color:#ef4444;font-weight:500}
.delivery-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.delivery-opt{padding:12px;border-radius:12px;border:1px solid #E5E3DC;background:#fff;color:#77736C;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:12px}
.delivery-opt.on{border-color:#B8860B;background:rgba(184,134,11,.1);color:#1C1B19;font-weight:700}
.summary-line{display:flex;justify-content:space-between;font-size:12px;color:#77736C}
@media(min-width:640px){.summary-line{font-size:14px}}
.summary-line b{color:#1C1B19}
.summary-total{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;padding-top:8px;border-top:1px solid #F0EEE6}
.summary-total .t{color:#B8860B;font-size:16px}
.alert{border-radius:12px;padding:14px;font-size:13px}
.alert.err{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}
.alert.ok{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}
.alert.warn{background:#fffbeb;border:1px solid #fde68a;color:#92400e}
.success-page{min-height:100vh;background:#F7F6F2;color:#252525;display:flex;flex-direction:column;justify-content:space-between;padding:32px 16px}
.success-in{width:100%;max-width:480px;margin:0 auto;flex:1;display:flex;flex-direction:column;justify-content:center}
.success-brand{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:24px}
.success-brand img{height:48px;width:auto;object-fit:contain;max-width:200px}
.success-brand .e1{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#B88A28}
.success-brand .e2{font-size:9px;color:#77736B;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.success-check{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.success-check .ic{width:48px;height:48px;border-radius:999px;background:rgba(29,138,90,.1);border:1px solid rgba(29,138,90,.2);color:#1D8A5A;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:900}
.success-check h1{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0}
.success-check p{font-size:13px;color:#77736B;max-width:320px;line-height:1.6;margin:0 auto}
.detail-card{background:#fff;border:1px solid #E5E0D5;border-radius:12px;padding:20px;box-shadow:0 1px 2px rgba(0,0,0,.03);display:flex;flex-direction:column;gap:16px}
.detail-card h3{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid #F0EDE6;padding-bottom:10px;margin:0}
.detail-row{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.detail-row span:first-child{color:#77736B}
.detail-row b{color:#1E1D1A}
.detail-row .mono{font-family:ui-monospace,monospace}
.tracker{display:flex;align-items:flex-start;justify-content:space-between;padding:0 4px}
.track-step{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;text-align:center}
.track-step .dot{width:20px;height:20px;border-radius:999px;background:#E5E0D5;border:4px solid #fff;box-shadow:0 1px 2px rgba(0,0,0,.08);z-index:10;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff}
.track-step.done .dot{background:#1D8A5A;width:20px;height:20px}
.track-step span{font-size:9px;font-weight:700;color:#77736B;text-align:center}
.track-step.done span{color:#1D8A5A}
.btn-outline-gold{width:100%;height:48px;border:1px solid #B88A28;color:#B88A28;background:transparent;font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}

/* ---------- Dark pages: kitchen / delivery / admin / staff ---------- */
.dark-page{min-height:100vh;background:#121110;color:#F8F7F3;padding:16px}
@media(min-width:640px){.dark-page{padding:24px}}
.dark-head{display:flex;flex-direction:column;gap:16px;padding-bottom:16px;border-bottom:1px solid #292524}
@media(min-width:640px){.dark-head{flex-direction:row;align-items:center;justify-content:space-between}}
.dark-pill{display:inline-flex;align-items:center;gap:8px;padding:4px 12px;border-radius:999px;background:rgba(245,158,11,.2);color:#fbbf24;font-size:12px;font-weight:700;border:1px solid rgba(245,158,11,.3);margin-bottom:8px}
.dark-head h1{font-size:24px;font-weight:700;letter-spacing:.02em;margin:0;color:#fff}
@media(min-width:640px){.dark-head h1{font-size:30px}}
.dark-head p{color:#a8a29e;font-size:12px;margin:2px 0 0}
@media(min-width:640px){.dark-head p{font-size:14px}}
.dark-count{padding:8px 16px;border-radius:12px;background:rgba(245,158,11,.2);border:1px solid rgba(245,158,11,.4);color:#fbbf24;font-weight:700;font-size:14px}
.dark-grid{display:grid;grid-template-columns:1fr;gap:24px;margin-top:24px}
@media(min-width:768px){.dark-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.dark-grid{grid-template-columns:repeat(3,1fr)}}
.order-card-dark{background:#1c1917;border:1px solid #292524;border-radius:24px;padding:20px;display:flex;flex-direction:column;gap:16px;box-shadow:0 10px 30px rgba(0,0,0,.3)}
@media(min-width:640px){.order-card-dark{padding:24px}}
.order-card-dark.baru{border-color:rgba(245,158,11,.6);box-shadow:0 0 0 1px rgba(245,158,11,.2)}
.order-top{display:flex;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid #292524}
.order-top .kamar{font-size:24px;font-weight:800;color:#fbbf24;display:block}
.order-top .meta{font-size:11px;color:#a8a29e;font-family:ui-monospace,monospace}
.status-pill{font-size:11px;font-weight:900;padding:4px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.08em;border:1px solid;height:fit-content;white-space:nowrap}
.status-pill.baru{background:rgba(245,158,11,.2);color:#fcd34d;border-color:rgba(245,158,11,.4)}
.status-pill.diproses{background:#172554;color:#93c5fd;border-color:#1e40af}
.status-pill.siap{background:#052e16;color:#6ee7b7;border-color:#166534}
.status-pill.selesai{background:#052e16;color:#6ee7b7;border-color:#166534}
.status-pill.batal{background:#450a0a;color:#fca5a5;border-color:#991b1b}
.order-items{border-top:1px solid rgba(41,37,36,.8);border-bottom:1px solid rgba(41,37,36,.8);padding:12px 0;margin:8px 0;display:flex;flex-direction:column;gap:10px}
.order-item-qty{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:rgba(245,158,11,.1);color:#f59e0b;border:1px solid rgba(245,158,11,.2);font-size:12px;font-weight:900;margin-right:8px}
.btn-dark-amber{width:100%;padding:12px;border-radius:16px;background:#f59e0b;color:#1c1917;font-weight:900;font-size:12px;letter-spacing:.08em;text-transform:uppercase;border:0;display:flex;align-items:center;justify-content:center;gap:8px}
.btn-dark-green{width:100%;padding:12px;border-radius:16px;background:#16a34a;color:#fff;font-weight:900;font-size:12px;letter-spacing:.08em;text-transform:uppercase;border:0;display:flex;align-items:center;justify-content:center;gap:8px}
.btn-dark-grey{width:100%;padding:8px;border-radius:12px;background:#292524;color:#a8a29e;font-weight:700;font-size:11px;border:0;display:flex;align-items:center;justify-content:center;gap:6px}
.dark-table{width:100%;border-collapse:collapse;font-size:14px}
.dark-table th,.dark-table td{border-bottom:1px solid #292524;padding:10px 8px;text-align:left;vertical-align:top;color:#e7e5e4}
.dark-table th{color:#a8a29e;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.dark-input{width:100%;padding:11px 12px;border-radius:10px;border:1px solid #44403c;background:#1c1917;color:#F8F7F3;font-size:14px}
.dark-input:focus{outline:2px solid rgba(212,175,55,.4);border-color:#D4AF37}
.dark-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.dark-tabs a{text-decoration:none}
.dark-tabs button{padding:8px 16px;border-radius:999px;font-size:13px;font-weight:700;border:1px solid #44403c;background:#1c1917;color:#e7e5e4}
.dark-tabs button.on{background:#D4AF37;color:#111;border-color:#D4AF37}

/* ---------- QR poster asli ---------- */
.qr-poster{background:linear-gradient(to bottom,#141414,#0A0A0A);padding:20px;border-radius:16px;border:2px solid #D4AF37;text-align:center;position:relative;box-shadow:0 20px 40px rgba(0,0,0,.4)}
.qr-poster::before{content:"";position:absolute;inset:6px;border:1px solid rgba(212,175,55,.4);border-radius:12px;pointer-events:none}
.qr-poster>*{position:relative;z-index:10}
.qr-poster img.logo{height:36px;width:auto;object-fit:contain;margin:0 auto}
.qr-poster h4{font-size:12px;font-weight:700;letter-spacing:.2em;color:#fff;text-transform:uppercase;margin:8px 0 0}
.qr-poster h5{font-size:11px;font-weight:600;letter-spacing:.08em;color:#D4AF37;text-transform:uppercase;margin:2px 0}
.qr-poster p{font-size:9px;color:#a8a29e;letter-spacing:.02em;margin:4px 0}
.qr-kamar-badge{display:inline-block;padding:6px 16px;background:#D4AF37;color:#111;border-radius:999px;font-weight:900;font-size:12px;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 4px 12px rgba(0,0,0,.3);margin:4px 0}
.qr-white{background:#fff;padding:12px;border-radius:16px;border:1px solid rgba(212,175,55,.3);display:inline-block;box-shadow:0 8px 20px rgba(0,0,0,.3);margin:8px 0}
.qr-white img{width:170px;height:170px;display:block;object-fit:contain}
.qr-white .bars{display:flex;gap:3px;justify-content:center;margin:8px 0}
.qr-white .bars i{display:block;background:#111;height:52px}
.qr-white .code{font-family:ui-monospace,monospace;font-size:20px;font-weight:800;letter-spacing:.12em;color:#111}
.demo-badge{background:#f59e0b;color:#111;font-weight:800;font-size:12px;letter-spacing:.04em;border-radius:8px;padding:8px 10px;margin-bottom:12px}
.token-box{background:rgba(0,0,0,.6);border:1px solid rgba(212,175,55,.3);padding:8px;border-radius:12px;font-size:10px;font-family:ui-monospace,monospace;color:#a8a29e;display:flex;justify-content:space-between;align-items:center;gap:8px}
.token-box b{color:#D4AF37}
.btn-mini{padding:8px 12px;border-radius:10px;background:#292524;color:#e7e5e4;border:1px solid #44403c;font-weight:700;font-size:12px}
.btn-mini.gold{background:#D4AF37;color:#111;border-color:#D4AF37}

/* ---------- Staff login asli ---------- */
.staff-page{min-height:100vh;background:#151412;color:#F8F7F3;display:flex;flex-direction:column}
@media(min-width:1024px){.staff-page{flex-direction:row}}
.staff-left{position:relative;min-height:220px;flex:1;display:flex;flex-direction:column;justify-content:space-between;padding:24px;overflow:hidden;border-bottom:1px solid rgba(201,151,43,.2)}
@media(min-width:640px){.staff-left{min-height:260px;padding:32px}}
@media(min-width:1024px){.staff-left{width:45%;min-height:100vh;border-bottom:0;border-right:1px solid rgba(201,151,43,.2);padding:48px}}
.staff-left img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.75);transform:scale(1.05)}
.staff-left .grad{position:absolute;inset:0;background:linear-gradient(to top,#151412,rgba(21,20,18,.85),rgba(21,20,18,.6))}
.staff-left>*{position:relative;z-index:20}
.staff-left h1{font-size:30px;font-weight:700;letter-spacing:-.02em;margin:8px 0}
@media(min-width:640px){.staff-left h1{font-size:36px}}
@media(min-width:1024px){.staff-left h1{font-size:48px}}
.staff-left .rule{height:2px;width:56px;background:#C9972B;border-radius:999px;margin:16px 0}
.staff-right{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:16px;position:relative}
@media(min-width:640px){.staff-right{padding:32px}}
@media(min-width:1024px){.staff-right{width:55%;padding:48px}}
.staff-card{background:#211F1B;border:1px solid rgba(201,151,43,.35);border-radius:22px;padding:24px;box-shadow:0 20px 40px rgba(0,0,0,.4);width:100%;max-width:480px;display:flex;flex-direction:column;gap:24px}
@media(min-width:640px){.staff-card{padding:36px}}
.staff-card img{height:44px;width:auto;object-fit:contain}
@media(min-width:1024px){.staff-card img{height:54px}}

/* ---------- Promo popup asli ---------- */
.promo-bg{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.4)}
.promo-box{background:#FAF8F5;border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.4);overflow:hidden;width:90%;max-width:380px;border:1px solid rgba(181,138,42,.3);display:flex;flex-direction:column}
.promo-head{background:#1C1B19;padding:10px 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(181,138,42,.2);color:#fff}
.promo-body{padding:16px;display:flex;flex-direction:column;gap:12px;text-align:center}
.promo-body img{width:100%;height:90px;object-fit:cover;border-radius:14px;border:1px solid #E8E2D5}
@media(min-width:640px){.promo-body img{height:98px}}
.promo-body h3{font-size:20px;font-weight:700;line-height:1.2;margin:0;color:#222}
@media(min-width:640px){.promo-body h3{font-size:23px}}
/* Phone header fix (di akhir file agar menang atas aturan dasar) */
@media(max-width:480px){
  .orig-header-in{padding:8px 10px;gap:6px}
  .orig-brand{gap:6px}
  .orig-brand img{height:28px}
  .orig-brand h1{font-size:9px;white-space:nowrap}
  .orig-brand p{white-space:nowrap;font-size:7px}
  .kamar-badge{padding:3px 6px;font-size:11px;margin-left:0}
  .kamar-badge b{display:none}
  .countdown .st{display:none}
  .countdown .tm{font-size:10px}
  .cart-icon-btn{padding:6px}
}
/* ---------- Login Admin Portal (samakan live) ---------- */
.login-page{min-height:100vh;background:#151412;color:#F8F7F3;display:flex;flex-direction:column}
@media(min-width:1024px){.login-page{flex-direction:row}}
.login-left{position:relative;min-height:220px;flex:1;display:flex;flex-direction:column;padding:24px;overflow:hidden;border-bottom:1px solid rgba(201,151,43,.2)}
@media(min-width:640px){.login-left{min-height:260px;padding:32px}}
@media(min-width:1024px){.login-left{width:45%;min-height:100vh;border-bottom:0;border-right:1px solid rgba(201,151,43,.2);padding:48px}}
.login-left img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.05);filter:brightness(.75)}
.login-left .grad{position:absolute;inset:0;background:linear-gradient(to top,#151412,rgba(21,20,18,.85),rgba(21,20,18,.6))}
.login-left .grad2{position:absolute;inset:0;background:rgba(21,20,18,.4)}
.login-left-in{position:relative;z-index:20;display:flex;flex-direction:column;justify-content:space-between;height:100%;gap:32px}
.login-left h1{font-size:30px;font-weight:700;letter-spacing:-.02em;margin:8px 0}
@media(min-width:640px){.login-left h1{font-size:36px}}
@media(min-width:1024px){.login-left h1{font-size:48px}}
.login-left .rule{height:2px;width:56px;background:#C9972B;border-radius:999px;margin:16px 0}
.login-badge{display:none}
@media(min-width:1024px){.login-badge{display:flex;align-items:center;gap:12px;padding:14px;border-radius:12px;background:rgba(33,31,27,.9);border:1px solid rgba(201,151,43,.25);max-width:24rem}}
.login-badge-ic{width:32px;height:32px;border-radius:8px;background:rgba(201,151,43,.15);border:1px solid rgba(201,151,43,.3);display:flex;align-items:center;justify-content:center;color:#C9972B;flex-shrink:0}
.login-right{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:16px;position:relative}
@media(min-width:640px){.login-right{padding:32px}}
@media(min-width:1024px){.login-right{width:55%;padding:48px}}
.login-glow{position:absolute;top:25%;right:25%;width:320px;height:320px;background:rgba(201,151,43,.05);border-radius:999px;filter:blur(48px);pointer-events:none}
.login-card-wrap{width:100%;max-width:480px;position:relative;z-index:10;margin:auto 0;display:flex;flex-direction:column;gap:24px}
.login-card{background:#211F1B;border:1px solid rgba(201,151,43,.35);border-radius:22px;padding:24px;box-shadow:0 20px 40px rgba(0,0,0,.4);display:flex;flex-direction:column;gap:24px;position:relative}
@media(min-width:640px){.login-card{padding:36px}}
.login-demo-tag{position:absolute;top:16px;right:16px;font-size:10px;font-weight:800;letter-spacing:.15em;color:#C9972B;border:1px solid rgba(201,151,43,.5);border-radius:999px;padding:4px 10px}
.login-label{font-size:12px;font-weight:600;color:#F8F7F3;display:block;margin-bottom:6px}
.login-input-wrap{position:relative;display:flex;align-items:center}
.login-input-ic{position:absolute;left:16px;color:#9D9A92;pointer-events:none}
.login-input{width:100%;height:52px;padding:0 16px 0 44px;background:#181715;border:1px solid #38342D;border-radius:12px;color:#F8F7F3;font-size:14px}
.login-input:focus{outline:none;border-color:#C9972B;box-shadow:0 0 0 1px #C9972B}
.login-input::placeholder{color:#66635B}
.login-eye{position:absolute;right:16px;background:none;border:0;color:#9D9A92;font-size:16px;padding:4px}
.login-submit{width:100%;height:52px;background:#C9972B;color:#151412;font-weight:700;font-size:14px;letter-spacing:.08em;border:0;border-radius:12px;box-shadow:0 8px 20px rgba(201,151,43,.1);margin-top:8px}
.login-submit:hover{background:#E0B84F}

/* ---------- Dashboard Admin (sidebar terang, samakan asli) ---------- */
.admin-layout{min-height:100vh;background:#F5F5F3;color:#222;display:flex;flex-direction:column}
@media(min-width:768px){.admin-layout{flex-direction:row}}
.admin-mobile-head{display:flex;height:64px;background:#fff;border-bottom:1px solid #E8E6E1;padding:0 16px;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:30}
@media(min-width:768px){.admin-mobile-head{display:none}}
.admin-sidebar{width:100%;background:#fff;border-bottom:1px solid #E8E6E1;display:flex;flex-direction:column}
@media(min-width:768px){.admin-sidebar{width:240px;flex-shrink:0;border-bottom:0;border-right:1px solid #E8E6E1;position:sticky;top:0;height:100vh}}
.admin-nav-btn{width:100%;display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-radius:12px;font-size:12px;font-weight:600;border:0;background:transparent;color:#222;text-align:left}
.admin-nav-btn:hover{background:#f5f5f4}
.admin-nav-btn.on{background:#fafaf9;box-shadow:inset 0 0 0 1px #E8E6E1;color:#B58A2A}
.admin-nav-badge{padding:2px 6px;border-radius:999px;font-size:9px;font-weight:700;background:#B58A2A;color:#fff}
.admin-main{flex:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
.admin-top{display:none}
@media(min-width:768px){.admin-top{display:flex;height:80px;background:#fff;border-bottom:1px solid #E8E6E1;padding:0 32px;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20}}
.admin-card{background:#fff;border:1px solid #E8E6E1;border-radius:16px;padding:20px;margin-bottom:16px}
.admin-card h3{margin:0 0 12px;font-size:16px}
.admin-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
@media(min-width:768px){.admin-stats{grid-template-columns:repeat(4,1fr)}}
.admin-stat{background:#fff;border:1px solid #E8E6E1;border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:4px}
.admin-stat .lbl{font-size:12px;color:#777}
.admin-stat b{font-size:20px}
.admin-table{width:100%;border-collapse:collapse;font-size:13px}
.admin-table th,.admin-table td{border-bottom:1px solid #E8E6E1;padding:10px 8px;text-align:left;vertical-align:top;color:#222}
.admin-table th{color:#777;font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.admin-input{width:100%;padding:11px 12px;border-radius:10px;border:1px solid #E8E6E1;background:#fff;color:#222;font-size:14px}
.admin-input:focus{outline:2px solid rgba(181,138,42,.3);border-color:#B58A2A}
.st-badge{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid}
.st-badge.amber{background:#fef3c7;color:#92400e;border-color:#fde68a}
.st-badge.blue{background:#eff6ff;color:#1e40af;border-color:#bfdbfe}
.st-badge.indigo{background:#eef2ff;color:#3730a3;border-color:#c7d2fe}
.st-badge.emerald{background:#ecfdf5;color:#065f46;border-color:#a7f3d0}
.st-badge.rose{background:#fff1f2;color:#9f1239;border-color:#fecdd3}
.st-badge.stone{background:#f5f5f4;color:#57534e;border-color:#e7e5e4}
/* Sidebar HP: tersembunyi seperti asli, dibuka tombol hamburger */
@media(max-width:767px){
  .admin-sidebar{display:none}
  .admin-sidebar.open{display:flex;position:fixed;inset:0 auto 0 0;width:240px;z-index:40;box-shadow:0 20px 40px rgba(0,0,0,.3);overflow-y:auto}
}
/* ---------- Admin tab asli: kartu, order card, pill ---------- */
.admin-stats4{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:16px}
@media(min-width:640px){.admin-stats4{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.admin-stats4{grid-template-columns:repeat(4,1fr)}}
.admin-stat4{background:#fff;border:1px solid #E8E6E1;padding:20px;border-radius:16px;display:flex;align-items:center;gap:16px;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.admin-stat4 .ic{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid;font-size:20px}
.admin-stat4 .ic.gold{background:rgba(181,138,42,.1);color:#B58A2A;border-color:rgba(181,138,42,.25)}
.admin-stat4 .ic.green{background:rgba(22,132,91,.1);color:#16845B;border-color:rgba(22,132,91,.25)}
.admin-stat4 .ic.amber{background:rgba(217,154,0,.1);color:#D99A00;border-color:rgba(217,154,0,.25)}
.admin-stat4 .ic.stone{background:#f5f5f4;color:#57534e;border-color:#e7e5e4}
.admin-stat4 .lbl{font-size:10px;font-weight:700;color:#777;text-transform:uppercase;letter-spacing:.08em;display:block}
.admin-stat4 b{font-size:20px;font-weight:700;color:#222;display:block;margin-top:2px}
.admin-stat4 .sub{font-size:10px;color:#78716c;font-weight:500;display:block;margin-top:2px}
.order-pill{height:40px;padding:0 18px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid #ECECEC;background:#fff;color:#222;flex-shrink:0}
.order-pill.on{background:#111;color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.1)}
.admin-order-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:768px){.admin-order-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.admin-order-grid{grid-template-columns:repeat(3,1fr)}}
.admin-order-card{background:#fff;border:1px solid #F2F2F2;border-radius:16px;padding:16px;box-shadow:0 4px 20px rgba(0,0,0,.03);display:flex;flex-direction:column;justify-content:space-between;min-height:220px;gap:12px;transition:all .2s}
@media(min-width:640px){.admin-order-card{padding:20px}}
.admin-order-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,.07)}
.admin-kitchen-grid{display:grid;grid-template-columns:1fr;gap:24px}
@media(min-width:1024px){.admin-kitchen-grid{grid-template-columns:repeat(3,1fr)}}
.promo-pill{padding:4px 10px;border-radius:8px;font-size:10px;font-weight:700;border:1px solid;display:inline-flex;align-items:center;gap:6px}
.promo-pill.off{background:#f5f5f4;color:#78716c;border-color:#e7e5e4}
.stock-pill{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:700}
.stock-pill.green{background:#ecfdf5;color:#065f46}
.stock-pill.amber{background:#fffbeb;color:#92400e}
.stock-pill.red{background:#fff1f2;color:#9f1239}
.avail-pill{padding:2px 10px;border-radius:999px;font-size:10px;font-weight:700;border:1px solid;display:inline-flex;align-items:center;gap:4px;background:#fff;cursor:pointer}
.avail-pill.on{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.avail-pill.off{background:#fff1f2;color:#9f1239;border-color:#fecdd3}
.report-tab{padding:8px 16px;border-radius:12px;font-size:12px;font-weight:700;border:0;background:transparent;color:#222;flex-shrink:0}
.report-tab.on{background:#f5f5f4;box-shadow:inset 0 0 0 1px #E8E6E1}
@media(min-width:768px){.staff-grid{grid-template-columns:repeat(2,1fr)!important}}
.admin-layout .btn-gold{width:auto;flex:none}