/* Partage de secret — styles isolés (page /secret et /s/:token) */

.secret-tabs { display:flex; gap:8px; margin-bottom:18px; }
.secret-tab {
  flex:1; padding:10px 14px; border:1px solid var(--border); border-radius:10px;
  background:transparent; color:var(--text-muted); font:inherit; font-size:14px;
  cursor:pointer; transition:border-color .15s, color .15s;
}
.secret-tab.is-on { border-color:var(--accent); color:var(--accent); font-weight:600; }

.secret-note {
  font-size:13px; color:var(--text-muted); border:1px solid var(--border);
  border-radius:10px; padding:12px 14px; margin:14px 0 18px; line-height:1.5; text-align:left;
}

.secret-warn {
  font-size:13px; color:#92400e; background:#fef3c7; border:1px solid #fde68a;
  border-radius:10px; padding:12px 14px; margin-top:16px; text-align:left; line-height:1.5;
}

.secret-reveal-box {
  margin:18px 0; padding:16px; border:1px solid var(--border);
  border-radius:12px; background:var(--card); text-align:left;
}
.secret-reveal-value {
  font-family:monospace; font-size:15px; word-break:break-all; white-space:pre-wrap;
  color:var(--text); margin:0;
}

/* ─── Générateur de mot de passe ─────────────────────────────────────────── */

.pw-gen-row { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }
.pw-gen-row .wizard-back { flex:1; min-width:200px; }

.pw-opt-toggle {
  padding:10px 14px; border:1px solid var(--border); border-radius:10px;
  background:transparent; color:var(--text-muted); font:inherit; font-size:14px;
  cursor:pointer; transition:border-color .15s, color .15s; white-space:nowrap;
}
.pw-opt-toggle:hover { border-color:var(--accent); color:var(--accent); }
.pw-opt-toggle[aria-expanded="true"] { border-color:var(--accent); color:var(--accent); }

.pw-options {
  margin-top:12px; padding:14px; border:1px solid var(--border);
  border-radius:12px; background:var(--bg2); text-align:left;
}
.pw-options[hidden] { display:none; }

.pw-opt-block { margin-bottom:16px; }
.pw-opt-block:last-of-type { margin-bottom:12px; }
.pw-opt-head {
  display:flex; justify-content:space-between; align-items:center;
  font-size:13px; color:var(--text-muted); margin-bottom:8px;
}
.pw-opt-head label { margin:0; font-size:13px; color:var(--text-muted); }
.pw-len-value { font-family:monospace; font-size:15px; color:var(--accent); font-weight:600; }

.pw-options input[type="range"] { width:100%; accent-color:var(--accent); cursor:pointer; }

.pw-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px 14px; }
@media (max-width: 480px) { .pw-grid { grid-template-columns:1fr; } }

.pw-check {
  display:flex; align-items:center; gap:8px; font-size:13px;
  color:var(--text); cursor:pointer; margin:0;
}
.pw-check input { accent-color:var(--accent); width:16px; height:16px; cursor:pointer; }
.pw-check-wide { margin-top:4px; }

.pw-min {
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-size:13px; color:var(--text); margin:0;
}
.pw-min input {
  width:64px; padding:6px 8px; border:1px solid var(--border); border-radius:8px;
  background:var(--bg3); color:var(--text); font:inherit; font-size:13px; text-align:center;
}
.pw-min input:focus { outline:none; border-color:var(--accent); }

.pw-opt-error {
  margin-top:10px; font-size:13px; color:var(--error);
  border:1px solid var(--error); border-radius:8px; padding:8px 10px; line-height:1.4;
}
.pw-opt-error[hidden] { display:none; }

/* Jauge de robustesse */
.pw-strength { margin-top:10px; text-align:left; }
.pw-strength[hidden] { display:none; }
.pw-strength-track {
  height:6px; border-radius:999px; background:var(--bg3); overflow:hidden;
}
.pw-strength-fill {
  height:100%; width:0; border-radius:999px;
  background:var(--error); transition:width .2s ease, background-color .2s ease;
}
.pw-strength-fill.is-weak   { background:var(--error); }
.pw-strength-fill.is-fair   { background:#fbbf24; }
.pw-strength-fill.is-good   { background:#60a5fa; }
.pw-strength-fill.is-strong { background:var(--success); }
.pw-strength-meta {
  display:flex; justify-content:space-between; align-items:center;
  font-size:12px; color:var(--text-muted); margin-top:5px;
}
