/**
 * CSS Custom Properties Bridge
 * Maps theme.json color palette to legacy CSS variable names
 */

:root {
  /* Color Variables - mapped from theme.json palette */
  --theme-primary-color: var(--wp--preset--color--primary);
  --theme-primary-color-hover: rgba(122, 181, 176, 0.5);
  --theme-secondary-color: var(--wp--preset--color--secondary);
  --theme-terciary-color: var(--wp--preset--color--tertiary);
  --theme-highlight-color: var(--wp--preset--color--highlight);
  --theme-black-color: var(--wp--preset--color--black);
  --theme-white-color: var(--wp--preset--color--white);
  --theme-cream-color: var(--wp--preset--color--cream);
  --theme-grey-color: var(--wp--preset--color--grey);
  --theme-light-grey-color: var(--wp--preset--color--light-grey);
  --theme-lime-color: var(--wp--preset--color--lime);
  --theme-mint-color: var(--wp--preset--color--mint);
  --theme-dark-color: var(--wp--preset--color--dark);

  /* Utility Colors */
  --theme-color-lines: var(--theme-grey-color);
  --theme-color-shadow: rgba(64, 64, 64, 0.16);

  /* Font Colors */
  --theme-font-color: var(--theme-black-color);

  /* Gradients - mapped from theme.json gradients */
  --theme-bottom-lighter-grey-gradient: linear-gradient(343.38deg, rgba(249, 249, 249, 1) 41.73%, #FFFFFF 72.3%);
  
  /* Gradient mappings from theme.json */
  --wp--custom--gradient--translucid: var(--wp--preset--gradient--translucid);
  --wp--custom--gradient--mint: var(--wp--preset--gradient--mint);
  --wp--custom--gradient--black: var(--wp--preset--gradient--black);
  --wp--custom--gradient--jungle: var(--wp--preset--gradient--jungle);
  --wp--custom--gradient--warm: var(--wp--preset--gradient--warm);
  --wp--custom--gradient--bright: var(--wp--preset--gradient--bright);
  --wp--custom--gradient--muted: var(--wp--preset--gradient--muted);

  /* Spacing Variables */
  --theme-size-nano: 30rem;
  --theme-size-mini: 40rem;
  --theme-size-small: 45rem;
  --theme-size-medium: 60rem;
  --theme-size-medium-large: 64rem;
  --theme-size-large: 80rem;
  --theme-size-huge: 120rem;
  
  /* Section Sizes */
  --theme-large-section-size: var(--theme-size-large);
  --theme-medium-section-size: 1024px;
  --theme-small-section-size: var(--theme-size-medium);
  
  /* Padding Variables */
  --theme-large-padding: 60px;
  --theme-medium-padding: 20px;
  --theme-small-padding: 20px;
  
  /* Spacing Variables */
  --theme-large-spacing: 40px;
  --theme-medium-spacing: 20px;
  --theme-small-spacing: 20px;
  
  /* Border Radius */
  --theme-border-radius: 0.75rem;
  --theme-border-radius-min: 0.5rem;
}

/* Responsive Variables */
@media screen and (min-width: 991px) {
  :root {
    /* Padding - Desktop */
    --theme-large-padding: 120px;
    --theme-medium-padding: 40px;
    --theme-small-padding: 20px;
    
    /* Spacing - Desktop */
    --theme-large-spacing: 80px;
    --theme-medium-spacing: 40px;
    --theme-small-spacing: 20px;
    
    /* Border Radius - Desktop */
    --theme-border-radius: 1.5rem;
  }
}