/* =========================================================
   Arthurimmo.com – Parrainage
   Compléments applicatifs (pages dynamiques, espace parrain,
   espace agence, back-office, bandeau cookies, pages légales)
   S'appuie sur les variables définies dans site.css
   ========================================================= */

/* Sans JS, ne jamais masquer le contenu animé */
html:not(.js) .reveal,
html:not(.js) .stagger-item{opacity:1 !important; transform:none !important;}

.skip-link{
  position:absolute; left:16px; top:-60px; z-index:1000;
  background:var(--anthracite-deep); color:#fff; padding:10px 18px; border-radius:10px;
  font-weight:700; text-decoration:none; transition:top .15s ease;
}
.skip-link:focus{top:12px;}

.hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden;}

/* ---------- Messages ---------- */
.flash-stack{max-width:var(--maxw); margin:22px auto 0; padding:0 32px;}
.flash{
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 18px; border-radius:12px; margin-bottom:10px;
  font-size:15px; line-height:1.45; border:1px solid transparent;
}
.flash strong{font-weight:700;}
.flash-success{background:#e9f7ee; border-color:#bfe6cc; color:#1c5a34;}
.flash-error{background:#fdeceb; border-color:#f4c4c0; color:#8a2119;}
.flash-info{background:var(--orange-tint); border-color:#f6d9ac; color:#7a4a00;}
.field-error{color:#b3261e; font-size:13px; margin-top:6px; font-weight:600;}
.field input.invalid, .field select.invalid, .field textarea.invalid{border-color:#d93c31;}

/* ---------- Pages internes ---------- */
.app-main{padding:48px 0 96px; background:var(--paper);}
.app-main.tint{background:var(--stone);}
.app-grid{display:grid; grid-template-columns:minmax(0,340px) minmax(0,1fr); gap:28px; align-items:start;}
.card{
  background:#fff; border:1px solid var(--stone-line); border-radius:var(--radius-card);
  padding:28px 30px; box-shadow:0 18px 40px -30px rgba(32,38,42,.35);
}
.card + .card{margin-top:22px;}
.card h2{font-size:26px; font-weight:700; margin-bottom:6px;}
.card h3{font-size:20px; font-weight:700; margin-bottom:6px;}
.card .sub{color:var(--ink-soft); font-size:15px; margin:0 0 22px;}
.card-head{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px;}
.card-head h2{margin:0;}
.stack > * + *{margin-top:16px;}
.kv{display:grid; grid-template-columns:150px 1fr; gap:8px 16px; font-size:15px; margin:0;}
.kv dt{color:var(--ink-soft); font-weight:600;}
.kv dd{margin:0; color:var(--ink); word-break:break-word;}
.kv a{color:var(--orange-deep); font-weight:600;}
.section-title{font-family:'Barlow Condensed',sans-serif; font-size:22px; font-weight:700; margin:0 0 12px;}

/* Boutons complémentaires */
.btn-sm{padding:8px 16px; font-size:13.5px;}
.btn-dark{background:var(--anthracite); color:#fff;}
.btn-dark:hover{background:var(--anthracite-deep);}
.btn-danger{background:#fff; color:#b3261e; border-color:#efc3bf;}
.btn-danger:hover{background:#fdeceb; border-color:#d93c31;}
.btn-success{background:#1f8a4c; color:#fff;}
.btn-success:hover{background:#186f3d;}
.btn-line{background:#fff; color:var(--ink); border-color:var(--stone-line);}
.btn-line:hover{border-color:var(--ink);}
.btn[disabled]{opacity:.5; pointer-events:none;}
.actions{display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.link-danger{color:#b3261e; font-weight:600; background:none; border:0; padding:0; cursor:pointer; font:inherit; text-decoration:underline;}

/* Champs supplémentaires */
.field-row-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.field .req{color:var(--orange-deep);}
.field input[readonly]{background:var(--stone); color:var(--ink-soft);}
.field-inline{display:flex; gap:10px; align-items:center;}
.field-inline select{width:auto; min-width:0;}
.form-note{font-size:13px; color:var(--ink-soft);}
.pw-meter{height:4px; border-radius:2px; background:var(--stone-line); margin-top:8px; overflow:hidden;}
.pw-meter span{display:block; height:100%; width:0; background:#d93c31; transition:width .2s ease, background .2s ease;}
.pw-meter[data-level="2"] span{background:#e6a100;}
.pw-meter[data-level="3"] span{background:#1f8a4c;}

/* ---------- Badges ---------- */
.badge-s{display:inline-flex; align-items:center; gap:6px; padding:4px 12px; border-radius:999px; font-size:12.5px; font-weight:700; white-space:nowrap;}
.badge-s::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor;}
.st-1{background:#fdeceb; color:#a4362c;}
.st-2{background:#fff5d6; color:#8a6300;}
.st-3{background:#e2f5e9; color:#1c6b3d;}
.va-0{background:#eef0f2; color:#4a545c;}
.va-1{background:#e2f5e9; color:#1c6b3d;}
.va-2{background:#fdeceb; color:#a4362c;}

/* ---------- Tableaux ---------- */
.table-wrap{overflow-x:auto; border:1px solid var(--stone-line); border-radius:14px; background:#fff;}
table.data{width:100%; border-collapse:collapse; font-size:14.5px;}
table.data th{
  text-align:left; padding:12px 16px; background:var(--stone); color:var(--ink-soft);
  font-size:12.5px; font-weight:700; border-bottom:1px solid var(--stone-line); white-space:nowrap;
}
table.data td{padding:14px 16px; border-bottom:1px solid var(--stone-line); vertical-align:top;}
table.data tr:last-child td{border-bottom:0;}
table.data tbody tr:hover{background:#fcfbf9;}
table.data .num{text-align:right; white-space:nowrap;}
table.data .muted{color:var(--ink-soft); font-size:13px;}
table.data td form{margin:0;}
table.data .stack-sm > * + *{margin-top:4px;}
.empty{padding:44px 20px; text-align:center; color:var(--ink-soft);}
.empty strong{display:block; color:var(--ink); font-size:17px; margin-bottom:6px;}

.filters{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin-bottom:18px;}
.filters .field{margin:0; min-width:150px;}
.filters .field input, .filters .field select{padding:10px 12px; font-size:14px;}

.pagination{display:flex; gap:6px; flex-wrap:wrap; margin-top:18px; align-items:center;}
.pagination a, .pagination span{
  min-width:38px; height:38px; padding:0 12px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; border:1px solid var(--stone-line); background:#fff; font-weight:600; font-size:14px; text-decoration:none; color:var(--ink);
}
.pagination .current{background:var(--anthracite); color:#fff; border-color:var(--anthracite);}
.pagination a:hover{border-color:var(--ink);}

/* ---------- Suivi / chronologie ---------- */
.timeline{list-style:none; margin:0; padding:0; position:relative;}
.timeline::before{content:""; position:absolute; left:8px; top:8px; bottom:8px; width:2px; background:var(--stone-line);}
.timeline li{position:relative; padding:0 0 22px 34px;}
.timeline li::before{
  content:""; position:absolute; left:0; top:4px; width:18px; height:18px; border-radius:50%;
  background:#fff; border:3px solid var(--orange);
}
.timeline time{display:block; font-size:12.5px; font-weight:700; color:var(--ink-soft); margin-bottom:4px;}
.timeline p{margin:0; white-space:pre-line;}
.timeline .doc{display:inline-flex; align-items:center; gap:8px; margin-top:8px; font-weight:700; color:var(--orange-deep); text-decoration:none;}
.timeline .doc:hover{text-decoration:underline;}
.timeline .tl-actions{margin-top:8px; display:flex; gap:12px; font-size:13px;}

.progress-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin:6px 0 26px; counter-reset:ps;}
.progress-steps li{list-style:none; position:relative; text-align:center; font-size:13px; font-weight:700; color:var(--ink-soft); padding-top:34px;}
.progress-steps li::before{
  counter-increment:ps; content:counter(ps);
  position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:26px; height:26px; border-radius:50%; background:var(--stone-line); color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center; font-size:13px; z-index:1;
}
.progress-steps li::after{content:""; position:absolute; top:12px; left:calc(50% + 16px); right:calc(-50% + 16px); height:2px; background:var(--stone-line);}
.progress-steps li:last-child::after{display:none;}
.progress-steps li.done{color:var(--ink);}
.progress-steps li.done::before{background:var(--orange); color:#fff;}
.progress-steps li.done::after{background:var(--orange);}
.progress-steps { padding:0; }

/* ---------- KPI ---------- */
.kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; margin-bottom:26px;}
.kpi{background:#fff; border:1px solid var(--stone-line); border-radius:14px; padding:18px 20px; text-decoration:none; color:inherit; display:block;}
a.kpi:hover{border-color:var(--orange);}
.kpi .n{font-family:'Barlow Condensed',sans-serif; font-size:40px; font-weight:700; line-height:1; color:var(--anthracite);}
.kpi .l{font-size:13.5px; color:var(--ink-soft); margin-top:6px; font-weight:600;}
.kpi.alert{border-color:#f2c477; background:var(--orange-tint);}
.kpi.alert .n{color:var(--orange-deep);}

/* ---------- Auth : compléments ---------- */
.auth-panel .form-error-box{margin-bottom:18px;}
.auth-panel.wide{max-width:none;}
.auth-standalone{max-width:520px; margin:0 auto;}
.auth-standalone .card{padding:34px 34px 30px;}
.form-foot a{color:var(--orange-deep); font-weight:600;}
.auth-main .switch-type{margin-bottom:18px;}

/* ---------- Pages légales / texte ---------- */
.legal{max-width:820px; margin:0 auto;}
.legal h2{font-size:26px; font-weight:700; margin:38px 0 10px; color:var(--anthracite);}
.legal h2:first-child{margin-top:0;}
.legal h3{font-size:20px; margin:26px 0 8px; font-weight:700;}
.legal p, .legal li{font-size:16px; line-height:1.7; color:#2f373d;}
.legal p{margin:0 0 14px;}
.legal ul{margin:0 0 16px; padding-left:22px;}
.legal a{color:var(--orange-deep); font-weight:600;}
.legal .lead-box{background:var(--stone); border-radius:14px; padding:18px 22px; margin-bottom:28px; font-size:15px; color:var(--ink-soft);}
.legal table.data{margin:10px 0 24px;}
.legal .updated{font-size:13.5px; color:var(--ink-soft); margin-bottom:24px;}

/* ---------- Bandeau cookies ---------- */
.cc-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:900;
  max-width:980px; margin:0 auto;
  background:#fff; border:1px solid var(--stone-line); border-radius:18px;
  box-shadow:0 24px 60px -18px rgba(32,38,42,.45);
  padding:22px 26px; display:grid; grid-template-columns:1fr auto; gap:18px 28px; align-items:center;
}
.cc-banner[hidden], .cc-modal[hidden]{display:none;}
.cc-banner h2{font-size:20px; font-weight:700; margin:0 0 6px;}
.cc-banner p{margin:0; font-size:14.5px; color:var(--ink-soft); line-height:1.55;}
.cc-banner p a{color:var(--orange-deep); font-weight:700;}
.cc-actions{display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end;}
.cc-actions .btn{padding:11px 20px; font-size:14px;}
.cc-modal{position:fixed; inset:0; z-index:950; background:rgba(32,38,42,.55); display:flex; align-items:center; justify-content:center; padding:18px;}
.cc-dialog{background:#fff; border-radius:20px; max-width:620px; width:100%; max-height:92vh; overflow:auto; padding:30px 32px; box-shadow:0 30px 80px -20px rgba(0,0,0,.5);}
.cc-dialog h2{font-size:26px; font-weight:700; margin-bottom:8px;}
.cc-dialog > p{color:var(--ink-soft); font-size:15px; margin:0 0 20px;}
.cc-cat{border:1px solid var(--stone-line); border-radius:14px; padding:16px 18px; margin-bottom:12px; display:flex; gap:16px; justify-content:space-between; align-items:flex-start;}
.cc-cat h3{font-size:17px; margin:0 0 4px; font-weight:700;}
.cc-cat p{margin:0; font-size:13.5px; color:var(--ink-soft); line-height:1.5;}
.cc-cat .always{font-size:12.5px; font-weight:700; color:#1c6b3d; white-space:nowrap; padding-top:2px;}
.cc-switch{position:relative; width:46px; height:26px; flex:none;}
.cc-switch input{position:absolute; inset:0; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; z-index:2;}
.cc-switch span{position:absolute; inset:0; background:#c9cfd4; border-radius:999px; transition:background .18s ease;}
.cc-switch span::after{content:""; position:absolute; left:3px; top:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .18s ease; box-shadow:0 1px 3px rgba(0,0,0,.3);}
.cc-switch input:checked + span{background:var(--orange);}
.cc-switch input:checked + span::after{transform:translateX(20px);}
.cc-switch input:focus-visible + span{outline:2.5px solid var(--orange); outline-offset:3px;}
.cc-dialog .cc-actions{margin-top:20px;}
.link-btn{background:none; border:0; padding:0; font:inherit; color:inherit; cursor:pointer; text-decoration:underline;}
.link-btn:hover{color:var(--orange);}

/* ---------- Back-office ---------- */
body.bo{background:#f3f4f6; color:var(--ink);}
.bo-shell{display:grid; grid-template-columns:248px minmax(0,1fr); min-height:100vh;}
.bo-side{background:var(--anthracite-deep); color:#d6dbe0; padding:22px 16px; position:sticky; top:0; height:100vh; display:flex; flex-direction:column;}
.bo-side .brand{padding:6px 10px 18px;}
.bo-side .brand img{height:38px; width:auto; border-radius:9px;}
.bo-side .role{font-size:12px; color:#8b939a; padding:0 10px 14px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:14px;}
.bo-nav{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:3px; flex:1;}
.bo-nav a{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; border-radius:10px; text-decoration:none; color:#d6dbe0; font-weight:600; font-size:14.5px;}
.bo-nav a:hover{background:rgba(255,255,255,.07);}
.bo-nav a.active{background:var(--orange); color:#fff;}
.bo-nav .count{background:rgba(255,255,255,.16); border-radius:999px; font-size:12px; padding:1px 9px; font-weight:700;}
.bo-nav a.active .count{background:rgba(0,0,0,.22);}
.bo-nav .count.hot{background:#e6a100; color:#20262A;}
.bo-side .who{border-top:1px solid rgba(255,255,255,.08); padding:14px 10px 0; font-size:13px; color:#8b939a;}
.bo-side .who a{color:#fff; font-weight:700; text-decoration:none;}
.bo-content{padding:30px 38px 60px; min-width:0;}
.bo-top{display:flex; align-items:flex-start; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:22px;}
.bo-top h1{font-size:34px; font-weight:700; color:var(--anthracite);}
.bo-top p{margin:4px 0 0; color:var(--ink-soft);}
.bo-crumb{font-size:13.5px; color:var(--ink-soft); margin-bottom:6px;}
.bo-crumb a{color:var(--ink-soft);}
.bo-content .flash-stack{padding:0; margin:0 0 18px; max-width:none;}
.bo-cols{display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:22px; align-items:start;}
.bo-side-toggle{display:none;}
.bo-login{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; background:linear-gradient(160deg,var(--anthracite-deep),var(--anthracite));}
.bo-login .card{width:100%; max-width:430px; padding:36px;}
.bo-login .brand img{height:44px; width:auto; margin-bottom:22px; border-radius:10px;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .app-grid, .bo-cols{grid-template-columns:1fr;}
  .bo-shell{grid-template-columns:1fr;}
  .bo-side{position:static; height:auto; flex-direction:column;}
  .bo-nav{flex-direction:row; flex-wrap:wrap;}
  .bo-content{padding:22px 18px 50px;}
  .cc-banner{grid-template-columns:1fr;}
  .cc-actions{justify-content:flex-start;}
}
@media (max-width:720px){
  .flash-stack{padding:0 20px;}
  .card{padding:22px 20px;}
  .field-row-3{grid-template-columns:1fr;}
  .kv{grid-template-columns:1fr; gap:2px;}
  .kv dt{margin-top:10px;}
  .progress-steps{grid-template-columns:repeat(2,1fr); row-gap:18px;}
  .progress-steps li::after{display:none;}
}
@media print{
  .cc-banner, header, footer, .actions, .flash-stack{display:none !important;}
}
