/* ======================================================
   NEUROMAR AI - CORRECCIÓN FORZADA DE FUENTES
   Usa selectores ultra específicos para sobrescribir todo
   ====================================================== */

/* --- FORZAR TAMAÑO BASE DEL HTML --- */
html {
    font-size: 12px !important; /* Base más pequeña para todo */
}

/* --- VIEWPORT CORRECTO --- */
body {
    min-height: 100vh !important;
    height: 100vh !important;
    overflow: hidden !important;
    font-size: 0.875rem !important; /* Forzar tamaño base del body */
}

.main-grid {
    height: 100vh !important;
    min-height: 100vh !important;
    width: 100vw !important;
    max-width: 100vw !important;
    display: grid !important;
    grid-template-columns: 300px 1fr !important;
    grid-template-rows: 100vh !important;
}

/* --- FUENTES ESPECÍFICAS FORZADAS --- */
body .chat-header h1,
body .chat-header .title,
body .title-glow,
html body .chat-header h1,
html body .chat-header .title,
html body .title-glow {
    font-size: 1.75rem !important; /* Muy específico para el título */
    line-height: 1.2 !important;
}

/* Subtítulo "Creado en CompuMar" */
body .chat-header .title span,
html body .chat-header .title span {
    font-size: 0.75rem !important;
}

/* Texto del header */
body .chat-header p,
body .chat-header .text-sm,
html body .chat-header p,
html body .chat-header .text-sm {
    font-size: 0.8rem !important;
}

/* Selectores del header */
body .chat-header select,
body .chat-header #agent-selector,
body .chat-header #paradigm-selector,
html body .chat-header select,
html body .chat-header #agent-selector,
html body .chat-header #paradigm-selector {
    font-size: 0.8rem !important;
}

/* Labels de los selectores */
body .chat-header label,
html body .chat-header label {
    font-size: 0.75rem !important;
}

/* --- SIDEBAR FORZADA --- */
body .sidebar,
body .sidebar *,
html body .sidebar,
html body .sidebar * {
    font-size: 0.85rem !important;
}

body .sidebar h1,
body .sidebar h2,
body .sidebar h3,
html body .sidebar h1,
html body .sidebar h2,
html body .sidebar h3 {
    font-size: 1.1rem !important;
}

/* Botón "Nueva Hebra Cognitiva" */
body #new-chat-button,
html body #new-chat-button {
    font-size: 0.85rem !important;
}

/* Items del historial */
body .history-item,
html body .history-item {
    font-size: 0.8rem !important;
}

/* Campo de búsqueda */
body #history-search,
html body #history-search {
    font-size: 0.8rem !important;
}

/* --- MENSAJES FORZADOS --- */
body .message,
body .message *,
html body .message,
html body .message * {
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
}

body .message-content,
html body .message-content {
    font-size: 0.9rem !important;
}

/* Avatar de mensajes */
body .message .avatar,
html body .message .avatar {
    font-size: 1rem !important;
}

/* --- INPUT Y CONTROLES FORZADOS --- */
body #prompt-input,
html body #prompt-input {
    font-size: 0.95rem !important;
}

body .input-btn,
html body .input-btn {
    font-size: 0.9rem !important;
}

/* Contador de tokens */
body #token-counter,
html body #token-counter {
    font-size: 0.7rem !important;
}

/* Botón de envío */
body #submit-button,
body #submit-button span,
html body #submit-button,
html body #submit-button span {
    font-size: 0.75rem !important;
}

/* --- TODOS LOS SELECTORES --- */
body select,
body option,
html body select,
html body option {
    font-size: 0.8rem !important;
}

/* --- TODOS LOS BOTONES --- */
body button,
html body button {
    font-size: 0.8rem !important;
}

/* --- LAYOUT CONTAINERS --- */
.sidebar {
    height: 100vh !important;
    overflow-y: auto !important;
    flex-shrink: 0 !important;
}

.chat-container {
    height: 100vh !important;
    min-height: 100vh !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

.chat-messages {
    flex: 1 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto !important;
    min-height: 0 !important;
}

.chat-header {
    flex-shrink: 0 !important;
}

footer {
    flex-shrink: 0 !important;
    margin-top: 0 !important;
}

/* --- MOBILE --- */
@media (max-width: 768px) {
    .main-grid {
        grid-template-columns: 1fr !important;
    }
    
    .sidebar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: min(300px, 85vw) !important;
        height: 100vh !important;
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease !important;
        z-index: 40 !important;
    }
    
    .sidebar.open {
        transform: translateX(0) !important;
    }
    
    /* Fuentes más pequeñas en móvil */
    html {
        font-size: 12px !important;
    }
    
    body .chat-header h1,
    body .chat-header .title {
        font-size: 1.5rem !important;
    }
}

/* --- PREVENIR OVERFLOW --- */
html {
    overflow-x: hidden !important;
}

body {
    overflow-x: hidden !important;
}

* {
    box-sizing: border-box !important;
}

.message {
    max-width: 85% !important;
    word-wrap: break-word !important;
}

#prompt-input {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* --- ESCALADO ESPECÍFICO PARA PANTALLAS GRANDES --- */
@media (min-width: 1400px) {
    html {
        font-size: 15px !important; /* Ligeramente más grande en pantallas grandes */
    }
}