/* ==========================================================
   TEMA DARK TEMPLADO - CELESTE SUAVE & LETRA FINA
   ========================================================== */

/* 1. Fondo principal y texto gris mate para lectura cómoda */
body {
    background-color: #111318 !important; 
    color: #9da3ae !important;
    font-family: system-ui, -apple-system, sans-serif !important;
}

/* 2. Limpieza de contenedores para evitar cajas dobles */
.container, .content-wrapper, .section {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. Tarjeta Principal (Fondo oscuro elegante con bordes tenues) */
.card, .grey-box, .tab-content {
    background: #181a20 !important; 
    border: 1px solid #262932 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
    padding: 24px !important;
}

/* 4. Barra Superior (Navbar) estilo mate */
.navbluesky {
    background-color: #181a20 !important;
    border-bottom: 1px solid #262932 !important;
    color: #d1d5db !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}

/* 5. Títulos principales */
h1, h2, h3, h4, .card-title, .section-title {
    color: #e2e8f0 !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

/* 6. Botón / Pestaña "LINKS FREE" (Celeste mate, nada de brillos raros) */
.activetab, .buttonsky, .btn-primary {
    background: #0284c7 !important; /* Celeste azulado sobrio */
    color: #ffffff !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 5px 14px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    box-shadow: none !important;
}

/* 7. ENLACES DE DESCARGA (Finos, sin negrita y celeste templado) */
.card-sky, .text-link, a {
    color: #38bdf8 !important; /* Celeste templado y suave */
    text-decoration: none !important;
    font-weight: 400 !important; /* Letra FINA (Soluciona lo 'grueso') */
    transition: color 0.2s ease !important;
}

a:hover, .text-link:hover {
    color: #7dd3fc !important; /* Un poco más claro al pasar el mouse */
    text-decoration: underline !important;
}

/* 8. Botón Rojo de Alerta / Reporte */
.buttonred {
    background-color: #991b1b !important;
    color: #fecdd3 !important;
    border: 1px solid #7f1d1d !important;
    border-radius: 5px !important;
    padding: 5px 12px !important;
    font-weight: 500 !important;
}

.buttonred:hover {
    background-color: #b91c1c !important;
}

/* 9. Textos secundarios (Visitas, datos del uploader) */
.text-muted, small, p, .breadcrumb-item {
    color: #808795 !important;
}

/* 10. Pie de página */
#sticky-footer {
    background-color: #181a20 !important;
    border-top: 1px solid #262932 !important;
    color: #64748b !important;
}