/* ============================================================
   Helvia Console — Borders, radii & shadow tokens
   Shadows are all built from a single slate shadow-color so
   elevation reads as a soft cool grey, never pure black.
   ============================================================ */
:root {
  /* ---- Radii ---- */
  --border-radius-sm: 4px;
  --border-radius-base: 8px;   /* default — cards, inputs, buttons */
  --border-radius-lg: 12px;    /* images, large surfaces */
  --border-radius-pill: 999px;

  /* ---- Border widths ---- */
  --border-width-base: 2px;    /* note: Helvia uses a 2px border, not 1px */
  --border-width-hair: 1px;

  /* ---- Shadow colors ---- */
  --shadow-color: rgba(80, 87, 118, 0.2);
  --shadow-color-soft: rgba(80, 87, 118, 0.07);

  /* ---- Elevation scale ---- */
  --box-shadow-sm: 0px 2px 4px rgba(80, 87, 118, 0.2);
  --box-shadow: 0px 4px 4px rgba(80, 87, 118, 0.2);
  --box-shadow-lg: 0 6px 6px rgba(80, 87, 118, 0.2);
  /* Official card shadow — X0 Y10 Blur20 Spread0, #505776 @ 10% */
  --box-shadow-card: 0px 10px 20px 0px rgba(80, 87, 118, 0.1);
  /* Active / selected card shadow — X0 Y4 Blur80 Spread0, #605DEC @ 20% */
  --box-shadow-card-active: 0px 4px 80px 0px rgba(96, 93, 236, 0.2);
  /* Modal / dialog shadow — X0 Y4 Blur80 Spread0, #505776 @ 15% */
  --box-shadow-modal: 0px 4px 80px 0px rgba(80, 87, 118, 0.15);
  --box-shadow-soft: var(--box-shadow-card);  /* default card resting shadow */
  /* Selectable-card rings — the two interaction steps of a card that can be
     picked (OptionCard, IntegrationsModal provider cards). Drawn as a 3px
     spread shadow, never a border, so nothing reflows between states. */
  --box-shadow-ring-hover: 0 0 0 3px var(--ring-color-hover, #A4A2F4), var(--box-shadow-card);
  --box-shadow-ring-selected: 0 0 0 3px var(--ring-color-selected, #605DEC), var(--box-shadow-card-active);
  --box-shadow-bottom: 0 3px 2px 0px rgba(80, 87, 118, 0.07);
  --box-shadow-top: 0 -3px 3px rgba(80, 87, 118, 0.07);    /* sticky footers / mobile nav */
}
