@font-face {
            font-family: 'Futura Bk BT';
            src: local('Futura Bk BT'), local('Futura-Book'), url('https://fonts.cdnfonts.com/s/13677/FuturaBkBT.woff') format('woff');
            font-display: swap;
        }
        .font-monotype {
            font-family: "Monotype Corsiva", "Apple Chancery", cursive;
        }

:root {
            
    
--base-font-size: 16px; /* Valor por defecto */
}
html {
    font-size: var(--base-font-size);
}
body {
    font-size: 1rem; /* Hará que todo escale en base a la variable */
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Modo Oscuro real para Apps */
html.dark body {
    background: #0C0C0C !important; 
}

html.dark .bg-custom-cream {
    background-color: #1A1A1A !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255,255,255,0.1);
}

html.dark h1, html.dark h3, html.dark p {
    color: #FFFFFF !important;
}


/* Efecto para el botón de Gris (TDAH) */
.grayscale-mode {
    filter: grayscale(100%);
}


/* UBICACIÓN: Al final de css/apps.css */

/* Modo Alto Contraste */
.acc-high-contrast body {
    filter: contrast(150%) brightness(110%);
    background: #000 !important;
}
.acc-high-contrast * {
    color: #ffff00 !important;
    border-color: #ffff00 !important;
}

/* Modo Grayscale (Gris) */
.acc-grayscale body {
    filter: grayscale(100%) !important;
}

/* Modo Sepia (Lectura) */
.acc-sepia body {
    filter: sepia(0.8) !important;
}
.acc-sepia .bg-custom-cream {
    background-color: #f4ecd8 !important;
}

/* Modo Noche Suave */
.acc-dark-soft body {
    filter: brightness(0.7) blue-shift(0.2);
    background: #0f172a !important;
}


/* --- EFECTO DORADO PARA EL MENÚ FULLSCREEN --- */

/* Estilo base para los círculos del menú (opcional si ya los tienes, para asegurar la transición) */
#fullscreen-menu .flex-shrink-0 {
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Efecto HOVER: Cambia el fondo del círculo a dorado y el texto a dorado */
#fullscreen-menu a:hover .flex-shrink-0 {
    background-color: #d4af37 !important; /* Dorado */
    border-color: #d4af37 !important;
    transform: scale(1.05); /* Un pequeño aumento visual */
}

#fullscreen-menu a:hover span {
    color: #d4af37 !important; /* Texto dorado */
}

/* Si usas iconos de Material Symbols, forzar el color dentro del círculo */
#fullscreen-menu a:hover .material-symbols-outlined {
    color: #d4af37 !important; /* El icono se mantiene blanco sobre el fondo dorado */
}

/* Ajuste para Modo Oscuro en el menú de Apps */
html.dark #fullscreen-menu a:hover .flex-shrink-0 {
    background-color: #8f6d32 !important; /* Dorado más oscuro para modo dark */
}