:root {
  /* ================================================================
     COLORS - Base
     ================================================================ */
  --bisbat-color-text: #1f1f1f;
  --bisbat-color-bg: #FFFFF8;
  --bisbat-color-bg-card:#fcfcf9;
  --bisbat-color-white: #ffffff;
  --bisbat-color-black: #000000;

  /* Grays */
  --bisbat-color-gray-100: #f8fafb;
  --bisbat-color-gray-200: #f3f3f3;
  --bisbat-color-gray-300: #edf1f3;
  --bisbat-color-gray-400: #e9edf0;
  --bisbat-color-gray-600: #d9e0e4;
  --bisbat-color-gray-700: #cfd8de;

  /* Blues - Primary palette */
  --bisbat-color-primary: #3a9fc3;
  --bisbat-color-primary-light: #53c0e0;
  --bisbat-color-primary-dark: #2e88a8;
  --bisbat-color-primary-hover: #2f86a6;
  --bisbat-color-accent-blue: #50b8df;

  /* Blues - Secondary/Dark */
  --bisbat-color-blue-700: #1d4f73;
  --bisbat-color-blue-800: #102639;
  --bisbat-color-blue-900: #16314b;
  --bisbat-color-navy: #1f2430;

  /* Text colors */
  --bisbat-color-title: #000000;
  --bisbat-color-text-primary: #24313b;
  --bisbat-color-text-secondary: #334e68;
  --bisbat-color-text-muted: #64707d;
  --bisbat-color-text-dark: #102a43;
  --bisbat-color-text-body: #2f3b45;

  /* Overlay & Backgrounds */
  --bisbat-color-overlay: rgba(0, 0, 0, 0.45);
  --bisbat-color-overlay-light: rgba(0, 0, 0, 0.12);
  --bisbat-color-overlay-medium: rgba(0, 0, 0, 0.20);
  --bisbat-color-overlay-dark: rgba(0, 0, 0, 0.72);

  /* Borders */
  --bisbat-color-border: #d9d9d9;
  --bisbat-color-border-light: rgba(0, 0, 0, 0.06);
  --bisbat-color-border-medium: rgba(0, 0, 0, 0.08);
  --bisbat-color-border-strong: rgba(15, 23, 42, 0.10);

  /* ================================================================
     SHADOWS
     ================================================================ */
  --bisbat-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.04);
  --bisbat-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.08);
  --bisbat-shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.12);
  --bisbat-shadow-medium: 0 14px 34px rgba(0, 0, 0, 0.18);
  --bisbat-shadow-lg: 0 18px 50px rgba(0, 0, 0, 0.30);

  /* Card shadows */
  --bisbat-shadow-card: 0 10px 28px rgba(24, 32, 56, 0.08);
  --bisbat-shadow-card-hover: 0 14px 34px rgba(24, 32, 56, 0.16);
  --bisbat-shadow-elevated: 0 8px 18px rgba(0, 0, 0, 0.15);

  /* Component specific shadows */
  --bisbat-shadow-table: 0 8px 24px rgba(15, 23, 42, 0.04);
  --bisbat-shadow-modal: 0 18px 44px rgba(0, 0, 0, 0.35);
  --bisbat-shadow-modal-button: 0 8px 18px rgba(0, 0, 0, 0.25);
  --bisbat-shadow-navigation: 0 20px 46px rgba(24, 32, 56, 0.10);
  --bisbat-shadow-mobile-menu: -16px 0 36px rgba(0, 0, 0, 0.12);

  /* ================================================================
     BORDER RADIUS
     ================================================================ */
  --bisbat-radius-sm: 6px;
  --bisbat-radius-md: 8px;
  --bisbat-radius-lg: 12px;
  --bisbat-radius-xl: 14px;
  --bisbat-radius-2xl: 16px;
  --bisbat-radius-3xl: 18px;
  --bisbat-radius-4xl: 20px;
  --bisbat-radius-5xl: 22px;
  --bisbat-radius-6xl: 24px;
  --bisbat-radius-full: 999px;

  /* ================================================================
     SPACING
     ================================================================ */
  --bisbat-space-1: 0.25rem;
  --bisbat-space-2: 0.5rem;
  --bisbat-space-3: 0.75rem;
  --bisbat-space-4: 1rem;
  --bisbat-space-5: 1.5rem;
  --bisbat-space-6: 2rem;
  --bisbat-space-7: 2.5rem;
  --bisbat-space-8: 3rem;

  /* ================================================================
     TRANSITIONS
     ================================================================ */
  --bisbat-transition-fast: 0.18s ease;
  --bisbat-transition-base: 0.2s ease;
  --bisbat-transition-medium: 0.22s ease;
  --bisbat-transition-slow: 0.25s ease;
  --bisbat-transition-slower: 0.28s ease;

  /* ================================================================
     LAYOUT
     ================================================================ */
  --bisbat-container: 1200px;
  --bisbat-container-narrow: 860px;
  --bisbat-container-content: 760px;

  /* ================================================================
     TYPOGRAPHY
     ================================================================ */
  --bisbat-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bisbat-font-display: Georgia, "Times New Roman", serif;

  /* Font sizes */
  --bisbat-text-xs: 0.75rem;
  --bisbat-text-sm: 0.875rem;
  --bisbat-text-md: 1rem;
  --bisbat-text-lg: 1.125rem;
  --bisbat-text-xl: 1.25rem;
  --bisbat-text-2xl: 1.5rem;
  --bisbat-text-3xl: 1.875rem;
  --bisbat-text-4xl: 2.25rem;
  --bisbat-title-xs: clamp(1.25rem, 2.5vw, 1.5rem);
  --bisbat-title-md: clamp(1.5rem, 3vw, 2rem);
  --bisbat-title-lg: clamp(2rem, 4vw, 3rem);
  --bisbat-title-xl: clamp(2.5rem, 5vw, 4rem);

  /* Line heights */
  --bisbat-leading-tightest: 1;
  --bisbat-leading-tight: 1.2;
  --bisbat-leading-compressed: 1.3;
  --bisbat-leading-normal: 1.5;
  --bisbat-leading-relaxed: 1.7;
  --bisbat-leading-loose: 1.8;
}