/* ============================================================
   SKLOBLOG — Thème "Skyrock 2009-2010" v2 — plus fidèle
   Fond blanc/gris clair, police Arial/Verdana, boutons plats
   Skyrock n'a jamais eu de mode sombre : le mode clair est la
   référence, le mode sombre reste dispo mais reste sobre.
   ============================================================ */

:root {
    --blue:      #0092D3;
    --blue-dk:   #006BA1;
    --dark:      #222222;
    --darker:    #111111;
    --light:     #F2F6F9;
    --border:    #C7D6E0;
    --muted:     #6B7D89;
    --text:      #2A2A2A;
    --white:     #FFFFFF;
    --green:     #3C9F4A;
    --red:       #CC3333;
    --orange:    #E8820C;
    --radius:    6px;
    --radius-sm: 4px;
    --shadow:    0 1px 3px rgba(0,0,0,.12);
    --shadow-lg: 0 3px 10px rgba(0,0,0,.18);
}

[data-theme="dark"] {
    --light:   #232830;
    --border:  #3A4048;
    --text:    #E4E8EB;
    --muted:   #9AA5AC;
    --dark:    #E4E8EB;
    --white:   #1A1E24;
    --shadow:  0 1px 3px rgba(0,0,0,.4);
    --shadow-lg: 0 3px 10px rgba(0,0,0,.5);
}

/* ---- Police d'époque : Arial/Verdana, pas de police "cute" ---- */
body, .btn, .main-nav a, input, select, textarea, .section-title,
.logo, .hero-section h1, .chat-header h2, h1, h2, h3,
.blog-header h1, .post-full-title, .card-name-shop, .shop-hero-title {
    font-family: Arial, Verdana, "Helvetica Neue", sans-serif !important;
}

/* ---- Fond : blanc/gris clair, pas de dégradé sombre ---- */
body { background: #EDF2F6; }
[data-theme="dark"] body { background: #14171B; }

/* ---- Header sobre, blanc/gris avec liseré bleu (pas de glossy/arc-en-ciel) ---- */
.site-header {
    background: #FFFFFF;
    border-bottom: 3px solid var(--blue);
    box-shadow: 0 1px 4px rgba(0,0,0,.1);
}
.site-header::after { content: none; }
.logo {
    color: var(--blue-dk) !important;
    font-size: 1.25rem !important;
    font-weight: 800;
    text-shadow: none;
}
.logo::before { content: '★ '; color: var(--blue); }
[data-theme="dark"] .site-header { background: #1A1E24; }
[data-theme="dark"] .logo { color: #4DB8E8 !important; }

/* ---- Navigation : liens texte simples, pas de pilules glossy ---- */
.main-nav a {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--text) !important;
    font-weight: 700;
    font-size: .8rem !important;
}
.main-nav a:hover { background: var(--light) !important; color: var(--blue-dk) !important; }
.main-nav .nav-forum, .main-nav .nav-shop, .main-nav .nav-chat {
    background: var(--light) !important;
    color: var(--blue-dk) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius-sm);
}
.main-nav .btn-register {
    background: linear-gradient(180deg,#4FB3E8,#0092D3) !important;
    border: 1px solid var(--blue-dk);
    border-radius: var(--radius-sm);
    color: #fff !important;
}
.nav-avatar { border: 2px solid var(--blue) !important; box-shadow: none; }

/* ---- Boutons "Web 2.0" plats d'époque : dégradé simple, coin peu arrondi ---- */
.btn {
    border-radius: var(--radius-sm);
    box-shadow: none;
    text-shadow: none;
    border: 1px solid var(--blue-dk);
}
.btn-primary {
    background: linear-gradient(180deg,#4FB3E8 0%,#0092D3 100%);
    border-color: var(--blue-dk);
}
.btn-primary:hover { background: linear-gradient(180deg,#63BEEC 0%,#0A9EDF 100%); }
.btn-secondary { background: #F5F8FA; border: 1px solid var(--border); color: var(--text); }
.btn-danger { background: linear-gradient(180deg,#E06666,#CC3333); border-color:#A32424; }
.btn-card-main { background: linear-gradient(180deg,#4FB3E8,#0076AD); }

/* ---- Cartes : blanches, bordure fine grise, coin peu arrondi, ombre légère ---- */
.card, .forum-card, .shop-card, .stat-card, .post-body, .admin-sidebar, .checkout-panel {
    border-radius: var(--radius);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}
.section-title {
    background: none;
    color: var(--blue-dk) !important;
    padding: .3rem 0;
    border-radius: 0;
    border-bottom: 2px solid var(--blue) !important;
    box-shadow: none;
    text-shadow: none;
    font-weight: 800;
}
[data-theme="dark"] .section-title { color: #4DB8E8 !important; }

/* ---- Hero : bandeau bleu uni, pas de dégradé violet/orange ---- */
.hero-section {
    background: linear-gradient(180deg,#0092D3,#006BA1);
}
.hero-section::before { content: none; }

/* ---- Blocs "Forums" / "Boutique" : couleurs pleines sobres, pas d'arc-en-ciel ---- */
[style*="background"] .forum-card, .grid-2 > a { border-radius: var(--radius); }

/* ---- Avatar : cadre simple bleu, pas de double halo ---- */
.blog-avatar-img, .post-author-avatar, .comment-avatar {
    border: 3px solid var(--blue) !important;
    box-shadow: none;
}

/* ---- Chat ---- */
.chat-msg-bubble { background: var(--light); border: 1px solid var(--border); border-radius: 8px; }
.chat-msg-own .chat-msg-bubble { background: var(--blue); color: #fff; }
.chat-header { background: linear-gradient(180deg,#0092D3,#006BA1); }

/* ---- Badges ---- */
.badge-blue { background: #E1F1FA; color: var(--blue-dk); border-color: #9ED4F4; }
.private-badge, .badge-red { background: #FBE1E1; color: #A32424; border-color: #F0B0B0; }
.badge-gold { background: #FDF3D9; color: #8A5A00; border-color: #E8C05A; }

/* ---- Tableaux ---- */
.data-table th, .cat-table th, .topic-table th { background: var(--light); color: var(--blue-dk); }

/* ---- Boutique ---- */
.shop-hero { background: linear-gradient(135deg,#222 0%,#0092D3 100%); }
.credits-pill { background: #FDF3D9; border-color: #E8C05A; color: #8A5A00; }

/* ---- Footer ---- */
.site-footer { background: #1A1E24; }

/* ---- Suppression des décorations "étoiles" trop chargées ---- */
.blog-header h1::before, .blog-header h1::after { content: none; }

/* ---- Neutralise les dégradés inline trop saturés (frise, forums, boutique) ---- */
#daily-streak-widget {
    background: linear-gradient(180deg,#2A2E45,#1A1D2E) !important;
    box-shadow: var(--shadow) !important;
    border: 1px solid var(--border);
}

.grid-2 .card[style*="linear-gradient"] {
    border: 1px solid var(--border) !important;
}
.grid-2 .card[style*="6C3DE0"] {
    background: linear-gradient(180deg,#7C5FC4,#5A3FA0) !important;
}
.grid-2 .card[style*="FF8C00"] {
    background: linear-gradient(180deg,#E89A3C,#C46A10) !important;
}
.grid-2 .card .btn {
    background: #FFFFFF !important;
    color: var(--blue-dk) !important;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

/* ---- Logo image dans le header (remplace le logo texte) ---- */
.logo::before { content: none; }
.logo { display: flex; align-items: center; }
.logo-img { height: 38px; width: auto; display: block; }