/* ============================================================================
   MEGA MENU CUSTOM COLORS - DYNAMIC STYLING
   Updated via JavaScript from admin settings
   ============================================================================ */

:root {
    /* Default values - will be overridden by JavaScript */
    --mega-menu-custom-bg: #1a1a2e;
    --mega-menu-custom-text: #eee;
    --mega-menu-custom-border: #ffffff14;
    --mega-menu-custom-hover-bg: #ffffff0f;
    --mega-menu-custom-hover-text: #00d4ff;
    --mega-menu-custom-radius: 15px;
}

/* Apply custom styles to mega menu */
.lqd-megamenu {
    background: var(--mega-menu-custom-bg) !important;
    border-color: var(--mega-menu-custom-border) !important;
    border-radius: var(--mega-menu-custom-radius) !important;
    color: var(--mega-menu-custom-text) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
}

.lqd-megamenu-col {
    color: var(--mega-menu-custom-text) !important;
}

.lqd-megamenu-link-item {
    color: var(--mega-menu-custom-text) !important;
    transition: all 0.25s ease !important;
    border-radius: calc(var(--mega-menu-custom-radius) / 2) !important;
    padding: 8px 12px !important;
    margin: 2px 0 !important;
}

.lqd-megamenu-link-item:hover {
    background: var(--mega-menu-custom-hover-bg) !important;
    color: var(--mega-menu-custom-hover-text) !important;
}

.lqd-megamenu-link-item a {
    color: inherit !important;
    text-decoration: none !important;
}

.lqd-megamenu-link-item a:hover {
    color: var(--mega-menu-custom-hover-text) !important;
}

/* Headers in mega menu */
.lqd-megamenu h3,
.lqd-megamenu h4,
.lqd-megamenu .font-semibold {
    color: var(--mega-menu-custom-text) !important;
    border-bottom: 1px solid var(--mega-menu-custom-border) !important;
    padding-bottom: 8px !important;
    margin-bottom: 12px !important;
}

/* Icons */
.lqd-megamenu .tabler-icon,
.lqd-megamenu .icon,
.lqd-megamenu svg {
    color: var(--mega-menu-custom-hover-text) !important;
}

/* Labels */
.lqd-megamenu-label {
    color: var(--mega-menu-custom-text) !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .lqd-megamenu {
        border-radius: calc(var(--mega-menu-custom-radius) * 0.75) !important;
    }
}