/* =====================================================================
 * SSGL Ops — page de connexion unique /connexion (E01, 2.52.0).
 * Chargée APRÈS tokens, fonts, ui et shell (Ui\Login::document). Couche
 * sui.shell (même niveau que la coque). Couleurs : jetons --sui-* seulement.
 * Mobile : une colonne, champs de 16 px (ui.css sous 48em), bouton de 48 px.
 * ===================================================================== */
@layer sui.shell {
  .sui-login-body { display: flex; min-height: 100vh; min-height: 100dvh; }
  .sui-login {
    flex: 1; display: flex; align-items: center; justify-content: center;
    padding: var(--sui-sp-5) var(--sui-gutter, var(--sui-sp-4));
  }
  .sui-login-card {
    width: 100%; max-width: 26rem;
    background: var(--sui-surface); color: var(--sui-text);
    border: var(--sui-border-w) solid var(--sui-border); border-radius: var(--sui-radius-lg);
    box-shadow: var(--sui-shadow-2); padding: var(--sui-sp-6) var(--sui-sp-5);
  }
  .sui-login-brand {
    display: flex; align-items: center; gap: .625rem; margin: 0 0 var(--sui-sp-4);
    font-weight: var(--sui-fw-semibold); font-size: var(--sui-fs-16); color: var(--sui-text);
  }
  .sui-login-title { margin: 0 0 var(--sui-sp-4); font-size: var(--sui-fs-24); line-height: var(--sui-lh-24); }
  .sui-login-lead { color: var(--sui-text-2); margin: 0 0 var(--sui-sp-4); }
  .sui-login-messages:empty { display: none; }
  .sui-login-form .sui-field { max-width: none; }
  .sui-login-pass { display: flex; gap: var(--sui-sp-2); align-items: stretch; }
  .sui-login-pass .sui-input { flex: 1 1 auto; min-width: 0; }
  .sui-login-reveal { flex: none; min-width: var(--sui-target-touch, 2.75rem); }
  .sui-login-form .sui-check { margin: 0 0 var(--sui-sp-4); }
  .sui-login-submit { width: 100%; justify-content: center; }
  .sui-login-links { list-style: none; margin: var(--sui-sp-5) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--sui-sp-2); }
  .sui-login-links .sui-link { display: inline-flex; align-items: center; min-height: var(--sui-target-touch, 2.75rem); }
  .sui-login-done .sui-login-submit { margin-top: var(--sui-sp-2); }

  @media (max-width: 30em) {
    .sui-login { align-items: flex-start; padding-top: var(--sui-sp-4); }
    .sui-login-card { box-shadow: none; border: 0; padding: var(--sui-sp-4) 0; background: transparent; }
  }
}