/* Bienfolio — surcharge de palette du portail ds_gl.
   Chargée après /ds_gl/static/src/css/ds_gl.css (voir manifest) : on
   réassigne les MÊMES variables CSS que le cœur (--gl-green, etc.)
   plutôt que d'en inventer de nouvelles — tout le reste du portail
   (boutons .gl-btn-primary, badges DPE/GES, cartes, modales...) suit
   automatiquement sans devoir dupliquer ces règles ici. */

:root {
  --gl-green: #00994d;         /* vert Bienfolio (logo) */
  --gl-green-dark: #0a1f33;    /* bleu marine Bienfolio (logo) */
  --gl-green-light: #d7f5e3;
  --gl-gold: #00994d;          /* pas de doré dans la charte Bienfolio :
                                   le plan "Expert" reprend l'accent vert */
  --gl-shadow: 0 2px 8px rgba(0,153,77,.10);
  --gl-shadow-lg: 0 8px 32px rgba(0,153,77,.14);
}

.gl-sidebar-logo-bienfolio {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 16px 24px;
}

.gl-sidebar-logo-bienfolio img {
  max-width: 150px;
  height: auto;
}

/* Le badge plan "Expert" du cœur utilise --gl-gold sur fond clair —
   avec --gl-gold réaligné sur le vert Bienfolio ci-dessus, on garde un
   contraste correct en repassant le texte en blanc plutôt qu'en
   --gl-green-dark (qui donnerait du vert sur vert). */
.gl-sidebar-plan.expert {
  color: #fff;
}

/* Logo compact Bienfolio dans la sidebar */
.gl-sidebar-logo-bienfolio {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 0 18px;
}

.gl-sidebar-logo-bienfolio img {
    width: 64px;
    height: 64px;
    max-width: 64px;
    object-fit: contain;
}

/* Ajustement final logo sidebar Bienfolio */
.gl-sidebar-logo-bienfolio {
    padding: 12px 0 14px;
}

.gl-sidebar-logo-bienfolio img {
    width: 54px;
    height: 54px;
    max-width: 54px;
    object-fit: contain;
}

/* Sidebar Bienfolio : gradient léger pour mieux faire ressortir le logo */
.gl-sidebar {
    background: linear-gradient(
        180deg,
        #103452 0%,
        #0b2942 38%,
        #071f33 100%
    ) !important;
    border-right: 1px solid rgba(255,255,255,0.04);
}

/* Zone logo */
.gl-sidebar-logo-bienfolio {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 0 14px;
}

/* Support visuel discret derrière l'icône */
.gl-sidebar-logo-bienfolio::before {
    content: "";
    position: absolute;
    width: 72px;
    height: 72px;
    border-radius: 18px;
    background: linear-gradient(
        180deg,
        rgba(255,255,255,0.06) 0%,
        rgba(255,255,255,0.02) 100%
    );
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: 0 8px 22px rgba(0,0,0,0.18);
}

/* Icône */
.gl-sidebar-logo-bienfolio img {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    max-width: 54px;
    object-fit: contain;
    filter: drop-shadow(0 0 6px rgba(0, 153, 77, 0.18));
}

/* Sidebar Bienfolio : dégradé inspiré du logo, mais subtil */
.gl-sidebar {
    background:
        radial-gradient(
            circle at 28% 7%,
            rgba(0, 191, 120, 0.18) 0%,
            rgba(0, 191, 120, 0.10) 14%,
            rgba(0, 191, 120, 0.04) 24%,
            rgba(0, 191, 120, 0.00) 38%
        ),
        linear-gradient(
            180deg,
            #103a59 0%,
            #0a2c45 38%,
            #061f34 100%
        ) !important;
    border-right: 1px solid rgba(255,255,255,0.04);
}

/* Zone logo */
.gl-sidebar-logo-bienfolio {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 0 14px;
}

/* Petit support léger derrière l’icône */
.gl-sidebar-logo-bienfolio::before {
    content: "";
    position: absolute;
    width: 74px;
    height: 74px;
    border-radius: 18px;
    background:
        linear-gradient(
            145deg,
            rgba(0, 191, 120, 0.10) 0%,
            rgba(0, 44, 91, 0.16) 100%
        );
    border: 1px solid rgba(255,255,255,0.05);
    box-shadow: 0 8px 22px rgba(0,0,0,0.16);
}

/* Icône */
.gl-sidebar-logo-bienfolio img {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(0, 191, 120, 0.12));
}

/* Sidebar Bienfolio - gradient inspiré du bandeau Expert */
.gl-sidebar {
    background: linear-gradient(
        135deg,
        #06263b 0%,
        #0a4a4b 38%,
        #078a52 72%,
        #05a34b 100%
    ) !important;
    border-right: 1px solid rgba(255,255,255,0.04);
}

/* Zone logo */
.gl-sidebar-logo-bienfolio {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 0;
}

/* Fond discret derrière l'icône */
.gl-sidebar-logo-bienfolio::before {
    content: "";
    position: absolute;
    width: 72px;
    height: 72px;
    border-radius: 18px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.06);
    box-shadow: 0 8px 18px rgba(0,0,0,0.14);
}

/* Icône Bienfolio */
.gl-sidebar-logo-bienfolio img {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 54px;
    max-width: 54px;
    object-fit: contain;
}

/* Sidebar Bienfolio - gradient inversé : vert en haut, bleu en bas */
.gl-sidebar {
    background: linear-gradient(
        180deg,
        #0aa35a 0%,
        #08765a 28%,
        #0a4a4b 55%,
        #082f46 78%,
        #06263b 100%
    ) !important;

    border-right: 1px solid rgba(255,255,255,0.04);
}

/* ===== Ajustements sidebar Bienfolio ===== */

/* 1. Supprimer le rectangle/support autour du logo */
.gl-sidebar-logo-bienfolio::before {
    display: none !important;
    content: none !important;
}

.gl-sidebar-logo-bienfolio {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* 2. Garder l'icône propre, sans bloc autour */
.gl-sidebar-logo-bienfolio img {
    width: 54px;
    height: 54px;
    max-width: 54px;
    object-fit: contain;
    filter: none !important;
}

/* 3. Bleu fort Bienfolio pour Plan Gratuit */
.gl-plan-badge,
.gl-sidebar .gl-plan-badge,
.gl-sidebar-plan {
    color: #062B55 !important;
    font-weight: 700 !important;
}

/* 4. Bleu fort Bienfolio pour les titres de sections */
.gl-sidebar .gl-sidebar-section-title,
.gl-sidebar .gl-nav-section-title,
.gl-sidebar .gl-menu-section-title,
.gl-sidebar .gl-section-title {
    color: #062B55 !important;
    opacity: 1 !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em;
}

/* Variante de secours pour les labels de sections */
.gl-sidebar [class*="section"] > .text-uppercase,
.gl-sidebar .text-uppercase {
    color: #062B55 !important;
    opacity: 1 !important;
}

/* Auth Bienfolio */
.gl-auth-logo-bienfolio img {
    display: block;
    width: 150px;
    max-width: 70%;
    height: auto;
    margin: 0 auto 10px;
}
.gl-auth-logo-bienfolio p {
    margin: 0 0 14px;
    color: var(--gl-text-muted);
}
.bf-auth-by {
    margin-top: 18px;
    text-align: center;
    font-size: 11px;
    color: var(--gl-text-muted);
    opacity: .78;
}

/* ============================================================
   Bienfolio - Login propre
   ============================================================ */

.gl-auth-card {
    width: min(440px, calc(100vw - 32px)) !important;
    padding: 38px 42px !important;
    overflow: hidden !important;
}

.gl-auth-logo {
    text-align: center !important;
    margin: 0 0 28px !important;
}

.gl-auth-logo img,
.gl-auth-logo-bienfolio img,
.bienfolio-auth-logo img {
    display: block !important;
    width: 170px !important;
    max-width: 70% !important;
    height: auto !important;
    max-height: 105px !important;
    object-fit: contain !important;
    margin: 0 auto 12px !important;
}

.gl-auth-logo h1 {
    display: none !important;
}

.gl-auth-logo p {
    margin: 6px 0 0 !important;
    text-align: center !important;
    font-size: 14px !important;
    color: #66766f !important;
}

.gl-auth-card h2 {
    text-align: center !important;
    margin: 0 0 26px !important;
}

.gl-auth-footer {
    text-align: center !important;
    margin-top: 20px !important;
}

.bienfolio-powered,
.gl-bienfolio-branding {
    text-align: center !important;
    margin-top: 10px !important;
    font-size: 13px !important;
}
