/* ============================================================
   Marcelle — Palettes de couleurs
   Chargé après app.css. Remappe les utilitaires stone-* de
   Tailwind via CSS custom properties selon le data-theme.
   Le thème par défaut (stone) n'a aucun override.
   ============================================================ */

/* --- Variables par palette --- */

[data-theme="ocean"] {
    --th-50:  240 245 252;
    --th-100: 219 234 254;
    --th-200: 191 219 254;
    --th-300: 147 197 253;
    --th-400: 96  165 250;
    --th-500: 59  130 246;
    --th-600: 37  99  235;
    --th-700: 37  99  235;
    --th-800: 30  64  175;
    --th-900: 29  78  216;
}

[data-theme="forest"] {
    --th-50:  240 253 244;
    --th-100: 220 252 231;
    --th-200: 187 247 208;
    --th-300: 134 239 172;
    --th-400: 74  222 128;
    --th-500: 34  197 94;
    --th-600: 22  163 74;
    --th-700: 21  128 61;
    --th-800: 22  101 52;
    --th-900: 22  101 52;
}

[data-theme="lavender"] {
    --th-50:  245 243 255;
    --th-100: 237 233 254;
    --th-200: 221 214 254;
    --th-300: 196 181 253;
    --th-400: 167 139 250;
    --th-500: 139 92  246;
    --th-600: 124 58  237;
    --th-700: 109 40  217;
    --th-800: 91  33  182;
    --th-900: 109 40  217;
}

[data-theme="earth"] {
    --th-50:  255 251 235;
    --th-100: 254 243 199;
    --th-200: 253 230 138;
    --th-300: 252 211 77;
    --th-400: 251 191 36;
    --th-500: 245 158 11;
    --th-600: 217 119 6;
    --th-700: 180 83  9;
    --th-800: 146 64  14;
    --th-900: 146 64  14;
}

/* --- Overrides utilitaires (actifs uniquement pour les thèmes non-stone) --- */

/* Body self-targeting (data-theme et classe sur le même élément) */
[data-theme]:not([data-theme="stone"]).bg-stone-50   { background-color: rgb(var(--th-50)  / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]).text-stone-800 { color: rgb(var(--th-800) / var(--tw-text-opacity, 1)); }

/* Background */
[data-theme]:not([data-theme="stone"]) .bg-stone-50  { background-color: rgb(var(--th-50)  / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .bg-stone-100 { background-color: rgb(var(--th-100) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .bg-stone-200 { background-color: rgb(var(--th-200) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .bg-stone-800 { background-color: rgb(var(--th-800) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .bg-stone-900 { background-color: rgb(var(--th-900) / var(--tw-bg-opacity, 1)); }

/* Text */
[data-theme]:not([data-theme="stone"]) .text-stone-200 { color: rgb(var(--th-200) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-300 { color: rgb(var(--th-300) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-400 { color: rgb(var(--th-400) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-500 { color: rgb(var(--th-500) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-600 { color: rgb(var(--th-600) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-700 { color: rgb(var(--th-700) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-800 { color: rgb(var(--th-800) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .text-stone-900 { color: rgb(var(--th-900) / var(--tw-text-opacity, 1)); }

/* Border */
[data-theme]:not([data-theme="stone"]) .border-stone-50  { border-color: rgb(var(--th-50)  / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-100 { border-color: rgb(var(--th-100) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-200 { border-color: rgb(var(--th-200) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-300 { border-color: rgb(var(--th-300) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-500 { border-color: rgb(var(--th-500) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-700 { border-color: rgb(var(--th-700) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .border-stone-900 { border-color: rgb(var(--th-900) / var(--tw-border-opacity, 1)); }

/* Ring */
[data-theme]:not([data-theme="stone"]) .ring-stone-400 { --tw-ring-color: rgb(var(--th-400) / var(--tw-ring-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .ring-stone-500 { --tw-ring-color: rgb(var(--th-500) / var(--tw-ring-opacity, 1)); }

/* Accent */
[data-theme]:not([data-theme="stone"]) .accent-stone-800 { accent-color: rgb(var(--th-800)); }

/* Placeholder */
[data-theme]:not([data-theme="stone"]) .placeholder-stone-300::-moz-placeholder    { color: rgb(var(--th-300) / var(--tw-placeholder-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .placeholder-stone-300::placeholder          { color: rgb(var(--th-300) / var(--tw-placeholder-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .placeholder-stone-600::-moz-placeholder    { color: rgb(var(--th-600) / var(--tw-placeholder-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .placeholder-stone-600::placeholder          { color: rgb(var(--th-600) / var(--tw-placeholder-opacity, 1)); }

/* Hover: background */
[data-theme]:not([data-theme="stone"]) .hover\:bg-stone-50:hover  { background-color: rgb(var(--th-50)  / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:bg-stone-100:hover { background-color: rgb(var(--th-100) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:bg-stone-200:hover { background-color: rgb(var(--th-200) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:bg-stone-300:hover { background-color: rgb(var(--th-300) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:bg-stone-700:hover { background-color: rgb(var(--th-700) / var(--tw-bg-opacity, 1)); }

/* Hover: text */
[data-theme]:not([data-theme="stone"]) .hover\:text-stone-500:hover { color: rgb(var(--th-500) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:text-stone-600:hover { color: rgb(var(--th-600) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:text-stone-700:hover { color: rgb(var(--th-700) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:text-stone-800:hover { color: rgb(var(--th-800) / var(--tw-text-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:text-stone-900:hover { color: rgb(var(--th-900) / var(--tw-text-opacity, 1)); }

/* Hover: border */
[data-theme]:not([data-theme="stone"]) .hover\:border-stone-300:hover { border-color: rgb(var(--th-300) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .hover\:border-stone-400:hover { border-color: rgb(var(--th-400) / var(--tw-border-opacity, 1)); }

/* Focus: border */
[data-theme]:not([data-theme="stone"]) .focus\:border-stone-400:focus { border-color: rgb(var(--th-400) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .focus\:border-stone-500:focus { border-color: rgb(var(--th-500) / var(--tw-border-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .focus\:border-stone-800:focus { border-color: rgb(var(--th-800) / var(--tw-border-opacity, 1)); }

/* Focus: ring */
[data-theme]:not([data-theme="stone"]) .focus\:ring-stone-100:focus { --tw-ring-color: rgb(var(--th-100) / var(--tw-ring-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .focus\:ring-stone-400:focus { --tw-ring-color: rgb(var(--th-400) / var(--tw-ring-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .focus\:ring-stone-800:focus { --tw-ring-color: rgb(var(--th-800) / var(--tw-ring-opacity, 1)); }

/* Active: background */
[data-theme]:not([data-theme="stone"]) .active\:bg-stone-50:active  { background-color: rgb(var(--th-50)  / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .active\:bg-stone-200:active { background-color: rgb(var(--th-200) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .active\:bg-stone-300:active { background-color: rgb(var(--th-300) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .active\:bg-stone-800:active { background-color: rgb(var(--th-800) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .active\:bg-stone-900:active { background-color: rgb(var(--th-900) / var(--tw-bg-opacity, 1)); }

/* Peer-checked */
[data-theme]:not([data-theme="stone"]) .peer:checked ~ .peer-checked\:bg-stone-900    { background-color: rgb(var(--th-900) / var(--tw-bg-opacity, 1)); }
[data-theme]:not([data-theme="stone"]) .peer:checked ~ .peer-checked\:border-stone-800 { border-color: rgb(var(--th-800) / var(--tw-border-opacity, 1)); }
/* Forcer le texte blanc sur fond coloré (sinon text-stone-* override gagne) */
[data-theme]:not([data-theme="stone"]) .peer:checked ~ .peer-checked\:text-white { color: rgb(255 255 255); }
