/* Variáveis de Tema - Light (tons suaves e legíveis) */
:root {
    --bg-gradient: linear-gradient(135deg, #d4e7ed 0%, #b8d4e0 50%, #8fb8cc 100%);
    --nav-bg: rgba(184, 212, 224, 0.85);
    --card-bg: rgba(184, 212, 224, 0.75);
    --text-primary: #000000;
    --text-secondary: #1a1a1a;
    --border-color: rgba(69, 123, 157, 0.3);
    --shadow: 0 8px 30px rgba(29, 53, 87, 0.15);
    --shadow-hover: 0 6px 20px rgba(69, 123, 157, 0.25);
}

/* Tema Escuro (azul profundo + verde menta suave) */
[data-theme="dark"] {
    --bg-gradient: linear-gradient(135deg, #0d1b2a 0%, #1b263b 50%, #415a77 100%);
    --nav-bg: rgba(13, 27, 42, 0.98);
    --card-bg: rgba(27, 38, 59, 0.95);
    --text-primary: #e0e7ee;
    --text-secondary: #a8c5da;
    --border-color: rgba(100, 180, 180, 0.2);
    --shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
    --shadow-hover: 0 8px 25px rgba(100, 180, 180, 0.3);
}

/* Theme Toggle Button */
.theme-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #457b9d, #1d3557);
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    z-index: 10000;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.theme-toggle:hover {
    transform: scale(1.1) rotate(15deg);
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.4);
}

.theme-toggle:active {
    transform: scale(0.95);
}

/* Focus Mode Toggle (apenas Pomodoro) */
.focus-mode-toggle {
    position: fixed;
    top: 20px;
    right: 85px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #52b788, #2d6a4f);
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    z-index: 10000;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.focus-mode-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 25px rgba(0, 184, 148, 0.4);
}

.focus-mode-toggle:active {
    transform: scale(0.95);
}

/* Modo Foco - Ocultar elementos */
body.focus-mode nav,
body.focus-mode header,
body.focus-mode .studies-section,
body.focus-mode .timer-settings {
    display: none !important;
}

body.focus-mode main {
    grid-template-columns: 1fr;
    max-width: 600px;
    margin-top: 5vh;
}

body.focus-mode .timer-section {
    animation-delay: 0s;
}

body.focus-mode .theme-toggle {
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
}

body.focus-mode .focus-mode-toggle {
    top: 10px;
    right: 65px;
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
}

/* Toast Notification */
.toast {
    position: fixed;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--card-bg);
    color: var(--text-primary);
    padding: 1rem 2rem;
    border-radius: 50px;
    box-shadow: var(--shadow);
    backdrop-filter: blur(10px);
    z-index: 10001;
    transition: bottom 0.3s ease;
    border: 2px solid var(--border-color);
    font-weight: 600;
}

.toast.show {
    bottom: 30px;
}

/* Responsivo - ocultar botões no mobile */
@media (max-width: 768px) {
    .theme-toggle,
    .focus-mode-toggle {
        display: none !important;
    }
}