/* Vos styles personnalisés */
body {
    font-family: 'Mulish', sans-serif;
}

body h1 {
    text-align: center;
    max-width: 1160px;
    margin: 0 auto 75px;
    font: 400 60px "Mulish", sans-serif;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    position: relative;
}

.menus {
    display: flex;
    align-items: center;
    padding: 0 15px;
    height: 100%;
    width: max-content;
    font: 800 1.125rem "Mulish", sans-serif;
    color: #01426A;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: 0.2s all;
}

.on-header {
    display: block;
    background: #01426A;
    font: 400 15px "Mulish", sans-serif;
}

.liensHeader {
    border-right: 1px dotted #4E7489;
    padding-right: 8px;
    padding-left: 5px;
    display: inline-block;
    color: #fff;
}

.sous-header .flex {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: space-between;
}

.user-login-form label, .user-login-form legend {
    color: #A68B4E;
    font: 700 15px "Mulish", sans-serif;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: inline-block;
}

.btn-primary {
    color: #fff;
    background-color: #01426A;
    border-color: #01426A;
}

footer .copyright {
    font: 13px "Mulish", sans-serif;
    line-height: 29px;
    color: #8e8581;
    display: flex;
    justify-content: space-between;
}

.fond {
    background-color: rgb(245, 243, 237);
}

.chapo {
    font: 500 22px "Mulish", sans-serif;
    line-height: 30px;
    color: #000;
    text-align: justify;
    margin-bottom: 50px;
}

.contenu {
    font: 18px "Mulish", sans-serif;
    line-height: 28px;
    margin-bottom: 50px;
}

label.required:after {
    content: " *";
    color: red;
}

img.hoverEffect:hover {
    -ms-transform: scale(2.5); /* IE 9 */
    -webkit-transform: scale(2.5); /* Safari 3-8 */
    transform: scale(2.5);
}

img.widthimg {
    width: 200px;
}

.progress-bar-step1 { background-color: #ccffcc; } /* Light Green */
.progress-bar-step2 { background-color: #b3ff99; }
.progress-bar-step3 { background-color: #99ff66; }
.progress-bar-step4 { background-color: #80ff33; }
.progress-bar-step5 { background-color: #66ff00; }
.progress-bar-step6 { background-color: #33cc00; }
.progress-bar-step7 { background-color: #009900; }
.progress-bar-step8 { background-color: #006600; } /* Dark Green */

#tableindex {
    font-size: 0.9rem;
}
#tableindex td, #tableindex th {
    white-space: nowrap;
    padding: 0.5rem;
    vertical-align: middle;
}
#tableindex td:nth-child(2) {
    /* Colonne Type d'alerte - autoriser le retour à la ligne */
    white-space: normal;
    max-width: 200px;
}
#tableindex .badge {
    font-size: 0.75rem;
    padding: 0.25em 0.5em;
    white-space: normal;
    line-height: 1.4;
}
#tableindex .btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

/* Styles pour la visualisation des logs */
.log-content {
    scrollbar-width: thin;
    scrollbar-color: #555 #1e1e1e;
}

.log-content::-webkit-scrollbar {
    width: 8px;
}

.log-content::-webkit-scrollbar-track {
    background: #1e1e1e;
}

.log-content::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 4px;
}

.log-content::-webkit-scrollbar-thumb:hover {
    background: #777;
}

.log-line {
    transition: background-color 0.2s ease;
}

.log-line:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

.log-emergency {
    border-left-color: #8b0000 !important;
}

.log-alert {
    border-left-color: #dc3545 !important;
}

.log-critical {
    border-left-color: #dc3545 !important;
}

.log-error {
    border-left-color: #f48771 !important;
}

.log-warning {
    border-left-color: #ffc107 !important;
}

.log-notice {
    border-left-color: #17a2b8 !important;
}

.log-info {
    border-left-color: #4ec9b0 !important;
}

.log-debug {
    border-left-color: #808080 !important;
}

.log-level-badge {
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.log-timestamp {
    font-family: 'Courier New', monospace;
    font-size: 11px;
}

.log-json-content {
    margin-top: 4px;
}

.log-json-context,
.log-json-extra {
    font-family: 'Courier New', monospace;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Filtrage par niveau */
.log-line[data-level=""] {
    display: block;
}

/* Styles pour les niveaux spécifiques */
.log-emergency .log-message,
.log-alert .log-message,
.log-critical .log-message {
    color: #f48771;
}

.log-error .log-message {
    color: #f48771;
}

.log-warning .log-message {
    color: #dcdcaa;
}

.log-notice .log-message {
    color: #4ec9b0;
}

.log-info .log-message {
    color: #4ec9b0;
}

.log-debug .log-message {
    color: #808080;
}

/* Styles pour le mode plein écran */
#log-content-container:fullscreen {
    background-color: #1e1e1e;
    padding: 20px;
    font-size: 14px;
    max-height: 100vh;
    overflow-y: auto;
}

#log-content-container:-webkit-full-screen {
    background-color: #1e1e1e;
    padding: 20px;
    font-size: 14px;
    max-height: 100vh;
    overflow-y: auto;
}

#log-content-container:-moz-full-screen {
    background-color: #1e1e1e;
    padding: 20px;
    font-size: 14px;
    max-height: 100vh;
    overflow-y: auto;
}

#log-content-container:-ms-fullscreen {
    background-color: #1e1e1e;
    padding: 20px;
    font-size: 14px;
    max-height: 100vh;
    overflow-y: auto;
}