/* Bridge design system V3 : main.css/ulk-themes.css ne definissent pas --local-*, chaque site mappe ses numeros de theme (voir user/themes/ulk-docs/css/ulk.css pour le meme pattern). */

:root {
    /* Numeros de themes : recapitulatif sur https://ulk.univ-lille.fr/designsystem */
    --local-bg-primary1: var(--ulk-theme6-bg-primary1);
    --local-bg-primary1-rgb: var(--ulk-theme6-bg-primary1-rgb);
    --local-bg-primary1-hover: color-mix(in srgb, var(--local-bg-primary1) 60%, white);
    --local-surface-primary1: color-mix(in srgb, white 40%, var(--local-bg-primary1));
    --local-surface-primary1-hover: color-mix(in srgb, white 30%, var(--local-bg-primary1));
    --local-bg-primary2: var(--ulk-theme6-bg-primary2);
    --local-bg-primary2-rgb: var(--ulk-theme6-bg-primary2-rgb);
    --local-bg-primary2-hover: color-mix(in srgb, var(--local-bg-primary2) 60%, black);
    --local-surface-primary2: color-mix(in srgb, black 40%, var(--local-bg-primary2));
    --local-surface-primary2-hover: color-mix(in srgb, black 30%, var(--local-bg-primary2));
    --local-bg-secondary1: var(--ulk-theme2-bg-primary1);
    --local-bg-secondary1-rgb: var(--ulk-theme2-bg-primary1-rgb);
    --local-bg-secondary1-hover: color-mix(in srgb, var(--local-bg-secondary1) 60%, white);
    --local-surface-secondary1: color-mix(in srgb, white 40%, var(--local-bg-secondary1));
    --local-surface-secondary1-hover: color-mix(in srgb, white 30%, var(--local-bg-secondary1));
    --local-bg-secondary2: var(--ulk-theme2-bg-primary2);
    --local-bg-secondary2-rgb: var(--ulk-theme2-bg-primary2-rgb);
    --local-bg-secondary2-hover: color-mix(in srgb, var(--local-bg-secondary2) 60%, black);
    --local-surface-secondary2: color-mix(in srgb, black 40%, var(--local-bg-secondary2));
    --local-surface-secondary2-hover: color-mix(in srgb, black 30%, var(--local-bg-secondary2));
    /* Accent : deux themes combines (primary/secondary), pas de 3e couleur - accent2 = meme
       theme secondaire (theme3 "Pink Lady") que ulk-docs, meme pattern/nommage que ce site. */
    --local-fg-accent1: var(--ulk-theme12-fg-accent1);
    --local-fg-accent1-rgb: var(--ulk-theme12-fg-accent1-rgb);
    --local-fg-accent1-darkmode: var(--ulk-theme12-fg-accent1-darkmode);
    --local-fg-accent2: var(--ulk-theme3-fg-accent1);
    --local-fg-accent2-rgb: var(--ulk-theme3-fg-accent1-rgb);
    --local-fg-accent2-darkmode: var(--ulk-theme3-fg-accent1-darkmode);
    /* Radius */
    --local-radius-surface: var(--ulk-radius-md);
    --local-radius-card: var(--ulk-radius-md);
    --local-radius-button: var(--ulk-radius-full);
}

:root {
    /* Fonts (couleurs et typographies) */
    --local-font-sans: var(--ulk-font-sans);
    --local-font-family: var(--ulk-font-sans);
    --local-font-serif: var(--ulk-font-serif);
    --local-font-dyslexia: var(--ulk-font-dyslexia);
    --local-font-luciole: var(--ulk-font-luciole);
    --local-fg-neutral1: var(--ulk-fg-neutral1);
    --local-fg-neutral2: var(--ulk-fg-neutral2);
    --local-fg-darkmode: var(--ulk-fg-darkmode);
    --local-fg-on-primary1: var(--ulk-fg-on-primary1);
    --local-fg-on-primary2: var(--ulk-fg-on-primary2);
    /* --ulk-fg-warning distant est faux (orange #9A3412 au lieu du #C70000 de la charte) : corrige en dur ici, variante sombre plus bas. */
    --local-fg-warning: #C70000;
    --local-title: var(--local-fg-neutral1);
    --local-fg: var(--local-fg-neutral1);
    --local-accent: var(--local-fg-accent1);
    --local-accent-rgb: var(--local-fg-accent1-rgb);
    --local-font-color: var(--local-fg);
    /* Backgrounds */
    --local-bg: var(--ulk-bg);
    --local-bg-rgb: var(--ulk-bg-rgb);
    --local-bg-hover: var(--ulk-bg-hover);
    --local-bg-darkmode: var(--ulk-bg-darkmode);
    --local-hover: var(--local-bg-hover);
    --local-bg-neutral1: var(--ulk-bg-neutral1);
    --local-bg-neutral1-rgb: var(--ulk-bg-neutral1-rgb);
    --local-bg-neutral1-hover: var(--ulk-bg-neutral1-hover);
    --local-bg-neutral2: var(--ulk-bg-neutral2);
    --local-bg-neutral2-rgb: var(--ulk-bg-neutral2-rgb);
    --local-bg-neutral2-hover: var(--ulk-bg-neutral2-hover);
    /* Surface */
    --local-surface: var(--ulk-gray-100);
    --local-surface-hover: var(--ulk-gray-200);
    --local-surface-neutral: var(--ulk-gray-200);
    --local-surface-neutral-hover: var(--ulk-gray-300);
    /* Borders */
    --local-border1: var(--ulk-border1);
    --local-border2: var(--ulk-border2);
    --local-border-on-primary1: var(--ulk-border-on-primary1);
    --local-border-on-primary2: var(--ulk-border-on-primary2);
    /* Alertes */
    --local-bg-success: var(--ulk-bg-success);
    --local-border-success: var(--ulk-border-success);
    --local-fg-success: var(--ulk-fg-success);
    --local-icon-success: var(--ulk-icon-success);
    --local-bg-info: var(--ulk-bg-info);
    --local-border-info: var(--ulk-border-info);
    --local-fg-info: var(--ulk-fg-info);
    --local-icon-info: var(--ulk-icon-info);
    --local-bg-warning: var(--ulk-bg-warning);
    --local-border-warning: var(--ulk-border-warning);
    /* Ne pas redéfinir --local-fg-warning ici, écraserait le correctif ci-dessus */
    --local-icon-warning: var(--ulk-icon-warning);
    --local-bg-danger: var(--ulk-bg-danger);
    --local-border-danger: var(--ulk-border-danger);
    --local-fg-danger: var(--ulk-fg-danger);
    --local-icon-danger: var(--ulk-icon-danger);
}

/* Mode sombre : classe posée sur <html> par ulk-scripts.js (case à cocher). */
:root.dark {
    --local-fg-neutral1: var(--ulk-fg-neutral1-darkmode);
    --local-fg-neutral2: var(--ulk-fg-neutral2-darkmode);
    --local-font-color: var(--local-fg);

    --local-bg: var(--ulk-bg-darkmode);
    --local-bg-rgb: var(--ulk-bg-rgb-darkmode);
    --local-bg-hover: var(--ulk-bg-hover-darkmode);
    --local-hover: var(--local-bg-hover);
    --local-bg-neutral1: var(--ulk-bg-neutral1-darkmode);
    --local-bg-neutral1-rgb: var(--ulk-bg-neutral1-rgb-darkmode);
    --local-bg-neutral1-hover: var(--ulk-bg-neutral1-hover-darkmode);
    --local-bg-neutral2: var(--ulk-bg-neutral2-darkmode);
    --local-bg-neutral2-rgb: var(--ulk-bg-neutral2-rgb-darkmode);
    --local-bg-neutral2-hover: var(--ulk-bg-neutral2-hover-darkmode);
    --local-surface: var(--ulk-gray-800);
    --local-surface-hover: var(--ulk-gray-700);
    --local-surface-neutral: var(--ulk-gray-700);
    --local-surface-neutral-hover: var(--ulk-gray-600);
    --local-fg-accent1: var(--ulk-theme12-fg-accent1-darkmode);
    --local-fg-accent2: var(--ulk-theme3-fg-accent1-darkmode);
    /* --ulk-fg-warning-darkmode distant est faux aussi (orange clair au lieu de #FF5252). */
    --local-fg-warning: #FF5252;

    --local-border1: var(--ulk-border1-darkmode);
    --local-border2: var(--ulk-border2-darkmode);
}

/* Alias Ulk 2.0 (bloc-primaryN) encore utilisés dans custom.css/demo.css (migration) */
:root {
    --local-bloc-primary1: var(--local-bg-primary1);
    --local-bloc-primary1-rgb: var(--local-bg-primary1-rgb);
    --local-bloc-primary2: var(--local-bg-primary2);
    --local-bloc-primary2-rgb: var(--local-bg-primary2-rgb);
    --local-font-warning-sombre: var(--local-fg-warning);
    --local-background: var(--local-bg);
    --local-bloc-neutre1: var(--local-bg-neutral1);
    --local-font-color-bloc-primary1: var(--local-fg-on-primary1);
}

/* Personnalisations propres à ce site (tailles, espacements) */
:root {
    /* FONTES */
    --local-font-content: 1.8rem;
    --local-h1-mobile: 2.88rem;
    --local-h1-desktop: 4.8rem;
    --local-h2-mobile: 2.88rem;
    --local-h2-desktop: 4.8rem;
    --local-h3-mobile: 2.24rem;
    --local-h3-desktop: 3.52rem;
    --local-h4-mobile: 1.92rem;
    --local-h4-desktop: 2.24rem;
    --local-h5-mobile: 1.6rem;
    --local-h5-desktop: 1.6rem;

    /* ESPACEMENTS */
    --local-padding-sub: 0.4rem;
    --local-padding: 2.4rem;
    --local-gap: var(--local-padding);
}

/* Sans çaa le texte custom du footer-brandbar deborde en row (>=992px) : un enfant flex ne redescend pas sous sa largeur de contenu par defaut. */
.ulk-c-footer-brandbar__custom-text {
    flex: 1 1 30rem;
    min-width: 0;
}

/* Utile seulement en row (au-delà de 992px)*/
.ulk-c-footer-brandbar__container {
    flex-wrap: wrap;
}

/* Mobile/tablette : resserre + réduit la fonte. */
@media screen and (max-width: 991.98px) {
    .ulk-c-footer-brandbar__container {
        gap: 0.8rem;
        padding-block: 1.6rem;
    }

    .ulk-c-footer-brandbar__custom-text {
        /* flex-basis: ajustement du 30rem en auto */
        flex: 1 1 auto;
        font-size: 1.4rem;
        text-align: center;
    }
}

/* .ulk-s-main n'existe plus dans le ds, correctif local */
.ulk-s-main {
    flex: 1 0 auto;
}

/* Topbar visuellement lourde, suppression locale */
.ulk-c-legalbar__container {
    border-top: none;
}

/* .ulk-c-button impose min-width:12rem (texte+icone) modif'  local à la place. */
#ulk-backtotop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.8rem;
    height: 4.8rem;
    padding: 0;
    background-color: var(--local-bg-primary1);
    color: var(--local-fg-on-primary1);
    font-size: 1.8rem;
    cursor: pointer;
}

#ulk-backtotop:hover {
    background-color: var(--local-bg-primary1-hover);
}

/* Souci taille svg */
.ulk-c-header-logos__item img {
    height: 100%;
    width: auto;
    max-width: 9rem;
    object-fit: contain;
}

/* Logo temp' de canard en fonte */
i.ulk-c-brandbar__logo {
    font-size: 4rem;
    line-height: 1;
    color: var(--local-fg-on-primary1, currentColor);
}

@media screen and (max-width: 1200px) {
    i.ulk-c-brandbar__logo {
        font-size: 3rem;
    }
}