:root {
    --pos-primary: #d9480f;
    --pos-primary-dark: #b33a0b;
    --pos-soft: #fff4e6;
    --bs-primary: #d9480f;
    --bs-primary-rgb: 217, 72, 15;
    --bs-link-color: #d9480f;
    --bs-link-color-rgb: 217, 72, 15;
    --bs-link-hover-color: #b33a0b;
    --bs-body-font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
body { background: #f6f7f9; }
.btn-primary { --bs-btn-bg: var(--pos-primary); --bs-btn-border-color: var(--pos-primary); --bs-btn-hover-bg: var(--pos-primary-dark); --bs-btn-hover-border-color: var(--pos-primary-dark); --bs-btn-active-bg: var(--pos-primary-dark); --bs-btn-disabled-bg: var(--pos-primary); --bs-btn-disabled-border-color: var(--pos-primary); }
.btn-outline-primary { --bs-btn-color: var(--pos-primary); --bs-btn-border-color: var(--pos-primary); --bs-btn-hover-bg: var(--pos-primary); --bs-btn-hover-border-color: var(--pos-primary); --bs-btn-active-bg: var(--pos-primary); }
.text-primary { color: var(--pos-primary) !important; }
.bg-primary-soft { background: var(--pos-soft); }
.form-control:focus, .form-select:focus { border-color: #f7a072; box-shadow: 0 0 0 .2rem rgba(217, 72, 15, .15); }

/* Sidebar */
.app-sidebar { width: 240px; min-height: 100vh; background: #1f1d1b; color: #d9d4cf; position: fixed; inset: 0 auto 0 0; z-index: 1040; transition: transform .2s; }
.app-sidebar .brand { color: #fff; font-weight: 700; font-size: 1.2rem; padding: 1.1rem 1.25rem; display: block; text-decoration: none; }
.app-sidebar .brand i { color: #ff8a3d; }
.app-sidebar .sidebar-head { display: flex; align-items: center; justify-content: space-between; }
.app-sidebar .sidebar-close { background: transparent; border: 0; color: #d9d4cf; font-size: 1.15rem; width: 44px; height: 44px; margin-right: .5rem; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.app-sidebar .sidebar-close:hover, .app-sidebar .sidebar-close:focus-visible { color: #fff; background: rgba(255, 255, 255, .08); outline: none; }
.sidebar-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); z-index: 1035; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
body.sidebar-open .sidebar-backdrop { opacity: 1; visibility: visible; }
.app-sidebar .tenant-name { font-size: .78rem; color: #a39d96; padding: 0 1.25rem .75rem; }
.app-sidebar .nav-link { color: #d9d4cf; padding: .6rem 1.25rem; border-left: 3px solid transparent; display: flex; gap: .65rem; align-items: center; }
.app-sidebar .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .05); }
.app-sidebar .nav-link.active { color: #fff; background: rgba(255, 138, 61, .12); border-left-color: #ff8a3d; }
.app-sidebar .section { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: #7d766f; padding: 1rem 1.25rem .35rem; }
.app-main { margin-left: 240px; min-height: 100vh; }
.app-topbar { background: #fff; border-bottom: 1px solid #e9ecef; padding: .7rem 1.25rem; position: sticky; top: 0; z-index: 1030; }
.app-content { padding: 1.5rem 1.25rem 3rem; }
@media (max-width: 991.98px) {
    .app-sidebar { transform: translateX(-100%); height: 100vh; height: 100dvh; overflow-y: auto; box-shadow: 0 0 24px rgba(0, 0, 0, .35); }
    body.sidebar-open { overflow: hidden; }
    .app-sidebar.show { transform: translateX(0); }
    .app-main { margin-left: 0; }
}

.card { border: 1px solid #eceef1; border-radius: .75rem; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.stat-card .label { color: #6c757d; font-size: .85rem; }
.stat-card .value { font-size: 1.6rem; font-weight: 700; }
.table > :not(caption) > * > * { padding: .65rem .75rem; }
.badge-status { font-weight: 600; }

/* Pemesanan */
.menu-tile { border: 1px solid #e9ecef; border-radius: .6rem; padding: .6rem .75rem; background: #fff; text-align: left; width: 100%; transition: border-color .15s, background .15s; }
.menu-tile:hover { border-color: var(--pos-primary); background: var(--pos-soft); }
.menu-tile .price { color: var(--pos-primary); font-weight: 600; font-size: .9rem; }
.cart-line + .cart-line { border-top: 1px dashed #dee2e6; }
.sticky-cart { position: sticky; top: 76px; }

/* Dapur */
.kitchen-card { border-top: 4px solid #0d6efd; }
.kitchen-card.diproses { border-top-color: #ffc107; }
.kitchen-card.late { box-shadow: 0 0 0 2px rgba(220, 53, 69, .45); }
.kitchen-item { font-size: 1.05rem; }

/* Auth & landing */
.auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 2rem 1rem; background: linear-gradient(135deg, #fff4e6 0%, #f6f7f9 60%); }
.auth-card { width: 100%; max-width: 440px; }
.hero { background: linear-gradient(135deg, #fff4e6, #ffe8cc); }
.plan-card.featured { border: 2px solid var(--pos-primary); }

@media print {
    .no-print, .app-sidebar, .app-topbar { display: none !important; }
    .app-main { margin-left: 0; }
    body { background: #fff; }
    .card { box-shadow: none; border: 0; }
}

/* Foto hidangan */
.menu-thumb { width: 44px; height: 44px; border-radius: .5rem; object-fit: cover; flex: none; background: #f1f3f5; }
.menu-thumb-lg { width: 72px; height: 72px; }
.menu-thumb-empty { display: inline-flex; align-items: center; justify-content: center; color: #adb5bd; }
.menu-tile-img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: .45rem; margin-bottom: .4rem; background: #f8f1ea; }
.menu-tile-img-empty { display: flex; align-items: center; justify-content: center; color: #e0a37a; font-size: 1.4rem; }

/* Menu QR pelanggan */
.qr-cats { position: sticky; top: 0; z-index: 10; }
.qr-cats .container { overflow-x: auto; scrollbar-width: none; }
.qr-cats .container::-webkit-scrollbar { display: none; }
.qr-anchor { scroll-margin-top: 60px; }
.qr-item { display: flex; gap: .75rem; align-items: flex-start; }
.qr-item.is-sold-out { opacity: .5; }
.qr-photo { width: 76px; height: 76px; border-radius: .6rem; object-fit: cover; flex: none; background: #f8f1ea; }
.qr-photo-empty { display: inline-flex; align-items: center; justify-content: center; color: #e0a37a; font-size: 1.6rem; }
.qr-stepper { width: auto; flex-wrap: nowrap; }
.qr-stepper .btn { min-width: 36px; }
.qr-cartbar { position: fixed; left: 0; right: 0; bottom: 0; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(255, 255, 255, .95) 30%); z-index: 1000; }
.qr-cartbar .btn { max-width: 608px; margin: 0 auto; font-size: 1rem; }
body.has-cart .qr-footer { padding-bottom: 6rem !important; }
.min-w-0 { min-width: 0; }
.qr-steps { list-style: none; padding: 0; margin: 0; display: flex; justify-content: space-between; gap: .25rem; font-size: .75rem; color: #adb5bd; counter-reset: s; }
.qr-steps li { flex: 1; position: relative; padding-top: 1.9rem; }
.qr-steps li::before { counter-increment: s; content: counter(s); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1.6rem; height: 1.6rem; border-radius: 50%; background: #e9ecef; color: #868e96; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.qr-steps li.done { color: #2b8a3e; }
.qr-steps li.done::before { content: '✓'; background: #2b8a3e; color: #fff; }
.qr-steps li.now { color: var(--pos-primary); font-weight: 700; }
.qr-steps li.now::before { background: var(--pos-primary); color: #fff; }

/* Halaman depan: Program Mitra, demo, WhatsApp */
.mitra-card { border: 2px solid var(--pos-primary); background: linear-gradient(135deg, #fff, #fff4e6); }
.demo-card { display: flex; flex-direction: column; gap: .15rem; color: inherit; transition: transform .15s, box-shadow .15s, border-color .15s; }
.demo-card:hover { transform: translateY(-2px); border-color: var(--pos-primary); box-shadow: 0 .5rem 1.25rem rgba(217, 72, 15, .12); }
.demo-card.disabled { pointer-events: none; opacity: .5; }
.wa-float { position: fixed; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom)); width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.7rem; box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .2); z-index: 1030; text-decoration: none; }
.wa-float:hover { color: #fff; background: #1ebe5b; }
.privacy h2 { font-size: 1.05rem; font-weight: 700; margin-top: 1.75rem; }