﻿/*──────────────────────────────────────────────────────────────────────
  Mobile Card Carousels (visible < lg only via d-block d-lg-none)
──────────────────────────────────────────────────────────────────────*/

.mobile-row { padding: 0 15px; margin-bottom: 40px; }
.mobile-row-title { font-size: 1.3em; font-weight: 600; margin-bottom: 15px; color: #e5e5e5; }
    .mobile-row-title .linkMore {margin-left: 10px;font-size: .65em; font-weight: 500; color: rgba(255,255,255, .5); display: inline-block; text-decoration: none; transition: color 0.3s ease, transform 0.3s ease;}
        .mobile-row-title .linkMore:hover {color: #fff;}

.mobile-carousel-wrap { position: relative; }
.mobile-carousel-wrap .carousel { overflow: hidden; }
.mobile-carousel-wrap .carousel-inner { overflow: hidden; }
.mobile-carousel-wrap .carousel-item { overflow: hidden; }

.mobile-carousel-wrap .carousel-control-prev,
.mobile-carousel-wrap .carousel-control-next {
    width: 30px; opacity: 0; transition: opacity 0.3s;
    top: 0; bottom: auto; height: 100%;
}
.mobile-carousel-wrap .carousel-control-prev { left: -15px; background: rgba(0,0,0,0.4); }
.mobile-carousel-wrap .carousel-control-next { right: -15px; background: rgba(0,0,0,0.4); }
.mobile-carousel-wrap:hover .carousel-control-prev,
.mobile-carousel-wrap:hover .carousel-control-next { opacity: 1; }

.mobile-carousel-wrap .carousel-indicators {
    position: relative; bottom: auto; margin: 10px 0 0 0; justify-content: center;
}
.mobile-carousel-wrap .carousel-indicators button {
    width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,0.3);
    border: none; margin: 0 3px;
}
.mobile-carousel-wrap .carousel-indicators button.active { background: var(--white); }

/* Card layout */
.nf-card { padding: 4px; text-align: left; display: flex; flex-direction: column;}
.nf-thumb {display: flex;
    aspect-ratio: 2/3; border-radius: 4px; position: relative;
    overflow: hidden; background-size: cover; background-position: center;
}
.nf-thumb-play {
    width: 32px; height: 32px;
    background: rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.4);
    color: var(--white); display: block; align-items: center; justify-content: center;
    font-size: 14px; cursor: pointer; opacity: 1; transition: opacity 0.2s; border: solid 1px var(--primary);
}
.nf-card:hover .nf-thumb-play { opacity: 1; }

.nf-card-title {
    font-size: 0.8em; font-weight: 600; color: var(--white);
    margin-top: 6px; line-height: 1.2;
    overflow: hidden; text-overflow: ellipsis;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.nf-card-sub { font-size: 0.7em; color: rgba(255,255,255,0.5); margin-top: 2px; }

.nf-card-actions { display: flex; gap: 4px; margin-top: 6px; justify-content: center; margin-top: auto;}
.nf-card-actions .action-btn {
    width: 28px; height: 28px; border-width: 1px; font-size: 0.75em;
}

