/*
Theme Name: Scorenza
Theme URI: https://scorenza.com
Author: Scorenza
Author URI: https://scorenza.com
Description: Thème WordPress sur mesure pour Scorenza, plateforme football francophone (Afrique & Europe). Design sombre/or, responsive, orienté scores en direct et actualités.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: scorenza
*/

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=DM+Mono:wght@400;500&family=Source+Serif+4:wght@400;600&display=swap');

:root{
  --bg: #0B0F0D;
  --card: #141C18;
  --card-2: #1A2620;
  --gold: #F4B740;
  --gold-dim: #C89530;
  --live: #E14B4B;
  --up: #4FAE7A;
  --text: #F2F4F1;
  --text-dim: #8A9690;
  --line: #23302A;
}

*{ margin:0; padding:0; box-sizing:border-box; }

body{
  background: var(--bg);
  color: var(--text);
  font-family: 'Space Grotesk', sans-serif;
  -webkit-font-smoothing: antialiased;
}
a{ color: inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.app{ max-width: 480px; margin: 0 auto; min-height: 100vh; padding-bottom: 84px; position: relative; }

/* ---- En-tête ---- */
header.site-header{
  display:flex; align-items:center; justify-content:space-between;
  padding: 18px 20px 14px;
  border-bottom: 1px solid var(--line);
}
.logo{ font-size: 20px; font-weight:700; letter-spacing: 0.5px; }
.logo span{ color: var(--gold); }
.top-nav{ display:none; }
.top-nav-item{ color: var(--text-dim); font-size: 14px; font-weight:500; padding: 8px 4px; border-bottom: 2px solid transparent; }
.top-nav-item.active{ color: var(--gold); border-color: var(--gold); }
.header-icons{ display:flex; gap:10px; }
.icon-btn, .back-btn{
  width:36px; height:36px; border-radius:10px;
  background: var(--card); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  color: var(--text-dim); font-size:16px; text-decoration:none;
}

/* ---- Bandeau de scores (ticker) ---- */
.ticker-wrap{ background:#080B09; border-bottom:1px solid var(--line); overflow:hidden; white-space:nowrap; }
.ticker{ display:inline-flex; animation: scroll 28s linear infinite; }
.ticker:hover{ animation-play-state: paused; }
@keyframes scroll{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
.tick{ display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-right:1px solid var(--line); font-family:'DM Mono',monospace; font-size:13px; }
.tick .grp{ color: var(--text-dim); font-size:11px; }
.tick .code{ color: var(--text); font-weight:500; }
.tick .score{ color: var(--gold); font-weight:600; letter-spacing:1px; }
.tick .min{ color: var(--live); }
.tick .ft{ color: var(--text-dim); }

/* ---- Article vedette (accueil) ---- */
.featured{
  margin: 6px 16px 22px; border-radius:18px; padding:22px 20px 24px;
  background: linear-gradient(155deg, #1C3A2A 0%, #0F1F17 70%);
  border:1px solid #23402E; position:relative; overflow:hidden; display:block;
}
.featured::after{ content:""; position:absolute; right:-40px; top:-40px; width:160px; height:160px; border-radius:50%; background: radial-gradient(circle, rgba(244,183,64,0.10), transparent 70%); }
.badge{ display:inline-block; background:var(--gold); color:#12160E; font-size:11px; font-weight:700; letter-spacing:0.5px; padding:6px 12px; border-radius:20px; margin-bottom:14px; }
.featured h1, .featured h2{ font-size:26px; line-height:1.2; font-weight:700; margin-bottom:12px; max-width:92%; }
.featured p{ font-size:14px; line-height:1.5; color:#C9D3CD; max-width:95%; }

/* ---- En-têtes de section ---- */
.section-head{ display:flex; align-items:center; justify-content:space-between; padding:4px 20px 14px; }
.section-head h2{ font-size:19px; font-weight:600; display:flex; align-items:center; gap:8px; }
.live-dot{ width:9px; height:9px; border-radius:50%; background:var(--live); animation: pulse 1.6s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(225,75,75,0.45);} 70%{ box-shadow:0 0 0 8px rgba(225,75,75,0);} 100%{ box-shadow:0 0 0 0 rgba(225,75,75,0);} }
.see-all{ font-size:13px; color:var(--text-dim); }

/* ---- Cartes de match ---- */
.matches{ padding:0 16px; display:flex; flex-direction:column; gap:10px; }
.match-card{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; }
.teams{ display:flex; flex-direction:column; gap:10px; }
.team{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:500; }
.flag{ width:22px; display:inline-flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; }
.match-meta{ text-align:right; }
.scores{ font-family:'DM Mono',monospace; font-size:17px; font-weight:600; display:flex; flex-direction:column; gap:10px; align-items:flex-end; }
.status{ font-size:11px; margin-top:6px; }
.status.live{ color:var(--live); }
.status.grp{ color:var(--text-dim); }

/* ---- Barre latérale (desktop) ---- */
.sidebar{ display:none; }
.sidebar-card{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px; margin-bottom:16px; }
.sidebar-title{ font-size:14px; font-weight:600; margin-bottom:12px; }
.standing-row{ display:flex; justify-content:space-between; align-items:center; font-size:13px; padding:8px 0; border-bottom:1px solid var(--line); }
.standing-row:last-child{ border-bottom:none; }
.standing-pts{ font-family:'DM Mono',monospace; color:var(--gold); font-weight:600; }

/* ---- Nav basse (mobile) ---- */
nav.bottom{
  position:fixed; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:480px; background:#0D1310; border-top:1px solid var(--line);
  display:flex; justify-content:space-around; padding:12px 0 18px;
}
.nav-item{ display:flex; flex-direction:column; align-items:center; gap:4px; font-size:11px; color:var(--text-dim); }
.nav-item.active{ color:var(--gold); }
.nav-icon{ font-size:18px; }

/* ---- Pied de page légal ---- */
.site-footer{ padding:24px 20px; text-align:center; border-top:1px solid var(--line); margin-top:20px; }
.site-footer .legal-links{ display:flex; justify-content:center; gap:16px; flex-wrap:wrap; margin-bottom:10px; }
.site-footer a{ font-size:11px; color:var(--text-dim); }
.site-footer .copyright{ font-size:11px; color:var(--text-dim); }

/* ---- Layout deux colonnes générique (classement/calendrier/équipe/actus) ---- */
.layout, .layout-desktop{ display:block; }
.page-head{ padding:20px 20px 4px; }
.page-head h1{ font-size:24px; font-weight:700; margin-bottom:4px; }
.page-head p{ font-size:13px; color:var(--text-dim); }

/* ---- Chips de filtre (compétitions, catégories, jours) ---- */
.comp-group{ margin-bottom:10px; }
.comp-group-title{ font-size:11px; font-weight:600; color:var(--text-dim); text-transform:uppercase; letter-spacing:0.5px; padding:0 20px 6px; }
.comp-select, .cat-select, .day-select{ display:flex; gap:8px; overflow-x:auto; padding:0 20px 4px; scrollbar-width:none; }
.comp-select::-webkit-scrollbar, .cat-select::-webkit-scrollbar, .day-select::-webkit-scrollbar{ display:none; }
.comp-chip, .cat-chip{ flex-shrink:0; white-space:nowrap; padding:8px 16px; border-radius:20px; background:var(--card); border:1px solid var(--line); font-size:13px; color:var(--text-dim); font-weight:500; }
.comp-chip.active, .cat-chip.active{ background:var(--gold); color:#12160E; border-color:var(--gold); font-weight:600; }

/* Le reste des styles spécifiques à chaque template (classement, calendrier, équipe, actus, article, pages légales)
   est chargé séparément via des feuilles de style additionnelles pour garder ce fichier lisible. */