/* ==========================================================================
   IUTID - Feuille de styles publique
   v1.28.6 : extraction publique restaurée depuis le rendu v1.28.3
   Pages ciblées : portail, modification volontaire, mot de passe oublié,
   activation/récupération publiques et connexion manager.
   Les styles manager restent hors de public/assets et sont servis via manager-style.php.
   ========================================================================== */

:root{
    /* Thème */
    --iut-light-blue: #5bbdb5;
    --iut-blue: #32285b;
    --iut-magenta: #a10e2f;
    --ok: #16a34a; --ok-dark:#15803d;
    --err:#dc2626;
    /* IUT */
    --iut-brand-red:    #a10e2f; /* rouge profond / corporate */
    --iut-brand-teal:   #5bbdb5; /* vert sarcelle doux */
    --iut-brand-indigo: #32285b; /* indigo foncé / institutionnel */
    --iut-brand-sand:   #e8cab5; /* sable rosé / ton d’arrière-plan */
    --iut-black:        #000000; /* noir pur */
    --iut-gray-mid:     #65696b; /* gris neutre moyen (texte secondaire) */


    /* Form controls */
    --fc-border:#cbd5e1;
    --fc-border-hover:#94a3b8;
    --fc-bg:#ffffff;
    --fc-text:#0f172a;
    --fc-placeholder:#94a3b8;
    --fc-focus:#2563eb;
    --fc-ring:rgba(37,99,235,.18);
}

/* =====================================================================
   01. Variables, base, topbar et layout général
   ===================================================================== */

/* ===== Base ===== */
body{
    background:#f9fafb;
    font-family:"Segoe UI",Arial,sans-serif;
    margin:0; padding:0;
}

/* ===== Bandeau supérieur avec logo ===== */
header.topbar{
    position:relative;
    display:flex; justify-content:space-between; align-items:center;
    background:var(--iut-brand-red); color:#fff;
    padding:.6rem 1rem; padding-left:calc(1rem + 150px);
    border-bottom:4px solid var(--iut-magenta);
    background-image:image-set(
            url('logo-iut.png') 1x,
            url('logo-iut@2x.png') 2x
    );
    background-repeat:no-repeat; background-size:140px auto; background-position:1rem center;
    height: 50px;
}
header.topbar a, header.topbar a:visited{ color:#fff; text-decoration:underline; }
header.topbar a:hover{ text-decoration:none; }

/* ===== Liens génériques ===== */
a, a:visited{ color:#1e3a8a; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* ===== Boutons génériques / pagination (style de référence .btn) ===== */
.btn{
    display:inline-block; padding:.35rem .6rem;
    border:1px solid #e2e8f0; border-radius:2px;
    background:#f8fafc; color:#0f172a; text-decoration:none;
}
.btn:hover{ background:#f1f5f9; }
.btn.current{ background:#e2e8f0; font-weight:600; pointer-events:none; }
.btn.disabled{ opacity:.5; pointer-events:none; }

/* ===== Pagination ===== */
.pagination{
    margin:.8rem 0; display:flex; gap:.4rem; flex-wrap:wrap; align-items:center;
}
/* ===== Conteneur principal ===== */
.container{
    max-width:1600px; margin:1rem 2%; background:#fff;
    padding:1rem; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,.1);
}

/* Responsive logo : la gestion mobile du bandeau est centralisée plus bas
   dans les breakpoints 720px et 380px. L'ancien seuil 520px a été supprimé
   en v1.26.50 car il était écrasé par les règles plus récentes. */

/* =====================================================================
   ===== Aide / feedback
   ===================================================================== */
.criteria{ margin:.4rem 0 .2rem 1rem; padding:0; }
.criteria li{ margin:.1rem 0; }
.valid{ color:var(--ok); }
.invalid{ color:var(--err); }

/* =====================================================================
   ===== Form controls
   ===================================================================== */

/* Sélecteur “Résultats / page” (compact) */
select#per_page{
    width:70px; min-width:70px; max-width:70px; text-align:center;
    padding-left:.3rem; padding-right:.3rem;
}

input[type="text"], input[type="password"], input[type="email"],
input[type="number"], input[type="search"], select, textarea{
    display:inline-block;
    min-width:280px;
    padding: 7px 7px;
    border:1px solid var(--fc-border);
    border-radius:8px;
    background:var(--fc-bg);
    color:var(--fc-text);
    line-height:1.25;
    outline:none;
    transition:border-color .15s ease, box-shadow .15s ease, background-color .2s ease;
    font-size: 14px;
}
input[type="text"]:hover, input[type="password"]:hover, input[type="email"]:hover,
input[type="number"]:hover, input[type="search"]:hover, select:hover, textarea:hover{
    border-color:var(--fc-border-hover);
}
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus,
input[type="number"]:focus, input[type="search"]:focus, select:focus, textarea:focus{
    border-color:var(--fc-focus); box-shadow:0 0 0 3px var(--fc-ring);
}
input::placeholder, textarea::placeholder{ color:var(--fc-placeholder); }

/* États valid/invalid (JS) */
input.is-valid  { border-color:var(--ok) !important; box-shadow:0 0 0 3px rgba(22,163,74,.16); }
input.is-invalid{ border-color:var(--err) !important; box-shadow:0 0 0 3px rgba(220,38,38,.16); }

/* Désactivés */
input:disabled, select:disabled, textarea:disabled{
    background:#f8fafc; color:#94a3b8; cursor:not-allowed;
}

/* Labels & actions form */
form label{ display:block; font-weight:600; margin:.6rem 0 .25rem; color:#0f172a; }
.form-actions{ margin-top:1rem; display:flex; gap:.6rem; }

/* ===== Boutons natifs (look par défaut — surclassé par .btn si présent) ===== */
button, input[type="submit"], input[type="button"]{
    padding:.45rem .75rem; border:1px solid var(--fc-border); border-radius:8px;
    background:#f8fafc; color:#0f172a; cursor:pointer;
    transition:border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
button:hover, input[type="submit"]:hover, input[type="button"]:hover{
    background:#f1f5f9; border-color:var(--fc-border-hover);
}
button:focus, input[type="submit"]:focus, input[type="button"]:focus{
    border-color:var(--fc-focus); box-shadow:0 0 0 3px var(--fc-ring);
}
button:disabled, input[type="submit"]:disabled, input[type="button"]:disabled{ opacity:.6; cursor:not-allowed; }

/* Bouton “Réinitialiser” (form reset) quand OK) */
#submitBtn.btn-ok{
    background:var(--ok); border-color:var(--ok-dark); color:#fff;
}
#submitBtn.btn-ok:hover{ filter:brightness(.98); }
#submitBtn.btn-ok:focus{ box-shadow:0 0 0 3px rgba(22,163,74,.22); }

/* Select: même hauteur que inputs */
select{ height:38px; }

/* Chrome autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
    -webkit-text-fill-color:var(--fc-text);
    -webkit-box-shadow:0 0 0px 1000px var(--fc-bg) inset !important;
    transition:background-color 9999s ease-in-out 0s;
}

/* Variante compacte */
form.compact input[type="text"],
form.compact input[type="password"],
form.compact select{
    min-width:220px; padding:.35rem .5rem; border-radius:2px;
}

/* =====================================================================
   ===== Fiche utilisateur (une colonne)
   ===================================================================== */
.user-details{
    background:#f8fafc;
    border:1px solid #e5e7eb;
    border-radius:8px;
    padding:1.2rem 1.4rem;
    margin-bottom:1.2rem;
    line-height:1.55;
    font-size:14px;
    box-shadow:0 1px 2px rgba(0,0,0,.05);
}

.user-details h3{
    display:flex; align-items:center; gap:.5rem;
    font-size:16px; font-weight:600; margin:0 0 .8rem;
    color:#0f172a; border-bottom:2px solid var(--iut-magenta); padding-bottom:.3rem;
}
.user-details p{ margin:.25rem 0; color:#0f172a; }
.user-details strong{
    display:inline-block;
    /*width:10rem;*/
    font-weight:600;
    color:#1e293b; }
.user-details code{ background:#f1f5f9; padding:2px 6px; border-radius:4px; font-size:14px; color:#334155; }
.user-details .truncate{ display:inline-block; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.user-details.activation-identity{
    border-left:4px solid var(--iut-brand-teal);
}
.user-details.activation-identity strong{
    min-width:13.5rem;
}

/* Séparateur bas */
.user-details hr {
    border: 0;
    border-top: 1px solid #e5e7eb;
    margin: .9rem 0;
}

/* =====================================================================
   ===== Bouton principal (orange)
   ===================================================================== */
.btn-primary{
    display:inline-flex; align-items:center; padding:.45rem .9rem;
    border-radius:2px; border:1px solid #ea580c; background:#f97316; color:#fff;
    font-weight:600; text-decoration:none; transition:background-color .2s ease, transform .1s ease;
    cursor:pointer;
}
.btn-primary:hover{ background:#ea580c; transform:translateY(-1px); }
.btn-primary:active{ background:#c2410c; transform:translateY(0); }
.btn-primary:disabled, .btn-primary[disabled]{ opacity:.6; cursor:not-allowed; }

/* =====================================================================
   ===== Boutons de statut utilisateur (spécifiques)
   ===================================================================== */
.btn-userstatus{
    display:inline-flex; align-items:center; padding:.45rem .9rem;
    border-radius:2px; border:1px solid #ea580c; background:#f97316; color:#fff;
    font-weight:600; text-decoration:none; transition:background-color .2s ease, transform .1s ease;
    cursor:pointer;
    margin:5px 5px 0 0;
}
.btn-userstatus:hover{ background:#ea580c; transform:translateY(-1px); }
.btn-userstatus:active{ background:#c2410c; transform:translateY(0); }
.btn-userstatus:disabled, .btn-userstatus[disabled]{ opacity:.6; cursor:not-allowed; }
.btn-userstatus-primary{
    background:#b10f2e;
    border-color:#8f0c25;
    color:#fff;
}
.btn-userstatus-primary:hover{
    background:#8f0c25;
}
.btn-userstatus-secondary{
    background:#ffffff;
    border-color:#cbd5e1;
    color:#1e3a8a;
}
.btn-userstatus-secondary:hover{
    background:#f8fafc;
    border-color:#94a3b8;
}
.manager-login-actions{
    align-items:center;
    flex-wrap:wrap;
}
.portal-manager-link{
    text-align:left;
}

/* =====================================================================
   ===== Messages & hints
   ===================================================================== */
.error{
    color:#b91c1c; background:#fee2e2; border:1px solid #fecaca;
    padding:.6rem; border-radius:2px;
}
.info{
    color:#065f46; background:#e7f5ef; border:1px solid #a7f3d0;
    padding:.6rem; border-radius:2px;
}
.hint{ margin:.25rem 0 0; font-size:14px; }
.hint.ok{ color:var(--ok); } .hint.err{ color:var(--err); }

/* Liens utilisés comme boutons : jamais soulignés, même au focus */
a.btn,
a.btn-primary {
    text-decoration: none;
}
a.btn:hover,
a.btn:focus,
a.btn:active,
a.btn:focus-visible,
a.btn-primary:hover,
a.btn-primary:focus,
a.btn-primary:active,
a.btn-primary:focus-visible {
    text-decoration: none;   /* override du a:hover global */
    outline: none;           /* on gère le focus ring nous-mêmes */
    box-shadow: 0 0 0 3px var(--fc-ring);
    border-color: var(--fc-focus);
}

/* =====================================================================
   ===== Groupes input + bouton (inline)
   ===================================================================== */
.input-group {
    display: flex;
    gap: .5rem;
    align-items: center;
    flex-wrap: wrap;
}
.input-group input[type="email"],
.input-group input[type="text"] {
    flex: 1 1 auto;
    min-width: 412px;
    font-size: 14px;
}
select.full { /* réservé ; styles désactivés */ }

/* Petites animations */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}
.shake { animation: shake 0.2s ease-in-out; }

/* =====================================================================
   05. Modale, utilitaires et boutons
   ===================================================================== */
.confirm-modal[hidden]{ display:none!important; }
.confirm-modal{ position:fixed; inset:0; z-index:9999; display:grid; place-items:center; }
.confirm-backdrop{ position:absolute; inset:0; background:rgba(15,23,42,.45); backdrop-filter:blur(3px); }
.confirm-box{
    position:relative; width:min(420px, 90vw); background:#fff; border:1px solid #e5e7eb;
    border-radius:10px; box-shadow:0 12px 28px rgba(0,0,0,.18);
    padding:1.1rem 1.2rem 1rem; animation:confirm-in .18s ease-out;
}
@keyframes confirm-in{ from{opacity:.7;transform:translateY(6px);} to{opacity:1;transform:none;} }
.confirm-box h3{ margin:0 0 .5rem; font-size:17px; color:#0f172a; border-bottom:2px solid var(--iut-magenta); padding-bottom:.35rem; }
.confirm-message{ margin:.5rem 0 1rem; color:#334155; line-height:1.45; }
.confirm-actions{ display:flex; justify-content:flex-end; gap:.6rem; }
.btn-confirm{
    background:#f97316; border:1px solid #ea580c; color:#fff; font-weight:600; border-radius:8px;
    padding:.45rem .9rem; cursor:pointer;
}
.btn-confirm:hover{ background:#ea580c; }
.btn-cancel{
    background:#f8fafc; border:1px solid #e2e8f0; color:#0f172a; border-radius:8px;
    padding:.45rem .9rem; cursor:pointer;
}
.btn-cancel:hover{ background:#f1f5f9; }

/* =====================================================================
   ===== Helpers d’alignement inline
   ===================================================================== */
.inline-actions{display:flex;gap:.5rem;align-items:flex-start;flex-wrap:wrap}
.inline-actions .ldap-single-edit .input-group{display:flex;gap:.5rem;align-items:center}
.inline-actions form.inline{margin:0}
.kv-value .ldap-single-edit .hint{margin:.25rem 0 0}

/* Utilitaires contrôlés : à utiliser avec parcimonie pour supprimer les styles inline simples */
.iutid-inline { display: inline; }

/* Barre d’actions sous la recherche : Rechercher / Effacer / Exporter */
.actions-bar {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: .5rem;
}
.actions-bar form { display: inline-flex; margin: 0; }
.actions-bar .btn, .actions-bar .btn-primary { margin: 0; }


/* ===== Unification : tous les boutons .btn = même rendu que a.btn ===== */
button.btn,
input[type="submit"].btn,
input[type="button"].btn {
    display: inline-block;
    padding: .35rem .6rem;                 /* idem a.btn */
    border: 1px solid #e2e8f0;             /* idem a.btn */
    border-radius: 4px;                    /* idem a.btn */
    background: #f8fafc;                   /* idem a.btn */
    color: #0f172a;                        /* idem a.btn */
    text-decoration: none;                 /* cohérence */
    font: inherit;                         /* taille/Police héritées */
    line-height: 1.25;
    cursor: pointer;
}
button.btn:hover,
input[type="submit"].btn:hover,
input[type="button"].btn:hover {
    background: #f1f5f9;                   /* idem a.btn:hover */
    transform: translateY(-1px);
}
button.btn:focus,
button.btn:active,
button.btn:focus-visible,
input[type="submit"].btn:focus,
input[type="submit"].btn:active,
input[type="submit"].btn:focus-visible,
input[type="button"].btn:focus,
input[type="button"].btn:active,
input[type="button"].btn:focus-visible {
    text-decoration: none;
    outline: none;
    box-shadow: 0 0 0 3px var(--fc-ring);  /* même focus ring que les liens */
    border-color: var(--fc-focus);
}
button.btn:disabled,
input[type="submit"].btn:disabled,
input[type="button"].btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}

/* ===== Portail public IUTID ===== */
.topbar-subtitle{
    margin-left:.7rem;
    font-size:.95rem;
    opacity:.92;
    font-weight:400;
}
.portal-hero{
    padding:1rem 0 .5rem;
}
.portal-hero h1{
    margin:.2rem 0 .4rem;
    color:var(--iut-brand-indigo);
}
.portal-hero p{
    max-width:780px;
    color:#334155;
    font-size:1.05rem;
}
.portal-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:1rem;
    margin:1.2rem 0;
}
.portal-card{
    border:1px solid #e5e7eb;
    border-radius:10px;
    padding:1rem;
    background:#fff;
    box-shadow:0 1px 4px rgba(15,23,42,.06);
}
.portal-card h2{
    margin-top:0;
    color:var(--iut-brand-indigo);
}
.portal-card p{
    color:#475569;
    min-height:3rem;
}
.btn-primary{
    background:#eef2ff;
    border-color:#c7d2fe;
    color:#1d4ed8;
    font-weight:600;
}
.btn-primary:hover{
    background:#e0e7ff;
    border-color:#a5b4fc;
}
.portal-manager-link{
    margin-top:1.5rem;
    font-size:.92rem;
    text-align:right;
}

/* =====================================================================
   ===== IUTID v1.1 - Responsive public smartphone / desktop
   =====================================================================
   Objectif : améliorer la lisibilité et l'ergonomie tactile des pages
   publiques principalement utilisées depuis smartphone :
   - portail public ;
   - mot de passe oublié ;
   - réinitialisation via token ;
   - modification volontaire du mot de passe.
   Les pages manager conservent leur rendu desktop, avec quelques garde-fous
   non destructifs pour petits écrans.
   ===================================================================== */

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
    color: #0f172a;
    line-height: 1.45;
}

/* Conteneur plus confortable : large sur PC, plein écran propre sur mobile. */
.container{
    width: min(1600px, calc(100% - 2rem));
    margin: 1rem auto;
}

/* Bandeau : meilleure tenue sur smartphones. */
header.topbar{
    min-height: 64px;
    height: auto;
    gap: .75rem;
}
header.topbar > div:first-child{
    min-width: 0;
}
header.topbar strong{
    display: inline-block;
    font-size: 1.05rem;
    line-height: 1.15;
}
.topbar-subtitle{
    display: inline-block;
    line-height: 1.25;
}

/* Portail public. */
.portal-hero{
    padding: 1.1rem 0 .65rem;
}
.portal-hero h1{
    font-size: clamp(1.65rem, 5vw, 2.15rem);
    line-height: 1.15;
}
.portal-hero p{
    font-size: clamp(1rem, 2.8vw, 1.08rem);
    line-height: 1.5;
}
.portal-grid{
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    gap: 1rem;
}
.portal-card{
    display: flex;
    flex-direction: column;
    gap: .45rem;
    padding: 1.15rem;
}
.portal-card h2{
    font-size: clamp(1.22rem, 4vw, 1.45rem);
    line-height: 1.2;
    margin-bottom: .2rem;
}
.portal-card p{
    min-height: 0;
    margin: .25rem 0 .6rem;
    line-height: 1.5;
}
.portal-card .btn,
.portal-card .btn-primary{
    margin-top: auto;
}

/* Formulaires publics. */
.form-card{
    width: min(100%, 680px);
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
    padding: 1rem;
    box-shadow: 0 1px 4px rgba(15,23,42,.06);
}
.form-card label{
    font-size: .96rem;
    line-height: 1.3;
}
.form-card input[type="text"],
.form-card input[type="password"],
.form-card input[type="email"],
.form-card input[type="number"],
.form-card input[type="search"],
.form-card select,
.form-card textarea{
    width: 100%;
    max-width: 100%;
}
.form-card .muted{
    line-height: 1.45;
}
.actions,
.form-card .actions,
.form-actions{
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
    margin-top: 1rem;
}

/* Boutons : cibles tactiles suffisantes sans dégrader le desktop. */
.btn,
.btn-primary,
button.btn,
input[type="submit"].btn,
input[type="button"].btn{
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    padding: .55rem .85rem;
    line-height: 1.2;
    text-align: center;
}


/* Champs mot de passe avec bouton Afficher/Masquer.
   Desktop : bouton dans la continuité du champ.
   Mobile : bouton sous le champ en pleine largeur. */
.password-field{
    display: flex;
    align-items: stretch;
    gap: .5rem;
    width: 100%;
}
.password-field input[type="password"],
.password-field input[type="text"]{
    flex: 1 1 auto;
    min-width: 0;
}
.password-field .password-toggle{
    flex: 0 0 auto;
    white-space: nowrap;
    min-width: 94px;
}

/* Champs : évite le zoom iOS et les débordements. */
input[type="text"], input[type="password"], input[type="email"],
input[type="number"], input[type="search"], select, textarea{
    max-width: 100%;
    font-size: 16px;
}

/* Messages plus lisibles sur mobile. */
.info,
.error{
    line-height: 1.48;
    border-radius: 8px;
}

@media (max-width: 720px){
    body{
        background: #fff;
    }
    .container{
        width: 100%;
        margin: 0;
        padding: .85rem;
        border-radius: 0;
        box-shadow: none;
    }
    header.topbar{
        margin: -.85rem -.85rem 1rem;
        padding: .75rem .85rem .75rem calc(.85rem + 104px);
        background-size: 92px auto;
        background-position: .7rem center;
        border-bottom-width: 3px;
    }
    header.topbar strong{
        display: block;
        font-size: 1.18rem;
    }
    .topbar-subtitle{
        display: block;
        margin-left: 0;
        margin-top: .15rem;
        font-size: .86rem;
    }
    h1{
        font-size: 1.55rem;
        line-height: 1.2;
        margin: .8rem 0 .65rem;
    }
    .portal-hero{
        padding-top: .35rem;
    }
    .portal-grid{
        grid-template-columns: 1fr;
        margin: 1rem 0;
    }
    .portal-card{
        border-radius: 12px;
        padding: 1rem;
    }
    .portal-manager-link{
        text-align: center;
        margin: 1.2rem 0 .3rem;
    }
    .form-card{
        border-radius: 12px;
        padding: .95rem;
    }
    .form-card label{
        margin-top: .85rem;
    }
    .actions,
    .form-card .actions,
    .form-actions{
        flex-direction: column;
        align-items: stretch;
        gap: .55rem;
    }
    .actions .btn,
    .actions .btn-primary,
    .form-card .btn,
    .form-card .btn-primary,
    .form-actions .btn,
    .form-actions .btn-primary,
    .form-card button[type="submit"]{
        width: 100%;
    }
    .info,
    .error{
        padding: .75rem .8rem;
    }
    .criteria{
        margin-left: 0;
        padding-left: 1.2rem;
    }
    /* IUTID v1.26.14 : sur écran étroit, les champs mot de passe
       repassent en empilement vertical pour éviter que l'input soit écrasé
       par le bouton Afficher en pleine largeur. */
    .password-field{
        flex-direction: column;
        align-items: stretch;
        gap: .35rem;
    }
    .password-field input[type="password"],
    .password-field input[type="text"]{
        width: 100%;
        flex: 1 1 auto;
        min-width: 100%;
    }
    .password-field .password-toggle{
        width: 100%;
        min-width: 0;
    }

}

@media (max-width: 380px){
    header.topbar{
        padding-left: .85rem;
        padding-top: 4.6rem;
        background-size: 112px auto;
        background-position: .85rem .65rem;
    }
}

/* IUTID v1.26.53 - Harmonisation du logo du portail public
   ------------------------------------------------------------------
   Le portail public utilise désormais le même principe que l'espace
   manager : un logo explicite en balise <img>, et non plus un logo en
   background CSS. Cette approche évite les anomalies de rendu Safari/iOS
   liées à image-set() lorsqu'une variante haute densité n'est pas fournie. */
header.topbar.topbar-public{
    background-image: none;
    padding-left: 1rem;
    height: auto;
    min-height: 64px;
}
header.topbar.topbar-public .topbar-brand{
    display: flex;
    align-items: center;
    gap: .85rem;
    min-width: 0;
}
header.topbar.topbar-public .topbar-logo{
    width: 140px;
    max-width: 34vw;
    height: auto;
    flex: 0 0 auto;
}
header.topbar.topbar-public .topbar-title{
    min-width: 0;
}

@media (max-width: 720px){
    header.topbar.topbar-public{
        margin: -.85rem -.85rem 1rem;
        padding: .75rem .85rem;
        background-image: none;
        background-size: auto;
        background-position: initial;
        min-height: 64px;
        border-bottom-width: 3px;
    }
    header.topbar.topbar-public .topbar-brand{
        align-items: center;
        gap: .7rem;
    }
    header.topbar.topbar-public .topbar-logo{
        width: 108px;
        max-width: 32vw;
    }
    header.topbar.topbar-public .topbar-title strong{
        display: block;
        font-size: 1.08rem;
        line-height: 1.15;
        overflow-wrap: anywhere;
    }
    header.topbar.topbar-public .topbar-title .topbar-subtitle{
        display: block;
        margin: .18rem 0 0;
        font-size: .88rem;
    }
}

@media (max-width: 380px){
    header.topbar.topbar-public{
        padding: .7rem .85rem;
        min-height: 0;
    }
    header.topbar.topbar-public .topbar-logo{
        width: 96px;
        max-width: 30vw;
    }
    header.topbar.topbar-public .topbar-title strong{
        font-size: 1rem;
    }
}

/* =====================================================================
   ===== IUTID v1.03.2 - Messages quota mot de passe oublié
   =====================================================================
   Les messages de quota utilisent la classe .error côté PHP afin d'être
   clairement distingués du message générique anti-énumération.
   Ce bloc renforce simplement la lisibilité sur les pages publiques.
   ===================================================================== */
.form-card + .error,
.container > .error {
    color: #b91c1c;
    background: #fee2e2;
    border: 1px solid #fecaca;
    padding: .75rem .8rem;
    border-radius: 8px;
    line-height: 1.48;
}

/* Validation formulaire mot de passe oublié */
.success-inline{ color:#166534; }
.error-inline{ color:#991b1b; }
.warning{ color:#92400e; background:#fffbeb; border:1px solid #fde68a; border-radius:8px; padding:.75rem; }

/* IUTID v1.23.8 — Contrôle humain local sur la récupération de mot de passe */
.human-check {
    margin: 18px 0;
    padding: 16px;
    border: 1px solid rgba(91, 189, 181, 0.45);
    border-left: 4px solid #5bbdb5;
    border-radius: 8px;
    background: #f5fbfa;
}

.human-check-title {
    margin: 0 0 6px;
    font-size: 1.05rem;
    color: #32285b;
}

.human-check-intro {
    margin-top: 0;
}

.human-check-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 10px 0 14px;
}

.human-check-img {
    display: block;
    width: 220px;
    height: 70px;
    border: 1px solid #ccd8d7;
    border-radius: 6px;
    background: #fff;
}

/* Bouton compact de formulaire : petits contrôles hors colonnes Actions/tableaux.
   Pour les actions de tableau ou outils liés aux colonnes, utiliser .btn-compact. */
.btn-small {
    padding: 7px 11px;
    font-size: 0.92rem;
}

.hp-field {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
}

/* =====================================================================
   ===== IUTID v1.25.114 - Pied de page minimal institutionnel
   ===================================================================== */
.iutid-footer {
    margin-top: 32px;
    padding: 16px 8px;
    border-top: 1px solid #e5e7eb;
    color: #6b7280;
    font-size: 0.82rem;
    line-height: 1.5;
    text-align: center;
}

.iutid-footer a {
    color: inherit;
    text-decoration: none;
}

.iutid-footer a:hover,
.iutid-footer a:focus {
    text-decoration: underline;
}

.iutid-footer span,
.iutid-footer a {
    display: inline-block;
    margin: 0 0.12rem;
}

/* =====================================================================
   ===== Page connexion manager - homogénéisation visuelle globale
   v1.44.13.2.4
   ===================================================================== */
.manager-login-container{
    max-width:1500px;
}

.manager-login-card{
    max-width:520px;
    margin:1.1rem 0 0;
}

.manager-login-card h2{
    margin-top:0;
    margin-bottom:1.2rem;
    color:#0f172a;
}

.manager-login-form{
    margin:0;
}

.manager-login-field{
    margin-bottom:.85rem;
}

.manager-login-field label{
    margin:.35rem 0 .3rem;
}

.manager-login-field input[type="text"],
.manager-login-field input[type="password"]{
    width:100%;
    max-width:360px;
    box-sizing:border-box;
}

.manager-login-actions{
    display:flex;
    gap:.6rem;
    align-items:center;
    flex-wrap:wrap;
    margin-top:1.1rem;
}

.manager-login-actions .btn,
.manager-login-actions button.btn,
.manager-login-actions a.btn{
    min-height:38px;
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:0;
    text-decoration:none;
}

.manager-login-actions .btn-userstatus-primary,
.manager-login-actions button.btn-userstatus-primary{
    background:#b10f2e;
    border-color:#8f0c25;
    color:#ffffff;
    font-weight:600;
}

.manager-login-actions .btn-userstatus-primary:hover,
.manager-login-actions button.btn-userstatus-primary:hover,
.manager-login-actions .btn-userstatus-primary:focus,
.manager-login-actions button.btn-userstatus-primary:focus{
    background:#8f0c25;
    border-color:#7f0a20;
    color:#ffffff;
    text-decoration:none;
}

.manager-login-actions .btn-userstatus-secondary,
.manager-login-actions a.btn-userstatus-secondary{
    background:#ffffff;
    border-color:#cbd5e1;
    color:#1e3a8a;
    font-weight:600;
}

.manager-login-actions .btn-userstatus-secondary:hover,
.manager-login-actions a.btn-userstatus-secondary:hover,
.manager-login-actions .btn-userstatus-secondary:focus,
.manager-login-actions a.btn-userstatus-secondary:focus{
    background:#f8fafc;
    border-color:#94a3b8;
    color:#1e3a8a;
    text-decoration:none;
}

@media (max-width:720px){
    .manager-login-card{
        max-width:none;
    }
    .manager-login-field input[type="text"],
    .manager-login-field input[type="password"]{
        max-width:none;
    }
    .manager-login-actions{
        align-items:stretch;
    }
    .manager-login-actions .btn,
    .manager-login-actions button.btn,
    .manager-login-actions a.btn{
        width:100%;
    }
}