/*
 * RivaSpark core tokens
 *
 * This file owns shared visual decisions. Applications consume semantic tokens
 * and keep only domain-specific composition in their own stylesheets.
 */

@font-face {
  font-family: "DP Inter";
  src: url("/assets/fonts/Inter-Variable-Latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* Typography */
  --rv-font-ui: "DP Inter", Inter, sans-serif;
  --rv-font-supporting: "Open Sans", sans-serif;
  --rv-type-page-title-size: 24px;
  --rv-type-page-title-weight: 600;
  --rv-type-body-size: 14px;
  --rv-type-body-weight: 500;
  --rv-type-row-size: 13px;
  --rv-type-label-size: 12px;

  /* Spacing rhythm */
  --rv-space-1: 4px;
  --rv-space-2: 8px;
  --rv-space-3: 12px;
  --rv-space-4: 16px;
  --rv-space-5: 20px;
  --rv-space-6: 24px;
  --rv-space-8: 32px;
  --rv-space-10: 40px;
  --rv-app-gutter: clamp(20px, 4vw, 40px);

  /* Shared control geometry */
  --rv-control-height: 44px;
  --rv-control-inner-height: 42px;
  --rv-control-radius: 12px;
  --rv-action-height: 42px;
  --rv-action-radius: 11px;
  --rv-action-icon-size: 18px;

  /* Dark application theme — current approved CRM values */
  --rv-color-brand: #ff554a;
  --rv-color-brand-hover: #ff7067;
  --rv-color-on-brand: #ffffff;
  --rv-color-link: #fa635a;
  --rv-focus-color: var(--rv-color-brand);
  --rv-focus-width: 1px;
  --rv-focus-offset: 2px;
  --rv-focus-outline: var(--rv-focus-width) solid var(--rv-focus-color);
  --rv-focus-ring: 0 0 0 var(--rv-focus-width) var(--rv-focus-color);
  --rv-color-chrome: #08090a;
  --rv-color-workspace: #0e1013;
  --rv-color-text: #ffffff;
  --rv-color-muted: rgba(255, 255, 255, 0.67);
  --rv-color-border: rgba(255, 255, 255, 0.13);
  --rv-color-border-soft: rgba(255, 255, 255, 0.075);
  --rv-color-control: rgba(255, 255, 255, 0.045);
  --rv-color-menu: #111216;
  --rv-color-library-stripe: #151213;
  --rv-color-success: #4ade80;
  --rv-color-danger: #ff6b6b;
  --rv-color-warning: #fbbf24;
  --rv-color-violet: #c4b5fd;

  /*
   * Compatibility aliases for shared Library and action-menu components.
   * These values live here so applications never need the retired Admin
   * Sidebar stylesheet merely to render app-neutral controls.
   */
  --dp-content-gutter: var(--rv-app-gutter);
  --dp-action-height: 42px;
  --dp-action-radius: 10px;
  --dp-action-padding-inline: 18px;
  --dp-action-gap: 8px;
  --dp-action-icon-size: 18px;
  --dp-action-font-size: 14px;
  --dp-action-font-weight: 500;
  --dp-library-row-stripe: #151213;
  --dp-library-row-hover-base-surface-weight: 90%;
  --dp-library-row-hover-base-shade-weight: 10%;
  --dp-library-row-hover-stripe-surface-weight: 90%;
  --dp-library-row-hover-stripe-shade-weight: 10%;
  --dp-library-row-hover-shade: #000000;
  --dp-library-row-stripe-hover: color-mix(in srgb, var(--dp-library-row-stripe) var(--dp-library-row-hover-stripe-surface-weight), var(--dp-library-row-hover-shade) var(--dp-library-row-hover-stripe-shade-weight));
  --dp-library-divider-width: 1px;
  --dp-menu-width: 184px;
  --dp-menu-surface: #111216;
  --dp-menu-text: #ffffff;
  --dp-menu-muted: rgba(255, 255, 255, 0.67);
  --dp-menu-border: rgba(255, 255, 255, 0.14);
  --dp-menu-hover: rgba(255, 255, 255, 0.08);
  --dp-menu-danger: #ff6b6b;
  --dp-menu-danger-soft: rgba(255, 107, 107, 0.12);
  --dp-menu-shadow: 0 18px 48px rgba(0, 0, 0, 0.28);
}

html[data-dp-theme="light"],
html[data-rv-theme="light"] {
  color-scheme: light;
  --rv-color-brand-hover: #e5483e;
  --rv-color-link: #fa635a;
  --rv-color-chrome: #f7f7f8;
  --rv-color-workspace: #ffffff;
  --rv-color-text: #000000;
  --rv-color-muted: rgba(0, 0, 0, 0.62);
  --rv-color-border: rgba(0, 0, 0, 0.14);
  --rv-color-border-soft: rgba(0, 0, 0, 0.075);
  --rv-color-control: #f7f7f8;
  --rv-color-menu: #ffffff;
  --rv-color-library-stripe: #fff8f7;
  --rv-color-success: #09893f;
  --rv-color-danger: #b21830;
  --rv-color-warning: #8a5a00;
  --rv-color-violet: #6241c7;
  --dp-library-row-stripe: #fff8f7;
  --dp-library-row-stripe-hover: #ffe5e0;
  --dp-library-row-hover-base-surface-weight: 95%;
  --dp-library-row-hover-base-shade-weight: 5%;
  --dp-library-row-hover-stripe-surface-weight: 90%;
  --dp-library-row-hover-stripe-shade-weight: 10%;
  --dp-menu-surface: #ffffff;
  --dp-menu-text: #16171a;
  --dp-menu-muted: rgba(0, 0, 0, 0.62);
  --dp-menu-border: rgba(0, 0, 0, 0.16);
  --dp-menu-hover: #f2f3f5;
  --dp-menu-danger: #b21830;
  --dp-menu-danger-soft: rgba(178, 24, 48, 0.09);
  --dp-menu-shadow: 0 18px 48px rgba(24, 21, 30, 0.18);
}