:root {
  --ink: #182230;
  --ink-soft: #2a3a4d;
  --paper: #f4f5f1;
  --card: #ffffff;
  --line: #dfe3da;
  --accent: #0e8f6e;       /* acciones principales / venta */
  --accent-dark: #0a6b53;
  --appt: #c77d2b;         /* todo lo relacionado con citas */
  --danger: #c44536;
  --muted: #6b7768;
  --radius: 12px;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e8edf2;
  --ink-soft: #253342;
  --paper: #0f151c;
  --card: #18212b;
  --line: #334252;
  --accent: #19a982;
  --accent-dark: #39c9a3;
  --appt: #e39a48;
  --danger: #ed6a5a;
  --muted: #9cabb8;
}
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; overflow-x: hidden; }
body {
  font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  background: var(--paper); color: var(--ink); font-size: 15px;
}
button { font: inherit; cursor: pointer; border: none; border-radius: var(--radius); }
input, select, textarea {
  font: inherit; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; width: 100%; min-height: 44px;
}
input:focus, select:focus, textarea:focus, button:focus-visible { outline: 3px solid rgba(14,143,110,.35); outline-offset: 1px; }
label { display: block; font-size: 12.5px; color: var(--muted); margin: 10px 0 4px; font-weight: 600; letter-spacing: .02em; }

/* ---------- Login ---------- */
.login-wrap { min-height: 100dvh; display: grid; place-items: center; background: linear-gradient(160deg, var(--ink) 0%, #0d3b30 100%); padding: 16px; }
.login-card { background: var(--card); border-radius: 18px; padding: 32px 28px; width: 100%; max-width: 380px; box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.brand { font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.brand span { color: var(--accent); }
.brand-sub { color: var(--muted); font-size: 13px; margin-top: 2px; margin-bottom: 18px; }

/* ---------- Layout ---------- */
.layout { display: grid; grid-template-columns: 220px 1fr; min-height: 100dvh; }
.sidebar { background: var(--ink); color: #cfd8d2; padding: 16px 10px; display: flex; flex-direction: column; gap: 2px; position: sticky; top: 0; height: 100dvh; overflow-y: auto; }
.sidebar .brand { color: #fff; font-size: 19px; padding: 6px 12px 14px; }
.nav-btn { background: transparent; color: #cfd8d2; text-align: left; padding: 12px 14px; border-radius: 10px; font-weight: 600; font-size: 14px; min-height: 46px; }
.nav-btn:hover { background: var(--ink-soft); color: #fff; }
.nav-btn.active { background: var(--accent); color: #fff; }
.nav-btn.appt.active { background: var(--appt); }
.nav-spacer { flex: 1; }
.nav-user { font-size: 12px; color: #93a39a; padding: 8px 14px; border-top: 1px solid #2c3a47; }
.main { padding: 20px; max-width: 1280px; width: 100%; min-width: 0; }
.main.has-watermark { position: relative; }
.main.has-watermark > * { position: relative; z-index: 1; }
.main.has-watermark::before {
  content: "";
  position: fixed;
  top: 50%; left: calc(50% + 110px); /* compensa el ancho de la barra lateral */
  transform: translate(-50%, -50%);
  width: min(60vw, 540px); height: min(60vh, 540px);
  background-image: var(--shop-logo);
  background-repeat: no-repeat; background-position: center; background-size: contain;
  opacity: .06;
  pointer-events: none; z-index: 0;
}
@media (max-width: 900px) {
  .main.has-watermark::before { left: 50%; width: min(78vw, 420px); height: min(48vh, 420px); }
}
.page-title { font-size: 21px; font-weight: 800; letter-spacing: -.01em; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.page-title .spacer { flex: 1; }

/* ---------- Componentes ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; }
.grid { display: grid; gap: 12px; }
.cols-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.btn { background: var(--accent); color: #fff; padding: 11px 18px; font-weight: 700; min-height: 46px; }
.btn:hover { background: var(--accent-dark); }
.btn.secondary { background: #e9ece4; color: var(--ink); }
.btn.appt { background: var(--appt); }
.btn.appt.secondary { background: #e9ece4; color: var(--ink); }
.btn.danger { background: var(--danger); }
.btn.sm { min-height: 36px; padding: 6px 12px; font-size: 13px; border-radius: 9px; }
.pill { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: #e9ece4; }
.pill.ok { background: #d7efe5; color: var(--accent-dark); }
.pill.warn { background: #fae6cd; color: #8a5417; }
.pill.bad { background: #f6d9d4; color: var(--danger); }
.muted { color: var(--muted); font-size: 13px; }
.money { font-family: var(--mono); font-weight: 700; }
.banner { background: #fae6cd; border: 1px solid #ecc890; color: #6e4310; padding: 10px 14px; border-radius: 10px; margin-bottom: 14px; font-weight: 600; }

table { width: 100%; border-collapse: collapse; background: var(--card); border-radius: var(--radius); overflow: hidden; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--line); font-size: 14px; }
th { background: #eef0ea; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
tr:last-child td { border-bottom: none; }
.table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid var(--line); border-radius: var(--radius); }
.table-wrap table { border-radius: 0; }
.sales-filters { margin-bottom: 12px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.range-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.custom-range { display: flex; align-items: end; gap: 8px; flex-wrap: wrap; }
.custom-range label { margin: 0; }
.custom-range input { width: auto; display: block; margin-top: 4px; }

/* ---------- POS ---------- */
.pos { display: grid; grid-template-columns: 1fr 360px; gap: 14px; align-items: start; }
.pos-catalog { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.pos-path { display: flex; align-items: center; gap: 10px; margin: -2px 0 10px; font-weight: 800; }
.pos-folder {
  position: relative; min-height: 96px; padding: 18px 12px 12px; text-align: left;
  background: #fff8df; border: 1px solid #ead28b; border-radius: var(--radius);
  display: flex; flex-direction: column; justify-content: space-between; box-shadow: inset 0 4px 0 rgba(255,255,255,.45);
}
body, input, select, textarea, .card, .modal, .pos-item, table { transition: background-color .18s, color .18s, border-color .18s; }
.pos-folder.service { background: #fbf0e4; border-color: #e3b377; }
.pos-folder:active { transform: scale(.97); }
.folder-tab {
  position: absolute; top: -1px; left: 12px; width: 42%; max-width: 72px; height: 13px;
  border: 1px solid #ead28b; border-bottom: 0; border-radius: 8px 8px 0 0; background: #fff8df;
}
.pos-folder.service .folder-tab { background: #fbf0e4; border-color: #e3b377; }
.folder-name { font-weight: 800; font-size: 14px; line-height: 1.2; overflow-wrap: anywhere; }
.folder-count { font-size: 12px; color: var(--muted); }
.pos-item { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; text-align: left; min-height: 92px; display: flex; flex-direction: column; justify-content: space-between; }
.pos-item:active { transform: scale(.97); }
.pos-item .name { font-weight: 700; font-size: 13.5px; line-height: 1.25; }
.pos-item .price { font-family: var(--mono); font-weight: 800; color: var(--accent-dark); }
.pos-item.service { border-left: 4px solid var(--appt); }
.pos-item.service .price { color: var(--appt); }
.pos-item .stock { font-size: 11px; color: var(--muted); }
.pos-item .stock.low { color: var(--danger); font-weight: 700; }
.cart { position: sticky; top: 14px; }
.cart-lines { max-height: 44vh; overflow-y: auto; margin: 8px 0; }
.cart-line { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.qty-controls { display: flex; gap: 6px; align-items: center; }
.qty-controls button { width: 34px; height: 34px; border-radius: 8px; background: #e9ece4; font-weight: 800; font-size: 16px; }
.cart-total { display: flex; justify-content: space-between; font-size: 15px; padding: 3px 0; }
.cart-total.big { font-size: 22px; font-weight: 800; }
.cart-customer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.cart-customer .btn { max-width: 72%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-picker { display: grid; gap: 7px; max-height: 48vh; overflow-y: auto; margin-top: 10px; }
.customer-pick { display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; text-align: left; background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: 9px; }
.customer-pick:hover { border-color: var(--accent); }
.customer-pick span { color: var(--muted); font-size: 12.5px; }
.service-assignment { display: flex; align-items: center; gap: 7px; margin-top: 6px; color: var(--muted); font-size: 12.5px; }
.service-assignment .btn { padding: 4px 8px; }

/* ---------- Agenda ---------- */
.agenda-appt { border-left: 5px solid var(--appt); background: var(--card); border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; display: grid; grid-template-columns: 70px 1fr auto; gap: 10px; align-items: center; border-top: 1px solid var(--line); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.agenda-appt:hover { border-color: var(--appt); }
.agenda-appt .time { font-family: var(--mono); font-weight: 800; font-size: 16px; }
.agenda-appt .who { font-weight: 700; }
.agenda-week { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.agenda-day { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; min-height: 110px; }
.agenda-day h3 { font-size: 14px; margin-bottom: 10px; text-transform: capitalize; }
.agenda-day .agenda-appt { grid-template-columns: 58px 1fr; }
.agenda-day .agenda-appt > .row { grid-column: 1 / -1; flex-direction: row !important; }
.agenda-empty { padding: 8px 0; }
.date-stepper { display: inline-flex; align-items: center; gap: 5px; }
.date-stepper input { width: auto; min-width: 145px; }
.date-arrow {
  width: 38px; height: 38px; min-width: 38px; border: 1px solid var(--line);
  background: var(--card); color: var(--ink); font-size: 20px; font-weight: 800;
}
.date-arrow:hover { border-color: var(--appt); color: var(--appt); }
.status-scheduled { color: var(--muted); } .status-confirmed { color: #1d6fa5; }
.status-in_progress { color: var(--appt); } .status-completed { color: var(--accent-dark); }
.status-cancelled, .status-no_show { color: var(--danger); }
.detail-list { display: grid; gap: 8px; margin-top: 12px; }
.detail-list > div { display: flex; justify-content: space-between; gap: 14px; border-bottom: 1px dashed var(--line); padding-bottom: 7px; }
.detail-list span { color: var(--muted); font-size: 12.5px; }
.detail-list b { text-align: right; }

/* ---------- Modal / toast ---------- */
.modal-bg { position: fixed; inset: 0; background: rgba(20,28,24,.55); display: grid; place-items: center; padding: 14px; z-index: 50; }
.modal { background: var(--card); border-radius: 16px; padding: 20px; width: 100%; max-width: min(520px, calc(100vw - 28px)); max-height: 92dvh; overflow-y: auto; }
.modal h3 { margin-bottom: 6px; }
.toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 12px 20px; border-radius: 99px; font-weight: 600; z-index: 99; box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.toast.error { background: var(--danger); }

.stat { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 14px 16px; }
.stat .v { font-size: 24px; font-weight: 800; font-family: var(--mono); }
.stat .l { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.report-movements { margin-top: 22px; }
.report-tabs { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; }
.reports-view:not(.report-section-summary) .report-summary-only,
.reports-view:not(.report-section-profit) .report-profit-only,
.reports-view:not(.report-section-commissions) .report-commissions-only,
.reports-view:not(.report-section-movements) .report-movements-only,
.reports-view:not(.report-section-credit) .report-credit-only { display: none; }
.profit-summary { grid-template-columns: repeat(4, minmax(150px, 1fr)); margin: 12px 0; }
.profit-net { border-left: 4px solid var(--accent); color: var(--accent-dark); }
.profit-formula { display: grid; grid-template-columns: 1fr auto; gap: 8px 20px; max-width: 520px; }
.profit-formula b { text-align: right; font-family: var(--mono); }
.report-movements h2 { margin-bottom: 2px; }
.movement-totals { grid-template-columns: repeat(3, minmax(160px, 1fr)); margin: 12px 0; }
.stat.movement-in { border-left: 4px solid var(--accent); }
.stat.movement-out { border-left: 4px solid var(--danger); }
.movement-sale { background: #e8eef7; color: #31527c; }
.movement-in, .movement-amount-in { color: var(--accent-dark); }
.movement-out, .movement-amount-out { color: var(--danger); }

/* ---------- Móvil ---------- */
@media (max-width: 900px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: fixed; bottom: 0; top: auto; height: auto; width: 100%; flex-direction: row; overflow-x: auto; padding: 6px; z-index: 40; }
  .sidebar .brand, .nav-user, .nav-spacer { display: none; }
  .nav-btn { white-space: nowrap; }
  .main { padding: 14px 14px 90px; }
  .page-title { align-items: stretch; }
  .page-title .spacer { display: none; }
  .page-title > .btn { margin-left: auto; }
  .pos { grid-template-columns: 1fr; }
  .cart { position: static; }
  .sales-filters { align-items: stretch; }
  .range-tabs { width: 100%; }
  .range-tabs .btn { flex: 1; }
  .movement-totals { grid-template-columns: 1fr; }
  .profit-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-tabs .btn { flex: 1; }
}
@media (max-width: 680px) {
  .people-table table { table-layout: fixed; min-width: 0; }
  .people-table th, .people-table td { padding: 10px 8px; overflow-wrap: anywhere; }
  .people-table th:nth-child(3),
  .people-table td:nth-child(3),
  .people-table th:nth-child(5),
  .people-table td:nth-child(5) { display: none; }
  .people-table th:nth-child(1), .people-table td:nth-child(1) { width: 24%; }
  .people-table th:nth-child(2), .people-table td:nth-child(2) { width: 34%; }
  .people-table th:nth-child(4), .people-table td:nth-child(4) { width: 18%; text-align: center; }
  .people-table th:last-child, .people-table td:last-child { width: 24%; }
  .people-table td:last-child .row { flex-direction: column; align-items: stretch; gap: 6px !important; }
  .people-table .btn.sm { width: 100%; padding-left: 8px; padding-right: 8px; }
  .phone-actions { white-space: normal; }
}
@media (max-width: 560px) {
  .modal { padding: 16px; border-radius: 12px; }
  .modal .row { align-items: stretch; }
  .modal .row > .btn { flex: 1 1 140px; min-width: 0; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* Selección de servicios en el modal de citas */
.svc-picker {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px; margin: 4px 0 2px;
}
.svc-path { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; font-weight: 800; margin-bottom: 2px; }
.svc-chip {
  display: flex; align-items: center; gap: 9px; text-align: left;
  padding: 10px 12px; border: 1.5px solid #d9ddd3; border-radius: 12px;
  background: #fafbf9; cursor: pointer; transition: all .15s; font: inherit;
}
.svc-chip:hover { border-color: var(--appt); background: #fff; }
.svc-chip.on { border-color: var(--appt); background: #fbf2e6; box-shadow: 0 0 0 2px rgba(199,125,43,.18); }
.svc-check {
  flex: none; width: 24px; height: 24px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #e4e8df; color: #8a9387; font-weight: 800; font-size: 14px; transition: all .15s;
}
.svc-chip.on .svc-check { background: var(--appt); color: #fff; }
.svc-info { display: flex; flex-direction: column; min-width: 0; }
.svc-name { font-weight: 700; font-size: 14px; line-height: 1.2; }
.svc-meta { font-size: 12px; color: #8a9387; }
.svc-summary {
  margin: 10px 0 2px; padding: 9px 12px; border-radius: 10px;
  background: #f4f0e9; font-size: 14px;
}
.svc-durations { display: grid; gap: 8px; margin-top: 10px; }
.svc-duration-title { font-size: 12px; font-weight: 800; color: #6f766d; text-transform: uppercase; letter-spacing: .04em; }
.svc-duration-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 8px 10px; border: 1px solid #e0ddd5; border-radius: 10px; background: #fffdf9;
}
.svc-duration-row span { font-weight: 700; min-width: 0; overflow-wrap: anywhere; }
.svc-duration-row label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 700; color: #6f766d; }
.svc-duration-row input { width: 78px; }
/* Botón WhatsApp */
.wa-btn {
  flex: none; display: inline-flex; align-items: center; gap: 6px;
  background: #25d366; border-color: #25d366; color: #fff; white-space: nowrap;
}
.wa-btn:hover { background: #1ebe5a; border-color: #1ebe5a; }
.wa-btn:disabled { cursor: not-allowed; }
.phone-actions { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.wa-icon-btn {
  width: 27px; height: 27px; min-width: 27px; padding: 0; border-radius: 50%;
  display: inline-grid; place-items: center; background: #25d366; color: #fff;
}
.wa-icon-btn:hover { background: #1ebe5a; transform: translateY(-1px); }

/* Modal de cobro */
.pay-tabs { display: flex; gap: 8px; margin: 4px 0 14px; }
.mixed-pay-banner { padding: 8px 11px; margin-bottom: 10px; border-radius: 9px; background: #e1f3eb; color: var(--accent-dark); font-size: 12.5px; font-weight: 700; }
#mixed-pay-btn.on { background: var(--accent); color: #fff; }
.pay-tab {
  flex: 1; padding: 11px 6px; border: 1.5px solid #d9ddd3; border-radius: 12px;
  background: #fafbf9; cursor: pointer; font: inherit; font-weight: 700; font-size: 13.5px;
  transition: all .15s; color: var(--ink);
}
.pay-tab:hover { border-color: var(--accent); }
.pay-tab.on { border-color: var(--accent); background: #e1f3eb; box-shadow: 0 0 0 2px rgba(14,143,110,.16); }
.cash-amount {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: #f4f0e9; border-radius: 12px; margin-bottom: 10px;
}
.cash-amount .money { font-size: 26px; font-weight: 800; }
.denoms { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.denom {
  padding: 13px 4px; border: 1.5px solid #d9ddd3; border-radius: 10px;
  background: #fff; cursor: pointer; font: inherit; font-weight: 700; font-size: 14px;
  transition: all .12s; color: var(--ink);
}
.denom:hover { border-color: var(--accent); background: #e1f3eb; }
.denom:active { transform: scale(.95); }
.pay-summary { margin-top: 14px; padding: 12px 16px; background: #f4f5f1; border-radius: 12px; }
.pay-line { display: flex; justify-content: space-between; align-items: center; font-size: 14px; color: #6d7a70; }
.pay-line.big { font-size: 20px; font-weight: 800; color: var(--ink); margin-top: 4px; }
@media (max-width: 560px) { .denoms { grid-template-columns: repeat(4, 1fr); } }

/* Historial del cliente */
.hist-list { max-height: 200px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.hist-item { padding: 9px 12px; background: #fafbf9; border: 1px solid #e6e9e1; border-radius: 10px; font-size: 14px; }
.hist-item .muted { font-size: 12.5px; margin-top: 2px; }
.modal h4 { font-size: 13px; text-transform: uppercase; letter-spacing: .03em; color: #8a9387; }

/* Configuraciones y ticket */
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.setting-card { display: flex; flex-direction: column; justify-content: space-between; gap: 18px; min-height: 150px; }
.setting-card h3 { margin-bottom: 5px; }
.settings-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.switch-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0; color: var(--ink); font-size: 14px; }
.switch-row input { width: 22px; height: 22px; min-height: 0; accent-color: var(--accent); }
.ticket-success { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #d7efe5; color: var(--accent-dark); font-size: 27px; font-weight: 900; margin-bottom: 8px; }
.ticket-preview { margin: 14px 0; padding: 12px; background: var(--paper); border: 1px dashed var(--line); border-radius: 10px; }
.ticket-image-wrap { margin: 14px 0; padding: 8px; background: #e9ece4; border: 1px solid var(--line); border-radius: 10px; max-height: 48vh; overflow-y: auto; }
#ticket-canvas { display: block; width: 100%; height: auto; background: #fff; border-radius: 6px; }

/* Ajustes de superficies para modo oscuro */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea { background: #111922; color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .sidebar { background: #090e13; }
html[data-theme="dark"] .btn.secondary,
html[data-theme="dark"] .qty-controls button,
html[data-theme="dark"] .date-arrow { background: #293644; color: var(--ink); }
html[data-theme="dark"] .btn.appt.secondary { background: #293644; color: #f2f5f7; }
html[data-theme="dark"] .mixed-pay-banner { background: #173c31; color: #74d9bc; }
html[data-theme="dark"] th { background: #202c37; }
html[data-theme="dark"] .pill { background: #293644; color: var(--ink); }
html[data-theme="dark"] .pill.ok { background: #173c31; color: #74d9bc; }
html[data-theme="dark"] .pill.warn { background: #4a321b; color: #f0b979; }
html[data-theme="dark"] .pill.bad { background: #4b2524; color: #ff8d81; }
html[data-theme="dark"] .movement-sale { background: #24364e; color: #9fc2ef; }
html[data-theme="dark"] .movement-in,
html[data-theme="dark"] .movement-amount-in { color: #74d9bc; }
html[data-theme="dark"] .profit-net { color: #74d9bc; }
html[data-theme="dark"] .banner { background: #49351d; border-color: #73552c; color: #f1c48b; }
html[data-theme="dark"] .pos-folder,
html[data-theme="dark"] .folder-tab { background: #3a321d; border-color: #75642d; }
html[data-theme="dark"] .pos-folder.service,
html[data-theme="dark"] .pos-folder.service .folder-tab { background: #3b2a1d; border-color: #79502a; }
html[data-theme="dark"] .svc-chip,
html[data-theme="dark"] .svc-duration-row,
html[data-theme="dark"] .denom,
html[data-theme="dark"] .hist-item { background: #151e27; border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .svc-chip:hover { background: #1c2833; }
html[data-theme="dark"] .svc-chip.on { background: #3a2b1c; }
html[data-theme="dark"] .svc-check { background: #334252; color: var(--muted); }
html[data-theme="dark"] .svc-summary,
html[data-theme="dark"] .cash-amount,
html[data-theme="dark"] .pay-summary { background: #111922; }
html[data-theme="dark"] .pay-tab { background: #151e27; color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .pay-tab.on,
html[data-theme="dark"] .denom:hover { background: #173c31; }
html[data-theme="dark"] .ticket-success { background: #173c31; color: #74d9bc; }
html[data-theme="dark"] .ticket-image-wrap { background: #111922; }