:root {
    /* Accents (inspiration BatiSimply): rester sobre, lisible */
    --brand-primary: #0d6efd; /* Bootstrap primary */
    --brand-bg: #f8f9fa;
}

body { background: var(--brand-bg); }

/* Cartes lisibles */
.card { border-radius: 1rem; }
.card .card-title { font-weight: 600; }

/* Accessibilité: focus visible */
:focus { outline: 3px solid rgba(13,110,253,.6); outline-offset: 2px; }

/* Barre latérale compacte */
.sidebar { min-width: 260px; }

/* Topnav - déplacement de la variable CSS du breadcrumb (auparavant inline) */
header[role="navigation"] .breadcrumb {
    --bs-breadcrumb-divider-color: rgba(255,255,255,.5);
}

/* Progression d'un chantier - la largeur est contrôlée par la variable --progress (définie depuis le template) */
.worksite-progress .progress-bar {
    width: var(--progress, 0%);
    transition: width .18s ease-in-out;
}

/* ===== Mobile specific helpers (placed here to avoid a new file) ===== */
/* Espace réservé pour topbar et bottombar fixes */
.mobile-content {
    /* espace pour la topbar fixe et la bottombar fixe */
    padding-top: 3.5rem; /* ~56px topbar */
    padding-bottom: 5.5rem; /* ~88px bottom bar + confort */
}

/* Petite taille des icônes SVG utilisées dans l'UI mobile */
.bf-icon {
    width: 22px;
    height: 22px;
    display: block;
}

/* Menu flottant mobile (ouvrir via JS en toggle d-none / d-block) */
.mobile-menu {
    position: fixed;
    right: 12px;
    bottom: 76px; /* au-dessus de la bottombar */
    z-index: 1050;
    min-width: 160px;
    max-width: 320px;
}

/* Petits ajustements pour que les nav-links s'affichent correctement en mobile */
.navbar.fixed-bottom .nav-link, .navbar.fixed-top .nav-link { padding-top: .25rem; padding-bottom: .25rem; }

/* Responsive : réduire paddings sur très petites tailles si besoin */
@media (max-width: 420px) {
    .mobile-content { padding-left: .5rem; padding-right: .5rem; }
    .mobile-menu { right: 8px; left: 8px; }
}

/* End mobile helpers */