/**
 * DocForge — Custom styles
 * Only non-DaisyUI utilities live here. All components use DaisyUI classes.
 */

/* ── Tab icons (15px inline SVG via mask) ── */

/* Hide Alpine-controlled elements until Alpine inits — prevents flash */
[x-cloak], [x-cloak] * { display: none !important; }

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.5; }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}

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

.animate-spin  { animation: spin 1s linear infinite; }
.animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
.fade-in       { animation: fadeIn 0.3s ease-out; }
.tab-fade-in   { animation: tabFadeIn 0.2s ease-out; }

/* ── Scrollbar ── */

::-webkit-scrollbar        { width: 6px; height: 6px; }
::-webkit-scrollbar-track  { background: oklch(var(--b2)); }
::-webkit-scrollbar-thumb  { background: oklch(var(--bc) / 0.2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: oklch(var(--bc) / 0.35); }

/* ── Focus ring ── */

.focus-ring:focus,
.focus-ring:focus-visible {
  outline: 2px solid oklch(var(--p));
  outline-offset: 2px;
}

/* ── Chart container ── */

.chart-container {
  position: relative;
  height: 300px;
  width: 100%;
}
.chart-container canvas { max-height: 100%; }

/* ── Loading overlay ── */

.loading-overlay {
  position: fixed; inset: 0;
  background-color: oklch(var(--b1) / 0.8);
  display: flex; align-items: center; justify-content: center;
  z-index: 9999;
}

.loading-spinner {
  display: flex; align-items: center; gap: 0.5rem;
  background: oklch(var(--b1));
  padding: 1rem 1.5rem;
  border-radius: var(--radius, 0.375rem);
  box-shadow: 0 4px 12px oklch(0 0 0 / 0.1);
}

/* ── Icons (background-image from /static/img/) ── */

.tab-icon, .icon, .icon-sm, .icon-xs {
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  flex-shrink: 0;
}

.tab-icon, .icon { width: 15px; height: 15px; margin-right: 3px; vertical-align: -2px; }
.icon-sm { width: 13px; height: 13px; margin-right: 2px; vertical-align: -1px; }
.icon-xs { width: 11px; height: 11px; margin-right: 2px; vertical-align: -1px; }

/* ── Tab bar ── */
.svg-upload   { background-image: url("/static/img/ingest.svg"); }
.svg-archive  { background-image: url("/static/img/archive.svg"); }
.svg-extract  { background-image: url("/static/img/extract.svg"); }
.svg-query    { background-image: url("/static/img/query.svg"); }
.svg-schema   { background-image: url("/static/img/schema.svg"); }
.svg-config   { background-image: url("/static/img/config.svg"); }
.svg-llm      { background-image: url("/static/img/llm-config.svg"); }
.svg-keys     { background-image: url("/static/img/key.svg"); }

/* ── Config sections ── */
.svg-general   { background-image: url("/static/img/general.svg"); }
.svg-models    { background-image: url("/static/img/models.svg"); }
.svg-vision    { background-image: url("/static/img/vision.svg"); }
.svg-docindex  { background-image: url("/static/img/docindex.svg"); }
.svg-security  { background-image: url("/static/img/security.svg"); }

/* ── Sidebar ── */
.svg-workspace { background-image: url("/static/img/workspace.svg"); }
.svg-files     { background-image: url("/static/img/files.svg"); }

/* ── Actions ── */
.svg-save    { background-image: url("/static/img/save.svg"); }
.svg-play    { background-image: url("/static/img/play.svg"); }
.svg-stop    { background-image: url("/static/img/stop.svg"); }
.svg-send    { background-image: url("/static/img/send.svg"); }
.svg-cleanup { background-image: url("/static/img/cleanup.svg"); }
.svg-select  { background-image: url("/static/img/select.svg"); }
.svg-refresh { background-image: url("/static/img/refresh.svg"); }

/* ── Tab styling ── */
/* Self-contained. No DaisyUI .tab class — avoids framework overrides. */

button.ui-tab-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  font-size: 0.8rem;
  padding: 0.35rem 0.75rem;
  font-weight: 500;
  color: oklch(var(--bc) / 0.5);
  background-color: transparent;
  border: none;
  border-radius: 0;
  outline: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease;
}

button.ui-tab-btn:hover {
  color: oklch(var(--pc));
  background-color: oklch(var(--p) / 0.15);
}

button.ui-tab-btn:active {
  background-color: oklch(var(--p) / 0.25);
}

button.ui-tab-btn.tab-active,
button.ui-tab-btn[aria-selected="true"] {
  font-weight: 600;
  color: oklch(var(--pc));
  background-color: oklch(var(--p));
}

button.ui-tab-btn:focus,
button.ui-tab-btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* ── Print ── */

@media print {
  .no-print { display: none !important; }
  .card { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
  .modal { position: static; box-shadow: none; max-width: 100%; }
}

/* ── Reduced motion ── */

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

/* ── Config dirty highlight ── */

.config-dirty {
  border-color: oklch(var(--p)) !important;
  box-shadow: 0 0 0 1px oklch(var(--p) / 0.3);
}

/* ── Card hover lift ── */

.card-lift {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.card-lift:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px oklch(0 0 0 / 0.08);
}

/* ── Dark mode brand glow ── */

[data-theme="business"] .brand-text,
[data-theme="night"]    .brand-text,
[data-theme="dim"]      .brand-text,
[data-theme="black"]    .brand-text,
[data-theme="dracula"]  .brand-text,
[data-theme="sunset"]   .brand-text {
  text-shadow: 0 0 12px oklch(var(--p) / 0.3);
}

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

/* Navbar settings slot — gear icon button for layout (wrap-lines) */
.navbar-settings-slot { display: inline-flex; }
.navbar-settings-slot .settings-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 50%;
  border: 0;
  background: transparent;
  color: oklch(var(--bc) / 0.85);
  cursor: pointer;
}
.navbar-settings-slot .settings-btn:hover {
  background: oklch(var(--bc) / 0.1);
  color: oklch(var(--p));
}
.navbar-settings-slot .settings-popover {
  right: 0;
  left: auto;
  top: calc(100% + 4px);
}

/* ── File viewer code block ── */
#file-view-code {
  line-height: 1.5;
  max-height: 70vh;
  overflow: auto;
  border-radius: 0.375rem;
  padding: 0.75rem;
  margin: 0;
  background: oklch(var(--b2)) !important;
  color: oklch(var(--bc));
}
#file-view-code code {
  background: none !important;
  padding: 0 !important;
}
/* Override hljs theme bg/color to follow DaisyUI tokens */
.hljs {
  background: transparent !important;
  color: inherit;
  padding: 0 !important;
}

/* ── ag-grid overrides — borderless, morphs into window ── */
.ag-theme-quartz.tracker-grid,
.ag-theme-quartz-dark.tracker-grid,
.ag-theme-quartz-auto-light.tracker-grid {
  --ag-font-family: 'Courier New', ui-monospace, monospace;
  --ag-font-size: 10.5px;
  --ag-cell-horizontal-padding: 8px;
  --ag-header-cell-label-font-size: 10px;
  --ag-header-height: 36px;
  --ag-row-height: 52px;
  --ag-list-item-height: 28px;
  --ag-borders: none;
  --ag-border-color: transparent;
  --ag-row-border-color: oklch(var(--bc) / 0.06);
  --ag-header-background-color: transparent;
  --ag-odd-row-background-color: transparent;
  --ag-background-color: transparent;
  --ag-foreground-color: oklch(var(--bc));
  --ag-secondary-foreground-color: oklch(var(--bc) / 0.65);
  --ag-header-foreground-color: oklch(var(--bc) / 0.85);
  --ag-disabled-foreground-color: oklch(var(--bc) / 0.4);
  --ag-row-hover-color: transparent;
  --ag-header-cell-hover-background-color: transparent;
  --ag-header-cell-moving-background-color: transparent;
  --ag-modal-overlay-background-color: transparent;
  --ag-panel-background-color: transparent;
  --ag-menu-background-color: oklch(var(--b2));
  --ag-card-radius: 0;
  --ag-border-radius: 0;
  --ag-wrapper-border-radius: 0;
  --ag-transition-duration: 0s;
  border: 0 !important;
  background: transparent !important;
}
.ag-theme-quartz.tracker-grid .ag-row,
.ag-theme-quartz.tracker-grid .ag-header-cell {
  border-bottom: 1px solid oklch(var(--bc) / 0.06);
}
/* Kill all ag-grid transitions / hover overlays — paint-on-hover causes flicker */
.ag-theme-quartz.tracker-grid .ag-row,
.ag-theme-quartz.tracker-grid .ag-cell,
.ag-theme-quartz.tracker-grid .ag-header-cell,
.ag-theme-quartz.tracker-grid .ag-header-cell::before,
.ag-theme-quartz.tracker-grid .ag-row::before,
.ag-theme-quartz.tracker-grid .ag-row-hover::before {
  transition: none !important;
  box-shadow: none !important;
}
.ag-theme-quartz.tracker-grid .ag-row-hover::before,
.ag-theme-quartz.tracker-grid .ag-row.ag-row-hover::after { display: none !important; }
/* Odd-row stripe via CSS instead of inline getRowStyle (avoids per-render repaint) */
.ag-theme-quartz.tracker-grid .ag-row[data-row-index$="1"],
.ag-theme-quartz.tracker-grid .ag-row[data-row-index$="3"],
.ag-theme-quartz.tracker-grid .ag-row[data-row-index$="5"],
.ag-theme-quartz.tracker-grid .ag-row[data-row-index$="7"],
.ag-theme-quartz.tracker-grid .ag-row[data-row-index$="9"] {
  background: oklch(var(--bc) / 0.035);
}
.ag-theme-quartz.tracker-grid .ag-header-row {
  border-bottom: 1px solid oklch(var(--bc) / 0.12);
}
/* ── Stage row tints (very light / high transparency) ── */
.ag-row-stage-declined {
  background-color: rgba(194, 35, 56, 0.08) !important;
}
.ag-row-stage-shortlisted {
  background-color: rgba(58, 166, 216, 0.08) !important;
}
.ag-row-stage-screened {
  background-color: rgba(253, 190, 17, 0.08) !important;
}
.ag-row-stage-invested {
  background-color: rgba(58, 166, 136, 0.08) !important;
}

/* Stage chip: uses cat-chip class — no extra rules needed. */
.col-stage .stage-empty {
  opacity: 0.3;
}

/* Sub-Stage chips */
.col-substage {
  display: flex;
  gap: 3px;
  align-items: center;
  flex-wrap: wrap;
}
.col-substage .sub-chip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 1px 5px;
  border-radius: 8px;
  font-size: 9px;
  cursor: pointer;
  user-select: none;
  border: 1px solid currentColor;
  transition: background 0.1s;
}
.col-substage .sub-chip:hover { background: oklch(var(--bc) / 0.08); }
.col-substage .sub-chip--not_started {
  color: oklch(var(--bc) / 0.35);
  border-style: dashed;
}
.col-substage .sub-chip--pending {
  color: oklch(0.72 0.18 75);
  background: oklch(0.72 0.18 75 / 0.12);
}
.col-substage .sub-chip--finished {
  color: oklch(0.65 0.18 145);
  background: oklch(0.65 0.18 145 / 0.12);
}
.col-substage .sub-chip-glyph {
  font-size: 11px;
  line-height: 1;
}

/* ── Toolbar (v8 look) ── */
.tracker-toolbar {
  position: sticky;
  top: 48px;
  z-index: 40;
  background: oklch(var(--b1));
  padding: 6px 0 4px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: 'Courier New', ui-monospace, monospace;
}

.tracker-toolbar .strat-tabs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  align-items: center;
}
.strat-tab {
  padding: 3px 8px;
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
  border: 1px solid oklch(var(--bc) / 0.25);
  background: transparent;
  color: oklch(var(--bc) / 0.55);
  cursor: pointer;
  font-family: inherit;
  transition: color 0.1s ease, background-color 0.1s ease, border-color 0.1s ease;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.strat-tab:hover { opacity: 0.85; }
.strat-tab.active { color: inherit; }
.strat-tab .strat-count {
  background: oklch(var(--bc) / 0.15);
  color: inherit;
  border-radius: 8px;
  padding: 0 5px;
  font-size: 8px;
  margin-left: 2px;
}

.tracker-toolbar .filters-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.filter-input {
  background: oklch(var(--b2));
  border: 1px solid oklch(var(--bc) / 0.15);
  color: oklch(var(--bc));
  padding: 4px 9px;
  font-size: 10.5px;
  font-family: inherit;
  border-radius: 2px;
  outline: none;
  min-width: 180px;
}
.filter-input:focus { border-color: oklch(var(--p)); }
.evergreen-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10.5px;
  color: oklch(var(--bc) / 0.8);
  cursor: pointer;
  user-select: none;
}
.row-count {
  font-size: 9px;
  color: oklch(var(--bc) / 0.5);
  letter-spacing: 0.06em;
}

.tracker-toolbar .col-toggles {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.col-toggle {
  padding: 2px 7px;
  font-size: 8.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
  border: 1px solid oklch(var(--bc) / 0.15);
  background: transparent;
  color: oklch(var(--bc) / 0.45);
  cursor: pointer;
  font-family: inherit;
  transition: color 0.1s ease, background-color 0.1s ease, border-color 0.1s ease;
}
.col-toggle.on {
  background: oklch(var(--b3));
  color: oklch(var(--bc) / 0.85);
  border-color: oklch(var(--bc) / 0.35);
}

/* ── Multi-select filter ── */
.tracker-toolbar .multisel-row {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.multisel-wrap {
  position: relative;
  display: inline-block;
}
.multisel-pill {
  padding: 2px 7px;
  font-size: 8.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
  border: 1px solid oklch(var(--bc) / 0.15);
  background: transparent;
  color: oklch(var(--bc) / 0.55);
  cursor: pointer;
  font-family: inherit;
  transition: color 0.1s ease, background-color 0.1s ease, border-color 0.1s ease;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.multisel-pill:hover { opacity: 0.85; }
.multisel-pill.active {
  background: oklch(var(--p) / 0.15);
  color: oklch(var(--p));
  border-color: oklch(var(--p) / 0.4);
}
.multisel-pill .multisel-badge {
  background: oklch(var(--p));
  color: oklch(var(--pc, 1 0 0));
  border-radius: 8px;
  padding: 0 5px;
  font-size: 8px;
  margin-left: 2px;
}
.multisel-pill .multisel-caret { opacity: 0.6; font-size: 8px; }

.multisel-popover {
  display: none;
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  z-index: 60;
  min-width: 180px;
  max-height: 280px;
  overflow-y: auto;
  background: oklch(var(--b1));
  border: 1px solid oklch(var(--bc) / 0.15);
  border-radius: 3px;
  box-shadow: 0 4px 16px oklch(0 0 0 / 0.12);
  padding: 6px;
  font-size: 10.5px;
}
.multisel-wrap.open .multisel-popover { display: block; }
.multisel-clear {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid oklch(var(--bc) / 0.1);
  color: oklch(var(--bc) / 0.6);
  padding: 3px 4px 6px;
  font-family: inherit;
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}
.multisel-clear:hover { color: oklch(var(--p)); }
.multisel-option {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 4px;
  color: oklch(var(--bc) / 0.85);
  white-space: nowrap;
  cursor: pointer;
  font-size: 10.5px;
}
.multisel-option:hover { background: oklch(var(--bc) / 0.05); }
.multisel-option input { margin: 0; }

/* ── Airtable-style categorical chips ── */
.cat-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 2px;
  font-size: 9.5px;
  letter-spacing: 0.02em;
  font-weight: 500;
  white-space: nowrap;
  line-height: 1.45;
  background: hsl(var(--chip-hue, 210) 60% 45% / 0.22);
  color: hsl(var(--chip-hue, 210) 55% 35%);
  border: 0;
}
[data-theme="business"] .cat-chip {
  background: hsl(var(--chip-hue, 210) 55% 50% / 0.28);
  color: hsl(var(--chip-hue, 210) 60% 75%);
}
.cat-chip + .cat-chip { margin-left: 3px; }

/* ── Status text colors — theme-aware, color-coded by meaning ── */
/* Light mode (Nord): darker saturated text for contrast on light bg */
.cell-status.cell-status-red   { color: oklch(0.5 0.2 25); }
.cell-status.cell-status-amber { color: oklch(0.48 0.15 75); }
.cell-status.cell-status-green { color: oklch(0.42 0.13 145); }
.cell-status.cell-status-blue  { color: oklch(0.42 0.13 240); }
/* Dark mode (Business): brighter saturated text for contrast on dark bg */
[data-theme="business"] .cell-status.cell-status-red   { color: oklch(0.72 0.2 25); }
[data-theme="business"] .cell-status.cell-status-amber { color: oklch(0.78 0.15 75); }
[data-theme="business"] .cell-status.cell-status-green { color: oklch(0.75 0.16 145); }
[data-theme="business"] .cell-status.cell-status-blue  { color: oklch(0.75 0.13 240); }

/* ── Settings popup (layout: wrap-lines toggle) ── */
.toolbar-spacer { flex: 1 1 auto; }
.settings-wrap { position: relative; display: inline-block; }
.settings-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  font-size: 8.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 2px;
  border: 0;
  background: transparent;
  color: oklch(var(--bc) / 0.85);
  cursor: pointer;
  font-family: inherit;
  transition: color 0.1s ease;
}
.settings-btn:hover {
  color: oklch(var(--p));
}
.settings-gear { font-size: 10px; line-height: 1; }
.settings-label { opacity: 0.7; }
.settings-wrap.open .settings-btn {
  color: oklch(var(--p));
}
.settings-popover {
  display: none;
  position: absolute;
  top: calc(100% + 2px);
  right: 0;
  z-index: 60;
  min-width: 200px;
  background: oklch(var(--b1));
  border: 1px solid oklch(var(--bc) / 0.15);
  border-radius: 3px;
  box-shadow: 0 4px 16px oklch(0 0 0 / 0.12);
  padding: 6px;
}
.settings-wrap.open .settings-popover { display: block; }
.settings-title {
  font-size: 9px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: oklch(var(--bc) / 0.55);
  padding: 2px 4px 4px;
  border-bottom: 1px solid oklch(var(--bc) / 0.1);
  margin-bottom: 4px;
}
.settings-section { padding: 2px 4px; }
.settings-section-label {
  font-size: 10px;
  color: oklch(var(--bc) / 0.75);
  margin-bottom: 4px;
}
.settings-option {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 4px;
  font-size: 10.5px;
  color: oklch(var(--bc) / 0.85);
  cursor: pointer;
  white-space: nowrap;
}
.settings-option:hover { background: oklch(var(--bc) / 0.05); }
.settings-option input { margin: 0; }

/* ── Grid frame: distinct bg highlights grid area ── */
.grid-frame {
  background: var(--grid-bg, oklch(var(--b1)));
  padding: 6px 8px 4px;
  border-radius: 0;
}

/* Wrap-line clamp — value driven by [data-wrap] on the grid container.
   Clamp sits on the cell renderer's inner div so it always owns the text node. */
.tracker-grid[data-wrap="2"] { --wrap-lines: 2; }
.tracker-grid[data-wrap="3"] { --wrap-lines: 3; }
.tracker-grid .cell-clamp-inner {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--wrap-lines, 3);
  overflow: hidden;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  line-height: 1.35;
}

/* Header text wrap — breaks only at spaces; words never break mid-char */
.tracker-grid .ag-header-cell .ag-header-cell-text {
  white-space: normal;
  overflow-wrap: normal;
  word-break: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: var(--header-wrap-lines, 3);
}

/* Chips in grid cells — inherits white-space:nowrap from .cat-chip base; never wraps */
.tracker-grid .ag-cell .cat-chip {
  display: inline-block;
  vertical-align: top;
  max-width: 100%;
}

/* Stable scrollbars — prevent gutter from appearing/disappearing on hover */
.ag-theme-quartz.tracker-grid .ag-body-viewport,
.ag-theme-quartz.tracker-grid .ag-body-horizontal-scroll-viewport,
.ag-theme-quartz.tracker-grid .ag-body-vertical-scroll-viewport {
  scrollbar-gutter: stable;
}

/* ── Contrast: ensure muted text readable in light mode ── */
[data-theme="nord"] .tracker-toolbar,
[data-theme="nord"] .filter-input,
[data-theme="nord"] .multisel-pill,
[data-theme="nord"] .col-toggle,
[data-theme="nord"] .strat-tab {
  color: oklch(var(--bc) / 0.85);
}
[data-theme="nord"] .strat-tab { color: oklch(var(--bc) / 0.75); }
[data-theme="nord"] .row-count { color: oklch(var(--bc) / 0.7); }
[data-theme="nord"] .ag-theme-quartz.tracker-grid {
  --ag-secondary-foreground-color: oklch(var(--bc) / 0.85);
  --ag-header-foreground-color: oklch(var(--bc) / 0.95);
  --ag-disabled-foreground-color: oklch(var(--bc) / 0.55);
}

/* ── All buttons filled (no transparent ghost variant) ── */
.btn-ghost {
  background-color: oklch(var(--b3));
  color: oklch(var(--bc));
}
.btn-ghost:hover {
  background-color: oklch(var(--bc) / 0.15);
  color: oklch(var(--bc));
}
.btn-square.btn-ghost { background-color: oklch(var(--b3)); }

/* ── Row actions column ── */
.row-actions {
  display: flex;
  gap: 6px;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.row-actions button {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  line-height: 1;
  padding: 4px 6px;
  border-radius: 2px;
  color: oklch(var(--bc) / 0.65);
}
.row-actions button:hover { color: oklch(var(--p)); background: oklch(var(--bc) / 0.08); }
.row-actions button.act-del:hover { color: #e04040; background: oklch(0.65 0.2 25 / 0.1); }
.row-actions button:focus { outline: 0; }
.row-actions button:focus-visible { outline: 0; }

/* Suppress ag-grid cell focus border (transparent rect on row action click) */
.tracker-grid .ag-cell-focus,
.tracker-grid .ag-cell:focus,
.tracker-grid .ag-cell:focus-visible,
.tracker-grid .ag-row-focus::after { border: 0 !important; outline: 0 !important; }
.tracker-grid .ag-cell:active { outline: 0; }

/* ── Flag cell: full-cell click target ── */
.ag-theme-quartz.tracker-grid .ag-row .col-flag {
  cursor: pointer;
  font-size: 15px;
  text-align: center;
  padding: 0 !important;
}
.ag-theme-quartz.tracker-grid .ag-row .col-flag .flag-star {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
}

/* ── Vertical centering for all cells + inner renderers ── */
.ag-theme-quartz.tracker-grid .ag-cell {
  display: flex !important;
  align-items: center !important;
}
.ag-theme-quartz.tracker-grid .ag-cell > .ag-cell-value,
.ag-theme-quartz.tracker-grid .ag-cell > .ag-react-container {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  height: 100%;
}
.ag-theme-quartz.tracker-grid .ag-cell .cell-clamp-inner,
.ag-theme-quartz.tracker-grid .ag-cell strong,
.ag-theme-quartz.tracker-grid .ag-cell span,
.ag-theme-quartz.tracker-grid .ag-cell a {
  vertical-align: middle;
}

/* ── Theme toggle hit area ── */
.theme-toggle-btn {
  min-width: 44px;
  min-height: 36px;
  padding: 0 10px;
}

/* ── Navbar PNG icons: invert to white in dark mode ── */
[data-theme="business"] .nav-icon {
  filter: invert(1);
}

/* ── Dealflow screening status chips ── */
.screening-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 20px;
  border-radius: 3px;
  font-size: 11px;
  font-family: monospace;
  border: 1px solid transparent;
  transition: opacity 0.1s;
}
.screening-chip:hover { opacity: 0.75; }
.chip-not-started {
  color: oklch(var(--bc) / 0.3);
  border-color: oklch(var(--bc) / 0.15);
}
.chip-pending {
  background: oklch(var(--wa) / 0.15);
  color: oklch(var(--wa));
  border-color: oklch(var(--wa) / 0.3);
}
.chip-finished {
  background: oklch(var(--su) / 0.15);
  color: oklch(var(--su));
  border-color: oklch(var(--su) / 0.3);
}

/* ── Markdown preview prose styles ── */
.md-preview h1,.md-preview h2,.md-preview h3 { font-weight: 600; margin: 0.5em 0 0.25em; }
.md-preview h1 { font-size: 1.1em; }
.md-preview h2 { font-size: 1em; }
.md-preview h3 { font-size: 0.95em; }
.md-preview p  { margin: 0.3em 0; }
.md-preview ul,.md-preview ol { margin: 0.3em 0 0.3em 1.2em; }
.md-preview li { margin: 0.1em 0; }
.md-preview code { font-family: monospace; background: oklch(var(--bc)/0.08); padding: 1px 4px; border-radius: 2px; }
.md-preview pre  { background: oklch(var(--bc)/0.08); padding: 6px 8px; border-radius: 3px; overflow-x: auto; }
.md-preview blockquote { border-left: 3px solid oklch(var(--bc)/0.2); margin: 0.3em 0; padding-left: 0.75em; opacity: 0.7; }
.md-preview strong { font-weight: 600; }
.md-preview em { font-style: italic; }


/* ── HTMX loading indicator ── */
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator { display: inline-block; }
.htmx-request.htmx-indicator { display: inline-block; }

/* ── Note modal — resizable + responsive ── */
.note-modal-box {
  /* Visible resize handle — WebKit */
  resize: both;
  overflow: auto;
}
.note-modal-box::-webkit-resizer {
  background: linear-gradient(135deg, transparent 50%, oklch(var(--bc)/0.3) 50%, oklch(var(--bc)/0.3) 60%, transparent 60%, transparent 70%, oklch(var(--bc)/0.3) 70%, oklch(var(--bc)/0.3) 80%, transparent 80%);
}

/* ── Dealflow screening column header centering ── */
.dealflow-screening-header .ag-header-cell-label {
  justify-content: center;
  text-align: center;
}
.dealflow-screening-header .ag-header-cell-text {
  text-align: center;
}

/* ── Semantic input accent — left-stripe by widget type.
     Pure CSS, zero markup change. Aids form scanning.
     primary  = choice (select, combobox, multi-select)
     secondary = numeric
     accent   = prose (textarea, markdown)
     info     = file input
     Free text (input[type=text]) stays default — neutral.
     Use box-shadow inset so DaisyUI border + focus ring stay intact. ── */
.select-bordered,
.multi-select-box > .input-bordered,
input.input-bordered[list] {
  box-shadow: inset 4px 0 0 oklch(var(--p));
}
input[type="number"].input-bordered {
  box-shadow: inset 4px 0 0 oklch(var(--s));
}
.textarea-bordered {
  box-shadow: inset 4px 0 0 oklch(var(--a));
}
.file-input-bordered {
  box-shadow: inset 4px 0 0 oklch(var(--in));
}
/* DaisyUI v4 uses outline for focus ring (not box-shadow), so inset accent persists on focus. */

/* ── MOBILE LAYOUT — breakpoint: 768px (Tailwind md: / window._MOBILE_BP) ──────────────
   All mobile overrides live here. Desktop rules above are UNTOUCHED.
   JS companion: window._isMobile() in base.html checks the same threshold.            */
@media (max-width: 767px) {
  /* Tighter page padding */
  #main-content { padding: 6px 8px 12px !important; }

  /* Tab bar: scroll horizontally, never wrap; hide scrollbar gutter */
  .tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    gap: 0;
  }
  .tabs::-webkit-scrollbar { display: none; }
  .tab { flex-shrink: 0; gap: 0; padding: 0 10px; }

  /* Sticky toolbar padding */
  .tracker-toolbar { padding: 4px 0 2px; gap: 4px; }

  /* Denser grid rows on small screens */
  .ag-theme-quartz.tracker-grid,
  .ag-theme-quartz-dark.tracker-grid {
    --ag-row-height: 40px;
    --ag-header-height: 30px;
    --ag-font-size: 10px;
  }

  /* Brand subtitle already hidden at 900px — reinforce */
  .brand-subtitle { display: none; }
}

/* ── HTMX button loading state ────────────────────────────────────────────
   Toggled by modal-loading.js on click of any HTMX-driven button.
   Hides children + overlays a spinner ring using currentColor (adapts to
   btn-primary/error/ghost/etc). pointer-events:none blocks double-submit. */
.btn.is-loading {
  position: relative;
  pointer-events: none;
  opacity: 0.85;
  animation: btn-loading-pulse 1s ease-in-out infinite;
}
.btn.is-loading > * { visibility: hidden; }
.btn.is-loading::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: btn-loading-spin 0.7s linear infinite;
}
@keyframes btn-loading-spin { to { transform: rotate(360deg); } }
@keyframes btn-loading-pulse {
  0%, 100% { filter: brightness(1); }
  50%      { filter: brightness(1.18); }
}

/* ── Section tone — inset left marker (no layout shift) ──────────────────
   Inset shadow avoids the 4px offset that `border-left` would cause,
   so fields inside a section stay aligned with fields outside. */
.sec-tone-primary   { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--p)  72%, transparent); }
.sec-tone-secondary { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--s)  72%, transparent); }
.sec-tone-accent    { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--a)  72%, transparent); }
.sec-tone-info      { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--in) 72%, transparent); }
.sec-tone-success   { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--su) 72%, transparent); }
.sec-tone-warning   { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--wa) 72%, transparent); }
.sec-tone-error     { box-shadow: inset 4px 0 0 color-mix(in oklch, var(--er) 72%, transparent); }

/* ── Primary-key field — bold text + thin themed border ──────────────────
   No background change (keeps select dropdown contrast intact).
   Dark (business): orange border. Light (nord): purple border. */
.pk-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
.pk-field select,
.pk-field textarea {
  font-weight: 600;
}
[data-theme="business"] .pk-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
[data-theme="business"] .pk-field select,
[data-theme="business"] .pk-field textarea {
  border-color: oklch(0.75 0.18 55);   /* daisyUI orange */
}
[data-theme="nord"] .pk-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]),
[data-theme="nord"] .pk-field select,
[data-theme="nord"] .pk-field textarea {
  border-color: oklch(0.55 0.22 295);  /* daisyUI purple */
}