/*
Theme Name: TubeNova
Author: NANONARGEL
Description: Tema propio para las webs de vídeo. Lee el contenido de WP-Script/FamousTube tal como está (miniaturas, embed, duración, actores, anuncios del Personalizador, menús y widgets) sin necesitar WP-Script Core ni licencias. Rápido: una hoja de estilos, un script diferido y sin jQuery. Pensado para funcionar junto al plugin TubeNova.
Version: 1.1.2
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 7.4
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tubenova-theme
Tags: dark, grid-layout, custom-menu, widgets
*/

:root {
	--tnt-bg: #0f1116;
	--tnt-surface: #171a21;
	--tnt-surface-2: #1f232c;
	--tnt-border: #2a303c;
	--tnt-text: #e5e9f0;
	--tnt-muted: #9aa4b5;
	--tnt-accent: #f8b99e;
	--tnt-on-accent: #111;
	--tnt-radius: 10px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html {
	-webkit-text-size-adjust: 100%;
	/* Sin zoom por doble toque ni rebote lateral: en el móvil la página no se
	   «descuadra» al mover el dedo. El zoom con dos dedos sigue funcionando. */
	touch-action: manipulation;
	overscroll-behavior-x: none;
	/* Nada (un logo largo, un anuncio de 728 px...) puede ensanchar la página. */
	overflow-x: hidden;
}
@supports (overflow: clip) {
	html, body { overflow-x: clip; }
}
body {
	margin: 0;
	background: var(--tnt-bg);
	color: var(--tnt-text);
	font: 14px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
a { color: var(--tnt-accent); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; border: 0; }
iframe { max-width: 100%; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .5em; line-height: 1.25; color: #fff; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.tnt-icon { flex: none; vertical-align: -3px; }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible { outline: 2px solid var(--tnt-accent); outline-offset: 2px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.skip-link:focus {
	position: fixed !important;
	top: 8px; left: 8px;
	z-index: 100000;
	width: auto; height: auto;
	clip: auto;
	padding: 10px 16px;
	background: var(--tnt-accent);
	color: var(--tnt-on-accent);
	border-radius: 8px;
}

/* ---------- Rejilla (las clases de Bootstrap que usaba FamousTube) ---------- */
.container { width: 100%; max-width: 1600px; margin: 0 auto; padding: 0 15px; }
.row { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.row.no-gutters { margin: 0; }
.row > [class*="col-"] { position: relative; width: 100%; min-width: 0; }
.col-12 { flex: 0 0 100%; max-width: 100%; }
.col-6 { flex: 0 0 50%; max-width: 50%; }
.order-0 { order: 0; } .order-1 { order: 1; } .order-2 { order: 2; }
@media (min-width: 768px) {
	.col-md-3 { flex: 0 0 25%; max-width: 25%; }
	.col-md-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-md-6 { flex: 0 0 50%; max-width: 50%; }
	.col-md-9 { flex: 0 0 75%; max-width: 75%; }
	.col-md-12 { flex: 0 0 100%; max-width: 100%; }
	.order-md-0 { order: 0; } .order-md-2 { order: 2; }
}
@media (min-width: 992px) {
	.col-lg-3 { flex: 0 0 25%; max-width: 25%; }
	.col-lg-6 { flex: 0 0 50%; max-width: 50%; }
	.order-lg-0 { order: 0; } .order-lg-2 { order: 2; }
}
@media (min-width: 1200px) {
	.col-xl-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
	.col-xl-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.col-xl-3 { flex: 0 0 25%; max-width: 25%; }
	.col-xl-6 { flex: 0 0 50%; max-width: 50%; }
	.order-xl-0 { order: 0; } .order-xl-2 { order: 2; }
}

/* ---------- Cabecera ---------- */
#wrapper-navbar { position: relative; z-index: 100; background: var(--tnt-surface); border-bottom: 1px solid var(--tnt-border); }
.logo-search .container { position: relative; display: flex; align-items: center; gap: 14px; min-height: 64px; }
.logo-search .container > * { min-width: 0; }
.navbar-toggler, .header-search-mobile { flex: none; }
.navbar-brand, .logo-img { flex: 0 1 auto; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.navbar-brand { color: #fff; font-size: 24px; font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; white-space: nowrap; line-height: 1; }
.navbar-brand:hover { text-decoration: none; }
.logo-word-2 { color: var(--tnt-accent); }
.logo-img img { display: block; width: auto; max-height: 44px; }
.header-search { flex: 1; max-width: 560px; margin-left: auto; }
#searchform { display: flex; overflow: hidden; background: var(--tnt-bg); border: 1px solid var(--tnt-border); border-radius: 999px; }
#searchform:focus-within { border-color: var(--tnt-accent); }
#s { flex: 1; min-width: 0; height: 40px; padding: 0 16px; border: 0; background: transparent; outline: 0; font-size: 16px; }
#s::-webkit-search-cancel-button { display: none; }
#searchsubmit { display: grid; place-items: center; width: 48px; border: 0; background: var(--tnt-accent); color: var(--tnt-on-accent); }
.navbar-toggler, .header-search-mobile { display: none; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--tnt-text); }
.hamburger-box { position: relative; display: block; width: 22px; height: 16px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { position: absolute; left: 0; width: 22px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .2s; }
.hamburger-inner { top: 7px; }
.hamburger-inner::before, .hamburger-inner::after { content: ""; }
.hamburger-inner::before { top: -7px; }
.hamburger-inner::after { top: 7px; }
.navbar-toggler[aria-expanded="true"] .hamburger-inner { background: transparent; }
.navbar-toggler[aria-expanded="true"] .hamburger-inner::before { transform: translateY(7px) rotate(45deg); }
.navbar-toggler[aria-expanded="true"] .hamburger-inner::after { transform: translateY(-7px) rotate(-45deg); }

.navbar { background: var(--tnt-surface-2); }
.navbar ul { list-style: none; margin: 0; padding: 0; }
.navbar-nav { display: flex; flex-wrap: wrap; }
.navbar-nav li { position: relative; }
.navbar-nav a { display: block; padding: 12px 14px; color: var(--tnt-text); font-size: 13px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; }
.navbar-nav a:hover { color: #fff; text-decoration: none; background: rgba(255, 255, 255, .05); }
.navbar-nav .current-menu-item > a { color: var(--tnt-accent); }
.navbar-nav .sub-menu { display: none; position: absolute; left: 0; top: 100%; z-index: 200; min-width: 200px; padding: 6px; background: var(--tnt-surface); border: 1px solid var(--tnt-border); border-radius: 10px; box-shadow: 0 12px 30px rgba(0, 0, 0, .45); }
.navbar-nav li:hover > .sub-menu, .navbar-nav li:focus-within > .sub-menu { display: block; }
.navbar-nav .sub-menu a { text-transform: none; border-radius: 6px; }

@media (max-width: 767.98px) {
	.logo-search .container { min-height: 56px; gap: 6px; }
	.navbar-toggler, .header-search-mobile { display: inline-flex; }
	.navbar-toggler { margin-left: -8px; }
	.header-search-mobile { margin-left: auto; }
	.navbar-brand { font-size: 20px; }
	.logo-img img { max-height: 36px; }
	.header-search { display: none; position: absolute; left: 0; right: 0; top: 100%; max-width: none; padding: 10px 15px; background: var(--tnt-surface); border-bottom: 1px solid var(--tnt-border); }
	.header-search.is-open { display: block; }
	#navbarNavDropdown { display: none; }
	#navbarNavDropdown.show { display: block; }
	.navbar-nav { flex-direction: column; padding: 6px 0; }
	.navbar-nav a { padding: 12px 4px; font-size: 14px; }
	.navbar-nav .sub-menu { display: block; position: static; min-width: 0; padding: 0 0 0 14px; background: none; border: 0; box-shadow: none; }
}

/* ---------- Cabecera de listado y filtros ---------- */
.page-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 22px 0 14px; }
.widget-title { margin: 0; font-size: 18px; font-weight: 700; }
/* El título ocupa el sitio libre: no se parte en dos líneas junto al filtro. */
.page-header > .widget-title { flex: 1 1 auto; min-width: 0; }
#filters { position: relative; flex: none; }
.filters-select > summary { list-style: none; padding: 8px 14px; border: 1px solid var(--tnt-border); border-radius: 999px; background: var(--tnt-surface); font-size: 13px; font-weight: 600; cursor: pointer; user-select: none; }
.filters-select > summary::-webkit-details-marker { display: none; }
.filters-select > summary { display: inline-flex; align-items: center; gap: 6px; }
.filters-select > summary::after { content: "▾"; color: var(--tnt-muted); }
@media (max-width: 767.98px) {
	.filters-select > summary { padding: 8px 12px; }
	.tnt-filter-label { display: none; }
}
.filters-options { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 190px; padding: 6px; background: var(--tnt-surface); border: 1px solid var(--tnt-border); border-radius: 12px; box-shadow: 0 14px 30px rgba(0, 0, 0, .45); }
.filters-options span { display: block; }
.filters-options a { display: block; padding: 9px 12px; border-radius: 8px; color: var(--tnt-text); }
.filters-options a:hover { background: var(--tnt-surface-2); text-decoration: none; }
.filters-options a.active { color: var(--tnt-accent); }

/* ---------- Tarjetas de vídeo ---------- */
.video-loop .row, .related-videos .row { margin: 0 -6px; }
.video-block { position: relative; margin: 0 6px 20px; }
.video-block a.thumb { position: relative; display: block; height: 0; padding-bottom: 56.25%; overflow: hidden; border-radius: var(--tnt-radius); background: var(--tnt-surface); }
.video-block .video-img, .video-block .no-thumb { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.video-block .no-thumb { background: var(--tnt-surface-2); }
.video-block .video-preview { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.video-block .video-preview video { width: 100%; height: 100%; object-fit: cover; }
.video-block .duration { position: absolute; right: 6px; bottom: 6px; z-index: 2; padding: 1px 6px; border-radius: 5px; background: rgba(0, 0, 0, .8); color: #fff; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
.video-block .hd-video { position: absolute; left: 6px; top: 6px; z-index: 2; padding: 1px 6px; border-radius: 5px; background: var(--tnt-accent); color: var(--tnt-on-accent); font-size: 11px; font-weight: 800; }
.video-block a.infos { display: block; margin-top: 8px; color: var(--tnt-text); }
.video-block a.infos:hover { text-decoration: none; color: #fff; }
.video-block a.infos .title { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight: 600; line-height: 1.3; }
.video-block .video-datas { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; color: var(--tnt-muted); font-size: 12px; }
.video-block .rating .tnt-icon { width: 13px; height: 13px; vertical-align: -2px; }
@media (hover: hover) {
	.video-block .video-img { transition: transform .3s; }
	.video-block:hover .video-img { transform: scale(1.04); }
}
/* Móvil: dos vídeos por fila. */
@media (max-width: 767.98px) {
	.video-loop .row > .col-12.col-md-4,
	.related-videos .row > .col-12.col-md-4 { flex: 0 0 50%; max-width: 50%; }
	.video-loop .row, .related-videos .row { margin: 0 -4px; }
	.video-block { margin: 0 4px 14px; }
	.video-block a.infos .title { font-size: 13px; }
	.video-block .video-datas { font-size: 11px; }
}

/* ---------- Publicidad ---------- */
.tnt-ad-col:empty { display: none; }
.happy-section, .happy-under-player, .video-block-happy, .happy-player-beside, .tnv-ad, .widget, .entry-content { max-width: 100%; }
.happy-section :is(iframe, img, ins, video, embed, object), .happy-under-player :is(iframe, img, ins, video, embed, object),
.video-block-happy :is(iframe, img, ins, video, embed, object), .tnv-ad :is(iframe, img, ins, video, embed, object),
.entry-content :is(iframe, img, video, embed, object, table) { max-width: 100%; }
.video-block-happy { display: flex; align-items: center; justify-content: center; min-height: 250px; margin: 0 6px 20px; overflow: hidden; background: var(--tnt-surface); border-radius: var(--tnt-radius); }
.video-block-happy-absolute { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; max-width: 100%; }
.happy-section { padding: 20px 15px; overflow: hidden; text-align: center; }
.happy-under-player { margin: 12px 0 0; overflow: hidden; text-align: center; }
.happy-player-beside { display: grid; gap: 12px; justify-items: center; margin-bottom: 16px; }

/* ---------- Paginación ---------- */
.tnt-pagination { width: 100%; }
.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 24px 0; padding: 0; list-style: none; }
.page-link { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border: 1px solid var(--tnt-border); border-radius: 10px; background: var(--tnt-surface); color: var(--tnt-text); font-weight: 600; }
.page-link:hover { text-decoration: none; border-color: var(--tnt-accent); }
.page-item.active .page-link { border-color: transparent; background: var(--tnt-accent); color: var(--tnt-on-accent); }
.page-link.dots { border: 0; background: none; }

/* ---------- Texto SEO del pie ---------- */
.hero { margin-top: 24px; padding: 26px 0; background: var(--tnt-surface); border-top: 1px solid var(--tnt-border); }
.hero h1 { font-size: 20px; }
.hero p { margin: 0; color: var(--tnt-muted); }

/* ---------- Ficha del vídeo ---------- */
.single-video-player { padding: 16px 0 0; }
.video-wrapper { margin-bottom: 20px; }
.responsive-player { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: #000; border-radius: var(--tnt-radius); }
.responsive-player > iframe, .responsive-player > video, .responsive-player > object, .responsive-player > embed { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.happy-inside-player { position: absolute; inset: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px; padding: 12px 12px 56px; background: rgba(0, 0, 0, .78); }
.happy-inside-player .close-text { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); padding: 8px 16px; border: 0; border-radius: 999px; background: var(--tnt-accent); color: var(--tnt-on-accent); font-weight: 700; }
@media (max-width: 767.98px) { .happy-inside-player { display: none !important; } }
.video-title h1 { margin: 16px 0 12px; font-size: 21px; }
.video-actions-header { margin-bottom: 10px; padding: 8px; background: var(--tnt-surface); border-radius: var(--tnt-radius); }
.video-actions-header .row { align-items: center; row-gap: 8px; }
.post-like { display: flex; gap: 6px; }
.tnt-vote, .tab-link { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border: 1px solid var(--tnt-border); border-radius: 10px; background: var(--tnt-surface-2); color: var(--tnt-text); font-weight: 600; }
.tnt-vote:hover, .tab-link:hover { border-color: var(--tnt-accent); }
.tnt-vote.is-voted { border-color: var(--tnt-accent); color: var(--tnt-accent); }
.tnt-vote:disabled { cursor: default; opacity: .7; }
#video-tabs { display: flex; justify-content: flex-end; gap: 6px; }
.tab-link.active { border-color: transparent; background: var(--tnt-accent); color: var(--tnt-on-accent); }
.video-actions-content { padding: 14px; background: var(--tnt-surface); border-radius: var(--tnt-radius); }
#rating-col { padding-right: 18px; }
#video-views { font-size: 16px; font-weight: 700; }
.rating-bar { height: 4px; margin: 8px 0; overflow: hidden; border-radius: 2px; background: var(--tnt-border); }
.rating-bar-meter { height: 100%; background: var(--tnt-accent); }
.rating-result { display: flex; justify-content: space-between; gap: 8px; color: var(--tnt-muted); font-size: 12px; }
.rating-result .tnt-icon { width: 14px; height: 14px; }
.video-content-row { margin-bottom: 10px; color: var(--tnt-muted); }
.video-description { margin-bottom: 14px; color: var(--tnt-text); }
.video-description .desc { overflow-wrap: anywhere; }
.video-description .desc > :last-child { margin-bottom: 0; }
.video-description .desc h1, .video-description .desc h2, .video-description .desc h3, .video-description .desc h4, .video-description .desc h5 { margin: 0 0 10px; font-size: 15px; }
/* Botones de descarga del contenido (<h4><a>MEDIAFIRE</a></h4>...). */
.video-description .desc h1 a, .video-description .desc h2 a, .video-description .desc h3 a, .video-description .desc h4 a, .video-description .desc h5 a { display: block; padding: 13px 16px; border: 1px solid var(--tnt-border); border-radius: 12px; background: var(--tnt-surface-2); color: #fff; font-weight: 800; letter-spacing: .02em; text-align: center; text-transform: uppercase; }
.video-description .desc h1 a:hover, .video-description .desc h2 a:hover, .video-description .desc h3 a:hover, .video-description .desc h4 a:hover, .video-description .desc h5 a:hover { border-color: var(--tnt-accent); text-decoration: none; }
/* ---------- Botones de descarga (debajo del título) ----------
   Compactos para que se vean de un vistazo bajo el vídeo: la descarga a
   todo el ancho, canal y miembros lado a lado, VIP en dorado. Llevan
   «body.tnt» delante para ganar al CSS del plugin TubeNova, que carga después. */
.desc.tnt-dl-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.desc.tnt-dl-grid > * { grid-column: 1 / -1; min-width: 0; }
.desc.tnt-dl-grid > .tnt-dl--half { grid-column: auto; }
@media (min-width: 768px) {
	.desc.tnt-dl-grid { grid-template-columns: repeat(4, 1fr); }
	.desc.tnt-dl-grid > .tnt-dl--main { grid-column: span 2; }
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl { position: relative; margin: 0; }
/* Texto de ayuda encima de cada botón, con su icono animado. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl__hint {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 5px 2px;
	overflow: hidden;
	color: var(--tnt-muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0;
	text-overflow: ellipsis;
	text-transform: none;
	white-space: nowrap;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--download .tnt-dl__hint { color: var(--tnv-accent-text, var(--tnt-accent)); }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--vip .tnt-dl__hint { color: #f5c542; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--members .tnt-dl__hint { color: #9fe7ff; }
.tnt-dl__icon {
	display: inline-block;
	flex: none;
	font-size: 15px;
	line-height: 1;
	will-change: transform;
}
/* Corona: se balancea y brilla en dorado. */
.tnt-dl--vip .tnt-dl__icon {
	transform-origin: 50% 90%;
	animation: tnt-crown 1.8s ease-in-out infinite;
}
@keyframes tnt-crown {
	0%, 100% { transform: rotate(-10deg) translateY(0); filter: drop-shadow(0 0 0 rgba(245, 197, 66, 0)); }
	50% { transform: rotate(10deg) translateY(-2px); filter: drop-shadow(0 0 6px rgba(245, 197, 66, .9)); }
}
/* Diamante: gira sobre sí mismo con un destello azul. */
.tnt-dl--members .tnt-dl__hint { perspective: 120px; }
.tnt-dl--members .tnt-dl__icon { animation: tnt-diamond 2.6s linear infinite; }
@keyframes tnt-diamond {
	0% { transform: rotateY(0); filter: drop-shadow(0 0 2px rgba(120, 220, 255, .5)); }
	50% { transform: rotateY(180deg); filter: drop-shadow(0 0 8px rgba(120, 220, 255, 1)); }
	100% { transform: rotateY(360deg); filter: drop-shadow(0 0 2px rgba(120, 220, 255, .5)); }
}
/* Flecha de descarga: baja un poco, como invitando. */
.tnt-dl--download .tnt-dl__icon { animation: tnt-bob 1.4s ease-in-out infinite; }
@keyframes tnt-bob {
	0%, 100% { transform: translateY(-1px); }
	50% { transform: translateY(2px); }
}
/* Botones hechos con un párrafo de color (<p><a>VIDEO FULL</a></p>):
   mismo diseño de entrada que los de título que pinta el plugin. Los
   colores del editor van con !important, de ahí los !important aquí. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p > p {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-align: left !important;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p > p a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 52px;
	padding: 12px 60px 12px 16px;
	border: 1px solid var(--tnt-border);
	border-radius: 8px;
	background: rgba(255, 255, 255, .06) !important;
	color: #f1f5f9 !important;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: .02em;
	line-height: 1.2;
	text-decoration: none !important;
	text-transform: uppercase;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p > p a::after {
	content: "↗";
	position: absolute;
	right: 16px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
	opacity: .7;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p > p a::before {
	content: "";
	position: absolute;
	top: -1px;
	bottom: -1px;
	right: 37px;
	width: 13px;
	pointer-events: none;
	background: radial-gradient(circle at 50% 0, var(--tnv-surface, var(--tnt-surface)) 5px, transparent 5.5px), radial-gradient(circle at 50% 100%, var(--tnv-surface, var(--tnt-surface)) 5px, transparent 5.5px), linear-gradient(rgba(255, 255, 255, .22) 50%, transparent 0) 50% 0 / 1px 6px repeat-y;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p.tnt-dl--download > p a {
	border-color: var(--tnv-accent, var(--tnt-accent));
	background: var(--tnv-accent, var(--tnt-accent)) !important;
	color: var(--tnv-on-accent, var(--tnt-on-accent)) !important;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p.tnt-dl--download > p a::before {
	background: radial-gradient(circle at 50% 0, var(--tnv-surface, var(--tnt-surface)) 5px, transparent 5.5px), radial-gradient(circle at 50% 100%, var(--tnv-surface, var(--tnt-surface)) 5px, transparent 5.5px), linear-gradient(rgba(0, 0, 0, .25) 50%, transparent 0) 50% 0 / 1px 6px repeat-y;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p.tnt-dl--channel > p a,
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p.tnt-dl--members > p a {
	border-color: rgba(34, 158, 217, .45);
	background: rgba(34, 158, 217, .14) !important;
	color: #bfe6fa !important;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p.tnt-dl--vip > p a {
	border-color: #f5c542;
	background: linear-gradient(110deg, #e9b434 0%, #e9b434 40%, #fff1b8 50%, #e9b434 60%, #e9b434 100%) !important;
	background-size: 250% 100% !important;
	color: #1d1400 !important;
	animation: tnt-shine 3s linear infinite;
}
/* Descarga principal: más grande y con un pulso que llama a tocarla. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main a,
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main > p a {
	min-height: 58px;
	font-size: 18px;
	animation: tnt-pulse 1.8s ease-out infinite;
}
/* Resplandor suave (no un anillo duro, que en el móvil parecía una caja gris). */
@keyframes tnt-pulse {
	0% { box-shadow: 0 0 0 0 rgba(248, 185, 158, .5); }
	60% { box-shadow: 0 0 16px 6px rgba(248, 185, 158, 0); }
	100% { box-shadow: 0 0 0 0 rgba(248, 185, 158, 0); }
}
/* Con el color de cada web donde el navegador sabe mezclar colores. */
@supports (color: color-mix(in srgb, red 50%, transparent)) {
	@keyframes tnt-pulse {
		0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--tnv-accent, var(--tnt-accent)) 55%, transparent); }
		60% { box-shadow: 0 0 16px 6px color-mix(in srgb, var(--tnv-accent, var(--tnt-accent)) 0%, transparent); }
		100% { box-shadow: 0 0 0 0 transparent; }
	}
}
/* La mano «toca» el botón. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main::after {
	content: "👆";
	position: absolute;
	right: 64px;
	bottom: -6px;
	z-index: 3;
	font-size: 30px;
	line-height: 1;
	pointer-events: none;
	filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .6));
	animation: tnt-tap 1.2s ease-in-out infinite;
}
@keyframes tnt-tap {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-9px); }
}
/* Canal y miembros: media anchura. */
/* Los dos con el mismo alto aunque uno ocupe dos líneas. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half { display: flex; flex-direction: column; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a {
	flex: 1;
	min-height: 50px;
	padding: 8px 34px 8px 12px;
	font-size: 13px;
	line-height: 1.15;
	letter-spacing: 0;
	text-align: left;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a::before { right: 24px; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a::after { right: 8px; font-size: 14px; }
/* VIP: dorado con un brillo que pasa. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--vip a {
	border-color: #f5c542;
	background: linear-gradient(110deg, #e9b434 0%, #e9b434 40%, #fff1b8 50%, #e9b434 60%, #e9b434 100%);
	background-size: 250% 100%;
	color: #1d1400 !important;
	animation: tnt-shine 3s linear infinite;
}
/* Con h4 en el selector: el plugin pinta de azul los enlaces de Telegram al pasar el dedo. */
body.tnt .video-description .desc.tnt-dl-grid h4.tnt-dl--vip a:hover,
body.tnt .video-description .desc.tnt-dl-grid h4.tnt-dl--vip a:focus-visible {
	border-color: #f5c542;
	background: linear-gradient(110deg, #e9b434 0%, #e9b434 40%, #fff1b8 50%, #e9b434 60%, #e9b434 100%);
	background-size: 250% 100%;
	color: #1d1400 !important;
	filter: brightness(1.06);
}
@keyframes tnt-shine {
	0% { background-position: 100% 0; }
	100% { background-position: -150% 0; }
}
/* ---------- Bloque de descargas compacto ----------
   La ayuda va dentro de cada botón (una línea pequeña arriba) en vez de
   ocupar su propia línea: el bloque pasa de ~330 a ~210 px en el móvil.
   Las animaciones (mano, resplandor, diamante, corona, brillo) se mantienen. */
body.tnt.tubenova .video-description { margin: 4px 0 12px; padding: 10px 10px 11px; }
body.tnt .video-description .tnv-dl-title { margin: 0 0 7px 2px; font-size: 10px; letter-spacing: .16em; }
body.tnt .video-description .desc.tnt-dl-grid { gap: 7px; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl__hint {
	position: absolute;
	top: 7px;
	left: 13px;
	right: 46px;
	z-index: 2;
	gap: 4px;
	margin: 0;
	font-size: 10px;
	line-height: 1.1;
	letter-spacing: .02em;
	pointer-events: none;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl__icon { font-size: 11px; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--download .tnt-dl__hint { color: var(--tnv-on-accent, var(--tnt-on-accent)); opacity: .72; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--vip .tnt-dl__hint { color: #4a3400; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--channel .tnt-dl__hint,
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--members .tnt-dl__hint { color: #9fe7ff; opacity: .85; }
/* Botones más bajos, con sitio arriba para la ayuda. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl a,
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--p > p a {
	min-height: 46px;
	padding-top: 20px;
	padding-bottom: 7px;
	font-size: 14px;
	line-height: 1.1;
}
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main a,
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main > p a { min-height: 52px; font-size: 17px; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a {
	min-height: 46px;
	padding: 20px 24px 7px 12px;
	font-size: 12px;
}
/* En los de media anchura no cabe el talón: solo la flecha. */
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a::before { display: none; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--half a::after { right: 9px; font-size: 13px; }
body.tnt .video-description .desc.tnt-dl-grid .tnt-dl--main::after { right: 56px; bottom: -9px; font-size: 26px; }

.tnt-share { display: flex; flex-wrap: wrap; gap: 8px; }
.tnt-share__btn { padding: 8px 14px; border: 1px solid var(--tnt-border); border-radius: 999px; background: var(--tnt-surface-2); color: var(--tnt-text); font-size: 13px; font-weight: 600; }
.tnt-share__btn:hover { border-color: var(--tnt-accent); text-decoration: none; }
.video-sidebar { padding-left: 15px; }
.related-videos { margin-top: 12px; }
.video-wrapper > .widget-title { margin-top: 8px; }
@media (max-width: 767.98px) {
	.single-video-player { padding-top: 0; }
	.single-video-player > .container { padding: 0 10px; }
	.responsive-player { margin-top: 10px; }
	.video-title h1 { font-size: 18px; }
	#rating-col { padding: 0 0 12px; }
	#video-tabs { justify-content: flex-start; }
	.video-sidebar { padding-left: 0; }
}

/* ---------- Widgets ---------- */
.widget { margin: 20px 0; }
.widget > .widget-title { margin-bottom: 12px; }
.widget-videos-block { position: relative; }
.more-videos { position: absolute; right: 0; top: 2px; font-size: 13px; font-weight: 600; }
.video-sidebar .widget ul { padding-left: 18px; }

/* ---------- Páginas, etiquetas, vacío ---------- */
.tnt-page { max-width: 900px; margin: 26px auto; }
.entry-content { line-height: 1.7; overflow-wrap: anywhere; }
.entry-content p { margin: 0 0 1em; }
.entry-content ul, .entry-content ol { padding-left: 22px; }
.tnt-letters { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.tnt-letters a { display: grid; place-items: center; min-width: 34px; height: 34px; border-radius: 8px; background: var(--tnt-surface); color: var(--tnt-text); font-weight: 700; }
.tags-letter-block { display: flex; gap: 14px; padding: 12px 0; border-top: 1px solid var(--tnt-border); }
.tag-letter { flex: none; width: 40px; color: var(--tnt-accent); font-size: 22px; font-weight: 800; }
.tag-items { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.tag-item a { color: var(--tnt-text); }
.tnt-empty { max-width: 560px; margin: 10px auto 28px; text-align: center; color: var(--tnt-muted); }
.tnt-search-inline { display: flex; gap: 8px; }
.tnt-search-inline input { flex: 1; min-width: 0; }
.related-videos + .related-videos { margin-top: 0; }

/* ---------- Formularios y comentarios ---------- */
input[type="text"], input[type="email"], input[type="url"], input[type="search"], input[type="password"], textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--tnt-border);
	border-radius: 8px;
	background: var(--tnt-bg);
	color: var(--tnt-text);
	font-size: 16px;
}
input[type="submit"], .tnt-search-inline button { padding: 10px 18px; border: 0; border-radius: 8px; background: var(--tnt-accent); color: var(--tnt-on-accent); font-weight: 700; }
.comment-list { margin: 0 0 20px; padding: 0; list-style: none; }
.comment-list .children { list-style: none; padding-left: 24px; }
.comment-body { margin-bottom: 14px; padding: 12px; background: var(--tnt-surface); border-radius: var(--tnt-radius); }
.comment-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--tnt-muted); font-size: 12px; }
.comment-meta img { border-radius: 50%; }
.comment-form p { margin: 0 0 12px; }

/* ---------- Pie ---------- */
#wrapper-footer { margin-top: 30px; padding: 26px 0; background: var(--tnt-surface); border-top: 1px solid var(--tnt-border); color: var(--tnt-muted); font-size: 13px; text-align: center; }
.footer-menu-container ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin: 0 0 12px; padding: 0; list-style: none; }
.footer-menu-container a { color: var(--tnt-muted); }
.footer-menu-container a:hover { color: #fff; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
}