/* =====================================================================
   NOLIKTAVAS.LV -- Design System Variables
   Theme: "Warehouse Editorial"
   ===================================================================== */

:root {
  /* COLORS */
  --ink:          #1C1C1E;
  --ink-2:        #3F3F46;
  --ink-3:        #71717A;
  --paper:        #F7F4EE;
  --paper-2:      #EEE9DF;
  --rust:         #BF4E20;
  --rust-hover:   #A3401A;
  --rust-light:   #FDF0EA;
  --rust-glow:    rgba(191, 78, 32, 0.15);
  --concrete:     #E4E0D8;
  --white:        #FFFFFF;

  /* Semantic */
  --success:      #2D7D46;
  --warning:      #D4A017;
  --error:        #C0392B;
  --star:         #F59E0B;

  /* Price segment badges */
  --budget-bg:    #ECFDF5;
  --budget-text:  #065F46;
  --mid-bg:       #FFF7ED;
  --mid-text:     #9A3412;
  --budmid-bg:    #F0FDF4;
  --budmid-text:  #166534;
  --premium-bg:   #FDF4FF;
  --premium-text: #7C3AED;

  /* TYPOGRAPHY */
  --font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --font-semi:    'Barlow Semi Condensed', 'Arial Narrow', sans-serif;
  --font-body:    'Source Serif 4', 'Georgia', serif;
  --font-ui:      'Barlow', 'Helvetica Neue', sans-serif;

  /* Font sizes (fluid, clamp) */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  clamp(1.5rem, 2vw + 0.5rem, 2rem);
  --text-3xl:  clamp(1.75rem, 2.5vw + 0.5rem, 2.5rem);
  --text-4xl:  clamp(2rem, 3vw + 0.5rem, 3rem);
  --text-5xl:  clamp(2.5rem, 4vw + 0.5rem, 3.75rem);

  /* SPACING */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  /* BORDER RADIUS */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-pill:  9999px;
  --radius-full:  9999px;

  /* SHADOWS */
  --shadow-sm:    0 1px 2px rgba(28, 28, 30, 0.06);
  --shadow-md:    0 2px 8px rgba(28, 28, 30, 0.08);
  --shadow-lg:    0 4px 16px rgba(28, 28, 30, 0.10);
  --shadow-xl:    0 8px 32px rgba(28, 28, 30, 0.12);
  --shadow-card:  0 2px 8px rgba(28, 28, 30, 0.06), 0 0 0 1px rgba(28, 28, 30, 0.04);
  --shadow-hover: 0 12px 40px rgba(28, 28, 30, 0.14);
  --shadow-rust:  0 4px 16px rgba(191, 78, 32, 0.25);

  /* TIMING */
  --dur-fast:   120ms;
  --dur-mid:    220ms;
  --dur-slow:   400ms;
  --dur-xslow:  700ms;
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Legacy transition shorthands */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-spring: 350ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* LAYOUT */
  --container-max:  1200px;
  --container-wide: 1400px;
  --sidebar-width:  320px;
  --header-height:  72px;

  /* Z-INDEX */
  --z-base:    1;
  --z-sticky:  100;
  --z-overlay: 200;
  --z-modal:   300;
  --z-toast:   400;

  /* Backward-compatible aliases (old --color-* names) */
  --color-ink:        var(--ink);
  --color-paper:      var(--paper);
  --color-rust:       var(--rust);
  --color-rust-hover: var(--rust-hover);
  --color-rust-light: var(--rust-light);
  --color-steel:      var(--ink-3);
  --color-concrete:   var(--concrete);
  --color-white:      var(--white);
  --color-success:    var(--success);
  --color-warning:    var(--warning);
  --color-error:      var(--error);
  --color-star:       var(--star);
}