@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&family=Stardos+Stencil:wght@400;700&display=swap');

:root {
    --color-primary: #8B5A2B;
    --color-secondary: #D2B48C;
    --color-accent: #A52A2A;
    --color-light: #F5F5DC;
    --color-dark: #3E2723;
    --color-text: #333;
    --transition: all 0.3s ease;
}

/* Aumenta el tamaño base (por defecto 16px) a 18px para que todo el texto crezca proporcionalmente */
html {
    font-size: 18px !important;
}

body { 
    font-family: 'PT Serif', serif !important; 
    background-color: var(--color-light) !important; 
    color: var(--color-text); 
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Stardos Stencil', system-ui !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    color: var(--color-dark);
}

.manual-subtitle {
    font-family: 'PT Serif', serif;
    text-transform: none;
}

/* Cabecera de la barra lateral */
nav > div.bg-stone-800 {
    background-color: rgba(62, 39, 35, 0.9) !important;
    color: white !important;
}

nav > div.bg-stone-800 h1 {
    color: white !important;
}

nav > div.bg-stone-800 h1 span {
    color: var(--color-accent) !important;
}

.chart-container {
    position: relative;
    width: 100%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    height: 40vh;
    max-height: 450px;
}
@media (min-width: 768px) {
    .chart-container { height: 50vh; }
}
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.nav-active { 
    background-color: var(--color-secondary) !important; 
    color: var(--color-dark) !important; 
    border-right: 4px solid var(--color-accent) !important; 
    font-weight: bold; 
}
.nav-item { transition: var(--transition); color: var(--color-dark) !important; }
.nav-item:hover:not(.nav-active) { background-color: rgba(210, 180, 140, 0.4) !important; color: var(--color-accent) !important; }

/* Botones de control de curvas */
#btn-mono, #btn-raku { border-radius: 999px !important; border-color: transparent !important; }
#btn-mono.bg-stone-800, #btn-raku.bg-stone-800 { background-color: var(--color-dark) !important; color: white !important; }
#btn-mono.bg-stone-200, #btn-raku.bg-stone-200 { background-color: var(--color-secondary) !important; color: var(--color-dark) !important; }

/* Acordeones de la sección técnicas (como el resto de la página web) */
button[onclick^="toggleAccordion"] { background-color: var(--color-dark) !important; color: white !important; border-radius: 8px; transition: var(--transition); }
button[onclick^="toggleAccordion"]:hover { background-color: var(--color-accent) !important; transform: translateY(-2px); }
button[onclick^="toggleAccordion"] span { color: white !important; }

.fade-in { animation: fadeIn 0.4s ease-in-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }