/* ==========================================================================
   GLOBAL AUTOMATED CATEGORY SCROLLER COMPONENTS (OVAL TEXT CLIPPING FIX)
   ========================================================================== */

.global-category-scroller-layout {
    position: -webkit-sticky !important;
    position: sticky !important;         
    top: 69px !important; /* Locks right underneath your main menu header bar */               
    width: 92% !important;               
    margin: 10px auto !important;
    background-color: #ffffff !important; 
    padding: 15px 0 !important; /* Plenty of clearance to prevent all vertical text cuts */
    overflow: hidden !important;
    z-index: 998 !important;             
    border-bottom: 1px solid #f8fafc;
}

/* Faded Edge Left and Right Mask Layers */
.global-category-scroller-layout::before,
.global-category-scroller-layout::after {
    content: "";
    position: absolute;
    top: 0; bottom: 0;
    width: 60px;
    z-index: 3;
    pointer-events: none;
}
.global-category-scroller-layout::before {
    left: 0;
    background: linear-gradient(to right, #ffffff 15%, rgba(255, 255, 255, 0));
}
.global-category-scroller-layout::after {
    right: 0;
    background: linear-gradient(to left, #ffffff 15%, rgba(255, 255, 255, 0));
}

.scroller-track-viewport {
    width: 100%;
    overflow: hidden;
}

/* Core Rolling Track Wrapper Container */
.css-marquee-track {
    display: flex !important;
    align-items: flex-start !important; /* Aligns all images flush on a top row baseline */
    width: max-content;
    will-change: transform;
    animation: infiniteScrollMarquee 25s linear infinite;
}

.css-marquee-track:hover {
    animation-play-state: paused !important;
}

.marquee-group {
    display: flex;
    align-items: flex-start !important; 
    gap: 35px;
    padding-right: 35px;
}

/* Individual Category Box Item Card Configuration */
.scroller-category-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-width: 110px !important; /* Widened to ensure clean wrapping spaces */
    max-width: 130px !important;
    text-align: center !important;
    transition: transform 0.2s ease;
    background: transparent !important; /* FORCED FIX: Strips any inherited white block shapes */
    border: none !important;
    border-radius: 0 !important; /* FORCED FIX: Kills the accidental oval clip shapes */
    padding: 0 !important;
    box-shadow: none !important;
}
.scroller-category-card:hover {
    transform: translateY(-3px);
}

/* Circular Category Images */
.scroller-thumb-img {
    width: 44px;
    height: 44px;
    border-radius: 50% !important; /* This circles the IMAGE only, safely isolated from text */
    object-fit: cover;
    margin-bottom: 12px !important; 
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    background-color: #f8fafc;
    padding: 8px;
    flex-shrink: 0 !important; 
    display: block !important;
}

/* Category Title Typography Controls (Completely Cleaned of Oval Shapes) */
.scroller-label-text {
    font-size: 11.5px !important; 
    font-weight: 600 !important;
    color: #1e293b !important;
    line-height: 1.4 !important; 
    white-space: normal !important; /* Allows strings to flow onto a 2nd line natively */
    word-break: keep-all !important; 
    display: block !important;
    width: 100% !important;
    background: transparent !important; /* FORCED FIX: Removes background blocks behind words */
    border-radius: 0 !important; /* FORCED FIX: Removes any round corners from text fields */
    padding: 0 !important;
    margin: 0 !important;
}

@keyframes infiniteScrollMarquee {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-50%, 0, 0); }
}