:root {
    --bs-primary: #4f8cff;
    --bs-primary-rgb: 79, 140, 255;
}

/* Toutes les barres de navigation du portail suivent le même schéma :
   un bloc "identité" (logo/nom/badges) à gauche, un bloc "actions"
   (Retour + menu utilisateur) à droite, sans bouton hamburger/collapse.
   Le bloc actions ne doit jamais passer à la ligne (mauvais rendu sur
   mobile) : c'est donc le bloc identité, potentiellement plus long
   (nom de serveur variable), qui cède de la place en se tronquant avec
   des points de suspension plutôt que de forcer tout le bloc actions
   en dessous ou de provoquer un débordement horizontal de la page. */
/* Bootstrap force flex-wrap:nowrap sur .navbar via .navbar-expand (pensé
   pour ne jamais faire passer les liens de nav à la ligne) — ça empêche
   aussi le second .container-fluid (server_brand_meta.php) de passer sous
   le premier, il se retrouve compressé sur la même ligne à droite. On
   rétablit le wrap au niveau de .navbar (chaque .container-fluid fait
   100% de large, donc le second ne peut que passer à la ligne), tout en
   gardant nowrap à l'intérieur de chaque .container-fluid pris
   individuellement (règle suivante) pour que identité/actions restent
   toujours sur une seule ligne entre eux. */
.navbar.navbar-expand {
    flex-wrap: wrap;
}

.navbar .container-fluid {
    flex-wrap: nowrap;
}

.navbar .container-fluid > :first-child {
    min-width: 0;
}

.navbar .container-fluid > :last-child {
    flex-shrink: 0;
}

#serverDisplayName {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.output {
    background: #000;
    color: #d7d7d7;
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    font-size: 0.85rem;
    white-space: pre-wrap;
    overflow-x: auto;
    border-radius: var(--bs-border-radius);
    padding: 0.75rem;
    margin: 0;
}

.log-output {
    height: 320px;
    overflow-y: auto;
}

/* Contraste élevé (Paramètres → Accessibilité) : renforce les contrastes
   texte/fond au-dessus du thème clair ou sombre actif plutôt que d'en
   ajouter un troisième — pas de media query prefers-contrast ici, purement
   un choix explicite de l'utilisateur (voir accessibility.js). */
:root[data-contrast="high"] {
    --bs-body-bg: #000000;
    --bs-body-color: #ffffff;
    --bs-secondary-color: #e0e0e0;
    --bs-border-color: #ffffff;
    --bs-card-bg: #000000;
    --bs-tertiary-bg: #1a1a1a;
}

:root[data-bs-theme="light"][data-contrast="high"] {
    --bs-body-bg: #ffffff;
    --bs-body-color: #000000;
    --bs-secondary-color: #1a1a1a;
    --bs-border-color: #000000;
    --bs-card-bg: #ffffff;
    --bs-tertiary-bg: #e8e8e8;
}

[data-contrast="high"] .card,
[data-contrast="high"] .form-control,
[data-contrast="high"] .form-select,
[data-contrast="high"] .btn {
    border-width: 2px;
}

[data-contrast="high"] .text-secondary {
    color: var(--bs-secondary-color) !important;
}

/* Réduire les animations (Paramètres → Accessibilité) : coupe transitions/
   animations CSS quel que soit leur déclencheur (bascule de thème,
   modales Bootstrap, défilement de navigation...) — technique standard
   équivalente à la media query prefers-reduced-motion, mais pilotée par un
   réglage explicite (voir accessibility.js, qui applique aussi ce mode par
   défaut si le système le demande et qu'aucun choix explicite n'a encore
   été fait). */
[data-motion="reduce"] *,
[data-motion="reduce"] *::before,
[data-motion="reduce"] *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
}