/**
 * Fase F — Skins single diferenciadas + dark mode pro
 */

/* —— Base skin container —— */
.nv-s { position: relative; }
.nv-s .nv-single__title { word-wrap: break-word; }

/* 1 Clásico — lectura limpia */
.nv-s1 .nv-single__title {
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  border-bottom: none;
}
.nv-s1 .nv-meta { border-color: transparent; border-bottom-color: var(--nv-news-line, #eef1f4); }

/* 2 Magazine — imagen primero, título grande */
.nv-s2 .nv-single__featured {
  margin: 0 0 1rem;
  border-radius: 0;
  max-width: 100%;
}
.nv-s2 .nv-single__title {
  font-size: clamp(1.7rem, 4.5vw, 2.4rem);
  line-height: 1.12;
}
.nv-s2 .nv-s2__dek {
  font-size: 1.12rem;
  font-style: italic;
  color: var(--nv-news-muted, #536471);
  border-left: 3px solid var(--nv-news-accent, #5B4DFF);
  padding-left: 0.85rem;
}

/* 3 Editorial — extracto tipo cita */
.nv-s3 .nv-single__excerpt,
.nv-s3 .nv-s3__lede {
  font-size: 1.2rem;
  line-height: 1.45;
  font-weight: 500;
  color: var(--nv-news-ink, #0f1419);
  background: var(--nv-news-soft, #f7f9fa);
  padding: 1rem 1.15rem;
  border-radius: 8px;
  margin: 0.75rem 0 1.1rem;
}

/* 4 Hero / portada ancha */
.nv-s4 .nv-single__featured,
.nv-s4 .nv-s4__hero {
  margin-left: calc(-1 * var(--nv-pad-x, 0px));
  margin-right: calc(-1 * var(--nv-pad-x, 0px));
  border-radius: 0;
}
.nv-s4 .nv-single__title {
  margin-top: 1rem;
  font-size: clamp(1.65rem, 4.2vw, 2.35rem);
}

/* 5 Breaking — kicker rojo */
.nv-s5__kicker {
  display: inline-block;
  margin: 0 0 0.5rem;
  padding: 0.2rem 0.55rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: #dc2626;
  border-radius: 4px;
}
.nv-s5 .nv-single__title {
  color: #0f1419;
  font-size: clamp(1.6rem, 4vw, 2.2rem);
}
html.nv-dark .nv-s5 .nv-single__title,
body.nv-dark .nv-s5 .nv-single__title { color: #f3f4f6; }

/* 6 Deportes — acento verde */
.nv-s6 { border-top: 3px solid #16a34a; padding-top: 0.75rem; }
.nv-s6 .nv-badge-tipo { background: #16a34a !important; }

/* 7 Economía — acento dorado */
.nv-s7 { border-top: 3px solid #ca8a04; padding-top: 0.75rem; }
.nv-s7 .nv-single__title { letter-spacing: -0.025em; }

/* 8 Análisis — caja de datos */
.nv-s8__data {
  font-size: 1.05rem;
  line-height: 1.5;
  padding: 0.9rem 1rem;
  margin: 0.5rem 0 1rem;
  background: linear-gradient(135deg, #eef2ff, #f8fafc);
  border: 1px solid #e0e7ff;
  border-radius: 10px;
  color: #1e1b4b;
  font-weight: 500;
}
html.nv-dark .nv-s8__data,
body.nv-dark .nv-s8__data {
  background: #1e1b4b;
  border-color: #312e81;
  color: #e0e7ff;
}

/* 9 Opinión — tipografía más editorial */
.nv-s9 .nv-single__title {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: clamp(1.6rem, 4vw, 2.25rem);
}
.nv-s9 .nv-single__content {
  font-size: 1.08rem;
  line-height: 1.75;
}

/* 10 Viral — acento magenta */
.nv-s10 { border-top: 3px solid #db2777; padding-top: 0.65rem; }
.nv-s10 .nv-single__title { font-weight: 900; }

/* 11 Judicial / formal */
.nv-s11 .nv-single__title {
  font-size: clamp(1.45rem, 3.5vw, 1.95rem);
  font-weight: 700;
}
.nv-s11 .nv-meta { background: var(--nv-news-soft, #f7f9fa); padding: 0.65rem 0.75rem; border-radius: 8px; border: none; }

/* 12 El Salvador — franjas azul/blanco/azul */
.nv-s12::before {
  content: "";
  display: block;
  height: 6px;
  margin: 0 0 1rem;
  background: linear-gradient(180deg, #0f4c81 0 33%, #fff 33% 66%, #0f4c81 66% 100%);
  border-radius: 2px;
  border: 1px solid #dbe3ea;
}

/* Skins 13–26: acentos suaves únicos sin clonar estructura */
.nv-s13 { border-left: 4px solid #7c3aed; padding-left: 0.85rem; }
.nv-s14 { border-left: 4px solid #0891b2; padding-left: 0.85rem; }
.nv-s15 { border-left: 4px solid #059669; padding-left: 0.85rem; }
.nv-s16 .nv-single__title { text-decoration: underline; text-decoration-color: #fbbf24; text-underline-offset: 6px; text-decoration-thickness: 3px; }
.nv-s17 { background: linear-gradient(180deg, #fff7ed 0, transparent 120px); padding-top: 0.5rem; }
.nv-s18 .nv-single__featured { box-shadow: 0 12px 32px rgba(15,20,25,.12); }
.nv-s19 .nv-meta { flex-direction: row-reverse; }
.nv-s20 .nv-single__title { color: #1d4ed8; }
.nv-s21 { border-bottom: 2px dotted var(--nv-news-line, #e5e7eb); padding-bottom: 0.5rem; margin-bottom: 0.5rem; }
.nv-s22 .nv-single__excerpt { font-weight: 600; color: var(--nv-news-accent, #5B4DFF); }
.nv-s23 .nv-single__content h2 { color: #0f766e; }
.nv-s24 { outline: 1px solid var(--nv-news-line, #e5e7eb); outline-offset: 12px; }
.nv-s25 .nv-badge-tipo { border-radius: 999px; }
.nv-s26 .nv-single__title { font-stretch: condensed; letter-spacing: -0.03em; }

html.nv-dark .nv-s17,
body.nv-dark .nv-s17 { background: linear-gradient(180deg, #1c1917 0, transparent 120px); }
html.nv-dark .nv-s20 .nv-single__title,
body.nv-dark .nv-s20 .nv-single__title { color: #93c5fd; }
html.nv-dark .nv-s24,
body.nv-dark .nv-s24 { outline-color: #334155; }

/* —— Dark mode pro —— */
html.nv-dark,
html.nv-dark body,
body.nv-dark {
  --nv-news-ink: #e7e9ea;
  --nv-news-muted: #8b98a5;
  --nv-news-line: #2f3336;
  --nv-news-surface: #15202b;
  --nv-news-soft: #1e2732;
  --nv-bg: #0f1419;
  --nv-bg-soft: #1e2732;
  --nv-text: #e7e9ea;
  --nv-text-muted: #8b98a5;
  color: var(--nv-text);
  background: var(--nv-bg);
}
html.nv-dark .nv-header,
body.nv-dark .nv-header,
html.nv-dark .nv-card,
body.nv-dark .nv-card,
html.nv-dark .nv-author-box,
body.nv-dark .nv-author-box {
  background: var(--nv-news-surface);
  border-color: var(--nv-news-line);
}
html.nv-dark .nv-section__title,
body.nv-dark .nv-section__title,
html.nv-dark .nv-single__title,
body.nv-dark .nv-single__title,
html.nv-dark .nv-card__title,
body.nv-dark .nv-card__title {
  color: var(--nv-news-ink);
}
html.nv-dark .nv-section__head,
body.nv-dark .nv-section__head {
  border-bottom-color: #e7e9ea;
}
html.nv-dark .nv-list-item,
body.nv-dark .nv-list-item {
  border-bottom-color: var(--nv-news-line);
}
html.nv-dark .nv-meta,
body.nv-dark .nv-meta {
  border-color: var(--nv-news-line);
}
html.nv-dark .nv-tags a,
body.nv-dark .nv-tags a,
html.nv-dark .nv-share a,
body.nv-dark .nv-share a {
  background: var(--nv-news-soft);
  border-color: var(--nv-news-line);
  color: var(--nv-news-ink);
}
html.nv-dark .nv-footer,
body.nv-dark .nv-footer {
  background: #0a0c10;
  color: var(--nv-news-muted);
}
html.nv-dark input,
html.nv-dark textarea,
html.nv-dark select,
body.nv-dark input,
body.nv-dark textarea,
body.nv-dark select {
  background: #1e2732;
  color: #e7e9ea;
  border-color: #2f3336;
}

/* Toggle dark visible */
.nv-dark-toggle {
  border: 1px solid var(--nv-news-line, #e5e7eb);
  background: var(--nv-news-soft, #f7f9fa);
  border-radius: 999px;
  width: 2.25rem;
  height: 2.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1;
}
html.nv-dark .nv-dark-toggle,
body.nv-dark .nv-dark-toggle {
  background: #1e2732;
  border-color: #2f3336;
  color: #fbbf24;
}


/* Logo claro / oscuro */
.nv-logo .nv-logo--dark { display: none; }
.nv-logo .nv-logo--light { display: inline-block; }
html.nv-dark .nv-logo .nv-logo--light,
body.nv-dark .nv-logo .nv-logo--light { display: none; }
html.nv-dark .nv-logo .nv-logo--dark,
body.nv-dark .nv-logo .nv-logo--dark { display: inline-block; }
/* Si solo hay light, se muestra también en dark */
html.nv-dark .nv-logo .nv-logo--light:only-child,
body.nv-dark .nv-logo .nv-logo--light:only-child { display: inline-block; }
