@charset "UTF-8";
/* Xtrema FM Panel CSS - v2.2 (Dropdown Fix) */

/* --- VARIABLES & FUENTES --- */
:root {
    --pink: #ff1493; --pink-90: #e61284;
    --blue: #00aeef; --blue-90: #009dd7;
    --fluor: #ecfd23;
    --ink: #0f0f1a; 
    --white: #ffffff;
}

@font-face { font-family: core-sans-light; src: url(../fonts/coresansc-35light-webfont.woff2) format("woff2"); }
@font-face { font-family: core-sans-regular; src: url(../fonts/coresansc-45regular-webfont.woff2) format("woff2"); }
@font-face { font-family: core-sans-bold; src: url(../fonts/coresansc-65bold-webfont.woff2) format("woff2"); }
@font-face { font-family: core-sans-heavy; src: url(../fonts/coresansc-85heavy-webfont.woff2) format("woff2"); }
@font-face { font-family: core-sans-heavy-it; src: url(../fonts/coresansc-85heavyit-webfont.woff2) format("woff2"); }

/* ESTILOS GLOBALES */
body { 
    font-family: core-sans-regular; 
    background-color: var(--ink); 
    color: var(--white); 
    font-size: 0.9rem; 
}

h1, h2, h3, h4, h5, h6 { 
    text-transform: uppercase; 
    color: var(--white); 
}

a { color: var(--blue); text-decoration: none; transition: 0.2s; }
a:hover { color: var(--pink); cursor: pointer; }

/* FORZAR BLANCOS EN TEXTOS SECUNDARIOS */
.text-muted, .form-text, small {
    color: rgba(255, 255, 255, 0.7) !important;
}

.text-white-50 {
    color: rgba(255, 255, 255, 0.5) !important;
}

label, .form-label {
    color: var(--white) !important;
}

/* UTILIDADES */
.font-heavy { font-family: core-sans-heavy; }
.font-bold { font-family: core-sans-bold; }
.text-pink { color: var(--pink) !important; }
.text-blue { color: var(--blue) !important; }

/* COMPONENTES PANEL */
.btn { font-family: core-sans-bold-it; text-transform: uppercase; border-radius: 0; border: none; }
.btn-pink { background-color: var(--pink); color: white; }
.btn-pink:hover { background-color: var(--pink-90); color: white; }
.btn-blue { background-color: var(--blue); color: white; }
.btn-blue:hover { background-color: var(--blue-90); color: white; }
.btn-outline-pink { border: 1px solid var(--pink); color: var(--pink); background: transparent; }
.btn-outline-pink:hover { background: var(--pink); color: white; }
.btn-outline-light { border-color: rgba(255,255,255,0.5); color: white; }
.btn-outline-light:hover { background-color: white; color: var(--ink); }

/* FORMULARIOS */
.form-control, .form-select { 
    background-color: rgba(255,255,255,0.1); 
    border: 1px solid #444; 
    color: var(--white) !important; 
    border-radius: 0; 
}

.form-control::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.form-control:focus, .form-select:focus { 
    background-color: rgba(255,255,255,0.15); 
    color: var(--white); 
    border-color: var(--pink); 
    box-shadow: none; 
}

/* CORRECCIÓN DESPLEGABLES (Fondo Negro para Opciones) */
.form-select option {
    background-color: #000; /* Fondo negro forzado */
    color: white;           /* Texto blanco */
}

/* SIDEBAR & LAYOUT */
.sidebar { min-height: 100vh; border-right: 1px solid #333; background-color: var(--ink); }
.sidebar-logo { max-width: 60%; margin: 0 auto; display: block; } 

.nav-link { 
    font-family: core-sans-bold; 
    color: rgba(255,255,255,0.8); 
    text-transform: uppercase; 
    padding: 0.8rem 1.5rem; 
    font-size: 0.85rem; 
}

.nav-link:hover, .nav-link.active { 
    color: var(--white); 
    background: linear-gradient(90deg, var(--pink) 0%, transparent 100%); 
}

.nav-link i { margin-right: 10px; }

.nav-title { 
    font-size: 0.75rem; 
    color: var(--white);
    opacity: 0.6;
    padding: 1rem 1.5rem 0.5rem; 
    letter-spacing: 1px; 
    font-weight: bold; 
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 0.5rem;
    margin-top: 1rem;
}

/* CARDS & TABLES */
.card-custom { background-color: #161621; border: 1px solid #333; border-radius: 0; }

.table-dark { --bs-table-bg: transparent; --bs-table-color: var(--white); border-color: #333; }
.table-dark th { color: var(--blue); font-family: core-sans-bold; text-transform: uppercase; font-size: 0.8rem; border-bottom: 1px solid #555; }
.table-dark td { color: rgba(255,255,255,0.9); border-bottom: 1px solid #333; }
.table-hover > tbody > tr:hover > * {
    color: var(--white);
    background-color: rgba(255,255,255,0.05);
}

.badge { border-radius: 0; font-family: core-sans-bold; }

/* MODALES */
.modal-content { background-color: var(--ink); color: var(--white); border: 1px solid var(--pink); }
.modal-header, .modal-footer { border-color: #333; }
.btn-close { filter: invert(1) grayscale(100%) brightness(200%); }