/* Portico Partners — theme layer over the Institutional design system (styles.css / tokens/*).
   Light is the system's own semantic aliases; dark re-points the same aliases at the navy ramp.
   Every colour, size and space below is a token or derived from one. */
:root {
  /* Additional tokens this product needs; values chained from the system's own where one exists. */
  --touch-min: 44px;
  --nav-height: 68px;
  --sidebar-width: 264px;
  --hero-min: 72vh;
  --fs-hero: clamp(3rem, 6vw, var(--fs-display-xl));
  --measure: 62ch;
  --card-min: 260px;
  --card-min-sm: 200px;
  --card-min-lg: 280px;
  --stat-min: 140px;
  --table-min: 560px;
  --search-max: 320px;
  --pre-max: 240px;
  --hairline: 1px;

  /* Accent text must clear 4.5:1 on white: the 700 tint of the same hue. */
  --text-accent: var(--df-orange-700);
  --btn-primary-bg: var(--df-orange-700);
  --btn-primary-bg-hover: var(--df-navy-900);
  --btn-primary-fg: var(--df-white);
  --btn-secondary-bg: var(--df-navy-500);
  --btn-secondary-fg: var(--df-white);
  --btn-ghost-fg: var(--df-navy-900);
  --btn-ghost-border: var(--df-navy-300);

  --surface-nav: var(--df-white);
  --surface-hero-overlay: linear-gradient(100deg, rgba(12, 29, 66, 0.92) 0%, rgba(12, 29, 66, 0.72) 55%, rgba(12, 29, 66, 0.35) 100%);
  --surface-footer: var(--df-navy-900);
  --surface-sidebar: var(--df-navy-900);
  --text-sidebar: var(--grey-200);
  --text-sidebar-active: var(--df-white);
  --surface-sidebar-active: var(--df-navy-700);
  --surface-input: var(--df-white);
  --border-input: var(--grey-300);
  --surface-row-hover: var(--grey-050);
  --surface-skeleton: var(--grey-100);
  --surface-skeleton-shine: var(--grey-050);

  /* Status pairs: text on tint, each pair clears 4.5:1. */
  --status-success-text: #166A45;
  --status-success-bg: #E3F3EA;
  --status-warning-text: #8A4B0B;
  --status-warning-bg: #FDEBD8;
  --status-danger-text: #A32F10;
  --status-danger-bg: #FBE3DC;
  --status-info-text: var(--df-navy-500);
  --status-info-bg: var(--df-navy-050);
  --status-neutral-text: var(--grey-800);
  --status-neutral-bg: var(--grey-100);

  --chart-1: var(--df-navy-500);
  --chart-2: var(--df-orange-700);
  --chart-3: var(--df-navy-300);
  --chart-4: var(--df-peach);
  --chart-grid: var(--grey-200);
  color-scheme: light;
}

[data-theme="dark"] {
  --surface-page: var(--df-navy-900);
  --surface-card: var(--df-navy-700);
  --surface-subtle: #142452;
  --surface-sunken: #0A1836;
  --surface-accent-soft: rgba(240, 78, 35, 0.16);
  --surface-nav: var(--df-navy-900);
  --surface-footer: var(--grey-950);
  --surface-sidebar: var(--grey-950);
  --surface-sidebar-active: var(--df-navy-700);
  --surface-input: #0F2049;
  --border-input: var(--df-navy-300);
  --surface-row-hover: #21336B;
  --surface-skeleton: #21336B;
  --surface-skeleton-shine: #2A3F7E;

  --text-strong: var(--df-white);
  --text-body: var(--grey-200);
  --text-muted: var(--grey-300);
  --text-faint: var(--grey-400);
  --text-accent: var(--df-peach);
  --border-subtle: #2A3F7E;
  --border-default: var(--df-navy-300);
  --border-strong: var(--df-peach);

  --btn-primary-bg: var(--df-orange-700);
  --btn-primary-bg-hover: var(--df-orange-600);
  --btn-secondary-bg: var(--df-navy-100);
  --btn-secondary-fg: var(--df-navy-900);
  --btn-ghost-fg: var(--df-white);
  --btn-ghost-border: var(--df-navy-300);

  --status-success-text: #9FE3BE;
  --status-success-bg: #14402C;
  --status-warning-text: #FAD3A6;
  --status-warning-bg: #4A2F12;
  --status-danger-text: #F9B9A6;
  --status-danger-bg: #4E1F14;
  --status-info-text: var(--df-navy-100);
  --status-info-bg: #22397A;
  --status-neutral-text: var(--grey-200);
  --status-neutral-bg: #2A3F7E;

  --chart-1: var(--df-navy-300);
  --chart-2: var(--df-peach);
  --chart-3: var(--df-navy-100);
  --chart-4: var(--df-orange-500);
  --chart-grid: #2A3F7E;
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.5);
  color-scheme: dark;
}
