/* ============================================================
   MESRS — Pont visuel : chrome du tunnel de demande (pages
   autonomes des wizards). Chargé par l'en-tête partagé rhabillé
   (tunnel_page_header). Couleurs et typographie ; les champs des
   formulaires gardent leur fonctionnement d'origine.
   ============================================================ */

/* ── Barre d'en-tête du portail des téléprocédures ──────────── */
.mesrs-tunnelbar {
    background: #fff;
    border-bottom: 3px solid var(--mesrs-green, #1FA13C);
}
.mesrs-tunnelbar__inner {
    max-width: 1140px; margin: 0 auto; padding: .8rem 1rem;
    display: flex; align-items: center; gap: 1.25rem;
}
.mesrs-tunnelbar__brand img { height: 52px; width: auto; display: block; }
.mesrs-tunnelbar__title {
    flex: 1; display: flex; flex-direction: column; gap: .1rem;
    text-align: center;
}
.mesrs-tunnelbar__title strong {
    font-family: "Fraunces", Georgia, serif;
    color: var(--mesrs-navy, #0F2C5C); font-size: 1.25rem; line-height: 1.2;
}
.mesrs-tunnelbar__title span {
    color: #5b6573; font-size: .82rem;
    font-family: "Libre Franklin", sans-serif;
}
.mesrs-tunnelbar__armoiries { height: 52px; width: auto; }
@media (max-width: 640px) {
    .mesrs-tunnelbar__armoiries { display: none; }
    .mesrs-tunnelbar__title strong { font-size: 1.05rem; }
}
/* Sur les pages à layout, le header MESRS complet est déjà injecté. */
#wrapwrap .mesrs-tunnelbar { display: none !important; }

/* ── Bandeau de procédure (titre de la téléprocédure) ───────── */
.mesrs-procbar {
    background: var(--mesrs-navy, #0F2C5C);
    color: #fff; border-radius: 8px;
    max-width: 1140px; margin: 1.25rem auto;
    padding: .85rem 1.25rem;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    flex-wrap: wrap;
}
.mesrs-procbar__label {
    font-family: "Fraunces", Georgia, serif;
    font-size: 1.15rem; font-weight: 600;
}
.mesrs-procbar__retour {
    color: #fff; text-decoration: none; font-weight: 600; font-size: .9rem;
    border: 1px solid rgba(255, 255, 255, .55); border-radius: 6px;
    padding: .4rem .9rem; white-space: nowrap;
}
.mesrs-procbar__retour:hover {
    background: var(--mesrs-green, #1FA13C);
    border-color: var(--mesrs-green, #1FA13C); color: #fff;
}

/* ── Stepper (conteneur tunnel) ─────────────────────────────── */
.mesrs-tunnel-steps { max-width: 1140px; margin: 0 auto; padding: 0 1rem; }

/* ── Polissage doux des formulaires du tunnel (BS4 d'origine) ── */
body { font-family: "Libre Franklin", "Work Sans", Arial, sans-serif; }
.card { border-radius: 8px; }
.card .card-title, h1, h2, h3 {
    font-family: "Fraunces", Georgia, serif;
    color: var(--mesrs-navy, #0F2C5C);
}
.text-danger h1, h1.text-danger, h2.text-danger, h3.text-danger,
.card-title.text-danger { color: var(--mesrs-navy, #0F2C5C) !important; }
.form-control:focus, .custom-select:focus, select:focus {
    border-color: var(--mesrs-green, #1FA13C);
    box-shadow: 0 0 0 .2rem rgba(31, 161, 60, .15);
}

/* ════════════════════════════════════════════════════════════
   v3.5.1 — Espacement et profondeur des formulaires du tunnel
   ════════════════════════════════════════════════════════════ */

/* Le thème ftco impose un padding vertical massif sur chaque
   section : on le ramène à une respiration raisonnable. */
.ftco-section { padding: 1.25rem 0 2.5rem !important; }
.ftco-section > .container.py-5,
.ftco-section .container.py-5 { padding-top: .5rem !important; padding-bottom: 1rem !important; }

/* <br/> de calage hérités de l'ancien chrome (niveaux supérieurs) */
.mesrs-tunnelbar ~ br { display: none; }

/* Fond doux : les cartes blanches reprennent du relief */
body { background-color: var(--mesrs-bg-soft, #F4F7FB); }
.mesrs-tunnelbar { position: relative; z-index: 2; }

/* ── Cartes de formulaire ───────────────────────────────────── */
.card {
    border: 1px solid var(--mesrs-line, #E2E8F0);
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(15, 44, 92, .07);
    background: #fff;
}

/* Titres de sections de formulaire (étaient rouges, h4/h5) */
.card h4, .card h5,
h4.text-danger, h5.text-danger,
h4.font-weight-bold, h5.font-weight-bold {
    font-family: "Fraunces", Georgia, serif;
    color: var(--mesrs-navy, #0F2C5C) !important;
    letter-spacing: .01em;
}
.card h4 .fas, .card h5 .fas,
h4.text-danger .fas, h5.text-danger .fas {
    color: var(--mesrs-green, #1FA13C);
}

/* ── Champs ─────────────────────────────────────────────────── */
label, .form-label {
    color: var(--mesrs-navy, #0F2C5C);
    font-weight: 600; font-size: .92rem;
    margin-bottom: .35rem;
}
label .fas, label .far, label .fa {
    color: var(--mesrs-blue, #1C5BA6);
}
.form-control, .custom-select, select.form-control,
input[type="text"], input[type="date"], input[type="email"],
input[type="number"], input[type="tel"], textarea, select {
    border: 1.5px solid var(--mesrs-line, #E2E8F0);
    border-radius: 8px;
    padding: .6rem .85rem;
    background-color: #fff;
    color: var(--mesrs-ink, #11203A);
    transition: border-color .15s, box-shadow .15s;
}
.form-control::placeholder, input::placeholder, textarea::placeholder {
    color: #98A2B3;
}
.form-group { margin-bottom: 1.15rem; }

/* ── Boutons du tunnel ──────────────────────────────────────── */
.card .btn, form .btn {
    border-radius: 8px; font-weight: 600;
    padding: .55rem 1.4rem;
}

/* ── Pièces / uploads ───────────────────────────────────────── */
input[type="file"] {
    border: 1.5px dashed var(--mesrs-line, #E2E8F0);
    border-radius: 8px; padding: .55rem .85rem;
    background: var(--mesrs-bg-soft, #F4F7FB); width: 100%;
}
input[type="file"]:hover { border-color: var(--mesrs-green, #1FA13C); }

/* ════════════════════════════════════════════════════════════
   v3.5.3 — Bandeaux de titre des autres directions
   (type_banner générique 271 appels, _desup 24, _dexco 8,
   _universite 29) : même langage que la barre DOB, en pur CSS —
   leur logique de libellés reste intacte.
   ════════════════════════════════════════════════════════════ */
.type-banner {
    background: var(--mesrs-navy, #0F2C5C) !important;
    background-image: none !important;
    border-radius: 8px;
    max-width: 1140px;
    margin: 1.25rem auto !important;
    padding: .55rem .75rem !important;
    align-items: center;
}
.type-banner span, .type-banner b {
    color: #fff !important;
    font-family: "Fraunces", Georgia, serif !important;
}
.type-banner b > span {
    margin-left: 0 !important;
    font-size: 1.15rem !important;
    font-weight: 600;
    letter-spacing: .01em;
}
.type-banner .retour-button {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, .55) !important;
    border-radius: 6px !important;
    font-weight: 600;
    white-space: nowrap;
}
.type-banner .retour-button:hover {
    background: var(--mesrs-green, #1FA13C) !important;
    border-color: var(--mesrs-green, #1FA13C) !important;
}

/* Bandeaux d'étape et d'information (ÉTAPE 4/4, CONTACTS DU
   CANDIDAT, consignes de paiement…) : teinte charte. */
.alert-info {
    background-color: #EAF2FA !important;
    border-color: #CBDDF0 !important;
    color: var(--mesrs-navy, #0F2C5C) !important;
    border-radius: 8px;
}

/* ════════════════════════════════════════════════════════════
   v3.8.4 — Affinages mobile du tunnel (≤ 640px)
   Le stepper, le masquage des armoiries et l'empilement des
   formulaires sont déjà gérés ailleurs ; on traite ici le bandeau
   de procédure, le titre d'en-tête et la densité des cartes.
   ════════════════════════════════════════════════════════════ */
@media (max-width: 640px) {
    /* Bandeau de procédure : libellé et retour empilés proprement */
    .mesrs-procbar {
        flex-direction: column; align-items: flex-start; gap: .6rem;
        margin: 1rem auto; padding: .7rem .9rem;
    }
    .mesrs-procbar__label { font-size: 1rem; }
    .mesrs-procbar__retour { width: 100%; text-align: center; }

    /* En-tête : titre du portail plus compact */
    .mesrs-tunnelbar__inner { padding: .6rem .9rem; gap: .75rem; }
    .mesrs-tunnelbar__title strong { font-size: .98rem; }
    .mesrs-tunnelbar__title span { font-size: .72rem; }
    .mesrs-tunnelbar__brand img { height: 40px; }

    /* Cartes et sections : densité adaptée au pouce */
    .card { border-radius: 10px; }
    .card .btn, form .btn { width: 100%; }
    .ftco-section { padding: .75rem 0 1.75rem !important; }
}