:root {
  color-scheme: light;
  --navy: #0d2b52;
  --navy-2: #173e70;
  --gold: #f4c430;
  --gold-soft: #fff6cc;
  --red: #c62828;
  --green: #138a4b;
  --green-dark: #0d6d3a;
  --ink: #17212f;
  --muted: #647082;
  --line: #d9dee6;
  --paper: #ffffff;
  --canvas: #f5f2e9;
  --danger-soft: #fff0f0;
  --shadow: 0 14px 35px rgba(13, 43, 82, 0.11);
  --radius: 18px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }

html { background: var(--canvas); overflow-x: hidden; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 95% 0%, rgba(244, 196, 48, 0.17), transparent 24rem),
    var(--canvas);
  overflow-x: hidden;
}

button, input, textarea, a { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }

.app-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: max(12px, env(safe-area-inset-top)) max(18px, calc((100vw - 980px) / 2));
  color: white;
  background: rgba(13, 43, 82, 0.97);
  box-shadow: 0 4px 18px rgba(13, 43, 82, 0.18);
  backdrop-filter: blur(14px);
}

.brand { display: flex; align-items: center; gap: 11px; }
.brand-mark {
  display: grid;
  width: 43px;
  height: 43px;
  place-items: center;
  border-radius: 14px;
  color: var(--navy);
  background: var(--gold);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: -0.04em;
}
.brand p { margin: 0 0 1px; color: #dce8f7; font-size: 10px; font-weight: 800; letter-spacing: 0.13em; }
.brand h1 { margin: 0; font-size: 20px; line-height: 1.1; }

.status-pill {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 999px;
  color: #e8f2ff;
  font-size: 12px;
  font-weight: 700;
}
.status-pill.offline { color: #453600; background: var(--gold); border-color: var(--gold); }

main { width: min(calc(100% - 28px), 820px); margin: 0 auto; padding: 30px 0 178px; }
.assistant-launcher {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  margin: 0 0 22px;
  padding: 13px 15px;
  text-align: left;
  border: 2px solid #dfb436;
  border-radius: 16px;
  color: var(--navy);
  background: linear-gradient(135deg, #fff9dd, #ffffff 70%);
  box-shadow: 0 8px 22px rgba(13,43,82,.09);
}
.assistant-launcher:hover, .assistant-launcher:focus-visible { border-color: var(--navy); box-shadow: 0 0 0 4px rgba(244,196,48,.2); outline: 0; }
.assistant-launcher-icon, .assistant-heading-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 13px;
  color: var(--navy);
  background: var(--gold);
  font-size: 24px;
  font-weight: 900;
}
.assistant-launcher-copy { min-width: 0; }
.assistant-launcher-copy strong, .assistant-launcher-copy small { display: block; }
.assistant-launcher-copy strong { font-size: 16px; }
.assistant-launcher-copy small { margin-top: 2px; color: var(--muted); font-size: 12px; line-height: 1.3; }
.assistant-launcher-private { padding: 6px 9px; border-radius: 999px; color: #35536f; background: #edf3f8; font-size: 10px; font-weight: 900; white-space: nowrap; }
.view { animation: enter .2s ease-out; }
@keyframes enter { from { opacity: .5; transform: translateY(4px); } }

.page-heading { margin: 0 2px 24px; }
.page-heading.compact { margin-bottom: 18px; }
.page-heading h2 { margin: 3px 0 7px; color: var(--navy); font-size: clamp(27px, 6vw, 40px); line-height: 1.08; letter-spacing: -.035em; }
.page-heading p:last-child { margin: 0; color: var(--muted); font-size: 16px; }
.eyebrow { margin: 0; color: var(--red); font-size: 11px; font-weight: 900; letter-spacing: .16em; }

.panel {
  margin-bottom: 18px;
  padding: 20px;
  border: 1px solid rgba(13, 43, 82, .1);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.panel.muted { opacity: .58; box-shadow: none; }
.panel.ready { opacity: 1; box-shadow: var(--shadow); }

.step-heading { display: flex; gap: 13px; align-items: flex-start; margin-bottom: 18px; }
.step-number {
  display: grid;
  flex: 0 0 36px;
  height: 36px;
  place-items: center;
  border-radius: 12px;
  color: var(--navy);
  background: var(--gold);
  font-weight: 900;
}
.step-heading h3 { margin: 0 0 3px; color: var(--navy); font-size: 19px; }
.step-heading p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.45; }

.search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 0 13px;
  border: 2px solid var(--navy);
  border-radius: 15px;
  background: white;
  transition: box-shadow .15s, border-color .15s;
}
.search-box:focus-within { border-color: var(--navy-2); box-shadow: 0 0 0 4px rgba(23,62,112,.12); }
.search-box svg { width: 22px; fill: none; stroke: var(--navy); stroke-width: 2; stroke-linecap: round; }
.search-box input { flex: 1; min-width: 0; border: 0; outline: 0; color: var(--ink); font-size: 17px; }
.search-box input::placeholder { color: #8993a1; }
.contact-picker-button {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  width: 100%;
  min-height: 58px;
  margin-top: 12px;
  padding: 9px 12px;
  text-align: left;
  border: 1.5px solid #72ad88;
  border-radius: 14px;
  color: var(--navy);
  background: #effaf3;
}
.contact-picker-button:hover, .contact-picker-button:focus-visible { border-color: var(--green); background: #e5f7ec; outline: 3px solid rgba(19,138,75,.14); }
.contact-picker-button:disabled { cursor: wait; opacity: .7; }
.client-dialog-contact-picker { margin: 0 0 14px; }
.contact-picker-icon { display: grid; width: 39px; height: 39px; place-items: center; border-radius: 11px; color: white; background: var(--green); font-size: 21px; }
.contact-picker-copy { min-width: 0; }
.contact-picker-copy strong, .contact-picker-copy small { display: block; }
.contact-picker-copy strong { font-size: 14px; font-weight: 900; line-height: 1.25; }
.contact-picker-copy small { margin-top: 2px; color: #426351; font-size: 11px; line-height: 1.3; }
.contact-picker-arrow { color: var(--green-dark); font-size: 28px; font-weight: 900; line-height: 1; }
.icon-button, .close-button {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: var(--navy);
  background: #edf1f6;
  font-size: 24px;
  line-height: 1;
}
.search-help { min-height: 25px; padding: 8px 3px 0; color: var(--muted); font-size: 13px; }
.search-help strong { color: var(--navy); }

.client-results { display: grid; gap: 9px; margin-top: 8px; }
.client-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  padding: 14px;
  text-align: left;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  background: #fbfcfe;
}
.client-result:hover, .client-result:focus-visible { border-color: var(--navy-2); background: #f1f6fc; }
.client-result strong { display: block; margin-bottom: 3px; color: var(--navy); font-size: 16px; }
.client-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; color: var(--muted); font-size: 13px; line-height: 1.4; }
.select-word { color: var(--navy); font-size: 13px; font-weight: 900; }
.client-list-position { display: block; margin-bottom: 5px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.new-client-badge { display: inline-block; margin-left: 6px; padding: 2px 6px; border-radius: 999px; color: white; background: var(--green); font-size: 10px; }
.invoice-client-badge { display: inline-block; margin-left: 6px; padding: 2px 6px; border-radius: 999px; color: white; background: var(--navy-2); font-size: 10px; }
.client-loyalty-badge { display: inline-flex; margin-left: 7px; padding: 3px 7px; border-radius: 999px; color: #614a00; background: var(--gold-soft); font-size: 10px; font-weight: 900; vertical-align: middle; }
.client-loyalty-badge.gift { color: white; background: var(--red); }
.client-distributor-badge { display: inline-flex; margin-left: 7px; padding: 3px 7px; border: 1px solid #d3ad34; border-radius: 999px; color: #624900; background: var(--gold-soft); font-size: 10px; font-weight: 900; vertical-align: middle; }
.inactive-client-badge { display: inline-block; margin-left: 6px; padding: 2px 6px; border-radius: 999px; color: #6a4510; background: #f7dfb9; font-size: 10px; }
.client-result.inactive { border-color: #dcc7a7; background: #fffaf2; }
.preferred-button { border-color: #d3ad34; color: #624900; background: var(--gold-soft); }
.stacked-filter { display: grid; gap: 7px; }
.stacked-filter[hidden] { display: none; }
.stacked-filter-trigger { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; min-height: 56px; padding: 10px 14px; text-align: left; border: 0; border-radius: 14px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.stacked-filter-trigger-copy { display: grid; gap: 2px; min-width: 0; }
.stacked-filter-trigger-copy small { color: #ccdaeb; font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.stacked-filter-trigger-copy strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.stacked-filter-chevron { font-size: 25px; line-height: 1; transition: transform .2s ease; }
.stacked-filter.open .stacked-filter-chevron { transform: rotate(180deg); }
.stacked-filter-options { display: grid; gap: 7px; padding: 7px; border: 1px solid #cbd3dd; border-radius: 14px; background: #f5f7fa; box-shadow: 0 9px 24px rgba(13,43,82,.1); }
.stacked-filter-options[hidden] { display: none !important; }
.stacked-filter-options button { width: 100%; min-height: 48px; padding: 10px 13px; text-align: left; border: 1px solid #cbd3dd; border-radius: 11px; color: var(--navy); background: white; font-size: 14px; font-weight: 900; line-height: 1.25; }
.stacked-filter-options button:hover, .stacked-filter-options button:focus-visible { border-color: var(--gold); background: var(--gold-soft); outline: 0; }
.client-period-filters { margin: -2px 0 10px; }
.client-filter-summary { margin: 0 2px 10px; color: var(--muted); font-size: 13px; font-weight: 750; }
.empty-state { padding: 22px 12px; text-align: center; color: var(--muted); border: 1px dashed #c8ced7; border-radius: 14px; }
.text-button { display: block; margin: 14px auto 0; padding: 8px 12px; border: 0; color: var(--navy-2); background: transparent; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }

.selected-client { padding: 16px; border: 2px solid var(--navy); border-radius: 15px; background: #f3f7fc; }
.selected-client .selected-top { display: flex; justify-content: space-between; gap: 12px; align-items: start; }
.selected-actions { display: flex; flex: 0 0 auto; flex-direction: column; gap: 8px; }
.selected-client h4 { margin: 0 0 5px; color: var(--navy); font-size: 18px; }
.selected-client p { margin: 3px 0 0; color: var(--muted); font-size: 14px; }
.selected-client button { flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--navy); border-radius: 9px; color: var(--navy); background: white; font-weight: 800; }
.selected-client #reprogram-order { max-width: 160px; color: white; background: var(--navy); line-height: 1.2; }
.selected-client #reprogram-order:disabled { color: #718096; border-color: #cbd3dd; background: #e8edf3; }
.selected-client #cancel-sale { grid-column: 1 / -1; color: var(--red); border-color: #dca9a9; background: #fff8f8; }
.editing-invoice-banner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 12px; margin: -4px -4px 14px; padding: 10px 12px; border-radius: 10px; color: var(--navy); background: #fff2b8; }
.editing-invoice-banner strong { font-size: 13px; }
.editing-invoice-banner span { font-size: 12px; font-weight: 700; }
.selected-distributor-banner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; margin: -4px -4px 14px; padding: 10px 12px; border: 1px solid #d3ad34; border-radius: 10px; color: #624900; background: var(--gold-soft); }
.selected-distributor-banner strong { font-size: 12px; }
.selected-distributor-banner span { font-size: 11px; font-weight: 750; }
.selected-client #cancel-invoice-edit { color: var(--red); border-color: #dca9a9; }
.selected-client-loyalty { margin-top: 14px; padding: 13px; border: 1px solid #d3b44f; border-radius: 12px; background: #fffaf0; }
.selected-client-loyalty.gift-ready { border: 2px solid var(--gold); background: var(--gold-soft); box-shadow: 0 5px 14px rgba(126,91,0,.12); }
.loyalty-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.loyalty-heading span, .loyalty-heading strong { display: block; }
.loyalty-heading span { color: #765c00; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.loyalty-heading strong { margin-top: 3px; color: var(--navy); font-size: 15px; }
.selected-client .loyalty-heading #redeem-loyalty-gift { color: white; border-color: var(--red); background: var(--red); }
.loyalty-progress { height: 8px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #e1e5ea; }
.loyalty-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--navy-2), var(--gold)); }
.selected-client-loyalty p { margin-top: 8px; font-size: 12px; line-height: 1.35; }
.selected-client-loyalty .pending-gift-block { margin-top: 10px; padding: 11px 12px; border: 2px solid #b71c1c; border-radius: 10px; color: #fff; background: #c62828; font-size: 13px; font-weight: 950; line-height: 1.35; }

.sale-inventory-status { margin-bottom: 14px; padding: 13px 14px; border: 1px solid #9fb2c9; border-radius: 13px; color: var(--navy); background: #f2f7fc; }
.sale-inventory-status.not-configured { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border-color: #d3b44f; background: #fff9df; }
.sale-inventory-status.insufficient { border: 2px solid #c88f23; background: #fff5dc; box-shadow: 0 0 0 3px rgba(244,196,48,.14); }
.sale-inventory-status span { display: block; color: #765c00; font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.sale-inventory-status strong { color: var(--navy); }
.sale-inventory-status p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.sale-inventory-status button { min-height: 38px; padding: 7px 10px; border: 1px solid var(--navy); border-radius: 9px; color: var(--navy); background: white; font-size: 12px; font-weight: 900; white-space: nowrap; }
.sale-inventory-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }

.product-list { display: grid; gap: 12px; }
.product-card {
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.product-card.active { border-color: var(--navy-2); background: #f8fbff; box-shadow: inset 4px 0 var(--gold); }
.product-card.expanded { border-color: #9fb1c7; }
.product-card-summary { display: flex; gap: 12px; align-items: center; justify-content: space-between; width: 100%; min-height: 60px; padding: 14px 16px; text-align: left; border: 0; color: var(--navy); background: white; }
.product-card-summary:focus-visible { position: relative; z-index: 1; outline: 3px solid rgba(244,196,48,.7); outline-offset: -3px; }
.product-card.active .product-card-summary { background: #f8fbff; }
.product-card.expanded .product-card-summary { border-bottom: 1px solid #e1e6ed; background: #f1f6fc; }
.product-card-name { min-width: 0; font-size: 17px; font-weight: 900; line-height: 1.25; }
.product-card-details { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 15px; align-items: center; padding: 14px 16px 16px; }
.product-card-details[hidden] { display: none !important; }
.product-name-row { display: flex; flex-wrap: wrap; gap: 7px 12px; align-items: baseline; }
.product-card h4 { margin: 0; color: var(--navy); font-size: 17px; }
.product-price { color: var(--red); font-weight: 900; }
.product-card p { margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.package-price { display: inline-flex; margin-top: 8px; padding: 5px 8px; border-radius: 7px; color: #574500; background: var(--gold-soft); font-size: 12px; font-weight: 900; }
.stepper { display: grid; grid-template-columns: 42px 44px 42px; align-items: center; border: 1px solid #bdc6d1; border-radius: 13px; overflow: hidden; background: white; }
.stepper button { height: 44px; border: 0; color: var(--navy); background: #edf2f8; font-size: 24px; font-weight: 700; }
.stepper output { display: grid; height: 44px; place-items: center; color: var(--navy); font-size: 18px; font-weight: 900; }

.order-summary { display: flex; justify-content: space-between; gap: 20px; align-items: end; margin-bottom: 16px; padding: 16px; border-radius: 14px; color: white; background: var(--navy); }
.order-summary span { display: block; color: #dbe7f5; font-size: 13px; }
.order-summary strong { display: block; margin-top: 3px; font-size: 28px; }
.summary-detail { text-align: right; }
.summary-detail span + span { margin-top: 4px; }
.summary-detail .loyalty-earned-total { color: #ffe883; font-weight: 900; }
.delivery-round-picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; margin: 0 0 16px; padding: 14px; border: 2px solid #cfd6df; border-radius: 14px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.delivery-round-picker > div:first-child strong, .delivery-round-picker > div:first-child span { display: block; }
.delivery-round-picker > div:first-child strong { color: var(--navy); font-size: 15px; }
.delivery-round-picker > div:first-child span { margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.35; }
.delivery-round-picker.needs-selection { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(244,196,48,.16); }
.delivery-round-picker.selected { border-color: var(--navy-2); background: #f7faff; }
.delivery-round-options { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.delivery-round-options button { min-height: 44px; padding: 8px 12px; border: 1px solid #aeb9c7; border-radius: 10px; color: var(--navy); background: #fff; font-size: 13px; font-weight: 900; white-space: nowrap; }
.delivery-round-options button.active { color: #fff; border-color: var(--navy); background: var(--navy); box-shadow: 0 5px 12px rgba(13,43,82,.18); }

.primary-button, .secondary-button, .whatsapp-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 11px 17px;
  border-radius: 12px;
  font-weight: 900;
  text-decoration: none;
}
.primary-button { width: 100%; border: 0; color: white; background: var(--navy); box-shadow: 0 8px 20px rgba(13,43,82,.2); }
.primary-button:disabled { cursor: not-allowed; color: #8c96a4; background: #dce1e7; box-shadow: none; }
.secondary-button { border: 1px solid var(--navy); color: var(--navy); background: white; }
.whatsapp-button { border: 0; color: white; background: var(--green); }
.whatsapp-button:hover { background: var(--green-dark); }

.toolbar { display: flex; gap: 10px; margin-bottom: 14px; }
.plain-input, .settings-form input, .settings-form textarea, .client-dialog input, .client-dialog textarea, .client-dialog select {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #b9c2ce;
  border-radius: 11px;
  color: var(--ink);
  background: white;
  outline: none;
}
.plain-input:focus, .settings-form input:focus, .settings-form textarea:focus, .client-dialog input:focus, .client-dialog textarea:focus, .client-dialog select:focus { border-color: var(--navy-2); box-shadow: 0 0 0 3px rgba(23,62,112,.12); }
.toolbar .plain-input { flex: 1; min-width: 0; }

.history-status-filter { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 12px; padding: 4px; border-radius: 13px; background: #e5eaf0; }
.history-status-filter button { min-height: 44px; padding: 8px 11px; border: 0; border-radius: 10px; color: var(--navy); background: transparent; font-size: 13px; font-weight: 900; }
.history-status-filter button.active { color: white; background: var(--navy); box-shadow: 0 4px 12px rgba(13,43,82,.18); }
.history-list { display: grid; gap: 10px; }
.history-card { overflow: hidden; padding: 0; border: 1px solid var(--line); border-radius: 15px; background: white; box-shadow: 0 7px 20px rgba(13,43,82,.06); }
.history-card.expanded { border-color: #9fb1c7; }
.history-card-summary { display: flex; gap: 16px; align-items: center; justify-content: space-between; width: 100%; min-height: 64px; padding: 16px; text-align: left; border: 0; color: var(--navy); background: white; }
.history-card-summary:focus-visible { position: relative; z-index: 1; outline: 3px solid rgba(244,196,48,.7); outline-offset: -3px; }
.history-card.expanded .history-card-summary { border-bottom: 1px solid #e1e6ed; background: #f1f6fc; }
.history-summary-copy { display: grid; gap: 4px; min-width: 0; }
.history-client-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.history-client-name { min-width: 0; font-size: 17px; font-weight: 900; line-height: 1.25; }
.history-products { color: var(--muted); font-size: 12px; font-weight: 750; line-height: 1.35; }
.history-card-details { padding: 13px 16px 16px; }
.history-card-details[hidden] { display: none !important; }
.history-card-head { display: flex; justify-content: space-between; gap: 16px; }
.history-card h3 { margin: 0 0 4px; color: var(--navy); font-size: 17px; }
.history-card p { margin: 0; color: var(--muted); font-size: 13px; }
.history-amount { color: var(--navy); font-size: 19px; font-weight: 900; white-space: nowrap; }
.history-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #e6e9ee; }
.history-actions button { padding: 8px 11px; border: 1px solid #c7cfda; border-radius: 9px; color: var(--navy); background: white; font-size: 13px; font-weight: 800; }
.history-actions .edit { color: #795800; border-color: #e2c55c; background: #fff8d7; }
.history-actions .danger { color: var(--red); }
.paid-badge { display: inline-block; margin-left: 7px; padding: 3px 7px; border-radius: 999px; color: white; background: var(--green); font-size: 10px; font-weight: 900; vertical-align: middle; }
.history-client-row .paid-badge { margin-left: 0; }
.pending-badge { display: inline-block; padding: 3px 7px; border-radius: 999px; color: #7a5700; background: var(--gold-soft); font-size: 10px; font-weight: 900; vertical-align: middle; }
.delivery-badge { display: inline-flex; width: max-content; margin-left: 5px; padding: 3px 7px; border-radius: 999px; color: var(--navy); background: #e7eef7; font-size: 10px; font-weight: 900; line-height: 1.2; vertical-align: middle; }
.delivery-badge.round-second { color: #624900; background: var(--gold-soft); }
.delivery-badge.round-unassigned { color: #842626; background: var(--danger-soft); }
.history-loyalty-earned { display: inline-flex; margin-left: 5px; padding: 3px 7px; border-radius: 999px; color: #614a00; background: var(--gold-soft); font-size: 10px; font-weight: 900; vertical-align: middle; }
.history-gift-badge { display: inline-flex; margin-left: 5px; padding: 3px 7px; border-radius: 999px; color: white; background: var(--red); font-size: 10px; font-weight: 900; vertical-align: middle; }

.dispatch-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: end; margin-bottom: 14px; }
.dispatch-controls [hidden] { display: none !important; }
.dispatch-controls label { display: grid; gap: 7px; color: var(--navy); font-size: 13px; font-weight: 850; }
.dispatch-scope-note { margin: 0; padding: 12px 14px; border-radius: 12px; color: var(--navy); background: var(--gold-soft); font-size: 13px; font-weight: 800; line-height: 1.4; }
.dispatch-mode { display: flex; gap: 7px; padding: 4px; border-radius: 13px; background: #e5eaf0; }
.dispatch-mode button { min-height: 42px; padding: 8px 13px; border: 0; border-radius: 10px; color: var(--navy); background: transparent; font-size: 13px; font-weight: 900; }
.dispatch-mode button.active { color: white; background: var(--navy); box-shadow: 0 4px 12px rgba(13,43,82,.18); }
.dispatch-message-panel { display: grid; gap: 10px; margin-bottom: 14px; padding: 14px; }
.dispatch-message-panel .delivery-message-editor textarea { min-height: 78px; }
.dispatch-message-footer { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.dispatch-message-footer p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.dispatch-message-actions { display: flex; flex: 0 0 auto; gap: 8px; }
.dispatch-message-footer button { min-height: 38px; padding: 7px 10px; font-size: 11px; }
.dispatch-city-list { display: grid; gap: 7px; margin: 0 0 14px; }
.dispatch-product-summary { overflow: hidden; margin: 0 0 14px; border: 1px solid #cbd3dd; border-radius: 16px; background: white; box-shadow: var(--shadow); }
.dispatch-product-summary[hidden] { display: none !important; }
.dispatch-product-summary-head { display: flex; gap: 12px; align-items: end; justify-content: space-between; padding: 14px 15px 12px; color: white; background: var(--navy); }
.dispatch-product-summary-head span { display: block; margin-bottom: 3px; color: #ccdaeb; font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.dispatch-product-summary-head h3 { margin: 0; font-size: 17px; line-height: 1.2; }
.dispatch-product-summary-head > strong { flex: 0 0 auto; font-size: 11px; white-space: nowrap; }
.dispatch-product-table-wrap { overflow: hidden; }
.dispatch-product-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: separate; border-spacing: 0; color: var(--navy); font-size: 12px; font-variant-numeric: tabular-nums; }
.dispatch-product-table th, .dispatch-product-table td { padding: 10px 3px; text-align: center; border-right: 1px solid #e1e5eb; border-bottom: 1px solid #e1e5eb; }
.dispatch-product-table thead th { color: #455a73; background: #eef2f7; font-size: 8px; line-height: 1.12; text-transform: uppercase; letter-spacing: 0; overflow-wrap: anywhere; }
.dispatch-product-table th:first-child { width: 25%; padding-left: 9px; text-align: left; background: white; }
.dispatch-product-table th:nth-child(2), .dispatch-product-table th:nth-child(3), .dispatch-product-table th:nth-child(4) { width: 13%; }
.dispatch-product-table th:nth-child(5) { width: 17%; }
.dispatch-product-table th:nth-child(6) { width: 19%; }
.dispatch-product-table thead th:first-child { background: #eef2f7; }
.dispatch-product-table tbody tr:last-child th, .dispatch-product-table tbody tr:last-child td { border-bottom: 0; }
.dispatch-product-table th:last-child, .dispatch-product-table td:last-child { border-right: 0; }
.dispatch-product-table td:last-child { background: #f7f9fc; }
.dispatch-product-table .dispatch-product-total th, .dispatch-product-table .dispatch-product-total td { color: #342900; background: var(--gold-soft); font-weight: 900; }
.dispatch-product-table .dispatch-product-total th:first-child { background: var(--gold-soft); }
.dispatch-city-trigger { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; width: 100%; min-height: 58px; padding: 11px 14px; text-align: left; border: 0; border-radius: 14px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.dispatch-city-trigger-copy { display: grid; gap: 2px; min-width: 0; }
.dispatch-city-trigger-copy small { color: #ccdaeb; font-size: 9px; font-weight: 900; letter-spacing: .08em; }
.dispatch-city-trigger-copy strong { overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
.dispatch-city-trigger-count { font-size: 13px; font-weight: 900; white-space: nowrap; }
.dispatch-city-chevron { font-size: 25px; line-height: 1; transition: transform .2s ease; }
.dispatch-city-list.open .dispatch-city-chevron { transform: rotate(180deg); }
.dispatch-city-options { display: grid; gap: 7px; padding: 7px; border: 1px solid #cbd3dd; border-radius: 14px; background: #f5f7fa; box-shadow: 0 9px 24px rgba(13,43,82,.1); }
.dispatch-city-options[hidden] { display: none !important; }
.dispatch-city-options button { display: flex; gap: 14px; align-items: center; justify-content: space-between; width: 100%; min-height: 50px; padding: 11px 13px; text-align: left; border: 1px solid #cbd3dd; border-radius: 11px; color: var(--navy); background: white; font-size: 15px; font-weight: 900; }
.dispatch-city-options button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dispatch-city-options button strong { flex: 0 0 auto; font-size: 12px; white-space: nowrap; }
.dispatch-city-options .dispatch-city-total-option { border-color: #d9b541; background: var(--gold-soft); }
.dispatch-sheet { padding: 17px; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: var(--shadow); }
.dispatch-sheet-head { display: flex; justify-content: space-between; gap: 14px; align-items: start; padding-bottom: 13px; border-bottom: 3px solid var(--navy); }
.dispatch-sheet h3 { margin: 0; color: var(--navy); font-size: 22px; }
.dispatch-sheet-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.dispatch-count { color: var(--navy); font-size: 14px; font-weight: 900; white-space: nowrap; }
.dispatch-orders { display: grid; gap: 10px; margin-top: 13px; }
.dispatch-order { overflow: hidden; padding: 0; border: 1px solid #dce1e7; border-radius: 13px; background: #fbfcfe; }
.dispatch-order.expanded { border-color: #9fb1c7; box-shadow: 0 7px 18px rgba(13,43,82,.08); }
.dispatch-order-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; background: #fbfcfe; }
.dispatch-order-summary { display: flex; gap: 12px; align-items: center; justify-content: space-between; width: 100%; min-height: 58px; padding: 14px 16px; text-align: left; border: 0; color: var(--navy); background: #fbfcfe; font-size: 18px; font-weight: 900; }
.dispatch-order-summary:focus-visible { position: relative; z-index: 1; outline: 3px solid rgba(244,196,48,.7); outline-offset: -3px; }
.dispatch-order.expanded .dispatch-order-heading { border-bottom: 1px solid #dce1e7; background: #f1f6fc; }
.dispatch-order.expanded .dispatch-order-summary { background: #f1f6fc; }
.dispatch-quick-whatsapp { align-self: center; min-height: 38px; margin: 9px 12px 9px 0; padding: 7px 11px; border: 1px solid var(--green); border-radius: 10px; color: white; background: var(--green); font-size: 11px; font-weight: 900; }
.dispatch-quick-whatsapp:disabled { cursor: not-allowed; opacity: .4; }
.dispatch-order-chevron { flex: 0 0 auto; color: #526983; font-size: 25px; line-height: 1; transition: transform .2s ease; }
.dispatch-order.expanded .dispatch-order-chevron { transform: rotate(180deg); }
.dispatch-order-details { padding: 14px; }
.dispatch-order-details[hidden] { display: none !important; }
.dispatch-order-top { display: flex; justify-content: space-between; gap: 12px; align-items: start; }
.dispatch-order h4 { margin: 0; color: var(--navy); font-size: 17px; }
.dispatch-order p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.dispatch-order .dispatch-order-date { color: var(--navy); font-size: 12px; font-weight: 850; }
.dispatch-round-selector { display: flex; flex-wrap: wrap; gap: 7px 10px; align-items: center; margin: 10px 0 5px; }
.dispatch-round-selector > span { color: var(--navy); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .035em; }
.dispatch-round-selector-options { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; min-width: 190px; padding: 3px; border-radius: 11px; background: #e7ebf0; }
.dispatch-round-selector-options button { min-height: 36px; padding: 7px 11px; border: 0; border-radius: 8px; color: var(--navy); background: transparent; font-size: 12px; font-weight: 900; }
.dispatch-round-selector-options button.active[data-round-option="first"] { color: white; background: var(--navy); box-shadow: 0 3px 9px rgba(13,43,82,.2); }
.dispatch-round-selector-options button.active[data-round-option="second"] { color: #3d2c00; background: var(--gold); box-shadow: 0 3px 9px rgba(128,91,0,.18); }
.dispatch-address-row { display: flex; flex-wrap: wrap; gap: 7px 9px; align-items: center; margin-top: 4px; }
.dispatch-address-row > p { margin: 0; }
.dispatch-map-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.dispatch-map-button { min-height: 34px; padding: 6px 10px; border: 1px solid #aeb9c7; border-radius: 999px; color: var(--navy); background: #eef5fd; font-size: 11px; font-weight: 900; }
.dispatch-products { margin-top: 9px !important; color: var(--ink) !important; font-weight: 800; }
.delivery-round-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 14px; }
.delivery-round-card { display: grid; gap: 4px; min-width: 0; padding: 13px; text-align: left; border: 2px solid #d5dce5; border-radius: 13px; color: var(--navy); background: #fbfcfe; }
.delivery-round-card span, .delivery-round-card strong, .delivery-round-card small { display: block; }
.delivery-round-card span { font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .03em; }
.delivery-round-card strong { font-size: 18px; }
.delivery-round-card small { color: var(--muted); font-size: 12px; line-height: 1.35; }
.delivery-round-card.active { color: #fff; border-color: var(--navy); background: var(--navy); box-shadow: 0 7px 17px rgba(13,43,82,.18); }
.delivery-round-card.active small { color: #dce8f7; }
.delivery-round-card.unassigned { grid-column: 1 / -1; border-color: #dca9a9; background: var(--danger-soft); }
.delivery-round-card.unassigned.active { border-color: #8d2929; background: #8d2929; }
.dispatch-batch-heading { display: flex; justify-content: space-between; gap: 12px; align-items: end; margin-top: 17px; padding: 0 2px; }
.dispatch-batch-heading span { color: var(--muted); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
.dispatch-batch-heading h4 { margin: 2px 0 0; color: var(--navy); font-size: 19px; }
.dispatch-batch-heading > strong { color: var(--navy); font-size: 13px; white-space: nowrap; }
.dispatch-order-actions { display: flex; flex: 0 0 auto; max-width: 150px; flex-direction: column; gap: 7px; align-items: stretch; }
.dispatch-order-actions .delivery-badge { align-self: flex-end; margin: 0; }
.dispatch-contact-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.dispatch-contact-button { min-height: 40px; padding: 7px 9px; border-radius: 10px; font-size: 11px; font-weight: 900; }
.dispatch-call-button { color: var(--navy); border: 1px solid var(--navy); background: #eef5fd; }
.dispatch-whatsapp-button { color: white; border: 1px solid var(--green); background: var(--green); }
.dispatch-add-phone-button { grid-column: 1 / -1; color: var(--navy); border: 1px solid #d5ad38; background: #fff8d7; }
.dispatch-contact-button:disabled { cursor: not-allowed; color: #8c96a4; border-color: #d7dce3; background: #edf0f3; }
.dispatch-order .paid-toggle, .dispatch-order .delivery-round-switch { flex: 0 0 auto; min-height: 40px; padding: 7px 10px; border-radius: 10px; font-size: 12px; font-weight: 900; }
.dispatch-order .paid-toggle { border: 0; color: white; background: var(--green); }
.dispatch-order .paid-toggle.restore { color: var(--navy); border: 1px solid var(--navy); background: white; }
.dispatch-order .delivery-round-switch { color: var(--navy); border: 1px solid #d5ad38; background: #fff8d7; }
.dispatch-total { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; margin-top: 15px; padding-top: 13px; border-top: 2px solid var(--navy); color: var(--muted); font-size: 13px; }
.dispatch-total strong { color: var(--navy); text-align: right; }
.dispatch-city-subtotals { display: grid; gap: 9px; margin-top: 14px; }
.dispatch-city-subtotals button { display: flex; justify-content: space-between; gap: 15px; align-items: center; width: 100%; padding: 13px 14px; text-align: left; border: 1px solid #dce1e7; border-radius: 12px; color: var(--navy); background: #fbfcfe; }
.dispatch-city-subtotals button > span { min-width: 0; }
.dispatch-city-subtotals button strong, .dispatch-city-subtotals button small { display: block; }
.dispatch-city-subtotals button > strong { flex: 0 0 auto; font-size: 16px; }
.dispatch-city-subtotals small { margin-top: 3px; color: var(--muted); font-size: 12px; }
.dispatch-city-subtotals .unassigned-note { color: #9a2f2f; font-weight: 900; }
.dispatch-grand-total { font-size: 14px; }
.dispatch-grand-total span:last-of-type, .dispatch-grand-total strong:last-of-type { padding-top: 9px; border-top: 2px solid var(--navy); color: var(--navy); font-size: 17px; font-weight: 900; }
.dispatch-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 14px; }

.report-filters { display: grid; gap: 12px; }
.report-date-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.report-date-grid label { display: grid; gap: 6px; color: var(--navy); font-size: 13px; font-weight: 850; }
.report-filters p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.report-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 18px; }
.report-summary article { min-width: 0; padding: 14px; border-radius: 14px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.report-summary span { display: block; margin-bottom: 4px; color: #dbe7f5; font-size: 12px; }
.report-summary strong { display: block; overflow-wrap: anywhere; font-size: 21px; }
.report-section { padding: 17px; }
.report-section-head { display: flex; justify-content: space-between; gap: 14px; align-items: end; margin-bottom: 12px; }
.report-section-head h3 { margin: 3px 0 0; color: var(--navy); font-size: 20px; }
.report-section-head label { display: grid; gap: 4px; color: var(--muted); font-size: 11px; font-weight: 800; }
.report-section-head select { min-height: 42px; padding: 8px 30px 8px 10px; border: 1px solid #b9c2ce; border-radius: 10px; color: var(--navy); background: white; font-weight: 850; }
.report-note { margin: -5px 0 13px; color: var(--muted); font-size: 12px; }
.report-ranking { display: grid; gap: 13px; }
.report-rank-row { display: grid; gap: 7px; }
.report-rank-heading { display: grid; grid-template-columns: 27px minmax(0, 1fr); gap: 9px; align-items: center; }
.report-position { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; color: var(--navy); background: var(--gold-soft); font-size: 12px; font-weight: 900; }
.report-rank-heading strong, .report-rank-heading span { display: block; }
.report-rank-heading strong { color: var(--navy); font-size: 14px; }
.report-rank-heading div span { margin-top: 2px; color: var(--muted); font-size: 12px; }
.report-bar { height: 8px; margin-left: 36px; overflow: hidden; border-radius: 999px; background: #e6ebf1; }
.report-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--navy-2), var(--gold)); }
.report-client-sales { display: grid; gap: 8px; margin-top: 12px; }
.report-client-row { display: flex; justify-content: space-between; gap: 14px; padding: 12px; border: 1px solid #dce1e7; border-radius: 12px; background: #fbfcfe; }
.report-client-row div:last-child { flex: 0 0 auto; text-align: right; }
.report-client-row strong, .report-client-row span { display: block; }
.report-client-row strong { color: var(--navy); font-size: 14px; }
.report-client-row span { margin-top: 3px; color: var(--muted); font-size: 12px; }

.inventory-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.inventory-summary article { min-width: 0; padding: 18px; border-radius: 16px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.inventory-summary article:nth-child(2) { color: var(--navy); border: 1px solid #e0b33f; background: linear-gradient(135deg, #fff1a9, #fffaf0); }
.inventory-summary span, .inventory-summary small { display: block; font-size: 11px; font-weight: 850; letter-spacing: .06em; }
.inventory-summary article:first-child span, .inventory-summary article:first-child small { color: #dbe7f5; }
.inventory-summary article:nth-child(2) span, .inventory-summary article:nth-child(2) small { color: #745900; }
.inventory-summary strong { display: block; margin: 5px 0 2px; font-size: clamp(34px, 9vw, 48px); line-height: 1; }
.inventory-summary.not-configured { opacity: .72; }
.inventory-form { display: grid; gap: 16px; }
.inventory-form-heading { display: flex; gap: 12px; align-items: center; }
.inventory-form-icon { display: grid; flex: 0 0 42px; height: 42px; place-items: center; border-radius: 13px; color: var(--navy); background: var(--gold); font-size: 23px; font-weight: 900; }
.inventory-form-heading h3, .inventory-help h3 { margin: 0; color: var(--navy); font-size: 19px; }
.inventory-form-heading p, .inventory-help p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.inventory-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.inventory-fields label { display: grid; gap: 6px; color: var(--navy); font-size: 13px; font-weight: 850; }
.inventory-fields input { font-size: 20px; font-weight: 900; }
.inventory-help { border-color: #d8c46f; background: #fffdf3; }
.inventory-help p + p { margin-top: 9px; }

.add-product-button { margin-bottom: 10px; }
.product-history-note { margin: 0 2px 15px; color: var(--muted); font-size: 13px; }
.manage-product-list { display: grid; gap: 10px; }
.manage-product-card { display: flex; justify-content: space-between; gap: 14px; align-items: center; padding: 16px; border: 1px solid var(--line); border-radius: 15px; background: white; box-shadow: 0 7px 20px rgba(13,43,82,.06); }
.manage-product-card h3 { margin: 0 0 4px; color: var(--navy); font-size: 18px; }
.manage-product-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.4; }
.manage-product-side { display: grid; flex: 0 0 auto; gap: 8px; justify-items: end; }
.manage-product-side strong { color: var(--red); font-size: 18px; }
.manage-product-side button { padding: 8px 11px; border: 1px solid #e2c55c; border-radius: 9px; color: #795800; background: #fff8d7; font-size: 13px; font-weight: 850; }
.product-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.settings-form { display: grid; gap: 15px; }
.settings-form label, .client-dialog label { display: grid; gap: 6px; color: var(--navy); font-size: 13px; font-weight: 800; }
.settings-form textarea, .client-dialog textarea { resize: vertical; }
.form-note { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.backup-panel { display: grid; gap: 16px; border-color: #d8c46f; background: linear-gradient(145deg, #fffdf4, #fff 72%); }
.backup-heading { display: flex; gap: 13px; align-items: flex-start; }
.backup-icon { display: grid; flex: 0 0 46px; height: 46px; place-items: center; border-radius: 14px; color: var(--navy); background: var(--gold); font-size: 28px; font-weight: 900; line-height: 1; box-shadow: 0 5px 12px rgba(149,109,0,.15); }
.backup-heading .eyebrow { margin: 0 0 2px; }
.backup-heading h3 { margin: 0; color: var(--navy); font-size: 20px; }
.backup-heading p:last-child { margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.backup-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.backup-summary div { min-width: 0; padding: 11px 8px; text-align: center; border: 1px solid #d9e0e8; border-radius: 12px; background: white; }
.backup-summary span, .backup-summary strong { display: block; }
.backup-summary span { color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.backup-summary strong { margin-top: 3px; overflow-wrap: anywhere; color: var(--navy); font-size: 18px; }
.backup-includes { margin: -5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.backup-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.backup-restore-button { cursor: pointer; text-align: center; }
.backup-warning { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: 11px; color: #35536f; background: #edf4f8; font-size: 12px; line-height: 1.4; }
.install-panel h3 { margin: 0 0 5px; color: var(--navy); }
.install-panel p { margin: 0 0 14px; color: var(--muted); line-height: 1.5; }

.bottom-nav {
  position: fixed;
  z-index: 40;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 8px max(8px, calc((100vw - 820px) / 2)) max(8px, env(safe-area-inset-bottom));
  border-top: 1px solid #d8dee6;
  background: rgba(255,255,255,.96);
  box-shadow: 0 -6px 24px rgba(13,43,82,.09);
  backdrop-filter: blur(14px);
}
.nav-button { display: grid; gap: 3px; place-items: center; padding: 6px 2px; border: 0; border-radius: 11px; color: #667184; background: transparent; font-size: 11px; font-weight: 800; }
.nav-button span { font-size: 21px; line-height: 1; }
.nav-button.active { color: var(--navy); background: #edf2f8; }

.modal[hidden] { display: none; }
.modal { position: fixed; z-index: 100; inset: 0; display: grid; align-items: end; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(5,20,39,.65); }
.modal-sheet { position: relative; z-index: 1; width: min(100%, 760px); max-height: 94vh; margin: 0 auto; overflow-x: hidden; overflow-y: auto; border-radius: 22px 22px 0 0; background: #eef1f4; box-shadow: 0 -20px 60px rgba(0,0,0,.3); }
.modal-toolbar { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid #d6dce4; background: rgba(238,241,244,.97); backdrop-filter: blur(10px); }
.modal-toolbar h2 { margin: 2px 0 0; color: var(--navy); }
.invoice-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 15px 18px calc(18px + env(safe-area-inset-bottom)); }
.new-invoice-button { grid-column: 1 / -1; min-height: 54px; font-size: 16px; }
.warning { margin: -4px 18px 18px; padding: 12px; border-radius: 10px; color: #792121; background: var(--danger-soft); font-size: 13px; }

.invoice-document { position: relative; width: min(calc(100% - 24px), 700px); max-width: 100%; margin: 12px auto 0; padding: clamp(20px, 5vw, 42px); overflow: hidden; color: #111; background: white; box-shadow: 0 5px 22px rgba(0,0,0,.1); }
.draft-watermark { position: absolute; top: 150px; left: 50%; transform: translateX(-50%) rotate(-20deg); color: rgba(198,40,40,.1); font-size: clamp(50px, 14vw, 100px); font-weight: 900; pointer-events: none; }
.invoice-head { display: flex; justify-content: space-between; gap: 22px; padding-bottom: 18px; border-bottom: 4px solid var(--navy); }
.invoice-brand { color: var(--navy); font-size: 23px; font-weight: 900; letter-spacing: -.02em; }
.invoice-business { margin-top: 7px; color: #505b67; font-size: 12px; line-height: 1.45; white-space: pre-line; }
.invoice-title { text-align: right; }
.invoice-title h3 { margin: 0; color: var(--navy); font-size: 24px; }
.invoice-title p { margin: 5px 0 0; color: #5e6874; font-size: 12px; }
.invoice-client { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; padding: 18px 0; }
.invoice-client div { min-width: 0; }
.invoice-label { display: block; margin-bottom: 3px; color: #65707d; font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.invoice-client strong { color: #17212f; font-size: 14px; overflow-wrap: anywhere; }
.invoice-client-additional { margin: 16px 0 0; padding: 12px 14px; border: 1px solid #d7dee7; border-radius: 10px; color: #17212f; background: #f7f9fc; }
.invoice-client-additional strong { display: block; font-size: 13px; line-height: 1.45; white-space: pre-line; }
.invoice-table { width: 100%; max-width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 12px; }
.invoice-table th { padding: 9px 7px; overflow-wrap: normal; word-break: normal; vertical-align: middle; text-align: center; color: white; background: var(--navy); }
.invoice-table th span { display: block; }
.invoice-table td { padding: 10px 7px; overflow-wrap: anywhere; vertical-align: top; border-bottom: 1px solid #dce1e7; }
.invoice-table .num { text-align: right; }
.invoice-table td.num { white-space: nowrap; }
.invoice-table .product-description { display: block; margin-top: 5px; color: var(--navy); font-family: "Arial Black", Arial, sans-serif; font-size: 14px; font-weight: 900; line-height: 1.35; }
.invoice-super-line { display: block; font-size: 13px; white-space: nowrap; }
.invoice-super-gift { font-size: 20px; line-height: 1; vertical-align: middle; }
.invoice-table th:nth-child(1) { width: 42%; }
.invoice-table th:nth-child(2) { width: 10%; }
.invoice-table th:nth-child(4) { width: 20%; }
.invoice-table .package-price-heading { width: 28%; padding: 7px 6px; }
.package-price-heading-card { display: flex !important; min-height: 96px; padding: 8px 6px 7px; flex-direction: column; align-items: center; justify-content: center; gap: 7px; border: 2px solid #e0b33f; border-radius: 10px; color: var(--navy); background: #fff; box-shadow: 0 3px 9px rgba(4,23,46,.16); }
.package-price-heading-copy { max-width: 150px; line-height: 1.2; }
.package-price-arrow { display: grid !important; width: 29px; height: 29px; place-items: center; border-radius: 50%; color: var(--navy); background: #e0b33f; font-size: 22px; font-weight: 900; line-height: 1; }
.invoice-table .package-price-cell { padding: 8px 6px; vertical-align: middle; text-align: center; }
.package-price-pill { display: inline-flex; min-width: 104px; padding: 7px 9px; flex-direction: column; align-items: center; justify-content: center; border: 1.5px solid var(--navy); border-radius: 9px; color: var(--navy); background: #f7faff; line-height: 1.25; box-shadow: 0 1px 3px rgba(13,43,82,.08); }
.invoice-gift-row td { background: #fffaf0; }
.invoice-gift-row td:first-child strong { color: var(--navy); }
.gift-product-badge { display: inline-flex; margin-top: 5px; padding: 3px 7px; align-items: center; gap: 3px; border: 1px solid #e0b33f; border-radius: 999px; color: var(--navy); background: var(--gold-soft); font-size: 8px; font-weight: 900; letter-spacing: .04em; }
.gift-badge-icon { font-size: 13px; line-height: 1; }
.gift-price-pill { color: var(--navy); border-color: var(--navy); background: #f7faff; }
.gift-subtotal strong, .gift-subtotal span { display: block; color: var(--navy); }
.gift-subtotal span { margin-top: 4px; color: #745900; font-size: 9px; font-weight: 900; line-height: 1.25; }
.invoice-totals { display: grid; grid-template-columns: 1fr auto; gap: 6px 18px; justify-content: end; margin: 18px 0 0 auto; width: min(100%, 330px); }
.invoice-totals span { color: #5f6975; font-size: 12px; }
.invoice-totals strong { text-align: right; color: var(--navy); }
.invoice-totals .grand { padding-top: 8px; border-top: 2px solid var(--navy); font-size: 18px; }
.invoice-loyalty { margin-top: 18px; overflow: hidden; border: 3px solid var(--gold); border-radius: 14px; color: var(--navy); background: linear-gradient(135deg, #ffef9f 0%, #fff8d7 58%, #fffdf4 100%); box-shadow: 0 7px 18px rgba(108,78,0,.18); }
.invoice-loyalty-heading { display: flex; gap: 10px; padding: 10px 13px; align-items: center; color: white; background: var(--navy); }
.invoice-loyalty-icon { display: grid !important; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: var(--gold); font-size: 20px; line-height: 1; }
.invoice-loyalty-heading-copy { display: block; min-width: 0; }
.invoice-loyalty-heading-copy > span { display: block; color: #ffe66f; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.invoice-loyalty-heading-copy > strong { display: block; margin-top: 2px; color: white; font-size: 13px; line-height: 1.2; }
.invoice-loyalty-body { padding: 13px 14px 14px; }
.invoice-loyalty-status { display: block; color: var(--navy); font-size: 15px; line-height: 1.3; }
.invoice-loyalty-detail { display: block; margin-top: 4px; color: #4f5966; font-size: 10px; line-height: 1.35; }
.invoice-loyalty-progress { height: 10px; margin-top: 11px; overflow: hidden; border: 1px solid rgba(13,43,82,.16); border-radius: 999px; background: #e2e6eb; }
.invoice-loyalty-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--navy-2), var(--gold)); }
.invoice-loyalty-progress-label { display: block; margin-top: 5px; color: var(--navy); font-size: 10px; font-weight: 850; line-height: 1.3; }
.invoice-loyalty-earned { display: block; margin-top: 9px; padding: 7px 9px; border-left: 4px solid var(--gold); border-radius: 6px; color: var(--navy); background: rgba(255,255,255,.82); font-size: 10px; line-height: 1.35; }
.invoice-loyalty-earned strong { font-size: 11px; }
.invoice-loyalty-rules { display: grid; gap: 4px; margin-top: 10px; padding: 10px; border: 1px solid rgba(13,43,82,.16); border-radius: 9px; background: rgba(255,255,255,.78); }
.invoice-loyalty-rules > strong { color: var(--navy); font-size: 11px; }
.invoice-loyalty-rules small { display: block; color: #4f5966; font-size: 9px; line-height: 1.38; }
.invoice-loyalty-rules b { color: var(--navy); }
.invoice-loyalty.gift, .invoice-loyalty.gift-delivered { background: linear-gradient(135deg, #ffe47a 0%, #fff2af 48%, #fffdf4 100%); box-shadow: 0 8px 22px rgba(108,78,0,.24); }
.invoice-footer { margin-top: 28px; padding-top: 12px; border-top: 1px solid #dce1e7; color: #5f6975; text-align: center; font-size: 11px; }

.client-dialog { width: min(92vw, 560px); max-height: 94vh; padding: 0; overflow: hidden; border: 0; border-radius: 18px; box-shadow: 0 25px 70px rgba(0,0,0,.35); }
.client-dialog::backdrop { background: rgba(5,20,39,.65); }
.client-dialog form { display: grid; max-height: 94vh; gap: 13px; padding: 20px; overflow-y: auto; overscroll-behavior: contain; }
.dialog-heading { display: flex; justify-content: space-between; align-items: center; }
.dialog-heading h2 { margin: 0; color: var(--navy); }
.dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
.client-dialog #client-form .dialog-heading { position: sticky; z-index: 3; top: -20px; margin: -20px -20px 0; padding: 18px 20px 14px; border-bottom: 1px solid #e0e5eb; background: rgba(255,255,255,.97); backdrop-filter: blur(10px); }
.client-dialog #client-form .client-dialog-actions { position: sticky; z-index: 3; bottom: -20px; margin: 0 -20px -20px; padding: 14px 20px calc(18px + env(safe-area-inset-bottom)); border-top: 1px solid #d9e0e8; background: rgba(255,255,255,.98); box-shadow: 0 -8px 20px rgba(13,43,82,.08); backdrop-filter: blur(10px); }
.client-dialog-actions [data-client-save-action="invoice"] { grid-column: 1 / -1; }
.client-dialog-actions [hidden] { display: none; }
.client-form-section { display: grid; gap: 12px; padding: 14px; border: 1px solid #d9e0e8; border-radius: 14px; background: #f8fafc; }
.client-form-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 9px; border-bottom: 1px solid #e1e6ed; }
.client-form-section-heading h3 { margin: 0; color: var(--navy); font-size: 16px; }
.client-form-section-heading span { padding: 4px 8px; border-radius: 999px; color: #516070; background: #e7edf4; font-size: 10px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.client-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.client-dialog label.client-checkbox { display: flex; min-height: 46px; padding: 10px 12px; align-items: center; gap: 10px; border: 1px solid #ccd5df; border-radius: 11px; color: var(--navy); background: #fff; }
.client-dialog label.client-checkbox input[type="checkbox"] { width: 22px; min-width: 22px; height: 22px; min-height: 22px; margin: 0; accent-color: var(--navy); }
.client-dialog label.client-checkbox span { line-height: 1.35; }
.client-account-actions { display: grid; gap: 10px; padding: 13px; border: 1px solid #d7dde5; border-radius: 13px; background: #f7f9fc; }
.client-account-actions[hidden] { display: none; }
.client-account-status { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.client-account-status > span { color: var(--muted); font-size: 11px; font-weight: 900; letter-spacing: .06em; }
.client-account-status > strong { padding: 4px 9px; border-radius: 999px; color: #236241; background: #dff3e7; font-size: 11px; }
.client-account-actions.inactive .client-account-status > strong { color: #6a4510; background: #f7dfb9; }
.client-account-actions p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.client-account-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.client-account-buttons button { min-height: 43px; }
.reactivate-button { border-color: #5a9d72 !important; color: #245f3b !important; background: #edf8f1 !important; }
.danger-button { border: 1px solid #d99b9b; border-radius: 12px; color: #8b2222; background: #fff4f4; font-weight: 850; }
.danger-button:disabled { color: #9b9b9b; border-color: #d7d7d7; background: #f2f2f2; cursor: not-allowed; }

@media (max-width: 460px) {
  .client-form-grid { grid-template-columns: 1fr; }
  .client-dialog { width: calc(100vw - 16px); max-height: 96vh; border-radius: 16px; }
  .client-dialog form { max-height: 96vh; padding: 16px; }
  .client-dialog #client-form .dialog-heading { top: -16px; margin: -16px -16px 0; padding: 16px 16px 13px; }
  .client-dialog #client-form .client-dialog-actions { bottom: -16px; margin: 0 -16px -16px; padding: 12px 16px calc(14px + env(safe-area-inset-bottom)); }
  .client-form-section { padding: 12px; }
  .client-account-buttons { grid-template-columns: 1fr; }
}

.assistant-dialog { width: min(94vw, 700px); max-height: min(90vh, 820px); padding: 0; overflow: hidden; border: 0; border-radius: 22px; color: var(--ink); background: #f7f8fa; box-shadow: 0 25px 80px rgba(0,0,0,.38); }
.assistant-dialog::backdrop { background: rgba(5,20,39,.72); backdrop-filter: blur(3px); }
.assistant-shell { max-height: min(90vh, 820px); padding: 20px; overflow-y: auto; }
.assistant-heading { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.assistant-heading h2 { margin: 2px 0 0; color: var(--navy); font-size: clamp(22px, 5vw, 30px); line-height: 1.1; }
.assistant-heading .close-button { align-self: start; }
.assistant-privacy { margin: 16px 0; padding: 11px 13px; border: 1px solid #bdd2c5; border-radius: 12px; color: #28563b; background: #eff8f2; font-size: 12px; line-height: 1.4; }
.assistant-privacy span { margin-right: 5px; }
.assistant-search-form { display: grid; gap: 7px; }
.assistant-search-form label { color: var(--navy); font-size: 12px; font-weight: 850; }
.assistant-search-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.assistant-search-form input { min-width: 0; min-height: 52px; padding: 0 14px; border: 2px solid var(--navy); border-radius: 13px; color: var(--ink); background: white; font-size: 16px; outline: 0; }
.assistant-search-form input:focus { border-color: var(--navy-2); box-shadow: 0 0 0 4px rgba(23,62,112,.12); }
.assistant-search-form button { min-height: 52px; padding-inline: 18px; }
.assistant-suggestions { margin: 12px 0 16px; }
.assistant-results { display: grid; gap: 10px; }
.assistant-welcome, .assistant-empty { padding: 22px 16px; text-align: center; border: 1px dashed #bfc9d5; border-radius: 15px; color: var(--muted); background: white; }
.assistant-welcome > span { display: block; margin-bottom: 6px; color: #c79400; font-size: 28px; }
.assistant-welcome strong, .assistant-empty strong { display: block; color: var(--navy); }
.assistant-welcome p, .assistant-empty p { margin: 5px 0 0; font-size: 13px; line-height: 1.45; }
.assistant-answer-heading { padding: 2px 2px 5px; }
.assistant-answer-heading h3 { margin: 0; color: var(--navy); font-size: 18px; }
.assistant-answer-heading p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.assistant-answer-card, .assistant-result-card { padding: 14px; border: 1px solid #d7dde5; border-radius: 15px; background: white; box-shadow: 0 5px 13px rgba(13,43,82,.06); }
.assistant-result-top { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.assistant-rank { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 10px; color: var(--navy); background: var(--gold); font-size: 14px; font-weight: 900; }
.assistant-result-copy { min-width: 0; }
.assistant-result-copy span { display: block; color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .04em; }
.assistant-result-copy h3 { margin: 3px 0 2px; color: var(--navy); font-size: 16px; overflow-wrap: anywhere; }
.assistant-result-copy p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
.assistant-primary-metric { text-align: right; color: var(--navy); }
.assistant-primary-metric strong, .assistant-primary-metric span { display: block; white-space: nowrap; }
.assistant-primary-metric strong { font-size: 18px; }
.assistant-primary-metric span { color: var(--muted); font-size: 10px; font-weight: 800; }
.assistant-result-metrics { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
.assistant-result-metrics span { padding: 5px 8px; border-radius: 999px; color: #405066; background: #edf2f7; font-size: 10px; font-weight: 800; }
.assistant-result-actions { display: flex; justify-content: flex-end; margin-top: 11px; }
.assistant-result-actions button, .assistant-answer-card > button { min-height: 38px; padding: 7px 11px; border: 1px solid var(--navy); border-radius: 9px; color: var(--navy); background: white; font-size: 12px; font-weight: 900; }
.assistant-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 10px 0 12px; }
.assistant-summary-grid div { min-width: 0; padding: 10px 8px; border-radius: 11px; text-align: center; color: var(--navy); background: #edf3f8; }
.assistant-summary-grid strong, .assistant-summary-grid span { display: block; }
.assistant-summary-grid strong { font-size: 19px; overflow-wrap: anywhere; }
.assistant-summary-grid span { margin-top: 2px; color: var(--muted); font-size: 9px; font-weight: 850; }
.assistant-inventory-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 10px 0 13px; }
.assistant-inventory-grid div { padding: 14px; border-radius: 13px; color: white; background: var(--navy); }
.assistant-inventory-grid div:nth-child(2) { color: var(--navy); background: var(--gold-soft); }
.assistant-inventory-grid span, .assistant-inventory-grid strong { display: block; }
.assistant-inventory-grid span { font-size: 10px; font-weight: 850; }
.assistant-inventory-grid strong { margin-top: 2px; font-size: 28px; }
.assistant-answer-card h3 { margin: 0; color: var(--navy); }
.assistant-answer-card p { margin: 6px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.assistant-client-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.assistant-client-card h3 { margin: 0 0 3px; color: var(--navy); font-size: 16px; }
.assistant-client-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.assistant-client-date { display: block; margin-bottom: 4px; color: #8a6500; font-size: 9px; font-weight: 950; letter-spacing: .08em; }
.assistant-friendly-card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 13px; align-items: start; padding: 16px; border: 2px solid #e0b33f; border-radius: 16px; color: var(--navy); background: linear-gradient(135deg, #fff5c5, #fffdf3); box-shadow: 0 7px 18px rgba(108,78,0,.1); }
.assistant-friendly-card.delivery-answer { border-color: #9fb7d1; background: linear-gradient(135deg, #eaf2fa, #fff); box-shadow: 0 7px 18px rgba(13,43,82,.08); }
.assistant-friendly-card.sales-answer { border-color: #b8c5d4; background: linear-gradient(135deg, #f1f5f9, #fff); }
.assistant-friendly-card.client-answer { border-color: #d8c46f; background: linear-gradient(135deg, #fff8d8, #fff); }
.assistant-friendly-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 14px; color: var(--navy); background: var(--gold); font-size: 24px; font-weight: 900; }
.delivery-answer .assistant-friendly-icon { color: white; background: var(--navy); }
.sales-answer .assistant-friendly-icon { color: var(--navy); background: #dce7f2; }
.assistant-friendly-card div > span { display: block; color: #8a6500; font-size: 9px; font-weight: 950; letter-spacing: .11em; }
.assistant-friendly-card h3 { margin: 3px 0 5px; color: var(--navy); font-size: 18px; line-height: 1.28; }
.assistant-friendly-card p { margin: 0; color: #526174; font-size: 12px; line-height: 1.45; }
.assistant-help-options { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.assistant-help-options button { min-height: 44px; padding: 9px 10px; text-align: left; border: 1px solid #b8c4d1; border-radius: 11px; color: var(--navy); background: white; font-size: 12px; font-weight: 850; }
.assistant-help-options button:hover, .assistant-help-options button:focus-visible { border-color: var(--gold); background: var(--gold-soft); outline: 0; }
.assistant-mini-list { display: grid; gap: 8px; }
.assistant-mini-item { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 9px; align-items: center; padding: 11px 12px; border: 1px solid #d7dde5; border-radius: 13px; background: white; }
.assistant-mini-icon { font-size: 20px; line-height: 1; }
.assistant-mini-item strong, .assistant-mini-item small { display: block; }
.assistant-mini-item strong { color: var(--navy); font-size: 13px; }
.assistant-mini-item small { margin-top: 2px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.assistant-mini-item b { color: #745900; font-size: 11px; white-space: nowrap; }
.assistant-mini-item button { min-height: 34px; padding: 6px 9px; border: 1px solid var(--navy); border-radius: 8px; color: var(--navy); background: white; font-size: 11px; font-weight: 900; }
.assistant-more-note { margin: 0; text-align: center; color: var(--muted); font-size: 11px; }
.assistant-product-sales { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.assistant-product-sales article { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center; min-width: 0; padding: 13px; border: 1px solid #d4dce6; border-radius: 13px; background: white; }
.assistant-product-sales article > strong { display: grid; min-width: 42px; height: 42px; padding: 0 7px; place-items: center; border-radius: 12px; color: var(--navy); background: var(--gold); font-size: 20px; }
.assistant-product-sales span, .assistant-product-sales small { display: block; }
.assistant-product-sales span { color: var(--navy); font-size: 13px; font-weight: 900; overflow-wrap: anywhere; }
.assistant-product-sales small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.assistant-answer-card p strong { color: var(--navy); }

.reminder-section-menu { display: grid; gap: 8px; }
.reminder-section-button { display: grid; width: 100%; grid-template-columns: 42px minmax(0, 1fr) 26px; gap: 11px; min-height: 68px; padding: 11px 12px; align-items: center; text-align: left; border: 1px solid #c7d0dc; border-radius: 15px; color: var(--navy); background: white; box-shadow: 0 4px 12px rgba(13,43,82,.06); }
.reminder-section-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; color: white; background: var(--navy); font-size: 22px; font-weight: 900; }
.reminder-section-button.city .reminder-section-icon { background: #2d8b57; }
.reminder-section-button.deals .reminder-section-icon { color: var(--navy); background: var(--gold); }
.reminder-section-button.saved .reminder-section-icon { color: var(--navy); background: var(--gold); }
.reminder-section-button.delivery .reminder-section-icon { color: var(--navy); background: #dce9f6; }
.reminder-section-copy { min-width: 0; }
.reminder-section-copy strong, .reminder-section-copy small { display: block; }
.reminder-section-copy strong { font-size: 15px; line-height: 1.2; }
.reminder-section-copy small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.3; }
.reminder-section-arrow { color: #718096; font-size: 26px; font-weight: 800; line-height: 1; transition: transform .18s ease; }
.reminder-section-button.active { border: 2px solid var(--navy); background: #f2f7fc; box-shadow: 0 7px 18px rgba(13,43,82,.12); }
.reminder-section-button.active .reminder-section-arrow { color: var(--navy); transform: rotate(90deg); }
.reminder-section-help { margin: 8px 4px 15px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.reminder-section-panel { margin-top: 4px; }
.city-reminder-settings { display: grid; gap: 15px; margin-bottom: 14px; border-color: #9cc4aa; background: linear-gradient(145deg, #f0f8f3, #fff 72%); }
.city-reminder-city-filter { margin-top: 1px; }
.city-reminder-city-filter .stacked-filter-trigger { background: #176037; }
.city-reminder-city-filter .stacked-filter-trigger-copy small { color: #d8f0e1; }
.city-reminder-selection-bar { border-color: #82b395; background: #edf8f1; }
.city-reminder-list { gap: 6px; }
.city-reminder-client-copy { display: block; min-width: 0; overflow: hidden; }
.city-reminder-client-copy strong, .city-reminder-client-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.city-reminder-client-copy strong { color: var(--navy); font-size: 14px; line-height: 1.2; }
.city-reminder-client-copy small { margin-top: 3px; color: var(--muted); font-size: 10px; font-weight: 750; }
.city-reminder-client-row.disabled { cursor: not-allowed; opacity: .58; }
.deal-settings { display: grid; gap: 15px; margin-bottom: 14px; border-color: #d8c46f; background: linear-gradient(145deg, #fff8d9, #fff 72%); }
.deal-intro-icon { background: var(--gold); }
.deal-frequency-heading { display: grid; gap: 3px; color: var(--navy); }
.deal-frequency-heading strong { font-size: 12px; }
.deal-frequency-heading small { color: var(--muted); font-size: 10px; }
.deal-frequency-options { display: grid; grid-template-columns: 1fr; gap: 8px; }
.deal-frequency-options button { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; min-height: 58px; padding: 10px 13px; align-items: center; text-align: left; border: 1px solid #b8c4d1; border-radius: 12px; color: var(--navy); background: #fff; }
.deal-frequency-options button span:first-child, .deal-frequency-options button strong, .deal-frequency-options button small { display: block; }
.deal-frequency-options button strong { font-size: 13px; font-weight: 950; }
.deal-frequency-options button small { margin-top: 3px; color: var(--muted); font-size: 10px; font-weight: 800; }
.deal-frequency-arrow { color: #718096; font-size: 20px; font-weight: 900; transition: transform .18s ease; }
.deal-frequency-options button.active { color: #fff; border-color: var(--navy); background: var(--navy); box-shadow: 0 6px 15px rgba(13,43,82,.16); }
.deal-frequency-options button.active small, .deal-frequency-options button.active .deal-frequency-arrow { color: #dbe7f5; }
.deal-frequency-options button.active .deal-frequency-arrow { transform: rotate(180deg); }
.deal-manage-button { width: 100%; min-height: 48px; }
.deal-manage-button.active { color: #fff; background: var(--navy); }
.deal-city-filter .stacked-filter-trigger { background: #745900; }
.deal-city-filter .stacked-filter-trigger-copy small { color: #f5e9b4; }
.deal-message-editor textarea { min-height: 82px; }
.deal-help { margin-top: -5px; }
#deals-reminder-panel [hidden] { display: none !important; }
.deal-automatic-notice { margin-bottom: 13px; padding: 14px 15px; border: 1px solid #d2ae37; border-radius: 14px; color: var(--navy); background: linear-gradient(135deg, #fff2ad, #fffaf0); box-shadow: 0 6px 16px rgba(116,89,0,.09); }
.deal-automatic-notice strong { display: block; font-size: 13px; }
.deal-automatic-notice p { margin: 5px 0 0; font-size: 12px; font-weight: 750; line-height: 1.45; }
.deal-automatic-notice small { display: block; margin-top: 5px; color: #765c00; font-size: 10px; font-weight: 850; }
.deal-alert-heading { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.deal-alert-heading span { display: grid; min-width: 28px; height: 28px; padding: 0 7px; place-items: center; border-radius: 999px; color: #fff; background: var(--navy); font-size: 12px; font-weight: 950; }
.deal-alert-intro { color: #624900; }
.deal-alert-list { display: grid; gap: 7px; margin-top: 11px; }
.deal-alert-list article { padding: 10px 11px; border: 1px solid #e0c461; border-radius: 10px; background: rgba(255,255,255,.78); }
.deal-alert-list article p { margin: 0; color: var(--navy); }
.deal-alert-list article small { margin-top: 4px; }
.deal-alert-dismiss { width: 100%; min-height: 42px; margin-top: 11px; background: #fff; }
.deal-list { display: grid; gap: 9px; }
.deal-list.compact { gap: 5px; }
.deal-client-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 11px; padding: 13px; align-items: center; border: 1px solid #cbd3dc; border-radius: 14px; background: #fff; box-shadow: 0 5px 15px rgba(13,43,82,.06); }
.deal-client-card.automatic { border-color: #d5b348; box-shadow: inset 4px 0 var(--gold), 0 5px 15px rgba(13,43,82,.06); }
.deal-client-icon { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 11px; color: var(--navy); background: var(--gold-soft); font-size: 20px; }
.deal-client-copy { min-width: 0; }
.deal-client-heading { display: flex; gap: 8px; align-items: center; justify-content: space-between; }
.deal-client-heading strong { min-width: 0; overflow: hidden; color: var(--navy); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.deal-client-copy > small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.deal-client-copy > p { margin: 5px 0 0; color: #526174; font-size: 10px; font-weight: 750; }
.deal-source-badge { flex: 0 0 auto; padding: 4px 7px; border-radius: 999px; font-size: 8px; font-weight: 950; text-transform: uppercase; }
.deal-source-badge.manual { color: #176037; background: #e1f3e7; }
.deal-source-badge.automatic { color: #674d00; background: #fff0a8; }
.deal-automatic-reason { margin-top: 8px; padding: 8px 9px; border-radius: 9px; color: #624900; background: #fff6cc; font-size: 10px; font-weight: 800; line-height: 1.4; }
.deal-client-actions { display: grid; gap: 7px; min-width: 148px; }
.deal-client-actions button { width: 100%; min-height: 40px; padding: 7px 10px; font-size: 10px; white-space: nowrap; }
.deal-whatsapp-button { background: #1d8f52; }
.deal-remove-button { min-height: 40px; padding: 7px 10px; font-size: 10px; white-space: nowrap; }
.deal-move-button.active { color: #fff; border-color: var(--navy); background: var(--navy); }
.deal-frequency-editor { display: grid; grid-column: 1 / -1; gap: 10px; width: 100%; padding: 12px; border: 1px solid #d8c46f; border-radius: 12px; background: #fff9dc; }
.deal-frequency-editor-heading { display: grid; gap: 3px; color: var(--navy); }
.deal-frequency-editor-heading strong { font-size: 12px; }
.deal-frequency-editor-heading small { color: #67551a; font-size: 10px; font-weight: 750; line-height: 1.4; }
.deal-frequency-editor-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.deal-frequency-editor-options button { display: flex; gap: 8px; min-width: 0; min-height: 50px; padding: 8px 9px; align-items: center; justify-content: space-between; border: 1px solid #aeb9c7; border-radius: 10px; color: var(--navy); background: #fff; text-align: left; }
.deal-frequency-editor-options button span:first-child { min-width: 0; }
.deal-frequency-editor-options button strong, .deal-frequency-editor-options button small { display: block; }
.deal-frequency-editor-options button strong { font-size: 11px; }
.deal-frequency-editor-options button small { margin-top: 2px; color: var(--muted); font-size: 8px; font-weight: 800; }
.deal-frequency-editor-options button span:last-child { flex: 0 0 auto; font-size: 9px; font-weight: 950; }
.deal-frequency-editor-options button.current { color: #fff; border-color: var(--navy); background: var(--navy); opacity: 1; }
.deal-frequency-editor-options button.current small { color: #dbe7f5; }
.deal-phone-editor { grid-column: 1 / -1; width: 100%; margin-top: 0; }
.delivery-notice-settings { display: grid; gap: 15px; margin-bottom: 14px; border-color: #d8c46f; background: linear-gradient(145deg, #fffbed, #fff 72%); }
.delivery-notice-intro { display: flex; gap: 12px; align-items: center; }
.delivery-notice-icon { display: grid; flex: 0 0 42px; height: 42px; place-items: center; border-radius: 13px; color: var(--navy); background: var(--gold); font-size: 22px; }
.delivery-notice-intro h3 { margin: 0; color: var(--navy); font-size: 18px; }
.delivery-notice-intro p { margin: 4px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.delivery-notice-controls { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.delivery-notice-controls label { display: grid; gap: 6px; color: var(--navy); font-size: 11px; font-weight: 900; }
.delivery-notice-controls select { min-width: 0; }
.delivery-message-editor { display: grid; gap: 7px; color: var(--navy); font-size: 11px; font-weight: 900; }
.delivery-message-editor textarea { width: 100%; min-height: 92px; padding: 11px 12px; resize: vertical; border: 1px solid #aeb9c7; border-radius: 12px; color: var(--ink); background: white; font: inherit; font-size: 13px; font-weight: 600; line-height: 1.45; }
.delivery-message-editor textarea:focus { border-color: var(--navy); outline: 0; box-shadow: 0 0 0 3px rgba(13,43,82,.1); }
.delivery-message-suggestion { justify-self: start; min-height: 40px; padding: 8px 12px; font-size: 11px; }
.delivery-notice-date-copy { margin: 0; padding: 10px 12px; border-radius: 11px; color: var(--navy); background: #eef4fb; font-size: 12px; font-weight: 850; line-height: 1.4; }
.delivery-notice-help { margin: -5px 1px 0; color: var(--muted); font-size: 10px; line-height: 1.4; }
.delivery-notice-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 13px; }
.delivery-notice-summary > div { min-width: 0; padding: 13px 10px; text-align: center; border-radius: 13px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.delivery-notice-summary > div:nth-child(2) { color: var(--navy); border: 1px solid #d7b445; background: var(--gold-soft); }
.delivery-notice-summary span, .delivery-notice-summary strong, .delivery-notice-summary small { display: block; }
.delivery-notice-summary span { color: #dbe7f5; font-size: 8px; font-weight: 900; letter-spacing: .05em; }
.delivery-notice-summary > div:nth-child(2) span, .delivery-notice-summary > div:nth-child(2) small { color: #765c00; }
.delivery-notice-summary strong { margin: 2px 0; font-size: 23px; }
.delivery-notice-summary small { color: #dbe7f5; font-size: 9px; }
.delivery-notice-summary.deal-summary { grid-template-columns: 1fr; gap: 6px; margin-bottom: 12px; }
.delivery-notice-summary.deal-summary > div { display: flex; grid-column: auto; min-height: 34px; padding: 7px 12px; align-items: center; justify-content: center; border: 1px solid #9eb9d5; border-radius: 9px; color: var(--navy); background: #eef5fc; box-shadow: none; }
.delivery-notice-summary.deal-summary > div:nth-child(2) { border-color: #d7b445; background: var(--gold-soft); }
.delivery-notice-summary.deal-summary > div:nth-child(3) { border-color: #c5ced8; background: #f5f7fa; }
.delivery-notice-summary.deal-summary span, .delivery-notice-summary.deal-summary > div:nth-child(2) span { color: var(--navy); font-size: 10px; letter-spacing: .035em; }
.delivery-selection-bar { border-color: #99b9a4; background: #f0f8f3; }
.delivery-notice-list { display: grid; gap: 11px; }
.delivery-notice-card { display: grid; grid-template-columns: auto minmax(0, 1fr) 170px; gap: 13px; align-items: start; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 7px 20px rgba(13,43,82,.06); }
.delivery-notice-card.prepared { border-color: #8fc3a0; box-shadow: inset 4px 0 #2d8b57, 0 7px 20px rgba(13,43,82,.06); }
.delivery-notice-heading { display: flex; justify-content: space-between; gap: 10px; align-items: start; }
.delivery-notice-heading h3 { margin: 0 0 3px; color: var(--navy); font-size: 18px; }
.delivery-notice-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.delivery-notice-facts { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 7px; margin-top: 11px; }
.delivery-notice-facts span { min-width: 0; padding: 9px; border-radius: 10px; background: #f3f6fa; }
.delivery-notice-facts small, .delivery-notice-facts strong { display: block; }
.delivery-notice-facts small { color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .05em; }
.delivery-notice-facts strong { margin-top: 2px; color: var(--navy); font-size: 12px; }
.delivery-notice-address, .delivery-notice-products { margin: 8px 1px 0; font-size: 11px; line-height: 1.4; }
.delivery-notice-address { color: var(--navy); font-weight: 800; }
.delivery-notice-products { color: var(--muted); }
.delivery-notice-prepared { margin: 8px 0 0; padding: 7px 9px; border-radius: 9px; color: #176037; background: #e9f7ef; font-size: 10px; font-weight: 900; }
.delivery-notice-actions { display: grid; }
.delivery-notice-actions button { width: 100%; min-height: 44px; padding: 8px 10px; font-size: 11px; }
.delivery-notice-actions button:disabled { cursor: not-allowed; opacity: .48; }
.delivery-phone-editor { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 11px; padding: 11px; border: 1px solid #d5ad38; border-radius: 12px; background: #fff8d7; }
.delivery-phone-editor label { display: grid; gap: 5px; min-width: 0; color: var(--navy); font-size: 10px; font-weight: 900; }
.delivery-phone-editor input { width: 100%; min-width: 0; min-height: 44px; padding: 9px 11px; border: 1px solid #aeb9c7; border-radius: 10px; color: var(--ink); background: #fff; font: inherit; font-size: 14px; font-weight: 750; }
.delivery-phone-editor input:focus { border-color: var(--navy); outline: 0; box-shadow: 0 0 0 3px rgba(13,43,82,.1); }
.delivery-phone-editor button { align-self: end; min-height: 44px; padding: 8px 13px; white-space: nowrap; }
.delivery-phone-editor small { grid-column: 1 / -1; color: #765c00; font-size: 9px; font-weight: 750; line-height: 1.35; }
.saved-reminder-settings { display: grid; gap: 15px; margin-bottom: 14px; border-color: #9eb9d5; background: linear-gradient(145deg, #eef6ff, #fff 72%); }
.saved-reminder-periods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.saved-reminder-periods button { min-height: 54px; padding: 9px 8px; border: 1px solid #aeb9c7; border-radius: 12px; color: var(--navy); background: #fff; font-size: 11px; font-weight: 900; line-height: 1.25; }
.saved-reminder-periods button.active { color: #fff; border-color: var(--navy); background: var(--navy); box-shadow: 0 6px 15px rgba(13,43,82,.16); }
.saved-reminder-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.saved-reminder-controls label { display: grid; gap: 6px; color: var(--navy); font-size: 11px; font-weight: 900; }
.saved-reminder-controls button { min-height: 48px; padding: 8px 12px; }
.saved-reminder-controls button.active { color: white; background: var(--navy); }
.saved-reminder-search-box { display: grid; gap: 6px; color: var(--navy); font-size: 12px; font-weight: 900; }
.saved-reminder-search-box.management { margin-bottom: 12px; padding: 12px; border: 2px solid var(--navy); border-radius: 14px; background: var(--gold-soft); box-shadow: 0 6px 16px rgba(13,43,82,.1); }
.saved-reminder-search-box.management > span { font-size: 14px; }
#saved-reminder-lists-panel [hidden] { display: none !important; }
.saved-reminder-send-bar { border-color: #82b395; background: #edf8f1; }
.saved-reminder-send-bar .reminder-selection-actions { min-width: 230px; }
.saved-reminder-send-bar button { width: 100%; }
.saved-reminder-client-card.selected { border-color: #7caf8d; box-shadow: inset 4px 0 #2d8b57, 0 7px 20px rgba(13,43,82,.06); }
.reminder-list.compact { gap: 5px; }
.saved-reminder-compact-row {
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  gap: 9px;
  min-height: 48px;
  padding: 7px 10px;
  align-items: center;
  border: 1px solid #cbd3dc;
  border-radius: 11px;
  color: var(--navy);
  background: #fff;
  box-shadow: 0 3px 9px rgba(13,43,82,.05);
  cursor: pointer;
}
.saved-reminder-compact-row.selected { border-color: #79aa8a; background: #edf8f1; }
.saved-reminder-compact-input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.saved-reminder-compact-check { display: grid; width: 30px; height: 30px; place-items: center; border: 2px solid #9ba8b8; border-radius: 9px; background: #fff; font-size: 17px; font-weight: 900; }
.saved-reminder-compact-row.selected .saved-reminder-compact-check { color: #fff; border-color: #2d8b57; background: #2d8b57; }
.saved-reminder-compact-name { min-width: 0; overflow: hidden; font-size: 14px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.saved-reminder-compact-action { padding: 5px 7px; border-radius: 999px; color: var(--navy); background: #eaf1f8; font-size: 9px; font-weight: 950; }
.saved-reminder-compact-row.selected .saved-reminder-compact-action { color: #176037; background: #d9f0e2; }
.saved-reminder-client-icon { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 9px; color: #fff; background: #2d8b57; font-size: 17px; font-weight: 900; }
.saved-reminder-badge { flex: 0 0 auto; padding: 5px 8px; border: 1px solid #76a887; border-radius: 999px; color: #176037; background: #e9f7ef; font-size: 9px; font-weight: 950; white-space: nowrap; }
.saved-reminder-badge.other-list { color: #624900; border-color: #d3ad34; background: var(--gold-soft); }
.saved-reminder-badge.available { color: #526174; border-color: #c2cad4; background: #f1f4f7; }

.reminder-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-bottom: 16px; }
.reminder-summary article { min-width: 0; padding: 14px 10px; text-align: center; border-radius: 14px; color: white; background: var(--navy); box-shadow: var(--shadow); }
.reminder-summary article.preferred { color: var(--navy); border: 1px solid #d7b445; background: var(--gold-soft); }
.reminder-summary span, .reminder-summary strong, .reminder-summary small { display: block; }
.reminder-summary span { color: #dbe7f5; font-size: 9px; font-weight: 900; letter-spacing: .06em; }
.reminder-summary .preferred span { color: #765c00; }
.reminder-summary strong { margin: 3px 0 1px; font-size: 25px; }
.reminder-summary small { color: #dbe7f5; font-size: 10px; }
.reminder-summary .preferred small { color: #765c00; }
.reminder-explanation { border-color: #d8c46f; background: linear-gradient(145deg, #fffbed, #fff 72%); }
.reminder-explanation summary { display: flex; gap: 11px; align-items: center; cursor: pointer; list-style: none; }
.reminder-explanation summary::-webkit-details-marker { display: none; }
.reminder-explanation summary > span:last-child { min-width: 0; }
.reminder-explanation summary strong, .reminder-explanation summary small { display: block; }
.reminder-explanation summary strong { color: var(--navy); font-size: 14px; }
.reminder-explanation summary small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.reminder-explanation-icon { display: grid; flex: 0 0 42px; height: 42px; place-items: center; border-radius: 13px; color: var(--navy); background: var(--gold); font-size: 24px; font-weight: 900; }
.reminder-explanation-body { margin-top: 13px; padding-top: 12px; border-top: 1px solid #e2d28c; }
.reminder-explanation h3 { margin: 0 0 5px; color: var(--navy); font-size: 17px; }
.reminder-explanation p { margin: 3px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.reminder-toolbar { margin-bottom: 10px; }
.reminder-filters { margin: 2px 0 12px; }
.reminder-selection-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 13px; align-items: center; margin-bottom: 13px; padding: 14px; border: 1px solid #b9c8d9; border-radius: 15px; background: #f2f7fc; }
.reminder-selection-bar strong, .reminder-selection-bar span { display: block; }
.reminder-selection-bar strong { color: var(--navy); font-size: 14px; }
.reminder-selection-bar span { margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.35; }
.reminder-selection-actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: end; }
.reminder-selection-actions button { min-height: 40px; padding: 8px 11px; font-size: 11px; }
.reminder-selection-actions button:disabled, .reminder-card-actions button:disabled { cursor: not-allowed; opacity: .48; }
.dispatch-selection-bar { margin: 0 0 14px; border-color: #82b395; background: #edf8f1; }
.dispatch-order { position: relative; }
.dispatch-order.selected-for-notice { border-color: #2d8b57; box-shadow: inset 4px 0 #2d8b57, 0 7px 20px rgba(13,43,82,.08); }
.dispatch-notice-check { position: absolute; z-index: 3; top: 11px; left: 11px; width: 36px; height: 36px; cursor: pointer; }
.dispatch-notice-check input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dispatch-notice-check span { display: grid; width: 36px; height: 36px; place-items: center; border: 3px solid var(--navy); border-radius: 10px; background: #fff8d7; box-shadow: 0 2px 7px rgba(13,43,82,.15); }
.dispatch-notice-check input:checked + span { border-color: #2d8b57; background: #2d8b57; }
.dispatch-notice-check input:checked + span::after { content: "✓"; color: #fff; font-size: 22px; font-weight: 900; }
.dispatch-notice-check input:disabled + span { opacity: .38; }
.dispatch-order:has(.dispatch-notice-check) .dispatch-order-summary { padding-left: 60px; }
.reminder-list { display: grid; gap: 11px; }
.reminder-card { display: grid; grid-template-columns: auto minmax(0, 1fr) 180px; gap: 13px; align-items: start; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 7px 20px rgba(13,43,82,.06); }
.reminder-card.due { border-color: #d3ad34; box-shadow: inset 4px 0 var(--gold), 0 7px 20px rgba(13,43,82,.06); }
.reminder-card.distributor { background: linear-gradient(145deg, #fffdf3, #fff 58%); }
.reminder-select { position: relative; display: block; width: 28px; height: 28px; }
.reminder-select input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.reminder-select span { display: grid; width: 28px; height: 28px; place-items: center; border: 2px solid #9ba8b8; border-radius: 9px; background: white; }
.reminder-select input:checked + span { border-color: var(--navy); background: var(--navy); }
.reminder-select input:checked + span::after { content: "✓"; color: white; font-size: 17px; font-weight: 900; }
.reminder-select input:disabled + span { cursor: not-allowed; opacity: .38; }
.reminder-card-heading { display: flex; justify-content: space-between; gap: 10px; align-items: start; }
.reminder-card-heading h3 { margin: 0 0 3px; color: var(--navy); font-size: 18px; }
.reminder-card-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.reminder-distributor-badge { flex: 0 0 auto; padding: 5px 8px; border: 1px solid #d3ad34; border-radius: 999px; color: #624900; background: var(--gold-soft); font-size: 9px; font-weight: 950; white-space: nowrap; }
.reminder-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 12px; }
.reminder-facts span { min-width: 0; padding: 9px; border-radius: 10px; background: #f3f6fa; }
.reminder-facts small, .reminder-facts strong { display: block; }
.reminder-facts small { color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .05em; }
.reminder-facts strong { margin-top: 2px; color: var(--navy); font-size: 12px; }
.reminder-status { margin: 10px 0 0; padding: 9px 10px; border-radius: 10px; color: #35536f; background: #edf4f8; font-size: 12px; font-weight: 800; line-height: 1.4; }
.reminder-status.due { color: #654b00; background: var(--gold-soft); }
.reminder-status.prepared { color: #176037; background: #e9f7ef; }
.reminder-history { margin: 8px 1px 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.reminder-card-actions { display: grid; gap: 8px; }
.reminder-card-actions label { display: grid; gap: 5px; color: var(--navy); font-size: 10px; font-weight: 900; }
.reminder-card-actions select { width: 100%; min-height: 42px; padding: 8px 9px; border: 1px solid #b9c2ce; border-radius: 10px; color: var(--navy); background: white; font-size: 11px; font-weight: 800; }
.reminder-card-actions button { width: 100%; min-height: 42px; padding: 8px 10px; font-size: 11px; }
.compact-reminder-card { grid-template-columns: 52px minmax(0, 1fr); gap: 0; padding: 0; align-items: center; overflow: hidden; }
.compact-reminder-card > .reminder-select,
.compact-reminder-card > .saved-reminder-client-icon { margin-left: 12px; }
.reminder-entry-summary { display: grid; width: 100%; min-width: 0; min-height: 64px; grid-template-columns: minmax(0, 1fr) auto 20px; gap: 8px; padding: 11px 12px 11px 5px; align-items: center; text-align: left; border: 0; color: var(--navy); background: transparent; font: inherit; }
.reminder-entry-heading { min-width: 0; }
.reminder-entry-heading strong, .reminder-entry-heading small { display: block; }
.reminder-entry-heading strong { overflow: hidden; font-size: 15px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.reminder-entry-heading small { display: -webkit-box; margin-top: 4px; overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 700; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.reminder-entry-arrow { color: #718096; font-size: 24px; font-weight: 900; line-height: 1; transition: transform .18s ease; }
.reminder-entry-summary[aria-expanded="true"] .reminder-entry-arrow { color: var(--navy); transform: rotate(90deg); }
.reminder-entry-details { display: grid; grid-column: 1 / -1; gap: 0; padding: 12px; border-top: 1px solid #dce2e9; background: #fff; }
.reminder-entry-details[hidden] { display: none !important; }
.reminder-entry-meta { margin: 0; color: var(--muted); font-size: 11px; font-weight: 750; }
.compact-reminder-card .reminder-card-actions { grid-template-columns: 1fr 1fr; margin-top: 11px; }
.compact-reminder-card .reminder-card-actions label { grid-column: 1 / -1; }
.compact-reminder-card .delivery-notice-actions { margin-top: 11px; }
.compact-reminder-card .delivery-notice-facts { margin-top: 10px; }

.toast { position: fixed; z-index: 200; right: 16px; bottom: 158px; left: 16px; max-width: 500px; margin: auto; padding: 14px 17px; border-radius: 12px; color: white; text-align: center; background: #17212f; box-shadow: 0 12px 35px rgba(0,0,0,.25); font-weight: 800; }

@media (min-width: 700px) {
  main { padding-bottom: 116px; }
  .bottom-nav { grid-template-columns: repeat(10, 1fr); }
  .toast { bottom: 92px; }
}

@media (max-width: 620px) {
  .app-header { padding-left: 14px; padding-right: 14px; }
  .brand p { display: none; }
  .brand h1 { font-size: 18px; }
  main { width: min(calc(100% - 20px), 820px); padding-top: 22px; }
  .assistant-launcher { grid-template-columns: auto minmax(0, 1fr); }
  .assistant-launcher-private { grid-column: 2; width: max-content; margin-top: -6px; }
  .assistant-shell { padding: 16px; }
  .assistant-search-form > div { grid-template-columns: 1fr; }
  .assistant-search-form button { width: 100%; }
  .assistant-result-top { grid-template-columns: auto minmax(0, 1fr); }
  .assistant-primary-metric { grid-column: 2; text-align: left; }
  .assistant-primary-metric strong, .assistant-primary-metric span { display: inline; }
  .assistant-primary-metric span { margin-left: 4px; }
  .assistant-summary-grid { grid-template-columns: 1fr 1fr; }
  .assistant-mini-item { grid-template-columns: auto minmax(0, 1fr) auto; }
  .assistant-mini-item b { grid-column: 2; }
  .assistant-mini-item button { grid-column: 3; grid-row: 1 / span 2; }
  .assistant-product-sales { grid-template-columns: 1fr; }
  .assistant-help-options { grid-template-columns: 1fr; }
  .panel { padding: 16px; }
  .selected-client .selected-top { align-items: stretch; flex-direction: column; }
  .selected-actions { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); width: 100%; }
  .selected-client button { min-height: 44px; }
  .selected-client #reprogram-order { max-width: none; }

  /* Nueva venta: los cuatro productos quedan visibles juntos en una cuadrícula compacta. */
  #products-panel { padding: 12px; }
  #products-panel .step-heading { margin-bottom: 10px; }
  #products-panel .step-heading p { font-size: 12px; line-height: 1.3; }
  .sale-inventory-status { margin-bottom: 9px; padding: 9px 10px; }
  .sale-inventory-heading { align-items: flex-start; gap: 8px; }
  .sale-inventory-status strong { font-size: 13px; line-height: 1.25; }
  .sale-inventory-status p { margin-top: 3px; font-size: 11px; line-height: 1.3; }
  .sale-inventory-status button { width: auto; min-height: 34px; padding: 5px 8px; }
  .sale-inventory-status.not-configured { grid-template-columns: 1fr; align-items: stretch; }
  .sale-inventory-status.not-configured button { width: 100%; }
  .product-list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .product-card {
    display: block;
    min-width: 0;
    padding: 0;
    border-radius: 13px;
  }
  .product-card-summary { display: flex; gap: 12px; align-items: center; justify-content: space-between; min-height: 58px; padding: 11px 12px; }
  .product-card-name { font-size: 15px; line-height: 1.2; }
  .product-card-details { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 9px 10px 10px; }
  .product-name-row { display: grid; gap: 1px; align-items: start; }
  .product-card h4 { font-size: 14px; line-height: 1.2; }
  .product-price { font-size: 15px; line-height: 1.2; }
  .product-card p {
    display: -webkit-box;
    margin-top: 3px;
    overflow: hidden;
    font-size: 10.5px;
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .package-price { max-width: 100%; margin-top: 5px; padding: 3px 5px; font-size: 9.5px; white-space: nowrap; }
  .stepper { width: 100%; justify-self: stretch; grid-template-columns: minmax(0, 1fr) 38px minmax(0, 1fr); border-radius: 10px; }
  .stepper button, .stepper output { height: 44px; }
  .stepper button { font-size: 22px; }
  .stepper output { font-size: 16px; }
  .order-summary { align-items: start; }
  .loyalty-heading { align-items: stretch; flex-direction: column; }
  .selected-client .loyalty-heading #redeem-loyalty-gift { width: 100%; min-height: 44px; }
  .delivery-round-picker { grid-template-columns: 1fr; }
  .delivery-round-options { width: 100%; }
  .toolbar { flex-direction: column; }
  .dispatch-controls { grid-template-columns: 1fr; }
  .dispatch-mode { display: grid; grid-template-columns: 1fr 1fr; }
  .dispatch-message-footer { align-items: stretch; flex-direction: column; }
  .dispatch-message-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .dispatch-message-footer button { width: 100%; }
  .dispatch-actions { grid-template-columns: 1fr; }
  .dispatch-order-top { flex-direction: column; }
  .dispatch-order-actions { width: 100%; max-width: none; display: grid; grid-template-columns: 1fr 1fr; }
  .dispatch-order-actions .delivery-badge { grid-column: 1 / -1; justify-self: start; }
  .dispatch-contact-actions { grid-column: 1 / -1; }
  .dispatch-order-actions .paid-toggle { grid-column: 1 / -1; }
  .dispatch-round-selector { align-items: stretch; flex-direction: column; }
  .dispatch-round-selector-options { width: 100%; min-width: 0; }
  .report-date-grid, .report-summary { grid-template-columns: 1fr 1fr; }
  .inventory-fields { grid-template-columns: 1fr; }
  .backup-summary { grid-template-columns: 1fr 1fr; }
  .backup-actions { grid-template-columns: 1fr; }
  .saved-reminder-periods { grid-template-columns: 1fr; }
  .saved-reminder-periods button { min-height: 46px; }
  .saved-reminder-controls { grid-template-columns: 1fr; }
  .saved-reminder-controls button { width: 100%; }
  .deal-client-card { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
  .deal-client-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; width: 100%; min-width: 0; }
  .deal-client-actions .deal-move-button, .deal-client-actions.without-whatsapp .deal-remove-button { grid-column: 1 / -1; }
  .deal-frequency-editor-options { grid-template-columns: 1fr; }
  .deal-phone-editor { grid-column: 1 / -1; }
  .delivery-notice-controls { grid-template-columns: 1fr; }
  .delivery-notice-summary { grid-template-columns: 1fr 1fr; }
  .delivery-notice-summary > div:first-child { grid-column: 1 / -1; }
  .delivery-notice-card { grid-template-columns: auto minmax(0, 1fr); padding: 14px; }
  .delivery-notice-actions { grid-column: 1 / -1; }
  .delivery-phone-editor { grid-template-columns: 1fr; }
  .delivery-phone-editor button { width: 100%; }
  .delivery-notice-heading { align-items: start; flex-direction: column; }
  .delivery-notice-facts { grid-template-columns: 1fr; }
  .reminder-summary { grid-template-columns: 1fr 1fr; }
  .reminder-selection-bar { grid-template-columns: 1fr; }
  .reminder-selection-actions { display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; }
  .reminder-selection-actions #send-next-reminder,
  .reminder-selection-actions #send-next-saved-reminder,
  .reminder-selection-actions #send-next-city-reminder { grid-column: 1 / -1; }
  .reminder-card { grid-template-columns: auto minmax(0, 1fr); padding: 14px; }
  .compact-reminder-card { grid-template-columns: 52px minmax(0, 1fr); padding: 0; }
  .reminder-card-actions { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .reminder-card-actions label { grid-column: 1 / -1; }
  .reminder-card-heading { align-items: start; flex-direction: column; }
  .reminder-facts { grid-template-columns: 1fr 1fr; }
  .reminder-facts span:last-child { grid-column: 1 / -1; }
  .report-section-head { align-items: start; }
  .report-client-row { align-items: start; }
  .manage-product-card { align-items: start; }
  .nav-button { font-size: 9px; overflow-wrap: anywhere; }
  .invoice-client { grid-template-columns: 1fr; gap: 9px; }
  .invoice-document { width: calc(100% - 16px); margin-top: 8px; padding: 18px 12px; }
  .invoice-table { font-size: 11px; }
  .invoice-table th, .invoice-table td { padding: 8px 4px; }
  .invoice-table th:nth-child(1) { width: 27%; }
  .invoice-table th:nth-child(2) { width: 17%; white-space: nowrap; }
  .invoice-table th:nth-child(3) { width: 37%; }
  .invoice-table th:nth-child(4) { width: 19%; }
  .package-price-heading-card { min-height: 104px; padding-inline: 4px; }
  .package-price-heading-copy { max-width: 118px; }
  .package-price-pill { min-width: 94px; padding-inline: 5px; }
}

@media print {
  @page { size: A4; margin: 12mm; }
  body { background: white; }
  body > *:not(.modal), .no-print, .modal-backdrop { display: none !important; }
  .modal { position: static; display: block !important; }
  .modal-sheet { width: 100%; max-height: none; overflow: visible; border-radius: 0; background: white; box-shadow: none; }
  .invoice-document { width: 100%; margin: 0; padding: 0; box-shadow: none; }
  .draft-watermark { color: rgba(198,40,40,.08); }
}

/* Keep opened steps clear of the fixed navigation. */
[id], .product-card, .deal-frequency-editor { scroll-margin-top: 12px; }
.deal-send-check { display: flex; align-items: center; gap: 8px; font-weight: 700; }
.deal-send-check input { width: 26px; height: 26px; accent-color: #123456; }
#deal-send-controls { display: flex; flex-wrap: wrap; gap: 12px; }
#deal-send-controls[hidden] { display: none; }
#deal-send-controls p, #deal-selection-count { flex-basis: 100%; }

/* Selection must keep its action visible while choosing dispatch clients. */
.dispatch-selection-bar.has-selection {
  position: fixed; bottom: calc(var(--dispatch-nav-height, 150px) + 8px);
  left: 50%; transform: translateX(-50%); width: min(calc(100% - 28px), 820px); z-index: 45;
  padding: 12px; border: 2px solid #2c8959;
  box-shadow: 0 5px 18px rgba(13,43,82,.18);
}
.dispatch-selection-bar.has-selection > div > span { display: none; }
.dispatch-selection-bar.has-selection #select-visible-dispatches { display: none; }
.dispatch-selection-bar.has-selection .reminder-selection-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.dispatch-selection-bar.has-selection .reminder-selection-actions button { flex: 1; min-height: 44px; padding: 10px; font-size: 14px; }
.dispatch-selection-bar.has-selection strong { font-size: 16px; }

#dispatch-preview.has-notice-selection { padding-bottom: 150px; }

.client-history-section { padding: 16px; border: 2px solid var(--gold); border-radius: 16px; background: #fff9df; }
.client-history-section h3 { margin: 0 0 12px; color: var(--navy); }
.client-history-section p { margin: 8px 0; }
/* Compact history: product and value, with date on its own line on phones. */
.client-history-invoices { display: grid; gap: 0; margin-top: 14px; border: 1px solid #bdc6d1; border-radius: 10px; overflow: hidden; background: white; }
.client-history-invoice { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "date value" "product value"; gap: 3px 10px; width: 100%; min-height: 52px; padding: 9px 10px; text-align: left; border: 0; border-bottom: 1px solid #dce1e6; border-radius: 0; background: white; color: var(--navy); }
.client-history-invoice:last-child { border-bottom: 0; }
.client-history-date { grid-area: date; font-size: .78rem; color: #536171; }
.client-history-product { grid-area: product; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .88rem; }
.client-history-value { grid-area: value; align-self: center; white-space: nowrap; font-size: .9rem; }
.client-history-invoice:focus-visible { outline: 3px solid var(--gold); outline-offset: -3px; }
@media (min-width: 600px) {
 .client-history-invoice { grid-template-columns: 90px minmax(0, 1fr) auto; grid-template-areas: "date product value"; align-items: center; }
}

/* Buscador: al escribir, el menú de abajo se oculta para que se vean los resultados */
body.is-searching .bottom-nav { display: none; }

/* Buscador de venta: tarjetas compactas para ver 4-5 clientes a la vez */
#client-results { gap: 6px; margin-top: 6px; }
#client-results .client-result { padding: 8px 12px; gap: 8px; border-radius: 12px; }
#client-results .client-result strong { margin-bottom: 1px; font-size: 15px; line-height: 1.25; }
#client-results .client-meta { flex-wrap: nowrap; gap: 0 8px; overflow: hidden; font-size: 12px; line-height: 1.3; }
#client-results .client-meta > span { white-space: nowrap; }
#client-results .client-meta > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* Venta compacta: al elegir cliente se ven enseguida los 4 productos, sin deslizar */
#view-sale .panel { padding: 14px; margin-bottom: 12px; }
#view-sale .step-heading { margin-bottom: 10px; gap: 10px; align-items: center; }
#view-sale .step-number { flex-basis: 30px; height: 30px; border-radius: 10px; }
#view-sale .step-heading h3 { margin: 0; font-size: 17px; }
#products-panel .step-heading p, #finish-panel .step-heading p { display: none; }

.selected-client { padding: 10px 12px; border-radius: 13px; }
.selected-client .selected-top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
.selected-client h4 { margin: 0; font-size: 17px; line-height: 1.2; }
.selected-client p { margin: 1px 0 0; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.selected-actions { flex-direction: row; gap: 6px; }
.selected-actions button { flex: 1 1 0; min-height: 40px; padding: 6px 4px; font-size: 12.5px; line-height: 1.15; }
.selected-client #reprogram-order { max-width: none; }
.selected-client-loyalty { margin-top: 8px; padding: 8px 10px; border-radius: 10px; }
.selected-client-loyalty .loyalty-heading span { display: inline; margin-right: 8px; }
.selected-client-loyalty .loyalty-heading strong { display: inline; margin: 0; font-size: 14px; }
.loyalty-progress { height: 6px; margin-top: 7px; }
.selected-client-loyalty:not(.gift-ready) > p { display: none; }
.editing-invoice-banner, .selected-distributor-banner { margin-bottom: 8px; padding: 7px 10px; }

#products-panel { display: flex; flex-direction: column; }
#products-panel .step-heading { order: 0; }
#product-list { order: 1; gap: 6px; }
#sale-inventory-status { order: 2; margin: 8px 0 0; padding: 8px 10px; border-radius: 11px; }
#sale-inventory-status p { margin-top: 3px; }
#sale-inventory-status button { min-height: 32px; }
#sale-inventory-status .sale-inventory-heading span { display: inline; margin-right: 6px; }
#sale-inventory-status .sale-inventory-heading strong { font-size: 13px; }

.product-card { border-radius: 13px; }
.product-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 7px 8px 7px 12px; }
.product-row-title { display: flex; flex-wrap: wrap; gap: 0 8px; align-items: baseline; }
.product-card-name { font-size: 16px; }
.product-card .product-row-info p { margin: 1px 0 0; font-size: 12px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-card .stepper { grid-template-columns: 38px 38px 38px; }
.product-card .stepper button, .product-card .stepper output { height: 40px; }

#finish-panel .order-summary { margin-bottom: 10px; padding: 10px 14px; }
#finish-panel .order-summary strong { font-size: 24px; }
#finish-panel .delivery-round-picker { margin-bottom: 10px; padding: 10px; }

#selected-client .selected-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
#selected-client .selected-actions button { grid-column: auto; min-height: 38px; }
#selected-client .selected-actions #cancel-invoice-edit { grid-column: 1 / -1; }
.product-card .product-row-info p { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: unset; }
.product-row { padding: 6px 8px 6px 12px; }
.product-card .stepper { grid-template-columns: 36px 36px 36px; }
.product-card .stepper button, .product-card .stepper output { height: 38px; }

.kit-unit-price{display:block;font-weight:800;font-size:.95em;color:#5b6b80;margin-top:2px}

.desc-main,.desc-paren{display:block}
.desc-paren{white-space:nowrap}
.desc-paren{white-space:normal}

/* v202: cabecera compacta con asistente y nueva venta sin título */
.header-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.assistant-launcher.header-assistant { display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 2px solid var(--gold); border-radius: 14px; background: var(--gold); box-shadow: none; grid-template-columns: 1fr; }
.assistant-launcher.header-assistant .assistant-launcher-icon { width: auto; height: auto; background: none; box-shadow: none; color: var(--navy); font-size: 22px; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
main { padding-top: 16px; }

/* v202: al buscar siempre hay sitio para subir el buscador arriba */
body.is-searching main { padding-bottom: 100vh; }
#view-history .toolbar { display: block; }
#view-history .history-export-row { margin-top: 16px; }

/* v202: botones de envío en barra fija abajo; los resultados quedan pegados al buscador */
.sticky-actions { position: sticky; bottom: calc(var(--nav-h, 124px) + 8px); z-index: 6; margin-top: 12px; padding: 10px 12px; box-shadow: 0 -6px 18px rgba(13,43,82,.16); }
.sticky-actions > p, .sticky-actions > div > span { display: none; }
#deal-send-controls.sticky-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#deal-send-controls.sticky-actions > strong { flex: 1 0 100%; }
body.is-searching .sticky-actions { bottom: 8px; }
.sticky-actions button { flex: 1 1 auto; min-height: 42px; padding: 8px 10px; font-size: 14px; }
.reminder-selection-bar.sticky-actions { margin-bottom: 0; }

/* v202: nota de reparto */
.history-delivery-note { display: block; margin-top: 4px; color: #7a4b00; font-size: 13px; font-weight: 800; }
.dispatch-delivery-note { color: #7a4b00; font-weight: 800; }
.history-actions .note-button { border-color: #d9a520; color: #7a4b00; background: #fff8e1; }

/* v202: importe a cobrar visible en Despachos */
.dispatch-order-name { display: flex; flex-direction: column; gap: 2px; }
.dispatch-order-amount { display: block; color: #b42318; font-size: 18px; font-weight: 900; }

/* v202: Ruta del día */
.route-day-button { width: 100%; }
.route-day-panel { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: start center; padding: 12px; overflow: auto; background: rgba(13,43,82,.6); }
.route-day-box { width: 100%; max-width: 480px; padding: 14px; border-radius: 18px; background: #fff; color: #17212f; box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.route-day-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.route-day-head strong { color: var(--navy); font-size: 18px; }
.route-day-close { width: 40px; height: 40px; border: 0; border-radius: 12px; background: #edf1f6; font-size: 18px; }
.route-day-links { display: grid; gap: 8px; margin: 12px 0 6px; }
.route-day-open { display: block; padding: 14px; border-radius: 12px; text-align: center; text-decoration: none; font-weight: 900; }
.route-day-hint { margin: 6px 0; color: var(--muted); font-size: 13px; }
.route-day-list { margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.route-day-stop { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid #d6dde8; border-radius: 12px; }
.route-day-stop.missing { border-color: #e0a100; background: #fff8e1; }
.route-day-num { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--navy); color: #fff; font-weight: 900; }
.route-day-info strong, .route-day-info small { display: block; }
.route-day-info small { margin-top: 2px; color: var(--muted); font-size: 13px; }
.route-day-info .route-day-note { color: #7a4b00; font-weight: 800; }
.route-day-side { display: grid; justify-items: end; gap: 6px; }
.route-day-side b { color: #b42318; font-size: 16px; }
.route-day-move { display: flex; gap: 4px; }
.route-day-move button { width: 36px; height: 36px; border: 1px solid #b8c4d6; border-radius: 10px; background: #fff; font-size: 18px; font-weight: 900; }
.route-day-move button:disabled { opacity: .3; }

/* v202: Compra de insumos */
.supplies-content { display: grid; gap: 14px; }
.supplies-content .panel { margin: 0; }
.supplies-summary { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: end; }
.supplies-month { display: grid; gap: 4px; font-weight: 800; color: var(--navy); }
.supplies-total { display: grid; justify-items: end; }
.supplies-total span { color: var(--muted); font-size: 13px; font-weight: 700; }
.supplies-total strong { color: var(--navy); font-size: 26px; font-weight: 900; }
.supplies-h3 { margin: 0 0 10px; color: var(--navy); font-size: 18px; }
.supplies-form { display: grid; gap: 10px; }
.supplies-form label { display: grid; gap: 4px; font-weight: 800; color: var(--navy); font-size: 14px; }
.supplies-form input, .supplies-form select { width: 100%; box-sizing: border-box; min-height: 46px; padding: 10px 12px; border: 1px solid #b8c4d6; border-radius: 10px; font: inherit; font-size: 16px; background: #fff; color: #17212f; }
.supplies-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.supplies-preview { margin: 0; color: var(--navy); font-weight: 900; min-height: 1.2em; }
.supplies-list, .supplies-purchases { display: grid; gap: 10px; }
.supply-card { display: grid; gap: 10px; padding: 12px; border: 1px solid #d6dde8; border-radius: 12px; background: #fff; }
.supply-card-main strong, .supply-card-main small { display: block; }
.supply-card-main strong { color: var(--navy); font-size: 17px; }
.supply-card-main small { margin-top: 2px; color: var(--muted); font-size: 14px; }
.supply-card-main .supply-month-line { color: #17212f; }
.supply-card-main .supply-month-line b { color: var(--navy); }
.supply-card-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.supply-card-actions button { flex: 1 1 auto; min-height: 42px; padding: 8px 10px; border: 1px solid #b8c4d6; border-radius: 10px; background: #fff; color: var(--navy); font-weight: 800; }
.supply-card-actions button.danger { border-color: #e2a3a3; color: #b42318; }
.supply-purchase-row { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid #e3e8ef; }
.supply-purchase-row strong, .supply-purchase-row small { display: block; }
.supply-purchase-row small { color: var(--muted); font-size: 13px; }
.supply-purchase-row b { color: var(--navy); }
.supply-purchase-delete { width: 36px; height: 36px; border: 1px solid #e2a3a3; border-radius: 10px; background: #fff; color: #b42318; font-weight: 900; }
@media (max-width: 420px) { .supplies-summary { grid-template-columns: 1fr; } .supplies-total { justify-items: start; } }
.supplies-month input { min-height: 46px; padding: 8px 12px; border: 1px solid #b8c4d6; border-radius: 10px; font: inherit; font-size: 16px; background: #fff; color: #17212f; }

/* v203: pago al repartidor */
.delivery-owed { display: grid; gap: 2px; padding: 12px; border-radius: 12px; background: #fff8e1; border: 1px solid #ecd28a; margin-bottom: 10px; }
.delivery-owed span { color: #6b5200; font-weight: 800; font-size: 14px; }
.delivery-owed strong { color: #b42318; font-size: 28px; font-weight: 900; }
.delivery-owed small { color: var(--muted); font-size: 12px; }
.delivery-table-wrap { overflow-x: auto; }
.delivery-table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.delivery-table th { text-align: left; padding: 6px 6px; color: var(--muted); font-size: 12px; border-bottom: 1px solid #d6dde8; }
.delivery-table td { padding: 8px 6px; border-bottom: 1px solid #e8edf3; color: #17212f; }
.delivery-table tr.best td { background: #eef9f1; }
.delivery-h4 { margin: 16px 0 6px; color: var(--navy); font-size: 16px; }
.delivery-best { margin: 8px 0 10px; color: #1f7a45; font-weight: 800; }
.delivery-days { margin: 8px 0 4px; }
.delivery-days summary { color: var(--navy); font-weight: 800; cursor: pointer; padding: 6px 0; }
.delivery-day { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px solid #e8edf3; font-size: 14px; }
.delivery-pay .supply-card-actions { margin-top: 6px; }

/* v203: Despachos compacto, tabla primero */
#view-dispatch .dispatch-scope-note { display: none; }
#view-dispatch .dispatch-controls { margin: 12px 0; padding: 8px; }
#view-dispatch .dispatch-controls .dispatch-mode button { min-height: 42px; }
#view-dispatch .dispatch-product-summary { margin-top: 0; }
.dispatch-message-details { margin-top: 14px; }
.dispatch-message-summary { cursor: pointer; color: var(--navy); font-weight: 900; font-size: 16px; padding: 4px 0; }
.dispatch-message-details[open] .dispatch-message-summary { margin-bottom: 10px; }
.dispatch-selection-bar { margin-top: 14px; }
#view-dispatch .dispatch-product-summary-head { align-items: center; }
#view-dispatch .dispatch-product-summary-head h3 { margin: 0; }
#view-dispatch .dispatch-product-table th, #view-dispatch .dispatch-product-table td { white-space: nowrap; }

/* v203: Recordatorios (Tratos) compacto */
#view-reminders .page-heading, #reminder-section-menu, #reminder-section-help { display: none !important; }
.deals-compact { display: grid; gap: 10px; }
.deals-compact .deal-top { display: grid; gap: 8px; }
.deals-compact .deal-tabs { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0; }
.deals-compact .deal-tabs button { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 46px; padding: 6px; border: 1px solid #c9d3e1; border-radius: 12px; background: #fff; color: var(--navy); }
.deals-compact .deal-tabs button strong { font-size: 15px; }
.deals-compact .deal-tabs button small { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: #edf1f6; color: var(--navy); font-weight: 900; font-size: 13px; }
.deals-compact .deal-tabs button.active { background: var(--navy); color: #fff; border-color: var(--navy); }
.deals-compact .deal-tabs button.active small { background: var(--gold); color: var(--navy); }
.deal-search-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.deal-search-row .saved-reminder-search-box { margin: 0; }
.deal-search-row .deal-manage-button { min-height: 48px; padding: 8px 10px; font-size: 14px; white-space: nowrap; margin: 0; }
.deal-source-filter { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.deal-source-filter button { min-height: 36px; padding: 6px 10px; border: 1px solid #c9d3e1; border-radius: 999px; background: #fff; color: var(--navy); font-size: 13px; font-weight: 800; }
.deal-source-filter button.active { background: #fff3c4; border-color: #e0b52e; }
.deal-due-count { color: #b42318; font-weight: 900; font-size: 13px; }
.deals-compact .deal-list { display: grid; gap: 8px; }
.deals-compact .deal-client-card { padding: 10px; gap: 6px; }
.deals-compact .deal-send-check { align-self: start; }
.deals-compact .deal-send-check input { width: 26px; height: 26px; }
.deals-compact .deal-client-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.deal-due-badge { padding: 3px 8px; border-radius: 999px; background: #edf1f6; color: var(--navy); font-size: 12px; font-weight: 900; }
.deal-due-badge.due { background: #fde8e8; color: #b42318; }
.deals-compact .deal-client-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.deals-compact .deal-client-actions button { min-height: 40px; padding: 6px 10px; font-size: 14px; flex: 1 1 auto; }
.deal-message-details summary, .deal-help-details summary { cursor: pointer; color: var(--navy); font-weight: 900; padding: 6px 0; }
.deal-message-details { margin: 0; }
.deal-help-details { padding: 0 4px; color: var(--muted); font-size: 14px; }
.deals-compact #deal-send-controls { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.deals-compact #deal-send-controls[hidden] { display: none; }
.deals-compact #deal-send-controls strong { flex: 1 0 100%; font-size: 14px; }
.deals-compact, .deals-compact > *, .deals-compact .deal-top > *, .deals-compact .deal-tabs button, .deal-search-row > * { min-width: 0; box-sizing: border-box; max-width: 100%; }
.deals-compact .deal-tabs button { overflow: hidden; }
.deals-compact .deal-tabs button strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.deals-compact .deal-client-card { grid-template-columns: auto 1fr; }
.deals-compact .deal-client-actions { grid-column: 1 / -1; display: grid !important; grid-template-columns: 1.4fr 1fr 1fr; gap: 6px; }
.deals-compact .deal-client-actions.without-whatsapp { grid-template-columns: 1fr 1fr; }
.deals-compact .deal-client-actions button { min-height: 40px; width: 100%; margin: 0; padding: 6px 4px; font-size: 14px; }
.deals-compact .deal-client-actions > * { grid-column: auto !important; grid-row: auto !important; }
.deals-compact .deal-tabs button { gap: 4px; padding: 6px 4px; }
.deals-compact .deal-tabs button strong { font-size: 13.5px; }
.deals-compact .deal-tabs button small { min-width: 22px; height: 22px; font-size: 12px; padding: 0 5px; }

/* v203: contenido de cada kit en la factura */
.desc-line { display: block; }
.desc-each { font-weight: 700; color: #5b6b80; font-size: .92em; }
.desc-nowrap { white-space: nowrap; }
.kit-composition { font-weight: 800; color: #17212f; white-space: nowrap; }

/* v204: proveedor del insumo */
.supplier-fields { display: grid; gap: 10px; margin: 4px 0 0; padding: 10px 12px 12px; border: 1px solid #d6dde8; border-radius: 12px; }
.supplier-fields legend { padding: 0 6px; color: var(--navy); font-weight: 900; }
.supplier-box { display: grid; gap: 3px; margin: 6px 0; padding: 8px 10px; border-radius: 10px; background: #f3f6fa; color: #17212f; font-size: 14px; }
.supplier-box span { color: var(--muted); }
.supplier-links { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.supplier-links a { color: var(--navy); font-weight: 800; text-decoration: none; word-break: break-all; }

/* v205: insumos plegables */
.supply-card { padding: 0; gap: 0; }
.supply-card-toggle { display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; min-height: 56px; padding: 12px 14px; border: 0; background: none; text-align: left; color: var(--navy); font: inherit; }
.supply-card-toggle strong { font-size: 17px; }
.supply-card-toggle span { font-size: 20px; font-weight: 900; color: var(--muted); }
.supply-card-body { display: grid; gap: 10px; padding: 0 12px 12px; }
.supply-card.open { border-color: var(--navy); }
.supplier-box .supplier-name { color: #17212f; }

/* v206: tabla de despachos con filas alternas */
#view-dispatch .dispatch-product-table tbody tr:nth-child(odd):not(.dispatch-product-total) th,
#view-dispatch .dispatch-product-table tbody tr:nth-child(odd):not(.dispatch-product-total) td { background: #ffffff; }
#view-dispatch .dispatch-product-table tbody tr:nth-child(even):not(.dispatch-product-total) th,
#view-dispatch .dispatch-product-table tbody tr:nth-child(even):not(.dispatch-product-total) td { background: #dfe7f1; }
#view-dispatch .dispatch-product-table tbody td { color: #17212f; }
#view-dispatch .dispatch-product-table tbody td:last-child { background-image: linear-gradient(rgba(13,43,82,.07), rgba(13,43,82,.07)); }