/* AMC AutoPOS — Look & layout (Settings > Look & layout).
   Themes:  html[data-theme="midnight|daylight|espresso|fresh"]   (midnight = the original look, no overrides)
   Layouts: html[data-layout="standard|cafe|shop|market"]         (standard = the original layout, no overrides)
   Loaded AFTER styles.css. Nothing here changes what the app does, only how it looks. */

/* ---------- colour themes ---------- */
html:is([data-theme="daylight"],[data-theme="sky"]) {
  --ink: #0f172a; --muted: #0369a1; --muted-dark: #475569;
  --line: rgba(15, 23, 42, 0.16); --line-gold: rgba(161, 98, 7, 0.35);
  --paper: #f3f5f8; --panel: #ffffff; --panel-raised: #eef2f6;
  --accent: #a16207; --accent-strong: #854d0e; --cyan-electric: #0369a1;
  --hl: #0369a1; --card-a: #ffffff; --card-b: #f1f5f9; --name: #0f172a; --input: #ffffff; --input-ink: #0f172a;
  --shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}
html[data-theme="espresso"] {
  --nav-ink: #f2c38b;
  --ink: #fbf3e8; --muted: #e8c9a5; --muted-dark: #a8896b;
  --line: rgba(232, 201, 165, 0.22); --line-gold: rgba(224, 164, 88, 0.4);
  --paper: #18110d; --panel: #221812; --panel-raised: #2e2018;
  --accent: #e0a458; --accent-strong: #c98a3d; --cyan-electric: #f2c38b;
  --hl: #f2c38b; --card-a: #33241b; --card-b: #241912; --name: #f6d7ae; --input: #2a1d16; --input-ink: #fbf3e8;
}
html[data-theme="fresh"] {
  --nav-ink: #86efac;
  --ink: #effbf3; --muted: #9ae6b4; --muted-dark: #6b9f7f;
  --line: rgba(154, 230, 180, 0.22); --line-gold: rgba(246, 201, 69, 0.4);
  --paper: #08160f; --panel: #0d2117; --panel-raised: #133022;
  --accent: #f6c945; --accent-strong: #d9ab25; --cyan-electric: #4ade80;
  --hl: #4ade80; --card-a: #143525; --card-b: #0c2318; --name: #f6e27a; --input: #0f281b; --input-ink: #effbf3;
}

html[data-theme]:not([data-theme="midnight"]) body,
html[data-theme]:not([data-theme="midnight"]) .app-shell { background: var(--paper) !important; color: var(--ink); }
html[data-theme]:not([data-theme="midnight"]) .side-rail,
html[data-theme]:not([data-theme="midnight"]) .cart-panel { background: var(--panel) !important; }
html[data-theme]:not([data-theme="midnight"]) input,
html[data-theme]:not([data-theme="midnight"]) select,
html[data-theme]:not([data-theme="midnight"]) textarea { background: var(--input) !important; color: var(--input-ink) !important; }
html[data-theme]:not([data-theme="midnight"]) button:not(.checkout-button):not(.primary-action):not(.category-button.is-active) { color: var(--ink); }
html[data-theme]:not([data-theme="midnight"]) .product-card {
  background: linear-gradient(135deg, var(--card-a) 0%, var(--card-b) 100%) !important;
  border-color: var(--line) !important; box-shadow: var(--shadow);
}
html[data-theme]:not([data-theme="midnight"]) .product-card:hover:not(:disabled) { border-color: var(--hl) !important; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18) !important; }
html[data-theme]:not([data-theme="midnight"]) .product-card strong {
  background: none !important; -webkit-text-fill-color: var(--name) !important; color: var(--name) !important;
}
html[data-theme]:not([data-theme="midnight"]) .product-card > span,
html[data-theme]:not([data-theme="midnight"]) .price-row b { color: var(--muted-dark); }
html[data-theme]:not([data-theme="midnight"]) .price-row b { color: var(--ink) !important; }
html[data-theme]:not([data-theme="midnight"]) .category-button:not(.is-active) {
  background: var(--panel-raised) !important; border-color: var(--line) !important; color: var(--ink) !important;
}
html[data-theme]:not([data-theme="midnight"]) .category-button:not(.is-active):hover { border-color: var(--hl) !important; }
html[data-theme]:not([data-theme="midnight"]) .cart-card,
html[data-theme]:not([data-theme="midnight"]) .receipt-panel,
html[data-theme]:not([data-theme="midnight"]) .panel-block,
html[data-theme]:not([data-theme="midnight"]) .totals-box { background: var(--panel-raised) !important; border-color: var(--line) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .cash-note-btn { color: #854d0e !important; background: rgba(161, 98, 7, 0.10) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .cash-note-btn.exact-btn { color: #0369a1 !important; background: rgba(3, 105, 161, 0.10) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .cash-digit-btn,
html:is([data-theme="daylight"],[data-theme="sky"]) .payment-button,
html:is([data-theme="daylight"],[data-theme="sky"]) .qty-controls button { background: #e2e8f0 !important; color: #0f172a !important; }

/* ---------- layouts ---------- */
/* Cafe: big category tiles, roomy menu buttons, no SKU clutter. Tips stay. */
html[data-layout="cafe"] .category-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
html[data-layout="cafe"] .category-button { min-height: 60px; border-radius: 12px !important; font-size: 16px !important; font-weight: 800 !important; }
html[data-layout="cafe"] .product-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important; }
html[data-layout="cafe"] .product-card { min-height: 120px !important; }
html[data-layout="cafe"] .product-card > span { display: none; }
html[data-layout="cafe"] .product-card strong { font-size: 20px; }

/* Shop: search/scan first, products as a dense list with SKU and stock. */
html[data-layout="shop"] .top-bar { position: sticky; top: 0; z-index: 5; background: var(--paper); padding-bottom: 8px; }
html[data-layout="shop"] .search-field input { min-height: 56px; font-size: 18px; }
html[data-layout="shop"] .product-grid { grid-template-columns: 1fr !important; gap: 6px !important; }
html[data-layout="shop"] .product-card {
  min-height: 0 !important; padding: 10px 14px !important; flex-direction: row; align-items: center; gap: 14px; border-radius: 8px;
}
html[data-layout="shop"] .product-card:hover:not(:disabled) { transform: none; }
html[data-layout="shop"] .product-card > span { order: 3; font-size: 12px; min-width: 120px; text-align: right; }
html[data-layout="shop"] .product-card strong { flex: 1; font-size: 16px; }
html[data-layout="shop"] .product-card .price-row { order: 2; gap: 10px; }

/* Market stall: few, huge buttons; big cash notes; no tip box. */
html[data-layout="market"] .category-button { min-height: 52px; font-size: 16px !important; }
html[data-layout="market"] .product-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; gap: 14px !important; }
html[data-layout="market"] .product-card { min-height: 170px !important; }
html[data-layout="market"] .product-card > span { display: none; }
html[data-layout="market"] .product-card strong { font-size: 24px; }
html[data-layout="market"] .price-row b { font-size: 22px; }
html[data-layout="market"] .checkout-controls > div:first-child > div:last-child,
html[data-layout="market"] .tip-quick-pills { display: none !important; }
html[data-layout="market"] .cash-note-btn { min-height: 64px !important; font-size: 20px !important; }

/* ---------- the picker in Settings ---------- */
.look-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.look-option {
  display: grid; gap: 6px; text-align: left; padding: 12px; min-height: 92px; align-content: start;
  border: 1.5px solid var(--line); border-radius: 10px; background: var(--panel-raised); color: var(--ink);
}
.look-option b { font-size: 15px; }
.look-option small { font-size: 12px; color: var(--muted-dark); line-height: 1.35; }
.look-option[aria-pressed="true"] { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent) inset; }
.look-swatch { display: flex; gap: 4px; }
.look-swatch i { width: 22px; height: 22px; border-radius: 6px; border: 1px solid rgba(127, 127, 127, 0.35); }

/* Daylight: much of the original page has light text written inline. Re-ink it so it reads on a light screen.
   The side rail stays dark so the brand nav keeps its contrast. */
html[data-theme][data-theme]:is([data-theme="daylight"],[data-theme="sky"]) .side-rail { background: var(--rail) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) :is(.work-area, .cart-panel) :is(
  [style*="color: #f0fdff"], [style*="color:#f0fdff"], [style*="color: #fff"], [style*="color:#fff"],
  [style*="color: #ffffff"], [style*="color:#ffffff"], [style*="color: #e0f7fa"], [style*="color: #e2e8f0"],
  [style*="color: #cbd5e1"], [style*="color:#cbd5e1"]) { color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) :is(.work-area, .cart-panel) :is([style*="color: #94a3b8"], [style*="color:#94a3b8"]) { color: var(--muted-dark) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) :is(.work-area, .cart-panel) :is(h1, h2, h3, h4, label, .grand-total, .grand-total span, .section-heading) { color: var(--ink); }
html:is([data-theme="daylight"],[data-theme="sky"]) .grand-total > span:first-child { color: var(--ink) !important; -webkit-text-fill-color: var(--ink) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .tip-quick-btn,
html:is([data-theme="daylight"],[data-theme="sky"]) .tip-mode-btn { color: var(--ink) !important; background: #e2e8f0 !important; border-color: var(--line) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) :is(.work-area, .cart-panel) button[style*="rgba(255,255,255"] { color: var(--ink) !important; background: #e2e8f0 !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .stock-pill { background: #e2e8f0 !important; color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; text-shadow: none !important; border-color: var(--line) !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .stock-pill.low { background: #fef3c7 !important; color: #92400e !important; -webkit-text-fill-color: #92400e !important; }
html:is([data-theme="daylight"],[data-theme="sky"]) .stock-pill.out { background: #fee2e2 !important; color: #991b1b !important; -webkit-text-fill-color: #991b1b !important; }

/* Cafe + Market: categories get their own full-width row under the heading. */
html:is([data-layout="cafe"], [data-layout="market"]) [data-panel="sale"] .section-heading { display: grid !important; grid-template-columns: minmax(0, 1fr); align-items: start; }

/* Phones: keep every layout inside the screen. */
@media (max-width: 680px) {
  html:is([data-layout="cafe"], [data-layout="market"]) .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  html[data-layout="market"] .product-card { min-height: 130px !important; }
  html[data-layout="market"] .product-card strong { font-size: 20px; }
  html[data-layout="cafe"] .category-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[data-layout="shop"] .product-card > span { display: none; }
}

/* ---------- fun looks: patterned backgrounds (Crimson Lotus artwork from AMC-BRAND/templates) ---------- */
html[data-theme="lotus"] {
  --ink: #fff7ed; --muted: #fda4af; --muted-dark: #e2b6c0; --line: rgba(244,63,94,.38);
  --paper: #12040b; --panel: #200816; --panel-raised: #2a0b1e; --accent: #d8a834; --cyan-electric: #f43f5e;
  --hl: #f43f5e; --card-a: #2e0c20; --card-b: #1c0611; --name: #fbe790; --input: #1f0915; --input-ink: #fff7ed;
  --glass: rgba(22,6,14,.82); --nav-ink: #fda4af;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="lotus"] body { background-color: #12040b !important; background-image: url("bg/lotus.svg"), radial-gradient(circle at 12% 15%, rgba(225,29,72,.28), transparent 50%), radial-gradient(circle at 88% 85%, rgba(216,168,52,.22), transparent 50%) !important; background-size: 320px, auto, auto !important; background-attachment: fixed !important; }
html[data-theme="electric"] {
  --ink: #f5f3ff; --muted: #c4b5fd; --muted-dark: #a5a0c8; --line: rgba(167,139,250,.32);
  --paper: #06041a; --panel: #0d0a26; --panel-raised: #151135; --accent: #facc15; --cyan-electric: #a78bfa;
  --hl: #a78bfa; --card-a: #1a1540; --card-b: #0e0b28; --name: #fde047; --input: #100c2c; --input-ink: #f5f3ff;
  --glass: rgba(13,10,38,.84); --nav-ink: #c4b5fd;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="electric"] body { background-color: #06041a !important; background-image: url("bg/electric.svg"), radial-gradient(circle at 80% 10%, rgba(167,139,250,.25), transparent 45%), radial-gradient(circle at 10% 90%, rgba(250,204,21,.12), transparent 45%) !important; background-size: 300px, auto, auto !important; background-attachment: fixed !important; }
html[data-theme="digital"] {
  --ink: #dcfce7; --muted: #4ade80; --muted-dark: #6fa585; --line: rgba(34,197,94,.3);
  --paper: #020805; --panel: #04120a; --panel-raised: #071a0f; --accent: #22c55e; --cyan-electric: #4ade80;
  --hl: #4ade80; --card-a: #08210f; --card-b: #041209; --name: #86efac; --input: #051209; --input-ink: #dcfce7;
  --glass: rgba(4,18,10,.86); --nav-ink: #4ade80;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="digital"] body { background-color: #020805 !important; background-image: url("bg/digital.svg"), radial-gradient(circle at 50% 0%, rgba(34,197,94,.14), transparent 55%) !important; background-size: 240px, auto !important; background-attachment: fixed !important; }
html[data-theme="nature"] {
  --ink: #f7fee7; --muted: #bef264; --muted-dark: #a3b38a; --line: rgba(163,230,53,.26);
  --paper: #0e1a0b; --panel: #152310; --panel-raised: #1d3016; --accent: #f59e0b; --cyan-electric: #a3e635;
  --hl: #a3e635; --card-a: #223a19; --card-b: #15240f; --name: #fde68a; --input: #14220f; --input-ink: #f7fee7;
  --glass: rgba(21,35,16,.85); --nav-ink: #bef264;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="nature"] body { background-color: #0e1a0b !important; background-image: url("bg/nature.svg"), radial-gradient(circle at 85% 15%, rgba(253,224,71,.12), transparent 45%) !important; background-size: 280px, auto !important; background-attachment: fixed !important; }
html[data-theme="space"] {
  --ink: #eef2ff; --muted: #a5b4fc; --muted-dark: #9aa3c7; --line: rgba(129,140,248,.3);
  --paper: #03020b; --panel: #0a0919; --panel-raised: #121127; --accent: #f0abfc; --cyan-electric: #818cf8;
  --hl: #818cf8; --card-a: #161435; --card-b: #0b0a1d; --name: #e0e7ff; --input: #0c0b1e; --input-ink: #eef2ff;
  --glass: rgba(10,9,25,.84); --nav-ink: #a5b4fc;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="space"] body { background-color: #03020b !important; background-image: url("bg/space.svg"), radial-gradient(ellipse at 70% 20%, rgba(129,140,248,.2), transparent 50%), radial-gradient(ellipse at 20% 80%, rgba(240,171,252,.14), transparent 50%) !important; background-size: 320px, auto, auto !important; background-attachment: fixed !important; }
html[data-theme="underwater"] {
  --ink: #ecfeff; --muted: #67e8f9; --muted-dark: #8bb8c4; --line: rgba(34,211,238,.28);
  --paper: #021a2b; --panel: #03263d; --panel-raised: #053450; --accent: #fb923c; --cyan-electric: #22d3ee;
  --hl: #22d3ee; --card-a: #06405f; --card-b: #032a42; --name: #a5f3fc; --input: #03253b; --input-ink: #ecfeff;
  --glass: rgba(3,38,61,.84); --nav-ink: #67e8f9;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="underwater"] body { background-color: #021a2b !important; background-image: url("bg/underwater.svg"), linear-gradient(180deg, rgba(34,211,238,.12), transparent 60%) !important; background-size: 280px, auto !important; background-attachment: fixed !important; }
html[data-theme="sky"] {
  --ink: #0c4a6e; --muted: #0369a1; --muted-dark: #475569; --line: rgba(2,132,199,.22);
  --paper: #dbeefe; --panel: #ffffff; --panel-raised: #f0f9ff; --accent: #d97706; --cyan-electric: #0284c7;
  --hl: #0284c7; --card-a: #ffffff; --card-b: #f0f9ff; --name: #0c4a6e; --input: #ffffff; --input-ink: #0c4a6e;
  --glass: rgba(255,255,255,.86); --nav-ink: #7dd3fc; --rail: #0c4a6e;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="sky"] body { background-color: #dbeefe !important; background-image: url("bg/sky.svg"), linear-gradient(180deg, #bae6fd 0%, #e0f2fe 60%, #fef3c7 100%) !important; background-size: 360px 300px, auto !important; background-attachment: fixed !important; }
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"]) .app-shell { background: transparent !important; }
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"]) .side-rail, html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"]) .cart-panel { background: var(--glass) !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"]) .cash-note-btn { color: var(--accent) !important; }
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"]) .cash-note-btn.exact-btn { color: var(--hl) !important; border-color: var(--hl) !important; }
html[data-theme="digital"] .product-card strong, html[data-theme="digital"] .price-row b { font-family: ui-monospace, "SF Mono", Menlo, monospace; }
.look-option[data-set-theme="lotus"] { background: #12040b url("bg/lotus.svg") center / 150px; color: #fff7ed; border-color: rgba(244,63,94,.38); }
.look-option[data-set-theme="lotus"] small { color: #fda4af; }
.look-option[data-set-theme="electric"] { background: #06041a url("bg/electric.svg") center / 150px; color: #f5f3ff; border-color: rgba(167,139,250,.32); }
.look-option[data-set-theme="electric"] small { color: #c4b5fd; }
.look-option[data-set-theme="digital"] { background: #020805 url("bg/digital.svg") center / 150px; color: #dcfce7; border-color: rgba(34,197,94,.3); }
.look-option[data-set-theme="digital"] small { color: #4ade80; }
.look-option[data-set-theme="nature"] { background: #0e1a0b url("bg/nature.svg") center / 150px; color: #f7fee7; border-color: rgba(163,230,53,.26); }
.look-option[data-set-theme="nature"] small { color: #bef264; }
.look-option[data-set-theme="space"] { background: #03020b url("bg/space.svg") center / 150px; color: #eef2ff; border-color: rgba(129,140,248,.3); }
.look-option[data-set-theme="space"] small { color: #a5b4fc; }
.look-option[data-set-theme="underwater"] { background: #021a2b url("bg/underwater.svg") center / 150px; color: #ecfeff; border-color: rgba(34,211,238,.28); }
.look-option[data-set-theme="underwater"] small { color: #67e8f9; }
.look-option[data-set-theme="sky"] { background: #dbeefe url("bg/sky.svg") center / 150px; color: #0c4a6e; border-color: rgba(2,132,199,.22); }
.look-option[data-set-theme="sky"] small { color: #0369a1; }
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="sky"] .side-rail { background: var(--rail) !important; }
html[data-theme="stone"] {
  --ink: #f5f5f4; --muted: #d6d3d1; --muted-dark: #a8a29e; --line: rgba(214,211,209,.24);
  --paper: #1c1a18; --panel: #262320; --panel-raised: #302c28; --accent: #d97706; --cyan-electric: #fbbf24;
  --hl: #fbbf24; --card-a: #3a3631; --card-b: #2a2723; --name: #fde68a; --input: #24211e; --input-ink: #f5f5f4;
  --glass: rgba(38,35,32,.86); --nav-ink: #e7e5e4;
}
html[data-theme]:not([data-theme="midnight"]):is([data-theme="lotus"],[data-theme="electric"],[data-theme="digital"],[data-theme="nature"],[data-theme="space"],[data-theme="underwater"],[data-theme="sky"],[data-theme="stone"])[data-theme="lotus"][data-theme="stone"] body { background-color: #1c1a18 !important; background-image: url("bg/stone.svg"), radial-gradient(circle at 30% 20%, rgba(168,162,158,.14), transparent 55%), radial-gradient(circle at 80% 90%, rgba(217,119,6,.08), transparent 50%) !important; background-size: 300px, auto, auto !important; background-attachment: fixed !important; }
.look-option[data-set-theme="stone"] { background: #1c1a18 url("bg/stone.svg") center / 150px; color: #f5f5f4; border-color: rgba(214,211,209,.24); }
.look-option[data-set-theme="stone"] small { color: #d6d3d1; }

/* Settings cards: keep content at the top when a neighbouring card is taller. */
.panel-block { align-content: start; }
/* fun-look preview cards always show their own colours, whatever theme is active */
.look-picker .look-option[data-set-theme="lotus"], .look-picker .look-option[data-set-theme="lotus"] b { color: #fff7ed !important; }
.look-picker .look-option[data-set-theme="electric"], .look-picker .look-option[data-set-theme="electric"] b { color: #f5f3ff !important; }
.look-picker .look-option[data-set-theme="digital"], .look-picker .look-option[data-set-theme="digital"] b { color: #dcfce7 !important; }
.look-picker .look-option[data-set-theme="nature"], .look-picker .look-option[data-set-theme="nature"] b { color: #f7fee7 !important; }
.look-picker .look-option[data-set-theme="space"], .look-picker .look-option[data-set-theme="space"] b { color: #eef2ff !important; }
.look-picker .look-option[data-set-theme="underwater"], .look-picker .look-option[data-set-theme="underwater"] b { color: #ecfeff !important; }
.look-picker .look-option[data-set-theme="sky"], .look-picker .look-option[data-set-theme="sky"] b { color: #0c4a6e !important; }
.look-picker .look-option[data-set-theme="stone"], .look-picker .look-option[data-set-theme="stone"] b { color: #f5f5f4 !important; }

/* ---------- polish: re-colour the original page's fixed cyan accents in every non-classic look ---------- */
html[data-theme]:not([data-theme="midnight"]) :is(.app-shell, .terminal-modal-card) :is(
  [style*="color: #00f0ff"], [style*="color:#00f0ff"], [style*="color: #00bbff"], [style*="color:#00bbff"],
  [style*="color: #00f3ff"], [style*="color:#00f3ff"], [style*="color: #38bdf8"], [style*="color:#38bdf8"]):not(.mode-button) {
  color: var(--hl) !important;
}
html[data-theme]:not([data-theme="midnight"]) :is(.app-shell, .terminal-modal-card) :is(
  [style*="background: rgba(0, 240, 255"], [style*="background:rgba(0,240,255"], [style*="background: rgba(0, 187, 255"],
  [style*="background: rgba(0,240,255"], [style*="background: rgba(0, 243, 255"]):not(.mode-button) {
  background: color-mix(in srgb, var(--hl) 14%, transparent) !important;
}
html[data-theme]:not([data-theme="midnight"]) :is(.app-shell, .terminal-modal-card) :is(
  [style*="border: 1px solid rgba(0, 240, 255"], [style*="border: 1px solid #00f0ff"], [style*="border-color: #00f0ff"],
  [style*="solid #00bbff"], [style*="dashed #00bbff"], [style*="solid #00f3ff"], [style*="solid #00f0ff"],
  [style*="border: 1px solid rgba(0,240,255"], [style*="border: 1.5px solid rgba(0, 240, 255"]):not(.mode-button) {
  border-color: var(--hl) !important;
}
/* light looks: the fixed pale text greys need to be dark */
html:is([data-theme="daylight"],[data-theme="sky"]) :is(.work-area, .cart-panel) :is([style*="color: #f8fafc"], [style*="color:#f8fafc"]) { color: var(--ink) !important; }
/* Update / Refresh sits in the side rail: match the nav */
html[data-theme]:not([data-theme="midnight"]) #forceUpdateBtn { color: var(--nav-ink) !important; border-color: color-mix(in srgb, var(--nav-ink) 40%, transparent) !important; background: color-mix(in srgb, var(--nav-ink) 10%, transparent) !important; }
/* side-rail nav buttons: tint their pale cyan box to the look */
html[data-theme]:not([data-theme="midnight"]) .side-rail .mode-button:not(.is-active) { background: color-mix(in srgb, var(--nav-ink) 8%, transparent) !important; border-color: color-mix(in srgb, var(--nav-ink) 35%, transparent) !important; }
html[data-theme]:not([data-theme="midnight"]):not([data-theme="daylight"]):not([data-theme="sky"]) .stock-pill:not(.low):not(.out) {
  color: var(--hl) !important; -webkit-text-fill-color: var(--hl) !important;
  border-color: color-mix(in srgb, var(--hl) 45%, transparent) !important; background: color-mix(in srgb, var(--hl) 10%, transparent) !important;
}
/* light looks: solid amber total instead of the pale gold shimmer */
html:is([data-theme="daylight"],[data-theme="sky"]) .grand-total strong,
html:is([data-theme="daylight"],[data-theme="sky"]) .grand-total > :last-child { background: none !important; -webkit-text-fill-color: var(--accent) !important; color: var(--accent) !important; }

/* ---------- logo: same AMC AutoPOS logo, recoloured to suit each look (Crimson Lotus swaps to the official Asia lotus logo in app.js) ---------- */
.brand-lockup img { transition: filter .3s ease; }
html[data-theme="espresso"] .brand-lockup img { filter: sepia(.85) saturate(1.3) hue-rotate(-8deg); }
html[data-theme="fresh"] .brand-lockup img { filter: grayscale(1) sepia(1) hue-rotate(65deg) saturate(2.6); }
html[data-theme="electric"] .brand-lockup img { filter: grayscale(1) sepia(1) hue-rotate(215deg) saturate(3.2) brightness(1.05); }
html[data-theme="digital"] .brand-lockup img { filter: grayscale(1) sepia(1) hue-rotate(80deg) saturate(4) brightness(.95); }
html[data-theme="nature"] .brand-lockup img { filter: sepia(.55) hue-rotate(35deg) saturate(1.4); }
html[data-theme="space"] .brand-lockup img { filter: grayscale(1) sepia(1) hue-rotate(190deg) saturate(2.6); }
html[data-theme="underwater"] .brand-lockup img { filter: hue-rotate(-10deg) saturate(1.4); }
html[data-theme="stone"] .brand-lockup img { filter: grayscale(1) sepia(.35) contrast(1.1); }
html[data-theme="sky"] .brand-lockup img, html[data-theme="daylight"] .brand-lockup img { filter: saturate(1.1) brightness(1.08); }
html[data-theme]:not([data-theme="midnight"]) .brand-lockup img { box-shadow: 0 4px 18px rgba(0,0,0,.45), 0 0 0 1px color-mix(in srgb, var(--hl) 35%, transparent) !important; }