/* Sélecteur de logiciels Perrenoud.
   Tout est porté par .lpsel et préfixé lps- : aucune collision possible
   avec Phlox Pro, WooCommerce ou Elementor. */
.lpsel{
  --g:#F1F4F5; --sf:#FFFFFF; --rs:#F7FAFA;
  --ik:#10191C; --ik2:#3B4E54; --mu:#6C7F85;
  --ln:#D8E1E3; --ln2:#EAF0F1;
  --ac:#0A7C91; --ac2:#00B5D1; --aci:#FFFFFF; --acs:#E4F4F8;
  --ads:#1A5FB4; --adss:#E1EAF8;
  --sh:0 1px 2px rgba(16,25,28,.05),0 10px 30px -14px rgba(16,25,28,.22);
  --r:12px;
  max-width:860px; margin:0 auto; padding:4px 0 48px;
  font:400 16px/1.6 "IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ik); box-sizing:border-box;
}
.lpsel *,.lpsel *::before,.lpsel *::after{box-sizing:border-box}
.lpsel .lps-qnum,.lpsel h2,.lpsel .lps-hint{display:block!important;visibility:visible!important;opacity:1!important;height:auto!important;max-height:none!important;text-indent:0!important}

/* Progression : un segment par question */
.lpsel .lps-steps{display:flex;gap:5px;margin:0 0 20px}
.lpsel .lps-steps i{flex:1;height:4px;border-radius:3px;background:var(--ln);transition:background .35s ease}
.lpsel .lps-steps i.lps-done{background:var(--ac)}
.lpsel .lps-steps i.lps-now{background:linear-gradient(90deg,var(--ac) 0%,var(--ac2) 100%)}

.lpsel .lps-card{background:var(--sf);border:1px solid var(--ln);border-radius:var(--r);padding:28px 26px;box-shadow:var(--sh)}
.lpsel .lps-qnum{font:600 11px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.13em;color:var(--ac);text-transform:uppercase;margin-bottom:11px}
.lpsel h2{font:600 23px/1.25 "IBM Plex Sans",sans-serif!important;letter-spacing:-.015em;margin:0 0 5px!important;color:var(--ik)}
.lpsel .lps-hint{color:var(--mu);font-size:14px;margin:0 0 22px!important}

.lpsel .lps-opts{display:grid;gap:9px}
.lpsel .lps-opt{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;text-align:left;
  cursor:pointer;background:var(--rs);color:var(--ik);border:1.5px solid var(--ln);border-radius:10px;
  font:inherit;transition:border-color .16s,background .16s,box-shadow .16s}
.lpsel .lps-opt:hover{border-color:var(--ac2);background:var(--sf);box-shadow:0 2px 10px -4px rgba(0,181,209,.4)}
.lpsel .lps-opt:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
.lpsel .lps-opt[aria-pressed="true"]{border-color:var(--ac);background:var(--acs);box-shadow:none}
.lpsel .lps-mk{flex:0 0 20px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--ln);background:var(--sf);transition:all .16s}
.lpsel .lps-mk.lps-sq{border-radius:6px} .lpsel .lps-mk.lps-rd{border-radius:50%}
.lpsel .lps-opt[aria-pressed="true"] .lps-mk{background:var(--ac);border-color:var(--ac)}
.lpsel .lps-mk svg{display:block;width:12px;height:12px;opacity:0;transition:opacity .14s}
.lpsel .lps-mk .lps-dot{width:8px;height:8px;border-radius:50%;background:var(--aci);opacity:0;transition:opacity .14s}
.lpsel .lps-opt[aria-pressed="true"] .lps-mk svg,.lpsel .lps-opt[aria-pressed="true"] .lps-mk .lps-dot{opacity:1}
.lpsel .lps-txt b{display:block;font-weight:600;font-size:15.5px;line-height:1.35;color:var(--ik)}
.lpsel .lps-txt span{display:block;color:var(--mu);font-size:13.5px;margin-top:2px;line-height:1.4}

.lpsel .lps-row{display:flex;gap:10px;align-items:center;margin:24px 0 0;flex-wrap:wrap}
.lpsel .lps-btn{font:600 15px/1 "IBM Plex Sans",sans-serif;padding:14px 24px;border-radius:9px;
  border:1.5px solid var(--ac);background:var(--ac);color:var(--aci);cursor:pointer;
  transition:background .16s,box-shadow .16s;text-decoration:none;display:inline-block}
.lpsel .lps-btn:hover{background:var(--ac2);border-color:var(--ac2);color:var(--aci);box-shadow:0 4px 14px -5px rgba(0,181,209,.6)}
.lpsel .lps-btn:disabled{opacity:.3;cursor:not-allowed;box-shadow:none;background:var(--ac)}
.lpsel .lps-btn.lps-ghost{background:transparent;color:var(--ik2);border-color:var(--ln)}
.lpsel .lps-btn.lps-ghost:hover{background:var(--rs);border-color:var(--ln);color:var(--ik);box-shadow:none}
.lpsel .lps-btn:focus-visible{outline:2px solid var(--ac);outline-offset:3px}

/* Rappel des réponses sur l'écran de résultat */
.lpsel .lps-recap{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 20px}
.lpsel .lps-chip{font:500 12.5px/1 "IBM Plex Sans",sans-serif;padding:7px 11px;border-radius:999px;
  background:var(--acs);color:var(--ac);border:1px solid rgba(10,124,145,.18)}

.lpsel .lps-pick{background:var(--sf);border:1.5px solid var(--ac);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);margin-bottom:12px}
.lpsel .lps-pick .lps-bar{background:linear-gradient(90deg,var(--ac) 0%,var(--ac2) 130%);color:var(--aci);
  padding:9px 22px;font:600 11px/1.6 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase}
.lpsel .lps-pick .lps-body{padding:22px}
.lpsel .lps-pick h3{font:600 20px/1.3 "IBM Plex Sans",sans-serif!important;margin:0 0 7px!important;letter-spacing:-.012em;color:var(--ik)}
.lpsel .lps-pick p{margin:0 0 16px!important;color:var(--ik2);font-size:14.5px}
.lpsel .lps-priceline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.lpsel .lps-price{font:600 26px/1 "IBM Plex Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.025em;color:var(--ik)}
.lpsel .lps-price small{font-size:12px;color:var(--mu);margin-left:7px;font-weight:400;letter-spacing:0}
.lpsel .lps-mini{font:600 13.5px/1 "IBM Plex Sans",sans-serif;padding:11px 16px;border-radius:8px;
  border:1.5px solid var(--ac);background:transparent;color:var(--ac);cursor:pointer;
  text-decoration:none;white-space:nowrap;display:inline-block;transition:background .16s,color .16s}
.lpsel .lps-mini:hover{background:var(--ac);color:var(--aci)}
.lpsel .lps-mini.lps-ghost{border-color:var(--ln);color:var(--ik2)}
.lpsel .lps-mini.lps-ghost:hover{background:var(--rs);color:var(--ik)}

/* Ajouter / retirer : la même case porte l'un ou l'autre selon l'état
   du panier, pour que le visiteur puisse revenir sur son choix. */
.lpsel .lps-act{display:inline-flex;align-items:center;gap:9px;flex-wrap:wrap}
.lpsel .lps-dejapris{font:600 12.5px/1 "IBM Plex Sans",sans-serif;color:#0A7C91;
  background:var(--acs);border:1px solid rgba(10,124,145,.25);border-radius:20px;
  padding:6px 11px;white-space:nowrap}
/* Plus spécifique que .lps-mini.lps-ghost, sinon le gris l'emporterait. */
.lpsel .lps-mini.lps-retirer{border-color:#E7C9BF;color:#B23C18;background:transparent}
.lpsel .lps-mini.lps-retirer:hover{background:#FBEDE8;color:#8E2E11;border-color:#DDA891}
.lpsel .lps-mini.lps-retirer:disabled{opacity:.55;cursor:progress}
/* WooCommerce accroche son propre « Voir le panier » après un ajout : il
   ferait doublon avec le panier flottant et l'état affiché ci-dessus. */
.lpsel .added_to_cart{display:none!important}

.lpsel .lps-sect-label{font:600 11px/1 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase;color:var(--mu);margin:30px 0 11px}
.lpsel .lps-mods{display:grid;gap:7px}
.lpsel .lps-mod{display:flex;justify-content:space-between;align-items:center;gap:14px;background:var(--sf);
  border:1px solid var(--ln2);border-radius:9px;padding:12px 15px;transition:border-color .16s}
.lpsel .lps-mod:hover{border-color:var(--ln)}
.lpsel .lps-mod .lps-n{font-weight:600;font-size:14.5px;min-width:0}
.lpsel .lps-mod .lps-n a{color:inherit;text-decoration:none;border-bottom:1px solid var(--ln)}
.lpsel .lps-mod .lps-n a:hover{border-color:var(--ac2)}
.lpsel .lps-mod .lps-d{color:var(--mu);font-size:12.5px;display:block;font-weight:400;margin-top:2px}
.lpsel .lps-mod .lps-r{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.lpsel .lps-mod .lps-p{font:500 15px "IBM Plex Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;white-space:nowrap}

.lpsel .lps-total{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  background:var(--acs);border:1px solid rgba(10,124,145,.2);border-radius:var(--r);
  margin-top:18px;padding:18px 22px;font:600 15.5px "IBM Plex Sans",sans-serif;color:var(--ik)}
.lpsel .lps-total .lps-p{font:700 27px/1 "IBM Plex Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.025em;color:var(--ac)}
.lpsel .lps-cta{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.lpsel .lps-cta .lps-btn{padding:16px 28px;font-size:16px}

  border-left:3px solid var(--ads);background:var(--adss);border-radius:0 9px 9px 0;font-size:13.5px;color:var(--ik2)}
  border-radius:0 9px 9px 0;padding:15px 19px;font-size:14px;color:var(--ik2);margin-top:11px}

@keyframes lps-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.lpsel .lps-card,.lpsel .lps-recap,.lpsel .lps-pick{animation:lps-in .3s cubic-bezier(.2,.7,.3,1) both}

@media (max-width:600px){
  .lpsel .lps-card{padding:22px 18px}
  .lpsel h2{font-size:20px!important}
  .lpsel .lps-mod{flex-direction:column;align-items:flex-start;gap:9px}
  .lpsel .lps-mod .lps-r{width:100%;justify-content:space-between}
  .lpsel .lps-cta .lps-btn{width:100%;text-align:center}
}
@media (prefers-reduced-motion:reduce){.lpsel *{animation:none!important;transition:none!important}}

@media (prefers-color-scheme:dark){
  .lpsel:not([data-lps-theme="light"]){
    --g:#0A1114; --sf:#111A1D; --rs:#161F23;
    --ik:#E9F0F1; --ik2:#B3C3C7; --mu:#7D9297;
    --ln:#253337; --ln2:#1C272B;
    --ac:#35C4DC; --ac2:#7BDCEC; --aci:#04222A; --acs:#0E2C34;
    --ads:#7FB2F0; --adss:#12213A;
    --sh:0 1px 2px rgba(0,0,0,.45),0 12px 32px -16px rgba(0,0,0,.75);
  }
}

/* Formule pack : mise en avant distincte du logiciel principal */
.lpsel .lps-pack{background:var(--sf);border:1.5px dashed var(--ac2);border-radius:var(--r);
  overflow:hidden;box-shadow:var(--sh);animation:lps-in .3s cubic-bezier(.2,.7,.3,1) both}
.lpsel .lps-packbar{background:var(--acs);color:var(--ac);padding:9px 22px;
  font:700 11px/1.6 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase;
  border-bottom:1px dashed var(--ac2)}
.lpsel .lps-pack .lps-price small{display:block;margin:4px 0 0;text-decoration:line-through;opacity:.75}

/* Détail de ce que contient le pack retenu */
.lpsel .lps-inclus{list-style:none;margin:0 0 18px;padding:14px 16px;
  background:var(--acs);border-radius:9px;display:grid;gap:7px}
.lpsel .lps-inclus li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  font-size:13.5px;color:var(--ik);margin:0;padding:0}
.lpsel .lps-inclus li::before{content:"✓";color:var(--ac);font-weight:700;margin-right:8px}
.lpsel .lps-inclus span{flex:1;min-width:0}
.lpsel .lps-inclus em{font:400 13px "IBM Plex Mono",ui-monospace,monospace;font-style:normal;
  color:var(--mu);text-decoration:line-through;white-space:nowrap;font-variant-numeric:tabular-nums}
