/* ==========================================================================
   AIA GA Direct – Shared Design Tokens (Head Markup)
   Source: AIA Digital Design System (design.aia.com)
   
   Usage: Add to Experience Builder > Settings > Advanced > Head Markup:
   <link rel="stylesheet" href="{!$Resource.AIAGADirectStyles}" />
   
   These CSS custom properties are set on :root so they pierce Shadow DOM
   and are inherited by all aiagadirect* LWC components.
   ========================================================================== */

/* ── Font Face Declarations ─────────────────────────────── */
@font-face {
  font-family: 'AIA Everest Condensed Medium';
  src: url('/aiagadirect/resource/AIAEverest/AIAEverest-CondensedMedium.woff2') format('woff2'),
       url('/aiagadirect/resource/AIAEverest/AIAEverest-CondensedMedium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Primary Colours ──────────────────────────────────── */
  --aia-red: #e00842;
  --aia-red-hover: #b30635;
  --aia-red-light: #e84671;
  --aia-red-dark: #b30635;
  --aia-navy: #082065;
  --aia-blue: #0c6dd2;

  /* ── Feedback Colours ─────────────────────────────────── */
  --aia-green: #229f64;
  --aia-green-dark: #1a7a4d;
  --aia-success: #229f64;
  --aia-warning: #f7c926;
  --aia-amber: #f7c926;
  --aia-error: #d40c74;
  --aia-info: #0c6dd2;
  --aia-decline: #dc3545;
  --aia-gold: #f7c926;

  /* ── Text Colours ─────────────────────────────────────── */
  --aia-text: #14181c;
  --aia-text-primary: #14181c;
  --aia-text-secondary: #666e75;
  --aia-text-sub: #666e75;
  --aia-text-muted: #858b91;
  --aia-text-inverse: #ffffff;
  --aia-text-link: #e00842;
  --aia-white: #ffffff;

  /* ── Surface / Background Colours ─────────────────────── */
  --aia-background: #f5f7f9;
  --aia-background-alt: #f5f5f6;
  --aia-bg: #f5f7f9;
  --aia-grey: #f5f7f9;
  --aia-surface-overlay: #ffffff;
  --aia-surface-inverse: #333d47;
  --aia-dark: #082065;

  /* ── Border / Divider ─────────────────────────────────── */
  --aia-border: #d6d8da;
  --aia-border-light: #d6d8da;

  /* ── Button Hover ─────────────────────────────────────── */
  --aia-btn-secondary-hover-bg: #FFEDF1;
  --aia-btn-disabled-bg: #EBECED;

  /* ── Chip / Pill Controls ─────────────────────────────── */
  --aia-chip-hover-bg: rgba(20, 24, 28, 0.08);
  --aia-chip-selected-hover-bg: #DADEE8;

  /* ── Alert Colours ────────────────────────────────────── */
  --aia-alert-error-bg: #fbe7f1;
  --aia-alert-error-border: #ec96c3;
  --aia-alert-success-bg: #e9f5f0;
  --aia-alert-success-border: #a7d9c1;
  --aia-alert-warning-bg: #fef7df;
  --aia-alert-warning-border: #f9d864;
  --aia-alert-info-bg: #e7f0fb;
  --aia-alert-info-border: #9ec5ed;

  /* ── Semantic State Surfaces ──────────────────────────── */
  /* Success states */
  --aia-success-bg: #d4edda;
  --aia-success-border: #c3e6cb;
  --aia-success-text: #155724;

  /* Warning states */
  --aia-warning-bg: #fff3cd;
  --aia-warning-border: #ffeaa7;
  --aia-warning-text: #856404;

  /* Error/decline states */
  --aia-error-bg: #fdf0f4;
  --aia-error-border: #ec96c3;
  --aia-decline-bg: #f8d7da;
  --aia-decline-border: #f5c6cb;
  --aia-decline-text: #721c24;

  /* Info states */
  --aia-info-bg: #e3f2fd;
  --aia-info-border: #bee3f8;
  --aia-info-text: #1565c0;

  /* Surfaces */
  --aia-surface-muted: #f5f7f9;
  --aia-surface-alt: #ebedf3;

  /* ── Typography ───────────────────────────────────────── */
  --aia-font-regular: 'Open Sans', 'opensans', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;
  --aia-font-medium: 'Open Sans', 'opensans', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;
  --aia-font-body: 'Open Sans', 'opensans', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;
  --aia-font-condensed: 'AIA Everest Condensed Medium', 'AIA Everest', 'aiaeverest', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;
  --aia-font-bold: 'AIA Everest Condensed Medium', 'AIA Everest', 'aiaeverest', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;
  --aia-font-heading: 'AIA Everest Condensed Medium', 'AIA Everest', 'aiaeverest', 'Helvetica Neue', arial, 'Noto Sans', sans-serif;

  /* ── Font Sizes (AIA DDS scale) ───────────────────────── */
  --aia-font-size-xs: 0.75rem;    /* 12px */
  --aia-font-size-sm: 0.875rem;   /* 14px */
  --aia-font-size-base: 1rem;     /* 16px */
  --aia-font-size-md: 1.125rem;   /* 18px */
  --aia-font-size-lg: 1.25rem;    /* 20px */
  --aia-font-size-xl: 1.5rem;     /* 24px */
  --aia-font-size-2xl: 1.75rem;   /* 28px */
  --aia-font-size-3xl: 2rem;      /* 32px */

  /* ── Spacing (8px grid) ───────────────────────────────── */
  --aia-spacing-xs: 0.25rem;   /* 4px */
  --aia-spacing-sm: 0.5rem;    /* 8px */
  --aia-spacing-md: 1rem;      /* 16px */
  --aia-spacing-lg: 1.5rem;    /* 24px */
  --aia-spacing-xl: 2rem;      /* 32px */
  --aia-spacing-2xl: 2.5rem;   /* 40px */
  --aia-spacing-3xl: 5rem;     /* 80px */

  /* ── Border Radius ────────────────────────────────────── */
  --aia-radius: 0.5rem;
  --aia-radius-sm: 0.25rem;    /* 4px */
  --aia-radius-md: 0.5rem;     /* 8px */
  --aia-radius-lg: 1rem;       /* 16px */
  --aia-radius-pill: 62.5rem;

  /* ── Shadows ──────────────────────────────────────────── */
  --aia-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
  --aia-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --aia-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.08);
  --aia-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);

  /* ── Transitions ──────────────────────────────────────── */
  --aia-transition-fast: 150ms ease;
  --aia-transition-base: 250ms ease;
  --aia-transition-slow: 400ms ease;

  /* ── Breakpoints ──────────────────────────────────────── */
  --aia-breakpoint-mobile: 480px;
  --aia-breakpoint-tablet: 768px;
  --aia-breakpoint-desktop: 1024px;

  /* ── Mobile Touch Targets ─────────────────────────────── */
  --aia-touch-target-min: 44px;
}

/* ── SLDS Input Error Overrides ──────────────────────────── */
.slds-has-error .slds-input {
  --slds-c-input-color-border: var(--aia-error);
  --slds-c-input-shadow: var(--aia-error);
  background-clip: padding-box;
}

.slds-has-error .slds-form-element__help {
  color: var(--aia-error);
}

/* ── SLDS Input Focus Overrides ─────────────────────────── */
.slds-input:focus,
.slds-input:active {
  --slds-c-input-color-border: var(--aia-blue);
  --slds-c-input-background-color: var(--aia-white);
  --slds-c-input-shadow: 0 0 0 3px var(--aia-blue);
  outline: 0;
}

.slds-has-error .slds-input:focus,
.slds-has-error .slds-input:active {
  --slds-c-input-color-border: var(--aia-blue);
  --slds-c-input-shadow: 0 0 0 3px var(--aia-blue);
  outline: 0;
}

/* ── SLDS Input Height ──────────────────────────────────── */
.slds-input {
  padding-top: 8px;
  padding-bottom: 8px;
  line-height: 24px;
}

/* ── Responsive container spacing ───────────────────────── */
@media (max-width: 768px) {
  :root {
    --aia-spacing-container: var(--aia-spacing-md, 1rem);
  }
}

@media (min-width: 768px) {
  :root {
    --aia-spacing-container: var(--aia-spacing-xl, 2rem);
  }
}