/*
Theme Name: Djoma Wagna
Theme URI: https://xn--djomawagnaguinemdia-ozbc.store
Description: Theme de marque pour le blog d'actualite Djoma Wagna (theme enfant de Kadence).
Author: izo
Template: kadence
Version: 0.5.0
Text Domain: djoma-wagna
*/

/* ── Brand tokens (sampled from the Djoma Wagna logo — Guinea flag palette) ── */
:root{
  --dw-red:   #D81818;
  --dw-gold:  #FCD116;
  --dw-green: #009460;
  --dw-black: #000000;
  --dw-ink:   #14181f;
}

/* ── Social / utility bar (above the header, injected via functions.php) ── */
.dw-topbar{ background: var(--dw-black); color:#cfd3d8; font-size:12px; }
.dw-topbar-inner{
  max-width:1290px; margin:0 auto; padding:2px 14px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.dw-topbar-label{ letter-spacing:.14em; font-weight:700; color:#9aa0a8; }
.dw-social{ display:flex; align-items:center; gap:4px; }
.dw-social a{
  color:#fff; display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; min-height:38px;            /* comfortable tap target for his mobile audience */
  transition:color .15s, transform .15s;
}
.dw-social a:hover{ color: var(--dw-red); transform:translateY(-1px); }

/* ── Header: black bar, logo + wordmark title, tricolor stripe ── */
.site-header-row{ background: var(--dw-black) !important; }
#masthead.site-header, .site-header{ position:relative; }

/* logo before the title; title styled as the DJOMAWAGNA wordmark */
.site-branding a.brand{ display:flex !important; align-items:center; gap:12px; text-decoration:none; }
.site-branding a.brand::before{
  content:""; flex:0 0 auto; width:46px; height:50px;
  /* logo-header.webp = 100px resize of the 917px logo.png master (3.6 KB vs 287 KB) */
  background:url('assets/logo-header.webp') center/contain no-repeat;
}
.site-branding .site-title{
  margin:0 !important; color:#fff !important;
  font-style:italic; font-weight:900; text-transform:uppercase;
  letter-spacing:-.01em; line-height:1;
  display:block !important;   /* keep the wordmark visible (Kadence hides it on tablet via .vs-md-false) */
}
.site-branding .site-title::after{ content:" /"; color: var(--dw-red); font-style:italic; }

/* nav links light on black, gold on hover */
.site-header-main .header-navigation .menu > li.menu-item > a,
.header-navigation .primary-menu-container ul li a{ color:#e9edf2 !important; font-weight:600; }
.header-navigation .menu > li.menu-item > a:hover,
.header-navigation .primary-menu-container ul li a:hover{ color: var(--dw-gold) !important; }
.site-header .header-navigation .kadence-svg-icon{ color:#fff !important; }

/* red-yellow-green Guinea stripe across the bottom of the header */
#masthead.site-header::after, .site-header::after{
  content:""; display:block; height:4px;
  background:linear-gradient(90deg,
     var(--dw-red) 0 33.33%, var(--dw-gold) 33.33% 66.66%, var(--dw-green) 66.66% 100%);
}

/* ── Article cards ── */
.entry-title, .site-title{ letter-spacing:-.01em; }

/* Category badges in brand red */
.entry-taxonomies .category-style-normal .term-link,
.loop-entry .entry-taxonomies a,
.entry-taxonomies a{
  background: var(--dw-red); color:#fff !important;
  border-radius:3px; padding:4px 10px; font-weight:700;
  text-transform:uppercase; font-size:.78em; letter-spacing:.03em;
}
.entry-taxonomies a:hover{ background:#a81111; }

/* Read-more + content links + accents in brand red */
.entry-content a, .loop-entry .entry-content a{ color: var(--dw-red); }
.post-loop-item .more-link, .entry-actions a, .read-more a{ color: var(--dw-red) !important; font-weight:700; }
.wp-block-button__link, .button, button.button{ background: var(--dw-red) !important; border-color: var(--dw-red) !important; }

/* Gold underline accent under section/widget titles */
.kt-blocks-info-box-title,
.widget-title, .kadence-blocks-advanced-heading,
.wp-block-heading.is-style-dw-section{
  border-bottom:3px solid var(--dw-gold); display:inline-block; padding-bottom:4px;
}

/* ── Article share bar (appended to single posts; WhatsApp first) ── */
.dw-share{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px;
  margin:28px 0 4px; padding-top:18px; border-top:1px solid #e7e9ee;
}
.dw-share-label{ font-weight:700; color: var(--dw-ink); margin-right:4px; }
.dw-share a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:44px; min-height:44px; border-radius:6px; color:#fff;
  transition:transform .15s, opacity .15s;
}
.dw-share a:hover{ transform:translateY(-2px); opacity:.92; }
.dw-share-whatsapp{ background:#25D366; }
.dw-share-facebook{ background:#1877F2; }
.dw-share-x{ background:#000; }
.dw-share-telegram{ background:#229ED9; }

/* ── Homepage lead story: first card spans the grid, magazine style ──
   The grid is a UL; cards are li.entry-list-item wrappers (first-of-type, not
   first-child — the injected .dw-home-h1 is the UL's first child). */
@media (min-width:768px){
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type{ grid-column:1 / -1; }
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type > article.entry{
    display:grid; grid-template-columns:3fr 2fr; align-items:stretch; height:100%;
  }
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type .post-thumbnail{
    height:100%; min-height:360px; padding-bottom:0 !important;
  }
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type .post-thumbnail img{
    width:100%; height:100%; object-fit:cover;
  }
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type .entry-content-wrap{
    display:flex; flex-direction:column; justify-content:center; padding:2.2rem 2.6rem;
  }
  .blog .post-archive.grid-cols > li.entry-list-item:first-of-type .entry-title{
    font-size:2.1rem; line-height:1.15;
  }
}

/* Card polish: rounded corners */
.loop-entry{ border-radius:10px; overflow:hidden; }

/* Portrait photos: keep faces — crop from the bottom, not the top */
.post-thumbnail img, .wp-post-image{ object-position: top center; }

/* ── Breadcrumbs (Rank Math, single articles) ── */
.dw-breadcrumbs{ margin:18px 0 0; font-size:.9rem; color:#6b7280; }
.dw-breadcrumbs a{ color:#374151; text-decoration:none; }
.dw-breadcrumbs a:hover{ color: var(--dw-red); }
.dw-breadcrumbs .separator{ margin:0 7px; color:#9ca3af; }

/* ── "À lire aussi" related articles ── */
.dw-related{ margin-top:36px; }
.dw-related-title{
  font-size:1.45rem; margin:0 0 14px;
  border-bottom:3px solid var(--dw-gold); display:inline-block; padding-bottom:4px;
}
.dw-related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width:700px){ .dw-related-grid{ grid-template-columns:1fr; } }
.dw-related-card{
  display:flex; flex-direction:column; background:#fff;
  border:1px solid #e7e9ee; border-radius:10px; overflow:hidden;
  text-decoration:none; color: var(--dw-ink);
  transition:box-shadow .15s, transform .15s;
}
.dw-related-card:hover{ box-shadow:0 6px 18px rgba(0,0,0,.09); transform:translateY(-2px); }
.dw-related-img{ width:100%; display:block; aspect-ratio:16/9; object-fit:cover; height:auto; }
.dw-related-cat{
  color: var(--dw-red); font-weight:700; text-transform:uppercase;
  font-size:.72rem; letter-spacing:.05em; padding:12px 14px 0;
}
.dw-related-head{ font-weight:700; font-size:1.02rem; line-height:1.35; padding:4px 14px 6px; }
/* beat .entry-content a (the block is appended to post content) */
.entry-content a.dw-related-card{ color: var(--dw-ink); text-decoration:none; }
.entry-content a.dw-related-card .dw-related-cat{ color: var(--dw-red); }
.entry-content a.dw-related-card .dw-related-date{ color:#6b7280; }
.dw-related-date{ color:#6b7280; font-size:.85rem; padding:0 14px 14px; margin-top:auto; }

/* ── Header search toggle on the black bar ── */
.site-header .search-toggle-open,
.site-header .search-toggle-open .kadence-svg-icon{ color:#fff !important; }
.site-header .search-toggle-open:hover .kadence-svg-icon{ color: var(--dw-gold) !important; }

/* ── Contact form (CF7) ── */
.wpcf7 label{ display:block; font-weight:600; margin-bottom:16px; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea{
  width:100%; margin-top:6px; padding:11px 13px; font:inherit;
  border:1px solid #d3d7de; border-radius:6px; background:#fff;
}
.wpcf7 input:focus, .wpcf7 textarea:focus{
  outline:2px solid var(--dw-gold); border-color: var(--dw-gold);
}
.wpcf7 .wpcf7-submit{
  background: var(--dw-red); color:#fff; font-weight:700;
  padding:12px 30px; border:0; border-radius:6px; cursor:pointer;
}
.wpcf7 .wpcf7-submit:hover{ background:#a81111; }
.wpcf7 .wpcf7-not-valid-tip{ color: var(--dw-red); font-size:.85rem; }

/* ── Newsletter signup band (above the footer) ── */
.dw-newsletter{
  background: var(--dw-black); color:#e9edf2;
  border-top:4px solid var(--dw-gold);
}
.dw-newsletter-inner{ max-width:680px; margin:0 auto; padding:44px 20px 40px; text-align:center; }
.dw-newsletter-title{
  color:#fff; font-size:1.6rem; margin:0 0 8px;
  border-bottom:3px solid var(--dw-gold); display:inline-block; padding-bottom:4px;
}
.dw-newsletter-text{ color:#aeb4bc; margin:10px 0 20px; }
.dw-newsletter .tnp-subscription-minimal form{
  display:flex; gap:10px; justify-content:center; flex-wrap:wrap;
}
.dw-newsletter .tnp-subscription-minimal input.tnp-email{
  flex:1 1 280px; max-width:380px; padding:13px 15px; font:inherit;
  border:1px solid #3a3f47; border-radius:6px; background:#14181f; color:#fff;
}
.dw-newsletter .tnp-subscription-minimal input.tnp-email::placeholder{ color:#8b919a; }
.dw-newsletter .tnp-subscription-minimal input.tnp-email:focus{
  outline:2px solid var(--dw-gold); border-color: var(--dw-gold);
}
.dw-newsletter .tnp-subscription-minimal .tnp-submit,
.dw-newsletter .tnp-subscription-minimal input[type="submit"],
.dw-newsletter .tnp-subscription-minimal button{
  background: var(--dw-red) !important; color:#fff; font-weight:700;
  padding:13px 30px; border:0; border-radius:6px; cursor:pointer; font:inherit;
}
.dw-newsletter .tnp-subscription-minimal .tnp-submit:hover,
.dw-newsletter .tnp-subscription-minimal button:hover{ background:#a81111 !important; }
.dw-newsletter .tnp-privacy-field{
  flex-basis:100%; margin-top:12px; font-size:.85rem; color:#8b919a;
}
.dw-newsletter .tnp-privacy-field a{ color:#e9edf2; text-decoration:underline; }
.dw-newsletter .tnp-privacy-field a:hover{ color: var(--dw-gold); }

/* Footer secondary line */
.site-footer .dw-footer-links{ margin-top:6px; font-size:.9rem; }

/* Visually-hidden H1 on the homepage (SEO/screen-readers; the design uses the header) */
.dw-home-h1{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

/* ── Footer: dark, on-brand ── */
.site-footer{ background: var(--dw-black); color:#aeb4bc; }
.site-footer a{ color:#e9edf2; }
.site-footer a:hover{ color: var(--dw-gold); }

/* ── Mobile ── */
@media (max-width:768px){
  .dw-topbar-label{ display:none; }
  .dw-topbar-inner{ justify-content:flex-end; padding:6px 16px; }
  .site-branding .site-title{ font-size:1.15rem; }
  .site-branding a.brand::before{ width:34px; height:38px; }
}
/* Phones: single-column news feed, titles always wrap, no clipping */
@media (max-width:600px){
  .kadence-posts-list.grid-cols,
  .content-wrap.kadence-posts-list{ grid-template-columns:1fr !important; }
  .loop-entry .entry-title,
  .loop-entry .entry-title a,
  .entry-title{ overflow-wrap:anywhere; word-break:break-word; font-size:1.5rem; }
  .content-container, .site-container, .entry-content-wrap, .loop-entry{ max-width:100%; }
}