/* ==========================================================================
   QORSEC — styles propres à /outils/mot-de-passe.html
   (s'ajoute à /assets/css/site.css ; n'utilise que ses jetons)
   ========================================================================== */

/* Champ mot de passe + bouton afficher / masquer */
.mdp-pw { position: relative; display: flex; align-items: stretch; }
.mdp-pw input { flex: 1; min-width: 0; padding-right: 118px !important; font-family: var(--mono); font-size: 1.05rem; letter-spacing: .02em; }
.mdp-eye {
  position: absolute; top: 6px; right: 6px; bottom: 6px; display: inline-flex; align-items: center; gap: 6px;
  padding: 0 12px; border-radius: 9px; border: 1px solid var(--border); background: var(--surface-2);
  color: var(--ink-700); font: inherit; font-size: .86rem; font-weight: 700; cursor: pointer;
  transition: background var(--t-fast, .15s), border-color var(--t-fast, .15s);
}
.mdp-eye:hover { background: var(--white); border-color: var(--border-strong); }
.mdp-eye:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.mdp-eye svg { width: 18px; height: 18px; flex: none; }
.mdp-eye .mdp-eye__hide { display: none; }
.mdp-eye.is-on .mdp-eye__show { display: none; }
.mdp-eye.is-on .mdp-eye__hide { display: block; }
.mdp-help-tight { margin-top: 6px; line-height: 1.5; }
.mdp-hibp { padding: 14px 16px; border-radius: var(--r-md); background: var(--surface-2); border: 1px solid var(--border); }
.mdp-hibp .field__help { margin: 8px 0 0 28px; line-height: 1.55; }
.mdp-hibp code { font-size: .85em; }

/* Chiffres de l'analyse */
.mdp-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 18px 0 6px; border-radius: var(--r-md); overflow: hidden; background: var(--border); border: 1px solid var(--border); }
.mdp-stat { display: grid; gap: 2px; align-content: start; padding: 14px 16px; background: var(--white); }
.mdp-stat__label { font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--fg-subtle); }
.mdp-stat__value { font-size: 1.45rem; font-weight: 800; letter-spacing: -.02em; color: var(--data); font-variant-numeric: tabular-nums; }
.mdp-stat__help { font-size: .82rem; color: var(--fg-muted); overflow-wrap: anywhere; }

.mdp-h { font-size: 1.02rem; margin: 26px 0 10px; letter-spacing: -.01em; }

/* Scénarios de temps de cassage */
.mdp-scen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mdp-scen__card { --c: var(--cyan-700); display: grid; gap: 6px; align-content: start; padding: 16px; border-radius: var(--r-md); border: 1px solid var(--border); border-top: 4px solid var(--c); background: var(--white); }
.mdp-scen__card--bad { --c: var(--red-700); background: #fdf3f3; }
.mdp-scen__card--weak { --c: var(--orange-600); background: #fff8f2; }
.mdp-scen__card--mid { --c: var(--amber-600); }
.mdp-scen__card--good { --c: var(--green-700); }
.mdp-scen__title { font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--fg-muted); }
.mdp-scen__time { font-size: 1.22rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.25; color: var(--ink-900); }
.mdp-scen__rate { font-size: .8rem; color: var(--fg-subtle); font-variant-numeric: tabular-nums; }
.mdp-note { font-size: .82rem; color: var(--fg-subtle); margin: 10px 0 0; }
.mdp-hibp-row { margin-top: 14px; border-top: 1px solid var(--border); }
.mdp-hibp-row .check-row { border-bottom: 1px solid var(--border); }
.mdp-hibp-row .check-row__detail:empty { display: none; }
#mdp-advice .check-row__detail:empty { display: none; }

/* Fragments reconnus : masqués à l'écran tant que « Afficher » n'est pas activé, toujours masqués à l'impression */
.mdp-tok { display: none; margin-left: 6px; font-size: .86em; word-break: break-all; }
.mdp-mask { margin-left: 6px; color: var(--fg-muted); font-weight: 600; }
.mdp-mask > span[aria-hidden] { letter-spacing: .08em; font-family: var(--mono); }
.mdp-pos { font-size: .84em; font-weight: 500; color: var(--fg-muted); }
.mdp-reveal .mdp-tok { display: inline; }
.mdp-reveal .mdp-mask { display: none; }
.check-row__detail sup, .tool-results__summary sup { font-size: .7em; line-height: 0; }
.mdp-export-note { margin-top: 10px; }

/* Générateur */
.mdp-gen-opts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 20px 28px; align-items: start; }
.mdp-range output { font-variant-numeric: tabular-nums; color: var(--data); font-weight: 800; }
.mdp-range input[type="range"] { width: 100%; accent-color: var(--blue-600); height: 28px; }
.mdp-sets { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.mdp-sets legend { font-size: .88rem; font-weight: 700; color: var(--fg); margin-bottom: 8px; padding: 0; }
.mdp-sets .check { font-size: .92rem; }
.mdp-gen-out { margin-top: 22px; padding: 18px; border-radius: var(--r-md); background: var(--navy-900); border: 1px solid var(--navy-700); }
.mdp-gen-value { display: block; min-height: 1.6em; font-family: var(--mono); font-size: 1.15rem; line-height: 1.5; color: #fff; overflow-wrap: anywhere; word-break: break-all; user-select: all; }
.mdp-gen-entropy { margin: 10px 0 0; font-size: .85rem; color: #b9c6e2; }
.mdp-gen-entropy strong { color: var(--cyan-300); }

/* Politique (section sombre) */
.mdp-policy { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.mdp-rule { padding: 20px; border-radius: var(--r-lg); background: rgba(255, 255, 255, .04); border: 1px solid rgba(173, 196, 255, .14); }
.mdp-rule h3 { font-size: 1.02rem; margin: 10px 0 8px; line-height: 1.3; color: #fff; }
.mdp-rule p { margin: 0; font-size: .9rem; color: #b9c6e2; line-height: 1.55; }
.mdp-rule__tag { font-size: .76rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--cyan-300); }
.mdp-practice { margin-top: 28px; padding: 22px; border-radius: var(--r-lg); border: 1px dashed rgba(173, 196, 255, .25); }
.mdp-practice h3 { font-size: 1.05rem; margin: 0 0 12px; color: #fff; }
.mdp-disclaimer { margin: 16px 0 0; font-size: .85rem; color: #aab7d4; }

/* Méthode */
.mdp-method { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); }
.mdp-method h3 { font-size: 1.1rem; margin: 26px 0 8px; }
.mdp-method__col > h3:first-child { margin-top: 0; }
.mdp-method p, .mdp-list { color: var(--fg-muted); font-size: .97rem; }
.mdp-method code { overflow-wrap: anywhere; }
.mdp-list { padding-left: 1.1em; }
.mdp-list li { margin: .25em 0; }
.mdp-list li > span:first-child { font-weight: 800; color: var(--data); font-variant-numeric: tabular-nums; }
.mdp-rates td { font-size: .88rem; }
.mdp-rates td.num { white-space: nowrap; font-weight: 700; }

/* Adaptation */
@media (max-width: 1100px) { .mdp-policy { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .mdp-method { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 720px) {
  .mdp-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mdp-scen { grid-template-columns: minmax(0, 1fr); }
  .mdp-gen-opts { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .mdp-policy { grid-template-columns: minmax(0, 1fr); }
  .mdp-pw input { padding-right: 56px !important; }
  .mdp-eye span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .mdp-eye { padding: 0 10px; }
  .mdp-rates td.num { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .mdp-eye { transition: none; }
}

/* Impression : jamais le mot de passe ni ses fragments */
@media print {
  .mdp-tok { display: none !important; }
  .mdp-mask { display: inline !important; margin-left: 6px; }
  .mdp-stats, .mdp-scen__card { break-inside: avoid; }
  .mdp-stat, .mdp-scen__card { background: #fff !important; }
  .mdp-scen { grid-template-columns: repeat(3, 1fr); }
  .mdp-stats { grid-template-columns: repeat(4, 1fr); }
}