/* ==========================================================================
   AGUAITA - ESTILOS CORPORATIVOS ORO & CARBÓN (WHITE-LABEL PREMIUM)
   ========================================================================== */

html, body {
    height: 100%;
    background-color: #121212 !important;
    color: #e6edf3 !important;
}

body {
    margin: 0;
    padding: 0;
}

.root {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Ocultar menciones y enlaces oficiales de Traccar */
a[href*="traccar.org"], 
a[href*="traccar"],
.MuiTypography-caption a {
    display: none !important;
}

/* Forzar Fondo Oscuro Carbón en la pantalla de Login y Paneles */
.MuiPaper-root, 
.MuiCard-root, 
[class*="login-container"], 
[class*="Paper-root"] {
    background-color: #1a1c23 !important;
    color: #ffffff !important;
    border-color: #30363d !important;
}

/* Forzar que todos los textos dentro de componentes oscuros sean blancos o gris claro */
.MuiTypography-root,
.MuiListItemText-primary,
.MuiListItemText-secondary,
.MuiTableCell-root,
.MuiInputBase-input {
    color: #ffffff !important;
}

/* Estilo del Popup del Mapa (Leaflet) en modo oscuro de lujo */
.leaflet-popup-content-wrapper, 
.leaflet-popup-tip {
    background-color: #1a1c23 !important;
    color: #ffffff !important;
    border: 1px solid #30363d !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.8) !important;
}

.leaflet-popup-content, 
.leaflet-popup-content * {
    color: #ffffff !important;
}

/* Enlaces del popup del mapa en dorado */
.leaflet-popup-content a {
    color: #d4af37 !important;
    text-decoration: none !important;
    font-weight: bold !important;
}

.leaflet-popup-content a:hover {
    text-decoration: underline !important;
}

/* Botón cerrar del popup del mapa */
.leaflet-popup-close-button {
    color: #ffffff !important;
}

/* Rediseño de Botones Principales a Dorado Metálico */
.MuiButton-containedPrimary,
.MuiButton-contained,
[class*="MuiButton-containedPrimary"],
button[type="submit"] {
    background: linear-gradient(145deg, #d4af37, #c59b27) !important;
    color: #000000 !important;
    font-weight: 850 !important;
    border-radius: 20px !important;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3) !important;
    text-transform: uppercase !important;
    border: none !important;
}

.MuiButton-containedPrimary:hover,
button[type="submit"]:hover {
    background: #e6c35c !important;
    box-shadow: 0 4px 20px rgba(212, 175, 55, 0.5) !important;
}

/* Campos de entrada (inputs) de formulario */
.MuiOutlinedInput-root {
    background-color: rgba(0, 0, 0, 0.3) !important;
    border-radius: 12px !important;
}

.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
    border-color: #d4af37 !important;
}

.MuiInputLabel-root.Mui-focused {
    color: #d4af37 !important;
}

/* Encabezados y barras de herramientas */
.MuiAppBar-root, 
header,
[class*="MuiAppBar-root"] {
    background-color: #0d1117 !important;
    border-bottom: 2px solid #d4af37 !important;
}

/* Lista de vehículos seleccionada */
.Mui-selected, 
[class*="selected"] {
    background-color: rgba(212, 175, 55, 0.15) !important;
    border-left: 3px solid #d4af37 !important;
}

/* Scrollbars personalizadas estilo dark */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: #121212;
}
::-webkit-scrollbar-thumb {
    background: #d4af37;
    border-radius: 10px;
}