/* AFRIGON V396 — Premium UX/UI layer
   Visual-only layer: preserves V393/V395 business logic. */
:root{
  --af-navy:#062B4F;
  --af-navy-2:#0B4777;
  --af-blue:#0B78B5;
  --af-cyan:#19A7D8;
  --af-gold:#D9A62E;
  --af-gold-soft:#FFF5D8;
  --af-bg:#F4F7FB;
  --af-surface:#FFFFFF;
  --af-text:#102235;
  --af-muted:#526779;
  --af-line:#DCE6EF;
  --af-success:#087443;
  --af-danger:#B42318;
  --af-warning:#8A5A00;
  --af-shadow:0 10px 30px rgba(6,43,79,.08);
  --af-shadow-lg:0 20px 55px rgba(6,43,79,.13);
}
html{background:#F4F7FB}
body{background:radial-gradient(900px 420px at 50% -80px,rgba(25,167,216,.10),transparent 65%),linear-gradient(180deg,#FBFCFE 0,#F4F7FB 100%);color:var(--af-text)}
#app{max-width:1180px!important;margin:0 auto!important;background:transparent}
/* Header */
.topbar,.afr-topbar{min-height:70px!important;padding:11px 22px!important;background:rgba(255,255,255,.94)!important;border-bottom:1px solid #DCE6EF!important;box-shadow:0 8px 28px rgba(6,43,79,.07)!important;backdrop-filter:blur(18px)}
.brand-mark{width:44px!important;height:44px!important;border-radius:13px!important;border:1px solid #E0E8EF;box-shadow:0 8px 20px rgba(6,43,79,.12)!important}
.brand-text .name{font-size:15px!important;font-weight:900!important;color:var(--af-navy)!important}
.brand-text .tag{font-size:9px!important;color:#668094!important;font-weight:700}
.desktop-nav{gap:5px!important}
.dn-item{font-size:11px!important;min-height:42px!important;padding:8px 12px!important;border-radius:12px!important;color:#496175!important}
.dn-item.sel{background:var(--af-navy)!important;color:#fff!important;border-bottom-color:transparent!important;box-shadow:0 7px 17px rgba(6,43,79,.18)}
.desktop-contact-btn{border-radius:12px!important;background:linear-gradient(135deg,var(--af-navy),var(--af-navy-2))!important;color:#fff!important;box-shadow:0 7px 18px rgba(6,43,79,.16)}
/* Hero */
.hero-v2,.afr-hero{border-radius:0 0 34px 34px!important;box-shadow:0 16px 40px rgba(6,43,79,.12);min-height:500px!important}
.hero-bg-fade{background:linear-gradient(180deg,rgba(4,21,36,.12),rgba(6,43,79,.48) 48%,rgba(3,21,37,.91) 100%)!important}
.hero-content{max-width:1180px!important;padding:42px 28px 34px!important}
.hero-v2 h1{font-size:clamp(30px,5vw,54px)!important;line-height:1.05!important;letter-spacing:-.045em!important;max-width:18ch!important;text-wrap:balance}
.hero-v2 p{font-size:15px!important;max-width:58ch!important;line-height:1.7!important}
.hero-cta-row{max-width:620px;margin-top:22px}
.hero-cta-row .btn{min-height:50px!important;border-radius:14px!important;font-size:13px!important}
.btn-gold{background:linear-gradient(135deg,#F0C44E,#D19B20)!important;border-color:#C38C16!important;box-shadow:0 12px 28px rgba(217,166,46,.28)!important}
/* Global sections */
.section{max-width:1180px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.section-head{max-width:760px;margin-left:auto;margin-right:auto;text-align:center}
.section h2{font-size:clamp(26px,4vw,40px)!important;line-height:1.08!important}
.eyebrow{font-size:11px!important;letter-spacing:.16em!important}
.card,.benef-card,.offer-card,.af-offer-card,.af-client-dossier-card,.af-client-request,.af-lost-card,.admin-panel,.contact-card,.contact-form-card{border-radius:20px!important;box-shadow:var(--af-shadow)!important;border-color:var(--af-line)!important}
.card:hover,.benef-card:hover,.af-client-dossier-card:hover,.af-offer-card:hover{box-shadow:var(--af-shadow-lg)!important;transform:translateY(-3px)}
/* Client */
.af-client-dashboard,.af-account-page{max-width:1180px!important;margin:0 auto!important;padding:28px 24px 100px!important}
.af-account-hero{border-radius:24px!important;padding:28px!important;background:linear-gradient(135deg,#062B4F 0%,#0B4777 58%,#0B78B5 100%)!important;box-shadow:0 18px 45px rgba(6,43,79,.18)!important}
.af-client-metrics{gap:16px!important}
.af-client-metric{border-radius:18px!important;min-height:112px!important;padding:18px!important;box-shadow:0 8px 24px rgba(6,43,79,.07)!important}
.af-client-metric:hover{transform:translateY(-3px);border-color:#B9CDDC!important}
.af-client-dashboard .tabs,.af-account-page .tabs{gap:10px!important;margin:20px 0!important}
.af-client-dashboard .tab,.af-account-page .tab{min-height:48px!important;border-radius:13px!important;font-weight:850!important}
.af-client-dashboard .tab.active,.af-account-page .tab.active{background:linear-gradient(135deg,#062B4F,#0B4777)!important;box-shadow:0 9px 20px rgba(6,43,79,.18)!important}
.af-lost-card{position:relative;overflow:hidden;border-color:#E7C46C!important;background:linear-gradient(135deg,#FFFDF8,#FFF6DA)!important}
.af-lost-card::after{content:"";position:absolute;width:160px;height:160px;right:-70px;top:-70px;border-radius:50%;background:rgba(217,166,46,.13)}
/* Tracking */
.tracking-history{border-radius:20px!important;box-shadow:var(--af-shadow)!important;padding:22px!important}
.history-row{padding:14px 10px!important;border-radius:14px!important}
.history-row.current{background:#EEF7FC!important;box-shadow:inset 3px 0 0 var(--af-blue)}
/* Admin */
.af-sidebar{box-shadow:10px 0 32px rgba(6,43,79,.12)!important}
.admin-headbar{min-height:70px!important}
.admin-kpi{border-radius:18px!important;box-shadow:var(--af-shadow)!important;padding:18px!important}
.admin-kpi:hover{transform:translateY(-3px);box-shadow:var(--af-shadow-lg)!important}
.admin-panel{border-radius:20px!important}
.admin-nav-btn{min-height:44px!important;border-radius:12px!important}
/* Prestataire / scanner */
.scanner-card,.scan-card,.prestataire-card,.af-scanner-card{border-radius:22px!important;box-shadow:0 14px 38px rgba(6,43,79,.10)!important;border:1px solid var(--af-line)!important;background:#fff!important}
.scan-card .btn,.scanner-card .btn,.af-scanner-card .btn{min-height:52px!important;border-radius:14px!important;font-weight:900!important}
/* Inputs */
input,select,textarea{min-height:48px!important;border-radius:13px!important;border-color:#C9D8E4!important;box-shadow:0 2px 7px rgba(6,43,79,.025)!important}
input:focus,select:focus,textarea:focus{border-color:#0B78B5!important;box-shadow:0 0 0 4px rgba(11,120,181,.12)!important}
/* Buttons */
button,.btn{transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease!important}
button:hover,.btn:hover{transform:translateY(-2px)}
button:active,.btn:active{transform:translateY(0)}
/* Status */
.status-badge,.badge,.afr-badge,.af-status-pill{font-size:11px!important;padding:6px 10px!important;border-radius:999px!important;letter-spacing:.01em}
/* Footer */
.site-footer{margin-top:0!important;padding-top:54px!important;padding-bottom:32px!important}
/* Mobile */
@media(max-width:900px){
  #app{max-width:100%!important}
  .hero-content{padding:32px 18px 28px!important}
  .hero-v2{min-height:470px!important;border-radius:0 0 24px 24px!important}
  .section{padding-left:18px;padding-right:18px}
  .af-client-dashboard,.af-account-page{padding-left:14px!important;padding-right:14px!important}
}
@media(max-width:600px){
  .topbar,.afr-topbar{padding:9px 14px!important}
  .brand-mark{width:40px!important;height:40px!important}
  .hero-v2 h1{font-size:34px!important}
  .hero-content{padding-top:26px!important}
  .hero-cta-row{gap:9px}
  .hero-cta-row .btn{min-height:48px!important}
  .section{padding-top:42px;padding-bottom:42px}
  .af-account-hero{padding:21px!important;border-radius:19px!important}
}
@media(max-width:430px){
  .hero-v2 h1{font-size:30px!important}
  .hero-v2 p{font-size:13px!important}
  .section h2{font-size:27px!important}
}
@media(prefers-reduced-motion:reduce){button,.btn,.card{transition:none!important}}

/* V398 — Hero navigation contrast fix: tabs remain visible over the hero image */
.hero-nav-overlay{
  background:linear-gradient(180deg,rgba(4,18,31,.94) 0%,rgba(4,18,31,.70) 72%,rgba(4,18,31,.35) 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.16)!important;
  backdrop-filter:blur(10px)!important;
}
.hero-nav-overlay .brand-text .name{color:#fff!important;text-shadow:0 1px 4px rgba(0,0,0,.45)!important}
.hero-nav-overlay .brand-text .tag{color:rgba(255,255,255,.82)!important}
.hero-nav-overlay .desktop-nav{border-top-color:rgba(255,255,255,.18)!important}
.hero-nav-overlay .dn-item{
  color:#fff!important;
  text-shadow:0 1px 4px rgba(0,0,0,.55)!important;
  background:rgba(255,255,255,.07)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-bottom:2px solid transparent!important;
  border-radius:12px!important;
  min-height:42px!important;
  padding:8px 12px!important;
  font-weight:800!important;
}
.hero-nav-overlay .dn-item:hover,
.hero-nav-overlay .dn-item:focus-visible{
  color:#fff!important;
  background:rgba(255,255,255,.16)!important;
  border-color:rgba(255,255,255,.28)!important;
  outline:none!important;
}
.hero-nav-overlay .dn-item.sel{
  color:#111f2d!important;
  background:linear-gradient(135deg,#F2C44E,#D9A62E)!important;
  border-color:#F5D477!important;
  border-bottom-color:#B9860E!important;
  text-shadow:none!important;
  box-shadow:0 7px 18px rgba(0,0,0,.20)!important;
}
.hero-nav-overlay .dn-item svg{stroke:currentColor!important}
@media(max-width:760px){
  .hero-nav-overlay{padding:12px 12px 10px!important}
  .hero-nav-overlay .desktop-nav{gap:7px!important;padding-top:10px!important;margin-top:9px!important}
  .hero-nav-overlay .dn-item{min-width:74px!important;min-height:44px!important;padding:7px 9px!important;font-size:10px!important}
}
@media(min-width:900px){
  .hero-nav-overlay .desktop-nav{gap:9px!important}
  .hero-nav-overlay .dn-item{min-height:44px!important;padding:8px 13px!important}
}


/* V401 — nouvelle navigation des dossiers */
.dossier-navigation-panel{padding:22px !important;background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);border:1px solid #dce6f0;box-shadow:0 14px 34px rgba(16,45,76,.07);}
.dossier-nav-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px;}
.dossier-nav-eyebrow{font-size:10px;letter-spacing:.14em;font-weight:900;color:#b98613;margin-bottom:5px;}
.dossier-nav-head h2{margin:0;color:#0b2540;font:800 20px/1.15 "Space Grotesk",sans-serif;}
.dossier-nav-head p{margin:6px 0 0;color:#718096;font-size:12.5px;}
.dossier-reset{border:1px solid #d5e0eb;background:#fff;color:#173653;border-radius:10px;padding:9px 13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.dossier-reset:hover{border-color:#b98613;background:#fffaf0;}
.dossier-view-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:18px;}
.dossier-view-card{min-height:82px;border:1px solid #dce5ee;background:#fff;border-radius:14px;padding:12px;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;text-align:left;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;color:#16324c;}
.dossier-view-card:hover{transform:translateY(-1px);border-color:#b8c9d9;box-shadow:0 8px 20px rgba(16,45,76,.08);}
.dossier-view-card.selected{background:linear-gradient(135deg,#0b2540,#153e61);border-color:#0b2540;box-shadow:0 10px 24px rgba(11,37,64,.18);color:#fff;}
.dossier-view-card.archive-card{background:#fffaf0;border-color:#ead9a7;}
.dossier-view-card.archive-card:hover{border-color:#d6b75b;}
.dossier-view-icon{width:38px;height:38px;border-radius:11px;background:#eef4fa;display:flex;align-items:center;justify-content:center;font-size:19px;}
.dossier-view-card.selected .dossier-view-icon{background:rgba(255,255,255,.14);}
.dossier-view-card.archive-card .dossier-view-icon{background:#fff0c7;}
.dossier-view-copy{display:flex;flex-direction:column;gap:3px;min-width:0;}
.dossier-view-copy b{font-size:13px;line-height:1.1;}
.dossier-view-copy small{font-size:10.5px;color:#7b8b9c;line-height:1.25;}
.dossier-view-card.selected .dossier-view-copy small{color:#cbd8e5;}
.dossier-view-card strong{font:800 20px/1 "Space Grotesk",sans-serif;color:#0b2540;}
.dossier-view-card.selected strong{color:#f2c14e;}
@media(max-width:900px){.dossier-view-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.dossier-view-card:last-child{grid-column:span 2;}}
@media(max-width:560px){.dossier-navigation-panel{padding:15px !important;border-radius:16px;}.dossier-nav-head{align-items:stretch;flex-direction:column;}.dossier-reset{align-self:flex-start;}.dossier-view-grid{grid-template-columns:1fr;}.dossier-view-card:last-child{grid-column:auto;}.dossier-view-card{min-height:74px;}.dossier-view-copy small{font-size:10px;}}

/* V410 — lisibilité navigation et scanner colis */
.admin-topbar .admin-nav-btn{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.45);font-weight:700;border:1px solid rgba(255,255,255,.12)!important;background:rgba(7,22,42,.78)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.admin-topbar .admin-nav-btn:hover{background:rgba(19,52,86,.92)!important;color:#fff!important}
.admin-topbar .admin-nav-btn.active{background:#fff!important;color:#0b2945!important;text-shadow:none;border-color:#fff!important;box-shadow:0 5px 18px rgba(0,0,0,.18)}
.admin-topbar .admin-nav-btn.active .nav-ico{color:#0b2945!important}
.admin-sidebar-nav{background:linear-gradient(180deg,rgba(4,18,34,.94),rgba(6,29,52,.96));border-radius:16px;padding:8px;box-shadow:0 12px 32px rgba(0,0,0,.22)}
.admin-nav-group{color:#dce9f5!important;font-weight:800;letter-spacing:.03em}
.af-admin-page-head{position:relative;overflow:hidden;border-radius:18px;padding:18px 20px;margin-bottom:14px;background:linear-gradient(135deg,#08233d,#123e62);color:#fff;box-shadow:0 12px 28px rgba(7,31,55,.18)}
.af-admin-page-head h1,.af-admin-page-head p{position:relative;z-index:1}.af-admin-page-head h1{color:#fff!important}.af-admin-page-head p{color:#e4eef7!important}
.qr-scan-box{border-radius:18px!important;overflow:hidden;border:1px solid #cbd9e6!important;background:#071b2e!important;box-shadow:0 14px 30px rgba(4,25,45,.2)}
.qr-scan-video{background:#020a12;min-height:260px}


/* V411 — contrôle final couleurs / contraste / lisibilité */
:root{
  --af-navy-950:#071a2d;
  --af-navy-900:#0b2945;
  --af-navy-800:#123e62;
  --af-gold:#d9a62e;
  --af-gold-light:#f2c44e;
  --af-text:#183042;
  --af-muted:#5f7183;
  --af-line:#d8e2ec;
}
/* Navigation principale : contraste constant sur image/fond */
.admin-topbar .admin-nav-btn,.admin-topbar .admin-nav-btn:visited{
  color:#fff!important;background:rgba(7,26,45,.94)!important;
  border-color:rgba(255,255,255,.18)!important;
  text-shadow:0 1px 2px rgba(0,0,0,.55)!important;
}
.admin-topbar .admin-nav-btn:hover,.admin-topbar .admin-nav-btn:focus-visible{
  color:#fff!important;background:#123e62!important;border-color:#f2c44e!important;
  outline:3px solid rgba(242,196,78,.25)!important;outline-offset:1px;
}
.admin-topbar .admin-nav-btn.active{
  color:#071a2d!important;background:#f2c44e!important;border-color:#f7d77f!important;
  text-shadow:none!important;box-shadow:0 6px 18px rgba(7,26,45,.24)!important;
}
.admin-topbar .admin-nav-btn.active .nav-ico{color:#071a2d!important}
/* Sidebar */
.admin-sidebar-nav .admin-nav-btn{color:#f5f9fc!important;background:transparent!important}
.admin-sidebar-nav .admin-nav-btn:hover,.admin-sidebar-nav .admin-nav-btn:focus-visible{background:rgba(255,255,255,.12)!important;color:#fff!important}
.admin-sidebar-nav .admin-nav-btn.active{background:#f2c44e!important;color:#071a2d!important}
/* Boutons */
.btn-primary{background:#0b5ea8!important;color:#fff!important;border-color:#0b5ea8!important}
.btn-primary:hover,.btn-primary:focus-visible{background:#084b86!important;color:#fff!important}
.btn-gold{background:#d9a62e!important;color:#071a2d!important;border-color:#c49320!important;font-weight:800}
.btn-gold:hover,.btn-gold:focus-visible{background:#f2c44e!important;color:#071a2d!important}
/* Scanner */
.qr-scan-box{background:#071a2d!important;border-color:#8ea7bd!important}
.qr-scan-box .btn,.qr-scan-box button{font-weight:800}
.af-admin-page-head{background:linear-gradient(135deg,#071a2d 0%,#123e62 100%)!important}
/* États */
.af-status-success{background:#e8f7ef!important;color:#116b43!important;border-color:#9bd5b8!important}
.af-status-warning{background:#fff6df!important;color:#8a5a00!important;border-color:#ead08a!important}
.af-status-danger{background:#fff0f0!important;color:#a32222!important;border-color:#e4a5a5!important}
/* Formulaires */
input,select,textarea{color:#183042}
input::placeholder,textarea::placeholder{color:#718296;opacity:1}
input:focus,select:focus,textarea:focus{border-color:#2d79b1!important;box-shadow:0 0 0 3px rgba(45,121,177,.16)!important;outline:none}
/* Accessibilité */
:focus-visible{outline:3px solid rgba(45,121,177,.42);outline-offset:2px}
@media(max-width:760px){
 .admin-topbar .admin-nav-btn{min-height:44px!important;padding:9px 11px!important}
 .admin-sidebar-nav .admin-nav-btn{min-height:44px!important}
}

/* V412 anti-double-clic */
.af-submit-loading{position:relative;transition:opacity .15s ease,transform .15s ease}.af-submit-loading:disabled{opacity:.72;cursor:wait;transform:none}.af-spinner{display:inline-block;width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:afSpin .7s linear infinite;margin-right:5px}@keyframes afSpin{to{transform:rotate(360deg)}}