/* ==========================================================================
   1. VARIABLES & CONFIGURATION GLOBALE
   ========================================================================== */
:root {
    --page-font: 'Century Gothic', sans-serif;
    --page-width: 950px;
    --base-font-size: 16px;
    --line-height: 1.6;
    --letter-spacing: 0px;
    --accent-color: #0078d4;
    --text-color: #334155;
    --bg-page: #f1f5f9;
    --bg-sheet: #ffffff;
    --sheet-padding: 50px;
    --sheet-radius: 6px;
}

/* ==========================================================================
   2. STYLES DE SURFACE (PAGE PUBLIQUE / INDEX.HTML)
   ========================================================================== */
body { 
    font-family: var(--page-font); 
    font-size: var(--base-font-size); 
    line-height: var(--line-height); 
    color: var(--text-color); 
    background-color: var(--bg-page); 
    margin: 0;
    padding: 40px 20px;
}

.container { 
    background: var(--bg-sheet); 
    max-width: var(--page-width); 
    padding: var(--sheet-padding); 
    border-radius: var(--sheet-radius); 
    box-sizing: border-box; 
    margin: 0 auto; 
    height: max-content; 
    display: flow-root; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* ==========================================================================
   3. TYPOGRAPHIE ET BALISAGE DU CONTENU TEXTUEL
   ========================================================================== */
h1 { 
    font-size: 2.5rem; 
    font-weight: 700; 
    color: #0f172a; 
    margin-top: 0; 
    border-bottom: 2px solid #e2e8f0; 
    padding-bottom: 15px; 
}

h2 { 
    font-size: 1.6rem; 
    font-weight: 600; 
    color: var(--accent-color); 
    margin-top: 40px; 
    border-bottom: 1px solid #e2e8f0; 
    padding-bottom: 8px; 
}

h3 { 
    font-size: 1.2rem; 
    font-weight: 600; 
    color: #1e293b; 
    margin-top: 25px; 
}

p, li { 
    text-align: justify; 
    margin-bottom: 1.2em; 
}

ul { 
    padding-left: 20px; 
}

/* ==========================================================================
   4. TABLEAUX ET CONTENEURS DE DONNÉES
   ========================================================================== */
.table-container {
    width: 100%;
    overflow-x: auto;
    margin: 25px 0;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    min-width: 800px;
}

th, td {
    border: 1px solid #cbd5e1;
    padding: 12px;
    text-align: left;
}

th {
    background-color: #f8fafc;
    color: var(--accent-color);
    font-weight: 700;
}

tr:nth-child(even) { 
    background-color: rgba(0,0,0,0.005); 
}

.meta-table {
    width: auto;
    min-width: 400px;
    margin-bottom: 30px;
}

/* ==========================================================================
   5. BLOCS SPÉCIAUX (ALERTE ET CONTACT)
   ========================================================================== */
.alert-box { 
    background-color: #fffbeb; 
    padding: 20px; 
    border: 1px solid #fef3c7; 
    border-left: 5px solid #d97706; 
    border-radius: 6px; 
    margin: 20px 0; 
    color: #92400e; 
}

/* Modifié : Correction de l'espace massif sur le bloc contact */
.contact-box { 
    background-color: #f8fafc; 
    padding: 25px; 
    border-left: 5px solid var(--accent-color); 
    border-radius: 6px; 
    margin-top: 15px; /* Réduit de 40px à 15px */
}

/* Ajouté : Élimine la marge supérieure du titre à l'intérieur de la boîte */
.contact-box h2 {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-bottom: none;
    font-size: 1.5rem;
}

/* ==========================================================================
   6. INTERFACE DE LA CONSOLE (ADMIN.HTML UNIQUEMENT)
   ========================================================================== */
.word-canvas {
    font-family: var(--page-font);
    font-size: var(--base-font-size);
    line-height: var(--line-height);
    letter-spacing: var(--letter-spacing);
    color: var(--text-color);
}

.word-canvas h1 { color: #0f172a; }
.word-canvas h2 { color: var(--accent-color); }
.word-canvas h3 { color: #1e293b; }
.word-canvas th { color: var(--accent-color); }
.word-canvas .contact-box { border-left-color: var(--accent-color); }