/* One Million Factory Booking — composants (complète Tailwind CDN) */
[x-cloak] { display: none !important; }

html { scroll-behavior: smooth; }
body { -webkit-tap-highlight-color: transparent; }

/* ----- Tunnel de réservation ----- */
.step-card {
    background: #fff;
    border-radius: 1rem;
    padding: 1.25rem;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
    outline: 1px solid rgba(229, 231, 235, .7);
    transition: outline-color .2s, box-shadow .2s;
}
@media (min-width: 640px) { .step-card { padding: 1.5rem; } }
.step-card.is-active { outline: 2px solid rgba(227, 10, 19, .25); box-shadow: 0 10px 30px -12px rgba(16, 24, 40, .18); }

.step-num {
    display: grid; place-items: center; flex-shrink: 0;
    width: 2rem; height: 2rem; border-radius: 9999px;
    font-size: .85rem; font-weight: 700;
    background: #F3F4F6; color: #6B7280;
}
.step-num.is-current { background: #E30A13; color: #fff; }
.step-num.is-done { background: #ECFDF5; color: #047857; }
.step-kicker { font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6B7280; }
.step-edit { font-size: .85rem; font-weight: 600; color: #C1070F; }
.step-edit:hover { text-decoration: underline; }

.cal-nav { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .6rem; color: #374151; }
.cal-nav:hover:not(:disabled) { background: #F3F4F6; }
.cal-nav:disabled { opacity: .3; cursor: not-allowed; }

/* ----- Formulaires ----- */
.field { display: flex; flex-direction: column; gap: .35rem; }
.field > span { font-size: .8rem; font-weight: 600; color: #374151; }
.field input, .field select, .field textarea {
    width: 100%; border-radius: .7rem; border: 1px solid #E5E7EB; background: #fff;
    padding: .65rem .85rem; font-size: .95rem; color: #111827;
    transition: border-color .15s, box-shadow .15s;
}
.field input:focus, .field select:focus, .field textarea:focus {
    outline: none; border-color: #E30A13; box-shadow: 0 0 0 3px rgba(227, 10, 19, .12);
}
.field .hint { font-size: .75rem; font-weight: 400; color: #6B7280; }

/* ----- Boutons ----- */
.btn-primary, .btn-secondary, .btn-danger, .btn-ghost {
    display: inline-flex; align-items: center; gap: .5rem;
    border-radius: .75rem; padding: .7rem 1.2rem;
    font-size: .9rem; font-weight: 600; line-height: 1.2;
    transition: background-color .15s, color .15s, box-shadow .15s, opacity .15s;
}
.btn-primary { background: #E30A13; color: #fff; }
.btn-primary:hover:not(:disabled) { background: #C1070F; }
.btn-primary:disabled { opacity: .45; cursor: not-allowed; }
.btn-secondary { background: #fff; color: #111827; box-shadow: inset 0 0 0 1px #E5E7EB; }
.btn-secondary:hover { background: #F9FAFB; }
.btn-danger { background: #fff; color: #B91C1C; box-shadow: inset 0 0 0 1px #FECACA; }
.btn-danger:hover { background: #FEF2F2; }
.btn-ghost { color: #374151; padding: .5rem .75rem; }
.btn-ghost:hover { background: #F3F4F6; }
.btn-sm { padding: .45rem .8rem; font-size: .8rem; border-radius: .6rem; }

/* ----- Back-office ----- */
.card { background: #fff; border-radius: 1rem; box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06); outline: 1px solid rgba(229,231,235,.7); }
.table { width: 100%; font-size: .875rem; }
.table th { text-align: left; font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #6B7280; padding: .75rem 1rem; background: #F9FAFB; border-bottom: 1px solid #F3F4F6; }
.table td { padding: .85rem 1rem; border-bottom: 1px solid #F3F4F6; vertical-align: middle; }
.table tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: #FCFCFD; }

.side-link { display: flex; align-items: center; gap: .75rem; border-radius: .7rem; padding: .6rem .8rem; font-size: .9rem; font-weight: 500; color: #4B5563; }
.side-link:hover { background: #F3F4F6; color: #111827; }
.side-link.is-active { background: #FFF1F2; color: #C1070F; font-weight: 600; }
.side-link svg { width: 1.25rem; height: 1.25rem; }

/* ----- FullCalendar (palette OMF) ----- */
.fc { --fc-border-color: #F1F2F4; --fc-today-bg-color: #FFF1F2; --fc-button-bg-color: #fff; --fc-button-text-color: #111827;
      --fc-button-border-color: #E5E7EB; --fc-button-hover-bg-color: #F9FAFB; --fc-button-hover-border-color: #E5E7EB;
      --fc-button-active-bg-color: #E30A13; --fc-button-active-border-color: #E30A13; --fc-event-border-color: transparent; font-size: .85rem; }
.fc .fc-button { border-radius: .6rem; font-weight: 600; text-transform: capitalize; box-shadow: none !important; }
.fc .fc-button-primary:not(:disabled).fc-button-active { color: #fff; }
.fc .fc-toolbar-title { font-size: 1.1rem; font-weight: 700; text-transform: capitalize; }
.fc .fc-event { border-radius: .4rem; padding: 1px 3px; cursor: pointer; }
.fc .fc-col-header-cell-cushion, .fc .fc-daygrid-day-number { color: #374151; text-decoration: none; }
.fc-unavailable { background: repeating-linear-gradient(45deg, #E5E7EB, #E5E7EB 6px, #F3F4F6 6px, #F3F4F6 12px) !important; color: #374151 !important; }
.fc-unavailable .fc-event-title, .fc-unavailable .fc-event-time { color: #374151 !important; }

/* Bannière d'accueil : lueurs animées */
.hero-glows .glow { position: absolute; border-radius: 9999px; filter: blur(60px); opacity: .55; mix-blend-mode: screen; will-change: transform; }
.hero-glows .glow-1 { width: 420px; height: 420px; left: -80px; top: -120px; background: #FF5A61; animation: omf-glow-a 2.6s ease-in-out infinite alternate; }
.hero-glows .glow-2 { width: 360px; height: 360px; right: -60px; top: 20%; background: #FFC6C8; opacity: .35; animation: omf-glow-b 3.2s ease-in-out infinite alternate; }
.hero-glows .glow-3 { width: 300px; height: 300px; left: 40%; bottom: -160px; background: #F52A32; animation: omf-glow-c 2.2s ease-in-out infinite alternate; }
@keyframes omf-glow-a { to { transform: translate(260px, 120px) scale(1.2); } }
@keyframes omf-glow-b { to { transform: translate(-220px, 80px) scale(.85); } }
@keyframes omf-glow-c { to { transform: translate(-180px, -140px) scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .hero-glows .glow { animation: none; } }

/* Moyens de paiement (pied de page) */
.pay-badge { display: inline-flex; align-items: center; gap: 1px; height: 28px; padding: 0 10px; border: 1px solid #E5E7EB; border-radius: 6px; background: #fff; font-size: 12px; color: #374151; }

/* Apparition douce des cartes au défilement */
.js-reveal [data-reveal] { opacity: 0; transform: translateY(48px) scale(.97); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.js-reveal [data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js-reveal [data-reveal] { opacity: 1; transform: none; transition: none; } }

/* Animations des boutons */
.btn-primary, .btn-secondary, .btn-ghost { transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease; }
.btn-primary:hover:not(:disabled), .btn-secondary:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 8px 20px -10px rgba(227, 10, 19, .55); }
.btn-primary:active:not(:disabled), .btn-secondary:active:not(:disabled) { transform: translateY(0) scale(.98); box-shadow: none; }
/* Boutons importants : reflet qui balaie le bouton + halo pulsé */
.btn-glow { position: relative; overflow: hidden; isolation: isolate; animation: omf-pulse 2.6s ease-in-out infinite; }
.btn-glow::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%); transform: translateX(-120%); animation: omf-shine 3.2s ease-in-out infinite; }
.btn-glow:disabled { animation: none; }
.btn-glow:disabled::after { display: none; }
@keyframes omf-shine { 0%, 55% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
@keyframes omf-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(227, 10, 19, .45); } 50% { box-shadow: 0 0 0 8px rgba(227, 10, 19, 0); } }

/* Cartes artistes : apparition en cascade et zoom doux au survol */
#artistes a.group { animation: omf-rise .55s ease both; }
#artistes a.group:nth-child(2) { animation-delay: .05s; } #artistes a.group:nth-child(3) { animation-delay: .1s; }
#artistes a.group:nth-child(4) { animation-delay: .15s; } #artistes a.group:nth-child(5) { animation-delay: .2s; }
#artistes a.group:nth-child(n+6) { animation-delay: .25s; }
#artistes a.group { transition: transform .25s ease, box-shadow .25s ease; }
#artistes a.group:hover { transform: translateY(-4px); }
@keyframes omf-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
.card { transition: box-shadow .25s ease, transform .25s ease; }

@media (prefers-reduced-motion: reduce) {
    .btn-glow, .btn-glow::after, #artistes a.group { animation: none !important; }
    .btn-primary:hover, .btn-secondary:hover, #artistes a.group:hover { transform: none; }
}

/* Entrée animée du hero et des cartes artistes */
@keyframes omf-in-up { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: none; } }
@keyframes omf-card-in { from { opacity: 0; transform: translateY(40px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes omf-pop { 0%, 100% { scale: 1; } 50% { scale: 1.025; } }
.hero-in { animation: omf-in-up .9s cubic-bezier(.2,.7,.2,1) both; }
.hero-in-2 { animation-delay: .15s; } .hero-in-3 { animation-delay: .3s; } .hero-in-4 { animation-delay: .45s; }
.hero-logo { animation: omf-in-up .9s cubic-bezier(.2,.7,.2,1) both, omf-pop 3.5s ease-in-out 1s infinite; }
.artist-card-in { animation: omf-card-in .7s cubic-bezier(.2,.7,.2,1) both; }
@media (prefers-reduced-motion: reduce) { .hero-in, .artist-card-in, .hero-logo { animation-duration: .01s; animation-iteration-count: 1; } }
.hero-glows { transition: translate .6s ease-out; }