… y también con /
/ hijos directos */
ul.listaEnlaces > li,
ul.listaEnlaces > div,
ul.listaEnlaces > p,
ul.listaEnlaces > a{
display: flex !important; /* para alinear el icono y el texto */
align-items: center;
gap: 12px;
padding: 14px 16px;
background: var(--bm-card);
border: 1px solid rgba(0,0,0,.06);
border-radius: 16px;
box-shadow: 0 6px 18px rgba(0,0,0,.08);
transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
text-decoration: none;
color: var(--bm-text);
}
ul.listaEnlaces > li span.params {
display: block;
margin: auto;
text-align: center;
background-color: #eeeeee;
padding: 0.2em 0.4em;
width: 100%;
}
/* Hover/focus */
ul.listaEnlaces > li:hover,
ul.listaEnlaces > div:hover,
ul.listaEnlaces > p:hover,
ul.listaEnlaces > a:hover{
transform: translateY(-2px);
box-shadow: 0 12px 26px rgba(0,0,0,.12);
border-color: var(--bm-accent);
}
ul.listaEnlaces > li:focus-within,
ul.listaEnlaces > div:focus-within,
ul.listaEnlaces > p:focus-within,
ul.listaEnlaces > a:focus-visible{
outline: 2px solid var(--bm-accent);
outline-offset: 3px;
border-radius: 16px;
}
/* Iconos */
ul.listaEnlaces img{
width: 36px;
height: 36px;
flex: 0 0 36px;
border-radius: 8px;
object-fit: contain;
filter: drop-shadow(0 1px 1px rgba(0,0,0,.15));
transition: transform .2s ease;
}
ul.listaEnlaces > li:hover img,
ul.listaEnlaces > div:hover img,
ul.listaEnlaces > p:hover img,
ul.listaEnlaces > a:hover img{
transform: scale(1.05);
}
/* Bloque de texto a la derecha del icono */
ul.listaEnlaces > li > div,
ul.listaEnlaces > div > div,
ul.listaEnlaces > p > div,
ul.listaEnlaces > a > div{
display: flex;
flex-direction: column;
gap: 4px;
}
/* Título/enlace */
ul.listaEnlaces strong a{
color: var(--bm-text);
font-weight: bold;
text-decoration: none;
}
ul.listaEnlaces strong a:hover{
text-decoration: underline;
}
/* Descripción */
ul.listaEnlaces span,
ul.listaEnlaces small{
color: var(--bm-muted);
font-size: 0.9em;
line-height: 1.3;
}
/* Dark mode automático */
@media (prefers-color-scheme: dark){
:root{
--bm-card: #0f172a;
--bm-text: #e5e7eb;
--bm-muted:#94a3b8;
}
ul.listaEnlaces > li,
ul.listaEnlaces > div,
ul.listaEnlaces > p,
ul.listaEnlaces > a{
border-color: rgba(255,255,255,.08);
box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
}
/* Respeta a quien prefiere menos animaciones */
@media (prefers-reduced-motion: reduce){
ul.listaEnlaces > li,
ul.listaEnlaces > div,
ul.listaEnlaces > p,
ul.listaEnlaces > a,
ul.listaEnlaces img{
transition: none;
}
}
// --------------------------
.breadcrumbs {
margin-bottom: 0.4em;
}
.pagination {
width: 100%;
margin: auto;
text-align: center;
}
article {
text-align: justify;
}
/* nuevo 22/11/2025 */
.sp-pcp-post-thumb-area {
text-align: center;
}
/* ---------------- */
article h2 {
font-size: 26px;
}
.post-tags {
text-align: left;
margin-bottom: 0.6em;
}
a.post-edit-link {
text-decoration: none;
color: #00002B !important; /* juan: 22/04/2025 */
}
.centrado {
margin: auto;
text-align: center;
}
/* Audio Player */
.audio-player {
margin: auto;
text-align: center;
margin: 0.4em;
margin-bottom: 1.2em;
}
audio {
width: 80%;
height: 40px;
}
audio::-webkit-media-controls-play-button, audio::-webkit-media-controls-panel {
background-color: #fcd9d9;
color: #ffffff;
}
/* cabecera y pie */
.identidad {
color: #FFFFFF;
font-size: 20px;
margin: auto;
text-align: center;
padding-top: 0.2em;
}
.identidad img {
vertical-align: middle;
}
.enlaces {
color: #FFFFFF;
font-size: 14px;
margin: auto;
text-align: center;
margin-bottom: 1.2em;
}
footer a, .enlaces a, .identidad a {
color: #ffffff !important;
text-decoration: none;
}
@media only screen and (min-width: 691px) {
#cabeceraPC {
height: 207px;
}
#cabeceraPC img {
height: 100%;
width: 100%;
}
#cabeceraMovil {
display: none;
}
#iconos {
color: #FFFFFF;
margin: 0 auto;
text-align: center;
width: 40%;
}
#iconos .principal_2_columnas, #iconos .principal_3_columnas {
display: grid;
grid-gap: 20px;
margin: 0 auto;
text-align: center;
}
#iconos .principal_2_columnas {
grid-template-columns: 1fr 1fr;
width: 66%;
}
#iconos .principal_3_columnas {
grid-template-columns: 1fr 1fr 1fr;
}
#iconos div {
margin-bottom: 0.5em;
}
#iconos p {
margin: auto;
text-align: center;
width: 100%;
}
}
@media only screen and (max-width: 691px) {
#cabeceraMovil {
font-size: 12px;
color: #FFFFFF;
font-weight: bold;
}
#cabeceraMovil a {
text-decoration: none;
}
#cabeceraPC {
display: none;
}
#iconos {
}
#iconos .principal_2_columnas, #iconos .principal_3_columnas {
display: block;
width: 100%;
}
#iconos .tienda, #iconos .youtube {
margin-top: 1.4em;
}
}
/* Tienda online */
.iframe-container {
margin: 0 auto;
text-align: center;
width: 100%;
margin-top: 0.6em;
}
.iframe-container iframe {
margin-left: 0.2em;
margin-right: 0.2m;
}
.seccion-tienda-online {
text-align: center;
}
h2.seccion-tienda-online {
text-transform: uppercase;
}
/* Slider */
.wa_chpcs_image_carousel {
text-align: center;
padding: 0px;
margin: 0px;
}
.wa_chpcs_image_carousel img {
margin-bottom: 0.4em;
}
.caroufredsel_wrapper {
margin: 0px !important;
padding: 0px !important;
}
@media only screen and (max-width: 691px) {
.caroufredsel_wrapper ul {
height: 210px !important;
}
.caroufredsel_wrapper li {
height: 200px !important;
}
}
/* Diccionario Bursátil */
.diccionario h2.letra {
text-decoration: none;
color: #FFFFFF;
background-color: #006A84;
padding: 0.4em;
padding-top: 0.2em;
padding-bottom: 0.2em;
}
.buscador {
color: #FFFFFF;
background-color: #00002B;
border: 4px solid #006A84;
padding: 0.8em;
padding-top: 1.2em;
padding-bottom: 1.2em;
margin-top: 2em;
font-weight: bold;
}
.buscador .checkTermino {
margin-top: 1em;
}
.buscador input {
color: #000000;
}
.diccionario p#noResultados {
display: none;
}
.textTermino {
text-align: left;
}
/* Otros */
.afiliados {
margin: auto;
padding: 1em;
text-align: center;
}
a.streaming img {
width: 150px;
height: 150px;
padding: 0.5em;
}
p.streaming {
font-size: 120%;
}
.thumbnail {
text-align: center;
margin: auto;
padding: 0.5em;
}
.thumbnail img, img.inPost {
max-width: 880px;
}
img.inTitle {
max-width: 23px;
}
img.size-large {
width: 880px !important;
}
@media only screen and (max-width: 691px) {
.afiliados {
display: none;
}
#site-navigation {
width: 20%;
}
a.streaming img {
width: 100px;
height: 100px;
}
.thumbnail img, img.inPost {
max-width: 100%;
}
img.inTitle {
margin-left: 2px;
margin-right: 2px;
}
img.size-large {
width: 100% !important;
}
}
.warning {
color: #006A84;
background: #f2f9fb;
padding: 1em;
}
.warning img {
width: 25px;
height: 25px;
vertical-align: middle;
}
/* --- Temporadas --- */
/* Contenedor principal centrado */
.series-container {
display: flex;
justify-content: center;
align-items: center;
background: #f3f3f3;
padding: 15px !important;
}
/* Estilo general de la lista */
.series-list {
font-family: Arial, sans-serif;
width: 60%;
max-width: 600px;
padding: 15px !important;
background: #f9f9f9;
border-radius: 10px;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
text-align: left;
margin-left: 0px !important;
margin-bottom: 0px !important;
}
/* Estilo para cada temporada */
.series-list > li, .season-title {
list-style: none;
font-size: 22px;
font-weight: bold;
margin: 10px 0;
padding: 5px 10px;
background: #006A84;
color: white;
border-radius: 5px;
transition: 0.3s;
text-align: center;
}
/* Ajuste cuando hay un enlace */
.series-list > li > a {
display: block;
width: 100%;
background: transparent;
color: white;
border-radius: 5px;
text-decoration: none;
transition: 0.3s;
box-sizing: border-box;
}
/* Hover solo si hay enlace */
.series-list > li:has(> a):hover {
background: #005570;
}
/* Estilo para la lista de capítulos */
.series-list ul {
list-style: none;
padding-left: 20px;
margin-top: 5px;
display: none;
}
/* Estilo para cada capítulo */
.series-list ul li {
background: #fff;
color: #333;
padding: 8px;
margin: 5px 0;
border-radius: 5px;
box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.1);
}
/* Mostrar capítulos cuando la temporada esté activa */
.series-list > li.active + ul {
display: block;
}
@media only screen and (max-width: 691px) {
.series-list {
width: 100%;
}
}
/* --- Reparto --- */
.table-container {
width: 100%;
overflow-x: auto;
}
.table-list {
width: 100%;
border-collapse: collapse;
font-family: Arial, sans-serif;
background-color: #f8f9fa;
border-radius: 10px;
overflow: hidden;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
margin-top: 0.6em;
margin-bottom: 0.6em;
}
.table-list th,
.table-list td {
padding: 12px 15px;
text-align: left;
}
.table-list th {
/*background-color: #006A84;*/
background-color: #7A8594;
color: white;
font-weight: bold;
}
.table-list tbody tr:nth-child(even) {
background-color: #eef2f7;
}
.table-list tbody tr:hover {
background-color: #d6e4ff;
transition: background-color 0.3s ease;
}
.table-list td {
border-bottom: 1px solid #ddd;
}
.table-list td:first-child {
/*font-weight: bold;*/
color: #333;
}
.table-list tr td:first-child {
white-space: nowrap;
}
.masInfoLink {
padding-bottom: 1em;
margin-block-start: 4px;
}
.centradoSoloPC {
text-align: center;
}
@media only screen and (max-width: 691px) {
.centradoSoloPC {
text-align: justify;
}
}
.table-list a, a.cine-enlace {
color: #5f8fae;
}
.table-list a, a.cine-enlace, .cine-nombre {
font-weight: 600;
text-decoration: none;
position: relative;
display: inline;
transition: color 0.3s ease;
line-height: 1.2;
white-space: nowrap; /* los nombres no se parten */
}
.table-list a::after, a.cine-enlace::after {
content: "";
position: absolute;
width: 100%;
height: 2px;
background-color: #7da9c2;
left: 0;
bottom: -2px;
transform: scaleX(0);
transform-origin: right;
transition: transform 0.3s ease;
}
.table-list a:hover, a.cine-enlace:hover {
color: #3b6d8d;
}
.table-list a:hover::after, a.cine-enlace:hover::after {
transform: scaleX(1);
transform-origin: left;
}
.cine-enlace.multi-line {
display: inline-flex; /* mantiene el emoji y el texto unidos */
align-items: center; /* centra verticalmente */
gap: 0.25em; /* espacio controlado entre emoji y texto */
white-space: nowrap; /* evita saltos de línea dentro del conjunto */
}
.cine-enlace.multi-line a.cine-enlace {
white-space: nowrap; /* evita que se parta el texto del enlace */
display: inline; /* mantiene el comportamiento natural del enlace */
}
/* Mantiene la coma pegada al nombre anterior */
.ocultoMovil, .ocultoMovilSinEspacio {
white-space: nowrap;
}
/* Permite salto después de la coma */
.ocultoMovil::after {
content: " ";
white-space: normal;
}
@media only screen and (max-width: 691px) {
.table-list a, .cine-nombre, a.cine-enlace {
white-space: normal;
}
.table-list thead {
display: none; /* ocultamos encabezado */
}
.table-list,
.table-list tbody,
.table-list tr,
.table-list th,
.table-list td {
display: block;
width: 100%;
text-align: center;
}
.table-list tr {
margin-bottom: 1em;
background: #fff;
padding: 10px;
}
.table-list th {
margin-top: 0.4em;
margin-bottom: 0.4em;
}
.table-list td {
padding: 8px 10px;
border: none;
text-align: center;
}
.table-list td:first-child {
font-weight: bold;
background: #f1f1f1;
}
}
/* nuevo 26/04/2025 + 03/04/2026 */
.category-buttons {
display: flex;
justify-content: center;
align-items: center;
gap: 12px;
margin: 40px 0;
}
.category-button {
padding: 8px 24px;
background-color: #ffffff;
color: #006a84;
font-size: 0.95rem;
font-weight: 600;
text-decoration: none;
text-transform: uppercase;
border: 2px solid #006a84;
border-radius: 30px;
transition: all 0.3s ease;
text-align: center;
}
a.category-button {
display: inline-flex;
align-items: center;
justify-content: center;
}
div.category-button {
display: inline-block;
margin: 20px auto;
position: relative;
left: 50%;
transform: translateX(-50%);
}
.category-button:only-child {
display: inline-flex;
margin: 40px auto;
}
.category-button,
.category-button:visited {
color: #006a84;
text-decoration: none;
}
.category-button:hover,
.category-button:hover a {
background-color: #006a84;
color: #ffffff;
text-decoration: none;
}
.category-button a {
color: #006a84;
text-decoration: none;
display: inline-block;
width: 100%;
height: 100%;
}
.category-button a:hover {
color: #ffffff;
}
@media only screen and (max-width: 691px) {
div.category-button, a.category-button {
font-size: 0.85rem;
}
}
.separator-dashed-soft {
border: none;
border-top: 1px dashed rgba(0, 106, 132, 0.2); /* Color azul con baja opacidad */
width: 90%;
margin: 10px auto;
height: 0;
background: none;
}
.sp-slider-wrapper {
min-height: auto !important;
height: auto !important;
display: inline-block !important;
}
.sp-slick-slider {
min-height: auto !important;
height: auto !important;
}
/* nuevo 15/06/2025 */
.pt-cv-wrapper {
text-align: center !important;
}
/* nuevo 10/12/2025 */
.pt-cv-page {
display: flex;
flex-wrap: wrap;
justify-content: center; /* centra los items si no llenan la fila */
}
/* catálogo (12/08/2025) */
.publicaciones-alfabeticas {
display: flex;
flex-wrap: wrap;
gap: 2rem;
margin-top: 1rem;
}
.publicaciones-alfabeticas > div {
flex: 1 1 300px;
}
.publicaciones-alfabeticas h2 {
background-color: #f0f0f0;
padding: 0.3rem 0.8rem;
border-radius: 4px;
margin-bottom: 0.5rem;
font-weight: 700;
font-size: 1.3rem;
color: #333;
}
.publicaciones-alfabeticas ul {
list-style: disc inside;
margin: 0 0 1.5rem 0;
padding: 0;
}
.publicaciones-alfabeticas li {
margin-bottom: 0.25rem;
}
.publicaciones-alfabeticas a {
text-decoration: none;
color: #0073aa;
transition: color 0.3s;
}
.publicaciones-alfabeticas a:hover {
color: #2c2c2c;
text-decoration: underline;
}
.letras-navegacion {
text-align: center;
margin: 1em 0;
font-weight: 600;
font-family: Arial, sans-serif;
}
.letras-navegacion a {
color: #3D4757; /* azul más profundo para mejor contraste */
text-decoration: none;
margin: 0 0.4em;
transition: color 0.25s ease;
}
.letras-navegacion a:hover,
.letras-navegacion a:focus {
text-decoration: underline;
color: #003350; /* azul aún más oscuro al hover/focus */
}
.volver-indice-container {
text-align: center;
margin: 0px;
}
.volver-indice {
display: inline-block;
background-color: #e0e0e0; /* gris claro más contraste con azul */
color: #3D4757;
padding: 0.5em 1.4em;
margin-top: 0.2em;
margin-bottom: 1em;
font-weight: 500;
font-size: 1rem;
border-radius: 12px;
border: 1.5px solid #aaa;
text-decoration: none;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
cursor: pointer;
}
.volver-indice:visited {
color: #3D4757;
}
.volver-indice:hover,
.volver-indice:focus {
background-color: #d6d6d6;
border-color: #888;
color: #262F3A; /* azul más oscuro al hover/focus */
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
outline: none;
text-decoration: none !important;
}
/* Responsive */
@media (max-width: 600px) {
.publicaciones-alfabeticas {
flex-direction: column;
}
}
/* Valoraciones (15/08/2025) */
/* Sección dedicada */
.kk-rating-section {
text-align: center;
margin: 2.5em auto;
max-width: 520px;
background: #fff;
padding: 2em 1.5em;
padding-top: 0.1em;
border-radius: 14px;
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
/* Título */
.kk-rating-section h2 {
font-size: 22px;
margin-bottom: 0.3em;
font-weight: 700;
color: #222;
}
/* Texto descriptivo */
.kk-rating-section p {
font-size: 15px;
color: #555;
margin-bottom: 1.4em;
}
/* Bloque interno de estrellas */
.kk-rating-wrapper .kk-star-ratings {
display: flex;
flex-direction: column;
align-items: center;
background-color: #f7f7f7;
padding: 16px 24px;
border-radius: 12px;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
width: fit-content;
margin: 0 auto;
}
/* Estrellas */
.kk-star-ratings .kr-stars {
display: flex;
justify-content: center;
gap: 5px;
margin-bottom: 8px;
}
.kk-star-ratings .kr-star {
width: 28px;
height: 28px;
}
/* Leyenda */
.kk-star-ratings .kr-rating-text {
font-size: 15px;
color: #333;
font-weight: 600;
}
/* Móvil */
@media (max-width: 600px) {
.kk-rating-section {
padding: 1.5em 1em;
}
.kk-star-ratings .kr-star {
width: 24px;
height: 24px;
}
}
.kk-star-breakdown {
/*max-width: 300px;*/
margin: 0.5em auto 0;
font-family: Arial, sans-serif;
}
.kk-star-row {
display: flex;
align-items: center;
margin-bottom: 8px;
}
.kk-star-label {
width: 70px;
text-align: right;
margin-right: 8px;
font-weight: 600;
color: #333;
}
.kk-star-bar-wrapper {
flex: 1;
background-color: #e0e0e0;
border-radius: 8px;
height: 18px;
margin-right: 8px;
overflow: hidden;
}
.kk-star-bar {
height: 100%;
background-color: #f1cb31;
border-radius: 8px 0 0 8px;
transition: width 0.5s ease;
}
.kk-star-count {
width: 24px;
text-align: right;
font-size: 13px;
color: #555;
height: 18px;
}
.stars {
/*display: inline-block;*/
font-size: 1.2em;
vertical-align: middle;
}
.stars .star {
color: #ccc;
position: relative;
display: inline-block;
width: 1em;
overflow: hidden;
vertical-align: middle;
}
.stars .star.full {
color: #f5b301;
}
.stars .star.half {
color: #ccc;
}
.stars .star.half::before {
content: '★';
color: #f5b301;
position: absolute;
left: 0;
width: 50%;
overflow: hidden;
}
.star-value {
display: inline-block;
margin-left: 6px;
padding: 0 6px;
background-color: #006A84;
color: #fff;
/*border-radius: 12px;*/
font-size: 1rem;
font-weight: bold;
line-height: 1.2; /* ajustamos para centrar verticalmente */
height: 1.2em; /* mismo valor que line-height */
text-align: center; /* centra el número dentro */
}
/* ficha */
.ficha {
margin: auto;
text-align: center;
padding: 1em;
padding-top: 0em;
}
.ficha .row {
display: flex;
text-align: center;
justify-content: center;
align-items: center;
}
.ficha .column {
padding: 0.5rem;
}
.ficha .miniatura img {
width: 310px;
height: 420px;
/*object-fit: cover;*/
border-radius: 10px;
box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
}
/* datos */
.ficha .datos {
text-align: left;
max-width: 50%;
}
/* Contenedor de tabla */
.ficha .datos .table-container {
width: 100%;
margin-top: 0.6em;
overflow-x: visible;
}
/* Tabla general */
.ficha .datos .table-list {
width: 100%;
border-collapse: collapse;
font-family: Arial, sans-serif;
background-color: #f8f9fa;
border-radius: 10px;
overflow: hidden;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}
/* Celdas */
.ficha .datos .table-list td {
padding: 10px 12px;
text-align: left;
border-bottom: 1px solid #ddd;
vertical-align: middle;
box-sizing: border-box;
}
/* Primera columna (etiqueta) */
.ficha .datos .table-list td:first-child {
font-weight: bold;
color: #333;
width: 35%;
}
/* Segunda columna (valor) */
.ficha .datos .table-list td:last-child {
color: #222;
}
/* Iconos o banderas dentro de celdas */
.ficha .datos .table-list td img {
width: 20px;
height: 14px;
vertical-align: middle;
}
/* Imágenes de premios */
.ficha .datos .table-list td img.premio {
width: 30px;
height: 30px;
margin: 0.4em 0.2em;
vertical-align: middle;
position: relative;
top: -2px;
}
/* Enlaces de premios con contador */
.ficha .datos a.premio-link {
position: relative;
display: inline-block;
margin-left: 3px;
margin-right: 3px;
}
.ficha .datos a.premio-link .contador {
position: absolute;
top: -5px;
right: -5px;
background: rgba(0, 106, 132, 0.5);
color: white;
font-size: 10px;
font-weight: bold;
padding: 1px 3px;
border-radius: 999px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
line-height: 1;
}
/* Imágenes grandes */
.ficha img.defaultThumbnail {
max-width: 880px;
}
/* Responsive para móvil */
@media only screen and (max-width: 691px) {
.ficha .row {
display: block;
}
.ficha .datos {
max-width: 100%;
text-align: center;
}
.ficha .miniatura img {
width: 100%;
height: auto;
}
.ficha .datos .table-list {
box-shadow: none;
background: transparent;
}
.ficha .datos .table-list, .ficha .datos .table-list tbody, .ficha .datos .table-list tr, .ficha .datos .table-list td {
display: block;
width: 100%;
}
/* Cada mini tarjeta */
.ficha .datos .table-list tr {
margin-bottom: 1.2em;
background: transparent;
border-radius: 10px;
box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
padding: 0;
}
/* centramos todo el texto */
.ficha .datos .table-list td {
padding: 10px;
border: none;
text-align: center;
display: block;
}
/* Títulos */
.ficha .datos .table-list td:first-child {
font-weight: bold;
background: #f1f1f1;
width: 100% !important;
overflow-wrap: anywhere;
word-break: break-word;
padding: 8px;
margin-bottom: 2px;
text-align: center;
color: #333;
border-radius: 8px 8px 0 0;
}
/* Valores */
.ficha .datos .table-list td:last-child {
width: 100% !important;
padding: 8px;
text-align: center;
color: #222;
background: #fff;
border-radius: 0 0 8px 8px;
}
/* Quitamos sombreado alterno */
.ficha .datos .table-list tbody tr:nth-child(even) {
background-color: transparent;
}
/* Ajuste de imágenes pequeñas */
.ficha .datos .table-list td img {
width: 15px;
height: 11px;
}
.ficha .datos .table-list td img.premio {
width: 25px;
height: 25px;
vertical-align: middle;
}
/* Ajuste del contador de premios */
.ficha .datos a.premio-link .contador {
top: -4px;
right: -4px;
padding: 1px 2px;
}
.ficha .datos .table-list td .multi-line {
display: block;
margin-bottom: 0.2em; /* separación entre elementos */
}
}
/* acordeones (27/08/2025) */
.sp-easy-accordion>.sp-ea-single>.ea-header a {
color: #ffffff !important;
background-color: #3D4757;
}
.sp-easy-accordion>.sp-ea-single>.ea-header a .ea-expand-icon {
color: #ffffff !important;
}
/* ajustes generales responsive (10/10/2025) + ajustes oculto desktop (04/04/2026) */
@media only screen and (max-width: 691px) {
.lineaSeparadaMovil {
display: block;
text-align: center;
margin-bottom: 0.2em;
}
.ocultoMovil, .ocultoMovilSinEspacio {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
.ocultoMovil img, .ocultoMovilSinEspacio img {
display: none !important;
}
}
@media only screen and (min-width: 692px) {
.ocultoDesktop {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
height: 0 !important;
overflow: hidden !important;
}
.ocultoDesktop img {
display: none !important;
}
}
/* índice (23/10/2025) */
/* Contenedor enlace índice */
.enlace-indice {
text-align: center;
margin: 0px;
margin-bottom: 2rem;
}
/* Estilo base del enlace */
.enlace-indice a {
display: inline-block;
padding: 0.4rem 1.1rem;
font-weight: 500;
font-size: 0.95rem;
text-decoration: none;
color: #ffffff;
background: linear-gradient(135deg, #006a84, #0090a1);
border-radius: 50px;
box-shadow: 0 3px 8px rgba(0, 106, 132, 0.25);
transition: all 0.3s ease;
letter-spacing: 0.4px;
}
/* Hover animado */
.enlace-indice a:hover {
background: linear-gradient(135deg, #00586c, #007d8c);
transform: translateY(-1px);
box-shadow: 0 5px 12px rgba(0, 106, 132, 0.35);
}
/* Efecto al hacer clic */
.enlace-indice a:active {
transform: translateY(0);
box-shadow: 0 2px 6px rgba(0, 106, 132, 0.25);
}
/* Versión oscura (modo noche o fondo oscuro) */
body.dark-mode .enlace-indice a {
background: linear-gradient(135deg, #00a4b8, #007d8c);
color: #eaf8fa;
box-shadow: 0 3px 6px rgba(0, 255, 255, 0.2);
}
body.dark-mode .enlace-indice a:hover {
background: linear-gradient(135deg, #0090a1, #00586c);
box-shadow: 0 5px 10px rgba(0, 255, 255, 0.25);
}
/* miniaturas de posts enlazados (24/10/2025) */
.bloque-link {
display: flex;
align-items: center;
margin-top: 10px;
margin-bottom: 10px;
}
.elemento-link, .elemento-no-link {
display: inline-block;
vertical-align: middle;
line-height: 1;
}
.elemento-link:not(:has(img)),
.elemento-no-link:not(:has(img)) {
margin-left: 3px;
margin-right: 3px;
}
img.miniatura-post {
display: inline-block;
width: 104px !important;
min-width: 104px !important;
height: 140px !important;
vertical-align: middle;
margin-left: 3px;
margin-right: 3px;
}
.separador, .oculto {
display: none;
}
@media only screen and (max-width: 691px) {
.bloque-link {
display: block !important; /* bloque completo */
}
.elemento-link, .elemento-no-link {
display: block !important; /* cada elemento en línea propia */
line-height: 20px;
}
img.miniatura-post {
display: block !important; /* cada elemento en línea propia */
width: 100% !important; /* ocupar toda la línea */
height: auto !important; /* alto proporcional al ancho */
margin-bottom: 6px !important;
}
}
/* bloque extendido (25/10/2025) */
.bloque-extendido {
display: none;
flex-wrap: wrap;
}
.bloque-extendido .bloque-link {
margin-top: 10px;
margin-bottom: 10px;
}
.bloque-extendido.mostrar {
display: block;
padding-top: 10px;
line-height: 0; /* evita el espacio extra de inline-block */
}
.btn-toggle {
margin: 0px;
margin-top: 8px;
padding: 0px;
background: none;
border: none;
color: var(--color-enlace, #0073aa);
cursor: pointer;
display: block;
}
.btn-toggle:hover {
text-decoration: underline;
}
@media only screen and (max-width: 691px) {
.btn-toggle {
text-align: center;
margin: auto;
margin-top: 12px;
}
}
.desglose-premios {
display: block; /* contenedor normal */
font-family: 'Open Sans', sans-serif;
font-size: 0.95em;
line-height: 1.4;
}
.desglose-premios .bloque-certamen {
margin-top: 25px;
margin-bottom: 25px;
}
.desglose-premios .premio-item {
display: block; /* fuerza cada tag en su propia línea */
margin-bottom: 4px; /* separación entre tags */
line-height: 24px;
}
.desglose-premios .premio-item img {
margin-right: 4px;
}
.desglose-premios .premio-nombre {
font-weight: 400;
}
.desglose-premios .premio-certamen {
font-weight: 600;
}
.desglose-premios img.premio-icono {
height: 30px !important;
width: 30px !important;
margin-right: 4px;
}
/* headers (12/11/2025) */
/* Estilo para los h1 de las entradas */
h1.entry-title {
font-family: 'Merriweather', serif !important;
font-size: 32px;
font-weight: 700;
color: #003F52;
text-align: center;
padding: 1rem 1.5rem;
margin: 2rem auto 1.5rem;
background: linear-gradient(90deg, #eaf5f7 0%, #ffffff 50%, #eaf5f7 100%);
border-radius: 10px;
border: 1px solid #c8dfe5;
letter-spacing: 0.2px;
line-height: 1.3;
}
/* Estilo para h2 */
h2:not(:has(a)) {
font-size: 26px;
font-weight: 700;
margin: 10px 0;
padding: 5px 10px;
background: #006A84;
color: white;
border-radius: 5px;
transition: 0.3s;
text-align: center !important;
line-height: 40px;
}
/* Estilo para h3 (sin enlaces) */
h3:not(.flash-title):not(:has(a)) {
font-size: 22px;
font-weight: 700;
margin: 1.2rem 0 0.8rem;
padding: 6px 10px;
color: #006A84;
border-left: 4px solid #006A84;
background: #f2f9fb;
border-radius: 4px;
}
/* Estilo para h4 (sin enlaces) */
h4:not(:has(a)) {
font-size: 19px;
font-weight: 600;
margin: 6px 0;
padding: 4px 10px;
background: #f5fafb; /* aún más suave */
color: #006A84;
border: 1px solid #b3d3dc; /* borde más claro */
border-radius: 4px;
text-align: center !important;
transition: 0.3s;
line-height: 28px;
}
/* Estilo para h5 */
h5 {
font-size: 18px;
font-weight: 600;
color: #006A84;
margin: 6px 0;
padding: 0;
text-align: left; /* o center si lo prefieres */
}
/* Estilo para relacionados y h3/h4 con enlaces */
.related-posts .mag-post-detail, h3:not(.ea-header):has(> a)/*, h4:has(> a)*/ {
padding: 0.3em 0.4em;
margin: 0.1em;
border-radius: 5px;
transition: all 0.3s ease;
}
/* Estilo para los enlaces dentro de relacionados y h3/h4 con enlaces */
h1.entry-title a, .related-posts .mag-post-detail a, h3:not(.ea-header):has(> a) a, h4:has(> a) a {
text-decoration: none !important;
}
/* Hover para h3 y h4 (sin enlaces) */
.related-posts .mag-post-detail:hover, h3:not(.ea-header):has(> a):hover, h4:has(> a):hover {
/*background-color: rgba(0, 106, 132, 0.2);*/
color: #006A84;
transform: translateX(5px);
}
/* grupos de películas en las sagas (13/11/2025) */
.grupo-titulo {
font-weight: bold;
font-size: 1.2em;
background-color: #f0f0f0;
text-align: center;
color: #333;
border-top: 2px solid #ccc;
border-bottom: 2px solid #ccc;
padding: 10px 0;
}
.grupo-titulo td {
text-align: center;
padding: 10px;
}
/* relleno de gaps en tablas de premiados (14/11/2025) */
tr.gap-row {
font-style: italic; /* Da sensación de “información adicional / temporal” */
background-color: #f9f9f9; /* Fondo ligeramente distinto */
}
tr.gap-row td:first-child::before {
content: "⚠️ "; /* O cualquier símbolo discreto */
}
tr.gap-row td {
color: #666666 !important; /* Gris suave para no competir con las filas reales */
}
/* === MALLA DE PAÍSES =============================== */
.mallaPaises {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
gap: 20px;
margin: 30px 0;
padding: 0;
list-style: none;
}
/* Cada país */
.mallaPaises li {
background: #f7f7f7;
border-radius: 12px;
padding: 15px 12px;
text-align: center;
box-shadow: 0 2px 6px rgba(0,0,0,0.08);
transition: all 0.25s ease;
list-style-type: none;
}
/* Hover suave */
.mallaPaises li:hover {
transform: translateY(-4px);
box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}
/* Bandera */
.mallaPaises img {
width: 48px;
height: auto;
display: block;
margin: 10px auto;
border-radius: 6px;
}
/* Nombre del país */
.mallaPaises .pais-nombre {
font-weight: 600;
font-size: 15px;
color: #333;
display: block;
margin-top: 4px;
}
/* Enlaces */
.mallaPaises a {
text-decoration: none;
color: inherit;
display: block;
}
/* Vista móvil */
@media (max-width: 500px) {
.mallaPaises {
grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
gap: 15px;
}
.mallaPaises li {
padding: 12px 10px;
}
.mallaPaises img {
width: 40px;
}
.mallaPaises .pais-nombre {
font-size: 14px;
}
}
/* buscador avanzado y efemérides (25/11/2025) */
/* Contenedor del formulario */
#buscador-avanzado, #buscador-efemerides {
margin: 25px auto;
padding: 20px;
background: #f8f8f8;
border: 1px solid #ddd;
border-radius: 10px;
font-family: inherit;
}
#buscador-avanzado {
max-width: 650px;
}
#buscador-efemerides {
max-width: 200px;
}
/* Cada fila: label + input */
#buscador-avanzado .fila, #buscador-efemerides .fila {
display: flex;
align-items: center;
margin-bottom: 15px;
gap: 15px;
}
#buscador-avanzado .fila.fila-anio {
display: none;
}
/* Labels a la izquierda */
#buscador-avanzado label, #buscador-efemerides label {
font-weight: 600;
color: #333;
text-align: right;
}
#buscador-avanzado label {
width: 180px;
}
#buscador-efemerides label {
width: 60px;
}
/* Inputs, selects, etc. */
#buscador-avanzado input:not([type="checkbox"]), #buscador-avanzado select {
flex: 1;
padding: 7px 10px;
border: 1px solid #bbb;
border-radius: 6px;
font-size: 15px;
}
#buscador-avanzado input[type="checkbox"] {
margin-left: 4px;
}
#buscador-efemerides input {
flex: 0 0 50px;
max-width: 50px;
padding: 7px 5px;
text-align: center;
}
/* Checkbox para buscar solo el título principal */
#buscador-avanzado .checkbox-fila {
margin-top: -10px !important;
font-size: 13px !important;
}
/* País (shortcode) */
#buscador-avanzado .fila select[name="pais"], #buscador-avanzado .fila select {
max-width: 100%;
}
/* Botón */
#buscador-avanzado button, #buscador-efemerides button {
width: 100%;
padding: 12px;
background: #3D4757;
color: white;
border: none;
border-radius: 8px;
font-size: 16px;
cursor: pointer;
}
#buscador-avanzado button:hover, #buscador-efemerides button:hover {
background: #7A8594;
}
#resultados-buscador ul, ul.efemerides-list {
list-style: none;
padding: 0;
margin: 0;
}
#resultados-buscador li, ul.efemerides-list li {
display: flex;
align-items: center;
gap: 12px;
padding: 8px 0;
border-bottom: 1px solid #eee;
}
#resultados-buscador li:last-child, ul.efemerides-list li:last-child {
border-bottom: none;
}
#resultados-buscador li img, ul.efemerides-list li img {
width: 62px;
height: 84px;
border-radius: 4px;
}
#resultados-buscador li a, ul.efemerides-list li a {
text-decoration: none;
color: #333;
font-weight: 600;
transition: color .2s;
}
#resultados-buscador li a:hover, ul.efemerides-list li a:hover {
color: #006a84;
}
.efemerides-hoy {
display: block; /* ocupa todo el ancho disponible */
text-align: center; /* centra el contenido */
background: #f8f8f8;
border: 1px solid #ddd;
border-radius: 10px;
padding: 8px 15px;
margin: 10px auto;
max-width: 80%;
}
.efemerides-hoy-item {
display: inline-block; /* ítems en línea */
margin: 0 8px; /* espacio lateral controlado */
}
.efemerides-hoy-item:first-child {
margin-left: 0;
}
.efemerides-hoy-item:last-child {
margin-right: 0;
}
.efemerides-proverbio {
display: block; /* fuerza línea nueva */
margin-top: 10px; /* separación respecto a la línea superior */
font-size: 16px; /* ligeramente más pequeño */
color: #555; /* gris más oscuro que el fondo, pero menos que el negro */
font-style: italic;
}
.efemerides-year {
font-weight: 600;
margin-right: 6px;
color: #555;
}
.efemerides-fechas-cercanas {
margin: auto;
font-size: 14px;
color: #444;
text-align: center;
background: #f8f8f8;
border: 1px solid #ddd;
padding: 1em;
max-width: 400px;
text-align: center;
}
.efemerides-fechas-cercanas strong {
display: inline-block;
margin-bottom: 8px;
font-size: 15px;
}
.efemerides-fechas-cercanas a,
.efemerides-fechas-cercanas .actual {
margin: 0 4px;
padding: 3px 7px;
border-radius: 4px;
text-decoration: none !important;
color: #3D4757;
transition: background 0.2s;
}
.efemerides-fechas-cercanas a:hover {
background: #f0f0f0;
text-decoration: underline;
}
.efemerides-fechas-cercanas .actual {
background: #3D4757;
color: white;
font-weight: 600;
}
.efemerides-sugerencias {
margin-top: 20px !important;
padding: 0 !important;
list-style: none !important;
font-size: 15px !important;
line-height: 1.5 !important; /* ligeramente más ajustado */
color: #333 !important;
display: flex;
flex-direction: column;
gap: 8px; /* menos separación entre items */
}
.efemerides-sugerencias li {
display: flex !important;
align-items: flex-start !important;
gap: 6px !important; /* menos separación entre bullet y texto */
background: #f9f9f9 !important;
padding: 10px 12px !important; /* padding más compacto */
border-left: 5px solid #3D4757 !important;
border-radius: 6px !important;
transition: background 0.3s, border-color 0.3s;
}
.efemerides-sugerencias li:hover {
background: #f1f3f6 !important;
border-color: #7A8594 !important;
}
.efemerides-sugerencias li .bullet {
flex-shrink: 0 !important;
font-size: 16px !important; /* más cercano al tamaño del texto */
line-height: 1.4 !important;
}
.efemerides-sugerencias li .texto {
flex: 1 !important;
margin: 0 !important; /* elimina cualquier margen extra */
}
.efemerides-sugerencias a {
color: #3D4757 !important;
text-decoration: none !important;
font-weight: 600 !important;
}
.efemerides-sugerencias a:hover {
color: #006a84 !important;
text-decoration: none !important;
}
@media screen and (max-width: 768px) {
.efemerides-hoy {
max-width: 100%;
}
.efemerides-hoy-item {
display: block; /* cada ítem en línea nueva en móvil */
margin: 5px 0 0 0;
}
.efemerides-hoy-item strong {
display: block; /* cada ítem en línea nueva en móvil */
}
.efemerides-fechas-cercanas a, .efemerides-fechas-cercanas .actual {
display: block; /* cada ítem en línea nueva en móvil */
max-width: 30%;
margin: auto;
text-align: center;
}
}
@media (max-width: 691px) {
/* Las filas pasan a diseño vertical */
#buscador-avanzado .fila {
display: block;
}
/* Los labels ocupan toda la línea, alineados a la izquierda */
article #buscador-avanzado label {
width: 100%;
display: block;
text-align: left;
font-size: 14px;
}
/* Inputs y selects ocupan toda la anchura */
#buscador-avanzado input:not([type="checkbox"]),
#buscador-avanzado select {
width: 100%;
}
/* La fila del checkbox: ligera adaptación */
#buscador-avanzado .checkbox-fila {
flex-direction: row;
align-items: center;
}
/* La primera fila del checkbox: ligera adaptación */
#buscador-avanzado .checkbox-fila-first {
margin-top: 0px !important;
}
/* El resto de filas del checkbox: ligera adaptación */
#buscador-avanzado .checkbox-fila-not-first {
margin-top: -15px !important;
}
/* El label vacío del checkbox no debe ocupar sitio */
#buscador-avanzado .checkbox-fila label {
display: none;
}
}
/* Contenedor de paginación */
#paginacion {
margin-top: 20px;
text-align: center;
font-family: sans-serif;
}
/* Botones de página */
#paginacion button {
background-color: #f0f0f0;
border: 1px solid #ccc;
color: #333;
padding: 6px 12px;
margin: 0 2px;
cursor: pointer;
border-radius: 4px;
min-width: 36px;
transition: background-color 0.2s, color 0.2s;
}
/* Botón activo */
#paginacion button.activo {
background-color: #3D4757; /* color WordPress */
color: #fff;
border-color: #005177;
}
/* Hover */
#paginacion button:hover:not(.activo) {
color: #fff;
background-color: #7A8594;
}
/* Separador "…" */
#paginacion span {
display: inline-block;
padding: 6px 8px;
margin: 0 2px;
color: #666;
}
/* Botones Prev/Next */
#paginacion button.prev,
#paginacion button.next {
font-weight: bold;
}
@media (max-width: 691px) {
#paginacion button.prev,
#paginacion button.next {
display: block;
margin: 5px auto;
text-align: center;
}
}
/* optimizaciones (22/11/2025) */
/* Fijar tamaño del banner (hero) 1920x210px */
@media (min-width: 691px) {
.site-header img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 1920 / 210;
}
}
/* ======================
Slides principales y Trending
====================== */
.mag-post-single.has-image {
aspect-ratio: 16/9; /* Ajusta la proporción */
overflow: hidden;
width: 100%;
max-width: 100%;
box-sizing: border-box;
position: relative;
}
.mag-post-single.has-image img {
width: 100%; /* ancho total del contenedor */
height: 100%; /* altura total del contenedor */
display: block;
transition: opacity 0.3s ease-out;
}
/* Fade-in opcional para slides no visibles inicialmente */
.magazine-slider-wrapper .mag-post-single:not(:first-child) {
opacity: 0;
}
.magazine-slider-wrapper.slider-ready .mag-post-single:not(:first-child) {
opacity: 1;
}
/* Limitar altura de títulos */
.mag-post-title {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
/* Placeholder visual antes de que se carguen los sliders */
.magazine-slider-wrapper.placeholder,
.editor-picks-wrapper,
.trending-wrapper.placeholder {
background-color: #f0f0f0;
}
/* ======================
Trending wrapper fijo
====================== */
.trending-wrapper {
min-height: 90px; /* ajusta según la altura real de tus slides */
}
/* ======================
Slides dentro de trending
====================== */
.trending-wrapper .mag-post-single {
height: 90px; /* o la altura de tus imágenes + contenido */
box-sizing: border-box;
margin-bottom: 10px; /* eliminamos cualquier margin vertical */
padding: 0; /* eliminamos padding vertical extra */
}
/* ======================
Ajustar border del slick (viene de slick.min.css)
====================== */
.slick-vertical .slick-slide {
border: 0 !important;
}
/* listado de números de temporadas (27/11/2025) */
.temporada-actual {
font-weight: bold;
font-size: 28px;
background: #006A84;
padding: 4px;
color: #FFFFFF;
border-radius: 4px;
display: inline-block;
line-height: 1;
vertical-align: middle;
position: relative;
top: -2px;
}
/* títulos principales (29/11/2025) */
.entry-title-split {
font-family: 'Merriweather', serif !important;
color: #003F52;
text-align: center;
padding: 1rem 1.5rem;
margin: 2rem auto 1.5rem;
background: linear-gradient(90deg, #eaf5f7 0%, #ffffff 50%, #eaf5f7 100%);
border-radius: 10px;
border: 1px solid #c8dfe5;
letter-spacing: 0.2px;
line-height: 1.3;
display: flex;
flex-direction: column;
}
/* Título principal */
.entry-title-main {
font-size: 32px;
font-weight: 700;
}
/* Subtítulo */
.entry-title-sub {
margin-top: 0.4rem;
font-size: 26px;
font-weight: 500;
color: #275f6e;
letter-spacing: 0.3px;
}
@media (max-width: 691px) {
/* Título principal */
.entry-title-main {
font-size: 24px;
}
/* Subtítulo */
.entry-title-sub {
font-size: 18px;
}
/* Estilo para h2 */
h2:not(:has(a)) {
font-size: 22px;
line-height: 30px;
}
/* Estilo para h3 (sin enlaces) */
h3:not(.flash-title):not(:has(a)) {
font-size: 18px;
}
/* Estilo para h4 (sin enlaces) */
h4:not(:has(a)) {
font-size: 15px;
line-height: 19px;
}
/* Estilo para h5 */
h5 {
font-size: 14px;
}
}
/* características generales de móvil */
@media (max-width: 691px) {
.nuevaLineaMovil {
display: block !important;
}
}
/* --- vídeos --- */
.entry-content .videos-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
gap: 1.5rem;
margin: 2rem 0;
}
.entry-content .video {
position: relative;
width: 100%;
padding-top: 56.25%;
background: #000;
border-radius: 8px;
overflow: hidden;
}
.entry-content .video iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}
@media only screen and (max-width: 691px) {
.entry-content .videos-grid {
grid-template-columns: 1fr;
gap: 1.25rem;
}
}
/* --- cartelera --- */
.cartelera-lista {
display: flex;
flex-wrap: wrap;
justify-content: center; /* centra horizontalmente los elementos */
gap: 20px;
margin: 20px 0;
}
.cartelera-lista .pelicula {
width: 180px;
text-align: center; /* centra los textos dentro de cada película */
background-color: #f9f9f9;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s;
}
.cartelera-lista .pelicula img {
width: 100%;
height: 270px;
display: block;
border-bottom: 1px solid #ddd;
}
.cartelera-lista .pelicula h3 {
font-size: 16px;
margin: 10px 0 5px 0;
}
.cartelera-lista .pelicula p {
font-size: 14px;
margin: 0 0 10px 0;
color: #555;
}
.cartelera-lista a.pelicula {
text-decoration: none !important;
}
/* Efecto hover para resaltar la película */
.cartelera-lista .pelicula:hover {
transform: translateY(-5px);
box-shadow: 0 8px 16px rgba(0,0,0,0.2);
}
/* Quitamos el borde izquierdo de los h3 */
.cartelera-lista h3 {
border-left: none !important;
}
/* Responsive: móvil y tablet */
@media only screen and (max-width: 691px) {
.cartelera-lista .pelicula {
width: 100%;
}
.cartelera-lista .pelicula h3 {
font-size: 14px;
}
.cartelera-lista .pelicula p {
font-size: 12px;
}
}
/* --- calendario de estrenos --- */
.bm-calendario-wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.bm-cal-grid {
display: grid;
grid-template-columns: repeat(7, 1fr);
gap: 6px;
}
.bm-cal-header {
font-weight: bold;
text-align: center;
padding: 4px 0;
opacity: 0.7;
}
.bm-dia.bm-vacio {
background: transparent;
border: none;
}
.bm-dia {
min-height: 90px;
padding: 6px;
border-radius: 6px;
font-size: 12px;
position: relative;
}
.bm-pasado { background: #f1f1f1; color: #999; }
.bm-hoy { background: #f2f9fb; border: 2px solid #006A84; }
.bm-futuro { background: #fff7ed; }
.bm-num-dia {
font-weight: bold;
margin-bottom: 4px;
}
.bm-estreno {
display: block;
font-size: 11px;
line-height: 1.2;
margin-bottom: 2px;
}
.bm-estreno img {
width: 24px;
height: auto;
vertical-align: middle;
margin-right: 4px;
}
.bm-mas {
font-size: 11px;
color: #555;
}
.bm-indicador-estrenos {
margin-top: 4px;
display: flex;
align-items: center;
gap: 4px;
}
.bm-dot-row {
display: flex;
flex-wrap: wrap;
gap: 4px; /* controla el espacio entre dots */
margin-bottom: 2px;
}
.bm-dot {
flex: 0 0 10px; /* ancho fijo de 8px */
height: 10px;
border-radius: 50%;
background-color: #ff7a00;
display: block; /* evita espacios tipo inline-block */
}
.bm-dot.bm-hoy {
background-color: #006A84 !important;
}
.bm-contador {
font-size: 11px;
background: #ff7a00;
color: #fff;
border-radius: 10px;
padding: 0 5px;
line-height: 1.4;
}
.bm-dia.bm-pasado {
background: #f2f2f2;
color: #999;
}
.bm-dia.bm-pasado .bm-dot,
.bm-dia.bm-pasado .bm-contador {
background: #ccc;
}
.bm-cal-leyenda {
margin-top: 1em;
display: flex;
gap: 1em;
flex-wrap: wrap;
align-items: center;
font-size: 0.9em;
}
.bm-cal-leyenda .bm-leyenda {
display: flex;
align-items: center;
gap: 0.3em;
}
.bm-cal-leyenda .bm-dot {
display: inline-block;
border-radius: 50%;
}
.bm-cal-leyenda .bm-pasado { background-color: #ccc; }
.bm-cal-leyenda .bm-hoy { background-color: #006A84; }
.bm-cal-leyenda .bm-futuro { background-color: #ff7a00; }
@media (max-width: 768px) {
.bm-calendario-wrapper {
grid-template-columns: 1fr; /* cada mes en fila completa */
gap: 0px;
}
.bm-indicador-estrenos {
display: block;
}
.bm-dia .bm-indicador-estrenos .bm-dot-row {
flex-direction: column; /* apilar verticalmente */
gap: 4px;
justify-content: center; /* centrar los dots horizontalmente */
align-items: center; /* opcional, centra en la columna */
}
.bm-dia .bm-indicador-estrenos .bm-dot-row .bm-dot {
display: block; /* asegurar que ocupa espacio */
width: 15px;
min-height: 15px;
border-radius: 50%;
}
.bm-cal-leyenda {
justify-content: center;
}
}
/* Tooltip por defecto escondido */
.bm-dot-tooltip {
position: absolute;
bottom: 100%; /* encima del dot */
left: 50%;
transform: translateX(-50%);
display: none;
background: #fff;
border: 1px solid #ccc;
border-radius: 6px;
padding: 6px;
box-shadow: 0 2px 6px rgba(0,0,0,0.2);
z-index: 10;
width: 240px; /* ajustable */
text-align: center;
}
.bm-dot-tooltip img {
width: 200px;
height: auto;
display: block;
margin: 4px auto;
border-radius: 4px;
}
.bm-dot-tooltip-title {
font-size: 14px;
font-weight: bold;
display: block;
}
/* Mostrar tooltip al hover */
.bm-dot:hover .bm-dot-tooltip {
display: block;
}
/* --- estrenos --- */
.estrenos-lista {
display: flex;
/*flex-wrap: wrap;*/
justify-content: center;
gap: 20px;
margin: 20px 0;
}
.estrenos-lista .estreno-card {
width: 120px;
text-align: center;
background-color: #f9f9f9;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s;
position: relative;
}
.estrenos-lista .estreno-card img {
width: 100%;
height: 135px;
display: block;
border-bottom: 1px solid #ddd;
}
.estrenos-lista .overlay-estreno {
position: absolute;
top: 6px;
left: 6px;
right: 6px;
background: rgba(0,0,0,0.75);
padding: 2px 6px;
border-radius: 6px;
}
.estrenos-lista .fecha-estreno {
color: #fff;
font-size: 11px;
}
.estrenos-lista .titulo-estreno {
display: none;
}
.estrenos-lista .meta-estreno {
display: none;
}
.estrenos-lista .temporada-estreno {
color: #fff;
font-size: 11px;
opacity: 0.85;
}
.estrenos-lista a.estreno-card {
text-decoration: none !important;
}
.estrenos-lista .estreno-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 16px rgba(0,0,0,0.2);
}
.dia-separador {
flex: 0 0 auto;
width: 2px;
height: 90px;
margin: 0 10px;
background: linear-gradient(
to bottom,
transparent,
rgba(0,0,0,0.25),
transparent
);
align-self: center;
}
.scroll-hint {
display: inline-block;
margin-left: 6px;
font-size: 14px;
opacity: 0.6;
font-weight: 500;
white-space: nowrap;
}
@media only screen and (min-width: 692px) {
.estrenos-lista {
flex-wrap: nowrap;
justify-content: flex-start;
overflow-x: auto;
overflow-y: hidden;
gap: 20px;
padding: 10px 5px 15px 5px;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
}
.estrenos-lista .estreno-card {
flex: 0 0 auto;
}
.estrenos-lista::-webkit-scrollbar {
height: 12px;
}
.estrenos-lista::-webkit-scrollbar-thumb {
background: rgba(0,0,0,0.2);
border-radius: 10px;
}
}
@media only screen and (max-width: 691px) {
.estrenos-lista {
flex-wrap: wrap;
}
.estrenos-lista .estreno-card {
width: 100%;
}
.estrenos-lista .estreno-card img {
height: 160px;
}
.estrenos-lista .titulo-estreno {
display: block;
color: #fff;
font-size: 11px;
margin-bottom: 2px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.estrenos-lista .meta-estreno {
display: inline-block;
color: #fff;
font-size: 11px;
opacity: 0.85;
white-space: nowrap;
}
.dia-separador {
display: none;
}
}
/* --- recomendaciones de streaming para este mes (01/05/2026) --- */
.bloque-recomendacion-mes{
display:inline-block;
position:relative;
width:100%;
max-width:420px;
margin:1.5rem auto 2rem;
border-radius:18px;
overflow:hidden;
background:#111;
box-shadow:0 10px 28px rgba(0,0,0,.18);
transition:
transform .28s ease,
box-shadow .28s ease,
filter .28s ease;
vertical-align:top;
}
.bloque-recomendacion-mes img{
display:block;
width:100%;
height:auto;
aspect-ratio:16/9;
object-fit:cover;
}
/* degradado cinematográfico */
.bloque-recomendacion-mes::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(
to top,
rgba(0,0,0,.58) 0%,
rgba(0,0,0,.18) 38%,
rgba(0,0,0,0) 70%
);
z-index:1;
pointer-events:none;
}
/* etiqueta */
.bloque-recomendacion-mes::after{
content:"🍿 Recomendaciones de este mes";
position:absolute;
left:14px;
bottom:14px;
z-index:2;
padding:.45rem .7rem;
border-radius:999px;
font-size:.82rem;
font-weight:700;
line-height:1;
color:#fff;
background:rgba(0,0,0,.68);
backdrop-filter:blur(6px);
letter-spacing:.2px;
}
/* hover */
.bloque-recomendacion-mes:hover{
transform:translateY(-4px);
box-shadow:0 16px 36px rgba(0,0,0,.26);
}
.bloque-recomendacion-mes:hover img{
transform:scale(1.04);
filter:brightness(1.05);
}
/* focus accesible */
.bloque-recomendacion-mes:focus-visible{
outline:3px solid #ffd54a;
outline-offset:4px;
}
/* móvil */
@media (max-width:640px){
.bloque-recomendacion-mes{
max-width:100%;
border-radius:14px;
margin:1rem 0 1.5rem;
}
.bloque-recomendacion-mes::after{
left:10px;
bottom:10px;
font-size:.76rem;
padding:.4rem .6rem;
}
}
/* --- otros --- */
.nuevaLinea {
display: block !important;
}
.mini-forzada {
width: 310px !important;
aspect-ratio: 310 / 420;
height: auto;
}
.icon-forzada {
width: 150px;
aspect-ratio: 1 / 1;
height: auto;
object-fit: cover;
}
ol.lista-cine {
counter-reset: item;
list-style: none !important;
padding-left: 0;
}
ol.lista-cine li {
counter-increment: item;
margin-bottom: 0.5rem;
position: relative;
display: flex;
align-items: flex-start;
line-height: 1.2; /* compacto pero legible */
background: #f9f9f9; /* fondo tenue */
border-left: 4px solid #999; /* barra lateral elegante */
padding: 0.4rem 0.6rem; /* espacio interno */
border-radius: 4px; /* esquinas suavizadas */
transition: background 0.3s ease; /* efecto hover suave */
}
ol.lista-cine li:hover {
background: #f0f0f0; /* efecto al pasar el ratón */
}
ol.lista-cine li::before {
content: counter(item, decimal-leading-zero);
font-weight: 600;
font-size: 1rem;
color: #555; /* número más visible */
margin-right: 1rem;
flex-shrink: 0;
background: #e0e0e0; /* fondo circular o cuadrado detrás del número */
padding: 0.2rem 0.5rem;
border-radius: 50%; /* círculo */
text-align: center;
}
.tipo-participacion {
font-size: 1.4em;
vertical-align: middle;
}
.video-container {
max-width: 800px;
margin: 0 auto;
}
.video-container iframe {
width: 100%;
aspect-ratio: 16 / 9;
height: auto;
}