/* Personalización Colonia Suiza para Semaphore UI - Colores GLPI */
:root {
    --cs-cyan: #00c7be;
    --cs-sidebar-bg: #0e171e;
    --cs-main-bg: #121c24;
    --cs-card-bg: #1a2832;
    --cs-border: #233442;
}

/* 1. Header y Logo Centrado (42px) */
.v-toolbar__title {
    background-image: none !important;
}

header.v-toolbar, .v-app-bar {
    background-image: url('/custom-logo.png') !important;
    background-repeat: no-repeat !important;
    background-size: auto 42px !important;
    background-position: center center !important;
    background-color: var(--cs-sidebar-bg) !important;
    border-bottom: 2px solid var(--cs-cyan) !important;
}

/* 2. Menú Lateral Izquierdo y Contenedores */
.v-navigation-drawer {
    background-color: var(--cs-sidebar-bg) !important;
    border-right: 1px solid var(--cs-border) !important;
}

.v-data-table, .v-sheet, .v-paper {
    background-color: var(--cs-card-bg) !important;
    border: 1px solid var(--cs-border) !important;
}

/* 3. Colores y Acentos Cyan */
a, .v-tab--active, .v-list-item--active {
    color: var(--cs-cyan) !important;
}

/* Fix para el botón NEW TEMPLATE y botones primarios */
.v-btn.primary, 
.v-btn--contained.primary,
button.v-btn.primary,
header .v-btn.primary {
    background-color: var(--cs-cyan) !important;
    border-color: var(--cs-cyan) !important;
    color: #0e171e !important; /* Texto oscuro para máximo contraste */
    font-weight: bold !important;
}

.v-btn.primary .v-btn__content,
header .v-btn.primary .v-btn__content {
    color: #0e171e !important;
}

/* 4. Modales y Diálogos */
.v-dialog, .v-dialog .v-card {
    background-color: #16222b !important;
    border: 1px solid var(--cs-cyan) !important;
}

.v-dialog .v-card__title {
    color: #ffffff !important;
}