/* Template look & feel (ims-template.html) layered over custom.css.
   Dash serves /assets alphabetically, so this file always loads last and wins
   ties against custom.css. Colour rules are scoped to the light scheme; the
   dark scheme keeps its existing palette. */

:root {
  --tpl-ink: #1a2540;
  --tpl-muted: #6b7280;
  --tpl-line: #e5e7eb;
  --tpl-line-soft: #f1f5f9;
  --tpl-bg: #f5f7fb;
  --tpl-head: #f8fafc;
  --tpl-head-ink: #475569;
  --tpl-radius: 10px;
  --tpl-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .08);
  --tpl-flag: linear-gradient(90deg, #000 0 25%, #CE1126 25% 50%, #078930 50% 75%, #1A6EE8 75% 100%);
  --tpl-font: "Times New Roman", Times, "Noto Serif", "Nimbus Roman", "Noto Naskh Arabic", Georgia, serif;
}

/* ---------- Typography: Times New Roman everywhere ---------- */
html,
body,
#react-entry-point,
.mantine-Text-root,
.mantine-Title-root,
.mantine-Button-root,
.mantine-Badge-root,
.mantine-NavLink-root,
.mantine-TextInput-input,
.mantine-PasswordInput-input,
.mantine-NumberInput-input,
.mantine-Select-input,
.mantine-Textarea-input,
.ag-theme-alpine {
  font-family: var(--tpl-font) !important;
}

/* ---------- Canvas ---------- */
[data-mantine-color-scheme="light"] body,
[data-mantine-color-scheme="light"] #main-col,
[data-mantine-color-scheme="light"] .cpi-main-page-shell {
  background: var(--tpl-bg) !important;
  color: var(--tpl-ink);
}

.cpi-main-page-shell {
  padding: 24px !important;
}

@media (max-width: 48em) {
  .cpi-main-page-shell {
    padding: 16px !important;
  }
}

/* ---------- Header: white bar with South Sudan flag stripe on top ---------- */
.cpi-header-bar {
  position: relative;
  min-height: 58px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  box-shadow: none !important;
}

.cpi-header-bar::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 4px;
  background: var(--tpl-flag);
}

[data-mantine-color-scheme="light"] .cpi-header-bar {
  background: #fff !important;
  border-bottom: 1px solid var(--tpl-line) !important;
}

#header-app-title.mantine-Title-root {
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* ---------- Sidebar ---------- */
[data-mantine-color-scheme="light"] .cpi-sidebar-shell {
  background: #fff !important;
  border-right: 1px solid var(--tpl-line) !important;
}

.cpi-sidebar-shell > .mantine-Stack-root {
  padding: 16px !important;
  gap: 12px !important;
}

[data-mantine-color-scheme="light"] .cpi-user-card {
  border: 1px solid var(--tpl-line) !important;
  border-radius: 8px !important;
  box-shadow: var(--tpl-shadow) !important;
  background: #fff !important;
}

.cpi-sidebar-nav .mantine-Text-root[data-size="xs"] {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  padding-left: 2px;
  margin-top: 10px !important;
  margin-bottom: 4px !important;
}

.cpi-nav-link.mantine-NavLink-root {
  padding: 7px 10px !important;
  border-radius: 6px !important;
  margin-bottom: 0 !important;
  font-size: 13.5px;
  font-weight: 500;
  box-shadow: none !important;
}

.cpi-nav-link.mantine-NavLink-root .mantine-NavLink-label {
  font-size: 13.5px;
}

[data-mantine-color-scheme="light"] .cpi-nav-link.mantine-NavLink-root {
  color: var(--tpl-ink);
}

[data-mantine-color-scheme="light"] .cpi-nav-link.mantine-NavLink-root:hover {
  background: var(--tpl-bg) !important;
}

[data-mantine-color-scheme="light"] .cpi-nav-link.mantine-NavLink-root[data-active="true"],
[data-mantine-color-scheme="light"] .cpi-nav-link.mantine-NavLink-root[data-active] {
  background: var(--mantine-color-cpi-0) !important;
  color: var(--mantine-color-cpi-7) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.cpi-nav-link.mantine-NavLink-root:active {
  transform: none !important;
}

.cpi-alert-strip {
  padding-top: 10px !important;
}

[data-mantine-color-scheme="light"] .cpi-alert-strip {
  border-top: 1px solid var(--tpl-line) !important;
}

/* ---------- Page header: plain title + subtitle, no boxed panel ---------- */
.cpi-page-hero.mantine-Paper-root,
[data-mantine-color-scheme="light"] .cpi-page-hero.mantine-Paper-root {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 20px !important;
}

[data-mantine-color-scheme="dark"] .cpi-page-hero.mantine-Paper-root {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.cpi-page-hero .mantine-Title-root {
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.25 !important;
}

.cpi-page-hero .cpi-page-eyebrow {
  font-size: 11px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  margin-bottom: 2px !important;
}

.cpi-page-hero .cpi-page-subtitle {
  font-size: 14px !important;
  margin-top: 4px !important;
}

[data-mantine-color-scheme="light"] .cpi-page-hero .cpi-page-subtitle {
  color: var(--tpl-muted) !important;
}

/* ---------- Cards & papers ---------- */
.mantine-Card-root {
  border-radius: var(--tpl-radius) !important;
  transform: none !important;
}

.mantine-Card-root:hover {
  transform: none !important;
}

[data-mantine-color-scheme="light"] .mantine-Card-root,
[data-mantine-color-scheme="light"] .mantine-Paper-root[data-with-border] {
  border: 1px solid var(--tpl-line) !important;
  box-shadow: var(--tpl-shadow) !important;
  background: #fff;
}

[data-mantine-color-scheme="light"] .mantine-Card-root:hover {
  box-shadow: var(--tpl-shadow) !important;
}

/* Accent bars on KPI / report / users cards are replaced by the flat template card. */
[data-mantine-color-scheme="light"] .cpi-kpi-card--accent.mantine-Card-root,
[data-mantine-color-scheme="light"] .cpi-rep-kpi-card.mantine-Card-root,
[data-mantine-color-scheme="light"] .cpi-users-form-card.mantine-Card-root,
[data-mantine-color-scheme="light"] .cpi-users-directory-card.mantine-Card-root {
  border: 1px solid var(--tpl-line) !important;
  border-top: 1px solid var(--tpl-line) !important;
  border-left: 1px solid var(--tpl-line) !important;
}

.cpi-kpi-value.mantine-Title-root,
.cpi-rep-kpi-value.mantine-Title-root {
  font-size: 26px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

[data-mantine-color-scheme="light"] .cpi-rep-kpi-value.mantine-Title-root {
  color: var(--tpl-ink) !important;
}

[data-mantine-color-scheme="light"] .cpi-toolbar-paper {
  background: #fff !important;
  border: 1px solid var(--tpl-line) !important;
  border-radius: var(--tpl-radius) !important;
  box-shadow: var(--tpl-shadow) !important;
}

.mantine-Card-root .mantine-Title-root[data-order="4"],
.mantine-Card-root .mantine-Title-root[data-order="5"] {
  font-size: 15px !important;
  font-weight: 600 !important;
}

/* ---------- Buttons ---------- */
.mantine-Button-root {
  border-radius: 8px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

.mantine-Button-root:hover,
.mantine-Button-root:active,
.mantine-Button-root[data-variant="filled"]:hover,
.mantine-Button-root[data-variant="filled"]:active:not([data-disabled="true"]),
.mantine-ActionIcon-root:hover:not([data-disabled="true"]) {
  transform: none !important;
}

.mantine-Button-root[data-variant="filled"]::after {
  display: none !important;
}

[data-mantine-color-scheme="light"] .mantine-Button-root[data-variant="filled"] {
  box-shadow: none !important;
}

[data-mantine-color-scheme="light"] .mantine-Button-root[data-variant="default"],
[data-mantine-color-scheme="light"] .mantine-Button-root[data-variant="outline"] {
  background: #fff;
}

[data-mantine-color-scheme="light"] .mantine-Button-root[data-variant="default"] {
  border-color: var(--tpl-line) !important;
  color: var(--tpl-ink) !important;
}

/* ---------- Badges: rounded pills ---------- */
.mantine-Badge-root {
  border-radius: 999px !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

.cpi-user-workspace-badge.mantine-Badge-root {
  border-radius: 999px !important;
}

/* ---------- Inputs ---------- */
[data-mantine-color-scheme="light"] .mantine-TextInput-input,
[data-mantine-color-scheme="light"] .mantine-PasswordInput-input,
[data-mantine-color-scheme="light"] .mantine-NumberInput-input,
[data-mantine-color-scheme="light"] .mantine-Select-input,
[data-mantine-color-scheme="light"] .mantine-MultiSelect-input,
[data-mantine-color-scheme="light"] .mantine-Textarea-input,
[data-mantine-color-scheme="light"] .mantine-DateInput-input {
  border-color: #d1d5db !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--tpl-ink) !important;
}

[data-mantine-color-scheme="light"] .mantine-TextInput-input:focus,
[data-mantine-color-scheme="light"] .mantine-PasswordInput-input:focus-within,
[data-mantine-color-scheme="light"] .mantine-NumberInput-input:focus,
[data-mantine-color-scheme="light"] .mantine-Select-input:focus,
[data-mantine-color-scheme="light"] .mantine-Textarea-input:focus {
  border-color: var(--mantine-color-cpi-5) !important;
}

.mantine-InputWrapper-label {
  font-weight: 600 !important;
  font-size: 13px !important;
  margin-bottom: 6px;
}

/* ---------- Tables ---------- */
.mantine-Table-table {
  font-size: 13px !important;
}

.mantine-Table-table thead th,
.mantine-Table-thead .mantine-Table-th {
  padding: 9px 12px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

[data-mantine-color-scheme="light"] .mantine-Table-table thead th,
[data-mantine-color-scheme="light"] .mantine-Table-thead .mantine-Table-th {
  background: var(--tpl-head) !important;
  color: var(--tpl-head-ink) !important;
  border-bottom: 1px solid var(--tpl-line) !important;
}

.mantine-Table-table tbody td {
  padding: 9px 12px !important;
}

[data-mantine-color-scheme="light"] .mantine-Table-table tbody td {
  border-bottom: 1px solid var(--tpl-line-soft) !important;
}

[data-mantine-color-scheme="light"] .mantine-Table-table tbody tr:nth-child(even) td {
  background: transparent !important;
}

[data-mantine-color-scheme="light"] .cpi-users-table .mantine-Table-thead th {
  background: var(--tpl-head) !important;
  color: var(--tpl-head-ink) !important;
}

/* AG Grid (alpine) */
[data-mantine-color-scheme="light"] .ag-theme-alpine {
  --ag-header-background-color: var(--tpl-head);
  --ag-header-foreground-color: var(--tpl-head-ink);
  --ag-border-color: var(--tpl-line);
  --ag-row-border-color: var(--tpl-line-soft);
  --ag-odd-row-background-color: #fff;
  --ag-row-hover-color: var(--tpl-bg);
  --ag-selected-row-background-color: var(--mantine-color-cpi-0);
  --ag-font-size: 13px;
  --ag-font-family: var(--tpl-font);
}

.ag-theme-alpine .ag-root-wrapper {
  border-radius: 8px;
}

.ag-theme-alpine .ag-header-cell {
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

/* ---------- Alerts ---------- */
.mantine-Alert-root {
  border-radius: 8px !important;
  border: 1px solid transparent;
}

[data-mantine-color-scheme="light"] .mantine-Alert-root[data-variant="light"][data-color="blue"],
[data-mantine-color-scheme="light"] .mantine-Alert-root[data-variant="light"][data-color="cpi"] {
  background: var(--mantine-color-cpi-0) !important;
  border-color: var(--mantine-color-cpi-2) !important;
}

[data-mantine-color-scheme="light"] .mantine-Alert-root[data-variant="light"][data-color="yellow"] {
  background: #fffbeb !important;
  border-color: #fde68a !important;
}

[data-mantine-color-scheme="light"] .mantine-Alert-root[data-variant="light"][data-color="red"] {
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}

[data-mantine-color-scheme="light"] .mantine-Alert-root[data-variant="light"][data-color="green"] {
  background: #f0fdf4 !important;
  border-color: #bbf7d0 !important;
}

/* ---------- Tabs: underline style ---------- */
.mantine-Tabs-tab {
  font-weight: 600 !important;
  font-size: 13px !important;
}

[data-mantine-color-scheme="light"] .mantine-Tabs-list {
  border-bottom: 1px solid var(--tpl-line);
}

[data-mantine-color-scheme="light"] .mantine-Tabs-tab:not([data-active]) {
  color: var(--tpl-muted) !important;
}

/* ---------- Modals ---------- */
.mantine-Modal-content {
  border-radius: 12px !important;
}

[data-mantine-color-scheme="light"] .mantine-Modal-header {
  border-bottom: 1px solid var(--tpl-line) !important;
}

.mantine-Modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* ---------- Page header must beat the generic bordered-paper rule above
   and custom.css's html[...] .cpi-page-hero rules. ---------- */
html[data-mantine-color-scheme] .cpi-page-hero.mantine-Paper-root,
html[data-mantine-color-scheme] .cpi-page-hero.mantine-Paper-root[data-with-border] {
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: 20px !important;
}

html[data-mantine-color-scheme] .cpi-page-hero.mantine-Paper-root::before,
html[data-mantine-color-scheme] .cpi-page-hero.mantine-Paper-root::after {
  display: none !important;
}

/* Section / KPI labels: sentence case like the template (overrides inline tt="uppercase"). */
.cpi-main-page-shell .mantine-Text-root {
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.cpi-main-page-shell .cpi-kpi-card .mantine-Text-root[data-size="xs"],
.cpi-main-page-shell .cpi-rep-kpi-card .mantine-Text-root[data-size="xs"] {
  font-size: 12px !important;
}

/* ---------- Operational alerts: dense scrollable rows ---------- */
.cpi-alert-list {
  max-height: 232px;
  overflow-y: auto;
  border: 1px solid var(--tpl-line);
  border-radius: 8px;
}

.cpi-alert-row {
  display: grid;
  grid-template-columns: 8px 64px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.35;
  border-bottom: 1px solid var(--tpl-line-soft);
}

.cpi-alert-row:last-child {
  border-bottom: 0;
}

.cpi-alert-row:hover {
  background: var(--tpl-head);
}

.cpi-alert-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #94a3b8;
}

.cpi-alert-dot--red { background: #CE1126; }
.cpi-alert-dot--orange { background: #d97706; }
.cpi-alert-dot--blue { background: #155AC0; }

.cpi-alert-sev {
  font-size: 11px;
  font-weight: 700;
  color: var(--tpl-muted);
}

.cpi-alert-sev--red { color: #b91c1c; }
.cpi-alert-sev--orange { color: #b45309; }
.cpi-alert-sev--blue { color: #0F4696; }

.cpi-alert-msg {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--tpl-ink);
}

.cpi-alert-when {
  font-size: 11px;
  color: var(--tpl-muted);
  white-space: nowrap;
}

.cpi-alert-viewall {
  font-size: 13px;
  font-weight: 600;
  color: var(--mantine-color-cpi-6);
  text-decoration: none;
}

.cpi-alert-viewall:hover {
  text-decoration: underline;
}

[data-mantine-color-scheme="dark"] .cpi-alert-list {
  border-color: var(--cpi-chrome-border);
}

[data-mantine-color-scheme="dark"] .cpi-alert-row {
  border-bottom-color: var(--cpi-chrome-border);
}

[data-mantine-color-scheme="dark"] .cpi-alert-row:hover {
  background: rgba(255, 255, 255, 0.03);
}

[data-mantine-color-scheme="dark"] .cpi-alert-msg {
  color: #e6ebf5;
}

/* ---------- Charts: each graph sits in a slim white card ---------- */
[data-mantine-color-scheme="light"] .cpi-page-wrap .dash-graph {
  background: #fff;
  border: 1px solid var(--tpl-line);
  border-radius: var(--tpl-radius);
  box-shadow: var(--tpl-shadow);
  padding: 6px 8px 2px;
  box-sizing: border-box;
}

[data-mantine-color-scheme="dark"] .cpi-page-wrap .dash-graph {
  background: var(--cpi-surface-raised);
  border: 1px solid var(--cpi-chrome-border);
  border-radius: var(--tpl-radius);
  padding: 6px 8px 2px;
  box-sizing: border-box;
}

.cpi-page-wrap .plotly-graph-div {
  margin-bottom: 0 !important;
}

/* ---------- Plotly charts sit flush inside template cards ---------- */
.js-plotly-plot .plotly .gtitle {
  font-family: var(--tpl-font) !important;
  font-weight: 600 !important;
}

/* ---------- Stock desk (guided home for store staff) ---------- */
.cpi-desk {
  display: flex;
  flex-direction: column;
  gap: 18px;
  font-size: 16px;
}

.cpi-desk-greeting {
  font-size: 26px;
  font-weight: 700;
  color: var(--tpl-ink);
}

.cpi-desk-sub {
  font-size: 16px;
  color: var(--tpl-muted);
  margin-top: 2px;
}

.cpi-desk-tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 1100px) {
  .cpi-desk-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.cpi-desk-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-height: 150px;
  padding: 20px 22px;
  border: 2px solid var(--tpl-line);
  border-top: 6px solid var(--desk-tone, #155AC0);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--tpl-shadow);
  cursor: pointer;
  text-align: left;
  font-family: var(--tpl-font);
  color: var(--tpl-ink);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.cpi-desk-tile:hover,
.cpi-desk-tile:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(15, 23, 42, .12);
  outline: none;
}

.cpi-desk-tile.is-active {
  border-color: var(--desk-tone);
  background: var(--desk-soft);
}

.cpi-desk-tile--green { --desk-tone: #078930; --desk-soft: #ecf8f0; }
.cpi-desk-tile--orange { --desk-tone: #c2410c; --desk-soft: #fff4ec; }
.cpi-desk-tile--blue { --desk-tone: #155AC0; --desk-soft: #eef4ff; }
.cpi-desk-tile--purple { --desk-tone: #6b3fa0; --desk-soft: #f5f0fb; }

.cpi-desk-tile-icon { color: var(--desk-tone); }

.cpi-desk-tile-title {
  font-size: 21px;
  font-weight: 700;
}

.cpi-desk-tile-hint {
  font-size: 14px;
  color: var(--tpl-muted);
}

.cpi-desk-badge {
  position: absolute;
  top: 12px;
  right: 14px;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 14px;
  background: #CE1126;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  align-items: center;
  justify-content: center;
}

.cpi-desk-panel,
.cpi-desk-today {
  background: #fff;
  border: 1px solid var(--tpl-line);
  border-radius: 12px;
  box-shadow: var(--tpl-shadow);
  padding: 22px 24px;
}

.cpi-desk-panel-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
  color: #0F4696;
}

.cpi-desk-panel-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--tpl-ink);
}

.cpi-desk-panel-text {
  font-size: 15px;
  color: var(--tpl-muted);
}

.cpi-desk-step {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}

.cpi-desk-step-num {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #155AC0;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cpi-desk-step-label {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 6px;
  color: var(--tpl-ink);
}

.cpi-desk-step-hint {
  font-size: 14px;
  color: var(--tpl-muted);
  margin-top: 6px;
}

.cpi-desk-bad { color: #b91c1c; font-weight: 600; }
.cpi-desk-saved { color: #078930; font-weight: 400; font-size: 14px; }

.cpi-desk-confirm {
  border: 2px solid #155AC0;
  border-radius: 12px;
  background: #f4f8ff;
  padding: 18px 20px;
  margin-bottom: 14px;
}

.cpi-desk-confirm-title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
  color: #0F4696;
}

.cpi-desk-summary {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
}

.cpi-desk-summary th {
  text-align: left;
  width: 42%;
  padding: 7px 10px 7px 0;
  color: var(--tpl-muted);
  font-weight: 600;
  border-bottom: 1px solid #dbe5f6;
}

.cpi-desk-summary td {
  padding: 7px 0;
  font-weight: 700;
  color: var(--tpl-ink);
  border-bottom: 1px solid #dbe5f6;
}

.cpi-desk-alert { font-size: 15px; margin-top: 8px; }

.cpi-desk-subcard {
  border: 1px solid var(--tpl-line);
  border-radius: 10px;
  padding: 16px 18px;
  background: var(--tpl-head);
}

.cpi-desk-subcard-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--tpl-ink);
}

.cpi-desk-progress {
  font-size: 17px;
  font-weight: 700;
}

.cpi-desk .ag-theme-alpine {
  --ag-font-size: 15px;
  --ag-row-height: 40px;
  --ag-font-family: var(--tpl-font);
}

.cpi-desk .cpi-count-cell {
  background: #fff8d6;
  font-weight: 700;
  font-size: 16px;
}

.cpi-desk .cpi-row-short { background: #fdecec !important; }
.cpi-desk .cpi-row-over { background: #e9f7ee !important; }

.cpi-desk-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 6px;
}

.cpi-desk-fact {
  padding: 8px 14px;
  border-radius: 8px;
  background: var(--tpl-head);
  border: 1px solid var(--tpl-line);
  font-size: 15px;
}

.cpi-desk-fact.is-ok { border-color: #b7e0c4; }
.cpi-desk-fact.is-short { border-color: #f3b4b4; background: #fdf3f3; }
.cpi-desk-fact.is-over { border-color: #b7e0c4; background: #f1faf4; }

.cpi-desk-link {
  font-size: 15px;
  font-weight: 600;
  color: #155AC0;
  text-decoration: none;
}

.cpi-desk-link:hover { text-decoration: underline; }

.cpi-desk .mantine-Input-input,
.cpi-desk .mantine-Select-input {
  font-size: 16px;
}

[data-mantine-color-scheme="dark"] .cpi-desk-tile,
[data-mantine-color-scheme="dark"] .cpi-desk-panel,
[data-mantine-color-scheme="dark"] .cpi-desk-today {
  background: var(--cpi-surface-raised);
  border-color: var(--cpi-chrome-border);
  color: #e6ebf5;
}

[data-mantine-color-scheme="dark"] .cpi-desk-tile.is-active { background: rgba(255, 255, 255, .06); }
[data-mantine-color-scheme="dark"] .cpi-desk-greeting,
[data-mantine-color-scheme="dark"] .cpi-desk-panel-title,
[data-mantine-color-scheme="dark"] .cpi-desk-step-label,
[data-mantine-color-scheme="dark"] .cpi-desk-subcard-title,
[data-mantine-color-scheme="dark"] .cpi-desk-summary td { color: #e6ebf5; }
[data-mantine-color-scheme="dark"] .cpi-desk-subcard,
[data-mantine-color-scheme="dark"] .cpi-desk-confirm,
[data-mantine-color-scheme="dark"] .cpi-desk-fact { background: rgba(255, 255, 255, .03); }
[data-mantine-color-scheme="dark"] .cpi-desk .cpi-count-cell { background: rgba(250, 204, 21, .15); }