/* Estilos externos e suporte a tema escuro/claro.
   O projeto mantém a maior parte das variáveis CSS inline em `index.html`.
   Aqui apenas sobrescrevemos variáveis quando o documento estiver em tema escuro. */

html[data-theme="dark"] {
   --paper: #0c0c0c;
   --white: #141414;
   --ink: #F0F0F0;
   --ink-soft: #8A8A8A;
   --surface: #1c1c1c;
   --line: #2e2e2e;
   --line-soft: #242424;
   --green-tint: #123227;
   --gold: #D4AF37;
   --gold-dark: #E8C158;
   --rust-tint: #3A211D;
}

/* Pequeno ajuste visual para o botão de tema na sidebar */
#themeToggleBtn {
   padding: 6px 10px;
   font-size: 13px;
}

/* Dark mode: imagens SVG que precisam de inversão para ficarem visíveis */
html[data-theme="dark"] .icon-btn img,
html[data-theme="dark"] .month-nav-btn img,
html[data-theme="dark"] .sidebar-svg {
   filter: invert(1);
}

/* O ícone de sair tem cor própria — não inverte completamente */
html[data-theme="dark"] .logout-svg {
   filter: invert(0.7) sepia(1) saturate(2) hue-rotate(320deg);
}

/* Font accessibility: active state */
html[data-font="large"] #accessBtn {
   border-color: #0B3D2E;
   background: #E3ECE9;
}

html[data-theme="dark"][data-font="large"] #accessBtn {
   background: #123227;
}

/* Scroll suave em toda a aplicação (iOS e Android) */
* {
   -webkit-tap-highlight-color: transparent;
}

html {
   scroll-behavior: smooth;
}

body {
   overscroll-behavior-y: none;
}