/* ============================================================
   KELLERSTORE V2 — Topbar pleine largeur (ADDITIF)

   La topbar traverse tout l'ecran ; la sidebar commence dessous
   et le logo vit dans la topbar. Regle le rognage du logo dans la
   sidebar repliee : elle n'offrait que 50 px utiles
   (74 px - 2 x 0.75rem de padding) pour un logo large de 79 px.

   Va de pair avec le deplacement de <header class="app-topbar">
   au-dessus de .app-container dans app/views/layout.php.

   A charger APRES theme-2026.css.
   Pour desactiver : retirer la balise <link> dans layout.php
   ET remettre la topbar dans .app-main.
   ============================================================ */

:root {
    /* Hauteur de reference de la topbar.
       Mesure : padding py-2 (16 px) + plus haut enfant (hamburger 40 px)
       + bordure basse (1 px) = 57 px. 58 px couvre desktop et mobile.
       C'est la SEULE valeur a ajuster si le contenu de la topbar change :
       le decalage de la sidebar et du tiroir en decoulent. */
    --ks-topbar-h: 58px;
}

/* ============================================================
   1. LA TOPBAR TRAVERSE L'ECRAN
   ============================================================ */

.app-topbar--full {
    position: sticky;
    top: 0;
    /* Au-dessus du tiroir mobile (1050) et de son voile (1040),
       pour rester cliquable quand le tiroir est ouvert. */
    z-index: 1060;
    min-height: var(--ks-topbar-h);
    display: flex;
    align-items: stretch;
}

.app-topbar--full > .topbar {
    flex: 1 1 auto;
    min-width: 0;
}

/* ============================================================
   2. LE CONTENU COMMENCE SOUS LA TOPBAR
   ============================================================ */

.app-container {
    min-height: calc(100vh - var(--ks-topbar-h));
}

/* La sidebar colle sous la topbar, pas sous le haut de l'ecran.
   ATTENTION — bug dormant reveille ici : app.css declare
   .ks-sidebar-sticky { position: sticky } mais est charge AVANT
   layout-theme.css, qui declare .ks-sidebar { position: relative }.
   Meme specificite (0,1,0) -> le dernier charge gagne, et la sidebar
   n'a donc jamais ete sticky. Avec top:0 le defaut passait inapercu ;
   avec top:58px il aurait pousse la sidebar de 58 px vers le bas.
   D'ou le selecteur double (0,2,0), qui restaure vraiment le sticky. */
.ks-sidebar.ks-sidebar-sticky {
    position: sticky;
    top: var(--ks-topbar-h);
    height: calc(100vh - var(--ks-topbar-h));
    /* sans ceci, l'aside est etire par le flex et le sticky ne prend pas */
    align-self: flex-start;
}

/* ============================================================
   3. LA MARQUE DANS LA TOPBAR
   Le logo source a un fond blanc opaque : une plaque blanche
   discrete l'assume au lieu de laisser un rectangle flotter.
   ============================================================ */

.topbar-brand-logo {
    height: 36px;
    width: auto;
    display: block;
    flex-shrink: 0;
    background: #ffffff;
    border-radius: 5px;
    padding: 2px 5px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .10);
}

/* ============================================================
   4. MOBILE — le tiroir demarre sous la topbar
   ============================================================ */

@media (max-width: 991.98px) {
    .ks-sidebar {
        top: var(--ks-topbar-h) !important;
        height: calc(100vh - var(--ks-topbar-h)) !important;
    }
    /* Le voile s'arrete sous la topbar : le hamburger reste atteignable */
    .ks-drawer-backdrop {
        top: var(--ks-topbar-h);
    }
}

@media (max-width: 480px) {
    /* Le libelle de l'institution est masque a cette taille (regle
       existante) : le logo porte seul l'identite, on le garde lisible. */
    .topbar-brand-logo {
        height: 34px;
    }
}
