/* Portail commercialisateurs — Pygma'LYON Immobilier */
:root{
  --sombre:#18383B; --teal:#418D94; --teal-f:#2E6B71; --cyan:#8AE8F1; --menthe:#F5FAFA;
  --rouge:#C8102E; --texte:#18383B; --doux:#5f7476; --ligne:#d7e6e7; --fond:#F5FAFA; --carte:#ffffff;
  --ok:#1f7a4d; --ok-f:#e5f4ec; --ko:#a3202f; --ko-f:#fbe9eb; --ambre:#9a6200; --ambre-f:#fdf3e0;
  --violet:#5b3e9e; --violet-f:#efe9fb; --bleu:#1f5f99; --bleu-f:#e6f0fa;
  --rayon:12px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--fond);color:var(--texte);font:15px/1.5 "Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;min-height:100vh;display:flex;flex-direction:column;}
a{color:var(--teal-f);}
h1{font-size:24px;margin:6px 0 14px;line-height:1.25;}
h2{font-size:19px;margin:22px 0 10px;}
h3{font-size:15px;margin:0 0 8px;text-transform:uppercase;letter-spacing:.06em;color:var(--teal-f);}
.note{color:var(--doux);font-size:13px;}
.sous{color:var(--doux);margin-top:-6px;}
.centre{text-align:center;}

/* Barre du haut */
.barre{background:var(--sombre);color:#fff;display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:12px 22px;position:sticky;top:0;z-index:10;box-shadow:0 2px 10px rgba(0,0,0,.18);}
.marque{display:flex;align-items:baseline;gap:0;text-decoration:none;color:#fff;font-weight:800;font-size:21px;letter-spacing:.03em;white-space:nowrap;}
.marque .m2{color:#ff4d5e;}
.marque .m3{font-weight:400;font-size:12px;letter-spacing:.28em;color:var(--cyan);margin-left:10px;}
.qui{color:var(--cyan);font-size:13px;margin-left:auto;}
.nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.nav a,.nav .lien{color:#dff4f5;text-decoration:none;padding:7px 11px;border-radius:8px;font-size:14px;background:none;border:0;font:inherit;cursor:pointer;}
.nav a:hover,.nav .lien:hover{background:rgba(255,255,255,.1);}
.nav a.on{background:var(--teal);color:#fff;}
.nav form{margin:0;}
.pastille{background:var(--rouge);color:#fff;border-radius:999px;font-size:11px;padding:1px 7px;margin-left:3px;}

.contenu{flex:1;width:100%;max-width:1240px;margin:0 auto;padding:22px 18px 40px;}
.pied{text-align:center;color:var(--doux);font-size:12px;padding:18px;border-top:1px solid var(--ligne);}

/* Cartes et formulaires */
.carte{background:var(--carte);border:1px solid var(--ligne);border-radius:var(--rayon);padding:20px;box-shadow:0 1px 3px rgba(24,56,59,.05);}
.carte.etroite{max-width:520px;margin:10px auto;}
.carte.etroite.gauche{margin-left:0;}
.carte.vide{text-align:center;color:var(--doux);padding:36px 20px;}
.form{display:flex;flex-direction:column;gap:14px;margin-top:10px;}
.form label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:14px;}
.form fieldset{border:1px solid var(--ligne);border-radius:10px;padding:12px 14px 14px;display:flex;flex-direction:column;gap:12px;margin:0;}
.form legend{font-weight:600;font-size:13px;color:var(--doux);padding:0 6px;}
input,textarea,select{font:inherit;color:var(--texte);border:1px solid #bcd1d3;border-radius:9px;padding:10px 12px;background:#fff;width:100%;font-weight:400;}
input:focus,textarea:focus,select:focus{outline:2px solid var(--teal);outline-offset:0;border-color:var(--teal);}
.mdp{position:relative;display:block;}
.mdp input{padding-right:44px;}
.mdp .voir{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;cursor:pointer;font-size:16px;padding:6px;opacity:.6;}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.deux-col{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start;}
.boutons{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;margin-top:4px;}
.boutons form{margin:0;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-weight:600;border-radius:9px;padding:10px 18px;border:1px solid #bcd1d3;background:#fff;color:var(--texte);cursor:pointer;text-decoration:none;}
.btn:hover{border-color:var(--teal);}
.btn.prim{background:var(--teal-f);border-color:var(--teal-f);color:#fff;}
.btn.prim:hover{background:var(--sombre);}
.btn.danger{background:var(--ko);border-color:var(--ko);color:#fff;}
.btn.large{width:100%;padding:12px;}
.btn.petit{padding:6px 12px;font-size:13px;}
.flash{border-radius:10px;padding:11px 14px;margin:0 0 16px;font-size:14px;}
.flash.ok{background:var(--ok-f);color:var(--ok);border:1px solid #bfe3cf;}
.flash.ko{background:var(--ko-f);color:var(--ko);border:1px solid #f1c6cc;}
.rgpd{font-size:11.5px;color:var(--doux);border-top:1px solid var(--ligne);padding-top:12px;margin-top:18px;}
.fil{margin:0 0 6px;font-size:14px;}
.fil a{text-decoration:none;}

/* Page d'accueil (connexion) */
.page-accueil .contenu{max-width:none;padding:0;display:flex;}
.accueil{flex:1;display:grid;grid-template-columns:1.2fr 1fr;min-height:calc(100vh - 120px);}
.accueil-visuel{background:url(accueil.webp) center/cover no-repeat,var(--menthe);}
.accueil .carte{align-self:center;margin:30px auto;width:calc(100% - 36px);}

/* Pastilles */
.pill{display:inline-block;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent;}
.st-disponible{background:var(--bleu-f);color:var(--bleu);}
.st-optionne{background:#def4f2;color:#16706a;}
.st-sous_offre,.st-sous_puv{background:var(--ambre-f);color:var(--ambre);}
.st-vendu{background:var(--ok-f);color:var(--ok);}
.excl,.type-visite{background:var(--violet-f);color:var(--violet);}
.type-interet{background:var(--bleu-f);color:var(--bleu);}
.type-option{background:#def4f2;color:#16706a;}
.dst-nouvelle{background:var(--ambre-f);color:var(--ambre);}
.dst-acceptee,.acc-actif{background:var(--ok-f);color:var(--ok);}
.dst-refusee,.acc-revoque{background:var(--ko-f);color:var(--ko);}
.dst-contre_proposition{background:var(--violet-f);color:var(--violet);}
.dst-traitee,.dst-annulee{background:#eef1f1;color:#5f6b6c;}
.acc-invite{background:var(--ambre-f);color:var(--ambre);}
.compteurs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0;}

/* Liste des opérations */
.grille-ops{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;}
.carte-op{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s;}
.carte-op:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(24,56,59,.12);}
.carte-op .vignette{aspect-ratio:16/9;background:var(--menthe);overflow:hidden;}
.carte-op .vignette img{width:100%;height:100%;object-fit:cover;display:block;}
.sans-photo{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:54px;font-weight:800;color:var(--teal);background:linear-gradient(135deg,#e6f3f4,#cfe7e9);}
.carte-op .corps{padding:14px 16px 16px;}
.carte-op h2{margin:0 0 2px;font-size:18px;}
.adr{color:var(--doux);font-size:14px;}

/* Fiche opération */
.op-tete{display:flex;gap:22px;align-items:flex-start;flex-wrap:wrap;}
.op-tete .photo{width:min(420px,100%);aspect-ratio:4/3;object-fit:cover;border-radius:var(--rayon);border:1px solid var(--ligne);}
.op-infos{flex:1;min-width:260px;}
.op-infos h1{margin-top:0;margin-bottom:2px;}
.presentation{white-space:normal;margin:10px 0;line-height:1.6;}
.infos{font-size:14px;}
.op-cote{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;}
.op-cote .carte{flex:1;min-width:250px;padding:14px 16px;}
.op-cote p{margin:4px 0;}
.doc{display:block;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--texte);font-weight:600;border:1px solid var(--ligne);margin-top:6px;}
.doc:hover{border-color:var(--teal);background:var(--menthe);}
.titre-lots{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.maj.flash-maj{color:var(--teal-f);font-weight:600;}

/* Tableau des lots */
.tableau-lots{overflow-x:auto;background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);}
.carte .tableau-lots{border:0;}
table{border-collapse:collapse;width:100%;font-size:14px;}
th{background:var(--menthe);text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--doux);padding:10px;border-bottom:1px solid var(--ligne);white-space:nowrap;}
td{padding:10px;border-bottom:1px solid #e8f1f1;vertical-align:top;}
tr:last-child td{border-bottom:0;}
.n{text-align:right;white-space:nowrap;}
.prix{font-weight:700;}
tr.vendu td{color:#8a9a9b;}
tr.a-moi td{background:#f0faf9;}
td.vide{text-align:center;color:var(--doux);padding:26px;}
.actions{min-width:160px;}
.mini{display:inline-block;margin:2px 3px 2px 0;font-size:12.5px;font-weight:600;padding:5px 9px;border-radius:7px;border:1px solid #bcd1d3;text-decoration:none;color:var(--teal-f);background:#fff;white-space:nowrap;}
.mini:hover{background:var(--teal-f);color:#fff;border-color:var(--teal-f);}
.lot-rappel{background:var(--menthe);border:1px solid var(--ligne);border-radius:9px;padding:10px 12px;}

/* Demandes */
.liste-demandes{display:flex;flex-direction:column;gap:12px;max-width:860px;}
.demande{padding:14px 16px;}
.dem-tete{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px;}
.dem-tete .note{margin-left:auto;}
.dem-quoi{margin-bottom:4px;}
.dem-msg,.dem-rep{margin-top:8px;padding:8px 10px;border-radius:8px;background:var(--menthe);font-size:14px;}
.dem-rep{background:#eef6ff;}
.st-d-contre_proposition{border-color:#cdb8f2;box-shadow:0 0 0 2px var(--violet-f);}
.onglets{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 16px;}
.onglets a{padding:7px 13px;border-radius:999px;border:1px solid var(--ligne);text-decoration:none;color:var(--texte);background:#fff;font-size:14px;}
.onglets a.on{background:var(--teal-f);color:#fff;border-color:var(--teal-f);}
.cle{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.cle code{background:var(--menthe);border:1px dashed var(--teal);padding:10px;border-radius:8px;word-break:break-all;font-size:13px;flex:1;}

/* Mobile */
@media (max-width:820px){
  .barre{padding:10px 14px;gap:8px;}
  .marque{font-size:18px;}
  .marque .m3{display:none;}
  .qui{display:none;}
  .nav{width:100%;justify-content:space-between;}
  .nav a,.nav .lien{padding:6px 8px;font-size:13px;}
  .contenu{padding:16px 12px 30px;}
  h1{font-size:21px;}
  .accueil{grid-template-columns:1fr;}
  .accueil-visuel{min-height:170px;}
  .accueil .carte{margin:-30px auto 20px;position:relative;}
  .deux,.deux-col{grid-template-columns:1fr;}
  /* Le tableau des lots devient une liste de fiches */
  .tableau-lots{border:0;background:none;overflow:visible;}
  .tableau-lots table,.tableau-lots tbody,.tableau-lots tr,.tableau-lots td{display:block;width:100%;}
  .tableau-lots thead{display:none;}
  .tableau-lots tr{background:#fff;border:1px solid var(--ligne);border-radius:var(--rayon);margin-bottom:12px;padding:10px 12px;}
  .tableau-lots td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:12px;text-align:right;}
  .tableau-lots td[data-l]::before{content:attr(data-l);color:var(--doux);font-size:12.5px;text-align:left;flex:none;}
  .tableau-lots td.n{white-space:normal;}
  .tableau-lots td.actions{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px;padding-top:10px;border-top:1px solid #e8f1f1;margin-top:6px;}
  .tableau-lots td.actions:empty{display:none;}
  .mini{font-size:13.5px;padding:8px 11px;margin:0;}
  .boutons{justify-content:stretch;}
  .boutons .btn,.boutons form{flex:1;}
  .boutons form .btn{width:100%;}
}
