/*
 * Command-centre interface
 * A locally hosted, dark restaurant-console visual system. It deliberately
 * contains no remote fonts, images or icon dependencies, so it still works on
 * shared hosting and inside the PWA shell.
 */
:root {
  --cc-bg: #0b0d20;
  --cc-bg-deep: #090a19;
  --cc-sidebar: #101229;
  --cc-surface: #171a37;
  --cc-surface-2: #1d2042;
  --cc-surface-3: #252950;
  --cc-line: rgba(217, 220, 255, .105);
  --cc-line-strong: rgba(217, 220, 255, .18);
  --cc-text: #f6f7ff;
  --cc-muted: #a2a8ca;
  --cc-faint: #747b9f;
  --cc-violet: #7d2ae8;
  --cc-purple: #a83ce9;
  --cc-pink: #ef4b9b;
  --cc-blue: #4788ff;
  --cc-cyan: #32c5e8;
  --cc-green: #25c88a;
  --cc-amber: #ffb525;
  --cc-danger: #ff6377;
  --cc-shadow: 0 16px 38px rgba(0, 0, 0, .24);
}

.app-theme-command {
  --bs-body-bg: var(--cc-bg);
  --bs-body-color: var(--cc-text);
  --bs-border-color: var(--cc-line);
  --bs-primary: var(--cc-violet);
  --bs-primary-rgb: 125, 42, 232;
  --bs-link-color: #c68cff;
  --bs-link-hover-color: #ecbbff;
  background:
    radial-gradient(circle at 94% -10%, rgba(119, 40, 230, .25), transparent 27rem),
    radial-gradient(circle at 11% 36%, rgba(43, 105, 228, .10), transparent 32rem),
    var(--cc-bg);
  color: var(--cc-text);
  min-height: 100vh;
}

.app-theme-command ::selection { background: rgba(185, 73, 240, .48); color: #fff; }
.app-theme-command a { color: #c58cff; }
.app-theme-command a:hover { color: #efc3ff; }
.app-theme-command h1,
.app-theme-command h2,
.app-theme-command h3,
.app-theme-command h4,
.app-theme-command h5,
.app-theme-command h6 { color: var(--cc-text); }
.app-theme-command .text-secondary { color: var(--cc-muted) !important; }
.app-theme-command .text-muted { color: var(--cc-faint) !important; }
.app-theme-command .text-dark { color: var(--cc-text) !important; }
.app-theme-command .border,
.app-theme-command .border-top,
.app-theme-command .border-bottom,
.app-theme-command .border-start,
.app-theme-command .border-end { border-color: var(--cc-line) !important; }
.app-theme-command hr { border-color: var(--cc-line); opacity: 1; }

/* Shell */
.app-theme-command .topbar {
  background: rgba(12, 13, 31, .94) !important;
  border-color: var(--cc-line) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .22);
  backdrop-filter: blur(15px);
}
.app-theme-command .brand-link { color: #fbfaff; font-weight: 850; }
.app-theme-command .brand-mark {
  background: linear-gradient(135deg, #b947eb, #6f2aec 74%);
  box-shadow: 0 5px 14px rgba(150, 55, 232, .36);
  color: #fff;
}
.app-theme-command .demo-badge,
.app-theme-command .demo-badge-dark {
  background: linear-gradient(135deg, #ffbe34, #ff8d3a);
  box-shadow: 0 3px 9px rgba(255, 155, 38, .22);
  color: #23152a;
}
.app-theme-command .connection-offline { background: rgba(255, 181, 37, .18); color: #ffd36e; }
.app-theme-command .app-main { min-height: calc(100vh - 64px); }
.app-theme-command .app-footer { color: var(--cc-faint); }

.app-theme-command .nav-canvas { --bs-offcanvas-bg: var(--cc-sidebar); --bs-offcanvas-color: var(--cc-text); border-color: var(--cc-line); }
.app-theme-command .side-nav { background: var(--cc-sidebar); border-color: var(--cc-line); }
.app-theme-command .nav-entry {
  color: #b9bfdb;
  font-size: .9rem;
  margin: .22rem 0;
  padding: .72rem .8rem;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.app-theme-command .nav-entry .ti-icon { color: #9ba2c7; }
.app-theme-command .nav-entry:hover { background: rgba(151, 61, 238, .11); color: #fff; transform: translateX(2px); }
.app-theme-command .nav-entry:hover .ti-icon { color: #d397ff; }
.app-theme-command .nav-entry.active {
  background: linear-gradient(100deg, rgba(129, 41, 232, .94), rgba(201, 47, 174, .88));
  box-shadow: 0 9px 20px rgba(108, 38, 207, .24);
  color: #fff;
}
.app-theme-command .nav-entry.active .ti-icon { color: #fff; }
.app-theme-command .nav-phase-note { background: rgba(78, 91, 152, .22); border: 1px solid var(--cc-line); color: #c7cdec; }
.app-theme-command .offcanvas-header { border-color: var(--cc-line) !important; }
.app-theme-command .btn-close { filter: invert(1) grayscale(1) brightness(2); }

/* Buttons, fields and shared surfaces */
.app-theme-command .btn { border-radius: .7rem; font-weight: 750; letter-spacing: -.01em; }
.app-theme-command .btn-primary {
  --bs-btn-bg: #842ce9;
  --bs-btn-border-color: #842ce9;
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: #9e36eb;
  --bs-btn-hover-border-color: #9e36eb;
  --bs-btn-active-bg: #7124d1;
  --bs-btn-active-border-color: #7124d1;
  background-image: linear-gradient(112deg, #7c2ae7, #e13fa7);
  box-shadow: 0 8px 17px rgba(121, 39, 224, .23);
}
.app-theme-command .btn-primary:hover { background-image: linear-gradient(112deg, #8e31ed, #ee4cab); }
.app-theme-command .btn-outline-primary {
  --bs-btn-color: #cf98ff;
  --bs-btn-border-color: rgba(197, 127, 255, .68);
  --bs-btn-hover-bg: rgba(145, 45, 234, .17);
  --bs-btn-hover-border-color: #d7a8ff;
  --bs-btn-hover-color: #f5eaff;
  --bs-btn-active-bg: rgba(145, 45, 234, .3);
  --bs-btn-active-border-color: #d7a8ff;
}
.app-theme-command .btn-success {
  --bs-btn-bg: #169d6c;
  --bs-btn-border-color: #169d6c;
  --bs-btn-hover-bg: #1bb97c;
  --bs-btn-hover-border-color: #1bb97c;
  --bs-btn-active-bg: #0e8056;
  --bs-btn-active-border-color: #0e8056;
}
.app-theme-command .btn-warning {
  --bs-btn-bg: #e9a51d;
  --bs-btn-border-color: #e9a51d;
  --bs-btn-color: #25190b;
  --bs-btn-hover-bg: #ffbd31;
  --bs-btn-hover-border-color: #ffbd31;
  --bs-btn-hover-color: #25190b;
}
.app-theme-command .btn-danger { --bs-btn-bg: #c43e5d; --bs-btn-border-color: #c43e5d; --bs-btn-hover-bg: #db4a6b; --bs-btn-hover-border-color: #db4a6b; }
.app-theme-command .btn-dark { --bs-btn-bg: #292e58; --bs-btn-border-color: #414778; --bs-btn-hover-bg: #373e70; --bs-btn-hover-border-color: #555e95; }
.app-theme-command .btn-light { --bs-btn-bg: #242848; --bs-btn-border-color: #3d4269; --bs-btn-color: #eef0ff; --bs-btn-hover-bg: #30355c; --bs-btn-hover-border-color: #555b87; --bs-btn-hover-color: #fff; }
.app-theme-command .btn-outline-light { --bs-btn-color: #eef0ff; --bs-btn-border-color: rgba(244, 245, 255, .45); --bs-btn-hover-color: #121427; --bs-btn-hover-bg: #f3f4ff; --bs-btn-hover-border-color: #f3f4ff; }

.app-theme-command .form-control,
.app-theme-command .form-select {
  background-color: #10132b;
  border-color: #353b65;
  color: var(--cc-text);
}
.app-theme-command .form-control::placeholder { color: #747ca5; }
.app-theme-command .form-control:focus,
.app-theme-command .form-select:focus {
  background-color: #121632;
  border-color: #b250ef;
  box-shadow: 0 0 0 .22rem rgba(178, 80, 239, .18);
  color: #fff;
}
.app-theme-command .form-select { background-image: var(--bs-form-select-bg-img); }
.app-theme-command select option { background: #151936; color: #f4f5ff; }
.app-theme-command .input-group-text { background: #252a50; border-color: #353b65; color: #c5cbed; }
.app-theme-command .form-check-input { background-color: #151936; border-color: #535b8b; }
.app-theme-command .form-check-input:checked { background-color: #9133ea; border-color: #b256f4; }

.app-theme-command .card,
.app-theme-command .modal-content,
.app-theme-command .dropdown-menu {
  background: linear-gradient(145deg, rgba(28, 31, 65, .96), rgba(20, 23, 51, .98));
  border: 1px solid var(--cc-line);
  box-shadow: var(--cc-shadow);
  color: var(--cc-text);
}
.app-theme-command .card-header,
.app-theme-command .card-footer,
.app-theme-command .bg-white { background-color: transparent !important; border-color: var(--cc-line) !important; color: var(--cc-text); }
.app-theme-command .dropdown-item { color: #d9ddf7; }
.app-theme-command .dropdown-item:hover,
.app-theme-command .dropdown-item:focus { background: rgba(145, 47, 232, .16); color: #fff; }
.app-theme-command .eyebrow { color: #b681ec; }
.app-theme-command .page-heading h1 { color: #fafaff; }
.app-theme-command .page-heading p { color: var(--cc-muted) !important; }

.app-theme-command .alert {
  --bs-alert-border-radius: .85rem;
  border: 1px solid var(--cc-line);
  box-shadow: 0 9px 20px rgba(0, 0, 0, .12);
}
.app-theme-command .alert-success { background: rgba(34, 194, 135, .13); border-color: rgba(48, 224, 159, .28); color: #b5f5d7; }
.app-theme-command .alert-info { background: rgba(58, 136, 255, .13); border-color: rgba(87, 154, 255, .3); color: #c1dafe; }
.app-theme-command .alert-warning { background: rgba(255, 181, 37, .13); border-color: rgba(255, 190, 59, .3); color: #ffe1a3; }
.app-theme-command .alert-danger { background: rgba(244, 80, 109, .14); border-color: rgba(255, 112, 137, .3); color: #ffc0cb; }
.app-theme-command .alert .btn-close { opacity: .75; }

.app-theme-command .table {
  --bs-table-color: #e9ebff;
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--cc-line);
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: rgba(144, 51, 227, .10);
  --bs-table-striped-color: #e9ebff;
  --bs-table-striped-bg: rgba(255, 255, 255, .018);
  color: #e9ebff;
}
.app-theme-command .table > :not(caption) > * > * { box-shadow: none; }
.app-theme-command .table thead th { color: #abb2d7; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.app-theme-command .table td small { color: var(--cc-muted) !important; }
.app-theme-command .table-hover > tbody > tr:hover > * { color: #fff; }

/* Dashboard reference-style command centre */
.command-dashboard { margin: 0 auto; max-width: 1720px; }
.command-heading { padding: .1rem 0 .35rem; }
.command-kicker { align-items: center; color: #b881ea; display: inline-flex; font-size: .68rem; font-weight: 850; gap: .4rem; letter-spacing: .105em; text-transform: uppercase; }
.command-kicker .ti-icon { color: #e0b1ff; font-size: 1rem; }
.command-heading h1 { color: #fafaff; font-size: clamp(1.9rem, 3vw, 2.65rem); font-weight: 850; letter-spacing: -.055em; }
.command-heading p { color: var(--cc-muted); font-size: .92rem; }
.command-actions .btn { min-height: 42px; padding-inline: 1rem; }
.command-new-order { min-width: 132px; }
.command-metrics .metric-card {
  background: linear-gradient(135deg, #1b1e40, #161936);
  border: 1px solid rgba(197, 204, 255, .10);
  border-radius: 1rem;
  box-shadow: 0 11px 25px rgba(0, 0, 0, .14);
  min-height: 154px;
  overflow: hidden;
  padding: 1.05rem 1.1rem .95rem;
  position: relative;
}
.command-metrics .metric-card::after { background: radial-gradient(circle, currentColor 0, transparent 68%); content: ''; filter: blur(2px); height: 100px; opacity: .09; pointer-events: none; position: absolute; right: -33px; top: -45px; width: 100px; }
.metric-card-top { align-items: center; display: flex; gap: .7rem; }
.command-metrics .metric-icon { align-items: center; border-radius: .72rem; color: #fff; display: inline-flex; flex: 0 0 auto; height: 42px; justify-content: center; position: relative; width: 42px; }
.command-metrics .metric-icon .ti-icon { font-size: 1.25rem; }
.command-metrics .metric-label { color: #b5bbdc; font-size: .68rem; font-weight: 800; letter-spacing: .065em; }
.command-metrics .metric-card strong { color: #fff; font-size: clamp(1.42rem, 2.35vw, 2.08rem); line-height: 1.1; margin: .85rem 0 .25rem; overflow-wrap: anywhere; }
.command-metrics .metric-card strong em { color: #afb7dc; font-size: .86rem; }
.command-metrics .metric-card small { color: #8e96bd; font-size: .72rem; line-height: 1.25; }
.command-metrics .metric-violet { color: #a63fff; }.command-metrics .metric-violet .metric-icon { background: linear-gradient(135deg, #9c3ff0, #7130d7); box-shadow: 0 8px 17px rgba(143, 58, 237, .28); }
.command-metrics .metric-blue { color: #4d99ff; }.command-metrics .metric-blue .metric-icon { background: linear-gradient(135deg, #5099ff, #3f67e9); box-shadow: 0 8px 17px rgba(66, 123, 244, .28); }
.command-metrics .metric-amber { color: #ffb52d; }.command-metrics .metric-amber .metric-icon { background: linear-gradient(135deg, #ffc33d, #ec921b); box-shadow: 0 8px 17px rgba(234, 150, 26, .26); }
.command-metrics .metric-pink { color: #f756a8; }.command-metrics .metric-pink .metric-icon { background: linear-gradient(135deg, #f95bab, #d83c8f); box-shadow: 0 8px 17px rgba(234, 64, 148, .26); }
.command-alert { font-size: .86rem; padding: .9rem 1.05rem; }
.dashboard-panel { background: linear-gradient(145deg, rgba(26, 29, 61, .98), rgba(20, 22, 49, .98)); }
.command-panel-head { align-items: center; display: flex; justify-content: space-between; padding: 1.15rem 1.25rem 1rem; }
.command-panel-head h2 { color: #f5f6ff; font-weight: 780; letter-spacing: -.02em; }
.command-panel-link { align-items: center; display: inline-flex; font-size: .77rem; font-weight: 760; gap: .22rem; text-decoration: none; }
.command-panel-link .ti-icon { font-size: .94rem; }
.command-table thead th { background: rgba(255, 255, 255, .018); }
.command-table tbody tr:last-child > * { border-bottom: 0; }
.command-audit-list > div { border-color: var(--cc-line); padding: .75rem 0; }
.command-audit-list span { color: #edf0ff; font-weight: 720; }
.command-audit-list small { color: #8f97bc; }
.command-empty { color: var(--cc-muted); }
.command-empty h3 { color: #f5f6ff; }
.command-empty-compact { padding: 1rem 0 .2rem; text-align: left; }
.command-empty-compact .empty-icon { margin-bottom: .75rem; }

/* Dark POS terminal */
.app-theme-command .pos-start-shell {
  background:
    radial-gradient(circle at 91% 8%, rgba(221, 81, 225, .32), transparent 17rem),
    linear-gradient(135deg, #18173c 0%, #251752 56%, #481a67 100%);
  border: 1px solid rgba(217, 177, 255, .19);
  box-shadow: 0 20px 48px rgba(0, 0, 0, .35);
}
.app-theme-command .pos-start-copy .eyebrow { color: #e6b9ff; }
.app-theme-command .pos-start-copy h1 { color: #fff; }
.app-theme-command .pos-start-copy > p { color: #d6d9f6; }
.app-theme-command .pos-start-points span { color: #dce0ff; }
.app-theme-command .pos-start-points .ti-icon { color: #f5a4ff; }
.app-theme-command .pos-start-card { background: linear-gradient(145deg, #20234a, #171a38); border: 1px solid rgba(231, 233, 255, .14); box-shadow: 0 16px 32px rgba(1, 1, 15, .36); color: var(--cc-text); }
.app-theme-command .pos-start-card h2 { color: #fafaff; }
.app-theme-command .pos-start-card .text-secondary { color: var(--cc-muted) !important; }
.app-theme-command .pos-service-choice { background: #151935; border-color: #333962; color: #dfe3ff; }
.app-theme-command .pos-service-choice:hover { background: #20254c; border-color: #7164cc; }
.app-theme-command .pos-service-choice .ti-icon { color: #d07aff; }
.app-theme-command .pos-service-choice strong { color: #f3f4ff; }
.app-theme-command .pos-service-choice small { color: #929abc; }
.app-theme-command .btn-check:checked + .pos-service-choice { background: linear-gradient(145deg, rgba(133, 45, 230, .28), rgba(202, 51, 179, .17)); border-color: #bd70fa; box-shadow: 0 0 0 .2rem rgba(184, 85, 240, .16); }

.app-theme-command .pos-terminal { --pos-panel: #171a37; --pos-soft: #20244a; --pos-green: #a950ec; color: var(--cc-text); }
.app-theme-command .pos-topbar { background: linear-gradient(110deg, #1b1e41, #20234a); border-color: var(--cc-line); box-shadow: 0 12px 25px rgba(0, 0, 0, .18); }
.app-theme-command .pos-title-icon { background: linear-gradient(135deg, #9e3bea, #5d30d2); box-shadow: 0 7px 17px rgba(125, 42, 232, .3); color: #fff; }
.app-theme-command .pos-sale-title h1 { color: #fafaff; }
.app-theme-command .pos-sale-title p { color: #aab2d3; }
.app-theme-command .pos-menu-panel,
.app-theme-command .pos-cart-card,
.app-theme-command .pos-actions-card { background: linear-gradient(145deg, #1a1d3f, #151834); border-color: var(--cc-line); box-shadow: 0 13px 28px rgba(0, 0, 0, .17); }
.app-theme-command .pos-menu-toolbar h2 { color: #f4f5ff; }
.app-theme-command .pos-search { background: #10132b; border-color: #353b65; color: #a9b0d0; }
.app-theme-command .pos-search input { color: #f2f4ff; }
.app-theme-command .pos-category { background: #24294f; border-color: #363d68; color: #c3c8e4; }
.app-theme-command .pos-category:hover,
.app-theme-command .pos-category.active { background: linear-gradient(100deg, #7b2be5, #ca3aa8); border-color: #ba5ef5; color: #fff; }
.app-theme-command .pos-product { background: linear-gradient(145deg, #20244b, #1a1d3d); border-color: #333962; color: #eef0ff; }
.app-theme-command .pos-product:hover { border-color: #a854ea; box-shadow: 0 12px 22px rgba(93, 44, 200, .25); }
.app-theme-command .pos-product-initial { background: rgba(178, 80, 239, .18); color: #e5a9ff; }
.app-theme-command .pos-product-content strong { color: #f4f5ff; }
.app-theme-command .pos-product-content small { color: #9ba4c7; }
.app-theme-command .pos-product-price { color: #f3bdff; }
.app-theme-command .pos-add-mark { background: #9b3de8; color: #fff; }
.app-theme-command .pos-product.is-disabled { background: #161934; border-color: #3a4067; color: #a2aac8; }
.app-theme-command .pos-product-customize { color: #db9bff; }
.app-theme-command .pos-product-customize:hover { color: #f1c8ff; }
.app-theme-command .pos-cart-head { background: rgba(255, 255, 255, .025); border-color: var(--cc-line); }
.app-theme-command .pos-cart-head h2,
.app-theme-command .pos-cart-head > strong { color: #f6f6ff; }
.app-theme-command .pos-cart-line { border-color: var(--cc-line); }
.app-theme-command .pos-cart-line strong { color: #f0f1ff; }
.app-theme-command .pos-cart-line small { color: #9da5c6; }
.app-theme-command .pos-note { color: #ffd77d !important; }
.app-theme-command .pos-qty-controls { background: #11142d; border-color: #38406b; }
.app-theme-command .pos-qty-controls button { color: #e1a4ff; }
.app-theme-command .pos-qty-controls button:hover { background: rgba(170, 65, 235, .2); }
.app-theme-command .pos-qty-controls > span { border-color: #38406b; color: #f1f2ff; }
.app-theme-command .pos-cart-total { background: linear-gradient(105deg, #6e29da, #c234a7); }
.app-theme-command .pos-cart-total span { color: #ede4ff; }
.app-theme-command .pos-cart-total strong { color: #fff; }
.app-theme-command .pos-empty-cart { color: #9ca5c5; }
.app-theme-command .pos-empty-cart > span { background: rgba(164, 61, 232, .18); color: #dda3ff; }
.app-theme-command .pos-empty-cart strong { color: #e8eaff; }
.app-theme-command .pos-action-note { background: rgba(74, 116, 213, .15); color: #cbd8ff; }
.app-theme-command .pos-action-note .ti-icon { color: #78a5ff; }
.app-theme-command .pos-payment-title span { color: #aeb6d6; }
.app-theme-command .pos-payment-title strong { color: #fff; }
.app-theme-command .pos-paid-state { background: rgba(34, 194, 135, .14); color: #b8f4d6; }

/* Remaining operational views inherit the same command-centre surfaces. */
.app-theme-command .status-strip,
.app-theme-command .order-type-card,
.app-theme-command .table-card,
.app-theme-command .menu-item-card,
.app-theme-command .kds-ticket,
.app-theme-command .kitchen-send-form,
.app-theme-command .kitchen-send-lines .form-check,
.app-theme-command .station-tab,
.app-theme-command .print-actions,
.app-theme-command .empty-basket,
.app-theme-command .kds-empty { background: linear-gradient(145deg, #1c1f42, #171a37); border-color: var(--cc-line); color: var(--cc-text); }
.app-theme-command .order-type-card:hover,
.app-theme-command .station-tab:hover { border-color: #aa56ed; }
.app-theme-command .btn-check:checked + .order-type-card { background: rgba(137, 47, 231, .2); border-color: #bc67f4; box-shadow: 0 0 0 .2rem rgba(180, 80, 239, .14); }
.app-theme-command .order-type-card strong,
.app-theme-command .table-label,
.app-theme-command .menu-item-card h2,
.app-theme-command .menu-item-card h3,
.app-theme-command .kds-ticket-header strong { color: #f4f5ff; }
.app-theme-command .order-type-card small,
.app-theme-command .table-empty,
.app-theme-command .kds-ticket-header,
.app-theme-command .ticket-version,
.app-theme-command .ticket-history small,
.app-theme-command .kitchen-send-lines small { color: var(--cc-muted); }
.app-theme-command .type-icon,
.app-theme-command .menu-item-initial,
.app-theme-command .empty-basket span,
.app-theme-command .empty-icon { background: rgba(163, 61, 234, .18); color: #dda4ff; }
.app-theme-command .station-tab { color: #c5cae7; }
.app-theme-command .station-tab.active { background: linear-gradient(100deg, #7c2ae7, #bd39b1); border-color: #bc63f4; color: #fff; }
.app-theme-command .kds-ticket-header,
.app-theme-command .kds-ticket-footer { background: rgba(255, 255, 255, .022); border-color: var(--cc-line); }
.app-theme-command .kds-line { border-color: rgba(218, 223, 255, .13); }
.app-theme-command .ticket-timer { background: #2a2855; color: #fac5ff; }
.app-theme-command .line-qty,
.app-theme-command .basket-edit,
.app-theme-command .table-action,
.app-theme-command .tax-detail summary,
.app-theme-command .removed-lines summary { color: #d797ff; }
.app-theme-command .line-note,
.app-theme-command .kds-note { background: rgba(255, 181, 37, .14); color: #ffe0a1; }
.app-theme-command .totals > div span,
.app-theme-command .tax-detail,
.app-theme-command .removed-lines { color: var(--cc-muted); }
.app-theme-command .totals .grand { border-color: var(--cc-line); }
.app-theme-command .totals .grand strong { color: #fff; }
.app-theme-command .phase-next { background: rgba(82, 95, 163, .17); color: #c8ceeb; }
.app-theme-command .diagnostic-row { border-color: var(--cc-line); }
.app-theme-command .diagnostic-row span:not(.badge),
.app-theme-command .diagnostic-row small { color: var(--cc-muted); }
.app-theme-command .audit-table code { color: #e0a2ff; }
.app-theme-command .print-state.pending { color: #ffc765; }
.app-theme-command .print-state.printed { color: #79e6b1; }

/* Status chips remain unmistakable against a dark surface. */
.app-theme-command .status-pill.neutral,
.app-theme-command .status-draft { background: rgba(154, 164, 203, .16); color: #cbd1ed; }
.app-theme-command .status-open,
.app-theme-command .status-occupied,
.app-theme-command .status-paid,
.app-theme-command .status-approved,
.app-theme-command .status-completed,
.app-theme-command .status-ready { background: rgba(41, 201, 140, .16); color: #91edbe; }
.app-theme-command .status-sent-to-kitchen,
.app-theme-command .status-awaiting-payment,
.app-theme-command .status-part-paid { background: rgba(70, 138, 255, .17); color: #a8c8ff; }
.app-theme-command .status-queued,
.app-theme-command .status-preparing { background: rgba(255, 181, 37, .16); color: #ffdb8a; }
.app-theme-command .status-cancelled,
.app-theme-command .status-declined,
.app-theme-command .status-refunded,
.app-theme-command .status-part-refunded,
.app-theme-command .status-voided,
.app-theme-command .status-part-voided { background: rgba(249, 85, 112, .16); color: #ffb6c2; }
.app-theme-command .status-closed,
.app-theme-command .status-served { background: rgba(172, 133, 255, .17); color: #d2bcff; }

/* Login screen uses the same polished dark visual language. */
.app-theme-command .login-brand h1 { color: #f5f6ff; }
.app-theme-command .brand-orb { background: linear-gradient(135deg, #9e3deb, #582ac6); color: #fff; }
.app-theme-command .login-card { background: linear-gradient(145deg, #1d2045, #161936); border-color: var(--cc-line) !important; border-top-color: #b64eea !important; }
.app-theme-command .demo-pin-grid div { background: #12152f; color: #bfc5e4; }
.app-theme-command .demo-pin-grid span { color: #e2a5ff; }

@media (min-width: 992px) {
  .app-theme-command .nav-canvas.offcanvas-lg { background: var(--cc-sidebar) !important; border-right-color: var(--cc-line) !important; }
  .app-theme-command .nav-canvas.offcanvas-lg .offcanvas-body { background: var(--cc-sidebar) !important; }
  .app-theme-command .nav-canvas.offcanvas-lg .side-nav { background: var(--cc-sidebar); }
}

@media (max-width: 991.98px) {
  .app-theme-command .mobile-nav { background: rgba(16, 18, 41, .96); border-color: var(--cc-line); box-shadow: 0 -8px 24px rgba(0, 0, 0, .22); }
  .app-theme-command .mobile-nav a { color: #aab1d1; }
  .app-theme-command .mobile-nav a.active:not(.mobile-new) { color: #e0a6ff; }
  .app-theme-command .mobile-nav a.active:not(.mobile-new) .ti-icon { color: #d789ff; }
  .app-theme-command .mobile-nav .mobile-new { background: linear-gradient(135deg, #8b31e8, #d53fac); box-shadow: 0 8px 18px rgba(137, 48, 233, .34); color: #fff; }
}

@media (max-width: 767.98px) {
  .command-heading { align-items: flex-start !important; }
  .command-heading h1 { font-size: 1.82rem; }
  .command-actions { width: 100%; }
  .command-actions .btn { flex: 1; justify-content: center; }
  .command-metrics .metric-card { min-height: 137px; padding: .85rem; }
  .command-metrics .metric-icon { height: 36px; width: 36px; }
  .command-metrics .metric-card strong { font-size: 1.32rem; margin-top: .65rem; }
  .command-panel-head { padding: 1rem; }
  .app-theme-command .pos-start-card { border-radius: .85rem; }
}

/* Purpose-built staff login: a calm two-pane entry point for the POS. */
.app-theme-command .auth-main {
  align-items: center;
  background:
    radial-gradient(circle at 8% 15%, rgba(74, 86, 224, .14), transparent 28rem),
    radial-gradient(circle at 92% 12%, rgba(191, 52, 180, .18), transparent 30rem),
    var(--cc-bg-deep);
  display: flex;
  justify-content: center;
  min-height: calc(100vh - 46px);
  padding: clamp(1rem, 3vw, 2.75rem);
}
.app-theme-command .auth-main > .container-fluid {
  align-items: center;
  display: flex;
  justify-content: center;
  max-width: 1240px;
  padding: 0 !important;
  width: 100%;
}
.login-command {
  background: linear-gradient(145deg, rgba(29, 32, 69, .95), rgba(18, 20, 47, .98));
  border: 1px solid rgba(222, 224, 255, .13);
  border-radius: clamp(1.15rem, 2vw, 1.55rem);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .38);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(385px, .95fr);
  max-width: 1160px;
  min-height: min(710px, calc(100vh - 8rem));
  overflow: hidden;
  position: relative;
  width: 100%;
}
.login-hero {
  background:
    radial-gradient(circle at 87% 11%, rgba(238, 83, 218, .36), transparent 18rem),
    radial-gradient(circle at 18% 78%, rgba(66, 120, 255, .25), transparent 22rem),
    linear-gradient(145deg, #17173c 0%, #281754 60%, #471760 100%);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(1.75rem, 4vw, 3.1rem);
  position: relative;
}
.login-hero::before,
.login-hero::after {
  border: 1px solid rgba(237, 215, 255, .12);
  border-radius: 50%;
  content: '';
  pointer-events: none;
  position: absolute;
}
.login-hero::before { height: 470px; right: -210px; top: -210px; width: 470px; }
.login-hero::after { bottom: -260px; height: 520px; left: -270px; width: 520px; }
.login-hero-glow { background: linear-gradient(135deg, rgba(222, 104, 239, .18), transparent); filter: blur(24px); height: 180px; position: absolute; right: -60px; top: 180px; width: 180px; }
.login-hero-brand {
  align-items: center;
  color: #fff;
  display: inline-flex;
  font-size: .98rem;
  font-weight: 850;
  gap: .6rem;
  position: relative;
  text-decoration: none;
  z-index: 1;
}
.login-hero-brand:hover { color: #fff; }
.login-hero-brand .brand-orb,
.login-mobile-brand .brand-orb {
  background: linear-gradient(135deg, #b947eb, #6d2ade 72%);
  border-radius: .75rem;
  box-shadow: 0 8px 18px rgba(105, 39, 213, .34);
  color: #fff;
  font-size: .78rem;
  height: 38px;
  transform: none;
  width: 38px;
}
.login-hero-copy { margin: auto 0; max-width: 31rem; position: relative; z-index: 1; }
.login-overline { align-items: center; color: #ebb8ff; display: inline-flex; font-size: .68rem; font-weight: 850; gap: .4rem; letter-spacing: .11em; text-transform: uppercase; }
.login-overline .ti-icon { font-size: 1rem; }
.login-hero h1 { color: #fff; font-size: clamp(2.4rem, 5vw, 4.15rem); font-weight: 870; letter-spacing: -.072em; line-height: .98; margin: .85rem 0 1.05rem; }
.login-hero h1 em { color: #e899ff; font-style: normal; }
.login-hero-copy > p { color: #d7d9f5; font-size: 1rem; line-height: 1.62; margin: 0; max-width: 29rem; }
.login-feature-list { display: grid; gap: .9rem; margin-top: 2.1rem; }
.login-feature-list > div { align-items: center; display: flex; gap: .75rem; }
.login-feature-list > div > span:last-child { display: grid; gap: .08rem; }
.login-feature-list strong { color: #fff; font-size: .82rem; }
.login-feature-list small { color: #c5c9ec; font-size: .7rem; }
.login-feature-icon { align-items: center; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .15); border-radius: .68rem; color: #fff; display: inline-flex; flex: 0 0 auto; height: 34px; justify-content: center; width: 34px; }
.login-feature-icon .ti-icon { font-size: 1.05rem; }
.login-feature-icon.feature-violet { background: rgba(188, 97, 255, .22); color: #f0c9ff; }
.login-feature-icon.feature-blue { background: rgba(70, 140, 255, .2); color: #c0d8ff; }
.login-feature-icon.feature-green { background: rgba(38, 202, 139, .18); color: #bbf2d6; }
.login-hero-foot { align-items: center; color: #d0d4f0; display: flex; font-size: .71rem; font-weight: 700; gap: .45rem; position: relative; z-index: 1; }
.login-live-dot { background: #35df99; border-radius: 50%; box-shadow: 0 0 0 4px rgba(53, 223, 153, .14); height: 7px; width: 7px; }
.login-hero-divider { background: rgba(234, 237, 255, .34); height: 12px; margin: 0 .25rem; width: 1px; }

.login-auth-column { align-items: center; display: flex; flex-direction: column; justify-content: center; padding: clamp(1.4rem, 4vw, 3.4rem); }
.login-auth-card { max-width: 405px; width: 100%; }
.login-auth-head { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1.7rem; }
.login-auth-head h2 { color: #f9f9ff; font-size: clamp(1.65rem, 3vw, 2.05rem); font-weight: 840; letter-spacing: -.052em; margin: .28rem 0 .35rem; }
.login-auth-head p { color: var(--cc-muted); font-size: .83rem; line-height: 1.45; margin: 0; max-width: 18rem; }
.login-auth-head .demo-badge-dark { flex: 0 0 auto; margin-top: .1rem; }
.login-form .form-label { color: #e7eaff; font-size: .78rem; font-weight: 780; letter-spacing: .015em; }
.login-pin-input-wrap { align-items: center; display: flex; position: relative; }
.login-pin-input-wrap > span:first-child { color: #ce83ff; display: inline-flex; left: .9rem; pointer-events: none; position: absolute; z-index: 1; }
.login-pin-input-wrap > span:first-child .ti-icon { font-size: 1.05rem; }
.login-form .pin-input { background: #10132b; border-color: #404872; color: #fff; font-size: 1.3rem; letter-spacing: .35rem; min-height: 57px; padding-left: 3rem; padding-right: 3.8rem; text-align: left; }
.login-form .pin-input:focus { border-color: #be65f4; box-shadow: 0 0 0 .24rem rgba(184, 84, 241, .16); }
.login-pin-length { color: #9098bf; font-size: .7rem; font-weight: 800; position: absolute; right: .95rem; }
.login-form .form-text { color: #9098bd; font-size: .69rem; line-height: 1.4; }
.login-pin-status { color: #d795ff; font-size: .66rem; font-weight: 780; padding-top: .13rem; text-align: right; white-space: nowrap; }
.login-keypad { display: grid; gap: .48rem; grid-template-columns: repeat(3, 1fr); margin: 1.25rem 0 1.1rem; }
.login-keypad button { background: #20254a; border: 1px solid #363e69; border-radius: .65rem; color: #eef0ff; font-size: .98rem; font-weight: 780; min-height: 42px; transition: background .14s ease, border-color .14s ease, transform .14s ease; }
.login-keypad button:hover { background: #2a305c; border-color: #b457ef; transform: translateY(-1px); }
.login-keypad button:focus-visible { box-shadow: 0 0 0 .22rem rgba(188, 88, 242, .22); outline: 0; }
.login-keypad .login-key-clear { color: #f0b6cd; font-size: .69rem; }
.login-keypad .login-key-backspace { color: #dca5ff; font-size: 1.2rem; }
.login-submit { min-height: 51px; }
.login-demo-panel { border-top: 1px solid var(--cc-line); margin-top: 1.7rem; padding-top: 1.35rem; }
.login-demo-head { align-items: flex-start; display: flex; gap: .5rem; justify-content: space-between; margin-bottom: .8rem; }
.login-demo-head h3 { color: #eef0ff; font-size: .91rem; font-weight: 750; margin: .2rem 0 0; }
.login-demo-head > span { color: #8992ba; font-size: .64rem; font-weight: 700; padding-top: .25rem; white-space: nowrap; }
.login-demo-grid { gap: .5rem; }
.login-demo-grid button { background: #151936; border: 1px solid #323a63; border-radius: .7rem; color: #d5daf7; display: flex; flex-direction: column; font-size: .71rem; padding: .62rem .68rem; text-align: left; transition: background .15s ease, border-color .15s ease, transform .15s ease; }
.login-demo-grid button:hover { background: #232850; border-color: #a650ea; transform: translateY(-1px); }
.login-demo-grid button:focus-visible { box-shadow: 0 0 0 .2rem rgba(188, 88, 242, .22); outline: 0; }
.login-demo-grid button strong { color: #f1f2ff; font-weight: 750; }
.login-demo-grid button span { color: #df9cff; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1rem; font-weight: 850; letter-spacing: .08em; margin-top: .18rem; }
.login-demo-note { color: #8992b9; font-size: .66rem; line-height: 1.45; margin: .85rem 0 0; }
.login-security-note { align-items: center; color: #8b94ba; display: flex; font-size: .66rem; gap: .35rem; justify-content: center; margin: 1.1rem 0 0; text-align: center; }
.login-security-note .ti-icon { color: #85e2b3; font-size: .85rem; }
.login-mobile-brand { align-items: center; color: #fff; font-size: .95rem; font-weight: 820; gap: .55rem; margin-bottom: 1.5rem; }

@media (max-width: 991.98px) {
  .app-theme-command .auth-main { min-height: calc(100vh - 46px); padding: 1.25rem; }
  .login-command { display: block; max-width: 520px; min-height: auto; }
  .login-hero { display: none; }
  .login-auth-column { padding: clamp(1.4rem, 6vw, 2.4rem); }
  .login-mobile-brand { display: inline-flex !important; }
}
@media (max-width: 420px) {
  .app-theme-command .auth-main { padding: .65rem; }
  .login-command { border-radius: 1rem; }
  .login-auth-column { padding: 1.25rem 1rem; }
  .login-auth-head { margin-bottom: 1.25rem; }
  .login-auth-head h2 { font-size: 1.55rem; }
  .login-keypad { gap: .38rem; }
  .login-keypad button { min-height: 39px; }
  .login-demo-head { flex-direction: column; gap: .18rem; }
}

/* Settings hub and printer routing */
.settings-hub { margin: 0 auto; max-width: 1380px; }
.settings-heading h1 { color: #fafaff; font-weight: 840; letter-spacing: -.045em; }
.settings-browser-note { background: linear-gradient(105deg, rgba(67, 125, 255, .17), rgba(120, 54, 223, .12)); border-color: rgba(109, 157, 255, .28); color: #d4e2ff; font-size: .84rem; line-height: 1.5; padding: 1rem 1.1rem; }
.settings-note-icon { align-items: center; background: rgba(77, 145, 255, .18); border-radius: .65rem; color: #a8c9ff; display: inline-flex; flex: 0 0 auto; height: 35px; justify-content: center; width: 35px; }
.settings-note-icon .ti-icon { font-size: 1.1rem; }
.printer-route-card { background: linear-gradient(145deg, #1d2044, #171a38); overflow: hidden; position: relative; }
.printer-route-card::after { border: 1px solid rgba(226, 218, 255, .09); border-radius: 50%; content: ''; height: 155px; pointer-events: none; position: absolute; right: -75px; top: -78px; width: 155px; }
.printer-route-kitchen { border-top: 3px solid #a34cf0; }
.printer-route-cashier { border-top: 3px solid #49a0ff; }
.printer-route-head { align-items: flex-start; display: flex; gap: .8rem; margin-bottom: 1.35rem; position: relative; z-index: 1; }
.printer-route-head .printer-route-icon { align-items: center; background: linear-gradient(135deg, rgba(169, 78, 239, .36), rgba(121, 43, 224, .28)); border: 1px solid rgba(221, 163, 255, .22); border-radius: .8rem; color: #efc4ff; display: inline-flex; flex: 0 0 auto; height: 45px; justify-content: center; width: 45px; }
.printer-route-cashier .printer-route-icon { background: linear-gradient(135deg, rgba(71, 153, 255, .30), rgba(65, 91, 233, .24)); border-color: rgba(144, 198, 255, .22); color: #c0ddff; }
.printer-route-icon .ti-icon { font-size: 1.35rem; }
.printer-route-head h2 { color: #f5f6ff; font-weight: 790; letter-spacing: -.025em; }
.printer-route-head p { color: #9fa7ca; font-size: .75rem; line-height: 1.38; margin: 0; }
.settings-printer-form .form-label { color: #d9def9; font-size: .74rem; font-weight: 760; }
.settings-check { align-items: flex-start; background: rgba(255, 255, 255, .025); border: 1px solid var(--cc-line); border-radius: .7rem; display: flex; gap: .5rem; min-height: 57px; padding: .65rem .7rem; }
.settings-check .form-check-input { flex: 0 0 auto; margin-left: 0; margin-top: .14rem; }
.settings-check .form-check-label { color: #dfe3fb; display: grid; font-size: .72rem; gap: .05rem; }
.settings-check small { color: #969fbe; font-size: .63rem; }
.settings-save-bar { align-items: center; background: linear-gradient(100deg, rgba(125, 43, 228, .18), rgba(217, 60, 173, .13)); border: 1px solid rgba(196, 110, 248, .23); border-radius: .95rem; display: flex; gap: 1rem; justify-content: space-between; padding: .9rem 1rem; }
.settings-save-bar strong { color: #f3efff; display: block; font-size: .82rem; }
.settings-save-bar small { color: #c6b3e3; display: block; font-size: .69rem; margin-top: .1rem; }
.settings-test-form .btn { min-height: 47px; }
.settings-shortcuts { border-top: 1px solid var(--cc-line); padding-top: 1.45rem; }
.settings-shortcut { align-items: center; background: linear-gradient(145deg, #1b1e3f, #161936); border: 1px solid var(--cc-line); border-radius: .85rem; color: #e6e9ff; display: flex; gap: .65rem; min-height: 82px; padding: .8rem; text-decoration: none; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.settings-shortcut:hover { background: #252952; border-color: #ae5cf0; color: #fff; transform: translateY(-2px); }
.settings-shortcut > .ti-icon:first-child { color: #d392ff; flex: 0 0 auto; font-size: 1.2rem; }
.settings-shortcut > span { display: grid; flex: 1; gap: .13rem; min-width: 0; }
.settings-shortcut strong { color: inherit; font-size: .76rem; }
.settings-shortcut small { color: #929bbb; font-size: .63rem; line-height: 1.25; }
.settings-shortcut > .ti-icon:last-child { color: #8b94ba; font-size: .9rem; }

@media (max-width: 575.98px) {
  .settings-save-bar { align-items: stretch; flex-direction: column; }
  .settings-save-bar .btn { justify-content: center; }
  .settings-browser-note { font-size: .77rem; }
}

/* Counter POS structural fallbacks. These intentionally repeat the key layout
   rules so a kiosk with a stale base stylesheet still has a usable terminal. */
.app-theme-command .pos-start-shell { display: grid; gap: clamp(1rem, 3vw, 2.5rem); grid-template-columns: minmax(0, .9fr) minmax(340px, 1.1fr); margin: clamp(.25rem, 1vw, 1rem) auto; max-width: 1120px; padding: clamp(1.3rem, 4vw, 3rem); }
.app-theme-command .pos-start-copy { align-self: center; padding: .5rem; }
.app-theme-command .pos-start-copy h1 { font-size: clamp(2rem, 4vw, 3.2rem); margin: .35rem 0 .75rem; }
.app-theme-command .pos-start-copy > p { line-height: 1.55; max-width: 30rem; }
.app-theme-command .pos-start-points { display: flex; flex-wrap: wrap; gap: .6rem 1rem; margin-top: 1.35rem; }
.app-theme-command .pos-start-points span { align-items: center; display: inline-flex; font-size: .78rem; font-weight: 700; gap: .32rem; }
.app-theme-command .pos-start-card { border-radius: 1rem; padding: clamp(1.1rem, 3vw, 2rem); }
.app-theme-command .pos-start-button { align-items: center; display: inline-flex; gap: .45rem; justify-content: center; }
.app-theme-command .pos-service-picker { display: grid; gap: .55rem; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.app-theme-command .pos-service-choice { align-items: center; cursor: pointer; display: flex; flex-direction: column; gap: .45rem; justify-content: center; min-height: 104px; padding: .7rem .4rem; text-align: center; transition: background .15s ease, border-color .15s ease, transform .15s ease; }
.app-theme-command .pos-service-choice span { display: grid; gap: .12rem; }
.app-theme-command .pos-service-choice strong { font-size: .82rem; }
.app-theme-command .pos-service-choice small { font-size: .66rem; line-height: 1.2; }
.app-theme-command .pos-service-choice .ti-icon { font-size: 1.32rem; }

.app-theme-command .pos-terminal { margin: 0 auto; max-width: 1580px; }
.app-theme-command .pos-topbar { align-items: center; border-radius: 1rem; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: 1rem; padding: .95rem 1.1rem; }
.app-theme-command .pos-sale-title { align-items: center; display: flex; gap: .75rem; min-width: 0; }
.app-theme-command .pos-title-icon { align-items: center; display: flex; flex: 0 0 auto; height: 43px; justify-content: center; width: 43px; }
.app-theme-command .pos-title-icon .ti-icon { font-size: 1.35rem; }
.app-theme-command .pos-sale-title p { align-items: center; display: flex; flex-wrap: wrap; font-size: .78rem; gap: .42rem; }
.app-theme-command .pos-menu-panel { border-radius: 1rem; padding: clamp(.85rem, 2vw, 1.25rem); }
.app-theme-command .pos-menu-toolbar { align-items: center; display: flex; gap: 1rem; justify-content: space-between; margin-bottom: .9rem; }
.app-theme-command .pos-search { align-items: center; display: flex; flex: 0 1 270px; gap: .35rem; padding: 0 .65rem; }
.app-theme-command .pos-search input { background: transparent; border: 0; box-shadow: none !important; font-size: .84rem; min-width: 0; outline: 0; padding: .6rem 0; width: 100%; }
.app-theme-command .pos-category-row { display: flex; gap: .42rem; margin: 0 -.1rem 1rem; overflow-x: auto; padding: .05rem .1rem .4rem; }
.app-theme-command .pos-category { border-radius: 99px; cursor: pointer; font-size: .75rem; font-weight: 760; padding: .46rem .75rem; white-space: nowrap; }
.app-theme-command .pos-product-grid { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(174px, 1fr)); }
.app-theme-command .pos-product-wrap { min-width: 0; }
.app-theme-command .pos-product-form { margin: 0; }
.app-theme-command .pos-product { align-items: center; border-radius: .8rem; cursor: pointer; display: grid; gap: .55rem; grid-template-columns: auto minmax(0, 1fr) auto; min-height: 88px; padding: .7rem; position: relative; text-align: left; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease; width: 100%; }
.app-theme-command .pos-product-initial { align-items: center; border-radius: .6rem; display: flex; flex: 0 0 auto; font-size: .8rem; font-weight: 900; height: 34px; justify-content: center; width: 34px; }
.app-theme-command .pos-product-content { display: grid; gap: .18rem; min-width: 0; }
.app-theme-command .pos-product-content strong,
.app-theme-command .pos-product-content small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-theme-command .pos-product-price { font-size: .73rem; font-weight: 850; text-align: right; white-space: nowrap; }
.app-theme-command .pos-add-mark { align-items: center; border-radius: 50%; display: flex; height: 19px; justify-content: center; position: absolute; right: .45rem; top: .45rem; width: 19px; }
.app-theme-command .pos-add-mark .ti-icon { font-size: .72rem; margin: 0; }
.app-theme-command .pos-product.is-disabled { align-items: center; border-radius: .8rem; display: grid; gap: .55rem; grid-template-columns: auto minmax(0, 1fr) auto; min-height: 88px; padding: .7rem; }
.app-theme-command .pos-product-customize { display: block; font-size: .63rem; font-weight: 700; margin: .28rem .2rem 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-theme-command .pos-cart-panel { display: grid; gap: .75rem; position: sticky; top: 80px; }
.app-theme-command .pos-cart-card { border-radius: 1rem; overflow: hidden; }
.app-theme-command .pos-cart-head { align-items: flex-start; border-bottom: 1px solid var(--cc-line); display: flex; justify-content: space-between; padding: 1rem; }
.app-theme-command .pos-cart-head > strong { font-size: 1.13rem; white-space: nowrap; }
.app-theme-command .pos-cart-lines { max-height: min(43vh, 475px); overflow-y: auto; padding: .2rem 1rem; }
.app-theme-command .pos-cart-line { border-bottom: 1px solid var(--cc-line); padding: .78rem 0; }
.app-theme-command .pos-line-bottom { align-items: center; display: flex; justify-content: space-between; margin-top: .5rem; }
.app-theme-command .pos-qty-controls { align-items: center; border-radius: .48rem; display: inline-flex; overflow: hidden; }
.app-theme-command .pos-qty-controls form { display: contents; }
.app-theme-command .pos-qty-controls button { align-items: center; background: transparent; border: 0; display: inline-flex; height: 27px; justify-content: center; padding: 0; width: 28px; }
.app-theme-command .pos-qty-controls > span { border-inline: 1px solid #38406b; font-size: .74rem; font-weight: 850; min-width: 26px; padding: .22rem .35rem; text-align: center; }
.app-theme-command .pos-cart-total { align-items: center; display: flex; justify-content: space-between; padding: .9rem 1rem; }
.app-theme-command .pos-cart-total span { font-size: .73rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.app-theme-command .pos-cart-total strong { font-size: 1.25rem; }
.app-theme-command .pos-empty-cart { align-items: center; display: flex; flex-direction: column; gap: .33rem; padding: 2.3rem .75rem; text-align: center; }
.app-theme-command .pos-empty-cart > span { align-items: center; border-radius: 50%; display: flex; height: 40px; justify-content: center; width: 40px; }
.app-theme-command .pos-actions-card { border-radius: 1rem; display: grid; gap: .65rem; padding: .75rem; }
.app-theme-command .pos-action-note,
.app-theme-command .pos-paid-state { align-items: center; border-radius: .65rem; display: flex; font-size: .74rem; font-weight: 750; gap: .45rem; padding: .7rem; }
.app-theme-command .pos-payment-title { align-items: end; display: flex; justify-content: space-between; padding: .25rem .2rem .1rem; }
.app-theme-command .pos-quick-payments { display: grid; gap: .55rem; grid-template-columns: 1fr 1fr; }
.app-theme-command .pos-quick-payments button { align-items: center; display: flex; gap: .45rem; justify-content: center; min-height: 56px; text-align: left; width: 100%; }

@media (max-width: 991.98px) {
  .app-theme-command .pos-start-shell { grid-template-columns: 1fr; max-width: 850px; }
  .app-theme-command .pos-cart-panel { position: static; }
  .app-theme-command .pos-cart-lines { max-height: 360px; }
}
@media (max-width: 767.98px) {
  .app-theme-command .pos-start-shell { border-radius: 1rem; margin: 0; padding: 1rem; }
  .app-theme-command .pos-start-copy { padding: .25rem; }
  .app-theme-command .pos-start-copy h1 { font-size: 2rem; }
  .app-theme-command .pos-menu-toolbar,
  .app-theme-command .pos-topbar { align-items: flex-start; flex-direction: column; }
  .app-theme-command .pos-menu-toolbar .pos-search { flex-basis: auto; width: 100%; }
  .app-theme-command .pos-topbar > .d-flex { width: 100%; }
  .app-theme-command .pos-topbar > .d-flex .btn { flex: 1; justify-content: center; }
  .app-theme-command .pos-product-grid { gap: .5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-theme-command .pos-product { display: flex; flex-direction: column; gap: .35rem; justify-content: center; min-height: 124px; padding: .65rem .45rem; text-align: center; }
  .app-theme-command .pos-product-content { text-align: center; width: 100%; }
  .app-theme-command .pos-product-content strong,
  .app-theme-command .pos-product-content small { white-space: normal; }
  .app-theme-command .pos-product-price { text-align: center; }
  .app-theme-command .pos-cart-lines { max-height: none; }
}
.demo-reset-card { align-items: center; background: linear-gradient(105deg, rgba(180, 60, 90, .15), rgba(93, 36, 92, .17)); border: 1px solid rgba(255, 112, 142, .23); border-radius: .95rem; display: flex; gap: 1rem; justify-content: space-between; padding: 1rem 1.1rem; }
.demo-reset-card h2 { color: #ffe2e8; font-weight: 780; }
.demo-reset-card p { color: #dcb8c5; font-size: .74rem; line-height: 1.42; max-width: 42rem; }
.demo-reset-form { align-items: center; display: flex; flex: 0 0 auto; gap: .55rem; }
.demo-reset-form .form-control { max-width: 160px; min-height: 40px; }
@media (max-width: 767.98px) { .demo-reset-card { align-items: stretch; flex-direction: column; }.demo-reset-form { width: 100%; }.demo-reset-form .form-control { flex: 1; max-width: none; } }
@media (max-width: 420px) { .demo-reset-form { align-items: stretch; flex-direction: column; }.demo-reset-form .btn { width: 100%; } }