/* STTV Custom Styles */

/* Prevent accidental horizontal overflow on mobile */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

/* Ensure aspect-video is always strictly 16:9 on all browsers without distortion */
.aspect-video {
    aspect-ratio: 16 / 9;
}

/* Hide scrollbar for carousel but keep functionality */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Modal animation utilities */
.modal-active {
    opacity: 1 !important;
}
.modal-active > div {
    transform: scale(1) !important;
}

/* Mobile touch scrolling & snap */
.touch-scroll-x {
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
}
.snap-item {
    scroll-snap-align: start;
}

/* Touch tap highlight */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Card hover animation */
.video-card-hover {
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.video-card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(15, 76, 129, 0.1), 0 8px 10px -6px rgba(15, 76, 129, 0.1);
}

/* Pulse play button effect */
@keyframes pulse-ring {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.7);
    }
    70% {
        transform: scale(1);
        box-shadow: 0 0 0 12px rgba(37, 99, 235, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(37, 99, 235, 0);
    }
}

.play-pulse {
    animation: pulse-ring 2.5s infinite;
}

/* Line clamp helpers */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
