/* --- RESET Y VARIABLES --- */
* { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box; 
}

:root {
    --azul-fca: #1a3052;
    --blanco: #ffffff;
    --dorado-unam: #d4af37;
    --bg-visor: #1e1e1e;
    --bg-toolbar: rgba(26, 48, 82, 0.95);
}

body {
    font-family: 'Inter', sans-serif;
    overflow: hidden;
    height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: var(--bg-visor);
    background-image: url('../img/yac2.jpeg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/* --- CONTENEDOR DEL VISOR --- */
.viewer-main {
    background-image: url('../img/yac_final.jpg');
    background-size: cover;
    flex: 1;
    display: flex;
    justify-content: center;
    /* Alinea el contenido arriba para que la revista quede pegada al header */
    align-items: flex-start; 
    position: relative;
    padding: 0; /* Quitamos el padding para eliminar la separación superior e inferior */
    overflow: hidden;
}

/* Contenedor del libro (tamaño visual adaptativo) */
.book-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;           /* Ocupa todo el alto entre header y footer */
    max-height: 100%;
    width: auto;
    max-width: 100%;        
    min-width: 0;
    min-height: 0;          
    aspect-ratio: 10 / 7;   /* Proporción vista doble escritorio (1000x700) */
    overflow: visible;
}

/* Estilos de las páginas insertadas */
.page {
    background-color: white;
    box-shadow: inset 0 0 15px rgba(0,0,0,0.1);
    overflow: hidden;
}

.page img {
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

/* Sombra profunda para la zona central del libro (lomo) */
.page.--left { 
    border-right: 1px solid rgba(0,0,0,0.1); 
    box-shadow: inset -10px 0 20px rgba(0,0,0,0.1); 
    margin-bottom: 20%; 
}
.page.--right { 
    border-left: 1px solid rgba(0,0,0,0.1); 
    box-shadow: inset 10px 0 20px rgba(0,0,0,0.1); 
    margin-bottom: 20%; 
}

/* Transición suave al recentrar el libro */
#revista {
    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

#fca-print-root {
    position: absolute;
    left: -9999px;
    top: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    pointer-events: none;
}

/* --- VISTA RESPONSIVA (MÓVILES Y TABLETAS) --- */
@media (max-width: 768px) {

    /* 1. Control de capas para evitar solapamientos */
    .fca-header          { z-index: 1000; }
    .fca-sidebar-overlay { z-index: 1100; }
    .fca-sidebar         { z-index: 1200; }
    .fca-share-container { z-index: 1300; }
    .viewer-main,
    .book-wrapper        { z-index: 1; }

    /* 2. Pegar el visor al header */
    .viewer-main {
        align-items: flex-start; /* Pega el contenedor al borde superior */
        padding-top: 20px;          /* Elimina cualquier margen/relleno con el header */
        padding-bottom: 10px;
    }

    /* 3. Conservar tamaño móvil y proporción de 1 página */
    .book-wrapper {
        /* Mantiene una altura contenida para que no crezca demasiado */
        height: min(calc(100vh - 200px), 480px); 
        width: auto;
        max-width: 90vw;         /* Evita que toque las orillas laterales */
        aspect-ratio: 5 / 7;     /* Proporción para 1 página en móvil */
        margin: 0 auto;          /* Centrado horizontal */
    }
}