/* ===== Design tokens page d'accueil (Home) — Figma NATS-29 ===== */
:root {
    --primary: #e52421;
    --primary-dark: #8b1229;
    --primary-text: #7a1022;
    --primary-bg: #faeaec;
    --primary-bg-light: rgba(229, 36, 33, 0.08);
    --primary-border: rgba(229, 36, 33, 0.12);
    --text-dark: #101828;
    --text-secondary: #62788a;
    --home-bg-page: #fffcfc;
    --home-bg-section: #fff4f5;
    --home-glass-78: rgba(255, 255, 255, 0.78);
    --home-glass-82: rgba(255, 255, 255, 0.82);
    --home-glass-84: rgba(255, 255, 255, 0.84);
    --home-glass-sand: #e0d9cf;
    --home-border-subtle: rgba(0, 0, 0, 0.07);
    --home-feature-icon-border: rgba(229, 36, 33, 0.5);
    --font-primary: "Clash Display";
    --font-secondary: "General Sans";
}

/* Fond de page — gradient rose-crème Figma */
html, body {
    background: linear-gradient(180deg, #FFFCFC 0%, #FFF4F5 100%) !important;
    background-attachment: fixed !important;
    min-height: 100vh;
}

#main-content {
    padding: 0 !important;
}

.mud-layout {
    background: transparent !important;
}

.mud-main-content {
    min-height: calc(100vh - 64px);
    margin-top: 56px !important;
    padding-bottom: 4rem;
    background-color: transparent;
}

h1, h2, h3, h4, h5, h6 {
    color: #101828 !important;
    font-weight: 600 !important;
}

h1 {
    color: #101828 !important;
    font-family: 'Clash Display', 'General Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial !important;
    font-size: 3.5rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.02 !important;
}

h2 {
    font-size: 1.75rem !important;
}

h3 {
    font-size: 1.5rem !important;
}

h4 {
    font-size: 1.25rem !important;
}

h5 {
    font-size: 1rem !important;
}

h6 {
    font-size: 1rem !important;
}

a, .btn-link {
    color: #006bb7;
}

.mud-fab {
    height: 50px !important;
    width: 50px !important;
}

/* ===== BOUTONS ===== */
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: var(--primary) !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 22px !important;
    height: 52px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    font-family: "Clash Display" !important;
    text-transform: inherit !important;
    justify-content: center;
}

.btn-primary:hover {
    transform: scale(1.015);
}

.btn-primary:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--home-glass-82) !important;
    border: 1px solid var(--primary) !important;
    border-radius: 4px !important;
    color: var(--text-dark) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 22px !important;
    height: 52px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    text-transform: inherit !important;
}

.btn-secondary:hover {
    transform: scale(1.015);
}

.btn-secondary:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.btn-tertiary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #FFFFFF !important;
    border: 1px solid var(--primary) !important;
    border-radius: 4px !important;
    color: var(--primary) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 22px !important;
    height: 52px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    text-transform: inherit !important;
}

.btn-tertiary:hover {
    transform: scale(1.015);
}

.btn-tertiary:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.form-check-input:checked {
    background-color: #0d6efd; /* couleur Bootstrap bleue */
    border-color: #0d6efd;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-errors {
    padding-left: 20px;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.footer {
    background: #fff;
    overflow-x: hidden;
}

.footer-right {
    display: flex;
    justify-content: end;
}

    .footer-right .footer-list {
        display: flex;
        flex-direction: column;
        gap: .5rem;
        max-width: 300px;
    }

        .footer-right .footer-list h2 {
            font-size: 1.25rem;
            color: #00008c;
            font-weight: 600;
        }

.mud-link {
    text-underline-offset: 4px !important;
}

.footer-logo {
    height: 50px;
}

.footer-bottom {
    text-align: center;
    margin-top: 40px;
    font-size: 12px;
    color: #000;
    overflow: visible;
    white-space: nowrap;
}

MudLayout {
    display: flex;
    flex-direction: column;
    flex: 1;
}
/* Bloc de chaque ligne de consentement */
.consent-item {
    margin-bottom: 12px;
    display: flex;
    align-items: center;
}

/* Label principal */
.consent-label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 1rem;
    color: #1F1F1F;
}

    /* Checkboxes → NOIR */
    .consent-label input[type="checkbox"] {
        width: 20px;
        height: 20px;
        margin-right: 12px;
        cursor: pointer;
        accent-color: #000000; /* noir */
    }

/* Texte du consentement */
.consent-text {
    font-size: 1.05rem;
    color: #1F1F1F;
}

/* Étoile obligatoire → ROUGE */
.asterisque {
    color: #FF0000;
    font-weight: bold;
}
/* Menu latéral sombre avec texte blanc */
.menu-inverse {
    background-color: #1e1e1e !important;
    color: #ffffff !important;
}

    .menu-inverse .mud-nav-link .mud-icon-root {
        color: #ffffff !important;
    }

    .menu-inverse .mud-nav-link {
        color: #ffffff !important;
    }

/* Assurer que le drawer MudBlazor est visible */
.mud-drawer {
    z-index: 1300 !important;
}

.mud-drawer-open {
    display: block !important;
}

.mud-overlay {
    z-index: 1200 !important;
    position: fixed !important;
}

#table-fixed-header .mud-table-container {
    max-height: calc(100vh - 272px);
}

@media (max-width: 600px) {
    .mud-table.mud-xs-table .mud-table-cell {
        text-align: right !important;
    }

    .mud-table .mud-table-cell::before {
        text-align: left;
    }
}

.mud-select:has(.selectNumberPage) {
    max-width: fit-content;
    flex: none;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.card-header {
    color: #00008c !important;
}

.mud-drawer-content .mud-nav-link-text {
    font-weight: 500 !important;
}

.nav-link-button {
    color: inherit !important;
    justify-content: start !important;
    border-radius: 0 !important;
    padding: 8px 16px 8px 16px !important;
}

    .nav-link-button:hover {
        transform: none !important;
    }

    .nav-link-button .mud-button-label {
        font-size: 0.875rem !important;
    }

    .nav-link-button .mud-button-icon-start {
        margin-left: 0 !important;
        width: 24px !important;
        height: 24px !important;
        margin-right: 12px !important;
    }

@media (min-width: 600px) {
    #links-content {
        position: absolute;
    }
}

/* =============================================
   NATS-21 — Layout global
   ============================================= */

/* === AppBar pleine largeur ===
   Figma: bg white, backdrop-blur 8px, border rgba(0,0,0,0.07), h 86px
   Padding latéral responsive → 105px à 1440px
   ================================================================ */

.appbar-outer.mud-appbar {
    background: transparent !important;
    box-shadow: none !important;
    height: auto !important;
}

/* Toolbar : padding latéral responsive → 120px à 1440px, 16px min */
.appbar-outer .mud-toolbar,
.appbar-outer .mud-toolbar.mud-toolbar-appbar {
    height: auto !important;
    min-height: unset !important;
    padding: 0px !important;
    box-sizing: border-box !important;
    background: rgba(255, 255, 255, 0.84);
    border: 1px solid rgba(0, 0, 0, 0.07);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Carte header : logo à gauche | nav + auth groupés à droite */
.appbar-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    width: 100%;
    border-radius: 0;
    height: 86px;
}

/* Logo header */
.header-logo {
    height: 70px;
    width: auto;
    display: block;
    flex-shrink: 0;
}

.header-nav-content {
    gap: 24px;
}

/* Liens de navigation centrés (Avantages, Conditions d'accès, Démarche) */
.header-nav-links {
    display: flex;
    align-items: center;
    justify-content: right;
    gap: 24px;
}

.header-nav-link {
    color: var(--text-secondary) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none;
    white-space: nowrap !important;
    transition: color 0.15s ease !important;
    padding: 4px 0 !important;
    position: relative;
}

.header-nav-link:hover {
    color: var(--primary) !important;
    transform: none !important;
    background: none !important;
}

.header-nav-link:focus-visible {
    outline: 2px solid var(--primary);
    color: var(--primary) !important;
    outline-offset: 3px;
    border-radius: 2px;
}

.a.header-nav-link.active {
    color: var(--primary) !important;
    font-weight: 600 !important;
}

/* Boutons auth — alignés à droite */
.header-auth {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-shrink: 0;
}

/* Correction margin-top contenu principal sous AppBar fixe (h=86px) */
.mud-main-content {
    margin-top: 88px !important;
}

/* === Boutons header === */

/* LogInButton — texte gris souligné (Figma) */
.nav-link-login, .nav-link-logout {
    border-bottom: 1px solid var(--text-secondary) !important;
    border-radius: 0 !important;
    text-transform: inherit !important;
    height: 28px;
}

.nav-link-login:hover, .nav-link-logout:hover {
    border-bottom: 1px solid var(--primary) !important;
    background-color: inherit !important;
}

.nav-link-login:focus-visible, .nav-link-logout:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
    border-radius: 2px !important;
    background-color: inherit !important;
    border-bottom: 1px solid var(--primary) !important;
}

/* === Footer pleine largeur ===
   Figma: bg white, border rgba(0,0,0,0.07), padding 37px 109px
   ================================================================ */

.footer-wrapper {
    padding: 0;
}

.footer {
    background: white !important;
    border: 1px solid rgba(0, 0, 0, 0.07) !important;
    border-radius: 0 !important;
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

/* === Colonnes footer ===
   Figma grid: minmax(0,1.40fr) minmax(0,1fr) minmax(0,1fr), gap 32px
   ================================================================ */
.footer-columns {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 32px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 0;
}

/* Colonne gauche : logo + tagline */
.footer-left {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Logo footer : 123×60px selon Figma — jamais étiré */
.footer-logo-img {
    height: 80px;
    width: fit-content;
    max-width: 160px;
    object-fit: contain;
    display: block;
}

/* Tagline */
.footer-left .mud-typography {
    color: #62788a !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
}

/* Colonnes liens */
.footer-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Titres de colonnes (Figma: #101828, fw 600, 15px, lineHeight 140%) */
.footer-list h2,
.footer-list .mud-typography-h2 {
    color: #101828 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 0 4px 0;
}

/* Liens footer — border-bottom (Figma: stroke bottom, couleur #62788a) */
.footer .mud-link,
.footer-link-button {
    color: #62788a !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    border-bottom: 1px solid #62788a;
    padding-bottom: 1px;
    width: fit-content;
    line-height: 1.5;
}

.footer-link-form {
    margin: 0;
}

.footer-link-button {
    background: none;
    border-left: none;
    border-right: none;
    border-top: none;
    cursor: pointer;
    font-family: inherit;
    padding-left: 0;
    padding-right: 0;
    text-align: left;
}

.footer .mud-link:hover,
.footer-link-button:hover {
    color: var(--primary) !important;
    border-bottom-color: var(--primary);
}

.footer .mud-link:focus,
.footer-link-button:focus {
    outline-color: var(--primary);
    outline-style: auto;
    outline-offset: 4px;
    border-bottom-color: var(--primary) !important;
    color: var(--primary) !important;
}

/* === HorizontalBorder — séparateur légal ===
   Figma: border-top rgba(0,0,0,0.07), padding-top 20px
   ================================================================ */
.footer-horizontal-border {
    position: relative;
    padding-top: 20px;
    display: flex;
    justify-content: end;
    align-items: end;
    flex-wrap: wrap;
    gap: 12px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 0;
    flex-direction: column;
}

.footer-horizontal-border::before {
    content: "";
    position: absolute;
    top: 0;
    left: 40px;
    right: 40px;
    height: 1px;
    background-color: rgba(0, 0, 0, 0.07);
}

.footer-copyright {
    color: #62788a;
    font-size: 13px;
    font-weight: 400;
}

.footer-legal-links {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
    align-items: center;
}

.footer-legal-links a[target="_blank"] {
    gap: 4px;
    display: flex;
}

/* === Responsive === */

@media (max-width: 1024px) {
    .footer-columns {
        padding: 8px 8px 40px 8px !important;
    }

    .footer-left {
        align-items: center;
    }

    .footer-left p {
        text-align: center;
    }

    .footer-list {
        align-items: center;
    }

    .footer-legal-links {
        flex-direction: column;
        width: 100%;
    }

    .footer-copyright {
        text-align: center;
        margin-top: 32px;
    }
}

/* ≤992px : masquer les liens de navigation (hamburger à ajouter plus tard) */
@media (max-width: 992px) {
    .header-nav-links {
        display: none;
    }

    .appbar-card {
        grid-template-columns: auto auto;
    }

    .nav-link-logout, .header-nav-link-connected {
        width: 100% !important;
        justify-content: flex-start !important;
        min-height: 40.5px;
        padding: 0 !important;
        display: flex !important;
        margin-left: 12px !important;
        align-items: center !important;
        color: inherit !important;
        border: none !important;
        font-weight: 500 !important;
    }

    .eligibility-submission-lifeline-stepper {
        flex-direction: column;
        gap: 24px;
    }

    .eligibility-submission-lifeline-stepper li {
        flex-direction: row !important;
    }

    .eligibility-submission-lifeline-stepper li .step-number {
        display: flex;
        width: 100%;
        align-items: center;
        flex: inherit;
        position: relative;
    }

    .eligibility-submission-lifeline-stepper li .separator {
        flex: 1 !important;
        width: 2px !important;
        background-color: rgba(125, 152, 177, 0.5) !important;
        margin: 0 24px !important;
        border-radius: 2px !important;
        position: absolute;
        top: calc(100% + 5px);
        height: 30px !important;
        left: -5px !important;
    }
}

/* ≤768px : footer en colonne unique */
@media (max-width: 767px) {
    .footer-columns {
        grid-template-columns: 1fr;
    }

    .footer-horizontal-border {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .footer-legal-links {
        gap: 12px;
    }
}

/* === Lien d'évitement — accessibilité RGAA 12.1 === */
.skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: -999;
}

.skip-link:focus-visible {
    position: fixed;
    top: 8px;
    left: 8px;
    width: auto;
    height: auto;
    overflow: visible;
    z-index: 9999;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background-color: var(--primary) !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 22px !important;
    height: 52px !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    font-family: "Clash Display" !important;
    text-transform: inherit !important;
    justify-content: center;
    outline: 2px solid var(--primary);
    outline-offset: 3px;
}

.mud-dialog-title {
    padding: 40px 0 16px 0 !important;
    margin: 0 40px !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.mud-dialog .mud-dialog-title .mud-typography {
    font-size: 24px !important;
    font-weight: 700 !important;
}

.mud-dialog .mud-dialog-title .mud-button-close {
    top: 36px !important;
    right: 24px !important;
}

.mud-dialog-content {
    padding: 20px 40px 40px 40px !important;
}

.form-label {
    display: flex;
    align-items: center;
    gap: 4px;
    font-family: var(--font-primary);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--text-dark);
    margin-bottom: 0 !important;
}

.form-label .asterisque {
    color: var(--primary);
}

.mud-input-control .mud-input-control-input-container {
    flex-direction: column-reverse !important;
}

.mud-input-control .mud-input-control-input-container label, legend.mud-input-label {
    position: relative;
    transform: none !important;
    padding: 0 0 8px 0 !important;
    font-family: var(--font-primary) !important;
    font-weight: bold !important;
    color: #101828 !important;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    font-size: 1rem !important;
}

.mud-input-control .mud-input-control-input-container label::after, .asterisque {
    color: var(--primary) !important;
}

.mud-radio-group {
    gap: 16px;
}

.mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio {
    padding-bottom: 0 !important;
    gap: 8px;
}

.mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio.mud-readonly, .mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio.mud-readonly .mud-icon-button {
    cursor: not-allowed;
}

.mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio p {
    font-family: 'General Sans';
    font-size: 15px;
    font-weight: 500;
}

.mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio:first-child .mud-icon-button {
    padding: 0 !important;
}

.mud-radio-group .mud-input-control .mud-input-control-input-container .mud-radio:first-child .mud-icon-button.mud-checked, .mud-input-control .mud-input-control-input-container .mud-checkbox:first-child .mud-icon-button.mud-checked {
    color: var(--primary) !important;
}

.mud-input input {
    padding: 22px !important;
    border-radius: 4px !important;
}

/*.mud-input input[readonly] {
    background-color: #ededed !important;
}*/

.mud-input fieldset {
    padding: 22px !important;
    border-color: var(--text-dark) !important;
    border-radius: 4px !important;
}

.mud-input.mud-input-error fieldset {
    padding: 22px !important;
    border-color: var(--primary) !important;
    border-radius: 4px !important;
}

.mud-input fieldset legend {
    width: 0px !important;
    padding: 0px !important;
}

.mud-input-control-helper-container {
    margin-left: -8px;
}

.mud-input-control-helper-container .me-auto {
    font-family: var(--font-secondary) !important;
}

.mud-input-helper-text.mud-input-error {
    font-weight: 500 !important;
    font-size: 14px;
}

.form-label:has(+ .mud-input-error) {
    color: var(--primary) !important;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mud-input.mud-input-error::after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1339_2)'%3E%3Cpath d='M12 17.25C11.7929 17.25 11.625 17.0821 11.625 16.875C11.625 16.6679 11.7929 16.5 12 16.5' stroke='%23E52421' stroke-width='1.5'/%3E%3Cpath d='M12 17.25C12.2071 17.25 12.375 17.0821 12.375 16.875C12.375 16.6679 12.2071 16.5 12 16.5' stroke='%23E52421' stroke-width='1.5'/%3E%3Cpath d='M12 13.5V5.25' stroke='%23E52421' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath d='M12 23.25C18.2132 23.25 23.25 18.2132 23.25 12C23.25 5.7868 18.2132 0.75 12 0.75C5.7868 0.75 0.75 5.7868 0.75 12C0.75 18.2132 5.7868 23.25 12 23.25Z' stroke='%23E52421' stroke-width='1.5' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1339_2'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
}

.mud-input.mud-input-error input {
    padding-right: 48px !important;
}

.alert {
    display: flex;
    gap: 8px;
    padding: 16px 16px 16px 50px !important;
    border-radius: 4px !important;
    flex-direction: column;
    margin-bottom: 0 !important;
}

.alert-success {
    background: #E4F3D0 !important;
    border: 1px solid #589800 !important;
    color: #002843;
}

.alert-success::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 24px;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1303_87)'%3E%3Cpath d='M6 13.2229L8.45 16.6999C8.54293 16.8387 8.66768 16.9533 8.81385 17.0342C8.96002 17.1151 9.12339 17.1599 9.29037 17.1648C9.45735 17.1698 9.6231 17.1349 9.77384 17.0629C9.92458 16.9909 10.0559 16.8839 10.157 16.7509L18 6.82788' stroke='%23589800' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M0.75 11.999C0.75 14.9827 1.93526 17.8442 4.04505 19.954C6.15483 22.0638 9.01631 23.249 12 23.249C14.9837 23.249 17.8452 22.0638 19.955 19.954C22.0647 17.8442 23.25 14.9827 23.25 11.999C23.25 9.01534 22.0647 6.15386 19.955 4.04407C17.8452 1.93429 14.9837 0.749023 12 0.749023C9.01631 0.749023 6.15483 1.93429 4.04505 4.04407C1.93526 6.15386 0.75 9.01534 0.75 11.999Z' stroke='%23589800' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1303_87'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.alert-error {
    background: #FEF2F2 !important;
    border: 1px solid var(--primary) !important;
    color: #7a1e1c;
}

.alert-error::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 24px;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1346_13)'%3E%3Cpath d='M0.75 11.999C0.75 14.9827 1.93526 17.8442 4.04505 19.954C6.15483 22.0638 9.01631 23.249 12 23.249C14.9837 23.249 17.8452 22.0638 19.955 19.954C22.0647 17.8442 23.25 14.9827 23.25 11.999C23.25 9.01534 22.0647 6.15386 19.955 4.04407C17.8452 1.93429 14.9837 0.749023 12 0.749023C9.01631 0.749023 6.15483 1.93429 4.04505 4.04407C1.93526 6.15386 0.75 9.01534 0.75 11.999Z' stroke='%23E52421' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.5 16.499L16.5 7.49902' stroke='%23E52421' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16.5 16.499L7.5 7.49902' stroke='%23E52421' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1346_13'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.alert-title {
    font-family: "Clash Display", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    color: inherit;
}

.alert p {
    margin-bottom: 0;
}

.primary-link {
    color: var(--primary) !important;
    font-weight: 700 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    justify-content: start;
}

.link-text {
    color: var(--primary) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* Assure que les éléments ciblés peuvent recevoir le focus */
#main-content:focus,
#app-bar:focus,
#footer:focus {
    outline: 3px solid var(--mud-palette-primary, #594ae2);
    outline-offset: 4px;
    scroll-margin-top: 2rem;
}

a:focus-visible {
    outline: 2px solid var(--primary) !important;
    outline-offset: 3px;
    border-radius: 4px;
}

.mobile-nav-drawer .mud-nav-link {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.mobile-nav-drawer .btn-primary {
    width: 100% !important;
}

.mobile-nav-drawer .nav-link-login {
    width: fit-content !important;
    left: 50%;
    transform: translateX(-50%);
}

.content-component a {
    color: #e52421 !important;
    text-decoration: underline !important;
    font-weight: 700;
    text-underline-offset: 4px;
}

.sitemap-container .btn-primary, .sitemap-container .nav-link-login {
    padding: 0 !important;
    border: none !important;
    background-color: transparent !important;
    max-height: fit-content !important;
    font-size: 14px !important;
    color: #e52421 !important;
    text-decoration: underline !important;
    font-weight: 700 !important;
    text-underline-offset: 4px;
    width: fit-content !important;
}

.sitemap-container .btn-primary:hover, .sitemap-container .nav-link-login:hover {
    transform: none !important;
}

.mud-alert {
    padding: 16px 16px 16px 48px !important;
    border-radius: 4px !important;
    color: #002843 !important;
    position: relative;
}

.mud-alert .mud-alert-icon {
    display: none !important;
}

.mud-alert .mud-alert-message {
    padding: 0 !important;
}

.mud-alert-outlined-error {
    background-color: #FEF2F2 !important;
    border: 1px solid #E52421 !important;
}

.mud-alert-outlined-error::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1339_2)'%3E%3Cpath d='M12 17.25C11.7929 17.25 11.625 17.0821 11.625 16.875C11.625 16.6679 11.7929 16.5 12 16.5' stroke='%23E52421' stroke-width='1.5'/%3E%3Cpath d='M12 17.25C12.2071 17.25 12.375 17.0821 12.375 16.875C12.375 16.6679 12.2071 16.5 12 16.5' stroke='%23E52421' stroke-width='1.5'/%3E%3Cpath d='M12 13.5V5.25' stroke='%23E52421' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath d='M12 23.25C18.2132 23.25 23.25 18.2132 23.25 12C23.25 5.7868 18.2132 0.75 12 0.75C5.7868 0.75 0.75 5.7868 0.75 12C0.75 18.2132 5.7868 23.25 12 23.25Z' stroke='%23E52421' stroke-width='1.5' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1339_2'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    left: 16px;
    top: 14px;
}

.mud-alert-outlined-info {
    background-color: #eff6ff !important;
    border: 1px solid #1d4ed8 !important;
}

.mud-alert-outlined-info::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1455_75)'%3E%3Cpath d='M11.9414 17.3206V11.1928C11.9414 10.9606 11.8492 10.7379 11.685 10.5738C11.5208 10.4096 11.2982 10.3174 11.066 10.3174H10.1906' stroke='%231D4ED8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11.5036 7.72892C11.2618 7.72892 11.0659 7.53295 11.0659 7.29122C11.0659 7.04948 11.2618 6.85352 11.5036 6.85352' stroke='%231D4ED8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11.5035 7.72892C11.7453 7.72892 11.9412 7.53295 11.9412 7.29122C11.9412 7.04948 11.7453 6.85352 11.5035 6.85352' stroke='%231D4ED8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 23.2283C18.2013 23.2283 23.2284 18.2012 23.2284 11.9999C23.2284 5.79861 18.2013 0.771484 12 0.771484C5.79873 0.771484 0.771606 5.79861 0.771606 11.9999C0.771606 18.2012 5.79873 23.2283 12 23.2283Z' stroke='%231D4ED8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.1906 17.3203H13.8096' stroke='%231D4ED8' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1455_75'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    left: 16px;
    top: 14px;
}

.mud-alert-outlined-success {
    background-color: #f0fdf4 !important;
    border: 1px solid #15803d !important;
}

.mud-alert-outlined-success::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1303_87)'%3E%3Cpath d='M6 13.2229L8.45 16.6999C8.54293 16.8387 8.66768 16.9533 8.81385 17.0342C8.96002 17.1151 9.12339 17.1599 9.29037 17.1648C9.45735 17.1698 9.6231 17.1349 9.77384 17.0629C9.92458 16.9909 10.0559 16.8839 10.157 16.7509L18 6.82788' stroke='%2315803D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M0.75 11.999C0.75 14.9827 1.93526 17.8442 4.04505 19.954C6.15483 22.0638 9.01631 23.249 12 23.249C14.9837 23.249 17.8452 22.0638 19.955 19.954C22.0647 17.8442 23.25 14.9827 23.25 11.999C23.25 9.01534 22.0647 6.15386 19.955 4.04407C17.8452 1.93429 14.9837 0.749023 12 0.749023C9.01631 0.749023 6.15483 1.93429 4.04505 4.04407C1.93526 6.15386 0.75 9.01534 0.75 11.999Z' stroke='%2315803D' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1303_87'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    left: 16px;
    top: 14px;
}

.mud-alert-outlined-warning {
    background-color: #fefce8 !important;
    border: 1px solid #a16207 !important;
}

.mud-alert-outlined-warning::before {
    content: "";
    position: absolute;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cg clip-path='url(%23clip0_1455_81)'%3E%3Cpath d='M12 19.5C11.7929 19.5 11.625 19.3321 11.625 19.125C11.625 18.9179 11.7929 18.75 12 18.75' stroke='%23A16207' stroke-width='1.5'/%3E%3Cpath d='M12 19.5C12.2071 19.5 12.375 19.3321 12.375 19.125C12.375 18.9179 12.2071 18.75 12 18.75' stroke='%23A16207' stroke-width='1.5'/%3E%3Cpath d='M12 15.75V8.25' stroke='%23A16207' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round'/%3E%3Cpath d='M13.621 1.76001C13.4722 1.45702 13.2414 1.20181 12.9549 1.02333C12.6684 0.844851 12.3376 0.750244 12 0.750244C11.6624 0.750244 11.3316 0.844851 11.0451 1.02333C10.7586 1.20181 10.5278 1.45702 10.379 1.76001L0.90601 21.058C0.79198 21.29 0.738946 21.5472 0.751916 21.8053C0.764886 22.0635 0.843432 22.3141 0.980137 22.5334C1.11684 22.7528 1.3072 22.9337 1.53324 23.0591C1.75927 23.1845 2.01353 23.2502 2.27201 23.25H21.728C21.9865 23.2502 22.2407 23.1845 22.4668 23.0591C22.6928 22.9337 22.8832 22.7528 23.0199 22.5334C23.1566 22.3141 23.2351 22.0635 23.2481 21.8053C23.2611 21.5472 23.208 21.29 23.094 21.058L13.621 1.76001Z' stroke='%23A16207' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1455_81'%3E%3Crect width='24' height='24' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    left: 16px;
    top: 14px;
}

.mud-popover {
    box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.07) !important;
}

.mud-list:has(.popover-menu-user) {
    border: 1px solid var(--primary);
    border-radius: 4px;
}

.eligibility-submission-lifeline .mud-avatar.mud-avatar-medium {
    font-family: 'Clash Display', 'General Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border: 2px solid rgba(125,152,177,0.5) !important;
    color: #7D98B1;
}

.eligibility-submission-lifeline li .mud-avatar.mud-avatar-medium.mud-avatar-filled.mud-avatar-filled-primary {
    border: 2px solid #107F51 !important;
    background-color: #107F51 !important;
    color: #FFFFFF !important;
}

.eligibility-submission-lifeline li .mud-avatar.mud-avatar-medium.mud-avatar-filled.mud-avatar-filled-primary + .separator {
    background-color: #107F51 !important;
}

.eligibility-submission-lifeline li[aria-current="step"] .mud-avatar.mud-avatar-medium.mud-avatar-filled.mud-avatar-filled-primary {
    border: 2px solid #2563EB !important;
    background-color: #2563EB !important;
    color: #FFFFFF !important;
}

.eligibility-submission-lifeline li[aria-current="step"] .mud-avatar.mud-avatar-medium.mud-avatar-filled.mud-avatar-filled-primary + .separator {
    background-color: #2563EB !important;
}

.eligibility-submission-lifeline .step-name {
    font-weight: 600;
}

.eligibility-submission-lifeline .step-state {
    font-weight: 500;
}

.eligibility-submission-lifeline .step-name, .eligibility-submission-lifeline .step-state {
    color: #7D98B1 !important;
}

.eligibility-submission-lifeline .mud-primary-text {
    color: #107F51 !important;
}

.eligibility-submission-lifeline li[aria-current="step"] .mud-primary-text {
    color: #2563EB !important;
}

.eligibility-submission-lifeline-stepper {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    align-items: flex-start;
}

.eligibility-submission-lifeline-stepper li {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    gap: 16px;
}

.eligibility-submission-lifeline-stepper li .separator {
    flex: 1;
    height: 2px;
    background-color: rgba(125,152,177,0.5);
    margin: 0 24px;
    border-radius: 2px;
}

.eligibility-submission-lifeline-stepper li .step-number {
    display: flex;
    width: 100%;
    align-items: center;
}

.error-color {
    color: #e70b06 !important;
}

.pricing-profiles-document-content svg {
    min-width: 22px;
    min-height: 22px;
}

.big-img {
    max-width: 100%;
}

.input-file-icon {
    background-color: rgba(193, 26, 54, 0.08);
    height: 56px;
    width: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
}

.pj-item .pj-icon {
    min-width: 44px;
    min-height: 44px;
    max-width: 44px;
    max-height: 44px;
    border-radius: 4px;
    border: 1px solid rgba(229, 36, 33, 0.5);
    background-color: #FAEAEC;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pj-item .pj-badge {
    background-color: #E2F7F0;
    padding: 8px 12px;
    border-radius: 9999px;
    color: #107F51;
    font-weight: 600;
    font-size: 13px;
}

.submission-section-content .submission-field-block .submission-field-label, .submission-section-content .submission-sidebar-field-block .submission-field-label {
    font-size: 1rem !important;
    font-family: var(--font-primary) !important;
    font-weight: bold !important;
    color: #101828 !important;
}