/*
Theme Name:   01GoalSports
Description:  Child Theme pour 01GoalSports - Plateforme de Presse Sportive Sénégalaise
Author:       01GoalSports
Template:     astra
Version:      1.0.0
Text Domain:  goalsports
*/

/* ================================================================
   VARIABLES & RESET
   ================================================================ */
:root {
  --gs-rouge:     #C8302A;
  --gs-rouge-dark:#a02020;
  --gs-noir:      #0D0D0D;
  --gs-fond:      #F7F7F5;
  --gs-blanc:     #ffffff;
  --gs-texte:     #1a1a1a;
  --gs-gris:      #f0f0ee;
  --gs-bordure:   #e4e4e4;
  --gs-muted:     #888888;
  --gs-serif:     'Playfair Display', Georgia, serif;
  --gs-sans:      'Inter', system-ui, -apple-system, sans-serif;
  --gs-radius:    3px;
  --gs-shadow:    0 1px 4px rgba(0,0,0,0.07);
  --gs-shadow-h:  0 6px 24px rgba(0,0,0,0.12);
}

*, *::before, *::after { box-sizing: border-box; }

::selection {
  background: var(--gs-rouge);
  color: var(--gs-blanc);
}

/* ================================================================
   BODY & FOND
   ================================================================ */
body {
  font-family: var(--gs-sans) !important;
  background: var(--gs-fond) !important;
  color: var(--gs-texte) !important;
  -webkit-font-smoothing: antialiased;
}

/* ================================================================
   BREAKING NEWS TICKER
   ================================================================ */
#gs-ticker {
  background: var(--gs-noir);
  color: #ccc;
  height: 38px;
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
  z-index: 100;
}

#gs-ticker .gs-ticker-label {
  background: var(--gs-rouge);
  color: var(--gs-blanc);
  font-family: var(--gs-sans);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding: 0 16px;
  height: 100%;
  display: flex;
  align-items: center;
  white-space: nowrap;
  flex-shrink: 0;
  z-index: 2;
}

#gs-ticker .gs-ticker-label::before {
  content: '';
  width: 7px;
  height: 7px;
  background: var(--gs-blanc);
  border-radius: 50%;
  margin-right: 8px;
  animation: gs-pulse 1.4s ease-in-out infinite;
}

@keyframes gs-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.3; transform: scale(0.8); }
}

#gs-ticker .gs-ticker-track {
  flex: 1;
  overflow: hidden;
  padding: 0 20px;
}

#gs-ticker .gs-ticker-inner {
  display: inline-block;
  white-space: nowrap;
  font-size: 13px;
  animation: gs-ticker 35s linear infinite;
}

@keyframes gs-ticker {
  0%   { transform: translateX(100vw); }
  100% { transform: translateX(-100%); }
}

#gs-ticker .gs-ticker-inner span {
  margin: 0 28px;
  color: #999;
}

/* ================================================================
   HEADER
   ================================================================ */
#masthead,
.ast-primary-header-bar,
.ast-desktop-header-content {
  background: var(--gs-blanc) !important;
  border-bottom: 1px solid var(--gs-bordure) !important;
  box-shadow: none !important;
}

/* Wrapper du header pour centrer le logo */
.ast-primary-header-bar .ast-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 24px 0 !important;
}

/* Meta ligne du haut (date + live) */
.gs-header-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 0 14px;
  border-bottom: 1px solid var(--gs-bordure);
  font-size: 12px;
  color: var(--gs-muted);
}

.gs-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--gs-rouge);
  color: var(--gs-blanc);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 2px;
}

.gs-live-badge::before {
  content: '';
  width: 6px; height: 6px;
  background: var(--gs-blanc);
  border-radius: 50%;
  animation: gs-pulse 1.4s ease-in-out infinite;
}

/* Logo zone */
.ast-site-identity,
.site-branding {
  text-align: center !important;
  padding: 18px 0 16px !important;
  width: 100% !important;
}

/* Si logo image */
.ast-site-identity img,
.custom-logo {
  max-height: 80px !important;
  width: auto !important;
}

/* Logo texte fallback */
.ast-site-identity .site-title a,
.site-title a {
  font-family: var(--gs-serif) !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  color: var(--gs-noir) !important;
  letter-spacing: -0.5px;
  text-decoration: none !important;
  line-height: 1 !important;
}

.site-description,
.ast-site-identity .site-description {
  font-family: var(--gs-sans) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 3px !important;
  color: var(--gs-muted) !important;
  margin-top: 6px !important;
}

/* ================================================================
   NAVIGATION
   ================================================================ */
.ast-primary-header-bar .main-navigation,
#site-navigation,
.ast-builder-menu-1 {
  width: 100% !important;
  background: transparent !important;
  border-top: 1px solid var(--gs-bordure) !important;
  display: flex !important;
  justify-content: center !important;
}

.main-header-menu {
  display: flex !important;
  justify-content: center !important;
  background: transparent !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.main-header-menu > .menu-item > a,
.ast-builder-menu-1 .main-header-menu > .menu-item > a {
  font-family: var(--gs-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #555 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 14px 20px !important;
  display: block !important;
  border-bottom: 2px solid transparent !important;
  transition: color 0.2s, border-color 0.2s !important;
  text-decoration: none !important;
  white-space: nowrap;
}

.main-header-menu > .menu-item > a:hover,
.main-header-menu > .current-menu-item > a,
.main-header-menu > .current_page_item > a {
  color: var(--gs-rouge) !important;
  border-bottom-color: var(--gs-rouge) !important;
  background: transparent !important;
}

/* Sous-menus dropdown */
.main-header-menu .sub-menu {
  background: var(--gs-blanc) !important;
  border-top: 2px solid var(--gs-rouge) !important;
  border-radius: 0 0 var(--gs-radius) var(--gs-radius) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;
  min-width: 200px !important;
  padding: 8px 0 !important;
}

.main-header-menu .sub-menu .menu-item a {
  font-family: var(--gs-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #444 !important;
  padding: 10px 20px !important;
  border-bottom: 1px solid var(--gs-gris) !important;
}

.main-header-menu .sub-menu .menu-item:last-child a {
  border-bottom: none !important;
}

.main-header-menu .sub-menu .menu-item a:hover {
  color: var(--gs-rouge) !important;
  background: var(--gs-gris) !important;
}

/* ================================================================
   BARRE D'ADS SOUS LA NAV
   ================================================================ */
.gs-ad-bar {
  background: var(--gs-blanc);
  border-bottom: 1px solid var(--gs-bordure);
  padding: 10px 0;
  text-align: center;
}

.gs-ad-bar .gs-ad-label {
  font-size: 9px;
  color: #ccc;
  text-transform: uppercase;
  letter-spacing: 1px;
  display: block;
  margin-bottom: 4px;
}

.gs-ad-728 {
  display: inline-block;
  background: var(--gs-gris);
  border: 1px dashed #ddd;
  width: 728px;
  height: 90px;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ccc;
  font-size: 12px;
  margin: 0 auto;
}

/* ================================================================
   CONTENU PRINCIPAL
   ================================================================ */
.ast-container {
  max-width: 1200px !important;
}

#content,
.site-content {
  background: var(--gs-fond) !important;
  padding-top: 36px !important;
}

/* Layout avec sidebar */
.ast-grid-right-sidebar #primary,
.ast-grid-left-sidebar #primary {
  padding-right: 32px !important;
}

/* ================================================================
   ÉTIQUETTE DE SECTION
   ================================================================ */
.gs-section-label {
  font-family: var(--gs-sans);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--gs-muted);
  padding-bottom: 12px;
  border-bottom: 2px solid var(--gs-noir);
  margin-bottom: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.gs-section-label a {
  font-size: 11px;
  color: var(--gs-rouge);
  text-decoration: none;
  font-weight: 600;
}

/* ================================================================
   ARTICLES — BLOG / LISTE
   ================================================================ */
.ast-article-post,
article.post,
article.type-post,
.blog article,
.archive article {
  background: var(--gs-blanc) !important;
  border-radius: var(--gs-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--gs-shadow) !important;
  border: 1px solid var(--gs-bordure) !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease !important;
  margin-bottom: 28px !important;
}

.ast-article-post:hover,
article.post:hover {
  box-shadow: var(--gs-shadow-h) !important;
  transform: translateY(-3px) !important;
}

/* Image */
.post-thumb-img-content,
.ast-blog-featured-section {
  overflow: hidden !important;
}

.post-thumb-img-content img,
.wp-post-image,
.ast-blog-featured-section img {
  width: 100% !important;
  height: 230px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.45s ease !important;
}

.ast-article-post:hover .post-thumb-img-content img {
  transform: scale(1.04) !important;
}

/* Padding du corps */
.ast-blog-single-element,
.entry-content-wrap,
.ast-article-inner,
.ast-article-post .entry-summary {
  padding: 18px 22px 22px !important;
}

/* Catégorie */
.cat-links a,
.posted-in a,
.entry-categories a {
  font-family: var(--gs-sans) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color: var(--gs-rouge) !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin-bottom: 8px !important;
}

/* Titre d'article */
.entry-title {
  font-family: var(--gs-serif) !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  color: var(--gs-noir) !important;
  margin: 4px 0 10px !important;
}

.entry-title a {
  color: var(--gs-noir) !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.entry-title a:hover {
  color: var(--gs-rouge) !important;
}

/* Extrait */
.entry-summary p,
.entry-content > p:first-child {
  font-size: 14px !important;
  color: #666 !important;
  line-height: 1.65 !important;
  margin-bottom: 14px !important;
}

/* Meta */
.entry-meta,
.posted-on,
.byline,
.entry-footer {
  font-size: 12px !important;
  color: #bbb !important;
}

.entry-meta a,
.posted-on a,
.byline a {
  color: #aaa !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.entry-meta a:hover {
  color: var(--gs-rouge) !important;
}

/* Lire la suite */
a.more-link,
.ast-read-more {
  display: inline-block !important;
  color: var(--gs-rouge) !important;
  border: 1.5px solid var(--gs-rouge) !important;
  font-family: var(--gs-sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  padding: 7px 16px !important;
  border-radius: 2px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  background: transparent !important;
  margin-top: 12px !important;
}

a.more-link:hover {
  background: var(--gs-rouge) !important;
  color: var(--gs-blanc) !important;
}

/* ================================================================
   AD BLOCK EN MILIEU DE LISTE
   ================================================================ */
.gs-ad-inline {
  background: var(--gs-blanc);
  border: 1px solid var(--gs-bordure);
  border-radius: var(--gs-radius);
  padding: 12px;
  text-align: center;
  margin-bottom: 28px;
}

.gs-ad-inline .gs-ad-label {
  font-size: 9px;
  color: #ccc;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 6px;
}

/* ================================================================
   ARTICLE INDIVIDUEL (single)
   ================================================================ */
.single-post #primary,
.single #primary {
  max-width: 760px;
}

.single .entry-header,
.single-post .entry-header {
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--gs-bordure);
}

.single .entry-title,
.single-post .entry-title {
  font-family: var(--gs-serif) !important;
  font-size: 38px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--gs-noir) !important;
  margin-bottom: 16px !important;
}

.single .entry-meta,
.single-post .entry-meta {
  font-size: 13px !important;
  color: var(--gs-muted) !important;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 14px !important;
}

.single .entry-meta::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  background: var(--gs-rouge);
}

/* Image mise en avant */
.single .ast-post-format-section img,
.single .wp-post-image,
.single-post .wp-post-image {
  width: 100% !important;
  height: auto !important;
  max-height: 480px !important;
  object-fit: cover !important;
  border-radius: var(--gs-radius) !important;
  margin-bottom: 32px !important;
}

/* Corps de l'article */
.single .entry-content,
.single-post .entry-content {
  font-family: var(--gs-sans) !important;
  font-size: 17px !important;
  line-height: 1.85 !important;
  color: #2a2a2a !important;
}

.single .entry-content h2 {
  font-family: var(--gs-serif) !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: var(--gs-noir) !important;
  margin: 40px 0 16px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--gs-bordure) !important;
}

.single .entry-content h3 {
  font-family: var(--gs-serif) !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  margin: 28px 0 12px !important;
}

.single .entry-content p {
  margin-bottom: 22px !important;
}

.single .entry-content a {
  color: var(--gs-rouge) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(200,48,42,0.3) !important;
}

.single .entry-content a:hover {
  text-decoration-color: var(--gs-rouge) !important;
}

.single .entry-content blockquote {
  border-left: 4px solid var(--gs-rouge) !important;
  padding: 20px 24px !important;
  margin: 32px 0 !important;
  background: var(--gs-gris) !important;
  border-radius: 0 var(--gs-radius) var(--gs-radius) 0 !important;
  font-family: var(--gs-serif) !important;
  font-size: 19px !important;
  font-style: italic !important;
  color: #444 !important;
}

/* ================================================================
   SIDEBAR
   ================================================================ */
#secondary,
.widget-area,
aside#secondary {
  background: transparent !important;
}

.widget {
  background: var(--gs-blanc) !important;
  border: 1px solid var(--gs-bordure) !important;
  border-radius: var(--gs-radius) !important;
  margin-bottom: 24px !important;
  overflow: hidden !important;
}

.widget-title,
.widgettitle {
  font-family: var(--gs-sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: var(--gs-muted) !important;
  padding: 14px 18px 12px !important;
  border-bottom: 2px solid var(--gs-noir) !important;
  margin: 0 0 0 0 !important;
  background: transparent !important;
}

.widget ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.widget ul li {
  padding: 12px 18px !important;
  border-bottom: 1px solid var(--gs-gris) !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  font-family: var(--gs-sans) !important;
}

.widget ul li:last-child {
  border-bottom: none !important;
}

.widget ul li a {
  color: var(--gs-texte) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  transition: color 0.2s !important;
}

.widget ul li a:hover {
  color: var(--gs-rouge) !important;
}

/* Widget ad (pub) */
.widget_gs_ad,
.gs-widget-ad {
  text-align: center !important;
  padding: 12px !important;
}

/* Search */
.widget_search .search-form {
  padding: 16px 18px !important;
  display: flex !important;
  gap: 8px !important;
}

.widget_search .search-field {
  flex: 1 !important;
  border: 1.5px solid var(--gs-bordure) !important;
  border-radius: 2px !important;
  padding: 9px 12px !important;
  font-family: var(--gs-sans) !important;
  font-size: 13px !important;
  outline: none !important;
  transition: border-color 0.2s !important;
}

.widget_search .search-field:focus {
  border-color: var(--gs-rouge) !important;
}

.widget_search .search-submit {
  background: var(--gs-rouge) !important;
  color: var(--gs-blanc) !important;
  border: none !important;
  padding: 9px 16px !important;
  font-size: 13px !important;
  border-radius: 2px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
}

.widget_search .search-submit:hover {
  background: var(--gs-rouge-dark) !important;
}

/* Widget scores / stats */
.gs-scores-widget {
  background: var(--gs-noir) !important;
  padding: 18px !important;
  border-radius: var(--gs-radius) !important;
}

.gs-scores-widget h3 {
  font-family: var(--gs-sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  color: var(--gs-rouge) !important;
  margin-bottom: 16px !important;
}

.gs-match {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #1a1a1a;
}

.gs-match:last-child { border-bottom: none; }

.gs-match .team {
  font-size: 13px;
  font-weight: 600;
  color: var(--gs-blanc);
  flex: 1;
}

.gs-match .team:last-child { text-align: right; }

.gs-match .score {
  font-family: var(--gs-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--gs-blanc);
  padding: 0 12px;
  text-align: center;
}

.gs-match .status {
  display: block;
  font-size: 9px;
  color: var(--gs-rouge);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-align: center;
}

/* ================================================================
   FOOTER
   ================================================================ */
#colophon,
.site-footer,
.ast-small-footer {
  background: var(--gs-noir) !important;
  border-top: 3px solid var(--gs-rouge) !important;
  color: #666 !important;
}

.ast-footer-widget-area {
  background: #0d0d0d !important;
  padding: 48px 0 32px !important;
  border-bottom: 1px solid #1a1a1a !important;
}

.ast-footer-widget-area .widget {
  background: transparent !important;
  border: none !important;
}

.ast-footer-widget-area .widget-title,
.ast-footer-widget-area .widgettitle {
  color: #aaa !important;
  border-bottom-color: #2a2a2a !important;
  font-size: 11px !important;
}

.ast-footer-widget-area .widget ul li {
  border-bottom-color: #1a1a1a !important;
}

.ast-footer-widget-area .widget ul li a {
  color: #555 !important;
}

.ast-footer-widget-area .widget ul li a:hover {
  color: var(--gs-rouge) !important;
}

.ast-footer-copyright,
.ast-copyright-text,
.site-info {
  font-size: 13px !important;
  color: #444 !important;
  padding: 16px 0 !important;
  text-align: center !important;
}

.ast-footer-copyright a,
.site-info a {
  color: #666 !important;
  text-decoration: none !important;
}

.ast-footer-copyright a:hover,
.site-info a:hover {
  color: var(--gs-rouge) !important;
}

/* ================================================================
   PAGINATION
   ================================================================ */
.page-numbers {
  font-family: var(--gs-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--gs-texte) !important;
  border: 1.5px solid var(--gs-bordure) !important;
  padding: 8px 14px !important;
  border-radius: 2px !important;
  text-decoration: none !important;
  transition: all 0.2s !important;
  background: var(--gs-blanc) !important;
}

.page-numbers.current,
.page-numbers:hover {
  background: var(--gs-rouge) !important;
  border-color: var(--gs-rouge) !important;
  color: var(--gs-blanc) !important;
}

/* ================================================================
   BOUTONS GÉNÉRAUX
   ================================================================ */
.wp-block-button__link,
input[type="submit"],
button[type="submit"],
.ast-button {
  background: var(--gs-rouge) !important;
  color: var(--gs-blanc) !important;
  font-family: var(--gs-sans) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  border: none !important;
  border-radius: 2px !important;
  padding: 12px 28px !important;
  cursor: pointer !important;
  transition: background 0.2s !important;
  text-decoration: none !important;
}

.wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background: var(--gs-rouge-dark) !important;
}

/* ================================================================
   MOBILE HAMBURGER
   ================================================================ */
.ast-mobile-menu-trigger-fill,
button.menu-toggle {
  color: var(--gs-noir) !important;
}

/* ================================================================
   RESPONSIVE — TABLETTE
   ================================================================ */
@media (max-width: 1024px) {
  .ast-container { padding: 0 20px !important; }
  .single .entry-title,
  .single-post .entry-title { font-size: 30px !important; }
}

/* ================================================================
   RESPONSIVE — MOBILE
   ================================================================ */
@media (max-width: 768px) {

  /* Ticker */
  #gs-ticker { height: 34px; }
  #gs-ticker .gs-ticker-inner { font-size: 12px; }
  #gs-ticker .gs-ticker-label { font-size: 9px; padding: 0 12px; }

  /* Header */
  .ast-site-identity .site-title a,
  .site-title a { font-size: 28px !important; }

  .gs-header-meta { padding: 8px 0 10px; }

  .ast-ad-bar { display: none; } /* Cacher leaderboard sur mobile */

  /* Navigation mobile */
  .main-header-menu > .menu-item > a {
    font-size: 14px !important;
    padding: 12px 20px !important;
    border-bottom: 1px solid var(--gs-gris) !important;
  }

  /* Articles */
  .entry-title { font-size: 18px !important; }
  .post-thumb-img-content img,
  .wp-post-image { height: 190px !important; }

  .ast-blog-single-element,
  .entry-content-wrap { padding: 14px 16px 18px !important; }

  /* Single */
  .single .entry-title,
  .single-post .entry-title { font-size: 24px !important; }

  .single .entry-content { font-size: 16px !important; }

  /* Footer */
  .ast-footer-widget-area { padding: 32px 0 20px !important; }
}

@media (max-width: 480px) {
  .ast-site-identity .site-title a { font-size: 22px !important; }
  .entry-title { font-size: 17px !important; }
  .single .entry-title { font-size: 20px !important; }
}