/* SVG Icon Styles */

.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    fill: currentColor;
}

/* Icon Sizes */
.icon-xs {
    width: 0.75em;
    height: 0.75em;
}

.icon-sm {
    width: 0.875em;
    height: 0.875em;
}

.icon-lg {
    width: 1.33em;
    height: 1.33em;
}

.icon-xl {
    width: 1.5em;
    height: 1.5em;
}

.icon-2x {
    width: 2em;
    height: 2em;
}

.icon-3x {
    width: 3em;
    height: 3em;
}

/* Spinner Animation */
@keyframes icon-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.icon-spin {
    animation: icon-spin 1s linear infinite;
}

/* Icon in Buttons */
.btn .icon {
    transition: transform 0.3s;
}

.btn:hover .icon {
    transform: translateX(3px);
}

/* Icon Spacing */
.icon + * {
    margin-left: 0.5em;
}

* + .icon {
    margin-left: 0.5em;
}

/* Control Button Icons */
.control-btn .icon {
    width: 1rem;
    height: 1rem;
}

.control-btn-large .icon {
    width: 1.25rem;
    height: 1.25rem;
}

/* Playlist Icons */
.playlist-item .icon {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
}

/* Gallery Icons */
.gallery-item-overlay .icon {
    width: 1.5rem;
    height: 1.5rem;
}

/* Section Icons */
.game-icon .icon,
.program-icon .icon,
.photo-icon .icon {
    width: 2.5rem;
    height: 2.5rem;
}

/* Loading Icons */
.video-loading .icon {
    width: 3rem;
    height: 3rem;
}

.no-videos-message .icon {
    width: 4rem;
    height: 4rem;
}

/* Footer Icons */
.footer-contact .icon {
    width: 1rem;
    height: 1rem;
}

/* Lightbox Icons */
.lightbox-close .icon {
    width: 2rem;
    height: 2rem;
    filter: invert(1) brightness(2);
    opacity: 1;
}

.lightbox-nav .icon {
    width: 2.5rem;
    height: 2.5rem;
    filter: invert(1) brightness(2);
    opacity: 1;
}

/* Hero Section Icons */
.btn-hero .icon {
    width: 1.25rem;
    height: 1.25rem;
}