/* CHIFORI — Client auth pages (connexion.html / profil.html) only.
   Scoped under .client-auth-page so it never touches landing/partner styles.
   Reuses design tokens from css/style.css (:root) which is loaded first. */

.client-auth-page{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(circle at 88% 8%,rgba(255,122,26,.14),transparent 34%),linear-gradient(180deg,#FFFFFF,#F2F6FC 62%,#EAF0FA)}

.client-auth-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 22px 0;max-width:1220px;margin:0 auto;width:100%}
.client-auth-brand{display:flex;align-items:center;gap:10px;font-weight:950;color:var(--blue);font-size:22px}
.client-auth-brand svg{width:36px;height:36px;flex:none}

.client-auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 18px 48px}

.client-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line);padding:38px 34px;max-width:440px;width:100%}
.client-card.client-card-wide{max-width:640px}

.historique-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.historique-row{display:flex;flex-direction:column;gap:6px;background:#F8FAFE;border:1px solid var(--line);border-radius:16px;padding:14px 16px;transition:border-color .15s ease,transform .15s ease}
.historique-row:hover{border-color:var(--blue);transform:translateY(-1px)}
.historique-row-main{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--navy);font-weight:800}
.historique-row-main strong{font-weight:900}
.historique-row-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted)}
.client-card h1{font-size:26px;color:var(--navy);margin-bottom:10px;line-height:1.2;font-weight:900}
.client-card>p.intro{color:var(--muted);font-size:15px;margin-bottom:18px}
.client-card .safe-strip{display:flex;width:100%;margin-bottom:22px;text-align:left}

.client-card form{display:flex;flex-direction:column;gap:16px;margin-bottom:8px}
.client-card>a.btn{margin-top:6px}
.client-card .field label{font-weight:850;font-size:13.5px;color:var(--navy);margin-bottom:6px;display:block}
.client-card .field input,.client-card .field select{width:100%;padding:13px 14px;border-radius:14px;border:1.5px solid var(--line);background:#F8FAFE;font-size:15px;color:var(--text);font-family:inherit}
.client-card .field input:focus,.client-card .field select:focus{outline:none;border-color:var(--blue);background:#fff}

.statut-list{display:flex;flex-direction:column;gap:14px;margin-bottom:8px}
.statut-list .row dt{font-weight:850;font-size:13px;color:var(--muted);margin-bottom:3px;text-transform:uppercase;letter-spacing:.03em}
.statut-list .row dd{font-size:15.5px;color:var(--navy);font-weight:700}
.statut-list .row dd.tag{margin-top:2px}

.client-auth-footer{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);text-align:center}
.client-auth-footer .btn{width:100%}

.depart-choice{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.choice-btn{flex:1;min-width:150px;padding:9px 12px;border-radius:12px;border:1.5px solid var(--line);background:#F8FAFE;color:var(--navy);font-weight:800;font-size:12.5px;cursor:pointer;text-align:center;font-family:inherit}
.choice-btn.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.geoloc-msg{font-size:12.5px;border-radius:10px;padding:0;max-height:0;overflow:hidden;transition:padding .15s ease}
.geoloc-msg.show{padding:8px 10px;max-height:80px;margin-top:2px}
.geoloc-msg.loading{background:#EEF3FC;color:var(--blue)}
.geoloc-msg.ok{background:#EAFBF3;color:#0E8B54}
.geoloc-msg.error{background:#FDEBEA;color:#C13A2E}
.client-auth-footer .back{font-weight:850;color:var(--blue);font-size:14.5px}
.client-auth-footer .legal-links{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.client-auth-footer .legal-links a{font-size:12.5px;color:var(--muted);text-decoration:underline}
.client-auth-footer .legal-links a:hover{color:var(--navy)}

@media (max-width:520px){
  .client-card{padding:28px 22px;border-radius:var(--radius-sm)}
  .client-card h1{font-size:22px}
  .client-auth-topbar{padding:16px 16px 0}
  .client-auth-main{padding:22px 12px 34px}
  .depart-choice{flex-direction:column}
  .choice-btn{min-width:0}
}

/* Arabic RTL: card content mirrors naturally via html[dir="rtl"] set by
   js/i18n-partner.js; only the topbar (logo left / lang selector right)
   needs an explicit flip to keep the logo on the reading-start side. */
html[dir="rtl"] .client-auth-topbar{flex-direction:row-reverse}