/* ============================================================
   THÈME UNIQUE — BAUHAUS
   Les Curseurs Didactiques · Rémy Van de Moosdyk
   (Remplace l'ancien système multi-thèmes : sketch, professional,
    dark, minimal. Les variables gardent leurs noms historiques
    pour que toutes les pages existantes suivent automatiquement.)
   ============================================================ */

:root {
    /* Backgrounds */
    --bg-primary: #f4efe6;
    --bg-secondary: #ffffff;
    --bg-header: #f4efe6;
    --bg-card: #ffffff;
    --bg-shelf: #191714;

    /* Text colors */
    --text-primary: #191714;
    --text-secondary: #3c3831;
    --text-muted: #6b6353;
    --text-header: #191714;

    /* Accent colors — palette Bauhaus */
    --accent-1: #e03a2f;   /* rouge */
    --accent-2: #f2b705;   /* jaune */
    --accent-3: #1d4fd7;   /* bleu */
    --accent-4: #1d9e55;   /* vert (badges niveau 4) */

    /* Alias de couleurs pour compatibilité (teintes claires) */
    --color-pink: #fbe3e0;
    --color-yellow: #fdf1cd;
    --color-blue: #dbe4f8;
    --color-green: #dcefe2;
    --color-orange: #f9e0c7;
    --color-purple: #e6e0f8;

    /* Borders — traits nets, angles droits */
    --border-width: 3px;
    --border-radius: 0;
    --border-radius-small: 0;
    --border-radius-sketch: 0;
    --border-color: #191714;
    --border-style: solid;

    /* Shadows — ombres franches décalées */
    --shadow-card: 6px 6px 0 #191714;
    --shadow-card-hover: 8px 8px 0 #191714;
    --shadow-button: 4px 4px 0 #191714;

    /* Transforms — décalage net, aucune rotation */
    --transform-card-hover: translate(-2px, -2px);
    --transform-button-hover: translate(2px, 2px);

    /* Fonts — géométriques, plus aucune police manuscrite */
    --font-system: 'Avenir Next', 'Century Gothic', Futura, -apple-system,
                   BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
    --font-handwritten: var(--font-system);
    --font-body: var(--font-system);

    /* Badge colors (niveaux 1→4) — aplats francs */
    --badge-1: #e03a2f;
    --badge-2: #f2b705;
    --badge-3: #1d4fd7;
    --badge-4: #1d9e55;
}

/* ===== APPLICATION DES VARIABLES ===== */

body {
    background: var(--bg-primary);
    color: var(--text-primary);
    font-family: var(--font-body);
}

.dashboard-container,
.library-container {
    background: var(--bg-primary);
}

.dashboard-header {
    background: var(--bg-header);
    border-bottom: 3px solid var(--border-color);
}

.dashboard-header h1 {
    color: var(--text-header);
    font-family: var(--font-handwritten);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .01em;
}

.library-header h1,
.archive-header h1 {
    color: var(--text-header);
    font-family: var(--font-handwritten);
    font-weight: 800;
    text-transform: uppercase;
}

.book-card,
.card {
    background: var(--bg-card);
    border: var(--border-width) var(--border-style) var(--border-color);
    border-radius: 0;
    box-shadow: var(--shadow-card);
}

.book-card:hover,
.card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: var(--transform-card-hover);
}

.filters-bar,
.archive-notice,
.modal-content {
    background: var(--bg-card);
    border: var(--border-width) var(--border-style) var(--border-color);
    border-radius: 0;
    box-shadow: var(--shadow-card);
}

.shelf {
    background: var(--bg-shelf);
}

.book-card[data-level="1"] .book-spine { background: var(--badge-1); }
.book-card[data-level="2"] .book-spine { background: var(--badge-2); }
.book-card[data-level="3"] .book-spine { background: var(--badge-3); }
.book-card[data-level="4"] .book-spine { background: var(--badge-4); }

.btn-primary,
.btn-secondary,
.book-action-btn,
.batch-action-btn {
    border: var(--border-width) var(--border-style) var(--border-color);
    border-radius: 0;
    box-shadow: var(--shadow-button);
    font-family: var(--font-system);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.btn-primary {
    background: var(--accent-3);
    color: #ffffff;
}

.btn-primary:hover,
.btn-secondary:hover,
.book-action-btn:hover,
.batch-action-btn:hover {
    transform: var(--transform-button-hover);
    box-shadow: 2px 2px 0 var(--border-color);
}

h1, h2, h3 {
    color: var(--text-primary);
    font-family: var(--font-handwritten);
    font-weight: 800;
}

.book-title {
    font-family: var(--font-system);
    font-weight: 700;
}

.book-metadata,
.book-date,
.book-footer {
    font-family: var(--font-body);
}