/**
 * Edixer Analytics Pro Public CSS
 * Modern, clean styling for all public-facing shortcodes
 * 
 * Optimized for maximum performance with minimal GPU utilization
 */

/* CRITICAL PERFORMANCE OPTIMIZATIONS - VIDEO CARDS ONLY */
/* Only optimize video card related elements */
html {
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    overflow-anchor: none; /* Disable scroll anchoring which causes repaints */
}

/* ONLY optimize video card images */
.edixer-yt-card img, 
.edixer-yt-card-thumbnail img {
    image-rendering: optimizeQuality;
    backface-visibility: hidden;
    transform: translateZ(0);
    contain: paint;
}

/* RESTORE SMOOTH HOVER ANIMATIONS for video cards - MATCHING METRIC COLUMN HOVER */
.edixer-yt-card {
    position: relative;
    background-color: #3a59b7;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15);
    transform: translateZ(0);
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255, 255, 255, 0.15);
    /* REMOVED will-change for better scroll performance */
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* OPTIMIZED HOVER: Consolidated all hover effects for better performance */
.edixer-yt-card:hover {
    transform: translateZ(0); /* Hardware acceleration */
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2); /* Reduced shadow complexity */
    border-color: rgba(255, 255, 255, 0.25); /* Reduced opacity for better performance */
    /* REMOVED: Complex gradients for better performance */
}

/* Keep other transitions for consistency within the card */
.edixer-yt-card-thumbnail {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
    border-radius: 25px;
    margin: 6px 6px 12px;
    background-color: #2d3a5e;
    background-size: cover;
    background-position: center;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.3s ease, transform 0.3s ease; /* Added transform transition */
    z-index: 1; /* Lower than play button (z-index: 10) */
}

/* THUMBNAIL LOADING ANIMATION */
.edixer-yt-card-thumbnail::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
        rgba(255,255,255,0.1) 0%,
        rgba(255,255,255,0.3) 50%,
        rgba(255,255,255,0.1) 100%);
    background-size: 200% 100%;
    animation: edixer-thumbnail-shimmer 1.5s infinite;
    z-index: 2;
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.3s ease;
    border-radius: inherit;
}

/* Thumbnail loading animation keyframes */
@keyframes edixer-thumbnail-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* Hide loading animation when image is loaded */
.edixer-yt-card-thumbnail.loaded::before {
    opacity: 0;
}

/* OPTIMIZED HOVER: Simplified effects for better performance */
.edixer-yt-card:hover .edixer-yt-card-thumbnail {
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.25); /* Reduced shadow complexity */
}

/* REMOVED: Complex gradient backgrounds for better performance */
/* REMOVED: Filter effects for better performance */

/* Simple content background change on hover */
.edixer-yt-card:hover .edixer-yt-card-content {
    background-color: rgba(74, 96, 226, 0.1); /* Simple color instead of gradient */
}

.edixer-yt-card-stat {
    transition: background 0.3s ease;
}

.edixer-yt-card:hover .edixer-yt-card-stat {
    background: rgba(255, 255, 255, 0.2);
}

/* Disable animations when reduced motion is preferred - ONLY for video cards */
@media (prefers-reduced-motion: reduce) {
    .edixer-yt-card *,
    .edixer-yt-card *::before,
    .edixer-yt-card *::after,
    .edixer-yt-ranked-container * {
        animation-duration: 0.001s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001s !important;
    }
}

/* Create a simpler rendering pipeline for video cards only */
.edixer-yt-card,
.edixer-yt-card-thumbnail,
.edixer-yt-card-content {
    transform: translate3d(0, 0, 0);
    contain: layout paint style;
    /* REMOVED: content-visibility: auto; - CAUSED CARDS TO DISAPPEAR OUT OF VIEWPORT */
    /* REMOVED will-change for better scroll performance */
}

/* SCROLL OPTIMIZATION - ONLY for video card related elements */
body {
    overscroll-behavior: none; /* Prevent bounce scrolling which causes repaints */
}

/* GLOBAL SCROLL PERFORMANCE OPTIMIZATION */
html {
    scroll-behavior: smooth;
}

/* Reduce GPU layers for better scroll performance */
* {
    will-change: auto !important; /* Reset excessive will-change declarations */
}

/* Make sure video card rank elements get proper GPU treatment */
.edixer-yt-card-rank {
    transform: translateZ(0);
    contain: layout paint style;
    backface-visibility: hidden;
}

/* Remove animations on scroll ONLY for video cards */
@media (prefers-reduced-motion: no-preference) {
    body.is-scrolling .edixer-yt-card,
    body.is-scrolling .edixer-yt-card * {
        /* Keep transitions during scrolling */
        /* Removed: transition: none !important; */
        /* Removed: animation-play-state: paused !important; */
    }
}

/* Import LEMON TUESDAY font */
@font-face {
    font-family: 'LEMON TUESDAY';
    src: url('../fonts/LEMON_TUESDAY.woff2') format('woff2'),
         url('../fonts/LEMON_TUESDAY.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Common Styles */
.edixer-grid {
    display: grid;
    gap: 24px;
    margin-bottom: 40px;
}

.edixer-grid-ranked, .edixer-grid-all {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.edixer-video-card {
    position: relative;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.edixer-video-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}

.edixer-video-rank {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #ff4d54;
    color: white;
    font-size: 14px;
    font-weight: bold;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    z-index: 1;
    box-shadow: 0 4px 8px rgba(255, 77, 84, 0.3);
}

.edixer-video-thumbnail {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
    border-radius: 18px;
    margin: 6px 6px 12px;
    background-color: #2d3a5e;
    background-size: cover;
    background-position: center;
}

.edixer-video-thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
    background-color: transparent;
}

/* Hide broken image icon if the image fails to load */
.edixer-video-thumbnail img:error {
    visibility: hidden;
}

/* Restore Old Premium Play Button (Glass Effect) */
.edixer-yt-card-play-new {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;  /* Reverted size */
    height: 48px; /* Reverted size */
    background: rgba(255, 255, 255, 0.08); /* Reverted background */
    backdrop-filter: blur(8px); /* Reverted backdrop-filter */
    -webkit-backdrop-filter: blur(8px); /* Reverted backdrop-filter */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0.7; /* Reverted initial opacity */
    border: 1px solid rgba(255, 255, 255, 0.15); /* Reverted border */
    pointer-events: auto; /* Allow clicks if needed, revert from none */
    z-index: 10; /* FIXED: Higher than thumbnail image (z-index: 3) */
}

.edixer-yt-card-play-new::before { /* Reverted to ::before */
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 8px 12px; /* Reverted triangle style */
    border-color: transparent transparent transparent rgba(255, 255, 255, 0.9); /* Reverted triangle color */
    margin-left: 2px; /* Reverted margin */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* Reverted transition */
}

/* IMPROVED: Play button hover without scale */
.edixer-yt-card:hover .edixer-yt-card-play-new {
    opacity: 1;
    transform: translate(-50%, -50%); /* REMOVED scale(1.1) */
    background: rgba(255, 255, 255, 0.15); /* Slightly more opaque */
    border-color: rgba(255, 255, 255, 0.35); /* Brighter border */
}

.edixer-yt-card:hover .edixer-yt-card-play-new::before {
    border-left-color: rgba(255, 255, 255, 1);
    /* REMOVED: transform: scale(1.1); */
}

/* Ensure thumbnail hover doesn't conflict (remove opacity change added previously) */
.edixer-yt-card-thumbnail:hover .edixer-yt-card-play-new {
    opacity: inherit; /* Use card hover opacity instead */
}

/* Hide all old play button styles */
.edixer-play-button,
.edixer-play-button svg,
.edixer-yt-card-play,
.edixer-yt-card-play::before,
.edixer-yt-card-play svg {
    display: none !important;
}

.edixer-video-title {
    padding: 16px 20px 8px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height: 44px;
}

.edixer-video-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px 16px;
}

.edixer-video-views {
    display: flex;
    align-items: center;
    color: #666;
    font-size: 14px;
}

.edixer-video-views svg {
    width: 18px;
    height: 18px;
    fill: #666;
    margin-right: 6px;
}

.edixer-client-name {
    font-size: 13px;
    color: #888;
    font-weight: 500;
}

.edixer-load-more-container {
    text-align: center;
    margin: 20px 0 40px;
}

.edixer-load-more-button {
    background: #ff4d54;
    color: white;
    border: none;
    border-radius: 35px;
    padding: 12px 30px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
    box-shadow: 0 6px 12px rgba(255, 77, 84, 0.25);
}

.edixer-load-more-button:hover {
    background: #e03e45;
    transform: translateY(-2px);
}

.edixer-cta-container {
    text-align: center;
    margin: 20px 0 40px;
}

.edixer-cta-button {
    display: inline-block;
    background: #ff4d54;
    color: white;
    text-decoration: none;
    border-radius: 35px;
    padding: 14px 36px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.3s ease, transform 0.3s ease;
    box-shadow: 0 6px 16px rgba(255, 77, 84, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.edixer-cta-button:hover {
    background: #e03e45;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(255, 77, 84, 0.4);
}

/* Total Count Section */
.edixer-total-count {
    background: linear-gradient(135deg, #f8f9fe 0%, #eef1f7 100%);
    border-radius: 24px;
    padding: 30px;
    margin-bottom: 40px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
}

.edixer-total-count-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.edixer-total-count-header h2 {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin: 0 0 15px 0;
}

.edixer-period-filter {
    display: flex;
    background: white;
    border-radius: 35px;
    padding: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.edixer-period-option {
    padding: 8px 16px;
    font-size: 14px;
    font-weight: 500;
    color: #666;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

.edixer-period-option.active {
    background: #ff4d54;
    color: white;
    box-shadow: 0 4px 8px rgba(255, 77, 84, 0.25);
}

.edixer-stats-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.edixer-stat-box {
    background: white;
    border-radius: 20px;
    padding: 24px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}

.edixer-stat-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
}

.edixer-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    margin-bottom: 15px;
}

.edixer-stat-icon svg {
    width: 28px;
    height: 28px;
}

.edixer-stat-views .edixer-stat-icon {
    background: rgba(0, 123, 255, 0.1);
}

.edixer-stat-views .edixer-stat-icon svg {
    fill: #007bff;
}

.edixer-stat-likes .edixer-stat-icon {
    background: rgba(255, 77, 84, 0.1);
}

.edixer-stat-likes .edixer-stat-icon svg {
    fill: #ff4d54;
}

.edixer-stat-comments .edixer-stat-icon {
    background: rgba(40, 167, 69, 0.1);
}

.edixer-stat-comments .edixer-stat-icon svg {
    fill: #28a745;
}

.edixer-stat-shares .edixer-stat-icon {
    background: rgba(255, 193, 7, 0.1);
}

.edixer-stat-shares .edixer-stat-icon svg {
    fill: #ffc107;
}

.edixer-stat-label {
    font-size: 15px;
    color: #666;
    margin-bottom: 8px;
}

.edixer-stat-value {
    font-size: 28px;
    font-weight: 700;
    color: #333;
}

/* Clients Section */
.edixer-clients-growth {
    margin-bottom: 40px;
}

.edixer-clients-slider-container {
    position: relative;
    padding: 0 40px;
}

.edixer-clients-slider {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
    padding: 20px 0;
}

.edixer-clients-slider::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}

.edixer-client-card {
    flex: 0 0 300px;
    margin-right: 20px;
    background: white;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    padding: 24px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.edixer-client-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}

.edixer-client-profile {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}

.edixer-client-image {
    flex: 0 0 60px;
    height: 60px;
    overflow: hidden;
    border-radius: 50%;
    margin-right: 16px;
    border: 2px solid #ff4d54;
}

.edixer-client-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edixer-client-details {
    flex: 1;
}

.edixer-client-name {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 5px;
}

.edixer-client-subscribers {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.edixer-client-join-date {
    font-size: 13px;
    color: #888;
}

.edixer-client-growth {
    background: #f8f9fe;
    border-radius: 8px;
    padding: 12px;
    font-size: 14px;
    color: #666;
    line-height: 1.5;
}

.edixer-client-growth p {
    margin: 0;
}

.edixer-slider-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
}

.edixer-slider-prev,
.edixer-slider-next {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: white;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    cursor: pointer;
    pointer-events: auto;
    transition: background 0.3s ease, transform 0.3s ease;
}

.edixer-slider-prev:hover,
.edixer-slider-next:hover {
    background: #ff4d54;
    transform: scale(1.1);
}

.edixer-slider-prev svg,
.edixer-slider-next svg {
    width: 24px;
    height: 24px;
    fill: #666;
    transition: fill 0.3s ease;
}

.edixer-slider-prev:hover svg,
.edixer-slider-next:hover svg {
    fill: white;
}

/* Animation for counters */
.edixer-counter {
    display: inline-block;
}

/* Video Player */
.edixer-video-player {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edixer-video-player iframe {
    width: 80%;
    height: 80%;
    max-width: 1200px;
    max-height: 675px;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .edixer-total-count-header {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .edixer-period-filter {
        margin-top: 15px;
        width: 100%;
        justify-content: space-between;
    }
    
    .edixer-stat-box {
        padding: 20px 15px;
    }
    
    .edixer-stat-value {
        font-size: 24px;
    }
    
    .edixer-client-card {
        flex: 0 0 260px;
    }
    
    .edixer-video-player iframe {
        width: 90%;
        height: 50%;
    }
}

/**
 * Edixer Analytics Pro Public Styles
 *
 * @since      1.0.0
 * @package    Edixer_Analytics_Pro
 */

/* Common Styles for Shortcodes */
.edixer-shortcode-container {
    margin: 30px 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    color: #333;
}

.edixer-shortcode-container * {
    box-sizing: border-box;
}

/* Dark Mode Styles */
.edixer-shortcode-dark-mode {
    background-color: #1f2129;
    color: #f1f1f1;
}

.edixer-shortcode-dark-mode .edixer-yt-card {
    background-color: #2b2d3a;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3);
}

.edixer-shortcode-dark-mode .edixer-yt-card-title {
    color: #fff;
}

.edixer-shortcode-dark-mode .edixer-yt-card-meta {
    color: #ccc;
}

.edixer-shortcode-dark-mode .edixer-yt-loadmore {
    background-color: #373a4d;
    color: #fff;
}

.edixer-shortcode-dark-mode .edixer-yt-stats-card {
    background-color: #2b2d3a;
}

.edixer-shortcode-dark-mode .edixer-yt-stats-title {
    color: #ccc;
}

.edixer-shortcode-dark-mode .edixer-yt-stats-value {
    color: #fff;
}

/* Ranked Videos Shortcode - Premium Design */
.edixer-yt-ranked-container {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Desktop: 4 columns */
    grid-gap: 50px 10px;
    padding: 30px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    contain: layout size style;
    will-change: transform;
    transform: translateZ(0);
}

.edixer-yt-card {
    position: relative;
    background-color: #3a59b7;
    border-radius: 30px; /* Updated from 22px to 30px */
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(74, 96, 226, 0.3);
    transform: translateZ(0);
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(255, 255, 255, 0.15);
    /* REMOVED will-change for better scroll performance */
}

/* REMOVED: Duplicate hover rule - consolidated above */

.edixer-yt-card-thumbnail {
    position: relative;
    overflow: hidden;
    padding-top: 56.25%;
    border-radius: 25px; /* Updated from 18px to 30px */
    margin: 6px 6px 12px;
    background-color: #2d3a5e;
    background-size: cover;
    background-position: center;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.15);
}

.edixer-yt-card-thumbnail img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: inherit;
    background-color: transparent;
    transition: filter 0.4s ease; /* Smooth transition for hover brightness */
    z-index: 3; /* Above loading animation (z-index: 2) but below play button (z-index: 10) */
}

/* Hide broken image icon if the image fails to load */
.edixer-yt-card-thumbnail img:error {
    visibility: hidden;
}

.edixer-yt-card-content {
    background: linear-gradient(140deg, rgba(74, 96, 226, 0.9) 0%, rgba(161, 86, 218, 0.9) 100%);
    padding: 50px 22px 15px;
    border-radius: 30px;
    color: #fff;
    margin-top: -50px;
    position: relative;
    z-index: -1;
    contain: layout style paint;
    min-height: 180px; /* Add minimum height to ensure consistent card size */
}

/* Remove ::before pseudo element to avoid extra painting */
.edixer-yt-card-content::before {
    display: none;
}

.edixer-yt-card-header {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
    contain: layout style paint;
}

.edixer-yt-card-header * {
    margin: 0;
}

/* Video card link styles */
.edixer-yt-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.edixer-yt-card-profile-link {
    text-decoration: none;
    cursor: pointer;
    z-index: 10;
    position: relative;
}

.edixer-yt-card-profile {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 16px;
    border: 2px solid rgba(255, 255, 255, 0.9);
    flex-shrink: 0;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    position: relative;
}

.edixer-yt-card-profile::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.edixer-yt-card-profile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

/* REMOVED: Scale transform for better performance */
.edixer-yt-card:hover .edixer-yt-card-profile img,
.edixer-yt-card-profile-link:hover .edixer-yt-card-profile img {
    opacity: 0.9; /* Simple opacity change instead of scale */
}

.edixer-yt-card-title {
    margin: 0 !important;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    height: 48px;
    max-height: 48px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    text-overflow: ellipsis !important;
    color: #ffffff;
    text-transform: uppercase;
    flex: 1;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    letter-spacing: 0.5px;
    text-rendering: optimizeSpeed;
    padding: 0 2px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    white-space: normal;
    word-wrap: break-word;
    position: relative;
}

/* Force single line titles to stay within bounds */
.edixer-yt-card-title:not(:has(br)) {
    -webkit-line-clamp: 2 !important;
    max-height: 48px !important;
}

/* Remove any potential line breaks */
.edixer-yt-card-title br {
    display: none !important;
}

.edixer-yt-card-meta {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.95);
    align-items: center;
    margin-bottom: 5px;
    contain: layout style paint;
}

.edixer-yt-card-stats {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.edixer-yt-card-stat {
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    background: rgba(255, 255, 255, 0.15);
    padding: 6px 10px;
    border-radius: 30px;
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.edixer-yt-card:hover .edixer-yt-card-stat {
    background: rgba(255, 255, 255, 0.2);
}

.edixer-yt-card-stat svg {
    width: 16px;
    height: 16px;
    fill: #fff;
    opacity: 0.9;
}

.edixer-yt-card-rank {
    position: absolute;
    bottom: 15px;
    right: 22px;
    font-size: 60px;
    font-weight: 900;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    opacity: 0.9;
    line-height: 1;
    background: none; /* Remove any background */
}

.edixer-yt-card-rank span {
    font-size: 20px;
    vertical-align: super;
    margin-left: 2px;
    font-weight: 700;
}

.edixer-yt-card-rank::before {
    display: none; /* Remove the box/square */
}

.edixer-yt-loadmore-container {
    text-align: center;
    margin-top: 40px;
    margin-bottom: 50px;
    /* REMOVED: content-visibility: auto; - CAUSED VISIBILITY ISSUES */
    contain: layout style;
    padding: 15px;
}

.edixer-yt-loadmore {
    display: inline-block;
    padding: 15px 42px;
    background: #6756b4;
    color: #fff;
    border: none;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 5px 10px rgba(44, 105, 209, 0.3);
    position: relative;
    overflow: hidden;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Remove the ::before pseudo element */
.edixer-yt-loadmore::before {
    display: none;
}

.edixer-yt-loadmore:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 15px rgba(44, 105, 209, 0.4);
}

.edixer-yt-loadmore.is-loading {
    opacity: 0.8;
    pointer-events: none;
    box-shadow: 0 4px 12px rgba(44, 105, 209, 0.3);
    transform: translateY(0);
}

/* Total Count Shortcode */
.edixer-yt-total-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 30px;
    width: 100%;
    position: relative;
    border-radius: 35px;
    margin-bottom: 40px;
    overflow: hidden;
    perspective: 1000px;
}

/* Parallax elements within total container */
.edixer-yt-total-container .edixer-yt-total-title,
.edixer-yt-total-container .edixer-yt-controls-container,
.edixer-yt-total-container .edixer-yt-main-metrics,
.edixer-yt-total-container .edixer-yt-additional-stats,
.edixer-yt-total-container .edixer-next-update {
    position: relative;
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Adjust z-index for proper layering */
.edixer-yt-total-container .edixer-yt-total-title {
    z-index: 3;
}

.edixer-yt-total-container .edixer-yt-controls-container {
    z-index: 2;
}

.edixer-yt-total-container .edixer-yt-main-metrics {
    z-index: 1;
}

.edixer-yt-total-container .edixer-yt-additional-stats {
    z-index: 2;
}

.edixer-yt-total-container .edixer-next-update {
    z-index: 3;
}

/* REMOVED ::before rule for total container background orbs */
/* .edixer-yt-total-container::before { ... } */

/* Section title - "COUNTING LOVES" */
.edixer-yt-total-title {
    font-size: 80px;
    font-weight: 900;
    letter-spacing: 2px;
    background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    text-align: center;
    margin-bottom: 25px;
    text-transform: uppercase;
    font-family: 'LEMON TUESDAY', 'Arial', sans-serif;
    width: 100%;
    text-shadow: 0 4px 6px rgba(0,0,0,0.2);
    filter: drop-shadow(0 8px 12px rgba(0,0,0,0.15));
    animation: title-glow 3s ease-in-out infinite alternate;
}

/* Heart animation for the 'O' in LOVE */
.edixer-yt-heart {
    display: inline-block;
    margin: 0 2px;
    vertical-align: -0.1em;
    line-height: 1;
}

.edixer-yt-heart svg {
    width: 0.8em;
    height: 0.8em;
    color: #ff3841;
    animation: heart-beat 1.5s ease-in-out infinite;
    transform-origin: center;
    filter: drop-shadow(0 0 4px rgba(255, 56, 65, 0.6));
}

@keyframes heart-beat {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Container for verified section and filter */
.edixer-yt-controls-container {
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}

/* Verification section - Updated with more specific classes */
.edixer-yt-verified-section {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 0;
    padding: 6px 15px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 35px;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.3);
    width: fit-content;
}

/* Make verified icon more specific */
.edixer-yt-verified-section .edixer-verified-icon {
    display: flex;
    align-items: center;
    color: #1d9bf0;
}

/* Make SVG more specific */
.edixer-yt-verified-section .edixer-verified-icon svg.edixer-verified-svg {
    width: 20px;
    height: 20px;
    margin-right: 6px;
    fill: #1d9bf0;
}

/* Make separator more specific */
.edixer-yt-verified-section .edixer-verified-separator {
    height: 20px;
    width: 1px;
    background: rgba(0, 0, 0, 0.2);
    margin: 0 4px;
}

/* Make social icons container more specific */
.edixer-yt-verified-section .edixer-verified-social-icons {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Make social icons SVG more specific */
.edixer-yt-verified-section .edixer-verified-social-icons svg.edixer-social-svg {
    width: 20px;
    height: 20px;
    transition: transform 0.2s ease;
}

.edixer-yt-verified-section .edixer-verified-social-icons svg.edixer-social-svg:hover {
    transform: scale(1.1);
}

/* Update period selector styles */
.edixer-yt-period-selector {
    margin: 0;
    padding: 5px;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 35px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.3);
    display: inline-flex;
}

.edixer-yt-period-button {
    padding: 7px 18px;
    font-size: 13px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-weight: 600;
    color: #334155;
    border-radius: 30px;
    transition: all 0.7s ease;
    position: relative;
    z-index: 1;
}

.edixer-yt-period-button:hover {
    color: #000;
    background-color: rgba(255, 255, 255, 0.4);
}

.edixer-yt-period-button.active {
    background: #ff4d54;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(255, 77, 84, 0.25);
}

/* Main metrics container */
.edixer-yt-main-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-bottom: 50px;
    max-width: 1050px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

/* Style for when the billions column is present */
.edixer-yt-main-metrics:has(.edixer-yt-billion-column) {
    grid-template-columns: repeat(4, 1fr);
    max-width: 1250px;
}

.edixer-yt-metric-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #f0f4ff;
    border-radius: 30px;
    padding: 30px 15px;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    position: relative;
    transition: transform 0.7s ease, box-shadow 0.4s ease;
    border-top: 2px solid #fff;
}

.edixer-yt-metric-column:hover {
    transform: translateY(-8px);
}

.edixer-yt-metric-column::after {
    display: none;
}

.edixer-yt-metric-column:nth-child(1) {
    background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, rgba(236,253,245,0.4) 100%);
}

.edixer-yt-metric-column:nth-child(2) {
    background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, rgba(239,246,255,0.4) 100%);
}

.edixer-yt-metric-column:nth-child(3) {
    background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, rgba(254,242,242,0.4) 100%);
}

.edixer-yt-metric-value {
    font-size: 115px;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 0px;
    font-family: 'Arial Black', 'Arial Bold', sans-serif;
    width: 100%;
    text-align: center;
    position: relative;
    z-index: 1;
    color: #1e293b;
    white-space: nowrap;
    overflow: visible;
}

.edixer-yt-metric-label {
    font-size: 18px;
    color: #7a7f99;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-top: 10px;
    line-height: 1.2;
}

/* Additional stats container */
.edixer-yt-additional-stats {
    display: flex;
    justify-content: center;
    gap: 35px;
    width: 100%;
    max-width: 850px;
    margin: 25px 0 60px 0;
}

.edixer-yt-stat-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 180px;
    flex: 1;
    padding: 30px 25px;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
    border-radius: 30px;
    position: relative;
    overflow: hidden;
    background: #5d50e6;
    transition: transform 0.7s, box-shadow 0.4s;
}

.edixer-yt-stat-box:hover {
    transform: translateY(-5px);
}

.edixer-yt-stat-box:nth-child(1) {
    background: linear-gradient(135deg, #6059c5 0%, #5d00ff 100%);
    animation-delay: 0s;
}

.edixer-yt-stat-box:nth-child(2) {
    background: linear-gradient(135deg, #63a4c5 0%, #00aaff 100%);
    animation-delay: 1s;
}

.edixer-yt-stat-box:nth-child(3) {
    background: linear-gradient(135deg, #ca763b 0%, #ff5900 100%);
    animation-delay: 2s;
}

.edixer-yt-stat-box::before {
    display: none;
}

.edixer-yt-stat-value {
    font-size: 55px;
    font-weight: 800;
    color: #FFFFFF;
    margin-bottom: 8px;
    font-family: 'Arial Black', 'Arial Bold', sans-serif;
    text-align: center;
    position: relative;
    z-index: 1;
    text-shadow: 0 3px 6px rgba(0,0,0,0.25);
}

.edixer-yt-stat-label {
    font-size: 17px;
    color: rgba(255,255,255,0.95);
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 600;
    font-family: 'Arial', sans-serif;
    text-align: center;
    position: relative;
    z-index: 1;
}

/* === Client Shortcode Redesign (V3 - IMAGE MATCH - Revision 2) === */

/* Overall container and slider */
.edixer-clients-container-v3 {
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    background: #5ce1e6;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to top, #bedfff, #5ce1e6);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to top, #bedfff, #5ce1e6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    padding: 40px 20px 0;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 0 !important;
    border-radius: 35px 35px 0 0;
    box-shadow: 
  rgba(92, 225, 230, 0.4) 0px -15px,
  rgba(92, 225, 230, 0.3) 0px -25px,
  rgba(92, 225, 230, 0.2) 0px -35px,
  rgba(92, 225, 230, 0.1) 0px -45px,
  rgba(92, 225, 230, 0.05) 0px -55px,
  rgba(190, 222, 255, 0.76) 0px 10px,
  rgba(190, 222, 255, 0.537) 0px 20px,
  rgba(190, 223, 255, 0.322) 0px 30px,
  rgba(190, 223, 255, 0.15) 0px 40px,
  rgba(190, 223, 255, 0.05) 0px 50px;    
  box-sizing: border-box !important;
  z-index: 1;
}

/* No clients message styling */
.edixer-no-clients-message {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    color: #b00 !important;
    font-size: 22px !important;
    margin: 40px 0 !important;
    font-weight: 700 !important;
    box-sizing: border-box !important;
}

.edixer-clients-slider-v3 {
    display: flex;
    width: 100%; 
    overflow-x: auto;
    scroll-behavior: smooth;
    padding: 150px 20px 40px 20px !important; 
    margin: 0 -20px; 
    scrollbar-width: none; 
    -ms-overflow-style: none; 
    background: transparent; 
    border: none;
    box-shadow: none;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

/* Hide default slider arrows if not needed */
.edixer-slider-nav-v3 {
    display: none; 
}

/* V3 Card - Precise Styling & Premium Effects */
.edixer-client-card-v3 {
    min-width: 310px; 
    width: 310px;
    margin: 0 15px; 
    border-radius: 55px; 
    position: relative;
    background: #7667d5;
    box-shadow: 0 8px 15px rgba(74, 96, 226, 0.2);
    padding-top: 80px; 
    color: #fff; 
    border: 1px solid rgba(255, 255, 255, 0.15); 
    scroll-snap-align: center;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.edixer-client-card-v3:hover {
    transform: translateY(-5px);
}

/* V3 Avatar - Precise Styling */
.edixer-client-avatar-container-v3 {
    position: absolute;
    top: -75px;
    left: 50%;
    transform: translateX(-50%);
    width: 150px;
    height: 150px;
    z-index: 10; 
}

.edixer-client-avatar-v3 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    background: #fff; 
    padding: 5px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); 
}

.edixer-client-avatar-v3 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%; 
}

.edixer-client-avatar-placeholder-v3 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 45px;
    font-weight: bold;
    color: #ddd;
    background-color: #f0f0f0;
    border-radius: 50%;
}

/* V3 Verified Badge - Precise Styling */
.edixer-client-verified-badge-v3 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 32px;
    height: 32px;
    background: #fff;
    border-radius: 50%; 
    display: flex; 
    align-items: center;
    justify-content: center;
    border: 2px solid #4a60e2;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.edixer-client-verified-badge-v3 svg {
    width: 20px;
    height: 20px;
    fill: #1d9bf0;
}

/* V3 Info Block */
.edixer-client-info-v3 {
    padding: 20px 25px 25px 25px;
    text-align: center;
}

.edixer-client-name-v3 {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 8px 0;
    line-height: 1;
    color: #fff;
}

/* V3 Subscriber Pill - Precise Styling */
.edixer-client-subs-pill-v3 {
    display: inline-block;
    background-color: #ef4444; 
    color: #fff;
    padding: 7px 18px;
    border-radius: 99px;
    font-size: 15px; 
    font-weight: 700;
    margin-bottom: 14px;
    box-shadow: none; 
}

.edixer-client-subs-pill-v3 .edixer-counter {
    display: inline-block;
}

/* V3 Joined Info - Precise Styling */
.edixer-client-joined-info-v3 {
    font-family: system-ui, sans-serif;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 20px;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: 1.5;
    text-transform: uppercase;
}

/* V3 Stats - Updated Design */
.edixer-client-stats-v3 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 25px;
    padding: 12px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    gap: 20px;
}

.edixer-client-stat-item-v3 {
    flex: 1;
    text-align: left;
}

.edixer-stat-label-v3 {
    display: block;
    font-family: system-ui, sans-serif;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    font-weight: 600;
    position: relative;
}

.edixer-stat-label-v3:has(.tooltip) {
    cursor: help;
}

.edixer-stat-label-v3 .tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 12px;
    background: #ffd700;
    color: #000;
    font-size: 9px;
    border-radius: 50px;
    white-space: normal;
    width: 120px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    margin-bottom: -2px;
    z-index: 1000;
    line-height: 1.2;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    text-align: center;
}

.edixer-stat-label-v3 .tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: #ffd700 transparent transparent transparent;
}

.edixer-stat-label-v3:hover .tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-5px);
}

@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(-5px);
    }
}

@keyframes tooltipFadeOut {
    from {
        opacity: 1;
        transform: translateX(-50%) translateY(-5px);
    }
    to {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }
}

.edixer-stat-label-v3:hover .tooltip {
    animation: tooltipFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.edixer-stat-label-v3:not(:hover) .tooltip {
    animation: tooltipFadeOut 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.edixer-stat-values-v3 {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.edixer-stat-row-v3 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.stat-icon-v3 {
    width: 18px;
    height: 18px;
    fill: #a7f3d0;
}

.edixer-stat-value-v3 {
    font-family: system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
}

.edixer-stat-value-v3.positive {
    color: #a7f3d0;
}

/* Buttons Container */
.edixer-client-buttons-v3 {
    display: flex;
    gap: 12px;
    justify-content: center;
}

/* Visit YouTube Button - Updated */
.edixer-client-visit-btn-v3 {
    display: inline-block;
    padding: 11px 24px;
    font-family: system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #4a60e2;
    background-color: #e8eafc;
    border: none;
    border-radius: 25px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    transition: transform 0.3s ease, background-color 0.3s ease;
    will-change: transform, background-color;
}

/* See All Videos Button */
.edixer-client-videos-btn-v3 {
    display: inline-block;
    padding: 11px 24px;
    font-family: system-ui, sans-serif;
    font-size: 13px;
    font-weight: 700;
    color: #e8eafc;
    background-color: transparent;
    border: 1px solid #e8eafc;
    border-radius: 25px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    transition: transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
    will-change: transform, background-color, color;
}

.edixer-client-visit-btn-v3:hover,
.edixer-client-videos-btn-v3:hover {
    background-color: #fff;
    color: #4a60e2;
    transform: translateY(-2px);
}

.edixer-client-videos-btn-v3:hover {
    background-color: #e8eafc;
}

/* Responsive Adjustments */
@media screen and (max-width: 768px) {
    .edixer-client-stats-v3 {
        flex-direction: column;
        gap: 15px;
        margin: 0 0 25px 0 !important;
    }

    .edixer-client-buttons-v3 {
        flex-direction: column;
    }

    .edixer-client-visit-btn-v3,
    .edixer-client-videos-btn-v3 {
        width: 100%;
        text-align: center;
    }
}

/* Hide V1/V2 Styles */
.edixer-clients-growth-v2, 
.edixer-clients-slider-container-v2, 
.edixer-clients-slider-v2, 
.edixer-client-card-v2,
/* ... (all other v2 classes) ... */
.edixer-slider-nav-v2, 
.edixer-clients-growth, 
.edixer-clients-slider-container, 
.edixer-clients-slider, 
.edixer-client-card,
/* ... (all other v1 classes) ... */
.edixer-slider-next { 
    display: none !important; 
} 

/* === V3 Client Shortcode Responsive === */

@media screen and (max-width: 992px) {
    .edixer-client-card-v3 {
        min-width: 290px; 
        width: 290px;
    }
}

@media screen and (max-width: 768px) {
    .edixer-clients-container-v3 {
        padding: 30px 15px;
    }

    .edixer-clients-slider-v3 {
        padding: 70px 10px 30px 10px;
        margin: 0 -10px; 
    }

    .edixer-client-card-v3 {
        min-width: 260px; 
        width: 260px;
        border-radius: 30px;
        padding-top: 60px; 
    }

    .edixer-client-avatar-container-v3 {
        top: -55px; 
        width: 110px; 
        height: 110px;
    }

    .edixer-client-avatar-v3 {
        padding: 6px;
    }
    
    .edixer-client-avatar-placeholder-v3 {
        font-size: 40px;
    }

    .edixer-client-verified-badge-v3 {
        bottom: 4px; 
        left: 6px;  
        width: 30px; 
        height: 30px;
        border-width: 2px;
    }

    .edixer-client-verified-badge-v3 svg {
        width: 16px; 
        height: 16px;
    }

    .edixer-client-info-v3 {
        padding: 15px 20px 20px 20px; 
    }

    .edixer-client-name-v3 {
        font-size: 18px; 
    }

    .edixer-client-subs-pill-v3 {
        font-size: 14px; 
        padding: 5px 14px; 
        margin-bottom: 10px;
    }

    .edixer-client-joined-info-v3 {
        font-size: 11px; 
        margin-bottom: 15px;
    }

    .edixer-client-stats-v3 {
        margin-bottom: 20px; 
        padding: 10px 0;
    }

    .edixer-stat-label-v3 {
        font-size: 9px; 
    }

    .edixer-stat-value-v3 {
        font-size: 15px;
    }

    .edixer-client-visit-btn-v3 {
        font-size: 12px; 
        padding: 9px 22px; 
    }
}

@media screen and (max-width: 480px) {
    .edixer-clients-slider-v3 {
        padding: 180px 5px 25px 5px !important;
        margin: 0 -5px; 
    }

    .edixer-client-card-v3 {
        min-width: 240px; 
        width: 240px;
        border-radius: 45px;
        padding-top: 50px; 
    }

    .edixer-client-avatar-container-v3 {
        top: -115px; 
        width: 150px; 
        height: 150px;
    }

    .edixer-client-avatar-v3 {
        padding: 4px; 
    }
    
    .edixer-client-avatar-placeholder-v3 {
        font-size: 35px;
    }

    .edixer-client-verified-badge-v3 {
        bottom: 2px; 
        left: 4px;  
        width: 26px; 
        height: 26px;
    }

    .edixer-client-verified-badge-v3 svg {
        width: 14px; 
        height: 14px;
    }

    .edixer-client-name-v3 {
        font-size: 22px; 
        margin-bottom: 30px !important;
    }

    .edixer-client-subs-pill-v3 {
        font-size: 16px; 
        padding: 5px 25px;
        margin-bottom: 20px !important; 
    }

    .edixer-client-joined-info-v3 {
        font-size: 12px;
        margin-bottom: 45px; 
    }

    .edixer-stat-value-v3 {
        font-size: 14px;
    }
     .edixer-stat-label-v3 {
        font-size: 8px; 
    }

    .edixer-client-visit-btn-v3 {
        font-size: 11px; 
        padding: 8px 18px; 
    }
} 

/* === Total Count Responsive (FINAL MOBILE ATTEMPT) === */

/* --- Mobile Layout (<= 767px) --- */
@media screen and (max-width: 767px) {
    .edixer-yt-total-container {
        padding: 40px 15px;
        border-radius: 30px;
    }
    .edixer-yt-total-title {
        font-size: 32px;
    }
    .edixer-yt-controls-container {
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-bottom: 30px;
    }
    .edixer-yt-period-button {
        font-size: 10px;
        padding: 6px 14px;
    }

    /* --- Views Grid Responsive Logic --- */
    
    /* Default 2-column base for mobile */
    .edixer-yt-main-metrics {
        display: grid; 
        grid-template-columns: 1fr 1fr;
        max-width: 80%; 
        gap: 15px;
        margin-bottom: 40px;
    }
    
    /* IF Billions NOT present: Make Millions (first item) full width */
    .edixer-yt-main-metrics:not(:has(.edixer-yt-billion-column)) .edixer-yt-metric-column:nth-child(1) {
        grid-column: 1 / 3; 
    }

    /* IF Billions ARE present: Ensure 2x2 layout */
    .edixer-yt-main-metrics:has(.edixer-yt-billion-column) {
        grid-template-columns: repeat(2, 1fr);
    }

    /* IF Billions NOT present: Make Millions (first item) number LARGER */
    .edixer-yt-main-metrics:not(:has(.edixer-yt-billion-column)) .edixer-yt-metric-column:nth-child(1) .edixer-yt-metric-value {
        font-size: 65px;
    }

    /* General styles for metric columns and text on mobile */
    .edixer-yt-metric-column {
        padding: 20px 10px;
        border-radius: 25px;
    }
    .edixer-yt-metric-value {
        font-size: 50px; 
        word-break: break-all;
    }
    .edixer-yt-metric-label {
        font-size: 12px; 
    }

    /* Additional Stats: 1 / 23 Layout */
    .edixer-yt-additional-stats {
        display: grid;
        grid-template-columns: 1fr 1fr;
        max-width: 450px; 
        gap: 15px;
        width: 80%;
    }
    .edixer-yt-stat-box:nth-child(1) {
        grid-column: 1 / 3;
    }
    .edixer-yt-stat-box:nth-child(2) {
        grid-column: 1 / 2;
    }
    .edixer-yt-stat-box:nth-child(3) {
        grid-column: 2 / 3;
    }
    .edixer-yt-stat-box {
        padding: 20px;
        border-radius: 25px;
        width: auto;
    }
    .edixer-yt-stat-value {
        font-size: 50px;
    }
    .edixer-yt-stat-label {
        font-size: 14px;
    }
}

/* --- Add styles for LARGER screens if needed, but mobile is priority --- */
/* @media screen and (min-width: 768px) { ... } */ 

/* RESPONSIVE GRID SYSTEM FOR VIDEO CARDS */
/* Ultrawide screens (≥1600px): 5 columns */
@media screen and (min-width: 1600px) {
    .edixer-yt-ranked-container {
        grid-template-columns: repeat(5, 1fr);
        padding: 50px;
    }
}

/* Mid & Big Tablets: 3 columns */
@media screen and (max-width: 1199px) {
    .edixer-yt-ranked-container {
        grid-template-columns: repeat(3, 1fr);
        padding: 35px;
    }
}

/* Small Tablet: 2 columns */
@media screen and (max-width: 768px) {
    .edixer-yt-ranked-container {
        grid-template-columns: repeat(2, 1fr);
        padding: 30px;
    }
}

/* Mobile: 1 column */
@media screen and (max-width: 576px) {
    .edixer-yt-ranked-container {
        grid-template-columns: 1fr;
        padding: 20px;
    }
}

@media screen and (max-width: 767px) {
    .edixer-yt-card-header {
        flex-direction: row;
        align-items: center;
    }
    
    .edixer-yt-card-profile {
        margin-bottom: 0;
        margin-right: 15px;
        width: 45px;
        height: 45px;
    }
    
    .edixer-yt-card-play {
        width: 60px;
        height: 60px;
    }
    
    .edixer-yt-card-play svg {
        width: 25px;
        height: 25px;
    }
    
    .edixer-yt-card-stats {
        gap: 8px;
    }
    
    .edixer-yt-card-stat {
        padding: 4px 8px;
    }
    
    .edixer-yt-card-title {
        font-size: 14px;
        max-height: 40px;
    }
}

/* Add an edixer-spinner class for the load more button */
.edixer-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    transform: translateZ(0);
    margin-right: 8px;
    vertical-align: middle;
}

@keyframes edixer-spin {
    to { transform: rotate(360deg) translateZ(0); }
}

.edixer-yt-hire {
    background: linear-gradient(135deg, #2c69d1 0%, #a742c6 100%);
}

/* Add glass morphism effect to stats */
.edixer-yt-card-stat {
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

@media screen and (max-width: 767px) {
    .edixer-yt-card-rank {
        bottom: 32px;
        font-size: 50px;
        right: 18px;
    }
} 

/* Load More Button Styles */
.edixer-yt-loadmore-container,
.edixer-load-more-container {
    display: none; /* Changed from flex to none to hide the button */
}

.edixer-yt-loadmore,
.edixer-load-more-button {
    display: none; /* Added to ensure the button is hidden */
}

/* Hide the spinner for load more as well */
.edixer-spinner {
    display: none;
}

/* Spinner for load more */
.edixer-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    transform: translateZ(0);
    margin-right: 8px;
    vertical-align: middle;
}

@keyframes edixer-spin {
    to { transform: rotate(360deg) translateZ(0); }
}

.edixer-yt-ranked-title {
    text-align: center;
    margin-bottom: 40px;
}

.edixer-yt-ranked-title h2 {
    font-family: 'LEMON TUESDAY', sans-serif;
    font-size: 80px;
    font-weight: 900;
    letter-spacing: 2px;
    background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    text-transform: uppercase;
    text-shadow: 0 4px 6px rgba(0,0,0,0.2);
    filter: drop-shadow(0 8px 12px rgba(0,0,0,0.15));
}

.edixer-yt-ranked-subtitle {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #64748b;
    margin: 10px 0 0 0;
    text-align: center;
    font-style: italic;
    letter-spacing: 0.5px;
}

.edixer-fire-emoji {
    display: inline-flex;
    font-size: 70px;
    line-height: 1;
    margin: 0 -2px;
    color: #de3b67;
}

/* Simplify animation keyframes */
@keyframes fire-burst {
    0%, 100% {
        transform: none;
    }
}

@keyframes title-glow {
    0%, 100% {
        text-shadow: none;
    }
}

@media screen and (max-width: 767px) {
    .edixer-yt-ranked-title h2 {
        font-size: 48px;
    }
    .edixer-yt-ranked-subtitle {
        font-size: 16px;
    }
    .edixer-fire-emoji {
        font-size: 42px;
    }
}

@media screen and (max-width: 576px) {
    .edixer-yt-ranked-title h2 {
        font-size: 36px;
    }
    .edixer-yt-ranked-subtitle {
        font-size: 14px;
        letter-spacing: 0.3px;
    }
    .edixer-fire-emoji {
        font-size: 32px;
    }
}

/* Main container for BOOMING section */
.edixer-yt-ranked-main-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 60px 30px;
    width: 100%;
    position: relative;
    border-radius: 35px;
    margin-bottom: 40px;
    /* REMOVED: content-visibility: auto; - CAUSED CONTAINER TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 1200px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

/* Adjust existing title margin for new container */
.edixer-yt-ranked-title {
    text-align: center;
    margin-bottom: 0px;
}

/* Adjust existing container margin */
.edixer-yt-ranked-container {
    margin-bottom: 0;
    /* REMOVED: content-visibility: auto; - CAUSED VIDEO CARDS TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 800px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

/* Adjust existing load more container margin */
.edixer-yt-loadmore-container {
    margin: 0;
}

@media screen and (max-width: 767px) {
    .edixer-yt-ranked-main-container {
        padding: 40px 15px;
        border-radius: 30px;
    }
}

@media screen and (max-width: 576px) {
    .edixer-yt-ranked-main-container {
        padding: 30px 10px;
        border-radius: 25px;
    }
} 

/* FIXED: Hide only the 3rd stat (publish date) on mobile devices, not the last child */
@media screen and (max-width: 576px) {
    .edixer-yt-card-stat:nth-child(3) {
        display: none;
    }

    /* Mobile-specific adjustments for video cards */
    .edixer-yt-card-content {
        min-height: 145px;
    }

    .edixer-yt-card-rank {
        bottom: 15px;
    }

    .edixer-yt-card-title {
        font-size: 16px;
    }
}

/* Main container for EDIT VAULT section */
.edixer-yt-all-main-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%);
    padding: 60px 30px;
    width: 100%;
    position: relative;
    border-radius: 35px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
    margin-bottom: 40px;
    /* REMOVED: content-visibility: auto; - CAUSED CONTAINER TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 1200px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

/* Title styles for EDIT VAULT */
.edixer-yt-all-title {
    text-align: center;
    margin-bottom: 40px;
}

.edixer-yt-all-title h2 {
    font-family: 'LEMON TUESDAY', sans-serif;
    font-size: 80px;
    font-weight: 900;
    letter-spacing: 2px;
    background: linear-gradient(135deg, #6366f1 0%, #ec4899 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 2px;
    text-transform: uppercase;
    text-shadow: 0 4px 6px rgba(0,0,0,0.2);
    filter: drop-shadow(0 8px 12px rgba(0,0,0,0.15));
}

.edixer-yt-all-title .vault-icon {
    display: inline-flex;
    width: 70px;
    height: 70px;
    margin: 0 -2px;
    color: #de3b67;
}

@keyframes vault-pulse {
    0%, 100% {
        transform: none;
    }
}

/* Adjust existing container margin */
.edixer-yt-all-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    /* REMOVED: content-visibility: auto; - CAUSED VIDEO CARDS TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 800px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

@media screen and (max-width: 1200px) {
    .edixer-yt-all-container {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width: 992px) {
    .edixer-yt-all-container {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 576px) {
    .edixer-yt-all-container {
        grid-template-columns: 1fr;
    }
}

/* Adjust existing load more container margin */
.edixer-yt-all-loadmore-container {
    margin: 0;
}

@media screen and (max-width: 767px) {
    .edixer-yt-all-main-container {
        padding: 40px 15px;
        border-radius: 30px;
    }
    .edixer-yt-all-title h2 {
        font-size: 48px;
    }
    .edixer-yt-all-title .vault-icon {
        width: 42px;
        height: 42px;
    }
}

@media screen and (max-width: 576px) {
    .edixer-yt-all-main-container {
        padding: 30px 10px;
        border-radius: 25px;
    }
    .edixer-yt-all-title h2 {
        font-size: 36px;
    }
    .edixer-yt-all-title .vault-icon {
        width: 32px;
        height: 32px;
    }
}

/* FIXED: Hide only the 3rd stat (publish date) on mobile devices, not the last child */
@media screen and (max-width: 576px) {
    .edixer-yt-card-stat:nth-child(3) {
        display: none;
    }
}

/* Apply critical performance optimizations */
.edixer-yt-ranked-main-container,
.edixer-yt-all-main-container {
    /* REMOVED: content-visibility: auto; - CAUSED CONTAINERS TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 1200px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

/* Optimize all images with decoding async */
img {
    decoding: async;
    /* REMOVED: content-visibility: auto; - CAUSED IMAGES TO DISAPPEAR */
}

/* Optimize container elements */
.edixer-yt-ranked-container,
.edixer-yt-all-container {
    /* REMOVED: content-visibility: auto; - CAUSED VIDEO CARDS TO DISAPPEAR */
    /* REMOVED: contain-intrinsic-size: 800px; - NOT NEEDED WITHOUT content-visibility */
    contain: content;
}

/* Force hardware acceleration but prevent excessive memory usage */
.edixer-yt-card-thumbnail img {
    backface-visibility: hidden;
    transform: translateZ(0);
}

/* Make containing boxes self-contained to prevent layout shifts */
.edixer-yt-card-content,
.edixer-yt-card-header,
.edixer-yt-card-meta,
.edixer-yt-card-stats {
    contain: layout style paint;
}

/* Optimize load more container */
.edixer-yt-loadmore-container {
    /* REMOVED: content-visibility: auto; - CAUSED LOAD MORE BUTTON TO DISAPPEAR */
    contain: layout style;
}

/* Prevent expensive text rendering */
.edixer-yt-card-title {
    text-rendering: optimizeSpeed;
}

/* Optimize all animations to use transform and opacity only */
/* REMOVED: Another duplicate hover rule - consolidated above */

/* Video Duration Stats */
.edixer-video-duration-stats {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 0px;
    padding: 5px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    backdrop-filter: blur(10px);
}

.edixer-duration-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

.edixer-duration-count {
    font-family: 'Arial Black', 'Arial Bold', sans-serif;
    font-size: 36px;
    font-weight: 900;
    color: #7e3bac;
    text-shadow: 0 2px 3px rgba(0,0,0,0.15);
}

.edixer-duration-label {
    font-size: 14px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 1px;
}

@media screen and (max-width: 767px) {
    .edixer-video-duration-stats {
        flex-direction: column;
        gap: 20px;
        padding: 15px;
    }
    
    .edixer-duration-count {
        font-size: 28px;
    }
    
    .edixer-duration-label {
        font-size: 12px;
    }
} 

.edixer-vault-icon {
    display: inline-block;
    margin: 0;
    vertical-align: -0.1em;
    line-height: 1;
}

.edixer-vault-icon svg {
    width: 0.8em;
    height: 0.8em;
    color: #ff3841;
    animation: heart-beat 1.5s ease-in-out infinite;
    transform-origin: center;
    filter: drop-shadow(0 0 4px rgba(255, 56, 65, 0.6));
}

.edixer-stat-row-v3 svg.instagram-icon {
    width: 20px;
    height: 20px;
    fill: currentColor;
    color: #fff;
    opacity: 0.9;
}

.edixer-stat-row-v3 svg.instagram-icon path {
    fill: currentColor;
}

.edixer-yt-video-stats {
    display: flex;
    justify-content: center;
    gap: 0px;
    margin: 30px 30px 0;
    
    
    text-align: center;
    

}

.edixer-yt-video-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 25px;
    margin: 0 5px;
    padding: 25px 35px;
}

@media screen and (max-width: 767px) {
    .edixer-yt-video-stat {
        padding: 20px 15px;
    }
}

.edixer-yt-video-stat-value {
    font-size: 36px;
    font-weight: 900;
    color: #817d7d;
    text-shadow: 0 2px 3px rgba(0,0,0,0.15);
    font-family: 'Arial Black', 'Arial Bold', sans-serif;
}

@media screen and (max-width: 767px) {
    .edixer-yt-video-stat-value {
        font-size: 22px;
    }
}

.edixer-yt-video-stat-label {
    font-size: 14px;
    font-weight: 600;
    color: #817d7d;
    margin-top: 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
} 

@media screen and (max-width: 767px) {
    .edixer-yt-video-stat-label {
        font-size: 10px;
    }
}

.edixer-slide-indicators-v3 {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    position: relative;
    width: 200px;
    height: 4px;
    background: rgba(74, 96, 226, 0.1);
    border-radius: 2px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.edixer-slide-indicator-v3 {
    display: none;
}

.edixer-slide-progress-v3 {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: linear-gradient(140deg, rgba(74, 96, 226, 0.9) 0%, rgba(161, 86, 218, 0.9) 100%);
    border-radius: 2px;
    transition: width 0.3s ease, transform 0.3s ease;
}

@media screen and (max-width: 767px) {
    .edixer-slide-indicators-v3 {
        width: 150px;
    }
}

/* Video card visibility transitions - ENABLE ANIMATIONS */
.edixer-yt-card {
    /* INITIAL STATE: Hidden for animations */
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Initial load animation */
.edixer-yt-card.edixer-initial-load.edixer-animate-in {
    opacity: 1;
    transform: translateY(0);
}

.edixer-yt-card-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.2s ease-out;
}

/* Optimize transitions for better performance */
.edixer-yt-card {
    will-change: opacity;
    backface-visibility: hidden;
}

/* Disable transitions when reduced motion is preferred */
@media (prefers-reduced-motion: reduce) {
    .edixer-yt-card,
    .edixer-yt-card-visible {
        transition: none;
    }
} 

/* OPTIMIZED: Faster transitions for better performance */
.edixer-yt-ranked-container .edixer-yt-card,
.edixer-yt-all-container .edixer-yt-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease !important;
}

/* OPTIMIZED HOVER: Simplified effects for better performance */
.edixer-yt-ranked-container .edixer-yt-card:hover,
.edixer-yt-all-container .edixer-yt-card:hover,
.edixer-yt-ranked-container .edixer-yt-card.edixer-force-hover,
.edixer-yt-all-container .edixer-yt-card.edixer-force-hover {
    transform: translateZ(0) !important; /* Hardware acceleration only */
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.2); /* Reduced shadow complexity */
    opacity: 0.95; /* Simple opacity change */
}

/* Force hover styles for other elements */
.edixer-yt-card.edixer-force-hover .edixer-yt-card-thumbnail {
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.25);
}

.edixer-yt-card.edixer-force-hover .edixer-yt-card-play-new {
    opacity: 1;
    transform: translate(-50%, -50%); /* REMOVED scale(1.1) */
    background: rgba(255, 255, 255, 0.15); /* Slightly more opaque */
    border-color: rgba(255, 255, 255, 0.35); /* Brighter border */
}

.edixer-yt-card.edixer-force-hover .edixer-yt-card-play-new::before {
    border-left-color: rgba(255, 255, 255, 1);
    /* REMOVED: transform: scale(1.1); */
}

/* REMOVED: Scale transform for better performance */
.edixer-yt-card.edixer-force-hover .edixer-yt-card-profile img {
    opacity: 0.9; /* Simple opacity change instead of scale */
}

.edixer-yt-card.edixer-force-hover .edixer-yt-card-stat {
    background: rgba(255, 255, 255, 0.2);
}

/* Override the late-appearing rule at the bottom of the file */
/* Video card visibility transitions - ENSURING OUR TRANSITION TAKES PRECEDENCE */
.edixer-yt-card {
    will-change: opacity, transform;
    backface-visibility: hidden;
}

/* Infinite Scrolling Styles */
#edixer-loading-indicator {
    text-align: center;
    margin: 30px 0;
    padding: 20px;
}

@keyframes edixer-spin {
    to { transform: rotate(360deg); }
}

.edixer-spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 3px solid rgba(58, 89, 183, 0.1);
    border-radius: 50%;
    border-top-color: #3a59b7;
    animation: edixer-spin 1s linear infinite;
}

#edixer-no-more-videos {
    text-align: center;
    margin: 30px 0;
    padding: 15px;
    font-size: 18px;
    font-weight: 700;
    color: #3a59b7;
    letter-spacing: 1px;
    text-transform: uppercase;
    background: rgba(58, 89, 183, 0.05);
    border-radius: 10px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* Ensure video cards appear with a nice fade-in - ONLY when loading class is present */
.edixer-yt-card.loading {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.edixer-yt-card.edixer-yt-card-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Optimize for mobile */
@media (max-width: 767px) {
    #edixer-loading-indicator {
        margin: 20px 0;
        padding: 15px;
    }
    
    .edixer-spinner {
        width: 30px;
        height: 30px;
    }
    
    #edixer-no-more-videos {
        font-size: 16px;
        padding: 12px;
        margin: 20px auto 30px;
    }
} 

/* Add slide-in animation for newly loaded video cards */
@keyframes edixer-slide-in {
    from {
        transform: translateY(50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Applied to newly loaded cards - IMPROVED ANIMATION WITH DYNAMIC DELAYS */
.edixer-yt-card.edixer-newly-loaded {
    /* Start hidden for animation */
    opacity: 0;
    transform: translateY(50px);
    animation: edixer-slide-in 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    will-change: transform, opacity;
    /* Animation delay will be set dynamically by JavaScript */
}

/* IMPROVED: JavaScript-controlled stagger animation for load more cards */
/* CSS nth-child selectors removed - JavaScript will set delays dynamically */

/* Small Tablet - JavaScript will handle animation delays dynamically */

/* Mid/Big Tablet - JavaScript will handle animation delays dynamically */

/* Desktop - JavaScript will handle animation delays dynamically */

/* Ultrawide - JavaScript will handle animation delays dynamically */

/* Disable slide-in animation when reduced motion is preferred */
@media (prefers-reduced-motion: reduce) {
    .edixer-yt-card.edixer-newly-loaded,
    .edixer-yt-card.edixer-initial-load {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    /* Disable thumbnail loading animation for reduced motion */
    .edixer-yt-card-thumbnail::before {
        animation: none !important;
        opacity: 0 !important;
    }

    /* Disable hover animations for reduced motion */
    .edixer-yt-card:hover,
    .edixer-yt-card:hover .edixer-yt-card-thumbnail {
        transform: none !important;
        transition: none !important;
    }

    .edixer-yt-card:hover .edixer-yt-card-thumbnail img {
        filter: none !important;
        transition: none !important;
    }
}

/* Fallback for when JavaScript is disabled or fails */
.no-js .edixer-yt-card,
.edixer-yt-card:not(.edixer-initial-load):not(.edixer-newly-loaded) {
    opacity: 1 !important;
    transform: none !important;
}

/* Auto-show cards after 2 seconds if animations haven't started */
.edixer-yt-card {
    animation: edixer-fallback-show 0.5s ease-out 2s forwards;
}

@keyframes edixer-fallback-show {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Optimize image loading and prevent reflow */
.edixer-yt-card-thumbnail img,
.edixer-video-thumbnail img,
.edixer-client-profile img,
.edixer-client-image img,
.edixer-client-avatar-v3 img {
    will-change: transform; /* Hint to browser */
    backface-visibility: hidden; /* Prevent flickering */
    transform: translateZ(0); /* Promote to GPU layer */
    contain: paint; /* Isolate painting */
    display: block; /* Ensure proper layout */
}

/* Force browser to keep images in memory (Removed content-visibility) */
.edixer-yt-card img {
    contain: layout paint style; /* Isolate styles/layout */
    will-change: transform; /* Hint to browser */
    transform: translateZ(0); /* Promote to GPU layer */
    display: block; /* Ensure proper layout */
}

/* Ensure thumbnails maintain aspect ratio even before loading */
.edixer-yt-card-thumbnail,
.edixer-video-thumbnail {
    contain: layout size style; /* Isolate layout/styles, maintain size */
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    overflow: hidden; /* Ensure image stays within bounds */
} 

#edixer-no-more-videos,
#edixer-no-more-videos-ranked {
    text-align: center;
    margin: 30px 0;
    padding: 15px;
    font-size: 18px;
    font-weight: 700;
    color: #3a59b7;
    letter-spacing: 1px;
    text-transform: uppercase;
    background: none;
    border-radius: 10px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* Prevent "NO MORE VIDEOS" from displaying as links */
#edixer-no-more-videos a,
#edixer-no-more-videos-ranked a,
.edixer-no-more-videos a,
.edixer-no-link a {
    color: inherit !important;
    text-decoration: none !important;
    pointer-events: none !important;
    cursor: default !important;
    display: inline !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

@media (max-width: 767px) {
    #edixer-no-more-videos,
    #edixer-no-more-videos-ranked {
        font-size: 16px;
        padding: 12px;
        margin: 20px auto 30px;
    }
} 

.edixer-client-featured-badge-v3 {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 40px;
    height: 40px;
    background: #ffd700;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    z-index: 2;
}

.edixer-client-featured-badge-v3 svg {
    width: 24px;
    height: 24px;
    fill: #fff;
}

@media screen and (max-width: 768px) {
    .edixer-client-featured-badge-v3 {
        width: 32px;
        height: 32px;
        top: -8px;
        right: -8px;
    }

    .edixer-client-featured-badge-v3 svg {
        width: 18px;
        height: 18px;
    }
}

@media screen and (max-width: 480px) {
    .edixer-client-featured-badge-v3 {
        width: 28px;
        height: 28px;
        top: -6px;
        right: -6px;
    }

    .edixer-client-featured-badge-v3 svg {
        width: 16px;
        height: 16px;
    }
}

.edixer-client-featured-star-v3 {
    display: inline;
    margin-right: 6px;
    line-height: 1;
    position: relative;
    left: 7px;
    top: -3px;
}

.edixer-client-featured-star-v3 svg {
    width: 1em;
    height: 1em;
    vertical-align: -0.32em;
    display: inline;
}

/* New tooltip implementation */
.edixer-client-featured-star-v3 {
    position: relative;
    cursor: help;
}

.edixer-client-featured-star-v3 .tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 8px;
    background: #ffd700;
    color: #000;
    font-size: 9px;
    border-radius: 50px;
    white-space: normal;
    width: 80px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    margin-bottom: -2px;
    z-index: 1000;
    line-height: 1.2;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    text-align: center;
}

.edixer-client-featured-star-v3 .tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: #ffd700 transparent transparent transparent;
}

.edixer-client-featured-star-v3:hover .tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(-5px);
}

@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(-5px);
    }
}

@keyframes tooltipFadeOut {
    from {
        opacity: 1;
        transform: translateX(-50%) translateY(-5px);
    }
    to {
        opacity: 0;
        transform: translateX(-50%) translateY(0);
    }
}

.edixer-client-featured-star-v3:hover .tooltip {
    animation: tooltipFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.edixer-client-featured-star-v3:not(:hover) .tooltip {
    animation: tooltipFadeOut 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

/* Video Badge Styles */
.edixer-video-badge {
    position: absolute;
    bottom: 0px;
    right: -2px;
    padding: 4px 12px;
    border-radius: 20px 0;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    z-index: 100; /* Increased z-index */
    box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
    cursor: help;
}

/* Badge tooltip styling */
.edixer-video-badge .badge-tooltip {
    position: absolute;
    bottom: 100%;
    right: 0;
    padding: 8px 12px;
    background: linear-gradient(145deg, rgb(43 55 82 / 90%), rgb(229 211 211 / 59%));
    color: #fff;
    font-size: 12px;
    border-radius: 15px;
    white-space: normal;
    width: max-content;
    max-width: 200px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    margin-bottom: 8px;
    z-index: 1000; /* Increased z-index */
    line-height: 1.5;
    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.4);
    text-align: center;
    font-weight: normal;
    text-transform: none;
    text-shadow: none;
    border: 0;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

/* Show tooltip on hover */
.edixer-video-badge:hover .badge-tooltip {
    opacity: 1;
    visibility: visible;
    transform: translateY(-8px);
}

/* Badge tooltip arrow */
.edixer-video-badge .badge-tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    right: 15px;
    border-width: 5px;
    border-style: solid;
    border-color: rgb(229 211 211 / 59%) transparent transparent transparent;
}

/* Badge background gradients */
.edixer-video-badge.premium {
    background: linear-gradient(135deg, #6d653b 0%, #ff0000 100%);
}

.edixer-video-badge.personal-favorite {
    background: linear-gradient(135deg, #a39538 0%, #7400bd 100%);
}

.edixer-video-badge.standard {
    background: linear-gradient(135deg, #5983b5 0%, #0700ff 100%);
}

.edixer-video-badge.basic {
    background: linear-gradient(135deg, #718096 0%, #4A5568 100%);
}

/* Ensure tooltip stays above other elements */
.edixer-yt-card-thumbnail {
    position: relative;
    z-index: 1;
}

/* Prevent tooltip from being cut off */
.edixer-yt-card {
    overflow: visible;
}

/* Refresh button styles */
.edixer-refresh-data-frontend {
    display: inline-flex;
    align-items: center;
    justify-content: center; /* Center the icon */
    padding: 8px; /* Equal padding for height and width */
    /* Change background to match views column */
    background: linear-gradient(135deg, rgba(255,255,255,0.4) 0%, rgba(236,253,245,0.4) 100%); /* Views column gradient */
    border: none; /* No border */
    border-radius: 50%; /* Make it a circle */
    cursor: pointer;
    transition: all 0.3s ease; /* Smooth transition for hover effects */
    font-size: 0; /* Hide text content visually if any */
    /* Color for the icon */
    color: #1e293b; /* Match text color in views column */
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* More subtle shadow */
    width: 28px; /* Slightly smaller size */
    height: 28px; /* Slightly smaller size */
    backdrop-filter: blur(5px); /* Add a subtle blur effect */
    -webkit-backdrop-filter: blur(5px); /* Add a subtle blur effect for webkit */
}

.edixer-refresh-data-frontend:hover {
    background: linear-gradient(135deg, rgba(255,255,255,0.6) 0%, rgba(236,253,245,0.6) 100%); /* Slightly stronger gradient on hover */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); /* Slightly larger shadow on hover */
    transform: translateY(-1px); /* Slight lift effect */
}

.edixer-refresh-data-frontend:active {
    background: linear-gradient(135deg, rgba(255,255,255,0.5) 0%, rgba(236,253,245,0.5) 100%); /* Gradient on active */
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); /* Smaller shadow on active */
    transform: translateY(0); /* Return to original position on active */
}

.edixer-refresh-data-frontend:disabled {
    opacity: 0.4; /* Reduce opacity when disabled */
    cursor: not-allowed;
    box-shadow: none; /* Remove shadow when disabled */
    transform: none; /* Remove transform when disabled */
}

/* Style the refresh icon (SVG) */
.edixer-refresh-data-frontend svg {
    width: 16px; /* Icon size */
    height: 16px; /* Icon size */
    fill: currentColor; /* Use the button's color for the icon */
    transform-origin: center; /* Ensure spinning is from the center */
    transition: transform 0.3s ease; /* Smooth transition for non-loading state changes */
}

/* Spinner animation for the icon when the button is loading */
.edixer-refresh-data-frontend.is-loading svg {
    animation: edixer-spin 1s linear infinite; /* Apply spin animation */
}

@keyframes edixer-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Add relative positioning to the views column */
.edixer-yt-metric-column:nth-child(4) {
    position: relative;
}

.edixer-yt-metric-column:nth-child(1) {
    position: static; /* Ensure the first column doesn't have relative positioning */
}

/* Next Update Indicator */
.edixer-next-update {
    text-align: center;
    margin-top: -15px;
    font-size: 14px;
    color: #666;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: rgb(74 96 226 / 0%);
    border-radius: 8px;
    max-width: fit-content;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.edixer-update-combined {
    font-family: monospace;
    font-weight: 800;
    color: #00000070;
    background: none !important;
    /* padding: 4px 8px; */
    /* border-radius: 4px; */
    /* min-width: 100px; */
    text-align: center;
    font-size: 12px;
}

/* Responsive adjustments for mobile */
@media screen and (max-width: 600px) {
    .edixer-next-update {
        white-space: normal; /* Allow wrapping on small screens */
        max-width: 95%; /* Allow container to take more width */
        padding: 8px; /* Adjust padding */
    }
    
    .edixer-update-combined {
        font-size: 12px; /* Adjust font size for mobile */
    }
}

/* Force 100% width for main containers */
.edixer-yt-total-container,
.edixer-yt-ranked-main-container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;

/* Odometer effect for main metrics */
.edixer-yt-main-metrics .edixer-yt-metric-value {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    letter-spacing: 0.05em;
    position: relative;
    overflow: hidden;
}

/* Smooth transition for odometer animation */
.edixer-yt-main-metrics .edixer-yt-metric-value.odometer-animated {
    transition: none;
}

/* Ensure consistent width during animation */
.edixer-yt-main-metrics .edixer-yt-metric-value::before {
    content: attr(data-final-value);
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
    padding: 0 !important;
}

/* Experience Stats Shortcode Styles - Premium Design */
.edixer-experience-card {
    background: transparent !important; /* INVISIBLE CONTAINER */
    border: none !important; /* NO BORDERS */
    box-shadow: none !important; /* NO SHADOWS */
    backdrop-filter: none !important; /* NO BLUR */
    -webkit-backdrop-filter: none !important; /* NO BLUR */
    border-radius: 0 !important; /* NO ROUNDED CORNERS */
    padding: 0px 25px; /* DESKTOP/LARGE TABLET PADDING */
    margin: -25px 0; /* DESKTOP/LARGE TABLET MARGIN */
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    position: relative;
    overflow: visible;
    opacity: 1;
    transform: translateY(0);
    /* CONTAINER IS INVISIBLE BUT CONTENT REMAINS VISIBLE */
}

/* REMOVED ::before BACKGROUND ELEMENT - NO MORE FUCKING BACKGROUND! */



.edixer-experience-header {
    text-align: center;
    margin-bottom: 20px;
    position: relative;
    z-index: 2;
    opacity: 1;
    transform: translateY(0);
}

.edixer-experience-title {
    font-size: 28px;
    font-weight: 900;
    margin: 0 0 10px 0;
    text-shadow: 0 4px 8px rgba(0,0,0,0.3);
    background: linear-gradient(135deg, #ffffff 0%, #f0f8ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    letter-spacing: -0.5px;
}

.edixer-experience-icon {
    font-size: 32px;
    margin-right: 10px;
    display: inline-block;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
}

.edixer-experience-period {
    font-size: 16px;
    opacity: 0.95;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.15);
    padding: 6px 16px;
    border-radius: 20px;
    display: inline-block;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.edixer-experience-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(200px, 1fr)); /* WIDER COLUMNS TO PREVENT TEXT BREAKING */
    gap: 20px; /* MORE BREATHING SPACE */
    margin-bottom: 40px; /* INCREASED BREATHING SPACE BETWEEN GRIDS AND BELOW CONTAINER */
    position: relative;
    z-index: 2;
    max-width: 1200px; /* INCREASED WIDTH TO ACCOMMODATE WIDER COLUMNS */
    margin-left: auto;
    margin-right: auto;
}

.edixer-experience-stat-item {
    background: rgba(255, 255, 255, 0.12);
    border-radius: 24px; /* CORRECTED BORDER RADIUS */
    padding: 20px 15px;
    text-align: center;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border: 1px solid rgba(255, 255, 255, 0.25); /* CONFIRMED 1PX BORDER */
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    opacity: 1;
    transform: translateY(0) scale(1);
}

.edixer-experience-stat-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    transition: left 0.6s ease;
}

.edixer-experience-stat-item:hover::before {
    left: 100%;
}

.edixer-experience-stat-item:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow:
        0 20px 40px rgba(0,0,0,0.3),
        0 0 0 1px rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.2);
}

.edixer-experience-stat-item.edixer-stat-primary {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.4); /* CORRECTED TO 1PX BORDER */
    box-shadow:
        0 15px 30px rgba(255, 255, 255, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.edixer-experience-stat-item .edixer-stat-value {
    font-size: 64px; /* MUCH BIGGER NUMBERS - INCREASED FROM 48px */
    font-weight: 900;
    margin-bottom: 8px;
    text-shadow: 0 4px 8px rgba(0,0,0,0.4);
    background: linear-gradient(135deg, #ffffff 0%, #f0f8ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.edixer-experience-stat-item .edixer-stat-label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: white; /* SET COLOR TO WHITE */
    opacity: 0.9;
    margin-bottom: 4px;
    white-space: nowrap; /* PREVENT TEXT WRAPPING */
}

.edixer-experience-stat-item .edixer-stat-sublabel {
    font-size: 10px;
    opacity: 0.75;
    margin-top: 4px;
    font-weight: 500;
    background: rgba(255, 255, 255, 0.1);
    padding: 3px 8px;
    border-radius: 10px;
    display: inline-block;
}

.edixer-experience-details {
    background: transparent; /* TRANSPARENT BACKGROUND */
    border-radius: 20px;
    padding: 20px;
    backdrop-filter: none; /* NO BLUR */
    -webkit-backdrop-filter: none; /* NO BLUR */
    border: none; /* NO BORDER */
    position: relative;
    z-index: 2;
    opacity: 1;
    transform: translateY(0);
    max-width: 1000px; /* LIMIT WIDTH FOR DESKTOP - NO MORE FULL WIDTH */
    margin-left: auto;
    margin-right: auto;
}

/* Only hide when loading class is present */
.edixer-experience-details.loading {
    opacity: 0;
    transform: translateY(30px);
}

.edixer-experience-detail-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
    border-radius: 10px;
    margin-bottom: 6px;
    padding-left: 15px;
    padding-right: 15px;
    position: relative;
    overflow: hidden;
}

.edixer-experience-detail-row::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.05), transparent);
    transition: left 0.5s ease;
}

.edixer-experience-detail-row:hover::before {
    left: 100%;
}

.edixer-experience-detail-row:hover {
    background: rgba(255, 255, 255, 0.05);
    transform: translateX(10px);
}

.edixer-experience-detail-row:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.edixer-detail-label {
    font-weight: 700;
    opacity: 0.9;
    font-size: 22px; /* MUCH BIGGER FONTS - INCREASED FROM 18px */
    letter-spacing: 0.5px;
}

.edixer-detail-value {
    font-weight: 800;
    font-size: 22px; /* MUCH BIGGER FONTS - INCREASED FROM 18px */
    text-align: right;
}

.edixer-detail-value a {
    color: #fff;
    text-decoration: none;
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding-bottom: 2px;
    position: relative;
}

.edixer-detail-value a::before {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0.8));
    transition: width 0.3s ease;
}

.edixer-detail-value a:hover::before {
    width: 100%;
}

.edixer-detail-value a:hover {
    border-color: transparent;
    transform: translateY(-2px);
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* List Style - Premium Design */
.edixer-experience-list {
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    border-radius: 20px;
    padding: 25px;
    margin: 20px 0;
    border-left: 5px solid #667eea;
    box-shadow:
        0 15px 30px rgba(102, 126, 234, 0.15),
        0 0 0 1px rgba(102, 126, 234, 0.1);
    position: relative;
    overflow: visible; /* REMOVED SCROLL */
    opacity: 1;
    transform: translateY(0);
    /* REMOVED max-height: 95vh; */
    /* REMOVED overflow-y: auto; */
}

.edixer-experience-list::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg,
        rgba(102, 126, 234, 0.02) 0%,
        rgba(118, 75, 162, 0.02) 100%);
    pointer-events: none;
}

.edixer-experience-list .edixer-experience-title {
    color: #1e293b;
    font-size: 26px;
    margin-bottom: 20px;
    font-weight: 900;
    position: relative;
    z-index: 2;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    opacity: 1;
    transform: translateY(0);
}

.edixer-experience-stats-list {
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
    z-index: 2;
}

.edixer-experience-stats-list li {
    padding: 15px 20px;
    border-bottom: 1px solid rgba(102, 126, 234, 0.1);
    font-size: 15px;
    color: #334155;
    background: rgba(255, 255, 255, 0.6);
    margin-bottom: 8px;
    border-radius: 12px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(102, 126, 234, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    opacity: 1;
    transform: translateX(0);
}

.edixer-experience-stats-list li::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(102, 126, 234, 0.05), transparent);
    transition: left 0.5s ease;
}

.edixer-experience-stats-list li:hover::before {
    left: 100%;
}

.edixer-experience-stats-list li:hover {
    transform: translateX(10px);
    box-shadow: 0 10px 25px rgba(102, 126, 234, 0.15);
    background: rgba(255, 255, 255, 0.8);
}

.edixer-experience-stats-list li:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.edixer-experience-stats-list strong {
    color: #667eea;
    font-weight: 800;
    font-size: 16px;
}

.edixer-experience-stats-list a {
    color: #667eea;
    text-decoration: none;
    font-weight: 700;
    border-bottom: 2px solid rgba(102, 126, 234, 0.3);
    transition: all 0.3s ease;
    padding-bottom: 2px;
}

.edixer-experience-stats-list a:hover {
    border-color: #667eea;
    transform: translateY(-1px);
    text-shadow: 0 2px 4px rgba(102, 126, 234, 0.2);
}

/* Grid Style */
.edixer-experience-grid {
    background: #f8f9fa;
    border-radius: 20px;
    padding: 25px;
    margin: 20px 0;
    /* REMOVED max-height: 95vh; */
    /* REMOVED overflow-y: auto; */
}

.edixer-experience-grid-header {
    text-align: center;
    margin-bottom: 20px;
}

.edixer-experience-grid .edixer-experience-title {
    color: #333;
    font-size: 24px;
    margin-bottom: 8px;
    font-weight: 700;
}

.edixer-experience-grid .edixer-experience-period {
    color: #666;
    font-size: 16px;
    font-weight: 600;
}

.edixer-experience-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 15px;
}

.edixer-experience-grid-item {
    background: white;
    border-radius: 12px;
    padding: 15px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.edixer-experience-grid-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.edixer-experience-grid-item.edixer-grid-highlight {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.edixer-experience-grid-item.edixer-grid-wide {
    grid-column: span 2;
    text-align: left;
}

.edixer-experience-grid-item.edixer-grid-featured {
    background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
    color: #333;
}

.edixer-grid-icon {
    font-size: 20px;
    margin-bottom: 8px;
}

.edixer-grid-value {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 6px;
}

.edixer-grid-label {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.9;
}

.edixer-grid-sublabel {
    font-size: 12px;
    opacity: 0.7;
    margin-top: 4px;
}

.edixer-grid-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.edixer-grid-stat {
    font-size: 14px;
}

.edixer-grid-featured-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 8px;
}

.edixer-grid-featured-video {
    font-size: 14px;
    margin-bottom: 4px;
}

.edixer-grid-featured-video a {
    color: #333;
    text-decoration: none;
    font-weight: 600;
}

.edixer-grid-featured-video a:hover {
    text-decoration: underline;
}

.edixer-grid-featured-views {
    font-size: 12px;
    opacity: 0.8;
    font-weight: 600;
}

/* Premium Loading States - Only when loading class is present */
.edixer-experience-card.loading {
    opacity: 0;
    transform: translateY(50px);
}

.edixer-experience-list.loading {
    opacity: 0;
    transform: translateY(50px);
}

.edixer-experience-grid.loading {
    opacity: 0;
    transform: translateY(50px);
}

.edixer-experience-stat-item.loading {
    opacity: 0;
    transform: translateY(40px) scale(0.9);
}

.edixer-experience-header.loading {
    opacity: 0;
    transform: translateY(30px);
}

.edixer-experience-stats-list li.loading {
    opacity: 0;
    transform: translateX(-30px);
}

/* Fallback for when JavaScript is disabled or fails to load */
.no-js .edixer-experience-card,
.no-js .edixer-experience-list,
.no-js .edixer-experience-grid,
.no-js .edixer-experience-header,
.no-js .edixer-experience-details,
.no-js .edixer-experience-stat-item,
.no-js .edixer-experience-stats-list li {
    opacity: 1 !important;
    transform: none !important;
}

/* Auto-fallback after 3 seconds if animations haven't started */
.edixer-experience-card.loading,
.edixer-experience-list.loading,
.edixer-experience-grid.loading {
    animation: fallback-show 0.5s ease-out 3s forwards;
}

@keyframes fallback-show {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Premium Hover Effects */
/* HOVER EFFECTS REMOVED - CONTAINER IS HIDDEN */

.edixer-experience-list:hover {
    transform: translateY(-3px);
    box-shadow:
        0 25px 45px rgba(102, 126, 234, 0.2),
        0 0 0 1px rgba(102, 126, 234, 0.15);
}

.edixer-experience-grid:hover {
    transform: translateY(-3px);
    box-shadow:
        0 25px 45px rgba(0, 0, 0, 0.1),
        0 0 0 1px rgba(102, 126, 234, 0.1);
}

/* Premium Glow Effects */
.edixer-experience-stat-item.edixer-stat-primary::after {
    content: '';
    position: absolute;
    top: -1px; /* ADJUSTED FOR 1PX BORDER */
    left: -1px; /* ADJUSTED FOR 1PX BORDER */
    right: -1px; /* ADJUSTED FOR 1PX BORDER */
    bottom: -1px; /* ADJUSTED FOR 1PX BORDER */
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.1));
    border-radius: 24px; /* UPDATED TO MATCH MAIN BORDER-RADIUS */
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.edixer-experience-stat-item.edixer-stat-primary:hover::after {
    opacity: 1;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .edixer-experience-stats-grid,
    .edixer-experience-grid-container {
        grid-template-columns: repeat(2, 1fr); /* 2 COLUMNS ON MOBILE TO PREVENT CRAMPING */
        gap: 12px;
        max-width: 100%; /* FULL WIDTH ON MOBILE */
    }

    .edixer-experience-grid-item.edixer-grid-wide {
        grid-column: span 1;
    }

    .edixer-experience-card,
    .edixer-experience-list,
    .edixer-experience-grid {
        margin: 10px 0;
        padding: 20px;
        /* REMOVED max-height: 90vh; */
    }

    .edixer-experience-title {
        font-size: 22px;
    }

    .edixer-experience-grid .edixer-experience-title {
        font-size: 20px;
    }

    .edixer-experience-stat-item .edixer-stat-value {
        font-size: 28px;
    }

    .edixer-experience-stat-item {
        padding: 15px 12px;
    }

    .edixer-experience-detail-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        text-align: left;
        padding: 10px 0;
    }

    .edixer-detail-value {
        text-align: left;
    }

    .edixer-experience-stats-list li {
        padding: 12px 15px;
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    .edixer-experience-card {
        padding: 20px 15px;
        margin: 10px 0;
        /* REMOVED max-height: 85vh; */
    }

    .edixer-experience-title {
        font-size: 18px;
    }

    .edixer-experience-icon {
        font-size: 24px;
    }

    .edixer-experience-stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .edixer-experience-stat-item {
        padding: 15px 10px;
    }

    .edixer-experience-stat-item .edixer-stat-value {
        font-size: 24px;
    }

    .edixer-experience-stat-item .edixer-stat-label {
        font-size: 11px;
    }

    .edixer-experience-list {
        padding: 20px 15px;
        /* REMOVED max-height: 85vh; */
    }

    .edixer-experience-stats-list li {
        padding: 10px 15px;
        font-size: 13px;
        margin-bottom: 6px;
    }

    .edixer-experience-grid {
        padding: 20px 15px;
        /* REMOVED max-height: 85vh; */
    }

    .edixer-experience-grid-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .edixer-experience-grid-item {
        padding: 12px 8px;
    }

    .edixer-grid-value {
        font-size: 20px;
    }

    .edixer-grid-label {
        font-size: 10px;
    }

    .edixer-experience-details {
        padding: 15px;
    }

    .edixer-detail-label,
    .edixer-detail-value {
        font-size: 13px;
    }
}