/* Desktop Till presentation only. Screen scope leaves printed receipts unchanged. */
@media screen {
  :root {
    --color-primary: #cbd4fb;
    --color-primary-hover: #b6c3f5;
    --color-accent: #dce3ff;
    --color-bg: #f3f4fb;
  }
  body { background: #f3f4fb; }
  .pos-container {
    background: radial-gradient(ellipse at 5% 5%, #e1f1f3, transparent 52%),
      radial-gradient(ellipse at 95% 90%, #efe3f6, transparent 55%), #f3f4fb;
  }
  .left-panel, .right-panel { background: transparent; }
  .left-panel { border-color: #dce1ed; }
  .left-header, .right-header {
    background: rgba(255,255,255,.72);
    border-color: #dce1ed;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
  .left-shortcut-bar { background: rgba(239,235,251,.7); border-color: #dce1ed; }
  .shortcut-item {
    background: linear-gradient(145deg, #fff, #e9e7fb);
    border-color: #d7d5ec;
    box-shadow: inset 0 1px 0 #fff, 0 2px 5px rgba(50,57,100,.04);
  }
  .shortcut-item:hover { background: #dbdafa; border-color: #b5b2df; }
  .shortcut-item.empty { background: rgba(255,255,255,.35); box-shadow: none; }
  .product-card {
    background: linear-gradient(135deg, rgba(255,255,255,.97), #edf5f8);
    border-color: #dbe5ed;
    border-radius: 14px;
    box-shadow: 0 3px 10px rgba(48,64,100,.04);
  }
  .product-card:hover { background: #e3edf9; border-color: #b7c8e7; }
  .search-input-wrap input, .split-pay-group input, .dm-row input, .dm-row select {
    background: rgba(255,255,255,.9); border-color: #cdd6e7;
  }
  .search-input-wrap input:focus, .dm-row input:focus, .dm-row select:focus,
  .split-pay-group input:focus:not(.over-limit) {
    border-color: #8294cc; box-shadow: 0 0 0 3px rgba(130,148,204,.16);
  }
  .cart-count { background: #e1dcf8; color: #48416d; }
  .cart-table th { background: #e9edf8; color: #525e77; }
  .cart-table tbody tr:nth-child(even) { background: rgba(255,255,255,.45); }
  .cart-table tbody tr:hover { background: #e8effa; }
  .cart-table tbody tr.selected { background: #e5def9; }
  .cart-name-input-wrap input { border-color: #bcc5e9; }
  .cart-name-save { background: #d4e5f9; color: #344e75; }
  .checkout-area { background: rgba(255,255,255,.86); border-color: #dce1ed; }
  .btn-checkout, .btn-dm-apply, .pos-btn-pill-primary, body .btn-primary {
    background: linear-gradient(135deg, #d2e7f7, #dcd5fa);
    color: #303c60;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
  }
  .btn-checkout:hover:not(:disabled), .btn-dm-apply:hover, .pos-btn-pill-primary:hover,
  body .btn-primary:hover:not(:disabled) {
    background: linear-gradient(135deg, #bedbf3, #ccc0f5);
    box-shadow: 0 4px 12px rgba(85,100,160,.14);
  }
  .pos-action-btn, .lang-toggle, .panel-btn { background: #f0eefb; border-color: #d3d0e8; color: #454966; }
  .pos-action-btn:hover, .lang-toggle:hover { background: #e1dcf7; }
  .panel-btn-sale { background: #e4f0ed; border-color: #b6d6cf; }
  .panel-btn-repair { background: #e5ecfb; border-color: #c0cfee; }
  .btn-clear-cart { background: #fff1f3; border-color: #edc4cd; color: #ad354e; }
  .btn-clear-cart:hover:not(:disabled) { background: #f9dbe3; color: #943047; }
  .discount-modal, .pos-modal-box {
    background: #f9faff;
    border: 1px solid #dce1ef;
    border-radius: 20px;
    box-shadow: 0 20px 70px rgba(44,53,94,.2), inset 0 1px 0 #fff;
  }
  .refund-method-btn.active { background: #f4dfe9; border-color: #cf9cb1; }
  .checkout-success-overlay { background: #eef0fb; }
  .cs-action-bar { background: #f9faff; border-color: #dce1ed; }
  .cs-action-btn.cs-primary { background: #d5e5fb; border-color: #b9cdef; color: #334e79; }
  .cs-action-btn.cs-invoice { background: #e4ddfa; border-color: #cbbdeb; color: #594574; }
  .cs-action-btn.cs-whatsapp { background: #d9eee4; border-color: #b8d7c9; color: #335d4d; }
  .cs-action-btn.cs-primary:active { background: #bed4f4; }
  .cs-action-btn.cs-invoice:active { background: #d3c6f3; }
  .cs-action-btn.cs-whatsapp:active { background: #c0e2d2; }
  button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible {
    outline: 2px solid #637ab5; outline-offset: 3px;
  }
}

/* Liquid glass: static light fields behind translucent surfaces, no moving blur. */
@media screen {
  .pos-container {
    background:
      radial-gradient(ellipse at 12% 22%, rgba(132,220,232,.48), transparent 48%),
      radial-gradient(ellipse at 82% 8%, rgba(183,174,242,.42), transparent 46%),
      radial-gradient(ellipse at 80% 88%, rgba(239,193,218,.38), transparent 50%),
      linear-gradient(135deg, #edf5fa, #f2f0fa);
  }
  .left-header, .right-header, .checkout-area, .cs-action-bar {
    background: rgba(250,252,255,.78);
    border-color: rgba(151,167,196,.28);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 4px 20px rgba(58,75,114,.04);
  }
  .left-shortcut-bar { background: rgba(243,246,255,.55); }
  .product-card, .shortcut-item, .pos-action-btn, .lang-toggle, .panel-btn {
    background: linear-gradient(155deg, rgba(255,255,255,.85), rgba(240,246,255,.42));
    border-color: rgba(255,255,255,.92);
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(160,176,208,.18),
      0 3px 10px rgba(59,76,117,.08);
    transition: background .18s ease, box-shadow .18s ease;
  }
  .product-card:hover, .shortcut-item:hover, .pos-action-btn:hover, .lang-toggle:hover {
    background: linear-gradient(155deg, rgba(255,255,255,.96), rgba(221,233,255,.75));
    border-color: #fff;
    box-shadow: inset 0 1px 0 #fff, 0 4px 14px rgba(59,76,117,.12);
  }
  .panel-btn-sale { background: linear-gradient(155deg, rgba(255,255,255,.85), rgba(200,235,224,.55)); }
  .panel-btn-repair { background: linear-gradient(155deg, rgba(255,255,255,.85), rgba(202,221,252,.55)); }
  .cart-table th { background: rgba(237,243,253,.92); }
  .cart-count { background: rgba(231,224,250,.85); border: 1px solid rgba(255,255,255,.9); }
  .btn-checkout, .btn-dm-apply, .pos-btn-pill-primary, body .btn-primary {
    background: linear-gradient(160deg, rgba(255,255,255,.92), rgba(179,205,244,.72) 48%, rgba(209,191,244,.7));
    box-shadow: inset 0 1px 0 #fff, inset 0 -2px 4px rgba(116,133,184,.12),
      0 4px 14px rgba(90,110,163,.12);
  }
  .discount-modal, .pos-modal-box {
    background: rgba(249,251,255,.94);
    border-color: rgba(255,255,255,.95);
    box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 rgba(160,176,208,.2),
      0 24px 80px rgba(44,53,94,.22);
  }
  .btn-checkout:disabled { box-shadow: none; }
  @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .left-header, .right-header, .checkout-area, .cs-action-bar {
      background: rgba(250,252,255,.58);
      -webkit-backdrop-filter: blur(22px) saturate(135%);
      backdrop-filter: blur(22px) saturate(135%);
    }
    .discount-modal, .pos-modal-box {
      background: rgba(249,251,255,.83);
      -webkit-backdrop-filter: blur(26px) saturate(125%);
      backdrop-filter: blur(26px) saturate(125%);
    }
  }
}
@media screen and (prefers-reduced-motion: reduce) {
  .product-card, .shortcut-item, .pos-action-btn, .lang-toggle, .panel-btn { transition: none; }
}
@media screen and (prefers-reduced-transparency: reduce) {
  .left-header, .right-header, .checkout-area, .cs-action-bar, .discount-modal, .pos-modal-box {
    background: #f7f9ff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
