/* Interface de réservation Transport — alignée sur l'identité du site (forêt/or, Italiana + DM Sans) :
   même palette et la même hiérarchie typographique que le reste de l'hôtellerie (titres et totaux en
   serif, texte courant et champs en DM Sans), pour que ce parcours de réservation se lise comme la
   même expérience, pas comme un outil à part. Les noms de variables --tb-* sont conservés tels quels
   (repris dans tout ce fichier) ; seules leurs valeurs changent. */
.transport-page{
 --tb-navy:var(--forest);--tb-blue:var(--forest2);--tb-turquoise:var(--gold);--tb-turquoise-light:#f4efe1;
 --tb-ink:var(--ink);--tb-muted:#5f736d;--tb-line:#dfe5e2;--tb-bg:var(--ivory);--tb-white:#fff;--tb-danger:#a3432f;
 background:var(--tb-bg);padding-top:96px;font-family:var(--sans);color:var(--tb-ink)
}
@media(max-width:900px){.transport-page{padding-top:72px}}

/* Ancres du menu (Transport / Bateau / Voiture) : le header étant fixe, la cible doit se décaler vers
   le bas d'autant, sinon son titre se retrouve caché derrière le header au moment de l'arrivée. */
#transport,#bateau,#voiture{scroll-margin-top:110px}
@media(max-width:900px){#transport,#bateau,#voiture{scroll-margin-top:88px}}

.tb-alert{background:#fbeae4;color:var(--tb-danger);border:1px solid #eccabd;padding:14px 18px;border-radius:10px;font-size:14px;max-width:720px;margin:0 auto 24px}

/* ---- Un "engine" de réservation par option (bateau / voiture) ---- */
.tb-engine{padding:70px max(5vw,24px) 100px;border-top:1px solid var(--tb-line)}
.tb-engine:first-of-type{border-top:0}
.tb-hero{max-width:760px;margin:0 auto 48px;text-align:center}
.tb-eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:10px;font-weight:600;color:#a1844d;margin:0 0 14px}
.tb-hero h1{font:400 clamp(34px,4.6vw,54px)/1.05 var(--serif);letter-spacing:-.025em;color:var(--tb-navy);margin:0 0 14px}
.tb-hero h1 em{font-style:normal;color:var(--gold)}
.tb-hero-sub{color:var(--tb-muted);font-size:15px;line-height:1.7;margin:0 auto;max-width:560px}

.tb-layout{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}

/* ---- Étapes (desktop) ---- */
.tb-steps{display:flex;list-style:none;margin:0 0 32px;padding:0}
.tb-step{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.tb-step:not(:last-child):after{content:'';position:absolute;top:17px;left:calc(50% + 23px);right:calc(-50% + 23px);height:2px;background:var(--tb-line)}
.tb-step span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--tb-white);border:2px solid var(--tb-line);color:var(--tb-muted);font:700 12px var(--sans);transition:.25s}
.tb-step small{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--tb-muted)}
.tb-step.is-active span{background:var(--tb-navy);border-color:var(--tb-navy);color:#fff}
.tb-step.is-active small{color:var(--tb-navy)}
.tb-step.is-done span{background:var(--tb-turquoise);border-color:var(--tb-turquoise);color:#0b4a46}
.tb-step.is-done:after{background:var(--tb-turquoise)}
.tb-step.is-done{cursor:pointer}

/* ---- Progression compacte (mobile) ---- */
.tb-mobile-progress{display:none;margin-bottom:24px}
.tb-mobile-progress span{display:block;font-size:12px;font-weight:600;color:var(--tb-muted);margin-bottom:8px}
.tb-bar{height:6px;border-radius:30px;background:var(--tb-line);overflow:hidden}
.tb-bar i{display:block;height:100%;background:var(--tb-turquoise);border-radius:30px;transition:width .3s ease}

/* ---- Cartes d'étape ---- */
.tb-card{background:var(--tb-white);border:1px solid var(--tb-line);border-radius:16px;padding:clamp(24px,4vw,40px);box-shadow:0 4px 18px rgba(11,74,70,.05)}
.tb-card[hidden]{display:none}
.tb-card h2{font:400 26px/1.25 var(--serif);letter-spacing:-.01em;color:var(--tb-navy);margin:0 0 22px}
.tb-help{color:var(--tb-muted);font-size:13px;margin:-10px 0 20px}

.tb-field{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:600;color:var(--tb-muted);margin-bottom:0}
.tb-field input{font:15px var(--sans);padding:14px 16px;border:1px solid var(--tb-line);border-radius:10px;color:var(--tb-ink);background:var(--tb-bg);min-height:50px}
.tb-field input:focus{outline:none;border-color:var(--tb-turquoise);background:var(--tb-white);box-shadow:0 0 0 3px var(--tb-turquoise-light)}
.tb-field input:required:invalid{box-shadow:none}

.tb-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.tb-span-2{grid-column:1/-1}

/* ---- Tarifs (affichés tels que configurés en admin, jamais codés en dur) ---- */
.tb-tariffs{background:var(--tb-turquoise-light);border-radius:12px;padding:16px 20px;margin-bottom:22px}
.tb-tariffs-title{margin:0 0 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#8a6f3c}
.tb-tariff-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:4px 0;color:var(--tb-ink)}
.tb-tariff-row strong{font-weight:600}

/* ---- Participants ---- */
.tb-qty-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border:1px solid var(--tb-line);border-radius:12px;margin-bottom:22px}
.tb-qty-label{display:flex;flex-direction:column;gap:3px}
.tb-qty-label strong{font-size:15px;color:var(--tb-ink)}
.tb-qty-label small{color:var(--tb-muted);font-size:12px}
.tb-qty{display:flex;align-items:center;gap:16px}
.tb-qty-btn{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--tb-navy);background:var(--tb-white);color:var(--tb-navy);font-size:18px;line-height:1;cursor:pointer;transition:.2s}
.tb-qty-btn:hover{background:var(--tb-navy);color:#fff}
.tb-qty input{width:44px;text-align:center;border:0;background:transparent;font:700 20px var(--sans);color:var(--tb-ink)}
.tb-qty input::-webkit-inner-spin-button,.tb-qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* ---- Horaire ---- */
.tb-schedule-options{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:8px}
.tb-schedule-option{flex:1;min-width:140px;padding:18px 20px;border:2px solid var(--tb-line);border-radius:12px;display:flex;flex-direction:column;gap:6px;position:relative}
.tb-schedule-option small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--tb-muted)}
.tb-schedule-option strong{font:400 26px var(--serif);color:var(--tb-navy)}
.tb-schedule-option.is-selected{border-color:var(--tb-turquoise);background:var(--tb-turquoise-light)}
.tb-schedule-option.is-selected:after{content:'✓';position:absolute;top:14px;right:16px;width:22px;height:22px;border-radius:50%;background:var(--tb-turquoise);color:#0b4a46;font-size:12px;display:grid;place-items:center}

.transport-availability{margin:18px 0 0;padding:10px 16px;border-radius:30px;background:var(--tb-turquoise-light);font-size:12px;font-weight:600;color:#8a6f3c;min-height:16px;text-align:center;transition:.25s}
.transport-availability:empty{margin:0;padding:0;background:none}
.transport-availability.is-full{background:#fbeae4;color:var(--tb-danger)}

/* ---- Récapitulatif + paiement ---- */
.tb-recap-title{margin:-6px 0 14px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--tb-muted)}
.tb-recap{background:var(--tb-bg);border-radius:12px;padding:22px 24px;display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.tb-recap-line{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--tb-ink)}
.tb-recap-line[hidden]{display:none}
.tb-recap-line strong{color:var(--tb-ink);font-weight:600}
.tb-recap-total{display:flex;justify-content:space-between;align-items:center;padding-top:14px;border-top:1px dashed var(--tb-line)}
.tb-recap-total span{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--tb-navy)}
.tb-recap-total strong{font:400 32px var(--serif);color:var(--tb-navy)}

.tb-cgv{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--tb-muted);line-height:1.6;margin-bottom:24px;cursor:pointer}
.tb-cgv input{margin-top:3px;width:18px;height:18px;accent-color:var(--tb-turquoise);flex:none}
.tb-cgv a{color:var(--tb-navy);text-decoration:underline;text-underline-offset:2px}

/* ---- Boutons & navigation d'étape (même traitement que .button ailleurs sur le site : petites
   capitales espacées, jamais de texte blanc sur fond or) ---- */
.tb-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:26px}
.tb-nav-end{justify-content:flex-end}
.tb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 32px;font:600 10px var(--sans);text-transform:uppercase;letter-spacing:.14em;border:1px solid transparent;cursor:pointer;transition:.3s}
.tb-btn-primary{background:var(--tb-navy);color:#fff}
.tb-btn-primary:hover{background:var(--tb-blue)}
.tb-btn-primary:disabled{opacity:.45;cursor:not-allowed;background:var(--tb-muted)}
.tb-btn-pay{background:var(--tb-turquoise);color:#102b29}
.tb-btn-pay:hover{background:#e2cd9f}
.tb-btn-ghost{background:none;border-color:var(--tb-line);color:var(--tb-muted);padding:0 22px}
.tb-btn-ghost:hover{border-color:var(--tb-navy);color:var(--tb-navy)}

/* ---- Panneau latéral fixe (desktop) ---- */
.tb-summary{position:sticky;top:116px;background:var(--tb-navy);color:#fff;border-radius:16px;padding:30px 28px;display:flex;flex-direction:column;gap:18px}
.tb-summary-kicker{margin:0;font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:#bcd0c7;font-weight:700}
.tb-summary h3{margin:0;font:400 26px var(--serif)}
.tb-summary dl{margin:0;display:flex;flex-direction:column;gap:12px;padding-top:6px;border-top:1px solid #ffffff22}
.tb-summary dl>div{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.tb-summary dt{color:#bcd0c7}
.tb-summary dd{margin:0;font-weight:600}
.tb-summary-total{display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid #ffffff22}
.tb-summary-total span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#bcd0c7}
.tb-summary-total strong{font:400 30px var(--serif);color:var(--tb-turquoise)}

@media(max-width:1000px){
 .tb-layout{grid-template-columns:1fr}
 .tb-summary{position:static;order:-1}
}

@media(max-width:760px){
 .tb-engine{padding:44px 18px 70px}
 .tb-steps{display:none}
 .tb-mobile-progress{display:block}
 .tb-grid-2{grid-template-columns:1fr}
 .tb-qty-row{flex-direction:column;align-items:flex-start;gap:14px}
 .tb-nav{flex-direction:column-reverse;align-items:stretch}
 .tb-nav .tb-btn{width:100%}
 .tb-nav-end .tb-btn{width:100%}
 .tb-schedule-option{min-width:120px}
}

/* ---- Page de confirmation (billet) ---- */
/* La page de confirmation est un gabarit à part (pas imbriqué dans .transport-page) : elle a besoin de
   sa propre copie des variables --tb-*, sans quoi elles restent indéfinies ici (bug pré-existant repéré
   pendant ce passage — le bouton "Recevoir le billet par e-mail" en particulier était rendu invisible,
   fond transparent, faute de valeur pour --tb-navy). */
.tb-confirm-page{
 --tb-navy:var(--forest);--tb-blue:var(--forest2);--tb-turquoise:var(--gold);--tb-turquoise-light:#f4efe1;
 --tb-ink:var(--ink);--tb-muted:#5f736d;--tb-line:#dfe5e2;--tb-bg:var(--ivory);--tb-white:#fff;--tb-danger:#a3432f;
 min-height:100vh;background:var(--tb-bg);font-family:var(--sans);color:var(--tb-ink);padding:0 0 80px}
.tb-confirm-header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,64px);background:var(--tb-white);border-bottom:1px solid var(--tb-line)}
.tb-confirm-header a{display:flex;align-items:center;gap:10px;font:700 11px var(--sans);text-transform:uppercase;letter-spacing:.1em;color:var(--tb-navy)}
.tb-confirm-header a span{width:36px;height:36px;border-radius:50%;border:1px solid var(--tb-navy);display:grid;place-items:center;font-family:var(--serif);font-size:13px}

.tb-ticket{max-width:680px;margin:56px auto 0;padding:0 20px}
.tb-confirm-status{text-align:center;margin-bottom:36px}
.tb-confirm-check{width:64px;height:64px;border-radius:50%;background:var(--tb-turquoise-light);color:#8a6f3c;display:grid;place-items:center;font-size:28px;margin:0 auto 18px}
.tb-confirm-check.is-pending{background:#fdf3e3;color:#a3742a}
.tb-confirm-status h1{font:400 32px var(--serif);letter-spacing:-.01em;color:var(--tb-navy);margin:0 0 10px}
.tb-confirm-status p{color:var(--tb-muted);font-size:14px;margin:0}

.tb-card.tb-ticket-card{margin-bottom:22px}
.tb-ticket-ref{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;margin-bottom:18px;border-bottom:1px dashed var(--tb-line)}
.tb-ticket-ref small{display:block;color:var(--tb-muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.tb-ticket-ref strong{font:400 24px var(--serif);color:var(--tb-navy);letter-spacing:.01em}
.tb-ticket-ref img{width:96px;height:96px;flex:none}
.tb-ticket-rows{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}
.tb-ticket-rows>div{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.tb-ticket-rows dt,.tb-ticket-rows span:first-child{color:var(--tb-muted)}
.tb-ticket-rows strong{font-weight:600}
.tb-ticket-total{display:flex;justify-content:space-between;align-items:center;padding-top:18px;border-top:1px dashed var(--tb-line)}
.tb-ticket-total span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--tb-navy)}
.tb-ticket-total strong{font:400 30px var(--serif);color:var(--tb-navy)}

.tb-ticket-actions{display:flex;gap:14px}
.tb-ticket-actions>.tb-btn,.tb-ticket-actions form{flex:1}
.tb-ticket-actions form .tb-btn{width:100%}
.tb-ticket-note{text-align:center;color:var(--tb-muted);font-size:12px;margin-top:22px}

@media(max-width:600px){
 .tb-ticket{margin-top:32px}
 .tb-ticket-ref{flex-direction:column;align-items:flex-start;gap:16px}
 .tb-ticket-actions{flex-direction:column}
}

@media print{
 .tb-confirm-header,.tb-ticket-actions,.tb-confirm-status,.tb-ticket-note{display:none!important}
 body *{visibility:hidden}
 .tb-ticket-card,.tb-ticket-card *{visibility:visible}
 .tb-ticket-card{position:absolute;top:0;left:0;right:0;box-shadow:none;border:1px solid #000}
}