/* =========================================================
   TAWAF — charte appliquée à l'Espace Pèlerin
   (connexion, tableau de bord, séjour terminé : pages autonomes)
   Navy & or, police Light ; cartes et formulaires sur fond crème
   ========================================================= */
@font-face{font-family:"Light";font-style:normal;font-weight:100 350;font-display:swap;src:url("fonts/tawaf-sans-300.woff2") format("woff2")}
@font-face{font-family:"Light";font-style:normal;font-weight:351 450;font-display:swap;src:url("fonts/tawaf-sans-400.woff2") format("woff2")}
@font-face{font-family:"Light";font-style:normal;font-weight:451 550;font-display:swap;src:url("fonts/tawaf-sans-500.woff2") format("woff2")}
@font-face{font-family:"Light";font-style:normal;font-weight:551 900;font-display:swap;src:url("fonts/tawaf-sans-600.woff2") format("woff2")}
:root{
  --primary:#073350;
  --primary-dark:#062B40;
  --primary-light:#F7F2E8;
  --accent:#D4A657;
  --bg-gray:#EFE6D4;
  --border:#E3D9C5;
  --text-primary:#05314A;
  --text-secondary:#5A6C78;
}
body{font-family:Light, arial, sans-serif !important}
body :is(h1,h2,h3,h4,h5,h6,p,a,span,div,li,label,small,strong,b,button,input,select,textarea,td,th):not(.fa):not(.fas):not(.far):not(.fab):not([class*="fa-"]){font-family:Light, arial, sans-serif !important}
body :is(h1,h2,h3){font-weight:400 !important;letter-spacing:-.01em}
:is(.login-header,.dashboard-header,header){border-bottom:1px solid rgba(212,166,87,.35)}
:is(button,.btn)[type=submit],.btn-primary,.btn-login,.login-btn{background:linear-gradient(135deg,#E2BD78 0%,#C9974A 55%,#B8893E 100%) !important;color:#083A57 !important;border:0 !important;border-radius:999px !important;box-shadow:0 10px 24px -10px rgba(212,166,87,.7) !important}
input:focus,select:focus,textarea:focus{border-color:#B8893E !important;box-shadow:0 0 0 3px rgba(212,166,87,.2) !important}
::selection{background:#D4A657;color:#083A57}

/* ---------- Choix de l'espace : Omra / Hajj ---------- */
.espace-choix{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px;margin:0 0 20px;border-radius:16px;background:#EFE6D4;border:1px solid #E3D9C5}
.espace-onglet{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid transparent;border-radius:12px;background:transparent;color:#24343F;cursor:pointer;text-align:left;transition:background .2s,color .2s,box-shadow .2s}
.espace-onglet i{display:inline-grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:rgba(7,51,80,.08);color:#073350;font-size:15px;transition:inherit}
.espace-onglet span{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.espace-onglet strong{font-size:15px;font-weight:500;color:inherit}
.espace-onglet small{font-size:12px;opacity:.8}
.espace-onglet:hover{color:#073350}
.espace-onglet.actif{background:#073350;color:#fff;border-color:rgba(212,166,87,.5);box-shadow:0 10px 22px -12px rgba(6,43,64,.7)}
.espace-onglet.actif i{background:rgba(212,166,87,.18);color:#D4A657;border:1px solid #D4A657}
.espace-onglet.actif small{color:#E7C98F;opacity:1}
.espace-onglet:focus-visible{outline:2px solid #D4A657;outline-offset:2px}
.espace-panneau[hidden]{display:none!important}
.espace-intro{margin:0 0 18px;font-size:14px;line-height:1.55;color:#24343F}
.espace-liens{display:flex;flex-direction:column;gap:10px;margin-top:18px;padding-top:16px;border-top:1px dashed #E3D9C5;font-size:14px}
.espace-liens a{display:flex;align-items:center;gap:8px;color:#073350;text-decoration:none}
.espace-liens a i{width:18px;text-align:center;color:#B8893E}
.espace-liens a:hover{color:#B8893E}
@media (max-width:480px){
  .espace-onglet{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:10px 6px}
  .espace-onglet span{align-items:center}
  .espace-onglet strong{font-size:14px}
}

/* ---------- Logo Tawaf dans l'en-tête de l'Espace Pèlerin ---------- */
.header-brand{display:flex;align-items:center;gap:18px}
.header-logo-tawaf{display:flex;align-items:center;flex:none;padding-right:18px;border-right:1px solid rgba(212,166,87,.45);line-height:0}
.header-logo-tawaf img{display:block;height:46px;width:auto;max-width:170px}
.header-brand .header-title h1{margin:0;font-size:22px;color:#fff}
.header-brand .header-subtitle{color:#E7C98F !important;font-size:12px;text-transform:uppercase;letter-spacing:.14em}
@media (max-width:600px){
  .header-brand{gap:12px}
  .header-logo-tawaf{padding-right:12px}
  .header-logo-tawaf img{height:36px}
  .header-brand .header-title h1{font-size:18px}
  .header-brand .header-subtitle{font-size:10.5px}
}

/* ---------- Espace pèlerin Omra (tableau de bord) : direction artistique navy / or / crème ---------- */
body{background:#F3EDE2 !important}
:is(.dashboard-header,.login-header) .header-top{background:#062B40 !important;color:#E7C98F !important;border-bottom:1px solid rgba(212,166,87,.25)}
:is(.dashboard-header,.login-header) .header-top a{color:#fff !important}
:is(.dashboard-header,.login-header) .header-top i{color:#D4A657 !important}
:is(.dashboard-header,.login-header) .header-main{background:#073350 !important;box-shadow:0 1px 0 rgba(212,166,87,.45),0 10px 30px -18px rgba(0,0,0,.6) !important}
.dashboard-header .header-user .user-name{color:#fff !important}
.dashboard-header .header-user .user-code{color:#E7C98F !important;letter-spacing:.08em}
.dashboard-header .btn-logout{background:transparent !important;border:1px solid rgba(212,166,87,.6) !important;color:#E7C98F !important;border-radius:999px !important;box-shadow:none !important}
.dashboard-header .btn-logout:hover{background:#D4A657 !important;color:#073350 !important}
.card,.info-card,.login-card{background:#fff !important;border:1px solid #E3D9C5 !important;border-radius:18px !important;box-shadow:0 14px 34px -24px rgba(6,43,64,.45) !important}
.card-header{background:#FBF8F2 !important;border-bottom:1px solid #EFE7D7 !important;color:#073350 !important;border-radius:18px 18px 0 0 !important}
.card-header :is(h2,h3,h4,h5,span,i){color:#073350 !important}
.card-header i,.info-card i,.sejour-info-icon,.sejour-info-icon i,.step-icon i{color:#B8893E !important}
.sejour-info-icon,.step-icon{background:#F7F2E8 !important;border:1px solid #E3D9C5 !important}
.step-item.active .step-icon,.step-item.completed .step-icon,.step-item.done .step-icon{background:#073350 !important;border-color:#D4A657 !important}
.step-item.active .step-icon i,.step-item.completed .step-icon i,.step-item.done .step-icon i{color:#D4A657 !important}
.info-label,.sejour-info-label,.vol-detail-label,.payment-label,.rib-label,.stat-label{color:#2E3F4B !important;text-transform:uppercase;letter-spacing:.06em;font-size:11.5px !important}
.info-value,.sejour-info-value,.vol-detail-value,.payment-value,.rib-value{color:#073350 !important}
.stat-value{color:#B8893E !important}
.vol-city-code{color:#073350 !important;font-weight:600 !important}
.vol-city-name{color:#24343F !important}
.nav-tabs,.nav-pills{border-color:#E3D9C5 !important}
:is(.nav-tabs,.nav-pills) .nav-link{color:#24343F !important;border-radius:999px !important;border:1px solid transparent !important}
:is(.nav-tabs,.nav-pills) .nav-link:hover{color:#073350 !important;border-color:#E3D9C5 !important}
:is(.nav-tabs,.nav-pills) .nav-link.active{background:#073350 !important;color:#fff !important;border-color:#073350 !important}
:is(.nav-tabs,.nav-pills) .nav-link.active i{color:#D4A657 !important}
.btn-secondary,.btn-outline-primary,.btn-outline-secondary,.btn-light{background:transparent !important;color:#073350 !important;border:1px solid #073350 !important;border-radius:999px !important}
.btn-secondary:hover,.btn-outline-primary:hover,.btn-outline-secondary:hover,.btn-light:hover{color:#B8893E !important;border-color:#B8893E !important}
.btn-success{background:#2E7D32 !important;border-color:#2E7D32 !important;border-radius:999px !important}
.status-badge{border-radius:999px !important;font-weight:600 !important;letter-spacing:.03em}
.alert-info{background:#FBF8F2 !important;border-color:#E3D9C5 !important;color:#073350 !important}
.alert-info i{color:#B8893E !important}
.mobile-menu{background:#073350 !important}
.mobile-menu-link{color:#fff !important}
.mobile-menu-link.active,.mobile-menu-link:hover{color:#D4A657 !important}
.mobile-menu-link i{color:#D4A657 !important}
.login-footer,.dashboard-footer,footer.footer{background:#062B40 !important;color:rgba(255,255,255,.92) !important;border-top:1px solid rgba(212,166,87,.3)}
:is(.login-footer,.dashboard-footer,footer.footer) a{color:#E7C98F !important}
table thead th{background:#073350 !important;color:#fff !important}