/* Styles communs aux pages de balises (luchon.html, val-louron.html, …). */

/* iOS/Safari : 100dvh suit la zone réellement visible (barre d'adresse dynamique),
   sinon le pied de page passe sous la barre. Fallback 100vh pour les vieux navigateurs. */
.min-vh-100 {
    min-height: 100dvh !important;
}

/* Poignée de glissé pour réordonner les balises (zone tactile large pour le mobile). */
.drag-handle {
    font-size: 28px;
    cursor: grab;
    touch-action: none; /* évite que le scroll capture le geste sur la poignée */
    padding: 4px 6px;
}

.sortable-chosen {
    background-color: #f8f9fa;
}

.sortable-ghost {
    opacity: .35;
}

/* Onglet sans balise (désactivé par app.js) : gris très léger. */
#balisesTabs .nav-link.disabled {
    color: #d8d8d8;
}

/* Icônes des cartes fixes du sommaire (« Autour de moi », « Créer ma page »).
   Ne pas utiliser les utilitaires de couleur Bootstrap (text-primary…) : ils posent
   color !important, qui l'emporterait sur ces règles. */
.icon-around,
.icon-creer {
    font-size: 2rem;
}

.icon-around, .icon-creer, .icon-around-mini, .icon-creer-mini {
    color: orangered;
}

/* Icônes inline « mini » (au fil du texte, info.html) : centrées verticalement avec le
   texte qui les encadre, plutôt que posées sous la ligne de base (défaut de Bootstrap
   Icons : vertical-align: -.125em sur le ::before). */
.icon-around-mini::before,
.icon-creer-mini::before {
    vertical-align: middle;
}