/* =====================================================================
   Blogamer – Direction C « Néon Pixel » sur fond blanc (Phase 4, 04/10/2026)
   Surcouche du style.css d'origine : supprimer ce fichier (et son
   wp_enqueue_style dans functions.php) pour revenir à l'ancien look.
   ===================================================================== */
:root {
  --c-ink:     #14112E;  /* titres */
  --c-violet:  #4C3FA8;  /* accent principal (texte, bordures) : 8,1:1 sur blanc */
  --c-cyan:    #22D3EE;  /* décor uniquement (ombres, filets) : jamais en texte sur blanc */
  --c-cyan-t:  #0E7490;  /* cyan lisible sur blanc */
  --c-night:   #15103A;  /* bandeau header */
  --c-abyss:   #0B0820;  /* pied de page */
  --c-lav:     #F3F1FF;  /* surfaces secondaires */

  --color-bg:       #FFFFFF;
  --color-surface:  #FFFFFF;
  --color-surface2: var(--c-lav);
  --color-border:   #D9D4F5;
  --color-heading:  var(--c-ink);
  --color-text:     #2E2A4A;
  --color-muted:    #5D5880;
  --color-jv:       var(--c-violet);
  --color-brand-dark: var(--c-violet);   /* liens dans les articles */
  --header-bg:      var(--c-night);

  --font-heading: 'Space Grotesk', 'Segoe UI', Arial, sans-serif;
  --font-body:    'Space Grotesk', 'Segoe UI', Arial, sans-serif;
  --font-pixel:   'Press Start 2P', 'Courier New', monospace;

  --radius:    2px;
  --radius-lg: 4px;
  --shadow-sm: 4px 4px 0 var(--c-cyan);
  --shadow-md: 6px 6px 0 var(--c-cyan);
  --shadow-lg: 8px 8px 0 var(--c-cyan);
}

body { font-size: 1.0625rem; }
h1, h2, h3, h4, h5, h6 { font-weight: 700; letter-spacing: -0.01em; }
:focus-visible { outline: 3px solid var(--c-cyan); outline-offset: 2px; }
::selection { background: var(--c-cyan); color: var(--c-abyss); }

/* ---- Étiquettes pixel ---- */
.cat-badge {
  font-family: var(--font-pixel); font-size: .55rem; font-weight: 400;
  letter-spacing: .02em; padding: 6px 8px; border-radius: 0; line-height: 1.5;
  box-shadow: 2px 2px 0 var(--c-abyss);
}

/* ---- Header : bandeau nuit, filet cyan ---- */
.site-header { background: var(--c-night); border-bottom: 3px solid var(--c-cyan); }
.primary-nav a { font-weight: 700; letter-spacing: .04em; border-radius: 0; }
.primary-nav a:hover,
.primary-nav .current-menu-item > a,
.primary-nav .current_page_item > a { background: rgba(34,211,238,.16); }
.primary-nav .current-menu-item > a,
.primary-nav .current_page_item > a { border-bottom-color: var(--c-cyan); }
.header-search form { border-radius: 0; border-color: rgba(34,211,238,.45); }
.header-search form:focus-within, .header-search button:hover { border-color: var(--c-cyan); color: var(--c-cyan); }
@media (max-width: 768px) { .primary-nav.is-open { background: var(--c-night); } }

/* ---- Ticker ---- */
.breaking-ticker { background: var(--c-violet); }
.breaking-ticker__label { background: var(--c-cyan); color: var(--c-abyss); font-family: var(--font-pixel); font-size: .55rem; font-weight: 400; }
.breaking-ticker__items, .breaking-ticker__items a { color: #fff; }

/* ---- Cartes et blocs : bordure franche + ombre décalée cyan ---- */
.post-card, .single-article, .widget, .archive-header, .search-header, .comments-area {
  border: 2px solid var(--c-ink); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm);
}
.post-card { transition: transform .15s ease, box-shadow .15s ease; }
.post-card:hover { transform: translate(-2px, -2px); box-shadow: var(--shadow-md); }
.post-card--jv:hover, .post-card--tech:hover, .post-card--esport:hover, .post-card--papa:hover { border-color: var(--c-ink); }
.post-card:hover .post-card__title { color: var(--c-violet); }
.post-card__footer { border-top: 2px dashed var(--color-border); }
.archive-header::before { height: 6px; background: var(--c-violet); }

/* ---- Titres de sections et widgets ---- */
.section-header__title, .widget-title, .footer-col__title, .comments-title, .article-share__label {
  font-family: var(--font-pixel); font-weight: 400; font-size: .7rem; letter-spacing: .02em; line-height: 1.6;
}
.section-header__title { font-size: .85rem; color: var(--c-ink); }
.section-header__line { height: 3px; border-radius: 0; background: var(--c-violet); }
.widget-title { border-bottom: 3px solid var(--c-cyan); }
a:hover, .widget-recent-post:hover .widget-recent-post__title, .widget-cat-list a:hover,
.breadcrumb a:hover, .single-article__meta a:hover { color: var(--c-violet); }

/* ---- Contenu d'article ---- */
.single-article__title { font-weight: 700; letter-spacing: -.02em; }
.article-content { font-size: 1.0625rem; line-height: 1.75; }
.article-content a { color: var(--c-violet); text-decoration-color: var(--c-cyan); text-decoration-thickness: 2px; }
.article-content a:hover { color: var(--c-ink); background: rgba(34,211,238,.18); }
.article-content h2 { border-left: 6px solid var(--c-violet); padding-left: 12px; }
.article-content blockquote, .wp-block-quote { border-left: 4px solid var(--c-violet); background: var(--c-lav); border-radius: 0; }
.article-content th { background: var(--c-lav); }
.article-content table, .article-content td, .article-content th { border-color: var(--color-border); }

/* ---- Boutons ---- */
.btn-primary, .comment-form input[type="submit"], .search-form-large button, .pagination .current {
  background: var(--c-violet); color: #fff; border-radius: 0; box-shadow: 3px 3px 0 var(--c-cyan);
}
.btn-primary:hover, .comment-form input[type="submit"]:hover, .search-form-large button:hover {
  background: var(--c-ink); color: #fff; transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--c-cyan);
}
.pagination .page-numbers { border-radius: 0; }
.article-tag, .widget-tag, .section-header__more { border-radius: 0; }
.article-tag:hover, .widget-tag:hover, .section-header__more:hover { color: var(--c-violet); border-color: var(--c-violet); }

/* ---- Pied de page ---- */
.site-footer { background: var(--c-abyss); border-top: 3px solid var(--c-cyan); }
.footer-brand__desc, .footer-col ul a, .footer-bottom__copy, .footer-nav a { color: #B9B4E0; }
.footer-col ul a::before { color: var(--c-cyan); }
.footer-col__title { border-bottom-color: var(--c-cyan); }
.footer-col ul a:hover, .footer-nav a:hover { color: var(--c-cyan); }

/* ---- Encadré verdict et liens du module ---- */
.bg-verdict { border: 3px solid var(--c-ink); border-radius: 0; background: var(--c-lav); box-shadow: 6px 6px 0 var(--c-cyan); }
.bg-verdict__titre { font-family: var(--font-pixel); font-size: .6rem; letter-spacing: .02em; color: var(--c-violet); }
.bg-verdict__note strong { font-family: var(--font-pixel); font-size: 1.6rem; color: var(--c-violet); }
p.bgp2-links { border-left-color: var(--c-cyan); background: var(--c-lav); border-radius: 0; }

@media (prefers-reduced-motion: reduce) {
  .post-card, .post-card:hover, .btn-primary:hover { transform: none; transition: none; }
}

/* ---- Correctifs mise en page (recette locale du 04/10) ---- */
.content-area > *, .home-main-grid > *, .posts-grid > * { min-width: 0; }
.single-article { max-width: 100%; }
.article-content .bg-verdict li { list-style: none; }
.article-content .bg-verdict ul { padding-left: 0; }
.wp-block-search__button, .widget button, .widget input[type="submit"] {
  background: var(--c-violet); color: #fff; border: 0; border-radius: 0; box-shadow: 3px 3px 0 var(--c-cyan); font-weight: 700;
}
.wp-block-search__input, .widget input[type="search"] { border: 2px solid var(--c-ink); border-radius: 0; }

/* ---- Intro des catégories ---- */
.archive-header__desc p { margin: 0 0 .6em; max-width: 72ch; font-size: 1rem; line-height: 1.65; color: var(--color-text); }

/* ---- Sans ticker : barre latérale collée sous le header ---- */
.sidebar { top: 84px; }

/* ---- Badge de note sur les cartes ---- */
.post-card__thumb { position: relative; }
.bg-score {
  position: absolute; right: 10px; bottom: 10px; z-index: 2;
  min-width: 44px; height: 44px; padding: 0 6px; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-pixel); font-size: .8rem; line-height: 1; color: var(--c-ink);
  background: #fff; border: 3px solid var(--c-ink); box-shadow: 3px 3px 0 var(--c-cyan);
}
.bg-score--hi { background: #F59E0B; }
.bg-score--lo { border-style: dashed; }

/* ---- Encadré auteur ---- */
.bg-auteur { display: flex; gap: 14px; align-items: flex-start; margin: 32px 0 8px; padding: 16px 18px; border: 2px solid var(--c-ink); background: var(--c-lav); }
.bg-auteur__nom { font-weight: 700; margin: 0 0 4px !important; }
.bg-auteur p { margin: 0 0 6px !important; font-size: .95rem; }
.bg-auteur img { width: 56px; height: 56px; border: 2px solid var(--c-ink); flex: none; }

/* ---- Accueil : les grands dossiers ---- */
.dossiers-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.dossier-tile { display: flex; flex-direction: column; gap: 4px; padding: 16px; background: var(--c-lav); border: 2px solid var(--c-ink); box-shadow: 3px 3px 0 var(--c-cyan); transition: transform .15s ease, box-shadow .15s ease; }
.dossier-tile:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 var(--c-cyan); color: inherit; }
.dossier-tile__titre { font-weight: 700; color: var(--c-ink); font-size: 1.05rem; }
.dossier-tile__desc { font-size: .9rem; color: var(--color-muted); }

/* ---- Mobile : rubriques en pastilles sous le header ---- */
.mobile-pills { display: none; }
@media (max-width: 768px) {
  .mobile-pills { display: block; background: #fff; border-bottom: 2px solid var(--color-border); }
  .mobile-pills__list { display: flex; gap: 8px; overflow-x: auto; padding: 10px 16px; margin: 0; list-style: none; scrollbar-width: none; }
  .mobile-pills__list::-webkit-scrollbar { display: none; }
  .mobile-pills__list li { flex: none; list-style: none; }
  .mobile-pills__list a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border: 2px solid var(--c-ink); font-weight: 700; font-size: .9rem; color: var(--c-ink); background: #fff; white-space: nowrap; }
  .mobile-pills__list .current-menu-item > a, .mobile-pills__list a:hover { background: var(--c-violet); color: #fff; }
}

/* ---- Sommaire automatique ---- */
.bg-toc { border: 2px solid var(--c-ink); background: #fff; margin: 0 0 1.6rem; }
.bg-toc summary { cursor: pointer; padding: 12px 16px; font-family: var(--font-pixel); font-size: .62rem; color: var(--c-violet); list-style: none; }
.bg-toc summary::-webkit-details-marker { display: none; }
.bg-toc summary::after { content: " ▾"; }
.bg-toc[open] summary::after { content: " ▴"; }
.article-content .bg-toc ol { margin: 0 !important; padding: 0 16px 14px 36px !important; }
.article-content .bg-toc li { list-style: decimal; margin: .3em 0; }
.article-content .bg-toc a { text-decoration: none; }

/* ---- Mobile : barre « Voir le prix » sur les tests ---- */
.bg-pricebar { display: none; }
@media (max-width: 768px) {
  .bg-pricebar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: #fff; border-top: 3px solid var(--c-ink); box-shadow: 0 -3px 0 var(--c-cyan); transform: translateY(110%); transition: transform .2s ease; }
  .bg-pricebar.is-on { transform: none; }
  .bg-pricebar__txt { flex: 1; font-weight: 700; font-size: .95rem; color: var(--c-ink); }
  .bg-pricebar a { background: var(--c-violet); color: #fff; font-weight: 700; padding: 12px 16px; min-height: 44px; display: inline-flex; align-items: center; }
  body.has-pricebar { padding-bottom: 72px; }
}
@media (prefers-reduced-motion: reduce) { .bg-pricebar, .dossier-tile { transition: none; } }