/*
 * Valenzo POS v257 — one premium, fast cashier design system.
 * Behaviour stays in the existing modules; this file owns the shared visual contract.
 */

.pos-v247-shell.pos-v220-shell {
  --v257-bg: #07111d;
  --v257-surface: #0d1a27;
  --v257-raised: #101f2e;
  --v257-elevated: #142536;
  --v257-line: rgba(148, 163, 184, 0.18);
  --v257-line-strong: rgba(148, 163, 184, 0.3);
  --v257-text: #f2f7f8;
  --v257-muted: #93a6b8;
  --v257-faint: #6f8497;
  --v257-gold: #d4a84f;
  --v257-gold-bright: #f0c66d;
  --v257-gold-soft: rgba(212, 168, 79, 0.14);
  --v257-cyan: var(--p-2dd4bf, #2DD4BF);
  --v257-cyan-strong: #22c9d6;
  --v257-cyan-soft: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 12%, transparent);
  --v257-green: #2dcf93;
  --v257-green-soft: rgba(45, 207, 147, 0.12);
  --v257-orange: #f59e0b;
  --v257-orange-soft: rgba(245, 158, 11, 0.12);
  --v257-red: #ef5d5d;
  --v257-red-soft: rgba(239, 93, 93, 0.12);
  --v257-radius: 14px;
  --v257-radius-sm: 10px;
  --v257-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);

  --v247-background: var(--v257-bg);
  --v247-surface: var(--v257-bg);
  --v247-panel: var(--v257-surface);
  --v247-panel-raised: var(--v257-raised);
  --v247-product-background: var(--v257-raised);
  --v247-search-background: var(--v257-raised);
  --v247-border: var(--v257-line);
  --v247-border-strong: var(--v257-line-strong);
  --v247-text: var(--v257-text);
  --v247-muted: var(--v257-muted);
  --v247-gold: var(--v257-gold);
  --v247-gold-bright: var(--v257-gold-bright);
  --v247-gold-soft: var(--v257-gold-soft);
  --v247-gold-ink: #171006;
  --v247-header-background: #050d17;
  --v247-header-raised: var(--v257-surface);
  --v247-header-text: var(--v257-text);
  --v247-header-muted: var(--v257-muted);
  --v247-blue: var(--v257-cyan);
  --v247-green: var(--v257-green);
  --v247-red: var(--v257-red);
  --v247-orange: var(--v257-orange);
  --v247-shadow: var(--v257-shadow);

  --pos-v220-rail: #050d17;
  --pos-v220-rail-raised: var(--v257-surface);
  --pos-v220-rail-hover: var(--v257-raised);
  --pos-v220-line: var(--v257-line);
  --pos-v220-text: var(--v257-text);
  --pos-v220-muted: var(--v257-muted);
  --pos-v220-active: var(--v257-gold);
  --pos-v220-active-ink: #171006;
  --pos-v220-active-soft: var(--v257-gold-soft);
  --pos-v220-gold: var(--v257-gold);
  --pos-v220-stage: var(--v257-bg);
  background: var(--v257-bg) !important;
  color: var(--v257-text) !important;
  color-scheme: dark !important;
}

.pos-v247-shell.pos-v220-shell :is(button), .pos-v247-shell.pos-v220-shell :is(input), .pos-v247-shell.pos-v220-shell :is(select), .pos-v247-shell.pos-v220-shell :is(textarea) {
  accent-color: var(--v257-cyan);
}

.pos-v247-shell.pos-v220-shell :is(button, input, select, textarea, [role="button"]):focus-visible {
  outline: 2px solid var(--v257-cyan) !important;
  outline-offset: 2px !important;
}

/* One command bar for desktop and tablet. */
@media (min-width: 700px) {
  .pos-v247-shell.pos-v220-shell {
    grid-template-rows: 76px minmax(0, 1fr) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-rail {
    display: grid !important;
    height: 76px !important;
    min-height: 76px !important;
    grid-template-columns: clamp(58px, 12vw, 184px) minmax(0, 1fr) auto !important;
    grid-template-rows: 1fr !important;
    align-items: center !important;
    gap: clamp(6px, 0.7vw, 12px) !important;
    padding: 0 clamp(8px, 1.15vw, 18px) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--v257-line) !important;
    background:
      radial-gradient(circle at 3% -50%, rgba(212, 168, 79, 0.16), transparent 36%),
      linear-gradient(180deg, #0a1420, #050d17) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand {
    height: 58px !important;
    gap: 9px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand-mark {
    width: 46px !important;
    height: 46px !important;
    flex-basis: 46px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand-copy b {
    color: var(--v257-text) !important;
    font-size: clamp(10px, 0.85vw, 13px) !important;
    letter-spacing: 0.08em !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand-copy small {
    color: var(--v257-gold-bright) !important;
    font-size: 8px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-mode-indicator,
  .pos-v247-shell.pos-v220-shell .pos-v250-sale-actions,
  .pos-v247-shell.pos-v220-shell .pos-v250-secondary-actions {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav {
    display: grid !important;
    min-width: 0 !important;
    grid-template-columns: repeat(5, minmax(58px, 1fr)) !important;
    gap: clamp(4px, 0.45vw, 7px) !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target] {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 48px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 5px 7px !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: rgba(255, 255, 255, 0.025) !important;
    color: var(--v257-muted) !important;
    box-shadow: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target]:hover:not(:disabled) {
    border-color: rgba(212, 168, 79, 0.42) !important;
    background: var(--v257-gold-soft) !important;
    color: var(--v257-text) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target]:is(.active, .is-active, [aria-current="page"]) {
    border-color: var(--v257-gold) !important;
    background: linear-gradient(135deg, #f2ce7c, #c99137) !important;
    color: #171006 !important;
    box-shadow: 0 7px 18px rgba(190, 128, 33, 0.2) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-icon {
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    border: 0 !important;
    background: transparent !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-copy {
    min-width: 0 !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-copy b {
    display: block !important;
    overflow: hidden !important;
    color: currentColor !important;
    font-size: clamp(8px, 0.72vw, 11px) !important;
    font-weight: 820 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-copy small {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-utility,
  .pos-v250-sales-actions-active .pos-v247-utility {
    display: flex !important;
    min-width: 0 !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-global-search {
    display: flex !important;
    width: clamp(112px, 13vw, 196px) !important;
    height: 46px !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 11px !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: var(--v257-surface) !important;
    color: var(--v257-muted) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-global-search input {
    width: 100% !important;
    min-width: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: var(--v257-text) !important;
    font-size: 11px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-global-search input::placeholder {
    color: var(--v257-muted) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-user {
    display: flex !important;
    min-width: 0 !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 2px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-user-avatar {
    display: grid !important;
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
    place-items: center !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: 50% !important;
    background: var(--v257-raised) !important;
    color: var(--v257-cyan) !important;
    font-size: 10px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-user-copy :is(b), .pos-v247-shell.pos-v220-shell .pos-v247-user-copy :is(small) {
    display: block !important;
    max-width: 84px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-user-copy b {
    color: var(--v257-text) !important;
    font-size: 10px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-user-copy small {
    margin-top: 2px !important;
    color: var(--v257-muted) !important;
    font-size: 8px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v257-menu-button {
    display: grid !important;
    width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    flex: 0 0 42px !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: var(--v257-surface) !important;
    color: var(--v257-text) !important;
    font-size: 20px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-utility > :is(.valenzo-language-selector), .pos-v247-shell.pos-v220-shell .pos-v247-utility > :is(.fast-manage), .pos-v247-shell.pos-v220-shell .pos-v247-utility > :is(.fast-logout), .pos-v247-shell.pos-v220-shell .pos-v247-utility > :is(.fast-status), .pos-v247-shell.pos-v220-shell .pos-v247-utility > :is(.fast-clock), .pos-v247-shell.pos-v220-shell .pos-v249-table-tools {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-stage {
    background: var(--v257-bg) !important;
  }
}

/* Sales: narrow categories, roomy catalogue, fixed ticket. */
@media (min-width: 700px) {
  .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-layout {
    grid-template-columns: clamp(168px, 14vw, 220px) minmax(0, 1fr) clamp(332px, 24vw, 360px) !important;
    background: var(--v257-bg) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-catalog-toolbar {
    display: block !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cats {
    padding: 12px 10px !important;
    border-right: 1px solid var(--v257-line) !important;
    background: linear-gradient(180deg, #0a1622, #08131f) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cat-grid {
    gap: 7px !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cat {
    min-height: 54px !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 6px 10px !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: var(--v257-surface) !important;
    color: var(--v257-muted) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cat:hover {
    border-color: var(--v257-line-strong) !important;
    background: var(--v257-raised) !important;
    color: var(--v257-text) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cat.active {
    border-color: var(--v257-gold) !important;
    background: linear-gradient(135deg, #f1cb78, #c99037) !important;
    color: #171006 !important;
    box-shadow: 0 8px 20px rgba(184, 121, 28, 0.18) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cat-code {
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: currentColor !important;
    font-size: 17px !important;
    text-shadow: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-tables-shortcut {
    min-height: 54px !important;
    border-color: rgba(212, 168, 79, 0.48) !important;
    background: var(--v257-gold-soft) !important;
    color: var(--v257-gold-bright) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .fast-product-area,
  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .fast-products-scroll {
    background: var(--v257-bg) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .fast-products-scroll {
    padding: 16px 18px 24px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-product-groups {
    gap: 20px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-product-group-head h2 {
    color: var(--v257-text) !important;
    font-size: clamp(15px, 1.15vw, 19px) !important;
  }


  .pos-v247-shell.pos-v220-shell .pos-v247-product-cards {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 142px), 1fr)) !important;
    gap: 9px !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-product-card.resto-product,
  .pos-v247-shell.pos-v220-shell .pos-v247-product-card[data-pos-v247-accent] {
    --v247-card-accent: var(--v257-cyan) !important;
    min-height: 78px !important;
    padding: 11px 12px 10px 15px !important;
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: var(--v257-raised) !important;
    color: var(--v257-text) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-product-card::before {
    width: 3px !important;
    background: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 62%, transparent) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-product-card:hover {
    border-color: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 48%, transparent) !important;
    background: var(--v257-elevated) !important;
    filter: none !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-product-card .resto-product-name {
    color: var(--v257-text) !important;
    font-size: clamp(12px, 0.92vw, 14px) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-product-card .resto-product-price {
    color: var(--v257-gold-bright) !important;
    font-size: clamp(12px, 0.92vw, 14px) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cart {
    border-left: 1px solid var(--v257-line) !important;
    background: var(--v257-surface) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions {
    min-height: 104px !important;
    gap: 7px !important;
    padding: 11px 10px 9px !important;
    border-color: var(--v257-line) !important;
    background: var(--v257-surface) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > button {
    min-height: 82px !important;
    gap: 5px !important;
    border-radius: var(--v257-radius-sm) !important;
    font-size: clamp(9px, 0.72vw, 11px) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > :is(.fast-undo), .pos-v247-shell.pos-v220-shell .pos-v247-actions > :is(.service-bill-request), .pos-v247-shell.pos-v220-shell .pos-v247-actions > :is(.ops123-table-actions) {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > [data-pos-v247-action="print"] {
    border-color: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 34%, transparent) !important;
    background: linear-gradient(145deg, #126b7b, #0d5263) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > [data-pos-v247-action="payment"] {
    border-color: rgba(45, 207, 147, 0.36) !important;
    background: linear-gradient(145deg, #16865f, #0c6146) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > [data-pos-v247-action="cancel"] {
    border-color: rgba(239, 93, 93, 0.42) !important;
    background: linear-gradient(145deg, #b93d45, #852630) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-actions > [data-pos-v247-action="hold"] {
    border-color: rgba(245, 158, 11, 0.4) !important;
    background: linear-gradient(145deg, #a86112, #77420d) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-action-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 22px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-order-selectors,
  .pos-v247-shell.pos-v220-shell .pos-v247-cart-columns,
  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cart-list,
  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-cart-bottom {
    border-color: var(--v257-line) !important;
    background: var(--v257-surface) !important;
    color: var(--v257-text) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-order-selectors > label,
  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-cart-quantity .resto-qty {
    border-color: var(--v257-line) !important;
    background: var(--v257-raised) !important;
    color: var(--v257-text) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-cart-columns,
  body.pos-active .pos-v247-shell.pos-v220-shell .pos-v247-cart-row.resto-cart-row {
    border-color: var(--v257-line) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-pay-primary {
    border-color: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 62%, transparent) !important;
    background: linear-gradient(135deg, var(--p-57e0c8, #57E0C8), var(--p-25c3d4, #25C3D4)) !important;
    color: #042627 !important;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--p-25c3d4, #25C3D4) 18%, transparent) !important;
  }
}

/* Tables: neutral cards, status is communicated only by the dot/short label. */
.pos-v247-shell.pos-v220-shell .table-workspace-v173 {
  --tv173-bg: var(--v257-bg);
  --tv173-surface: var(--v257-surface);
  --tv173-surface-soft: var(--v257-raised);
  --tv173-surface-strong: var(--v257-elevated);
  --tv173-line: var(--v257-line);
  --tv173-line-strong: var(--v257-line-strong);
  --tv173-text: var(--v257-text);
  --tv173-muted: var(--v257-muted);
  --tv173-faint: var(--v257-faint);
  --tv173-navy: #050d17;
  --tv173-ink: #030910;
  --tv173-blue: var(--v257-cyan);
  --tv173-green: var(--v257-green);
  --tv173-green-soft: var(--v257-green-soft);
  --tv173-gold: var(--v257-gold);
  --tv173-amber: var(--v257-orange);
  --tv173-amber-soft: var(--v257-orange-soft);
  --tv173-danger: var(--v257-red);
  --tv173-shadow: none;
  height: 100% !important;
  background: var(--v257-bg) !important;
  color-scheme: dark !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-shell), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-board), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-zonebar) {
  background: var(--v257-bg) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-zonebar {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-areas > button {
  border-color: var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-muted) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-areas > button.active {
  border-color: var(--v257-gold) !important;
  background: var(--v257-gold-soft) !important;
  color: var(--v257-gold-bright) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-search {
  border-color: var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-search input {
  background: transparent !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table) {
  --status-color: var(--v257-green);
  --table-accent: var(--status-color) !important;
  --tv173-slot-state: var(--status-color) !important;
  border: 1px solid var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card, .tv173-available-table)[data-state="available"] { --status-color: var(--v257-green); }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card, .tv173-available-table)[data-state="open"] { --status-color: var(--v257-cyan); }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card, .tv173-available-table)[data-state="requested"] { --status-color: var(--v257-orange); }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card, .tv173-available-table)[data-state="delayed"] { --status-color: var(--v257-red); }

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card)::before, .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table)::before {
  content: none !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card):is(:hover, :focus-visible), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table):is(:hover, :focus-visible) {
  border-color: var(--v257-line-strong) !important;
  background: var(--v257-elevated) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 8%, transparent) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card__status), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table__status) {
  border: 0 !important;
  background: transparent !important;
  color: var(--v257-muted) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card__status, .tv173-available-table__status) > i {
  background: var(--status-color) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-color) 15%, transparent) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card__number), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card__name), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table__number) {
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-active-card__amount,
.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-active-card__duration {
  color: var(--v257-gold-bright) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-board-footer {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
}

.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-board-footer [data-state="available"] { color: var(--v257-green) !important; }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-board-footer [data-state="open"] { color: var(--v257-cyan) !important; }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-board-footer [data-state="requested"] { color: var(--v257-orange) !important; }
.pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-board-footer [data-state="delayed"] { color: var(--v257-red) !important; }

/* Service radar: the same surfaces and semantic status colours. */
.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .table-workspace-v173 {
  --radar-v252-bg: var(--v257-bg);
  --radar-v252-card: var(--v257-surface);
  --radar-v252-card-soft: var(--v257-raised);
  --radar-v252-text: var(--v257-text);
  --radar-v252-muted: var(--v257-muted);
  --radar-v252-line: var(--v257-line);
  --radar-v252-blue: var(--v257-cyan);
  --radar-v252-blue-soft: var(--v257-cyan-soft);
  --radar-v252-green: var(--v257-green);
  --radar-v252-green-soft: var(--v257-green-soft);
  --radar-v252-red: var(--v257-red);
  --radar-v252-red-soft: var(--v257-red-soft);
  --radar-v252-amber: var(--v257-orange);
  --radar-v252-amber-soft: var(--v257-orange-soft);
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .tv172-radar[data-radar-v252] {
  gap: 16px !important;
  padding: clamp(14px, 1.6vw, 24px) !important;
  background: var(--v257-bg) !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] :is(.tv252-summary-card), .pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] :is(.tv252-summary-occupancy), .pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] :is(.tv252-radar-priority), .pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] :is(.tv252-radar-search), .pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] :is(.tv252-radar-select) {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
  color: var(--v257-text) !important;
  box-shadow: none !important;
}


.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .tv252-radar-refresh {
  border-color: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 48%, transparent) !important;
  background: linear-gradient(135deg, #31d9c2, #22bdce) !important;
  color: #03282a !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .table-workspace-v173 .tv252-radar-card {
  border: 1px solid var(--v257-line) !important;
  border-top: 3px solid var(--v257-cyan) !important;
  background: var(--v257-surface) !important;
  color: var(--v257-text) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .table-workspace-v173 .tv252-radar-card[data-state="requested"] {
  border-color: var(--v257-line) !important;
  border-top-color: var(--v257-orange) !important;
  background: var(--v257-surface) !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .table-workspace-v173 .tv252-radar-card[data-state="delayed"] {
  border-top-color: var(--v257-red) !important;
}



.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .tv252-card-items > li {
  color: var(--v257-muted) !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .tv252-card-open {
  border-color: var(--v257-line-strong) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell[data-pos-v220-view="radar"] .tv252-card-pay {
  border-color: rgba(45, 207, 147, 0.5) !important;
  background: linear-gradient(135deg, #16865f, #0c6146) !important;
  color: #fff !important;
}

/* Closed checks: daily, read-only, neutral and deliberately money-free. */
.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] {
  --pos-v223-surface: var(--v257-surface);
  --pos-v223-surface-raised: var(--v257-raised);
  --pos-v223-ink: var(--v257-text);
  --pos-v223-muted: var(--v257-muted);
  --pos-v223-border: var(--v257-line);
  --pos-v251-blue: var(--v257-cyan);
  --pos-v251-blue-soft: var(--v257-cyan-soft);
  --pos-v251-green: var(--v257-green);
  --pos-v251-green-soft: var(--v257-green-soft);
  --pos-v251-gold: var(--v257-gold);
  --pos-v251-shadow: none;
  background: var(--v257-bg) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v223-readonly-head), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v251-search), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v251-field), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v251-today), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v251-view-switch), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(.pos-v223-closed-record) {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
  color: var(--v257-text) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v223-closed-record,
.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v223-closed-record:nth-of-type(n) {
  --pos-v251-card-accent: var(--v257-cyan) !important;
  --pos-v251-card-soft: var(--v257-cyan-soft) !important;
  border: 1px solid var(--v257-line) !important;
  background: var(--v257-surface) !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v223-closed-record::before {
  background: var(--v257-cyan) !important;
  opacity: 0.72 !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v223-record-identity b {
  color: var(--v257-cyan) !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v251-card-status {
  border-color: rgba(45, 207, 147, 0.28) !important;
  background: var(--v257-green-soft) !important;
  color: var(--v257-green) !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] .pos-v223-record-meta b {
  border-color: var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(input), .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] :is(select) {
  background: transparent !important;
  color: var(--v257-text) !important;
}

/* Package: keep the proven three-pane workflow and limit platform colour to marks. */
.pos-v247-shell.pos-v220-shell.pos-v253-package-active {
  --pk253-bg: var(--v257-bg) !important;
  --pk253-surface: var(--v257-surface) !important;
  --pk253-surface-soft: var(--v257-raised) !important;
  --pk253-line: var(--v257-line) !important;
  --pk253-line-strong: var(--v257-line-strong) !important;
  --pk253-text: var(--v257-text) !important;
  --pk253-muted: var(--v257-muted) !important;
  --pk253-cyan: var(--v257-cyan) !important;
  --pk253-cyan-dark: var(--v257-cyan) !important;
  --pk253-green: var(--v257-green) !important;
  --pk253-green-soft: var(--v257-green-soft) !important;
  --pk253-red: var(--v257-red) !important;
  --pk253-red-soft: var(--v257-red-soft) !important;
  --pk253-gold: var(--v257-gold) !important;
  --pk253-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-dashboard):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.paket-possify.package-v253-active), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.resto-shell):not(.vzb612) {
  background: var(--v257-bg) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-toolbar {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-platform):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-list-pane):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-detail-main):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-customer-pane):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-order-card):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-detail-main .package-item-list), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-total):not(.vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-payment-summary):not(.vzb612) {
  border-color: var(--v257-line) !important;
  background: var(--v257-surface) !important;
  color: var(--v257-text) !important;
  box-shadow: none !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-platform.is-active,
.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-order-card:is(:hover, .is-selected) {
  border-color: color-mix(in srgb, var(--p-2dd4bf, #2DD4BF) 50%, transparent) !important;
  background: var(--v257-raised) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-order-card.is-selected::before {
  background: var(--v257-cyan) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-status-tabs):not(.vzb612):not(vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-list-result):not(.vzb612):not(vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-detail-main .package-item-row):not(vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-customer-pane .package-customer-grid > div), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-customer-pane .package-address-block):not(vzb612), .pos-v247-shell.pos-v220-shell.pos-v253-package-active :is(.pk253-customer-pane .package-note-block):not(vzb612) {
  border-color: var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action {
  border-color: var(--v257-line) !important;
  background: var(--v257-raised) !important;
  color: var(--v257-text) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action.accept,
.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action.ready,
.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action.delivered {
  border-color: rgba(45, 207, 147, 0.5) !important;
  background: linear-gradient(135deg, #16865f, #0c6146) !important;
  color: #fff !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action.dispatch {
  border-color: rgba(245, 158, 11, 0.5) !important;
  background: var(--v257-orange-soft) !important;
  color: var(--v257-gold-bright) !important;
}

.pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-actions .package-action.reject {
  border-color: rgba(239, 93, 93, 0.48) !important;
  background: var(--v257-red-soft) !important;
  color: var(--v257-red) !important;
}

@media (min-width: 700px) {
  .pos-v247-shell.pos-v220-shell.pos-v253-package-active .pk253-workspace {
    grid-template-columns: minmax(205px, 0.82fr) minmax(235px, 1.12fr) minmax(200px, 0.86fr) !important;
  }
}

/* Compact desktop/tablet without changing the information architecture. */
@media (min-width: 700px) and (max-width: 1180px) {
  .pos-v247-shell.pos-v220-shell .pos-v220-rail {
    grid-template-columns: 52px minmax(0, 1fr) auto !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand-copy,
  .pos-v247-shell.pos-v220-shell .pos-v247-user-copy {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-brand {
    width: 48px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-global-search {
    width: clamp(104px, 15vw, 138px) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target] {
    gap: 3px !important;
    padding-inline: 4px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-icon {
    width: 21px !important;
    height: 21px !important;
    flex-basis: 21px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v247-sales .resto-layout {
    grid-template-columns: clamp(156px, 18vw, 190px) minmax(0, 1fr) clamp(310px, 31vw, 348px) !important;
  }
}

/* Phone: one active workspace and a fixed five-item bottom navigation. */
@media (max-width: 699px) {
  body.pos-active {
    overflow: hidden !important;
    background: var(--v257-bg) !important;
  }

  .pos-v247-shell.pos-v220-shell {
    position: relative !important;
    display: grid !important;
    width: 100% !important;
    height: 100dvh !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) calc(66px + env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-stage {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: var(--v257-bg) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-rail {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    z-index: 80 !important;
    display: block !important;
    grid-column: 1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    height: calc(66px + env(safe-area-inset-bottom)) !important;
    min-height: 0 !important;
    padding: 6px 7px env(safe-area-inset-bottom) !important;
    overflow: hidden !important;
    border: 0 !important;
    border-top: 1px solid var(--v257-line) !important;
    background: rgba(5, 13, 23, 0.98) !important;
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.32) !important;
    backdrop-filter: blur(18px) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v220-brand), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v220-mode-indicator), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v247-utility), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v249-table-tools), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v250-sale-actions), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v220-rail-footer), .pos-v247-shell.pos-v220-shell .pos-v220-rail :is(.pos-v220-rail-status) {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav {
    display: grid !important;
    width: 100% !important;
    height: 54px !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 3px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target] {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 54px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    padding: 3px 2px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    background: transparent !important;
    color: var(--v257-muted) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav [data-pos-v220-target]:is(.active, .is-active, [aria-current="page"]) {
    border-color: rgba(212, 168, 79, 0.38) !important;
    background: var(--v257-gold-soft) !important;
    color: var(--v257-gold-bright) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-icon {
    display: grid !important;
    width: 22px !important;
    height: 22px !important;
    place-items: center !important;
    background: transparent !important;
    color: currentColor !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-copy b {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: currentColor !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    text-align: center !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-nav-copy small,
  .pos-v247-shell.pos-v220-shell .pos-v220-nav-badge {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v220-stage > :is(.resto-shell), .pos-v247-shell.pos-v220-shell .pos-v220-stage > :is(.table-workspace-v173), .pos-v247-shell.pos-v220-shell .pos-v220-stage > :is(.pos-v223-readonly) {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  .pos-v247-shell.pos-v220-shell .resto-shell,
  .pos-v247-shell.pos-v220-shell .table-workspace-v173,
  .pos-v247-shell.pos-v220-shell .pk253-dashboard {
    background: var(--v257-bg) !important;
    color: var(--v257-text) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .resto-layout {
    height: calc(100% - 108px) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cats,
  body.pos-active .pos-v247-shell.pos-v220-shell .fast-products-scroll,
  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cart,
  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cart-bottom,
  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cart-list {
    border-color: var(--v257-line) !important;
    background: var(--v257-bg) !important;
    color: var(--v257-text) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cat,
  body.pos-active .pos-v247-shell.pos-v220-shell .resto-product {
    border: 1px solid var(--v257-line) !important;
    border-radius: var(--v257-radius-sm) !important;
    background: var(--v257-raised) !important;
    color: var(--v257-text) !important;
    box-shadow: none !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .resto-cat.active {
    border-color: var(--v257-gold) !important;
    background: var(--v257-gold-soft) !important;
    color: var(--v257-gold-bright) !important;
  }

  body.pos-active .pos-v247-shell.pos-v220-shell .resto-product-price {
    color: var(--v257-gold-bright) !important;
  }

  .pos-v247-shell.pos-v220-shell .table-workspace-v173 .tv173-topbar {
    display: none !important;
  }

  .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-active-card), .pos-v247-shell.pos-v220-shell .table-workspace-v173 :is(.tv173-available-table) {
    border-color: var(--v257-line) !important;
    background: var(--v257-raised) !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-closed="251"] {
    padding: 10px !important;
  }

  .pos-v247-shell.pos-v220-shell .pos-v223-readonly-closed[data-pos-v251-view="grid"] .pos-v223-readonly-list {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pos-v247-shell.pos-v220-shell *,
  .pos-v247-shell.pos-v220-shell *::before,
  .pos-v247-shell.pos-v220-shell *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
