/* ==========================================================
   TaxiDriverPrivé — Design system VTC premium
   Palette : noir profond / or bruni / ivoire
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --bg:#0b0c0e;
  --panel:#15171a;
  --panel-2:#1b1d21;
  --gold:#b8935a;
  --gold-bright:#d4af75;
  --ivory:#edeae2;
  --muted:#8a8d91;
  --line: rgba(184,147,90,0.28);
  --danger:#c0564a;
  --radius: 2px;
}

body{
  background:var(--bg);
  color:var(--ivory);
  font-family:'Inter', sans-serif;
  -webkit-font-smoothing:antialiased;
}

a{ color:var(--gold); }
a:hover{ color:var(--gold-bright); }

/* ---------- NAVBAR ---------- */
/* Surcharge du thème Bootstrap navbar-dark bg-dark pour matcher la charte */
.navbar.bg-dark{
  background-color:var(--bg) !important;
  border-bottom:1px solid var(--line);
}
.navbar-brand{
  font-family:'Fraunces', serif;
  font-weight:500;
  letter-spacing:0.02em;
  color:var(--ivory) !important;
  display:flex;
  align-items:center;
  gap:9px;
}
.navbar-brand::before{
  content:"";
  width:7px;height:7px;border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 0 3px rgba(184,147,90,0.2);
}
.navbar-nav .nav-link{
  color:var(--muted) !important;
  font-size:0.92rem;
  transition:color .2s;
}
.navbar-nav .nav-link:hover{ color:var(--ivory) !important; }

.btn-outline-light{
  border-color:var(--gold) !important;
  color:var(--gold) !important;
  background:transparent !important;
  border-radius:var(--radius);
  font-size:0.85rem;
  transition:background .2s, color .2s;
}
.btn-outline-light:hover{
  background:var(--gold) !important;
  color:var(--bg) !important;
}
.btn-danger{
  background:var(--danger) !important;
  border-color:var(--danger) !important;
  border-radius:var(--radius);
}

/* ---------- HEADER ---------- */
header.bg-light{
  background:
    linear-gradient(180deg, rgba(11,12,14,0.55) 0%, rgba(11,12,14,0.9) 100%),
    var(--panel) !important;
  border-bottom:1px solid var(--line);
  padding:72px 0 !important;
}
header.bg-light h1{
  font-family:'Fraunces', serif;
  font-weight:500;
  color:var(--ivory);
  font-size:clamp(2rem, 4vw, 2.8rem);
}
header.bg-light .lead{
  color:var(--muted);
  font-size:1.05rem;
  margin-top:10px;
}

/* ---------- ALERTES ---------- */
.alert-warning{
  background:var(--panel-2) !important;
  border:1px solid var(--danger) !important;
  color:var(--ivory) !important;
  border-radius:var(--radius);
  display:block;
  margin:24px auto 0;
  max-width:700px;
  text-align:center;
  padding:14px 20px;
  font-size:0.92rem;
}

/* ---------- FORMULAIRE DE RÉSERVATION ---------- */
.reservation-box{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:48px 44px;
  margin-top:-40px;
  position:relative;
  z-index:2;
}

.reservation-box .title{
  font-family:'Fraunces', serif;
  font-size:1.6rem;
  font-weight:500;
  color:var(--ivory);
  margin-bottom:32px;
  padding-bottom:20px;
  border-bottom:1px solid var(--line);
}

.reservation-box .form-label{
  font-family:'JetBrains Mono', monospace;
  font-size:0.72rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
}

.reservation-box .form-control,
.reservation-box .form-select,
.reservation-box .form-item{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
  color:var(--ivory);
  padding:11px 14px;
  font-size:0.95rem;
  transition:border-color .2s, box-shadow .2s;
}

.reservation-box .form-control::placeholder{
  color:#5b5d61;
}

.reservation-box .form-control:focus,
.reservation-box .form-select:focus,
.reservation-box .form-item:focus{
  background:var(--bg);
  border-color:var(--gold);
  color:var(--ivory);
  box-shadow:0 0 0 3px rgba(184,147,90,0.18);
  outline:none;
}

/* Select : flèche visible sur fond sombre */
.reservation-box .form-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23b8935a' d='M0 0l6 8 6-8z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px;
  appearance:none;
}

/* Checkboxes (options) */
.reservation-box .form-check{
  margin-bottom:10px;
}
.reservation-box .form-check-input{
  background-color:var(--bg);
  border:1px solid var(--line);
  width:1.1em;
  height:1.1em;
  margin-top:0.2em;
}
.reservation-box .form-check-input:checked{
  background-color:var(--gold);
  border-color:var(--gold);
}
.reservation-box .form-check-input:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(184,147,90,0.18);
}
.reservation-box .form-check-label{
  color:var(--muted);
  font-size:0.94rem;
}

/* Bouton de soumission */
.reservation-box .btn-dark{
  background:var(--gold);
  border:none;
  color:#161514;
  font-weight:600;
  font-size:0.95rem;
  letter-spacing:0.01em;
  border-radius:var(--radius);
  padding:14px;
  transition:background .2s, transform .2s;
}
.reservation-box .btn-dark:hover{
  background:var(--gold-bright);
  transform:translateY(-1px);
}
.reservation-box .btn-dark:active{
  transform:translateY(0);
}

/* ---------- TICKETS ---------- */
.tickets-empty{
  background:var(--panel) !important;
  border:1px solid var(--line) !important;
  border-radius:var(--radius);
  color:var(--ivory) !important;
  padding:56px 32px;
}
.tickets-empty h4{
  font-family:'Fraunces', serif;
  font-weight:500;
  color:var(--ivory);
}

/* ---------- BOUTON OR (réutilisable partout : CTA, tickets vides, etc.) ---------- */
.btn-gold{
  background:var(--gold) !important;
  border:none !important;
  color:#161514 !important;
  font-weight:600;
  border-radius:var(--radius);
  transition:background .2s, transform .2s;
}
.btn-gold:hover{
  background:var(--gold-bright) !important;
  color:#161514 !important;
  transform:translateY(-1px);
}
.btn-gold:active{ transform:translateY(0); }

.ticket-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-left:3px solid var(--gold);
  border-radius:var(--radius);
  margin-bottom:24px;
  overflow:hidden;
}
.ticket-header{
  background:var(--panel-2);
  border-bottom:1px solid var(--line);
  padding:20px 28px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.ticket-header h5{
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.05rem;
  color:var(--ivory);
  margin:0;
}
.ticket-price-badge{
  font-family:'JetBrains Mono', monospace;
  background:var(--gold);
  color:#161514;
  font-weight:600;
  font-size:0.95rem;
  padding:6px 14px;
  border-radius:var(--radius);
}
.ticket-body{ padding:28px; }
.ticket-route-label{
  font-family:'JetBrains Mono', monospace;
  font-size:0.7rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
}
.ticket-route{
  font-family:'Fraunces', serif;
  font-size:1.35rem;
  font-weight:500;
  color:var(--ivory);
}
.ticket-route .arrow{ color:var(--gold); margin:0 10px; }
.ticket-divider{ border-color:var(--line); margin:22px 0; }
.ticket-stat-label{
  font-family:'JetBrains Mono', monospace;
  font-size:0.68rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:6px;
}
.ticket-stat-value{
  font-weight:600;
  font-size:1.05rem;
  color:var(--ivory);
}
.ticket-stat-value.gold{ color:var(--gold); }
.ticket-footer{
  background:var(--panel-2);
  border-top:1px solid var(--line);
  padding:16px 28px;
  text-align:center;
}
.ticket-footer .btn-danger{
  background:transparent !important;
  border:1px solid var(--danger) !important;
  color:var(--danger) !important;
  font-size:0.88rem;
  transition:background .2s, color .2s;
}
.ticket-footer .btn-danger:hover{
  background:var(--danger) !important;
  color:var(--ivory) !important;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 767px){
  .reservation-box{
    padding:32px 24px;
    margin-top:0;
  }
  .ticket-body, .ticket-header{
    padding:18px 20px;
  }
}

/* Respect des préférences de mouvement réduit */
@media (prefers-reduced-motion: reduce){
  .reservation-box .btn-dark,
  .btn-outline-light,
  .ticket-footer .btn-danger,
  .btn-gold{
    transition:none;
  }
}