/* ==========================================================================
   CraveDash admin theme — Super Admin + Restaurant Admin
   Bootstrap 5.3 + CraveDash brand (logo greens #233D00 / #8CBE58)
   ========================================================================== */
:root{
  /* Crave Dash brand (new logo): navy + sky blue */
  --cd-navy:#081732; --cd-navy-2:#0f2447; --cd-blue:#0b84f3; --cd-blue-2:#0a6fd1; --cd-sky:#2fb4ff; --cd-blue-soft:#e9f4ff;
  --cd-dark:#081732; --cd-primary:#0b84f3; --cd-primary-2:#0a6fd1; --cd-green:#2fb4ff; --cd-green-2:#0b84f3; --cd-green-soft:#e9f4ff;
  --cd-bg:#f5f7fb; --cd-card:#fff; --cd-border:#e7eaf3; --cd-text:#1e2022; --cd-muted:#677788;
  --cd-radius:12px; --cd-shadow:0 6px 12px rgba(140,152,164,.075);
  --bs-primary:#0b84f3; --bs-primary-rgb:11,132,243; --bs-link-color:#0b84f3; --bs-link-hover-color:#0a6fd1;
  --bs-body-font-family:'Inter',system-ui,sans-serif; --bs-body-color:#1e2022; --bs-body-font-size:.875rem;
}
body{ background:var(--cd-bg); font-size:.875rem; }
h1,h2,h3,h4,h5,h6{ font-family:'Inter',sans-serif; color:var(--cd-text); font-weight:600; }
a{ color:var(--cd-primary); }
.btn-primary{ --bs-btn-bg:var(--cd-primary); --bs-btn-border-color:var(--cd-primary); --bs-btn-hover-bg:var(--cd-primary-2); --bs-btn-hover-border-color:var(--cd-primary-2); --bs-btn-active-bg:var(--cd-navy); --bs-btn-disabled-bg:#8cc4f6; --bs-btn-disabled-border-color:#8cc4f6; }
.btn-outline-primary{ --bs-btn-color:var(--cd-primary); --bs-btn-border-color:var(--cd-primary); --bs-btn-hover-bg:var(--cd-primary); --bs-btn-hover-border-color:var(--cd-primary); --bs-btn-active-bg:var(--cd-primary-2); }
.btn-success{ --bs-btn-bg:#00aa6d; --bs-btn-border-color:#00aa6d; --bs-btn-hover-bg:#008f5c; --bs-btn-hover-border-color:#008f5c; }
.btn{ font-weight:600; border-radius:6px; font-size:.85rem; }
.btn-reset{ background:#f1f3f7; color:#334257; border:0; }
.btn-reset:hover{ background:#e4e8ef; }
.form-control,.form-select{ border-radius:6px; border-color:#e1e5ee; font-size:.875rem; min-height:40px; }
.form-control:focus,.form-select:focus{ border-color:var(--cd-blue); box-shadow:0 0 0 .2rem rgba(11,132,243,.15); }
.form-check-input:checked{ background-color:var(--cd-primary); border-color:var(--cd-primary); }
.form-label{ font-weight:500; font-size:.82rem; color:#334257; margin-bottom:.35rem; }
.text-primary{ color:var(--cd-primary)!important; }
.bg-primary{ background-color:var(--cd-primary)!important; }
.dropdown-item.active,.dropdown-item:active{ background:var(--cd-primary); }

/* ---------------------------------------------------------------- shell (live layout: white sidebar 260px, white 60px navbar) */
.cd-shell{ display:flex; min-height:100vh; }
.cd-sidebar{ width:260px; flex:0 0 260px; background:#fff; border-right:1px solid var(--cd-border); position:sticky; top:0; height:100vh; display:flex; flex-direction:column; z-index:1040; transition:width .2s, flex-basis .2s; }
.sb-brand{ height:64px; padding:10px 14px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--cd-border); }
.sb-brand img{ height:34px; max-width:180px; object-fit:contain; }
.sb-brand img.rest-logo{ height:40px; }
.sb-collapse{ color:#8c98a4; }
.sb-search{ margin:12px 14px 6px; position:relative; }
.sb-search i{ position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#8c98a4; }
.sb-search input{ width:100%; background:#f5f7fb; border:1px solid var(--cd-border); border-radius:8px; padding:8px 10px 8px 32px; font-size:.82rem; outline:none; }
.sb-nav{ overflow-y:auto; padding:4px 10px 16px; flex:1; scrollbar-width:thin; scrollbar-color:#dfe3ea transparent; }
.sb-h{ font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:rgba(51,66,87,.5); padding:16px 10px 6px; }
.sb-link{ display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:6px; color:#334257; text-decoration:none; font-size:.86rem; font-weight:500; margin-bottom:1px; position:relative; }
.sb-link > i:first-child{ font-size:1rem; width:18px; text-align:center; color:#5b6b82; }
.sb-link:hover{ background:#f3f7fd; color:var(--cd-blue); }
.sb-link.active{ background:var(--cd-blue-soft); color:var(--cd-blue); font-weight:600; }
.sb-link.active::before{ content:''; position:absolute; left:-10px; top:6px; bottom:6px; width:3px; border-radius:0 3px 3px 0; background:var(--cd-blue); }
.sb-link.active > i:first-child{ color:var(--cd-blue); }
.sb-link.parent-active{ color:var(--cd-blue); }
.sb-txt{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sb-dot{ width:5px; height:5px; border-radius:50%; background:#b5bfcc; margin:0 6px 0 4px; flex:0 0 5px; }
.sb-link.active .sb-dot{ background:var(--cd-blue); }
.sb-caret{ font-size:.7rem; transition:transform .2s; color:#8c98a4; }
.sb-group.open > .sb-toggle .sb-caret{ transform:rotate(180deg); }
.sb-sub{ display:none; padding-left:14px; }
.sb-group.open > .sb-sub{ display:block; }
.sb-sub .sb-link{ font-size:.82rem; padding:6px 10px; }
.sb-badge{ margin-left:auto; background:#eef2f7; color:#334257; font-size:.68rem; font-weight:700; border-radius:99px; padding:1px 8px; }
.sb-badge.hot{ background:#ff6d6d; color:#fff; }
.sb-new{ font-size:.58rem; font-weight:800; background:linear-gradient(90deg,var(--cd-sky),var(--cd-blue)); color:#fff; padding:1px 5px; border-radius:4px; letter-spacing:.04em; }
.sb-addon{ font-size:.6rem; font-weight:700; background:#ff6d6d; color:#fff; padding:1px 6px; border-radius:99px; }
.sb-link.locked{ opacity:.45; }
.sb-foot{ border-top:1px solid var(--cd-border); padding:10px 14px; font-size:.72rem; color:#8c98a4; display:flex; align-items:center; gap:6px; }
.sb-foot img{ height:16px; }
body.sb-mini .cd-sidebar{ width:72px; flex-basis:72px; }
body.sb-mini .sb-txt, body.sb-mini .sb-h, body.sb-mini .sb-search, body.sb-mini .sb-badge, body.sb-mini .sb-caret, body.sb-mini .sb-new, body.sb-mini .sb-addon, body.sb-mini .sb-foot, body.sb-mini .sb-sub{ display:none!important; }
body.sb-mini .sb-brand img{ width:40px; object-fit:cover; object-position:left; }
.cd-main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.cd-top{ background:#fff; border-bottom:1px solid var(--cd-border); height:64px; padding:0 22px; display:flex; align-items:center; gap:12px; position:sticky; top:0; z-index:1030; box-shadow:0 1px 3px rgba(8,23,50,.04); }
.cd-top-title h1{ font-size:1.05rem; margin:0; font-weight:600; }
.btn-top{ background:#f5f7fb; border:1px solid var(--cd-border); color:#334257; font-weight:500; }
.btn-top:hover{ background:#eef2f7; }
.btn-epos{ background:linear-gradient(90deg,var(--cd-sky),var(--cd-blue)); color:#fff; border:0; }
.btn-epos:hover{ color:#fff; filter:brightness(1.05); }
.top-av{ width:32px; height:32px; border-radius:50%; background:var(--cd-navy); color:#fff; font-size:.72rem; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.top-dot{ position:absolute; top:-6px; right:-6px; background:#ff6d6d; color:#fff; font-size:.62rem; font-weight:700; border-radius:99px; padding:1px 6px; }
.super-flag{ position:fixed; top:6px; right:14px; z-index:1050; background:#00aa6d; color:#fff; font-size:.62rem; font-weight:800; letter-spacing:.04em; padding:3px 9px; border-radius:5px; pointer-events:none; opacity:.9; }
.cd-content{ padding:22px 24px; flex:1; }
.cd-foot{ padding:14px 24px; color:var(--cd-muted); font-size:.78rem; border-top:1px solid var(--cd-border); background:#fff; display:flex; gap:10px; flex-wrap:wrap; }
.cd-foot a{ color:var(--cd-muted); text-decoration:none; }
.cd-banners:empty{ display:none; }
.cd-banners{ padding:14px 24px 0; display:flex; flex-direction:column; gap:8px; }
.cd-banner{ display:flex; gap:10px; align-items:flex-start; padding:10px 14px; border-radius:10px; font-size:.85rem; }
.cd-banner.warn{ background:#fff7e6; color:#8a5300; border:1px solid #fde2a7; }
.cd-banner.danger{ background:#fdecec; color:#9b1c1c; border:1px solid #f8c9c9; }
.cd-banner.info{ background:#eaf3ff; color:#1e4a8a; border:1px solid #c9ddfb; }
.imp-banner{ display:flex; align-items:center; gap:14px; padding:14px 18px; border-radius:12px; color:#fff; background:linear-gradient(90deg,#5b3cc4,#7c3aed 55%,#a855f7); font-size:.84rem; box-shadow:0 10px 24px -14px rgba(91,60,196,.6); }
.imp-banner .btn-light{ color:#5b3cc4; font-weight:700; }
.cd-backdrop{ display:none; }
@media (max-width: 991.98px){
  .cd-sidebar{ position:fixed; left:0; top:0; transform:translateX(-100%); transition:transform .25s; }
  .cd-sidebar.open{ transform:none; }
  .cd-backdrop.show{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:1035; }
  .cd-content{ padding:16px; }
  .cd-top{ padding:0 12px; }
  .super-flag{ display:none; }
}

/* ---------------------------------------------------------------- live page patterns */
.page-header{ display:flex; align-items:center; gap:10px; margin-bottom:18px; flex-wrap:wrap; }
.page-header h1{ font-size:1.25rem; margin:0; display:flex; align-items:center; gap:10px; font-weight:600; }
.ph-ic{ width:34px; height:34px; border-radius:8px; background:var(--cd-blue-soft); color:var(--cd-blue); display:inline-flex; align-items:center; justify-content:center; font-size:1rem; }
.badge-count{ background:#eef2f7; color:#334257; font-size:.72rem; font-weight:700; border-radius:99px; padding:2px 9px; vertical-align:middle; }
.badge-soft{ display:inline-block; background:#eef2f7; color:#334257; font-size:.72rem; font-weight:600; border-radius:6px; padding:2px 8px; }
.inline-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:16px; border-bottom:1px solid var(--cd-border); padding-bottom:10px; }
.inline-tabs a{ padding:7px 14px; border-radius:6px; background:#fff; border:1px solid var(--cd-border); color:#334257; font-weight:500; text-decoration:none; font-size:.83rem; }
.inline-tabs a.active, .inline-tabs a:hover{ background:var(--cd-blue); border-color:var(--cd-blue); color:#fff; }
.nav-lang{ list-style:none; padding:0; display:flex; gap:16px; border-bottom:1px solid var(--cd-border); }
.nav-lang a{ display:inline-block; padding:8px 2px; color:var(--cd-muted); text-decoration:none; font-weight:500; border-bottom:2px solid transparent; margin-bottom:-1px; }
.nav-lang a.active{ color:var(--cd-blue); border-bottom-color:var(--cd-blue); }
.sec-title{ font-size:.95rem; font-weight:600; display:flex; align-items:center; gap:8px; padding-bottom:8px; border-bottom:1px solid var(--cd-border); margin-bottom:14px; }
.sec-title i{ color:var(--cd-blue); }
.tbl-head{ display:flex; align-items:center; gap:10px; padding:16px 18px; flex-wrap:wrap; border-bottom:1px solid var(--cd-border); }
.tbl-head h5{ margin:0; font-size:1rem; }
.tbl-foot{ padding:12px 18px; display:flex; justify-content:flex-end; }
.tbl-foot:empty{ padding:0; }
.search-box{ display:flex; align-items:stretch; }
.search-box .form-control{ padding-left:34px; border-top-right-radius:0; border-bottom-right-radius:0; min-width:220px; }
.search-box .btn-search{ border-top-left-radius:0; border-bottom-left-radius:0; }
.search-box:not(:has(.btn-search)) .form-control{ border-radius:6px; }
.tbl-img{ width:44px; height:44px; object-fit:cover; border-radius:8px; border:1px solid var(--cd-border); background:#f5f7fb; }
.btn-action{ width:32px; height:32px; padding:0; display:inline-flex; align-items:center; justify-content:center; border-radius:6px; font-size:.85rem; }
.btn-edit{ color:var(--cd-blue); border:1px solid rgba(11,132,243,.35); background:#fff; }
.btn-edit:hover{ background:var(--cd-blue); color:#fff; }
.btn-del{ color:#ff6d6d; border:1px solid rgba(255,109,109,.4); background:#fff; }
.btn-del:hover{ background:#ff6d6d; color:#fff; }
.btn-view{ color:#00aa6d; border:1px solid rgba(0,170,109,.35); background:#fff; }
.btn-view:hover{ background:#00aa6d; color:#fff; }
.upload-box{ border:2px dashed #d5dbe6; border-radius:10px; min-height:150px; display:flex; align-items:center; justify-content:center; cursor:pointer; background:#fafbfd; overflow:hidden; }
.upload-box:hover{ border-color:var(--cd-blue); }
.upload-prev{ display:flex; flex-direction:column; align-items:center; gap:6px; color:#8c98a4; font-size:.82rem; }
.upload-prev i{ font-size:2rem; }
.upload-prev img{ max-width:100%; max-height:180px; object-fit:contain; }
.perm-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:6px 14px; border:1px solid var(--cd-border); border-radius:8px; padding:12px; }
.alert-soft{ background:var(--cd-blue-soft); border:1px solid #cfe6fd; color:#0b4a8a; border-radius:10px; }
.stat-card{ background:#fff; border:1px solid var(--cd-border); border-radius:12px; padding:18px; display:flex; align-items:center; justify-content:space-between; box-shadow:var(--cd-shadow); height:100%; }
.stat-card .sc-ic{ width:44px; height:44px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.stat-card .sc-v{ font-size:1.6rem; font-weight:700; }
.stat-card .sc-l{ font-weight:600; font-size:.85rem; }
.stat-card .sc-d{ font-size:.75rem; color:#00aa6d; font-weight:600; }
.order-stat{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-radius:10px; background:#fff; border:1px solid var(--cd-border); text-decoration:none; color:var(--cd-text); height:100%; }
.order-stat:hover{ border-color:var(--cd-blue); }
.order-stat .os-l{ display:flex; align-items:center; gap:10px; font-weight:600; font-size:.85rem; }
.order-stat .os-l img, .order-stat .os-l i{ width:28px; font-size:1.2rem; }
.order-stat .os-v{ font-size:1.25rem; font-weight:700; }

/* ---------------------------------------------------------------- cards / page parts */
.card-cd{ background:var(--cd-card); border:1px solid var(--cd-border); border-radius:var(--cd-radius); box-shadow:var(--cd-shadow); padding:18px; }
.card-cd + .card-cd{ margin-top:18px; }
.card-cd .card-h{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
.card-cd .card-h h5, .card-cd .card-h h6{ margin:0; font-weight:700; }
.card-flush{ padding:0; overflow:hidden; }
.card-flush .card-h{ padding:16px 18px 0; }
.page-actions{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:16px; }
.kpi{ background:#fff; border:1px solid var(--cd-border); border-radius:var(--cd-radius); padding:16px; display:flex; gap:14px; align-items:center; box-shadow:var(--cd-shadow); height:100%; }
.kpi .ic{ width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; flex:0 0 46px; }
.kpi .v{ font-size:1.35rem; font-weight:800; font-family:'Poppins',sans-serif; color:var(--cd-text); line-height:1.1; }
.kpi .l{ font-size:.75rem; color:var(--cd-muted); font-weight:600; }
.kpi .d{ font-size:.72rem; font-weight:700; }
.kpi .d.up{ color:#2e8b3a; } .kpi .d.down{ color:#dc2626; }
.ic-green{ background:#e9f4ff; color:#0b84f3; } .ic-blue{ background:#e6f0ff; color:#1d4ed8; } .ic-amber{ background:#fff4dc; color:#b45309; }
.ic-red{ background:#fde8ea; color:#c81e3a; } .ic-purple{ background:#f1e8ff; color:#7c3aed; } .ic-teal{ background:#e0f7f6; color:#0f766e; }
.status-tile{ border-radius:12px; padding:12px 14px; background:#f6f8f3; border:1px solid var(--cd-border); display:flex; align-items:center; justify-content:space-between; text-decoration:none; color:var(--cd-text); }
.status-tile:hover{ border-color:var(--cd-green); }
.status-tile b{ font-size:1.25rem; }
.chart-box{ position:relative; height:290px; }
.chart-box.sm{ height:230px; }
.seg{ display:inline-flex; background:#f0f3ec; border-radius:10px; padding:3px; }
.seg button{ border:0; background:none; font-size:.78rem; font-weight:600; padding:5px 12px; border-radius:8px; color:#56604d; }
.seg button.active{ background:#fff; color:var(--cd-dark); box-shadow:0 1px 3px rgba(0,0,0,.1); }
.legend-row{ display:flex; align-items:center; justify-content:space-between; font-size:.82rem; padding:5px 0; }
.legend-row .dot{ width:10px; height:10px; border-radius:3px; display:inline-block; margin-right:8px; }

/* tabs */
.nav-cd{ display:flex; gap:4px; border-bottom:1px solid var(--cd-border); margin-bottom:18px; flex-wrap:wrap; }
.nav-cd a, .nav-cd button{ border:0; background:none; padding:10px 14px; font-weight:600; font-size:.86rem; color:var(--cd-muted); border-bottom:2px solid transparent; margin-bottom:-1px; text-decoration:none; display:inline-flex; gap:6px; align-items:center; }
.nav-cd a.active, .nav-cd button.active{ color:var(--cd-dark); border-bottom-color:var(--cd-green-2); }
.nav-cd .cnt{ background:#eef1ea; border-radius:99px; font-size:.7rem; padding:0 7px; }
.pill-filter{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--cd-border); background:#fff; border-radius:99px; padding:5px 12px; font-size:.8rem; font-weight:600; color:#3b4632; cursor:pointer; white-space:nowrap; }
.pill-filter .cnt{ background:#eef1ea; border-radius:99px; padding:0 7px; font-size:.7rem; }
.pill-filter.active{ background:var(--cd-dark); border-color:var(--cd-dark); color:#fff; }
.pill-filter.active .cnt{ background:rgba(255,255,255,.2); }

/* tables */
.table-cd{ margin:0; font-size:.85rem; }
.table-cd thead th{ background:#f7f9f4; color:#5b6552; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; font-weight:700; border-bottom:1px solid var(--cd-border); padding:10px 12px; white-space:nowrap; }
.table-cd tbody td{ padding:11px 12px; vertical-align:middle; border-color:#eef1ea; }
.table-cd tbody tr:hover{ background:#fafcf8; }
.table-cd tr.row-new{ background:#fff8f0; box-shadow:inset 3px 0 0 #f97316; }
.table-responsive{ border-radius:0 0 var(--cd-radius) var(--cd-radius); }
.empty-state{ text-align:center; padding:40px 10px; color:var(--cd-muted); }
.empty-state i{ font-size:2.4rem; display:block; margin-bottom:6px; opacity:.6; }

/* status badges — admin order structure */
.st-badge{ display:inline-flex; align-items:center; gap:4px; padding:3px 10px; border-radius:99px; font-size:.72rem; font-weight:700; white-space:nowrap; }
.st-pending{ background:#fff1e6; color:#c2410c; }
.st-confirmed{ background:#e6f0ff; color:#1d4ed8; }
.st-processing{ background:#fff7d6; color:#a16207; }
.st-ready{ background:#e0f7f6; color:#0f766e; }
.st-out{ background:#f1e8ff; color:#7c3aed; }
.st-done{ background:#e3f5e1; color:#1f7a2e; }
.st-canceled{ background:#fde8ea; color:#b91c1c; }
.pay-badge{ font-size:.7rem; font-weight:700; padding:2px 8px; border-radius:6px; }
.pay-paid{ background:#e3f5e1; color:#1f7a2e; } .pay-unpaid{ background:#fde8ea; color:#b91c1c; }
.src-chip{ display:inline-flex; align-items:center; gap:4px; font-size:.7rem; font-weight:700; padding:2px 8px; border-radius:6px; background:#f0f2ee; color:#4b5563; white-space:nowrap; }
.src-web{ background:#e0edff; color:#1d4ed8; } .src-app{ background:#eee0fb; color:#7c3aed; } .src-table{ background:#fdf1d6; color:#b45309; } .src-pos{ background:#dcf5e3; color:#0f7a3a; }

/* order details */
.timeline{ list-style:none; padding:0; margin:0; }
.timeline li{ position:relative; padding:0 0 14px 22px; font-size:.82rem; }
.timeline li::before{ content:''; position:absolute; left:5px; top:5px; width:9px; height:9px; border-radius:50%; background:var(--cd-green-2); }
.timeline li::after{ content:''; position:absolute; left:9px; top:16px; bottom:0; width:1px; background:#dfe6d6; }
.timeline li:last-child::after{ display:none; }
.flow{ display:flex; align-items:flex-start; margin:8px 0 4px; }
.flow .fs{ flex:1; text-align:center; position:relative; font-size:.7rem; font-weight:600; color:#94a095; }
.flow .fs .dt{ width:26px; height:26px; border-radius:50%; background:#e9eee3; margin:0 auto 4px; display:flex; align-items:center; justify-content:center; font-size:.8rem; color:#94a095; position:relative; z-index:1; }
.flow .fs::before{ content:''; position:absolute; top:13px; left:-50%; width:100%; height:2px; background:#e9eee3; }
.flow .fs:first-child::before{ display:none; }
.flow .fs.done{ color:var(--cd-dark); } .flow .fs.done .dt{ background:var(--cd-green); color:var(--cd-dark); } .flow .fs.done::before{ background:var(--cd-green); }
.flow .fs.cur .dt{ box-shadow:0 0 0 4px rgba(47,180,255,.3); }

/* new-order popup */
.new-order-modal .modal-content{ border:0; border-radius:18px; overflow:hidden; }
.no-head{ background:linear-gradient(135deg,#f97316,#e63950); color:#fff; border:0; }
.no-head h5{ color:#fff; }
.no-bell{ width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; font-size:1.4rem; animation:ring 1.2s infinite; }
@keyframes ring{ 0%,100%{ transform:rotate(0) } 10%{ transform:rotate(14deg) } 20%{ transform:rotate(-12deg) } 30%{ transform:rotate(8deg) } 40%{ transform:rotate(0) } }

/* colour swatches (category) */
.swatch{ width:26px; height:26px; border-radius:8px; display:inline-block; border:2px solid #fff; box-shadow:0 0 0 1px #d6dccf; vertical-align:middle; cursor:pointer; }
.swatch.sel{ box-shadow:0 0 0 2px var(--cd-dark); }
.cat-chip{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; padding:5px 12px; border-radius:8px; font-weight:700; font-size:.78rem; color:#fff; }
.cat-preview{ display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:8px; }
.cat-preview .cp{ border-radius:10px; padding:10px; color:#fff; font-weight:700; font-size:.78rem; min-height:54px; display:flex; align-items:flex-end; }

/* permission tree */
.ptree{ list-style:none; padding-left:0; margin:0; }
.ptree > li{ border:1px solid var(--cd-border); border-radius:12px; margin-bottom:8px; background:#fff; }
.ptree .pt-head{ display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; }
.ptree .pt-head .bi-chevron-right{ transition:transform .2s; color:var(--cd-muted); }
.ptree li.open > .pt-head .bi-chevron-right{ transform:rotate(90deg); }
.ptree ul{ list-style:none; margin:0; padding:0 12px 10px 46px; display:none; position:relative; }
.ptree li.open > ul{ display:block; }
.ptree ul::before{ content:''; position:absolute; left:26px; top:0; bottom:18px; border-left:1px dashed #c6d1bb; }
.ptree ul li{ position:relative; padding:4px 0; }
.ptree ul li::before{ content:''; position:absolute; left:-20px; top:50%; width:14px; border-top:1px dashed #c6d1bb; }
.ptree .pt-count{ margin-left:auto; font-size:.72rem; font-weight:700; color:var(--cd-muted); }
.org-tree{ display:flex; flex-direction:column; align-items:center; gap:0; overflow-x:auto; padding:10px 0; }
.org-node{ background:#fff; border:1px solid var(--cd-border); border-radius:12px; padding:8px 12px; font-size:.78rem; font-weight:600; text-align:center; box-shadow:var(--cd-shadow); white-space:nowrap; }
.org-root{ background:var(--cd-dark); color:#fff; border-color:var(--cd-dark); }
.org-level{ display:flex; gap:10px; justify-content:center; position:relative; padding-top:18px; flex-wrap:nowrap; }
.org-level::before{ content:''; position:absolute; top:0; left:50%; height:18px; border-left:1px solid #c6d1bb; }
.org-col{ display:flex; flex-direction:column; align-items:center; gap:6px; position:relative; }
.org-col .org-leaf{ font-size:.7rem; background:#e9f4ff; color:#0a6fd1; border-radius:6px; padding:2px 8px; white-space:nowrap; }
.org-col .org-leaf.off{ background:#f3f4f2; color:#a3a9a0; text-decoration:line-through; }

/* plans */
.plan-card{ border:1px solid var(--cd-border); border-radius:16px; background:#fff; padding:20px; height:100%; position:relative; box-shadow:var(--cd-shadow); display:flex; flex-direction:column; }
.plan-card.popular{ border:2px solid var(--cd-green-2); }
.plan-card .ribbon{ position:absolute; top:-11px; right:16px; background:var(--cd-green-2); color:#fff; font-size:.68rem; font-weight:700; padding:3px 10px; border-radius:99px; }
.plan-price{ font-size:2rem; font-weight:800; font-family:'Poppins',sans-serif; }
.plan-card ul{ padding-left:0; list-style:none; font-size:.84rem; }
.plan-card ul li{ padding:4px 0; } .plan-card ul li i{ color:var(--cd-green-2); margin-right:6px; }

/* misc */
.mini-stat{ font-size:.78rem; color:var(--cd-muted); } .mini-stat b{ color:var(--cd-text); font-size:.95rem; }
.kv{ display:flex; justify-content:space-between; padding:6px 0; border-bottom:1px dashed #e6ebe0; font-size:.85rem; }
.kv:last-child{ border-bottom:0; }
.kv.total{ font-weight:800; font-size:.95rem; border-top:2px solid var(--cd-text); border-bottom:0; margin-top:4px; padding-top:8px; }
.receipt{ font-family:'Courier New',monospace; font-size:12.5px; background:#fff; border:1px dashed #cfd6c7; border-radius:10px; padding:16px; max-width:380px; margin:0 auto; color:#000; }
.receipt .r-line{ display:flex; justify-content:space-between; gap:10px; padding:1px 0; }
.receipt hr{ border:0; border-top:1px dashed #000; opacity:1; margin:6px 0; }
.receipt .c{ text-align:center; }
.editor-wrap .ql-toolbar{ border-radius:10px 10px 0 0; border-color:#dde3d6; background:#fafcf8; }
.editor-wrap .ql-container{ border-radius:0 0 10px 10px; border-color:#dde3d6; min-height:320px; font-size:.95rem; }
.terms-preview{ max-height:420px; overflow:auto; border:1px solid var(--cd-border); border-radius:12px; padding:16px; background:#fcfdfb; }
.access-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; }
.access-tile{ border:1px solid var(--cd-border); border-radius:12px; padding:12px; display:flex; gap:10px; align-items:flex-start; }
.access-tile i.bi-big{ font-size:1.3rem; color:var(--cd-primary); }
.search-box{ position:relative; } .search-box i{ position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#9aa392; }
.search-box input{ padding-left:34px; }
.code-mask{ font-family:ui-monospace,Consolas,monospace; font-size:.82rem; background:#f5f7f2; border:1px solid var(--cd-border); border-radius:8px; padding:6px 10px; }
.progress-thin{ height:6px; border-radius:99px; }
.login-bg{ min-height:100vh; background:radial-gradient(1200px 500px at 10% 0%, #dcefff 0%, transparent 60%), radial-gradient(900px 500px at 100% 100%, #e3ecff 0%, transparent 60%), #f5f7fb; }
.form-check-input:indeterminate{ background-color:var(--cd-green-2); border-color:var(--cd-green-2); }
.org-tree{ align-items:safe center; }
.org-level{ justify-content:safe center; }
.org-level .org-col > .org-node{ white-space:normal; width:112px; font-size:.74rem; }
@media (max-width: 767.98px){ .cd-top-title .small{ display:none; } .cd-top-title h1{ font-size:1rem; } }
.order-stat{gap:10px}
.stat-card .sc-ic{ background:var(--cd-blue-soft); color:var(--cd-blue); flex:0 0 44px; }
.stat-card .sc-v{ font-size:1.35rem; }
.stat-card .sc-d{ color:#64748b; }
.cd-back{ width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; margin-right:4px; }
.vegmark{ display:inline-block; width:13px; height:13px; border:2px solid; border-radius:3px; position:relative; vertical-align:-1px; margin-right:5px; }
.vegmark::after{ content:''; position:absolute; inset:2px; border-radius:50%; }
.vegmark.veg{ border-color:#16a34a; } .vegmark.veg::after{ background:#16a34a; }
.vegmark.nonveg{ border-color:#dc2626; } .vegmark.nonveg::after{ background:#dc2626; border-radius:0; clip-path:polygon(50% 0,100% 100%,0 100%); }

/* ---- v5: collapsible sidebar sections (heading → arrow) ---- */
.sb-h-toggle{ display:flex; align-items:center; cursor:pointer; user-select:none; border-radius:8px; }
.sb-h-toggle:hover{ color:#0b84f3; background:#f4f8fd; }
.sb-h-caret{ margin-left:auto; font-size:.7rem; transition:transform .2s; }
.sb-sec.closed .sb-h-caret{ transform:rotate(-90deg); }
.sb-sec.closed:not(.searching) .sb-sec-body{ display:none; }
body.sb-mini .sb-sec.closed .sb-sec-body{ display:block; }
/* service / access tree (super admin restaurant form + restaurant users) */
.svc-tree .rt-sec{ font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#94a3b8; margin:12px 0 6px; display:flex; align-items:center; gap:6px; }
.svc-tree .rt-grp{ border:1px solid #e3ebf5; border-radius:10px; margin-bottom:6px; background:#fff; }
.svc-tree .rt-grp.on{ border-color:#9fd0ff; background:#f7fbff; }
.svc-tree .rt-gh{ display:flex; align-items:center; gap:8px; padding:7px 10px; font-weight:700; font-size:13px; cursor:pointer; }
.svc-tree .rt-gh .cnt{ margin-left:auto; font-size:11px; color:#64748b; background:#f1f5f9; border-radius:99px; padding:1px 8px; }
.svc-tree .rt-leaves{ display:flex; flex-wrap:wrap; gap:6px; padding:0 10px 9px 34px; }
.svc-tree .rt-leaves label{ font-size:12px; padding:3px 9px; border-radius:8px; background:#f1f5f9; border:1px solid #e2e8f0; cursor:pointer; display:inline-flex; gap:5px; align-items:center; }
.svc-tree .rt-leaves label.on{ background:#e0efff; border-color:#b9dcff; color:#0a4f96; font-weight:600; }
.svc-tree .rt-grp.fold .rt-leaves{ display:none; }
.wd-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px; }
.wd-grid label{ display:flex; gap:8px; align-items:center; padding:8px 10px; border:1px solid #e3ebf5; border-radius:10px; font-size:13px; cursor:pointer; background:#fff; }
.wd-grid label.on{ border-color:#9fd0ff; background:#f7fbff; font-weight:600; }
.wd-grid label.na{ opacity:.5; cursor:not-allowed; }
.chk-list{ display:flex; flex-wrap:wrap; gap:6px; padding:8px; border:1px solid #e3ebf5; border-radius:10px; background:#fbfdff; max-height:220px; overflow:auto; }
.chk-item{ display:inline-flex; align-items:center; gap:6px; padding:5px 10px; border:1px solid #e2e8f0; border-radius:8px; background:#fff; font-size:13px; cursor:pointer; margin:0; }
.chk-item.on{ background:#e0efff; border-color:#b9dcff; color:#0a4f96; font-weight:600; }
/* discount tree */
.dt-scope{ display:flex; align-items:center; gap:8px; padding:8px 12px; border:1.5px solid #e3ebf5; border-radius:10px; cursor:pointer; background:#fff; margin:0; flex:1 1 220px; }
.dt-scope i{ font-size:1.2rem; color:#0b84f3; }
.dt-scope.on{ border-color:#0b84f3; background:#f2f8ff; }
.dt-grp{ border:1px solid #e3ebf5; border-radius:10px; margin-bottom:6px; background:#fff; }
.dt-gh{ display:flex; align-items:center; gap:8px; padding:7px 10px; cursor:pointer; font-size:13px; }
.dt-dot{ width:10px; height:10px; border-radius:50%; flex:0 0 10px; }
.dt-cnt{ margin-left:auto; font-size:11px; color:#64748b; background:#f1f5f9; border-radius:99px; padding:1px 8px; }
.dt-leaves{ display:flex; flex-wrap:wrap; gap:6px; padding:0 10px 9px 34px; }
.dt-leaves label{ font-size:12px; padding:3px 9px; border-radius:8px; background:#f1f5f9; border:1px solid #e2e8f0; cursor:pointer; display:inline-flex; gap:5px; align-items:center; margin:0; }
.dt-leaves label.on{ background:#e0efff; border-color:#b9dcff; color:#0a4f96; font-weight:600; }
.dt-grp.fold .dt-leaves{ display:none; }
.dt-cats{ max-height:420px; overflow:auto; }
/* reject reasons (shared confirm box) */
.cd-reasons{ display:flex; flex-wrap:wrap; gap:6px; }
.cd-reasons button{ border:1.5px solid #e2e8f0; background:#fff; border-radius:10px; padding:7px 10px; font-size:.8rem; font-weight:700; color:#334155; }
.cd-reasons button.on{ border-color:#dc2626; background:#fef2f2; color:#b91c1c; }
/* v10 sidebar expand / collapse all */
.sb-expand{ display:flex; gap:6px; padding:0 14px 8px; }
.sb-expand button{ flex:1; border:1px solid #e3ebf5; background:#f8fafc; border-radius:8px; font-size:.72rem; font-weight:700; color:#475569; padding:5px 4px; }
.sb-expand button:hover{ background:#eef6ff; color:#0b84f3; }