/* ============================================
   K.O. Shisha Bar — Design Tokens
   ============================================ */

:root {
  /* Colors — Background */
  --color-bg-deep:       #08080c;
  --color-bg:            #0e0e14;
  --color-bg-card:       #16161e;
  --color-bg-card-hover: #1c1c26;
  --color-bg-glass:      rgba(22, 22, 30, 0.6);
  --color-border:        rgba(255, 255, 255, 0.06);

  /* Colors — Text */
  --color-text:          #e8e6f0;
  --color-text-muted:    #9896a6;

  /* Colors — Accent */
  --color-accent:        #d4a053;
  --color-accent-light:  #e8c17a;
  --color-accent-2:      #c06040;

  /* Colors — Feedback */
  --color-success:       #4ade80;
  --color-error:         #f87171;

  /* Spacing Scale */
  --space-xs:   4px;
  --space-sm:   8px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   32px;
  --space-2xl:  48px;
  --space-3xl:  64px;

  /* Border Radius */
  --radius-sm:  6px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-xl:  16px;
  --radius-2xl: 24px;
  --radius-full: 9999px;

  /* Transitions */
  --transition-fast:   0.15s ease;
  --transition-base:   0.3s ease;
  --transition-slow:   0.5s ease;
  --transition-spring: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Z-Index Scale */
  --z-base:     1;
  --z-dropdown: 100;
  --z-sticky:   500;
  --z-header:   1000;
  --z-overlay:  1500;
  --z-modal:    2000;
  --z-toast:    2500;

  /* Layout */
  --container:  1200px;

  /* Fonts */
  --font-body:    'Inter', sans-serif;
  --font-heading: 'Plus Jakarta Sans', sans-serif;
}