/* ==========================================================================
   Restaurant MS – custom theme on top of Bootstrap 5 (no build step)
   ========================================================================== */
@font-face { font-family: 'Manrope'; font-weight: 400; font-display: swap; src: url('../vendor/manrope/manrope-400.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 500; font-display: swap; src: url('../vendor/manrope/manrope-500.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 600; font-display: swap; src: url('../vendor/manrope/manrope-600.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 700; font-display: swap; src: url('../vendor/manrope/manrope-700.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 800; font-display: swap; src: url('../vendor/manrope/manrope-800.woff2') format('woff2'); }

:root {
    --rms-primary: #c2410c;
    --rms-primary-600: #9a3412;
    --rms-primary-50: #fff4ed;
    --rms-primary-100: #ffe4d1;
    --rms-sidebar: #1f1a17;
    --rms-sidebar-2: #2a231f;
    --rms-sidebar-text: #c9bfb8;
    --rms-bg: #f7f4f1;
    --rms-surface: #ffffff;
    --rms-border: #ece6e1;
    --rms-text: #2b2420;
    --rms-muted: #857a72;
    --rms-success: #15803d;
    --rms-warning: #b45309;
    --rms-danger: #b91c1c;
    --rms-info: #0e7490;
    --rms-radius: 14px;
    --rms-shadow: 0 1px 2px rgba(40, 25, 15, .04), 0 4px 16px rgba(40, 25, 15, .05);
    --sidebar-w: 248px;

    --bs-primary: var(--rms-primary);
    --bs-primary-rgb: 194, 65, 12;
    --bs-body-font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --bs-body-color: var(--rms-text);
    --bs-body-bg: var(--rms-bg);
    --bs-border-color: var(--rms-border);
    --bs-link-color: var(--rms-primary);
    --bs-link-hover-color: var(--rms-primary-600);
    --bs-link-color-rgb: 194, 65, 12;
}

body { font-family: var(--bs-body-font-family); background: var(--rms-bg); color: var(--rms-text); font-size: .925rem; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { font-weight: 700; letter-spacing: -.01em; }
.text-muted { color: var(--rms-muted) !important; }
.fw-800 { font-weight: 800; }
.small-caps { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--rms-muted); }
a { text-decoration: none; }

/* ---------- Buttons ---------- */
.btn { font-weight: 600; border-radius: 10px; padding: .5rem 1rem; }
.btn-sm { border-radius: 8px; padding: .3rem .7rem; }
.btn-lg { border-radius: 12px; }
.btn-primary { --bs-btn-bg: var(--rms-primary); --bs-btn-border-color: var(--rms-primary); --bs-btn-hover-bg: var(--rms-primary-600); --bs-btn-hover-border-color: var(--rms-primary-600); --bs-btn-active-bg: var(--rms-primary-600); --bs-btn-active-border-color: var(--rms-primary-600); --bs-btn-disabled-bg: var(--rms-primary); --bs-btn-disabled-border-color: var(--rms-primary); }
.btn-outline-primary { --bs-btn-color: var(--rms-primary); --bs-btn-border-color: var(--rms-primary); --bs-btn-hover-bg: var(--rms-primary); --bs-btn-hover-border-color: var(--rms-primary); --bs-btn-active-bg: var(--rms-primary); }
.btn-light { --bs-btn-bg: #fff; --bs-btn-border-color: var(--rms-border); --bs-btn-hover-bg: #faf7f5; --bs-btn-hover-border-color: #ddd3cb; }
.btn-check:checked + .btn-light, .btn-check:active + .btn-light { background: var(--rms-primary-50); border-color: var(--rms-primary); color: var(--rms-text); box-shadow: 0 0 0 1px var(--rms-primary) inset; }
.btn-check:checked + .btn-light .text-muted { color: var(--rms-muted) !important; }
.btn-soft { background: var(--rms-primary-50); color: var(--rms-primary); border: 1px solid var(--rms-primary-100); }
.btn-soft:hover { background: var(--rms-primary-100); color: var(--rms-primary-600); }
.btn-icon { width: 38px; height: 38px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Forms ---------- */
.form-control, .form-select { border-radius: 10px; border-color: var(--rms-border); padding: .55rem .8rem; font-size: .925rem; }
.form-control:focus, .form-select:focus { border-color: #f1a37c; box-shadow: 0 0 0 .2rem rgba(194, 65, 12, .12); }
.form-label { font-weight: 600; font-size: .82rem; margin-bottom: .35rem; }
.form-text { font-size: .78rem; }
.form-check-input:checked { background-color: var(--rms-primary); border-color: var(--rms-primary); }
.input-group-text { border-color: var(--rms-border); background: #faf7f5; border-radius: 10px; }

/* ---------- Cards ---------- */
.card { border: 1px solid var(--rms-border); border-radius: var(--rms-radius); box-shadow: var(--rms-shadow); background: var(--rms-surface); }
.card-header { background: transparent; border-bottom: 1px solid var(--rms-border); padding: 1rem 1.25rem; font-weight: 700; }
.card-body { padding: 1.25rem; }
.card-footer { background: #fcfaf8; border-top: 1px solid var(--rms-border); }

.stat-card { padding: 1.1rem 1.2rem; display: flex; flex-direction: row; gap: .9rem; align-items: center; height: 100%; }
.stat-card .min-w-0 { min-width: 0; }
.stat-card .stat-icon { width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; flex-shrink: 0; }
.stat-card .stat-label { font-size: .78rem; color: var(--rms-muted); font-weight: 600; }
.stat-card .stat-value { font-size: 1.35rem; font-weight: 800; line-height: 1.2; letter-spacing: -.02em; }
@media (max-width: 575.98px) {
    .stat-card { padding: .85rem; gap: .6rem; }
    .stat-card .stat-icon { display: none; }
    .stat-card .stat-value { font-size: 1.1rem; }
}
.tone-orange { background: #fff1e8; color: #c2410c; }
.tone-green { background: #ecfdf3; color: #15803d; }
.tone-red { background: #fef2f2; color: #b91c1c; }
.tone-blue { background: #ecfeff; color: #0e7490; }
.tone-purple { background: #f5f3ff; color: #6d28d9; }
.tone-amber { background: #fffbeb; color: #b45309; }
.tone-gray { background: #f4f1ee; color: #57534e; }

/* ---------- Tables ---------- */
.table { --bs-table-bg: transparent; margin-bottom: 0; }
.table > :not(caption) > * > * { padding: .7rem .9rem; border-bottom-color: var(--rms-border); }
.table thead th { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--rms-muted); font-weight: 700; background: #fcfaf8; white-space: nowrap; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: #fdf8f4; }
.table td.num, .table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table tr.row-total td { font-weight: 800; background: #fcfaf8; }
.table tr.row-section td { font-weight: 800; background: #f7f1ec; color: var(--rms-primary-600); text-transform: uppercase; font-size: .75rem; letter-spacing: .06em; }
.table tr.row-subtotal td { font-weight: 700; border-top: 2px solid var(--rms-border); }

/* ---------- Badges ---------- */
.badge { font-weight: 700; border-radius: 999px; padding: .35em .7em; font-size: .7rem; letter-spacing: .02em; }
.badge-soft-success { background: #dcfce7; color: #166534; }
.badge-soft-warning { background: #fef3c7; color: #92400e; }
.badge-soft-danger { background: #fee2e2; color: #991b1b; }
.badge-soft-info { background: #cffafe; color: #155e75; }
.badge-soft-secondary { background: #f1ede9; color: #57534e; }
.badge-soft-dark { background: #e7e5e4; color: #1c1917; }
.badge-soft-primary { background: var(--rms-primary-100); color: var(--rms-primary-600); }

/* ---------- Layout ---------- */
.app-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); background: var(--rms-sidebar); color: var(--rms-sidebar-text); display: flex; flex-direction: column; z-index: 1040; transition: transform .2s ease; }
.app-sidebar .brand { padding: 1.1rem 1.25rem; display: flex; align-items: center; gap: .7rem; color: #fff; border-bottom: 1px solid rgba(255,255,255,.06); }
.app-sidebar .brand-mark { width: 36px; height: 36px; border-radius: 10px; background: var(--rms-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; color: #fff; }
.app-sidebar .brand-name { font-weight: 800; font-size: 1rem; line-height: 1.1; }
.app-sidebar .brand-sub { font-size: .7rem; color: var(--rms-sidebar-text); }
.app-sidebar nav { overflow-y: auto; flex: 1; padding: .75rem .65rem 1.5rem; scrollbar-width: thin; scrollbar-color: #3a312b transparent; }
.nav-section { font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; color: #7d716a; font-weight: 700; padding: 1rem .75rem .35rem; }
.nav-link-rms { display: flex; align-items: center; gap: .7rem; padding: .5rem .75rem; border-radius: 9px; color: var(--rms-sidebar-text); font-weight: 600; font-size: .86rem; margin-bottom: 1px; }
.nav-link-rms i { font-size: 1.05rem; width: 20px; text-align: center; opacity: .85; }
.nav-link-rms:hover { background: var(--rms-sidebar-2); color: #fff; }
.nav-link-rms.active { background: var(--rms-primary); color: #fff; }
.nav-link-rms.active i { opacity: 1; }
.nav-sub { padding-left: 2.15rem; }
.nav-sub .nav-link-rms { font-size: .8rem; padding: .35rem .6rem; font-weight: 500; }
.nav-sub .nav-link-rms.active { background: transparent; color: #fff; font-weight: 700; }
.nav-sub .nav-link-rms.active::before { content: ''; width: 6px; height: 6px; background: var(--rms-primary); border-radius: 50%; margin-left: -.9rem; margin-right: .35rem; }

.app-main { margin-left: var(--sidebar-w); min-height: 100vh; display: flex; flex-direction: column; }
.app-topbar { position: sticky; top: 0; z-index: 1030; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--rms-border); height: 60px; display: flex; align-items: center; gap: .75rem; padding: 0 1.25rem; }
.app-content { padding: 1.5rem; flex: 1; }
.page-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1.25rem; }
.page-header h1 { font-size: 1.4rem; margin: 0; }
.page-header .subtitle { color: var(--rms-muted); font-size: .85rem; margin-top: .15rem; }

.module-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .75rem; border-radius: 999px; background: var(--rms-primary-50); color: var(--rms-primary-600); font-weight: 700; font-size: .82rem; border: 1px solid var(--rms-primary-100); }
.module-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.sync-pill { display: inline-flex; align-items: center; gap: .4rem; font-size: .75rem; font-weight: 700; padding: .3rem .65rem; border-radius: 999px; background: #f4f1ee; color: #57534e; }
.sync-pill .dot { width: 8px; height: 8px; border-radius: 50%; background: #a8a29e; }
.sync-pill.online .dot { background: #16a34a; }
.sync-pill.offline .dot { background: #dc2626; }
.avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--rms-primary-100); color: var(--rms-primary-600); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: .8rem; }

.sidebar-backdrop { display: none; }
@media (max-width: 991.98px) {
    .app-sidebar { transform: translateX(-100%); }
    body.sidebar-open .app-sidebar { transform: none; }
    body.sidebar-open .sidebar-backdrop { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 1035; }
    .app-main { margin-left: 0; }
    .app-content { padding: 1rem; }
}

.empty-state { text-align: center; padding: 3rem 1rem; color: var(--rms-muted); }
.empty-state i { font-size: 2.5rem; color: #d6cbc3; display: block; margin-bottom: .5rem; }
.filter-bar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; }
.filter-bar .form-control, .filter-bar .form-select { min-width: 140px; }
.alert { border-radius: 12px; border: 0; }
.list-kv { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1rem; font-size: .88rem; }
.list-kv dt { color: var(--rms-muted); font-weight: 600; }
.list-kv dd { margin: 0; font-weight: 600; }
.pagination { --bs-pagination-active-bg: var(--rms-primary); --bs-pagination-active-border-color: var(--rms-primary); --bs-pagination-color: var(--rms-text); margin-bottom: 0; }
.modal-content { border-radius: 16px; border: 0; }

/* ---------- Auth ---------- */
.auth-only { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.auth-card { width: 100%; max-width: 420px; }

/* ---------- Module selection ---------- */
.module-card { display: block; padding: 1.5rem; border-radius: 16px; background: #fff; border: 2px solid var(--rms-border); color: var(--rms-text); transition: all .15s; text-align: left; width: 100%; }
.module-card:hover { border-color: var(--rms-primary); transform: translateY(-2px); box-shadow: var(--rms-shadow); }
.module-card .icon { width: 54px; height: 54px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; color: #fff; margin-bottom: 1rem; }

/* ==========================================================================
   POS
   ========================================================================== */
body.pos-mode .app-content { padding: 0; }
.pos { display: grid; grid-template-columns: 1fr 400px; height: calc(100vh - 60px); }
.pos-catalog { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.pos-toolbar { padding: .9rem 1rem .5rem; display: flex; gap: .6rem; align-items: center; }
.pos-search { position: relative; flex: 1; }
.pos-search i { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: var(--rms-muted); }
.pos-search input { padding-left: 2.4rem; height: 46px; border-radius: 12px; font-size: 1rem; }
.pos-cats { display: flex; gap: .45rem; padding: .25rem 1rem .75rem; overflow-x: auto; scrollbar-width: none; flex-shrink: 0; }
.pos-cats::-webkit-scrollbar { display: none; }
.pos-cat { border: 1px solid var(--rms-border); background: #fff; border-radius: 999px; padding: .5rem 1rem; font-weight: 700; font-size: .85rem; white-space: nowrap; color: var(--rms-text); min-height: 40px; }
.pos-cat.active { background: var(--rms-sidebar); color: #fff; border-color: var(--rms-sidebar); }
.pos-grid { flex: 1; overflow-y: auto; padding: 0 1rem 1rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .75rem; align-content: start; }
.pos-product { background: #fff; border: 1px solid var(--rms-border); border-radius: 14px; padding: .75rem; text-align: left; display: flex; flex-direction: column; gap: .35rem; min-height: 120px; position: relative; transition: transform .08s, border-color .12s, box-shadow .12s; user-select: none; }
.pos-product:hover { border-color: #f1a37c; box-shadow: var(--rms-shadow); }
.pos-product:active { transform: scale(.97); }
.pos-product .thumb { height: 64px; border-radius: 10px; background: var(--rms-primary-50); display: flex; align-items: center; justify-content: center; font-size: 1.6rem; color: var(--rms-primary); overflow: hidden; }
.pos-product .thumb img { width: 100%; height: 100%; object-fit: cover; }
.pos-product .name { font-weight: 700; font-size: .88rem; line-height: 1.2; }
.pos-product .price { font-weight: 800; color: var(--rms-primary); font-size: .95rem; margin-top: auto; }
.pos-product .stock { position: absolute; top: .5rem; right: .5rem; font-size: .65rem; }
.pos-product .sizes { font-size: .7rem; color: var(--rms-muted); }

.pos-cart { background: #fff; border-left: 1px solid var(--rms-border); display: flex; flex-direction: column; min-height: 0; }
.pos-cart-head { padding: .85rem 1rem; border-bottom: 1px solid var(--rms-border); }
.order-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: .35rem; background: #f4f1ee; padding: .25rem; border-radius: 12px; }
.order-types button { border: 0; background: transparent; border-radius: 9px; padding: .45rem; font-weight: 700; font-size: .8rem; color: var(--rms-muted); }
.order-types button.active { background: #fff; color: var(--rms-text); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.pos-cart-items { flex: 1; overflow-y: auto; padding: .5rem 1rem; }
.cart-line { display: grid; grid-template-columns: 1fr auto; gap: .25rem .75rem; padding: .7rem 0; border-bottom: 1px dashed var(--rms-border); }
.cart-line .ln-name { font-weight: 700; font-size: .88rem; }
.cart-line .ln-meta { font-size: .75rem; color: var(--rms-muted); }
.cart-line .ln-total { font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.cart-line .qty-ctl { justify-self: start; }
.qty-ctl { display: inline-flex; align-items: center; border: 1px solid var(--rms-border); border-radius: 10px; overflow: hidden; }
.qty-ctl button { width: 36px; height: 34px; border: 0; background: #faf7f5; font-weight: 800; font-size: 1.05rem; color: var(--rms-text); }
.qty-ctl button:active { background: var(--rms-primary-100); }
.qty-ctl input { width: 52px; border: 0; text-align: center; font-weight: 700; height: 34px; }
.qty-ctl input:focus { outline: none; }
.pos-cart-foot { border-top: 1px solid var(--rms-border); padding: .9rem 1rem 1rem; background: #fcfaf8; }
.totals-row { display: flex; justify-content: space-between; font-size: .88rem; padding: .15rem 0; }
.totals-row.grand { font-size: 1.35rem; font-weight: 800; padding-top: .4rem; }
.pos-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .5rem; margin-top: .75rem; }
.pos-actions .btn { padding: .65rem .25rem; font-size: .82rem; }
.pay-btn { font-size: 1.05rem; padding: .85rem; border-radius: 12px; font-weight: 800; }
.pos-cart-toggle { display: none; }

.pay-methods { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: .5rem; }
.pay-method { border: 2px solid var(--rms-border); border-radius: 12px; background: #fff; padding: .7rem .5rem; font-weight: 700; display: flex; flex-direction: column; align-items: center; gap: .25rem; font-size: .85rem; }
.pay-method i { font-size: 1.35rem; color: var(--rms-primary); }
.pay-method.active { border-color: var(--rms-primary); background: var(--rms-primary-50); }
.pay-line { background: #faf7f5; border-radius: 12px; padding: .75rem; margin-bottom: .5rem; }
.quick-cash { display: flex; flex-wrap: wrap; gap: .35rem; }
.quick-cash button { flex: 1; min-width: 70px; }
.pay-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; text-align: center; }
.pay-summary div { background: #faf7f5; border-radius: 12px; padding: .6rem; }
.pay-summary .lbl { font-size: .7rem; color: var(--rms-muted); font-weight: 700; text-transform: uppercase; }
.pay-summary .val { font-size: 1.15rem; font-weight: 800; }

.table-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: .5rem; }
.table-btn { border: 2px solid var(--rms-border); border-radius: 12px; background: #fff; padding: .7rem .4rem; font-weight: 700; }
.table-btn.busy { border-color: #fbbf24; background: #fffbeb; }
.table-btn.active { border-color: var(--rms-primary); background: var(--rms-primary-50); }

@media (max-width: 1199.98px) { .pos { grid-template-columns: 1fr 360px; } }
@media (max-width: 991.98px) {
    .pos { grid-template-columns: 1fr; height: auto; min-height: calc(100vh - 60px); }
    .pos-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); padding-bottom: 90px; }
    .pos-cart { position: fixed; inset: 60px 0 0 0; z-index: 1020; transform: translateY(100%); transition: transform .2s ease; }
    body.cart-open .pos-cart { transform: none; }
    .pos-cart-toggle { display: flex; position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 1025; justify-content: space-between; align-items: center; }
    body.cart-open .pos-cart-toggle { display: none; }
}

/* ==========================================================================
   Kitchen display
   ========================================================================== */
.kds { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.kds-ticket { background: #fff; border-radius: 14px; border: 1px solid var(--rms-border); box-shadow: var(--rms-shadow); overflow: hidden; display: flex; flex-direction: column; }
.kds-ticket .kds-head { padding: .75rem 1rem; display: flex; justify-content: space-between; align-items: center; background: #fcfaf8; border-bottom: 1px solid var(--rms-border); }
.kds-ticket.late .kds-head { background: #fef2f2; }
.kds-ticket .kds-no { font-weight: 800; font-size: 1.05rem; }
.kds-item { padding: .6rem 1rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; border-bottom: 1px dashed var(--rms-border); }
.kds-item .q { font-weight: 800; font-size: 1.05rem; min-width: 34px; }
.kds-item .n { flex: 1; font-weight: 600; }
.kds-item .note { display: block; font-size: .75rem; color: var(--rms-danger); font-weight: 600; }
.kds-item.st-ready .n { color: var(--rms-success); }
.kds-item.st-preparing .n { color: var(--rms-info); }

/* ==========================================================================
   Print (receipts / tickets / reports)
   ========================================================================== */
.print-only { display: none; }
@media print {
    .no-print, .app-sidebar, .app-topbar { display: none !important; }
    .print-only { display: block; }
    .app-main { margin: 0 !important; }
    .app-content { padding: 0 !important; }
    body { background: #fff !important; }
    .card { box-shadow: none !important; border: 0 !important; }
}