/* Définition de la variable CSS pour la couleur de fond principale */
    /* RcVitre.Style.css */
    :root{
        --main-background-color: rgb(255, 253, 208); /* ta couleur de base de backgrounddu site */        
        --brandbar-bg: rgb(0, 0, 0);   /* même fond pour nav & footer */
        --brandbar-fg: #fff;               /* couleur du texte */
        --brandbar-height: 56px;
        --brandbar-shadow: 0 2px 6px rgba(0,0,0,.30);
        --brandbar-font: "Open Sans", system-ui, sans-serif;
        --brandbar-size: 1.1rem;
        --brandbar-weight: 600;
    }

    /* Classe commune */
    .brandbar{
        background-color: var(--brandbar-bg);
        color: var(--brandbar-fg);
        font-family: var(--brandbar-font);
        font-size: var(--brandbar-size);
        font-weight: var(--brandbar-weight);
        min-height: var(--brandbar-height);
        box-shadow: var(--brandbar-shadow);
    }

    /* Liens lisibles */
    .brandbar a { color: var(--brandbar-fg); text-decoration: none; }
    .brandbar a:hover, .brandbar a:focus { color: var(--brandbar-fg); opacity:.85; }

    /* Intégration Bootstrap pour la navbar */
    .navbar.brandbar{
        --bs-navbar-bg: var(--brandbar-bg);
        --bs-navbar-color: rgba(255,255,255,.75);
        --bs-navbar-hover-color: #fff;
        --bs-navbar-active-color: #fff;
        --bs-navbar-brand-color: #fff;
        --bs-navbar-brand-hover-color: #fff;
        --bs-navbar-toggler-border-color: rgba(255,255,255,.25);
    }
    /* Dropdowns sombres dans la navbar (utile si tu n’utilises pas data-bs-theme) */
    .navbar.brandbar .dropdown-menu{
    --bs-dropdown-bg: var(--brandbar-bg);
    --bs-dropdown-color: #fff;
    --bs-dropdown-link-color: #fff;
    --bs-dropdown-link-hover-color: #fff;
    --bs-dropdown-link-hover-bg: rgba(255,255,255,.12);
    --bs-dropdown-border-color: rgba(255,255,255,.15);
    }
    /* Spécifique footer si besoin (garde la même barre) */
    .footer-brandbar{}


    .eventTextFull {  /* allure du text des évenements sur le planning FullCalendar */
        background-color:black;
        color:white;
        display: inline;
    }


    .eventText { /* allure du text des évenements sur le planning FullCalendar */

    }

    /* Conteneur principal qui occupe toute la hauteur de la page */
    .container {
        display: flex;
        flex: 1; /* Permet à la container de prendre tout l'espace restant */
        overflow-y: auto; /* Permet le défilement si le contenu déborde */
        background:  var(--main-background-color);
    }



    .example-wrapper { 
        width: 100%; /* Équivalent à container-fluid */
        margin-top: 0px !important; /* avant 1.5rem Équivalent à mt-4 (valeur par défaut Bootstrap v5) - utilisez la valeur qui vous convient */
        margin-left: auto !important;  /* Équivalent à mx-auto */
        margin-right: auto !important; /* Équivalent à mx-auto */
        background:  var(--main-background-color);
        flex: 1; /* Permet à la container de prendre tout l'espace restant */

        padding: 2px 6px;
    }

    body {
        background-color:  var(--main-background-color);
        color: var(--text-color);
        /* Bootstrap 5.3 : propage sur les composants */
        --bs-body-color: var(--text-color);
        --bs-link-color: var(--link-color);
        --bs-link-hover-color: var(--link-hover-color);
        --bs-heading-color: var(--heading-color);     
    }


    /* Dans la section <style> ou dans votre fichier CSS */
    .box-wrapper {
        width: 100%;
        
        margin-left: auto !important;
        margin-right: auto !important;
        background:  var(--main-background-color);
        margin-top: 0px; /*  avant on avait 56px Espace pour la navbar. Ajustez si la hauteur de votre navbar est différente. */
        /* background: lightgreen; */
        padding: 0px 0px;
        flex: 1;
        overflow-y: auto;
        /* Supprimez ou modifiez ces lignes : */
        /* display: flex; */
        /* justify-content: center; */
        /* align-items: center; */
        /* height: 100vh; */
        flex: 1; 
    }