/* =====================================================================
   CV Luvumbu — THÈME "SUPER MARIO" rétro 8-bit.
   Couche de surcharge : se charge en DERNIER dans chaque page et repeint
   tout le site (variables + apparence blocky pixel art) sans toucher à la
   structure HTML existante. Pour revenir au thème sombre : retirer la
   balise <link ...mario-theme.css> dans les pages.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&display=swap');

/* ---- Repeinture de TOUTES les variables connues (toutes les pages) ---- */
:root, html {
    /* style.css / dashboard / architecture / mes_cv / parametres */
    --bg:#5c94fc;       --panel:#fceaba;    --panel2:#f7d999;   --line:#000000;
    --ink:#1a1208;      --muted:#7a4a18;    --text:#1a1208;     --border:#000000;
    --primary:#e52521;  --primary-dark:#b81d1a;
    --accent:#e52521;   --accent2:#0a8a00;  --violet:#7c4dff;
    --green:#43b047;    --amber:#fac000;    --red:#e52521;      --pink:#f06ca0;
    --error-bg:#ffd4d4;   --error-text:#8a0000;
    --success-bg:#d6f0c8; --success-text:#0a5a0a;

    /* cv_builder.php (autre nomenclature) */
    --brand:#e52521;      --brand-light:#ff6a5d; --brand-glow:#e5252140; --brand-subtle:#e5252112;
    --bg-body:#5c94fc;    --bg-card:#fceaba;     --bg-card-hover:#f7d999;
    --bg-surface:#fff3cf; --bg-input:#fffaf0;
    --border-light:#000000;
    --text-primary:#1a1208; --text-secondary:#7a4a18; --text-muted:#9a6a30; --text-white:#ffffff;
    --cyan:#1f8fff;        --cyan-bg:#1f8fff18;
    --rose:#f06ca0;        --rose-bg:#f06ca018;
    --green-bg:#43b04718;  --amber-bg:#fac00018; --red-bg:#e5252118;
}

/* ---- Fond ciel + nuages + sol en briques (façon world map SMB) ---- */
html, body {
    background:
        /* nuages pixel, fixés sous la barre du haut */
        url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='320'%20height='150'%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='40'%20y='40'%20width='80'%20height='22'/%3E%3Crect%20x='62'%20y='26'%20width='44'%20height='22'/%3E%3Crect%20x='28'%20y='54'%20width='112'%20height='12'/%3E%3C/g%3E%3Cg%20fill='%23ffffff'%3E%3Crect%20x='220'%20y='96'%20width='60'%20height='16'/%3E%3Crect%20x='236'%20y='84'%20width='34'%20height='16'/%3E%3C/g%3E%3C/svg%3E"),
        /* sol en briques, fixé en bas de l'écran */
        url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='32'%20height='40'%3E%3Crect%20width='32'%20height='40'%20fill='%23c84c0c'/%3E%3Crect%20x='1'%20y='1'%20width='30'%20height='38'%20fill='none'%20stroke='%23000000'%20stroke-width='2'/%3E%3Crect%20x='3'%20y='3'%20width='26'%20height='5'%20fill='%23eaa15a'/%3E%3C/svg%3E"),
        /* ciel dégradé */
        linear-gradient(#5c94fc 0%, #79a8ff 70%, #9cc0ff 100%)
        !important;
    background-repeat: repeat-x, repeat-x, no-repeat !important;
    background-position: left 96px, left bottom, center !important;
    background-attachment: fixed, fixed, fixed !important;
    background-size: 320px 150px, 32px 40px, cover !important;
}

/* ---- Typo : VT323 lisible partout, Press Start 2P pour les titres/HUD ---- */
body, body * {
    font-family: 'VT323', 'Courier New', monospace !important;
    letter-spacing: 0 !important;
    image-rendering: pixelated;
}
body { color: #1a1208 !important; font-size: 1.18rem !important; line-height: 1.3 !important; }

h1, h2, h3, h4, h2.section, legend,
.brand, .brand-logo, .topbar .brand, .cv-name,
.btn, button, input[type="submit"], input[type="button"], .badge {
    font-family: 'Press Start 2P', 'VT323', monospace !important;
    letter-spacing: 0 !important;
}

h1, .cv-name { font-size: 1.15rem !important; line-height: 1.5 !important; color: #b81d1a !important;
    text-shadow: 2px 2px 0 #fff3cf; word-break: break-word; }
h2, h2.section { font-size: .95rem !important; line-height: 1.5 !important; color: #5a2d0c !important; }
h3 { font-size: .8rem !important; line-height: 1.5 !important; color: #0a7d00 !important; }
.subtitle, .muted, .cv-contact { font-size: 1.05rem !important; }

/* ---- Tout devient "blocky" : on supprime les arrondis ---- */
* { border-radius: 0 !important; }

/* ---- Cartes / panneaux / surfaces : bloc tan à grosse bordure noire ---- */
.card, .cv-sheet, fieldset, .stats .stat, table.keys, .panel,
section[class*="card"], div[class*="card"] {
    background: #fceaba !important;
    border: 4px solid #000 !important;
    box-shadow: 6px 6px 0 rgba(0,0,0,.35) !important;
    color: #1a1208 !important;
}
fieldset { box-shadow: 4px 4px 0 rgba(0,0,0,.25) !important; }
legend { color: #b81d1a !important; background: #fac000 !important; border: 3px solid #000 !important;
    padding: 2px 8px !important; font-size: .6rem !important; }

/* ---- Champs de saisie : blocs blancs ---- */
input, textarea, select {
    background: #fffaf0 !important;
    border: 3px solid #000 !important;
    color: #1a1208 !important;
    font-size: 1.1rem !important;
}
input::placeholder, textarea::placeholder { color: #b08a55 !important; }
input:focus, textarea:focus, select:focus {
    outline: none !important;
    border-color: #e52521 !important;
    box-shadow: 0 0 0 3px #fac000 !important;
}

/* ---- Boutons : blocs "appuyables" façon NES ---- */
.btn, button, input[type="submit"], input[type="button"] {
    background: #e52521 !important;
    color: #fff !important;
    border: 3px solid #000 !important;
    box-shadow: 4px 4px 0 #000 !important;
    font-size: .62rem !important;
    padding: 12px 14px !important;
    line-height: 1.6 !important;
    text-shadow: 1px 1px 0 #000 !important;
    transition: transform .04s ease, box-shadow .04s ease, filter .12s !important;
}
.btn:hover, button:hover, input[type="submit"]:hover { filter: brightness(1.08) !important; }
.btn:active, button:active, input[type="submit"]:active {
    transform: translate(4px, 4px) !important;
    box-shadow: 0 0 0 #000 !important;
}
/* Bouton secondaire / lien : style tuyau vert, pas de bloc rouge */
.btn-link, .btn-link.danger {
    background: none !important; box-shadow: none !important; border: none !important;
    color: #0a7d00 !important; text-shadow: none !important; text-decoration: underline !important;
    font-family: 'VT323', monospace !important; font-size: 1.05rem !important;
}
.btn-link.danger { color: #c81d1a !important; }
.btn-auto { width: auto !important; }

/* ---- Liens ---- */
a { color: #0a6ad8 !important; }
a:hover { color: #e52521 !important; }
.topbar a, .topbar nav a { color: #ffe27a !important; }
.topbar a:hover { color: #fff !important; }

/* ---- Barre du haut = HUD noir style score Mario ---- */
.topbar {
    background: #000 !important;
    border-bottom: 4px solid #fac000 !important;
    backdrop-filter: none !important;
    color: #fff !important;
}
.topbar .brand { color: #fff !important; font-size: .8rem !important; }
.topbar .brand span { color: #fac000 !important; }

/* Logo des pages centrées */
.brand-logo { color: #fff !important; text-shadow: 3px 3px 0 #000, -1px -1px 0 #b81d1a !important;
    font-size: 1rem !important; line-height: 1.6 !important; }
.brand-logo span { color: #fac000 !important; }

/* ---- Badges / puces : petits blocs pixel ---- */
.badge {
    border: 2px solid #000 !important;
    font-size: .5rem !important;
    padding: 4px 7px !important;
    color: #1a1208 !important;
}
.badge-on   { background: #43b047 !important; color: #042b04 !important; }
.badge-off  { background: #e52521 !important; color: #fff !important; }
.badge-warn { background: #fac000 !important; color: #1a1208 !important; }
.badge-wait { background: #9cc0ff !important; color: #06234f !important; }

/* ---- Stats / pastilles ---- */
.stats .stat { box-shadow: 4px 4px 0 rgba(0,0,0,.25) !important; }
.stats .stat strong { color: #b81d1a !important; }
.stats .stat.ok   { background: #cdeccd !important; color: #0a5a0a !important; }
.stats .stat.no   { background: #ffd4d4 !important; color: #8a0000 !important; }
.stats .stat.warn { background: #fff0c2 !important; color: #6a4a00 !important; }

/* ---- Alertes ---- */
.alert { border: 3px solid #000 !important; font-size: 1rem !important; }
.alert-error   { background: #ffd4d4 !important; color: #8a0000 !important; }
.alert-success { background: #d6f0c8 !important; color: #0a5a0a !important; }

/* ---- Tableaux ---- */
table.keys th { color: #7a4a18 !important; }
table.keys td, table.keys th { border-bottom: 2px solid #000 !important; }
table.keys code, table.keys .chip, label.check code {
    background: #fff3cf !important; border: 2px solid #000 !important; color: #5a2d0c !important;
}

/* ---- Séparateurs / fichiers révélés ---- */
.key-reveal { background: #1a1208 !important; color: #43e04a !important; border: 3px solid #000 !important; }
.cv-title { color: #0a7d00 !important; }
.cv-sheet h3 { color: #0a7d00 !important; border-bottom: 2px solid #000 !important; }
.cv-sheet p, table.keys, .card, .cv-sheet { color: #1a1208 !important; }

/* ---- Barre d'outils des pages d'aperçu CV (cv_public / cv_view) ---- */
.toolbar {
    background: #000 !important;
    border-bottom: 4px solid #fac000 !important;
}
.toolbar .name { color: #fff !important; font-family: 'Press Start 2P', monospace !important;
    font-size: .7rem !important; }
.toolbar a { color: #ffe27a !important; border: 2px solid #ffe27a !important; }
.toolbar a:hover { background: #fac000 !important; color: #000 !important; }
/* L'aperçu CV (iframe) reste blanc/propre pour l'impression */
#cvFrame { border: 4px solid #000 !important; box-shadow: 6px 6px 0 rgba(0,0,0,.4) !important; }