/* ============================================================
   Aabode Stays — Design Tokens
   "Coastal Luxe" palette for premium property management
   ============================================================ */

:root {
  /* ── Brand Colors ── */
  --ab-primary:        #1B2A4A;
  --ab-primary-light:  #3D5A80;
  --ab-primary-dark:   #111D33;
  --ab-accent:         #C17F59;
  --ab-accent-light:   #E8D5B7;
  --ab-accent-dark:    #9A6442;

  /* ── Semantic Colors ── */
  --ab-success:        #5B8A72;
  --ab-success-light:  #E8F3ED;
  --ab-danger:         #D4574E;
  --ab-danger-light:   #FBEAE9;
  --ab-warning:        #E6A940;
  --ab-warning-light:  #FDF4E3;
  --ab-info:           #4A90B8;
  --ab-info-light:     #E7F1F8;

  /* ── Surface Colors ── */
  --ab-surface:        #FAFAF7;
  --ab-surface-alt:    #F0EDE8;
  --ab-surface-card:   #FFFFFF;
  --ab-surface-hover:  #F5F2ED;

  /* ── Text Colors ── */
  --ab-text:           #2D2D2D;
  --ab-text-secondary: #6B6B6B;
  --ab-text-muted:     #9A9A9A;
  --ab-text-inverse:   #FFFFFF;
  --ab-text-link:      #3D5A80;
  --ab-text-link-hover:#1B2A4A;

  /* ── Border Colors ── */
  --ab-border:         #E2DDD5;
  --ab-border-light:   #F0EDE8;
  --ab-border-dark:    #C5BFB5;

  /* ── Border Radius ── */
  --ab-radius-xs:      4px;
  --ab-radius-sm:      6px;
  --ab-radius-md:      10px;
  --ab-radius-lg:      16px;
  --ab-radius-xl:      24px;
  --ab-radius-full:    9999px;

  /* ── Shadows ── */
  --ab-shadow-xs:      0 1px 2px rgba(27, 42, 74, 0.04);
  --ab-shadow-sm:      0 1px 3px rgba(27, 42, 74, 0.06), 0 1px 2px rgba(27, 42, 74, 0.04);
  --ab-shadow-md:      0 4px 12px rgba(27, 42, 74, 0.08);
  --ab-shadow-lg:      0 8px 30px rgba(27, 42, 74, 0.10);
  --ab-shadow-xl:      0 16px 48px rgba(27, 42, 74, 0.12);
  --ab-shadow-card:    0 2px 8px rgba(27, 42, 74, 0.06);
  --ab-shadow-card-hover: 0 8px 24px rgba(27, 42, 74, 0.10);

  /* ── Spacing Scale ── */
  --ab-space-1:        4px;
  --ab-space-2:        8px;
  --ab-space-3:        12px;
  --ab-space-4:        16px;
  --ab-space-5:        20px;
  --ab-space-6:        24px;
  --ab-space-8:        32px;
  --ab-space-10:       40px;
  --ab-space-12:       48px;
  --ab-space-16:       64px;
  --ab-space-20:       80px;
  --ab-space-24:       96px;

  /* ── Typography ── */
  --ab-font-display:   'DM Serif Display', Georgia, 'Times New Roman', serif;
  --ab-font-body:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ab-font-mono:      'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

  /* Font Sizes */
  --ab-text-xs:        0.75rem;    /* 12px */
  --ab-text-sm:        0.875rem;   /* 14px */
  --ab-text-base:      1rem;       /* 16px */
  --ab-text-lg:        1.125rem;   /* 18px */
  --ab-text-xl:        1.25rem;    /* 20px */
  --ab-text-2xl:       1.5rem;     /* 24px */
  --ab-text-3xl:       1.875rem;   /* 30px */
  --ab-text-4xl:       2.25rem;    /* 36px */
  --ab-text-5xl:       3rem;       /* 48px */
  --ab-text-6xl:       3.75rem;    /* 60px */

  /* Line Heights */
  --ab-leading-tight:  1.25;
  --ab-leading-snug:   1.375;
  --ab-leading-normal: 1.5;
  --ab-leading-relaxed:1.625;

  /* Font Weights */
  --ab-weight-light:   300;
  --ab-weight-normal:  400;
  --ab-weight-medium:  500;
  --ab-weight-semibold:600;
  --ab-weight-bold:    700;

  /* ── Transitions ── */
  --ab-transition-fast:    150ms ease;
  --ab-transition-base:    250ms ease;
  --ab-transition-slow:    350ms ease;
  --ab-transition-spring:  500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Z-Index Scale ── */
  --ab-z-dropdown:     1000;
  --ab-z-sticky:       1020;
  --ab-z-fixed:        1030;
  --ab-z-modal-backdrop: 1040;
  --ab-z-modal:        1050;
  --ab-z-tooltip:      1070;
  --ab-z-toast:        1090;

  /* ── Container Widths ── */
  --ab-container-sm:   640px;
  --ab-container-md:   768px;
  --ab-container-lg:   1024px;
  --ab-container-xl:   1280px;
  --ab-container-xxl:  1400px;
}

/* ── Dark Mode Support (future) ── */
/*
[data-theme="dark"] {
  --ab-primary:        #4A7AB5;
  --ab-surface:        #1A1A1A;
  --ab-surface-alt:    #2D2D2D;
  --ab-surface-card:   #333333;
  --ab-text:           #E8E8E8;
  --ab-text-secondary: #A0A0A0;
  --ab-border:         #404040;
}
*/