/* css/components.buttons.css - v2.2.0 */

button { 
    padding: 0.75rem 1.5rem; 
    font-size: 1rem; 
    font-weight: 600; 
    cursor: pointer; 
    border-radius: calc(var(--radius) - 4px); 
    border: none; 
    background-color: var(--accent-color); 
    color: white; 
    transition: background-color 0.2s, transform 0.1s; 
    -webkit-tap-highlight-color: transparent; 
}
button:hover:not(:disabled) { 
    background-color: var(--accent-color-hover); 
    transform: translateY(-2px); 
}
button:active:not(:disabled) { 
    transform: translateY(0); 
}
button:disabled { 
    background-color: var(--border-secondary); 
    color: var(--text-secondary); 
    cursor: not-allowed; 
}
.btn-danger { background-color: var(--error-color); }
.btn-danger:hover:not(:disabled) { background-color: var(--error-color-hover); }
.btn-secondary { 
    background-color: var(--surface-secondary); 
    color: var(--text-primary); 
    border: 1px solid var(--border-primary); 
}
.btn-secondary:hover:not(:disabled) { background-color: var(--border-primary); }

/* Theme Switcher */
#theme-switcher-welcome, #theme-switcher-dash, #theme-switcher-detail { 
    background: none; 
    border: none; 
    cursor: pointer; 
    padding: 0.5rem; 
    border-radius: 50%; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    width: 44px; 
    height: 44px; 
    color: var(--text-secondary); 
    transition: background-color 0.2s, color 0.2s; 
}
#theme-switcher-welcome:hover, #theme-switcher-dash:hover, #theme-switcher-detail:hover { 
    background-color: var(--background-secondary); 
    color: var(--text-primary); 
}
.moon-icon, .sun-icon { width: 24px; height: 24px; }
.dark-mode .sun-icon { display: block; }
.dark-mode .moon-icon { display: none; }
.sun-icon { display: none; }
.moon-icon { display: block; }