/* ==========================================================================
   OIPDES — formulaires du parcours demandeur, espace entreprise, espace agent
   Complète oipdes_site.css (mêmes variables, même charte).
   ========================================================================== */

/* ---------------------------------------------------------- Étapes */
.os-etapes-flux { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin: 0 0 34px; padding: 0; counter-reset: f; }
.os-etapes-flux li { counter-increment: f; position: relative; text-align: center; padding-top: 50px; font-weight: 600; font-size: .92rem; color: var(--os-texte-doux); }
.os-etapes-flux li::before { content: counter(f); position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 1; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid var(--os-ligne); color: var(--os-texte-doux); font-family: var(--os-titre); font-size: 1.4rem; }
.os-etapes-flux li::after { content: ""; position: absolute; top: 19px; left: -50%; width: 100%; height: 3px; background: var(--os-ligne); }
.os-etapes-flux li:first-child::after { display: none; }
.os-etapes-flux li.is-fait { color: var(--os-encre); }
.os-etapes-flux li.is-fait::before { content: "✓"; background: var(--os-vert); border-color: var(--os-vert); color: #fff; font-family: var(--os-corps); font-size: 1.1rem; font-weight: 700; }
.os-etapes-flux li.is-fait::after { background: var(--os-vert); }
.os-etapes-flux li.is-courant { color: var(--os-encre); }
.os-etapes-flux li.is-courant::before { background: var(--os-orange); border-color: var(--os-orange); color: #000; }
.os-etapes-flux li.is-courant::after { background: linear-gradient(90deg, var(--os-vert), var(--os-orange)); }

/* ---------------------------------------------------------- Carte de formulaire */
.os-carte { background: #fff; border: 1px solid var(--os-ligne); border-radius: 18px; box-shadow: var(--os-ombre); padding: 36px; }
.os-carte + .os-carte { margin-top: 24px; }
.os-bloc { border: 0; margin: 0 0 30px; padding: 0; min-width: 0; }
.os-bloc:last-of-type { margin-bottom: 10px; }
.oipdes-site .os-bloc legend { float: none; width: auto; display: flex; align-items: center; gap: 12px; font-family: var(--os-titre); font-size: 1.6rem; letter-spacing: .02em; text-transform: uppercase; color: var(--os-encre); margin: 0 0 18px; padding: 0; line-height: 1; }
.os-bloc legend span { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: color-mix(in srgb, var(--c, var(--os-orange)) 16%, #fff); color: var(--os-encre); font-size: 1.15rem; }
.os-grille { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 22px; }
.os-grille--3 { grid-template-columns: repeat(3, 1fr); }
.os-champ .os-aide { font-size: .84rem; color: var(--os-texte-doux); }
.oipdes-site .os-champ input[type="file"] { padding: 10px; background: var(--os-creme); }
.os-choix { display: flex; gap: 10px; flex-wrap: wrap; }
.os-choix label { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 1.5px solid var(--os-ligne); border-radius: 999px; cursor: pointer; font-weight: 600; color: var(--os-encre); background: #fff; }
.os-choix input { position: absolute; opacity: 0; pointer-events: none; }
.os-choix label:has(input:checked) { border-color: var(--os-vert); background: #e7f4ec; color: var(--os-vert-fonce); }
.os-choix label:has(input:focus-visible) { outline: 3px solid var(--os-jaune); outline-offset: 2px; }
.os-actions { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--os-ligne); }
.os-actions__note { font-size: .9rem; color: var(--os-texte-doux); }
.os-cache { display: none !important; }
.os-connexion { max-width: 520px; margin: 0 auto; }
.os-connexion__pied { text-align: center; margin-top: 20px; color: var(--os-texte-doux); }

/* ---------------------------------------------------------- select2 aux couleurs OIPDES */
.oipdes-site .select2-container { width: 100% !important; font-size: 1rem; }
.oipdes-site .select2-container--default .select2-selection--single { height: 48px; border: 1.5px solid var(--os-ligne); border-radius: 10px; display: flex; align-items: center; }
.oipdes-site .select2-container--default .select2-selection--single .select2-selection__rendered { padding-left: 14px; padding-right: 36px; color: var(--os-texte); line-height: 1.3; }
.oipdes-site .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #8b8478; }
.oipdes-site .select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px; right: 8px; }
.oipdes-site .select2-container--default .select2-selection--multiple { min-height: 48px; border: 1.5px solid var(--os-ligne); border-radius: 10px; padding: 4px 8px; }
.oipdes-site .select2-container--default .select2-selection--multiple .select2-selection__choice { background: #e7f4ec; border: 1px solid #b9dfc8; color: var(--os-vert-fonce); border-radius: 999px; padding: 2px 10px 2px 22px; margin-top: 6px; }
.oipdes-site .select2-container--default.select2-container--focus .select2-selection--multiple,
.oipdes-site .select2-container--default.select2-container--open .select2-selection--single { border-color: var(--os-vert); box-shadow: 0 0 0 3px rgba(6,132,64,.15); }
.select2-container--open .select2-dropdown { border: 1.5px solid var(--os-vert, #068440); border-radius: 10px; overflow: hidden; font-family: 'Barlow', sans-serif; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: #068440; }
.select2-container--default .select2-results__option--selected { background: #e7f4ec; }
.select2-container--default .select2-search--dropdown .select2-search__field { border: 1.5px solid #e8e1d5; border-radius: 8px; padding: 8px 10px; }
.select2-results__option { padding: 9px 12px; }

/* ---------------------------------------------------------- Pages historiques du parcours (cursus, situation, résumé…) */
.oipdes-flux .oe_structure { background: var(--os-creme); padding: 48px 16px 72px; }
.oipdes-flux .form-container { max-width: 1040px; margin: 0 auto; background: #fff; border: 1px solid var(--os-ligne); border-radius: 18px; box-shadow: var(--os-ombre); padding: 36px; }
.oipdes-flux .form-container > .row:first-child { margin: 0; }
.oipdes-flux .form-title { font-family: var(--os-titre); font-size: 2.2rem; color: var(--os-encre); text-align: center; margin-bottom: 22px; text-transform: uppercase; letter-spacing: .02em; }
.oipdes-flux h3, .oipdes-flux h4, .oipdes-flux h5 { font-family: var(--os-titre); text-transform: uppercase; letter-spacing: .02em; }
.oipdes-flux .text-warning { color: var(--os-orange) !important; }
.oipdes-flux .text-success { color: var(--os-vert) !important; }
.oipdes-flux .form-field { position: relative; }
.oipdes-flux .form-field > i { position: absolute; top: 50%; left: 13px; transform: translateY(-50%); color: var(--os-texte-doux); pointer-events: none; }
.oipdes-flux .form-field input, .oipdes-flux .form-field select, .oipdes-flux .form-field textarea,
.oipdes-flux .form-container .form-control, .oipdes-flux .form-container select {
    width: 100%; font: inherit; font-size: 1rem; padding: 11px 14px; border-radius: 10px; border: 1.5px solid var(--os-ligne); background: #fff; color: var(--os-texte); min-height: 46px;
}
.oipdes-flux .form-container .form-field > i ~ input, .oipdes-flux .form-container .form-field > i ~ select,
.oipdes-flux .form-container .form-field > i ~ textarea { padding-left: 40px; }
.oipdes-flux .form-field input:focus, .oipdes-flux .form-field select:focus, .oipdes-flux .form-container .form-control:focus { border-color: var(--os-vert); outline: none; box-shadow: 0 0 0 3px rgba(6,132,64,.15); }
.oipdes-flux label, .oipdes-flux .form-label { font-weight: 600; font-size: .93rem; color: var(--os-encre); margin-bottom: 6px; }
.oipdes-flux .form-actions { text-align: center; margin-top: 28px; }
.oipdes-flux .btn { border-radius: 999px; font-weight: 700; padding: .65em 1.3em; border-width: 2px; }
.oipdes-flux .btn-warning, .oipdes-flux .form-actions button { background: var(--os-orange); border-color: var(--os-orange); color: #000; }
.oipdes-flux .btn-warning:hover, .oipdes-flux .form-actions button:hover { background: #f58f3a; border-color: #f58f3a; color: #000; }
.oipdes-flux .btn-success, .oipdes-flux .btn-primary { background: var(--os-vert); border-color: var(--os-vert); color: #fff; }
.oipdes-flux .btn-success:hover, .oipdes-flux .btn-primary:hover { background: var(--os-vert-fonce); border-color: var(--os-vert-fonce); color: #fff; }
.oipdes-flux .btn-danger { background: #fff; border-color: #c2410c; color: #c2410c; }
.oipdes-flux .btn-danger:hover { background: #c2410c; color: #fff; }
.oipdes-flux .alert { border-radius: 12px; border: 0; border-left: 5px solid currentColor; }
.oipdes-flux .alert-success { background: #e7f4ec; color: var(--os-vert-fonce); }
.oipdes-flux .alert-danger { background: #fdeee2; color: #8a3d05; }
.oipdes-flux .table { --bs-table-bg: transparent; }
.oipdes-flux .table thead th, .oipdes-flux .table tr[style*="background"] { background: var(--os-creme) !important; color: var(--os-encre); font-weight: 700; }
.oipdes-flux .label { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .8rem; }
.oipdes-flux .label-success { background: #e7f4ec; color: var(--os-vert-fonce); }
.oipdes-flux .label-danger { background: #fdeee2; color: #8a3d05; }
.oipdes-flux hr { border-color: var(--os-ligne); opacity: 1; }

/* ---------------------------------------------------------- Espaces (entreprise, agent) */
.os-espace { background: var(--os-creme); min-height: 70vh; padding: 32px 0 72px; }
.os-espace__grille { display: grid; grid-template-columns: 260px 1fr; gap: 28px; align-items: start; }
.os-espace__nav { position: sticky; top: 110px; background: #fff; border: 1px solid var(--os-ligne); border-radius: 16px; padding: 14px; }
.os-espace__qui { display: flex; gap: 12px; align-items: center; padding: 8px 8px 16px; border-bottom: 1px solid var(--os-ligne); margin-bottom: 10px; }
.oipdes-site .os-espace__avatar { line-height: 1; }
.os-espace__avatar { flex: none; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--os-vert) 14%, #fff); color: var(--os-vert-fonce); font-family: var(--os-titre); font-size: 1.6rem !important; }
.os-espace__qui strong { display: block; color: var(--os-encre); line-height: 1.2; font-size: .98rem; }
.os-espace__qui span { font-size: .82rem; color: var(--os-texte-doux); }
.os-espace__groupe { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--os-texte-doux); padding: 14px 10px 6px; }
.oipdes-site .os-espace__lien { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 10px; border-radius: 10px; color: var(--os-encre); font-weight: 600; font-size: .95rem; }
.oipdes-site .os-espace__lien:hover { background: var(--os-creme); color: var(--os-vert); }
.oipdes-site .os-espace__lien.is-actif { background: #e7f4ec; color: var(--os-vert-fonce); box-shadow: inset 3px 0 0 var(--os-vert); }
.os-espace__lien b { font-weight: 700; font-size: .78rem; min-width: 26px; text-align: center; padding: 2px 8px; border-radius: 999px; background: var(--os-creme); color: var(--os-texte); font-variant-numeric: tabular-nums; }
.os-espace__lien.is-actif b { background: #fff; }
.os-espace__deco { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--os-ligne); }
.os-espace__tete { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.oipdes-site .os-espace__tete h1 { font-size: clamp(2rem, 3.6vw, 2.8rem); margin: 0; }
.os-espace__tete p { margin: 4px 0 0; color: var(--os-texte-doux); }
.os-espace__fil { font-size: .85rem; color: var(--os-texte-doux); margin-bottom: 6px; }

.os-panneau { background: #fff; border: 1px solid var(--os-ligne); border-radius: 16px; padding: 24px; }
.os-panneau + .os-panneau, .os-panneau + .os-kpis, .os-kpis + .os-panneau { margin-top: 22px; }
.os-panneau__tete { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.oipdes-site .os-panneau__tete h2 { font-size: 1.6rem; margin: 0; }
.os-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.oipdes-site a.os-kpi, .os-kpi { display: block; background: #fff; border: 1px solid var(--os-ligne); border-radius: 14px; padding: 18px 18px 16px; position: relative; overflow: hidden; color: var(--os-texte); }
.os-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--c, var(--os-vert)); }
.oipdes-site a.os-kpi:hover { border-color: var(--c, var(--os-vert)); color: var(--os-texte); }
.os-kpi__val { font-family: var(--os-titre); font-size: 2.6rem; line-height: 1; color: var(--os-encre); font-variant-numeric: tabular-nums; }
.os-kpi__lib { font-weight: 700; color: var(--os-encre); margin-top: 4px; font-size: .95rem; }
.os-kpi__note { font-size: .82rem; color: var(--os-texte-doux); }

/* Tableaux */
.os-outils { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.oipdes-site .os-recherche { position: relative; }
.oipdes-site .os-recherche input { padding: 10px 14px 10px 38px; border: 1.5px solid var(--os-ligne); border-radius: 999px; font: inherit; font-size: .95rem; min-width: 240px; background: #fff; }
.os-recherche svg { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--os-texte-doux); }
.oipdes-site .os-select-filtre { padding: 10px 14px; border: 1.5px solid var(--os-ligne); border-radius: 999px; font: inherit; font-size: .95rem; background: #fff; }
.os-table-wrap { overflow-x: auto; margin: 0 -24px; padding: 0 24px; }
.oipdes-site table.os-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.os-table th { text-align: left; font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; color: var(--os-texte-doux); font-weight: 700; padding: 10px 12px; border-bottom: 1px solid var(--os-ligne); white-space: nowrap; }
.os-table td { padding: 13px 12px; border-bottom: 1px solid var(--os-ligne); vertical-align: middle; }
.os-table tr:last-child td { border-bottom: 0; }
.os-table tbody tr:hover td { background: #fcfaf6; }
.os-table td.os-num { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--os-texte-doux); }
.os-table .os-nom { font-weight: 700; color: var(--os-encre); }
.os-table .os-ref { display: block; font-size: .8rem; color: var(--os-texte-doux); }
.os-table td.os-fin { text-align: right; white-space: nowrap; }
.os-vide-ligne td { text-align: center; color: var(--os-texte-doux); padding: 34px 12px; }
.oipdes-site .os-btn--petit { padding: .5em 1em; font-size: .85rem; }
.oipdes-site .os-btn--danger { background: #fff; border-color: #e6b8a2; color: #9a3412; }
.oipdes-site .os-btn--danger:hover { background: #9a3412; border-color: #9a3412; color: #fff; }
.os-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 16px; font-size: .9rem; color: var(--os-texte-doux); flex-wrap: wrap; }
.os-pagination__liens { display: flex; gap: 8px; }

/* Badges d'état */
.os-badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; white-space: nowrap; background: var(--os-creme); color: var(--os-texte); }
.os-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .8; }
.os-badge--ouverte { background: #fff4e5; color: #9a4b07; }
.os-badge--valide { background: #e7f4ec; color: var(--os-vert-fonce); }
.os-badge--brouillon { background: #f1efe9; color: #6b6458; }
.os-badge--nouveau { background: #fff4e5; color: #9a4b07; }
.os-badge--traite { background: #e7f4ec; color: var(--os-vert-fonce); }
.os-badge--publie { background: #e7f4ec; color: var(--os-vert-fonce); }
.os-badge--masque { background: #f1efe9; color: #6b6458; }

/* Fiches */
.os-fiche { display: grid; grid-template-columns: 1fr 340px; gap: 22px; align-items: start; }
.os-def { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 0; }
.os-def > div { padding: 12px 0; border-bottom: 1px solid var(--os-ligne); min-width: 0; }
.os-def dt { font-size: .82rem; color: var(--os-texte-doux); font-weight: 600; margin: 0 0 2px; }
.os-def dd { margin: 0; color: var(--os-encre); font-weight: 600; overflow-wrap: anywhere; }
.os-def dd.os-vide-val { color: #a39b8e; font-weight: 400; }
.os-def--1 { grid-template-columns: 1fr; }
.os-identite { display: flex; gap: 16px; align-items: center; margin-bottom: 18px; }
.os-identite .os-espace__avatar { width: 56px; height: 56px; font-size: 1.9rem; }
.oipdes-site .os-identite h2 { margin: 0; font-size: 1.9rem; }
.os-identite p { margin: 2px 0 0; color: var(--os-texte-doux); font-size: .92rem; }
.os-pj { display: flex; flex-direction: column; gap: 8px; }
.oipdes-site .os-pj a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--os-ligne); border-radius: 10px; color: var(--os-encre); font-weight: 600; font-size: .92rem; }
.oipdes-site .os-pj a:hover { border-color: var(--os-vert); color: var(--os-vert); }
.os-pj svg { width: 18px; height: 18px; color: var(--os-orange); flex: none; }
.os-encart { background: #fff; border: 1px solid var(--os-ligne); border-radius: 16px; padding: 22px; position: sticky; top: 110px; border-top: 5px solid var(--os-vert); }
.oipdes-site .os-encart h3 { font-size: 1.5rem; margin-bottom: 8px; }
.os-encart p { font-size: .93rem; color: var(--os-texte-doux); }
.os-encart .os-champ { margin-bottom: 14px; }
.os-liste-simple { list-style: none; display: grid; gap: 10px; margin: 0; padding: 0; }
.os-liste-simple li { padding: 12px 14px; border: 1px solid var(--os-ligne); border-radius: 12px; }
.os-liste-simple strong { color: var(--os-encre); }
.os-liste-simple span { display: block; font-size: .88rem; color: var(--os-texte-doux); }
.os-miniature { width: 92px; height: 56px; object-fit: cover; border-radius: 8px; background: var(--os-creme); }

@media (max-width: 1080px) {
    .os-kpis { grid-template-columns: repeat(2, 1fr); }
    .os-fiche { grid-template-columns: 1fr; }
    .os-encart { position: static; }
}
@media (max-width: 900px) {
    .os-espace__grille { grid-template-columns: 1fr; }
    .os-espace__nav { position: static; display: flex; gap: 6px; overflow-x: auto; padding: 8px; align-items: center; }
    .os-espace__qui, .os-espace__groupe, .os-espace__deco { display: none; }
    .oipdes-site .os-espace__lien { white-space: nowrap; flex: none; }
    .os-grille, .os-grille--3 { grid-template-columns: 1fr; }
    .os-carte { padding: 24px 18px; }
    .oipdes-flux .form-container { padding: 22px 16px; }
}
@media (max-width: 600px) {
    .os-etapes-flux li { font-size: .78rem; padding-top: 46px; }
    .os-def { grid-template-columns: 1fr; }
    .os-kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
    .os-kpi__val { font-size: 2.1rem; }
    .os-panneau { padding: 18px; }
    .os-table-wrap { margin: 0 -18px; padding: 0 18px; }
    .oipdes-site .os-recherche input { min-width: 0; width: 100%; }
    .os-outils, .os-recherche { width: 100%; }
}

/* ---------------------------------------------------------- Page de connexion Odoo */
.os-login .oe_login_form, .os-login .oe_reset_password_form, .os-login .oe_signup_form { max-width: none !important; margin: 0 !important; padding: 0 !important; }
.os-login label { font-weight: 600; font-size: .93rem; color: var(--os-encre); margin-bottom: 6px; }
.os-login .form-control { font: inherit; font-size: 1rem; padding: 12px 14px; border-radius: 10px; border: 1.5px solid var(--os-ligne); box-shadow: none; }
.os-login .form-control:focus { border-color: var(--os-vert); box-shadow: 0 0 0 3px rgba(6,132,64,.15); }
.os-login .btn-primary { background: var(--os-vert) !important; border-color: var(--os-vert) !important; color: #fff !important; border-radius: 999px; font-weight: 700; padding: .8em 1.4em; }
.os-login .btn-primary:hover { background: var(--os-vert-fonce) !important; border-color: var(--os-vert-fonce) !important; }
.os-login a { color: var(--os-vert); }
.os-login .alert { border-radius: 10px; }

/* ---------------------------------------------------------- Différenciation des espaces */
.os-espace-bandeau { border-bottom: 1px solid var(--os-ligne); }
.os-espace-bandeau .os-wrap { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; min-height: 52px; padding-top: 10px; padding-bottom: 10px; }
.os-espace-bandeau strong { font-family: var(--os-titre); font-size: 1.35rem; letter-spacing: .04em; text-transform: uppercase; line-height: 1; padding: 6px 12px; border-radius: 8px; color: #fff; }
.os-espace-bandeau span { font-size: .95rem; font-weight: 600; }
.os-espace-bandeau--entreprise { background: #fff4e5; color: #8a4306; }
.os-espace-bandeau--entreprise strong { background: var(--os-orange); color: #000; }
.os-espace-bandeau--agent { background: #e7f4ec; color: var(--os-vert-fonce); }
.os-espace-bandeau--agent strong { background: var(--os-vert); }
.os-espace--entreprise .os-espace__nav { border-top: 4px solid var(--os-orange); }
.os-espace--agent .os-espace__nav { border-top: 4px solid var(--os-vert); }
.os-espace--entreprise .os-espace__avatar { background: #fff1e0; color: #8a4306; }
.oipdes-site .os-espace--entreprise .os-espace__lien.is-actif { background: #fff4e5; color: #8a4306; box-shadow: inset 3px 0 0 var(--os-orange); }
.oipdes-site .os-espace--entreprise .os-espace__lien:hover { color: #b45309; }

.os-login--entreprise .os-carte { border-top: 5px solid var(--os-orange); }
.os-login--agent .os-carte { border-top: 5px solid var(--os-vert); }