/* Denis Geranin CRM — design tokens
   Source: Figma concept screens (Wallet Finder reference page), 2026-07-23 */

@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url('../assets/fonts/Stem-Hairline.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('../assets/fonts/Stem-Thin.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../assets/fonts/Stem-ExtraLight.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('../assets/fonts/Stem-ExtraLightItalic.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 350;
  font-display: swap;
  src: url('../assets/fonts/Stem-Light.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: italic;
  font-weight: 350;
  font-display: swap;
  src: url('../assets/fonts/Stem-LightItalic.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/Stem-Regular.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/Stem-Italic.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/Stem-Medium.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/Stem-MediumItalic.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/Stem-Bold.otf') format('opentype');
}
@font-face {
  font-family: 'Stem';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/Stem-BoldItalic.otf') format('opentype');
}

/* Golos Text — kept as fallback while Stem lacks a weight/style, or for future use */
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/golos-text-latin-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122;
}
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/golos-text-cyrillic-400.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/golos-text-latin-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122;
}
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/golos-text-cyrillic-700.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

:root {
  /* Colors — surfaces */
  --color-bg: #F3F5FB;
  --color-surface: #FFFFFF;
  --color-input-bg: #F3F5FB;
  --color-divider: #E2E5EF;

  /* Colors — brand / accents */
  --color-accent: #97FF47;
  --color-accent-ink: #000000;
  --color-action: #203EFF;
  --color-badge-blue: #6075FF;
  --color-error: #FF00DD;
  --color-stop: #FF060A;

  /* Colors — text */
  --color-text: #000000;
  --color-text-muted: #96948F;
  --color-text-faint: #B9BAC4;
  --color-link: #203EFF;

  /* Colors — icons (fixed-fill svg assets) */
  --color-icon-default: #D0D5E6;
  --color-icon-muted: #CED3E4;
  --color-icon-hover: #B0B8D1;

  /* Typography */
  --font-family: 'Stem', 'Golos Text', -apple-system, 'Segoe UI', sans-serif;
  --fs-h1: 24px;
  --fs-lg: 18px;
  --fs-base: 16px;
  --fs-sm: 14px;
  --fs-xs: 12px;
  --fw-light: 350;
  --fw-regular: 400;
  --fw-bold: 700;
  --color-text-soft: #1C1C22;

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 10px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 30px;
  --space-8: 40px;

  /* Radii */
  --radius-sm: 8px;
  --radius-md: 20px;
  --radius-pill: 40px;
  --radius-full: 999px;

  /* Layout */
  --sidebar-width: 260px;
  --right-col-width: 400px;
  --topbar-height: 75px;
  --control-h: 44px;

  /* Shadow */
  --shadow-1: 3px 3px 80px 15px rgba(0, 0, 0, 0.05);
  --shadow-sidebar: 4px 0 28px rgba(0, 0, 0, 0.09);
}