/* ============================================================
   Client Desk — White-label Professional Theme
   ============================================================ */

:root {
  color-scheme: light;

  /* Palette */
  --bg: #f6f3fa;
  --bg-deep: #efe9f7;
  --panel: #ffffff;
  --panel-soft: #faf8fd;
  --panel-strong: #f3edfa;
  --ink: #241733;
  --ink-soft: #3c2b52;
  --muted: #7b6f8d;
  --line: #e5ddf0;
  --line-strong: #d5c8e8;

  --brand-accent: #111827;
  --purple: var(--brand-accent);
  --purple-dark: #581c9e;
  --purple-deep: #3b1466;
  --purple-soft: #f1e9fc;
  --violet: #8b5cf6;
  --lavender: #c4b5fd;

  --gold: #b98a1d;
  --gold-bright: #d9a52a;
  --gold-soft: #faf3e0;

  --rose: #c2325f;
  --rose-soft: #fdeef3;
  --green: #1d7a4d;
  --green-soft: #e7f6ee;
  --amber: #a16207;
  --amber-soft: #fdf4e3;
  --blue: #2563b8;
  --blue-soft: #e9f1fc;

  --grad-purple: linear-gradient(135deg, #6d28d9 0%, #8b5cf6 55%, #a78bfa 100%);
  --grad-deep: linear-gradient(135deg, #2e1052 0%, #4c1d95 60%, #6d28d9 100%);
  --grad-gold: linear-gradient(135deg, #d9a52a, #b98a1d);

  --shadow-sm: 0 2px 8px rgba(59, 20, 102, 0.06);
  --shadow: 0 14px 40px rgba(59, 20, 102, 0.1);
  --shadow-lg: 0 24px 60px rgba(46, 16, 82, 0.16);

  --radius: 14px;
  --radius-sm: 10px;

  /* Offline font stacks — elegant fonts that ship with Windows, Android and iOS,
     so the app needs no internet connection and no font downloads. */
  --font-display: "Playfair Display", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Times New Roman", serif;
  --font-body: "Inter", "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

::selection {
  background: var(--lavender);
  color: var(--purple-deep);
}

body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(1100px 500px at 85% -120px, rgba(139, 92, 246, 0.14), transparent 60%),
    radial-gradient(900px 480px at -10% 0%, rgba(217, 165, 42, 0.08), transparent 55%),
    linear-gradient(180deg, rgba(246, 243, 250, 0.92), rgba(246, 243, 250, 0.98)),
    var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.app-shell {
  width: min(1680px, 100%);
  margin: 0 auto;
  padding: 22px clamp(14px, 2.5vw, 28px) 40px;
}

/* ------------------------------------------------------------
   Top bar
   ------------------------------------------------------------ */

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 20px;
  padding: 18px 22px;
  border-radius: calc(var(--radius) + 4px);
  background: var(--grad-deep);
  box-shadow: var(--shadow-lg);
  position: relative;
  overflow: hidden;
}

.topbar::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(560px 200px at 90% -40%, rgba(217, 165, 42, 0.22), transparent 70%),
    radial-gradient(400px 220px at 15% 130%, rgba(196, 181, 253, 0.18), transparent 70%);
  pointer-events: none;
}

.topbar::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold-bright) 18%, #f2cf7a 50%, var(--gold-bright) 82%, transparent);
  opacity: 0.9;
  pointer-events: none;
}

.topbar > * {
  position: relative;
}

.brand-wrap {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}

.brand-mark {
  width: 68px;
  height: 68px;
  border: 2px solid rgba(217, 165, 42, 0.55);
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35), 0 0 0 4px rgba(255, 255, 255, 0.06);
}

.brand-block h1,
.panel-heading h2,
.profit-layout h2 {
  margin: 0;
}

.brand-block h1 {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  font-weight: 700;
  line-height: 1.12;
  color: #ffffff;
  letter-spacing: 0.01em;
}

.topbar .eyebrow {
  color: var(--gold-bright);
}

.eyebrow {
  margin: 0 0 4px;
  color: var(--purple);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.top-actions,
.toolbar-actions,
.form-actions,
.fieldset-row,
.panel-heading,
.panel-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
}

.top-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.topbar .button.secondary,
.topbar .button.muted {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.22);
  color: #ffffff;
  backdrop-filter: blur(6px);
}

.topbar .button.secondary:hover,
.topbar .button.muted:hover {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.4);
}

.topbar .button.muted {
  color: rgba(255, 255, 255, 0.75);
}

/* ------------------------------------------------------------
   Buttons
   ------------------------------------------------------------ */

.button,
.icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0 18px;
  color: var(--ink);
  background: var(--panel);
  font-weight: 650;
  font-size: 0.9rem;
  letter-spacing: 0.01em;
  transition: transform 160ms ease, background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease;
}

.button:hover,
.icon-button:hover {
  transform: translateY(-1px);
}

.button:active,
.icon-button:active {
  transform: translateY(0);
}

.button svg,
.icon-button svg,
.tab svg {
  width: 15px;
  height: 15px;
  flex: none;
}

.button.primary {
  background: var(--grad-purple);
  border-color: transparent;
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(109, 40, 217, 0.32);
}

.button.primary:hover {
  box-shadow: 0 12px 26px rgba(109, 40, 217, 0.42);
  filter: brightness(1.05);
}

.button.secondary {
  border-color: var(--line-strong);
  background: #ffffff;
  color: var(--purple-dark);
}

.button.secondary:hover {
  border-color: var(--purple);
  background: var(--purple-soft);
}

.button.muted {
  background: var(--panel-strong);
  border-color: var(--panel-strong);
  color: var(--muted);
}

.button.small {
  min-height: 32px;
  padding: 0 13px;
  font-size: 0.82rem;
}

.icon-button {
  border-color: var(--line-strong);
  color: var(--muted);
  font-size: 0.82rem;
  min-height: 32px;
  padding: 0 13px;
}

.icon-button:hover {
  color: var(--rose);
  border-color: var(--rose);
  background: var(--rose-soft);
}

.file-button {
  display: inline-flex;
  align-items: center;
  position: relative;
}

.file-button input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

/* ------------------------------------------------------------
   Metrics
   ------------------------------------------------------------ */

.metrics-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}

.metric {
  position: relative;
  min-height: 112px;
  padding: 16px 16px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.metric:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.metric::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--grad-purple);
}

.metric:nth-child(2)::before { background: linear-gradient(180deg, #c2325f, #e0608b); }
.metric:nth-child(3)::before { background: linear-gradient(180deg, #1d7a4d, #34a06c); }
.metric:nth-child(4)::before { background: var(--grad-gold); }
.metric:nth-child(5)::before { background: linear-gradient(180deg, #2563b8, #4d8ade); }
.metric:nth-child(6)::before { background: linear-gradient(180deg, #a16207, #d9a52a); }

.metric span {
  display: block;
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.metric strong {
  display: block;
  margin-top: 9px;
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.12;
  color: var(--ink);
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}

.metric::after {
  content: "";
  position: absolute;
  top: -34px;
  right: -34px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.09), transparent 70%);
  pointer-events: none;
}

.metric small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 0.76rem;
}

/* ------------------------------------------------------------
   Layout
   ------------------------------------------------------------ */

.workspace {
  display: grid;
  grid-template-columns: minmax(340px, 430px) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

.entry-panel,
.main-panel {
  border: 1px solid var(--line);
  border-radius: calc(var(--radius) + 4px);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--shadow);
}

.entry-panel {
  position: sticky;
  top: 14px;
  max-height: calc(100vh - 28px);
  overflow: auto;
  padding: 20px;
  scrollbar-width: thin;
  scrollbar-color: var(--lavender) transparent;
}

.panel-heading {
  justify-content: space-between;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.panel-heading h2,
.profit-layout h2 {
  font-family: var(--font-display);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--ink);
}

/* ------------------------------------------------------------
   Forms
   ------------------------------------------------------------ */

fieldset {
  min-width: 0;
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}

legend,
.fieldset-row legend {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 10px;
  color: var(--purple-dark);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

legend::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--line-strong), transparent);
}

.fieldset-row {
  justify-content: space-between;
  margin-bottom: 10px;
}

.fieldset-row legend {
  margin-bottom: 0;
}

.fieldset-row legend::after {
  display: none;
}

.field-grid {
  display: grid;
  gap: 10px;
}

.field-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.field-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 650;
  letter-spacing: 0.02em;
}

input,
select,
textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  background: #ffffff;
  color: var(--ink);
  font-size: 0.92rem;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

select {
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%237b6f8d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M1.5 1.75 6 6.25l4.5-4.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
}

textarea {
  resize: vertical;
}

input[type="date"] {
  cursor: pointer;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.65;
}

input::placeholder {
  color: #b3a9c4;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--violet);
  box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.14);
}

input:hover,
select:hover,
textarea:hover {
  border-color: var(--lavender);
}

.wide-label {
  margin-top: 10px;
}

/* ------------------------------------------------------------
   Item rows
   ------------------------------------------------------------ */

.items-list {
  display: grid;
  gap: 10px;
}

.item-row {
  display: grid;
  grid-template-columns: minmax(0, 2.4fr) minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--violet);
  border-radius: var(--radius-sm);
  background: var(--panel-soft);
  transition: border-color 140ms ease, background 140ms ease;
}

.item-row:hover {
  background: var(--purple-soft);
}

.field-hint {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.45;
}

.item-row .remove-item {
  min-width: 52px;
  padding: 0 6px;
  font-size: 0.72rem;
}

/* ------------------------------------------------------------
   Quick summary
   ------------------------------------------------------------ */

.quick-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0 16px;
}

.quick-summary div {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: linear-gradient(180deg, var(--panel-strong), #ffffff);
  text-align: center;
}

.quick-summary span {
  display: block;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.quick-summary strong {
  display: block;
  margin-top: 5px;
  font-family: var(--font-display);
  font-size: 1.05rem;
  overflow-wrap: anywhere;
}

.form-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

/* ------------------------------------------------------------
   Tabs
   ------------------------------------------------------------ */

.main-panel {
  min-width: 0;
  overflow: hidden;
}

.tabs {
  display: flex;
  gap: 6px;
  min-height: 62px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--panel-soft), #ffffff);
  overflow-x: auto;
}

.tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  min-width: 96px;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0 18px;
  background: transparent;
  color: var(--muted);
  font-weight: 700;
  font-size: 0.9rem;
  white-space: nowrap;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.tab:hover {
  background: var(--purple-soft);
  color: var(--purple-dark);
}

.tab.active {
  background: var(--grad-purple);
  color: #ffffff;
  box-shadow: 0 6px 16px rgba(109, 40, 217, 0.3);
}

.tab-panel {
  display: none;
  padding: 20px;
}

.tab-panel.active {
  display: block;
  animation: panel-in 220ms ease;
}

@keyframes panel-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.panel-toolbar {
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.panel-toolbar label {
  min-width: 170px;
}

.search-field {
  flex: 1 1 240px;
}

/* ------------------------------------------------------------
   Tables
   ------------------------------------------------------------ */

.table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #ffffff;
}

table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

th,
td {
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  font-size: 0.9rem;
}

th {
  position: sticky;
  top: 0;
  background: var(--purple-deep);
  color: #e9defb;
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
}

tbody tr {
  transition: background 120ms ease;
}

tbody tr:nth-child(even) {
  background: rgba(246, 243, 250, 0.55);
}

tbody tr:hover {
  background: var(--purple-soft);
}

td strong {
  font-variant-numeric: tabular-nums;
}

/* Money columns read best right-aligned. */
#ordersPanel th:nth-child(5),
#ordersPanel th:nth-child(6),
#ordersPanel th:nth-child(7),
#ordersPanel td:nth-child(5),
#ordersPanel td:nth-child(6),
#ordersPanel td:nth-child(7),
#clientsPanel th:nth-child(5),
#clientsPanel th:nth-child(6),
#clientsPanel td:nth-child(5),
#clientsPanel td:nth-child(6) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

tbody tr:last-child td {
  border-bottom: 0;
}

td small {
  color: var(--muted);
}

.money-positive {
  color: var(--green);
  font-weight: 750;
}

.money-negative,
.balance-due {
  color: var(--rose);
  font-weight: 750;
}

/* ------------------------------------------------------------
   Status pills
   ------------------------------------------------------------ */

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
  border-radius: 999px;
  padding: 1px 11px;
  background: var(--purple-soft);
  color: var(--purple-dark);
  font-size: 0.74rem;
  font-weight: 750;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.status-pill::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.status-pill.new        { background: var(--blue-soft); color: var(--blue); }
.status-pill.ordered    { background: var(--amber-soft); color: var(--amber); }
.status-pill.in-transit { background: var(--purple-soft); color: var(--purple-dark); }
.status-pill.arrived    { background: var(--gold-soft); color: var(--gold); }
.status-pill.delivered  { background: var(--green-soft); color: var(--green); }
.status-pill.cancelled  { background: var(--rose-soft); color: var(--rose); }

.status-pill.vip,
.status-pill.urgent {
  background: var(--grad-gold);
  color: #ffffff;
}

.status-pill.vip::before,
.status-pill.urgent::before {
  background: #ffffff;
}

/* ------------------------------------------------------------
   Row actions
   ------------------------------------------------------------ */

.row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 210px;
}

.row-actions button {
  min-height: 29px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: #ffffff;
  padding: 0 11px;
  color: var(--ink-soft);
  font-size: 0.76rem;
  font-weight: 700;
  transition: background 130ms ease, color 130ms ease, border-color 130ms ease;
}

.row-actions button:hover {
  background: var(--purple-soft);
  border-color: var(--purple);
  color: var(--purple-dark);
}

.row-actions button[data-action="delete"]:hover {
  background: var(--rose-soft);
  border-color: var(--rose);
  color: var(--rose);
}

.row-actions button[data-action="whatsapp"]:hover {
  background: var(--green-soft);
  border-color: var(--green);
  color: var(--green);
}

.empty-state {
  padding: 40px 32px;
  color: var(--muted);
  text-align: center;
  font-size: 0.92rem;
}

.empty-state::before {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin: 0 auto 14px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--lavender), var(--gold-bright));
  opacity: 0.7;
}

/* ------------------------------------------------------------
   Invoice paper
   ------------------------------------------------------------ */

.invoice-paper {
  position: relative;
  width: min(860px, 100%);
  margin: 0 auto;
  padding: 0 0 36px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #ffffff;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.invoice-paper::before {
  content: "";
  position: absolute;
  inset: 90px 18px 18px;
  background: radial-gradient(circle at center, color-mix(in srgb, var(--brand-accent) 5%, transparent), transparent 65%);
  opacity: 1;
  pointer-events: none;
}

.invoice-paper > * {
  position: relative;
}

.invoice-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  margin-bottom: 6px;
  padding: 30px 36px 24px;
  background: var(--grad-deep);
  color: #ffffff;
  border-bottom: 3px solid var(--gold-bright);
  box-shadow: 0 6px 0 -5px rgba(217, 165, 42, 0.55);
}

.paid-stamp {
  position: absolute;
  top: 182px;
  right: 48px;
  z-index: 2;
  padding: 8px 22px;
  border: 3px solid var(--green);
  border-radius: 10px;
  color: var(--green);
  background: rgba(231, 246, 238, 0.75);
  font-family: var(--font-body);
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.32em;
  text-indent: 0.32em;
  transform: rotate(-9deg);
  opacity: 0.9;
  pointer-events: none;
}

.invoice-brand {
  display: flex;
  gap: 16px;
  align-items: center;
}

.invoice-logo {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 2px solid rgba(217, 165, 42, 0.6);
  object-fit: cover;
}

.invoice-head h2 {
  margin: 0 0 6px;
  font-family: var(--font-display);
  font-size: 1.7rem;
  font-weight: 700;
  color: #ffffff;
}

.invoice-head .invoice-brand div div {
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.88rem;
}

.invoice-meta {
  text-align: right;
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.9rem;
}

.invoice-meta .eyebrow {
  color: var(--gold-bright);
}

.invoice-meta strong {
  display: block;
  margin-bottom: 4px;
  font-family: var(--font-display);
  font-size: 1.35rem;
  color: #ffffff;
}

.invoice-section {
  margin-top: 22px;
  padding: 0 36px;
}

.invoice-section h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  color: var(--purple-dark);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.invoice-section h3::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--line-strong), transparent);
}

.invoice-paper table {
  min-width: 0;
}

.invoice-paper th {
  position: static;
  background: var(--purple-soft);
  color: var(--purple-dark);
}

.invoice-paper .totals-table {
  width: min(380px, 100%);
  margin-left: auto;
}

.totals-table td:first-child {
  color: var(--muted);
}

.totals-table tr.grand-total td {
  border-top: 2px solid var(--purple-deep);
  border-bottom: 2px solid var(--purple-deep);
  background: var(--purple-soft);
  color: var(--purple-deep);
  font-family: var(--font-display);
  font-size: 1.08rem;
  font-weight: 800;
}

.totals-table tr.balance-row td {
  background: var(--gold-soft);
  color: var(--gold);
  font-weight: 800;
}

.invoice-link {
  overflow-wrap: anywhere;
}

/* ------------------------------------------------------------
   P&L
   ------------------------------------------------------------ */

.profit-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.75fr);
  gap: 20px;
  align-items: start;
}

.profit-layout table {
  min-width: 0;
}

.profit-layout td:last-child,
.profit-layout th:last-child {
  text-align: right;
}

.pnl-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.pnl-summary div {
  min-height: 86px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--panel-strong), #ffffff);
  box-shadow: var(--shadow-sm);
}

.pnl-summary span {
  display: block;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.pnl-summary strong {
  display: block;
  margin-top: 8px;
  font-family: var(--font-display);
  font-size: 1.2rem;
  overflow-wrap: anywhere;
}

.chart {
  display: grid;
  gap: 13px;
  margin-top: 12px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel-soft);
}

.chart-row {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr) 96px;
  gap: 10px;
  align-items: center;
  font-size: 0.86rem;
}

.chart-row span {
  color: var(--muted);
  font-weight: 650;
}

.bar-track {
  height: 12px;
  border-radius: 999px;
  background: var(--bg-deep);
  overflow: hidden;
}

.bar {
  height: 100%;
  width: var(--bar-width);
  border-radius: inherit;
  background: var(--grad-purple);
  transition: width 400ms ease;
}

.bar.negative {
  background: linear-gradient(90deg, #c2325f, #e0608b);
}

/* ------------------------------------------------------------
   Settings / toast / misc
   ------------------------------------------------------------ */

.settings-form {
  width: min(820px, 100%);
}

.toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 20;
  max-width: min(420px, calc(100vw - 36px));
  padding: 13px 18px;
  border-radius: var(--radius-sm);
  border-left: 4px solid var(--gold-bright);
  background: var(--purple-deep);
  color: #ffffff;
  font-weight: 600;
  font-size: 0.9rem;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 200ms ease, transform 200ms ease;
  pointer-events: none;
}

.toast.show {
  opacity: 1;
  transform: translateY(0);
}

/* Scrollbars (WebKit) */
::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--lavender);
  border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--violet);
}


@media (max-width: 760px) {
  html { overflow-x: hidden; }
  body { font-size: 14px; }
  .app-shell { width: 100%; max-width: 100%; }
  .topbar { border-radius: 16px; }
  .brand-wrap { min-width: 0; }
  .brand-block h1 { font-size: 1.25rem; overflow-wrap: anywhere; }
  .metrics-grid { gap: 10px; }
  .metric { padding: 14px; }
  .entry-panel, .main-panel { border-radius: 16px; }
  .entry-panel { padding: 15px; }
  .tab-panel { padding: 14px; }
  .tabs { padding: 10px; position: sticky; top: 0; z-index: 10; }
  .tab { min-width: 82px; padding: 0 12px; }
  input, select, textarea, .button { min-height: 44px; }
  .item-row { gap: 8px; padding: 10px; }
  .form-actions { width: 100%; }
  .form-actions .button { flex: 1 1 160px; }
  .table-wrap { -webkit-overflow-scrolling: touch; }
  th, td { padding: 11px 10px; }
}

/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width: 1180px) {
  .metrics-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .workspace {
    grid-template-columns: 1fr;
  }

  .entry-panel {
    position: static;
    max-height: none;
  }
}

@media (max-width: 760px) {
  .app-shell {
    padding: 12px;
  }

  .topbar {
    align-items: stretch;
    flex-direction: column;
    padding: 16px;
  }

  .brand-mark {
    width: 56px;
    height: 56px;
  }

  .top-actions {
    justify-content: flex-start;
  }

  .metrics-grid,
  .quick-summary,
  .pnl-summary,
  .profit-layout,
  .field-grid.two,
  .field-grid.three,
  .invoice-head {
    grid-template-columns: 1fr;
  }

  .item-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .item-row label:nth-child(1),
  .item-row .remove-item {
    grid-column: 1 / -1;
  }

  .invoice-meta {
    text-align: left;
  }

  .invoice-brand {
    align-items: flex-start;
  }

  .invoice-head {
    padding: 20px;
  }

  .invoice-section {
    padding: 0 20px;
  }

  .chart-row {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  .chart-row strong {
    grid-column: 2;
  }
}


/* ------------------------------------------------------------
   Offline badge & card
   ------------------------------------------------------------ */

.local-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(217, 165, 42, 0.45);
  border-radius: 999px;
  background: rgba(217, 165, 42, 0.12);
  color: #f4dfae;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.02em;
  white-space: nowrap;
  backdrop-filter: blur(6px);
}

.local-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--gold-bright);
  box-shadow: 0 0 0 3px rgba(217, 165, 42, 0.2);
}

.offline-card {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold-bright);
  border-radius: var(--radius);
  background: linear-gradient(135deg, var(--gold-soft), #fff 55%);
}
.offline-card-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.offline-card h3 { margin: 0 0 4px; font-family: var(--font-display); font-size: 1.05rem; }
.offline-badge { padding: 5px 11px; border-radius: 999px; background: var(--grad-gold); color: #fff; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.04em; white-space: nowrap; }

.button:focus-visible,
.icon-button:focus-visible,
.tab:focus-visible {
  outline: 3px solid rgba(139, 92, 246, 0.45);
  outline-offset: 2px;
}

@media (max-width: 760px) {
  .top-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .top-actions .button, .local-badge { width: 100%; justify-content: center; }
  .local-badge { grid-column: 1 / -1; }
  .offline-card-head { flex-direction: column; }
  .paid-stamp { top: 205px; right: 14px; font-size: 1.1rem; }
}

/* ------------------------------------------------------------
   UX components: dialog, inline status, FAB, badges
   ------------------------------------------------------------ */

.optional-tag {
  font-weight: 600;
  font-size: 0.66rem;
  letter-spacing: 0.05em;
  color: #a596bd;
  text-transform: uppercase;
}

.tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 21px;
  height: 21px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--grad-gold);
  color: #ffffff;
  font-size: 0.7rem;
  font-weight: 800;
}

.tab.active .tab-count {
  background: rgba(255, 255, 255, 0.24);
}

.tab-count[hidden] {
  display: none;
}

/* Inline status dropdown styled as a colored pill */
.status-inline {
  width: auto;
  min-height: 27px;
  padding: 2px 26px 2px 12px;
  border: 1px solid transparent;
  border-radius: 999px;
  background-color: var(--purple-soft);
  color: var(--purple-dark);
  font-size: 0.76rem;
  font-weight: 750;
  letter-spacing: 0.02em;
  cursor: pointer;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M1.2 1.5 5 5.3l3.8-3.8'/%3E%3C/svg%3E");
  background-position: right 10px center;
  background-repeat: no-repeat;
}

.status-inline:hover { filter: brightness(0.96); border-color: currentColor; }
.status-inline:focus { box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.18); }

.status-inline.new        { background-color: var(--blue-soft); color: var(--blue); }
.status-inline.ordered    { background-color: var(--amber-soft); color: var(--amber); }
.status-inline.in-transit { background-color: var(--purple-soft); color: var(--purple-dark); }
.status-inline.arrived    { background-color: var(--gold-soft); color: var(--gold); }
.status-inline.delivered  { background-color: var(--green-soft); color: var(--green); }
.status-inline.cancelled  { background-color: var(--rose-soft); color: var(--rose); }

.order-row { cursor: pointer; }
.order-row td:first-child { border-left: 3px solid transparent; }
.order-row:hover td:first-child { border-left-color: var(--violet); }

.empty-cta { margin-top: 14px; }

.metric-icon {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 21px;
  height: 21px;
  color: var(--lavender);
  z-index: 1;
}

.backup-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--line-strong);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 650;
}

/* Floating "New invoice" button — phones only */
.fab {
  position: fixed;
  right: 16px;
  bottom: 20px;
  z-index: 15;
  display: none;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  padding: 0 20px;
  border: 0;
  border-radius: 999px;
  background: var(--grad-purple);
  color: #ffffff;
  font-weight: 750;
  font-size: 0.95rem;
  box-shadow: 0 14px 32px rgba(109, 40, 217, 0.45);
}

.fab svg { width: 17px; height: 17px; }
.fab:active { transform: scale(0.97); }

/* Confirmation dialog */
.confirm-dialog {
  width: min(400px, calc(100vw - 40px));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px;
  background: #ffffff;
  color: var(--ink);
  box-shadow: var(--shadow-lg);
}

.confirm-dialog::backdrop {
  background: rgba(36, 23, 51, 0.45);
  backdrop-filter: blur(3px);
}

.confirm-title {
  margin: 0 0 8px;
  font-family: var(--font-display);
  font-size: 1.18rem;
  font-weight: 700;
}

.confirm-message {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.button.primary.danger {
  background: linear-gradient(135deg, #c2325f, #e0608b);
  box-shadow: 0 8px 20px rgba(194, 50, 95, 0.32);
}

.toast::before {
  content: "\2713";
  display: inline-block;
  margin-right: 9px;
  color: var(--gold-bright);
  font-weight: 800;
}

@media (max-width: 1180px) {
  .fab { display: inline-flex; }
}

@media (max-width: 760px) {
  .row-actions { min-width: 0; }
  .toast { bottom: 84px; }
}

/* ------------------------------------------------------------
   Print
   ------------------------------------------------------------ */

@media print {
  body {
    background: #ffffff;
  }

  body * {
    visibility: hidden;
  }

  #invoicePaper,
  #invoicePaper * {
    visibility: visible;
  }

  #invoicePaper {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    margin: 0;
    padding: 0 0 24px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .invoice-head {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* Organized application layout: desktop rail + compact mobile command area */
@media (min-width: 1180px) {
  .main-panel {
    display: grid;
    grid-template-columns: 188px minmax(0, 1fr);
    align-items: start;
    overflow: visible;
    background: var(--panel);
  }

  .main-panel > .tabs {
    grid-column: 1;
    grid-row: 1;
    position: sticky;
    top: 14px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    min-height: 540px;
    padding: 18px 12px;
    border-right: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 18px 0 0 18px;
    background: var(--panel-soft);
    overflow: visible;
  }

  .main-panel > .tabs::before {
    content: "Workspace";
    display: block;
    margin: 2px 10px 10px;
    color: var(--muted);
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
  }

  .main-panel > .tabs .tab {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 0 13px;
    border-radius: 11px;
    font-size: .84rem;
  }

  .main-panel > .tabs .tab svg {
    width: 18px;
    height: 18px;
  }

  .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 24%, transparent);
    background: color-mix(in srgb, var(--brand-accent) 12%, var(--panel));
    color: var(--brand-accent);
    box-shadow: inset 3px 0 0 var(--brand-accent), 0 7px 18px rgba(17, 24, 39, .06);
  }

  .main-panel > .tab-panel {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    min-height: 540px;
    padding: 24px;
  }

  html[data-theme="dark"] .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 45%, #3b414c);
    background: color-mix(in srgb, var(--brand-accent) 22%, #252a33);
    color: #ffffff;
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--brand-accent) 45%, #ffffff);
  }
}

@media (max-width: 760px) {
  .topbar {
    padding: 14px;
  }

  .top-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }

  .top-actions .button,
  .top-actions .file-button {
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    min-height: 54px;
    padding: 7px 5px;
    font-size: .66rem;
    line-height: 1.05;
    white-space: normal;
    text-align: center;
  }

  .top-actions .button svg,
  .top-actions .file-button svg {
    width: 18px;
    height: 18px;
  }

  .top-actions .user-chip {
    grid-column: span 2;
    justify-content: center;
    min-width: 0;
    min-height: 42px;
  }

  #returnAdminBtn,
  #logoutBtn {
    grid-column: span 2;
    min-height: 42px;
    flex-direction: row;
    font-size: .75rem;
  }

  .metrics-grid > .metric {
    transition: transform .18s ease, box-shadow .18s ease;
  }

  .metrics-grid > .metric:active {
    transform: scale(.985);
  }

  .main-panel {
    border-radius: 18px;
  }

  .tab-panel.active {
    animation-duration: 160ms;
  }
}

@media (max-width: 390px) {
  .top-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .theme-toggle-header { grid-column: 1; }
  .top-actions .user-chip { grid-column: 2; }
  #returnAdminBtn,
  #logoutBtn { grid-column: 1 / -1; }

  .top-actions .button,
  .top-actions .file-button {
    flex-direction: row;
    min-height: 44px;
    font-size: .7rem;
  }
}

/* Ashka identity: use the company emblem instead of generated initials. */
.ashka-brand-image {
  display: block;
  object-fit: contain;
  background: #111318;
}

.login-logo.ashka-brand-image {
  width: 72px;
  height: 72px;
  padding: 7px;
  border: 1px solid rgba(202, 160, 76, .38);
  border-radius: 16px;
  box-shadow: 0 12px 28px rgba(17, 19, 24, .18);
}

.brand-mark.ashka-brand-image {
  width: 62px;
  height: 62px;
  padding: 5px;
  border: 1px solid rgba(218, 178, 93, .5);
  border-radius: 15px;
  box-shadow: 0 9px 22px rgba(0, 0, 0, .22);
}

html[data-theme="dark"] .login-logo.ashka-brand-image {
  border-color: rgba(218, 178, 93, .6);
  background: #0e1014;
}

/* Rebalance the Order row after removing Tracking / batch. */
@media (min-width: 761px) {
  .order-form .field-grid.three > label:nth-of-type(5) {
    grid-column: span 2;
  }
}

/* Orders command center: visual upgrade without changing the stable layout. */
.orders-command-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 16px;
  padding: 20px 22px;
  border: 1px solid color-mix(in srgb, var(--brand-accent) 16%, var(--line));
  border-radius: 8px;
  background:
    linear-gradient(110deg, color-mix(in srgb, var(--brand-accent) 9%, var(--panel)) 0%, var(--panel) 68%);
  box-shadow: 0 12px 28px rgba(25, 19, 31, .07);
}

.orders-command-header span {
  display: block;
  margin-bottom: 4px;
  color: var(--brand-accent);
  font-size: .66rem;
  font-weight: 850;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.orders-command-header h2 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 1.35rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.orders-command-header p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: .8rem;
}

.orders-new-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  min-height: 42px;
  padding: 0 17px;
  border: 0;
  border-radius: 7px;
  background: var(--brand-accent);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 9px 20px color-mix(in srgb, var(--brand-accent) 24%, transparent);
}

.orders-new-button svg {
  width: 17px;
  height: 17px;
}

#ordersPanel .panel-toolbar {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

#ordersPanel .table-wrap {
  border-radius: 8px;
  border-color: color-mix(in srgb, var(--brand-accent) 13%, var(--line));
  box-shadow: 0 12px 30px rgba(25, 19, 31, .06);
}

#ordersPanel thead th {
  padding-top: 14px;
  padding-bottom: 14px;
  background: color-mix(in srgb, var(--brand-accent) 6%, var(--panel-soft));
}

#ordersPanel tbody td {
  padding-top: 15px;
  padding-bottom: 15px;
}

#ordersPanel tbody tr {
  transition: background 150ms ease, box-shadow 150ms ease;
}

#ordersPanel tbody tr:hover {
  background: color-mix(in srgb, var(--brand-accent) 5%, var(--panel));
  box-shadow: inset 3px 0 0 var(--brand-accent);
}

#ordersPanel .row-actions button {
  min-height: 31px;
  border-radius: 6px;
  font-size: .72rem;
  font-weight: 750;
}

#ordersPanel .row-actions button[data-action="invoice"] {
  border-color: var(--brand-accent);
  background: var(--brand-accent);
  color: #fff;
}

#ordersPanel .status-inline {
  min-width: 96px;
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 7px;
  font-weight: 800;
}

html[data-theme="dark"] .orders-command-header {
  background: linear-gradient(110deg, color-mix(in srgb, var(--brand-accent) 18%, #22262d), #22262d 72%);
}

@media (max-width: 760px) {
  .orders-command-header {
    align-items: flex-start;
    padding: 16px;
  }
  .orders-command-header p {
    display: none;
  }
  .orders-command-header h2 {
    font-size: 1.08rem;
  }
  .orders-new-button {
    min-height: 40px;
    padding: 0 13px;
    font-size: .76rem;
  }
}

@media (max-width: 390px) {
  .orders-command-header {
    flex-direction: column;
    gap: 13px;
  }
  .orders-new-button {
    width: 100%;
  }
}

/* Final layout authority */
@media (min-width: 1180px) {
  .main-panel {
    display: grid;
    grid-template-columns: 188px minmax(0, 1fr);
    align-items: start;
    overflow: visible;
    background: var(--panel);
  }

  .main-panel > .tabs {
    grid-column: 1;
    grid-row: 1;
    position: sticky;
    top: 14px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    min-height: 540px;
    padding: 18px 12px;
    border-right: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 18px 0 0 18px;
    background: var(--panel-soft);
    overflow: visible;
  }

  .main-panel > .tabs::before {
    content: "Workspace";
    display: block;
    margin: 2px 10px 10px;
    color: var(--muted);
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
  }

  .main-panel > .tabs .tab {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 0 13px;
    border-radius: 11px;
    font-size: .84rem;
  }

  .main-panel > .tabs .tab svg {
    width: 18px;
    height: 18px;
  }

  .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 24%, transparent);
    background: color-mix(in srgb, var(--brand-accent) 12%, var(--panel));
    color: var(--brand-accent);
    box-shadow: inset 3px 0 0 var(--brand-accent), 0 7px 18px rgba(17, 24, 39, .06);
  }

  .main-panel > .tab-panel {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    min-height: 540px;
    padding: 24px;
  }

  html[data-theme="dark"] .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 45%, #3b414c);
    background: color-mix(in srgb, var(--brand-accent) 22%, #252a33);
    color: #ffffff;
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--brand-accent) 45%, #ffffff);
  }
}

@media (max-width: 760px) {
  .top-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }

  .top-actions .button,
  .top-actions .file-button {
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    min-height: 54px;
    padding: 7px 5px;
    font-size: .66rem;
    line-height: 1.05;
    white-space: normal;
    text-align: center;
  }

  .top-actions .user-chip,
  #returnAdminBtn,
  #logoutBtn {
    grid-column: span 2;
  }
}

@media (max-width: 390px) {
  .topbar .top-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  .topbar .top-actions .theme-toggle-header {
    grid-column: 1 !important;
  }

  .topbar .top-actions .user-chip {
    grid-column: 2 / 5 !important;
  }

  .topbar .top-actions #returnAdminBtn,
  .topbar .top-actions #logoutBtn {
    grid-column: 1 / -1 !important;
  }

  .top-actions .button,
  .top-actions .file-button {
    flex-direction: column;
    min-height: 54px;
    font-size: .7rem;
  }
}

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

.topbar .brand-block h1 {
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .18);
}

.topbar .brand-block .eyebrow {
  color: color-mix(in srgb, var(--brand-accent) 22%, #ffffff);
}

.topbar .brand-subtitle {
  color: rgba(255, 255, 255, .72);
}

/* Professional light/dark appearance */
html {
  transition: background-color .2s ease, color .2s ease;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.theme-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.sun-icon {
  display: none;
}

html[data-theme="dark"] .moon-icon {
  display: none;
}

html[data-theme="dark"] .sun-icon {
  display: block;
}

.login-card {
  position: relative;
}

.theme-toggle-login {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid #e3e7ed;
  border-radius: 50%;
  background: #f7f8fa;
  color: #3e4653;
}

.theme-toggle-login:hover {
  background: #eef1f5;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111318;
  --bg-deep: #0c0e12;
  --panel: #1c1f26;
  --panel-soft: #21252d;
  --panel-strong: #272c35;
  --ink: #f2f4f7;
  --ink-soft: #d5dae2;
  --muted: #9ba4b2;
  --line: #343a45;
  --line-strong: #454c59;
  --purple-soft: color-mix(in srgb, var(--brand-accent) 24%, #20232a);
  --gold-soft: #352d1c;
  --green-soft: #16352a;
  --amber-soft: #392d18;
  --blue-soft: #192d47;
  --rose-soft: #3c1f2a;
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .2);
  --shadow: 0 16px 42px rgba(0, 0, 0, .28);
  --shadow-lg: 0 28px 70px rgba(0, 0, 0, .4);
}

html[data-theme="dark"] body {
  background: linear-gradient(180deg, #151820, #0f1116 72%);
  color: var(--ink);
}

html[data-theme="dark"] .login-screen {
  background: linear-gradient(145deg, #111318, #181b23 56%, #0e1015);
}

html[data-theme="dark"] .login-card,
html[data-theme="dark"] .entry-panel,
html[data-theme="dark"] .main-panel,
html[data-theme="dark"] .metric,
html[data-theme="dark"] .offline-card,
html[data-theme="dark"] .admin-user-form,
html[data-theme="dark"] .admin-security-card,
html[data-theme="dark"] .confirm-dialog {
  border-color: var(--line);
  background: var(--panel);
  color: var(--ink);
  box-shadow: var(--shadow);
}

html[data-theme="dark"] .login-card {
  box-shadow: 0 30px 90px rgba(0, 0, 0, .48), 0 0 0 1px rgba(255, 255, 255, .025) inset;
}

html[data-theme="dark"] .theme-toggle-login {
  border-color: var(--line);
  background: var(--panel-strong);
  color: #f7d77a;
}

html[data-theme="dark"] .login-copy,
html[data-theme="dark"] .developer-credit,
html[data-theme="dark"] .app-footer,
html[data-theme="dark"] .field-hint,
html[data-theme="dark"] .invoice-meta,
html[data-theme="dark"] .metric small {
  color: var(--muted);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .order-form input,
html[data-theme="dark"] .order-form select,
html[data-theme="dark"] .order-form textarea {
  border-color: var(--line-strong);
  background: #171a20;
  color: var(--ink);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .025) inset;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .order-form input::placeholder,
html[data-theme="dark"] .order-form textarea::placeholder {
  color: #747e8d;
}

html[data-theme="dark"] .order-form label,
html[data-theme="dark"] label,
html[data-theme="dark"] .panel-toolbar label {
  color: #c6ccd5;
}

html[data-theme="dark"] .order-form fieldset,
html[data-theme="dark"] .pnl-entry-form fieldset,
html[data-theme="dark"] .item-row,
html[data-theme="dark"] .quick-summary,
html[data-theme="dark"] .pnl-mini-summary,
html[data-theme="dark"] .pnl-report-summary,
html[data-theme="dark"] .pnl-mini-summary > div,
html[data-theme="dark"] .pnl-report-summary > div,
html[data-theme="dark"] .quick-summary > div {
  border-color: var(--line);
  background: var(--panel-soft);
  box-shadow: none;
}

html[data-theme="dark"] .order-form .field-hint {
  background: #20242c;
  color: #aeb6c2;
}

html[data-theme="dark"] .order-form .form-actions {
  border-color: var(--line);
  background: rgba(28, 31, 38, .92);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .4);
}

html[data-theme="dark"] .entry-panel .panel-heading,
html[data-theme="dark"] .panel-heading {
  border-color: var(--line);
  background: #181b21;
}

html[data-theme="dark"] .entry-panel .panel-heading h2,
html[data-theme="dark"] .panel-heading h2,
html[data-theme="dark"] .profit-layout h2 {
  color: var(--ink);
}

html[data-theme="dark"] .tabs {
  border-color: var(--line);
  background: #181b21;
}

html[data-theme="dark"] .tab {
  color: #aab2bf;
}

html[data-theme="dark"] .tab:hover {
  background: #252a33;
  color: #ffffff;
}

html[data-theme="dark"] .tab.active {
  background: color-mix(in srgb, var(--brand-accent) 30%, #252932);
  color: #ffffff;
}

html[data-theme="dark"] .table-wrap {
  border-color: var(--line);
  background: var(--panel);
}

html[data-theme="dark"] table,
html[data-theme="dark"] tbody,
html[data-theme="dark"] tr,
html[data-theme="dark"] td {
  color: var(--ink-soft);
  border-color: var(--line);
}

html[data-theme="dark"] th,
html[data-theme="dark"] .invoice-paper th {
  border-color: var(--line);
  background: #252a33;
  color: #b8c0cc;
}

html[data-theme="dark"] tbody tr:hover {
  background: #22262e;
}

html[data-theme="dark"] .invoice-paper {
  border-color: var(--line);
  background: #20242b;
  color: var(--ink);
  box-shadow: var(--shadow);
}

html[data-theme="dark"] .invoice-section,
html[data-theme="dark"] .invoice-developer-credit {
  border-color: var(--line);
}

html[data-theme="dark"] .empty-state {
  color: var(--muted);
}

html[data-theme="dark"] .button.secondary,
html[data-theme="dark"] .button.muted,
html[data-theme="dark"] .icon-button {
  border-color: var(--line-strong);
  background: #252932;
  color: #eef1f5;
}

html[data-theme="dark"] .button.secondary:hover,
html[data-theme="dark"] .button.muted:hover,
html[data-theme="dark"] .icon-button:hover {
  background: #303640;
}

html[data-theme="dark"] .topbar .button.secondary,
html[data-theme="dark"] .topbar .button.muted,
html[data-theme="dark"] .topbar .theme-toggle-header {
  border-color: rgba(255, 255, 255, .16);
  background: rgba(255, 255, 255, .1);
  color: #ffffff;
}

html[data-theme="dark"] .app-footer strong,
html[data-theme="dark"] .developer-credit strong,
html[data-theme="dark"] .invoice-developer-credit strong {
  color: #d4b2f4;
}

@media (max-width: 760px) {
  .theme-toggle-header {
    min-width: 0;
  }

  html[data-theme="dark"] .tabs {
    box-shadow: 0 -10px 28px rgba(0, 0, 0, .34);
  }
}

@media print {
  html[data-theme="dark"] {
    color-scheme: light;
  }

  html[data-theme="dark"] .invoice-paper,
  html[data-theme="dark"] .invoice-paper * {
    background: #ffffff !important;
    color: #111827 !important;
    border-color: #d9dde4 !important;
  }
}

/* ============================================================
   2026 Professional Client Experience Refresh
   ============================================================ */
:root {
  --bg: #f7f6fa;
  --bg-deep: #efedf5;
  --panel: #ffffff;
  --panel-soft: #fbfaff;
  --panel-strong: #f3eff9;
  --ink: #18131f;
  --ink-soft: #382d45;
  --muted: #786f83;
  --line: #ebe7f0;
  --line-strong: #ddd5e7;
  --purple: #6736a6;
  --purple-dark: #4d267d;
  --purple-deep: #301746;
  --purple-soft: #f1ebf8;
  --violet: #8052b7;
  --lavender: #cdbce0;
  --gold: #9a7427;
  --gold-bright: #c8a056;
  --gold-soft: #fbf6eb;
  --grad-purple: linear-gradient(135deg, #5a2d8a 0%, #7744a8 100%);
  --grad-deep: linear-gradient(135deg, #2a143d 0%, #4b256e 100%);
  --shadow-sm: 0 4px 16px rgba(48, 23, 70, .05);
  --shadow: 0 14px 40px rgba(48, 23, 70, .08);
  --shadow-lg: 0 22px 60px rgba(48, 23, 70, .12);
  --radius: 18px;
  --radius-sm: 12px;
}

body {
  background:
    radial-gradient(900px 480px at 8% -10%, rgba(103,54,166,.07), transparent 64%),
    linear-gradient(180deg, #fbfafc 0%, #f5f3f8 100%);
  font-size: 14px;
  color: var(--ink);
}

.app-shell { max-width: 1720px; padding-top: 18px; }

/* Refined brand header */
.topbar {
  min-height: 102px;
  padding: 18px 22px;
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow-sm);
  overflow: visible;
}
.topbar::before {
  inset: 0 auto 0 0;
  width: 6px;
  border-radius: 22px 0 0 22px;
  background: var(--grad-purple);
}
.topbar::after { display: none; }
.brand-wrap { gap: 15px; }
.brand-mark {
  width: 66px; height: 66px;
  border: 1px solid #e3d9ec;
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(48,23,70,.12);
}
.brand-block h1 {
  color: var(--purple-deep);
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2vw, 2rem);
  letter-spacing: -.01em;
}
.topbar .eyebrow { color: var(--purple); }
.brand-subtitle {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: .82rem;
}
.topbar .button.secondary,
.topbar .button.muted {
  background: #fff;
  color: var(--ink-soft);
  border-color: var(--line-strong);
  backdrop-filter: none;
}
.topbar .button.secondary:hover,
.topbar .button.muted:hover {
  background: var(--purple-soft);
  color: var(--purple-dark);
  border-color: #cdbce0;
}
.local-badge {
  border: 1px solid #dcecdf;
  background: #f5fbf7;
  color: #34734e;
  font-weight: 700;
}
.local-dot { box-shadow: 0 0 0 4px rgba(52,115,78,.10); }

/* Premium KPI cards */
.metrics-grid { gap: 12px; }
.metric {
  min-height: 118px;
  padding: 18px;
  border-color: var(--line);
  border-radius: 17px;
  box-shadow: 0 5px 18px rgba(48,23,70,.045);
}
.metric::before {
  inset: auto 18px 0 18px;
  width: auto; height: 3px;
  border-radius: 10px 10px 0 0;
}
.metric::after {
  top: -50px; right: -45px;
  width: 120px; height: 120px;
  background: radial-gradient(circle, rgba(103,54,166,.08), transparent 68%);
}
.metric span { font-size: .66rem; letter-spacing: .12em; }
.metric strong { margin-top: 10px; font-size: 1.55rem; }
.metric-icon { width: 19px; height: 19px; color: #a58aba; }

/* Workspace surfaces */
.workspace { grid-template-columns: minmax(360px, 430px) minmax(0, 1fr); gap: 16px; }
.entry-panel, .main-panel {
  border-color: var(--line);
  border-radius: 20px;
  box-shadow: 0 8px 30px rgba(48,23,70,.055);
}
.entry-panel { padding: 20px; }
.panel-heading {
  margin: -20px -20px 18px;
  padding: 18px 20px;
  background: linear-gradient(135deg, #fbf8ff, #f4eef9);
  border-bottom: 1px solid #e7dfef;
  border-radius: 20px 20px 0 0;
}
.panel-heading h2, .profit-layout h2 { color: var(--purple-deep); }

fieldset {
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid #eee9f3;
  border-radius: 14px;
  background: #fdfcfe;
}
legend, .fieldset-row legend {
  margin-left: -2px;
  padding: 0 5px;
  color: var(--purple-dark);
  font-size: .68rem;
}
legend::after { display: none; }
.fieldset-row { margin-bottom: 9px; }
label { color: #6e6578; font-size: .72rem; font-weight: 700; }
input, select, textarea {
  min-height: 43px;
  border-color: #ded7e6;
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  padding-left: 12px;
  padding-right: 12px;
  box-shadow: inset 0 1px 1px rgba(20,10,30,.015);
}
input:hover, select:hover, textarea:hover { border-color: #c8bad6; }
input:focus, select:focus, textarea:focus {
  border-color: #8052b7;
  box-shadow: 0 0 0 3px rgba(128,82,183,.12);
  outline: none;
}
.field-hint { color: #8a8192; font-size: .7rem; }

.button, .icon-button {
  min-height: 41px;
  border-radius: 11px;
  font-size: .84rem;
  box-shadow: none;
}
.button.primary {
  background: var(--purple-deep);
  box-shadow: 0 8px 20px rgba(48,23,70,.18);
}
.button.primary:hover { background: #452062; box-shadow: 0 10px 24px rgba(48,23,70,.23); filter: none; }
.button.secondary { color: var(--purple-dark); }
.button.small, .icon-button { border-radius: 9px; }

.quick-summary {
  gap: 8px;
  padding: 10px;
  border: 1px solid #e6ddec;
  border-radius: 14px;
  background: linear-gradient(135deg, #f6f1fa, #fcfaff);
}
.quick-summary div { padding: 11px 8px; background: #fff; border-color: #ebe5ef; }
.quick-summary strong { font-family: var(--font-body); font-weight: 800; }

/* Main navigation */
.tabs {
  min-height: 67px;
  padding: 13px 16px;
  gap: 7px;
  background: #fff;
  border-bottom-color: var(--line);
}
.tab {
  min-height: 40px;
  border-radius: 10px;
  color: #73677d;
  font-size: .86rem;
}
.tab:hover { background: #f5f1f8; }
.tab.active {
  background: var(--purple-deep);
  box-shadow: 0 6px 16px rgba(48,23,70,.15);
}
.tab-panel { padding: 22px; }

/* Tables feel like a polished CRM */
.table-wrap {
  border-radius: 14px;
  border-color: #e7e1eb;
  box-shadow: 0 4px 14px rgba(48,23,70,.025);
}
th, td { padding: 13px 14px; }
th {
  background: #f6f2f8;
  color: #66566f;
  border-bottom: 1px solid #ded6e5;
  font-size: .66rem;
  letter-spacing: .11em;
}
tbody tr:nth-child(even) { background: #fdfcfe; }
tbody tr:hover { background: #f5f0f8; }
.order-row td:first-child { border-left-width: 2px; }
.row-actions { gap: 5px; }
.row-actions button {
  border-radius: 8px;
  border-color: #e0d9e6;
  background: #fff;
  font-size: .72rem;
}
.status-inline { border-radius: 8px; font-size: .72rem; }

/* Client-ready invoice */
.invoice-paper {
  width: min(900px, 100%);
  border-radius: 18px;
  border-color: #e8e2eb;
  box-shadow: 0 18px 50px rgba(48,23,70,.10);
}
.invoice-paper::before { opacity: .025; }
.invoice-head {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 31px 38px 28px;
  background: #fff;
  color: var(--ink);
  border-bottom: 1px solid #e9e3ed;
  box-shadow: none;
}
.invoice-head::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 6px;
  background: var(--grad-purple);
}
.invoice-logo {
  width: 78px; height: 78px;
  border-radius: 15px;
  border: 1px solid #e4dce9;
  box-shadow: 0 7px 20px rgba(48,23,70,.10);
}
.invoice-head h2 { color: var(--purple-deep); font-size: 1.8rem; }
.invoice-head .invoice-brand div div { color: #776d80; }
.invoice-meta { color: #776d80; }
.invoice-meta .eyebrow { color: var(--purple); }
.invoice-meta strong { color: var(--purple-deep); font-size: 1.45rem; }
.invoice-section { margin-top: 24px; padding: 0 38px; }
.invoice-section h3 { color: #6b4c7a; font-size: .68rem; }
.invoice-section h3::after { background: #e6deea; }
.invoice-paper th { background: #f4eff7; color: #674c73; }
.invoice-paper .table-wrap { box-shadow: none; }
.totals-table tr.grand-total td {
  border-top-color: #66408a;
  border-bottom-color: #66408a;
  background: #f5eff9;
  color: #40205b;
  font-family: var(--font-body);
}
.totals-table tr.balance-row td { background: #fbf5e8; color: #805e1e; }
.paid-stamp { top: 168px; border-radius: 8px; }

/* Floating action */
.fab {
  border-radius: 13px;
  background: var(--purple-deep);
  box-shadow: 0 12px 28px rgba(48,23,70,.26);
}

@media (max-width: 900px) {
  .brand-subtitle { display: none; }
}

@media print {
  .invoice-head { background: #fff !important; color: #18131f !important; }
  .invoice-head h2, .invoice-meta strong { color: #301746 !important; }
  .invoice-head .invoice-brand div div, .invoice-meta { color: #665d6d !important; }
  .invoice-head::before { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}


/* ============================================================
   White-label authentication & Super Admin
   ============================================================ */
[hidden] { display: none !important; }

body {
  background:
    radial-gradient(900px 500px at 90% -120px, color-mix(in srgb, var(--brand-accent) 12%, transparent), transparent 65%),
    linear-gradient(180deg, #f8f9fc, #f3f5f9);
}

.topbar {
  background: linear-gradient(135deg, #111827 0%, #1f2937 64%, color-mix(in srgb, var(--brand-accent) 70%, #111827) 100%);
}

.brand-mark.brand-initials {
  display: grid;
  place-items: center;
  width: 62px;
  height: 62px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.12);
  color: #fff;
  font: 800 1.05rem/1 var(--font-body);
  letter-spacing: .08em;
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
}

.user-chip {
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.09);
  color:#fff;
  font-size:.8rem;
  font-weight:750;
}

.button.primary {
  background: var(--brand-accent);
  border-color: var(--brand-accent);
}

.tab.active {
  color: var(--brand-accent);
  border-color: color-mix(in srgb, var(--brand-accent) 30%, #dbe1ea);
  background: color-mix(in srgb, var(--brand-accent) 8%, white);
}

.login-screen {
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(900px 500px at 85% 0%, rgba(109,40,217,.13), transparent 65%),
    radial-gradient(700px 450px at 0% 100%, rgba(17,24,39,.08), transparent 65%),
    #f6f7fb;
}

.login-card {
  width:min(440px,100%);
  padding:38px;
  border:1px solid #e5e7eb;
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 28px 80px rgba(17,24,39,.13);
}

.login-logo {
  width:58px;height:58px;display:grid;place-items:center;
  border-radius:16px;background:#111827;color:white;
  font-weight:850;letter-spacing:.08em;margin-bottom:22px;
}

.login-card h1 { margin:0 0 8px; font-size:2rem; letter-spacing:-.035em; }
.login-copy { color:#6b7280; margin:0 0 26px; }
.login-form { display:grid; gap:16px; }
.login-form label { display:grid; gap:7px; font-weight:700; color:#374151; }
.login-form input { min-height:48px; border-radius:12px; border:1px solid #d7dce5; padding:0 14px; background:white; }
.login-form input:focus { outline:3px solid rgba(109,40,217,.12); border-color:#8b5cf6; }
.login-button { min-height:48px; margin-top:2px; }
.login-error { margin:0; padding:10px 12px; border-radius:10px; background:#fff1f2; color:#be123c; font-size:.86rem; }
.login-foot { margin:24px 0 0; padding-top:20px; border-top:1px solid #eef0f4; color:#9ca3af; text-align:center; font-size:.78rem; }

.admin-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:22px; }
.admin-head h2 { margin:0; font-size:1.7rem; }
.admin-kpis { display:flex; gap:10px; flex-wrap:wrap; }
.admin-kpis > div { min-width:92px; padding:12px 14px; border:1px solid var(--line); border-radius:13px; background:#fff; display:grid; gap:2px; }
.admin-kpis strong { font-size:1.25rem; }
.admin-kpis span { color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; font-weight:800; }
.admin-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr); gap:18px; margin-bottom:20px; }
.admin-user-form,.admin-security-card { padding:20px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:var(--shadow-sm); }
.admin-user-form h3,.admin-security-card h3 { margin:0 0 16px; }
.admin-security-card form { display:grid; gap:14px; }
.admin-security-card label { display:grid; gap:7px; }
.admin-toolbar { margin-top:6px; }
.account-status { display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border-radius:999px; font-size:.72rem; font-weight:800; }
.account-status.active { background:#e8f7ef; color:#147a4a; }
.account-status.suspended,.account-status.expired { background:#fff0f2; color:#b42348; }
.row-actions { display:flex; flex-wrap:wrap; gap:6px; min-width:300px; }
.button.danger { background:#fff; color:#b42348; border-color:#f3c6d0; }
.button.danger:hover { background:#fff1f3; }
input[type="color"] { min-height:42px; padding:4px; }

@media (max-width: 900px) {
  .admin-grid { grid-template-columns:1fr; }
  .admin-head { flex-direction:column; }
}

.invoice-logo-text { display:grid; place-items:center; background:#111827; color:#fff; font-weight:850; letter-spacing:.08em; }

/* ============================================================
   Online + Mobile edition
   ============================================================ */
html { -webkit-text-size-adjust: 100%; }
body { min-height: 100dvh; }
.cloud-card { border-left-color: var(--green); background: linear-gradient(135deg, #edf9f3, #fff 58%); }

/* Luxury refinement layer */
body {
  background:
    linear-gradient(180deg, rgba(250, 247, 253, 0.96), rgba(245, 239, 250, 0.99)),
    var(--bg);
}

.topbar {
  border: 1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(135deg, #1b1028 0%, #351653 46%, #6d28d9 100%);
}

.topbar::after {
  opacity: .22;
}

.entry-panel,
.main-panel,
fieldset,
.metric,
.offline-card,
.admin-user-form,
.admin-security-card {
  border-color: rgba(94, 55, 132, .14);
  box-shadow: 0 18px 50px rgba(41, 16, 69, .10);
}

fieldset {
  background:
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(252,249,255,.96));
}

legend,
.fieldset-row legend {
  color: #321448;
}

input,
select,
textarea {
  background: linear-gradient(180deg, #ffffff, #fdfbff);
  border-color: #e4d9ef;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--purple);
  outline: 4px solid rgba(109, 40, 217, .12);
  box-shadow: 0 0 0 1px rgba(109, 40, 217, .14), inset 0 1px 0 rgba(255,255,255,.9);
}

.button.primary {
  background: linear-gradient(135deg, #321448, #6d28d9 72%, #9b7af2);
  box-shadow: 0 12px 26px rgba(109, 40, 217, .24);
}

.button.secondary {
  background: linear-gradient(180deg, #ffffff, #fbf8ff);
}

.tabs {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,247,253,.94));
}

.tab.active {
  background: linear-gradient(135deg, #321448, #6d28d9);
  box-shadow: 0 10px 22px rgba(109, 40, 217, .18);
}

.metric {
  background:
    linear-gradient(180deg, rgba(255,255,255,.99), rgba(250,247,253,.96));
}

.metric strong,
.pnl-mini-summary strong,
.pnl-report-summary strong {
  font-variant-numeric: tabular-nums;
}

.pnl-mini-summary,
.pnl-report-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.pnl-mini-summary div,
.pnl-report-summary div {
  min-height: 78px;
  padding: 13px 12px;
  border: 1px solid #e8dfef;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff, #fbf8ff);
  box-shadow: 0 8px 20px rgba(59, 20, 102, .06);
}

.pnl-mini-summary span,
.pnl-report-summary span {
  display: block;
  color: #81728d;
  font-size: .67rem;
  font-weight: 850;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.pnl-mini-summary strong,
.pnl-report-summary strong {
  display: block;
  margin-top: 8px;
  color: #2b163d;
  font-size: 1.05rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.pnl-report-summary small {
  display: block;
  margin-top: 5px;
  color: #8a8192;
  font-size: .72rem;
}

.money-neutral {
  color: #70657a !important;
  font-weight: 850;
}

.pnl-mini-summary .money-positive,
.pnl-report-summary .money-positive,
td.money-positive {
  color: var(--green) !important;
}

.pnl-mini-summary .money-negative,
.pnl-report-summary .money-negative,
td.money-negative {
  color: var(--rose) !important;
}

#pnlReportPanel .table-wrap table {
  min-width: 1180px;
}

#pnlReportPanel .invoice-link {
  color: var(--purple);
  font-weight: 760;
  text-decoration: none;
}

#pnlReportPanel .invoice-link:hover {
  text-decoration: underline;
}

.report-title-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 16px;
}

.report-title-row h2 {
  margin: 0;
  color: var(--purple-deep);
  font-family: var(--font-display);
  font-size: 1.65rem;
}

.pnl-entry-form fieldset {
  margin-bottom: 18px;
}

.pnl-print-summary {
  display: none;
  margin: 14px 0;
  padding: 14px 16px;
  border: 1px solid #e8dfef;
  border-radius: 14px;
  background: #fff;
}

.pnl-print-summary h2 {
  margin: 0 0 4px;
  color: var(--purple-deep);
  font-size: 1.35rem;
}

.pnl-print-summary p {
  margin: 0;
  color: #62586d;
  font-weight: 750;
}

.print-report-head {
  margin-bottom: 8px;
}

body.printing-pnl * {
  visibility: hidden;
}

body.printing-pnl #pnlReportPrintArea,
body.printing-pnl #pnlReportPrintArea * {
  visibility: visible;
}

body.printing-pnl #pnlReportPrintArea {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  padding: 18px;
  background: #fff;
}

body.printing-pnl .print-hide {
  display: none !important;
}

body.printing-pnl .pnl-print-summary {
  display: block;
}

body.printing-pnl .pnl-report-summary {
  break-inside: avoid;
}

body.printing-pnl #pnlReportPanel .table-wrap table {
  min-width: 0;
}

@media (max-width: 760px) {
  .pnl-mini-summary,
  .pnl-report-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-title-row {
    flex-direction: column;
  }
}

/* White-label neutralization: premium styling follows each account accent. */
:root {
  --purple: var(--brand-accent);
  --purple-dark: color-mix(in srgb, var(--brand-accent) 82%, #000);
  --purple-deep: color-mix(in srgb, var(--brand-accent) 70%, #000);
  --purple-soft: color-mix(in srgb, var(--brand-accent) 9%, #fff);
  --grad-purple: linear-gradient(135deg, color-mix(in srgb, var(--brand-accent) 84%, #000), var(--brand-accent));
  --grad-deep: linear-gradient(135deg, #111827 0%, color-mix(in srgb, var(--brand-accent) 68%, #111827) 100%);
}
.cloud-badge { background: linear-gradient(135deg, #1d7a4d, #299963); }
body.save-error::after {
  content: attr(data-sync-message);
  position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%);
  z-index: 120; padding: 9px 14px; border-radius: 999px;
  background: #991b1b; color: #fff; font-size: .78rem; font-weight: 800;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}

@media (max-width: 760px) {
  body { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }
  .app-shell { padding: 8px 10px 24px; }
  .topbar { margin-bottom: 12px; padding: 14px; gap: 14px; }
  .brand-wrap { gap: 11px; }
  .brand-mark { width: 48px; height: 48px; border-radius: 14px; flex: 0 0 auto; }
  .brand-block h1 { font-size: 1.18rem; }
  .brand-subtitle { font-size: .78rem; line-height: 1.35; margin-top: 3px; }
  .top-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; gap: 8px; }
  .top-actions .button, .top-actions .file-button { min-width: 0; width: 100%; min-height: 42px; padding-inline: 9px; font-size: .78rem; }
  .top-actions .user-chip { grid-column: 1 / -1; justify-self: stretch; text-align: center; }
  #returnAdminBtn { grid-column: 1 / -1; }
  #logoutBtn { grid-column: 1 / -1; }

  .metrics-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .metric { min-width: 0; }
  .metric strong { font-size: 1.22rem; overflow-wrap: anywhere; }

  .workspace { display: block; }
  .entry-panel, .main-panel { width: 100%; min-width: 0; }
  .entry-panel { margin-bottom: 14px; }
  .panel-heading { align-items: flex-start; }
  fieldset { padding: 13px; }
  .field-grid.two, .field-grid.three { grid-template-columns: 1fr; }
  input, select, textarea { width: 100%; max-width: 100%; font-size: 16px; }
  textarea { resize: vertical; }

  .tabs {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    z-index: 95; display: flex; gap: 6px; width: 100%;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    border-radius: 0; border-top: 1px solid var(--line);
    background: rgba(255,255,255,.97); box-shadow: 0 -8px 30px rgba(24,16,42,.12);
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
  }
  .tabs::-webkit-scrollbar { display:none; }
  .tab { flex: 0 0 auto; min-width: 82px; height: 46px; padding: 0 10px; font-size: .72rem; border-radius: 12px; }
  .tab svg { width: 17px; height: 17px; }

  .fab { right: 12px; bottom: calc(70px + env(safe-area-inset-bottom)); min-height: 48px; padding: 0 15px; z-index: 94; }
  body.save-error::after { bottom: calc(132px + env(safe-area-inset-bottom)); max-width: calc(100vw - 24px); text-align:center; }

  .table-wrap { width: 100%; max-width: 100%; overflow-x: auto; border-radius: 12px; }
  .table-wrap table { min-width: 720px; }
  .admin-toolbar { align-items: stretch; }
  .admin-toolbar .search-field { width: 100%; }
  .row-actions { min-width: 260px; }
  .admin-user-form, .admin-security-card { padding: 15px; }
  .admin-kpis { width:100%; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  .admin-kpis > div { min-width:0; padding:10px; }

  .invoice-paper { border-radius: 14px; }
  .invoice-head, .invoice-section { padding-left: 15px; padding-right: 15px; }
  .invoice-paper table { min-width: 620px; }
  .invoice-paper .table-wrap { margin-inline: 0; }

  .login-screen { min-height: 100dvh; padding: max(16px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom)); align-items:center; }
  .login-card { padding: 24px 20px; border-radius: 20px; }
  .login-logo { width: 52px; height: 52px; margin-bottom: 17px; }
  .login-card h1 { font-size: 1.65rem; }
  .login-copy { margin-bottom: 20px; }
}

@media (max-width: 390px) {
  .metrics-grid { grid-template-columns: 1fr; }
  .item-row { grid-template-columns: 1fr; }
  .item-row > * { grid-column: 1 !important; }
  .admin-kpis { grid-template-columns: 1fr; }
}

/* Premium white-label finish: uses the active account accent without hardcoding a brand. */
.topbar,
.entry-panel,
.main-panel,
.invoice-paper,
.login-card,
.admin-user-form,
.admin-security-card {
  box-shadow:
    0 18px 54px rgba(17, 24, 39, .10),
    0 1px 0 rgba(255, 255, 255, .88) inset;
}

.entry-panel,
.main-panel {
  border-color: color-mix(in srgb, var(--brand-accent) 13%, var(--line));
}

fieldset,
.pnl-entry-form fieldset {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .88));
  border-color: color-mix(in srgb, var(--brand-accent) 12%, var(--line));
}

input:focus,
select:focus,
textarea:focus {
  border-color: color-mix(in srgb, var(--brand-accent) 72%, #fff);
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--brand-accent) 14%, transparent),
    0 10px 24px rgba(17, 24, 39, .07);
}

.button.primary {
  box-shadow:
    0 13px 28px color-mix(in srgb, var(--brand-accent) 28%, transparent),
    0 1px 0 rgba(255, 255, 255, .22) inset;
}

.button.primary:hover {
  transform: translateY(-1px);
  filter: saturate(1.08);
}

thead th {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--brand-accent) 10%, #fff), #fff);
  border-bottom: 1px solid color-mix(in srgb, var(--brand-accent) 18%, var(--line));
}

tbody tr:hover {
  background: color-mix(in srgb, var(--brand-accent) 5%, #fff);
}

.pnl-report-summary > div,
.pnl-mini-summary > div,
.metric {
  border-color: color-mix(in srgb, var(--brand-accent) 13%, var(--line));
  box-shadow: 0 12px 28px rgba(17, 24, 39, .06);
}

/* Mobile luxury invoice form polish. Kept white-label through --brand-accent. */
.entry-panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(255, 255, 255, .94));
  border-color: rgba(213, 200, 232, .9);
}

.entry-panel .panel-heading {
  margin: -2px -2px 18px;
  padding: 2px 2px 15px;
}

.entry-panel .panel-heading h2 {
  letter-spacing: 0;
}

.entry-panel .icon-button {
  min-width: 48px;
  border-color: rgba(213, 200, 232, .95);
  background: #fff;
  color: var(--purple-dark);
  box-shadow: 0 8px 18px rgba(46, 16, 82, .06);
}

.order-form fieldset {
  position: relative;
  padding: 16px;
  border: 1px solid rgba(213, 200, 232, .9);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(250, 248, 253, .92));
  box-shadow:
    0 12px 30px rgba(46, 16, 82, .055),
    0 1px 0 rgba(255, 255, 255, .9) inset;
}

.order-form fieldset::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  border-radius: 16px 0 0 16px;
  background: linear-gradient(180deg, var(--brand-accent), var(--gold-bright));
  opacity: .78;
}

.order-form legend,
.order-form .fieldset-row legend {
  margin-bottom: 12px;
  color: var(--brand-accent);
  font-size: .72rem;
  letter-spacing: .15em;
}

.order-form label {
  color: #625872;
  font-size: .74rem;
  font-weight: 760;
}

.order-form input,
.order-form select,
.order-form textarea {
  min-height: 44px;
  border-color: #d8cde8;
  background:
    linear-gradient(180deg, #ffffff, #fefcff);
  color: #22172f;
  font-weight: 650;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset;
}

.order-form textarea {
  min-height: 72px;
}

.order-form input::placeholder,
.order-form textarea::placeholder {
  color: #aa9abb;
  font-weight: 650;
}

.order-form .field-hint {
  padding: 9px 10px;
  border-radius: 12px;
  background: rgba(246, 243, 250, .74);
  color: #6c617b;
  font-size: .74rem;
}

.quick-summary {
  padding: 8px;
  border: 1px solid rgba(213, 200, 232, .9);
  border-radius: 18px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 16px 35px rgba(46, 16, 82, .06);
}

.quick-summary div {
  border-color: rgba(213, 200, 232, .78);
  background:
    linear-gradient(180deg, #fff, rgba(250, 248, 253, .94));
}

.quick-summary strong {
  color: var(--brand-accent);
}

.order-form .form-actions {
  position: sticky;
  bottom: 8px;
  z-index: 20;
  padding: 10px;
  border: 1px solid rgba(213, 200, 232, .78);
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 18px 42px rgba(46, 16, 82, .16);
  backdrop-filter: blur(12px);
}

body {
  min-height: 100vh;
}

@media (max-width: 760px) {
  .app-shell {
    padding-inline: 10px;
  }

  .workspace {
    gap: 14px;
  }

  .entry-panel {
    padding: 14px 12px 16px;
    border-radius: 18px;
  }

  .entry-panel .panel-heading {
    margin-bottom: 14px;
  }

  .entry-panel .panel-heading h2 {
    font-size: 1.22rem;
  }

  .order-form fieldset {
    margin-bottom: 13px;
    padding: 14px 12px;
    border-radius: 15px;
  }

  .field-grid.two,
  .field-grid.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .field-grid.three label:nth-child(5),
  .field-grid.three label:nth-child(6),
  .wide-label {
    grid-column: 1 / -1;
  }

  .order-form input,
  .order-form select,
  .order-form textarea {
    min-height: 46px;
    padding-inline: 10px;
    font-size: 16px;
  }

  .item-row {
    grid-template-columns: 1fr 92px 1fr;
    gap: 9px;
    padding: 11px;
    border-radius: 14px;
  }

  .item-row label:first-child {
    grid-column: 1 / -1;
  }

  .item-row .remove-item {
    grid-column: auto !important;
    min-width: 44px;
  }

  .quick-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin: 12px 0;
    padding: 6px;
  }

  .quick-summary div {
    padding: 9px 6px;
  }

  .quick-summary span {
    font-size: .58rem;
    letter-spacing: .06em;
  }

  .quick-summary strong {
    font-size: .92rem;
  }

  .order-form .form-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .order-form .form-actions .button {
    width: 100%;
    min-width: 0;
    padding-inline: 8px;
    font-size: .78rem;
    white-space: normal;
    line-height: 1.15;
  }
}

/* Ashka Developments refinement layer */
.login-card {
  width: min(430px, calc(100vw - 30px));
  padding: 34px;
  border: 1px solid rgba(17, 24, 39, .09);
  border-radius: 22px;
  box-shadow: 0 28px 80px rgba(17, 24, 39, .12), 0 2px 8px rgba(17, 24, 39, .05);
}

.login-logo {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  box-shadow: 0 12px 26px color-mix(in srgb, var(--brand-accent) 24%, transparent);
}

.login-card h1 {
  margin-top: 6px;
  font-size: 2rem;
}

.login-copy {
  max-width: 34ch;
  color: #677184;
  line-height: 1.55;
}

.login-form input {
  min-height: 50px;
  border-radius: 12px;
  background: #fbfcfe;
}

.login-button {
  min-height: 50px;
  border-radius: 12px;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--brand-accent) 24%, transparent);
}

.login-trust {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  color: #667085;
  font-size: .77rem;
  font-weight: 700;
}

.trust-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22a06b;
  box-shadow: 0 0 0 4px rgba(34, 160, 107, .12);
}

.developer-credit {
  margin: 12px 0 0;
  color: #98a2b3;
  font-size: .72rem;
}

.developer-credit strong,
.app-footer strong,
.invoice-developer-credit strong {
  color: var(--brand-accent);
  font-weight: 800;
}

.topbar {
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 18px 46px rgba(17, 24, 39, .16);
}

.brand-mark {
  box-shadow: 0 12px 28px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .18);
}

.metrics-grid > *,
.entry-panel,
.content-panel,
.settings-card,
.admin-card {
  border-color: color-mix(in srgb, var(--brand-accent) 10%, #dfe3ea);
  box-shadow: 0 16px 38px rgba(17, 24, 39, .07);
}

.metrics-grid > * {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

@media (hover: hover) {
  .metrics-grid > *:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--brand-accent) 24%, #dfe3ea);
    box-shadow: 0 20px 42px rgba(17, 24, 39, .1);
  }
}

input:focus,
select:focus,
textarea:focus,
button:focus-visible,
.button:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--brand-accent) 20%, transparent);
  outline-offset: 2px;
}

.app-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 24px 0 90px;
  padding: 16px;
  color: #7a8393;
  font-size: .76rem;
  text-align: center;
}

.footer-separator {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #c2c8d0;
}

.invoice-developer-credit {
  margin-top: 26px;
  padding-top: 14px;
  border-top: 1px solid #e6e8ed;
  color: #8b93a1;
  font-size: .7rem;
  text-align: center;
}

@media (max-width: 760px) {
  .login-screen {
    padding: 16px;
    align-items: center;
  }

  .login-card {
    padding: 26px 22px;
    border-radius: 20px;
  }

  .login-card h1 {
    font-size: 1.75rem;
  }

  .topbar {
    padding: 16px 14px;
    border-radius: 18px;
  }

  .brand-wrap {
    align-items: center;
  }

  .top-actions {
    gap: 8px;
  }

  .top-actions .button,
  .top-actions .file-button {
    min-height: 44px;
    padding: 9px 10px;
    border-radius: 11px;
    font-size: .78rem;
  }

  .top-actions .button svg,
  .top-actions .file-button svg {
    width: 17px;
    height: 17px;
  }

  .user-chip {
    min-height: 42px;
    padding: 10px 14px;
    border-radius: 12px;
  }

  .metrics-grid {
    gap: 10px;
  }

  .metrics-grid > * {
    min-height: 142px;
    padding: 17px 15px;
    border-radius: 17px;
  }

  .app-footer {
    flex-direction: column;
    gap: 6px;
    margin-top: 16px;
    padding-bottom: 24px;
  }

  .footer-separator {
    display: none;
  }
}

@media print {
  .app-footer {
    display: none !important;
  }

  .invoice-developer-credit {
    display: block !important;
  }
}

/* APPLICATION_LAYOUT_FINAL */
@media (min-width: 1180px) {
  .main-panel {
    display: grid;
    grid-template-columns: 188px minmax(0, 1fr);
    align-items: start;
    overflow: visible;
    background: var(--panel);
  }
  .main-panel > .tabs {
    grid-column: 1;
    grid-row: 1;
    position: sticky;
    top: 14px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    min-height: 540px;
    padding: 18px 12px;
    border-right: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 18px 0 0 18px;
    background: var(--panel-soft);
    overflow: visible;
  }
  .main-panel > .tabs::before {
    content: "Workspace";
    display: block;
    margin: 2px 10px 10px;
    color: var(--muted);
    font-size: .65rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
  }
  .main-panel > .tabs .tab {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 0 13px;
    border-radius: 11px;
    font-size: .84rem;
  }
  .main-panel > .tabs .tab svg { width: 18px; height: 18px; }
  .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 24%, transparent);
    background: color-mix(in srgb, var(--brand-accent) 12%, var(--panel));
    color: var(--brand-accent);
    box-shadow: inset 3px 0 0 var(--brand-accent), 0 7px 18px rgba(17, 24, 39, .06);
  }
  .main-panel > .tab-panel {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    min-height: 540px;
    padding: 24px;
  }
  html[data-theme="dark"] .main-panel > .tabs .tab.active {
    border-color: color-mix(in srgb, var(--brand-accent) 45%, #3b414c);
    background: color-mix(in srgb, var(--brand-accent) 22%, #252a33);
    color: #fff;
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--brand-accent) 45%, #fff);
  }
}

@media (max-width: 760px) {
  .top-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
  }
  .top-actions .button,
  .top-actions .file-button {
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    min-height: 54px;
    padding: 7px 5px;
    font-size: .66rem;
    line-height: 1.05;
    white-space: normal;
    text-align: center;
  }
  .theme-toggle-header { grid-column: 1; }
  .top-actions .user-chip { grid-column: 2 / 5; }
  #returnAdminBtn,
  #logoutBtn { grid-column: 1 / -1; }

  .metric > span {
    max-width: calc(100% - 27px);
    padding-right: 2px;
    line-height: 1.25;
  }
}

@media (max-width: 390px) {
  .top-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .top-actions .button,
  .top-actions .file-button {
    flex-direction: row;
    min-height: 44px;
    font-size: .7rem;
  }

  .field-grid.two,
  .field-grid.three {
    grid-template-columns: 1fr;
  }

  .field-grid.three label:nth-child(5),
  .field-grid.three label:nth-child(6) {
    grid-column: auto;
  }

  .quick-summary {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Ashka Desk V3 — Frontend-only safe refresh (2026-09-25)
   No database/API changes. Quantity remains display-only and
   DOES NOT multiply the Cost field.
   ============================================================ */

.dashboard-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin: 4px 0 14px;
  padding: 4px 2px;
}
.dashboard-intro h2 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  color: var(--ink);
}
.dashboard-intro p:not(.eyebrow) {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: .92rem;
}
.dashboard-new-button {
  appearance: none;
  border: 0;
  border-radius: 12px;
  min-height: 42px;
  padding: 0 17px;
  background: var(--brand-accent);
  color: #fff;
  font: inherit;
  font-weight: 750;
  box-shadow: 0 8px 20px rgba(17,24,39,.16);
}
.dashboard-new-button:hover { transform: translateY(-1px); }

.metrics-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.metric {
  min-height: 132px;
  padding: 17px 17px 15px;
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(36,23,51,.055);
  overflow: hidden;
}
.metric::before { width: 4px; }
.metric::after { display: none; }
.metric-topline {
  display: flex;
  align-items: center;
  gap: 8px;
}
.metric-topline .metric-icon {
  width: 17px;
  height: 17px;
  margin: 0;
  color: var(--muted);
}
.metric-topline span {
  margin: 0;
  font-size: .67rem;
  letter-spacing: .105em;
}
.metric strong {
  display: block;
  margin-top: 14px;
  font-size: clamp(1.28rem, 1.8vw, 1.7rem);
  letter-spacing: -.03em;
}
.metric small { margin-top: 5px; }
.metric-balance strong { color: #a34a1b; }
.metric-profit strong { color: var(--green); }
.metric-collected strong { color: #2563b8; }

.workspace {
  gap: 18px;
}
.entry-panel,
.main-panel {
  border-radius: 18px;
  border: 1px solid var(--line);
  box-shadow: 0 12px 36px rgba(36,23,51,.065);
}
.entry-panel {
  position: sticky;
  top: 12px;
  align-self: start;
}
.panel-heading {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.order-form fieldset {
  border-radius: 13px;
  border: 1px solid var(--line);
  background: var(--panel-soft);
}
.order-form legend {
  color: var(--ink-soft);
  letter-spacing: .035em;
}
input, select, textarea {
  border-radius: 10px;
}
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: rgba(17,24,39,.35);
  box-shadow: 0 0 0 3px rgba(17,24,39,.07);
}
.tabs {
  padding: 6px;
  background: var(--panel-soft);
  border: 1px solid var(--line);
  border-radius: 14px;
  gap: 4px;
}
.tab {
  border-radius: 10px;
  min-height: 42px;
}
.tab.active {
  background: var(--panel);
  box-shadow: 0 4px 14px rgba(36,23,51,.08);
}
.orders-command-header {
  border-radius: 16px;
}
.table-wrap {
  border-radius: 13px;
  border: 1px solid var(--line);
}
table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
}

/* Cleaner invoice — no change to calculations */
.invoice-paper {
  border: 1px solid #e9e4ec;
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(36,23,51,.10);
  overflow: hidden;
}
.invoice-head {
  background: #fff;
  border-bottom: 1px solid #eee8f1;
  padding-top: 34px;
  padding-bottom: 28px;
}
.invoice-head::before {
  height: 5px;
  background: var(--brand-accent);
}
.invoice-logo {
  border-radius: 12px;
}
.invoice-meta {
  border-left: 1px solid #eee8f1;
  padding-left: 24px;
}
.invoice-section {
  margin-top: 22px;
}
.invoice-paper th {
  background: #f7f6f8;
  color: #5b5263;
  font-size: .72rem;
  letter-spacing: .06em;
}
.invoice-paper td {
  padding-top: 12px;
  padding-bottom: 12px;
}
.invoice-paper .totals-table {
  margin-left: auto;
  width: min(430px, 100%);
}
.invoice-paper .grand-total td,
.invoice-paper .balance-row td {
  font-size: 1.04rem;
}

@media (max-width: 1420px) {
  .metrics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .dashboard-intro { align-items: stretch; flex-direction: column; }
  .dashboard-new-button { width: 100%; }
  .metrics-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .metric { min-height: 118px; padding: 14px; }
  .entry-panel { position: static; }
  .invoice-meta { border-left: 0; padding-left: 0; }
}
@media (max-width: 420px) {
  .metrics-grid { grid-template-columns: 1fr; }
}

html[data-theme="dark"] .dashboard-new-button {
  background: #fff;
  color: #111827;
}
html[data-theme="dark"] .invoice-head { background: var(--panel); }

/* ============================================================
   V4 — Luxury Executive UI
   Frontend-only visual layer. No calculations/API/data changes.
   ============================================================ */

.luxury-v4 {
  --bg: #f3efe8;
  --bg-deep: #ebe4da;
  --panel: #fffdf9;
  --panel-soft: #f8f4ee;
  --panel-strong: #f0e9df;
  --ink: #191816;
  --ink-soft: #3f3b35;
  --muted: #7c746b;
  --line: #e6ddd2;
  --line-strong: #d8ccbd;
  --gold: #b79458;
  --gold-bright: #d2b477;
  --gold-soft: #f6efe3;
  --purple: #1f1e1b;
  --purple-dark: #151412;
  --purple-deep: #0e0d0c;
  --purple-soft: #eee9e1;
  --grad-purple: linear-gradient(135deg, #171614 0%, #26231f 100%);
  --grad-deep: linear-gradient(135deg, #11100f 0%, #25211c 62%, #171512 100%);
  --grad-gold: linear-gradient(135deg, #d7bd87, #a98349);
  --shadow-sm: 0 4px 18px rgba(41, 34, 27, .055);
  --shadow: 0 16px 40px rgba(41, 34, 27, .075);
  --shadow-lg: 0 26px 70px rgba(31, 26, 21, .14);
  background:
    radial-gradient(900px 480px at 92% -140px, rgba(183, 148, 88, .10), transparent 62%),
    radial-gradient(700px 420px at -10% 10%, rgba(255,255,255,.75), transparent 60%),
    #f3efe8;
}

.luxury-v4 .app-shell {
  width: min(1740px, 100%);
  padding: 22px clamp(14px, 2.2vw, 34px) 48px;
}

/* Header: quiet, dark, expensive */
.luxury-v4 .topbar {
  min-height: 108px;
  margin-bottom: 22px;
  padding: 20px 24px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 22px;
  background: linear-gradient(130deg, #0f0f0e 0%, #1d1b18 58%, #242018 100%);
  box-shadow: 0 22px 54px rgba(20,17,14,.20);
}
.luxury-v4 .topbar::before {
  background:
    radial-gradient(720px 230px at 88% -70px, rgba(210,180,119,.20), transparent 68%),
    linear-gradient(100deg, transparent 40%, rgba(255,255,255,.025));
}
.luxury-v4 .topbar::after {
  height: 1px;
  background: linear-gradient(90deg, transparent 3%, rgba(210,180,119,.25) 22%, #d2b477 50%, rgba(210,180,119,.25) 78%, transparent 97%);
}
.luxury-v4 .brand-mark {
  width: 62px;
  height: 62px;
  border: 1px solid rgba(210,180,119,.55);
  box-shadow: 0 10px 28px rgba(0,0,0,.30), 0 0 0 5px rgba(255,255,255,.025);
}
.luxury-v4 .brand-block h1 {
  font-size: clamp(1.55rem, 2.3vw, 2.05rem);
  font-weight: 650;
  letter-spacing: .025em;
}
.luxury-v4 .topbar .eyebrow {
  color: #d7bd87;
  font-size: .66rem;
  letter-spacing: .22em;
}
.luxury-v4 .brand-subtitle {
  color: rgba(255,255,255,.58);
  font-size: .85rem;
}
.luxury-v4 .topbar .button.secondary,
.luxury-v4 .topbar .button.muted {
  min-height: 38px;
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.12);
  color: rgba(255,255,255,.84);
  backdrop-filter: blur(12px);
}
.luxury-v4 .topbar .button.secondary:hover,
.luxury-v4 .topbar .button.muted:hover {
  background: rgba(255,255,255,.10);
  border-color: rgba(210,180,119,.38);
}
.luxury-v4 .user-chip {
  border-color: rgba(210,180,119,.30);
  background: rgba(210,180,119,.09);
  color: #ead8b6;
}

/* Intro */
.luxury-v4 .dashboard-intro {
  margin: 4px 2px 16px;
  padding: 8px 2px 2px;
}
.luxury-v4 .dashboard-intro h2 {
  font-family: var(--font-display);
  font-size: clamp(2rem, 3vw, 2.65rem);
  font-weight: 600;
  letter-spacing: -.02em;
  color: #171614;
}
.luxury-v4 .dashboard-intro p:not(.eyebrow) {
  color: #81786f;
  font-size: .95rem;
}
.luxury-v4 .eyebrow {
  color: #9a7846;
  font-size: .65rem;
  letter-spacing: .20em;
}
.luxury-v4 .dashboard-new-button,
.luxury-v4 .orders-new-button,
.luxury-v4 .button.primary {
  border: 1px solid #171614;
  background: #171614;
  color: #fffaf2;
  box-shadow: 0 10px 25px rgba(23,22,20,.16);
}
.luxury-v4 .dashboard-new-button:hover,
.luxury-v4 .orders-new-button:hover,
.luxury-v4 .button.primary:hover {
  background: #27231e;
  border-color: #27231e;
  box-shadow: 0 13px 30px rgba(23,22,20,.19);
  filter: none;
}

/* Metrics: editorial cards */
.luxury-v4 .metrics-grid {
  gap: 12px;
  margin-bottom: 20px;
}
.luxury-v4 .metric {
  min-height: 126px;
  padding: 18px 18px 16px 20px;
  border: 1px solid #e3d9cd;
  border-radius: 18px;
  background: linear-gradient(145deg, #fffefa 0%, #faf5ee 100%);
  box-shadow: 0 12px 30px rgba(43,36,29,.055);
}
.luxury-v4 .metric:hover {
  transform: translateY(-2px);
  border-color: #d4c2aa;
  box-shadow: 0 17px 38px rgba(43,36,29,.085);
}
.luxury-v4 .metric::before {
  width: 2px;
  background: linear-gradient(180deg, #d7bd87, #a98349) !important;
}
.luxury-v4 .metric::after {
  opacity: .45;
  background: radial-gradient(circle, rgba(183,148,88,.13), transparent 68%);
}
.luxury-v4 .metric span {
  color: #8a8178;
  font-size: .63rem;
  letter-spacing: .16em;
}
.luxury-v4 .metric strong {
  color: #1b1916;
  font-family: var(--font-display);
  font-size: 1.72rem;
  font-weight: 650;
}
.luxury-v4 .metric small { color: #9a9187; }
.luxury-v4 .metric-icon { color: #a98349; }

/* Main surfaces */
.luxury-v4 .workspace { gap: 16px; }
.luxury-v4 .entry-panel,
.luxury-v4 .main-panel {
  border: 1px solid #e2d8cc;
  border-radius: 20px;
  background: rgba(255,253,249,.95);
  box-shadow: 0 16px 44px rgba(43,36,29,.065);
}
.luxury-v4 .entry-panel {
  padding: 18px;
}
.luxury-v4 .panel-heading {
  border-bottom-color: #e8dfd4;
  padding-bottom: 15px;
}
.luxury-v4 .panel-heading h2,
.luxury-v4 .profit-layout h2,
.luxury-v4 .tab-panel h2,
.luxury-v4 .orders-command-header h2 {
  color: #1c1a17;
  font-family: var(--font-display);
  font-weight: 650;
  letter-spacing: -.015em;
}

/* Form system */
.luxury-v4 .order-form fieldset {
  margin-top: 14px;
  border: 1px solid #e5dbcf;
  border-radius: 15px;
  background: #fbf8f3;
}
.luxury-v4 .order-form legend {
  color: #5e554d;
  font-size: .72rem;
  letter-spacing: .095em;
  text-transform: uppercase;
}
.luxury-v4 label {
  color: #6f665d;
  font-size: .78rem;
  font-weight: 650;
}
.luxury-v4 input,
.luxury-v4 select,
.luxury-v4 textarea {
  min-height: 43px;
  border: 1px solid #ddd2c5;
  border-radius: 10px;
  background: #fffefa;
  color: #24201c;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}
.luxury-v4 textarea { min-height: 94px; }
.luxury-v4 input::placeholder,
.luxury-v4 textarea::placeholder { color: #b0a69b; }
.luxury-v4 input:focus,
.luxury-v4 select:focus,
.luxury-v4 textarea:focus {
  border-color: #b69665;
  box-shadow: 0 0 0 3px rgba(183,148,88,.12);
}

/* Buttons */
.luxury-v4 .button,
.luxury-v4 .icon-button {
  border-radius: 10px;
  font-weight: 650;
  letter-spacing: .01em;
}
.luxury-v4 .button.secondary {
  border-color: #d9cec1;
  background: #fffdfa;
  color: #3b342d;
}
.luxury-v4 .button.secondary:hover {
  border-color: #b79a70;
  background: #f7f1e8;
}
.luxury-v4 .button.muted {
  border-color: #eee5da;
  background: #f5f0e9;
  color: #776e65;
}
.luxury-v4 .icon-button:hover {
  border-color: #b99a6d;
  background: #f7efe3;
  color: #6d5532;
}

/* Navigation */
.luxury-v4 .tabs {
  margin: 0;
  padding: 7px;
  gap: 5px;
  border: 0;
  border-bottom: 1px solid #e7ddd2;
  border-radius: 19px 19px 0 0;
  background: #f8f4ee;
}
.luxury-v4 .tab {
  min-height: 43px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #7b7268;
  font-size: .82rem;
}
.luxury-v4 .tab:hover { color: #2c2823; background: rgba(255,255,255,.6); }
.luxury-v4 .tab.active {
  border-color: #e0d4c6;
  background: #fffdf9;
  color: #211e1a;
  box-shadow: 0 5px 15px rgba(43,36,29,.065);
}
.luxury-v4 .tab.active svg { color: #a98349; }
.luxury-v4 .tab-count {
  background: #201d19;
  color: #fff8ec;
}
.luxury-v4 .tab-panel { padding: 18px; }

/* Orders */
.luxury-v4 .orders-command-header {
  position: relative;
  overflow: hidden;
  border: 1px solid #e2d6c8;
  border-radius: 16px;
  background: linear-gradient(115deg, #fbf7f0 0%, #f3eadc 100%);
  box-shadow: none;
}
.luxury-v4 .orders-command-header::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  right: -90px;
  top: -120px;
  border: 1px solid rgba(183,148,88,.22);
  border-radius: 50%;
}
.luxury-v4 .orders-command-header > * { position: relative; z-index: 1; }
.luxury-v4 .orders-command-header span { color: #987543; }
.luxury-v4 .orders-command-header p { color: #82786e; }
.luxury-v4 #ordersPanel .panel-toolbar,
.luxury-v4 .panel-toolbar {
  border-color: #e5dbcf;
  background: #fbf8f3;
}

/* Tables */
.luxury-v4 .table-wrap {
  border: 1px solid #e3d8cb;
  border-radius: 14px;
  background: #fffefa;
  box-shadow: none;
}
.luxury-v4 table thead th {
  background: #f5f0e8;
  color: #71675e;
  border-bottom-color: #ded3c6;
  font-size: .68rem;
  letter-spacing: .085em;
  text-transform: uppercase;
}
.luxury-v4 table tbody td {
  border-bottom-color: #eee6dc;
  color: #3d3832;
}
.luxury-v4 table tbody tr:hover td { background: #fbf7f0; }

/* Invoice paper */
.luxury-v4 .invoice-paper {
  border: 1px solid #ded4c8;
  border-radius: 18px;
  background: #fffefa;
  box-shadow: 0 22px 64px rgba(39,32,25,.10);
}
.luxury-v4 .invoice-head {
  background: #fffefa;
  border-bottom-color: #e7ddd2;
}
.luxury-v4 .invoice-head::before {
  height: 3px;
  background: linear-gradient(90deg, #191816 0%, #191816 70%, #c3a26d 100%);
}
.luxury-v4 .invoice-paper th {
  background: #f5f0e8;
  color: #665d54;
}
.luxury-v4 .invoice-meta { border-left-color: #e4d9cd; }
.luxury-v4 .invoice-paper .grand-total td,
.luxury-v4 .invoice-paper .balance-row td {
  color: #1d1a17;
  font-family: var(--font-display);
}

/* Login */
.luxury-v4 .login-screen {
  background:
    radial-gradient(850px 430px at 85% -10%, rgba(183,148,88,.18), transparent 62%),
    linear-gradient(145deg, #0f0f0e 0%, #22201d 58%, #2d271f 100%);
}
.luxury-v4 .login-card {
  width: min(440px, calc(100% - 28px));
  padding: 34px 34px 30px;
  border: 1px solid rgba(215,189,135,.28);
  border-radius: 24px;
  background: rgba(255,253,249,.97);
  box-shadow: 0 35px 90px rgba(0,0,0,.30);
}
.luxury-v4 .login-card::before {
  content: "";
  display: block;
  height: 2px;
  margin: -34px -34px 28px;
  background: linear-gradient(90deg, transparent, #d2b477 50%, transparent);
}
.luxury-v4 .login-logo {
  border: 1px solid #d6c3a5;
  box-shadow: 0 10px 30px rgba(35,29,22,.12);
}
.luxury-v4 .login-card h1 {
  color: #1a1815;
  font-family: var(--font-display);
  font-weight: 650;
  letter-spacing: -.02em;
}
.luxury-v4 .login-copy,
.luxury-v4 .developer-credit { color: #887e74; }
.luxury-v4 .login-button { min-height: 46px; }
.luxury-v4 .login-trust { color: #81766b; }
.luxury-v4 .trust-dot { background: #a98349; box-shadow: 0 0 0 4px rgba(169,131,73,.11); }

/* Dark luxury */
html[data-theme="dark"] .luxury-v4 {
  --bg: #11110f;
  --bg-deep: #171612;
  --panel: #1c1b18;
  --panel-soft: #22201c;
  --panel-strong: #28251f;
  --ink: #f4eee5;
  --ink-soft: #ddd4c8;
  --muted: #aaa094;
  --line: #373229;
  --line-strong: #494136;
  background: #11110f;
}
html[data-theme="dark"] .luxury-v4 .dashboard-intro h2,
html[data-theme="dark"] .luxury-v4 .panel-heading h2,
html[data-theme="dark"] .luxury-v4 .profit-layout h2,
html[data-theme="dark"] .luxury-v4 .tab-panel h2,
html[data-theme="dark"] .luxury-v4 .orders-command-header h2 { color: #f4eee5; }
html[data-theme="dark"] .luxury-v4 .dashboard-intro p:not(.eyebrow) { color: #a99f94; }
html[data-theme="dark"] .luxury-v4 .metric,
html[data-theme="dark"] .luxury-v4 .entry-panel,
html[data-theme="dark"] .luxury-v4 .main-panel,
html[data-theme="dark"] .luxury-v4 .invoice-paper,
html[data-theme="dark"] .luxury-v4 .invoice-head,
html[data-theme="dark"] .luxury-v4 .login-card {
  border-color: #373229;
  background: #1c1b18;
}
html[data-theme="dark"] .luxury-v4 .metric strong { color: #f4eee5; }
html[data-theme="dark"] .luxury-v4 .metric span,
html[data-theme="dark"] .luxury-v4 .metric small { color: #aaa094; }
html[data-theme="dark"] .luxury-v4 .order-form fieldset,
html[data-theme="dark"] .luxury-v4 .panel-toolbar,
html[data-theme="dark"] .luxury-v4 #ordersPanel .panel-toolbar,
html[data-theme="dark"] .luxury-v4 .orders-command-header,
html[data-theme="dark"] .luxury-v4 .tabs,
html[data-theme="dark"] .luxury-v4 .table-wrap {
  border-color: #373229;
  background: #22201c;
}
html[data-theme="dark"] .luxury-v4 input,
html[data-theme="dark"] .luxury-v4 select,
html[data-theme="dark"] .luxury-v4 textarea,
html[data-theme="dark"] .luxury-v4 .button.secondary,
html[data-theme="dark"] .luxury-v4 .tab.active {
  border-color: #464036;
  background: #191815;
  color: #eee7dd;
}
html[data-theme="dark"] .luxury-v4 table thead th { background: #26231e; color: #b8aea2; border-bottom-color: #403a31; }
html[data-theme="dark"] .luxury-v4 table tbody td { color: #ddd4c8; border-bottom-color: #322e27; }
html[data-theme="dark"] .luxury-v4 table tbody tr:hover td { background: #24211d; }
html[data-theme="dark"] .luxury-v4 .invoice-paper th { background: #27241f; color: #beb3a6; }

/* Mobile polish */
@media (max-width: 900px) {
  .luxury-v4 .app-shell { padding: 10px 10px 30px; }
  .luxury-v4 .topbar { border-radius: 16px; padding: 15px; }
  .luxury-v4 .brand-mark { width: 52px; height: 52px; }
  .luxury-v4 .brand-subtitle { display: none; }
  .luxury-v4 .dashboard-intro { padding: 5px 4px; }
  .luxury-v4 .dashboard-intro h2 { font-size: 2rem; }
  .luxury-v4 .entry-panel,
  .luxury-v4 .main-panel { border-radius: 16px; }
  .luxury-v4 .tabs { border-radius: 15px 15px 0 0; }
}
@media (max-width: 560px) {
  .luxury-v4 .metrics-grid { gap: 9px; }
  .luxury-v4 .metric { min-height: 108px; padding: 14px 14px 13px 16px; border-radius: 14px; }
  .luxury-v4 .metric strong { font-size: 1.48rem; }
  .luxury-v4 .top-actions { gap: 6px; }
  .luxury-v4 .topbar .button { min-height: 35px; padding-inline: 11px; font-size: .78rem; }
  .luxury-v4 .tab-panel { padding: 13px; }
  .luxury-v4 .entry-panel { padding: 14px; }
}


/* V5 — unified order finance */
.finance-fieldset {
  border-color: color-mix(in srgb, var(--brand-accent) 24%, var(--border));
  background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 94%, #d6b77a 6%), var(--surface));
}
.finance-lock,
.finance-pending {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: .26rem .55rem;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
  background: color-mix(in srgb, var(--brand-accent) 9%, transparent);
  color: var(--muted);
  white-space: nowrap;
}
.internal-finance {
  border: 1px dashed color-mix(in srgb, var(--brand-accent) 35%, var(--border));
  border-radius: 18px;
  padding: 18px;
  background: color-mix(in srgb, var(--surface) 95%, #d6b77a 5%);
}
.internal-finance-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.internal-finance-head h3 { margin: 0; }
.internal-finance-head span {
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
}
.internal-finance-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.internal-finance-grid > div {
  padding: 12px;
  border-radius: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
}
.internal-finance-grid span {
  display: block;
  color: var(--muted);
  font-size: .76rem;
  margin-bottom: 4px;
}
.internal-finance-grid strong { font-size: 1rem; }
.quick-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 760px) {
  .internal-finance-grid,
  .quick-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print {
  .no-print { display: none !important; }
}


/* V6 — client ledger, payment history & receivables */
.receivables-alert{margin:0 28px 22px;padding:14px 16px;border:1px solid rgba(184,134,11,.22);background:linear-gradient(135deg,rgba(255,250,235,.92),rgba(255,255,255,.92));border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:18px;box-shadow:0 10px 30px rgba(88,68,24,.06)}
.receivables-alert[hidden]{display:none!important}.receivables-copy{display:flex;align-items:center;gap:11px}.receivables-copy div{display:grid;gap:2px}.receivables-copy small{color:var(--muted)}.receivables-dot{width:10px;height:10px;border-radius:50%;background:#b88a1d;box-shadow:0 0 0 5px rgba(184,138,29,.12)}
.receivables-list{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.receivables-list button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:8px 11px;display:flex;gap:9px;align-items:center;cursor:pointer;font:inherit}.receivables-list button strong{color:#9a6f14}.receivables-list .view-all{color:var(--muted)}
.client-hub-head,.statement-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}.client-hub-head h2,.statement-head h2{margin:.15rem 0}.client-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.client-tools input[type=search]{min-width:240px}.check-control{display:flex!important;align-items:center;gap:8px;border:1px solid var(--border);background:var(--surface);padding:9px 11px;border-radius:12px;white-space:nowrap}.check-control input{width:auto!important;margin:0}
.client-kpis,.statement-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.client-kpis>div,.statement-kpis>div{border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:15px;display:grid;gap:5px}.client-kpis span,.statement-kpis span{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.client-kpis strong,.statement-kpis strong{font-size:1.1rem}.client-row.has-balance td:first-child strong:after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#b88a1d;margin-left:8px;vertical-align:middle}
.client-statement{animation:panelIn .2s ease}.client-statement[hidden]{display:none!important}.statement-title{flex:1}.statement-section{border:1px solid var(--border);border-radius:18px;background:var(--surface);padding:16px;margin-top:16px}.statement-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.statement-section-head h3{margin:0}.statement-section-head span{color:var(--muted);font-size:.86rem}.statement-actions{display:flex;gap:6px;white-space:nowrap}
.payment-dialog{width:min(560px,calc(100vw - 28px));border:0;border-radius:22px;padding:0;background:var(--surface);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.25)}.payment-dialog::backdrop{background:rgba(14,16,20,.48);backdrop-filter:blur(4px)}.payment-dialog form{padding:22px}.payment-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.payment-dialog-head h3{margin:.15rem 0}.payment-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.payment-grid .wide-label{grid-column:1/-1}.payment-dialog-summary{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:var(--surface-alt,rgba(127,127,127,.06));border:1px solid var(--border);margin-bottom:18px}.payment-dialog-summary span{color:var(--muted)}.payment-dialog-summary strong{color:var(--text);margin-left:6px}
.status-pill.unpaid{background:rgba(180,62,62,.1);color:#a23434}.status-pill.deposit-paid{background:rgba(184,138,29,.12);color:#8a6515}.status-pill.paid{background:rgba(42,137,91,.12);color:#24784f}
@media(max-width:860px){.receivables-alert{margin:0 16px 18px;align-items:flex-start;flex-direction:column}.receivables-list{justify-content:flex-start}.client-hub-head,.statement-head{flex-direction:column}.client-tools{width:100%}.client-tools input[type=search]{min-width:0;flex:1}.client-kpis,.statement-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.statement-actions{flex-direction:column}.payment-grid{grid-template-columns:1fr}.payment-grid .wide-label{grid-column:auto}}
@media print{.receivables-alert,.client-hub,.statement-head button,.statement-actions,.app-footer,.fab{display:none!important}.client-statement{display:block!important}.statement-section{break-inside:avoid}.statement-head{margin-bottom:12px}}


/* V7 — Operations & Control Center */
.ops-attention{margin:0 0 16px;padding:15px;border:1px solid var(--border);border-radius:20px;background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--surface) 94%,#d7bd86 6%));box-shadow:0 10px 28px rgba(35,29,22,.045)}
.ops-attention-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.ops-attention-head>div{display:grid;gap:2px}.ops-attention-head span{font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--muted)}.ops-attention-head strong{font-family:var(--font-display);font-size:1.05rem}.attention-reset{border:0;background:transparent;color:var(--brand-accent,#a98349);font:inherit;font-weight:750;cursor:pointer;padding:7px 4px}
.attention-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.attention-card{border:1px solid var(--border);background:var(--surface);border-radius:15px;padding:12px;text-align:left;display:flex;align-items:flex-start;gap:10px;cursor:pointer;color:var(--text);font:inherit;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.attention-card:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--brand-accent,#a98349) 45%,var(--border));box-shadow:0 8px 22px rgba(35,29,22,.07)}.attention-card.active{border-color:var(--brand-accent,#a98349);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand-accent,#a98349) 16%,transparent)}.attention-icon{width:27px;height:27px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;background:color-mix(in srgb,var(--brand-accent,#a98349) 11%,transparent);color:var(--brand-accent,#9a713d);font-weight:900}.attention-copy{display:grid;min-width:0}.attention-copy small{color:var(--muted);font-size:.72rem;font-weight:700}.attention-copy strong{font-size:1.18rem;line-height:1.2;margin:.1rem 0}.attention-copy em{font-style:normal;color:var(--muted);font-size:.68rem;line-height:1.3}
.operations-toolbar{display:grid!important;grid-template-columns:minmax(220px,2fr) repeat(3,minmax(120px,1fr)) auto;align-items:end}.operations-toolbar .filters-clear{min-height:42px;align-self:end;white-space:nowrap}
@media(max-width:1100px){.attention-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.operations-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.operations-toolbar .search-field{grid-column:1/-1}.operations-toolbar .filters-clear{width:100%}}
@media(max-width:680px){.ops-attention{padding:12px;border-radius:16px}.ops-attention-head{align-items:flex-start}.attention-grid{display:flex;overflow-x:auto;padding-bottom:3px;scroll-snap-type:x proximity}.attention-card{min-width:152px;scroll-snap-align:start}.attention-copy em{display:none}.operations-toolbar{grid-template-columns:1fr 1fr}.operations-toolbar label:first-child{grid-column:1/-1}.operations-toolbar .filters-clear{grid-column:1/-1}.ops-attention-head strong{font-size:.96rem}}
@media print{.ops-attention,.filters-clear{display:none!important}}

/* V8 SaaS / white-label */
.saas-plan-card{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(212,175,55,.07));margin:4px 0 2px}.saas-plan-card h3{margin:2px 0 4px}.plan-pill{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.08em;background:rgba(188,151,72,.12);border:1px solid rgba(188,151,72,.28);color:var(--text)}.admin-users-table td{vertical-align:top}


/* V9 — Subscription & Client Management */
.account-status.expiring{background:#fff7df;color:#8a5a00;border:1px solid rgba(188,151,72,.24)}
.admin-toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap}.admin-toolbar label{display:grid;gap:6px;font-size:.78rem;color:var(--muted)}.admin-toolbar select{min-width:150px}
.admin-note-preview{color:var(--muted);font-style:italic}.muted{color:var(--muted)}
.user-edit-dialog{width:min(820px,calc(100vw - 28px));max-height:calc(100vh - 36px);overflow:auto;border:0;border-radius:22px;padding:0;background:var(--panel);color:var(--ink);box-shadow:0 30px 90px rgba(0,0,0,.28)}
.user-edit-dialog::backdrop{background:rgba(14,16,20,.52);backdrop-filter:blur(5px)}.user-edit-dialog form{padding:24px}.user-edit-sections{display:grid;gap:16px;margin:18px 0}.user-edit-sections section{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface-alt,rgba(127,127,127,.04))}.user-edit-sections h4{margin:0 0 13px}.user-edit-sections textarea{width:100%;resize:vertical}.subscription-quick-actions{display:flex;gap:8px;flex-wrap:wrap;padding:0 0 16px}.user-edit-dialog .confirm-actions{position:sticky;bottom:-24px;background:var(--panel);padding:14px 0 2px;border-top:1px solid var(--line)}
html[data-theme="dark"] .user-edit-dialog{background:var(--panel)}
@media(max-width:720px){.user-edit-dialog form{padding:16px}.user-edit-sections .field-grid.two{grid-template-columns:1fr}.admin-toolbar>label,.admin-toolbar .search-field{width:100%}.admin-toolbar select{width:100%}}

/* V10 — Subscription billing center */
.admin-billing-center{margin:24px 0;padding:22px;border:1px solid var(--border);border-radius:24px;background:var(--panel);box-shadow:var(--shadow-sm)}
.admin-billing-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 18px}
.admin-billing-kpis>div{padding:16px;border:1px solid var(--border);border-radius:18px;background:var(--panel-soft)}
.admin-billing-kpis strong{display:block;font-size:1.35rem;letter-spacing:-.03em}
.admin-billing-kpis span{display:block;margin-top:4px;color:var(--muted);font-size:.82rem}
.admin-billing-grid{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.4fr);gap:16px}
.billing-due-card,.billing-history-card{border:1px solid var(--border);border-radius:20px;padding:16px;background:var(--panel-soft)}
.billing-due-card h4,.billing-history-card h4{margin:0 0 12px}
.billing-due-list{display:grid;gap:10px}
.billing-due-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border:1px solid var(--border);border-radius:16px;background:var(--panel)}
.billing-due-item strong,.billing-due-item small{display:block}.billing-due-item small{margin-top:4px;color:var(--muted)}
.empty-state.compact{padding:18px}
@media(max-width:900px){.admin-billing-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-billing-grid{grid-template-columns:1fr}.billing-due-item{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.admin-billing-kpis{grid-template-columns:1fr 1fr}.admin-billing-center{padding:16px;border-radius:20px}}


/* V11 Reports & Analytics */
.analytics-panel { padding-bottom: 32px; }
.analytics-hero { display:flex; justify-content:space-between; gap:24px; align-items:flex-end; padding:28px; margin-bottom:16px; border:1px solid var(--border, #e5e7eb); border-radius:24px; background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,244,235,.88)); }
[data-theme="dark"] .analytics-hero { background:linear-gradient(135deg, rgba(23,23,23,.98), rgba(39,35,29,.95)); }
.analytics-hero h2 { margin:4px 0 6px; font-size:clamp(1.6rem,2.5vw,2.2rem); }
.analytics-hero p { margin:0; max-width:720px; color:var(--muted, #6b7280); }
.eyebrow { text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; font-weight:800; color:#9a7b42; }
.analytics-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:end; padding:14px 4px 20px; }
.analytics-filters label { min-width:150px; }
.analytics-presets { display:flex; flex-wrap:wrap; gap:8px; flex:1 1 420px; }
.chip-button { border:1px solid var(--border, #e5e7eb); background:var(--surface, #fff); color:inherit; border-radius:999px; padding:9px 13px; font:inherit; font-size:.86rem; cursor:pointer; }
.chip-button.active { background:#181713; color:#fff; border-color:#181713; }
[data-theme="dark"] .chip-button.active { background:#e8dcc3; color:#181713; border-color:#e8dcc3; }
.analytics-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.analytics-kpi { border:1px solid var(--border,#e5e7eb); border-radius:20px; padding:18px; background:var(--surface,#fff); min-width:0; }
.analytics-kpi span,.analytics-kpi small { display:block; color:var(--muted,#6b7280); }
.analytics-kpi span { font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.analytics-kpi strong { display:block; margin:8px 0 5px; font-size:1.35rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.analytics-kpi small { font-size:.78rem; }
.analytics-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:16px; }
.analytics-card { border:1px solid var(--border,#e5e7eb); border-radius:22px; background:var(--surface,#fff); padding:20px; min-width:0; }
.analytics-card-head { display:flex; justify-content:space-between; margin-bottom:18px; }
.analytics-card-head span { color:#9a7b42; text-transform:uppercase; letter-spacing:.12em; font-size:.7rem; font-weight:800; }
.analytics-card-head h3 { margin:4px 0 0; font-size:1.05rem; }
.analytics-wide { min-height:300px; }
.bar-chart { height:230px; display:flex; gap:10px; align-items:stretch; padding-top:18px; overflow-x:auto; }
.bar-column { flex:1 0 54px; min-width:54px; display:grid; grid-template-rows:24px 1fr 28px; gap:6px; text-align:center; }
.bar-value,.bar-label { font-size:.72rem; color:var(--muted,#6b7280); white-space:nowrap; }
.bar-track { position:relative; height:100%; border-radius:12px 12px 5px 5px; background:rgba(154,123,66,.08); overflow:hidden; }
.bar-fill { position:absolute; left:0; right:0; bottom:0; border-radius:12px 12px 5px 5px; background:linear-gradient(180deg,#c7a96b,#8d6e36); min-height:4px; }
.status-row { margin-bottom:16px; }
.status-row > div:first-child { display:flex; justify-content:space-between; gap:12px; font-size:.86rem; margin-bottom:7px; }
.status-track { height:8px; border-radius:999px; background:rgba(154,123,66,.1); overflow:hidden; }
.status-track i { display:block; height:100%; border-radius:inherit; background:#a8874d; }
.rank-row { display:grid; grid-template-columns:30px 1fr auto; gap:10px; align-items:center; padding:12px 0; border-bottom:1px solid var(--border,#eee); }
.rank-row:last-child { border-bottom:0; }
.rank-no { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:rgba(154,123,66,.12); color:#8d6e36; font-weight:800; }
.rank-row strong,.rank-row small { display:block; }
.rank-row small { color:var(--muted,#6b7280); margin-top:3px; font-size:.75rem; }
.rank-row b { white-space:nowrap; }
.analytics-breakdown { display:grid; gap:13px; }
.finance-row { display:grid; grid-template-columns:150px 1fr 120px; gap:14px; align-items:center; font-size:.86rem; }
.finance-meter { height:10px; background:rgba(154,123,66,.1); border-radius:999px; overflow:hidden; }
.finance-meter i { display:block; height:100%; background:linear-gradient(90deg,#8d6e36,#c9ad72); border-radius:inherit; }
.finance-row strong { text-align:right; white-space:nowrap; }
.analytics-empty { min-height:120px; display:grid; place-items:center; text-align:center; color:var(--muted,#6b7280); padding:20px; }
@media (max-width:1200px){ .analytics-kpis{grid-template-columns:repeat(3,1fr)} }
@media (max-width:800px){ .analytics-hero{align-items:flex-start;flex-direction:column}.analytics-grid{grid-template-columns:1fr}.analytics-kpis{grid-template-columns:repeat(2,1fr)}.finance-row{grid-template-columns:1fr}.finance-row strong{text-align:left}.analytics-presets{flex-basis:100%} }
@media (max-width:480px){ .analytics-kpis{grid-template-columns:1fr}.analytics-card,.analytics-hero{border-radius:18px;padding:16px}.analytics-filters label{width:100%}.analytics-filters input{width:100%} }

/* V12 — bulk actions + direct logo upload */
.bulk-toolbar {
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
  padding: .8rem .9rem;
  margin: .35rem 0 .85rem;
  border: 1px solid var(--line, rgba(17,24,39,.10));
  border-radius: 14px;
  background: color-mix(in srgb, var(--panel, #fff) 92%, var(--brand-accent, #111827) 8%);
}
.bulk-toolbar label { display: inline-flex; align-items: center; gap: .45rem; margin: 0; }
.bulk-toolbar select { min-width: 128px; }
.bulk-select-all { font-weight: 700; white-space: nowrap; }
.bulk-count { min-width: 76px; font-size: .85rem; color: var(--muted, #6b7280); }
.select-col { width: 42px; text-align: center !important; }
.select-col input[type="checkbox"], .bulk-select-all input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--brand-accent, #111827); cursor: pointer; }
.logo-upload-field { align-content: start; }
.logo-upload-field input[type="file"] { padding: .55rem; }
.logo-upload-preview { display: block; width: 72px; height: 72px; object-fit: contain; margin-top: .55rem; padding: .35rem; border-radius: 14px; border: 1px solid var(--line, rgba(17,24,39,.1)); background: #fff; }
.logo-upload-preview[hidden] { display: none !important; }
.invoice-logo-image { object-fit: contain; background: transparent !important; border: 0 !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 780px) {
  .bulk-toolbar { align-items: stretch; }
  .bulk-toolbar > * { flex: 1 1 auto; }
  .bulk-toolbar .button { min-height: 40px; }
  .select-col { position: sticky; left: 0; z-index: 2; background: var(--panel, #fff); }
}


/* ============================================================
   V13 — Premium Luxury UI/UX refresh
   Visual-only layer. No data, API or calculation changes.
   ============================================================ */
.luxury-v13 {
  --bg: #f4f1eb;
  --bg-deep: #ece6db;
  --panel: #fffdf9;
  --panel-soft: #faf7f1;
  --panel-strong: #f2ece1;
  --ink: #1d1c19;
  --ink-soft: #3f3b34;
  --muted: #827a6d;
  --line: #e7dfd2;
  --line-strong: #d8cbb8;
  --brand-accent: #1d1c19;
  --purple: #1d1c19;
  --purple-dark: #1d1c19;
  --purple-deep: #12110f;
  --purple-soft: #f0ebe2;
  --lavender: #ded2be;
  --gold: #9b7740;
  --gold-bright: #c5a46d;
  --gold-soft: #f5ecdc;
  --grad-deep: linear-gradient(135deg,#171714 0%,#25231f 55%,#302b25 100%);
  --grad-gold: linear-gradient(135deg,#cdb07c,#9b7740);
  --shadow-sm: 0 8px 24px rgba(45,37,28,.055);
  --shadow: 0 18px 48px rgba(45,37,28,.085);
  --shadow-lg: 0 28px 72px rgba(28,23,18,.16);
  --radius: 20px;
  --radius-sm: 13px;
  background:
    radial-gradient(900px 480px at 100% -8%, rgba(193,159,101,.12), transparent 62%),
    radial-gradient(760px 420px at -8% 14%, rgba(255,255,255,.9), transparent 62%),
    linear-gradient(180deg,#f7f4ee 0%,#f2eee7 100%);
  letter-spacing: -.005em;
}

.luxury-v13 .app-shell { width:min(1740px,100%); padding:18px clamp(14px,2vw,30px) 46px; }

.luxury-v13 .topbar {
  padding: 17px 20px;
  margin-bottom: 22px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  background:
    radial-gradient(520px 180px at 88% -35%, rgba(203,170,111,.18), transparent 72%),
    linear-gradient(135deg,#181714 0%,#23211d 57%,#2d2924 100%);
  box-shadow: 0 24px 55px rgba(20,18,15,.18), inset 0 1px 0 rgba(255,255,255,.05);
}
.luxury-v13 .topbar::after { height:1px; opacity:.6; background:linear-gradient(90deg,transparent,#cfb27f 30%,#e1ca9e 50%,#cfb27f 70%,transparent); }
.luxury-v13 .topbar::before { opacity:.85; }
.luxury-v13 .brand-mark { width:58px;height:58px;border:1px solid rgba(226,199,151,.55);box-shadow:0 10px 28px rgba(0,0,0,.28),0 0 0 5px rgba(255,255,255,.035); }
.luxury-v13 .brand-block h1 { font-size:clamp(1.35rem,2vw,1.85rem); font-weight:650; letter-spacing:.015em; }
.luxury-v13 .brand-subtitle { margin:.28rem 0 0; color:rgba(255,255,255,.63); font-size:.84rem; }
.luxury-v13 .topbar .eyebrow { color:#d7ba84; letter-spacing:.18em; font-size:.66rem; }
.luxury-v13 .topbar .button.secondary,
.luxury-v13 .topbar .button.muted { min-height:38px;border-radius:11px;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.1);box-shadow:none; }
.luxury-v13 .topbar .button.secondary:hover,
.luxury-v13 .topbar .button.muted:hover { background:rgba(255,255,255,.11);border-color:rgba(224,196,145,.32);transform:translateY(-1px); }
.luxury-v13 .user-chip { border:1px solid rgba(224,196,145,.2);background:rgba(216,187,132,.08);color:#e5d5b6;border-radius:999px; }

.luxury-v13 .dashboard-intro { padding:10px 4px 17px; margin-bottom:3px; }
.luxury-v13 .dashboard-intro h2 { font-size:clamp(2rem,3vw,2.75rem);font-weight:600;letter-spacing:-.045em;line-height:1.02;color:#1b1916; }
.luxury-v13 .dashboard-intro p:not(.eyebrow) { color:#81786b; font-size:.95rem; }
.luxury-v13 .dashboard-new-button { border:0;border-radius:14px;background:#1c1b18;color:#fff;padding:12px 18px;box-shadow:0 12px 26px rgba(28,27,24,.16);font-weight:750; }
.luxury-v13 .dashboard-new-button:hover { transform:translateY(-2px);box-shadow:0 16px 32px rgba(28,27,24,.2); }

.luxury-v13 .metrics-grid { gap:12px; margin-bottom:19px; }
.luxury-v13 .metric { position:relative;overflow:hidden;min-height:116px;padding:18px 19px;border:1px solid #e8e0d4;border-radius:18px;background:linear-gradient(145deg,#fffefa,#fbf8f2);box-shadow:0 9px 28px rgba(53,43,31,.05); }
.luxury-v13 .metric::after { content:"";position:absolute;width:88px;height:88px;border-radius:50%;right:-35px;top:-35px;background:radial-gradient(circle,rgba(193,159,101,.10),transparent 68%); }
.luxury-v13 .metric:hover { transform:translateY(-2px);border-color:#d9c9af;box-shadow:0 15px 34px rgba(53,43,31,.075); }
.luxury-v13 .metric span { font-size:.69rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#8d8374; }
.luxury-v13 .metric strong { font-size:1.65rem;letter-spacing:-.04em;color:#211f1b; }

.luxury-v13 .workspace { gap:17px; }
.luxury-v13 .entry-panel,
.luxury-v13 .main-panel,
.luxury-v13 .admin-billing-center,
.luxury-v13 .analytics-card,
.luxury-v13 .analytics-hero,
.luxury-v13 .ops-attention,
.luxury-v13 .statement-section { border-color:#e6ddd0;background:rgba(255,253,249,.92);box-shadow:0 12px 36px rgba(49,40,29,.055);backdrop-filter:blur(8px); }
.luxury-v13 .entry-panel,
.luxury-v13 .main-panel { border-radius:22px; }
.luxury-v13 .entry-panel { padding:19px; }

.luxury-v13 .panel-heading { margin-bottom:14px; }
.luxury-v13 .panel-heading h2,
.luxury-v13 .client-hub-head h2,
.luxury-v13 .statement-head h2 { font-family:var(--font-display);font-weight:600;letter-spacing:-.018em; }
.luxury-v13 .eyebrow { color:#9d7e4d;letter-spacing:.17em;font-size:.67rem; }

.luxury-v13 fieldset { border:1px solid #e9e1d6;border-radius:17px;background:#fffdfa;padding:15px;margin-bottom:13px; }
.luxury-v13 legend { padding:0 6px;color:#39342d;font-weight:800;font-size:.77rem;letter-spacing:.04em;text-transform:uppercase; }
.luxury-v13 label { color:#625b50;font-weight:650;font-size:.79rem; }
.luxury-v13 input,
.luxury-v13 select,
.luxury-v13 textarea { min-height:43px;border:1px solid #dfd6ca;border-radius:12px;background:#fff;color:#211f1c;padding:10px 12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.8);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease; }
.luxury-v13 textarea { min-height:82px; }
.luxury-v13 input:hover,
.luxury-v13 select:hover,
.luxury-v13 textarea:hover { border-color:#cdbb9f; }
.luxury-v13 input:focus,
.luxury-v13 select:focus,
.luxury-v13 textarea:focus { outline:none;border-color:#a98650;box-shadow:0 0 0 3px rgba(169,134,80,.11);background:#fff; }
.luxury-v13 .field-hint { color:#91887b;font-size:.75rem; }

.luxury-v13 .button { border-radius:11px;font-weight:750;letter-spacing:-.01em;transition:transform .14s ease,box-shadow .14s ease,background .14s ease,border-color .14s ease; }
.luxury-v13 .button:hover { transform:translateY(-1px); }
.luxury-v13 .button.primary { background:#1d1c19;border-color:#1d1c19;color:#fff;box-shadow:0 9px 22px rgba(29,28,25,.13); }
.luxury-v13 .button.primary:hover { background:#2a2823;box-shadow:0 12px 28px rgba(29,28,25,.18); }
.luxury-v13 .button.secondary { background:#fffdf9;border-color:#ded4c5;color:#37322c; }
.luxury-v13 .button.secondary:hover { border-color:#c8b493;background:#fff; }
.luxury-v13 .icon-button { border-radius:10px;color:#7f7566; }

.luxury-v13 .tabs { gap:5px;padding:7px;border:1px solid #e6ddd0;border-bottom-color:#e6ddd0;border-radius:17px 17px 0 0;background:#f6f1e9; }
.luxury-v13 .tab { border-radius:11px;color:#746b5f;font-weight:750;padding:10px 13px; }
.luxury-v13 .tab:hover { background:#fffaf2;color:#332f29; }
.luxury-v13 .tab.active { background:#1d1c19;color:#fff;box-shadow:0 7px 18px rgba(29,28,25,.12); }

.luxury-v13 table { border-collapse:separate;border-spacing:0; }
.luxury-v13 th { background:#f7f3ec;color:#776f63;font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;font-weight:850;border-bottom:1px solid #e4dbce; }
.luxury-v13 td { border-bottom:1px solid #eee7dc;color:#38342e; }
.luxury-v13 tbody tr { transition:background .14s ease,transform .14s ease; }
.luxury-v13 tbody tr:hover td { background:#fcf9f3; }
.luxury-v13 .status-pill { border-radius:999px;font-weight:800;font-size:.7rem;letter-spacing:.015em; }
.luxury-v13 .status-pill.paid { background:#e9f3ec;color:#3d7150; }
.luxury-v13 .status-pill.unpaid { background:#f7eae7;color:#9a5144; }
.luxury-v13 .status-pill.deposit-paid { background:#f6efdf;color:#8c692d; }

.luxury-v13 .ops-attention { padding:16px;border-radius:19px; }
.luxury-v13 .attention-card { border-color:#e7ded2;background:#fffdfa;border-radius:15px;box-shadow:none; }
.luxury-v13 .attention-card:hover { border-color:#cdbb9e;box-shadow:0 9px 22px rgba(45,37,28,.06); }
.luxury-v13 .attention-card.active { border-color:#9d7e4d;box-shadow:0 0 0 2px rgba(157,126,77,.10); }
.luxury-v13 .attention-icon { background:#f4ecdf;color:#9d7e4d; }

.luxury-v13 .bulk-toolbar { border-color:#e2d8ca;border-radius:14px;background:#f7f2ea;padding:10px 12px; }
.luxury-v13 .bulk-count { color:#887e70; }
.luxury-v13 input[type="checkbox"] { accent-color:#9d7e4d; }

.luxury-v13 .receivables-alert { border-color:#e1d1b5;background:linear-gradient(135deg,#fbf5e8,#fffdf9);box-shadow:0 9px 24px rgba(91,69,33,.05); }
.luxury-v13 .receivables-dot { background:#ad8447;box-shadow:0 0 0 5px rgba(173,132,71,.10); }

.luxury-v13 .analytics-hero { background:linear-gradient(135deg,#fffdf8 0%,#f5eee3 100%); }
.luxury-v13 .analytics-kpi { border-color:#e7ddd0;border-radius:18px;background:#fffdf9;box-shadow:0 7px 20px rgba(49,40,29,.04); }
.luxury-v13 .analytics-kpi strong { color:#221f1b; }
.luxury-v13 .bar-fill { background:linear-gradient(180deg,#c5a46d,#8f6d39); }
.luxury-v13 .chip-button { background:#fffdf9;border-color:#dfd5c7; }
.luxury-v13 .chip-button.active { background:#1d1c19;color:#fff;border-color:#1d1c19; }

.luxury-v13 .payment-dialog,
.luxury-v13 .user-edit-dialog,
.luxury-v13 dialog { border:1px solid #dfd4c4;border-radius:24px;background:#fffdf9;box-shadow:0 30px 90px rgba(24,20,16,.24); }
.luxury-v13 dialog::backdrop { background:rgba(21,18,15,.48);backdrop-filter:blur(7px); }

.luxury-v13 .login-screen { background:
  radial-gradient(680px 420px at 18% 10%, rgba(205,176,123,.18), transparent 65%),
  radial-gradient(760px 500px at 85% 95%, rgba(255,255,255,.12), transparent 65%),
  linear-gradient(140deg,#151411 0%,#201e1a 58%,#2b2721 100%); }
.luxury-v13 .login-card { border:1px solid rgba(218,192,145,.18);background:rgba(255,253,249,.965);border-radius:28px;box-shadow:0 34px 90px rgba(0,0,0,.28);padding:clamp(26px,4vw,38px); }
.luxury-v13 .login-logo { width:82px;height:82px;border-radius:50%;padding:4px;border:1px solid #d3b77f;background:#fff;box-shadow:0 14px 32px rgba(54,43,27,.13); }
.luxury-v13 .login-card h1 { font-family:var(--font-display);font-weight:600;letter-spacing:-.025em;font-size:clamp(2rem,5vw,2.55rem); }
.luxury-v13 .login-copy { color:#81776a; }
.luxury-v13 .login-form label { color:#5f574b; }
.luxury-v13 .login-button { min-height:47px;border-radius:13px; }
.luxury-v13 .login-trust { color:#786e60;background:#f7f1e7;border:1px solid #eadfcf;border-radius:999px; }
.luxury-v13 .trust-dot { background:#9f7d47;box-shadow:0 0 0 4px rgba(159,125,71,.11); }

.luxury-v13 .logo-upload-preview { border-color:#dfd3c1;background:#fffdf9;border-radius:16px;box-shadow:0 6px 18px rgba(49,40,29,.05); }

html[data-theme="dark"] .luxury-v13,
html[data-theme="dark"] body.luxury-v13 {
  --bg:#141310;--bg-deep:#191713;--panel:#1d1b18;--panel-soft:#23201c;--panel-strong:#29251f;--ink:#f1ede5;--ink-soft:#d9d1c5;--muted:#a79d8e;--line:#39342c;--line-strong:#4a4237;
  background:radial-gradient(850px 480px at 100% -10%,rgba(181,145,84,.10),transparent 62%),linear-gradient(180deg,#151411 0%,#11100e 100%);
}
html[data-theme="dark"] .luxury-v13 .dashboard-intro h2,
html[data-theme="dark"] .luxury-v13 .metric strong,
html[data-theme="dark"] .luxury-v13 input,
html[data-theme="dark"] .luxury-v13 select,
html[data-theme="dark"] .luxury-v13 textarea { color:#f1ede5; }
html[data-theme="dark"] .luxury-v13 .metric,
html[data-theme="dark"] .luxury-v13 fieldset,
html[data-theme="dark"] .luxury-v13 .attention-card,
html[data-theme="dark"] .luxury-v13 .analytics-kpi,
html[data-theme="dark"] .luxury-v13 .entry-panel,
html[data-theme="dark"] .luxury-v13 .main-panel,
html[data-theme="dark"] .luxury-v13 .statement-section { background:#1d1b18;border-color:#383229; }
html[data-theme="dark"] .luxury-v13 input,
html[data-theme="dark"] .luxury-v13 select,
html[data-theme="dark"] .luxury-v13 textarea { background:#171613;border-color:#3c362d; }
html[data-theme="dark"] .luxury-v13 .tabs,
html[data-theme="dark"] .luxury-v13 .bulk-toolbar { background:#191714;border-color:#383229; }
html[data-theme="dark"] .luxury-v13 th { background:#211e1a;color:#aaa091;border-bottom-color:#39332b; }
html[data-theme="dark"] .luxury-v13 td { border-bottom-color:#332e27;color:#ded7cc; }
html[data-theme="dark"] .luxury-v13 tbody tr:hover td { background:#24211d; }
html[data-theme="dark"] .luxury-v13 .analytics-hero { background:linear-gradient(135deg,#1d1b18,#27231e); }
html[data-theme="dark"] .luxury-v13 .chip-button { background:#1d1b18;border-color:#39332b;color:#dcd4c8; }
html[data-theme="dark"] .luxury-v13 .chip-button.active { background:#d4b77f;border-color:#d4b77f;color:#181612; }

@media (max-width: 920px) {
  .luxury-v13 .app-shell { padding:12px 12px 28px; }
  .luxury-v13 .topbar { border-radius:18px;padding:14px; }
  .luxury-v13 .top-actions { gap:6px; }
  .luxury-v13 .topbar .button { padding:8px 10px; }
  .luxury-v13 .dashboard-intro { padding-inline:2px; }
  .luxury-v13 .dashboard-intro h2 { font-size:2.05rem; }
  .luxury-v13 .entry-panel,.luxury-v13 .main-panel { border-radius:18px; }
}
@media (max-width: 620px) {
  .luxury-v13 .brand-mark { width:48px;height:48px; }
  .luxury-v13 .topbar { align-items:flex-start; }
  .luxury-v13 .top-actions { width:100%;justify-content:flex-start; }
  .luxury-v13 .dashboard-new-button { width:100%;justify-content:center; }
  .luxury-v13 .metric { min-height:103px;padding:14px 15px; }
  .luxury-v13 fieldset { padding:13px; }
  .luxury-v13 .tabs { border-radius:14px 14px 0 0;overflow-x:auto;flex-wrap:nowrap; }
  .luxury-v13 .tab { white-space:nowrap; }
  .luxury-v13 .login-card { border-radius:22px; }
}


/* =========================================================
   V13.1 — Premium Sidebar UI + tenant-safe public login
   ========================================================= */
.luxury-v13-1.app-shell,
.luxury-v13-1 .app-shell { }

body.luxury-v13-1 .app-shell {
  width:min(1880px,100%);
  max-width:none;
  margin:0 auto;
  padding:18px 22px 36px;
  display:grid;
  grid-template-columns:230px minmax(0,1fr);
  grid-template-rows:auto auto auto auto auto;
  gap:16px 20px;
  align-items:start;
}
body.luxury-v13-1 .premium-sidebar {
  grid-column:1;
  grid-row:1 / span 6;
  position:sticky;
  top:18px;
  min-height:calc(100vh - 36px);
  padding:22px 14px 16px;
  border:1px solid rgba(226,202,157,.13);
  border-radius:25px;
  background:
    radial-gradient(300px 220px at 0% 0%,rgba(207,174,112,.13),transparent 62%),
    linear-gradient(180deg,#181713 0%,#11110f 100%);
  color:#eee8dd;
  box-shadow:0 24px 60px rgba(25,21,16,.16);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
body.luxury-v13-1 .premium-sidebar::after {
  content:"";position:absolute;inset:auto -80px -80px auto;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle,rgba(191,151,84,.12),transparent 68%);pointer-events:none;
}
body.luxury-v13-1 .premium-sidebar-head { display:flex;align-items:center;gap:12px;padding:2px 7px 16px; }
body.luxury-v13-1 .premium-sidebar-logo { width:42px;height:42px;border-radius:13px;object-fit:contain;padding:3px;background:#f9f4eb;border:1px solid rgba(222,194,143,.45);box-shadow:0 8px 24px rgba(0,0,0,.22); }
body.luxury-v13-1 .premium-sidebar-head div { display:grid;line-height:1;gap:2px; }
body.luxury-v13-1 .premium-sidebar-head span { font-size:.59rem;letter-spacing:.29em;color:#b9aa91;font-weight:800; }
body.luxury-v13-1 .premium-sidebar-head strong { font-family:Georgia,'Times New Roman',serif;font-size:1.22rem;letter-spacing:.08em;color:#fffaf1;font-weight:500; }
body.luxury-v13-1 .premium-sidebar-caption { margin:0 7px 17px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:.55rem;letter-spacing:.17em;font-weight:800;color:#8f8576; }
body.luxury-v13-1 .premium-side-nav { display:grid;gap:4px; }
body.luxury-v13-1 .premium-side-nav .tab {
  width:100%;display:flex;align-items:center;gap:11px;justify-content:flex-start;padding:10px 11px;
  border:1px solid transparent;border-radius:12px;background:transparent;color:#aca397;box-shadow:none;
  font-size:.79rem;font-weight:700;text-align:left;transition:.15s ease;
}
body.luxury-v13-1 .premium-side-nav .tab:hover { background:rgba(255,255,255,.055);color:#f4eee5;transform:none; }
body.luxury-v13-1 .premium-side-nav .tab.active { background:linear-gradient(135deg,rgba(213,180,119,.18),rgba(213,180,119,.07));border-color:rgba(214,180,116,.25);color:#fff8ed;box-shadow:inset 3px 0 0 #caa66a; }
body.luxury-v13-1 .side-icon { width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.055);font-size:.87rem;color:#cdb78d;flex:0 0 auto; }
body.luxury-v13-1 .premium-side-nav .tab.active .side-icon { background:rgba(212,177,112,.15);color:#e4c893; }
body.luxury-v13-1 .premium-sidebar-foot { margin-top:auto;display:flex;align-items:center;gap:10px;padding:13px 10px 4px;border-top:1px solid rgba(255,255,255,.07);position:relative;z-index:1; }
body.luxury-v13-1 .premium-sidebar-foot div { display:grid;gap:2px; }
body.luxury-v13-1 .premium-sidebar-foot strong { font-size:.67rem;color:#d8d0c4; }
body.luxury-v13-1 .premium-sidebar-foot small { font-size:.6rem;color:#80776b; }
body.luxury-v13-1 .premium-live-dot { width:8px;height:8px;border-radius:50%;background:#9eb895;box-shadow:0 0 0 4px rgba(158,184,149,.1); }

body.luxury-v13-1 .topbar,
body.luxury-v13-1 .dashboard-intro,
body.luxury-v13-1 .metrics-grid,
body.luxury-v13-1 .receivables-alert,
body.luxury-v13-1 .workspace { grid-column:2; }
body.luxury-v13-1 .topbar {
  margin:0;border-radius:19px;min-height:73px;padding:12px 15px 12px 17px;
  background:rgba(255,253,249,.94);border:1px solid #e7ded1;box-shadow:0 8px 28px rgba(52,43,31,.055);backdrop-filter:blur(14px);
}
body.luxury-v13-1 .topbar::before { display:none; }
body.luxury-v13-1 .brand-mark { width:42px;height:42px;border-radius:12px;border:1px solid #e3d7c4;background:#fff;box-shadow:none; }
body.luxury-v13-1 .topbar .brand-block h1 { font-size:1.07rem;letter-spacing:-.01em; }
body.luxury-v13-1 .topbar .brand-subtitle { font-size:.69rem;max-width:430px;color:#8c8273; }
body.luxury-v13-1 .topbar .eyebrow { font-size:.55rem;letter-spacing:.14em; }
body.luxury-v13-1 .top-actions .button { min-height:36px;border-radius:10px;font-size:.72rem;padding:7px 10px; }
body.luxury-v13-1 .user-chip { background:#f3eee5;border:1px solid #e4d9c9;color:#6d6356;border-radius:999px;padding:8px 11px; }

body.luxury-v13-1 .dashboard-intro { margin:4px 2px 0;padding:9px 5px 2px; }
body.luxury-v13-1 .dashboard-intro h2 { font-size:2rem;letter-spacing:-.04em; }
body.luxury-v13-1 .dashboard-intro p:not(.eyebrow) { font-size:.8rem; }
body.luxury-v13-1 .dashboard-new-button { border-radius:12px;background:linear-gradient(135deg,#1d1b18,#312d27);box-shadow:0 10px 25px rgba(26,23,19,.15); }

body.luxury-v13-1 .metrics-grid { gap:11px; }
body.luxury-v13-1 .metric { min-height:108px;border-radius:17px;padding:15px 16px;background:#fff;border-color:#e8e0d4;box-shadow:0 7px 24px rgba(49,40,29,.045); }
body.luxury-v13-1 .metric::before { width:3px;height:31px;border-radius:5px;left:0;top:20px;background:linear-gradient(#d2b276,#a37b40); }
body.luxury-v13-1 .metric strong { font-size:1.5rem; }

body.luxury-v13-1 .workspace { grid-template-columns:minmax(345px,395px) minmax(0,1fr);gap:14px; }
body.luxury-v13-1 .entry-panel { position:sticky;top:107px;max-height:calc(100vh - 125px);overflow:auto;scrollbar-width:thin; }
body.luxury-v13-1 .entry-panel,
body.luxury-v13-1 .main-panel { border-radius:19px;border-color:#e8e0d5;background:#fff;box-shadow:0 10px 32px rgba(47,39,29,.05); }
body.luxury-v13-1 .main-panel > .tabs { display:none; }
body.luxury-v13-1 .main-panel { overflow:hidden; }
body.luxury-v13-1 .tab-panel { padding:18px; }
body.luxury-v13-1 .orders-command-header { padding:2px 1px 16px;border-bottom:1px solid #eee6da;margin-bottom:15px; }
body.luxury-v13-1 .orders-command-header h2 { font-family:Georgia,'Times New Roman',serif;font-weight:500;font-size:1.55rem; }
body.luxury-v13-1 .orders-command-header > div > span { color:#a68551;letter-spacing:.13em;font-size:.58rem; }

body.luxury-v13-1 fieldset { background:#fcfaf6;border-color:#e9e1d6;border-radius:14px;padding:13px; }
body.luxury-v13-1 legend { font-size:.68rem;letter-spacing:.07em; }
body.luxury-v13-1 input,
body.luxury-v13-1 select,
body.luxury-v13-1 textarea { border-radius:10px;background:#fff;border-color:#dfd7cc;min-height:41px; }
body.luxury-v13-1 .finance-fieldset { background:#f8f3e9;border-color:#e3d4ba; }
body.luxury-v13-1 .quick-summary { border-radius:14px;background:#171613;color:#f6efe5;border:0;box-shadow:0 10px 24px rgba(29,26,21,.11); }

body.luxury-v13-1 .panel-toolbar { border-radius:13px;background:#f8f5ef;border:1px solid #eae2d7;padding:10px; }
body.luxury-v13-1 table { font-size:.78rem; }
body.luxury-v13-1 th { background:#f3efe8;padding-top:10px;padding-bottom:10px; }
body.luxury-v13-1 td { padding-top:10px;padding-bottom:10px; }
body.luxury-v13-1 tbody tr:hover td { background:#fbf7f0; }
body.luxury-v13-1 .status-pill { padding:5px 8px; }

body.luxury-v13-1 .login-screen {
  background:
    radial-gradient(520px 340px at 15% 18%,rgba(198,161,95,.12),transparent 65%),
    linear-gradient(145deg,#0f0f0e 0%,#1b1916 55%,#242019 100%);
}
body.luxury-v13-1 .login-card { max-width:430px;border-radius:24px;padding:31px 35px 30px;border-color:rgba(222,194,143,.15); }
body.luxury-v13-1 .login-logo { width:62px;height:62px;border-radius:17px;padding:5px;box-shadow:0 10px 25px rgba(50,39,22,.1); }
body.luxury-v13-1 .login-card h1 { font-size:2.18rem; }
body.luxury-v13-1 .login-copy { max-width:310px; }
body.luxury-v13-1 .login-trust { display:inline-flex;width:auto;padding:5px 9px; }

html[data-theme="dark"] body.luxury-v13-1 .topbar,
html[data-theme="dark"] body.luxury-v13-1 .entry-panel,
html[data-theme="dark"] body.luxury-v13-1 .main-panel { background:#1c1a17;border-color:#373129; }
html[data-theme="dark"] body.luxury-v13-1 fieldset { background:#201d19;border-color:#3a342b; }
html[data-theme="dark"] body.luxury-v13-1 .panel-toolbar { background:#211e1a;border-color:#383229; }

@media (max-width:1100px) {
  body.luxury-v13-1 .app-shell { grid-template-columns:72px minmax(0,1fr);gap:14px; }
  body.luxury-v13-1 .premium-sidebar { padding:18px 10px;align-items:center; }
  body.luxury-v13-1 .premium-sidebar-head div,
  body.luxury-v13-1 .premium-sidebar-caption,
  body.luxury-v13-1 .premium-side-nav .tab span:not(.side-icon),
  body.luxury-v13-1 .premium-sidebar-foot div { display:none; }
  body.luxury-v13-1 .premium-side-nav .tab { justify-content:center;padding:9px; }
  body.luxury-v13-1 .premium-sidebar-head { padding-inline:0; }
  body.luxury-v13-1 .workspace { grid-template-columns:minmax(320px,370px) minmax(0,1fr); }
}
@media (max-width:820px) {
  body.luxury-v13-1 .app-shell { display:block;padding:10px 10px 28px; }
  body.luxury-v13-1 .premium-sidebar { display:none; }
  body.luxury-v13-1 .topbar { margin-bottom:12px; }
  body.luxury-v13-1 .main-panel > .tabs { display:flex; }
  body.luxury-v13-1 .workspace { display:block; }
  body.luxury-v13-1 .entry-panel { position:static;max-height:none;overflow:visible;margin-bottom:12px; }
  body.luxury-v13-1 .metrics-grid { margin-bottom:12px; }
}

/* V13.2 — cleaner invoice entry flow */
.order-details-fieldset {
  padding-bottom: 18px !important;
}

.order-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.order-details-grid label,
.charges-grid label {
  min-width: 0;
}

.order-details-grid .order-payment-method {
  grid-column: 1 / -1;
}

.field-label {
  display: block;
  margin-bottom: 7px;
}

.charges-fieldset .section-note {
  align-self: center;
  padding: 5px 9px;
  border: 1px solid rgba(213, 200, 232, .86);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: #81748f;
  font-size: .66rem;
  font-weight: 760;
  letter-spacing: .035em;
}

.charges-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.charges-grid label {
  padding: 12px;
  border: 1px solid rgba(213, 200, 232, .76);
  border-radius: 14px;
  background: rgba(255,255,255,.72);
}

.charges-grid .charge-featured {
  border-color: color-mix(in srgb, var(--brand-accent) 34%, #ded4e8);
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(248,244,252,.94));
  box-shadow: 0 10px 24px rgba(46,16,82,.055);
}

.charges-grid small {
  display: block;
  margin-top: 7px;
  color: #8b8097;
  font-size: .67rem;
  font-weight: 600;
  line-height: 1.35;
}

.money-input-wrap {
  position: relative;
  display: block;
}

.money-input-wrap .money-prefix {
  position: absolute;
  left: 12px;
  top: 50%;
  z-index: 1;
  transform: translateY(-50%);
  color: #9687a5;
  font-size: .86rem;
  font-weight: 800;
  pointer-events: none;
}

.order-form .money-input-wrap input {
  width: 100%;
  padding-left: 27px;
}

.notes-field {
  display: block;
  margin-top: 12px;
}

@media (max-width: 760px) {
  .order-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .order-details-grid .order-date-field,
  .order-details-grid .order-arrival-field {
    grid-column: auto;
  }

  .order-details-grid .order-payment-method {
    grid-column: 1 / -1;
  }

  .charges-grid {
    grid-template-columns: 1fr;
    gap: 9px;
  }

  .charges-grid label {
    padding: 11px;
  }

  .charges-fieldset .fieldset-row {
    align-items: center;
    gap: 8px;
  }

  .charges-fieldset .section-note {
    font-size: .61rem;
    white-space: nowrap;
  }
}

@media (max-width: 390px) {
  .order-details-grid {
    grid-template-columns: 1fr;
  }

  .order-details-grid .order-payment-method,
  .order-details-grid .order-date-field,
  .order-details-grid .order-arrival-field {
    grid-column: 1;
  }
}


/* V13.3 — mobile item-entry fix + delivery dashboard metric */
.metric-delivery .metric-icon { color: var(--brand-accent); }

@media (max-width: 760px) {
  .item-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
    align-items: end;
  }

  .item-row label:first-child {
    grid-column: 1 / -1 !important;
  }

  .item-row label:nth-child(2),
  .item-row label:nth-child(3) {
    grid-column: auto !important;
    min-width: 0;
  }

  .item-row label:nth-child(2) input,
  .item-row label:nth-child(3) input {
    width: 100% !important;
    min-width: 0 !important;
    text-align: left;
  }

  .item-row .remove-item {
    grid-column: 1 / -1 !important;
    width: 100%;
    min-height: 38px;
    margin-top: 1px;
  }
}

@media (min-width: 761px) {
  .item-row {
    grid-template-columns: minmax(220px, 2.4fr) minmax(90px, .7fr) minmax(120px, .9fr) auto;
  }
}


/* V14 Smart Reminders + Productivity Flow */
.smart-center{margin:18px 0 24px;padding:20px;border:1px solid rgba(190,145,72,.28);border-radius:24px;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(252,248,241,.96));box-shadow:0 14px 40px rgba(35,29,24,.06)}
.smart-center-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:14px}.smart-center-head h3{margin:2px 0 3px;font-family:var(--display-font,Georgia,serif);font-size:1.35rem}.smart-center-head p{margin:0;color:var(--muted,#6f675f)}
.smart-quick-actions{display:flex;flex-wrap:wrap;gap:8px}.smart-quick-actions button{border:1px solid rgba(35,29,24,.11);background:#fff;color:#241f1a;border-radius:999px;padding:9px 13px;font-weight:750;cursor:pointer;box-shadow:0 4px 14px rgba(35,29,24,.04)}.smart-quick-actions button:first-child{background:#211d19;color:#fff;border-color:#211d19}
.smart-reminder-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.smart-reminder{display:grid;grid-template-columns:38px 1fr;text-align:left;gap:10px;align-items:start;padding:14px;border:1px solid rgba(35,29,24,.09);border-radius:18px;background:#fff;cursor:pointer;min-height:104px;transition:.18s ease}.smart-reminder:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(35,29,24,.07)}
.smart-reminder-icon{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#f4efe8;font-weight:900}.smart-reminder-copy{display:flex;flex-direction:column;min-width:0}.smart-reminder-copy small{font-weight:850;color:#2c2722}.smart-reminder-copy strong{font-size:.82rem;color:var(--muted,#716960);font-weight:650;margin-top:3px}.smart-reminder-copy em{font-style:normal;font-size:.76rem;font-weight:850;margin-top:auto;padding-top:12px;color:#9a6920}
.smart-reminder.warning{border-color:rgba(205,148,48,.3);background:#fffaf0}.smart-reminder.danger{border-color:rgba(177,68,68,.24);background:#fff7f6}.smart-reminder.success{border-color:rgba(68,143,97,.22);background:#f7fcf8}.smart-reminder.info{border-color:rgba(61,112,165,.2);background:#f7fbff}.smart-reminder.neutral{background:#faf9f7}
.smart-empty{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:16px;border:1px dashed rgba(35,29,24,.14);border-radius:16px;color:#5f584f}.smart-empty>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#eef7ef}.smart-empty div{display:flex;flex-direction:column}.smart-empty small{color:#827a71}
@media(max-width:1000px){.smart-reminder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-center-head{align-items:flex-start;flex-direction:column}}
@media(max-width:640px){.smart-center{padding:14px;border-radius:18px;margin:12px 0 18px}.smart-reminder-grid{grid-template-columns:1fr}.smart-quick-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.smart-quick-actions button:first-child{grid-column:1/-1}.smart-reminder{min-height:0}.smart-center-head h3{font-size:1.15rem}}


/* V15 — Backup, Export & Safety Center */
.safety-center{display:grid;gap:16px}.safety-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.safety-panel{border:1px solid color-mix(in srgb,var(--border) 82%,#b98a45 18%);border-radius:18px;padding:16px;background:color-mix(in srgb,var(--surface) 95%,#f4eadb 5%);display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.safety-panel h4,.safety-subhead h4{margin:2px 0 4px}.restore-points-wrap,.activity-wrap{border-top:1px solid var(--border);padding-top:14px}.safety-subhead{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:10px}.safety-subhead span{font-size:.78rem;color:var(--muted)}.restore-points-list{display:grid;gap:8px}.restore-point{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.restore-point div{display:grid;gap:2px}.restore-point span{font-size:.75rem;color:var(--muted)}.health-panel{display:block}.health-summary{display:grid;gap:3px;margin-bottom:10px}.health-summary span{font-size:.78rem;color:var(--muted)}.health-issues,.activity-log-list{list-style:none;padding:0;margin:0;display:grid;gap:7px}.health-issues li{padding:8px 10px;border-radius:11px;font-size:.8rem;background:color-mix(in srgb,var(--surface) 85%,#f5ead9 15%)}.health-issues li.error{border-left:3px solid #a63232}.health-issues li.warn{border-left:3px solid #b98a45}.health-issues li.ok{border-left:3px solid #4f7d5d}.activity-log-list li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--border);font-size:.8rem}.activity-log-list time{color:var(--muted);white-space:nowrap;font-size:.74rem}.export-chip-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.safety-grid-bottom{align-items:stretch}
@media(max-width:720px){.safety-grid{grid-template-columns:1fr}.safety-panel{flex-direction:column}.safety-subhead{align-items:flex-start;flex-direction:column}.restore-point{align-items:flex-start}.activity-log-list li{display:grid;gap:3px}.activity-log-list time{white-space:normal}}


/* ============================================================
   V15.2 — Contrast & Visibility overhaul
   Clearer separation, stronger typography, and distinct themes.
   ============================================================ */

html:not([data-theme="dark"]) {
  --bg: #f4f1eb;
  --bg-deep: #ebe5dc;
  --panel: #ffffff;
  --panel-soft: #f8f6f2;
  --panel-strong: #eee8df;
  --ink: #171717;
  --ink-soft: #37332f;
  --muted: #6f685f;
  --line: #d9d1c5;
  --line-strong: #bdb3a5;
  --shadow-sm: 0 2px 8px rgba(35, 29, 22, .08);
  --shadow: 0 12px 34px rgba(35, 29, 22, .10);
  --shadow-lg: 0 24px 60px rgba(35, 29, 22, .14);
}

html:not([data-theme="dark"]) body {
  background: linear-gradient(180deg, #f8f6f2 0%, #f0ece6 100%);
  color: var(--ink);
}

html:not([data-theme="dark"]) .main-panel,
html:not([data-theme="dark"]) .entry-panel,
html:not([data-theme="dark"]) .metric,
html:not([data-theme="dark"]) .table-wrap,
html:not([data-theme="dark"]) .admin-user-form,
html:not([data-theme="dark"]) .admin-security-card,
html:not([data-theme="dark"]) .safety-center,
html:not([data-theme="dark"]) .login-card {
  background: #fff;
  border-color: var(--line);
  box-shadow: var(--shadow-sm);
}

html:not([data-theme="dark"]) input,
html:not([data-theme="dark"]) select,
html:not([data-theme="dark"]) textarea {
  background: #fff;
  color: #171717;
  border-color: #cfc5b7;
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
}

html:not([data-theme="dark"]) input:focus,
html:not([data-theme="dark"]) select:focus,
html:not([data-theme="dark"]) textarea:focus {
  border-color: #9b7a3b;
  box-shadow: 0 0 0 3px rgba(185,138,29,.14);
  outline: none;
}

html:not([data-theme="dark"]) .field-hint,
html:not([data-theme="dark"]) .metric small,
html:not([data-theme="dark"]) .invoice-meta,
html:not([data-theme="dark"]) .login-copy {
  color: #625c54;
}

html:not([data-theme="dark"]) th {
  background: #eee9e1;
  color: #38322b;
  border-color: #d2c9bc;
}

html:not([data-theme="dark"]) td,
html:not([data-theme="dark"]) tbody tr {
  border-color: #e2dbd1;
}

html:not([data-theme="dark"]) tbody tr:hover {
  background: #f7f3ed;
}

html[data-theme="dark"] {
  --bg: #080a0d;
  --bg-deep: #050608;
  --panel: #12151a;
  --panel-soft: #181c22;
  --panel-strong: #20252d;
  --ink: #f8f9fb;
  --ink-soft: #e1e5eb;
  --muted: #aab2bf;
  --line: #303741;
  --line-strong: #4a5361;
  --gold-soft: #342b17;
  --green-soft: #123729;
  --amber-soft: #3c2b12;
  --blue-soft: #142f4a;
  --rose-soft: #3d1926;
}

html[data-theme="dark"] body {
  background: linear-gradient(180deg, #0b0d11 0%, #07090c 100%);
}

html[data-theme="dark"] .main-panel,
html[data-theme="dark"] .entry-panel,
html[data-theme="dark"] .metric,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .admin-user-form,
html[data-theme="dark"] .admin-security-card,
html[data-theme="dark"] .safety-center,
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .confirm-dialog {
  background: #12151a;
  border-color: #343b46;
  box-shadow: 0 16px 44px rgba(0,0,0,.34);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .order-form input,
html[data-theme="dark"] .order-form select,
html[data-theme="dark"] .order-form textarea {
  background: #0c0f13;
  color: #fff;
  border-color: #4a5361;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus {
  border-color: #d4aa52;
  box-shadow: 0 0 0 3px rgba(212,170,82,.16);
  outline: none;
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
  color: #8d97a5;
  opacity: 1;
}

html[data-theme="dark"] th,
html[data-theme="dark"] .invoice-paper th {
  background: #20252d;
  color: #f1f3f6;
  border-color: #3a424e;
}

html[data-theme="dark"] td,
html[data-theme="dark"] tbody tr {
  color: #e1e5eb;
  border-color: #303741;
}

html[data-theme="dark"] tbody tr:hover {
  background: #1a1f26;
}

html[data-theme="dark"] .field-hint,
html[data-theme="dark"] .invoice-meta,
html[data-theme="dark"] .metric small,
html[data-theme="dark"] .login-copy,
html[data-theme="dark"] .developer-credit {
  color: #adb5c1;
}

/* Make theme switching visually obvious */
.theme-toggle-header {
  min-width: 106px;
  justify-content: center;
  font-weight: 800;
  border-width: 1.5px;
}

.theme-toggle-login {
  width: auto;
  min-width: 88px;
  height: 42px;
  padding: 0 13px;
  border-radius: 999px;
  gap: 7px;
  font-weight: 800;
}

.login-theme-label {
  display: inline-block;
  font-size: 12px;
  letter-spacing: .02em;
}

html:not([data-theme="dark"]) .theme-toggle-header,
html:not([data-theme="dark"]) .theme-toggle-login {
  background: #fff;
  color: #28231e;
  border-color: #cfc5b7;
}

html[data-theme="dark"] .theme-toggle-header,
html[data-theme="dark"] .theme-toggle-login {
  background: #252b34;
  color: #f7d98a;
  border-color: #4b5563;
}

/* Stronger visual hierarchy */
.panel-heading h2,
.metric strong,
.quick-summary strong,
.safety-center h2,
.admin-kpis strong {
  color: var(--ink);
}

.eyebrow,
.section-kicker,
.metric-label {
  font-weight: 800;
  letter-spacing: .13em;
}

.button.primary {
  box-shadow: 0 7px 18px rgba(0,0,0,.16);
}

.status-pill,
.badge,
.payment-pill {
  font-weight: 800;
  border: 1px solid rgba(0,0,0,.07);
}

html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .payment-pill {
  border-color: rgba(255,255,255,.12);
}

@media (max-width: 720px) {
  .theme-toggle-header { min-width: 96px; }
  .theme-toggle-login { min-width: 82px; }
}

/* ============================================================
   V15.3 — THEME REPAIR
   Final authoritative overrides. Removes legacy hard-coded
   whites/darks that broke contrast in Light and Dark modes.
   ============================================================ */

/* LIGHT MODE — crisp warm ivory, dark readable text */
html:not([data-theme="dark"]) {
  --bg: #f4f1eb;
  --bg-deep: #ebe5dc;
  --panel: #ffffff;
  --panel-soft: #f8f6f2;
  --panel-strong: #eee8df;
  --ink: #171512;
  --ink-soft: #3d3832;
  --muted: #746b61;
  --line: #ddd4c8;
  --line-strong: #c5b9aa;
}

html:not([data-theme="dark"]) .topbar {
  background: #fffdf9 !important;
  color: #171512 !important;
  border-color: #ddd4c8 !important;
}
html:not([data-theme="dark"]) .topbar .brand-block h1,
html:not([data-theme="dark"]) .topbar .brand-block .eyebrow,
html:not([data-theme="dark"]) .topbar .brand-subtitle,
html:not([data-theme="dark"]) .topbar .top-actions,
html:not([data-theme="dark"]) .topbar .user-chip,
html:not([data-theme="dark"]) .topbar .user-chip *,
html:not([data-theme="dark"]) .topbar .button,
html:not([data-theme="dark"]) .topbar button {
  color: #211d18 !important;
  text-shadow: none !important;
}
html:not([data-theme="dark"]) .topbar .brand-block .eyebrow { color: #9a6d2b !important; }
html:not([data-theme="dark"]) .topbar .brand-subtitle { color: #746b61 !important; }
html:not([data-theme="dark"]) .topbar .button.secondary,
html:not([data-theme="dark"]) .topbar .button.muted,
html:not([data-theme="dark"]) .topbar .theme-toggle-header,
html:not([data-theme="dark"]) .topbar .user-chip {
  background: #f6f1e9 !important;
  border-color: #d7cbbc !important;
}

html:not([data-theme="dark"]) .tabs,
html:not([data-theme="dark"]) .main-panel > .tabs {
  background: #fffdf9 !important;
  border-color: #ddd4c8 !important;
}
html:not([data-theme="dark"]) .tab,
html:not([data-theme="dark"]) .main-panel > .tabs .tab {
  color: #5a5147 !important;
  background: transparent !important;
}
html:not([data-theme="dark"]) .tab:hover,
html:not([data-theme="dark"]) .main-panel > .tabs .tab:hover {
  color: #171512 !important;
  background: #f0e9df !important;
}
html:not([data-theme="dark"]) .tab.active,
html:not([data-theme="dark"]) .main-panel > .tabs .tab.active {
  color: #fff !important;
  background: #211d18 !important;
  box-shadow: 0 6px 16px rgba(33,29,24,.18) !important;
}

html:not([data-theme="dark"]) .table-wrap { background:#fff !important; border-color:#ddd4c8 !important; }
html:not([data-theme="dark"]) table { background:#fff !important; color:#171512 !important; }
html:not([data-theme="dark"]) thead,
html:not([data-theme="dark"]) th { background:#eee8df !important; color:#40382f !important; border-color:#d7cdbf !important; }
html:not([data-theme="dark"]) tbody tr,
html:not([data-theme="dark"]) tbody tr:nth-child(odd),
html:not([data-theme="dark"]) tbody tr:nth-child(even) { background:#fff !important; color:#211d18 !important; }
html:not([data-theme="dark"]) tbody tr:nth-child(even) { background:#faf8f4 !important; }
html:not([data-theme="dark"]) tbody tr:hover { background:#f2ece3 !important; }
html:not([data-theme="dark"]) td { color:#2d2822 !important; border-color:#e4ddd3 !important; }

/* DARK MODE — no white zebra rows, strong separation */
html[data-theme="dark"] {
  --bg: #0c0d0f;
  --bg-deep: #08090b;
  --panel: #151719;
  --panel-soft: #1a1d20;
  --panel-strong: #22262a;
  --ink: #f4f1eb;
  --ink-soft: #ded8cf;
  --muted: #aaa39a;
  --line: #34383e;
  --line-strong: #4a5058;
}
html[data-theme="dark"] body { background:#0c0d0f !important; color:#f4f1eb !important; }
html[data-theme="dark"] .topbar {
  background:#151719 !important;
  color:#f4f1eb !important;
  border-color:#34383e !important;
}
html[data-theme="dark"] .topbar .brand-block h1,
html[data-theme="dark"] .topbar .brand-block .eyebrow,
html[data-theme="dark"] .topbar .brand-subtitle,
html[data-theme="dark"] .topbar .user-chip,
html[data-theme="dark"] .topbar .user-chip *,
html[data-theme="dark"] .topbar .button,
html[data-theme="dark"] .topbar button { color:#f4f1eb !important; }
html[data-theme="dark"] .topbar .brand-block .eyebrow { color:#d3ad6d !important; }
html[data-theme="dark"] .topbar .brand-subtitle { color:#aaa39a !important; }
html[data-theme="dark"] .topbar .button.secondary,
html[data-theme="dark"] .topbar .button.muted,
html[data-theme="dark"] .topbar .theme-toggle-header,
html[data-theme="dark"] .topbar .user-chip {
  background:#202327 !important;
  border-color:#454b53 !important;
  color:#f4f1eb !important;
}

html[data-theme="dark"] .tabs,
html[data-theme="dark"] .main-panel > .tabs {
  background:#151719 !important;
  border-color:#34383e !important;
}
html[data-theme="dark"] .tab,
html[data-theme="dark"] .main-panel > .tabs .tab {
  color:#bbb4aa !important;
  background:transparent !important;
}
html[data-theme="dark"] .tab:hover,
html[data-theme="dark"] .main-panel > .tabs .tab:hover {
  color:#fff !important;
  background:#24282d !important;
}
html[data-theme="dark"] .tab.active,
html[data-theme="dark"] .main-panel > .tabs .tab.active {
  color:#15120e !important;
  background:#d8b370 !important;
  box-shadow:none !important;
}

html[data-theme="dark"] .main-panel,
html[data-theme="dark"] .entry-panel,
html[data-theme="dark"] .metric,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .bulk-actions,
html[data-theme="dark"] .orders-command-header,
html[data-theme="dark"] .smart-center,
html[data-theme="dark"] .safety-center,
html[data-theme="dark"] .safety-panel,
html[data-theme="dark"] .restore-point,
html[data-theme="dark"] .admin-user-form,
html[data-theme="dark"] .admin-security-card {
  background:#151719 !important;
  color:#f4f1eb !important;
  border-color:#34383e !important;
}

html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] table { background:#151719 !important; color:#f4f1eb !important; }
html[data-theme="dark"] thead,
html[data-theme="dark"] th {
  background:#22262a !important;
  color:#ddd5c9 !important;
  border-color:#3b4047 !important;
}
html[data-theme="dark"] tbody,
html[data-theme="dark"] tbody tr,
html[data-theme="dark"] tbody tr:nth-child(odd),
html[data-theme="dark"] tbody tr:nth-child(even),
html[data-theme="dark"] #ordersPanel tbody tr,
html[data-theme="dark"] #ordersPanel tbody tr:nth-child(odd),
html[data-theme="dark"] #ordersPanel tbody tr:nth-child(even) {
  background:#17191c !important;
  color:#f4f1eb !important;
}
html[data-theme="dark"] tbody tr:nth-child(even),
html[data-theme="dark"] #ordersPanel tbody tr:nth-child(even) { background:#1c1f22 !important; }
html[data-theme="dark"] tbody tr:hover,
html[data-theme="dark"] #ordersPanel tbody tr:hover { background:#25292e !important; }
html[data-theme="dark"] td {
  background:transparent !important;
  color:#eee9e1 !important;
  border-color:#34383e !important;
}
html[data-theme="dark"] td small,
html[data-theme="dark"] td .muted,
html[data-theme="dark"] td .invoice-meta { color:#aaa39a !important; }

/* Inputs and controls */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background:#0f1113 !important;
  color:#f7f4ef !important;
  border-color:#484e56 !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color:#8f969f !important; }
html[data-theme="dark"] select option { background:#151719; color:#f4f1eb; }

/* Buttons in tables: never white-on-white */
html[data-theme="dark"] .row-actions .button,
html[data-theme="dark"] .row-actions button,
html[data-theme="dark"] td .button,
html[data-theme="dark"] td button {
  background:#24282d !important;
  color:#f4f1eb !important;
  border-color:#454b53 !important;
}
html[data-theme="dark"] .row-actions .button.primary,
html[data-theme="dark"] .row-actions button.primary,
html[data-theme="dark"] td .button.primary,
html[data-theme="dark"] td button.primary {
  background:#d8b370 !important;
  color:#17130e !important;
  border-color:#d8b370 !important;
}
html[data-theme="dark"] .button.danger,
html[data-theme="dark"] td .button.danger,
html[data-theme="dark"] td button.danger {
  background:#30191c !important;
  color:#ffb8bf !important;
  border-color:#6b343a !important;
}

/* Status / payment color readability */
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .payment-pill {
  background:#272b30 !important;
  color:#f4f1eb !important;
  border-color:#454b53 !important;
}
html[data-theme="dark"] .money-positive,
html[data-theme="dark"] .paid,
html[data-theme="dark"] .text-success { color:#58c789 !important; }
html[data-theme="dark"] .money-negative,
html[data-theme="dark"] .text-danger { color:#ff858f !important; }

/* Keep printable documents light and professional regardless of app theme */
html[data-theme="dark"] .invoice-paper,
html[data-theme="dark"] .statement-paper {
  background:#fff !important;
  color:#171512 !important;
}
html[data-theme="dark"] .invoice-paper td,
html[data-theme="dark"] .invoice-paper th,
html[data-theme="dark"] .statement-paper td,
html[data-theme="dark"] .statement-paper th {
  color:#171512 !important;
  border-color:#ddd4c8 !important;
}
html[data-theme="dark"] .invoice-paper th,
html[data-theme="dark"] .statement-paper th { background:#f1ece4 !important; }

/* Mobile: retain the same contrast rules */
@media (max-width: 760px) {
  html:not([data-theme="dark"]) .tabs { background:#fffdf9 !important; }
  html[data-theme="dark"] .tabs { background:#151719 !important; }
}


/* ============================================================
   V16 — FULLY RESPONSIVE / ADAPTIVE UI
   One codebase for Web, future APK and Windows shell.
   Desktop remains spacious; tablet/mobile become touch-first.
   ============================================================ */

.adaptive-v16 { --mobile-nav-h: 72px; }

/* Medium screens: keep the work area useful before switching to phone mode */
@media (max-width: 1180px) and (min-width: 821px) {
  body.adaptive-v16 .metrics-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  body.adaptive-v16 .workspace { grid-template-columns: minmax(330px, 390px) minmax(0,1fr); }
  body.adaptive-v16 .top-actions { gap: 7px; }
  body.adaptive-v16 .top-actions .button { padding-inline: 11px; }
}

@media (max-width: 820px) {
  body.adaptive-v16 { padding-bottom: calc(var(--mobile-nav-h) + env(safe-area-inset-bottom, 0px)); }
  body.adaptive-v16 .app-shell { display:block !important; width:100%; padding:8px 10px 24px !important; }

  /* Compact, readable mobile header */
  body.adaptive-v16 .topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 10px;
    padding: 12px !important;
    margin: 0 0 12px !important;
    border-radius: 16px !important;
    backdrop-filter: blur(18px);
  }
  body.adaptive-v16 .brand-wrap { min-width:0; gap:10px; }
  body.adaptive-v16 .brand-mark { width:44px !important; height:44px !important; flex:0 0 44px; }
  body.adaptive-v16 .brand-block { min-width:0; }
  body.adaptive-v16 .brand-block h1 { font-size:1.08rem !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  body.adaptive-v16 .brand-block .eyebrow { font-size:.58rem !important; }
  body.adaptive-v16 .brand-subtitle { display:none; }

  body.adaptive-v16 .top-actions {
    display:flex;
    align-items:center;
    gap:7px;
    overflow-x:auto;
    padding:1px 0 3px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  body.adaptive-v16 .top-actions::-webkit-scrollbar { display:none; }
  body.adaptive-v16 .top-actions > * { flex:0 0 auto; }
  body.adaptive-v16 .top-actions .button,
  body.adaptive-v16 .top-actions .file-button,
  body.adaptive-v16 .top-actions .user-chip {
    min-height:36px;
    border-radius:10px;
    padding:7px 10px;
    font-size:.75rem;
  }
  body.adaptive-v16 .top-actions .button svg { width:15px; height:15px; }

  /* The desktop sidebar becomes the native-feeling bottom navigation dock. */
  body.adaptive-v16 .premium-sidebar {
    display:block !important;
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    top:auto !important;
    width:auto !important;
    height:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom, 0px));
    min-height:0 !important;
    z-index:90;
    padding:6px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important;
    border:0 !important;
    border-top:1px solid rgba(255,255,255,.1) !important;
    border-radius:18px 18px 0 0 !important;
    box-shadow:0 -14px 38px rgba(0,0,0,.22) !important;
    overflow:hidden;
  }
  body.adaptive-v16 .premium-sidebar-head,
  body.adaptive-v16 .premium-sidebar-caption,
  body.adaptive-v16 .premium-sidebar-foot { display:none !important; }
  body.adaptive-v16 .premium-side-nav {
    display:flex !important;
    flex-direction:row !important;
    gap:4px !important;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    height:100%;
    align-items:stretch;
  }
  body.adaptive-v16 .premium-side-nav::-webkit-scrollbar { display:none; }
  body.adaptive-v16 .premium-side-nav .tab {
    flex:0 0 72px;
    min-width:72px;
    height:58px;
    min-height:58px;
    display:flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    padding:5px 4px !important;
    border-radius:12px !important;
    font-size:.64rem !important;
    line-height:1.05;
    white-space:nowrap;
  }
  body.adaptive-v16 .premium-side-nav .tab span:not(.side-icon) { display:block !important; }
  body.adaptive-v16 .premium-side-nav .side-icon { font-size:1rem; line-height:1; }

  /* Avoid duplicate navigation strip inside main content on phones. */
  body.adaptive-v16 .main-panel > .tabs { display:none !important; }

  body.adaptive-v16 .dashboard-intro {
    align-items:flex-start;
    gap:10px;
    padding:4px 2px 9px;
  }
  body.adaptive-v16 .dashboard-intro h2 { font-size:1.7rem !important; }
  body.adaptive-v16 .dashboard-intro p:not(.eyebrow) { font-size:.82rem; }
  body.adaptive-v16 .dashboard-new-button {
    min-height:40px;
    padding:9px 12px;
    border-radius:11px;
    font-size:.78rem;
    white-space:nowrap;
  }

  body.adaptive-v16 .metrics-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  body.adaptive-v16 .metric { min-height:96px !important; padding:13px !important; border-radius:15px !important; }
  body.adaptive-v16 .metric strong { margin-top:8px !important; font-size:1.2rem !important; }
  body.adaptive-v16 .metric small { font-size:.67rem; }

  body.adaptive-v16 .workspace { display:block !important; }
  body.adaptive-v16 .entry-panel,
  body.adaptive-v16 .main-panel { width:100%; border-radius:17px !important; }
  body.adaptive-v16 .entry-panel { position:static !important; max-height:none !important; overflow:visible !important; padding:14px !important; margin-bottom:12px; }
  body.adaptive-v16 .main-panel { padding:12px !important; }

  body.adaptive-v16 .field-grid.two,
  body.adaptive-v16 .field-grid.three { grid-template-columns: repeat(2,minmax(0,1fr)); gap:9px; }
  body.adaptive-v16 input,
  body.adaptive-v16 select,
  body.adaptive-v16 textarea,
  body.adaptive-v16 button { font-size:16px; } /* prevents iOS zoom */
  body.adaptive-v16 input,
  body.adaptive-v16 select { min-height:44px; }
  body.adaptive-v16 textarea { min-height:84px; }

  body.adaptive-v16 .orders-command-header,
  body.adaptive-v16 .filter-bar,
  body.adaptive-v16 .bulk-actions,
  body.adaptive-v16 .panel-toolbar { border-radius:14px !important; }
  body.adaptive-v16 .filter-bar,
  body.adaptive-v16 .bulk-actions { display:grid !important; grid-template-columns:1fr 1fr; gap:8px !important; }
  body.adaptive-v16 .filter-bar > *,
  body.adaptive-v16 .bulk-actions > * { min-width:0 !important; width:100% !important; }
  body.adaptive-v16 .filter-bar .search-field { grid-column:1/-1; }

  /* Touch targets */
  body.adaptive-v16 .button,
  body.adaptive-v16 button:not(.tab) { min-height:42px; }
  body.adaptive-v16 .row-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
  body.adaptive-v16 .row-actions button { width:100%; min-height:38px; font-size:.74rem; }

  /* Responsive data tables -> readable cards. Print/invoice tables are untouched. */
  body.adaptive-v16 #ordersPanel .table-wrap,
  body.adaptive-v16 #clientsPanel .table-wrap,
  body.adaptive-v16 #pnlReportPanel .table-wrap,
  body.adaptive-v16 #adminPanel .table-wrap {
    border:0 !important;
    background:transparent !important;
    overflow:visible !important;
  }
  body.adaptive-v16 #ordersPanel table,
  body.adaptive-v16 #clientsPanel table,
  body.adaptive-v16 #pnlReportPanel table,
  body.adaptive-v16 #adminPanel table {
    display:block;
    background:transparent !important;
  }
  body.adaptive-v16 #ordersPanel thead,
  body.adaptive-v16 #clientsPanel thead,
  body.adaptive-v16 #pnlReportPanel thead,
  body.adaptive-v16 #adminPanel thead { display:none; }
  body.adaptive-v16 #ordersPanel tbody,
  body.adaptive-v16 #clientsPanel tbody,
  body.adaptive-v16 #pnlReportPanel tbody,
  body.adaptive-v16 #adminPanel tbody { display:grid; gap:10px; }
  body.adaptive-v16 #ordersPanel tbody tr,
  body.adaptive-v16 #clientsPanel tbody tr,
  body.adaptive-v16 #pnlReportPanel tbody tr,
  body.adaptive-v16 #adminPanel tbody tr {
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:0;
    border:1px solid var(--line) !important;
    border-radius:16px !important;
    overflow:hidden;
    box-shadow:0 8px 22px rgba(0,0,0,.05);
  }
  body.adaptive-v16 #ordersPanel tbody td,
  body.adaptive-v16 #clientsPanel tbody td,
  body.adaptive-v16 #pnlReportPanel tbody td,
  body.adaptive-v16 #adminPanel tbody td {
    display:grid !important;
    grid-template-columns:minmax(74px,.72fr) minmax(0,1fr);
    align-items:center;
    gap:8px;
    min-height:50px;
    padding:10px 11px !important;
    border:0 !important;
    border-bottom:1px solid var(--line) !important;
    background:transparent !important;
    overflow-wrap:anywhere;
  }
  body.adaptive-v16 #ordersPanel tbody td::before,
  body.adaptive-v16 #clientsPanel tbody td::before,
  body.adaptive-v16 #pnlReportPanel tbody td::before,
  body.adaptive-v16 #adminPanel tbody td::before {
    content:attr(data-label);
    font-size:.62rem;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.adaptive-v16 #ordersPanel tbody td.select-col {
    position:static !important;
    display:flex !important;
    min-height:38px;
    grid-column:1/-1;
    justify-content:flex-end;
    padding:7px 10px !important;
  }
  body.adaptive-v16 #ordersPanel tbody td.select-col::before { content:"Select"; margin-right:auto; align-self:center; }
  body.adaptive-v16 #ordersPanel tbody td:last-child,
  body.adaptive-v16 #clientsPanel tbody td:last-child,
  body.adaptive-v16 #adminPanel tbody td:last-child { grid-column:1/-1; }
  body.adaptive-v16 #ordersPanel tbody td:last-child .row-actions { grid-column:1/-1; width:100%; }
  body.adaptive-v16 .empty-state { grid-column:1/-1 !important; display:block !important; text-align:center; padding:22px !important; }
  body.adaptive-v16 .empty-state::before { display:none; }

  /* Dialogs behave like app sheets on small screens. */
  body.adaptive-v16 dialog {
    width:min(100% - 16px, 640px) !important;
    max-height:calc(100dvh - 18px) !important;
    margin:auto;
    border-radius:20px !important;
  }
}

@media (max-width: 520px) {
  body.adaptive-v16 .app-shell { padding-inline:7px !important; }
  body.adaptive-v16 .metrics-grid { grid-template-columns:1fr 1fr !important; }
  body.adaptive-v16 .dashboard-intro { display:grid; grid-template-columns:1fr auto; }
  body.adaptive-v16 .dashboard-intro .eyebrow { grid-column:1; }
  body.adaptive-v16 .field-grid.two,
  body.adaptive-v16 .field-grid.three { grid-template-columns:1fr; }
  body.adaptive-v16 .order-details-grid { grid-template-columns:1fr !important; }
  body.adaptive-v16 .order-details-grid > * { grid-column:1 !important; }
  body.adaptive-v16 .filter-bar,
  body.adaptive-v16 .bulk-actions { grid-template-columns:1fr !important; }

  body.adaptive-v16 #ordersPanel tbody tr,
  body.adaptive-v16 #clientsPanel tbody tr,
  body.adaptive-v16 #pnlReportPanel tbody tr,
  body.adaptive-v16 #adminPanel tbody tr { grid-template-columns:1fr !important; }
  body.adaptive-v16 #ordersPanel tbody td,
  body.adaptive-v16 #clientsPanel tbody td,
  body.adaptive-v16 #pnlReportPanel tbody td,
  body.adaptive-v16 #adminPanel tbody td { grid-template-columns:92px minmax(0,1fr); }
  body.adaptive-v16 #ordersPanel tbody td:last-child,
  body.adaptive-v16 #clientsPanel tbody td:last-child,
  body.adaptive-v16 #adminPanel tbody td:last-child { grid-column:1; }
  body.adaptive-v16 .row-actions { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 360px) {
  body.adaptive-v16 .metrics-grid { grid-template-columns:1fr !important; }
  body.adaptive-v16 .premium-side-nav .tab { flex-basis:68px; min-width:68px; }
}

/* ============================================================
   V16.1 — INVOICE PANEL RESPONSIVE REPAIR
   The New Invoice composer now adapts to its own panel width,
   not only to the browser viewport. This prevents horizontal
   overflow in the desktop split workspace and native shells.
   ============================================================ */
body.adaptive-v16 .entry-panel {
  container-type: inline-size;
  overflow-x: clip;
}
body.adaptive-v16 .entry-panel .order-form,
body.adaptive-v16 .entry-panel .order-form fieldset,
body.adaptive-v16 .entry-panel .items-list,
body.adaptive-v16 .entry-panel .item-row,
body.adaptive-v16 .entry-panel .charges-grid,
body.adaptive-v16 .entry-panel .quick-summary,
body.adaptive-v16 .entry-panel .form-actions {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
body.adaptive-v16 .entry-panel .item-row > *,
body.adaptive-v16 .entry-panel .field-grid > *,
body.adaptive-v16 .entry-panel .order-details-grid > *,
body.adaptive-v16 .entry-panel .charges-grid > * {
  min-width: 0;
}
body.adaptive-v16 .entry-panel input,
body.adaptive-v16 .entry-panel select,
body.adaptive-v16 .entry-panel textarea {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* The normal desktop split panel is usually ~330–440px wide. */
@container (max-width: 470px) {
  body.adaptive-v16 .entry-panel .item-row {
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr) !important;
    gap: 9px !important;
    align-items: end !important;
    width: 100% !important;
  }
  body.adaptive-v16 .entry-panel .item-row label:first-child {
    grid-column: 1 / -1 !important;
  }
  body.adaptive-v16 .entry-panel .item-row label:nth-child(2),
  body.adaptive-v16 .entry-panel .item-row label:nth-child(3) {
    grid-column: auto !important;
    width: 100% !important;
  }
  body.adaptive-v16 .entry-panel .item-row .remove-item {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
  }
  body.adaptive-v16 .entry-panel .charges-grid {
    grid-template-columns: 1fr !important;
  }
  body.adaptive-v16 .entry-panel .quick-summary {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  body.adaptive-v16 .entry-panel .form-actions {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    left: auto !important;
    right: auto !important;
  }
  body.adaptive-v16 .entry-panel .form-actions .button {
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 7px !important;
    white-space: normal !important;
  }
}

@container (max-width: 330px) {
  body.adaptive-v16 .entry-panel .order-details-grid,
  body.adaptive-v16 .entry-panel .field-grid.two,
  body.adaptive-v16 .entry-panel .field-grid.three {
    grid-template-columns: 1fr !important;
  }
  body.adaptive-v16 .entry-panel .order-details-grid > *,
  body.adaptive-v16 .entry-panel .field-grid > * {
    grid-column: 1 !important;
  }
  body.adaptive-v16 .entry-panel .item-row {
    grid-template-columns: 1fr 1fr !important;
  }
  body.adaptive-v16 .entry-panel .form-actions {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   V16.2 — ORDERS PANEL CONTAINER-RESPONSIVE LAYOUT
   The Orders list responds to the actual main-panel width.
   Wide panels keep the full table. Narrow split views become
   compact order cards, preventing horizontal scrolling.
   ============================================================ */
body.adaptive-v16 .main-panel {
  container-type: inline-size;
  container-name: ashka-main;
}

/* Keep desktop orders table contained instead of forcing the page wider. */
body.adaptive-v16 #ordersPanel .table-wrap {
  max-width: 100%;
  min-width: 0;
}
body.adaptive-v16 #ordersPanel table {
  max-width: 100%;
}

@container ashka-main (max-width: 900px) {
  body.adaptive-v16 #ordersPanel .table-wrap {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  body.adaptive-v16 #ordersPanel table,
  body.adaptive-v16 #ordersPanel tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body.adaptive-v16 #ordersPanel thead {
    display: none !important;
  }
  body.adaptive-v16 #ordersPanel tbody {
    display: grid !important;
    gap: 10px !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--line, #ded6ca) !important;
    border-radius: 16px !important;
    background: var(--surface, #fff) !important;
    box-shadow: 0 8px 22px rgba(28,24,20,.045) !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td {
    display: grid !important;
    grid-template-columns: 78px minmax(0,1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 9px 11px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line, #e7dfd4) !important;
    background: transparent !important;
    overflow-wrap: anywhere !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td::before {
    font-size: .58rem;
    font-weight: 850;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--muted, #766d63);
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(1)::before { content: "Select"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(2)::before { content: "Invoice"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(3)::before { content: "Client"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(4)::before { content: "Status"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(5)::before { content: "Arrival"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(6)::before { content: "Total"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(7)::before { content: "Deposit"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(8)::before { content: "Balance"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(9)::before { content: "Profit"; }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(10)::before { content: "Actions"; }

  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(1) {
    grid-column: 1 / -1 !important;
    display: flex !important;
    justify-content: flex-end !important;
    min-height: 36px !important;
    padding-block: 7px !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(1)::before {
    margin-right: auto;
    align-self: center;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(10) {
    grid-column: 1 / -1 !important;
    border-bottom: 0 !important;
    grid-template-columns: 78px minmax(0,1fr) !important;
  }
  body.adaptive-v16 #ordersPanel .row-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
  }
  body.adaptive-v16 #ordersPanel .row-actions button {
    flex: 1 1 92px !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 36px !important;
    padding: 7px 9px !important;
  }
  body.adaptive-v16 #ordersPanel .status-select {
    width: 100% !important;
    max-width: 150px !important;
  }
  body.adaptive-v16 #ordersPanel .empty-state {
    display: block !important;
    width: 100% !important;
    padding: 24px !important;
    text-align: center !important;
  }
  body.adaptive-v16 #ordersPanel .empty-state::before { display:none !important; }
}

@container ashka-main (max-width: 560px) {
  body.adaptive-v16 #ordersPanel tbody tr.order-row {
    grid-template-columns: 1fr !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td,
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(1),
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td:nth-child(10) {
    grid-column: 1 !important;
  }
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td {
    grid-template-columns: 88px minmax(0,1fr) !important;
  }
  body.adaptive-v16 #ordersPanel .row-actions {
    display: grid !important;
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
}

html[data-theme="dark"] body.adaptive-v16 #ordersPanel tbody tr.order-row {
  background: #17191b !important;
  border-color: #34383c !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body.adaptive-v16 #ordersPanel tbody tr.order-row > td {
  border-bottom-color: #2d3135 !important;
  background: transparent !important;
}

/* ============================================================
   V16.3 — ORDERS HARD RESPONSIVE MODE
   JS adds .orders-compact when the Orders panel is physically
   narrower than 1120px. This avoids depending on viewport or
   container-query breakpoints and removes horizontal scrolling.
   ============================================================ */
body.adaptive-v16 #ordersPanel.orders-compact .table-wrap {
  overflow: visible !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.adaptive-v16 #ordersPanel.orders-compact table,
body.adaptive-v16 #ordersPanel.orders-compact tbody {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
body.adaptive-v16 #ordersPanel.orders-compact thead { display:none !important; }
body.adaptive-v16 #ordersPanel.orders-compact tbody {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  border:1px solid var(--line,#ded6ca) !important;
  border-radius:16px !important;
  background:var(--surface,#fff) !important;
  box-shadow:0 8px 22px rgba(28,24,20,.05) !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td {
  display:grid !important;
  grid-template-columns:82px minmax(0,1fr) !important;
  align-items:center !important;
  gap:9px !important;
  min-width:0 !important;
  width:auto !important;
  min-height:48px !important;
  padding:10px 12px !important;
  border:0 !important;
  border-bottom:1px solid var(--line,#e7dfd4) !important;
  background:transparent !important;
  overflow-wrap:anywhere !important;
  white-space:normal !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td::before {
  content:attr(data-label) !important;
  font-size:.6rem !important;
  font-weight:850 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:var(--muted,#766d63) !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td.select-col {
  grid-column:1/-1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  min-height:38px !important;
  padding-block:7px !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td.select-col::before {
  content:"Select" !important;
  margin-right:auto !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td:last-child {
  grid-column:1/-1 !important;
  grid-template-columns:82px minmax(0,1fr) !important;
  border-bottom:0 !important;
}
body.adaptive-v16 #ordersPanel.orders-compact .row-actions {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:7px !important;
  width:100% !important;
}
body.adaptive-v16 #ordersPanel.orders-compact .row-actions button {
  flex:1 1 94px !important;
  width:auto !important;
  min-width:0 !important;
  min-height:38px !important;
  padding:7px 10px !important;
}
body.adaptive-v16 #ordersPanel.orders-compact .status-select {
  width:100% !important;
  max-width:170px !important;
}
html[data-theme="dark"] body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row {
  background:#17191b !important;
  border-color:#34383c !important;
  box-shadow:none !important;
}
html[data-theme="dark"] body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td {
  border-bottom-color:#2d3135 !important;
}
@media (max-width:620px) {
  body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row { grid-template-columns:1fr !important; }
  body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td,
  body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td.select-col,
  body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td:last-child { grid-column:1 !important; }
  body.adaptive-v16 #ordersPanel.orders-compact .row-actions { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}


/* ============================================================
   V17 — COMPACT PROFESSIONAL ORDERS TABLE
   Stable desktop/tablet layout: fewer columns, stacked money,
   compact action menu, no card conversion.
   ============================================================ */
body.adaptive-v16 #ordersPanel.orders-compact .table-wrap,
body.adaptive-v16 #ordersPanel .table-wrap {
  overflow-x:auto !important;
  overflow-y:visible !important;
  scrollbar-gutter:stable;
}
body.adaptive-v16 #ordersPanel.orders-compact table,
body.adaptive-v16 #ordersPanel.orders-compact tbody,
body.adaptive-v16 #ordersPanel table,
body.adaptive-v16 #ordersPanel tbody {
  display:table !important;
  width:100% !important;
  min-width:760px !important;
  max-width:none !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody { display:table-row-group !important; }
body.adaptive-v16 #ordersPanel.orders-compact thead { display:table-header-group !important; }
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row,
body.adaptive-v16 #ordersPanel tbody tr.order-row {
  display:table-row !important;
  width:auto !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
body.adaptive-v16 #ordersPanel.orders-compact tbody tr.order-row > td,
body.adaptive-v16 #ordersPanel tbody tr.order-row > td {
  display:table-cell !important;
  width:auto !important;
  min-width:0 !important;
  padding:12px 10px !important;
  vertical-align:middle !important;
  border-bottom:1px solid var(--line) !important;
  white-space:normal !important;
}
body.adaptive-v16 #ordersPanel tbody tr.order-row > td::before { content:none !important; }
body.adaptive-v16 #ordersPanel th { padding:10px !important; white-space:nowrap; }
body.adaptive-v16 #ordersPanel .select-col { width:34px !important; padding-inline:8px !important; }
body.adaptive-v16 #ordersPanel .order-primary,
body.adaptive-v16 #ordersPanel .order-client { min-width:105px !important; }
body.adaptive-v16 #ordersPanel .order-primary strong,
body.adaptive-v16 #ordersPanel .order-client strong { display:block; margin-bottom:3px; }
body.adaptive-v16 #ordersPanel .order-primary small,
body.adaptive-v16 #ordersPanel .order-client small,
body.adaptive-v16 #ordersPanel .order-profit small { display:block; color:var(--muted); font-size:.72rem; line-height:1.25; }
body.adaptive-v16 #ordersPanel .order-status-cell { min-width:112px !important; }
body.adaptive-v16 #ordersPanel .order-status-cell .status-select { width:100%; min-width:100px; max-width:126px; }
body.adaptive-v16 #ordersPanel .order-arrival { min-width:94px !important; max-width:120px; font-size:.82rem; line-height:1.3; }
body.adaptive-v16 #ordersPanel .order-money-cell { min-width:150px !important; }
body.adaptive-v16 #ordersPanel .order-money-cell > span { display:grid; grid-template-columns:48px 1fr; align-items:baseline; gap:6px; line-height:1.25; }
body.adaptive-v16 #ordersPanel .order-money-cell > span + span { margin-top:3px; }
body.adaptive-v16 #ordersPanel .order-money-cell small { color:var(--muted); font-size:.64rem; font-weight:750; text-transform:uppercase; letter-spacing:.05em; }
body.adaptive-v16 #ordersPanel .order-money-cell strong { text-align:right; font-size:.83rem; }
body.adaptive-v16 #ordersPanel .order-profit { min-width:78px !important; }
body.adaptive-v16 #ordersPanel .order-actions-cell { width:54px !important; position:relative; overflow:visible !important; }
.order-action-menu { position:relative; }
.order-action-menu > summary { list-style:none; cursor:pointer; width:38px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font-weight:900; letter-spacing:.1em; user-select:none; }
.order-action-menu > summary::-webkit-details-marker { display:none; }
.order-action-menu[open] > summary { box-shadow:0 0 0 3px rgba(181,137,67,.12); border-color:var(--accent,#b58943); }
.order-action-popover { position:absolute; z-index:80; right:0; top:40px; min-width:155px; padding:7px; display:grid; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 14px 34px rgba(20,18,16,.18); }
.order-action-popover button { width:100%; border:0; background:transparent; color:var(--text); text-align:left; padding:8px 9px; border-radius:8px; font:inherit; font-size:.78rem; font-weight:700; cursor:pointer; }
.order-action-popover button:hover { background:var(--surface-2,#f4f0ea); }
.order-action-popover .danger-action { color:#b42318; }
html[data-theme="dark"] .order-action-popover { box-shadow:0 18px 42px rgba(0,0,0,.42); }
html[data-theme="dark"] .order-action-popover button:hover { background:#292b2e; }
@media (max-width:860px) {
  body.adaptive-v16 #ordersPanel .table-wrap { overflow-x:auto !important; }
  body.adaptive-v16 #ordersPanel table { min-width:720px !important; }
  body.adaptive-v16 #ordersPanel th,
  body.adaptive-v16 #ordersPanel tbody tr.order-row > td { padding:10px 8px !important; }
}

/* V17.1 — inline order action tray; pushes rows instead of overlapping them */
.order-action-trigger {
  width:38px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  font-weight:900;
  letter-spacing:.1em;
  cursor:pointer;
}
.order-action-trigger:hover,
.order-action-trigger[aria-expanded="true"] {
  border-color:var(--accent,#b58943);
  box-shadow:0 0 0 3px rgba(181,137,67,.12);
}
.order-action-tray-row[hidden] { display:none !important; }
.order-action-tray-row > td {
  padding:0 12px 12px !important;
  border-top:0 !important;
  background:var(--surface-2,#f8f5ef) !important;
}
.order-action-tray {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:7px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
  box-shadow:0 8px 22px rgba(20,18,16,.08);
}
.order-action-tray-label {
  margin-right:auto;
  display:grid;
  gap:1px;
  min-width:96px;
}
.order-action-tray-label strong { font-size:.78rem; }
.order-action-tray-label small { color:var(--muted); font-size:.66rem; }
.order-action-tray button {
  min-height:34px;
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface);
  color:var(--text);
  font:inherit;
  font-size:.75rem;
  font-weight:750;
  cursor:pointer;
}
.order-action-tray button:hover { background:var(--surface-2,#f4f0ea); border-color:var(--accent,#b58943); }
.order-action-tray .danger-action { color:#b42318; margin-left:4px; }
html[data-theme="dark"] .order-action-tray-row > td { background:#171816 !important; }
html[data-theme="dark"] .order-action-tray { background:#20211f; box-shadow:0 10px 26px rgba(0,0,0,.26); }
html[data-theme="dark"] .order-action-tray button { background:#181917; }
html[data-theme="dark"] .order-action-tray button:hover { background:#292b2e; }
@media (max-width:760px) {
  .order-action-tray { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .order-action-tray-label { grid-column:1/-1; }
  .order-action-tray button { width:100%; }
  .order-action-tray .danger-action { margin-left:0; }
}


/* V18 PRO CORE — command center, fast actions, compact direct invoice action */
.global-command{position:relative;min-width:260px;max-width:390px;flex:1 1 300px}
.global-search-wrap{height:42px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--line,#ddd3c2);border-radius:13px;background:var(--surface,#fff);box-shadow:0 8px 24px rgba(31,25,18,.05)}
.global-search-wrap input{border:0!important;box-shadow:none!important;background:transparent!important;min-width:0;width:100%;padding:0!important;height:auto!important;font:inherit;color:inherit}
.global-search-wrap input:focus{outline:0}
.global-search-icon{font-size:18px;opacity:.65}.global-search-wrap kbd{font:700 10px/1 system-ui;padding:5px 6px;border:1px solid var(--line,#ddd3c2);border-radius:7px;opacity:.6;white-space:nowrap}
.global-search-results{position:absolute;z-index:120;left:0;right:0;top:calc(100% + 8px);padding:7px;background:var(--surface,#fff);border:1px solid var(--line,#ddd3c2);border-radius:15px;box-shadow:0 20px 48px rgba(20,16,12,.18);max-height:420px;overflow:auto}
.global-result{width:100%;display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;border:0;background:transparent;color:inherit;text-align:left;padding:10px;border-radius:10px;cursor:pointer}
.global-result:hover,.global-result:focus-visible{background:var(--soft,#f7f2e9);outline:0}.global-result span:nth-child(2){min-width:0}.global-result strong,.global-result small{display:block}.global-result small{opacity:.65;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.global-result-open{font-size:11px;font-weight:800;opacity:.55}.global-result-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--soft,#f7f2e9)}.global-search-empty{padding:16px;text-align:center;opacity:.65}
.quick-action-wrap{position:relative}.quick-action-button{height:42px;white-space:nowrap}.quick-action-menu{position:absolute;z-index:121;right:0;top:calc(100% + 8px);width:230px;padding:7px;background:var(--surface,#fff);border:1px solid var(--line,#ddd3c2);border-radius:15px;box-shadow:0 20px 48px rgba(20,16,12,.18)}
.quick-action-menu button{display:block;width:100%;border:0;background:transparent;color:inherit;text-align:left;padding:10px 11px;border-radius:10px;font-weight:800;cursor:pointer}.quick-action-menu button:hover{background:var(--soft,#f7f2e9)}.quick-action-menu small{display:block;font-weight:500;opacity:.62;margin-top:3px}
.inline-invoice-button{border:1px solid currentColor;border-radius:9px;padding:6px 10px;background:transparent;color:inherit;font-weight:800;font-size:11px;cursor:pointer}.inline-invoice-button:hover{background:var(--ink,#1d1b18);color:var(--paper,#fff)}
.activity-log li span small{display:block;font-size:10px;opacity:.55;margin-top:3px}
@media(max-width:1180px){.top-actions .global-command{order:-2;flex-basis:100%;max-width:none}.quick-action-wrap{order:-1}.global-search-wrap kbd{display:none}}
@media(max-width:720px){.global-command{min-width:100%;width:100%}.global-search-results{position:fixed;left:12px;right:12px;top:84px;max-height:60vh}.quick-action-menu{position:fixed;left:12px;right:12px;bottom:82px;top:auto;width:auto}.quick-action-button{width:100%}}


/* V19 — command surfaces + role-based workspace access */
.command-scrim{position:fixed;inset:0;z-index:108;background:rgba(20,17,14,.28);backdrop-filter:blur(2px)}
.command-scrim[hidden]{display:none!important}
.global-command,.quick-action-wrap{z-index:130}
.global-search-results{position:fixed!important;z-index:132!important;left:50%!important;right:auto!important;top:78px!important;transform:translateX(-50%);width:min(620px,calc(100vw - 28px));max-height:min(520px,68vh);border-radius:18px!important;padding:9px!important;box-shadow:0 28px 80px rgba(18,15,12,.28)!important}
.global-search-results::before{content:"Search results";display:block;padding:8px 10px 6px;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.global-result{padding:12px!important;border:1px solid transparent!important}
.global-result:hover,.global-result:focus-visible{border-color:var(--line)!important}
.quick-action-button{min-width:102px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:7px;color:#fff!important;background:#1f1d1a!important}
.quick-action-menu{position:fixed!important;z-index:132!important;top:78px!important;right:22px!important;width:280px!important;border-radius:18px!important;padding:9px!important;box-shadow:0 28px 80px rgba(18,15,12,.28)!important}
.quick-action-menu::before{content:"Quick actions";display:block;padding:8px 11px 6px;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.quick-action-menu button{padding:12px!important}
html[data-theme="dark"] .command-scrim{background:rgba(0,0,0,.5)}
html[data-theme="dark"] .quick-action-button{background:#f5f0e8!important;color:#151515!important}
@media(max-width:720px){.global-search-results{top:70px!important}.quick-action-menu{top:auto!important;bottom:78px!important;left:12px!important;right:12px!important;width:auto!important}}

.team-center{margin-top:22px}
.role-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0}
.role-legend>div{padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.role-legend strong,.role-legend span{display:block}.role-legend span{margin-top:4px;color:var(--muted);font-size:.78rem;line-height:1.45}
.team-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}.team-table{width:100%;border-collapse:collapse}.team-table th,.team-table td{padding:12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.team-table tr:last-child td{border-bottom:0}.team-table td small{display:block;color:var(--muted);margin-top:3px}
.role-pill{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.08em;border:1px solid var(--line)}.role-admin{background:rgba(181,137,67,.12)}.role-staff{background:rgba(38,132,255,.1)}.role-viewer{background:rgba(120,120,120,.12)}
.team-actions{display:flex;gap:6px;flex-wrap:wrap}.danger-text{color:#b42318!important}.role-preview{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}.role-preview>div{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.permission-chip{padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800;border:1px solid var(--line)}.permission-chip.on{background:rgba(22,163,74,.09);color:#147a38}.permission-chip.off{opacity:.55}.team-member-fields{margin-top:16px}
.read-only-workspace .entry-panel,.read-only-workspace .dashboard-new-button,.read-only-workspace #fabNewOrder,.read-only-workspace .bulk-bar{display:none!important}
@media(max-width:760px){.role-legend{grid-template-columns:1fr}.team-table thead{display:none}.team-table,.team-table tbody,.team-table tr,.team-table td{display:block;width:100%}.team-table tr{padding:10px;border-bottom:1px solid var(--line)}.team-table td{border:0;padding:5px 2px}.team-actions{margin-top:6px}}

/* V20 — topbar polish, finance summary and Super Admin team visibility */
.quick-action-button{
  min-width:138px!important;
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0 14px!important;
  border:1px solid var(--line)!important;
  background:var(--surface,#fff)!important;
  color:var(--text,#201d19)!important;
  box-shadow:0 6px 18px rgba(25,20,15,.06)!important;
  font-weight:850!important;
}
.quick-action-button .quick-action-icon{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:7px;background:var(--soft,#f4eee4);color:var(--accent,#9a6c2f);font-size:16px;line-height:1}
.quick-action-button:hover{border-color:color-mix(in srgb,var(--accent,#b68a4b) 45%,var(--line));transform:translateY(-1px)}
html[data-theme="dark"] .quick-action-button{background:#23211d!important;color:#f8f4ed!important;border-color:#49443c!important;box-shadow:none!important}
html[data-theme="dark"] .quick-action-button .quick-action-icon{background:#34302a;color:#e2bd80}

.quick-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.quick-summary>div{min-width:0}
.quick-summary strong{overflow-wrap:anywhere}
@media(max-width:760px){.quick-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}.quick-action-button{width:auto!important;min-width:132px!important}}
@media(max-width:460px){.quick-summary{grid-template-columns:1fr 1fr!important}.quick-action-button span:last-child{display:inline!important}}

.team-count-button{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:999px;padding:7px 10px;cursor:pointer;font:inherit}
.team-count-button strong{font-size:12px}.team-count-button span{font-size:10px;color:var(--muted);font-weight:800}.team-count-button:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(30,24,18,.08)}
.admin-team-dialog{width:min(860px,calc(100vw - 28px));max-height:min(760px,90vh)}
.admin-team-dialog form{display:grid;gap:16px}
.admin-team-help{padding:11px 13px;border:1px solid var(--line);background:var(--surface-alt,rgba(127,127,127,.05));border-radius:12px;color:var(--muted);font-size:12px}
.admin-team-table-wrap{max-height:300px;border:1px solid var(--line);border-radius:14px}
.admin-team-table-wrap table{min-width:640px}
.admin-team-editor{padding:15px;border:1px solid var(--line);border-radius:14px;background:var(--surface-alt,rgba(127,127,127,.04))}
.admin-team-editor h4{margin:0 0 12px}
html[data-theme="dark"] .team-count-button{background:#22201d;color:#f5f0e8;border-color:#48423a}
@media(max-width:720px){.admin-team-dialog{width:calc(100vw - 16px);max-height:94vh}.admin-team-table-wrap{overflow:auto}.admin-team-editor .field-grid.two{grid-template-columns:1fr}.team-count-button{padding:6px 9px}}


/* V20.1 — anchored search + quick actions, no blur/scrim */
.command-scrim{display:none!important;background:transparent!important;backdrop-filter:none!important}
.global-command,.quick-action-wrap{position:relative!important;z-index:40!important}
.global-search-results{position:absolute!important;z-index:80!important;left:0!important;right:0!important;top:calc(100% + 8px)!important;transform:none!important;width:auto!important;max-height:420px!important;border-radius:15px!important;padding:7px!important;box-shadow:0 18px 42px rgba(20,16,12,.18)!important}
.global-search-results::before{content:none!important}
.quick-action-menu{position:absolute!important;z-index:80!important;top:calc(100% + 8px)!important;right:0!important;left:auto!important;bottom:auto!important;width:250px!important;border-radius:15px!important;padding:7px!important;box-shadow:0 18px 42px rgba(20,16,12,.18)!important}
.quick-action-menu::before{content:none!important}
body.command-overlay-open{overflow:auto!important}
@media(max-width:720px){
  .global-search-results{position:absolute!important;left:0!important;right:0!important;top:calc(100% + 8px)!important;width:auto!important;max-height:56vh!important}
  .quick-action-menu{position:absolute!important;left:auto!important;right:0!important;top:calc(100% + 8px)!important;bottom:auto!important;width:min(280px,calc(100vw - 24px))!important}
}
\n\n/* ============================================================\n   V21 — SEARCH LAYOUT REPAIR + SMART OPERATIONS CENTER\n   Search results participate in topbar layout instead of covering\n   dashboard cards. Compact attention center reuses smart reminders.\n   ============================================================ */\n.global-command{display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-self:flex-start!important}\n.global-search-results{\n  position:static!important;\n  inset:auto!important;\n  transform:none!important;\n  width:100%!important;\n  max-height:228px!important;\n  margin-top:7px!important;\n  overflow:auto!important;\n  border-radius:13px!important;\n  box-shadow:0 10px 28px rgba(24,19,14,.10)!important;\n}\n.global-result{min-height:48px!important;padding:9px 10px!important}\n.global-result:nth-of-type(n+6){display:none!important}\n.global-result-icon{width:28px!important;height:28px!important}\n.global-result-open{font-size:10px!important}\n.top-actions{align-items:flex-start!important}\n.quick-action-wrap,.notification-wrap{position:relative!important;align-self:flex-start!important}\n.quick-action-menu{max-height:280px!important;overflow:auto!important}\n.notification-button{\n  position:relative;display:inline-flex!important;align-items:center!important;gap:7px!important;\n  min-height:42px!important;padding:0 12px!important;border:1px solid var(--line)!important;\n  border-radius:11px!important;background:var(--surface,#fff)!important;color:var(--text,#201d19)!important;\n  font-weight:850!important;box-shadow:0 6px 18px rgba(25,20,15,.05)!important;cursor:pointer\n}\n.notification-button b{display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#a36d2d;color:#fff;font-size:10px;line-height:1}\n.notification-menu{position:absolute;z-index:90;right:0;top:calc(100% + 8px);width:min(340px,calc(100vw - 24px));max-height:360px;overflow:auto;padding:8px;border:1px solid var(--line);border-radius:15px;background:var(--surface,#fff);box-shadow:0 18px 42px rgba(20,16,12,.16)}\n.notification-menu-head{display:flex;align-items:center;justify-content:space-between;padding:7px 8px 9px;border-bottom:1px solid var(--line)}\n.notification-menu-head small,.notification-menu-head strong{display:block}.notification-menu-head small{text-transform:uppercase;letter-spacing:.12em;font-weight:900;font-size:9px;color:var(--muted)}.notification-menu-head strong{margin-top:2px;font-size:13px}.notification-menu-head>span{display:grid;place-items:center;width:25px;height:25px;border-radius:999px;background:var(--soft);font-weight:900}\n.notification-list{display:grid;gap:5px;padding-top:6px}.notification-item{display:grid;grid-template-columns:30px minmax(0,1fr);gap:9px;align-items:center;width:100%;border:0;background:transparent;color:inherit;text-align:left;padding:9px;border-radius:10px;cursor:pointer}.notification-item:hover{background:var(--soft)}.notification-item strong,.notification-item small{display:block}.notification-item strong{font-size:12px}.notification-item small{margin-top:2px;color:var(--muted);font-size:11px;line-height:1.35}.notification-dot{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--soft);font-weight:900}.notification-item.danger .notification-dot{background:#fff0ee;color:#b42318}.notification-item.warning .notification-dot{background:#fff7e5;color:#9c6500}.notification-item.success .notification-dot{background:#eaf8ef;color:#19763b}.notification-empty{padding:16px;text-align:center;color:var(--muted);font-size:12px}\nhtml[data-theme="dark"] .global-search-results,html[data-theme="dark"] .notification-menu{background:#1d1c19!important;border-color:#464139!important;box-shadow:0 18px 42px rgba(0,0,0,.34)!important}html[data-theme="dark"] .notification-button{background:#23211d!important;color:#f8f4ed!important;border-color:#49443c!important}\n@media(max-width:1180px){.top-actions .global-command{flex-basis:100%!important}.global-search-results{max-height:210px!important}.notification-button span:nth-child(2){display:none}}\n@media(max-width:820px){body.adaptive-v16 .top-actions{align-items:flex-start!important}.global-command{min-width:min(330px,82vw)!important;width:min(330px,82vw)!important}.global-search-results{max-height:210px!important}.notification-menu{position:fixed!important;left:12px!important;right:12px!important;top:auto!important;bottom:82px!important;width:auto!important;max-height:52vh!important}}\n\n\n/* ============================================================\n   V22 — STABLE COMMAND TRAY\n   Search and Quick Actions are part of document flow: no overlay,\n   no dashboard collision, no blur.\n   ============================================================ */\nbody.luxury-v13-1 .command-tray{\n  grid-column:2;\n  width:100%;\n  margin:-4px 0 0;\n  padding:12px;\n  border:1px solid var(--line,#e7ded1);\n  border-radius:17px;\n  background:var(--surface,#fffdfa);\n  box-shadow:0 10px 30px rgba(40,31,22,.07);\n  position:relative;\n  z-index:4;\n}\n.command-tray[hidden]{display:none!important}\n.command-tray-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:1px 2px 10px;border-bottom:1px solid var(--line,#e7ded1)}\n.command-tray-head>div{display:grid;gap:2px}.command-tray-kicker{font-size:9px;line-height:1.1;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:#a07840}.command-tray-head strong{font:600 15px/1.2 Georgia,'Times New Roman',serif;color:var(--text,#201d19)}\n.command-tray-close{width:31px;height:31px;display:grid;place-items:center;border:1px solid var(--line,#e7ded1);border-radius:10px;background:var(--soft,#f7f2e9);color:var(--text,#201d19);font-size:20px;line-height:1;cursor:pointer}\n.command-tray .global-search-results,.command-tray .quick-action-menu{\n  position:static!important;inset:auto!important;transform:none!important;width:100%!important;max-width:none!important;\n  margin:10px 0 0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;\n}\n.command-tray-results{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:7px;max-height:220px!important;overflow:auto!important}\n.command-tray-results[hidden],.command-tray-actions[hidden]{display:none!important}\n.command-tray .global-result{min-height:54px!important;padding:9px 10px!important;border:1px solid var(--line,#e7ded1)!important;border-radius:12px!important;background:var(--surface,#fff)!important}\n.command-tray .global-result:hover,.command-tray .global-result:focus-visible{background:var(--soft,#f7f2e9)!important}\n.command-tray .global-result:nth-of-type(n+6){display:grid!important}\n.command-tray-actions{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px!important;max-height:none!important;overflow:visible!important}\n.command-tray-actions[hidden]{display:none!important}\n.command-tray-actions button{display:grid!important;gap:4px!important;min-height:68px!important;padding:11px 12px!important;border:1px solid var(--line,#e7ded1)!important;border-radius:12px!important;background:var(--surface,#fff)!important;color:var(--text,#201d19)!important;text-align:left!important;cursor:pointer!important}\n.command-tray-actions button:hover{background:var(--soft,#f7f2e9)!important}.command-tray-actions b{font-size:12px}.command-tray-actions small{font-size:10px;color:var(--muted,#81786b);line-height:1.3}\nhtml[data-theme="dark"] body.luxury-v13-1 .command-tray{background:#1d1c19;border-color:#454038;box-shadow:0 12px 34px rgba(0,0,0,.28)}\nhtml[data-theme="dark"] .command-tray-head{border-color:#454038}.command-tray html[data-theme="dark"]{}\nhtml[data-theme="dark"] .command-tray .global-result,html[data-theme="dark"] .command-tray-actions button{background:#23211d!important;border-color:#49443c!important;color:#f7f2e9!important}\nhtml[data-theme="dark"] .command-tray .global-result:hover,html[data-theme="dark"] .command-tray-actions button:hover{background:#2d2923!important}\n@media(max-width:1180px){body.luxury-v13-1 .command-tray{grid-column:2}.command-tray-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}\n@media(max-width:860px){body.luxury-v13-1 .command-tray{grid-column:auto;margin:7px 0 4px;padding:10px}.command-tray-results{grid-template-columns:1fr;max-height:260px!important}.command-tray-actions{grid-template-columns:1fr 1fr}}\n@media(max-width:520px){.command-tray-actions{grid-template-columns:1fr}.command-tray-head strong{font-size:14px}}\n
/* V22.1 — cache-safe command center guard */
body.luxury-v13-1 .command-tray { grid-column:2 !important; align-self:start !important; }
body.luxury-v13-1 .command-tray:not([hidden]) + .premium-sidebar { }
.command-tray[hidden], .command-tray-results[hidden], .command-tray-actions[hidden] { display:none !important; }
@media (max-width:820px){ body.luxury-v13-1 .command-tray { grid-column:auto !important; } }


/* V23 Commercial Polish -------------------------------------------------- */
.print-format-select{min-height:40px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);padding:0 34px 0 12px;font:inherit;font-weight:700}
.document-print-menu{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:720px){.print-format-select{flex:1 1 130px}.invoice-paper{padding:18px}}


/* V23 — Commercial polish, stable topbar (global search removed) */
.global-command,.quick-action-wrap,.command-tray,.command-scrim{display:none!important}
.top-actions{align-items:center!important}
.print-format-select{min-height:38px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);padding:0 9px;font-weight:750}
.onboarding-dialog{width:min(720px,calc(100vw - 24px));border:0;border-radius:22px;padding:0;background:var(--surface);color:var(--text);box-shadow:0 30px 90px rgba(0,0,0,.26)}
.onboarding-dialog::backdrop{background:rgba(16,14,12,.42);backdrop-filter:blur(4px)}
.onboarding-card{padding:24px}.onboarding-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}.onboarding-head h2{margin:.15rem 0}.onboarding-step{padding:7px 10px;border-radius:999px;background:var(--soft);font-size:11px;font-weight:850}.onboarding-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.onboarding-grid .wide-label{grid-column:1/-1}.onboarding-actions{display:flex;justify-content:flex-end;margin-top:18px}
@media(max-width:700px){.onboarding-grid{grid-template-columns:1fr}.onboarding-grid .wide-label{grid-column:auto}.invoice-toolbar,.toolbar-actions{flex-wrap:wrap}.print-format-select{flex:1 1 130px}}

/* V24 — Super Admin Control Center */
.admin-control-center{margin:1rem 0 1.25rem;padding:1rem;border:1px solid var(--border);border-radius:18px;background:var(--surface);box-shadow:var(--shadow-sm)}
.admin-control-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.75rem;margin:.9rem 0 1rem}
.admin-control-kpis>div{padding:.9rem;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);min-width:0}
.admin-control-kpis strong{display:block;font-size:1.18rem;line-height:1.2;overflow-wrap:anywhere}.admin-control-kpis span{display:block;font-weight:700;margin-top:.3rem}.admin-control-kpis small{display:block;color:var(--muted);margin-top:.18rem}
.admin-control-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(240px,.7fr);gap:.9rem}.admin-security-events-card,.admin-health-summary-card{border:1px solid var(--border);border-radius:16px;padding:.9rem;background:var(--surface-2)}
.mini-section-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.7rem}.mini-section-head h4{margin:0}.mini-section-head span{color:var(--muted);font-size:.82rem}
.admin-security-events{display:grid;gap:.55rem;max-height:330px;overflow:auto;padding-right:.15rem}.admin-security-event{display:grid;grid-template-columns:10px 1fr;gap:.65rem;padding:.68rem .72rem;border:1px solid var(--border);border-radius:12px;background:var(--surface)}
.admin-security-event strong,.admin-security-event small,.admin-security-event em{display:block}.admin-security-event small{color:var(--muted);margin-top:.12rem}.admin-security-event em{font-style:normal;color:var(--muted);font-size:.82rem;margin-top:.2rem}.security-event-dot{width:9px;height:9px;border-radius:50%;margin-top:.3rem;background:#64748b}.admin-security-event.warning .security-event-dot{background:#d97706}.admin-security-event.danger .security-event-dot,.admin-security-event.critical .security-event-dot{background:#dc2626}.admin-security-event.info .security-event-dot{background:#2563eb}
.admin-health-summary{display:grid;gap:.65rem}.health-summary-row{display:grid;grid-template-columns:12px auto 1fr;align-items:center;gap:.55rem;padding:.65rem;border-radius:12px;background:var(--surface)}.health-dot{width:10px;height:10px;border-radius:50%}.health-dot.good{background:#16a34a}.health-dot.attention{background:#d97706}.health-dot.critical{background:#dc2626}.admin-health-summary p{color:var(--muted);font-size:.82rem;line-height:1.45;margin:.25rem 0 0}
.admin-client-table{min-width:1180px}.health-pill{border:1px solid transparent;border-radius:999px;padding:.38rem .58rem;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer}.health-pill.good{background:rgba(22,163,74,.12);color:#15803d;border-color:rgba(22,163,74,.22)}.health-pill.attention{background:rgba(217,119,6,.12);color:#b45309;border-color:rgba(217,119,6,.22)}.health-pill.critical{background:rgba(220,38,38,.12);color:#b91c1c;border-color:rgba(220,38,38,.22)}
.admin-client-insights-dialog{width:min(980px,94vw);max-height:90vh}.admin-insights-shell{padding:1rem}.client-insight-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.65rem;margin:.5rem 0 1rem}.client-insight-metrics>div{padding:.85rem;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}.client-insight-metrics strong,.client-insight-metrics span{display:block}.client-insight-metrics strong{font-size:1rem;overflow-wrap:anywhere}.client-insight-metrics span{color:var(--muted);font-size:.8rem;margin-top:.25rem}.health-text.good{color:#15803d}.health-text.attention{color:#b45309}.health-text.critical{color:#b91c1c}
.client-insight-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.client-insight-grid>section{border:1px solid var(--border);border-radius:14px;padding:.85rem;background:var(--surface-2);min-width:0}.client-insight-grid>section.wide{grid-column:1/-1}.insight-definition-list{display:grid;gap:.45rem;margin:0}.insight-definition-list>div{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border);padding:.38rem 0}.insight-definition-list>div:last-child{border-bottom:0}.insight-definition-list dt{color:var(--muted)}.insight-definition-list dd{margin:0;font-weight:700;text-align:right}.health-message-list{margin:.25rem 0 0;padding-left:1.15rem;color:var(--muted)}.health-message-list li{margin:.28rem 0}.health-clear{padding:.8rem;border-radius:12px;background:rgba(22,163,74,.08);color:#15803d;font-weight:700}
@media(max-width:1180px){.admin-control-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.client-insight-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.admin-control-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-control-grid,.client-insight-grid{grid-template-columns:1fr}.client-insight-grid>section.wide{grid-column:auto}.client-insight-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-control-center{padding:.75rem}}

/* V24.1 lean super-admin snapshot */
.admin-control-center.compact{padding:1rem 1.05rem}
.admin-control-center.compact .admin-control-kpis{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:0}
.admin-control-center.compact .admin-control-kpis>div{background:linear-gradient(180deg,var(--surface-2),var(--surface));}
@media(max-width:1180px){.admin-control-center.compact .admin-control-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.admin-control-center.compact .admin-control-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* ============================================================
   V26.3 — AUTH VISIBILITY + MOBILE SHELL FIX
   Never allow responsive display rules to override auth visibility.
   ============================================================ */
.login-screen[hidden],
.app-shell[hidden] {
  display: none !important;
}
@media (max-width: 760px) {
  body.adaptive-v16 .app-shell:not([hidden]) {
    display: block !important;
  }
  body.adaptive-v16 .app-shell[hidden] {
    display: none !important;
  }
  .login-screen:not([hidden]) {
    display: grid !important;
  }
}

/* ===== V26.4 MOBILE APP MODE ===== */
@media (max-width: 760px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden !important; }
  body { margin: 0; padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
  .app-shell { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 8px 10px 28px !important; overflow-x: clip !important; }
  .app-shell > * { min-width: 0 !important; max-width: 100%; }

  /* Compact app header */
  .topbar {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px !important;
    padding: 12px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }
  .brand-wrap { display:flex !important; align-items:center !important; gap:10px !important; min-width:0 !important; }
  .brand-mark { width: 44px !important; height:44px !important; border-radius:13px !important; flex:0 0 44px !important; }
  .brand-block { min-width:0 !important; flex:1 1 auto !important; }
  .brand-block .eyebrow { font-size:.62rem !important; letter-spacing:.12em !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .brand-block h1 { font-size:1.14rem !important; line-height:1.12 !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .brand-subtitle { display:none !important; }

  /* Header actions become compact chips, never full-width stacked buttons */
  .top-actions {
    display:flex !important;
    grid-template-columns:none !important;
    flex-wrap:nowrap !important;
    gap:7px !important;
    width:100% !important;
    max-width:100% !important;
    margin-top:10px !important;
    padding:2px 0 4px !important;
    overflow-x:auto !important;
    overscroll-behavior-x:contain;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .top-actions::-webkit-scrollbar { display:none; }
  .top-actions .button,
  .top-actions .file-button,
  .top-actions .user-chip,
  .top-actions #returnAdminBtn,
  .top-actions #logoutBtn {
    flex:0 0 auto !important;
    width:auto !important;
    min-width:auto !important;
    min-height:38px !important;
    height:38px !important;
    padding:0 12px !important;
    border-radius:12px !important;
    font-size:.76rem !important;
    line-height:1 !important;
    grid-column:auto !important;
    justify-self:auto !important;
    white-space:nowrap !important;
  }
  .top-actions .button svg,
  .top-actions .file-button svg { width:15px !important; height:15px !important; }
  .top-actions .user-chip { display:flex !important; align-items:center; }

  /* Never let content force page width */
  .workspace, .entry-panel, .main-panel, .tab-panel, .dashboard-intro,
  .admin-head, .admin-grid, .admin-billing-grid, .admin-control-center,
  .admin-billing-center, .panel-toolbar, .card, .panel, fieldset {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
  .workspace { display:block !important; }
  .entry-panel, .main-panel { margin:0 0 12px !important; }

  /* Super Admin / management sections */
  .admin-head { display:block !important; }
  .admin-head > * + * { margin-top:10px !important; }
  .admin-kpis,
  .admin-control-kpis,
  .admin-billing-kpis { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; }
  .admin-grid,
  .admin-billing-grid { display:grid !important; grid-template-columns:1fr !important; gap:12px !important; }
  .admin-user-form,
  .admin-security-card,
  .admin-control-center,
  .admin-billing-center { padding:14px !important; border-radius:16px !important; }
  .admin-toolbar { display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; }
  .admin-toolbar .search-field { grid-column:1 / -1 !important; width:100% !important; }

  /* Tables scroll INSIDE their own card, never resize the app */
  .table-wrap,
  .admin-client-table-wrap {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    border-radius:14px !important;
  }
  .table-wrap table { width:max-content !important; min-width:700px !important; max-width:none !important; }
  .admin-client-table { width:max-content !important; min-width:1040px !important; max-width:none !important; }
  .table-wrap th, .table-wrap td { white-space:nowrap; }

  /* Dashboard and forms */
  .metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:8px !important; }
  .metric { padding:13px !important; min-width:0 !important; }
  .metric strong { font-size:1.12rem !important; }
  .field-grid.two, .field-grid.three, .field-grid.four { grid-template-columns:1fr !important; }
  input, select, textarea { max-width:100% !important; min-width:0 !important; font-size:16px !important; }
  .item-row { width:100% !important; max-width:100% !important; min-width:0 !important; }

  /* Fixed bottom navigation behaves like a native app */
  .tabs {
    position:fixed !important;
    left:0 !important; right:0 !important; bottom:0 !important; top:auto !important;
    z-index:100 !important;
    width:100% !important; max-width:100% !important;
    display:flex !important;
    gap:4px !important;
    padding:7px 8px calc(7px + env(safe-area-inset-bottom)) !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    border-radius:0 !important;
    background:rgba(22,19,17,.98) !important;
    box-shadow:0 -8px 24px rgba(0,0,0,.20) !important;
    scrollbar-width:none;
  }
  .tabs::-webkit-scrollbar { display:none; }
  .tab {
    flex:0 0 74px !important;
    min-width:74px !important;
    height:52px !important;
    padding:5px 7px !important;
    border-radius:13px !important;
    font-size:.66rem !important;
    line-height:1.1 !important;
  }
  .tab .side-icon { font-size:1rem !important; }

  .fab {
    position:fixed !important;
    right:12px !important;
    bottom:calc(72px + env(safe-area-inset-bottom)) !important;
    z-index:99 !important;
    min-height:46px !important;
    max-width:calc(100vw - 24px) !important;
    padding:0 14px !important;
    border-radius:14px !important;
  }

  /* Dialogs become native-feeling sheets */
  dialog { width:calc(100vw - 20px) !important; max-width:calc(100vw - 20px) !important; max-height:88dvh !important; margin:auto !important; border-radius:20px !important; }
  dialog form { max-width:100% !important; overflow-x:hidden !important; }

  /* Prevent print-oriented layouts affecting phone UI */
  .invoice-paper, .statement-paper { width:100% !important; max-width:100% !important; overflow:hidden !important; }
  .invoice-paper .table-wrap, .statement-paper .table-wrap { overflow-x:auto !important; }
}

@media (max-width: 390px) {
  .metrics-grid, .admin-kpis, .admin-control-kpis, .admin-billing-kpis { grid-template-columns:1fr !important; }
  .admin-toolbar { grid-template-columns:1fr !important; }
  .tab { flex-basis:70px !important; min-width:70px !important; }
}
\n\n/* ============================================================\n   V26.5 — MOBILE NAVIGATION FIX\n   Keep one bottom navigator only (the premium sidebar dock).\n   Avoid duplicate fixed .tabs layers and guarantee touchability.\n   ============================================================ */\n@media (max-width:760px){\n  body.adaptive-v16 .main-panel > .tabs{display:none!important;pointer-events:none!important;}\n  body.adaptive-v16 .premium-sidebar{pointer-events:auto!important;z-index:120!important;}\n  body.adaptive-v16 .premium-side-nav{pointer-events:auto!important;}\n  body.adaptive-v16 .premium-side-nav .tab{pointer-events:auto!important;touch-action:manipulation!important;user-select:none;-webkit-tap-highlight-color:transparent;}\n  body.adaptive-v16 .premium-side-nav .tab.active{position:relative;z-index:1;}\n  .tab-panel[hidden]{display:none!important;}\n  .tab-panel.active{display:block!important;}\n  #profitPanel.active,#pnlReportPanel.active,#settingsPanel.active,#analyticsPanel.active,#clientsPanel.active,#adminPanel.active,#invoicePanel.active,#ordersPanel.active{display:block!important;}\n  .fab{z-index:110!important;}\n}\n

/* ============================================================
   V26.6 — TRUE MOBILE DATA CARDS
   Desktop tables become readable mobile records instead of squeezed columns.
   ============================================================ */
@media (max-width:760px){
  /* Stop old desktop table width rules from forcing the page sideways */
  #ordersPanel .table-wrap,
  #clientsPanel .table-wrap,
  #clientStatement .table-wrap,
  #profitPanel .table-wrap,
  #pnlReportPanel .table-wrap,
  #adminPanel .table-wrap,
  #settingsPanel .table-wrap{
    overflow:visible!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  #ordersPanel table,
  #clientsPanel table,
  #clientStatement table,
  #profitPanel table,
  #pnlReportPanel table,
  #adminPanel table,
  #settingsPanel table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    border:0!important;
    background:transparent!important;
  }

  #ordersPanel thead,
  #clientsPanel thead,
  #clientStatement thead,
  #profitPanel thead,
  #pnlReportPanel thead,
  #adminPanel thead,
  #settingsPanel thead{display:none!important;}

  #ordersPanel tbody,
  #clientsPanel tbody,
  #clientStatement tbody,
  #profitPanel tbody,
  #pnlReportPanel tbody,
  #adminPanel tbody,
  #settingsPanel tbody{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
  }

  #ordersPanel tbody>tr,
  #clientsPanel tbody>tr,
  #clientStatement tbody>tr,
  #profitPanel tbody>tr,
  #pnlReportPanel tbody>tr,
  #adminPanel tbody>tr,
  #settingsPanel tbody>tr{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:10px 12px!important;
    border:1px solid var(--line,#e4dacd)!important;
    border-radius:15px!important;
    background:var(--surface,#fffdfa)!important;
    box-shadow:0 5px 16px rgba(31,24,17,.04)!important;
    overflow:hidden!important;
  }

  #ordersPanel tbody>tr>td,
  #clientsPanel tbody>tr>td,
  #clientStatement tbody>tr>td,
  #profitPanel tbody>tr>td,
  #pnlReportPanel tbody>tr>td,
  #adminPanel tbody>tr>td,
  #settingsPanel tbody>tr>td{
    display:grid!important;
    grid-template-columns:minmax(92px,36%) minmax(0,1fr)!important;
    align-items:start!important;
    gap:9px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    padding:8px 0!important;
    border:0!important;
    border-bottom:1px solid color-mix(in srgb,var(--line,#e4dacd) 72%,transparent)!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:left!important;
    background:transparent!important;
  }

  #ordersPanel tbody>tr>td:last-child,
  #clientsPanel tbody>tr>td:last-child,
  #clientStatement tbody>tr>td:last-child,
  #profitPanel tbody>tr>td:last-child,
  #pnlReportPanel tbody>tr>td:last-child,
  #adminPanel tbody>tr>td:last-child,
  #settingsPanel tbody>tr>td:last-child{border-bottom:0!important;}

  #ordersPanel tbody>tr>td::before,
  #clientsPanel tbody>tr>td::before,
  #clientStatement tbody>tr>td::before,
  #profitPanel tbody>tr>td::before,
  #pnlReportPanel tbody>tr>td::before,
  #adminPanel tbody>tr>td::before,
  #settingsPanel tbody>tr>td::before{
    content:attr(data-label);
    display:block!important;
    min-width:0!important;
    font-size:.63rem!important;
    font-weight:900!important;
    letter-spacing:.08em!important;
    line-height:1.25!important;
    text-transform:uppercase!important;
    color:var(--muted,#7e7469)!important;
  }

  /* Empty states remain simple, full-width messages */
  td.empty-state{
    display:block!important;
    grid-template-columns:none!important;
    padding:18px!important;
    text-align:center!important;
  }
  td.empty-state::before{display:none!important;}

  /* Checkbox/select cell should not consume a full label row */
  #ordersPanel td.select-col,
  #clientStatement td.select-col{
    grid-template-columns:24px 1fr!important;
    min-height:34px!important;
  }
  #ordersPanel td.select-col::before,
  #clientStatement td.select-col::before{content:"Select"!important;}

  /* Order action tray is its own full-width card section */
  #ordersPanel tr.order-action-tray-row{
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  #ordersPanel tr.order-action-tray-row>td{
    display:block!important;
    padding:0 0 4px!important;
    border:0!important;
  }
  #ordersPanel tr.order-action-tray-row>td::before{display:none!important;}

  /* Keep action buttons neat and touch friendly */
  #ordersPanel td:last-child,
  #clientsPanel td:last-child,
  #clientStatement td:last-child,
  #adminPanel td:last-child{
    grid-template-columns:minmax(92px,36%) minmax(0,1fr)!important;
  }
  #ordersPanel td:last-child>*,
  #clientsPanel td:last-child>*,
  #clientStatement td:last-child>*,
  #adminPanel td:last-child>*{
    max-width:100%!important;
  }
  .button.small,.team-count-button,.order-action-trigger{min-height:38px!important;}

  /* Toolbars become vertical mobile controls instead of compressed rows */
  .panel-toolbar,.bulk-toolbar,.statement-bulk-toolbar{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    align-items:stretch!important;
  }
  .panel-toolbar>*,.bulk-toolbar>*,.statement-bulk-toolbar>*{min-width:0!important;max-width:100%!important;}
  .panel-toolbar .toolbar-actions{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    width:100%!important;
  }
  .panel-toolbar .toolbar-actions>*{flex:1 1 132px!important;min-width:0!important;}

  /* Financial summary and charts stack cleanly */
  .profit-layout,.analytics-layout,.client-statement-grid,.statement-kpis{
    display:grid!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    gap:10px!important;
  }

  /* Super admin form and KPI cards are mobile-first */
  .admin-kpis,.admin-control-kpis,.admin-billing-kpis,.client-insight-metrics{
    grid-template-columns:1fr!important;
  }
  .admin-grid,.admin-billing-grid,.client-insight-grid{
    grid-template-columns:1fr!important;
  }
  .admin-control-center,.admin-billing-center,.admin-user-form,.admin-security-card{
    width:100%!important;
    min-width:0!important;
  }

  /* Inputs/actions must never overflow their cards */
  button,.button,select,input,textarea,.file-button{
    max-width:100%!important;
  }
  select,input,textarea{width:100%!important;box-sizing:border-box!important;}

  /* Final hard stop against data overlap */
  main,.main-panel,.tab-panel,.card,.statement-section,.admin-control-center,.admin-billing-center{
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
  }
}

@media(max-width:390px){
  #ordersPanel tbody>tr>td,
  #clientsPanel tbody>tr>td,
  #clientStatement tbody>tr>td,
  #profitPanel tbody>tr>td,
  #pnlReportPanel tbody>tr>td,
  #adminPanel tbody>tr>td,
  #settingsPanel tbody>tr>td{
    grid-template-columns:1fr!important;
    gap:4px!important;
  }
}

/* ============================================================
   V26.7 FINAL MOBILE + BRANDING FREEZE
   Stable mobile-first presentation. No desktop-table squeezing.
   ============================================================ */
.mobile-orders-cards{display:none}

@media (max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  body{padding-bottom:calc(82px + env(safe-area-inset-bottom))!important}
  .app-shell,.main-panel,.tab-panel,.page-content,.workspace,.dashboard-intro{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}

  /* Compact app header */
  .topbar,.app-header{padding:10px 12px!important;gap:8px!important;align-items:center!important}
  .brand-wrap{min-width:0!important;gap:9px!important}
  .brand-mark{width:42px!important;height:42px!important;flex:0 0 42px!important}
  .brand-block{min-width:0!important}
  .brand-block h1,.brand-block h2{font-size:1.05rem!important;line-height:1.1!important;white-space:normal!important}
  .brand-subtitle{font-size:.72rem!important;line-height:1.3!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .top-actions{display:flex!important;gap:6px!important;overflow-x:auto!important;max-width:100%!important;padding-bottom:2px!important;scrollbar-width:none}
  .top-actions::-webkit-scrollbar{display:none}
  .top-actions>.button,.top-actions>button,.top-actions>select,.top-actions>label{flex:0 0 auto!important;min-height:38px!important;width:auto!important;max-width:none!important;padding:0 10px!important;font-size:.72rem!important}

  /* Orders: real mobile cards, desktop table is never used on phones */
  #ordersPanel .desktop-orders-table{display:none!important}
  #ordersPanel .mobile-orders-cards{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;width:100%!important;max-width:100%!important;margin-top:10px!important}
  .mobile-order-card{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;padding:13px!important;border:1px solid var(--line,#e3d8ca)!important;border-radius:17px!important;background:var(--surface,#fffdfa)!important;box-shadow:0 7px 22px rgba(29,22,15,.055)!important;overflow:hidden!important}
  .mobile-order-head{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:9px 11px!important;align-items:start!important}
  .mobile-order-select{grid-row:1/3;display:flex!important;align-items:center!important;gap:5px!important;font-size:.68rem!important;color:var(--muted)!important;padding-top:3px!important}
  .mobile-order-select input{width:18px!important;height:18px!important;margin:0!important}
  .mobile-order-id{min-width:0!important}
  .mobile-order-id strong{display:block!important;font-size:1rem!important;line-height:1.15!important}
  .mobile-order-id small{display:block!important;margin-top:3px!important;color:var(--muted)!important;font-size:.72rem!important}
  .mobile-order-status{grid-column:2;display:flex!important;flex-wrap:wrap!important;gap:6px!important;min-width:0!important}
  .mobile-order-status .status-inline,.mobile-order-status select{width:auto!important;max-width:100%!important;min-width:130px!important;min-height:38px!important;font-size:.78rem!important}
  .mobile-order-client{margin-top:11px!important;padding:10px 11px!important;border-radius:12px!important;background:var(--soft,#f8f2e8)!important;min-width:0!important}
  .mobile-order-client strong{display:block!important;font-size:.91rem!important;overflow-wrap:anywhere!important}
  .mobile-order-client small{display:block!important;margin-top:3px!important;color:var(--muted)!important;font-size:.73rem!important;overflow-wrap:anywhere!important}
  .mobile-order-info-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:10px!important}
  .mobile-order-info-grid>div{min-width:0!important;padding:9px!important;border:1px solid color-mix(in srgb,var(--line,#e3d8ca) 80%,transparent)!important;border-radius:11px!important;background:color-mix(in srgb,var(--surface,#fffdfa) 92%,var(--soft,#f8f2e8))!important}
  .mobile-order-info-grid span{display:block!important;font-size:.59rem!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;color:var(--muted)!important;margin-bottom:4px!important}
  .mobile-order-info-grid strong{display:block!important;font-size:.86rem!important;line-height:1.25!important;overflow-wrap:anywhere!important}
  .mobile-order-info-grid small{display:block!important;font-size:.65rem!important;color:var(--muted)!important;margin-top:2px!important}
  .mobile-order-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;margin-top:11px!important}
  .mobile-order-actions button{width:100%!important;min-width:0!important;min-height:42px!important;border:1px solid var(--line,#e3d8ca)!important;border-radius:11px!important;background:var(--surface,#fffdfa)!important;color:var(--text,#201d19)!important;font-weight:800!important;font-size:.78rem!important;padding:8px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .mobile-order-actions button:first-child{background:#1f1c18!important;color:#fff!important;border-color:#1f1c18!important}
  .mobile-order-actions .danger-action{color:#b42318!important;border-color:rgba(180,35,24,.28)!important;background:rgba(180,35,24,.05)!important}
  .mobile-empty-state{padding:22px 14px!important;border:1px dashed var(--line)!important;border-radius:14px!important;text-align:center!important;color:var(--muted)!important}

  /* Filters & bulk actions stay readable */
  #ordersPanel .filters-row,#ordersPanel .bulk-toolbar{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;width:100%!important;max-width:100%!important}
  #ordersPanel .filters-row>*,#ordersPanel .bulk-toolbar>*{width:100%!important;max-width:100%!important;min-width:0!important}
  #ordersPanel .bulk-toolbar button{min-height:40px!important}

  /* Other data tables: conservative, safe internal scrolling only */
  #clientsPanel .table-wrap,#clientStatement .table-wrap,#profitPanel .table-wrap,#pnlReportPanel .table-wrap,#adminPanel .table-wrap,#settingsPanel .table-wrap,.admin-client-table-wrap{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;border-radius:13px!important}
  #clientsPanel table,#clientStatement table,#profitPanel table,#pnlReportPanel table,#adminPanel table,#settingsPanel table,.admin-client-table{display:table!important;width:max-content!important;min-width:680px!important;max-width:none!important;border-collapse:collapse!important}
  #clientsPanel thead,#clientStatement thead,#profitPanel thead,#pnlReportPanel thead,#adminPanel thead,#settingsPanel thead{display:table-header-group!important}
  #clientsPanel tbody,#clientStatement tbody,#profitPanel tbody,#pnlReportPanel tbody,#adminPanel tbody,#settingsPanel tbody{display:table-row-group!important}
  #clientsPanel tr,#clientStatement tr,#profitPanel tr,#pnlReportPanel tr,#adminPanel tr,#settingsPanel tr{display:table-row!important}
  #clientsPanel td,#clientStatement td,#profitPanel td,#pnlReportPanel td,#adminPanel td,#settingsPanel td,#clientsPanel th,#clientStatement th,#profitPanel th,#pnlReportPanel th,#adminPanel th,#settingsPanel th{display:table-cell!important;white-space:nowrap!important;padding:10px 9px!important;width:auto!important;max-width:none!important}
  #clientsPanel td::before,#clientStatement td::before,#profitPanel td::before,#pnlReportPanel td::before,#adminPanel td::before,#settingsPanel td::before{content:none!important;display:none!important}

  /* KPI and content grids */
  .metrics-grid,.admin-kpis,.admin-control-kpis,.admin-billing-kpis,.statement-kpis{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .metric,.admin-kpi{min-width:0!important;padding:12px!important}
  .metric strong,.admin-kpi strong{font-size:1.05rem!important;overflow-wrap:anywhere!important}
  .admin-grid,.admin-billing-grid,.client-insight-grid,.profit-layout,.analytics-layout,.client-statement-grid{grid-template-columns:1fr!important;gap:10px!important}

  /* One native-feeling bottom nav; horizontal scroll is intentional */
  .premium-sidebar{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;height:auto!important;min-height:72px!important;z-index:150!important;padding:7px 8px calc(7px + env(safe-area-inset-bottom))!important;border-radius:0!important;background:rgba(22,19,17,.985)!important;box-shadow:0 -10px 28px rgba(0,0,0,.24)!important;overflow:hidden!important}
  .premium-sidebar-head,.premium-sidebar-caption,.premium-sidebar-foot{display:none!important}
  .premium-side-nav{display:flex!important;gap:5px!important;width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;scroll-snap-type:x proximity!important}
  .premium-side-nav::-webkit-scrollbar{display:none!important}
  .premium-side-nav .tab{flex:0 0 76px!important;width:76px!important;min-width:76px!important;height:58px!important;display:grid!important;place-items:center!important;align-content:center!important;gap:3px!important;padding:5px 6px!important;border-radius:13px!important;scroll-snap-align:start!important;font-size:.67rem!important;line-height:1.05!important;white-space:normal!important;text-align:center!important;color:#d7cec0!important}
  .premium-side-nav .tab .side-icon{font-size:1.08rem!important;line-height:1!important}
  .premium-side-nav .tab.active{background:#deb66d!important;color:#1c1813!important}
  .main-panel>.tabs{display:none!important}

  /* FAB never covers data */
  .fab{position:fixed!important;right:12px!important;bottom:calc(82px + env(safe-area-inset-bottom))!important;z-index:140!important;min-height:45px!important;max-width:calc(100vw - 24px)!important;padding:0 14px!important;border-radius:14px!important;font-size:.82rem!important}
  #ordersPanel,#clientsPanel,#profitPanel,#pnlReportPanel,#analyticsPanel,#adminPanel,#settingsPanel,#invoicePanel{padding-bottom:18px!important}

  /* Dialogs / forms */
  dialog{width:calc(100vw - 18px)!important;max-width:calc(100vw - 18px)!important;max-height:88dvh!important;border-radius:18px!important}
  .field-grid.two,.field-grid.three,.field-grid.four{grid-template-columns:1fr!important}
  input,select,textarea{font-size:16px!important;max-width:100%!important;box-sizing:border-box!important}
}

@media (max-width:390px){
  .mobile-order-info-grid{grid-template-columns:1fr 1fr!important}
  .mobile-order-actions{grid-template-columns:1fr 1fr!important}
  .metrics-grid,.admin-kpis,.admin-control-kpis,.admin-billing-kpis,.statement-kpis{grid-template-columns:1fr!important}
}


/* V26.8 — Manual final invoice total */
.final-total-field { border-color: color-mix(in srgb, var(--accent, #b28a4a) 36%, transparent) !important; background: color-mix(in srgb, var(--accent, #b28a4a) 5%, transparent); }
.final-total-field .optional-tag { margin-left: 6px; }
@media (max-width: 760px) { .final-total-field { grid-column: 1 / -1; } }

/* V27 — Tracking Center */
.tracking-fieldset{border:1px solid var(--border, #dfe3e8);border-radius:18px;padding:16px;background:var(--surface, #fff)}
.tracking-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tracking-numbers-head{margin-top:14px;align-items:center}
.tracking-numbers-list{display:grid;gap:8px;margin-top:8px}
.tracking-number-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.tracking-number-row input{min-width:0}
.tracking-help{display:block;margin-top:8px;color:var(--muted, #667085)}
.tracking-toolbar{display:grid;grid-template-columns:minmax(220px,1.5fr) minmax(150px,.8fr) minmax(140px,.7fr) minmax(140px,.7fr) auto;gap:10px;align-items:end}
.tracking-summary{display:flex;flex-wrap:wrap;gap:8px 18px;padding:12px 14px;margin:12px 0;border:1px solid var(--border, #e5e7eb);border-radius:14px;background:var(--surface, #fff)}
.tracking-summary strong{font-size:1rem}
.tracking-summary span{color:var(--muted, #667085);margin-right:8px}
.tracking-chip{display:inline-flex;align-items:center;padding:4px 8px;margin:2px 4px 2px 0;border-radius:999px;background:var(--surface-2, #f3f4f6);border:1px solid var(--border, #e5e7eb);font-size:.82rem;white-space:nowrap}
.tracking-table-shell tr[data-tracking-order]{cursor:pointer}
.tracking-table-shell tr[data-tracking-order]:hover{background:var(--surface-2, #f8fafc)}
.tracking-cards{display:none}
.tracking-card{border:1px solid var(--border, #e5e7eb);border-radius:16px;padding:14px;background:var(--surface, #fff);box-shadow:0 8px 24px rgba(15,23,42,.05)}
.tracking-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.tracking-card-head div{display:grid;gap:2px}.tracking-card-head span{color:var(--muted, #667085);font-size:.86rem}
.tracking-card dl{display:grid;gap:8px;margin:0}.tracking-card dl>div{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;padding-top:8px;border-top:1px solid var(--border, #eef2f6)}
.tracking-card dt{color:var(--muted, #667085);font-size:.82rem}.tracking-card dd{margin:0;min-width:0;overflow-wrap:anywhere}

@media (max-width: 900px){
  .tracking-grid{grid-template-columns:1fr 1fr}
  .tracking-toolbar{grid-template-columns:1fr 1fr}
  .tracking-toolbar .search-field{grid-column:1/-1}
}
@media (max-width: 760px){
  .tracking-grid{grid-template-columns:1fr}
  .tracking-toolbar{grid-template-columns:1fr 1fr}
  .tracking-toolbar .search-field,.tracking-toolbar button{grid-column:1/-1}
  .tracking-table-shell{display:none!important}
  .tracking-cards{display:grid;gap:10px}
  .tracking-number-row{grid-template-columns:minmax(0,1fr) auto}
  .tracking-fieldset{padding:14px}
}


/* V27.1 — Tracking Operations Center */
.tracking-bulk-panel,.tracking-editor{border:1px solid var(--border,#e5e7eb);border-radius:18px;background:var(--surface,#fff);padding:16px;margin:12px 0;box-shadow:0 8px 24px rgba(15,23,42,.04)}
.tracking-select-row,.tracking-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.tracking-select-row .check-label{display:flex;align-items:center;gap:8px}
.tracking-bulk-grid,.tracking-editor-grid{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(150px,.8fr) minmax(150px,.8fr) auto;gap:10px;align-items:end}
.tracking-editor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.tracking-editor-head h3{margin:2px 0}.tracking-editor-head p{margin:0;color:var(--muted,#667085)}
.tracking-editor-actions{display:flex;justify-content:flex-end;margin-top:14px}
.tracking-edit-button{width:100%;margin-top:12px}
.tracking-card-head>.check-label{margin-right:2px}
.tracking-card-head>div{flex:1}
.status-pill.processing{background:#fff7df;color:#8a5b00}.status-pill.shipped{background:#e8f1ff;color:#2457a7}.status-pill.delivered{background:#e8f7ee;color:#14783d}
@media(max-width:900px){.tracking-bulk-grid{grid-template-columns:1fr 1fr}.tracking-bulk-grid .button{grid-column:1/-1}.tracking-editor-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.tracking-bulk-grid,.tracking-editor-grid{grid-template-columns:1fr}.tracking-bulk-panel,.tracking-editor{padding:14px}.tracking-select-row,.tracking-editor-head{align-items:flex-start}.tracking-editor-head{flex-direction:column}.tracking-editor-head .button{align-self:flex-end}.tracking-card{overflow:hidden}.tracking-card-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto}.tracking-card dl>div{grid-template-columns:92px minmax(0,1fr)}}
\n\n/* V27.2 Tracking Center - layout + reliable bulk workflow */\n.tracking-selection-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;margin:12px 0;border:1px solid var(--border,#e5e7eb);border-radius:14px;background:var(--surface,#fff)}\n.tracking-selection-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}\n.tracking-selection-actions strong{font-size:.9rem;color:var(--muted,#667085)}\n.tracking-editor,.tracking-bulk-panel{max-width:100%;overflow:hidden}\n.tracking-editor{padding:18px 18px 16px}\n.tracking-editor-grid{grid-template-columns:minmax(220px,1.2fr) minmax(190px,.9fr) minmax(190px,.9fr);gap:14px}\n.tracking-editor-grid label,.tracking-bulk-grid label{min-width:0}\n.tracking-editor-grid input,.tracking-editor-grid select,.tracking-bulk-grid input,.tracking-bulk-grid select{width:100%;min-width:0}\n.tracking-numbers-head{display:flex;justify-content:space-between;gap:12px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border,#e5e7eb)}\n.tracking-number-row{grid-template-columns:minmax(0,1fr) auto;gap:10px}\n.tracking-editor-actions{padding-top:14px;border-top:1px solid var(--border,#e5e7eb)}\n.tracking-table-shell th,.tracking-table-shell td{vertical-align:middle}\n.tracking-table-shell td:last-child{white-space:nowrap}\n.tracking-table-shell .tracking-chip{max-width:180px;overflow:hidden;text-overflow:ellipsis}\n#trackingBulkEditor[hidden],#trackingEditor[hidden],#editSelectedTrackingBtn[hidden]{display:none!important}\n@media(max-width:900px){\n  .tracking-editor-grid,.tracking-bulk-grid{grid-template-columns:1fr 1fr}\n  .tracking-bulk-grid .button{grid-column:1/-1}\n}\n@media(max-width:640px){\n  .tracking-selection-bar{align-items:flex-start;flex-direction:column}\n  .tracking-selection-actions{width:100%;justify-content:space-between}\n  .tracking-editor-grid,.tracking-bulk-grid{grid-template-columns:1fr}\n  .tracking-editor{padding:14px}\n  .tracking-editor-head{gap:8px}\n  .tracking-editor-head .button{align-self:flex-start}\n  .tracking-numbers-head{align-items:flex-start;flex-direction:column}\n  .tracking-numbers-head .button{width:100%}\n  .tracking-number-row{grid-template-columns:1fr}\n  .tracking-number-row .remove-tracking{width:100%}\n  .tracking-editor-actions .button{width:100%}\n}\n

/* V27.3 shared tracking + bulk bag date */
.bulk-tracking-numbers-field{grid-column:1/-1;min-width:0;padding:12px 0 2px}
.bulk-tracking-numbers-field .tracking-numbers-head.compact{margin-top:0;padding-top:0;border-top:0;align-items:center}
.bulk-tracking-numbers-field .tracking-numbers-list{display:grid;gap:10px;margin-top:10px}
.tracking-bulk-grid{align-items:end}
@media(max-width:640px){.bulk-tracking-numbers-field{grid-column:1}.bulk-tracking-numbers-field .tracking-numbers-head.compact{align-items:flex-start}}


/* V27.4 Tracking Center cleanup */
.tracking-toolbar{
  display:grid!important;
  grid-template-columns:minmax(240px,1.25fr) minmax(170px,.7fr) minmax(190px,.8fr) auto!important;
  align-items:end!important;
  gap:12px!important;
}
.tracking-selection-bar{
  position:sticky;
  top:8px;
  z-index:14;
  background:color-mix(in srgb,var(--surface,#fff) 96%,transparent);
  backdrop-filter:blur(8px);
}
.tracking-edit-selected.attention{
  box-shadow:0 10px 24px rgba(25,22,18,.12);
}
.tracking-table-shell{
  overflow-x:auto!important;
  overflow-y:visible!important;
}
#trackingTable{
  width:100%!important;
  min-width:980px!important;
}
#trackingTable th:last-child,
#trackingTable td.tracking-action-cell{
  position:sticky;
  right:0;
  z-index:3;
  background:var(--surface,#fff);
  box-shadow:-8px 0 16px rgba(0,0,0,.035);
}
#trackingTable th:last-child{z-index:4}
.tracking-action-cell .button{white-space:nowrap;min-width:72px}
@media(max-width:760px){
  .tracking-toolbar{grid-template-columns:1fr 1fr!important}
  .tracking-toolbar .search-field{grid-column:1/-1}
  .tracking-toolbar #clearTrackingFiltersBtn{width:100%}
}
@media(max-width:520px){
  .tracking-toolbar{grid-template-columns:1fr!important}
  .tracking-selection-bar{top:0}
  .tracking-selection-actions{width:100%;display:grid!important;grid-template-columns:1fr auto!important;align-items:center}
  .tracking-edit-selected{width:auto!important;min-height:44px}
}


/* ============================================================
   V27.5 — FOCUSED SECTIONS
   Keep the New Invoice / order-entry panel only on Orders.
   All other app sections receive the full content width.
   ============================================================ */
.entry-panel[hidden]{display:none!important;}
.workspace.workspace-full{
  grid-template-columns:minmax(0,1fr)!important;
}
.workspace.workspace-full>.main-panel{
  grid-column:1/-1!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
@media (max-width:760px){
  .workspace.workspace-full{display:block!important;}
  .workspace.workspace-full>.main-panel{width:100%!important;margin:0!important;}
}


/* V27.6 — Bulk tracking account field */
.tracking-bulk-grid{grid-template-columns:minmax(210px,1fr) minmax(180px,.85fr) minmax(170px,.75fr) minmax(240px,1.15fr) auto!important;}
@media(max-width:1100px){.tracking-bulk-grid{grid-template-columns:1fr 1fr!important}.tracking-bulk-grid .bulk-tracking-numbers-field{grid-column:1/-1}.tracking-bulk-grid>.button{grid-column:1/-1}}
@media(max-width:640px){.tracking-bulk-grid{grid-template-columns:1fr!important}}


/* V28.1 — workspace-level white-label WhatsApp reminder settings */
.whatsapp-automation-card{grid-column:1/-1;border:1px solid var(--line,#e5e7eb);border-radius:18px;padding:18px;background:var(--panel,#fff);display:grid;gap:16px;margin:4px 0 18px}
.whatsapp-automation-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.whatsapp-automation-head h3{margin:2px 0 6px}
.connection-pill{display:inline-flex;align-items:center;white-space:nowrap;padding:7px 10px;border-radius:999px;border:1px solid var(--line,#e5e7eb);font-size:12px;font-weight:800;background:var(--soft,#f8fafc)}
.connection-pill.connected{border-color:rgba(22,163,74,.28);background:rgba(22,163,74,.10)}
.whatsapp-automation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.automation-status-row{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px;background:var(--soft,#f8fafc)}
.automation-status-row span{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.68;font-weight:800}
.automation-status-row strong{font-size:13px}
.whatsapp-automation-actions{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:760px){.whatsapp-automation-head{display:grid}.whatsapp-automation-grid{grid-template-columns:1fr}.whatsapp-automation-actions .button{width:100%}}

/* V28.2 — functional workspace WhatsApp reminder settings */
.whatsapp-automation-editable{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.automation-field{display:grid;gap:7px;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:14px;background:var(--soft,#f8fafc)}
.automation-field>span{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.72;font-weight:800}
.automation-field input,.automation-field select{width:100%;min-width:0}
.automation-field small{font-size:11px;line-height:1.45;opacity:.68}
@media(max-width:760px){.whatsapp-automation-editable{grid-template-columns:1fr!important}}

/* ============================================================
   V29 — COMMERCIAL SAAS UI POLISH
   Visual-only design system upgrade. No business logic changes.
   ============================================================ */
:root{
  --v29-content-max: 1680px;
  --v29-control-h: 44px;
  --v29-card-radius: 18px;
  --v29-ease: cubic-bezier(.2,.8,.2,1);
}

/* App frame */
.app-shell{
  max-width:var(--v29-content-max);
  margin:0 auto;
}
.topbar{
  position:sticky;
  top:0;
  z-index:60;
  border:1px solid color-mix(in srgb,var(--line) 78%,transparent);
  border-radius:0 0 18px 18px;
  background:color-mix(in srgb,var(--panel) 92%,transparent);
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
  box-shadow:0 8px 30px rgba(25,22,18,.06);
}
.brand-block h1{letter-spacing:-.025em}
.brand-subtitle{max-width:680px}
.top-actions{gap:7px;align-items:center}
.top-actions .button{min-height:38px;padding:8px 11px;border-radius:11px;font-size:12px}
.top-actions .button svg{width:15px;height:15px}
.user-chip{min-height:38px;display:inline-flex;align-items:center;padding:0 11px;border-radius:11px;border:1px solid var(--line);background:var(--panel-soft);font-weight:700}

/* Sidebar */
.premium-sidebar{
  position:sticky;
  top:94px;
  align-self:start;
  max-height:calc(100vh - 112px);
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:0 12px 34px rgba(25,22,18,.065);
  overflow:hidden;
}
.premium-side-nav{display:grid;gap:5px;padding:6px}
.premium-side-nav .tab{
  min-height:43px;
  border-radius:12px;
  transition:transform .16s var(--v29-ease),background .16s var(--v29-ease),border-color .16s var(--v29-ease);
}
.premium-side-nav .tab:hover{transform:translateX(2px)}
.premium-side-nav .tab.active{box-shadow:0 7px 18px rgba(25,22,18,.10)}
.side-icon{width:24px;text-align:center;opacity:.8}

/* Remove the redundant secondary tab row on desktop — sidebar is the primary nav. */
@media(min-width:761px){
  .main-panel>.tabs{display:none!important}
}

/* Dashboard */
.dashboard-intro{
  border:1px solid var(--line);
  border-radius:22px;
  padding:22px 24px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--panel-strong) 72%,var(--panel)));
  box-shadow:0 12px 32px rgba(25,22,18,.055);
}
.dashboard-intro h2{font-size:clamp(24px,2.4vw,34px);letter-spacing:-.03em}
.dashboard-new-button,.orders-new-button{min-height:44px;border-radius:12px;box-shadow:0 8px 20px rgba(25,22,18,.12)}
.metrics-grid{gap:12px}
.metrics-grid>*{border-radius:16px!important;border:1px solid var(--line)!important;box-shadow:0 7px 22px rgba(25,22,18,.045)!important;transition:transform .18s var(--v29-ease),box-shadow .18s var(--v29-ease)}
.metrics-grid>*:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(25,22,18,.075)!important}

/* Workspace / panels */
.workspace{gap:16px}
.entry-panel,.main-panel{
  border-radius:22px!important;
  border:1px solid var(--line)!important;
  box-shadow:0 12px 34px rgba(25,22,18,.06)!important;
}
.main-panel{overflow:clip}
.tab-panel{padding:20px!important}
.tab-panel.active{animation:v29PanelIn .18s var(--v29-ease)}
@keyframes v29PanelIn{from{opacity:.65;transform:translateY(3px)}to{opacity:1;transform:none}}
.orders-command-header,
.tracking-hero,
.panel-heading{
  border-radius:16px;
}
.orders-command-header h2,
.tracking-hero h2,
.tab-panel h2{letter-spacing:-.025em}

/* Forms */
input,select,textarea{
  min-height:var(--v29-control-h);
  border-radius:12px!important;
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
textarea{min-height:92px}
input:focus,select:focus,textarea:focus{
  outline:none!important;
  border-color:color-mix(in srgb,var(--brand-accent) 45%,var(--line-strong))!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--brand-accent) 9%,transparent)!important;
}
.button,.icon-button{border-radius:11px;transition:transform .14s var(--v29-ease),box-shadow .14s var(--v29-ease),background .14s ease}
.button:hover,.icon-button:hover{transform:translateY(-1px)}
.button:active,.icon-button:active{transform:translateY(0)}
.button.primary{box-shadow:0 8px 20px rgba(25,22,18,.13)}

/* Tables */
.table-wrap,.tracking-table-shell{border:1px solid var(--line);border-radius:16px;overflow:auto;background:var(--panel)}
table{border-collapse:separate!important;border-spacing:0!important}
thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:color-mix(in srgb,var(--panel-strong) 82%,var(--panel));
  backdrop-filter:blur(10px);
  font-size:11px!important;
  letter-spacing:.075em!important;
  text-transform:uppercase;
  white-space:nowrap;
}
tbody td{transition:background .12s ease}
tbody tr:hover td{background:color-mix(in srgb,var(--panel-strong) 48%,var(--panel))}
tbody tr:last-child td{border-bottom:0!important}

/* Toolbars and filter groups */
.panel-toolbar,.tracking-toolbar,.operations-toolbar{
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px!important;
  background:color-mix(in srgb,var(--panel-soft) 84%,var(--panel));
}
.search-field input{font-weight:600}

/* Tracking */
.tracking-selection-bar{
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px 12px;
  background:var(--panel);
  box-shadow:0 7px 22px rgba(25,22,18,.04);
}
.tracking-bulk-panel,.tracking-editor{
  border-radius:18px!important;
  box-shadow:0 14px 34px rgba(25,22,18,.07)!important;
}
.tracking-edit-selected{box-shadow:0 7px 18px rgba(25,22,18,.12)}

/* Status chips */
.status-badge,.badge,.pill,.connection-pill{font-weight:750;letter-spacing:.01em}

/* Responsive polish */
@media(max-width:1100px){
  .topbar{position:relative;top:auto}
  .top-actions{gap:6px}
  .top-actions .button{padding-inline:9px}
}
@media(max-width:760px){
  .app-shell{width:100%;overflow-x:hidden}
  .topbar{border-radius:0;padding:12px!important}
  .brand-subtitle{display:none}
  .top-actions{display:flex;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
  .top-actions::-webkit-scrollbar{display:none}
  .top-actions .button,.user-chip{flex:0 0 auto}
  .dashboard-intro{border-radius:16px;padding:16px}
  .workspace{gap:10px}
  .entry-panel,.main-panel{border-radius:16px!important}
  .tab-panel{padding:14px!important}
  .panel-toolbar,.tracking-toolbar,.operations-toolbar{padding:10px!important}
  .table-wrap,.tracking-table-shell{border-radius:13px}
}

/* Dark-mode surface fidelity */
html[data-theme="dark"] .topbar,
body.dark .topbar{background:color-mix(in srgb,var(--panel) 92%,transparent)}
html[data-theme="dark"] tbody tr:hover td,
body.dark tbody tr:hover td{background:color-mix(in srgb,var(--panel-strong) 58%,var(--panel))}

/* ============================================================
   V30 — MAJOR SaaS REDESIGN
   Strong visual hierarchy, premium navigation, modern surfaces.
   UI-only: no business logic or data behavior changed.
   ============================================================ */
body.v30-redesign{
  --v30-bg:#f3f5f8;
  --v30-surface:#ffffff;
  --v30-ink:#111827;
  --v30-muted:#667085;
  --v30-line:#e6eaf0;
  --v30-dark:#101318;
  --v30-dark-2:#181c23;
  --v30-accent:#7257d9;
  --v30-accent-soft:#f0edff;
  --v30-shadow:0 18px 48px rgba(16,24,40,.08);
  background:var(--v30-bg)!important;
  color:var(--v30-ink)!important;
}

/* Desktop app frame becomes a true product shell */
@media(min-width:1101px){
  body.v30-redesign .app-shell{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:22px 26px 42px 274px!important;
    display:block!important;
  }
  body.v30-redesign .premium-sidebar{
    position:fixed!important;
    inset:18px auto 18px 18px!important;
    width:232px!important;
    max-height:none!important;
    height:auto!important;
    padding:18px 12px 14px!important;
    border:1px solid rgba(255,255,255,.07)!important;
    border-radius:24px!important;
    background:linear-gradient(180deg,#101318 0%,#171b22 100%)!important;
    box-shadow:0 24px 60px rgba(16,24,40,.18)!important;
    z-index:90!important;
  }
  body.v30-redesign .topbar,
  body.v30-redesign .dashboard-intro,
  body.v30-redesign .metrics-grid,
  body.v30-redesign .receivables-alert,
  body.v30-redesign .smart-center,
  body.v30-redesign .workspace{
    width:100%!important;
    max-width:1500px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}

/* Sidebar: stronger brand block + app-like nav */
body.v30-redesign .premium-sidebar::after{display:none!important}
body.v30-redesign .premium-sidebar-head{
  padding:4px 8px 18px!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  margin-bottom:10px!important;
}
body.v30-redesign .premium-sidebar-logo{
  width:44px!important;height:44px!important;border-radius:14px!important;
  background:#fff!important;border:0!important;padding:3px!important;
  box-shadow:0 8px 22px rgba(0,0,0,.25)!important;
}
body.v30-redesign .premium-sidebar-head span{color:#a5adba!important;letter-spacing:.24em!important}
body.v30-redesign .premium-sidebar-head strong{font-family:var(--font-body)!important;font-size:1.08rem!important;letter-spacing:.08em!important;font-weight:800!important}
body.v30-redesign .premium-sidebar-caption{
  margin:10px 10px 8px!important;padding:0!important;border:0!important;
  color:#697281!important;font-size:.58rem!important;letter-spacing:.13em!important;
}
body.v30-redesign .premium-side-nav{gap:4px!important;padding:0!important}
body.v30-redesign .premium-side-nav .tab{
  position:relative!important;
  min-height:46px!important;
  padding:0 13px!important;
  border:1px solid transparent!important;
  border-radius:13px!important;
  background:transparent!important;
  color:#aeb6c3!important;
  font-weight:650!important;
  font-size:.88rem!important;
  justify-content:flex-start!important;
  gap:10px!important;
  box-shadow:none!important;
}
body.v30-redesign .premium-side-nav .tab:hover{
  transform:none!important;background:rgba(255,255,255,.055)!important;color:#fff!important;
}
body.v30-redesign .premium-side-nav .tab.active{
  background:linear-gradient(135deg,rgba(126,101,224,.30),rgba(126,101,224,.14))!important;
  border-color:rgba(166,145,255,.20)!important;
  color:#fff!important;
  box-shadow:inset 3px 0 0 #9b87f5!important;
}
body.v30-redesign .premium-side-nav .tab.active .side-icon{color:#c7bbff!important}
body.v30-redesign .side-icon{font-size:1rem!important;opacity:1!important;width:25px!important}
body.v30-redesign .premium-sidebar-foot{
  margin-top:auto!important;padding:14px 9px 2px!important;border-top:1px solid rgba(255,255,255,.08)!important;
}
body.v30-redesign .premium-sidebar-foot strong{color:#d7dce3!important}
body.v30-redesign .premium-sidebar-foot small{color:#6f7887!important}
body.v30-redesign .premium-live-dot{box-shadow:0 0 0 5px rgba(34,197,94,.08)!important}

/* Topbar: slim command bar instead of a giant header */
body.v30-redesign .topbar{
  min-height:72px!important;
  margin:0 auto 18px!important;
  padding:11px 14px 11px 18px!important;
  border:1px solid var(--v30-line)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 8px 30px rgba(16,24,40,.055)!important;
  backdrop-filter:blur(16px)!important;
  overflow:visible!important;
}
body.v30-redesign .topbar::before,body.v30-redesign .topbar::after{display:none!important}
body.v30-redesign .brand-mark{width:42px!important;height:42px!important;border:0!important;border-radius:13px!important;box-shadow:none!important}
body.v30-redesign .brand-block .eyebrow{display:none!important}
body.v30-redesign .brand-block h1{
  color:var(--v30-ink)!important;font-family:var(--font-body)!important;font-size:1.02rem!important;font-weight:800!important;letter-spacing:-.015em!important;
}
body.v30-redesign .brand-subtitle{font-size:.72rem!important;color:var(--v30-muted)!important;margin-top:2px!important}
body.v30-redesign .top-actions{gap:6px!important;flex-wrap:nowrap!important}
body.v30-redesign .top-actions .button{
  min-height:38px!important;border-radius:10px!important;background:#fff!important;border:1px solid var(--v30-line)!important;color:#475467!important;box-shadow:none!important;
}
body.v30-redesign .top-actions .button:hover{background:#f7f8fa!important;color:#101828!important;border-color:#d7dce3!important}
body.v30-redesign .user-chip{
  min-height:38px!important;background:#f6f3ff!important;border-color:#e4ddff!important;color:#5c47bd!important;border-radius:10px!important;
}

/* Dashboard hero now looks like a premium product home */
body.v30-redesign .dashboard-intro{
  position:relative!important;overflow:hidden!important;
  margin-top:0!important;margin-bottom:14px!important;
  padding:28px 30px!important;
  border:0!important;border-radius:24px!important;
  background:linear-gradient(118deg,#121722 0%,#202636 58%,#493b83 100%)!important;
  color:#fff!important;
  box-shadow:0 18px 44px rgba(16,24,40,.14)!important;
}
body.v30-redesign .dashboard-intro::after{
  content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-65px;top:-110px;
  background:radial-gradient(circle,rgba(184,169,255,.35),rgba(184,169,255,0) 70%);pointer-events:none;
}
body.v30-redesign .dashboard-intro .eyebrow{color:#bcb0f5!important;letter-spacing:.13em!important}
body.v30-redesign .dashboard-intro h2{color:#fff!important;font-size:clamp(2rem,3vw,2.8rem)!important;font-weight:760!important;letter-spacing:-.045em!important}
body.v30-redesign .dashboard-intro p:not(.eyebrow){color:#bac2cf!important;max-width:620px!important;font-size:.92rem!important}
body.v30-redesign .dashboard-new-button{
  position:relative;z-index:2;min-height:46px!important;padding:0 18px!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:13px!important;
  background:#fff!important;color:#171b22!important;font-weight:780!important;box-shadow:0 12px 28px rgba(0,0,0,.18)!important;
}

/* KPI cards: bolder typography and unique SaaS silhouette */
body.v30-redesign .metrics-grid{gap:12px!important;margin-bottom:14px!important}
body.v30-redesign .metrics-grid>*{
  min-height:126px!important;padding:18px!important;border:1px solid var(--v30-line)!important;border-radius:19px!important;
  background:#fff!important;box-shadow:0 8px 24px rgba(16,24,40,.045)!important;transform:none!important;
}
body.v30-redesign .metrics-grid>*:hover{transform:translateY(-3px)!important;box-shadow:0 16px 34px rgba(16,24,40,.08)!important}
body.v30-redesign .metric-card .metric-value,body.v30-redesign .metric-value{font-size:1.8rem!important;letter-spacing:-.04em!important;font-weight:800!important;color:#101828!important}
body.v30-redesign .metric-card .metric-label,body.v30-redesign .metric-label{color:#667085!important;font-size:.75rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.06em!important}

/* Main content = cleaner, flatter product surfaces */
body.v30-redesign .workspace{gap:14px!important}
body.v30-redesign .entry-panel,body.v30-redesign .main-panel{
  border:1px solid var(--v30-line)!important;border-radius:22px!important;background:#fff!important;
  box-shadow:0 10px 30px rgba(16,24,40,.055)!important;
}
body.v30-redesign .entry-panel{padding:18px!important}
body.v30-redesign .main-panel{overflow:hidden!important}
body.v30-redesign .tab-panel{padding:22px!important}
body.v30-redesign .panel-heading{
  padding-bottom:14px!important;margin-bottom:12px!important;border-bottom:1px solid #edf0f4!important;border-radius:0!important;
}
body.v30-redesign .panel-heading .eyebrow{color:#7b61d1!important}
body.v30-redesign .panel-heading h2,body.v30-redesign .tab-panel h2{font-family:var(--font-body)!important;font-weight:780!important;color:#101828!important}

/* Field groups now read as designed sections */
body.v30-redesign fieldset{
  margin:0 0 14px!important;padding:15px!important;border:1px solid #e9edf2!important;border-radius:16px!important;background:#fbfcfd!important;
}
body.v30-redesign legend{padding:0 6px!important;color:#344054!important;font-size:.78rem!important;font-weight:800!important;letter-spacing:.035em!important}
body.v30-redesign label{color:#475467!important;font-weight:650!important}
body.v30-redesign input,body.v30-redesign select,body.v30-redesign textarea{
  min-height:44px!important;background:#fff!important;border:1px solid #dfe4ea!important;border-radius:11px!important;color:#101828!important;box-shadow:0 1px 2px rgba(16,24,40,.025)!important;
}
body.v30-redesign input:focus,body.v30-redesign select:focus,body.v30-redesign textarea:focus{
  border-color:#9b87f5!important;box-shadow:0 0 0 4px rgba(114,87,217,.10)!important;
}

/* Buttons */
body.v30-redesign .button,body.v30-redesign .icon-button{border-radius:10px!important;font-weight:720!important}
body.v30-redesign .button.primary{
  background:linear-gradient(135deg,#171b22,#303744)!important;color:#fff!important;border:1px solid #171b22!important;box-shadow:0 8px 18px rgba(16,24,40,.16)!important;
}
body.v30-redesign .button.primary:hover{background:#0f1319!important;filter:none!important}
body.v30-redesign .button.secondary{background:#fff!important;border:1px solid #dfe4ea!important;color:#344054!important}
body.v30-redesign .button.secondary:hover{background:#f8f9fb!important;border-color:#cfd5dd!important}

/* Page command areas */
body.v30-redesign .orders-command-header,body.v30-redesign .tracking-hero{
  padding:19px 20px!important;margin-bottom:14px!important;border:1px solid #e6eaf0!important;border-radius:18px!important;
  background:linear-gradient(135deg,#fbfcfd,#f6f7fb)!important;box-shadow:none!important;
}
body.v30-redesign .panel-toolbar,body.v30-redesign .tracking-toolbar,body.v30-redesign .operations-toolbar{
  padding:10px!important;border:1px solid #e7ebf0!important;border-radius:14px!important;background:#f8f9fb!important;box-shadow:none!important;
}

/* Tables: app-grid feel */
body.v30-redesign .table-wrap,body.v30-redesign .tracking-table-shell{
  border:1px solid #e5e9ef!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important;
}
body.v30-redesign thead th{
  height:44px!important;background:#f7f8fa!important;color:#667085!important;border-bottom:1px solid #e5e9ef!important;
  font-size:.67rem!important;font-weight:800!important;letter-spacing:.075em!important;
}
body.v30-redesign tbody td{height:48px!important;color:#344054!important;border-bottom:1px solid #eef1f4!important}
body.v30-redesign tbody tr:hover td{background:#fafbfc!important}
body.v30-redesign .status-badge,body.v30-redesign .badge,body.v30-redesign .pill,body.v30-redesign .connection-pill{
  border-radius:999px!important;padding:5px 9px!important;font-size:.69rem!important;font-weight:800!important;
}

/* Tracking selection looks like a real bulk-action command bar */
body.v30-redesign .tracking-selection-bar{
  min-height:54px!important;padding:9px 11px!important;border:1px solid #ded8fa!important;border-radius:14px!important;
  background:#f6f3ff!important;box-shadow:none!important;
}
body.v30-redesign .tracking-edit-selected{background:#171b22!important;color:#fff!important;border-color:#171b22!important}
body.v30-redesign .tracking-bulk-panel,body.v30-redesign .tracking-editor{
  border:1px solid #e3e7ed!important;border-radius:18px!important;background:#fff!important;box-shadow:0 18px 46px rgba(16,24,40,.10)!important;
}

/* Dark theme keeps the same redesign language */
html[data-theme="dark"] body.v30-redesign{
  --v30-bg:#0f1217;--v30-surface:#161a20;--v30-ink:#f4f6f8;--v30-muted:#98a2b3;--v30-line:#282e37;
  background:#0f1217!important;color:#f4f6f8!important;
}
html[data-theme="dark"] body.v30-redesign .topbar,
html[data-theme="dark"] body.v30-redesign .entry-panel,
html[data-theme="dark"] body.v30-redesign .main-panel,
html[data-theme="dark"] body.v30-redesign .metrics-grid>*{background:#171b21!important;border-color:#292f38!important}
html[data-theme="dark"] body.v30-redesign .brand-block h1,
html[data-theme="dark"] body.v30-redesign .panel-heading h2,
html[data-theme="dark"] body.v30-redesign .tab-panel h2,
html[data-theme="dark"] body.v30-redesign .metric-value{color:#f5f7fa!important}
html[data-theme="dark"] body.v30-redesign fieldset,
html[data-theme="dark"] body.v30-redesign .panel-toolbar,
html[data-theme="dark"] body.v30-redesign .tracking-toolbar,
html[data-theme="dark"] body.v30-redesign .operations-toolbar{background:#13171c!important;border-color:#292f38!important}
html[data-theme="dark"] body.v30-redesign input,
html[data-theme="dark"] body.v30-redesign select,
html[data-theme="dark"] body.v30-redesign textarea{background:#1b2027!important;border-color:#303741!important;color:#f4f6f8!important}
html[data-theme="dark"] body.v30-redesign .table-wrap,
html[data-theme="dark"] body.v30-redesign .tracking-table-shell{background:#171b21!important;border-color:#292f38!important}
html[data-theme="dark"] body.v30-redesign thead th{background:#1b2027!important;color:#aab2bf!important;border-color:#303741!important}
html[data-theme="dark"] body.v30-redesign tbody td{color:#d7dce3!important;border-color:#262c34!important}
html[data-theme="dark"] body.v30-redesign tbody tr:hover td{background:#1c2229!important}

/* Tablet/mobile: retain the proven bottom nav but carry new visual language */
@media(max-width:1100px){
  body.v30-redesign .app-shell{background:var(--v30-bg)!important}
  body.v30-redesign .topbar{border-radius:16px!important}
}
@media(max-width:760px){
  body.v30-redesign .app-shell{padding:0 10px 92px!important;background:var(--v30-bg)!important}
  body.v30-redesign .topbar{margin:8px 0 10px!important;padding:10px!important;border-radius:14px!important}
  body.v30-redesign .brand-mark{width:38px!important;height:38px!important}
  body.v30-redesign .brand-block h1{font-size:.95rem!important}
  body.v30-redesign .dashboard-intro{padding:20px!important;border-radius:18px!important}
  body.v30-redesign .dashboard-intro h2{font-size:1.85rem!important}
  body.v30-redesign .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  body.v30-redesign .metrics-grid>*{min-height:104px!important;padding:14px!important;border-radius:15px!important}
  body.v30-redesign .entry-panel,body.v30-redesign .main-panel{border-radius:16px!important}
  body.v30-redesign .tab-panel{padding:13px!important}
  body.v30-redesign .premium-sidebar{background:#11151b!important;border-top:1px solid #2a3038!important}
  body.v30-redesign .premium-side-nav .tab{min-height:50px!important;border-radius:12px!important;padding:4px 6px!important;justify-content:center!important}
  body.v30-redesign .premium-side-nav .tab.active{box-shadow:inset 0 3px 0 #9b87f5!important}
}
@media(max-width:520px){
  body.v30-redesign .metrics-grid{grid-template-columns:1fr 1fr!important}
  body.v30-redesign .dashboard-new-button{min-height:42px!important;padding:0 13px!important}
}


/* ============================================================
   V31 — ADVANCED UX / NOTIFICATION CENTER
   Safe visual upgrade layered over V30.2. No order/tracking logic changes.
   ============================================================ */
.v31-notification-trigger{position:relative;display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);color:var(--text);font-weight:800;cursor:pointer;box-shadow:0 6px 18px rgba(25,20,15,.05);transition:.18s ease}
.v31-notification-trigger:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent,#9a6c2f) 42%,var(--line))}.v31-bell{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--soft);font-size:14px}.v31-notification-trigger b{display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#a46d2d;color:#fff;font-size:10px}.v31-notification-trigger b[hidden]{display:none}
.v31-drawer-scrim{position:fixed;inset:0;z-index:279;background:rgba(18,16,14,.28);backdrop-filter:blur(2px)}.v31-drawer-scrim[hidden]{display:none!important}
.v31-notification-drawer{position:fixed;z-index:280;top:0;right:0;width:min(430px,94vw);height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;background:var(--surface,#fffdfa);border-left:1px solid var(--line);box-shadow:-28px 0 70px rgba(22,18,14,.18);transform:translateX(104%);transition:transform .24s cubic-bezier(.2,.75,.2,1);overflow:hidden}.v31-notification-drawer.open{transform:translateX(0)}body.v31-drawer-open{overflow:hidden}
.v31-drawer-head{display:flex;justify-content:space-between;gap:18px;padding:25px 24px 20px;border-bottom:1px solid var(--line)}.v31-drawer-head span{font-size:9px;font-weight:900;letter-spacing:.17em;color:var(--accent,#9a6c2f)}.v31-drawer-head h2{margin:5px 0 4px;font:650 24px/1.1 Georgia,'Times New Roman',serif}.v31-drawer-head p{margin:0;color:var(--muted);font-size:12px}.v31-drawer-close{width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:var(--soft);color:inherit;font-size:24px;line-height:1;cursor:pointer}
.v31-drawer-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px 16px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--soft) 58%,transparent)}.v31-drawer-summary>div{padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.v31-drawer-summary small,.v31-drawer-summary strong{display:block}.v31-drawer-summary small{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-weight:800}.v31-drawer-summary strong{margin-top:5px;font-size:20px}
.v31-drawer-list{overflow:auto;padding:14px 16px 22px;display:grid;align-content:start;gap:9px}.v31-notification-card{display:grid;grid-template-columns:38px minmax(0,1fr);gap:11px;width:100%;padding:13px;border:1px solid var(--line);border-radius:15px;background:var(--surface);color:inherit;text-align:left;cursor:pointer;transition:.16s ease}.v31-notification-card:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(24,19,15,.08);border-color:color-mix(in srgb,var(--accent,#9a6c2f) 32%,var(--line))}.v31-notification-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--soft);font-weight:900}.v31-notification-card.warning .v31-notification-icon{background:#fff6df;color:#946000}.v31-notification-card.danger .v31-notification-icon{background:#fff0ed;color:#b42318}.v31-notification-card.success .v31-notification-icon{background:#eaf8ef;color:#19763b}.v31-notification-card.info .v31-notification-icon{background:#eef4ff;color:#3158a5}.v31-notification-copy strong,.v31-notification-copy small,.v31-notification-copy em{display:block}.v31-notification-copy strong{font-size:13px}.v31-notification-copy small{margin-top:3px;color:var(--muted);font-size:11px;line-height:1.45}.v31-notification-copy em{margin-top:8px;color:var(--accent,#9a6c2f);font-size:10px;font-style:normal;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.v31-all-clear{display:grid;place-items:center;text-align:center;padding:55px 18px;color:var(--muted)}.v31-all-clear span{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#eaf8ef;color:#19763b;font-size:20px;margin-bottom:12px}.v31-all-clear strong{color:var(--text);font-size:15px}.v31-all-clear small{margin-top:5px;max-width:260px;line-height:1.5}
.v31-drawer-foot{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:14px 16px 18px;border-top:1px solid var(--line);background:var(--surface)}
html[data-theme="dark"] .v31-notification-trigger,html[data-theme="dark"] .v31-notification-drawer,html[data-theme="dark"] .v31-drawer-summary>div,html[data-theme="dark"] .v31-notification-card{background:#201f1c;color:#f8f4ed;border-color:#454038}html[data-theme="dark"] .v31-drawer-summary{background:#191815;border-color:#454038}html[data-theme="dark"] .v31-drawer-head,html[data-theme="dark"] .v31-drawer-foot{border-color:#454038}html[data-theme="dark"] .v31-drawer-close{background:#2c2924;border-color:#4c463e;color:#fff}
@media(max-width:850px){.v31-notification-label{display:none}.v31-notification-trigger{padding:0 9px}.v31-notification-drawer{width:min(400px,100vw)}.v31-drawer-head{padding:20px 18px 17px}.v31-drawer-summary{padding:12px}.v31-drawer-list{padding:12px}.v31-drawer-foot{padding:12px 12px 16px}}
@media(max-width:480px){.v31-notification-drawer{width:100vw}.v31-drawer-summary>div{padding:10px}.v31-drawer-summary strong{font-size:17px}.v31-drawer-foot{grid-template-columns:1fr 1fr}.v31-notification-trigger{height:40px}}
\n\n/* V32 — slide-over editors */\n.v32-panel-head-actions,.v32-inline-actions{display:flex;align-items:center;gap:8px}.v32-edit-close{font-weight:800}.v32-drawer-scrim{position:fixed;inset:0;background:rgba(15,23,42,.38);backdrop-filter:blur(2px);z-index:1190}.v32-side-drawer{position:fixed;top:0;right:0;width:min(480px,94vw);height:100dvh;background:var(--surface,#fff);border-left:1px solid var(--border,#e5e7eb);box-shadow:-24px 0 70px rgba(15,23,42,.2);z-index:1200;transform:translateX(105%);transition:transform .22s ease;display:flex;flex-direction:column}.v32-client-edit-open .v32-side-drawer{transform:translateX(0)}.v32-drawer-form{display:flex;flex-direction:column;height:100%;min-height:0}.v32-drawer-head{display:flex;justify-content:space-between;gap:18px;padding:24px;border-bottom:1px solid var(--border,#e5e7eb)}.v32-drawer-head h3{margin:3px 0 4px;font-size:22px}.v32-drawer-close{width:38px;height:38px;border-radius:12px;border:1px solid var(--border,#e5e7eb);background:var(--surface-2,#f8fafc);font-size:24px;line-height:1;cursor:pointer}.v32-drawer-body{padding:24px;overflow:auto;display:grid;gap:18px}.v32-drawer-body>label,.v32-drawer-body .field-grid label{display:grid;gap:7px;font-weight:700}.v32-client-mini-summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px;border-radius:16px;background:var(--surface-2,#f8fafc);border:1px solid var(--border,#e5e7eb)}.v32-client-mini-summary span{color:var(--muted,#64748b);font-size:13px}.v32-drawer-actions{margin-top:auto;padding:18px 24px;border-top:1px solid var(--border,#e5e7eb);display:flex;justify-content:flex-end;gap:10px;background:var(--surface,#fff)}\n\n/* Order editor becomes a real slide-over only while editing an existing invoice. */\n.v32-order-edit-open{overflow:hidden}.v32-order-edit-open .entry-panel{display:block!important;position:fixed!important;top:0!important;right:0!important;left:auto!important;bottom:0!important;width:min(620px,96vw)!important;max-width:none!important;height:100dvh!important;overflow:auto!important;margin:0!important;border-radius:0!important;border-left:1px solid var(--border,#e5e7eb)!important;box-shadow:-26px 0 80px rgba(15,23,42,.24)!important;z-index:1200!important;background:var(--surface,#fff)!important;padding-bottom:28px}.v32-order-edit-open .entry-panel .panel-heading{position:sticky;top:0;z-index:4;background:var(--surface,#fff);border-bottom:1px solid var(--border,#e5e7eb);padding-bottom:14px}.v32-order-edit-open .entry-panel .form-actions{position:sticky;bottom:0;z-index:4;background:var(--surface,#fff);padding:14px 0 2px;border-top:1px solid var(--border,#e5e7eb)}\n\n/* Existing payment dialog, upgraded to a slide-over drawer. */\ndialog#paymentDialog.payment-dialog{position:fixed;inset:0 0 0 auto;margin:0;width:min(470px,96vw);max-width:none;height:100dvh;max-height:none;border:0;border-left:1px solid var(--border,#e5e7eb);border-radius:0;padding:0;background:var(--surface,#fff);box-shadow:-26px 0 80px rgba(15,23,42,.24)}dialog#paymentDialog.payment-dialog::backdrop{background:rgba(15,23,42,.38);backdrop-filter:blur(2px)}dialog#paymentDialog.payment-dialog>form{min-height:100%;display:flex;flex-direction:column;padding:24px}dialog#paymentDialog .dialog-actions{margin-top:auto}\n\n@media(max-width:760px){.v32-side-drawer,.v32-order-edit-open .entry-panel,dialog#paymentDialog.payment-dialog{width:100vw!important}.v32-drawer-head,.v32-drawer-body,.v32-drawer-actions{padding-left:18px;padding-right:18px}.v32-order-edit-open .entry-panel{padding-left:16px!important;padding-right:16px!important}.v32-inline-actions{flex-wrap:wrap}}\n

/* ============================================================
   V33 — SMART SEARCH & QUICK ACTIONS
   Deliberately no Ctrl+K shortcut. Search opens only from the visible topbar button.
   ============================================================ */
.v33-search-trigger{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 13px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);color:var(--text);font-weight:850;cursor:pointer;box-shadow:0 6px 18px rgba(25,20,15,.05);transition:.18s ease}.v33-search-trigger:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent,#9a6c2f) 42%,var(--line))}.v33-search-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--soft);font-size:17px}
.v33-search-scrim{position:fixed;inset:0;z-index:289;background:rgba(18,16,14,.30);backdrop-filter:blur(2px)}.v33-search-scrim[hidden]{display:none!important}.v33-search-drawer{position:fixed;z-index:290;top:0;right:0;width:min(560px,96vw);height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr);background:var(--surface,#fffdfa);border-left:1px solid var(--line);box-shadow:-28px 0 70px rgba(22,18,14,.2);transform:translateX(104%);transition:transform .24s cubic-bezier(.2,.75,.2,1);overflow:hidden}.v33-search-drawer.open{transform:translateX(0)}body.v33-search-open{overflow:hidden}
.v33-search-head{display:flex;justify-content:space-between;gap:18px;padding:25px 24px 20px;border-bottom:1px solid var(--line)}.v33-search-head span{font-size:9px;font-weight:900;letter-spacing:.17em;color:var(--accent,#9a6c2f)}.v33-search-head h2{margin:5px 0 4px;font:650 24px/1.1 Georgia,'Times New Roman',serif}.v33-search-head p{margin:0;color:var(--muted);font-size:12px}.v33-search-close{width:38px;height:38px;border:1px solid var(--line);border-radius:12px;background:var(--soft);color:inherit;font-size:24px;line-height:1;cursor:pointer}.v33-search-tools{padding:16px 18px;border-bottom:1px solid var(--line);display:grid;gap:12px}.v33-search-field{display:grid;gap:7px}.v33-search-field>span{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:850}.v33-search-field input{width:100%;min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text);font-size:14px;outline:none}.v33-search-field input:focus{border-color:color-mix(in srgb,var(--accent,#9a6c2f) 56%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent,#9a6c2f) 12%,transparent)}.v33-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.v33-quick-actions button{min-height:42px;border:1px solid var(--line);border-radius:11px;background:var(--soft);color:var(--text);font-size:11px;font-weight:850;cursor:pointer}.v33-quick-actions button:hover{border-color:color-mix(in srgb,var(--accent,#9a6c2f) 40%,var(--line));background:color-mix(in srgb,var(--soft) 72%,var(--accent,#9a6c2f) 6%)}
.v33-search-results{overflow:auto;padding:12px 14px 24px;display:grid;align-content:start;gap:8px}.v33-search-result{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:11px;width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:inherit;text-align:left;cursor:pointer;transition:.16s ease}.v33-search-result:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(24,19,15,.08);border-color:color-mix(in srgb,var(--accent,#9a6c2f) 32%,var(--line))}.v33-result-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--soft);font-weight:900}.v33-result-copy{display:grid;gap:2px;min-width:0}.v33-result-copy small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent,#9a6c2f);font-weight:900}.v33-result-copy strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v33-result-copy em{font-size:11px;color:var(--muted);font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v33-result-open{font-size:10px;font-weight:900;color:var(--accent,#9a6c2f)}.v33-search-empty{display:grid;place-items:center;text-align:center;padding:58px 20px;color:var(--muted)}.v33-search-empty strong{color:var(--text);font-size:15px}.v33-search-empty small{margin-top:6px;max-width:310px;line-height:1.5}
html[data-theme="dark"] .v33-search-trigger,html[data-theme="dark"] .v33-search-drawer,html[data-theme="dark"] .v33-search-result{background:#201f1c;color:#f8f4ed;border-color:#454038}html[data-theme="dark"] .v33-search-tools,html[data-theme="dark"] .v33-search-head{border-color:#454038}html[data-theme="dark"] .v33-search-field input{background:#191815;border-color:#454038;color:#fff}html[data-theme="dark"] .v33-quick-actions button,html[data-theme="dark"] .v33-search-close{background:#2c2924;border-color:#4c463e;color:#fff}
@media(max-width:850px){.v33-search-label{display:none}.v33-search-trigger{padding:0 9px}.v33-search-drawer{width:min(520px,100vw)}.v33-quick-actions{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.v33-search-drawer{width:100vw}.v33-search-head{padding:20px 18px 17px}.v33-search-tools{padding:14px}.v33-search-results{padding:10px}.v33-search-result{grid-template-columns:38px minmax(0,1fr)}.v33-result-open{display:none}}


/* ============================================================
   V34 — SAVED FILTERS & FAVORITE VIEWS
   ============================================================ */
.v34-saved-views{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:10px 0 16px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface,#fff) 92%,var(--soft,#f7f3ed) 8%)}.v34-saved-views-main{display:flex;align-items:center;gap:10px;min-width:0;flex:1}.v34-saved-views-label{flex:0 0 auto;font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-weight:900;color:var(--muted)}.v34-view-chips{display:flex;align-items:center;gap:7px;overflow-x:auto;scrollbar-width:thin;padding:1px 0;min-width:0}.v34-view-chip-wrap{display:inline-flex;align-items:stretch;flex:0 0 auto}.v34-view-chip{min-height:32px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font-size:10px;font-weight:850;cursor:pointer;white-space:nowrap}.v34-view-chip:hover{border-color:color-mix(in srgb,var(--accent,#9a6c2f) 42%,var(--line))}.v34-view-chip.active{background:color-mix(in srgb,var(--accent,#9a6c2f) 10%,var(--surface));border-color:color-mix(in srgb,var(--accent,#9a6c2f) 48%,var(--line));color:var(--accent,#9a6c2f)}.v34-view-chip-wrap:has(.v34-view-delete) .v34-view-chip{border-radius:10px 0 0 10px;border-right:0}.v34-view-delete{width:29px;border:1px solid var(--line);border-left:0;border-radius:0 10px 10px 0;background:var(--surface);color:var(--muted);cursor:pointer;font-size:16px}.v34-view-delete:hover{color:#b42318;background:#fff4f2}.v34-save-view{flex:0 0 auto;white-space:nowrap}html[data-theme="dark"] .v34-saved-views{background:#1b1a17;border-color:#454038}html[data-theme="dark"] .v34-view-chip,html[data-theme="dark"] .v34-view-delete{background:#24221e;border-color:#4c463e;color:#f8f4ed}html[data-theme="dark"] .v34-view-chip.active{background:#30291f;color:#e8c48f;border-color:#705d43}
@media(max-width:760px){.v34-saved-views{align-items:stretch;flex-direction:column}.v34-saved-views-main{align-items:flex-start;flex-direction:column}.v34-view-chips{width:100%;max-width:100%}.v34-save-view{align-self:flex-start}}

/* ============================================================
   V35 — ACTIVITY TIMELINE / AUDIT VIEW
   Derived from existing invoice, payment, tracking and activity data.
   ============================================================ */
.v35-timeline-drawer{position:fixed;top:0;right:0;z-index:310;width:min(460px,96vw);height:100dvh;background:var(--surface,#fff);color:var(--text);border-left:1px solid var(--line,#e5e7eb);box-shadow:-24px 0 70px rgba(15,23,42,.20);transform:translateX(105%);transition:transform .24s cubic-bezier(.2,.75,.2,1);display:flex;flex-direction:column;overflow:hidden}
body.v35-timeline-open{overflow:hidden}body.v35-timeline-open .v35-timeline-drawer{transform:translateX(0)}
.v35-timeline-head{padding:24px 24px 16px;display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line,#e5e7eb)}.v35-timeline-head h3{margin:.15rem 0 .2rem;font-size:1.35rem}.v35-timeline-close{width:38px;height:38px;flex:0 0 auto;border:1px solid var(--line,#e5e7eb);border-radius:12px;background:var(--soft,#f8fafc);font-size:24px;line-height:1;cursor:pointer;color:inherit}
.v35-timeline-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px 24px;border-bottom:1px solid var(--line,#e5e7eb);background:color-mix(in srgb,var(--soft,#f8fafc) 55%,transparent)}.v35-timeline-summary>div{padding:12px;border-radius:14px;background:var(--surface,#fff);border:1px solid var(--line,#e5e7eb);min-width:0}.v35-timeline-summary span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.08em;opacity:.62;font-weight:850}.v35-timeline-summary strong{display:block;margin-top:5px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v35-timeline-list{flex:1;overflow:auto;padding:20px 24px}.v35-timeline-item{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);gap:13px;padding:0 0 20px}.v35-timeline-item:not(:last-child):before{content:"";position:absolute;left:18px;top:38px;bottom:0;width:1px;background:var(--line,#e5e7eb)}.v35-timeline-icon{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:var(--soft,#f8fafc);border:1px solid var(--line,#e5e7eb);font-weight:900;z-index:1}.v35-timeline-icon.payment{background:rgba(34,197,94,.11);color:#19763b}.v35-timeline-icon.tracking{background:rgba(59,130,246,.11);color:#3158a5}.v35-timeline-icon.update{background:rgba(168,85,247,.11);color:#7e22ce}.v35-timeline-copy strong{display:block;font-size:13px}.v35-timeline-copy p{margin:4px 0 5px;font-size:12px;opacity:.72;line-height:1.45}.v35-timeline-copy time{font-size:10px;opacity:.5}.v35-timeline-actions{display:flex;gap:10px;padding:16px 24px 22px;border-top:1px solid var(--line,#e5e7eb);background:var(--surface,#fff)}.v35-timeline-actions .button{flex:1}.v35-timeline-empty{padding:34px 10px;text-align:center}.v35-timeline-empty strong,.v35-timeline-empty span{display:block}.v35-timeline-empty span{margin-top:6px;opacity:.6;font-size:12px}
html[data-theme="dark"] .v35-timeline-drawer,html[data-theme="dark"] .v35-timeline-actions,html[data-theme="dark"] .v35-timeline-summary>div{background:#201f1c;color:#f8f4ed;border-color:#454038}html[data-theme="dark"] .v35-timeline-head,html[data-theme="dark"] .v35-timeline-summary,html[data-theme="dark"] .v35-timeline-actions{border-color:#454038}html[data-theme="dark"] .v35-timeline-close,html[data-theme="dark"] .v35-timeline-icon{background:#2c2924;border-color:#4c463e;color:#fff}
@media(max-width:720px){.v35-timeline-drawer{width:100vw}.v35-timeline-head{padding:18px}.v35-timeline-summary{padding:12px 18px}.v35-timeline-list{padding:18px}.v35-timeline-actions{padding:14px 18px 18px}}


/* V36 — Client 360 */
.v36-client360-drawer{position:fixed;top:0;right:0;z-index:1210;width:min(610px,96vw);height:100dvh;background:var(--surface,#fff);color:var(--text);border-left:1px solid var(--line,#e5e7eb);box-shadow:-28px 0 80px rgba(15,23,42,.22);transform:translateX(105%);transition:transform .24s cubic-bezier(.2,.75,.2,1);display:flex;flex-direction:column;overflow:hidden}
body.v36-client360-open{overflow:hidden}body.v36-client360-open .v36-client360-drawer{transform:translateX(0)}
.v36-client360-head{padding:24px 24px 16px;display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line,#e5e7eb)}.v36-client360-head h3{margin:.12rem 0 .2rem;font-size:1.5rem}.v36-client360-close{width:40px;height:40px;border:1px solid var(--line,#e5e7eb);border-radius:13px;background:var(--soft,#f8fafc);font-size:25px;line-height:1;cursor:pointer;color:inherit}
.v36-client360-actions{display:flex;gap:9px;padding:13px 24px;border-bottom:1px solid var(--line,#e5e7eb);background:color-mix(in srgb,var(--soft,#f8fafc) 55%,transparent)}.v36-client360-actions .button{flex:1}
.v36-client360-body{flex:1;overflow:auto;padding:20px 24px 30px;display:grid;gap:18px}.v36-client360-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.v36-client360-kpis>div{padding:14px;border:1px solid var(--line,#e5e7eb);border-radius:16px;background:var(--surface,#fff);min-width:0}.v36-client360-kpis span{display:block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;font-weight:850;opacity:.58}.v36-client360-kpis strong{display:block;margin-top:6px;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v36-client360-section{border:1px solid var(--line,#e5e7eb);border-radius:18px;background:var(--surface,#fff);overflow:hidden}.v36-client360-section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 16px;border-bottom:1px solid var(--line,#e5e7eb)}.v36-client360-section-head span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.09em;font-weight:850;opacity:.5}.v36-client360-section-head h4{margin:3px 0 0;font-size:14px}.v36-client360-section-head button{border:0;background:transparent;color:var(--accent,#7c5cff);font-weight:800;font-size:11px;cursor:pointer}
.v36-client360-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.v36-client360-contact>div{padding:14px 16px;border-right:1px solid var(--line,#e5e7eb);border-bottom:1px solid var(--line,#e5e7eb);min-width:0}.v36-client360-contact>div:nth-child(2n){border-right:0}.v36-client360-contact>div.wide{grid-column:1/-1;border-right:0;border-bottom:0}.v36-client360-contact span{display:block;font-size:10px;opacity:.56}.v36-client360-contact strong{display:block;margin-top:4px;font-size:12px;overflow-wrap:anywhere}
.v36-client360-list{display:grid}.v36-client360-row{width:100%;border:0;border-bottom:1px solid var(--line,#e5e7eb);background:transparent;color:inherit;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;cursor:pointer}.v36-client360-row:last-child{border-bottom:0}.v36-client360-row:not(.static):hover{background:color-mix(in srgb,var(--soft,#f8fafc) 72%,transparent)}.v36-client360-row.static{cursor:default}.v36-client360-row>div{min-width:0}.v36-client360-row strong{display:block;font-size:12px}.v36-client360-row span,.v36-client360-row small{display:block;margin-top:3px;font-size:10px;opacity:.62;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}.v36-client360-row .status-pill{display:inline-flex;margin:0 0 4px}.v36-row-money{text-align:right}.v36-row-money strong{font-size:12px}.v36-client360-empty{padding:22px 16px;text-align:center;font-size:12px;opacity:.55}
.v36-client360-event{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:start;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line,#e5e7eb)}.v36-client360-event:last-child{border-bottom:0}.v36-event-dot{width:8px;height:8px;border-radius:50%;background:#94a3b8;margin-top:4px}.v36-event-dot.payment{background:#22c55e}.v36-event-dot.tracking{background:#3b82f6}.v36-event-dot.update{background:#a855f7}.v36-client360-event strong{display:block;font-size:11px}.v36-client360-event span{display:block;margin-top:3px;font-size:10px;opacity:.62;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.v36-client360-event time{font-size:9px;opacity:.45;white-space:nowrap}
html[data-theme="dark"] .v36-client360-drawer,html[data-theme="dark"] .v36-client360-section,html[data-theme="dark"] .v36-client360-kpis>div{background:#201f1c;color:#f8f4ed;border-color:#454038}html[data-theme="dark"] .v36-client360-head,html[data-theme="dark"] .v36-client360-actions,html[data-theme="dark"] .v36-client360-section-head,html[data-theme="dark"] .v36-client360-row,html[data-theme="dark"] .v36-client360-contact>div,html[data-theme="dark"] .v36-client360-event{border-color:#454038}html[data-theme="dark"] .v36-client360-close{background:#2c2924;border-color:#4c463e;color:#fff}
@media(max-width:720px){.v36-client360-drawer{width:100vw}.v36-client360-head{padding:18px}.v36-client360-actions{padding:12px 18px;overflow:auto}.v36-client360-actions .button{min-width:max-content}.v36-client360-body{padding:16px 18px 24px}.v36-client360-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.v36-client360-row span,.v36-client360-row small{max-width:190px}.v36-client360-event{grid-template-columns:10px minmax(0,1fr)}.v36-client360-event time{grid-column:2}}

/* V37 Finance Pro — credit notes, refunds and client wallet */
.is-hidden { display: none !important; }
.statement-head-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.v37-wallet-statement { border-top:1px solid var(--border, #e5e7eb); }
.v37-finance-dialog,
.v37-wallet-dialog { width:min(680px, calc(100vw - 28px)); }
.v37-finance-note {
  margin:12px 0 0;
  padding:11px 13px;
  border:1px solid rgba(148,163,184,.28);
  border-radius:12px;
  background:rgba(148,163,184,.08);
  color:var(--muted, #64748b);
  font-size:12px;
  line-height:1.5;
}
.v37-adjust-summary { grid-template-columns:repeat(3,minmax(0,1fr)); }
.v37-wallet-history {
  display:grid;
  gap:8px;
  max-height:220px;
  overflow:auto;
  margin-top:14px;
}
.v37-wallet-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:10px 12px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:12px;
  background:rgba(148,163,184,.05);
}
.v37-wallet-row > div:first-child { display:grid; gap:2px; min-width:0; }
.v37-wallet-row strong { font-size:13px; }
.v37-wallet-row span { color:var(--muted, #64748b); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.v37-wallet-row > div:last-child { font-weight:800; white-space:nowrap; }
@media (max-width: 700px) {
  .v37-adjust-summary { grid-template-columns:1fr; }
  .statement-head-actions { width:100%; }
  .statement-head-actions .button { flex:1; }
  .v37-finance-dialog,
  .v37-wallet-dialog { width:calc(100vw - 16px); margin:8px; }
}


/* V38 Advanced Staff Permissions */
.v38-permission-panel{margin-top:14px;padding:16px;border:1px solid var(--border,#e5e7eb);border-radius:16px;background:var(--panel-soft,#fafafa)}
.v38-permission-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.v38-permission-head p{margin:4px 0 0}
.v38-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.v38-permission-grid label{display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--border,#e5e7eb);border-radius:11px;background:var(--surface,#fff);font-size:13px;font-weight:600}
.v38-permission-grid input{width:16px;height:16px;accent-color:var(--brand-accent,#111827)}
.role-preview small{display:block;margin-top:8px;color:var(--muted,#6b7280);line-height:1.45}
@media(max-width:640px){.v38-permission-grid{grid-template-columns:1fr}.v38-permission-head{flex-direction:column}.v38-permission-head .button{width:100%}}

/* V39 — Super Admin operations + recurring billing */
.admin-ops-center,.admin-recurring-center{margin-top:18px;padding:18px;border:1px solid var(--border);border-radius:20px;background:var(--panel)}
.admin-log-kpis,.admin-recurring-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}
.admin-recurring-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
.admin-log-kpis>div,.admin-recurring-kpis>div{padding:14px;border:1px solid var(--border);border-radius:16px;background:var(--panel-soft)}
.admin-log-kpis strong,.admin-recurring-kpis strong{display:block;font-size:1.28rem}.admin-log-kpis span,.admin-recurring-kpis span{display:block;margin-top:3px;color:var(--muted);font-size:.78rem}
.admin-log-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.7fr);gap:14px}.admin-log-list,.admin-health-watch{border:1px solid var(--border);border-radius:16px;background:var(--panel-soft);padding:12px}.admin-health-watch h4{margin:2px 0 10px}
.admin-log-item{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:start;padding:11px 8px;border-bottom:1px solid var(--border)}.admin-log-item:last-child{border-bottom:0}.admin-log-item p{margin:4px 0 0;color:var(--muted);font-size:.8rem}.admin-log-item small{display:block;color:var(--muted);margin-top:2px}.admin-log-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;background:#64748b}.admin-log-item.warning .admin-log-dot{background:#d97706}.admin-log-item.error .admin-log-dot{background:#dc2626}.log-level{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;border:1px solid var(--border);padding:3px 7px;border-radius:999px}.log-level.error{color:#b91c1c}.log-level.warning{color:#b45309}
.health-watch-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 4px;border-bottom:1px solid var(--border)}.health-watch-row:last-child{border-bottom:0}.health-watch-row small{display:block;color:var(--muted);margin-top:2px}.health-pill{padding:4px 8px;border-radius:999px;font-size:.7rem;border:1px solid var(--border)}.health-pill.critical{color:#b91c1c}.health-pill.attention{color:#b45309}.health-pill.good{color:#15803d}
.compact-select{display:flex;align-items:center;gap:7px;font-size:.78rem;color:var(--muted)}.compact-select select{min-width:130px}.billing-cycle-status{display:inline-flex;padding:4px 8px;border-radius:999px;font-size:.72rem;font-weight:700;border:1px solid var(--border)}.billing-cycle-status.paid{color:#15803d}.billing-cycle-status.overdue{color:#b91c1c}.billing-cycle-status.upcoming{color:#2563eb}
@media(max-width:900px){.admin-log-grid{grid-template-columns:1fr}.admin-log-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-recurring-kpis{grid-template-columns:1fr}.admin-ops-center,.admin-recurring-center{padding:14px;border-radius:16px}}

/* V40 — backup polish + automation readiness */
.automation-readiness{margin-top:18px}.automation-readiness .restore-point{align-items:flex-start}.backup-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.backup-integrity{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;font-size:10px;font-weight:800;background:#eaf8ef;color:#19763b}.backup-integrity.legacy{background:#fff7e5;color:#9c6500}.backup-integrity.bad{background:#fff0ee;color:#b42318}.reminder-preview-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:5px}.reminder-preview-meta span{font-size:10px;color:var(--muted)}
@media(max-width:760px){.backup-actions{width:100%;justify-content:flex-start}.automation-readiness .safety-grid{grid-template-columns:1fr}}

/* ============================================================
   V41 — FINAL COMMERCIAL BRANDING & FREEZE
   Visual consistency only. Keeps V40 reliability + automation prep.
   ============================================================ */
:root{
  --v41-surface:#ffffff;
  --v41-surface-soft:#fafafa;
  --v41-text:#171717;
  --v41-muted:#6b7280;
  --v41-border:rgba(17,24,39,.10);
  --v41-shadow:0 18px 50px rgba(17,24,39,.08);
  --v41-shadow-soft:0 8px 24px rgba(17,24,39,.06);
}

/* More restrained, commercial typography across the shell. */
body,.button,input,select,textarea,table{font-family:var(--font-body)}
.app-shell h1,.app-shell h2,.app-shell h3,.panel-heading h2,.drawer-head h3{
  letter-spacing:-.025em;
}

/* Premium shell polish. */
.topbar,.premium-sidebar,.panel,.stat-card,.metric-card,.client-card,.ops-card{
  border-color:var(--v41-border);
}
.panel,.stat-card,.metric-card,.client-card,.ops-card{
  box-shadow:var(--v41-shadow-soft);
}
.topbar{
  backdrop-filter:saturate(1.2) blur(16px);
  -webkit-backdrop-filter:saturate(1.2) blur(16px);
}
.premium-sidebar-logo,.brand-mark,.login-logo{object-fit:contain}

/* Consistent controls: dense enough for business use, still touch friendly. */
.button{min-height:40px;border-radius:11px;font-weight:700;letter-spacing:-.01em}
.button.small{min-height:34px;border-radius:9px}
input,select,textarea{border-radius:11px;min-height:42px}
textarea{min-height:92px}

/* Tables: final commercial pass. */
.table-wrap{border:1px solid var(--v41-border);border-radius:16px;box-shadow:none}
table thead th{font-size:11px;letter-spacing:.055em;text-transform:uppercase;font-weight:800}
table tbody td{vertical-align:middle}
table tbody tr{transition:background-color .14s ease}
table tbody tr:hover{background:rgba(17,24,39,.025)}
.status-chip,.badge,.pill{font-weight:800;letter-spacing:-.01em}

/* Drawers/dialogs are visually unified. */
.v32-side-drawer,.v35-timeline-drawer,.v36-client360-drawer,.v31-notification-drawer,.v33-search-drawer,
dialog#paymentDialog.payment-dialog{
  border-left:1px solid var(--v41-border)!important;
  box-shadow:-28px 0 70px rgba(17,24,39,.16)!important;
}
.v32-drawer-head,.v35-timeline-head,.v36-client360-head,.v31-drawer-head,.v33-search-head{
  background:linear-gradient(180deg,#fff 0%,#fcfcfd 100%);
}

/* Branding preview / logo upload consistency. */
.logo-upload-preview{
  max-width:180px;max-height:82px;object-fit:contain;padding:10px;
  border:1px solid var(--v41-border);border-radius:14px;background:#fff;
}

/* Invoice preview should look like the exported document. */
.invoice-paper{
  background:#fff!important;color:#171717!important;border:1px solid #e5e7eb!important;
  box-shadow:0 20px 60px rgba(17,24,39,.08)!important;border-radius:18px!important;
}
.invoice-paper::before{opacity:.018!important}
.invoice-paper th{background:#f7f7f8!important;color:#4b5563!important}
.invoice-paper .grand-total td,.invoice-paper .balance-row td{font-weight:800}
.invoice-developer-credit{font-size:10px!important;color:#8a8f98!important;letter-spacing:.01em}

/* Final mobile density / safe-area pass. */
@media(max-width:760px){
  .page-heading,.panel-heading{gap:12px}
  .button{min-height:44px}
  .table-wrap{border-radius:14px}
  .v32-side-drawer,.v35-timeline-drawer,.v36-client360-drawer,.v31-notification-drawer,.v33-search-drawer{padding-bottom:env(safe-area-inset-bottom)}
}

/* Dark mode keeps the same hierarchy instead of looking like an inverted light theme. */
html[data-theme="dark"]{
  --v41-surface:#151419;--v41-surface-soft:#1b1920;--v41-text:#f5f3f7;--v41-muted:#aaa3b3;
  --v41-border:rgba(255,255,255,.09);--v41-shadow:0 18px 55px rgba(0,0,0,.28);--v41-shadow-soft:0 8px 26px rgba(0,0,0,.20);
}
html[data-theme="dark"] table tbody tr:hover{background:rgba(255,255,255,.035)}
html[data-theme="dark"] .v32-drawer-head,html[data-theme="dark"] .v35-timeline-head,
html[data-theme="dark"] .v36-client360-head,html[data-theme="dark"] .v31-drawer-head,
html[data-theme="dark"] .v33-search-head{background:linear-gradient(180deg,#18171c 0%,#151419 100%)}
html[data-theme="dark"] .logo-upload-preview{background:#fff}

/* Printing: workspace branding only; UI chrome never leaks into client documents. */
@media print{
  .topbar,.premium-sidebar,.app-footer,.fab,.notification-drawer,.v31-notification-drawer,.v33-search-drawer,
  .v35-timeline-drawer,.v36-client360-drawer,.v32-side-drawer,.button,.print-hide{display:none!important}
  .invoice-paper{border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important}
  .invoice-paper th{background:#f3f4f6!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body{background:#fff!important}
}


/* ===== V42 Production Readiness ===== */
.login-demo-link{margin:10px auto 0;border:0;background:transparent;color:var(--brand-accent,#111827);font:inherit;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.demo-request-dialog{width:min(680px,calc(100vw - 28px));border:1px solid rgba(17,24,39,.10);border-radius:20px;padding:0;box-shadow:0 28px 90px rgba(17,24,39,.24)}
.demo-request-dialog::backdrop{background:rgba(17,24,39,.48);backdrop-filter:blur(4px)}
.demo-request-form{padding:24px}.dialog-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}.dialog-head h3{margin:.2rem 0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.dialog-head .icon-button{width:38px;height:38px;min-width:38px;padding:0;border-radius:12px;border:1px solid var(--v41-border);background:transparent;color:inherit;font-size:24px;line-height:1;cursor:pointer}
.admin-leads-center{margin:22px 0;padding:20px;border:1px solid var(--v41-border);border-radius:18px;background:var(--v41-surface,#fff)}
.admin-lead-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}.admin-lead-kpis>div{padding:14px;border:1px solid var(--v41-border);border-radius:14px;background:var(--v41-surface-soft,#fafafa)}.admin-lead-kpis strong{display:block;font-size:22px}.admin-lead-kpis span{font-size:12px;color:var(--v41-muted,#6b7280)}
.commercial-toggle{display:flex!important;align-items:center;gap:8px;font-size:12px;font-weight:700;white-space:nowrap}.commercial-toggle input{min-height:0;width:17px;height:17px}.compact-lead-status{min-height:34px!important;min-width:112px}.lead-note-cell{max-width:300px;white-space:normal}.app-build-tag{opacity:.65;font-size:11px;margin-left:8px}
@media(max-width:760px){.admin-lead-kpis{grid-template-columns:repeat(2,1fr)}.demo-request-form{padding:18px}.dialog-actions{flex-direction:column-reverse}.dialog-actions .button{width:100%}}


/* ===== V42.1 UI Hotfix: text action buttons ===== */
.icon-button:not([aria-label="Close search"]):not([aria-label="Close notification center"]):not([aria-label="Close activity timeline"]):not([aria-label="Close client overview"]):not([aria-label="Close client editor"]):not(#closeDemoRequestBtn){width:auto;max-width:100%;white-space:nowrap;padding-left:13px;padding-right:13px;font-size:.82rem;line-height:1.2;}
@media(max-width:760px){.icon-button{flex-shrink:0}.panel-head,.section-head,.card-head{gap:10px;flex-wrap:wrap}}

/* ============================================================
   V42.3 — CLIENT PROFILE / CONTACT CARD POLISH
   Presentation-only hotfix. No workspace, finance or tracking logic changes.
   ============================================================ */
.v36-client360-contact{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:12px;
  background:color-mix(in srgb,var(--soft,#f8fafc) 48%,transparent);
}
.v36-client360-contact>div,
.v36-client360-contact>div:nth-child(2n),
.v36-client360-contact>div.wide{
  min-width:0;
  min-height:68px;
  padding:12px 14px;
  border:1px solid var(--line,#e5e7eb);
  border-radius:13px;
  background:var(--surface,#fff);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.v36-client360-contact>div.wide{
  grid-column:1/-1;
}
.v36-client360-contact span{
  display:block;
  margin:0;
  font-size:9px;
  line-height:1.2;
  letter-spacing:.075em;
  text-transform:uppercase;
  font-weight:800;
  opacity:.56;
}
.v36-client360-contact strong{
  display:block;
  margin-top:7px;
  min-height:1em;
  font-size:13px;
  line-height:1.35;
  font-weight:750;
  color:var(--text,#111827);
  overflow-wrap:anywhere;
}
html[data-theme="dark"] .v36-client360-contact{
  background:rgba(255,255,255,.018);
}
html[data-theme="dark"] .v36-client360-contact>div{
  background:#26231f;
  border-color:#454038;
}
html[data-theme="dark"] .v36-client360-contact strong{
  color:#f8f4ed;
}
@media(max-width:560px){
  .v36-client360-contact{grid-template-columns:1fr;padding:10px;gap:8px}
  .v36-client360-contact>div,
  .v36-client360-contact>div:nth-child(2n),
  .v36-client360-contact>div.wide{grid-column:1;min-height:62px;padding:11px 13px}
}


/* ============================================================
   V42.4 — LOGIN PRIVACY + LEAD MANAGEMENT HOTFIX
   ============================================================ */
body.auth-locked{overflow:hidden!important;}
body.auth-locked .app-shell{display:none!important;visibility:hidden!important;pointer-events:none!important;}
body.auth-locked .login-screen{display:grid!important;position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100vh!important;z-index:10000!important;overflow:auto!important;}
.admin-lead-message-setting{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin:12px 0 16px;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);}
.admin-lead-message-setting label{display:grid;gap:7px;font-weight:700;min-width:0;}
.admin-lead-message-setting textarea{width:100%;min-height:76px;resize:vertical;}
.admin-lead-message-actions{display:grid;gap:8px;justify-items:end;max-width:300px;}
.lead-row-actions{flex-wrap:wrap;gap:7px;}
@media(max-width:760px){.admin-lead-message-setting{grid-template-columns:1fr}.admin-lead-message-actions{justify-items:stretch;max-width:none}.admin-lead-message-actions .button{width:100%}.lead-row-actions{min-width:150px}}
/* V42.4.0 */


/* =========================================================
   V42.5 — LOGIN / LOGOUT UX POLISH
   Presentation/auth UX only. No tracking or workspace-data logic changes.
   ========================================================= */
.login-password-wrap{position:relative;display:block}
.login-password-wrap input{width:100%;padding-right:72px!important}
.login-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);min-width:54px;height:34px;padding:0 10px;border:1px solid #d7dce5;border-radius:9px;background:#f8fafc;color:#475569;font:inherit;font-size:11px;font-weight:800;cursor:pointer}
.login-password-toggle:hover{background:#f1f5f9;color:#111827}
.login-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-3px}
.login-remember{display:flex!important;grid-template-columns:none!important;align-items:center;gap:7px!important;font-size:11px!important;font-weight:700!important;color:#697386!important;cursor:pointer}
.login-remember input{width:15px!important;height:15px!important;min-height:0!important;accent-color:#8b5cf6;padding:0!important}
.login-help-link{border:0;background:transparent;padding:3px 0;color:#6b5a42;font:inherit;font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.login-help-link:hover{color:#111827}
.login-submit-spinner{display:none;width:15px;height:15px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;animation:ashkaLoginSpin .75s linear infinite}
.login-button.is-loading{display:flex;align-items:center;justify-content:center;gap:9px;cursor:wait;opacity:.9}
.login-button.is-loading .login-submit-text::after{content:"ing…"}
.login-button.is-loading .login-submit-text{font-size:0}
.login-button.is-loading .login-submit-text::before{content:"Sign";font-size:12px}
.login-button.is-loading .login-submit-text::after{font-size:12px}
.login-button.is-loading .login-submit-spinner{display:inline-block}
@keyframes ashkaLoginSpin{to{transform:rotate(360deg)}}
.login-error{border:1px solid rgba(190,24,93,.18);box-shadow:0 7px 20px rgba(190,24,93,.06)}
.login-trust{line-height:1.45}
.login-demo-link{display:block;color:#5b4930!important;text-decoration-color:rgba(91,73,48,.45)!important}
.login-demo-link:hover{color:#17120d!important;text-decoration-color:currentColor!important}
.theme-toggle-login{min-width:42px!important;width:42px!important;height:38px!important;padding:0!important;justify-content:center!important;gap:0!important}
.theme-toggle-login .login-theme-label{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
html[data-theme="dark"] .login-card h1,html[data-theme="dark"] #loginBrandTitle{color:#f7f3eb!important}
html[data-theme="dark"] .login-demo-link{color:#f1d39a!important;text-decoration-color:rgba(241,211,154,.55)!important}
html[data-theme="dark"] .login-demo-link:hover{color:#fff1c9!important}
html[data-theme="dark"] .login-password-toggle{background:#242a33;color:#e5e7eb;border-color:#3e4652}
html[data-theme="dark"] .login-password-toggle:hover{background:#2d3440;color:#fff}
html[data-theme="dark"] .login-remember{color:#c3c9d2!important}
html[data-theme="dark"] .login-help-link{color:#d7bd89}
html[data-theme="dark"] .login-help-link:hover{color:#ffe5ad}
html[data-theme="dark"] .login-trust{color:#d7d0c4!important;background:#232019!important;border-color:#4d4537!important}
html[data-theme="dark"] .developer-credit strong{color:#f3e7d1!important}
@media(max-width:520px){.login-card{width:min(100%,430px)!important;padding:24px 20px 22px!important}.login-options{align-items:flex-start;flex-direction:column;gap:8px}.login-help-link{font-size:10.5px}.login-trust{font-size:10.5px}.login-demo-link{font-size:11.5px!important;margin-top:12px!important}}
@media(prefers-reduced-motion:reduce){.login-submit-spinner{animation:none}}


/* =========================================================
   V42.6 — LOGIN DARK MODE / CONTROL ALIGNMENT FIX
   Authoritative login presentation only.
   ========================================================= */
.login-form > label{
  color:var(--text,#243044)!important;
}
.login-password-wrap{
  position:relative!important;
  display:block!important;
}
.login-password-wrap input{
  width:100%!important;
  padding-right:52px!important;
}
.login-password-toggle{
  position:absolute!important;
  right:8px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  min-height:36px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  color:#667085!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.login-password-toggle:hover{background:rgba(15,23,42,.06)!important;color:#111827!important}
.login-password-toggle svg{width:18px;height:18px;display:block;pointer-events:none}
.login-password-toggle .eye-off-icon{display:none}
.login-password-toggle[aria-pressed="true"] .eye-icon{display:none}
.login-password-toggle[aria-pressed="true"] .eye-off-icon{display:block}
.login-options{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  margin-top:-2px!important;
}
.login-remember{
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  color:#667085!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1.2!important;
  cursor:pointer!important;
}
.login-form .login-remember input[type="checkbox"]{
  appearance:auto!important;
  -webkit-appearance:checkbox!important;
  width:15px!important;
  min-width:15px!important;
  max-width:15px!important;
  height:15px!important;
  min-height:15px!important;
  max-height:15px!important;
  margin:0!important;
  padding:0!important;
  border:initial!important;
  border-radius:3px!important;
  box-shadow:none!important;
  accent-color:#8b5cf6!important;
  flex:0 0 15px!important;
}
.login-remember span{display:inline!important;white-space:nowrap!important}
.login-help-link,
.login-demo-link{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
  font:inherit!important;
  font-size:11px!important;
  font-weight:800!important;
  line-height:1.35!important;
  text-decoration:underline!important;
  text-underline-offset:3px!important;
}
.login-help-link{padding:3px 0!important;color:#705936!important}
.login-demo-link{
  display:block!important;
  width:auto!important;
  margin:11px 0 0!important;
  padding:3px 0!important;
  color:#705936!important;
  text-align:left!important;
  text-decoration-color:rgba(112,89,54,.45)!important;
}
.login-demo-link[hidden]{display:none!important}
html[data-theme="dark"] .login-card h1,
html[data-theme="dark"] #loginBrandTitle{color:#fff8ea!important}
html[data-theme="dark"] .login-copy{color:#d5d9e1!important}
html[data-theme="dark"] .login-form > label{color:#d9dee8!important}
html[data-theme="dark"] .login-remember{color:#d2d7df!important}
html[data-theme="dark"] .login-help-link,
html[data-theme="dark"] .login-demo-link{
  color:#f3d89f!important;
  text-decoration-color:rgba(243,216,159,.66)!important;
}
html[data-theme="dark"] .login-help-link:hover,
html[data-theme="dark"] .login-demo-link:hover{color:#fff4d5!important}
html[data-theme="dark"] .login-password-toggle{color:#cbd2dc!important}
html[data-theme="dark"] .login-password-toggle:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
html[data-theme="dark"] .developer-credit{color:#c7ccd4!important}
html[data-theme="dark"] .developer-credit strong{color:#f3d89f!important}
html[data-theme="dark"] .login-trust{color:#e7dfd2!important;background:#252117!important;border-color:#514735!important}
@media(max-width:520px){
  .login-options{align-items:flex-start!important;flex-direction:column!important;gap:9px!important}
  .login-demo-link{text-align:left!important;font-size:11.5px!important}
}


/* ============================================================
   V43 — FINAL LAUNCH EDITION
   Final visual consistency, responsive polish and Tracking Center UI.
   Business logic and tracking behavior are intentionally unchanged.
   ============================================================ */
:root{
  --v43-radius-sm:10px;
  --v43-radius:14px;
  --v43-radius-lg:20px;
  --v43-shadow-soft:0 10px 28px rgba(16,24,40,.055);
  --v43-shadow-float:0 20px 54px rgba(16,24,40,.11);
}

/* Controls: consistent commercial-app sizing */
body.v30-redesign .button,
body.v30-redesign .icon-button,
body.v30-redesign input,
body.v30-redesign select,
body.v30-redesign textarea{font-family:inherit}
body.v30-redesign .button{min-height:38px;padding-inline:13px;line-height:1.15}
body.v30-redesign .button.small{min-height:34px;padding:7px 11px}
body.v30-redesign input:not([type="checkbox"]):not([type="radio"]),
body.v30-redesign select{min-height:42px}
body.v30-redesign textarea{min-height:88px;resize:vertical}
body.v30-redesign .panel-toolbar,
body.v30-redesign .operations-toolbar{box-shadow:0 1px 0 rgba(16,24,40,.02)}

/* Never let a normal checkbox inherit text-input dimensions. */
body.v30-redesign input[type="checkbox"],
body.v30-redesign .tracking-select-checkbox{
  appearance:auto!important;
  -webkit-appearance:checkbox!important;
  width:17px!important;
  min-width:17px!important;
  max-width:17px!important;
  height:17px!important;
  min-height:17px!important;
  max-height:17px!important;
  margin:0!important;
  padding:0!important;
  border-radius:4px!important;
  box-shadow:none!important;
  flex:0 0 17px!important;
  accent-color:#7c5ce7!important;
  vertical-align:middle!important;
}

/* Tracking Center — compact, polished command layout */
body.v30-redesign #trackingPanel .orders-command-header{margin-bottom:12px}
body.v30-redesign .tracking-toolbar{
  grid-template-columns:minmax(250px,1.35fr) minmax(160px,.65fr) minmax(185px,.75fr) auto!important;
  gap:10px!important;
  padding:11px!important;
}
body.v30-redesign .v34-saved-views{margin-top:10px}
body.v30-redesign .tracking-summary{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px!important;
  padding:0!important;
  margin:12px 0!important;
  border:0!important;
  background:transparent!important;
}
body.v30-redesign .tracking-summary-item{
  display:flex;
  align-items:baseline;
  gap:8px;
  min-width:0;
  padding:10px 12px;
  border:1px solid #e5e9ef;
  border-radius:12px;
  background:#fff;
}
body.v30-redesign .tracking-summary-item strong{font-size:1rem;color:#182230}
body.v30-redesign .tracking-summary-item span{margin:0!important;font-size:.75rem;color:#667085;white-space:nowrap}
body.v30-redesign .tracking-summary-item.needs-attention{background:#fffaf0;border-color:#f1dfbc}
body.v30-redesign .tracking-summary-item.is-complete{background:#f6fbf8;border-color:#dcece2}

body.v30-redesign .tracking-selection-bar{
  position:sticky;
  top:8px;
  z-index:14;
  min-height:50px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:8px 11px!important;
  margin:10px 0 12px!important;
  border:1px solid #ded8fa!important;
  border-radius:13px!important;
  background:rgba(248,246,255,.96)!important;
  backdrop-filter:blur(10px);
}
body.v30-redesign .tracking-selection-bar .check-label{
  display:inline-flex!important;
  align-items:center!important;
  flex-direction:row!important;
  gap:8px!important;
  width:auto!important;
  margin:0!important;
  font-size:.78rem!important;
  font-weight:750!important;
  color:#475467!important;
}
body.v30-redesign .tracking-selection-actions{display:flex!important;align-items:center!important;gap:9px!important}
body.v30-redesign .tracking-selection-actions strong{font-size:.76rem!important;font-weight:750!important;color:#667085!important}
body.v30-redesign .tracking-edit-selected{min-height:34px!important;padding:7px 11px!important}

body.v30-redesign .tracking-table-shell{
  border:1px solid #e4e8ee!important;
  border-radius:15px!important;
  overflow:auto!important;
  background:#fff!important;
  box-shadow:var(--v43-shadow-soft)!important;
}
body.v30-redesign #trackingTable{min-width:1040px!important;border-collapse:separate!important;border-spacing:0!important}
body.v30-redesign #trackingTable thead th{
  position:sticky;
  top:0;
  z-index:5;
  height:42px!important;
  background:#f7f8fa!important;
  color:#667085!important;
}
body.v30-redesign #trackingTable tbody td{height:52px!important}
body.v30-redesign #trackingTable th:first-child,
body.v30-redesign #trackingTable td:first-child{width:68px;text-align:center}
body.v30-redesign #trackingTable td:first-child .tracking-select-checkbox{display:inline-block}
body.v30-redesign #trackingTable td:nth-child(8){font-variant-numeric:tabular-nums}
body.v30-redesign #trackingTable td:last-child .button{min-width:88px}
body.v30-redesign .tracking-chip{font-size:.72rem!important;padding:4px 7px!important}
body.v30-redesign .tracking-card{box-shadow:var(--v43-shadow-soft);border-radius:16px}

/* Modal/drawer consistency */
body.v30-redesign dialog{border-radius:20px!important}
body.v30-redesign .dialog-actions{padding-top:4px}
body.v30-redesign .dialog-head h3{letter-spacing:-.015em}
body.v30-redesign .icon-button[aria-label^="Close"]{flex:0 0 auto}

/* Footer/build marker stays discreet but useful for support. */
body.v30-redesign .app-build-tag{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid rgba(157,126,77,.22);
  background:rgba(157,126,77,.06);
  font-size:.68rem;
  font-weight:750;
  letter-spacing:.02em;
  white-space:nowrap;
}

/* Dark mode parity */
html[data-theme="dark"] body.v30-redesign .tracking-summary-item{
  background:#171b21!important;
  border-color:#2a313b!important;
}
html[data-theme="dark"] body.v30-redesign .tracking-summary-item strong{color:#f5f7fa!important}
html[data-theme="dark"] body.v30-redesign .tracking-summary-item span{color:#98a2b3!important}
html[data-theme="dark"] body.v30-redesign .tracking-summary-item.needs-attention{background:#211d16!important;border-color:#4d4028!important}
html[data-theme="dark"] body.v30-redesign .tracking-summary-item.is-complete{background:#15201a!important;border-color:#294333!important}
html[data-theme="dark"] body.v30-redesign .tracking-selection-bar{
  background:rgba(29,25,43,.96)!important;
  border-color:#4a3e73!important;
}
html[data-theme="dark"] body.v30-redesign .tracking-selection-bar .check-label,
html[data-theme="dark"] body.v30-redesign .tracking-selection-actions strong{color:#c7cbd3!important}
html[data-theme="dark"] body.v30-redesign .tracking-table-shell{background:#171b21!important;border-color:#2a313b!important}
html[data-theme="dark"] body.v30-redesign #trackingTable thead th{background:#1b2027!important;color:#a8b0bd!important}
html[data-theme="dark"] body.v30-redesign .app-build-tag{background:rgba(197,163,100,.08);border-color:rgba(197,163,100,.24)}

/* Tablet/mobile: no squeezed desktop controls. */
@media(max-width:900px){
  body.v30-redesign .tracking-toolbar{grid-template-columns:1fr 1fr!important}
  body.v30-redesign .tracking-toolbar .search-field{grid-column:1/-1}
  body.v30-redesign .tracking-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:640px){
  body.v30-redesign .tracking-toolbar{grid-template-columns:1fr!important}
  body.v30-redesign .tracking-toolbar .search-field{grid-column:auto}
  body.v30-redesign .tracking-toolbar #clearTrackingFiltersBtn{width:100%}
  body.v30-redesign .tracking-summary{grid-template-columns:1fr!important}
  body.v30-redesign .tracking-summary-item{justify-content:space-between}
  body.v30-redesign .tracking-selection-bar{position:relative;top:auto;align-items:flex-start!important;flex-direction:column!important}
  body.v30-redesign .tracking-selection-actions{width:100%!important;justify-content:space-between!important}
  body.v30-redesign .tracking-edit-selected{width:auto!important}
  body.v30-redesign .tracking-card{padding:13px!important}
}


/* ============================================================
   V43.1 — MOBILE ORDER EDITOR QA HOTFIX
   iOS Safari / mobile Chrome: prevent the edit scrim from trapping
   taps or visually covering the full-screen order editor.
   ============================================================ */
.v32-order-edit-open .v32-edit-close{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:78px!important;
  min-height:38px!important;
  padding:8px 12px!important;
  white-space:nowrap!important;
  font-weight:850!important;
}

@media(max-width:760px){
  /* The editor itself is the full-screen surface on phones; no blurred
     backdrop is needed. This avoids Safari/WebKit stacking/touch issues. */
  body.v32-order-edit-open #v32DrawerScrim{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  body.v32-order-edit-open .entry-panel{
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100vw!important;
    max-width:100vw!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0 16px calc(24px + env(safe-area-inset-bottom))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    z-index:2147483000!important;
    isolation:isolate!important;
    background:var(--surface,#fff)!important;
    touch-action:pan-y!important;
  }
  body.v32-order-edit-open .entry-panel .panel-heading{
    position:sticky!important;
    top:0!important;
    z-index:12!important;
    margin:0 -16px 12px!important;
    padding:calc(12px + env(safe-area-inset-top)) 16px 12px!important;
    background:var(--surface,#fff)!important;
    border-bottom:1px solid var(--border,#e5e7eb)!important;
    box-shadow:0 7px 20px rgba(16,24,40,.05)!important;
  }
  body.v32-order-edit-open .entry-panel .v32-panel-head-actions{
    flex-wrap:nowrap!important;
    gap:7px!important;
  }
  body.v32-order-edit-open .entry-panel .v32-edit-close{
    min-width:82px!important;
    min-height:40px!important;
    padding:8px 11px!important;
  }
  body.v32-order-edit-open .entry-panel .form-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:10!important;
    margin:10px -16px -1px!important;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom))!important;
    background:var(--surface,#fff)!important;
    border-top:1px solid var(--border,#e5e7eb)!important;
    box-shadow:0 -8px 20px rgba(16,24,40,.055)!important;
  }
  body.v32-order-edit-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
}


/* ============================================================
   V43.2 — SMART CLIENT SEARCH AUTOCOMPLETE
   Lightweight workspace-only client suggestions for Orders,
   Clients and Tracking. Optimized for touch and dark mode.
   ============================================================ */
.smart-client-autocomplete{
  position:fixed;
  z-index:2147483200;
  overflow:auto;
  max-height:min(360px,52vh);
  padding:7px;
  border:1px solid var(--border,#e5e7eb);
  border-radius:16px;
  background:var(--surface,#fff);
  box-shadow:0 24px 60px rgba(16,24,40,.18),0 3px 10px rgba(16,24,40,.08);
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.smart-client-autocomplete[hidden]{display:none!important}
.smart-client-suggestion{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 22px;
  align-items:center;
  gap:10px;
  width:100%;
  min-height:56px;
  padding:8px 10px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:var(--text,#111827);
  text-align:left;
  cursor:pointer;
  font:inherit;
}
.smart-client-suggestion:hover,.smart-client-suggestion:focus-visible,.smart-client-suggestion.is-active{
  outline:0;
  background:var(--soft,#f7f2e9);
}
.smart-client-avatar{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid color-mix(in srgb,var(--accent,#7c5cff) 25%,var(--border,#e5e7eb));
  border-radius:11px;
  background:color-mix(in srgb,var(--accent,#7c5cff) 8%,var(--surface,#fff));
  color:var(--accent,#6d55d9);
  font-size:13px;
  font-weight:900;
}
.smart-client-copy{min-width:0}
.smart-client-copy strong,.smart-client-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.smart-client-copy strong{font-size:13px;font-weight:850;line-height:1.35}
.smart-client-copy small{margin-top:3px;color:var(--muted,#667085);font-size:11px;line-height:1.3}
.smart-client-open{color:var(--muted,#98a2b3);font-size:13px;font-weight:900;text-align:center}
html[data-theme="dark"] .smart-client-autocomplete{background:#171b21!important;border-color:#303743!important;box-shadow:0 26px 70px rgba(0,0,0,.5)!important}
html[data-theme="dark"] .smart-client-suggestion{color:#f5f7fa!important}
html[data-theme="dark"] .smart-client-suggestion:hover,html[data-theme="dark"] .smart-client-suggestion:focus-visible,html[data-theme="dark"] .smart-client-suggestion.is-active{background:#222832!important}
html[data-theme="dark"] .smart-client-avatar{background:#25213a!important;border-color:#493f6c!important;color:#d8ccff!important}
html[data-theme="dark"] .smart-client-copy small,html[data-theme="dark"] .smart-client-open{color:#9aa4b2!important}
@media(max-width:640px){
  .smart-client-autocomplete{max-height:46vh;padding:6px;border-radius:14px}
  .smart-client-suggestion{min-height:60px;padding:9px}
  .smart-client-open{display:none}
}


/* V43.3.5 InfinityFree compatibility mode: saves use browser-native form POST.
   Keep failures as explicit toasts instead of a misleading persistent sync badge. */
body.save-error::after { display: none !important; content: none !important; }


/* ============================================================
   V43.3.5 — ORDERS FULL-WIDTH + ON-DEMAND INVOICE COMPOSER
   Orders stay wide and readable. New/Edit invoice opens only when requested.
   ============================================================ */
body.luxury-v13-1 .workspace{
  grid-template-columns:minmax(0,1fr)!important;
}
body.luxury-v13-1 .workspace>.main-panel{
  grid-column:1/-1!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
/* Hide the composer from the normal Orders canvas. The existing drawer class
   remains the single source of truth for opening it. */
body:not(.v32-order-edit-open) .entry-panel{
  display:none!important;
}
body.v32-order-edit-open .entry-panel{
  display:block!important;
}
/* Keep the Order Command Center spacious on desktop. */
body.luxury-v13-1 #ordersPanel .table-wrap,
body.luxury-v13-1 #ordersPanel .orders-command-header,
body.luxury-v13-1 #ordersPanel .ops-attention,
body.luxury-v13-1 #ordersPanel .operations-toolbar,
body.luxury-v13-1 #ordersPanel .saved-views,
body.luxury-v13-1 #ordersPanel .bulk-order-bar{
  max-width:none!important;
}
.metric-shipping-customs::before{
  background:linear-gradient(#c79f58,#916b31)!important;
}
@media(max-width:760px){
  body.luxury-v13-1 .workspace{display:block!important;}
  body.v32-order-edit-open .entry-panel{display:block!important;}
}


/* ============================================================
   V43.4 — LUXURY COMMERCE POLISH
   Orders alignment, dedicated Deposit/Customs sections, simpler invoice,
   and Out-of-stock status. Business logic/data model unchanged.
   ============================================================ */
@media (min-width:761px){
  #ordersPanel .desktop-orders-table table{table-layout:fixed!important;width:100%!important;min-width:0!important}
  #ordersPanel .desktop-orders-table th:nth-child(1),#ordersPanel .desktop-orders-table td:nth-child(1){width:4%!important}
  #ordersPanel .desktop-orders-table th:nth-child(2),#ordersPanel .desktop-orders-table td:nth-child(2){width:13%!important}
  #ordersPanel .desktop-orders-table th:nth-child(3),#ordersPanel .desktop-orders-table td:nth-child(3){width:17%!important}
  #ordersPanel .desktop-orders-table th:nth-child(4),#ordersPanel .desktop-orders-table td:nth-child(4){width:14%!important}
  #ordersPanel .desktop-orders-table th:nth-child(5),#ordersPanel .desktop-orders-table td:nth-child(5){width:13%!important}
  #ordersPanel .desktop-orders-table th:nth-child(6),#ordersPanel .desktop-orders-table td:nth-child(6){width:19%!important}
  #ordersPanel .desktop-orders-table th:nth-child(7),#ordersPanel .desktop-orders-table td:nth-child(7){width:12%!important}
  #ordersPanel .desktop-orders-table th:nth-child(8),#ordersPanel .desktop-orders-table td:nth-child(8){width:8%!important}
  #ordersPanel .desktop-orders-table th{vertical-align:middle!important;text-align:left!important}
  #ordersPanel .desktop-orders-table td{vertical-align:middle!important;overflow:hidden;text-overflow:ellipsis}
  #ordersPanel .order-money-cell{min-width:0!important}
  #ordersPanel .order-profit{min-width:0!important}
}
.order-profit-empty{display:block;color:var(--muted);font-size:1rem;line-height:1}
.luxury-finance-section{border-color:color-mix(in srgb,var(--brand-accent,#a98349) 30%,var(--line))!important;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 96%,#f1e3cd 4%),var(--surface))!important}
.luxury-section-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(220px,.75fr);gap:14px;align-items:stretch}
.luxury-section-note{border:1px solid var(--line);border-radius:15px;padding:14px;background:color-mix(in srgb,var(--surface) 90%,#b4894b 10%);display:grid;align-content:center;gap:5px}
.luxury-section-note strong{font-size:.82rem}.luxury-section-note span{color:var(--muted);font-size:.75rem;line-height:1.45}
.status-inline.out-of-stock,.status-pill.out-of-stock{background:#fff1ed!important;color:#a13f2c!important;border-color:#efc8bf!important}
html[data-theme="dark"] .status-inline.out-of-stock,html[data-theme="dark"] .status-pill.out-of-stock{background:#3a2420!important;color:#ffb6a7!important;border-color:#684038!important}
.simple-invoice-head{padding-bottom:20px!important;border-bottom:1px solid var(--line)!important}
.invoice-contact-line{color:var(--muted);font-size:.8rem;margin-top:4px}
.simple-bill-to{display:grid!important;grid-template-columns:1fr auto;gap:24px!important;align-items:start!important;background:color-mix(in srgb,var(--surface) 95%,#f0e6d8 5%)!important;border:1px solid var(--line)!important;border-radius:16px!important;padding:16px!important}
.simple-bill-to>div{display:grid;gap:3px}.simple-bill-to span{font-size:.66rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:850}.simple-bill-to strong{font-size:.96rem}.simple-bill-to small{color:var(--muted);font-size:.75rem}
.simple-invoice-items th{font-size:.68rem!important;letter-spacing:.08em!important}.simple-invoice-items td{padding-block:12px!important}
.simple-invoice-total-block{width:min(390px,100%);margin-left:auto}.simple-invoice-total-block .totals-table{margin:0!important}.simple-invoice-notes{border-top:1px solid var(--line);padding-top:14px}
@media(max-width:680px){.luxury-section-grid{grid-template-columns:1fr}.simple-bill-to{grid-template-columns:1fr!important}.simple-invoice-total-block{width:100%;margin-left:0}}

/* =========================================================
   V43.5 — CLIENT-FIRST INVOICE WORKSPACE
   ========================================================= */
.invoice-workspace-toolbar{
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
}
.invoice-selector-suite{
  display:grid;
  grid-template-columns:minmax(190px,.8fr) minmax(300px,1.35fr) minmax(360px,1.7fr);
  gap:12px;
  align-items:end;
  flex:1 1 760px;
  min-width:0;
}
.invoice-selector-suite label{min-width:0;margin:0;}
.invoice-selector-suite select{
  width:100%;
  min-height:42px;
  border-radius:12px;
  font-weight:650;
}
.invoice-selection-summary{
  display:flex;
  align-items:stretch;
  gap:8px;
  min-width:0;
  overflow-x:auto;
  scrollbar-width:thin;
  padding-bottom:1px;
}
.invoice-summary-chip{
  min-width:max-content;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
  padding:8px 11px;
  border:1px solid var(--border, #e5e7eb);
  border-radius:12px;
  background:color-mix(in srgb, var(--surface, #fff) 93%, var(--accent, #b68b3c) 7%);
  box-shadow:0 8px 20px rgba(24,24,27,.035);
}
.invoice-summary-chip span{
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  opacity:.62;
  font-weight:750;
}
.invoice-summary-chip strong{font-size:12px;white-space:nowrap;}
.invoice-summary-chip.selected{
  border-color:color-mix(in srgb, var(--accent, #b68b3c) 46%, var(--border, #e5e7eb));
  background:color-mix(in srgb, var(--surface, #fff) 87%, var(--accent, #b68b3c) 13%);
}
.invoice-summary-empty{
  min-height:42px;
  display:flex;
  align-items:center;
  padding:0 12px;
  opacity:.65;
  font-size:12px;
}
.invoice-action-toolbar{
  flex:0 1 auto;
  justify-content:flex-end;
}
.invoice-empty-state{
  min-height:280px;
  display:grid;
  place-content:center;
  text-align:center;
  gap:7px;
  color:var(--muted, #6b7280);
}
.invoice-empty-state strong{color:var(--text, #111827);font-size:18px;}

@media (max-width: 1100px){
  .invoice-selector-suite{grid-template-columns:1fr 1.5fr;}
  .invoice-selection-summary{grid-column:1 / -1;}
  .invoice-action-toolbar{width:100%;justify-content:flex-start;overflow-x:auto;padding-bottom:2px;}
}
@media (max-width: 700px){
  .invoice-selector-suite{grid-template-columns:1fr;flex-basis:100%;}
  .invoice-selection-summary{grid-column:auto;}
  .invoice-summary-chip{padding:7px 9px;}
  .invoice-action-toolbar{display:flex;flex-wrap:nowrap;}
  .invoice-action-toolbar > *{flex:0 0 auto;}
}


/* ============================================================
   V43.6 — FULL-PAGE ORDER + INVOICE PREVIEW / PDF QA
   Desktop order composer uses the whole Orders canvas. Invoice preview
   stays in-app; printing/PDF uses a hidden print frame instead of popups.
   ============================================================ */
@media (min-width:761px){
  body.v32-order-edit-open{overflow:auto!important;}
  body.v32-order-edit-open #v32DrawerScrim{display:none!important;visibility:hidden!important;pointer-events:none!important;}
  body.v32-order-edit-open .workspace{display:block!important;}
  body.v32-order-edit-open .workspace>.main-panel{display:none!important;}
  body.v32-order-edit-open .entry-panel{
    display:block!important;
    position:relative!important;
    inset:auto!important;
    top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
    width:100%!important;max-width:none!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    margin:0!important;padding:24px 28px 30px!important;
    overflow:visible!important;
    border:1px solid var(--border,#e5e7eb)!important;
    border-radius:22px!important;
    box-shadow:var(--v43-shadow-soft,0 10px 28px rgba(16,24,40,.055))!important;
    z-index:auto!important;background:var(--surface,#fff)!important;
  }
  body.v32-order-edit-open .entry-panel .panel-heading{
    position:sticky!important;top:0!important;z-index:12!important;
    max-width:1180px;margin:0 auto 18px!important;padding:14px 0 15px!important;
    background:color-mix(in srgb,var(--surface,#fff) 96%,transparent)!important;
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  }
  body.v32-order-edit-open .entry-panel .order-form{max-width:1180px;margin:0 auto;display:grid;gap:16px;}
  body.v32-order-edit-open .entry-panel .field-grid.two{grid-template-columns:repeat(3,minmax(0,1fr));}
  body.v32-order-edit-open .entry-panel .order-details-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
  body.v32-order-edit-open .entry-panel .form-actions{
    position:sticky!important;bottom:0!important;z-index:11!important;
    margin:4px -4px -6px!important;padding:14px 4px 4px!important;
    background:linear-gradient(to top,var(--surface,#fff) 72%,transparent)!important;
    border-top:0!important;
  }
}
@media (min-width:761px) and (max-width:1050px){
  body.v32-order-edit-open .entry-panel .field-grid.two,
  body.v32-order-edit-open .entry-panel .order-details-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

.invoice-summary-chip.tracking strong{color:var(--accent,#8b6a36);}
html[data-theme="dark"] .invoice-summary-chip.tracking strong{color:#e5c789;}
.invoice-preview-trigger{font-weight:850!important;}
.invoice-preview-dialog{
  width:min(1040px,96vw);max-width:1040px;height:min(90dvh,900px);max-height:90dvh;
  margin:auto;border:0;border-radius:22px;padding:0;background:var(--surface,#fff);
  color:var(--text,#111827);box-shadow:0 34px 100px rgba(15,23,42,.28);overflow:hidden;
}
.invoice-preview-dialog::backdrop{background:rgba(15,23,42,.5);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
.invoice-preview-shell{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:var(--surface,#fff);}
.invoice-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:20px 22px;border-bottom:1px solid var(--border,#e5e7eb);}
.invoice-preview-head h3{margin:3px 0 4px;font-size:1.25rem}.invoice-preview-head p{margin:0;color:var(--muted,#667085);font-size:.78rem;}
.invoice-preview-scroll{overflow:auto;padding:24px;background:color-mix(in srgb,var(--surface,#fff) 88%,#eef1f5 12%);}
.invoice-preview-paper{max-width:820px;margin:0 auto!important;min-height:600px;background:var(--surface,#fff);box-shadow:0 18px 48px rgba(15,23,42,.08);border:1px solid var(--border,#e5e7eb);border-radius:18px;padding:28px!important;}
.invoice-preview-actions{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--border,#e5e7eb);background:var(--surface,#fff);}
html[data-theme="dark"] .invoice-preview-dialog,html[data-theme="dark"] .invoice-preview-shell,html[data-theme="dark"] .invoice-preview-head,html[data-theme="dark"] .invoice-preview-actions{background:#171b21!important;color:#f6f7f9!important;border-color:#303743!important;}
html[data-theme="dark"] .invoice-preview-scroll{background:#11151a!important;}
html[data-theme="dark"] .invoice-preview-paper{background:#1b2027!important;border-color:#303743!important;box-shadow:0 20px 54px rgba(0,0,0,.28)!important;}
@media(max-width:700px){
  .invoice-preview-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;}
  .invoice-preview-head{padding:calc(14px + env(safe-area-inset-top)) 16px 14px;}
  .invoice-preview-scroll{padding:12px;}
  .invoice-preview-paper{min-height:0;padding:18px!important;border-radius:14px;}
  .invoice-preview-actions{padding:12px 16px calc(12px + env(safe-area-inset-bottom));}
  .invoice-preview-actions .button{flex:1 1 auto;}
}


/* V43.6.2 — INVOICE PREVIEW + POST-SAVE QA */
html.invoice-preview-open, html.invoice-preview-open body{overflow:hidden!important;}
.invoice-preview-dialog[open],.invoice-preview-dialog.is-open{
  display:block!important;position:fixed!important;inset:0!important;margin:auto!important;z-index:12000!important;
}
.invoice-preview-dialog.is-open{box-shadow:0 40px 120px rgba(0,0,0,.30)!important;}
@media (max-width:760px){
  .invoice-preview-dialog[open],.invoice-preview-dialog.is-open{inset:0!important;margin:0!important;}
}

/* ============================================================
   V43.7 — EXECUTIVE DASHBOARD + FOCUSED MODULE NAVIGATION
   Dashboard is a dedicated home page. Every sidebar section opens alone.
   ============================================================ */
.main-panel > .tabs{display:none!important}
body:not(.dashboard-mode) .dashboard-intro,
body:not(.dashboard-mode) .metrics-grid,
body:not(.dashboard-mode) .receivables-alert,
body:not(.dashboard-mode) .smart-center,
body:not(.dashboard-mode) .executive-dashboard-grid{display:none!important}
body.dashboard-mode .workspace{display:none!important}
body.dashboard-mode .dashboard-intro,
body.dashboard-mode .metrics-grid,
body.dashboard-mode .smart-center,
body.dashboard-mode .executive-dashboard-grid{display:grid}
body.dashboard-mode .receivables-alert:not([hidden]){display:flex}

body.dashboard-mode .dashboard-intro{
  position:relative;overflow:hidden;grid-template-columns:minmax(0,1fr) auto;align-items:center;
  min-height:170px;margin:8px 0 18px;padding:30px 34px;border:1px solid rgba(255,255,255,.08);
  border-radius:28px;background:
    radial-gradient(circle at 86% 18%,rgba(162,132,255,.34),transparent 30%),
    linear-gradient(128deg,#171c28 0%,#24263d 54%,#51428b 100%);
  box-shadow:0 24px 70px rgba(22,24,35,.18);color:#fff
}
body.dashboard-mode .dashboard-intro:after{content:"";position:absolute;right:-90px;top:-120px;width:330px;height:330px;border:1px solid rgba(229,207,164,.18);border-radius:50%}
body.dashboard-mode .dashboard-intro .eyebrow{color:#dbc28d!important;letter-spacing:.2em}
body.dashboard-mode .dashboard-intro h2{color:#fff!important;font-family:Georgia,'Times New Roman',serif!important;font-size:clamp(2.6rem,4vw,4rem)!important;font-weight:500!important;letter-spacing:-.045em!important;margin:.1em 0!important}
body.dashboard-mode .dashboard-intro p:not(.eyebrow){color:#d4d6e0!important;font-size:1rem!important;max-width:620px}
body.dashboard-mode .dashboard-new-button{position:relative;z-index:2;background:#fff!important;color:#1d2130!important;border:0!important;padding:13px 19px!important;border-radius:15px!important;box-shadow:0 14px 30px rgba(0,0,0,.18)!important;font-weight:900!important}

body.dashboard-mode .metrics-grid{grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:11px!important;margin:0 0 16px!important}
body.dashboard-mode .metrics-grid .metric{min-height:116px;padding:16px!important;border-radius:20px!important;background:linear-gradient(145deg,#fff,#fbfaf8)!important;border:1px solid #e8e1d8!important;box-shadow:0 10px 30px rgba(31,35,48,.055)!important}
body.dashboard-mode .metrics-grid .metric strong{font-size:1.38rem!important;letter-spacing:-.03em}
body.dashboard-mode .metrics-grid .metric small{font-size:.68rem!important;line-height:1.4}
body.dashboard-mode .metrics-grid .metric-topline span{font-size:.64rem!important;letter-spacing:.08em!important}

body.dashboard-mode .smart-center{display:block!important;margin:0 0 16px!important;padding:20px 22px!important;border-radius:24px!important;background:linear-gradient(135deg,#fffdf9,#f7f4ee)!important;border:1px solid #e6d7bd!important;box-shadow:0 12px 38px rgba(69,55,33,.055)!important}
body.dashboard-mode .smart-center-head{margin-bottom:12px!important}
body.dashboard-mode .smart-center-head h3{font-size:1.45rem!important}
body.dashboard-mode .smart-reminder-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}

.executive-dashboard-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;margin:0 0 28px}
.executive-card{position:relative;overflow:hidden;border:1px solid #e4ded6;border-radius:24px;background:linear-gradient(145deg,#fff,#fbfaf7);box-shadow:0 14px 42px rgba(35,39,52,.055);padding:22px;min-width:0}
.executive-card:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:2px;background:linear-gradient(90deg,#c8a56b,transparent 62%);opacity:.75}
.executive-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:17px}
.executive-card-head h3{margin:3px 0 0;font-size:1.12rem;letter-spacing:-.02em;color:#20242d}
.executive-kicker{font-size:.59rem;font-weight:900;letter-spacing:.17em;text-transform:uppercase;color:#9a7b48}
.executive-card-head button{border:0;background:transparent;color:#6b6259;font-size:.72rem;font-weight:900;cursor:pointer;padding:4px}
.executive-card-head button:hover{color:#2d2b29}
.executive-total{min-width:34px;height:34px;display:grid;place-items:center;border-radius:12px;background:#f3ede4;color:#8a6735;font-weight:900}
.cash-pulse-card{grid-column:span 5}.pipeline-card{grid-column:span 7}.attention-card{grid-column:span 5}.receivable-card{grid-column:span 7}.recent-card{grid-column:span 8}.snapshot-card{grid-column:span 4}
.cash-pulse-main{display:grid;gap:4px;margin-bottom:15px}.cash-pulse-main strong{font-family:Georgia,'Times New Roman',serif;font-size:2.35rem;font-weight:500;letter-spacing:-.04em}.cash-pulse-main span{color:#7f786f;font-size:.8rem}
.luxury-progress{height:9px;border-radius:999px;background:#eee9e2;overflow:hidden;margin-bottom:14px}.luxury-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#9a7948,#c9a868,#7c6cd1)}
.cash-pulse-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.cash-pulse-foot span{padding:10px;border-radius:13px;background:#f7f4ef;display:grid;gap:2px;color:#857d73;font-size:.67rem}.cash-pulse-foot b{color:#252830;font-size:.82rem}
.pipeline-list{display:grid;gap:9px}.pipeline-list button{display:grid;grid-template-columns:92px minmax(0,1fr) 28px;align-items:center;gap:11px;border:0;background:transparent;padding:3px 0;cursor:pointer;text-align:left;color:#56515a}.pipeline-list button>span{font-size:.75rem;font-weight:800}.pipeline-list i{height:7px;border-radius:999px;background:#eeeae5;overflow:hidden}.pipeline-list em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ac8d5c,#8877db)}.pipeline-list strong{text-align:right;color:#252832;font-size:.78rem}
.attention-list{display:grid;gap:8px}.attention-list button{display:grid;grid-template-columns:10px minmax(0,1fr) 18px;align-items:center;gap:11px;border:1px solid #ece6df;background:#fff;border-radius:14px;padding:11px 12px;text-align:left;cursor:pointer}.attention-list button:hover{border-color:#d7c6aa;background:#fffdf9}.attention-list div{display:grid;gap:2px}.attention-list strong{font-size:.78rem}.attention-list small{font-size:.67rem;color:#8b847d}.attention-list b{color:#9c8f80}.attention-dot{width:8px;height:8px;border-radius:50%}.attention-dot.amber{background:#c79436}.attention-dot.green{background:#4da56a}.attention-dot.red{background:#d55b52}.attention-dot.violet{background:#8a78d8}
.executive-receivables,.recent-order-list{display:grid;gap:7px}.executive-receivables button,.recent-order-list button{border:0;border-bottom:1px solid #eee9e3;background:transparent;padding:10px 2px;cursor:pointer;text-align:left}.executive-receivables button{display:flex;align-items:center;justify-content:space-between;gap:12px}.executive-receivables span{display:grid;gap:2px}.executive-receivables small{color:#958d84;font-size:.67rem}.executive-receivables b{font-size:.84rem;color:#9a453e}
.recent-order-list button{display:grid;grid-template-columns:115px minmax(120px,1fr) 92px 85px;align-items:center;gap:10px}.recent-order-ref{display:grid;gap:2px}.recent-order-ref small{color:#91887e;font-size:.65rem}.recent-order-client{font-size:.76rem;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-order-status{font-size:.68rem;color:#71695f}.recent-order-list b{text-align:right;font-size:.78rem}
.snapshot-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.snapshot-grid div{border:1px solid #ebe5de;border-radius:15px;padding:14px;background:#fff;display:grid;gap:3px}.snapshot-grid strong{font-family:Georgia,'Times New Roman',serif;font-size:1.5rem;font-weight:500}.snapshot-grid span{font-size:.66rem;color:#867e75;font-weight:800}.snapshot-card p{margin:14px 0 0;color:#8c847b;font-size:.7rem;line-height:1.55}
.executive-empty{min-height:112px;display:grid;place-items:center;align-content:center;text-align:center;gap:4px;color:#8c857d}.executive-empty>span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#eef5ef;color:#4a8a60}.executive-empty strong{font-size:.82rem}.executive-empty small{font-size:.68rem}

html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric,
html[data-theme="dark"] .executive-card{background:linear-gradient(145deg,#171a20,#14171c)!important;border-color:#2b3038!important;box-shadow:0 18px 45px rgba(0,0,0,.2)!important}
html[data-theme="dark"] .executive-card-head h3,html[data-theme="dark"] .cash-pulse-main strong,html[data-theme="dark"] .cash-pulse-foot b,html[data-theme="dark"] .pipeline-list strong,html[data-theme="dark"] .attention-list strong,html[data-theme="dark"] .executive-receivables strong,html[data-theme="dark"] .recent-order-list b,html[data-theme="dark"] .snapshot-grid strong{color:#f1eee8!important}
html[data-theme="dark"] .attention-list button,html[data-theme="dark"] .snapshot-grid div{background:#1c2027!important;border-color:#30353d!important;color:#e8e4dd!important}
html[data-theme="dark"] .cash-pulse-foot span,html[data-theme="dark"] .luxury-progress,html[data-theme="dark"] .pipeline-list i{background:#20242b!important}
html[data-theme="dark"] body.dashboard-mode .smart-center{background:linear-gradient(135deg,#181b20,#15181d)!important;border-color:#34312c!important}

@media(max-width:1280px){body.dashboard-mode .metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.smart-reminder-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.cash-pulse-card,.pipeline-card,.attention-card,.receivable-card{grid-column:span 6}.recent-card{grid-column:span 8}.snapshot-card{grid-column:span 4}}
@media(max-width:900px){body.dashboard-mode .dashboard-intro{grid-template-columns:1fr;padding:25px}.executive-dashboard-grid{grid-template-columns:1fr}.executive-card{grid-column:1!important}.recent-order-list button{grid-template-columns:90px minmax(0,1fr) 70px}.recent-order-list b{display:none}.cash-pulse-foot{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:640px){body.dashboard-mode .dashboard-intro{margin:0 0 12px;border-radius:20px;min-height:150px;padding:21px 18px}.dashboard-new-button{width:100%}body.dashboard-mode .metrics-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}body.dashboard-mode .metrics-grid .metric{min-height:105px!important;padding:13px!important;border-radius:16px!important}.executive-card{padding:16px;border-radius:18px}.executive-dashboard-grid{gap:10px}.cash-pulse-foot{grid-template-columns:1fr}.smart-reminder-grid{grid-template-columns:1fr!important}.recent-order-list button{grid-template-columns:82px minmax(0,1fr);}.recent-order-status{display:none}.pipeline-list button{grid-template-columns:78px minmax(0,1fr) 24px}.snapshot-grid{grid-template-columns:1fr 1fr}}


/* =========================================================
   V43.7.1 — FOCUS DASHBOARD
   A quieter, action-first home page.
   ========================================================= */
body.dashboard-mode .receivables-alert,
body.dashboard-mode .smart-center{display:none!important}
body.dashboard-mode .dashboard-intro{
  min-height:142px!important; padding:26px 30px!important; margin:0 0 14px!important;
  border-radius:22px!important; background:linear-gradient(135deg,#171b25 0%,#25293a 68%,#302b4a 100%)!important;
  box-shadow:0 18px 46px rgba(27,30,43,.12)!important;
}
body.dashboard-mode .dashboard-intro:after{width:260px!important;height:260px!important;right:-80px!important;top:-115px!important}
body.dashboard-mode .dashboard-intro h2{font-size:clamp(2.15rem,3vw,3rem)!important;margin:.08em 0!important}
body.dashboard-mode .dashboard-intro p:not(.eyebrow){font-size:.88rem!important;color:#cbd0da!important}
body.dashboard-mode .metrics-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:10px!important;margin:0 0 14px!important}
body.dashboard-mode .metrics-grid .metric{min-height:104px!important;padding:15px 16px!important;border-radius:17px!important;box-shadow:0 8px 24px rgba(31,35,48,.045)!important}
body.dashboard-mode .metrics-grid .metric strong{font-size:1.28rem!important}
body.dashboard-mode .metrics-grid .metric small{font-size:.66rem!important}
.executive-dashboard-grid{display:grid!important;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)!important;gap:14px!important;margin:0 0 26px!important}
.simple-dash-card{background:#fff;border:1px solid #e5e0d8;border-radius:20px;padding:20px;box-shadow:0 10px 34px rgba(31,35,48,.045);min-width:0}
.simple-attention-card{grid-column:1}.simple-money-card{grid-column:2}.simple-recent-card{grid-column:1 / -1}
.simple-dash-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.simple-dash-head>div{display:grid;gap:2px}.simple-dash-head>div>span{text-transform:uppercase;letter-spacing:.16em;font-size:.59rem;font-weight:900;color:#a17d49}.simple-dash-head h3{margin:0;font-size:1.05rem;letter-spacing:-.025em;color:#20242d}
.simple-dash-head>button{border:0;background:transparent;color:#756c62;font-size:.7rem;font-weight:900;cursor:pointer;padding:4px 0}.simple-dash-head>button:hover{color:#1d2129}
.simple-count{display:grid;place-items:center;min-width:34px;height:34px;border-radius:11px;background:#f7f1e8;color:#8d6c3d;font-size:.9rem}
.simple-action-list{display:grid;gap:7px}.simple-action-list button{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:10px;width:100%;border:1px solid #ece7e0;background:#fff;border-radius:13px;padding:9px 10px;text-align:left;cursor:pointer}.simple-action-list button:hover{background:#fdfbf8;border-color:#dacdbb}.simple-action-list button>span:nth-child(2){display:grid;gap:1px}.simple-action-list b{font-size:.76rem;color:#2c3038}.simple-action-list small{font-size:.64rem;color:#8c857d}.simple-action-list em{font-style:normal;color:#9a9187;font-weight:900}.simple-action-icon{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:.76rem;font-weight:900}.simple-action-icon.amber{background:#fbf1df;color:#a37222}.simple-action-icon.green{background:#eaf6ee;color:#398459}.simple-action-icon.red{background:#fff0ee;color:#bd5048}.simple-action-icon.violet{background:#f1eefc;color:#7462bc}
.simple-all-clear,.simple-empty{display:flex;align-items:center;gap:11px;min-height:74px;padding:12px;border:1px dashed #ddd5c9;border-radius:14px;color:#59554f}.simple-all-clear>span,.simple-empty>span{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#edf7ef;color:#43805a;font-weight:900}.simple-all-clear>div,.simple-empty>div{display:grid;gap:2px}.simple-all-clear b,.simple-empty b{font-size:.78rem}.simple-all-clear small,.simple-empty small{font-size:.65rem;color:#918a82}
.simple-money-total{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:3px 1px 12px;border-bottom:1px solid #eee9e3}.simple-money-total strong{font-family:Georgia,'Times New Roman',serif;font-size:2rem;font-weight:500;color:#1d2129;letter-spacing:-.04em}.simple-money-total span{font-size:.66rem;color:#8a8279;padding-bottom:5px}
.simple-receivable-list{display:grid}.simple-receivable-list button{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-bottom:1px solid #f0ece6;background:transparent;padding:9px 1px;cursor:pointer;text-align:left}.simple-receivable-list button:last-child{border-bottom:0}.simple-receivable-list button:hover{padding-left:5px}.simple-receivable-list button>span{display:grid;gap:1px}.simple-receivable-list b{font-size:.73rem}.simple-receivable-list small{font-size:.62rem;color:#928a81}.simple-receivable-list strong{font-size:.76rem;color:#a04942}
.simple-recent-list{display:grid}.simple-recent-list button{display:grid;grid-template-columns:105px minmax(160px,1fr) 110px 85px 16px;align-items:center;gap:12px;border:0;border-bottom:1px solid #efeae4;background:transparent;padding:10px 2px;cursor:pointer;text-align:left}.simple-recent-list button:last-child{border-bottom:0}.simple-recent-list button:hover{background:#fdfbf8}.simple-order-ref{display:grid;gap:1px}.simple-order-ref b{font-size:.72rem}.simple-order-ref small{font-size:.61rem;color:#958d84}.simple-order-client{font-size:.72rem;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.simple-order-status{font-size:.65rem;color:#746d65}.simple-recent-list button>strong{text-align:right;font-size:.74rem}.simple-recent-list button>em{font-style:normal;color:#aaa196;font-weight:900}
html[data-theme="dark"] .simple-dash-card{background:#171a20;border-color:#2c3038;box-shadow:0 14px 38px rgba(0,0,0,.16)}
html[data-theme="dark"] .simple-dash-head h3,html[data-theme="dark"] .simple-action-list b,html[data-theme="dark"] .simple-money-total strong,html[data-theme="dark"] .simple-receivable-list b,html[data-theme="dark"] .simple-recent-list button>strong,html[data-theme="dark"] .simple-order-client{color:#f2eee8}
html[data-theme="dark"] .simple-action-list button{background:#1c2026;border-color:#2f343c}html[data-theme="dark"] .simple-action-list button:hover,html[data-theme="dark"] .simple-recent-list button:hover{background:#20242b}
html[data-theme="dark"] .simple-money-total,html[data-theme="dark"] .simple-receivable-list button,html[data-theme="dark"] .simple-recent-list button{border-color:#2b3037}
html[data-theme="dark"] .simple-all-clear,html[data-theme="dark"] .simple-empty{border-color:#343940;color:#e5e1da}
@media(max-width:1100px){body.dashboard-mode .metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.executive-dashboard-grid{grid-template-columns:1fr!important}.simple-attention-card,.simple-money-card,.simple-recent-card{grid-column:1!important}}
@media(max-width:640px){body.dashboard-mode .dashboard-intro{min-height:0!important;padding:20px 18px!important}.executive-dashboard-grid{gap:9px!important}.simple-dash-card{padding:15px;border-radius:16px}.simple-recent-list button{grid-template-columns:86px minmax(0,1fr) 70px}.simple-order-status,.simple-recent-list button>em{display:none}.simple-money-total strong{font-size:1.65rem}body.dashboard-mode .metrics-grid{grid-template-columns:1fr 1fr!important}}


/* =========================================================
   V43.7.3 — CONTROL DASHBOARD
   Compact, operational, finance-first.
   ========================================================= */
body.dashboard-mode .dashboard-intro{min-height:132px!important;padding:24px 28px!important;margin-bottom:13px!important}
body.dashboard-mode .dashboard-intro h2{font-size:clamp(2.05rem,3vw,2.85rem)!important}
body.dashboard-mode .dashboard-intro p:not(.eyebrow){max-width:760px!important}
body.dashboard-mode .metrics-grid{display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:10px!important;margin-bottom:13px!important}
body.dashboard-mode .metrics-grid .metric{min-height:102px!important;padding:14px 16px!important;border-radius:17px!important}
body.dashboard-mode .metrics-grid .metric:nth-child(-n+4){grid-column:span 3}
body.dashboard-mode .metrics-grid .metric:nth-child(n+5){grid-column:span 4;background:linear-gradient(145deg,#fbfaf7,#f6f2eb)!important}
body.dashboard-mode .metrics-grid .metric strong{font-size:1.3rem!important}
body.dashboard-mode .metrics-grid .metric small{font-size:.65rem!important}
.executive-dashboard-grid{display:grid!important;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)!important;gap:12px!important;margin:0 0 24px!important;align-items:start!important}
.focus-card{background:#fff;border:1px solid #e5e0d8;border-radius:18px;padding:17px 18px;box-shadow:0 9px 28px rgba(31,35,48,.04);min-width:0;height:auto!important;align-self:start}
.focus-attention-card{grid-column:1}.focus-collections-card{grid-column:2}.focus-recent-card{grid-column:1/-1}
.focus-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:11px}
.focus-card-head>div{display:grid;gap:2px}.focus-card-head>div>span{text-transform:uppercase;letter-spacing:.16em;font-size:.57rem;font-weight:900;color:#a17d49}.focus-card-head h3{margin:0;font-size:1.02rem;letter-spacing:-.025em;color:#20242d}.focus-card-head>strong{display:grid;place-items:center;min-width:30px;height:30px;border-radius:10px;background:#f7f1e8;color:#8d6c3d;font-size:.83rem}.focus-card-head>button{border:0;background:transparent;color:#746b61;font-size:.68rem;font-weight:900;cursor:pointer;padding:3px 0}.focus-card-head>button:hover{color:#1d2129}
.focus-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.focus-action-grid button{display:grid;grid-template-columns:31px minmax(0,1fr) 14px;align-items:center;gap:9px;border:1px solid #ece7e0;background:#fff;border-radius:12px;padding:8px 9px;text-align:left;cursor:pointer}.focus-action-grid button:hover{background:#fdfbf8;border-color:#dacdbb}.focus-action-grid button>span:nth-child(2){display:grid;gap:1px}.focus-action-grid b{font-size:.72rem}.focus-action-grid small{font-size:.61rem;color:#8c857d}.focus-action-grid em{font-style:normal;color:#9a9187;font-weight:900}.focus-action-icon{width:29px;height:29px;border-radius:9px;display:grid;place-items:center;font-size:.72rem;font-weight:900}.focus-action-icon.amber{background:#fbf1df;color:#a37222}.focus-action-icon.green{background:#eaf6ee;color:#398459}.focus-action-icon.red{background:#fff0ee;color:#bd5048}.focus-action-icon.violet{background:#f1eefc;color:#7462bc}
.focus-clear{display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px dashed #ddd5c9;border-radius:13px;min-height:58px}.focus-clear.compact{min-height:54px}.focus-clear>span{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;background:#edf7ef;color:#43805a;font-weight:900}.focus-clear>div{display:grid;gap:1px}.focus-clear b{font-size:.74rem}.focus-clear small{font-size:.62rem;color:#918a82}
.focus-collection-total{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:0 1px 9px;border-bottom:1px solid #eee9e3}.focus-collection-total strong{font-family:Georgia,'Times New Roman',serif;font-size:1.75rem;font-weight:500;color:#1d2129;letter-spacing:-.04em}.focus-collection-total span{font-size:.63rem;color:#8a8279;padding-bottom:4px}.focus-receivables{display:grid}.focus-receivables button{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-bottom:1px solid #f0ece6;background:transparent;padding:8px 1px;cursor:pointer;text-align:left}.focus-receivables button:last-child{border-bottom:0}.focus-receivables button>span{display:grid;gap:1px}.focus-receivables b{font-size:.7rem}.focus-receivables small{font-size:.6rem;color:#928a81}.focus-receivables strong{font-size:.72rem;color:#a04942}
.focus-recent-list{display:grid}.focus-recent-list button{display:grid;grid-template-columns:100px minmax(150px,1fr) 105px 85px 15px;align-items:center;gap:11px;border:0;border-bottom:1px solid #efeae4;background:transparent;padding:9px 2px;cursor:pointer;text-align:left}.focus-recent-list button:last-child{border-bottom:0}.focus-recent-list button:hover{background:#fdfbf8}.focus-order-ref{display:grid;gap:1px}.focus-order-ref b{font-size:.7rem}.focus-order-ref small{font-size:.59rem;color:#958d84}.focus-order-client{font-size:.7rem;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.focus-order-status{font-size:.63rem;color:#746d65}.focus-recent-list button>strong{text-align:right;font-size:.71rem}.focus-recent-list button>em{font-style:normal;color:#aaa196;font-weight:900}
html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric:nth-child(n+5){background:linear-gradient(145deg,#181b20,#15181d)!important}
html[data-theme="dark"] .focus-card{background:#171a20;border-color:#2c3038;box-shadow:0 14px 38px rgba(0,0,0,.16)}
html[data-theme="dark"] .focus-card-head h3,html[data-theme="dark"] .focus-action-grid b,html[data-theme="dark"] .focus-collection-total strong,html[data-theme="dark"] .focus-receivables b,html[data-theme="dark"] .focus-order-client,html[data-theme="dark"] .focus-recent-list button>strong{color:#f2eee8}
html[data-theme="dark"] .focus-action-grid button{background:#1c2026;border-color:#2f343c}html[data-theme="dark"] .focus-action-grid button:hover,html[data-theme="dark"] .focus-recent-list button:hover{background:#20242b}
html[data-theme="dark"] .focus-collection-total,html[data-theme="dark"] .focus-receivables button,html[data-theme="dark"] .focus-recent-list button{border-color:#2b3037}html[data-theme="dark"] .focus-clear{border-color:#343940;color:#e5e1da}
@media(max-width:1180px){body.dashboard-mode .metrics-grid .metric:nth-child(-n+4),body.dashboard-mode .metrics-grid .metric:nth-child(n+5){grid-column:span 6}.executive-dashboard-grid{grid-template-columns:1fr!important}.focus-attention-card,.focus-collections-card,.focus-recent-card{grid-column:1!important}}
@media(max-width:680px){body.dashboard-mode .dashboard-intro{padding:19px 17px!important}.dashboard-new-button{width:100%}body.dashboard-mode .metrics-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}body.dashboard-mode .metrics-grid .metric:nth-child(n){grid-column:auto!important;min-height:96px!important;padding:12px!important}.executive-dashboard-grid{gap:9px!important}.focus-card{padding:14px;border-radius:15px}.focus-action-grid{grid-template-columns:1fr}.focus-recent-list button{grid-template-columns:80px minmax(0,1fr) 68px}.focus-order-status,.focus-recent-list button>em{display:none}.focus-collection-total strong{font-size:1.55rem}}

/* ============================================================
   V43.7.3 — EXECUTIVE CONTROL DASHBOARD POLISH
   Balanced KPI strip + compact three-column workbench.
   Visual/summary-only; no order/tracking persistence changes.
   ============================================================ */
body.dashboard-mode .dashboard-intro{
  min-height:112px!important;
  padding:20px 24px!important;
  margin:0 0 12px!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 94% 16%,rgba(143,112,232,.22),transparent 27%),
    linear-gradient(118deg,#171c29 0%,#24283d 60%,#3d356a 100%)!important;
  box-shadow:0 20px 44px rgba(24,27,39,.14)!important;
}
body.dashboard-mode .dashboard-intro h2{
  font-size:clamp(2rem,2.5vw,2.65rem)!important;
  letter-spacing:-.045em!important;
  margin:.04em 0 .1em!important;
}
body.dashboard-mode .dashboard-intro p:not(.eyebrow){
  max-width:680px!important;
  font-size:.82rem!important;
  color:#d5d9e3!important;
}
body.dashboard-mode .dashboard-new-button{
  min-height:44px!important;
  padding:0 18px!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#1b1d25!important;
  box-shadow:0 12px 28px rgba(0,0,0,.14)!important;
}

/* Seven equal executive tiles on wide displays. */
body.dashboard-mode .metrics-grid{
  display:grid!important;
  grid-template-columns:repeat(7,minmax(0,1fr))!important;
  gap:9px!important;
  margin:0 0 12px!important;
}
body.dashboard-mode .metrics-grid .metric:nth-child(n){
  grid-column:auto!important;
  min-width:0!important;
  min-height:106px!important;
  padding:14px 14px 13px!important;
  border-radius:17px!important;
  background:linear-gradient(155deg,#fffdfa 0%,#faf7f1 100%)!important;
  border:1px solid #e9dfd0!important;
  box-shadow:0 8px 22px rgba(48,39,29,.045)!important;
}
body.dashboard-mode .metrics-grid .metric:before{
  height:32px!important;
  width:2px!important;
  top:15px!important;
  border-radius:99px!important;
}
body.dashboard-mode .metrics-grid .metric-topline{gap:7px!important;min-height:20px!important}
body.dashboard-mode .metrics-grid .metric-topline span{
  font-size:.57rem!important;
  letter-spacing:.105em!important;
  line-height:1.2!important;
}
body.dashboard-mode .metrics-grid .metric strong{
  margin-top:7px!important;
  font-size:1.28rem!important;
  letter-spacing:-.035em!important;
  line-height:1!important;
}
body.dashboard-mode .metrics-grid .metric small{
  margin-top:7px!important;
  font-size:.61rem!important;
  line-height:1.25!important;
  color:#8d8376!important;
}
body.dashboard-mode .metrics-grid .metric-balance{
  background:linear-gradient(155deg,#fffdf8,#fff7e9)!important;
  border-color:#ead7b5!important;
}
body.dashboard-mode .metrics-grid .metric-profit{
  background:linear-gradient(155deg,#fbfdfb,#f2f8f2)!important;
  border-color:#dbe8da!important;
}
body.dashboard-mode .metrics-grid .metric-shipping-customs{
  background:linear-gradient(155deg,#fcfbff,#f5f2fb)!important;
  border-color:#e2dcef!important;
}

/* Three-card operator workbench: no giant empty panels. */
.executive-dashboard-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.15fr)!important;
  gap:10px!important;
  margin:0 0 18px!important;
  align-items:stretch!important;
}
.focus-card{
  grid-column:auto!important;
  min-height:242px!important;
  height:242px!important;
  padding:16px!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:linear-gradient(160deg,#fffdfa 0%,#faf8f4 100%)!important;
  border:1px solid #e7ddd0!important;
  box-shadow:0 9px 25px rgba(39,31,24,.045)!important;
}
.focus-card-head{margin-bottom:12px!important}
.focus-card-head>div>span{font-size:.56rem!important;letter-spacing:.13em!important}
.focus-card-head h3{font-size:.98rem!important;margin-top:3px!important}
.focus-card-head>strong{
  min-width:28px!important;height:28px!important;padding:0 8px!important;
  display:grid!important;place-items:center!important;border-radius:10px!important;
  background:#f1e9db!important;color:#8d672c!important;font-size:.72rem!important;
}
.focus-card-head>button{
  padding:6px 8px!important;border-radius:9px!important;font-size:.62rem!important;
  color:#786b5d!important;
}
.focus-action-grid{display:grid!important;grid-template-columns:1fr!important;gap:6px!important}
.focus-action-grid button{
  min-height:42px!important;padding:7px 8px!important;border-radius:11px!important;
  background:#fff!important;border:1px solid #eee6db!important;
}
.focus-action-grid button span:nth-child(2) b{font-size:.7rem!important}
.focus-action-grid button span:nth-child(2) small{font-size:.58rem!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.focus-action-icon{width:27px!important;height:27px!important;border-radius:9px!important}
.focus-clear{
  min-height:142px!important;margin-top:4px!important;padding:14px!important;border-radius:13px!important;
  align-content:center!important;background:#fbfaf7!important;
}
.focus-clear.compact{min-height:104px!important}
.focus-collection-total{padding:4px 0 10px!important;margin-bottom:5px!important}
.focus-collection-total strong{font-size:1.65rem!important;letter-spacing:-.04em!important}
.focus-collection-total span{font-size:.6rem!important}
.focus-receivables{display:grid!important;gap:4px!important;max-height:132px!important;overflow:auto!important;padding-right:2px!important}
.focus-receivables button{min-height:31px!important;padding:5px 7px!important;border-radius:9px!important}
.focus-receivables b,.focus-receivables strong{font-size:.65rem!important}
.focus-receivables small{font-size:.55rem!important}
.focus-recent-list{display:grid!important;gap:4px!important;max-height:177px!important;overflow:auto!important;padding-right:2px!important}
.focus-recent-list button{
  min-height:38px!important;
  grid-template-columns:82px minmax(0,1fr) 68px 68px 14px!important;
  gap:7px!important;padding:6px 7px!important;border-radius:10px!important;
  background:#fff!important;border:1px solid #eee6db!important;
}
.focus-recent-list b,.focus-recent-list strong,.focus-order-client,.focus-order-status{font-size:.63rem!important}
.focus-recent-list small{font-size:.54rem!important}

html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric:nth-child(n),
html[data-theme="dark"] .focus-card{
  background:linear-gradient(155deg,#1d1d1d,#181817)!important;
  border-color:#3b3832!important;
  box-shadow:0 10px 26px rgba(0,0,0,.18)!important;
}
html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric small{color:#9f978b!important}
html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric-balance{background:linear-gradient(155deg,#211e18,#1b1916)!important}
html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric-profit{background:linear-gradient(155deg,#19201a,#171a17)!important}
html[data-theme="dark"] body.dashboard-mode .metrics-grid .metric-shipping-customs{background:linear-gradient(155deg,#1d1b22,#19181d)!important}
html[data-theme="dark"] .focus-action-grid button,
html[data-theme="dark"] .focus-receivables button,
html[data-theme="dark"] .focus-recent-list button,
html[data-theme="dark"] .focus-clear{background:#20201e!important;border-color:#39362f!important}

@media(max-width:1400px){
  body.dashboard-mode .metrics-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .executive-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .focus-recent-card{grid-column:1/-1!important;height:auto!important;min-height:190px!important}
  .focus-recent-list{grid-template-columns:1fr 1fr!important;max-height:none!important}
}
@media(max-width:900px){
  body.dashboard-mode .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .executive-dashboard-grid{grid-template-columns:1fr!important}
  .focus-card,.focus-recent-card{grid-column:1!important;height:auto!important;min-height:0!important}
  .focus-recent-list{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  body.dashboard-mode .dashboard-intro{padding:18px 16px!important;border-radius:18px!important}
  body.dashboard-mode .metrics-grid{gap:7px!important}
  body.dashboard-mode .metrics-grid .metric:nth-child(n){min-height:94px!important;padding:12px!important;border-radius:14px!important}
  body.dashboard-mode .metrics-grid .metric strong{font-size:1.08rem!important}
  .focus-card{padding:13px!important;border-radius:15px!important}
  .focus-recent-list button{grid-template-columns:76px minmax(0,1fr) 62px!important}
  .focus-order-status,.focus-recent-list button>em{display:none!important}
}


/* ============================================================
   V43.7.5 — DASHBOARD INTELLIGENCE + LAYOUT REBUILD
   Focused executive composition with selectable activity period.
   ============================================================ */
body.dashboard-mode .dashboard-intro{
  width:min(1460px,100%)!important;
  margin:0 auto 10px!important;
  min-height:104px!important;
  padding:19px 24px!important;
  border-radius:22px!important;
}
.dashboard-rangebar{
  width:min(1460px,100%);margin:0 auto 10px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:9px 10px 9px 15px;border:1px solid #e7ded2;border-radius:16px;background:rgba(255,255,255,.86);
  box-shadow:0 7px 24px rgba(37,32,27,.04);backdrop-filter:blur(12px);
}
.dashboard-range-copy{display:flex;align-items:baseline;gap:7px;white-space:nowrap;color:#8a8073}
.dashboard-range-copy span{font-size:.61rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900}
.dashboard-range-copy strong{font-size:.78rem;color:#252830}
.dashboard-range-options{display:flex;align-items:center;gap:4px;overflow-x:auto;scrollbar-width:none;padding:1px}
.dashboard-range-options::-webkit-scrollbar{display:none}
.dashboard-range-options button{
  border:0;background:transparent;color:#746b61;border-radius:10px;min-height:32px;padding:0 11px;white-space:nowrap;
  font:800 .66rem/1 inherit;cursor:pointer;transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}
.dashboard-range-options button:hover{background:#f4efe8;color:#272a31}
.dashboard-range-options button.active{background:#201f22;color:#fff;box-shadow:0 6px 15px rgba(24,22,20,.13)}

body.dashboard-mode .metrics-grid{
  width:min(1460px,100%)!important;margin:0 auto 11px!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:9px!important;
}
body.dashboard-mode .metrics-grid .metric:nth-child(-n+4){grid-column:span 3!important}
body.dashboard-mode .metrics-grid .metric:nth-child(n+5){grid-column:span 4!important}
body.dashboard-mode .metrics-grid .metric:nth-child(n){min-height:102px!important}

body.dashboard-mode .executive-dashboard-grid{
  width:min(1460px,100%)!important;margin:0 auto 20px!important;
  display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:10px!important;align-items:start!important;
}
body.dashboard-mode .focus-card{height:auto!important;min-height:0!important;padding:17px!important;border-radius:18px!important}
body.dashboard-mode .focus-attention-card{grid-column:span 5!important}
body.dashboard-mode .focus-collections-card{grid-column:span 7!important}
body.dashboard-mode .focus-recent-card{grid-column:1/-1!important}
body.dashboard-mode .focus-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.dashboard-mode .focus-clear{min-height:104px!important}
body.dashboard-mode .focus-recent-list{max-height:190px!important;overflow:auto!important}
body.dashboard-mode .focus-recent-list button{grid-template-columns:100px minmax(0,1fr) 92px 86px 15px!important}
body.dashboard-mode .focus-receivables{max-height:142px!important}

html[data-theme="dark"] .dashboard-rangebar{background:rgba(24,24,23,.9);border-color:#39352f;box-shadow:0 9px 28px rgba(0,0,0,.18)}
html[data-theme="dark"] .dashboard-range-copy{color:#938a7d}
html[data-theme="dark"] .dashboard-range-copy strong{color:#f0ece6}
html[data-theme="dark"] .dashboard-range-options button{color:#aaa195}
html[data-theme="dark"] .dashboard-range-options button:hover{background:#292724;color:#f1ece5}
html[data-theme="dark"] .dashboard-range-options button.active{background:#f1ece4;color:#201f1d}

@media(max-width:1180px){
  body.dashboard-mode .metrics-grid .metric:nth-child(n){grid-column:span 6!important}
  body.dashboard-mode .focus-attention-card,body.dashboard-mode .focus-collections-card{grid-column:1/-1!important}
}
@media(max-width:760px){
  .dashboard-rangebar{align-items:flex-start;flex-direction:column;padding:10px 11px;gap:8px}
  .dashboard-range-options{width:100%}
  .dashboard-range-options button{min-height:34px;padding:0 10px}
  body.dashboard-mode .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.dashboard-mode .metrics-grid .metric:nth-child(n){grid-column:auto!important}
  body.dashboard-mode .executive-dashboard-grid{grid-template-columns:1fr!important}
  body.dashboard-mode .focus-attention-card,body.dashboard-mode .focus-collections-card,body.dashboard-mode .focus-recent-card{grid-column:1!important}
  body.dashboard-mode .focus-action-grid{grid-template-columns:1fr!important}
}
@media(max-width:480px){
  body.dashboard-mode .metrics-grid{gap:7px!important}
  body.dashboard-mode .metrics-grid .metric:nth-child(n){min-height:94px!important;padding:12px!important}
  .dashboard-range-copy{width:100%;justify-content:space-between}
}


/* ============================================================
   V43.7.9 — QA: scoped Orders search + browser-safe invoice preview
   ============================================================ */
.invoice-preview-overlay{
  position:fixed!important; inset:0!important; z-index:12000!important;
  width:100vw!important; max-width:none!important; height:100dvh!important; max-height:none!important;
  margin:0!important; border:0!important; border-radius:0!important; padding:clamp(14px,3vw,34px)!important;
  background:rgba(15,23,42,.56)!important;
  backdrop-filter:blur(7px); -webkit-backdrop-filter:blur(7px);
  overflow:auto!important; box-sizing:border-box;
}
.invoice-preview-overlay[hidden]{display:none!important;}
.invoice-preview-overlay.is-open{display:grid!important;place-items:center!important;}
.invoice-preview-overlay .invoice-preview-shell{
  width:min(1040px,100%); height:min(900px,calc(100dvh - clamp(28px,6vw,68px)));
  max-height:calc(100dvh - clamp(28px,6vw,68px));
  border-radius:22px; overflow:hidden; box-shadow:0 34px 100px rgba(15,23,42,.34);
  border:1px solid color-mix(in srgb,var(--border,#e5e7eb) 84%,transparent);
}
@media(max-width:700px){
  .invoice-preview-overlay{padding:0!important;}
  .invoice-preview-overlay .invoice-preview-shell{width:100%;height:100dvh;max-height:100dvh;border-radius:0;border:0;}
}
\n\n/* ============================================================\n   V43.7.9 — CLIENTS INDEX + RELIABLE INVOICE PREVIEW\n   Preview is rendered inside the Invoice module; no native dialog/overlay dependency.\n   ============================================================ */\n.invoice-inline-preview{\n  width:100%; max-width:1040px; margin:0 auto; padding:0;\n}\n.invoice-inline-preview[hidden]{display:none!important;}\n.invoice-inline-preview-head{\n  display:flex; align-items:flex-start; justify-content:space-between; gap:18px;\n  padding:18px 20px; margin-bottom:16px; border:1px solid var(--border,#e5e7eb);\n  border-radius:18px; background:var(--surface,#fff); box-shadow:0 12px 30px rgba(15,23,42,.05);\n}\n.invoice-inline-preview-head h2{margin:2px 0 4px!important;}\n.invoice-inline-preview-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}\n.invoice-inline-preview-paper{\n  display:block!important; max-width:820px!important; margin:0 auto!important; min-height:560px;\n  border:1px solid var(--border,#e5e7eb); border-radius:18px; padding:28px!important;\n  background:var(--surface,#fff); box-shadow:0 18px 48px rgba(15,23,42,.08);\n}\nhtml[data-theme="dark"] .invoice-inline-preview-head,\nhtml[data-theme="dark"] .invoice-inline-preview-paper{background:#171b21!important;border-color:#303743!important;color:#f6f7f9!important;}\n#clientsPanel.active #clientHub:not([hidden]){display:block!important;}\n#clientsPanel.active #clientStatement[hidden]{display:none!important;}\n@media(max-width:760px){\n  .invoice-inline-preview{max-width:none;}\n  .invoice-inline-preview-head{flex-direction:column;padding:14px;border-radius:14px;}\n  .invoice-inline-preview-actions{width:100%;}\n  .invoice-inline-preview-actions .button{flex:1 1 auto;}\n  .invoice-inline-preview-paper{min-height:0;padding:18px!important;border-radius:14px;}\n}\n