/* ZaZa Réseau — mise en forme minimale.
   Tout le reste vient de MudBlazor : dupliquer une charte ici la ferait
   diverger du back-office au premier ajustement. */

html, body {
    font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
    margin: 0;
}

/* Écran d'attente pendant le téléchargement du runtime .NET : sur une
   connexion congolaise, il peut durer plusieurs secondes. Une page blanche y
   ressemble à une panne. */
.chargement {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #fff;
}

.chargement-marque {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #1976d2;
}

.chargement-texte {
    margin-top: 6px;
    font-size: 14px;
    color: #6b7280;
}

#blazor-error-ui {
    background: #fffbe6;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, .2);
    display: none;
    left: 0;
    padding: 0.8rem 1.2rem 0.8rem 1.4rem;
    position: fixed;
    width: 100%;
    z-index: 1200;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.8rem;
    top: 0.6rem;
}

/* ── Calque trafic (js/trafic-calque.js) : bouton de la barre et sélecteur dans le cadre de la carte ── */
.zz-btn-trafic {
    border: 1px solid var(--mud-palette-primary, #1a56db); color: var(--mud-palette-primary, #1a56db);
    background: #fff; border-radius: 4px; padding: 6px 14px; font: inherit; font-weight: 500;
    text-transform: uppercase; letter-spacing: .02em; cursor: pointer;
}
.zz-btn-trafic.primary { background: var(--mud-palette-primary, #1a56db); color: #fff; }
.zz-btn-trafic.primary.trafic-direct { background: #ea4335; border-color: #ea4335; }
#zz-trafic-hote #zz-trafic-selecteur { position: absolute; top: 12px; left: 12px; right: auto; width: 380px; max-width: calc(100% - 24px); z-index: 1100; }

/* Icône « lit » des hôtels (01/10/2026), comme Google Maps. Bootstrap Icons n'a pas de lit :
   tracé Material Icons « hotel » (Apache 2.0) en masque, à la couleur du texte. S'emploie
   comme une icône Bootstrap : <i class="bi bi-zz-lit"></i>. Même tracé dans lieux-carte.js. */
.bi.bi-zz-lit::before {
    content: "" !important;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 13c1.66 0 3-1.34 3-3S8.66 7 7 7s-3 1.34-3 3 1.34 3 3 3zm12-6h-8v7H3V5H1v15h2v-3h18v3h2v-9c0-2.21-1.79-4-4-4z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 13c1.66 0 3-1.34 3-3S8.66 7 7 7s-3 1.34-3 3 1.34 3 3 3zm12-6h-8v7H3V5H1v15h2v-3h18v3h2v-9c0-2.21-1.79-4-4-4z'/%3E%3C/svg%3E") no-repeat center / contain;
}