/* NERDUS BOTTOM SHEET - Versión Técnica Corregida
   - Max-width: 1024px (Sincronizado con div.texto).
   - Sin paddings forzados en header/h2 (control manual).
   - Esquina superior izquierda recta (0) para integración de imagen.
*/

.nerdus-bs {
    position: fixed;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
    
    width: 100%;
    max-width: 1024px; 
    
    max-height: 75vh; 
    
    background-color: white;
    border-top: 4px solid #df691a;
    /* Mantenemos esquina recta solo en el origen del abuelo */
    border-radius: 0 20px 0 0; 
    z-index: 10000;
    
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    
    display: flex;
    flex-direction: column;
    box-shadow: 0 -8px 30px rgba(0,0,0,0.25);
    
    /* overflow visible es mandatorio para que el avatar asome */
    overflow: visible; 
}

.nerdus-bs.active {
    transform: translateY(0);
}

/* AVATAR DEL ABUELO */
.nerdus-bs-avatar {
    position: absolute;
    /* Relación fija: ancho 130px requiere top -142px para asentar en el borde */
    top: -160px; 
    left: 0;
    width: 130px; 
    height: auto;
    z-index: 10001;
    pointer-events: none;
    
    opacity: 0;
    transition: opacity 0.3s ease-out;
}

.nerdus-bs.active .nerdus-bs-avatar {
    opacity: 1;
}

.nerdus-bs-avatar img {
    width: 100%;
    height: auto;
    filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.1));
}

.nerdus-bs-handle {
    width: 40px;
    height: 4px;
    background-color: #e0e0e0;
    border-radius: 2px;
    margin: 10px auto 5px;
    flex-shrink: 0;
}

.nerdus-bs-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* Eliminado padding lateral para control total desde el contenido */
    border-bottom: 1px solid #eee;
    background-color: white;
    flex-shrink: 0;
    border-radius: 0 20px 0 0;
}

.nerdus-bs-header h2 {
    color: #FF8040;
    margin: 0;
    /* Eliminado padding-left previo; ahora el texto inicia en el borde izquierdo */
    padding-left: 0; 
    font-size: 1.4rem;
    font-weight: bold;
    flex-grow: 1;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.nerdus-bs-close {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
}

.nerdus-bs-close svg {
    width: 40px;
    height: 40px;
    display: block;
}

.nerdus-bs-container {
    padding: 20px;
    overflow-y: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    -webkit-overflow-scrolling: touch;
    background-color: white;
}

.nerdus-bs-body {
    font-size: 12pt;
    line-height: 1.6;
    color: #333;
    text-align: left;
    margin-bottom: 15px;
}

.nerdus-bs-footer {
    background-color: #f4f9ff;
    padding: 15px;
    border-radius: 8px;
    margin-top: 5px;
    font-size: 11.5pt;
    border-left: 5px solid #3498db;
    color: #2c3e50;
    line-height: 1.5;
}

.nerdus-bs-footer:empty {
    display: none;
}

.nerdus-bs-container::-webkit-scrollbar {
    width: 8px;
}

.nerdus-bs-container::-webkit-scrollbar-track {
    background: #f9f9f9;
}

.nerdus-bs-container::-webkit-scrollbar-thumb {
    background: #df691a;
    border-radius: 4px;
}