/*
Theme Name: Desopinion TND
Theme URI: https://desopinion.com
Author: Desopinion
Author URI: https://desopinion.com
Description: Tema de noticias oscuro, minimalista y profesional para Desopinion.com, inspirado en la estética de TND (Tus Noticias Deportivas). Compatible con Rank Math SEO, LiteSpeed Cache y el plugin RSS Claude Publisher. Acento verde #22c55e, logo personalizable, totalmente responsive.
Version: 1.3.1
Requires at least: 5.5
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: desopinion-tnd
Tags: news, dark, blog, two-columns, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* =========================================================
   VARIABLES (cambia el acento aquí si lo necesitas)
   ========================================================= */
:root{
  --bg:#050505;
  --bg-header:#0a0a0a;
  --bg-footer:#080808;
  --bg-card:#0a0a0a;
  --bg-card-2:#0f0f0f;
  --bg-input:#111111;
  --border:#151515;
  --border-card:#141414;
  --border-hover:#222222;
  --border-input:#222222;
  --accent:#22c55e;
  --accent-hover:#16a34a;
  --text:#ffffff;
  --text-muted:#999999;
  --text-dim:#888888;
  --text-faint:#555555;
  --radius:12px;
  --radius-sm:8px;
  --max:1240px;
  --cat-futbol:#22c55e;
  --cat-nba:#f97316;
  --cat-f1:#ef4444;
  --cat-boxeo:#8b5cf6;
  --cat-ciclismo:#06b6d4;
  --cat-destacado:#f59e0b;
  /* Categorías de Desopinion */
  --cat-colombia:#facc15;
  --cat-economia:#06b6d4;
  --cat-deportes:#22c55e;
  --cat-entretenimiento:#ec4899;
  --cat-inmigracion:#f97316;
  --cat-tecnologia:#3b82f6;
  --cat-eventos:#8b5cf6;
  --cat-investigativa:#ef4444;
  --cat-opinion:#f59e0b;
  --danger:#dc2626;
}

/* =========================================================
   RESET / BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
html{color-scheme:dark;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;transition:color .2s ease;}
a:hover{color:var(--accent);}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{margin:0;line-height:1.25;color:var(--text);}
.container{max-width:var(--max);margin:0 auto;padding:0 20px;}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px;}
.skip-link:focus{position:fixed!important;top:12px;left:12px;clip:auto;width:auto;height:auto;z-index:100;background:var(--accent);color:#000;font-weight:700;font-size:13px;padding:10px 16px;border-radius:8px;}

/* =========================================================
   SECTION TITLE (barra verde — firma visual de TND)
   ========================================================= */
.section-head{display:flex;align-items:center;gap:10px;margin:32px 0 18px;}
.section-head .bar{width:4px;height:20px;background:var(--accent);border-radius:99px;flex:none;}
.section-head h2{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--text);}
.section-head .more{margin-left:auto;font-size:11px;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;}
.section-head .more:hover{color:var(--accent);}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg-header);border-bottom:1px solid var(--border);backdrop-filter:saturate(120%) blur(6px);}
.header-inner{display:flex;align-items:center;gap:20px;height:64px;}
.site-logo{display:flex;align-items:center;gap:10px;font-weight:800;}
.site-logo img{max-height:38px;width:auto;}
.logo-text{font-size:22px;font-weight:800;letter-spacing:-.02em;color:var(--text);}
.logo-text .dot{color:var(--accent);}
.main-nav{display:flex;align-items:center;gap:4px;margin-left:8px;flex:1;min-width:0;overflow:hidden;}
.main-nav a{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);padding:8px 10px;border-radius:8px;white-space:nowrap;}
.main-nav a:hover,.main-nav .current-menu-item>a,.main-nav .current_page_item>a{color:var(--text);}
.main-nav .current-menu-item>a{color:var(--accent);}
.header-search{margin-left:auto;display:flex;align-items:center;}
.header-search form{display:flex;align-items:center;background:var(--bg-input);border:1px solid var(--border-input);border-radius:99px;padding:4px 6px 4px 14px;transition:border-color .2s,box-shadow .2s;}
.header-search form:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px rgba(34,197,94,.25);}
.header-search input{background:transparent;border:none;outline:none;color:var(--text);font-size:13px;width:150px;}
.header-search input::placeholder{color:var(--text-faint);}
.header-search button{background:transparent;border:none;cursor:pointer;color:var(--text-dim);display:flex;padding:4px;}
.header-search button:hover{color:var(--accent);}
.menu-toggle{display:none;background:transparent;border:1px solid var(--border-input);color:var(--text);border-radius:8px;padding:8px;cursor:pointer;}

/* =========================================================
   BREAKING / TICKER
   ========================================================= */
.breaking-bar{background:var(--danger);color:#fff;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;display:flex;align-items:center;gap:12px;padding:8px 0;}
.breaking-bar .label{background:rgba(0,0,0,.25);padding:2px 10px;border-radius:6px;display:inline-flex;align-items:center;gap:6px;}
.breaking-bar .pulse{width:8px;height:8px;border-radius:99px;background:#fff;animation:pulse 1.4s infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* =========================================================
   GRID / CARDS
   ========================================================= */
.layout{display:grid;grid-template-columns:1fr 320px;gap:32px;padding:24px 0 48px;}
@media(max-width:980px){.layout{grid-template-columns:1fr;}}

.news-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;}
.news-grid .hero{grid-column:1 / -1;}
@media(max-width:600px){.news-grid{grid-template-columns:1fr;}}

.card{display:flex;flex-direction:column;background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius);overflow:hidden;transition:border-color .2s;}
.card:hover{border-color:var(--border-hover);}
.card .thumb{position:relative;overflow:hidden;aspect-ratio:16/9;background:#000;}
.card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.card:hover .thumb img{transform:scale(1.05);}
.card .body{padding:14px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1;}
.card .title{font-size:16px;font-weight:700;line-height:1.3;color:var(--text);transition:color .2s;}
.card:hover .title{color:var(--accent);}
.card .excerpt{font-size:13px;color:var(--text-dim);line-height:1.55;}
.card .meta{margin-top:auto;font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;}

/* Hero card */
.card.hero .thumb{aspect-ratio:21/9;}
.card.hero .title{font-size:28px;font-weight:800;line-height:1.18;}
.card.hero .excerpt{font-size:15px;}
@media(max-width:600px){.card.hero .title{font-size:22px;}.card.hero .thumb{aspect-ratio:16/9;}}

/* Small list cards (sidebar) */
.mini{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--border);}
.mini:last-child{border-bottom:none;}
.mini .thumb{flex:none;width:88px;aspect-ratio:1/1;border-radius:8px;overflow:hidden;background:#000;}
.mini .thumb img{width:100%;height:100%;object-fit:cover;}
.mini .title{font-size:13px;font-weight:600;line-height:1.35;color:var(--text);transition:color .2s;}
.mini:hover .title{color:var(--accent);}
.mini .meta{font-size:10px;color:var(--text-faint);text-transform:uppercase;letter-spacing:.04em;margin-top:4px;}

/* =========================================================
   CATEGORY BADGES
   ========================================================= */
.badge{display:inline-block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:4px 9px;border-radius:6px;background:var(--accent);color:#000;}
.badge[data-cat="colombia"]{background:var(--cat-colombia);color:#000;}
.badge[data-cat="economia"]{background:var(--cat-economia);color:#000;}
.badge[data-cat="deportes"]{background:var(--cat-deportes);color:#000;}
.badge[data-cat="entretenimiento"]{background:var(--cat-entretenimiento);color:#fff;}
.badge[data-cat="inmigracion"]{background:var(--cat-inmigracion);color:#fff;}
.badge[data-cat="tecnologia"]{background:var(--cat-tecnologia);color:#fff;}
.badge[data-cat="eventos"]{background:var(--cat-eventos);color:#fff;}
.badge[data-cat="unidad-investigativa"]{background:var(--cat-investigativa);color:#fff;}
.badge[data-cat="mi-opinion"]{background:var(--cat-opinion);color:#000;}
.badge[data-cat="nba"]{background:var(--cat-nba);color:#fff;}
.badge[data-cat="f1"],.badge[data-cat="formula-1"]{background:var(--cat-f1);color:#fff;}
.badge[data-cat="boxeo"]{background:var(--cat-boxeo);color:#fff;}
.badge[data-cat="ciclismo"]{background:var(--cat-ciclismo);color:#fff;}
.badge[data-cat="mundial"],.badge[data-cat="destacado"]{background:var(--cat-destacado);color:#000;}

/* =========================================================
   SIDEBAR
   ========================================================= */
.sidebar .widget{background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius);padding:18px;margin-bottom:24px;}
.sidebar .widget-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;display:flex;align-items:center;gap:10px;}
.sidebar .widget-title::before{content:"";width:4px;height:18px;background:var(--accent);border-radius:99px;}
.sidebar .widget ul li{padding:8px 0;border-bottom:1px solid var(--border);font-size:14px;color:var(--text-muted);}
.sidebar .widget ul li:last-child{border-bottom:none;}
.sidebar .widget ul li a:hover{color:var(--accent);}

/* =========================================================
   SINGLE ARTICLE
   ========================================================= */
.article{max-width:760px;margin:0 auto;padding:28px 0 56px;}
.article .a-cat{margin-bottom:14px;}
.article h1{font-size:38px;font-weight:800;line-height:1.15;letter-spacing:-.01em;margin-bottom:16px;}
@media(max-width:600px){.article h1{font-size:28px;}}
.article .a-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;color:var(--text-dim);margin-bottom:22px;}
.article .a-meta .sep{color:var(--text-faint);}
.article .a-featured{border-radius:var(--radius);overflow:hidden;margin:0 0 26px;border:1px solid var(--border-card);}
.article .a-featured img{width:100%;height:auto;object-fit:cover;}
.article-body{font-size:17px;line-height:1.8;color:#e7e7e7;}
.article-body p{margin:0 0 1.25em;}
.article-body h2{font-size:24px;font-weight:800;margin:1.6em 0 .6em;color:#fff;}
.article-body h3{font-size:20px;font-weight:700;margin:1.4em 0 .5em;color:#fff;}
.article-body a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;}
.article-body a:hover{color:var(--accent-hover);}
.article-body img{border-radius:var(--radius);margin:1.4em 0;border:1px solid var(--border-card);}
.article-body blockquote{margin:1.5em 0;padding:14px 20px;border-left:4px solid var(--accent);background:var(--bg-card-2);border-radius:0 8px 8px 0;color:var(--text-muted);}
.article-body ul,.article-body ol{margin:0 0 1.25em;padding-left:1.4em;}
.article-body li{margin-bottom:.4em;}
.article-body ul li::marker{color:var(--accent);}
.article-body code{background:var(--bg-input);padding:2px 6px;border-radius:6px;font-size:.9em;}
.article-body figure{margin:1.4em 0;}
.article-body figcaption{font-size:12px;color:var(--text-faint);text-align:center;margin-top:8px;}
/* Compartir */
.share-row{display:flex;align-items:center;gap:10px;margin-top:26px;padding-top:18px;border-top:1px solid var(--border);}
.share-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);}
.share-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:99px;background:var(--bg-input);border:1px solid var(--border-input);color:var(--text-muted);transition:all .2s;}
.share-btn:hover{transform:translateY(-2px);}
.share-wa:hover{background:#25d366;border-color:#25d366;color:#000;}
.share-x:hover{background:#fff;border-color:#fff;color:#000;}
.share-fb:hover{background:#1877f2;border-color:#1877f2;color:#fff;}

.a-tags{margin-top:28px;display:flex;flex-wrap:wrap;gap:8px;}
.a-tags a{font-size:11px;text-transform:uppercase;letter-spacing:.04em;background:var(--bg-input);border:1px solid var(--border-input);color:var(--text-muted);padding:5px 11px;border-radius:99px;}
.a-tags a:hover{border-color:var(--accent);color:var(--accent);}

/* Related */
.related{border-top:1px solid var(--border);margin-top:40px;padding-top:8px;}

/* =========================================================
   ARCHIVE / SEARCH HEADER
   ========================================================= */
.page-head{padding:28px 0 8px;}
.page-head .kicker{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:700;margin-bottom:6px;}
.page-head h1{font-size:30px;font-weight:800;}
.page-head p{color:var(--text-dim);margin-top:8px;font-size:14px;}

/* =========================================================
   PAGINATION
   ========================================================= */
.pagination{display:flex;justify-content:center;gap:8px;margin:36px 0;flex-wrap:wrap;}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;background:var(--bg-card);border:1px solid var(--border-card);border-radius:8px;font-size:14px;font-weight:600;color:var(--text-muted);}
.pagination .page-numbers:hover{border-color:var(--border-hover);color:var(--text);}
.pagination .page-numbers.current{background:var(--accent);border-color:var(--accent);color:#000;}

/* =========================================================
   BUTTONS
   ========================================================= */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#000;font-size:13px;font-weight:700;padding:9px 18px;border-radius:var(--radius-sm);border:none;cursor:pointer;transition:background .2s;}
.btn:hover{background:var(--accent-hover);color:#000;}
.btn-ghost{background:transparent;border:1px solid var(--border-input);color:var(--text);}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent);}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{background:var(--bg-footer);border-top:1px solid var(--border);margin-top:40px;padding:40px 0 24px;}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:32px;}
@media(max-width:768px){.footer-grid{grid-template-columns:1fr;gap:24px;}}
.footer-grid h4{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:14px;}
.footer-grid .f-about .logo-text{font-size:20px;margin-bottom:10px;display:inline-block;}
.footer-grid .f-about p{font-size:13px;color:var(--text-dim);line-height:1.6;max-width:340px;}
.footer-grid ul li{padding:5px 0;font-size:13px;color:var(--text-muted);}
.footer-grid ul li a:hover{color:var(--accent);}
.footer-bottom{border-top:1px solid var(--border);margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--text-faint);}

/* =========================================================
   PUBLICIDAD (AdSense)
   Alturas mínimas reservadas para que la página no salte
   cuando carga el anuncio. Ajusta min-height si cambias
   el formato del anuncio.
   ========================================================= */
.ad-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:18px 0;padding:26px 10px 12px;min-height:120px;background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius);overflow:hidden;}
.ad-slot::before{content:"Publicidad";position:absolute;top:7px;left:12px;font-size:9px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);}
.ad-slot>*{max-width:100%;}
.ad-leaderboard{min-height:120px;margin:14px 0 0;}          /* 320x100 en móvil */
@media(min-width:768px){.ad-leaderboard{min-height:110px;}} /* 728x90 en escritorio */
.ad-in-article{min-height:280px;}                           /* 300x250 / responsive */
.news-grid .ad-slot{grid-column:1 / -1;margin:0;}
.ad-in-grid{min-height:280px;}
@media(min-width:768px){.ad-in-grid{min-height:120px;}}
.ad-sidebar-slot{position:sticky;top:80px;min-height:280px;}

/* =========================================================
   COOKIE BANNER
   ========================================================= */
.cookie-banner{position:fixed;bottom:16px;left:16px;right:16px;max-width:520px;margin:0 auto;background:var(--bg-card);border:1px solid var(--border-hover);border-radius:var(--radius);padding:16px 18px;z-index:90;box-shadow:0 10px 40px rgba(0,0,0,.6);}
.cookie-banner p{font-size:12px;color:var(--text-muted);margin:0 0 12px;line-height:1.5;}
.cookie-banner .actions{display:flex;gap:8px;justify-content:flex-end;}

/* =========================================================
   RESPONSIVE NAV
   ========================================================= */
@media(max-width:860px){
  .menu-toggle{display:inline-flex;}
  .main-nav{position:absolute;top:64px;left:0;right:0;background:var(--bg-header);border-bottom:1px solid var(--border);flex-direction:column;align-items:stretch;gap:0;padding:8px 20px 16px;display:none;overflow:visible;}
  .main-nav.open{display:flex;}
  .main-nav a{padding:12px 8px;border-bottom:1px solid var(--border);}
  .header-search input{width:110px;}
}

/* WP core helpers */
.aligncenter{margin-left:auto;margin-right:auto;}
.alignleft{float:left;margin:0 20px 12px 0;}
.alignright{float:right;margin:0 0 12px 20px;}
.wp-caption{max-width:100%;}
.sticky,.gallery-caption,.bypostauthor{}