.elementor-320 .elementor-element.elementor-element-2881ea4a{--display:flex;}/* Start custom CSS for woocommerce-my-account, class: .elementor-element-8c600c4 *//* --- 1. GLOBAL SMOOTHNESS & RESET --- */
.elementor-320 .elementor-element.elementor-element-8c600c4 {
    --primary-gradient: linear-gradient(135deg, #2563EB 0%, #06B6D4 100%);
    --surface-white: #FFFFFF;
    --bg-slate: #F8FAFC;
    --text-main: #1E293B;
    --text-muted: #64748B;
    --border-color: #E2E8F0;
    --radius-lg: 24px;
    --radius-md: 16px;
    --transition-smooth: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}

/* --- 2. LAYOUT MANAGEMENT WITH GLASSMORPHISM --- */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation {
    width: 28% !important;
    float: left !important;
    background: var(--bg-slate) !important;
    padding: 24px 16px !important;
    border-radius: var(--radius-lg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.03) !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content {
    width: 68% !important;
    float: right !important;
    background: var(--surface-white) !important;
    padding: 40px !important;
    border-radius: var(--radius-lg) !important;
    border: 1px solid #F1F5F9 !important;
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.04) !important;
    color: var(--text-main) !important;
    font-size: 14.5px !important;
    animation: slideUpFade 0.6s cubic-bezier(0.25, 1, 0.5, 1) forwards !important;
}

/* --- 3. ULTRA-MODERN NAVIGATION LINKS --- */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link a {
    display: flex !important;
    align-items: center !important;
    padding: 16px 20px !important;
    color: var(--text-muted) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: var(--radius-md) !important;
    background: transparent !important;
    transition: var(--transition-smooth) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Interactive Hover Lift & Glow Effect */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link a:hover {
    color: #2563EB !important;
    background: #FFFFFF !important;
    transform: translateY(-2px) !important;
    padding-left: 26px !important;
    box-shadow: 0 10px 20px rgba(37, 99, 235, 0.05) !important;
}

/* Active Tab Master Design with Neon Dot Indicator */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link.is-active a {
    background: var(--primary-gradient) !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    box-shadow: 0 12px 24px rgba(37, 99, 235, 0.22) !important;
    transform: translateY(-1px) !important;
}

/* Add a sleek modern bullet indicator only for the active tab */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link.is-active a::before {
    content: "" !important;
    width: 6px !important;
    height: 6px !important;
    background: #FFFFFF !important;
    border-radius: 50% !important;
    position: absolute !important;
    left: 10px !important;
    animation: scaleInPulse 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards !important;
}
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link.is-active a {
    padding-left: 26px !important;
}

/* --- 4. LUXURY DASHBOARD WELCOME NOTICE --- */
.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content p:first-of-type {
    background: linear-gradient(90deg, #F1F5F9 0%, #F8FAFC 100%) !important;
    padding: 20px 24px !important;
    border-radius: var(--radius-md) !important;
    border-left: 4px solid #2563EB !important;
    color: var(--text-main) !important;
    font-weight: 500 !important;
    margin-bottom: 28px !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.01) !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content p a {
    color: #2563EB !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    position: relative !important;
    transition: var(--transition-smooth) !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content p a::after {
    content: "" !important;
    position: absolute !important;
    width: 100% !important;
    height: 2px !important;
    bottom: -2px !important;
    left: 0 !important;
    background-color: #06B6D4 !important;
    transform: scaleX(0) !important;
    transform-origin: bottom right !important;
    transition: transform 0.3s ease-out !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content p a:hover::after {
    transform: scaleX(1) !important;
    transform-origin: bottom left !important;
}

.elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content p a:hover {
    color: #06B6D4 !important;
}

/* --- 5. CORE INTERACTIVE ANIMATIONS (Keyframes) --- */

/* Entrance Animation for Content Area */
@keyframes slideUpFade {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Pop-in Pulse for Active Dot */
@keyframes scaleInPulse {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* --- 6. CLEANUP CLEARFIX --- */
.elementor-320 .elementor-element.elementor-element-8c600c4::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* --- 7. PREMIUM MOBILE RESPONSIVENESS --- */
@media (max-width: 767px) {
    .elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation,
    .elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-content {
        width: 100% !important;
        float: none !important;
        margin-bottom: 24px !important;
        padding: 24px !important;
    }
    .elementor-320 .elementor-element.elementor-element-8c600c4 .woocommerce-MyAccount-navigation-link a:hover {
        transform: none !important;
        padding-left: 20px !important;
    }
}/* End custom CSS */