/* ==========================================================================
   EventFit — thème clair. FICHIER GÉNÉRÉ par tools/build-theme-light.js
   (source : resources/css/theme-light.base.css + dist.css). Ne pas éditer ici.
   Aucune règle ne s'applique sans <html data-theme="light">.
   ========================================================================== */

/* -------------------------------------------------------------------------
   Encres : valeur claire sur les surfaces, valeur d'origine sur les aplats
   ------------------------------------------------------------------------- */
:root[data-theme="light"] {
  --ef-ink-amber-100: 120 53 15;
  --ef-sink-amber-100: 120 53 15;
  --ef-ink-amber-200: 146 64 14;
  --ef-sink-amber-200: 146 64 14;
  --ef-ink-amber-300: 146 64 14;
  --ef-sink-amber-300: 146 64 14;
  --ef-ink-amber-400: 180 83 9;
  --ef-sink-amber-400: 180 83 9;
  --ef-ink-blue-200: 30 64 175;
  --ef-sink-blue-200: 30 64 175;
  --ef-ink-blue-300: 29 78 216;
  --ef-sink-blue-300: 29 78 216;
  --ef-ink-blue-400: 29 78 216;
  --ef-sink-blue-400: 29 78 216;
  --ef-ink-emerald-100: 6 78 59;
  --ef-sink-emerald-100: 6 78 59;
  --ef-ink-emerald-200: 6 95 70;
  --ef-sink-emerald-200: 6 95 70;
  --ef-ink-emerald-300: 6 95 70;
  --ef-sink-emerald-300: 6 95 70;
  --ef-ink-emerald-400: 4 120 87;
  --ef-sink-emerald-400: 4 120 87;
  --ef-ink-green-200: 22 101 52;
  --ef-sink-green-200: 22 101 52;
  --ef-ink-green-300: 22 101 52;
  --ef-sink-green-300: 22 101 52;
  --ef-ink-green-400: 21 128 61;
  --ef-sink-green-400: 21 128 61;
  --ef-ink-orange-200: 154 52 18;
  --ef-sink-orange-200: 154 52 18;
  --ef-ink-orange-300: 154 52 18;
  --ef-sink-orange-300: 154 52 18;
  --ef-ink-orange-400: 194 65 12;
  --ef-sink-orange-400: 194 65 12;
  --ef-ink-purple-300: 126 34 206;
  --ef-sink-purple-300: 126 34 206;
  --ef-ink-red-200: 153 27 27;
  --ef-sink-red-200: 153 27 27;
  --ef-ink-red-300: 185 28 28;
  --ef-sink-red-300: 185 28 28;
  --ef-ink-red-400: 185 28 28;
  --ef-sink-red-400: 185 28 28;
  --ef-ink-rose-300: 190 18 60;
  --ef-sink-rose-300: 190 18 60;
  --ef-ink-rose-400: 190 18 60;
  --ef-sink-rose-400: 190 18 60;
  --ef-ink-sky-300: 3 105 161;
  --ef-sink-sky-300: 3 105 161;
  --ef-ink-sky-400: 3 105 161;
  --ef-sink-sky-400: 3 105 161;
  --ef-ink-slate-100: 15 23 42;
  --ef-sink-slate-100: 15 23 42;
  --ef-ink-slate-200: 30 41 59;
  --ef-sink-slate-200: 30 41 59;
  --ef-ink-slate-300: 51 65 85;
  --ef-sink-slate-300: 51 65 85;
  --ef-ink-slate-400: 71 85 105;
  --ef-sink-slate-400: 71 85 105;
  --ef-ink-slate-500: 88 100 120;
  --ef-sink-slate-500: 88 100 120;
  --ef-ink-slate-600: 148 163 184;
  --ef-sink-slate-600: 148 163 184;
  --ef-ink-slate-700: 203 213 225;
  --ef-sink-slate-700: 203 213 225;
  --ef-ink-slate-800: 226 232 240;
  --ef-sink-slate-800: 226 232 240;
  --ef-ink-violet-300: 109 40 217;
  --ef-sink-violet-300: 109 40 217;
  --ef-ink-white: 15 23 42;
  --ef-sink-white: 15 23 42;
  --ef-ink-yellow-400: 161 98 7;
  --ef-sink-yellow-400: 161 98 7;
}
:where(:root[data-theme="light"]) .bg-surface,
:where(:root[data-theme="light"]) .bg-surface-border,
:where(:root[data-theme="light"]) .bg-surface-card,
:where(:root[data-theme="light"]) .bg-surface-card\/50,
:where(:root[data-theme="light"]) .bg-surface-card\/60,
:where(:root[data-theme="light"]) .bg-surface-card\/70,
:where(:root[data-theme="light"]) .bg-surface-hover,
:where(:root[data-theme="light"]) .bg-surface-hover\/50,
:where(:root[data-theme="light"]) .bg-surface-hover\/60,
:where(:root[data-theme="light"]) .bg-surface\/50,
:where(:root[data-theme="light"]) .bg-surface\/60,
:where(:root[data-theme="light"]) .bg-surface\/70,
:where(:root[data-theme="light"]) .bg-surface\/95,
:where(:root[data-theme="light"]) .from-surface,
:where(:root[data-theme="light"]) .from-surface\/85,
:where(:root[data-theme="light"]) .hover\:bg-surface:hover,
:where(:root[data-theme="light"]) .hover\:bg-surface-border:hover,
:where(:root[data-theme="light"]) .hover\:bg-surface-hover:hover,
:where(:root[data-theme="light"]) .hover\:bg-surface-hover\/50:hover,
:where(:root[data-theme="light"]) .focus\:bg-surface:focus,
:where(:root[data-theme="light"]) .card,
:where(:root[data-theme="light"]) .btn-secondary,
:where(:root[data-theme="light"]) .btn-ghost,
:where(:root[data-theme="light"]) .form-input,
:where(:root[data-theme="light"]) .form-select,
:where(:root[data-theme="light"]) .form-textarea,
:where(:root[data-theme="light"]) .numpad-key,
:where(:root[data-theme="light"]) .table-wrap,
:where(:root[data-theme="light"]) .swal2-popup,
:where(:root[data-theme="light"]) .ef-surface {
  --ef-ink-amber-100: var(--ef-sink-amber-100);
  --ef-ink-amber-200: var(--ef-sink-amber-200);
  --ef-ink-amber-300: var(--ef-sink-amber-300);
  --ef-ink-amber-400: var(--ef-sink-amber-400);
  --ef-ink-blue-200: var(--ef-sink-blue-200);
  --ef-ink-blue-300: var(--ef-sink-blue-300);
  --ef-ink-blue-400: var(--ef-sink-blue-400);
  --ef-ink-emerald-100: var(--ef-sink-emerald-100);
  --ef-ink-emerald-200: var(--ef-sink-emerald-200);
  --ef-ink-emerald-300: var(--ef-sink-emerald-300);
  --ef-ink-emerald-400: var(--ef-sink-emerald-400);
  --ef-ink-green-200: var(--ef-sink-green-200);
  --ef-ink-green-300: var(--ef-sink-green-300);
  --ef-ink-green-400: var(--ef-sink-green-400);
  --ef-ink-orange-200: var(--ef-sink-orange-200);
  --ef-ink-orange-300: var(--ef-sink-orange-300);
  --ef-ink-orange-400: var(--ef-sink-orange-400);
  --ef-ink-purple-300: var(--ef-sink-purple-300);
  --ef-ink-red-200: var(--ef-sink-red-200);
  --ef-ink-red-300: var(--ef-sink-red-300);
  --ef-ink-red-400: var(--ef-sink-red-400);
  --ef-ink-rose-300: var(--ef-sink-rose-300);
  --ef-ink-rose-400: var(--ef-sink-rose-400);
  --ef-ink-sky-300: var(--ef-sink-sky-300);
  --ef-ink-sky-400: var(--ef-sink-sky-400);
  --ef-ink-slate-100: var(--ef-sink-slate-100);
  --ef-ink-slate-200: var(--ef-sink-slate-200);
  --ef-ink-slate-300: var(--ef-sink-slate-300);
  --ef-ink-slate-400: var(--ef-sink-slate-400);
  --ef-ink-slate-500: var(--ef-sink-slate-500);
  --ef-ink-slate-600: var(--ef-sink-slate-600);
  --ef-ink-slate-700: var(--ef-sink-slate-700);
  --ef-ink-slate-800: var(--ef-sink-slate-800);
  --ef-ink-violet-300: var(--ef-sink-violet-300);
  --ef-ink-white: var(--ef-sink-white);
  --ef-ink-yellow-400: var(--ef-sink-yellow-400);
}
:where(:root[data-theme="light"]) .bg-amber-400,
:where(:root[data-theme="light"]) .bg-black,
:where(:root[data-theme="light"]) .bg-black\/40,
:where(:root[data-theme="light"]) .bg-black\/60,
:where(:root[data-theme="light"]) .bg-black\/70,
:where(:root[data-theme="light"]) .bg-black\/85,
:where(:root[data-theme="light"]) .bg-brand,
:where(:root[data-theme="light"]) .bg-brand-hover,
:where(:root[data-theme="light"]) .bg-brand\/60,
:where(:root[data-theme="light"]) .bg-emerald-400,
:where(:root[data-theme="light"]) .bg-emerald-500,
:where(:root[data-theme="light"]) .bg-green-500,
:where(:root[data-theme="light"]) .bg-green-600,
:where(:root[data-theme="light"]) .bg-orange-500,
:where(:root[data-theme="light"]) .bg-red-400,
:where(:root[data-theme="light"]) .bg-red-500,
:where(:root[data-theme="light"]) .bg-sky-400,
:where(:root[data-theme="light"]) .bg-slate-500,
:where(:root[data-theme="light"]) .bg-slate-600,
:where(:root[data-theme="light"]) .bg-slate-700,
:where(:root[data-theme="light"]) .bg-slate-700\/50,
:where(:root[data-theme="light"]) .bg-white,
:where(:root[data-theme="light"]) .from-brand,
:where(:root[data-theme="light"]) .checked\:bg-brand:checked,
:where(:root[data-theme="light"]) .hover\:bg-black\/60:hover,
:where(:root[data-theme="light"]) .hover\:bg-brand:hover,
:where(:root[data-theme="light"]) .hover\:bg-brand-hover:hover,
:where(:root[data-theme="light"]) .hover\:bg-green-500:hover,
:where(:root[data-theme="light"]) .hover\:bg-green-600:hover,
:where(:root[data-theme="light"]) .hover\:bg-orange-600:hover,
:where(:root[data-theme="light"]) .hover\:bg-red-600:hover,
:where(:root[data-theme="light"]) .hover\:bg-slate-100:hover,
:where(:root[data-theme="light"]) .hover\:bg-slate-700:hover,
:where(:root[data-theme="light"]) .btn-primary,
:where(:root[data-theme="light"]) .btn-danger,
:where(:root[data-theme="light"]) .numpad-key-danger,
:where(:root[data-theme="light"]) .numpad-key-success,
:where(:root[data-theme="light"]) .numpad-key:active,
:where(:root[data-theme="light"]) .rank-badge-1,
:where(:root[data-theme="light"]) .rank-badge-2,
:where(:root[data-theme="light"]) .rank-badge-3,
:where(:root[data-theme="light"]) .ef-fill {
  --ef-ink-amber-100: 254 243 199;
  --ef-ink-amber-200: 253 230 138;
  --ef-ink-amber-300: 252 211 77;
  --ef-ink-amber-400: 251 191 36;
  --ef-ink-blue-200: 191 219 254;
  --ef-ink-blue-300: 147 197 253;
  --ef-ink-blue-400: 96 165 250;
  --ef-ink-emerald-100: 209 250 229;
  --ef-ink-emerald-200: 167 243 208;
  --ef-ink-emerald-300: 110 231 183;
  --ef-ink-emerald-400: 52 211 153;
  --ef-ink-green-200: 187 247 208;
  --ef-ink-green-300: 134 239 172;
  --ef-ink-green-400: 74 222 128;
  --ef-ink-orange-200: 254 215 170;
  --ef-ink-orange-300: 253 186 116;
  --ef-ink-orange-400: 251 146 60;
  --ef-ink-purple-300: 216 180 254;
  --ef-ink-red-200: 254 202 202;
  --ef-ink-red-300: 252 165 165;
  --ef-ink-red-400: 248 113 113;
  --ef-ink-rose-300: 253 164 175;
  --ef-ink-rose-400: 251 113 133;
  --ef-ink-sky-300: 125 211 252;
  --ef-ink-sky-400: 56 189 248;
  --ef-ink-slate-100: 241 245 249;
  --ef-ink-slate-200: 226 232 240;
  --ef-ink-slate-300: 203 213 225;
  --ef-ink-slate-400: 148 163 184;
  --ef-ink-slate-500: 100 116 139;
  --ef-ink-slate-600: 71 85 105;
  --ef-ink-slate-700: 51 65 85;
  --ef-ink-slate-800: 30 41 59;
  --ef-ink-violet-300: 196 181 253;
  --ef-ink-white: 255 255 255;
  --ef-ink-yellow-400: 250 204 21;
}
@supports ((-webkit-backdrop-filter:var(--tw )) or (backdrop-filter:var(--tw ))) {
:where(:root[data-theme="light"]) .supports-\[backdrop-filter\]\:bg-surface\/80 {
  --ef-ink-amber-100: var(--ef-sink-amber-100);
  --ef-ink-amber-200: var(--ef-sink-amber-200);
  --ef-ink-amber-300: var(--ef-sink-amber-300);
  --ef-ink-amber-400: var(--ef-sink-amber-400);
  --ef-ink-blue-200: var(--ef-sink-blue-200);
  --ef-ink-blue-300: var(--ef-sink-blue-300);
  --ef-ink-blue-400: var(--ef-sink-blue-400);
  --ef-ink-emerald-100: var(--ef-sink-emerald-100);
  --ef-ink-emerald-200: var(--ef-sink-emerald-200);
  --ef-ink-emerald-300: var(--ef-sink-emerald-300);
  --ef-ink-emerald-400: var(--ef-sink-emerald-400);
  --ef-ink-green-200: var(--ef-sink-green-200);
  --ef-ink-green-300: var(--ef-sink-green-300);
  --ef-ink-green-400: var(--ef-sink-green-400);
  --ef-ink-orange-200: var(--ef-sink-orange-200);
  --ef-ink-orange-300: var(--ef-sink-orange-300);
  --ef-ink-orange-400: var(--ef-sink-orange-400);
  --ef-ink-purple-300: var(--ef-sink-purple-300);
  --ef-ink-red-200: var(--ef-sink-red-200);
  --ef-ink-red-300: var(--ef-sink-red-300);
  --ef-ink-red-400: var(--ef-sink-red-400);
  --ef-ink-rose-300: var(--ef-sink-rose-300);
  --ef-ink-rose-400: var(--ef-sink-rose-400);
  --ef-ink-sky-300: var(--ef-sink-sky-300);
  --ef-ink-sky-400: var(--ef-sink-sky-400);
  --ef-ink-slate-100: var(--ef-sink-slate-100);
  --ef-ink-slate-200: var(--ef-sink-slate-200);
  --ef-ink-slate-300: var(--ef-sink-slate-300);
  --ef-ink-slate-400: var(--ef-sink-slate-400);
  --ef-ink-slate-500: var(--ef-sink-slate-500);
  --ef-ink-slate-600: var(--ef-sink-slate-600);
  --ef-ink-slate-700: var(--ef-sink-slate-700);
  --ef-ink-slate-800: var(--ef-sink-slate-800);
  --ef-ink-violet-300: var(--ef-sink-violet-300);
  --ef-ink-white: var(--ef-sink-white);
  --ef-ink-yellow-400: var(--ef-sink-yellow-400);
}
}
:where(:root[data-theme="light"]) .ef-dark {
  --ef-ink-amber-100: 254 243 199;
  --ef-sink-amber-100: 254 243 199;
  --ef-ink-amber-200: 253 230 138;
  --ef-sink-amber-200: 253 230 138;
  --ef-ink-amber-300: 252 211 77;
  --ef-sink-amber-300: 252 211 77;
  --ef-ink-amber-400: 251 191 36;
  --ef-sink-amber-400: 251 191 36;
  --ef-ink-blue-200: 191 219 254;
  --ef-sink-blue-200: 191 219 254;
  --ef-ink-blue-300: 147 197 253;
  --ef-sink-blue-300: 147 197 253;
  --ef-ink-blue-400: 96 165 250;
  --ef-sink-blue-400: 96 165 250;
  --ef-ink-emerald-100: 209 250 229;
  --ef-sink-emerald-100: 209 250 229;
  --ef-ink-emerald-200: 167 243 208;
  --ef-sink-emerald-200: 167 243 208;
  --ef-ink-emerald-300: 110 231 183;
  --ef-sink-emerald-300: 110 231 183;
  --ef-ink-emerald-400: 52 211 153;
  --ef-sink-emerald-400: 52 211 153;
  --ef-ink-green-200: 187 247 208;
  --ef-sink-green-200: 187 247 208;
  --ef-ink-green-300: 134 239 172;
  --ef-sink-green-300: 134 239 172;
  --ef-ink-green-400: 74 222 128;
  --ef-sink-green-400: 74 222 128;
  --ef-ink-orange-200: 254 215 170;
  --ef-sink-orange-200: 254 215 170;
  --ef-ink-orange-300: 253 186 116;
  --ef-sink-orange-300: 253 186 116;
  --ef-ink-orange-400: 251 146 60;
  --ef-sink-orange-400: 251 146 60;
  --ef-ink-purple-300: 216 180 254;
  --ef-sink-purple-300: 216 180 254;
  --ef-ink-red-200: 254 202 202;
  --ef-sink-red-200: 254 202 202;
  --ef-ink-red-300: 252 165 165;
  --ef-sink-red-300: 252 165 165;
  --ef-ink-red-400: 248 113 113;
  --ef-sink-red-400: 248 113 113;
  --ef-ink-rose-300: 253 164 175;
  --ef-sink-rose-300: 253 164 175;
  --ef-ink-rose-400: 251 113 133;
  --ef-sink-rose-400: 251 113 133;
  --ef-ink-sky-300: 125 211 252;
  --ef-sink-sky-300: 125 211 252;
  --ef-ink-sky-400: 56 189 248;
  --ef-sink-sky-400: 56 189 248;
  --ef-ink-slate-100: 241 245 249;
  --ef-sink-slate-100: 241 245 249;
  --ef-ink-slate-200: 226 232 240;
  --ef-sink-slate-200: 226 232 240;
  --ef-ink-slate-300: 203 213 225;
  --ef-sink-slate-300: 203 213 225;
  --ef-ink-slate-400: 148 163 184;
  --ef-sink-slate-400: 148 163 184;
  --ef-ink-slate-500: 100 116 139;
  --ef-sink-slate-500: 100 116 139;
  --ef-ink-slate-600: 71 85 105;
  --ef-sink-slate-600: 71 85 105;
  --ef-ink-slate-700: 51 65 85;
  --ef-sink-slate-700: 51 65 85;
  --ef-ink-slate-800: 30 41 59;
  --ef-sink-slate-800: 30 41 59;
  --ef-ink-violet-300: 196 181 253;
  --ef-sink-violet-300: 196 181 253;
  --ef-ink-white: 255 255 255;
  --ef-sink-white: 255 255 255;
  --ef-ink-yellow-400: 250 204 21;
  --ef-sink-yellow-400: 250 204 21;
}

/* -------------------------------------------------------------------------
   Surcharges des utilitaires Tailwind (73 règles, ordre de dist.css)
   ------------------------------------------------------------------------- */
:where(:root[data-theme="light"]) .btn-primary {
    color: rgb(var(--ef-ink-white) / 1)
}
:where(:root[data-theme="light"]) .btn-secondary {
    color: rgb(var(--ef-ink-slate-200) / 1)
}
:where(:root[data-theme="light"]) .btn-danger {
    color: rgb(var(--ef-ink-white) / 1)
}
:where(:root[data-theme="light"]) .btn-ghost {
    color: rgb(var(--ef-ink-slate-300) / 1)
}
:where(:root[data-theme="light"]) .btn-ghost:hover {
    color: rgb(var(--ef-ink-white) / 1)
}
:where(:root[data-theme="light"]) .card-header {
    color: rgb(var(--ef-ink-slate-100) / 1)
}
:where(:root[data-theme="light"]) .form-label {
    color: rgb(var(--ef-ink-slate-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .form-input, :where(:root[data-theme="light"]) .form-select, :where(:root[data-theme="light"]) .form-textarea {
    color: rgb(var(--ef-ink-slate-200) / 1)
}
:where(:root[data-theme="light"]) .form-help {
    color: rgb(var(--ef-ink-slate-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .form-error {
    color: rgb(var(--ef-ink-red-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .table-wrap thead {
    color: rgb(var(--ef-ink-slate-400) / 1)
}
:where(:root[data-theme="light"]) .bg-white\/10 {
    background-color: rgb(var(--ef-ink-white) / .1)
}
:where(:root[data-theme="light"]) .text-amber-100 {
    color: rgb(var(--ef-ink-amber-100) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-amber-200 {
    color: rgb(var(--ef-ink-amber-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-amber-300 {
    color: rgb(var(--ef-ink-amber-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-amber-300\/80 {
    color: rgb(var(--ef-ink-amber-300) / .8)
}
:where(:root[data-theme="light"]) .text-amber-400 {
    color: rgb(var(--ef-ink-amber-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-blue-200 {
    color: rgb(var(--ef-ink-blue-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-blue-300 {
    color: rgb(var(--ef-ink-blue-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-blue-400 {
    color: rgb(var(--ef-ink-blue-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-brand {
    color: rgb(var(--ef-brand-ink) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-brand\/60 {
    color: rgb(var(--ef-brand-ink) / .6)
}
:where(:root[data-theme="light"]) .text-emerald-100 {
    color: rgb(var(--ef-ink-emerald-100) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-emerald-200 {
    color: rgb(var(--ef-ink-emerald-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-emerald-200\/70 {
    color: rgb(var(--ef-ink-emerald-200) / .7)
}
:where(:root[data-theme="light"]) .text-emerald-300 {
    color: rgb(var(--ef-ink-emerald-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-emerald-400 {
    color: rgb(var(--ef-ink-emerald-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-emerald-400\/80 {
    color: rgb(var(--ef-ink-emerald-400) / .8)
}
:where(:root[data-theme="light"]) .text-green-200 {
    color: rgb(var(--ef-ink-green-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-green-300 {
    color: rgb(var(--ef-ink-green-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-green-400 {
    color: rgb(var(--ef-ink-green-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-orange-200 {
    color: rgb(var(--ef-ink-orange-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-orange-300 {
    color: rgb(var(--ef-ink-orange-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-orange-400 {
    color: rgb(var(--ef-ink-orange-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-purple-300 {
    color: rgb(var(--ef-ink-purple-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-red-200 {
    color: rgb(var(--ef-ink-red-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-red-300 {
    color: rgb(var(--ef-ink-red-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-red-400 {
    color: rgb(var(--ef-ink-red-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-rose-300 {
    color: rgb(var(--ef-ink-rose-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-rose-400 {
    color: rgb(var(--ef-ink-rose-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-sky-300 {
    color: rgb(var(--ef-ink-sky-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-sky-400 {
    color: rgb(var(--ef-ink-sky-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-100 {
    color: rgb(var(--ef-ink-slate-100) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-200 {
    color: rgb(var(--ef-ink-slate-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-300 {
    color: rgb(var(--ef-ink-slate-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-400 {
    color: rgb(var(--ef-ink-slate-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-500 {
    color: rgb(var(--ef-ink-slate-500) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-500\/80 {
    color: rgb(var(--ef-ink-slate-500) / .8)
}
:where(:root[data-theme="light"]) .text-slate-600 {
    color: rgb(var(--ef-ink-slate-600) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-700 {
    color: rgb(var(--ef-ink-slate-700) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-slate-800 {
    color: rgb(var(--ef-ink-slate-800) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-surface {
    color: rgb(var(--ef-on-brand) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-white {
    color: rgb(var(--ef-ink-white) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .text-white\/90 {
    color: rgb(var(--ef-ink-white) / .9)
}
:where(:root[data-theme="light"]) .text-yellow-400 {
    color: rgb(var(--ef-ink-yellow-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .ring-white\/5 {
    --tw-ring-color: rgb(var(--ef-ink-white) / .05)
}
:where(:root[data-theme="light"]) .file\:text-brand::file-selector-button {
    color: rgb(var(--ef-brand-ink) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .file\:text-slate-200::file-selector-button {
    color: rgb(var(--ef-ink-slate-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:bg-white\/5:hover {
    background-color: rgb(var(--ef-ink-white) / .05)
}
:where(:root[data-theme="light"]) .hover\:text-amber-300:hover {
    color: rgb(var(--ef-ink-amber-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-brand:hover {
    color: rgb(var(--ef-brand-ink) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-brand-hover:hover {
    color: rgb(var(--ef-brand-ink-hover) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-emerald-200:hover {
    color: rgb(var(--ef-ink-emerald-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-green-400:hover {
    color: rgb(var(--ef-ink-green-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-orange-400:hover {
    color: rgb(var(--ef-ink-orange-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-red-300:hover {
    color: rgb(var(--ef-ink-red-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-red-400:hover {
    color: rgb(var(--ef-ink-red-400) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-slate-200:hover {
    color: rgb(var(--ef-ink-slate-200) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-slate-300:hover {
    color: rgb(var(--ef-ink-slate-300) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-surface:hover {
    color: rgb(var(--ef-on-brand) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .hover\:text-white:hover {
    color: rgb(var(--ef-ink-white) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .group:hover .group-hover\:text-brand {
    color: rgb(var(--ef-brand-ink) / var(--tw-text-opacity,1))
}
:where(:root[data-theme="light"]) .group:hover .group-hover\:text-white {
    color: rgb(var(--ef-ink-white) / var(--tw-text-opacity,1))
}

/* ==========================================================================
   Thème clair — partie écrite à la main.
   Assemblée avec les surcharges générées par tools/build-theme-light.js
   dans public/assets/css/theme-light.css (ne pas charger ce fichier seul).

   Conventions
   - :where(:root[data-theme="light"]) X  → même spécificité que X : à utiliser
     pour les composants d'app.css (chargé avant ce fichier).
   - :root[data-theme="light"] X          → +2 crans : à utiliser contre les
     <style> posés dans le corps des pages (chargés après ce fichier).
   - Encres : rgb(var(--ef-ink-<couleur>, <repli>)) suit le fond le plus proche
     (clair sur une surface, valeur d'origine sur un aplat coloré).
   ========================================================================== */

/* -- Bascule : éléments propres à un thème ------------------------------- */
:root:not([data-theme="light"]) .ef-when-light,
:root[data-theme="light"] .ef-when-dark { display: none !important; }

/* Tailles du bouton de bascule là où la cible tactile de 44 px (règle globale
   des <button>, cf. head.php) changerait la hauteur d'une barre existante. */
.ef-toggle-compact { min-height: 36px; min-width: 36px; }
.ef-toggle-mini    { min-height: 24px; min-width: 24px; margin-block: -4px; }

/* Pas d'animation de couleurs pendant la bascule (sinon effet de traîne). */
.ef-theme-switching,
.ef-theme-switching *,
.ef-theme-switching *::before,
.ef-theme-switching *::after { transition: none !important; }

/* -- Jetons ---------------------------------------------------------------
   Défauts EventFit ; une page d'événement fournit ses propres --ef-l-*
   (event_theme_style() : couleur de marque assombrie pour le texte, fond teinté). */
:root[data-theme="light"] {
  color-scheme: light;
  --ef-surface:          var(--ef-l-surface, 244 244 248);
  --ef-surface-card:     var(--ef-l-surface-card, 255 255 255);
  --ef-surface-hover:    var(--ef-l-surface-hover, 236 236 242);
  --ef-surface-border:   var(--ef-l-surface-border, 222 222 231);
  --ef-brand:            var(--ef-l-brand, 124 58 237);
  --ef-brand-hover:      var(--ef-l-brand-hover, 109 40 217);
  --ef-brand-dark:       var(--ef-l-brand-dark, 91 33 182);
  --ef-brand-ink:        var(--ef-l-brand-ink, 109 40 217);
  --ef-brand-ink-hover:  var(--ef-l-brand-ink-hover, 91 33 182);
  --ef-on-brand:         var(--ef-l-on-brand, 255 255 255);
}
:root[data-theme="light"],
:root[data-theme="light"] body { color: rgb(30 41 59); }

/* Ombres : celles du sombre (noir à 40 %) sont trop lourdes sur fond clair. */
:where(:root[data-theme="light"]) .shadow-card {
  --tw-shadow: 0 1px 2px rgb(15 23 42 / 0.06), 0 4px 16px rgb(15 23 42 / 0.08);
}

/* -- Composants d'app.css ------------------------------------------------- */
:where(:root[data-theme="light"]) .btn-primary { color: rgb(var(--ef-on-brand)); }
:where(:root[data-theme="light"]) .btn-secondary { color: rgb(30 41 59); }
:where(:root[data-theme="light"]) .btn-ghost { color: rgb(51 65 85); }
:where(:root[data-theme="light"]) .btn-ghost:hover { color: rgb(15 23 42); }
:where(:root[data-theme="light"]) .card-header { color: rgb(15 23 42); }
:where(:root[data-theme="light"]) .form-label { color: rgb(51 65 85); }
:where(:root[data-theme="light"]) .form-input,
:where(:root[data-theme="light"]) .form-select,
:where(:root[data-theme="light"]) .form-textarea { color: rgb(30 41 59); }
:where(:root[data-theme="light"]) .form-help  { color: rgb(71 85 105); }
:where(:root[data-theme="light"]) .form-error { color: rgb(185 28 28); }
:where(:root[data-theme="light"]) .table-wrap thead { color: rgb(71 85 105); }
:where(:root[data-theme="light"]) tr.category-divider td { color: rgb(71 85 105); }
:where(:root[data-theme="light"]) .rank-badge { color: rgb(30 41 59); }
:where(:root[data-theme="light"]) .category-HH { background: rgb(37 99 235 / 0.1);  color: rgb(29 78 216); }
:where(:root[data-theme="light"]) .category-HF { background: rgb(147 51 234 / 0.1); color: rgb(126 34 206); }
:where(:root[data-theme="light"]) .category-FF { background: rgb(219 39 119 / 0.1); color: rgb(190 24 93); }
:where(:root[data-theme="light"]) .spinner {
  border-color: rgb(var(--ef-ink-white, 15 23 42) / 0.25);
  border-top-color: rgb(var(--ef-ink-white, 15 23 42));
}
:where(:root[data-theme="light"]) .numpad-key { color: rgb(15 23 42); }
:where(:root[data-theme="light"]) .numpad-key:active { color: rgb(var(--ef-on-brand)); }
:where(:root[data-theme="light"]) .numpad-key-danger { color: #fff; }
:where(:root[data-theme="light"]) .numpad-key-success { color: #fff; }

/* Interrupteur « switch-button » (Uiverse) : version claire. */
:where(:root[data-theme="light"]) .switch-button .switch-outer {
  background: #e6e6ee;
  border-color: #d3d3dd;
  box-shadow: inset 0 3px 6px rgb(15 23 42 / 0.12), 0 1px 2px rgb(15 23 42 / 0.06);
}
:where(:root[data-theme="light"]) .switch-button .switch-outer .button-toggle {
  background: linear-gradient(#ffffff, #ececf2);
  box-shadow: inset 0 2px 2px #ffffff, 0 3px 8px rgb(15 23 42 / 0.18);
}
:where(:root[data-theme="light"]) .toggle-wrap .toggle-label { color: rgb(30 41 59); }
:where(:root[data-theme="light"]) .toggle-wrap .toggle-help  { color: rgb(71 85 105); }

/* -- SweetAlert2 : les appels passent un fond sombre en dur (#16161f…). --- */
:root[data-theme="light"] .swal2-popup {
  background: #ffffff !important;
  color: rgb(30 41 59) !important;
  border: 1px solid rgb(var(--ef-surface-border));
}
:root[data-theme="light"] .swal2-title { color: rgb(15 23 42) !important; }
:root[data-theme="light"] .swal2-html-container,
:root[data-theme="light"] .swal2-input-label { color: rgb(51 65 85) !important; }
:root[data-theme="light"] .swal2-input,
:root[data-theme="light"] .swal2-textarea,
:root[data-theme="light"] .swal2-select {
  background: #ffffff !important;
  color: rgb(30 41 59) !important;
  border-color: rgb(var(--ef-surface-border)) !important;
}
/* Bouton « Confirmer » violet passé en dur (confirmButtonColor: '#a78bfa') :
   violet du thème clair, plus contrasté sous un texte blanc. */
:root[data-theme="light"] .swal2-styled[style*="rgb(167, 139, 250)"] { background-color: rgb(var(--ef-brand)) !important; }

/* -- Pages ----------------------------------------------------------------- */
/* Texte posé sur un aplat de marque (classe arbitraire, /competitions). */
:where(:root[data-theme="light"]) .text-\[\#16161f\] { color: rgb(var(--ef-on-brand)); }
/* Accueil : pas d'ombre portée sombre sous le titre du hero (texte foncé). */
:root[data-theme="light"] { --ef-hero-text-shadow: none; }

/* Page au thème imposé ($themeLock) : le bouton de bascule n'a pas d'effet. */
:root[data-theme-locked] [data-theme-toggle] { display: none !important; }

/* -- Îlot sombre : .ef-dark ------------------------------------------------
   Un bloc qui garde l'apparence du thème sombre dans une page claire (hero sur
   photo sombre…). Les encres sont remises par la partie générée ; ici, les
   jetons de surface et de marque (valeurs de l'événement via --ef-d-*, posées
   par event_theme_style(), sinon défauts EventFit). */
:where(:root[data-theme="light"]) .ef-dark {
  color-scheme: dark;
  --ef-surface:          var(--ef-d-surface, 10 10 15);
  --ef-surface-card:     var(--ef-d-surface-card, 22 22 31);
  --ef-surface-hover:    var(--ef-d-surface-hover, 34 34 46);
  --ef-surface-border:   var(--ef-d-surface-border, 42 42 53);
  --ef-brand:            var(--ef-d-brand, 167 139 250);
  --ef-brand-hover:      var(--ef-d-brand-hover, 196 181 253);
  --ef-brand-dark:       var(--ef-d-brand-dark, 139 92 246);
  --ef-brand-ink:        var(--ef-d-brand, 167 139 250);
  --ef-brand-ink-hover:  var(--ef-d-brand-hover, 196 181 253);
  --ef-on-brand:         var(--ef-d-surface, 10 10 15);
  --ef-hero-text-shadow: initial;
}
:where(:root[data-theme="light"] .ef-dark) { color: rgb(226 232 240); }

/* Boutons blancs (« Continuer avec Google ») : en clair, posés sur une carte
   blanche, ils ont besoin d'un contour pour rester des boutons. */
:where(:root[data-theme="light"]) a.bg-white {
  box-shadow: 0 0 0 1px rgb(var(--ef-surface-border)), 0 1px 2px rgb(15 23 42 / 0.06);
}

/* Bandeau sponsors : logos souvent blancs (fournis pour le site sombre) →
   bandeau sombre arrondi en thème clair (la section porte aussi .ef-dark). */
:root[data-theme="light"] .ef-sponsors-band {
  background: rgb(var(--ef-surface));
  border-top-color: transparent;
  border-radius: 1rem;
  width: min(80rem, 100% - 2rem);
  margin-inline: auto;
}
