/* Dark / light theming for the ZaviFx site kit.
   Light is the canonical brand theme; dark re-declares the SEMANTIC tokens only —
   primitives, brand accents and the gradient are untouched. */
:root{color-scheme:light;--pill-active-bg:var(--color-ink-strong);--pill-active-fg:#FFFFFF}

[data-theme="dark"]{
  color-scheme:dark;

  /* surface + border primitives: re-pointed so components that reference the raw
     primitive (rather than a semantic alias) also theme correctly */
  --color-canvas:#0B0A09;
  --color-surface:#151312;
  --color-surface-soft:#121110;
  --color-hairline:#2A2724;
  --color-hairline-soft:#201E1C;
  --color-footer-bg:#050403;
  --pill-active-bg:#FFFFFF;
  --pill-active-fg:#0B0A09;
  --bg-page:#0B0A09;
  --bg-subtle:#121110;
  --bg-sunken:#151312;
  --surface-card:#131211;
  --surface-card-subtle:#181615;

  --text-strong:#FFFFFF;
  --text-body:#F2EFEC;
  --text-secondary:#CFC9C4;
  --text-tertiary:#A69F99;
  --text-muted:#8A837D;
  --text-placeholder:#6E6862;
  --text-link:#FFB166;
  --text-link-hover:#FFC48A;
  --text-code:#FFB166;

  --border-hairline:#2A2724;
  --border-hairline-soft:#201E1C;
  --border-strong:#F2EFEC;
  --focus-ring:#FFB166;

  --action-primary-bg:#FFFFFF;
  --action-primary-bg-hover:#EDE9E6;
  --action-primary-bg-active:#FFFFFF;
  --action-primary-fg:#0B0A09;
  --action-secondary-border:#4A4540;
  --action-secondary-fg:#F2EFEC;
  --action-ghost-bg-hover:#1E1B19;
  --action-disabled-bg:#221F1D;
  --action-disabled-fg:#6E6862;

  --feedback-success-bg:#122019;--feedback-success-border:#24402F;--feedback-success-fg:#7FD3A1;
  --feedback-error-bg:#2A1414;--feedback-error-border:#4A2323;--feedback-error-fg:#F09A9A;
  --feedback-warning-bg:#251B0C;--feedback-warning-border:#423113;--feedback-warning-fg:#E8B96A;
  --feedback-info-bg:#141C2E;--feedback-info-border:#25334F;--feedback-info-fg:#9DBBF5;
}

/* dark-mode adjustments for kit chrome */
[data-theme="dark"] .zx-head.is-solid{background:rgba(11,10,9,.82);border-bottom-color:var(--border-hairline)}
[data-theme="dark"] .zx-burger i{background:var(--text-body)}
[data-theme="dark"] .zx-filter__pill[aria-selected=true] i{color:var(--color-brand-orange-deep)}
[data-theme="dark"] .zx-work__view{background:#fff;color:#0B0A09}
[data-theme="dark"] .zx-work__shot img{filter:saturate(.95) brightness(.94)}

[data-theme="dark"] .zx-hero__title,[data-theme="dark"] .zx-hero__sub{text-shadow:0 4px 60px rgba(0,0,0,.8)}

/* ---------- toggle ---------- */
.zx-themebtn{position:relative;width:44px;height:44px;border-radius:var(--radius-pill);border:1px solid var(--border-hairline);background:transparent;color:var(--text-body);display:grid;place-items:center;overflow:hidden;transition:var(--transition-standard);flex:none}
.zx-themebtn:hover{border-color:var(--color-brand-orange);background:rgba(242,112,28,.1)}
.zx-head.is-onhero:not(.is-solid) .zx-themebtn{border-color:rgba(255,255,255,.28);color:#fff}
.zx-themebtn svg{grid-area:1/1;transition:opacity 260ms var(--ease-standard),transform 420ms var(--ease-standard)}
.zx-themebtn .zx-moon{opacity:0;transform:rotate(-70deg) scale(.6)}
[data-theme="dark"] .zx-themebtn .zx-sun{opacity:0;transform:rotate(70deg) scale(.6)}
[data-theme="dark"] .zx-themebtn .zx-moon{opacity:1;transform:none}

/* Deterministic dark overrides for the two declarations that lost the cascade to a
   light value emitted later in the document (measured, not assumed). */
[data-theme="dark"] .zx-proc__card{border-color:#2A2724 !important}
[data-theme="dark"] .zx-proc__card:hover{border-color:var(--color-brand-orange) !important}
[data-theme="dark"] .zx-filter__pill[aria-selected="true"]{background:#FFFFFF !important;border-color:#FFFFFF !important;color:#0B0A09 !important}
[data-theme="dark"] .zx-work__view{background:#FFFFFF !important;color:#0B0A09 !important}