/* --- CONFIGURATION DARK --- */
[data-theme="studio"] {
  --bg-main: var(--dark-black);
  --bg-invert: var(--dark-beige);
  --bg-grid-item: var(--dark-black-max);
  --grid-item-number: var(--dark-yellow);
  --text-projects: var(--dark-beige);
  --text-main: var(--dark-beige);
  --text-invert: var(--dark-black);
  --text-accent-1: var(--dark-red);
  --text-accent-2: var(--dark-yellow);
  --contact-color: var(--dark-blue);
  --contact-color-mark: var(--dark-red);
  --color-shadow: var(--color-shadow-light);
  /* process cards */
  --color-process-card-1: var(--dark-red);
  --color-process-card-2: var(--dark-orange);
  --color-process-card-3: var(--dark-yellow);
  --color-process-card-4: var(--dark-green);
  /* Curseurs blancs pour le mode sombre */
  --cursor-arrow: var(--cursor-arrow-white);
  --cursor-hand: var(--cursor-hand-white);
  /* Bordures */
  --border-main: var(--text-accent-1);
  --border-main-rgba-solid: rgba(255, 246, 233, 0.1);
  --border-main-rgba-solid-invert: rgba(28, 28, 28, 0.8);
  --border-main-projects: var(--border-main-rgba-solid);
  /* Glass section */
  --glass-bg: var(--glass-bg-light);
  --glass-border: var(--glass-border-light);
  /* Arrow links hors cartes et bandeaux */
  --arrow-link-1: var(--dark-beige);
  --arrow-link-1-hover: var(--dark-green);
  --arrow-link-2: var(--dark-red);
  --arrow-link-2-hover: var(--dark-yellow);
  --arrow-link-3: var(--dark-orange);
  --arrow-link-3-hover: var(--dark-purple);

  .arrow-link-var1 {
    --ar-text: var(--arrow-link-1);
    --ar-hover: var(--arrow-link-1-hover);
  }

  .arrow-link-var2 {
    --ar-text: var(--arrow-link-2);
    --ar-hover: var(--arrow-link-2-hover);
  }

  .arrow-link-var3 {
    --ar-text: var(--arrow-link-3);
    --ar-hover: var(--arrow-link-3-hover);
  }

  /* Mapping des sous-thèmes pour le mode DARK */
  .theme_var1 {
    --c-bg1: var(--dark-blue);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-beige);
    --c-h2: var(--dark-beige);
    --c-h3: var(--dark-beige);
    --c-h4: var(--dark-beige);
    --c-text: var(--dark-beige);
    --c-span: var(--dark-orange);
    --c-strong: var(--dark-beige);
    --c-hover: var(--dark-orange);
    --c-border: var(--dark-orange);
    .arrow-link-var1 {
      --ar-text: var(--dark-beige);
      --ar-hover: var(--dark-orange);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-yellow);
      --ar-hover: var(--dark-red);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-orange);
      --ar-hover: var(--dark-green);
    }
  }
  .theme_var2 {
    --c-bg1: var(--dark-orange);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-beige);
    --c-h2: var(--dark-beige);
    --c-h3: var(--dark-beige);
    --c-h4: var(--dark-black);
    --c-text: var(--dark-beige);
    --c-span: var(--dark-blue);
    --c-strong: var(--dark-blue);
    --c-hover: var(--dark-red);
    --c-border: var(--dark-red);
    .arrow-link-var1 {
      --ar-text: var(--dark-beige);
      --ar-hover: var(--dark-yellow);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-purple);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-purple);
      --ar-hover: var(--dark-beige);
    }
  }
  .theme_var3 {
    --c-bg1: var(--dark-red);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-beige);
    --c-h2: var(--dark-beige);
    --c-h3: var(--dark-beige);
    --c-h4: var(--dark-beige);
    --c-text: var(--dark-beige);
    --c-span: var(--dark-yellow);
    --c-strong: var(--dark-beige);
    --c-hover: var(--dark-yellow);
    --c-border: var(--dark-yellow);
    .arrow-link-var1 {
      --ar-text: var(--dark-beige);
      --ar-hover: var(--dark-yellow);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-yellow);
      --ar-hover: var(--dark-purple);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-green);
    }
  }
  .theme_var4 {
    --c-bg1: var(--dark-yellow);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-blue);
    --c-h2: var(--dark-blue);
    --c-h3: var(--dark-red);
    --c-h4: var(--dark-blue);
    --c-text: var(--dark-blue);
    --c-span: var(--dark-blue);
    --c-strong: var(--dark-blue);
    --c-hover: var(--dark-red);
    --c-border: var(--dark-red);
    .arrow-link-var1 {
      --ar-text: var(--dark-red);
      --ar-hover: var(--dark-orange);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-red);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-red);
    }
  }
  .theme_var5 {
    --c-bg1: var(--dark-pink);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-beige);
    --c-h2: var(--dark-beige);
    --c-h3: var(--dark-beige);
    --c-h4: var(--dark-beige);
    --c-text: var(--dark-beige);
    --c-span: var(--dark-yellow);
    --c-strong: var(--dark-orange);
    --c-hover: var(--dark-yellow);
    --c-border: var(--dark-orange);
    .arrow-link-var1 {
      --ar-text: var(--dark-beige);
      --ar-hover: var(--dark-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-yellow);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-yellow);
      --ar-hover: var(--dark-blue);
    }
  }
  .theme_var6 {
    --c-bg1: var(--dark-green);
    --c-bg2: var(--dark-beige);
    --c-h1: var(--dark-beige);
    --c-h2: var(--dark-beige);
    --c-h3: var(--dark-beige);
    --c-h4: var(--dark-beige);
    --c-text: var(--dark-beige);
    --c-span: var(--dark-blue);
    --c-strong: var(--dark-blue);
    --c-hover: var(--dark-yellow);
    --c-border: var(--dark-yellow);
    .arrow-link-var1 {
      --ar-text: var(--dark-beige);
      --ar-hover: var(--dark-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--dark-blue);
      --ar-hover: var(--dark-yellow);
    }
    .arrow-link-var3 {
      --ar-text: var(--dark-purple);
      --ar-hover: var(--dark-beige);
    }
  }
}

/* --- CONFIGURATION BAUHAUS LIGHT --- */
[data-theme="bauhaus"] {
  --bg-main: var(--bauhaus-cream);
  --bg-invert: var(--bauhaus-black);
  --bg-grid-item: var(--bauhaus-dark-red);
  --grid-item-number: var(--bauhaus-orange);
  --text-projects: var(--bauhaus-cream);
  --text-main: var(--bauhaus-black);
  --text-invert: var(--bauhaus-cream);
  --text-accent-1: var(--bauhaus-red);
  --text-accent-2: var(--bauhaus-blue);
  --contact-color: var(--bauhaus-blue);
  --contact-color-mark: var(--bauhaus-red);
  --color-shadow: var(--color-shadow-dark);
  /* process cards */
  --color-process-card-1: var(--bauhaus-red);
  --color-process-card-2: var(--bauhaus-orange);
  --color-process-card-3: var(--bauhaus-yellow);
  --color-process-card-4: var(--bauhaus-pink);
  /* Curseurs blancs pour le mode light */
  --cursor-arrow: var(--cursor-arrow-black);
  --cursor-hand: var(--cursor-hand-black);
  /* Bordures */
  --border-main: var(--text-accent-1);
  --border-main-rgba-solid: rgba(28, 28, 28, 0.2);
  --border-main-rgba-solid-invert: rgba(255, 246, 233, 0.1);
  --border-main-projects: var(--border-main-rgba-solid-invert);
  /* Glass section */
  --glass-bg: var(--glass-bg-dark);
  --glass-border: var(--glass-border-dark);
  /* Arrow links hors cartes et bandeaux */
  --arrow-link-1: var(--bauhaus-blue);
  --arrow-link-1-hover: var(--bauhaus-orange);
  --arrow-link-2: var(--bauhaus-red);
  --arrow-link-2-hover: var(--bauhaus-pink);
  --arrow-link-3: var(--bauhaus-green);
  --arrow-link-3-hover: var(--bauhaus-yellow);

  .arrow-link-var1 {
    --ar-text: var(--arrow-link-1);
    --ar-hover: var(--arrow-link-1-hover);
  }
  .arrow-link-var2 {
    --ar-text: var(--arrow-link-2);
    --ar-hover: var(--arrow-link-2-hover);
  }
  .arrow-link-var3 {
    --ar-text: var(--arrow-link-3);
    --ar-hover: var(--arrow-link-3-hover);
  }

  /* Mapping des sous-thèmes pour le mode LIGHT */
  .theme_var1 {
    --c-bg1: var(--bauhaus-blue);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-cream);
    --c-h2: var(--bauhaus-cream);
    --c-h3: var(--bauhaus-cream);
    --c-h4: var(--bauhaus-cream);
    --c-text: var(--bauhaus-cream);
    --c-span: var(--bauhaus-orange);
    --c-strong: var(--bauhaus-cream);
    --c-hover: var(--bauhaus-orange);
    --c-border: var(--bauhaus-orange);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-cream);
      --ar-hover: var(--bauhaus-orange);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-orange);
      --ar-hover: var(--bauhaus-yellow);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-red);
      --ar-hover: var(--bauhaus-pink);
    }
  }
  .theme_var2 {
    --c-bg1: var(--bauhaus-orange);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-cream);
    --c-h2: var(--bauhaus-cream);
    --c-h3: var(--bauhaus-cream);
    --c-h4: var(--bauhaus-black);
    --c-text: var(--bauhaus-cream);
    --c-span: var(--bauhaus-blue);
    --c-strong: var(--bauhaus-blue);
    --c-hover: var(--bauhaus-red);
    --c-border: var(--bauhaus-red);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-cream);
      --ar-hover: var(--bauhaus-green);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-blue);
      --ar-hover: var(--bauhaus-red);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-red);
      --ar-hover: var(--bauhaus-cream);
    }
  }
  .theme_var3 {
    --c-bg1: var(--bauhaus-red);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-cream);
    --c-h2: var(--bauhaus-cream);
    --c-h3: var(--bauhaus-cream);
    --c-h4: var(--bauhaus-cream);
    --c-text: var(--bauhaus-cream);
    --c-span: var(--bauhaus-yellow);
    --c-strong: var(--bauhaus-cream);
    --c-hover: var(--bauhaus-yellow);
    --c-border: var(--bauhaus-yellow);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-yellow);
      --ar-hover: var(--bauhaus-pink);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-blue);
      --ar-hover: var(--bauhaus-orange);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-green);
      --ar-hover: var(--bauhaus-pink);
    }
  }
  .theme_var4 {
    --c-bg1: var(--bauhaus-yellow);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-blue);
    --c-h2: var(--bauhaus-blue);
    --c-h3: var(--bauhaus-red);
    --c-h4: var(--bauhaus-blue);
    --c-text: var(--bauhaus-blue);
    --c-span: var(--bauhaus-blue);
    --c-strong: var(--bauhaus-blue);
    --c-hover: var(--bauhaus-red);
    --c-border: var(--bauhaus-red);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-red);
      --ar-hover: var(--bauhaus-orange);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-blue);
      --ar-hover: var(--bauhaus-orange);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-green);
      --ar-hover: var(--bauhaus-pink);
    }
  }
  .theme_var5 {
    --c-bg1: var(--bauhaus-pink);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-black);
    --c-h2: var(--bauhaus-blue);
    --c-h3: var(--bauhaus-cream);
    --c-h4: var(--bauhaus-black);
    --c-text: var(--bauhaus-cream);
    --c-span: var(--bauhaus-blue);
    --c-strong: var(--bauhaus-blue);
    --c-hover: var(--bauhaus-yellow);
    --c-border: var(--bauhaus-red);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-cream);
      --ar-hover: var(--bauhaus-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-blue);
      --ar-hover: var(--bauhaus-yellow);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-green);
      --ar-hover: var(--bauhaus-cream);
    }
  }
  .theme_var6 {
    --c-bg1: var(--bauhaus-green);
    --c-bg2: var(--bauhaus-cream);
    --c-h1: var(--bauhaus-cream);
    --c-h2: var(--bauhaus-cream);
    --c-h3: var(--bauhaus-cream);
    --c-h4: var(--bauhaus-cream);
    --c-text: var(--bauhaus-cream);
    --c-span: var(--bauhaus-blue);
    --c-strong: var(--bauhaus-blue);
    --c-hover: var(--bauhaus-yellow);
    --c-border: var(--bauhaus-yellow);
    .arrow-link-var1 {
      --ar-text: var(--bauhaus-cream);
      --ar-hover: var(--bauhaus-orange);
    }
    .arrow-link-var2 {
      --ar-text: var(--bauhaus-orange);
      --ar-hover: var(--bauhaus-cream);
    }
    .arrow-link-var3 {
      --ar-text: var(--bauhaus-blue);
      --ar-hover: var(--bauhaus-pink);
    }
  }
}

/* --- CONFIGURATION NATURE --- */
[data-theme="nature"] {
  --bg-main: var(--nature-green);
  --bg-invert: var(--nature-beige);
  --bg-grid-item: var(--nature-green-dark);
  --grid-item-number: var(--nature-terracotta);
  --text-projects: var(--nature-beige);
  --text-main: var(--nature-beige);
  --text-invert: var(--nature-green);
  --text-accent-1: var(--nature-yellow);
  --text-accent-2: var(--nature-pink);
  --contact-color: var(--nature-green);
  --contact-color-mark: var(--nature-red);
  --color-shadow: var(--color-shadow-light);
  /* process cards */
  --color-process-card-1: var(--nature-pink);
  --color-process-card-2: var(--nature-terracotta);
  --color-process-card-3: var(--nature-yellow);
  --color-process-card-4: var(--nature-beige);
  /* Curseurs blancs pour le mode sombre */
  --cursor-arrow: var(--cursor-arrow-white);
  --cursor-hand: var(--cursor-hand-white);
  /* Bordures */
  --border-main: var(--text-accent-1);
  --border-main-rgba-solid: rgba(255, 246, 233, 0.1);
  --border-main-rgba-solid-invert: rgba(28, 28, 28, 0.8);
  --border-main-projects: var(--border-main-rgba-solid);
  /* Glass section */
  --glass-bg: var(--glass-bg-light);
  --glass-border: var(--glass-border-light);
  /* Arrow links hors cartes et bandeaux */
  --arrow-link-1: var(--nature-beige);
  --arrow-link-1-hover: var(--nature-yellow);
  --arrow-link-2: var(--nature-pink);
  --arrow-link-2-hover: var(--nature-yellow);
  --arrow-link-3: var(--nature-yellow);
  --arrow-link-3-hover: var(--nature-red);

  .arrow-link-var1 {
    --ar-text: var(--arrow-link-1);
    --ar-hover: var(--arrow-link-1-hover);
  }

  .arrow-link-var2 {
    --ar-text: var(--arrow-link-2);
    --ar-hover: var(--arrow-link-2-hover);
  }

  .arrow-link-var3 {
    --ar-text: var(--arrow-link-3);
    --ar-hover: var(--arrow-link-3-hover);
  }

  /* Mapping des sous-thèmes pour le mode NATURE */
  .theme_var1 {
    --c-bg1: var(--nature-red);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-beige-light);
    --c-h2: var(--nature-beige-light);
    --c-h3: var(--nature-beige-light);
    --c-h4: var(--nature-beige-light);
    --c-text: var(--nature-beige-light);
    --c-span: var(--nature-yellow);
    --c-strong: var(--nature-yellow);
    --c-hover: var(--nature-yellow);
    --c-border: var(--nature-yellow);
    .arrow-link-var1 {
      --ar-text: var(--nature-beige-light);
      --ar-hover: var(--nature-yellow);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-pink);
      --ar-hover: var(--nature-beige-light);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-beige);
      --ar-hover: var(--nature-pink);
    }
  }
  .theme_var2 {
    --c-bg1: var(--nature-yellow);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-green);
    --c-h2: var(--nature-green);
    --c-h3: var(--nature-green);
    --c-h4: var(--nature-green);
    --c-text: var(--nature-green);
    --c-span: var(--nature-red);
    --c-strong: var(--nature-green);
    --c-hover: var(--nature-red);
    --c-border: var(--nature-red);
    .arrow-link-var1 {
      --ar-text: var(--nature-beige-light);
      --ar-hover: var(--nature-red);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-red);
      --ar-hover: var(--nature-green);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-olive);
      --ar-hover: var(--nature-terracotta);
    }
  }
  .theme_var3 {
    --c-bg1: var(--nature-terracotta);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-beige-light);
    --c-h2: var(--nature-beige-light);
    --c-h3: var(--nature-beige-light);
    --c-h4: var(--nature-beige-light);
    --c-text: var(--nature-beige-light);
    --c-span: var(--nature-yellow);
    --c-strong: var(--nature-beige-light);
    --c-hover: var(--nature-yellow);
    --c-border: var(--nature-yellow);
    .arrow-link-var1 {
      --ar-text: var(--nature-beige-light);
      --ar-hover: var(--nature-yellow);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-yellow);
      --ar-hover: var(--nature-beige-light);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-beige);
      --ar-hover: var(--nature-green-dark);
    }
  }
  .theme_var4 {
    --c-bg1: var(--nature-pink);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-green);
    --c-h2: var(--nature-green);
    --c-h3: var(--nature-green);
    --c-h4: var(--nature-green);
    --c-text: var(--nature-green);
    --c-span: var(--nature-red);
    --c-strong: var(--nature-red);
    --c-hover: var(--nature-red);
    --c-border: var(--nature-red);
    .arrow-link-var1 {
      --ar-text: var(--nature-red);
      --ar-hover: var(--nature-beige-light);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-green);
      --ar-hover: var(--nature-terracotta);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-terracotta);
      --ar-hover: var(--nature-red);
    }
  }
  .theme_var5 {
    --c-bg1: var(--nature-beige);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-green);
    --c-h2: var(--nature-green);
    --c-h3: var(--nature-green);
    --c-h4: var(--nature-green);
    --c-text: var(--nature-green);
    --c-span: var(--nature-terracotta);
    --c-strong: var(--nature-green-dark);
    --c-hover: var(--nature-terracotta);
    --c-border: var(--nature-terracotta);
    .arrow-link-var1 {
      --ar-text: var(--nature-terracotta);
      --ar-hover: var(--nature-red);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-yellow);
      --ar-hover: var(--nature-olive);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-olive);
      --ar-hover: var(--nature-green);
    }
  }
  .theme_var6 {
    --c-bg1: var(--nature-olive);
    --c-bg2: var(--nature-beige-light);
    --c-h1: var(--nature-beige-light);
    --c-h2: var(--nature-beige-light);
    --c-h3: var(--nature-beige-light);
    --c-h4: var(--nature-beige-light);
    --c-text: var(--nature-beige-light);
    --c-span: var(--nature-yellow);
    --c-strong: var(--nature-yellow);
    --c-hover: var(--nature-yellow);
    --c-border: var(--nature-yellow);
    .arrow-link-var1 {
      --ar-text: var(--nature-beige-light);
      --ar-hover: var(--nature-yellow);
    }
    .arrow-link-var2 {
      --ar-text: var(--nature-yellow);
      --ar-hover: var(--nature-beige);
    }
    .arrow-link-var3 {
      --ar-text: var(--nature-pink);
      --ar-hover: var(--nature-yellow);
    }
  }
}

/* --- CONFIGURATION PLAGE --- */
[data-theme="plage"] {
  --bg-main: var(--beach-white);
  --bg-invert: var(--beach-black);
  --bg-grid-item: var(--beach-dark-blue);
  --grid-item-number: var(--beach-coral);
  --text-projects: var(--beach-white);
  --text-main: var(--beach-black);
  --text-invert: var(--beach-white);
  --text-accent-1: var(--beach-blue);
  --text-accent-2: var(--beach-coral);
  --contact-color: var(--beach-coral);
  --contact-color-mark: var(--beach-coral);
  --color-shadow: var(--color-shadow-dark);
  /* process cards */
  --color-process-card-1: var(--beach-coral);
  --color-process-card-2: var(--beach-orange);
  --color-process-card-3: var(--beach-light-orange);
  --color-process-card-4: var(--beach-blue);
  /* Curseurs blancs pour le mode light */
  --cursor-arrow: var(--cursor-arrow-black);
  --cursor-hand: var(--cursor-hand-black);
  /* Bordures */
  --border-main: var(--text-accent-1);
  --border-main-rgba-solid: rgba(28, 28, 28, 0.2);
  --border-main-rgba-solid-invert: rgba(255, 246, 233, 0.1);
  --border-main-projects: var(--border-main-rgba-solid-invert);
  /* Glass section */
  --glass-bg: var(--glass-bg-dark);
  --glass-border: var(--glass-border-dark);
  /* Arrow links hors cartes et bandeaux */
  --arrow-link-1: var(--beach-blue);
  --arrow-link-1-hover: var(--beach-orange);
  --arrow-link-2: var(--beach-coral);
  --arrow-link-2-hover: var(--beach-orange);
  --arrow-link-3: var(--beach-orange);
  --arrow-link-3-hover: var(--beach-blue);

  .arrow-link-var1 {
    --ar-text: var(--arrow-link-1);
    --ar-hover: var(--arrow-link-1-hover);
  }
  .arrow-link-var2 {
    --ar-text: var(--arrow-link-2);
    --ar-hover: var(--arrow-link-2-hover);
  }
  .arrow-link-var3 {
    --ar-text: var(--arrow-link-3);
    --ar-hover: var(--arrow-link-3-hover);
  }

  /* Mapping des sous-thèmes pour le mode LIGHT */
  .theme_var1 {
    --c-bg1: var(--beach-orange);
    --c-bg2: var(--beach-white);
    --c-h1: var(--beach-white);
    --c-h2: var(--beach-white);
    --c-h3: var(--beach-white);
    --c-h4: var(--beach-white);
    --c-text: var(--beach-white);
    --c-span: var(--beach-dark-blue);
    --c-strong: var(--beach-dark-blue);
    --c-hover: var(--beach-coral);
    --c-border: var(--beach-coral);
    .arrow-link-var1 {
      --ar-text: var(--beach-white);
      --ar-hover: var(--beach-coral);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-dark-blue);
      --ar-hover: var(--beach-sand);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-light-blue);
      --ar-hover: var(--beach-light-orange);
    }
  }
  .theme_var2 {
    --c-bg1: var(--beach-light-orange);
    --c-bg2: var(--beach-white);
    --c-h1: var(--beach-dark-blue);
    --c-h2: var(--beach-dark-blue);
    --c-h3: var(--beach-dark-blue);
    --c-h4: var(--beach-dark-blue);
    --c-text: var(--beach-dark-blue);
    --c-span: var(--beach-dark-blue);
    --c-strong: var(--beach-dark-blue);
    --c-hover: var(--beach-coral);
    --c-border: var(--beach-coral);
    .arrow-link-var1 {
      --ar-text: var(--beach-coral);
      --ar-hover: var(--beach-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-dark-blue);
      --ar-hover: var(--beach-coral);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-light-blue);
      --ar-hover: var(--beach-white);
    }
  }
  .theme_var3 {
    --c-bg1: var(--beach-blue);
    --c-bg2: var(--beach-white);
    --c-h1: var(--beach-sand);
    --c-h2: var(--beach-sand);
    --c-h3: var(--beach-sand);
    --c-h4: var(--beach-sand);
    --c-text: var(--beach-sand);
    --c-span: var(--beach-white);
    --c-strong: var(--beach-white);
    --c-hover: var(--beach-white);
    --c-border: var(--beach-dark-blue);
    .arrow-link-var1 {
      --ar-text: var(--beach-sand);
      --ar-hover: var(--beach-coral);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-white);
      --ar-hover: var(--beach-light-orange);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-light-blue);
      --ar-hover: var(--beach-dark-blue);
    }
  }
  .theme_var4 {
    --c-bg1: var(--beach-coral);
    --c-bg2: var(--beach-white);
    --c-h1: var(--beach-white);
    --c-h2: var(--beach-white);
    --c-h3: var(--beach-white);
    --c-h4: var(--beach-white);
    --c-text: var(--beach-white);
    --c-span: var(--beach-sand);
    --c-strong: var(--beach-sand);
    --c-hover: var(--beach-sand);
    --c-border: var(--beach-sand);
    .arrow-link-var1 {
      --ar-text: var(--beach-white);
      --ar-hover: var(--beach-dark-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-sand);
      --ar-hover: var(--beach-light-blue);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-light-orange);
      --ar-hover: var(--beach-white);
    }
  }
  .theme_var5 {
    --c-bg1: var(--beach-sand);
    --c-bg2: var(--beach-orange);
    --c-h1: var(--beach-orange);
    --c-h2: var(--beach-orange);
    --c-h3: var(--beach-orange);
    --c-h4: var(--beach-orange);
    --c-text: var(--beach-orange);
    --c-span: var(--beach-blue);
    --c-strong: var(--beach-dark-blue);
    --c-hover: var(--beach-orange);
    --c-border: var(--beach-orange);
    .arrow-link-var1 {
      --ar-text: var(--beach-orange);
      --ar-hover: var(--beach-dark-blue);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-blue);
      --ar-hover: var(--beach-coral);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-dark-blue);
      --ar-hover: var(--beach-blue);
    }
  }
  .theme_var6 {
    --c-bg1: var(--beach-light-blue);
    --c-bg2: var(--beach-blue);
    --c-h1: var(--beach-blue);
    --c-h2: var(--beach-blue);
    --c-h3: var(--beach-blue);
    --c-h4: var(--beach-blue);
    --c-text: var(--beach-blue);
    --c-span: var(--beach-orange);
    --c-strong: var(--beach-orange);
    --c-hover: var(--beach-dark-blue);
    --c-border: var(--beach-blue);
    .arrow-link-var1 {
      --ar-text: var(--beach-blue);
      --ar-hover: var(--beach-coral);
    }
    .arrow-link-var2 {
      --ar-text: var(--beach-orange);
      --ar-hover: var(--beach-blue);
    }
    .arrow-link-var3 {
      --ar-text: var(--beach-coral);
      --ar-hover: var(--beach-orange);
    }
  }
}
