Lectures/assets/css/theme.css

74 lines
1.5 KiB
CSS

/* Thème et variables globales */
:root {
/* Couleurs principales */
--bg-primary: #1a1512;
--bg-secondary: #2c1810;
--bg-tertiary: #382218;
/* Textes */
--text-primary: #e0d6cc;
--text-secondary: #b3a69b;
/* Accents */
--accent-primary: #8b4513;
--accent-secondary: #d4691e;
/* Utilitaires */
--border-color: #483225;
--success-color: #2d5a27;
--error-color: #802020;
--input-bg: #241610;
/* Espacements */
--spacing-xs: 0.5rem;
--spacing-sm: 0.75rem;
--spacing-md: 1rem;
--spacing-lg: 1.5rem;
--spacing-xl: 2rem;
/* Transitions */
--transition-fast: 0.2s ease-in-out;
--transition-normal: 0.3s ease-in-out;
/* Border radius */
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 12px;
}
/* Reset et styles de base */
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-color: var(--bg-primary);
color: var(--text-primary);
}
button, input, textarea {
font-family: inherit;
}
/* Utilitaires globaux */
.button {
padding: var(--spacing-sm) var(--spacing-md);
background-color: var(--accent-primary);
color: var(--text-primary);
border: none;
border-radius: var(--radius-sm);
cursor: pointer;
transition: background-color var(--transition-fast);
}
.button:hover {
background-color: var(--accent-secondary);
}
/* États de focus globaux */
:focus {
outline: none;
}
:focus-visible {
box-shadow: 0 0 0 2px rgba(139, 69, 19, 0.2);
}