/* ==========================================================================
   Theme-E Game Categories Stylesheet
   Matches Photo 2 (theme e.anotechsolutions.shop)
   Transforms Game Categories from dark grey (#494d51) to Theme-E Royal Blue
   ========================================================================== */

/* Outer Section Frame around Game Categories */
.section-frame.category-showcase-frame,
.category-showcase-frame {
    border-radius: 14px !important;
    border: 1px solid rgba(40, 95, 220, 0.45) !important;
    background: radial-gradient(circle at top, #0e2b72 0%, #061b4d 50%, #031138 100%) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
    box-sizing: border-box !important;
}

/* Game Categories Head Title */
.category-showcase-head .section-title h2 {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.45) !important;
}

/* Inactive Category Cards (SLOTS, CRASH, LOTTERY, FISH, CASINO) - ROYAL BLUE */
.category-showcase-card,
.category-showcase-card:not(.active),
.category-showcase-tail.category-showcase-card:not(.active) {
    background: linear-gradient(180deg, #173d91 0%, #0d2870 50%, #081d56 100%) !important;
    box-shadow: inset 0 0 0 1px #1e4bb2, 0 3px 6px rgba(0, 0, 0, 0.35) !important;
    border: none !important;
    border-radius: 10px !important;
    transition: all 0.2s ease !important;
}

/* Active Category Card (HOT) - VIBRANT ROYAL BLUE WITH CYAN/BLUE GLOW */
.category-showcase-card.active,
.category-showcase-tail.category-showcase-card.active {
    background: linear-gradient(180deg, #256dfd 0%, #1b5ad6 50%, #1042a8 100%) !important;
    box-shadow: inset 0 0 0 1px #4da2ff, 0 4px 12px rgba(27, 90, 214, 0.5) !important;
    border-radius: 10px !important;
}

/* Category Label Text */
.category-showcase-card span {
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
    letter-spacing: 0.3px !important;
}

/* Active Card Inner Sheen */
.category-showcase-card.active:after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    height: 1.33333rem !important;
    width: .04rem !important;
    transform: translateY(-50%) !important;
    background: radial-gradient(circle at center, rgba(255, 255, 255, .7) 0%, transparent 70%) !important;
}

.category-showcase-card.active:before {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    width: 3.73333rem !important;
    height: .04rem !important;
    transform: translate(-50%) !important;
    background: radial-gradient(circle at center, rgba(255, 255, 255, .7) 0%, transparent 70%) !important;
}

/* Category Detail Frame (Games Grid below Categories) */
.section-frame.category-detail-frame,
.category-detail-frame {
    border-radius: 14px !important;
    border: 1px solid rgba(40, 95, 220, 0.45) !important;
    background: radial-gradient(circle at top, #0e2b72 0%, #061b4d 50%, #031138 100%) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

/* Category Detail Cards (Slots, Casino, etc.) - Theme-E Royal Blue 3x2 Grid */
.category-detail-swiper .category-detail-grid,
.category-detail-grid,
.content-section .game-card-grid,
.category-detail-swiper__slide > div {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 0 !important;
}

.category-detail-card,
.category-detail-card[data-v-760762f4],
.game-card-item.category-detail-card,
.game-card-item[data-v-760762f4],
.theme-e-added-card {
    background: #071a48 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    position: relative !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    cursor: pointer !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
    aspect-ratio: 1 / 1.15 !important;
    height: auto !important;
    min-height: 0 !important;
}

.category-detail-card:active,
.game-card-item.category-detail-card:active,
.theme-e-added-card:active {
    transform: scale(0.96) !important;
}

.category-detail-card .game-img,
.category-detail-card .game-img[data-v-760762f4],
.game-card-item.category-detail-card .game-img,
.game-card-item .game-img[data-v-760762f4],
.theme-e-added-card .game-img {
    width: 100% !important;
    height: 100% !important;
    border-radius: 9px !important;
    object-fit: cover !important;
    display: block !important;
    background: #071a48 !important;
}

/* Force hide empty category detail card frames */
.category-detail-card:empty,
.game-card-item:empty,
.category-detail-card[style*="display: none"],
.game-card-item[style*="display: none"] {
    display: none !important;
}