@charset 'UTF-8';@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800&display=swap');._button_zy5z5_1 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    line-height: 1;
    border-radius: var(--radius-xl);
    border: none;
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
    user-select: none;
}

._button_zy5z5_1:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Variants */
._button-default_zy5z5_25 {
    background: var(--color-primary);
    color: var(--color-white);
}

._button-default_zy5z5_25:hover:not(:disabled) {
    background: var(--color-primary-hover);
}

._button-destructive_zy5z5_34 {
    background: var(--color-error);
    color: var(--color-white);
}

._button-destructive_zy5z5_34:hover:not(:disabled) {
    background: var(--color-error-dark);
}

._button-outline_zy5z5_43 {
    background: transparent;
    border: 1px solid var(--border-default);
    color: var(--text-primary);
}

._button-outline_zy5z5_43:hover:not(:disabled) {
    background: var(--bg-secondary);
}

._button-secondary_zy5z5_53 {
    background: var(--color-secondary);
    color: var(--color-white);
}

._button-secondary_zy5z5_53:hover:not(:disabled) {
    background: var(--color-secondary-dark);
}

._button-ghost_zy5z5_62 {
    background: transparent;
    color: var(--text-primary);
}

._button-ghost_zy5z5_62:hover:not(:disabled) {
    background: var(--bg-secondary);
}

._button-link_zy5z5_71 {
    background: transparent;
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: 4px;
}

._button-link_zy5z5_71:hover:not(:disabled) {
    text-decoration: none;
}

._button-success_zy5z5_82 {
    background: var(--color-success);
    color: var(--color-white);
}

._button-success_zy5z5_82:hover:not(:disabled) {
    background: var(--color-success-dark);
}

._button-warning_zy5z5_91 {
    background: var(--color-warning);
    color: var(--color-white);
}

._button-warning_zy5z5_91:hover:not(:disabled) {
    background: var(--color-warning-dark);
}

._button-danger_zy5z5_100 {
    background: var(--color-error);
    color: var(--color-white);
}

._button-danger_zy5z5_100:hover:not(:disabled) {
    background: var(--color-error-dark);
}

/* Sizes */
._button-xs_zy5z5_110 {
    height: 32px;
    padding: 0 var(--space-2);
    font-size: var(--text-xs);
}

._button-sm_zy5z5_116 {
    height: 36px;
    padding: 0 var(--space-3);
    font-size: var(--text-sm);
}

._button-default-size_zy5z5_122 {
    height: 40px;
    padding: 0 var(--space-4);
}

._button-lg_zy5z5_127 {
    height: 44px;
    padding: 0 var(--space-8);
    font-size: var(--text-base);
}

._button-xl_zy5z5_133 {
    height: 48px;
    padding: 0 var(--space-10);
    font-size: var(--text-base);
}

._button-icon_zy5z5_139 {
    height: 40px;
    width: 40px;
    padding: 0;
}

/* Full Width */
._button-full-width_zy5z5_146 {
    width: 100%;
}

/* Loading State */
._button-loading_zy5z5_151 {
    position: relative;
    color: transparent;
}

._button-loading_zy5z5_151::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid currentColor;
    border-radius: 50%;
    border-top-color: transparent;
    animation: _spin_zy5z5_1 0.6s linear infinite;
}

/* Icon Spacing */
._button-icon-left_zy5z5_172 {
    margin-right: var(--space-2);
}

._button-icon-right_zy5z5_176 {
    margin-left: var(--space-2);
}._not-found_x9s6r_1 {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-secondary);
    padding: var(--space-6);
}

._not-found-content_x9s6r_10 {
    text-align: center;
    max-width: 600px;
    padding: var(--space-8);
}

._not-found-icon_x9s6r_16 {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: var(--space-6);
}

._not-found-icon_x9s6r_16 svg {
    width: 120px;
    height: 120px;
    color: var(--color-primary);
}

._not-found-title_x9s6r_29 {
    font-size: var(--text-5xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin-bottom: var(--space-4);
}

._not-found-subtitle_x9s6r_36 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    color: var(--text-secondary);
    margin-bottom: var(--space-3);
}

._not-found-description_x9s6r_43 {
    font-size: var(--text-lg);
    color: var(--text-tertiary);
    margin-bottom: var(--space-8);
    line-height: var(--leading-relaxed);
}

._not-found-actions_x9s6r_50 {
    display: flex;
    gap: var(--space-4);
    justify-content: center;
    flex-wrap: wrap;
}

@media (max-width: 640px) {
    ._not-found-icon_x9s6r_16 svg {
        width: 80px;
        height: 80px;
    }

    ._not-found-title_x9s6r_29 {
        font-size: var(--text-4xl);
    }

    ._not-found-subtitle_x9s6r_36 {
        font-size: var(--text-xl);
    }

    ._not-found-description_x9s6r_43 {
        font-size: var(--text-base);
    }

    ._not-found-actions_x9s6r_50 {
        flex-direction: column;
    }
}._header_1ifjz_1 {
    position: sticky;
    top: 0;
    z-index: var(--z-fixed);
    width: 100%;
    background-color: var(--verve-cream);
    color: var(--verve-text-primary);
    box-shadow: none;
    border-bottom: 1px solid var(--verve-grey);
    transition: transform 0.3s ease;
}

._header-hidden_1ifjz_13 {
    transform: translateY(-100%);
}

._header-container_1ifjz_17 {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}

._logo-image_1ifjz_24 {
    max-height: 40px;
    border-radius: 12px;
    width: auto;
    border: 1.5px solid var(--verve-navy);
    padding: 2px;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
    transition: all var(--transition-base);
}

@media (min-width: 768px) {
    ._logo-image_1ifjz_24 {
        max-height: 50px;
        border-radius: 20px;
        border-width: 2px;
    }
}

._logo-image_1ifjz_24:hover {
    border-color: var(--color-accent-dark);
    transform: scale(1.05);
}

._logo-subtext_1ifjz_48 {
    font-size: 10px;
    font-weight: 700;
    color: var(--verve-navy);
    letter-spacing: 4px;
    margin-top: 2px;
    opacity: 0.8;
}

/* Row 1: Logo & Actions */
._header-main_1ifjz_58 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-2) var(--space-mobile-padding);
    gap: var(--space-2);
    min-height: 50px;
}

@media (min-width: 1024px) {
    ._header-main_1ifjz_58 {
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        padding: var(--space-1) var(--space-10);
        gap: var(--space-6);
        min-height: 55px;
    }
}

@media (min-width: 1024px) {
    ._header-main_1ifjz_58 {
        padding: var(--space-1) var(--space-10);
        gap: var(--space-6);
    }
}

._main-left_1ifjz_84 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
}

@media (min-width: 768px) {
    ._main-left_1ifjz_84 {
        display: flex;
    }
}

._search-trigger_1ifjz_97 {
    background: none;
    border: none;
    cursor: pointer;
    padding: var(--space-2);
}

/* Row 2: Navigation */
._header-nav_1ifjz_105 {
    background-color: var(--verve-black);
    padding: 0 var(--space-4);
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {
    ._header-nav_1ifjz_105 {
        height: 30px;
        padding: 0 var(--space-2);
    }
}

/* Logo - Centered Look */
._logo-link_1ifjz_122 {
    display: none;
    /* Hide branding text on mobile */
    flex-direction: column;
    align-items: center;
    text-decoration: none;
}

@media (min-width: 1024px) {
    ._logo-link_1ifjz_122 {
        display: flex;
    }
}

._logo-container_1ifjz_136 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform var(--transition-base);
}

._logo-link_1ifjz_122:hover ._logo-container_1ifjz_136 {
    transform: scale(1.02);
}

._logo-link_1ifjz_122:hover ._logo-text-large_1ifjz_148 {
    color: var(--verve-black);
}

._logo-text-large_1ifjz_148 {
    font-size: 18px;
    font-weight: 800;
    color: var(--verve-navy);
    line-height: 0.9;
    letter-spacing: 1px;
    transition: color var(--transition-base);
}

@media (min-width: 768px) {
    ._logo-text-large_1ifjz_148 {
        font-size: 24px;
        letter-spacing: 2px;
    }
}

._logo-subtext_1ifjz_48 {
    font-size: 8px;
    font-weight: 700;
    color: var(--verve-navy);
    letter-spacing: 4px;
    margin-top: 2px;
    opacity: 0.8;
}

/* Actions */
._actions_1ifjz_178 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-1);
}

._action-item_1ifjz_185 {
    position: relative;
}

._desktop-only-logo_1ifjz_189 {
    display: none;
}

@media (min-width: 1024px) {
    ._desktop-only-logo_1ifjz_189 {
        display: block;
    }
}

._mobile-only-logo_1ifjz_199 {
    display: block;
    margin-bottom: 4px;
}

@media (min-width: 1024px) {
    ._mobile-only-logo_1ifjz_199 {
        display: none;
    }
}

._logo-text-group_1ifjz_210 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

._search-form_1ifjz_216 {
    display: none;
}

@media (min-width: 768px) {
    ._search-form_1ifjz_216 {
        display: block;
        flex: 1;
        max-width: 300px;
        margin-right: var(--space-4);
    }
}

._search-input-container_1ifjz_229 {
    position: relative;
    display: flex;
    align-items: center;
    background-color: #f5f5f7;
    border-radius: var(--radius-full);
    padding: 0 var(--space-3);
    height: 40px;
    border: 1.5px solid transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    width: 200px;
    /* Base width */
}

._search-input-container_1ifjz_229:focus-within {
    background-color: var(--color-white);
    border-color: var(--verve-navy);
    box-shadow: 0 4px 12px rgba(0, 51, 102, 0.1);
    width: 280px;
    /* Expand on focus */
}

._search-icon-wrapper_1ifjz_251 {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-gray-500);
    margin-right: var(--space-2);
    transition: color 0.3s ease;
}

._search-input-container_1ifjz_229:focus-within ._search-icon-wrapper_1ifjz_251 {
    color: var(--verve-navy);
}

._search-input_1ifjz_229 {
    width: 100%;
    background: none;
    border: none;
    outline: none !important;
    /* Remove browser focus ring */
    box-shadow: none !important;
    font-size: 14px;
    color: var(--verve-text-primary);
    padding: var(--space-2) 0;
    font-family: inherit;
}

._search-input_1ifjz_229::placeholder {
    color: var(--color-gray-400);
}

._search-clear-btn_1ifjz_281 {
    background: #e5e5e7;
    border: none;
    color: var(--color-gray-600);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin-left: var(--space-2);
    transition: all 0.2s ease;
}

._search-clear-btn_1ifjz_281:hover {
    background: #d1d1d6;
    color: var(--verve-black);
}

._search-submit-btn_1ifjz_301 {
    display: none;
    /* Hide since icon is on left and we use Enter */
}

._search-action-btn_1ifjz_306 {
    display: block;
}

@media (min-width: 768px) {
    ._search-action-btn_1ifjz_306 {
        display: none;
    }
}

._header-action-btn_1ifjz_316 {
    color: var(--verve-black) !important;
    transition: all var(--transition-base) !important;
}

._header-action-btn_1ifjz_316:hover {
    color: var(--verve-black) !important;
    background-color: var(--verve-grey) !important;
    transform: translateY(-2px) scale(1.08);
}

._cart-badge_1ifjz_327 {
    position: absolute;
    top: -2px;
    right: -2px;
    background-color: var(--verve-navy);
    color: var(--color-white);
    font-size: 10px;
    border-radius: var(--radius-full);
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

/* Navigation Links */
@media (max-width: 767px) {
    ._nav-desktop_1ifjz_345 {
        display: flex;
        align-items: center;
        gap: var(--space-4);
        height: 100%;
        justify-content: center;
        width: 100%;
    }

    ._nav-link_1ifjz_354 {
        font-size: 10px;
        letter-spacing: 1px;
    }
}

@media (min-width: 768px) {
    ._nav-desktop_1ifjz_345 {
        display: flex;
        align-items: center;
        gap: var(--space-12);
        height: 100%;
    }
}

._nav-link_1ifjz_354 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    height: 100%;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
    letter-spacing: 2px;
    text-decoration: none;
    position: relative;
    transition: all var(--transition-base);
    padding: 0 var(--space-1);
}

._nav-link_1ifjz_354::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 3px;
    background-color: var(--color-white);
    transition: width var(--transition-base);
}

._nav-link_1ifjz_354:hover {
    color: var(--color-white);
    opacity: 1;
    background: transparent;
    letter-spacing: 2.5px;
}

._nav-link_1ifjz_354:hover::after {
    width: 100%;
}

/* Active state for both Desktop & Mobile */
._active_1ifjz_408 {
    color: var(--color-accent, #F59E0B) !important;
}

/* Desktop Specific Active */
._nav-link_1ifjz_354._active_1ifjz_408::after {
    width: 100%;
    background-color: var(--color-accent, #F59E0B);
}

/* Mobile Specific Active */
._mobile-nav-link_1ifjz_419._active_1ifjz_408 {
    background-color: rgba(245, 158, 11, 0.1);
    border-left: 4px solid var(--color-accent, #F59E0B);
    padding-left: calc(var(--space-4) - 4px);
}

/* Mobile Search Bar */
._mobile-search-bar_1ifjz_426 {
    display: block;
    padding: var(--space-4);
    background-color: var(--verve-cream);
    border-bottom: 1px solid var(--verve-grey);
    animation: _slideDown_1ifjz_1 0.3s ease-out;
}

@media (min-width: 768px) {
    ._mobile-search-bar_1ifjz_426 {
        display: none;
    }
}

._mobile-search-form_1ifjz_440 {
    width: 100%;
}

._search-input-container-mobile_1ifjz_444 {
    position: relative;
    display: flex;
    align-items: center;
    background-color: var(--color-white);
    border-radius: var(--radius-full);
    padding: 0 var(--space-4);
    height: 44px;
    border: 1.5px solid var(--verve-grey);
    width: 100%;
}

._search-input-container-mobile_1ifjz_444:focus-within {
    border-color: var(--verve-navy);
    box-shadow: 0 4px 12px rgba(11, 35, 65, 0.1);
}

@keyframes _slideDown_1ifjz_1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mobile Menu */
._mobile-menu-btn_1ifjz_474 {
    display: flex;
}

@media (min-width: 1024px) {
    ._mobile-menu-btn_1ifjz_474 {
        display: none;
    }
}

._mobile-menu_1ifjz_474 {
    position: fixed;
    top: 70px;
    /* main header height approx */
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--color-white);
    z-index: var(--z-dropdown);
    padding: var(--space-6);
    overflow-y: auto;
}

._mobile-nav_1ifjz_419 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._mobile-nav-link_1ifjz_419 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    font-size: 18px;
    font-weight: 800;
    color: var(--verve-text-primary);
    text-transform: uppercase;
    letter-spacing: 2px;
    border-bottom: 1px solid var(--verve-grey);
}

/* Dropdown */
._dropdown_1ifjz_517 {
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: var(--space-2);
    background-color: var(--bg-primary);
    border: 1px solid var(--verve-grey);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-xl);
    z-index: var(--z-dropdown);
    width: 240px;
}

._dropdown-content_1ifjz_530 {
    padding: var(--space-2);
}

._menu-item_1ifjz_534 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    width: 100%;
    padding: var(--space-3) var(--space-4);
    font-size: 14px;
    font-weight: 600;
    color: var(--verve-text-primary);
    text-decoration: none;
    border: none;
    background: none;
    cursor: pointer;
    text-align: left;
}

._menu-item_1ifjz_534:hover {
    background-color: var(--verve-grey);
}

/* Cart Dropdown Specific */
._cart-dropdown_1ifjz_555 {
    width: 280px;
    padding: 0;
}

._dropdown-header_1ifjz_560 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--verve-grey);
}

._dropdown-title_1ifjz_568 {
    font-size: 14px;
    font-weight: 700;
    margin: 0;
    color: var(--verve-text-primary);
}

._cart-items_1ifjz_575 {
    max-height: 250px;
    overflow-y: auto;
    padding: var(--space-1);
}

._cart-item_1ifjz_575 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border-bottom: 1px solid var(--verve-grey);
}

._cart-item_1ifjz_575:last-child {
    border-bottom: none;
}

._cart-item-image_1ifjz_593 {
    width: 40px;
    height: 40px;
    background-color: var(--verve-grey);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
}

._cart-item-details_1ifjz_603 {
    flex: 1;
}

._cart-item-name_1ifjz_607 {
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    color: var(--verve-text-primary);
}

._cart-item-price_1ifjz_614 {
    font-size: 11px;
    color: var(--color-gray-500);
    margin: 0px 0 0 0;
}

._cart-footer_1ifjz_620 {
    padding: var(--space-3) var(--space-4);
    border-top: 1px solid var(--verve-grey);
    background-color: var(--verve-cream);
}

._cart-total_1ifjz_626 {
    display: flex;
    justify-content: space-between;
    margin-bottom: var(--space-3);
}

._cart-total-label_1ifjz_632 {
    font-weight: 600;
    color: var(--color-gray-600);
}

._cart-total-value_1ifjz_637 {
    font-weight: 700;
    color: var(--verve-text-primary);
    font-size: 15px;
}

._cart-actions_1ifjz_643 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._empty-cart_1ifjz_649 {
    padding: var(--space-10) var(--space-4);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

._empty-cart-icon_1ifjz_657 {
    color: var(--verve-grey);
    margin-bottom: var(--space-4);
}

._empty-cart-text_1ifjz_662 {
    font-size: 14px;
    color: var(--color-gray-500);
    margin: 0;
}._footer_w3kd9_1 {
    background-color: var(--bg-secondary);
    border-top: 1px solid var(--border-default);
    margin-top: auto;
}

._footer-container_w3kd9_7 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-12) var(--space-4);
}

@media (max-width: 767px) {
    ._footer-container_w3kd9_7 {
        padding: var(--space-6) var(--space-1);
        /* Minimized padding */
        overflow-x: hidden;
        /* Prevent horizontal scroll */
    }
}

._footer-grid_w3kd9_23 {
    display: grid;
    grid-template-columns: 1fr 1.2fr 0.9fr 0.9fr;
    /* Optimized ratios for content */
    gap: var(--space-4);
}

@media (max-width: 767px) {
    ._footer-grid_w3kd9_23 {
        gap: 0;
        /* No visible gap to save space */
    }
}

/* Tablet override removed to keep 4-column layout consistent */

@media (min-width: 1024px) {
    ._footer-grid_w3kd9_23 {
        grid-template-columns: repeat(4, 1fr);
        justify-items: center;
    }
}

/* Brand Section */
._brand-column_w3kd9_47 {
    grid-column: span 1;
}

@media (min-width: 1024px) {
    ._brand-column_w3kd9_47 {
        grid-column: span 1;
    }
}

._brand-link_w3kd9_57 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

._brand-logo_w3kd9_64 {
    width: 48px;
    height: 48px;
}

._brand-name_w3kd9_69 {
    font-family: 'Times New Roman', serif;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
}

._brand-description_w3kd9_76 {
    color: var(--text-muted);
    font-size: var(--text-sm);
    margin-bottom: var(--space-6);
    line-height: var(--leading-relaxed);
}

@media (max-width: 767px) {
    ._brand-name_w3kd9_69 {
        font-size: 14px;
    }

    ._brand-description_w3kd9_76 {
        display: none;
        /* Hide description to clear space */
    }

    ._brand-logo_w3kd9_64 {
        width: 24px;
        height: 24px;
    }

    ._brand-link_w3kd9_57 {
        margin-bottom: var(--space-2);
        flex-direction: column;
        /* Stack logo and name if needed, or keep row */
        align-items: flex-start;
        gap: var(--space-1);
    }

    ._brand-name_w3kd9_69 {
        font-size: 10px;
        white-space: nowrap;
    }
}

._social-links_w3kd9_112 {
    display: flex;
    gap: var(--space-3);
}

._social-link_w3kd9_112 {
    width: 36px;
    height: 36px;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    transition: all var(--transition-fast);
}

._social-link_w3kd9_112:hover {
    background-color: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

/* Link Sections */
._link-column_w3kd9_137 {
    grid-column: span 1;
}

._column-title_w3kd9_141 {
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-4);
    font-size: var(--text-base);
}

._link-list_w3kd9_147 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._footer-link_w3kd9_153 {
    color: var(--text-muted);
    font-size: var(--text-sm);
    transition: color var(--transition-fast);
}

@media (max-width: 767px) {
    ._column-title_w3kd9_141 {
        font-size: 12px;
        margin-bottom: var(--space-2);
    }

    ._footer-link_w3kd9_153 {
        font-size: 10px;
    }

    ._link-list_w3kd9_147 {
        gap: var(--space-1);
    }

    /* Ensure social links wrap if needed or stay compact */
    ._social-links_w3kd9_112 {
        flex-wrap: wrap;
        gap: var(--space-1);
    }

    ._social-link_w3kd9_112 {
        width: 24px;
        height: 24px;
    }
}

._footer-link_w3kd9_153:hover {
    color: var(--color-primary);
}

/* Features Section */
._features-section_w3kd9_190 {
    margin-top: var(--space-12);
    padding-top: var(--space-8);
    border-top: 1px solid var(--border-default);
}

._features-grid_w3kd9_196 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* Forced 3 columns */
    gap: var(--space-8) var(--space-4);
}

@media (max-width: 767px) {
    ._features-grid_w3kd9_196 {
        gap: var(--space-2);
    }

    ._feature-icon_w3kd9_208 {
        width: 32px;
        height: 32px;
    }

    ._feature-content_w3kd9_213 h5 {
        font-size: 11px;
    }

    ._feature-content_w3kd9_213 p {
        font-size: 9px;
    }
}

@media (min-width: 768px) {
    ._features-grid_w3kd9_196 {
        grid-template-columns: repeat(3, 1fr);
    }
}

._feature-item_w3kd9_228 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

._feature-icon_w3kd9_208 {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

._feature-icon_w3kd9_208._success_w3kd9_244 {
    background-color: rgba(16, 185, 129, 0.1);
    color: var(--color-success);
}

._feature-icon_w3kd9_208._warning_w3kd9_249 {
    background-color: rgba(245, 158, 11, 0.1);
    color: var(--color-warning);
}

._feature-icon_w3kd9_208._accent_w3kd9_254 {
    background-color: rgba(249, 115, 22, 0.1);
    color: var(--color-accent);
}

._feature-content_w3kd9_213 h5 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-1);
    font-size: var(--text-base);
}

._feature-content_w3kd9_213 p {
    color: var(--text-muted);
    font-size: var(--text-sm);
    margin: 0;
}

/* Bottom Bar */
._bottom-bar_w3kd9_272 {
    border-top: 1px solid var(--border-default);
    background-color: var(--bg-secondary);
}

._bottom-container_w3kd9_277 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-6) var(--space-4);
}

._bottom-content_w3kd9_284 {
    display: flex;
    flex-direction: row;
    /* Forced row */
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-4);
}

@media (max-width: 767px) {
    ._bottom-content_w3kd9_284 {
        gap: var(--space-2);
        font-size: 10px;
    }
}

@media (min-width: 768px) {
    ._bottom-content_w3kd9_284 {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}

._copyright-section_w3kd9_309 {
    display: flex;
    flex-direction: row;
    /* Forced row */
    align-items: center;
    gap: var(--space-4);
}

@media (max-width: 767px) {
    ._copyright-section_w3kd9_309 {
        gap: var(--space-2);
    }

    ._payment-icons_w3kd9_322 {
        gap: 4px;
    }

    ._payment-icon_w3kd9_322 {
        width: 24px;
        height: 24px;
    }
}

@media (min-width: 768px) {
    ._copyright-section_w3kd9_309 {
        flex-direction: row;
        align-items: center;
        gap: var(--space-6);
    }
}

._copyright-text_w3kd9_340 {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

._payment-methods_w3kd9_345 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

._payment-label_w3kd9_351 {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

._payment-icons_w3kd9_322 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._payment-icon_w3kd9_322 {
    width: 32px;
    height: 32px;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
}

._locale-info_w3kd9_374 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._currency_w3kd9_382 {
    font-family: var(--font-mono);
}._item-container_cwd19_1 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-4);
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
}

@media (min-width: 640px) {
    ._item-container_cwd19_1 {
        flex-direction: row;
    }
}

/* Image Section */
._image-wrapper_cwd19_18 {
    flex-shrink: 0;
}

._image-link_cwd19_22 {
    display: block;
}

._image-container_cwd19_26 {
    width: 6rem;
    /* w-24 */
    height: 6rem;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

@media (min-width: 640px) {
    ._image-container_cwd19_26 {
        width: 8rem;
        /* w-32 */
        height: 8rem;
    }
}

._product-image_cwd19_43 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-fast);
}

._product-image_cwd19_43:hover {
    transform: scale(1.05);
}

/* Details Section */
._details-wrapper_cwd19_55 {
    flex: 1;
    min-width: 0;
}

._details-header_cwd19_60 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

@media (min-width: 640px) {
    ._details-header_cwd19_60 {
        flex-direction: row;
        justify-content: space-between;
    }
}

._info-column_cwd19_73 {
    flex: 1;
}

._product-name_cwd19_77 {
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    color: var(--text-foreground);
    text-decoration: none;
    transition: color var(--transition-fast);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

._product-name_cwd19_77:hover {
    color: var(--color-primary);
}

._variants-container_cwd19_93 {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._variant-badge_cwd19_102 {
    padding: 2px 8px;
    background-color: var(--bg-muted);
    border-radius: var(--radius-md);
}

._stock-status_cwd19_108 {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: var(--space-2);
}

._stock-text_cwd19_115 {
    font-size: var(--text-sm);
}

._stock-text_cwd19_115._in-stock_cwd19_119 {
    color: var(--color-success);
}

._stock-text_cwd19_115._low-stock_cwd19_123 {
    color: var(--color-warning);
}

._stock-icon-success_cwd19_127 {
    color: var(--color-success);
}

._stock-icon-warning_cwd19_131 {
    color: var(--color-warning);
}

/* Price Column */
._price-column_cwd19_136 {
    text-align: right;
}

._current-price_cwd19_140 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    font-family: var(--font-mono);
}

._original-price_cwd19_146 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    text-decoration: line-through;
    font-family: var(--font-mono);
}

/* Controls Section */
._controls-row_cwd19_154 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--space-4);
}

._quantity-wrapper_cwd19_161 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

._quantity-label_cwd19_167 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._quantity-controls_cwd19_172 {
    display: flex;
    align-items: center;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
}

._quantity-btn_cwd19_179 {
    width: 32px;
    height: 32px;
}

._quantity-btn_cwd19_179._minus_cwd19_184 {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

._quantity-btn_cwd19_179._plus_cwd19_189 {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

._quantity-display_cwd19_194 {
    width: 48px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    border-left: 1px solid var(--border-default);
    border-right: 1px solid var(--border-default);
}

._spinner_cwd19_206 {
    animation: _spin_cwd19_206 1s linear infinite;
}

@keyframes _spin_cwd19_206 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

._max-quantity-msg_cwd19_220 {
    font-size: var(--text-xs);
    color: var(--color-warning);
}

._remove-btn_cwd19_225 {
    color: var(--color-destructive);
}

._remove-btn_cwd19_225:hover {
    color: var(--color-destructive);
    background-color: rgba(239, 68, 68, 0.1);
    /* destructive/10 */
}

._remove-icon_cwd19_235 {
    margin-right: var(--space-1);
}._summary-container_1rlg7_1 {
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    position: sticky;
    top: var(--space-4);
}

._summary-title_1rlg7_10 {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-6);
}

/* Order Details */
._details-section_1rlg7_17 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

._detail-row_1rlg7_24 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

._detail-label_1rlg7_30 {
    color: var(--text-muted);
}

._detail-value_1rlg7_34 {
    font-family: var(--font-mono);
}

._detail-row_1rlg7_24._discount_1rlg7_38 {
    color: var(--color-success);
}

._discount-label-wrapper_1rlg7_42 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._discount-badge_1rlg7_48 {
    font-size: var(--text-xs);
    background-color: rgba(34, 197, 94, 0.1);
    /* success/10 */
    color: var(--color-success);
    padding: 2px 8px;
    border-radius: var(--radius-md);
}

._total-row_1rlg7_57 {
    border-top: 1px solid var(--border-default);
    padding-top: var(--space-4);
}

._total-content_1rlg7_62 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

/* Discount Code Section */
._discount-section_1rlg7_71 {
    margin-bottom: var(--space-6);
}

._section-title_1rlg7_75 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-3);
}

._applied-discount_1rlg7_80 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-3);
    background-color: rgba(34, 197, 94, 0.1);
    /* success/10 */
    border: 1px solid rgba(34, 197, 94, 0.2);
    /* success/20 */
    border-radius: var(--radius-lg);
}

._applied-content_1rlg7_92 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._success-icon_1rlg7_98 {
    color: var(--color-success);
}

._applied-text_1rlg7_102 {
    color: var(--color-success);
    font-weight: var(--font-medium);
}

._remove-btn_1rlg7_107 {
    color: var(--text-muted);
}

._remove-btn_1rlg7_107:hover {
    color: var(--color-destructive);
}

._discount-warning_1rlg7_115 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
    margin-top: var(--space-3);
    padding: var(--space-3);
    background-color: rgba(59, 130, 246, 0.1);
    /* info/10 */
    border: 1px solid rgba(59, 130, 246, 0.2);
    /* info/20 */
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

._warning-icon_1rlg7_130 {
    color: rgb(59, 130, 246);
    /* info color */
    flex-shrink: 0;
    margin-top: 2px;
}

._discount-form_1rlg7_137 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._discount-input_1rlg7_143 {
    text-transform: uppercase;
    border-radius: 0.65rem;
}

._discount-hint_1rlg7_148 {
    margin-top: var(--space-3);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Checkout Actions */
._actions-section_1rlg7_155 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._action-icon_1rlg7_161 {
    margin-right: var(--space-2);
}

/* Security Badge */
._security-section_1rlg7_166 {
    margin-top: var(--space-6);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-default);
}

._security-content_1rlg7_172 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._security-icon_1rlg7_181 {
    color: var(--color-success);
}._container_1w9o0_1 {
    max-width: 56rem;
    /* max-w-4xl */
    margin: 0 auto;
    text-align: center;
    padding: var(--space-12) 0;
}

/* Illustration Section */
._illustration-section_1w9o0_10 {
    margin-bottom: var(--space-8);
}

._icon-wrapper_1w9o0_14 {
    width: 8rem;
    /* w-32 */
    height: 8rem;
    margin: 0 auto var(--space-6);
    background-color: var(--bg-muted);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
}

._cart-icon_1w9o0_26 {
    color: var(--text-muted);
}

._title_1w9o0_30 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-2);
}

._description_1w9o0_36 {
    color: var(--text-muted);
    font-size: var(--text-lg);
}

/* Quick Actions */
._actions-container_1w9o0_42 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    justify-content: center;
    margin-bottom: var(--space-12);
}

@media (min-width: 640px) {
    ._actions-container_1w9o0_42 {
        flex-direction: row;
    }
}

._action-icon_1w9o0_56 {
    margin-right: var(--space-2);
}

/* Recommended Products */
._recommended-section_1w9o0_61 {
    margin-bottom: var(--space-12);
}

._section-title_1w9o0_65 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-6);
}

._products-grid_1w9o0_71 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 640px) {
    ._products-grid_1w9o0_71 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    ._products-grid_1w9o0_71 {
        grid-template-columns: repeat(3, 1fr);
    }
}

._product-card_1w9o0_89 {
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: box-shadow var(--transition-fast);
}

._product-card_1w9o0_89:hover {
    box-shadow: var(--shadow-elevated);
}

._image-container_1w9o0_101 {
    aspect-ratio: 1;
    overflow: hidden;
}

._product-image_1w9o0_106 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 300ms ease-in-out;
}

._product-card_1w9o0_89:hover ._product-image_1w9o0_106 {
    transform: scale(1.05);
}

._product-info_1w9o0_117 {
    padding: var(--space-4);
    text-align: left;
}

._product-category_1w9o0_122 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-bottom: var(--space-1);
}

._product-name_1w9o0_128 {
    display: block;
    font-weight: var(--font-medium);
    color: var(--text-foreground);
    text-decoration: none;
    transition: color var(--transition-fast);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: var(--space-2);
}

._product-name_1w9o0_128:hover {
    color: var(--color-primary);
}

._price-row_1w9o0_145 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

._current-price_1w9o0_152 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    font-family: var(--font-mono);
}

._original-price_1w9o0_158 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    text-decoration: line-through;
    font-family: var(--font-mono);
}

._add-icon_1w9o0_165 {
    margin-right: var(--space-2);
}

/* Category Suggestions */
._categories-grid_1w9o0_170 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
}

@media (min-width: 640px) {
    ._categories-grid_1w9o0_170 {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1024px) {
    ._categories-grid_1w9o0_170 {
        grid-template-columns: repeat(6, 1fr);
    }
}

._category-card_1w9o0_188 {
    padding: var(--space-4);
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    text-decoration: none;
    color: inherit;
    transition: background-color var(--transition-fast);
}

._category-card_1w9o0_188:hover {
    background-color: var(--bg-muted);
}

._category-icon-wrapper_1w9o0_202 {
    width: 3rem;
    /* w-12 */
    height: 3rem;
    margin: 0 auto var(--space-3);
    background-color: rgba(37, 99, 235, 0.1);
    /* primary/10 */
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-fast);
}

._category-card_1w9o0_188:hover ._category-icon-wrapper_1w9o0_202 {
    background-color: rgba(37, 99, 235, 0.2);
    /* primary/20 */
}

._category-icon_1w9o0_202 {
    color: var(--color-primary);
}

._category-name_1w9o0_225 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    text-align: center;
}

/* Promotional Banner */
._promo-banner_1w9o0_232 {
    margin-top: var(--space-12);
    padding: var(--space-6);
    background-color: rgba(249, 115, 22, 0.1);
    /* accent/10 */
    border: 1px solid rgba(249, 115, 22, 0.2);
    /* accent/20 */
    border-radius: var(--radius-lg);
}

._promo-header_1w9o0_242 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

._promo-icon_1w9o0_250 {
    color: var(--color-accent);
}

._promo-title_1w9o0_254 {
    font-weight: var(--font-semibold);
    color: var(--color-accent);
}

._promo-text_1w9o0_259 {
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}

._promo-code_1w9o0_264 {
    font-family: var(--font-mono);
    font-weight: var(--font-semibold);
}/* Mobile Summary Container */
._mobile-summary_mdqn8_2 {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: white;
    padding: 1rem 1.25rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
    z-index: 50;
    border-top: 1px solid var(--border-light);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    animation: _slideUp_mdqn8_1 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@media (min-width: 1024px) {
    ._mobile-summary_mdqn8_2 {
        display: none;
    }
}

/* Shipping Info Bar */
._shipping-bar_mdqn8_26 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--color-success);
    background: rgba(22, 163, 74, 0.1);
    padding: 0.35rem;
    border-radius: 6px;
    margin-bottom: 0.25rem;
}

._shipping-text_mdqn8_39 {
    font-weight: 500;
}

/* Main Content Area */
._summary-content_mdqn8_44 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

/* Price Details */
._price-details_mdqn8_52 {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

._total-label_mdqn8_58 {
    font-size: 0.8rem;
    color: var(--color-gray-500);
    font-weight: 500;
}

._total-amount_mdqn8_64 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-primary);
    font-family: var(--font-mono, monospace);
    line-height: 1.2;
}

._savings-tag_mdqn8_72 {
    font-size: 0.7rem;
    color: var(--color-success);
    font-weight: 600;
    background: rgba(22, 163, 74, 0.1);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    display: inline-block;
    margin-top: 0.25rem;
    align-self: flex-start;
}

/* Checkout Button */
._checkout-btn_mdqn8_85 {
    flex: 1;
    max-width: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: var(--color-primary);
    color: white;
    border: none;
    border-radius: var(--radius-xl) !important;
    padding: 0.875rem 1.5rem;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    box-shadow: var(--shadow-md);
    transition: all 0.2s ease;
}

._checkout-btn_mdqn8_85:active {
    transform: scale(0.98);
}

@keyframes _slideUp_mdqn8_1 {
    from {
        transform: translateY(100%);
    }

    to {
        transform: translateY(0);
    }
}._container_366t0_1 {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    position: relative;
}

._container_366t0_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
    z-index: 1;
}

._main-content_366t0_18 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
    padding-bottom: 8rem;
    position: relative;
    z-index: 2;
}

@media (min-width: 1024px) {
    ._main-content_366t0_18 {
        padding-bottom: var(--space-8);
    }
}

/* Header Section */
._page-header_366t0_35 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    margin-bottom: var(--space-8);
    padding: var(--space-6);
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-default);
}

@media (min-width: 640px) {
    ._page-header_366t0_35 {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

._title-section_366t0_55 {
    display: flex;
    flex-direction: column;
}

._page-title_366t0_60 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--verve-black);
}

@media (min-width: 768px) {
    ._page-title_366t0_60 {
        font-size: var(--text-4xl);
    }
}

._item-count_366t0_72 {
    color: var(--text-secondary);
    margin-top: var(--space-1);
    font-size: var(--text-lg);
}

._clear-cart-btn_366t0_78 {
    color: var(--color-destructive);
}

._clear-cart-btn_366t0_78:hover {
    color: var(--color-destructive);
    background-color: rgba(239, 68, 68, 0.1);
    /* destructive/10 */
}

/* Free Shipping Banner */
._shipping-banner_366t0_89 {
    margin-bottom: var(--space-6);
    padding: var(--space-6);
    background: linear-gradient(135deg, rgba(249, 115, 22, 0.1), rgba(37, 99, 235, 0.05));
    border: 1px solid rgba(249, 115, 22, 0.2);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    position: relative;
    overflow: hidden;
}

._shipping-banner_366t0_89::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(to bottom, var(--color-accent), var(--color-accent-light));
}

._banner-content_366t0_110 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    position: relative;
    z-index: 1;
}

._banner-text_366t0_118 {
    color: var(--color-accent);
    font-weight: var(--font-semibold);
    font-size: var(--text-lg);
}

/* Layout Grid */
._layout-grid_366t0_125 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}

@media (min-width: 1024px) {
    ._layout-grid_366t0_125 {
        grid-template-columns: 1fr 320px;
        /* lg:grid-cols-3 (2:1 ratio approx) */
    }
}

/* Cart Items Section */
._cart-items-section_366t0_139 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    box-shadow: var(--shadow-sm);
}

._items-list_366t0_150 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Continue Shopping */
._continue-shopping_366t0_157 {
    margin-top: var(--space-8);
    padding: var(--space-8);
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    text-align: center;
}

._continue-title_366t0_167 {
    font-weight: var(--font-semibold);
    font-size: var(--text-xl);
    margin-bottom: var(--space-2);
    color: var(--text-primary);
}

._continue-text_366t0_174 {
    color: var(--text-secondary);
    font-size: var(--text-base);
    margin-bottom: var(--space-6);
    max-width: 28rem;
    margin-left: auto;
    margin-right: auto;
}

._continue-actions_366t0_183 {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
    justify-content: center;
}

/* Order Summary Section (Desktop) */
._summary-section_366t0_191 {
    display: none;
}

@media (min-width: 1024px) {
    ._summary-section_366t0_191 {
        display: block;
    }
}

/* Loading State */
._loading-container_366t0_202 {
    min-height: 100vh;
    background-color: var(--bg-background);
}

._loading-content_366t0_207 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

._loading-wrapper_366t0_214 {
    text-align: center;
}

._spinner_366t0_218 {
    margin: 0 auto var(--space-4);
    animation: _spin_366t0_218 1s linear infinite;
    color: var(--color-primary);
}

@keyframes _spin_366t0_218 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

._loading-text_366t0_234 {
    color: var(--text-muted);
}._gallery-container_z6wuh_1 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._main-image-container_z6wuh_7 {
    position: relative;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-lg);
    overflow: hidden;
    aspect-ratio: 4/5;
    max-width: 300px;
    margin: 0 auto;
}

._main-image_z6wuh_7 {
    width: 100%;
    height: 100%;
    object-fit: contain;
    cursor: zoom-in;
    transition: transform 300ms ease-in-out;
}

._main-image_z6wuh_7._zoomed_z6wuh_25 {
    transform: scale(1.5);
}

._nav-btn_z6wuh_29 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.8);
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-fast);
}

._nav-btn_z6wuh_29:hover {
    background-color: var(--bg-background);
}

._nav-btn_z6wuh_29._prev_z6wuh_47 {
    left: var(--space-2);
}

._nav-btn_z6wuh_29._next_z6wuh_51 {
    right: var(--space-2);
}

._fullscreen-btn_z6wuh_55 {
    position: absolute;
    top: var(--space-2);
    right: var(--space-2);
    background-color: rgba(255, 255, 255, 0.8);
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-fast);
}

._fullscreen-btn_z6wuh_55:hover {
    background-color: var(--bg-background);
}

._image-counter_z6wuh_73 {
    position: absolute;
    bottom: var(--space-2);
    right: var(--space-2);
    background-color: rgba(255, 255, 255, 0.8);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
}

._thumbnails-container_z6wuh_84 {
    display: flex;
    gap: var(--space-2);
    overflow-x: auto;
    padding-bottom: var(--space-2);
}

._thumbnail-btn_z6wuh_91 {
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 2px solid var(--border-default);
    transition: all var(--transition-fast);
    padding: 0;
    cursor: pointer;
}

._thumbnail-btn_z6wuh_91:hover {
    border-color: var(--text-muted);
}

._thumbnail-btn_z6wuh_91._active_z6wuh_107 {
    border-color: var(--color-primary);
}

._thumbnail-image_z6wuh_111 {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Fullscreen Modal */
._fullscreen-modal_z6wuh_118 {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    background-color: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}

._fullscreen-content_z6wuh_129 {
    position: relative;
    max-width: 100%;
    max-height: 100%;
}

._fullscreen-image_z6wuh_135 {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

._close-btn_z6wuh_141 {
    position: absolute;
    top: var(--space-4);
    right: var(--space-4);
    background-color: rgba(255, 255, 255, 0.8);
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-fast);
}

._close-btn_z6wuh_141:hover {
    background-color: var(--bg-background);
}

._fullscreen-nav-btn_z6wuh_159 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.8);
    width: 48px;
    height: 48px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--transition-fast);
}

._fullscreen-nav-btn_z6wuh_159:hover {
    background-color: var(--bg-background);
}

._fullscreen-nav-btn_z6wuh_159._prev_z6wuh_47 {
    left: var(--space-4);
}

._fullscreen-nav-btn_z6wuh_159._next_z6wuh_51 {
    right: var(--space-4);
}/* TryOnModal.module.css */

/* Overlay */
._modal-overlay_pfes4_4 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.75);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 1rem;
  backdrop-filter: blur(4px);
}

/* Container */
._modal-container_pfes4_20 {
  background: white;
  border-radius: 16px;
  width: 100%;
  max-width: 760px;
  /* Reduced from 800px for compactness */
  max-height: 85vh;
  /* Increased slightly to allow more vertical space */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  animation: _modalIn_pfes4_1 0.3s ease-out;
}

@keyframes _modalIn_pfes4_1 {
  from {
    opacity: 0;
    transform: scale(0.95);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Header */
._modal-header_pfes4_48 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.125rem;
  border-bottom: 1px solid #e5e7eb;
  background-color: white;
  flex-shrink: 0;
}

._modal-title_pfes4_58 {
  font-size: 1.0625rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
}

._close-button_pfes4_65 {
  color: #6b7280;
  transition: color 0.2s;
}

._close-button_pfes4_65:hover {
  color: #111827;
}

/* Content */
._modal-content_pfes4_75 {
  flex: 1;
  overflow: hidden;
  padding: 1rem;
  background-color: #f9fafb;
  display: flex;
  flex-direction: column;
}

/* Grid Layout */
._grid-layout_pfes4_85 {
  display: grid;
  grid-template-columns: 270px 1fr;
  /* Slightly larger sidebar, rest for result */
  gap: 1rem;
  /* Reduced gap */
  flex: 1;
  overflow: hidden;
}

/* Section Title */
._section-title_pfes4_96 {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #374151;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Controls Section (Left ) */
._controls-section_pfes4_106 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  overflow: hidden;
  height: 100%;
}

._scrollable-sidebar-content_pfes4_114 {
  flex: 1;
  overflow-y: auto;
  padding-right: 4px;
  /* Space for scrollbar */
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

._section-block_pfes4_124 {
  background: white;
  padding: 0.875rem;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* Upload Area */
._upload-area_pfes4_133 {
  position: relative;
}

._hidden-input_pfes4_137 {
  display: none;
}

._upload-placeholder_pfes4_141 {
  border: 2px dashed #d1d5db;
  border-radius: 8px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  color: #6b7280;
  cursor: pointer;
  transition: all 0.2s;
  background: #f9fafb;
}

._upload-placeholder_pfes4_141:hover {
  border-color: #3b82f6;
  color: #2563eb;
  background: #eff6ff;
}

._preview-container_pfes4_162 {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
}

._preview-image_pfes4_169 {
  width: 100%;
  height: 140px;
  object-fit: contain;
  display: block;
  background: #f3f4f6;
}

._remove-image-btn_pfes4_177 {
  position: absolute;
  top: 6px;
  right: 6px;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  color: #ef4444;
  transition: transform 0.2s;
}

._remove-image-btn_pfes4_177:hover {
  transform: scale(1.1);
}

/* Product Info */
._product-info-card_pfes4_200 {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

._product-info-row_pfes4_206 {
  display: flex;
  justify-content: space-between;
  font-size: 0.875rem;
}

._label_pfes4_212 {
  color: #6b7280;
}

._value_pfes4_216 {
  font-weight: 500;
  color: #111827;
  text-align: right;
}

/* Action Block */
._action-block_pfes4_223 {
  padding-top: 0.5rem;
  background: white;
  border-top: 1px solid #f3f4f6;
  flex-shrink: 0;
}

._try-on-btn_pfes4_230 {
  height: 40px;
  font-size: 0.9rem;
  font-weight: 600;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
  border: none;
  box-shadow: 0 4px 6px -1px rgba(37, 99, 235, 0.2);
}

._try-on-btn_pfes4_230:hover:not(:disabled) {
  opacity: 0.95;
  transform: translateY(-1px);
}

/* Result Section */
._result-section_pfes4_245 {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

._result-container_pfes4_251 {
  flex: 1;
  background: white;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  padding: 0.5rem;
  /* Minimal padding */
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  max-height: 100%;
  overflow: hidden;
}

/* Result States */
._processing-state_pfes4_267 {
  text-align: center;
  color: #4b5563;
}

._spinner-container_pfes4_272 {
  margin-bottom: 1rem;
  color: #2563eb;
  animation: _spin_pfes4_272 1.5s linear infinite;
}

@keyframes _spin_pfes4_272 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

._empty-state_pfes4_288 {
  text-align: center;
  color: #9ca3af;
}

._empty-icon-wrapper_pfes4_293 {
  margin-bottom: 1rem;
  opacity: 0.5;
}

/* Result Content */
._result-content_pfes4_299 {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  /* Tighter gap */
}

._result-image-wrapper_pfes4_308 {
  flex: 1;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  /* background: #f8fafc; Removed background to focus on image */
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 0;
  /* Important for flex child with overflow */
}

._result-image_pfes4_308 {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  width: auto;
  height: auto;
  display: block;
}

._result-actions_pfes4_331 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

._error-message_pfes4_337 {
  background-color: #fee2e2;
  color: #dc2626;
  padding: 1rem;
  border-radius: 8px;
  margin-bottom: 1rem;
  font-size: 0.9rem;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  ._modal-overlay_pfes4_4 {
    padding: 0;
    align-items: flex-end;
    /* Sheet-like on mobile optional, or center */
  }

  ._modal-container_pfes4_20 {
    width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 0;
  }

  ._grid-layout_pfes4_85 {
    grid-template-columns: 1fr;
    /* Stack vertically */
    gap: 1.5rem;
    overflow-y: visible;
    /* Let scroll handling happen on content */
  }

  ._controls-section_pfes4_106 {
    order: 1;
  }

  ._result-section_pfes4_245 {
    order: 2;
    min-height: 400px;
  }

  ._preview-image_pfes4_169 {
    height: 200px;
  }

  ._result-image_pfes4_308 {
    max-height: 400px;
  }

  ._result-actions_pfes4_331 {
    grid-template-columns: 1fr;
    /* Stack buttons on very small screens if needed */
  }
}._info-container_vnoop_1 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

/* Header Section */
._header_vnoop_8 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._brand_vnoop_14 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

._title_vnoop_21 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    color: var(--text-foreground);
}

@media (min-width: 1024px) {
    ._title_vnoop_21 {
        font-size: var(--text-3xl);
    }
}

/* Rating Section */
._rating-container_vnoop_34 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

._stars_vnoop_40 {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}

._rating-value_vnoop_46 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    margin-left: var(--space-1);
}

._review-count_vnoop_52 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._review-link_vnoop_57 {
    font-size: var(--text-sm);
    padding: 0;
    height: auto;
}

/* Price Section */
._price-section_vnoop_64 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._price-row_vnoop_70 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

._sale-price_vnoop_76 {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-foreground);
    font-family: var(--font-mono);
}

._original-price_vnoop_83 {
    font-size: var(--text-lg);
    color: var(--text-muted);
    text-decoration: line-through;
    font-family: var(--font-mono);
}

._discount-badge_vnoop_90 {
    background-color: var(--color-success);
    color: var(--color-white);
    padding: 2px 8px;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
}

._tax-info_vnoop_99 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Description */
._description_vnoop_105 {
    color: var(--text-muted);
    line-height: 1.6;
}

/* Color Selection */
._color-section_vnoop_111 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._section-label_vnoop_117 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

._selected-value_vnoop_125 {
    color: var(--text-muted);
    font-weight: var(--font-normal);
    margin-left: var(--space-1);
}

._color-options_vnoop_131 {
    display: flex;
    gap: var(--space-2);
}

._color-btn_vnoop_136 {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: 2px solid var(--border-default);
    transition: all var(--transition-fast);
    cursor: pointer;
}

._color-btn_vnoop_136:hover {
    border-color: var(--text-muted);
}

._color-btn_vnoop_136._active_vnoop_149 {
    border-color: var(--color-primary);
    transform: scale(1.1);
}

/* Size Selection */
._size-section_vnoop_155 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._size-guide-btn_vnoop_161 {
    font-size: var(--text-sm);
    padding: 0;
    height: auto;
}

._size-options_vnoop_167 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-2);
}

._size-btn_vnoop_173 {
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-default);
    background-color: var(--bg-background);
    transition: all var(--transition-fast);
    cursor: pointer;
}

._size-btn_vnoop_173:hover:not(:disabled) {
    border-color: var(--text-muted);
}

._size-btn_vnoop_173._active_vnoop_149 {
    border-color: var(--color-primary);
    background-color: var(--color-primary);
    color: var(--color-white);
}

._size-btn_vnoop_173:disabled {
    background-color: var(--bg-muted);
    color: var(--text-muted);
    cursor: not-allowed;
    opacity: 0.6;
}

/* Quantity & Actions */
._actions-section_vnoop_202 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._quantity-row_vnoop_208 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

._quantity-display_vnoop_214 {
    width: 48px;
    text-align: center;
    font-family: var(--font-mono);
}

._stock-info_vnoop_220 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-top: var(--space-1);
}

._buttons-row_vnoop_226 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._validation-error_vnoop_232 {
    font-size: var(--text-sm);
    color: var(--color-error);
}

._secondary-actions_vnoop_237 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
}

._try-on-btn_vnoop_243 {
    border-color: #f472b6;
    color: #db2777;
}

._try-on-btn_vnoop_243:hover {
    background-color: #fdf2f8;
    border-color: #ec4899;
}

._wishlist-btn-active_vnoop_253 {
    color: #ef4444 !important;
    border-color: rgba(239, 68, 68, 0.4) !important;
    background-color: rgba(239, 68, 68, 0.05) !important;
}

._wishlist-btn-active_vnoop_253:hover {
    background-color: rgba(239, 68, 68, 0.1) !important;
}

/* Features */
._features-section_vnoop_264 {
    border-top: 1px solid var(--border-default);
    padding-top: var(--space-6);
}

._features-list_vnoop_269 {
    display: grid;
    gap: var(--space-4);
}

._feature-item_vnoop_274 {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

._feature-icon_vnoop_280 {
    color: var(--text-muted);
}

._feature-text_vnoop_284 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Social Share */
._share-section_vnoop_290 {
    border-top: 1px solid var(--border-default);
    padding-top: var(--space-6);
}

._share-title_vnoop_295 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    margin-bottom: var(--space-3);
}

._share-buttons_vnoop_301 {
    display: flex;
    gap: var(--space-2);
}

/* Size Guide Modal */
._modal-overlay_vnoop_307 {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4);
}

._modal-content_vnoop_318 {
    background-color: var(--bg-background);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    max-width: 36rem;
    /* max-w-xl for compact sizing */
    width: 100%;
    padding: var(--space-6);
    max-height: 90vh;
    overflow-y: auto;
}

._modal-header_vnoop_330 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-4);
}

._modal-title_vnoop_337 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

._modal-close-btn_vnoop_342 {
    color: hsl(0, 85%, 60%);
    transition: all 0.2s ease;
}

._modal-close-btn_vnoop_342:hover {
    color: hsl(0, 85%, 50%);
    background-color: hsl(0, 85%, 95%);
    transform: scale(1.1);
}

._size-guide-image-container_vnoop_353 {
    width: 100%;
    margin-bottom: var(--space-4);
    border-radius: var(--radius-md);
    overflow: hidden;
    background-color: var(--bg-muted);
    display: flex;
    justify-content: center;
}

._size-guide-image_vnoop_353 {
    width: 100%;
    max-width: 500px;
    height: auto;
    display: block;
}

._size-table_vnoop_370 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-4);
    font-size: var(--text-sm);
    margin-bottom: var(--space-4);
}

._table-header_vnoop_378 {
    font-weight: var(--font-medium);
}

._modal-footer_vnoop_382 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: center;
}._star-rating_17yys_1 {
    display: flex;
    align-items: center;
    gap: 2px;
}

._star-interactive_17yys_7 {
    cursor: pointer;
    transition: transfrom 0.1s ease;
}

._star-interactive_17yys_7:hover {
    transform: scale(1.1);
}

._star_17yys_1 {
    color: #e2e8f0;
    /* text-muted-foreground equivalent */
    fill: transparent;
    transition: all 0.2s ease;
}

._star-filled_17yys_23 {
    color: #f59e0b;
    /* text-accent / yellow-500 equivalent */
    fill: #f59e0b;
}

._star-text_17yys_29 {
    margin-left: 8px;
    font-size: 0.875rem;
    color: #4b5563;
    font-weight: 500;
}._overlay_1j1gc_1 {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    backdrop-filter: blur(4px);
}

._modal_1j1gc_15 {
    background: white;
    border-radius: 16px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    animation: _slideUp_1j1gc_1 0.3s ease-out;
}

@keyframes _slideUp_1j1gc_1 {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

._header_1j1gc_36 {
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._title_1j1gc_44 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

._close-btn_1j1gc_51 {
    background: none;
    border: none;
    cursor: pointer;
    color: #6b7280;
    padding: 4px;
    border-radius: 50%;
    transition: all 0.2s;
}

._close-btn_1j1gc_51:hover {
    background-color: #f3f4f6;
    color: #374151;
}

._content_1j1gc_66 {
    padding: 24px;
}

._product-info_1j1gc_70 {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e5e7eb;
}

._product-image_1j1gc_78 {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 8px;
    background-color: #f3f4f6;
}

._product-details_1j1gc_86 {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

._product-name_1j1gc_92 {
    font-weight: 500;
    color: #111827;
    margin-bottom: 4px;
}

._rating-section_1j1gc_98 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

._rating-label_1j1gc_106 {
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
}

._form-group_1j1gc_112 {
    margin-bottom: 24px;
}

._label_1j1gc_116 {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
}

._textarea_1j1gc_124 {
    width: 100%;
    min-height: 120px;
    padding: 12px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    resize: vertical;
    font-family: inherit;
    font-size: 0.875rem;
    transition: border-color 0.2s;
}

._textarea_1j1gc_124:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.1);
}

._footer_1j1gc_142 {
    padding: 16px 24px;
    background-color: #f9fafb;
    border-top: 1px solid #e5e7eb;
    border-radius: 0 0 16px 16px;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

._btn_1j1gc_152 {
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid transparent;
}

._btn-cancel_1j1gc_162 {
    background-color: white;
    border-color: #d1d5db;
    color: #374151;
}

._btn-cancel_1j1gc_162:hover {
    background-color: #f9fafb;
    border-color: #9ca3af;
}

._btn-submit_1j1gc_173 {
    background-color: #2563eb;
    color: white;
}

._btn-submit_1j1gc_173:hover {
    background-color: #1d4ed8;
}

._btn-submit_1j1gc_173:disabled {
    background-color: #93c5fd;
    cursor: not-allowed;
}

._error-message_1j1gc_187 {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 4px;
}._tabs-container_10hn5_1 {
    background-color: var(--bg-background);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
}

._tabs-nav-container_10hn5_7 {
    border-bottom: 1px solid var(--border-default);
}

._tabs-nav_10hn5_7 {
    display: flex;
    gap: var(--space-8);
    padding: 0 var(--space-6);
    overflow-x: auto;
}

._tab-btn_10hn5_18 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4) 0;
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    border-bottom: 2px solid transparent;
    transition: all var(--transition-fast);
    color: var(--text-muted);
    white-space: nowrap;
}

._tab-btn_10hn5_18:hover {
    color: var(--text-foreground);
}

._tab-btn_10hn5_18._active_10hn5_35 {
    border-bottom-color: var(--color-primary);
    color: var(--color-primary);
}

._tab-content_10hn5_40 {
    padding: var(--space-6);
}

/* Details Tab */
._details-content_10hn5_45 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._section-title_10hn5_51 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-2);
}

._specs-grid_10hn5_56 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-4);
    font-size: var(--text-sm);
}

@media (min-width: 768px) {
    ._specs-grid_10hn5_56 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._spec-item_10hn5_69 {
    display: flex;
    justify-content: space-between;
    padding: var(--space-1) 0;
    border-bottom: 1px solid var(--border-default);
}

._spec-label_10hn5_76 {
    color: var(--text-muted);
}

._spec-value_10hn5_80 {
    font-weight: var(--font-medium);
}

._features-list_10hn5_84 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._feature-item_10hn5_92 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
}

._feature-check_10hn5_98 {
    color: var(--color-success);
    margin-top: 2px;
    flex-shrink: 0;
}

/* Reviews Tab */
._reviews-content_10hn5_105 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

._rating-summary_10hn5_111 {
    background-color: var(--bg-muted);
    padding: var(--space-4);
    border-radius: var(--radius-lg);
}

._rating-overview_10hn5_117 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

._rating-big_10hn5_124 {
    text-align: center;
}

._rating-number_10hn5_128 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
}

._rating-stars_10hn5_133 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-1);
    margin-bottom: var(--space-1);
}

._rating-count_10hn5_141 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-2);
}

._write-review-btn_10hn5_147 {
    background-color: #f59e0b;
    /* Amber 500 */
    color: var(--text-white);
    border: none;
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    cursor: pointer;
    transition: background-color var(--transition-fast);
    width: 100%;
}

._write-review-btn_10hn5_147:hover {
    background-color: #d97706;
    /* Amber 600 */
}

._purchase-required_10hn5_166 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2);
    background-color: #fffbeb;
    /* Amber 50 */
    border: 1px solid #fde68a;
    /* Amber 200 */
    border-radius: var(--radius-md);
    color: #92400e;
    /* Amber 800 */
    font-size: var(--text-xs);
    text-align: left;
}

._purchase-loading_10hn5_182 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    padding: var(--space-2);
}

._rating-bars_10hn5_188 {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._rating-bar-row_10hn5_195 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
}

._star-label_10hn5_202 {
    width: 12px;
}

._star-icon_10hn5_206 {
    color: var(--color-accent);
}

._bar-container_10hn5_210 {
    flex: 1;
    background-color: var(--border-default);
    border-radius: var(--radius-full);
    height: 8px;
    overflow: hidden;
}

._bar-fill_10hn5_218 {
    background-color: var(--color-accent);
    height: 100%;
    border-radius: var(--radius-full);
}

._bar-count_10hn5_224 {
    width: 32px;
    color: var(--text-muted);
}

._reviews-list_10hn5_229 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._review-item_10hn5_235 {
    border-bottom: 1px solid var(--border-default);
    padding-bottom: var(--space-4);
}

._pinned-review_10hn5_240 {
    background-color: rgba(255, 247, 237, 0.5);
    /* orange-50/50 */
    border: 1px solid var(--color-accent);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    margin-bottom: var(--space-4);
}

._review-header_10hn5_249 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

._user-avatar_10hn5_255 {
    width: 40px;
    height: 40px;
    background-color: var(--bg-muted);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
}

._review-body_10hn5_265 {
    flex: 1;
}

._review-meta_10hn5_269 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-1);
}

._reviewer-name_10hn5_276 {
    font-weight: var(--font-medium);
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._pinned-badge_10hn5_283 {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background-color: var(--color-accent);
    color: white;
    font-size: var(--text-xs);
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-weight: var(--font-medium);
}

._review-date_10hn5_295 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._review-specs_10hn5_300 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-2);
}

._review-text_10hn5_306 {
    font-size: var(--text-sm);
    line-height: 1.5;
}

._admin-reply_10hn5_311 {
    margin-top: var(--space-3);
    background-color: var(--bg-muted);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--color-primary);
}

._admin-reply-header_10hn5_319 {
    margin-bottom: var(--space-1);
}

._admin-badge_10hn5_323 {
    font-size: var(--text-xs);
    font-weight: var(--font-bold);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

._admin-reply-text_10hn5_331 {
    font-size: var(--text-sm);
    color: var(--text-foreground);
    font-style: italic;
}

._helpful-btn_10hn5_337 {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    margin-top: var(--space-2);
    font-size: var(--text-xs);
    color: var(--text-muted);
    transition: color var(--transition-fast);
}

._helpful-btn_10hn5_337:hover {
    color: var(--color-primary);
}

/* Shipping Tab */
._shipping-content_10hn5_352 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._shipping-grid_10hn5_358 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 768px) {
    ._shipping-grid_10hn5_358 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._shipping-title_10hn5_370 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-3);
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._shipping-options_10hn5_378 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    font-size: var(--text-sm);
}

._shipping-option_10hn5_378 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-default);
}

._shipping-option_10hn5_378:last-child {
    border-bottom: none;
}

._option-name_10hn5_397 {
    font-weight: var(--font-medium);
}

._option-desc_10hn5_401 {
    color: var(--text-muted);
}

._option-price_10hn5_405 {
    font-family: var(--font-mono);
}

._option-price_10hn5_405._free_10hn5_409 {
    color: var(--color-success);
}

._returns-list_10hn5_413 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Care Tab */
._care-content_10hn5_422 {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

._care-grid_10hn5_428 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 768px) {
    ._care-grid_10hn5_428 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._care-subtitle_10hn5_440 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-2);
}

._care-list_10hn5_445 {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._care-tips_10hn5_453 {
    background-color: var(--bg-muted);
    padding: var(--space-4);
    border-radius: var(--radius-lg);
}

._care-tip-content_10hn5_459 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
}

._care-tip-icon_10hn5_465 {
    color: var(--color-warning);
    margin-top: 2px;
}

._care-tip-text_10hn5_470 {
    font-size: var(--text-sm);
}

._care-tip-title_10hn5_474 {
    font-weight: var(--font-medium);
    color: #4b5563;
    margin: 0;
}

._reviewTitle_10hn5_480 {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin-top: 4px;
    margin-bottom: 4px;
    display: block;
}

._reviewFooter_10hn5_489 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #f3f4f6;
}

._reviewDate_10hn5_498 {
    font-size: 0.75rem;
    color: #9ca3af;
}

._voteButtons_10hn5_503 {
    display: flex;
    gap: 16px;
}

._voteBtn_10hn5_508 {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: #6b7280;
    font-size: 0.875rem;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s;
}

._voteBtn_10hn5_508:hover {
    color: #2563eb;
    background-color: #eff6ff;
}._card_15c8l_1 {
    display: block;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
    transition: all var(--transition-base);
}

@media (max-width: 767px) {
    ._card_15c8l_1 {
        border: none;
        border-radius: 12px;
        max-width: none;
        width: 100%;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
        background-color: var(--color-white);
    }
}

@media (min-width: 480px) {
    ._card_15c8l_1 {
        border-radius: var(--radius-lg);
        max-width: 220px;
    }
}

._card_15c8l_1:hover {
    box-shadow: var(--shadow-lg);
}

/* Image Section */
._image-container_15c8l_35 {
    position: relative;
    aspect-ratio: 3/4;
    overflow: hidden;
    background-color: var(--bg-secondary);
}

@media (max-width: 767px) {
    ._image-container_15c8l_35 {
        margin: 8px;
        border-radius: 8px;
    }
}

._product-image_15c8l_49 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-normal);
}

._card_15c8l_1:hover ._product-image_15c8l_49 {
    transform: scale(1.05);
}

/* Badges */
._badges_15c8l_61 {
    position: absolute;
    top: var(--space-2);
    left: var(--space-2);
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    z-index: 10;
}

._badge_15c8l_61 {
    padding: 2px 8px;
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

._badge-new_15c8l_78 {
    background-color: var(--color-success);
    color: var(--color-white);
}

._badge-discount_15c8l_83 {
    background-color: var(--color-error);
    color: var(--color-white);
}

._badge-low-stock_15c8l_88 {
    background-color: var(--color-warning);
    color: var(--color-white);
}

/* Action Buttons (Top Right) */
._top-actions_15c8l_94 {
    position: absolute;
    top: var(--space-2);
    right: var(--space-2);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    z-index: 10;
}

._action-btn_15c8l_104 {
    width: 36px;
    height: 36px;
    background-color: var(--color-white);
    backdrop-filter: blur(4px);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    /* Always visible on all devices */
    transition: all var(--transition-fast);
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

._action-btn_15c8l_104:hover {
    transform: scale(1.1);
    background-color: var(--color-white);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

._try-on-btn_15c8l_127 {
    color: #E91E63;
    /* Vibrant pink color for Try-On */
}

._try-on-btn_15c8l_127 svg {
    filter: drop-shadow(0 0 2px rgba(233, 30, 99, 0.3));
}

._heart-active_15c8l_136 {
    color: var(--color-error);
    fill: var(--color-error);
}

._action-btn_15c8l_104._active_15c8l_141 {
    border-color: var(--color-error-light);
    background-color: #fff1f1;
}

@media (max-width: 767px) {
    ._action-btn_15c8l_104 {
        width: 32px;
        /* Slightly smaller on mobile to not crowd image */
        height: 32px;
        opacity: 1 !important;
        background-color: rgba(255, 255, 255, 0.95);
    }

    ._badges_15c8l_61 {
        top: 4px;
        left: 4px;
    }

    ._top-actions_15c8l_94 {
        top: 4px;
        right: 4px;
    }
}

/* Quick View (Bottom Overlay) */
._quick-view-container_15c8l_167 {
    position: absolute;
    bottom: var(--space-2);
    left: var(--space-2);
    right: var(--space-2);
    transition: all var(--transition-normal);
    transform: translateY(10px);
    opacity: 0;
    display: none;
}

@media (min-width: 768px) {
    ._quick-view-container_15c8l_167 {
        display: block;
    }
}

._card_15c8l_1:hover ._quick-view-container_15c8l_167 {
    transform: translateY(0);
    opacity: 1;
}

._quick-view-btn_15c8l_189 {
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(4px);
}

._quick-view-btn_15c8l_189:hover {
    background-color: var(--bg-primary);
}

/* Thumbnails */
._thumbnails_15c8l_199 {
    padding: 0 var(--space-4) var(--space-3);
}

._thumbnail-list_15c8l_203 {
    display: flex;
    gap: var(--space-1);
    overflow-x: auto;
    scrollbar-width: none;
    /* Firefox */
}

._thumbnail-list_15c8l_203::-webkit-scrollbar {
    display: none;
    /* Chrome/Safari */
}

._thumbnail-btn_15c8l_216 {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: var(--radius-sm);
    border: 2px solid var(--border-default);
    overflow: hidden;
    transition: all var(--transition-fast);
    padding: 0;
    cursor: pointer;
}

._thumbnail-btn_15c8l_216:hover {
    border-color: var(--border-dark);
}

._thumbnail-btn_15c8l_216._active_15c8l_141 {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2);
}

._thumbnail-image_15c8l_237 {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Product Info */
._info_15c8l_244 {
    padding: var(--space-1) var(--space-2);
}

._brand_15c8l_248 {
    font-size: 8px;
    /* Further reduced from 10px */
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

._title_15c8l_257 {
    font-weight: var(--font-medium);
    font-size: 10px;
    /* Reduced from 11px */
    margin-bottom: var(--space-1);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color var(--transition-fast);
}

@media (min-width: 480px) {
    ._title_15c8l_257 {
        font-size: 13px;
    }
}

._card_15c8l_1:hover ._title_15c8l_257 {
    color: var(--color-primary);
}

._price-container_15c8l_280 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-1);
}

._price_15c8l_280 {
    font-weight: var(--font-semibold);
    font-family: var(--font-mono);
    font-size: 11px;
    /* Reduced from 13px */
}

@media (min-width: 480px) {
    ._price_15c8l_280 {
        font-size: 14px;
    }
}

._original-price_15c8l_300 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    text-decoration: line-through;
    font-family: var(--font-mono);
}

._sizes_15c8l_307 {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    margin-bottom: var(--space-1);
}

._sizes-label_15c8l_314 {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

._size-list_15c8l_319 {
    display: flex;
    gap: var(--space-1);
}

._size-badge_15c8l_324 {
    font-size: var(--text-xs);
    background-color: var(--bg-secondary);
    color: var(--text-muted);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

/* Cart Overlay (Bottom of Image) */
._cart-overlay_15c8l_333 {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--space-2);
    background: linear-gradient(to top, rgba(0, 0, 0, 0.4), transparent);
    transform: translateY(100%);
    transition: transform var(--transition-normal);
    z-index: 10;
}

._card_15c8l_1:hover ._cart-overlay_15c8l_333 {
    transform: translateY(0);
}

._cart-btn_15c8l_349 {
    width: 100%;
    background-color: var(--color-white) !important;
    color: var(--color-primary) !important;
    font-weight: var(--font-semibold) !important;
    font-size: var(--text-xs) !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

._cart-btn_15c8l_349:hover {
    background-color: var(--color-primary) !important;
    color: var(--color-white) !important;
}

@media (max-width: 767px) {
    ._cart-overlay_15c8l_333 {
        transform: translateY(0);
        background: none;
        padding: 4px;
    }

    ._cart-btn_15c8l_349 {
        height: 28px;
        font-size: 10px !important;
        opacity: 0.9;
    }
}._container_527p6_1 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    margin-top: var(--space-12);
}

._header_527p6_8 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._title_527p6_14 {
    font-size: var(--text-2xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
}

._view-all-btn_527p6_20 {
    display: flex;
    align-items: center;
}

._arrow-icon_527p6_25 {
    margin-left: var(--space-2);
}

._grid_527p6_29 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}

@media (min-width: 768px) {
    ._grid_527p6_29 {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1024px) {
    ._grid_527p6_29 {
        grid-template-columns: repeat(4, 1fr);
    }
}

._loading_527p6_47 {
    padding: var(--space-12);
    text-align: center;
    color: var(--text-muted);
    font-style: italic;
}._container_4bh65_1 {
    min-height: 100vh;
    background-color: var(--bg-background);
}

._main-content_4bh65_6 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
}

/* Breadcrumb */
._breadcrumb_4bh65_14 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-8);
}

._breadcrumb-link_4bh65_23 {
    transition: color var(--transition-fast);
}

._breadcrumb-link_4bh65_23:hover {
    color: var(--color-primary);
}

._breadcrumb-current_4bh65_31 {
    color: var(--text-foreground);
}

/* Layout */
._product-grid_4bh65_36 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-bottom: var(--space-16);
}

@media (min-width: 1024px) {
    ._product-grid_4bh65_36 {
        grid-template-columns: 0.8fr 1.2fr;
        gap: var(--space-12);
    }
}

/* Sections */
._tabs-section_4bh65_51 {
    margin-bottom: var(--space-16);
}

._related-section_4bh65_55 {
    margin-bottom: var(--space-8);
}

/* Cart Notification */
._notification_4bh65_60 {
    position: fixed;
    bottom: var(--space-4);
    right: var(--space-4);
    background-color: var(--color-success);
    color: var(--color-white);
    padding: var(--space-4);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    z-index: var(--z-modal);
    max-width: 24rem;
    /* max-w-sm */
    animation: _slideIn_4bh65_1 0.3s ease-out;
}

@keyframes _slideIn_4bh65_1 {
    from {
        transform: translateY(100%);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

._notification-content_4bh65_87 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

._notification-icon_4bh65_93 {
    flex-shrink: 0;
    margin-top: 2px;
}

._notification-body_4bh65_98 {
    flex: 1;
}

._notification-title_4bh65_102 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-1);
}

._notification-message_4bh65_107 {
    font-size: var(--text-sm);
    opacity: 0.9;
    margin-bottom: var(--space-3);
}

._notification-actions_4bh65_113 {
    display: flex;
    gap: var(--space-2);
}

._notification-btn_4bh65_118 {
    background-color: var(--color-white);
    color: var(--color-success);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-md);
    transition: background-color var(--transition-fast);
}

._notification-btn_4bh65_118:hover {
    background-color: rgba(255, 255, 255, 0.9);
}

._notification-close_4bh65_132 {
    color: var(--color-white);
    opacity: 0.8;
    transition: opacity var(--transition-fast);
}

._notification-close_4bh65_132:hover {
    opacity: 1;
}

/* Loading State */
._loading-container_4bh65_143 {
    min-height: 100vh;
    background-color: var(--bg-background);
}

._loading-content_4bh65_148 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
}

._loading-grid_4bh65_155 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
    margin-bottom: var(--space-12);
}

@media (min-width: 1024px) {
    ._loading-grid_4bh65_155 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._loading-image_4bh65_168 {
    aspect-ratio: 1;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-lg);
    margin-bottom: var(--space-4);
}

._loading-thumbnails_4bh65_175 {
    display: flex;
    gap: var(--space-2);
}

._loading-thumb_4bh65_175 {
    width: 64px;
    height: 64px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-md);
}

._loading-info_4bh65_187 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

._loading-bar_4bh65_193 {
    height: 24px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-md);
}

._loading-bar_4bh65_193._title_4bh65_199 {
    width: 75%;
    height: 32px;
}

._loading-bar_4bh65_193._price_4bh65_204 {
    width: 25%;
}

._loading-bar_4bh65_193._desc_4bh65_208 {
    width: 100%;
    height: 80px;
}

/* Error State */
._error-container_4bh65_214 {
    min-height: 100vh;
    background-color: var(--bg-background);
}

._error-content_4bh65_219 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-16) var(--space-4);
    text-align: center;
}

._error-icon_4bh65_227 {
    margin: 0 auto var(--space-4);
    color: var(--text-muted);
}

._error-title_4bh65_232 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-2);
}

._error-message_4bh65_238 {
    color: var(--text-muted);
    margin-bottom: var(--space-6);
}._hero-section_jq31f_1 {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: var(--verve-cream);
    min-height: calc(100vh - 60px);
    /* Adjusted for compact mobile header */
}

._hero-split-container_jq31f_10 {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: calc(100vh - 60px);
}

@media (min-width: 1024px) {
    ._hero-section_jq31f_1 {
        min-height: calc(100vh - 90px);
    }

    ._hero-split-container_jq31f_10 {
        flex-direction: row;
        height: calc(100vh - 90px);
        min-height: auto;
    }
}

/* Left Side: Content */
._hero-left_jq31f_30 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-6) var(--space-4);
    background-color: #ECECE6;
}

@media (min-width: 1024px) {
    ._hero-left_jq31f_30 {
        padding: var(--space-10) var(--space-16);
    }
}

._hero-content-box_jq31f_45 {
    max-width: 450px;
    text-align: center;
}

@media (min-width: 1024px) {
    ._hero-content-box_jq31f_45 {
        text-align: left;
    }
}

._hero-label_jq31f_56 {
    display: block;
    font-size: 16px;
    font-weight: 500;
    color: var(--verve-black);
    margin-bottom: var(--space-4);
}

._hero-headline_jq31f_64 {
    font-size: 36px;
    line-height: 1.1;
    font-weight: 800;
    color: var(--verve-black);
    margin-bottom: var(--space-6);
    text-transform: uppercase;
    letter-spacing: -1px;
}

@media (min-width: 1024px) {
    ._hero-headline_jq31f_64 {
        font-size: 64px;
    }
}

._hero-body_jq31f_80 {
    font-size: 16px;
    line-height: 1.6;
    color: var(--verve-black);
    margin-bottom: var(--space-6);
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 1024px) {
    ._hero-body_jq31f_80 {
        font-size: 18px;
        margin-left: 0;
        margin-right: 0;
    }
}

._hero-promo_jq31f_98 {
    font-size: 18px;
    font-weight: 700;
    color: var(--verve-black);
    margin-bottom: var(--space-6);
    text-transform: uppercase;
    letter-spacing: 1px;
}

._cta-button_jq31f_107 {
    background-color: var(--verve-black);
    color: var(--color-white);
    padding: var(--space-4) var(--space-12);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 2px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;
    transition: opacity 0.2s;
}

._cta-button_jq31f_107:hover {
    opacity: 0.9;
}

/* Right Side: Image */
._hero-right_jq31f_125 {
    flex: 1;
    position: relative;
    overflow: hidden;
    min-height: 400px;
}

._image-wrapper_jq31f_132 {
    width: 100%;
    height: 100%;
    position: relative;
}

._hero-photo_jq31f_138 {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



/* Circle Badge */
._circle-badge_jq31f_147 {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    width: 180px;
    height: 180px;
    background-color: transparent;
    border-radius: 50%;
    z-index: 10;
    display: none;
    pointer-events: none;
}

@media (min-width: 1024px) {
    ._circle-badge_jq31f_147 {
        display: block;
    }
}

._circle-badge_jq31f_147 svg {
    width: 100%;
    height: 100%;
    fill: var(--color-white);
    animation: _rotate_jq31f_1 20s linear infinite;
}

._circle-badge_jq31f_147 text {
    font-family: var(--font-primary);
    font-weight: 800;
    font-size: 8px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

@keyframes _rotate_jq31f_1 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Slick Carousel Customization */
._hero-slider_jq31f_193 {
    width: 100%;
    height: 100% !important;
}

._hero-slider_jq31f_193 .slick-list,
._hero-slider_jq31f_193 .slick-track {
    height: 100%;
}

._slider-item_jq31f_203 {
    outline: none;
    /* remove focus border */
    height: 100%;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

/* Customize Dots */
._custom-dots_jq31f_213 {
    bottom: 25px !important;
    z-index: 10;
    width: auto !important;
    left: 50% !important;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.2);
    padding: 4px 12px;
    border-radius: 20px;
    display: flex !important;
    gap: 8px;
}

._custom-dots_jq31f_213 li {
    margin: 0 !important;
    width: 10px !important;
    height: 10px !important;
}

._custom-dots_jq31f_213 li button {
    width: 10px !important;
    height: 10px !important;
    padding: 0 !important;
}

._custom-dots_jq31f_213 li button:before {
    font-size: 8px !important;
    width: 10px !important;
    height: 10px !important;
    line-height: 10px !important;
    color: var(--color-white) !important;
    opacity: 0.5 !important;
}

._custom-dots_jq31f_213 li._slick-active_jq31f_247 button:before {
    color: var(--color-white) !important;
    opacity: 1 !important;
}/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* Slider */
.slick-loading .slick-list
{
    background: #fff url('/assets/ajax-loader-BcnMEykj.gif') center center no-repeat;
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('data:application/vnd.ms-fontobject;base64,AAgAAGQHAAABAAIAAAAAAAIABQkAAAAAAAABAJABAAAAAExQAQAAgCAAAAAAAAAAAAAAAAEAAAAAAAAATxDE8AAAAAAAAAAAAAAAAAAAAAAAAAoAcwBsAGkAYwBrAAAADgBSAGUAZwB1AGwAYQByAAAAFgBWAGUAcgBzAGkAbwBuACAAMQAuADAAAAAKAHMAbABpAGMAawAAAAAAAAEAAAANAIAAAwBQRkZUTW3RyK8AAAdIAAAAHEdERUYANAAGAAAHKAAAACBPUy8yT/b9sgAAAVgAAABWY21hcCIPRb0AAAHIAAABYmdhc3D//wADAAAHIAAAAAhnbHlmP5u2YAAAAzwAAAIsaGVhZAABMfsAAADcAAAANmhoZWED5QIFAAABFAAAACRobXR4BkoASgAAAbAAAAAWbG9jYQD2AaIAAAMsAAAAEG1heHAASwBHAAABOAAAACBuYW1lBSeBwgAABWgAAAFucG9zdC+zMgMAAAbYAAAARQABAAAAAQAA8MQQT18PPPUACwIAAAAAAM9xeH8AAAAAz3F4fwAlACUB2wHbAAAACAACAAAAAAAAAAEAAAHbAAAALgIAAAAAAAHbAAEAAAAAAAAAAAAAAAAAAAAEAAEAAAAHAEQAAgAAAAAAAgAAAAEAAQAAAEAAAAAAAAAAAQIAAZAABQAIAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAIABQkAAAAAAACAAAABAAAAIAAAAAAAAAAAUGZFZABAAGEhkgHg/+AALgHb/9sAAAABAAAAAAAAAgAAAAAAAAACAAAAAgAAJQAlACUAJQAAAAAAAwAAAAMAAAAcAAEAAAAAAFwAAwABAAAAHAAEAEAAAAAMAAgAAgAEAAAAYSAiIZAhkv//AAAAAABhICIhkCGS//8AAP+l3+PedN5xAAEAAAAAAAAAAAAAAAAAAAEGAAABAAAAAAAAAAECAAAAAgAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGAIwAsAEWAAIAJQAlAdsB2wAYACwAAD8BNjQvASYjIg8BBhUUHwEHBhUUHwEWMzI2FAcGBwYiJyYnJjQ3Njc2MhcWF/GCBgaCBQcIBR0GBldXBgYdBQgH7x0eMjB8MDIeHR0eMjB8MDIecYIGDgaCBQUeBQcJBFhYBAkHBR4F0nwwMh4dHR4yMHwwMh4dHR4yAAAAAgAlACUB2wHbABgALAAAJTc2NTQvATc2NTQvASYjIg8BBhQfARYzMjYUBwYHBiInJicmNDc2NzYyFxYXASgdBgZXVwYGHQUIBwWCBgaCBQcIuB0eMjB8MDIeHR0eMjB8MDIecR4FBwkEWFgECQcFHgUFggYOBoIF0nwwMh4dHR4yMHwwMh4dHR4yAAABACUAJQHbAdsAEwAAABQHBgcGIicmJyY0NzY3NjIXFhcB2x0eMjB8MDIeHR0eMjB8MDIeAT58MDIeHR0eMjB8MDIeHR0eMgABACUAJQHbAdsAQwAAARUUBisBIicmPwEmIyIHBgcGBwYUFxYXFhcWMzI3Njc2MzIfARYVFAcGBwYjIicmJyYnJjQ3Njc2NzYzMhcWFzc2FxYB2woIgAsGBQkoKjodHBwSFAwLCwwUEhwcHSIeIBMGAQQDJwMCISspNC8mLBobFBERFBsaLCYvKicpHSUIDAsBt4AICgsLCScnCwwUEhwcOhwcEhQMCw8OHAMDJwMDAgQnFBQRFBsaLCZeJiwaGxQRDxEcJQgEBgAAAAAAAAwAlgABAAAAAAABAAUADAABAAAAAAACAAcAIgABAAAAAAADACEAbgABAAAAAAAEAAUAnAABAAAAAAAFAAsAugABAAAAAAAGAAUA0gADAAEECQABAAoAAAADAAEECQACAA4AEgADAAEECQADAEIAKgADAAEECQAEAAoAkAADAAEECQAFABYAogADAAEECQAGAAoAxgBzAGwAaQBjAGsAAHNsaWNrAABSAGUAZwB1AGwAYQByAABSZWd1bGFyAABGAG8AbgB0AEYAbwByAGcAZQAgADIALgAwACAAOgAgAHMAbABpAGMAawAgADoAIAAxADQALQA0AC0AMgAwADEANAAARm9udEZvcmdlIDIuMCA6IHNsaWNrIDogMTQtNC0yMDE0AABzAGwAaQBjAGsAAHNsaWNrAABWAGUAcgBzAGkAbwBuACAAMQAuADAAAFZlcnNpb24gMS4wAABzAGwAaQBjAGsAAHNsaWNrAAAAAAIAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAABwAAAAEAAgECAQMAhwBECmFycm93cmlnaHQJYXJyb3dsZWZ0AAAAAAAAAf//AAIAAQAAAA4AAAAYAAAAAAACAAEAAwAGAAEABAAAAAIAAAAAAAEAAAAAzu7XsAAAAADPcXh/AAAAAM9xeH8=');
    src: url('data:application/vnd.ms-fontobject;base64,AAgAAGQHAAABAAIAAAAAAAIABQkAAAAAAAABAJABAAAAAExQAQAAgCAAAAAAAAAAAAAAAAEAAAAAAAAATxDE8AAAAAAAAAAAAAAAAAAAAAAAAAoAcwBsAGkAYwBrAAAADgBSAGUAZwB1AGwAYQByAAAAFgBWAGUAcgBzAGkAbwBuACAAMQAuADAAAAAKAHMAbABpAGMAawAAAAAAAAEAAAANAIAAAwBQRkZUTW3RyK8AAAdIAAAAHEdERUYANAAGAAAHKAAAACBPUy8yT/b9sgAAAVgAAABWY21hcCIPRb0AAAHIAAABYmdhc3D//wADAAAHIAAAAAhnbHlmP5u2YAAAAzwAAAIsaGVhZAABMfsAAADcAAAANmhoZWED5QIFAAABFAAAACRobXR4BkoASgAAAbAAAAAWbG9jYQD2AaIAAAMsAAAAEG1heHAASwBHAAABOAAAACBuYW1lBSeBwgAABWgAAAFucG9zdC+zMgMAAAbYAAAARQABAAAAAQAA8MQQT18PPPUACwIAAAAAAM9xeH8AAAAAz3F4fwAlACUB2wHbAAAACAACAAAAAAAAAAEAAAHbAAAALgIAAAAAAAHbAAEAAAAAAAAAAAAAAAAAAAAEAAEAAAAHAEQAAgAAAAAAAgAAAAEAAQAAAEAAAAAAAAAAAQIAAZAABQAIAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAIABQkAAAAAAACAAAABAAAAIAAAAAAAAAAAUGZFZABAAGEhkgHg/+AALgHb/9sAAAABAAAAAAAAAgAAAAAAAAACAAAAAgAAJQAlACUAJQAAAAAAAwAAAAMAAAAcAAEAAAAAAFwAAwABAAAAHAAEAEAAAAAMAAgAAgAEAAAAYSAiIZAhkv//AAAAAABhICIhkCGS//8AAP+l3+PedN5xAAEAAAAAAAAAAAAAAAAAAAEGAAABAAAAAAAAAAECAAAAAgAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGAIwAsAEWAAIAJQAlAdsB2wAYACwAAD8BNjQvASYjIg8BBhUUHwEHBhUUHwEWMzI2FAcGBwYiJyYnJjQ3Njc2MhcWF/GCBgaCBQcIBR0GBldXBgYdBQgH7x0eMjB8MDIeHR0eMjB8MDIecYIGDgaCBQUeBQcJBFhYBAkHBR4F0nwwMh4dHR4yMHwwMh4dHR4yAAAAAgAlACUB2wHbABgALAAAJTc2NTQvATc2NTQvASYjIg8BBhQfARYzMjYUBwYHBiInJicmNDc2NzYyFxYXASgdBgZXVwYGHQUIBwWCBgaCBQcIuB0eMjB8MDIeHR0eMjB8MDIecR4FBwkEWFgECQcFHgUFggYOBoIF0nwwMh4dHR4yMHwwMh4dHR4yAAABACUAJQHbAdsAEwAAABQHBgcGIicmJyY0NzY3NjIXFhcB2x0eMjB8MDIeHR0eMjB8MDIeAT58MDIeHR0eMjB8MDIeHR0eMgABACUAJQHbAdsAQwAAARUUBisBIicmPwEmIyIHBgcGBwYUFxYXFhcWMzI3Njc2MzIfARYVFAcGBwYjIicmJyYnJjQ3Njc2NzYzMhcWFzc2FxYB2woIgAsGBQkoKjodHBwSFAwLCwwUEhwcHSIeIBMGAQQDJwMCISspNC8mLBobFBERFBsaLCYvKicpHSUIDAsBt4AICgsLCScnCwwUEhwcOhwcEhQMCw8OHAMDJwMDAgQnFBQRFBsaLCZeJiwaGxQRDxEcJQgEBgAAAAAAAAwAlgABAAAAAAABAAUADAABAAAAAAACAAcAIgABAAAAAAADACEAbgABAAAAAAAEAAUAnAABAAAAAAAFAAsAugABAAAAAAAGAAUA0gADAAEECQABAAoAAAADAAEECQACAA4AEgADAAEECQADAEIAKgADAAEECQAEAAoAkAADAAEECQAFABYAogADAAEECQAGAAoAxgBzAGwAaQBjAGsAAHNsaWNrAABSAGUAZwB1AGwAYQByAABSZWd1bGFyAABGAG8AbgB0AEYAbwByAGcAZQAgADIALgAwACAAOgAgAHMAbABpAGMAawAgADoAIAAxADQALQA0AC0AMgAwADEANAAARm9udEZvcmdlIDIuMCA6IHNsaWNrIDogMTQtNC0yMDE0AABzAGwAaQBjAGsAAHNsaWNrAABWAGUAcgBzAGkAbwBuACAAMQAuADAAAFZlcnNpb24gMS4wAABzAGwAaQBjAGsAAHNsaWNrAAAAAAIAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAABwAAAAEAAgECAQMAhwBECmFycm93cmlnaHQJYXJyb3dsZWZ0AAAAAAAAAf//AAIAAQAAAA4AAAAYAAAAAAACAAEAAwAGAAEABAAAAAIAAAAAAAEAAAAAzu7XsAAAAADPcXh/AAAAAM9xeH8=') format('embedded-opentype'), url('data:font/woff;base64,d09GRk9UVE8AAAVkAAsAAAAAB1wAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAABCAAAAi4AAAKbH/pWDkZGVE0AAAM4AAAAGgAAABxt0civR0RFRgAAA1QAAAAcAAAAIAAyAARPUy8yAAADcAAAAFIAAABgUBj/rmNtYXAAAAPEAAAAUAAAAWIiC0SwaGVhZAAABBQAAAAuAAAANgABMftoaGVhAAAERAAAABwAAAAkA+UCA2htdHgAAARgAAAADgAAAA4ESgBKbWF4cAAABHAAAAAGAAAABgAFUABuYW1lAAAEeAAAANwAAAFuBSeBwnBvc3QAAAVUAAAAEAAAACAAAwABeJw9ks9vEkEUx2cpWyeUoFYgNkHi2Wt7N3rVm3cTs3UVLC4LxIWEQvi1P3i7O1tYLJDAmlgKGEhQrsajf0j7J3jYTXrQWUrMJG+++b55n5e8NwwKBhHDMLv5kxT3ATEBxKBn3qOAl9zxHgb1MAPhHQgHkyF08Gr/L8B/Eb6zWnmCJ7AJVLubQOheArXvJ1A4EXi6j4I+Zg9F0QFKvsnlBCmXeve+sFEnb/nCptdtQ4QYhVFRAT1HrF8UQK/RL/SbmUbclsvGVFXRZKDHUE38cc4qpkbAAsuwiImvro+ufcfaOIQ6szlrmjRJDaKZKnbjN3GWKIbiIzRFUfCffuxxKOL+3LDlDVvx2TdxN84qZEsnhNBa6pgm2dAsnzbLsETdsmRFxUeHV4e+I2/ptN8TyqV8T3Dt29t7EYOuajVIw2y1Wy3M86w0zg/Fz2IvawmQAUHOVrPVfLkoScVynsqsTG0MGUs4z55nh3mnOJa+li+rl9WpPIcFfDubDeaDC+fLBdYN3QADzLauGfj4B6sZmq6CCpqmtSvF0qlUl2qf5AJIUCSlTqlb7lUG+LRfGzZGzZEyBgccMu6MuqPecNDvD4Y9Kjtj4gD+DsvKVMTcMdtqtZtmkzQstQvYje7Syep0PDSAhSOeHYXYWThEF//A/0YvYV1fSQtpKU5STtrhbQ444OtpKSWJIg3pOg8cBs7maTY1EZf07aq+hjWs7IWzdCYTGhb2CtZ47x+Uhx28AAB4nGNgYGBkAIJz765vANHnCyvqYTQAWnkHswAAeJxjYGRgYOADYgkGEGBiYARCFjAG8RgABHYAN3icY2BmYmCcwMDKwMHow5jGwMDgDqW/MkgytDAwMDGwcjKAQQMDAyOQUmCAgoA01xQGB4ZExUmMD/4/YNBjvP3/NgNEDQPjbbBKBQZGADfLDgsAAHicY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQzMCQqKClOUJz0/z9YHRLv/+L7D+8V3cuHmgAHjGwM6ELUByxUMIOZCmbgAAA5LQ8XeJxjYGRgYABiO68w73h+m68M3EwMIHC+sKIeTqsyqDLeZrwN5HIwgKUB/aYJUgAAeJxjYGRgYLzNwMCgx8QAAkA2IwMqYAIAMGIB7QIAAAACAAAlACUAJQAlAAAAAFAAAAUAAHicbY49asNAEIU/2ZJDfkiRIvXapUFCEqpcptABUrg3ZhEiQoKVfY9UqVLlGDlADpAT5e16IUWysMz3hjfzBrjjjQT/EjKpCy+4YhN5yZoxcirPe+SMWz4jr6S+5UzSa3VuwpTnBfc8RF7yxDZyKs9r5IxHPiKv1P9iZqDnyAvMQ39UecbScVb/gJO03Xk4CFom3XYK1clhMdQUlKo7/d9NF13RkIdfy+MV7TSe2sl11tRFaXYmJKpWTd7kdVnJ8veevZKc+n3I93t9Jnvr5n4aTVWU/0z9AI2qMkV4nGNgZkAGjAxoAAAAjgAF') format('woff'), url('data:font/ttf;base64,AAEAAAANAIAAAwBQRkZUTW3RyK8AAAdIAAAAHEdERUYANAAGAAAHKAAAACBPUy8yT/b9sgAAAVgAAABWY21hcCIPRb0AAAHIAAABYmdhc3D//wADAAAHIAAAAAhnbHlmP5u2YAAAAzwAAAIsaGVhZAABMfsAAADcAAAANmhoZWED5QIFAAABFAAAACRobXR4BkoASgAAAbAAAAAWbG9jYQD2AaIAAAMsAAAAEG1heHAASwBHAAABOAAAACBuYW1lBSeBwgAABWgAAAFucG9zdC+zMgMAAAbYAAAARQABAAAAAQAA8MQQT18PPPUACwIAAAAAAM9xeH8AAAAAz3F4fwAlACUB2wHbAAAACAACAAAAAAAAAAEAAAHbAAAALgIAAAAAAAHbAAEAAAAAAAAAAAAAAAAAAAAEAAEAAAAHAEQAAgAAAAAAAgAAAAEAAQAAAEAAAAAAAAAAAQIAAZAABQAIAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAIABQkAAAAAAACAAAABAAAAIAAAAAAAAAAAUGZFZABAAGEhkgHg/+AALgHb/9sAAAABAAAAAAAAAgAAAAAAAAACAAAAAgAAJQAlACUAJQAAAAAAAwAAAAMAAAAcAAEAAAAAAFwAAwABAAAAHAAEAEAAAAAMAAgAAgAEAAAAYSAiIZAhkv//AAAAAABhICIhkCGS//8AAP+l3+PedN5xAAEAAAAAAAAAAAAAAAAAAAEGAAABAAAAAAAAAAECAAAAAgAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGAIwAsAEWAAIAJQAlAdsB2wAYACwAAD8BNjQvASYjIg8BBhUUHwEHBhUUHwEWMzI2FAcGBwYiJyYnJjQ3Njc2MhcWF/GCBgaCBQcIBR0GBldXBgYdBQgH7x0eMjB8MDIeHR0eMjB8MDIecYIGDgaCBQUeBQcJBFhYBAkHBR4F0nwwMh4dHR4yMHwwMh4dHR4yAAAAAgAlACUB2wHbABgALAAAJTc2NTQvATc2NTQvASYjIg8BBhQfARYzMjYUBwYHBiInJicmNDc2NzYyFxYXASgdBgZXVwYGHQUIBwWCBgaCBQcIuB0eMjB8MDIeHR0eMjB8MDIecR4FBwkEWFgECQcFHgUFggYOBoIF0nwwMh4dHR4yMHwwMh4dHR4yAAABACUAJQHbAdsAEwAAABQHBgcGIicmJyY0NzY3NjIXFhcB2x0eMjB8MDIeHR0eMjB8MDIeAT58MDIeHR0eMjB8MDIeHR0eMgABACUAJQHbAdsAQwAAARUUBisBIicmPwEmIyIHBgcGBwYUFxYXFhcWMzI3Njc2MzIfARYVFAcGBwYjIicmJyYnJjQ3Njc2NzYzMhcWFzc2FxYB2woIgAsGBQkoKjodHBwSFAwLCwwUEhwcHSIeIBMGAQQDJwMCISspNC8mLBobFBERFBsaLCYvKicpHSUIDAsBt4AICgsLCScnCwwUEhwcOhwcEhQMCw8OHAMDJwMDAgQnFBQRFBsaLCZeJiwaGxQRDxEcJQgEBgAAAAAAAAwAlgABAAAAAAABAAUADAABAAAAAAACAAcAIgABAAAAAAADACEAbgABAAAAAAAEAAUAnAABAAAAAAAFAAsAugABAAAAAAAGAAUA0gADAAEECQABAAoAAAADAAEECQACAA4AEgADAAEECQADAEIAKgADAAEECQAEAAoAkAADAAEECQAFABYAogADAAEECQAGAAoAxgBzAGwAaQBjAGsAAHNsaWNrAABSAGUAZwB1AGwAYQByAABSZWd1bGFyAABGAG8AbgB0AEYAbwByAGcAZQAgADIALgAwACAAOgAgAHMAbABpAGMAawAgADoAIAAxADQALQA0AC0AMgAwADEANAAARm9udEZvcmdlIDIuMCA6IHNsaWNrIDogMTQtNC0yMDE0AABzAGwAaQBjAGsAAHNsaWNrAABWAGUAcgBzAGkAbwBuACAAMQAuADAAAFZlcnNpb24gMS4wAABzAGwAaQBjAGsAAHNsaWNrAAAAAAIAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAABwAAAAEAAgECAQMAhwBECmFycm93cmlnaHQJYXJyb3dsZWZ0AAAAAAAAAf//AAIAAQAAAA4AAAAYAAAAAAACAAEAAwAGAAEABAAAAAIAAAAAAAEAAAAAzu7XsAAAAADPcXh/AAAAAM9xeH8=') format('truetype'), url('/assets/slick-BlzDm7g2.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
    left: -25px;
}
[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}
.slick-prev:before
{
    content: '←';
}
[dir='rtl'] .slick-prev:before
{
    content: '→';
}

.slick-next
{
    right: -25px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}
.slick-next:before
{
    content: '→';
}
[dir='rtl'] .slick-next:before
{
    content: '←';
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}
._overlay_phiw4_1 {
    position: fixed;
    bottom: 32px;
    right: 32px;
    z-index: 100000;
    pointer-events: none;
}

._popup_phiw4_9 {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 16px 24px;
    border-radius: 16px;
    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.1),
        0 10px 15px -3px rgba(0, 0, 0, 0.1),
        0 20px 25px -5px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    gap: 16px;
    transform: translateY(20px) scale(0.95);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    pointer-events: auto;
    min-width: 320px;
    position: relative;
    overflow: hidden;
}

._popupVisible_phiw4_32 {
    transform: translateY(0) scale(1);
    opacity: 1;
}

._iconContainer_phiw4_37 {
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
    flex-shrink: 0;
}

._content_phiw4_50 {
    display: flex;
    flex-direction: column;
    flex: 1;
}

._message_phiw4_56 {
    font-weight: 700;
    font-size: 16px;
    color: #1e293b;
    margin: 0;
    letter-spacing: -0.01em;
}

._submessage_phiw4_64 {
    font-size: 13px;
    color: #64748b;
    margin: 4px 0 0 0;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

._progressBar_phiw4_75 {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, #22c55e, #4ade80);
    width: 0;
}

._progressActive_phiw4_84 {
    animation: _progress_phiw4_75 3s linear forwards;
}

@keyframes _progress_phiw4_75 {
    from {
        width: 100%;
    }

    to {
        width: 0%;
    }
}

@media (max-width: 640px) {
    ._overlay_phiw4_1 {
        bottom: 24px;
        left: 24px;
        right: 24px;
    }

    ._popup_phiw4_9 {
        min-width: 0;
        width: 100%;
        padding: 12px 20px;
    }
}._section_1o2e5_1 {
    padding: var(--space-16) 0;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    position: relative;
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
}

._section_1o2e5_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
}

._container_1o2e5_20 {
    width: 100%;
    padding: 0 var(--space-2);
}

._header_1o2e5_25 {
    text-align: center;
    margin-bottom: var(--space-8);
}

._title_1o2e5_30 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-4);
    color: var(--text-primary);
}

@media (min-width: 1024px) {
    ._title_1o2e5_30 {
        font-size: var(--text-4xl);
    }
}

._description_1o2e5_43 {
    color: var(--text-muted);
    font-size: var(--text-lg);
    max-width: 42rem;
    margin: 0 auto;
}

/* Grid */
._grid_1o2e5_51 {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: var(--space-4);
    padding: var(--space-2) var(--space-mobile-padding);
    margin-bottom: var(--space-8);
    scrollbar-width: none;
    -ms-overflow-style: none;
}

._grid_1o2e5_51::-webkit-scrollbar {
    display: none;
}

._grid_1o2e5_51>* {
    width: 160px;
    /* Fixed width for mobile cards */
    flex-shrink: 0;
}

@media (min-width: 768px) {
    ._grid_1o2e5_51 {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        overflow-x: visible;
        padding: 0;
    }

    ._grid_1o2e5_51>* {
        width: 100%;
    }
}

@media (min-width: 1024px) {
    ._grid_1o2e5_51 {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Skeleton */
._skeleton-card_1o2e5_92 {
    width: calc(50% - var(--space-2));
    max-width: 180px;
    flex-shrink: 0;
    background-color: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

@media (min-width: 640px) {
    ._skeleton-card_1o2e5_92 {
        width: calc(25% - var(--space-3));
        max-width: 200px;
    }
}

@media (min-width: 1024px) {
    ._skeleton-card_1o2e5_92 {
        width: calc(20% - var(--space-4));
        max-width: 220px;
    }
}

/* View All */
._view-all_1o2e5_117 {
    text-align: center;
}

._view-all-btn_1o2e5_121 {
    padding-left: var(--space-8);
    padding-right: var(--space-8);
}

/* Skeleton */
._skeleton-card_1o2e5_92 {
    background-color: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

._skeleton-image_1o2e5_134 {
    aspect-ratio: 3/4;
    background-color: var(--bg-secondary);
    animation: _pulse_1o2e5_1 2s infinite;
}

._skeleton-content_1o2e5_140 {
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._skeleton-line_1o2e5_147 {
    height: 16px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-sm);
    animation: _pulse_1o2e5_1 2s infinite;
}

._skeleton-line_1o2e5_147._short_1o2e5_154 {
    width: 50%;
}

._skeleton-line_1o2e5_147._medium_1o2e5_158 {
    width: 75%;
}

._empty-state_1o2e5_162 {
    grid-column: 1 / -1;
    text-align: center;
    padding: var(--space-12) 0;
}

._empty-text_1o2e5_168 {
    color: var(--text-muted);
}._section_a3j8g_1 {
    padding: var(--space-16) 0;
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);
    position: relative;
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
}

._section_a3j8g_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
}

._container_a3j8g_20 {
    width: 100%;
    padding: 0 var(--space-4);
}

._header_a3j8g_25 {
    text-align: center;
    margin-bottom: var(--space-10);
}

._title_a3j8g_30 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-4);
    color: var(--text-primary);
}

@media (min-width: 1024px) {
    ._title_a3j8g_30 {
        font-size: var(--text-4xl);
    }
}

._description_a3j8g_43 {
    color: var(--text-muted);
    font-size: var(--text-lg);
    max-width: 42rem;
    margin: 0 auto;
}

/* Grid */
._grid_a3j8g_51 {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: var(--space-4);
    padding-bottom: var(--space-4);
    scrollbar-width: none;
    /* Hide scrollbar Firefox */
    -ms-overflow-style: none;
    /* Hide scrollbar IE/Edge */
}

._grid_a3j8g_51::-webkit-scrollbar {
    display: none;
    /* Hide scrollbar Chrome/Safari */
}

@media (min-width: 1024px) {
    ._grid_a3j8g_51 {
        flex-wrap: wrap;
        justify-content: center;
        overflow-x: visible;
        padding-bottom: 0;
    }
}

._category-card_a3j8g_77,
._skeleton-card_a3j8g_78 {
    width: 140px;
    flex-shrink: 0;
}

@media (min-width: 640px) {

    ._category-card_a3j8g_77,
    ._skeleton-card_a3j8g_78 {
        width: calc(33.33% - var(--space-3));
        max-width: 220px;
    }
}

@media (min-width: 1024px) {

    ._category-card_a3j8g_77,
    ._skeleton-card_a3j8g_78 {
        width: calc(16.66% - var(--space-4));
        max-width: 240px;
    }
}

/* Category Card */
._category-card_a3j8g_77 {
    display: block;
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all 300ms ease-in-out;
    background-color: var(--bg-primary);
}

._category-card_a3j8g_77:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-xl);
}

._image-container_a3j8g_117 {
    position: relative;
    aspect-ratio: 1;
    overflow: hidden;
}

._category-image_a3j8g_123 {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 500ms ease-in-out;
}

._category-card_a3j8g_77:hover ._category-image_a3j8g_123 {
    transform: scale(1.1);
}

._overlay_a3j8g_134 {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: var(--space-4);
    transition: background 300ms ease-in-out;
}

._category-card_a3j8g_77:hover ._overlay_a3j8g_134 {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2));
}

._category-name_a3j8g_149 {
    color: var(--color-white);
    font-weight: var(--font-semibold);
    font-size: var(--text-lg);
    text-align: center;
    margin-bottom: var(--space-1);
}

._item-count_a3j8g_157 {
    color: rgba(255, 255, 255, 0.8);
    font-size: var(--text-xs);
    text-align: center;
    opacity: 0;
    transform: translateY(10px);
    transition: all 300ms ease-in-out;
}

._category-card_a3j8g_77:hover ._item-count_a3j8g_157 {
    opacity: 1;
    transform: translateY(0);
}

/* Skeleton */
._skeleton-card_a3j8g_78 {
    border-radius: var(--radius-lg);
    overflow: hidden;
    aspect-ratio: 1;
    background-color: var(--bg-primary);
}

._skeleton-image_a3j8g_179 {
    width: 100%;
    height: 100%;
    background-color: var(--bg-secondary);
    animation: _pulse_a3j8g_1 2s infinite;
}._home-container_xfk7r_1 {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    position: relative;
}

._home-container_xfk7r_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
    z-index: 1;
}

._main-content_xfk7r_18 {
    width: 100%;
    position: relative;
    z-index: 2;
}._select-wrapper_7nvep_1 {
    position: relative;
    width: 100%;
}

._select-trigger_7nvep_6 {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-white);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-base);
    color: var(--verve-black);
    transition: all var(--transition-base);
    cursor: pointer;
    box-shadow: var(--shadow-sm);
}

._select-trigger_7nvep_6:hover:not(:disabled) {
    border-color: var(--verve-navy);
    box-shadow: var(--shadow-md);
}

._select-trigger_7nvep_6:focus {
    outline: none;
    border-color: var(--verve-navy);
    box-shadow: 0 0 0 3px rgba(0, 35, 68, 0.1);
}

._select-trigger_7nvep_6[aria-expanded="true"] {
    border-color: var(--verve-navy);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

._select-content_7nvep_39 {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: var(--z-dropdown);
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    border: 1px solid var(--verve-navy);
    border-top: none;
    border-bottom-left-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    animation: _slideIn_7nvep_1 0.2s ease-out;
}


@media (max-width: 640px) {
    ._select-content_7nvep_39 {
        /* Restored shared styles overlap prevention */
        position: absolute;
        /* Rely on inline styles for left/width to prevent overflow */
        margin-top: var(--space-2);
        border: 1px solid var(--verve-navy);
        border-radius: var(--radius-md);
        box-shadow: var(--shadow-lg);
        animation: none;
        transform: none;
        max-height: 240px;
        z-index: 9999;
    }

    ._mobile-backdrop_7nvep_72 {
        display: none;
    }
}

@keyframes _slideIn_7nvep_1 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

._options-list_7nvep_89 {
    max-height: 240px;
    overflow-y: auto;
    padding: var(--space-1) 0;
}

._option_7nvep_89 {
    padding: var(--space-3) var(--space-4);
    /* Increased vertical padding for better touch targets */
    font-size: var(--text-base);
    /* Slightly larger text for mobile readability */
    color: var(--verve-black);
    cursor: pointer;
    transition: all var(--transition-fast);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._option_7nvep_89:hover {
    background-color: var(--verve-cream);
    color: var(--verve-navy);
}

._option-selected_7nvep_113 {
    background-color: var(--verve-navy) !important;
    color: var(--color-white) !important;
}

._option-disabled_7nvep_118 {
    opacity: 0.5;
    cursor: not-allowed;
}

._option-label_7nvep_123 {
    flex: 1;
}

._option-description_7nvep_127 {
    font-size: var(--text-xs);
    opacity: 0.7;
    margin-top: 2px;
}

._select-label_7nvep_133 {
    display: block;
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--verve-navy);
    margin-bottom: var(--space-1);
}

._error-message_7nvep_141 {
    color: var(--color-error);
    font-size: var(--text-xs);
    margin-top: 4px;
}

._chevron_7nvep_147 {
    transition: transform var(--transition-base);
}

._chevron-open_7nvep_151 {
    transform: rotate(180deg);
}

._search-container_7nvep_155 {
    padding: var(--space-2);
    border-bottom: 1px solid var(--verve-grey);
}/* PolicyInformation.module.css */

/* Variables */
._policy-page_ebkr9_4 {
    --primary-color: #0f172a;
    --secondary-color: #64748b;
    --accent-color: #2563eb;
    --background-color: #f8fafc;
    --card-bg: #ffffff;
    --border-color: #e2e8f0;
    --muted-bg: #f1f5f9;

    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);

    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;

    --transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    display: flex;
    flex-direction: column;
}

._container_ebkr9_29 {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    flex: 1;
}

/* Breadcrumb */
._breadcrumb_ebkr9_38 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin-bottom: 2rem;
}

._breadcrumb-link_ebkr9_47 {
    color: var(--secondary-color);
    text-decoration: none;
    transition: var(--transition);
}

._breadcrumb-link_ebkr9_47:hover {
    color: var(--accent-color);
}

/* Layout */
._content-wrapper_ebkr9_58 {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

@media (min-width: 1024px) {
    ._content-wrapper_ebkr9_58 {
        flex-direction: row;
        align-items: flex-start;
    }
}

/* Sidebar */
._sidebar-wrapper_ebkr9_72 {
    flex-shrink: 0;
    width: 100%;
}

@media (min-width: 1024px) {
    ._sidebar-wrapper_ebkr9_72 {
        width: 20rem;
        position: sticky;
        top: 6rem;
    }
}

._sidebar-card_ebkr9_85 {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
}

._sidebar-title_ebkr9_93 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

._nav-button_ebkr9_100 {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    text-align: left;
    transition: var(--transition);
    margin-bottom: 0.5rem;
    border: 1px solid transparent;
}

._nav-button_ebkr9_100:hover {
    background-color: var(--muted-bg);
}

._active_ebkr9_117 {
    background-color: #eff6ff !important;
    color: var(--accent-color) !important;
    border-color: #dbeafe !important;
}

._nav-button-icon_ebkr9_123 {
    flex-shrink: 0;
}

._nav-button-content_ebkr9_127 {
    flex: 1;
    min-width: 0;
}

._nav-button-title_ebkr9_132 {
    font-weight: 500;
    margin-bottom: 0.125rem;
}

._nav-button-desc_ebkr9_137 {
    font-size: 0.75rem;
    color: var(--secondary-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

._nav-button_ebkr9_100._active_ebkr9_117 ._nav-button-desc_ebkr9_137 {
    color: #60a5fa;
}

/* Mobile Sidebar Toggle */
._mobile-toggle_ebkr9_150 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-weight: 500;
}

._mobile-menu_ebkr9_163 {
    margin-top: 0.5rem;
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    animation: _slideDown_ebkr9_1 0.2s ease-out;
}

@keyframes _slideDown_ebkr9_1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Main Content Area */
._main-content_ebkr9_185 {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    flex: 1;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

._content-header_ebkr9_194 {
    padding: 1.5rem 2rem;
    border-bottom: 1px solid var(--border-color);
}

._header-inner_ebkr9_199 {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

._header-icon_ebkr9_206 {
    width: 3rem;
    height: 3rem;
    background-color: #eff6ff;
    color: var(--accent-color);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
}

._header-title_ebkr9_217 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color);
}

._header-meta_ebkr9_223 {
    font-size: 0.875rem;
    color: var(--secondary-color);
}

._notice-box_ebkr9_228 {
    background-color: #fffbeb;
    border: 1px solid #fef3c7;
    border-radius: var(--radius-md);
    padding: 1rem;
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

._notice-icon_ebkr9_238 {
    color: #d97706;
}

._notice-title_ebkr9_242 {
    font-size: 0.875rem;
    font-weight: 600;
    color: #92400e;
    margin-bottom: 0.25rem;
}

._notice-text_ebkr9_249 {
    font-size: 0.875rem;
    color: #b45309;
}

._content-body_ebkr9_254 {
    padding: 2rem;
}

/* Typography for Content */
._prose_ebkr9_259 {
    color: var(--secondary-color);
    line-height: 1.75;
}

._section-block_ebkr9_264 {
    margin-bottom: 2.5rem;
}

._section-heading_ebkr9_268 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
}

._section-text_ebkr9_275 {
    white-space: pre-line;
}

/* Contact Box */
._contact-section_ebkr9_280 {
    padding: 2rem;
    border-top: 1px solid var(--border-color);
    background-color: #f8fafc;
}

._contact-box_ebkr9_286 {
    background-color: white;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
}

._contact-title_ebkr9_293 {
    font-weight: 600;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--primary-color);
}

._contact-grid_ebkr9_302 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
}

._contact-item_ebkr9_308 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--secondary-color);
}

/* Error State */
._error-state_ebkr9_317 {
    padding: 4rem 2rem;
    text-align: center;
    background-color: var(--card-bg);
    border-radius: var(--radius-lg);
    border: 1px dashed var(--border-color);
}

._error-title_ebkr9_325 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* Quick Links Footer */
._quick-links_ebkr9_333 {
    margin-top: 3rem;
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
}

._links-grid_ebkr9_341 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
}

._link-group-title_ebkr9_347 {
    font-weight: 600;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
}

._link-list_ebkr9_353 {
    font-size: 0.875rem;
    color: var(--secondary-color);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* Size Guide Image */
._size-chart-container_ebkr9_362 {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    margin-top: 1rem;
}

._size-chart-image_ebkr9_370 {
    max-width: 100%;
    height: auto;
    display: block;
}._checkbox-wrapper_14di2_1 {
    display: flex;
    align-items: flex-start;
    gap: var(--space-2);
}

._checkbox-container_14di2_7 {
    position: relative;
    display: flex;
    align-items: center;
}

._checkbox-input_14di2_13 {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

._checkbox-label_14di2_25 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-error, #f44336);
    cursor: pointer;
    transition: all var(--transition-fast);
    user-select: none;
}

._checkbox-label_14di2_25:hover {
    background: var(--bg-secondary);
}

._checkbox-label_14di2_25._checked_14di2_41 {
    background: var(--color-error, #f44336);
    color: var(--color-white);
    border-color: var(--color-error, #f44336);
}

._checkbox-label_14di2_25._indeterminate_14di2_47 {
    background: var(--color-error, #f44336);
    color: var(--color-white);
    border-color: var(--color-error, #f44336);
}

._checkbox-label_14di2_25._error_14di2_53 {
    border-color: var(--color-error);
}

._checkbox-label_14di2_25._disabled_14di2_57 {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Sizes */
._checkbox-sm_14di2_63 {
    height: 16px;
    width: 16px;
}

._checkbox-default_14di2_68 {
    height: 16px;
    width: 16px;
}

._checkbox-lg_14di2_73 {
    height: 20px;
    width: 20px;
}

/* Icon */
._checkbox-icon_14di2_79 {
    height: 12px;
    width: 12px;
    color: currentColor;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Content */
._checkbox-content_14di2_89 {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

._checkbox-text-label_14di2_96 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    line-height: 1;
    cursor: pointer;
    color: var(--text-primary);
}

._checkbox-text-label_14di2_96._error_14di2_53 {
    color: var(--color-error);
}

._checkbox-text-label_14di2_96._disabled_14di2_57 {
    cursor: not-allowed;
    opacity: 0.7;
}

._checkbox-required_14di2_113 {
    color: var(--color-error);
    margin-left: var(--space-1);
}

._checkbox-description_14di2_118 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._checkbox-error-text_14di2_123 {
    font-size: var(--text-sm);
    color: var(--color-error);
}

/* Checkbox Group */
._checkbox-group_14di2_129 {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

._checkbox-group-legend_14di2_135 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
    margin-bottom: var(--space-2);
}

._checkbox-group-legend_14di2_135._error_14di2_53 {
    color: var(--color-error);
}

._checkbox-group-description_14di2_146 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-2);
}

._checkbox-group-items_14di2_152 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._checkbox-group-error_14di2_158 {
    font-size: var(--text-sm);
    color: var(--color-error);
    margin-top: var(--space-2);
}._sidebar-container_yk18w_1 {
    height: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

._header_yk18w_9 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4);
    border-bottom: 1px solid var(--border-default);
    background-color: var(--bg-primary);
}

._title_yk18w_18 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
}

._product-count_yk18w_23 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._count-text_yk18w_29 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._close-btn_yk18w_34 {
    display: flex;
}

._close-btn_yk18w_34 button {
    background-color: var(--color-error, #ef4444) !important;
    border: 1px solid var(--color-error, #ef4444) !important;
    color: var(--color-white) !important;
    border-radius: var(--radius-md) !important;
    transition: all var(--transition-fast);
}

._close-btn_yk18w_34 button:hover {
    background-color: var(--color-error-dark, #dc2626) !important;
    transform: scale(1.05);
}

@media (min-width: 1024px) {
    ._close-btn_yk18w_34 {
        display: none;
    }
}

._content_yk18w_57 {
    flex: 1;
    overflow-y: auto;
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

._clear-header_yk18w_66 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

._active-filters-label_yk18w_72 {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
}

._clear-btn_yk18w_77 {
    color: var(--color-error, #ef4444);
    font-weight: var(--font-semibold);
    border: 1px solid var(--color-error, #ef4444);
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-md);
    background-color: transparent;
    font-size: var(--text-xs);
    transition: all var(--transition-fast);
}

._clear-btn_yk18w_77:hover {
    color: var(--color-white);
    background-color: var(--color-error, #ef4444);
}

/* Filter Section */


._section-title_yk18w_96 {
    font-weight: var(--font-medium);
    margin-bottom: var(--space-3);
    font-size: var(--text-base);
}

._filter-list_yk18w_102 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._filter-item_yk18w_108 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._filter-label_yk18w_114 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    flex: 1;
}

._filter-text_yk18w_122 {
    font-size: var(--text-sm);
}

._filter-count_yk18w_126 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-left: var(--space-2);
}

/* Price Range */
._price-inputs_yk18w_133 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-3);
}

._input-group_yk18w_139 {
    display: flex;
    flex-direction: column;
}

._input-label_yk18w_144 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-1);
}

._price-input_yk18w_133 {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

._price-input_yk18w_133:focus {
    outline: none;
    border-color: var(--color-error, #ef4444);
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.1);
}

._price-hint_yk18w_164 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: center;
    margin-top: var(--space-2);
}

/* Size Grid */
._size-grid_yk18w_172 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-2);
}

._size-btn_yk18w_178 {
    padding: var(--space-2);
    font-size: var(--text-sm);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    background-color: var(--bg-background);
    transition: all var(--transition-fast);
    cursor: pointer;
}

._size-btn_yk18w_178._active_yk18w_72 {
    background-color: var(--color-error, #ef4444) !important;
    color: var(--color-white) !important;
    border-color: var(--color-error, #ef4444) !important;
}

._size-btn_yk18w_178:hover {
    background-color: var(--bg-secondary);
}

/* Color Grid */
._color-grid_yk18w_199 {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
}

._color-btn_yk18w_205 {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    border: 2px solid var(--border-default);
    transition: all var(--transition-fast);
    cursor: pointer;
}

._color-btn_yk18w_205:hover {
    transform: scale(1.1);
}

._color-btn_yk18w_205._active_yk18w_72,
button._active_yk18w_72._color-btn_yk18w_205 {
    border: 3px solid #a92e2e !important;
    box-shadow: 0 0 0 2px var(--bg-background), 0 0 0 5px #a92e2e, 0 4px 12px rgba(169, 46, 46, 1.0);
    transform: scale(1.15);
}

/* Loading/Error States */
._loading-skeleton_yk18w_226 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._skeleton-row_yk18w_232 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

._skeleton-bar_yk18w_238 {
    height: 16px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-sm);
    animation: _pulse_yk18w_1 2s infinite;
}

._error-msg_yk18w_245 {
    font-size: var(--text-sm);
    color: var(--color-error);
}

._empty-msg_yk18w_250 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Desktop/Mobile Layout */
._desktop-sidebar_yk18w_256 {
    display: none;
    width: 320px;
    background-color: var(--bg-primary);
    border-right: 1px solid var(--border-default);
}

@media (min-width: 1024px) {
    ._desktop-sidebar_yk18w_256 {
        display: block;
        position: sticky;
        top: 100px;
        /* Header height + spacing */
        height: fit-content;
        max-height: calc(100vh - 120px);
        overflow-y: auto;
        border-radius: var(--radius-lg);
        border: 1px solid var(--border-default);
        /* Hide scrollbar for cleaner look */
        scrollbar-width: thin;
    }
}

._mobile-overlay_yk18w_279 {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(2px);
}

@media (min-width: 1024px) {
    ._mobile-overlay_yk18w_279 {
        display: none;
    }
}

._mobile-sidebar_yk18w_293 {
    position: fixed;
    inset: 0 auto 0 0;
    width: 320px;
    background-color: var(--bg-primary);
    border-right: 1px solid var(--border-default);
    box-shadow: var(--shadow-xl);
    z-index: var(--z-modal);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}._container_14zf5_1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--border-default);
    width: 100%;
    position: sticky;
    top: 90px;
    /* Adjusted for Main Header (55px) + Nav Bar (35px) */
    z-index: 25;
    /* Below header (usually 30-50) but above content */
    background-color: var(--bg-primary);
    /* Match main background */
    border-bottom: 1px solid var(--border-light);
    box-shadow: none;
    /* Remove container shadow to reduce 'layered' look */

    /* Horizontal Scroll Layout for Mobile */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    scrollbar-width: none;
}


._hidden_14zf5_27 {
    top: -100px !important;
    /* Slide out of view */
}

._container_14zf5_1::-webkit-scrollbar {
    display: none;
    /* Chrome/Safari */
}

@media (max-width: 640px) {
    ._container_14zf5_1 {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 10px;
        /* Precise gap for chips */
        padding-top: 10px;
        padding-bottom: 10px;
        margin: 0;
        height: auto;

        /* Mobile Fixed Positioning */
        top: 80px;
        /* Mobile Header (50px) + Nav (30px) */
        padding-left: var(--space-mobile-padding);
        /* Start content with padding */
        padding-right: var(--space-mobile-padding);
    }
}

._left-section_14zf5_58 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

@media (max-width: 640px) {
    ._left-section_14zf5_58 {
        display: contents;
        /* Flatten hierarchy */
    }
}

._filter-btn_14zf5_71 {
    display: flex;
    align-items: center;
}

@media (min-width: 1024px) {
    ._filter-btn_14zf5_71 {
        display: none;
    }
}

@media (max-width: 640px) {
    ._filter-btn_14zf5_71 {
        margin: 0;
        flex-shrink: 0;
    }

    /* Amazon-style Pill Button */
    ._filter-btn_14zf5_71 button {
        border-radius: 9999px !important;
        /* Full pill shape */
        border: 1px solid var(--border-medium) !important;
        background-color: var(--color-white) !important;
        padding: 0 16px !important;
        height: 38px !important;
        /* Proper touch target height */
        font-size: 13px !important;
        color: var(--text-primary) !important;
        font-weight: 500 !important;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }
}

._result-count_14zf5_108 {
    display: none;
    margin-left: 15px;
}

@media (min-width: 640px) {
    ._result-count_14zf5_108 {
        display: block;
    }
}

._count-text_14zf5_119 {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

._count-number_14zf5_124 {
    font-weight: var(--font-medium);
    color: var(--text-foreground);
}

._right-section_14zf5_129 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

@media (max-width: 640px) {
    ._right-section_14zf5_129 {
        display: contents;
        /* Flatten hierarchy */
    }
}

._sort-group_14zf5_142 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

@media (max-width: 640px) {
    ._sort-group_14zf5_142 {
        margin: 0;
        flex-shrink: 0;
        background-color: var(--color-white);
        border: 1px solid var(--border-medium);
        border-radius: 9999px;
        /* Full pill shape */
        padding: 0 12px;
        height: 38px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
        display: flex;
        align-items: center;
        max-width: 200px;
        /* Prevent it from being too wide */
    }

    /* Hide the "Sort by:" label on mobile */
    ._sort-label_14zf5_166 {
        display: none !important;
    }

    ._sort-select_14zf5_170 {
        min-width: auto;
        border: none !important;
        background: transparent !important;
        height: 100%;
        font-size: 13px !important;
        padding: 0 !important;
        outline: none !important;
    }

    /* Target the inner button of the Select component */
    ._sort-select_14zf5_170 button {
        border: none !important;
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        height: 100% !important;
        width: 100% !important;
        display: flex;
        align-items: center;
        justify-content: center !important;
        /* Force center */
        gap: 6px;
        /* Space between text and icon */
        color: var(--text-primary) !important;
        font-weight: 500 !important;
    }

    /* Prevent text or icon from taking extra space */
    ._sort-select_14zf5_170 button span,
    ._sort-select_14zf5_170 button div {
        flex: 0 0 auto !important;
    }



}

._sort-label_14zf5_166 {
    font-size: var(--text-sm);
    color: var(--text-muted);
    display: none;
}

@media (min-width: 640px) {
    ._sort-label_14zf5_166 {
        display: inline;
    }
}

._sort-select_14zf5_170 {
    min-width: 140px;
}

._view-toggle_14zf5_224 {
    display: none;
    align-items: center;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
}

@media (min-width: 768px) {
    ._view-toggle_14zf5_224 {
        display: flex;
    }
}

._toggle-btn_14zf5_237 {
    border: none;
    border-radius: 0;
}

._toggle-btn_14zf5_237:first-child {
    border-right: 1px solid var(--border-default);
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
}

._toggle-btn_14zf5_237:last-child {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
}._grid_1qgfh_1 {
    display: grid;
    gap: var(--space-1);
}

._grid-view_1qgfh_6 {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    /* Increased gap */
    background-color: transparent;
    /* No border lines effect */
    padding: 12px;
}

._grid-view_1qgfh_6>* {
    background-color: var(--bg-primary);
    /* Each card has primary bg */
}

@media (min-width: 640px) {
    ._grid-view_1qgfh_6 {
        grid-template-columns: repeat(3, 1fr);
        gap: 4px;
    }
}

@media (min-width: 1024px) {
    ._grid-view_1qgfh_6 {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }
}

._list-view_1qgfh_34 {
    grid-template-columns: 1fr;
}

/* Loading Skeleton */
._skeleton-card_1qgfh_39 {
    animation: _pulse_1qgfh_1 2s infinite;
}

._skeleton-image_1qgfh_43 {
    background-color: var(--bg-secondary);
    border-radius: var(--radius-lg);
    aspect-ratio: 3/4;
    margin-bottom: var(--space-4);
}

._skeleton-content_1qgfh_50 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._skeleton-line_1qgfh_56 {
    height: 16px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-sm);
}

._skeleton-line_1qgfh_56._short_1qgfh_62 {
    width: 25%;
}

._skeleton-line_1qgfh_56._medium_1qgfh_66 {
    width: 50%;
}

._skeleton-line_1qgfh_56._long_1qgfh_70 {
    width: 75%;
}

/* Empty State */
._empty-state_1qgfh_75 {
    text-align: center;
    padding: var(--space-12) 0;
}

._empty-icon-container_1qgfh_80 {
    width: 96px;
    height: 96px;
    background-color: var(--bg-secondary);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--space-4);
}

._empty-icon_1qgfh_80 {
    width: 48px;
    height: 48px;
    color: var(--text-muted);
}

._empty-title_1qgfh_97 {
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    margin-bottom: var(--space-2);
}

._empty-text_1qgfh_103 {
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}._container_14irr_1 {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    position: relative;
}

._container_14irr_1::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
    z-index: 1;
}

._main-content_14irr_18 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-2) var(--space-mobile-padding);
    position: relative;
    z-index: 2;
}

@media (max-width: 767px) {
    ._main-content_14irr_18 {
        padding: 0;
        /* Remove padding for edge-to-edge grid if needed, or use mobile padding */
    }

    ._product-grid-section_14irr_33 {
        border-radius: 0;
        border-left: none;
        border-right: none;
        box-shadow: none;
        padding: 0;
    }
}

/* Breadcrumb */
._breadcrumb_14irr_43 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-2);
}

._breadcrumb-link_14irr_52 {
    transition: color var(--transition-fast);
}

._breadcrumb-link_14irr_52:hover {
    color: var(--color-primary);
}

._breadcrumb-current_14irr_60 {
    color: var(--text-foreground);
}

._breadcrumb-current_14irr_60._capitalize_14irr_64 {
    text-transform: capitalize;
}

/* Page Header */
._page-header_14irr_69 {
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-default);
}

._page-title_14irr_78 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-2);
    color: var(--verve-black);
}

@media (min-width: 768px) {
    ._page-title_14irr_78 {
        font-size: var(--text-4xl);
    }
}

._page-description_14irr_91 {
    color: var(--text-secondary);
    font-size: var(--text-sm);
    max-width: 42rem;
}

/* Layout */
._layout-grid_14irr_98 {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: var(--space-8);
    align-items: start;
}

@media (max-width: 1024px) {
    ._layout-grid_14irr_98 {
        grid-template-columns: 1fr;
        gap: var(--space-6);
    }
}

._content-area_14irr_112 {
    min-width: 0;
}

._sidebar_14irr_116 {
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    box-shadow: var(--shadow-sm);
    position: sticky;
    top: var(--space-4);
    height: fit-content;
}

._product-grid-section_14irr_33 {
    padding: var(--space-8) 0;
    background: var(--bg-primary);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-default);
    box-shadow: var(--shadow-sm);
}

/* Mobile Sticky Actions */
._mobile-sticky-actions_14irr_136 {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    background-color: var(--color-white);
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
    z-index: var(--z-fixed);
    border-top: 1px solid var(--border-light);
}

@media (max-width: 1024px) {
    ._mobile-sticky-actions_14irr_136 {
        display: flex;
        align-items: center;
    }
}

._sticky-action-btn_14irr_156 {
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    background: none;
    border: none;
    font-size: 12px;
    font-weight: 700;
    color: var(--verve-text-primary);
    letter-spacing: 1px;
    cursor: pointer;
}

._sticky-divider_14irr_172 {
    width: 1px;
    height: 24px;
    background-color: var(--border-light);
}

@media (max-width: 1024px) {
    ._main-content_14irr_18 {
        padding-bottom: 60px;
        /* Space for sticky bar */
    }
}/* OrderHistory.module.css */

/* Variables */
._order-history-page_1t2n2_4 {
    --primary-color: #0f172a;
    --secondary-color: #64748b;
    --accent-color: #2563eb;
    --background-color: #f8fafc;
    --card-bg: #ffffff;
    --border-color: #e2e8f0;

    /* Status Colors */
    --status-pending-bg: #fff7ed;
    --status-pending-text: #c2410c;
    --status-pending-border: #ffedd5;

    --status-confirmed-bg: #eff6ff;
    --status-confirmed-text: #1d4ed8;
    --status-confirmed-border: #dbeafe;

    --status-shipped-bg: #f0f9ff;
    --status-shipped-text: #0369a1;
    --status-shipped-border: #e0f2fe;

    --status-delivered-bg: #ecfdf5;
    --status-delivered-text: #047857;
    --status-delivered-border: #d1fae5;

    --status-cancelled-bg: #fef2f2;
    --status-cancelled-text: #b91c1c;
    --status-cancelled-border: #fee2e2;

    --font-family: 'Inter', system-ui, -apple-system, sans-serif;
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-full: 9999px;
    --transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);

    font-family: var(--font-family);
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

._container_1t2n2_49 {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 2rem 1.5rem;
    flex: 1;
}

/* Header Section */
._page-header_1t2n2_58 {
    margin-bottom: 2.5rem;
}

._breadcrumb_1t2n2_62 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--secondary-color);
    margin-bottom: 1rem;
}

._breadcrumb-link_1t2n2_71 {
    color: var(--secondary-color);
    text-decoration: none;
    transition: var(--transition);
}

._breadcrumb-link_1t2n2_71:hover {
    color: var(--accent-color);
}

._page-title_1t2n2_81 {
    font-size: 2rem;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
    letter-spacing: -0.025em;
}

._page-subtitle_1t2n2_89 {
    color: var(--secondary-color);
    font-size: 1rem;
}

/* Filters Section */
._filters-section_1t2n2_95 {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: var(--shadow-sm);
}

._filter-header_1t2n2_104 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

._search-container_1t2n2_113 {
    flex: 1;
    min-width: 300px;
}

._filter-toggle_1t2n2_118 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

._filter-grid_1t2n2_124 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--border-color);
    margin-top: 1rem;
    animation: _slideDown_1t2n2_1 0.3s ease-out;
}

._filter-summary_1t2n2_134 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-color);
    font-size: 0.875rem;
    color: var(--secondary-color);
}

/* Order List */
._orders-list_1t2n2_146 {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Order Card */
._order-card_1t2n2_153 {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: var(--transition);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
}

._order-card_1t2n2_153:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
    border-color: var(--accent-color);
}

._card-header_1t2n2_169 {
    padding: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

._order-info_1t2n2_178 {
    flex: 1;
}

._order-number-row_1t2n2_182 {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

._order-number_1t2n2_182 {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--primary-color);
}

._order-meta_1t2n2_196 {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    font-size: 0.875rem;
    color: var(--secondary-color);
}

._meta-item_1t2n2_204 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

._order-total-section_1t2n2_210 {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

._order-amount_1t2n2_218 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--primary-color);
    font-family: monospace;
}

._card-actions_1t2n2_225 {
    padding: 1rem 1.5rem;
    background-color: #f8fafc;
    border-top: 1px solid var(--border-color);
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* Shared Components & Utilities */
._status-badge_1t2n2_235 {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem;
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: capitalize;
    border: 1px solid;
}

._status-pending_1t2n2_247 {
    background-color: var(--status-pending-bg);
    color: var(--status-pending-text);
    border-color: var(--status-pending-border);
}

._status-confirmed_1t2n2_253 {
    background-color: var(--status-confirmed-bg);
    color: var(--status-confirmed-text);
    border-color: var(--status-confirmed-border);
}

._status-shipped_1t2n2_259 {
    background-color: var(--status-shipped-bg);
    color: var(--status-shipped-text);
    border-color: var(--status-shipped-border);
}

._status-delivered_1t2n2_265 {
    background-color: var(--status-delivered-bg);
    color: var(--status-delivered-text);
    border-color: var(--status-delivered-border);
}

._status-cancelled_1t2n2_271 {
    background-color: var(--status-cancelled-bg);
    color: var(--status-cancelled-text);
    border-color: var(--status-cancelled-border);
}

._status-default_1t2n2_277 {
    background-color: var(--background-color);
    color: var(--secondary-color);
    border-color: var(--border-color);
}

/* Empty State */
._empty-state_1t2n2_284 {
    text-align: center;
    padding: 4rem 2rem;
    background-color: var(--card-bg);
    border-radius: var(--radius-lg);
    border: 1px dashed var(--border-color);
}

._empty-icon_1t2n2_292 {
    width: 4rem;
    height: 4rem;
    color: var(--secondary-color);
    margin-bottom: 1.5rem;
    opacity: 0.5;
}

._empty-title_1t2n2_300 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 0.5rem;
}

._empty-desc_1t2n2_307 {
    color: var(--secondary-color);
    margin-bottom: 2rem;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

/* Modal */
._modal-overlay_1t2n2_316 {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 50;
    padding: 1rem;
    animation: _fadeIn_1t2n2_1 0.2s ease-out;
}

._modal-content_1t2n2_329 {
    background-color: var(--card-bg);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    width: 100%;
    max-width: 800px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    animation: _scaleUp_1t2n2_1 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

._modal-header_1t2n2_341 {
    padding: 2rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

._modal-body_1t2n2_349 {
    overflow-y: auto;
    padding: 1.5rem;
}

._section-title_1t2n2_354 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

._detail-grid_1t2n2_364 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

._info-box_1t2n2_371 {
    background-color: #f8fafc;
    padding: 1.25rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
}

._item-list_1t2n2_378 {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 2rem;
}

._order-item_1t2n2_385 {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    align-items: center;
}

._item-image_1t2n2_394 {
    width: 5rem;
    height: 5rem;
    border-radius: var(--radius-md);
    overflow: hidden;
    flex-shrink: 0;
    background-color: #f1f5f9;
}

._item-details_1t2n2_403 {
    flex: 1;
}

._item-name_1t2n2_407 {
    font-weight: 500;
    color: var(--primary-color);
    margin-bottom: 0.25rem;
    display: block;
    text-decoration: none;
}

._item-name_1t2n2_407:hover {
    color: var(--accent-color);
}

._item-meta_1t2n2_419 {
    font-size: 0.875rem;
    color: var(--secondary-color);
}

._text-primary_1t2n2_424 {
    color: var(--primary-color);
}

._text-secondary_1t2n2_428 {
    color: var(--secondary-color);
}

._timeline_1t2n2_432 {
    position: relative;
    padding-left: 2rem;
    margin-top: 1rem;
}

._timeline-item_1t2n2_438 {
    position: relative;
    padding-bottom: 2rem;
}

._timeline-item_1t2n2_438:last-child {
    padding-bottom: 0;
}

._timeline-line_1t2n2_447 {
    position: absolute;
    left: -2rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background-color: var(--border-color);
    margin-left: 7px;
}

._timeline-dot_1t2n2_457 {
    position: absolute;
    left: -2rem;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #fff;
    background-color: var(--border-color);
    z-index: 1;
}

._timeline-dot_1t2n2_457._completed_1t2n2_468 {
    background-color: var(--status-delivered-text);
    border-color: var(--status-delivered-text);
}

/* Expanded Card Details */
._expanded-details_1t2n2_474 {
    border-top: 1px solid var(--border-color);
    background-color: #fcfcfc;
}

._expanded-section_1t2n2_479 {
    padding: 1.5rem;
}

/* Animations */
@keyframes _fadeIn_1t2n2_1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes _slideDown_1t2n2_1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes _scaleUp_1t2n2_1 {
    from {
        opacity: 0;
        transform: scale(0.95);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Responsive */
@media (max-width: 640px) {
    ._card-header_1t2n2_169 {
        flex-direction: column;
        align-items: stretch;
    }

    ._order-total-section_1t2n2_210 {
        text-align: left;
        align-items: flex-start;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        margin-top: 1rem;
    }

    ._filter-header_1t2n2_104 {
        flex-direction: column;
        align-items: stretch;
    }

    ._search-container_1t2n2_113 {
        width: 100%;
    }

    ._filter-toggle_1t2n2_118 {
        width: 100%;
        justify-content: space-between;
    }

    ._order-item_1t2n2_385 {
        flex-direction: column;
        align-items: flex-start;
    }

    ._item-image_1t2n2_394 {
        width: 100%;
        height: 150px;
    }

    ._card-actions_1t2n2_225 {
        flex-direction: column;
    }

    ._card-actions_1t2n2_225 button {
        width: 100%;
    }
}

/* Action Modal Specific Styles */
._action-modal-content_1t2n2_568 {
    background-color: var(--color-white);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    width: 100%;
    max-width: 420px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: _scaleUp_1t2n2_1 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

._action-modal-header_1t2n2_580 {
    padding: var(--space-4) var(--space-6);
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--border-light);
}

._action-modal-title_1t2n2_588 {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--verve-black);
    letter-spacing: -0.5px;
}

._action-close-btn_1t2n2_595 {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-tertiary);
    transition: var(--transition-base);
    padding: var(--space-1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
}

._action-close-btn_1t2n2_595:hover {
    background-color: var(--bg-secondary);
    color: var(--verve-black);
}

._action-modal-body_1t2n2_613 {
    padding: var(--space-6);
    gap: var(--space-4);
}

._action-modal-description_1t2n2_618 {
    font-size: var(--text-base);
    color: var(--text-secondary);
    line-height: var(--leading-relaxed);
}

._form-group_1t2n2_624 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

._form-label_1t2n2_630 {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    color: var(--verve-black);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

._required_1t2n2_638 {
    color: var(--color-error);
}

._action-select_1t2n2_642 {
    width: 100%;
}

._action-textarea_1t2n2_646 {
    width: 100%;
    min-height: 80px;
    padding: var(--space-4);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    font-family: var(--font-primary);
    font-size: var(--text-sm);
    color: var(--verve-black);
    resize: none;
    transition: var(--transition-base);
    background-color: var(--color-white);
}

._action-textarea_1t2n2_646:focus {
    outline: none;
    border-color: var(--verve-black);
    box-shadow: 0 0 0 2px rgba(26, 26, 26, 0.05);
}

._form-error_1t2n2_666 {
    font-size: var(--text-xs);
    color: var(--color-error);
    margin-top: var(--space-1);
}

._action-modal-footer_1t2n2_672 {
    padding: var(--space-4) var(--space-6);
    background-color: var(--bg-primary);
    display: flex;
    justify-content: flex-end;
    gap: var(--space-4);
    border-top: 1px solid var(--border-light);
}

._btn-secondary_1t2n2_681 {
    background: none;
    border: 1px solid var(--border-dark);
    color: var(--verve-black);
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition-base);
}

._btn-secondary_1t2n2_681:hover {
    background-color: var(--bg-secondary);
}

._btn-primary_1t2n2_699 {
    background-color: var(--verve-black);
    border: 1px solid var(--verve-black);
    color: var(--color-white);
    padding: var(--space-3) var(--space-8);
    font-size: var(--text-sm);
    font-weight: var(--font-bold);
    text-transform: uppercase;
    letter-spacing: 1px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition-base);
}

._btn-primary_1t2n2_699:hover {
    opacity: 0.9;
}

._btn-danger_1t2n2_717 {
    background-color: var(--color-error);
    border-color: var(--color-error);
}

._btn-danger_1t2n2_717:hover {
    background-color: var(--color-error-dark);
    border-color: var(--color-error-dark);
}

._btn-loading-content_1t2n2_727 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

._spinner_1t2n2_733 {
    animation: _spin_1t2n2_733 1s linear infinite;
}

@keyframes _spin_1t2n2_733 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Review Prompt Styles */
._review-prompt_1t2n2_748 {
    background-color: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: var(--radius-md);
    padding: 1rem;
    margin: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    animation: _slideIn_1t2n2_1 0.3s ease-out;
}

._review-prompt-content_1t2n2_761 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #92400e;
}

._review-prompt-text_1t2n2_768 {
    font-size: 0.875rem;
    font-weight: 500;
}

._review-now-btn_1t2n2_773 {
    background-color: #f59e0b !important;
    color: white !important;
    border: none !important;
    padding: 0.25rem 0.75rem !important;
    border-radius: 0.25rem !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: background-color 0.2s;
    white-space: nowrap;
}

._review-now-btn_1t2n2_773:hover {
    background-color: #d97706 !important;
}

@keyframes _slideIn_1t2n2_1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}/* Progress Container */
._progress-box_11oqy_2 {
    background: white;
    border-radius: var(--radius-xl);
    padding: 1.5rem 2rem;
    border: 1px solid var(--color-gray-200);
    margin-bottom: 2rem;
    box-shadow: var(--shadow-sm);
}

._steps-container_11oqy_11 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._step-item_11oqy_17 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    position: relative;
    z-index: 2;
}

._step-icon-wrapper_11oqy_25 {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

/* Step States */
._step-item_11oqy_17._active_11oqy_38 ._step-icon-wrapper_11oqy_25 {
    background: var(--color-primary);
    color: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

._step-item_11oqy_17._completed_11oqy_44 ._step-icon-wrapper_11oqy_25 {
    background: var(--color-success);
    color: white;
}

._step-item_11oqy_17._pending_11oqy_49 ._step-icon-wrapper_11oqy_25 {
    background: var(--color-gray-100);
    color: var(--color-gray-400);
}

._step-label_11oqy_54 {
    font-weight: 600;
    font-size: 0.95rem;
    white-space: nowrap;
}

._step-item_11oqy_17._active_11oqy_38 ._step-label_11oqy_54 {
    color: var(--color-primary);
}

._step-item_11oqy_17._completed_11oqy_44 ._step-label_11oqy_54 {
    color: var(--color-success);
}

._step-item_11oqy_17._pending_11oqy_49 ._step-label_11oqy_54 {
    color: var(--color-gray-400);
}

/* Connector Line */
._step-connector_11oqy_73 {
    flex: 1;
    height: 2px;
    background: var(--color-gray-200);
    margin: 0 1rem;
    position: relative;
}

._step-connector_11oqy_73._completed_11oqy_44 {
    background: var(--color-success);
}

/* Responsive */
@media (max-width: 640px) {
    ._progress-box_11oqy_2 {
        padding: 1rem;
        overflow-x: auto;
    }

    ._step-label_11oqy_54 {
        display: none;
    }

    ._step-item_11oqy_17._active_11oqy_38 ._step-label_11oqy_54 {
        display: block;
        font-size: 0.85rem;
    }
}._shipping-container_otvvh_1 {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    animation: _fadeIn_otvvh_1 0.4s ease-out;
}

/* Address Grid */
._address-grid_otvvh_9 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

._address-card_otvvh_16 {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-xl);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    background: white;
    min-height: 140px;
}

._address-card_otvvh_16:hover {
    border-color: var(--color-primary-light);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

._address-card_otvvh_16._selected_otvvh_36 {
    border-color: var(--color-primary);
    background: var(--bg-primary);
    /* Verve cream or similar light bg */
    box-shadow: 0 0 0 1px var(--color-primary);
}

._radio-input_otvvh_43 {
    margin-top: 0.25rem;
    accent-color: var(--color-primary);
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
}

._address-content_otvvh_51 {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

._address-header_otvvh_58 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}

._address-name_otvvh_65 {
    font-weight: 600;
    color: var(--color-primary);
    font-size: 1.05rem;
}

._address-type-badge_otvvh_71 {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.5rem;
    background: var(--color-gray-100);
    border-radius: 4px;
    color: var(--color-gray-600);
    font-weight: 600;
}

._default-badge_otvvh_82 {
    font-size: 0.7rem;
    padding: 0.2rem 0.5rem;
    background: rgba(16, 185, 129, 0.1);
    color: var(--color-success);
    border-radius: 4px;
    font-weight: 600;
    margin-left: 0.5rem;
}

._address-text_otvvh_92 {
    color: var(--color-gray-600);
    font-size: 0.925rem;
    line-height: 1.5;
    margin: 0;
}

._address-phone_otvvh_99 {
    margin-top: auto;
    padding-top: 0.5rem;
    font-size: 0.875rem;
    color: var(--color-gray-500);
    font-family: var(--font-mono, monospace);
}

/* Add New Address Section */
._add-address-section_otvvh_108 {
    border-top: 1px solid var(--color-gray-200);
    padding-top: 2rem;
    margin-top: 1rem;
}

._add-address-btn_otvvh_114 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1rem;
    border: 1px dashed var(--color-gray-300);
    border-radius: var(--radius-xl);
    color: var(--color-gray-600);
    background: var(--color-gray-50);
    cursor: pointer;
    transition: all 0.2s;
    font-weight: 500;
}

._add-address-btn_otvvh_114:hover {
    background: var(--color-gray-100);
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* Form Styling */
._form-container_otvvh_137 {
    background: var(--color-gray-50);
    padding: 2rem;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-gray-200);
    animation: _slideDown_otvvh_1 0.3s ease-out;
}

._form-header_otvvh_145 {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 2rem;
    color: var(--color-primary);
}

._form-actions_otvvh_152 {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-gray-200);
}

._empty-state_otvvh_161 {
    text-align: center;
    padding: 4rem 2rem;
    background: var(--color-gray-50);
    border-radius: var(--radius-2xl);
    border: 1px dashed var(--color-gray-300);
}

._action-bar_otvvh_169 {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-gray-100);
}

/* Animations */
@keyframes _fadeIn_otvvh_1 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes _slideDown_otvvh_1 {
    from {
        opacity: 0;
        height: 0;
        overflow: hidden;
    }

    to {
        opacity: 1;
        height: auto;
        overflow: visible;
    }
}

/* Responsive */
@media (max-width: 640px) {
    ._address-grid_otvvh_9 {
        grid-template-columns: 1fr;
    }

    ._form-container_otvvh_137 {
        padding: 1.25rem;
    }
}

._form-row_otvvh_215 {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

._form-grid-2_otvvh_221 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

._form-grid-3_otvvh_228 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

@media (max-width: 640px) {

    ._form-row_otvvh_215,
    ._form-grid-2_otvvh_221,
    ._form-grid-3_otvvh_228 {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
}/* Payment Form Container */
._payment-container_1hb6u_2 {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    animation: _fadeIn_1hb6u_1 0.4s ease-out;
}

._payment-section_1hb6u_9 {
    background: var(--color-gray-50);
    border-radius: var(--radius-xl);
    padding: 1.5rem;
    border: 1px solid var(--color-gray-200);
}

._payment-header_1hb6u_16 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

._payment-title_1hb6u_23 {
    font-weight: 600;
    color: var(--color-primary);
    font-size: 1.1rem;
}

._payment-description_1hb6u_29 {
    font-size: 0.9rem;
    color: var(--color-gray-600);
    margin-left: 2.25rem;
    /* Icon size (24px) + gap (12px) roughly */
    margin-bottom: 1.25rem;
}

/* Alert Box */
._info-box_1hb6u_38 {
    background: rgba(245, 158, 11, 0.08);
    border: 1px dashed rgba(245, 158, 11, 0.3);
    border-radius: var(--radius-lg);
    padding: 1rem;
    margin-left: 2.25rem;
}

._info-content_1hb6u_46 {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
}

._info-title_1hb6u_52 {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-warning-dark);
    margin-bottom: 0.25rem;
}

._info-text_1hb6u_59 {
    font-size: 0.85rem;
    color: var(--color-warning-dark);
    opacity: 0.9;
}

/* New Payment Methods Grid */
._payment-methods-grid_1hb6u_66 {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

._payment-method-card_1hb6u_72 {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid var(--color-gray-200, #e2e8f0);
    border-radius: var(--radius-lg, 0.5rem);
    cursor: pointer;
    transition: all 0.2s ease;
    background: white;
    position: relative;
}

._payment-method-card_1hb6u_72:hover {
    border-color: var(--color-primary);
    background: var(--color-gray-50, #f8fafc);
}

._payment-method-card_1hb6u_72._selected_1hb6u_90 {
    border-color: var(--color-primary);
    background: rgba(99, 102, 241, 0.05); /* Fallback to indigo tint if var missing */
    box-shadow: 0 0 0 1px var(--color-primary);
}

._radio-circle_1hb6u_96 {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--color-gray-300, #cbd5e1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

._payment-method-card_1hb6u_72._selected_1hb6u_90 ._radio-circle_1hb6u_96 {
    border-color: var(--color-primary);
}

._radio-inner_1hb6u_111 {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--color-primary);
}

._method-details_1hb6u_118 {
    flex: 1;
}

._method-title_1hb6u_122 {
    font-weight: 600;
    color: var(--color-text-primary, #1e293b);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

._method-description_1hb6u_131 {
    font-size: 0.875rem;
    color: var(--color-text-secondary, #64748b);
    margin: 0;
}

/* Actions */
._actions_1hb6u_138 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-gray-200);
}

@keyframes _fadeIn_1hb6u_1 {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 640px) {
    ._actions_1hb6u_138 {
        flex-direction: column-reverse;
        gap: 1rem;
    }

    ._actions_1hb6u_138 button {
        width: 100%;
    }

    ._payment-description_1hb6u_29,
    ._info-box_1hb6u_38 {
        margin-left: 0;
    }
}/* CheckoutProcess.module.css */

/* Global Layout */
._checkout-page_w1u8o_4 {
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    min-height: 100vh;
    padding-bottom: 4rem;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: #1e293b;
}

._container_w1u8o_12 {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Breadcrumb */
._breadcrumb_w1u8o_19 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.5rem 0;
    font-size: 0.875rem;
    color: #64748b;
}

._breadcrumb-link_w1u8o_28 {
    color: #64748b;
    text-decoration: none;
    transition: color 0.2s;
}

._breadcrumb-link_w1u8o_28:hover {
    color: #0f172a;
}

._breadcrumb-current_w1u8o_38 {
    color: #0f172a;
    font-weight: 500;
}

/* Page Header */
._page-header_w1u8o_44 {
    text-align: center;
    margin-bottom: 3rem;
}

._page-title_w1u8o_49 {
    font-size: 2rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.5rem;
    letter-spacing: -0.025em;
}

._page-subtitle_w1u8o_57 {
    color: #64748b;
    font-size: 1.1rem;
}

/* Main Grid Layout */
._layout-grid_w1u8o_63 {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 3rem;
    align-items: start;
    margin-top: 1rem;
}

/* Main Content Column */
._main-content_w1u8o_72 {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* Progress Indicator */
._progress-container_w1u8o_79 {
    background: white;
    border-radius: var(--radius-xl);
    padding: 2rem;
    box-shadow: var(--shadow-sm);
    margin-bottom: 2rem;
    border: 1px solid var(--border-light);
}

/* Cards (Standard Container) */
._card_w1u8o_89 {
    background: white;
    border-radius: var(--radius-2xl);
    border: 1px solid var(--border-light);
    padding: 2.5rem;
    box-shadow: var(--shadow-md);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

._card_w1u8o_89:hover {
    box-shadow: var(--shadow-lg);
    border-color: var(--border-medium);
}

._card-title_w1u8o_103 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #0f172a;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Sidebar (Order Summary) */
._sidebar_w1u8o_114 {
    position: sticky;
    top: 2rem;
}

._summary-card_w1u8o_119 {
    background: white;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    padding: 1.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05);
}

._summary-header_w1u8o_127 {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #f1f5f9;
}

._summary-item_w1u8o_135 {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed #f1f5f9;
}

._summary-item_w1u8o_135:last-child {
    border-bottom: none;
}

._item-info_w1u8o_148 {
    flex: 1;
    min-width: 0;
}

._item-title_w1u8o_153 {
    font-weight: 500;
    font-size: 0.9rem;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

._item-meta_w1u8o_162 {
    font-size: 0.8rem;
    color: #94a3b8;
    margin-top: 0.25rem;
}

._item-price_w1u8o_168 {
    font-family: 'DM Mono', monospace;
    font-weight: 500;
    color: #0f172a;
    font-size: 0.9rem;
}

/* Order Totals */
._order-totals_w1u8o_176 {
    background: #f8fafc;
    border-radius: 12px;
    padding: 1.25rem;
    margin-top: 1.5rem;
    border: 1px solid #e2e8f0;
}

._total-row_w1u8o_184 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
    color: #64748b;
}

._total-row_w1u8o_184._final_w1u8o_192 {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #cbd5e1;
    color: #0f172a;
    font-weight: 700;
    font-size: 1.125rem;
    margin-bottom: 0;
}

._total-row_w1u8o_184._discount_w1u8o_202 {
    color: #16a34a;
}

/* Coupon Input */
._coupon-section_w1u8o_207 {
    margin-top: 1.5rem;
}

._coupon-input-group_w1u8o_211 {
    display: flex;
    gap: 0.5rem;
}

._coupon-input_w1u8o_211 {
    flex: 1;
    padding: 0.625rem 1rem;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    font-size: 0.875rem;
    transition: all 0.2s;
}

._coupon-input_w1u8o_211:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

._apply-btn_w1u8o_231 {
    padding: 0 1.25rem;
    border-radius: 8px;
    background: #f1f5f9;
    color: #475569;
    font-weight: 500;
    font-size: 0.875rem;
    border: 1px solid #cbd5e1;
    cursor: pointer;
    transition: all 0.2s;
}

._apply-btn_w1u8o_231:hover {
    background: #e2e8f0;
    color: #0f172a;
}

/* Security Trust Badges */
._trust-badges_w1u8o_249 {
    display: flex;
    justify-content: center;
    gap: 2rem;
    margin-top: 2rem;
    padding: 1.5rem;
    background: white;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

._badge_w1u8o_260 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 500;
}

._badge_w1u8o_260 i {
    color: #10b981;
}

/* Help Section */
._help-section_w1u8o_274 {
    text-align: center;
    margin-top: 4rem;
}

._help-card_w1u8o_279 {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 2rem;
    max-width: 600px;
    margin: 0 auto;
}

/* Modal Overlay (Fixed z-index and centering) */
/* Modal Overlay (Fixed z-index and centering) */
._modal-overlay_w1u8o_290 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(8px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    animation: _fadeIn_w1u8o_1 0.3s ease;
}

._modal-content_w1u8o_306 {
    background: white;
    width: 100%;
    max-width: 380px;
    /* Reduced from 420px */
    border-radius: 16px;
    /* Reduced radius */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    animation: _scaleIn_w1u8o_1 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

._success-header_w1u8o_318 {
    background: #f0fdf4;
    padding: 1.75rem 1.25rem 1.5rem;
    /* Reduced padding */
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: 1px solid #dcfce7;
}

._success-icon-wrapper_w1u8o_328 {
    background: #fff;
    width: 60px;
    /* Reduced from 70px */
    height: 60px;
    /* Reduced from 70px */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    /* Reduced margin */
}

._success-title_w1u8o_343 {
    font-size: 1.25rem;
    /* Reduced from 1.35rem */
    font-weight: 700;
    color: #166534;
    margin-bottom: 0.25rem;
}

._success-description_w1u8o_351 {
    text-align: center;
    color: #15803d;
    font-size: 0.9rem;
    /* Reduced from 0.95rem */
}

._order-details-box_w1u8o_358 {
    background: #f8fafc;
    margin: 1rem 1.25rem;
    /* Reduced margin */
    padding: 1rem;
    /* Reduced padding */
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    text-align: center;
}

._modal-actions_w1u8o_369 {
    padding: 0 1.25rem 1.25rem;
    /* Reduced padding */
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Animation Keyframes */
@keyframes _fadeIn_w1u8o_1 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes _scaleIn_w1u8o_1 {
    from {
        transform: scale(0.9);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Responsive Handling */
@media (max-width: 1024px) {
    ._layout-grid_w1u8o_63 {
        grid-template-columns: 1fr;
    }

    ._sidebar_w1u8o_114 {
        position: static;
    }
}

@media (max-width: 640px) {
    ._container_w1u8o_12 {
        padding: 0 1rem;
    }

    ._page-title_w1u8o_49 {
        font-size: 1.5rem;
    }

    ._card_w1u8o_89 {
        padding: 1.25rem;
    }
}/* Social Login Component Styles */

._container_5uy1w_3 {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Divider Section */
._dividerSection_5uy1w_10 {
    position: relative;
    margin: 1rem 0;
}

._dividerLine_5uy1w_15 {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
}

._dividerBorder_5uy1w_22 {
    width: 100%;
    border-top: 1px solid #e5e7eb;
}

._dividerTextWrapper_5uy1w_27 {
    position: relative;
    display: flex;
    justify-content: center;
    font-size: 0.875rem;
}

._dividerText_5uy1w_27 {
    padding: 0 1rem;
    background: rgba(255, 255, 255, 0.95);
    color: #6b7280;
    font-weight: 500;
}

/* Social Buttons Grid */
._buttonsGrid_5uy1w_42 {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
}


/* Social Login Button */
._socialButton_5uy1w_50 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.875rem 2.5rem;
    width: 100%;
    max-width: 320px;
    background: linear-gradient(135deg, #5B9FED 0%, #4A8FDD 100%);
    color: #ffffff;
    border: 1px solid #4A8FDD;
    border-radius: 0.625rem;
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

._socialButton_5uy1w_50::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    transform: translate(-50%, -50%);
    transition: width 0.6s ease, height 0.6s ease;
}

._socialButton_5uy1w_50:hover::before {
    width: 300px;
    height: 300px;
}

._socialButton_5uy1w_50:hover {
    background: linear-gradient(135deg, #6AAFFF 0%, #5B9FED 100%);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(91, 159, 237, 0.35);
}

._socialButton_5uy1w_50:active {
    transform: translateY(0);
    box-shadow: 0 4px 10px rgba(91, 159, 237, 0.3);
}

._socialButton_5uy1w_50:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

._socialButton_5uy1w_50:disabled:hover {
    background: linear-gradient(135deg, #5B9FED 0%, #4A8FDD 100%);
    box-shadow: none;
}

._buttonContent_5uy1w_109 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
}

/* Security Info */
._securityInfo_5uy1w_118 {
    text-align: center;
}

._securityBadge_5uy1w_122 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: #6b7280;
    padding: 0.5rem;
}

._securityIcon_5uy1w_132 {
    color: #10b981;
}

._securityText_5uy1w_136 {
    font-weight: 500;
}/* Trust Signals Component Styles */

._container_507fb_3 {
    background: linear-gradient(135deg, rgba(249, 250, 251, 0.8) 0%, rgba(243, 244, 246, 0.6) 100%);
    backdrop-filter: blur(5px);
    border-radius: 0.75rem;
    padding: 2rem 1.5rem;
    margin-top: 2rem;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

._title_507fb_12 {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
    color: #1f2937;
}

/* Features Grid */
._featuresGrid_507fb_21 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    ._featuresGrid_507fb_21 {
        grid-template-columns: repeat(3, 1fr);
    }
}

._featureCard_507fb_34 {
    text-align: center;
}

/* Icon Container */
._iconContainer_507fb_39 {
    width: 3rem;
    height: 3rem;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.15) 0%, rgba(96, 165, 250, 0.08) 100%);
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 0.875rem;
    transition: all 0.3s ease;
    position: relative;
}

._iconContainer_507fb_39::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 0.75rem;
    padding: 2px;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(96, 165, 250, 0.1));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
}

._featureCard_507fb_34:hover ._iconContainer_507fb_39 {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.2);
}

._featureCard_507fb_34:hover ._iconContainer_507fb_39::before {
    opacity: 1;
}

._featureIcon_507fb_76 {
    color: #3b82f6;
}

/* Feature Content */
._featureTitle_507fb_81 {
    font-weight: 600;
    margin-bottom: 0.25rem;
    color: #1f2937;
    font-size: 0.95rem;
}

._featureDescription_507fb_88 {
    font-size: 0.875rem;
    color: #6b7280;
    line-height: 1.4;
}

/* Compliance Section */
._complianceSection_507fb_95 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(209, 213, 219, 0.5);
    flex-wrap: wrap;
}

._complianceBadge_507fb_106 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 0.5rem;
    transition: all 0.3s ease;
}

._complianceBadge_507fb_106:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

._badgeIcon_507fb_122 {
    color: #10b981;
    flex-shrink: 0;
}

._badgeText_507fb_127 {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
    white-space: nowrap;
}/* User Authentication Page Styles */

._pageContainer_1ebd5_3 {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    display: flex;
    flex-direction: column;
}

._mainContent_1ebd5_10 {
    flex: 1;
    padding: 2rem 0;
}

@media (min-width: 1024px) {
    ._mainContent_1ebd5_10 {
        padding: 3rem 0;
    }
}

._container_1ebd5_21 {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
}

._innerContainer_1ebd5_27 {
    max-width: 28rem;
    margin: 0 auto;
}

/* Breadcrumb */
._breadcrumb_1ebd5_33 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 1.5rem;
}

._breadcrumbLink_1ebd5_42 {
    color: #6b7280;
    text-decoration: none;
    transition: color 0.3s ease;
}

._breadcrumbLink_1ebd5_42:hover {
    color: #3b82f6;
}

._breadcrumbCurrent_1ebd5_52 {
    color: #374151;
    font-weight: 500;
}

/* Authentication Card */
._authCard_1ebd5_58 {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(209, 213, 219, 0.3);
    border-radius: 1rem;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
    padding: 2rem;
    transition: all 0.3s ease;
}

._authCard_1ebd5_58:hover {
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

@media (min-width: 1024px) {
    ._authCard_1ebd5_58 {
        padding: 2.5rem;
    }
}

/* Header Section */
._cardHeader_1ebd5_80 {
    text-align: center;
    margin-bottom: 2rem;
}

._cardTitle_1ebd5_85 {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: var(--verve-black);
}

._cardDescription_1ebd5_92 {
    color: #6b7280;
    font-size: 0.95rem;
}

/* Error Message */
._errorContainer_1ebd5_98 {
    margin-bottom: 1.5rem;
    padding: 0.875rem;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(220, 38, 38, 0.05) 100%);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: 0.5rem;
    animation: _slideDown_1ebd5_1 0.3s ease;
}

@keyframes _slideDown_1ebd5_1 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

._errorText_1ebd5_119 {
    color: #dc2626;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Links Section */
._linksContainer_1ebd5_126 {
    margin-top: 1.5rem;
    text-align: center;
}

._linksWrapper_1ebd5_131 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-size: 0.75rem;
    color: #6b7280;
}

._policyLink_1ebd5_140 {
    color: #6b7280;
    text-decoration: none;
    transition: color 0.3s ease;
    position: relative;
}

._policyLink_1ebd5_140::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1px;
    background: #3b82f6;
    transition: width 0.3s ease;
}

._policyLink_1ebd5_140:hover {
    color: #3b82f6;
}

._policyLink_1ebd5_140:hover::after {
    width: 100%;
}

._linkSeparator_1ebd5_166 {
    color: #d1d5db;
}/* Profile Sidebar Styles */

/* Desktop Sidebar */
._sidebar_10xtp_4 {
    width: 100%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.95) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1.25rem;
    padding: 1.75rem;
    height: fit-content;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    position: sticky;
    top: 2rem;
    transition: all 0.3s ease;
}

._sidebar_10xtp_4:hover {
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.12);
}

._sidebarHeader_10xtp_22 {
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

._sidebarHeader_10xtp_22::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    border-radius: 2px;
}

._sidebarTitle_10xtp_40 {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    letter-spacing: -0.025em;
}

._sidebarDescription_10xtp_51 {
    color: #6b7280;
    font-size: 0.875rem;
    line-height: 1.5;
}

._nav_10xtp_57 {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

._navButton_10xtp_63 {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.875rem;
    text-align: left;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: transparent;
    position: relative;
    overflow: hidden;
}

._navButton_10xtp_63::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #3b82f6, #60a5fa);
    transform: scaleY(0);
    transition: transform 0.3s ease;
    border-radius: 0 4px 4px 0;
}

._navButton_10xtp_63::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08) 0%, rgba(96, 165, 250, 0.04) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 0.875rem;
}

._navButton_10xtp_63:hover {
    background: rgba(249, 250, 251, 0.8);
    border-color: rgba(59, 130, 246, 0.2);
    transform: translateX(4px);
}

._navButton_10xtp_63:hover::after {
    opacity: 1;
}

._active_10xtp_112 {
    background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%) !important;
    color: white !important;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.35),
        0 0 0 1px rgba(59, 130, 246, 0.1) !important;
    border-color: transparent !important;
    transform: translateX(4px);
}

._navButton_10xtp_63._active_10xtp_112::before {
    transform: scaleY(1);
}

._navButton_10xtp_63._active_10xtp_112::after {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, transparent 100%);
    opacity: 1;
}

._navButton_10xtp_63:not(._active_10xtp_112) {
    color: #6b7280;
}

._navIcon_10xtp_134 {
    margin-top: 0.125rem;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

._navButton_10xtp_63:hover:not(._active_10xtp_112) ._navIcon_10xtp_134 {
    color: #3b82f6;
    transform: scale(1.1);
}

._navButton_10xtp_63._active_10xtp_112 ._navIcon_10xtp_134 {
    color: white;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

._navContent_10xtp_150 {
    min-width: 0;
    flex: 1;
    position: relative;
    z-index: 1;
}

._navLabel_10xtp_157 {
    font-weight: 600;
    font-size: 0.9375rem;
    margin-bottom: 0.25rem;
    letter-spacing: -0.0125em;
}

._navButton_10xtp_63._active_10xtp_112 ._navLabel_10xtp_157 {
    color: white;
    font-weight: 700;
}

._navDescription_10xtp_169 {
    font-size: 0.75rem;
    margin-top: 0.125rem;
    opacity: 0.8;
    line-height: 1.4;
}

._navButton_10xtp_63._active_10xtp_112 ._navDescription_10xtp_169 {
    color: rgba(255, 255, 255, 0.95);
}

._navButton_10xtp_63:not(._active_10xtp_112) ._navDescription_10xtp_169 {
    color: #9ca3af;
}

._signOutSection_10xtp_184 {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 2px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

._signOutSection_10xtp_184::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, #ef4444, #f87171);
    border-radius: 2px;
}

/* Mobile Sidebar */
._mobileSidebar_10xtp_203 {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.95));
    backdrop-filter: blur(10px);
    border-bottom: 2px solid rgba(229, 231, 235, 0.5);
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    position: sticky;
    top: 0;
    z-index: 10;
}

._mobileNav_10xtp_214 {
    display: flex;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 0.25rem;
}

._mobileNav_10xtp_214::-webkit-scrollbar {
    display: none;
}

._mobileNavButton_10xtp_226 {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.25rem;
    min-width: 6rem;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    color: #6b7280;
    gap: 0.5rem;
}

._mobileNavButton_10xtp_226::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    transform: scaleX(0);
    transition: transform 0.3s ease;
    border-radius: 3px 3px 0 0;
}

._mobileNavButton_10xtp_226::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(59, 130, 246, 0.05) 0%, transparent 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

._mobileNavButton_10xtp_226._active_10xtp_112 {
    color: #3b82f6 !important;
}

._mobileNavButton_10xtp_226._active_10xtp_112::after {
    transform: scaleX(1);
}

._mobileNavButton_10xtp_226._active_10xtp_112::before {
    opacity: 1;
}

._mobileNavButton_10xtp_226:hover:not(._active_10xtp_112) {
    color: #3b82f6;
    background: rgba(59, 130, 246, 0.05);
}

._mobileNavIcon_10xtp_282 {
    transition: all 0.3s ease;
}

._mobileNavButton_10xtp_226._active_10xtp_112 ._mobileNavIcon_10xtp_282 {
    transform: scale(1.15);
    filter: drop-shadow(0 2px 4px rgba(59, 130, 246, 0.3));
}

._mobileNavLabel_10xtp_291 {
    font-size: 0.8125rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.2;
    letter-spacing: -0.0125em;
}

._mobileNavButton_10xtp_226._active_10xtp_112 ._mobileNavLabel_10xtp_291 {
    font-weight: 700;
}/* Personal Info Section Styles */

._container_91hf5_3 {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.95) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1.25rem;
    padding: 2rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

._container_91hf5_3::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -50%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.06) 0%, transparent 70%);
    pointer-events: none;
    animation: _float_91hf5_1 20s ease-in-out infinite;
}

@keyframes _float_91hf5_1 {

    0%,
    100% {
        transform: translate(0, 0) rotate(0deg);
    }

    33% {
        transform: translate(30px, -30px) rotate(120deg);
    }

    66% {
        transform: translate(-20px, 20px) rotate(240deg);
    }
}

._container_91hf5_3:hover {
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

._header_91hf5_48 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

._header_91hf5_48::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    border-radius: 2px;
}

._headerContent_91hf5_71 {
    flex: 1;
    min-width: 0;
}

._title_91hf5_76 {
    font-size: 1.5rem;
    font-weight: 700;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #60a5fa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.5rem;
    letter-spacing: -0.025em;
}

._description_91hf5_87 {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.5;
}

._content_91hf5_93 {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

/* Profile Picture Section */
._profilePictureSection_91hf5_100 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(249, 250, 251, 0.6) 0%, rgba(243, 244, 246, 0.4) 100%);
    border-radius: 1rem;
    border: 1px solid rgba(229, 231, 235, 0.6);
}

@media (min-width: 640px) {
    ._profilePictureSection_91hf5_100 {
        flex-direction: row;
        align-items: center;
    }
}

._avatarWrapper_91hf5_118 {
    position: relative;
}

._avatar_91hf5_118 {
    width: 7rem;
    height: 7rem;
    border-radius: 50%;
    overflow: hidden;
    border: 4px solid white;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15),
        0 0 0 1px rgba(59, 130, 246, 0.1);
    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
    transition: all 0.3s ease;
    position: relative;
}

._avatar_91hf5_118::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, transparent 100%);
    pointer-events: none;
}

._avatarWrapper_91hf5_118:hover ._avatar_91hf5_118 {
    transform: scale(1.05);
    box-shadow: 0 12px 32px rgba(59, 130, 246, 0.25),
        0 0 0 1px rgba(59, 130, 246, 0.2);
}

._avatarImage_91hf5_150 {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

._cameraButton_91hf5_156 {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 2.5rem;
    height: 2.5rem;
    background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 3px solid white;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

._cameraButton_91hf5_156:hover {
    transform: scale(1.15) rotate(15deg);
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.5);
    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
}

._cameraButton_91hf5_156:active {
    transform: scale(1.05);
}

._cameraButton_91hf5_156 input {
    display: none;
}

._pictureInfo_91hf5_188 {
    flex: 1;
}

._pictureTitle_91hf5_192 {
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    color: #1f2937;
}

._pictureDescription_91hf5_199 {
    color: #6b7280;
    font-size: 0.875rem;
    margin-bottom: 1rem;
    line-height: 1.6;
}

._pictureActions_91hf5_206 {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

._pictureActions_91hf5_206 label {
    display: inline-block;
}

._pictureActions_91hf5_206 input[type="file"] {
    display: none;
}

/* Form Grid */
._formGrid_91hf5_221 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 768px) {
    ._formGrid_91hf5_221 {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.75rem;
    }
}

/* Gender Selection */
._genderField_91hf5_235 {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    grid-column: 1 / -1;
}

._genderLabel_91hf5_242 {
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    letter-spacing: 0.025em;
}

._genderOptions_91hf5_249 {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    padding: 1rem;
    background: rgba(249, 250, 251, 0.5);
    border-radius: 0.75rem;
    border: 1px solid rgba(229, 231, 235, 0.6);
}

._genderOptions_91hf5_249 label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
}

._genderOptions_91hf5_249 label:hover {
    background: rgba(59, 130, 246, 0.05);
}

._genderOptions_91hf5_249 input[type="radio"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: #3b82f6;
}

._genderOptions_91hf5_249 span {
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
}

/* Action Buttons */
._actionButtons_91hf5_287 {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-top: 2rem;
    border-top: 2px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

._actionButtons_91hf5_287::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    border-radius: 2px;
}

@media (min-width: 640px) {
    ._actionButtons_91hf5_287 {
        flex-direction: row;
        gap: 1rem;
    }
}

/* Account Stats */
._statsGrid_91hf5_315 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    padding-top: 2rem;
    border-top: 2px solid rgba(229, 231, 235, 0.5);
}

@media (min-width: 640px) {
    ._statsGrid_91hf5_315 {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }
}

._statCard_91hf5_330 {
    text-align: center;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(249, 250, 251, 0.9) 0%, rgba(243, 244, 246, 0.7) 100%);
    border-radius: 1rem;
    border: 1px solid rgba(209, 213, 219, 0.4);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

._statCard_91hf5_330::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa, #3b82f6);
    background-size: 200% 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

._statCard_91hf5_330:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(59, 130, 246, 0.15);
    border-color: rgba(59, 130, 246, 0.4);
}

._statCard_91hf5_330:hover::before {
    opacity: 1;
    animation: _shimmer_91hf5_1 2s ease-in-out infinite;
}

@keyframes _shimmer_91hf5_1 {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

._statValue_91hf5_375 {
    font-size: 2rem;
    font-weight: 700;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #60a5fa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.5rem;
    line-height: 1;
}

._statLabel_91hf5_386 {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
}/* Address Section Styles */

._container_6hlmo_3 {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.95) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1.25rem;
    padding: 2rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
}

._container_6hlmo_3::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -50%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.06) 0%, transparent 70%);
    pointer-events: none;
    animation: _float_6hlmo_1 20s ease-in-out infinite;
}

@keyframes _float_6hlmo_1 {

    0%,
    100% {
        transform: translate(0, 0) rotate(0deg);
    }

    33% {
        transform: translate(30px, -30px) rotate(120deg);
    }

    66% {
        transform: translate(-20px, 20px) rotate(240deg);
    }
}

._container_6hlmo_3:hover {
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

._header_6hlmo_48 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2.5rem;
    flex-wrap: wrap;
    gap: 1rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

._header_6hlmo_48::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    border-radius: 2px;
}

._headerContent_6hlmo_71 {
    flex: 1;
    min-width: 0;
}

._title_6hlmo_76 {
    font-size: 1.5rem;
    font-weight: 700;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #60a5fa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 0.5rem;
    letter-spacing: -0.025em;
}

._description_6hlmo_87 {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.5;
}

._addressList_6hlmo_93 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
    ._addressList_6hlmo_93 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._addressCard_6hlmo_106 {
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1rem;
    padding: 1.5rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(249, 250, 251, 0.8) 100%);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

._addressCard_6hlmo_106::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(180deg, #3b82f6, #60a5fa);
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

._addressCard_6hlmo_106:hover {
    border-color: rgba(59, 130, 246, 0.4);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.15);
    transform: translateY(-4px) translateX(2px);
}

._addressCard_6hlmo_106:hover::before {
    transform: scaleY(1);
}

._addressCard_6hlmo_106._default_6hlmo_138 {
    border-color: rgba(59, 130, 246, 0.6);
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.05) 0%, rgba(96, 165, 250, 0.03) 100%);
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.15);
}

._addressCard_6hlmo_106._default_6hlmo_138::before {
    transform: scaleY(1);
}

._defaultBadge_6hlmo_148 {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
    color: white;
    padding: 0.375rem 0.875rem;
    border-radius: 1rem;
    font-size: 0.75rem;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
    letter-spacing: 0.025em;
}

._editButton_6hlmo_162 {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
    color: white !important;
    padding: 0.375rem 0.875rem;
    border-radius: 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
    letter-spacing: 0.025em;
    transition: all 0.2s ease;
    border: none;
}

._editButton_6hlmo_162:hover {
    background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

._defaultBadgeInline_6hlmo_184 {
    background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
    color: white;
    padding: 0.375rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.25);
    letter-spacing: 0.025em;
    display: inline-flex;
    align-items: center;
}

._addressHeader_6hlmo_197 {
    display: flex;
    justify-content: space-between;
    align-items: start;
    margin-bottom: 1rem;
}

._addressType_6hlmo_204 {
    font-weight: 600;
    color: #1f2937;
    font-size: 1rem;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

._addressActions_6hlmo_214 {
    display: flex;
    gap: 0.5rem;
}

._iconButton_6hlmo_219 {
    padding: 0.5rem;
    border: none;
    background: rgba(107, 114, 128, 0.08);
    border-radius: 0.65rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

._iconButton_6hlmo_219:hover {
    background: rgba(59, 130, 246, 0.15);
    transform: scale(1.1);
}

._iconButton_6hlmo_219:active {
    transform: scale(0.95);
}

._addressDetails_6hlmo_240 {
    color: #6b7280;
    font-size: 0.875rem;
    line-height: 1.7;
}

._addressName_6hlmo_246 {
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
    font-size: 0.9375rem;
}

._formSection_6hlmo_253 {
    background: linear-gradient(135deg, rgba(249, 250, 251, 0.6) 0%, rgba(243, 244, 246, 0.4) 100%);
    border: 1px solid rgba(229, 231, 235, 0.6);
    border-radius: 1rem;
    padding: 2rem;
    margin-top: 1.5rem;
}

._formTitle_6hlmo_261 {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 1.5rem;
}

._formGrid_6hlmo_268 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 768px) {
    ._formGrid_6hlmo_268 {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.75rem;
    }
}

._fullWidth_6hlmo_281 {
    grid-column: 1 / -1;
}

._radioGroup_6hlmo_285 {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    padding: 1rem;
    background: rgba(249, 250, 251, 0.5);
    border-radius: 0.65rem;
    border: 1px solid rgba(229, 231, 235, 0.6);
}

._radioLabel_6hlmo_296 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
    font-weight: 500;
    padding: 0.5rem 0.75rem;
    border-radius: 0.65rem;
    transition: all 0.2s ease;
}

._radioLabel_6hlmo_296:hover {
    background: rgba(59, 130, 246, 0.05);
}

._radioLabel_6hlmo_296 input[type="radio"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: #3b82f6;
}

._checkboxLabel_6hlmo_320 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
    font-weight: 500;
}

._checkboxLabel_6hlmo_320 input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: #3b82f6;
}

._formActions_6hlmo_337 {
    display: flex;
    gap: 1rem;
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 2px solid rgba(229, 231, 235, 0.5);
    flex-wrap: wrap;
    position: relative;
}

._formActions_6hlmo_337::before {
    content: '';
    position: absolute;
    top: -2px;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa);
    border-radius: 2px;
}

._emptyState_6hlmo_358 {
    text-align: center;
    padding: 4rem 2rem;
    color: #9ca3af;
}

._emptyStateIcon_6hlmo_364 {
    width: 5rem;
    height: 5rem;
    margin: 0 auto 1.5rem;
    background: linear-gradient(135deg, rgba(107, 114, 128, 0.1) 0%, rgba(107, 114, 128, 0.05) 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

._emptyStateText_6hlmo_375 {
    font-size: 1.125rem;
    font-weight: 600;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

._emptyStateDescription_6hlmo_382 {
    font-size: 0.9375rem;
    color: #9ca3af;
    margin-bottom: 2rem;
    line-height: 1.6;
}

/* Error State */
._errorBanner_6hlmo_390 {
    margin-bottom: 1.5rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(248, 113, 113, 0.05) 100%);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

._errorText_6hlmo_401 {
    color: #dc2626;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Loading State */
._loadingState_6hlmo_408 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    gap: 1rem;
}

._loadingSpinner_6hlmo_416 {
    animation: _spin_6hlmo_1 1s linear infinite;
}

@keyframes _spin_6hlmo_1 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

._loadingText_6hlmo_430 {
    color: #6b7280;
    font-size: 0.9375rem;
}

._selectInput_6hlmo_435 {
    width: 100%;
    padding: 0.45rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.65rem;
    font-size: 1rem;
    transition: all 0.2s ease;
    outline: none;
    font-family: inherit;
    background-color: white;
}

._selectInput_6hlmo_435:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

._selectError_6hlmo_452 {
    border-color: #dc2626 !important;
}._container_1htoo_1 {
    padding: 24px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

._title_1htoo_8 {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 24px;
    color: #111827;
}

._reviewTitle_1htoo_15 {
    font-size: 1rem;
    font-weight: 600;
    color: #111827;
    margin-bottom: 8px;
    margin-top: 0;
}

._loading_1htoo_23 {
    padding: 40px;
    text-align: center;
    color: #6b7280;
}

._no-reviews_1htoo_29 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 0;
    text-align: center;
    color: #6b7280;
}

._empty-icon_1htoo_39 {
    margin-bottom: 16px;
    color: #d1d5db;
}

._browse-btn_1htoo_44 {
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #2563eb;
    color: white;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 500;
    transition: background-color 0.2s;
}

._browse-btn_1htoo_44:hover {
    background-color: #1d4ed8;
}

._reviews-list_1htoo_59 {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

._review-card_1htoo_65 {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 20px;
    transition: box-shadow 0.2s;
}

._review-card_1htoo_65:hover {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

._product-info_1htoo_76 {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
    align-items: flex-start;
}

._product-image_1htoo_83 {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 6px;
    background-color: #f3f4f6;
}

._product-name_1htoo_91 a {
    color: #111827;
    text-decoration: none;
    font-weight: 500;
    font-size: 1.1rem;
}

._product-name_1htoo_91 a:hover {
    color: #2563eb;
    text-decoration: underline;
}

._review-date_1htoo_103 {
    font-size: 0.875rem;
    color: #6b7280;
    margin-top: 4px;
}

._rating-row_1htoo_109 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

._pinned-badge_1htoo_116 {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    background-color: #fef3c7;
    color: #d97706;
    padding: 2px 8px;
    border-radius: 9999px;
    font-weight: 500;
}

._review-text_1htoo_128 {
    color: #374151;
    line-height: 1.5;
    margin-bottom: 16px;
}

._admin-reply_1htoo_134 {
    background-color: #f9fafb;
    padding: 16px;
    border-radius: 6px;
    margin-top: 16px;
    border-left: 3px solid #2563eb;
}

._admin-reply-label_1htoo_142 {
    font-size: 0.875rem;
    font-weight: 600;
    color: #111827;
    margin-bottom: 4px;
}

._admin-reply-text_1htoo_149 {
    font-size: 0.875rem;
    color: #4b5563;
    margin: 0;
}

._actions_1htoo_155 {
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
    border-top: 1px solid #f3f4f6;
    padding-top: 16px;
}

._delete-btn_1htoo_163 {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: #ef4444;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 4px;
    transition: background-color 0.2s;
}

._delete-btn_1htoo_163:hover {
    background-color: #fee2e2;
}/* User Profile Page Styles */

._pageContainer_1laku_3 {
    min-height: 100vh;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
    position: relative;
}

._pageContainer_1laku_3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-light), transparent);
    z-index: 1;
}

._mainContent_1laku_20 {
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
    position: relative;
    z-index: 2;
}

/* Breadcrumb */
._breadcrumb_1laku_29 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 1.5rem;
}

._breadcrumbLink_1laku_38 {
    color: #6b7280;
    text-decoration: none;
    transition: color 0.3s ease;
}

._breadcrumbLink_1laku_38:hover {
    color: #3b82f6;
}

._breadcrumbCurrent_1laku_48 {
    color: #3b82f6;
    font-weight: 500;
}

/* Page Header */
._pageHeader_1laku_54 {
    margin-bottom: var(--space-8);
    padding: var(--space-6);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.95) 100%);
    backdrop-filter: blur(20px);
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(209, 213, 219, 0.5);
    position: relative;
    overflow: hidden;
}

._pageHeader_1laku_54::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

._headerContent_1laku_77 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-2);
}

._iconContainer_1laku_84 {
    width: 3rem;
    height: 3rem;
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

._pageTitle_1laku_95 {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--verve-black);
    margin: 0;
}

@media (min-width: 768px) {
    ._pageTitle_1laku_95 {
        font-size: var(--text-4xl);
    }
}

._pageDescription_1laku_108 {
    color: var(--text-secondary);
    font-size: var(--text-lg);
    margin: 0;
}

/* Profile Content */
._profileContent_1laku_115 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 1024px) {
    ._profileContent_1laku_115 {
        grid-template-columns: 280px 1fr;
        gap: var(--space-6);
    }
}

._mainSection_1laku_128 {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

._sectionCard_1laku_134 {
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    box-shadow: var(--shadow-sm);
}

._mobileSectionHeader_1laku_142 {
    margin-bottom: 1.5rem;
}

._mobileSectionTitle_1laku_146 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1f2937;
}

/* Quick Actions */
._quickActionsSection_1laku_153 {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(249, 250, 251, 0.95) 100%);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1.25rem;
    padding: 2rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    margin-top: var(--space-6);
    position: relative;
    overflow: hidden;
}

._quickActionsSection_1laku_153::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #3b82f6, #60a5fa, #818cf8, #60a5fa, #3b82f6);
    background-size: 200% 100%;
    animation: _shimmer_1laku_1 3s ease-in-out infinite;
}

@keyframes _shimmer_1laku_1 {

    0%,
    100% {
        background-position: 0% 0;
    }

    50% {
        background-position: 200% 0;
    }
}

._quickActionsTitle_1laku_189 {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #60a5fa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    letter-spacing: -0.025em;
}

._quickActionsGrid_1laku_200 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

@media (min-width: 640px) {
    ._quickActionsGrid_1laku_200 {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }
}

@media (min-width: 1280px) {
    ._quickActionsGrid_1laku_200 {
        grid-template-columns: repeat(2, 1fr);
    }
}

._quickActionCard_1laku_219 {
    padding: 1.25rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(249, 250, 251, 0.8) 100%);
    border: 1px solid rgba(209, 213, 219, 0.4);
    border-radius: 1rem;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    position: relative;
    overflow: hidden;
}

._quickActionCard_1laku_219::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.08) 0%, rgba(96, 165, 250, 0.04) 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

._quickActionCard_1laku_219::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: linear-gradient(180deg, #3b82f6, #60a5fa);
    transform: scaleY(0);
    transition: transform 0.3s ease;
}

._quickActionCard_1laku_219:hover {
    transform: translateY(-6px) translateX(4px);
    box-shadow: 0 12px 28px rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

._quickActionCard_1laku_219:hover::before {
    opacity: 1;
}

._quickActionCard_1laku_219:hover::after {
    transform: scaleY(1);
}

._quickActionCard_1laku_219:active {
    transform: translateY(-2px) translateX(2px);
}

._actionCardContent_1laku_273 {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    position: relative;
    z-index: 1;
}

._actionIconWrapper_1laku_281 {
    width: 3.5rem;
    height: 3.5rem;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.15) 0%, rgba(96, 165, 250, 0.1) 100%);
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.1);
    position: relative;
}

._actionIconWrapper_1laku_281::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.5) 0%, transparent 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

._quickActionCard_1laku_219:hover ._actionIconWrapper_1laku_281 {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.25) 0%, rgba(96, 165, 250, 0.18) 100%);
    transform: scale(1.15) rotate(5deg);
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.25);
}

._quickActionCard_1laku_219:hover ._actionIconWrapper_1laku_281::before {
    opacity: 1;
}

._actionTextContent_1laku_315 {
    min-width: 0;
}

._actionTitle_1laku_319 {
    font-weight: 600;
    color: #1f2937;
    font-size: 1rem;
    margin: 0 0 0.25rem 0;
    letter-spacing: -0.0125em;
    transition: color 0.3s ease;
}

._quickActionCard_1laku_219:hover ._actionTitle_1laku_319 {
    color: #3b82f6;
}

._actionDescription_1laku_332 {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}._container_wewoo_1 {
    min-height: 100vh;
    background-color: var(--bg-background);
}

._main-content_wewoo_6 {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
}

/* Page Header */
._page-header_wewoo_14 {
    text-align: center;
    margin-bottom: var(--space-12);
}

._page-title_wewoo_19 {
    font-size: var(--text-4xl);
    font-weight: var(--font-bold);
    margin-bottom: var(--space-4);
    color: var(--text-foreground);
}

._page-description_wewoo_26 {
    font-size: var(--text-lg);
    color: var(--text-muted);
}

/* Loading State */
._loading-container_wewoo_32 {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

._loading-content_wewoo_39 {
    text-align: center;
}

._spinner_wewoo_43 {
    margin: 0 auto var(--space-4);
    animation: _spin_wewoo_43 1s linear infinite;
    color: var(--color-primary);
}

@keyframes _spin_wewoo_43 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

._loading-text_wewoo_59 {
    color: var(--text-muted);
}

/* Empty State */
._empty-state_wewoo_64 {
    text-align: center;
    padding: var(--space-16) 0;
}

._empty-icon_wewoo_69 {
    margin: 0 auto var(--space-4);
    color: var(--text-muted);
}

._empty-title_wewoo_74 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-2);
}

._empty-text_wewoo_80 {
    color: var(--text-muted);
    margin-bottom: var(--space-6);
}

/* Offers Grid */
._offers-grid_wewoo_86 {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
}

@media (min-width: 768px) {
    ._offers-grid_wewoo_86 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    ._offers-grid_wewoo_86 {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Offer Card */
._offer-card_wewoo_105 {
    background-color: var(--bg-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    transition: box-shadow var(--transition-normal), transform var(--transition-fast);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

._offer-card_wewoo_105:hover {
    box-shadow: var(--shadow-elevated);
    transform: translateY(-4px);
}

/* Decorative background element */
._offer-card_wewoo_105::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 100px;
    background: linear-gradient(135deg, transparent 50%, rgba(var(--color-primary-rgb), 0.05) 50%);
    border-radius: 0 0 0 100%;
    pointer-events: none;
}

._card-header_wewoo_135 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--space-4);
}

._discount-badge_wewoo_142 {
    background-color: var(--color-accent);
    color: white;
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-full);
    font-weight: var(--font-bold);
    font-size: var(--text-lg);
    box-shadow: var(--shadow-sm);
}

._exclusive-badge_wewoo_152 {
    font-size: var(--text-xs);
    background-color: var(--bg-secondary);
    color: var(--text-foreground);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-md);
    font-weight: var(--font-medium);
}

._offer-description_wewoo_161 {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-2);
    color: var(--text-foreground);
    line-height: 1.4;
}

/* Coupon Code Section */
._code-section_wewoo_170 {
    background-color: var(--bg-muted);
    border: 2px dashed var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    transition: background-color var(--transition-fast);
}

._offer-card_wewoo_105:hover ._code-section_wewoo_170 {
    background-color: rgba(var(--bg-muted-rgb), 0.8);
    border-color: var(--color-primary);
}

._code-wrapper_wewoo_184 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

._code-label_wewoo_190 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-bottom: var(--space-1);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

._coupon-code_wewoo_198 {
    font-family: var(--font-mono);
    font-weight: var(--font-bold);
    font-size: var(--text-xl);
    color: var(--text-foreground);
    letter-spacing: 1px;
}

._copy-btn_wewoo_206 {
    color: var(--text-muted);
    transition: color var(--transition-fast);
}

._copy-btn_wewoo_206:hover {
    color: var(--color-primary);
    background-color: rgba(var(--color-primary-rgb), 0.1);
}

/* Details Section */
._details-list_wewoo_217 {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--space-6);
    flex-grow: 1;
}

._detail-item_wewoo_227 {
    display: flex;
    align-items: center;
}

._detail-icon_wewoo_232 {
    margin-right: var(--space-2);
    color: var(--text-muted);
}

/* CTA Button */
._shop-btn_wewoo_238 {
    margin-top: auto;
}._container_10x0f_1 {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
}

._main-content_10x0f_8 {
    flex: 1;
    max-width: var(--max-width);
    margin: 0 auto;
    padding: var(--space-8) var(--space-4);
    width: 100%;
}

/* Header */
._header_10x0f_17 {
    margin-bottom: var(--space-10);
    text-align: center;
    padding: var(--space-8) var(--space-4);
    background: linear-gradient(135deg,
            hsla(210, 80%, 15%, 0.05) 0%,
            hsla(210, 80%, 10%, 0.08) 100%);
    border-radius: var(--radius-xl);
    backdrop-filter: blur(10px);
    border: 1px solid hsla(210, 40%, 20%, 0.1);
    position: relative;
    overflow: hidden;
}

._header_10x0f_17::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle,
            hsla(45, 100%, 50%, 0.05) 0%,
            transparent 70%);
    animation: _headerGlow_10x0f_1 8s ease-in-out infinite;
}

@keyframes _headerGlow_10x0f_1 {

    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(10%, 10%) scale(1.1);
    }
}

._title_10x0f_56 {
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 800;
    color: var(--verve-black);
    margin-bottom: var(--space-3);
    position: relative;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

._subtitle_10x0f_66 {
    font-size: var(--text-xl);
    color: var(--verve-navy);
    font-weight: 600;
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4);
    background: hsla(210, 40%, 20%, 0.05);
    border-radius: var(--radius-full);
    backdrop-filter: blur(5px);
}

/* Loading */
._loading_10x0f_81 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    gap: var(--space-4);
}

._spinner_10x0f_90 {
    animation: _spin_10x0f_90 1s linear infinite;
    color: var(--verve-navy);
    filter: drop-shadow(0 0 10px hsla(210, 80%, 30%, 0.3));
}

@keyframes _spin_10x0f_90 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Empty State */
._empty-state_10x0f_107 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: var(--space-12) var(--space-4);
    gap: var(--space-6);
    background: var(--bg-secondary);
    border-radius: var(--radius-2xl);
    backdrop-filter: blur(10px);
    border: 2px dashed var(--border-medium);
    margin: var(--space-8) 0;
}

._empty-icon_10x0f_122 {
    color: var(--color-accent);
    opacity: 0.7;
    filter: drop-shadow(0 4px 12px hsla(45, 100%, 50%, 0.2));
    animation: _heartbeat_10x0f_1 2s ease-in-out infinite;
}

@keyframes _heartbeat_10x0f_1 {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }
}

._empty-title_10x0f_141 {
    font-size: var(--text-3xl);
    font-weight: 700;
    color: var(--verve-black);
}

._empty-message_10x0f_147 {
    font-size: var(--text-lg);
    color: var(--text-tertiary);
    margin-bottom: var(--space-4);
    max-width: 400px;
}

/* Grid */
._grid_10x0f_155 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--space-3);
    padding: var(--space-3);
}

@media (min-width: 640px) {
    ._grid_10x0f_155 {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}

@media (min-width: 1024px) {
    ._grid_10x0f_155 {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    }
}

/* Card */
._card_10x0f_175 {
    background: var(--color-white);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: var(--shadow-sm);
}

._card_10x0f_175::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--verve-navy);
    opacity: 0;
    transition: opacity 0.3s ease;
}

._card_10x0f_175:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: var(--border-medium);
}

._card_10x0f_175:hover::before {
    opacity: 1;
}

/* Image Container */
._image-container_10x0f_208 {
    position: relative;
    width: 100%;
    padding-top: 100%;
    background: var(--bg-secondary);
    overflow: hidden;
}

._image-container_10x0f_208::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
            transparent 0%,
            rgba(0, 0, 0, 0.02) 100%);
    pointer-events: none;
}

._image_10x0f_208 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

._image_10x0f_208:hover {
    transform: scale(1.1);
}

._remove-btn_10x0f_241 {
    position: absolute;
    top: var(--space-2);
    right: var(--space-2);
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    background: linear-gradient(135deg,
            hsla(0, 0%, 100%, 0.95) 0%,
            hsla(0, 0%, 98%, 0.9) 100%);
    border: 1px solid hsla(0, 0%, 80%, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 12px hsla(0, 0%, 0%, 0.1);
}

._remove-btn_10x0f_241:hover {
    background: linear-gradient(135deg,
            hsl(0, 85%, 60%) 0%,
            hsl(0, 75%, 55%) 100%);
    color: white;
    transform: scale(1.15) rotate(90deg);
    box-shadow: 0 6px 20px hsla(0, 85%, 60%, 0.4);
    border-color: hsl(0, 85%, 50%);
}

/* Product Info */
._product-info_10x0f_273 {
    padding: var(--space-3);
    display: flex;
    flex-direction: column;
    gap: var(--space-1.5);
    background: var(--color-white);
}

._product-title_10x0f_281 {
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--verve-black);
    cursor: pointer;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all 0.3s ease;
    line-height: 1.4;
    min-height: 2.8em;
}

._product-title_10x0f_281:hover {
    color: var(--verve-navy);
    transform: translateX(4px);
}

._category_10x0f_301 {
    font-size: var(--text-xs);
    color: var(--text-tertiary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 700;
    background: var(--bg-secondary);
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    display: inline-block;
    align-self: flex-start;
    border: 1px solid var(--border-light);
}

/* Rating */
._rating_10x0f_316 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    padding: var(--space-1.5) var(--space-2.5);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
    align-self: flex-start;
}

._star-icon_10x0f_329 {
    color: var(--color-accent);
    fill: currentColor;
}

._review-count_10x0f_334 {
    color: hsl(280, 20%, 60%);
    margin-left: var(--space-1);
}

/* Price */
._price_10x0f_340 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    margin: var(--space-2) 0;
}

._sale-price_10x0f_347 {
    font-size: var(--text-lg);
    font-weight: 800;
    color: var(--verve-navy);
    font-family: var(--font-mono);
    letter-spacing: -0.02em;
}

/* Colors */
._colors_10x0f_356 {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: wrap;
    padding: var(--space-3) 0;
}

._color-dot_10x0f_364 {
    width: 16px;
    height: 16px;
    border-radius: var(--radius-full);
    border: 1px solid var(--border-medium);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

._color-dot_10x0f_364:hover {
    transform: scale(1.3);
    box-shadow: var(--shadow-md);
    border-color: var(--verve-navy);
    z-index: 5;
}

._more-colors_10x0f_381 {
    font-size: var(--text-sm);
    color: var(--text-tertiary);
    font-weight: 600;
    margin-left: var(--space-1);
    padding: var(--space-1) var(--space-2);
    background: var(--bg-secondary);
    border-radius: var(--radius-md);
}

/* Actions */
._actions_10x0f_392 {
    display: flex;
    flex-direction: column;
    gap: var(--space-1-5);
    margin-top: var(--space-1-5);
    padding-top: var(--space-2);
    border-top: 1px solid var(--border-light);
}

/* Added Date */
._added-date_10x0f_402 {
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: center;
    padding-top: var(--space-2);
    border-top: 1px solid var(--border-light);
    margin-top: var(--space-2);
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
}

._added-date_10x0f_402::before {
    content: '📅';
    font-size: var(--text-sm);
}/* ===================================
   CSS VARIABLES - Design System
   =================================== */

:root {
    /* Primary Colors - Brand Black */
    --color-primary: var(--verve-black);
    --color-primary-light: #333333;
    --color-primary-dark: #000000;
    --color-primary-hover: #262626;

    /* Verve-inspired colors */
    --verve-navy: #002344;
    --verve-cream: #F5F5EE;
    --verve-black: #1A1A1A;
    --verve-grey: #E5E5E5;
    --verve-text-primary: #1A1A1A;

    /* Secondary Colors - Cool Slate */
    --color-secondary: #64748B;
    --color-secondary-light: #94A3B8;
    --color-secondary-dark: #475569;

    /* Accent Colors - Luxe Gold */
    --color-accent: #F59E0B;
    --color-accent-light: #FBBF24;
    --color-accent-dark: #D97706;

    /* Semantic Colors */
    --color-success: #10b981;
    --color-success-light: #34d399;
    --color-success-dark: #059669;

    --color-warning: #f59e0b;
    --color-warning-light: #fbbf24;
    --color-warning-dark: #d97706;

    --color-error: #ef4444;
    --color-error-light: #f87171;
    --color-error-dark: #dc2626;

    --color-info: #3b82f6;
    --color-info-light: #60a5fa;
    --color-info-dark: #2563eb;

    /* Neutral Colors */
    --color-white: #ffffff;
    --color-black: #000000;

    --color-gray-50: #f8fafc;
    --color-gray-100: #f1f5f9;
    --color-gray-100: #f1f5f9;
    --color-gray-200: #e2e8f0;
    --color-gray-300: #cbd5e1;
    --color-gray-400: #94a3b8;
    --color-gray-500: #64748b;
    --color-gray-600: #475569;
    --color-gray-700: #334155;
    --color-gray-800: #1e293b;
    --color-gray-900: #0f172a;

    /* Background Colors */
    --bg-primary: var(--verve-cream);
    --bg-secondary: #ECECE6;
    --bg-tertiary: #E2E2D9;
    --bg-dark: var(--verve-black);

    /* Text Colors */
    --text-primary: var(--verve-black);
    --text-secondary: #4A4A4A;
    --text-tertiary: #6B6B6B;
    --text-muted: #8E8E8E;
    --text-inverse: var(--verve-cream);

    /* Border Colors */
    --border-light: #EFEFE9;
    --border-default: #D1D1CB;
    --border-medium: #B8B8B0;
    --border-dark: #9E9E96;

    /* Spacing Scale */
    --space-1: 4px;
    --space-1-5: 6px;
    --space-2: 8px;
    --space-2-5: 10px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;
    --space-24: 96px;

    /* Font Families */
    --font-primary: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-heading: 'Outfit', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Fira Code', 'Courier New', monospace;

    /* Font Sizes */
    --text-xs: 12px;
    --text-sm: 14px;
    --text-base: 16px;
    --text-lg: 18px;
    --text-xl: 20px;
    --text-2xl: 24px;
    --text-3xl: 30px;
    --text-4xl: 36px;
    --text-5xl: 48px;
    --text-6xl: 60px;

    /* Font Weights */
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;

    /* Line Heights */
    --leading-none: 1;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --leading-loose: 2;

    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;
    --radius-2xl: 16px;
    --radius-full: 9999px;

    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

    /* Transitions */
    --transition-fast: 150ms ease-in-out;
    --transition-base: 200ms ease-in-out;
    --transition-slow: 300ms ease-in-out;

    /* Z-Index Scale */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;

    /* Container Widths */
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1280px;
    --container-2xl: 1536px;
}

/* Mobile-specific refinements (Myntra-style) */
@media (max-width: 767px) {
    :root {
        /* Standard mobile horizontal padding */
        --space-mobile-padding: 12px;

        /* Slightly tighter spacing for high-density feel */
        --space-1: 4px;
        --space-1-5: 6px;
        --space-2: 8px;
        --space-2-5: 10px;
        --space-3: 12px;
        --space-4: 14px;
        /* Reduced from 16px */
        --space-6: 20px;
        /* Reduced from 24px */

        /* More readable font sizes for mobile */
        --text-xs: 11px;
        --text-sm: 12px;
        --text-base: 14px;
        --text-lg: 16px;
        --text-xl: 18px;
        --text-2xl: 20px;
        --text-3xl: 24px;
    }
}

/* ===================================
    GLOBAL STYLES
    =================================== */
/* Import Google Fonts */
/* CSS Reset & Base Styles */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
    /* Account for fixed header */
}
body {
    font-family: var(--font-primary);
    font-size: var(--text-base);
    font-weight: var(--font-normal);
    line-height: var(--leading-normal);
    color: var(--text-primary);
    background-color: var(--bg-primary);
    min-height: 100vh;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
/* Selection Styles */
::selection {
    background-color: rgba(0, 35, 68, 0.3);
    color: var(--verve-black);
}
/* Focus Styles */
*:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-bold);
    line-height: var(--leading-tight);
    color: var(--text-primary);
    margin-bottom: var(--space-4);
}
h1 {
    font-size: var(--text-5xl);
}
h2 {
    font-size: var(--text-4xl);
}
h3 {
    font-size: var(--text-3xl);
}
h4 {
    font-size: var(--text-2xl);
}
h5 {
    font-size: var(--text-xl);
}
h6 {
    font-size: var(--text-lg);
}
p {
    margin-bottom: var(--space-4);
    color: var(--text-secondary);
}
a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}
a:hover {
    color: var(--color-primary-hover);
}
/* Lists */
ul,
ol {
    list-style: none;
}
/* Images */
img {
    max-width: 100%;
    height: auto;
    display: block;
}
/* Buttons */
button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}
button:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}
/* Forms */
input,
textarea,
select {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}
/* Utility Classes */
.container {
    width: 100%;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: 0 var(--space-4);
}
.container-sm {
    max-width: var(--container-sm);
}
.container-md {
    max-width: var(--container-md);
}
.container-lg {
    max-width: var(--container-lg);
}
.container-2xl {
    max-width: var(--container-2xl);
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}
/* Loading States */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}
@keyframes pulse {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.animate-spin {
    animation: spin 1s linear infinite;
}
.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.animate-fadeIn {
    animation: fadeIn 0.3s ease-in-out;
}
.animate-slideUp {
    animation: slideUp 0.3s ease-out;
}
/* Responsive Utilities */
@media (max-width: 640px) {
    html {
        font-size: 14px;
    }

    .container {
        padding: 0 var(--space-3);
    }
}
@media (min-width: 1024px) {
    .container {
        padding: 0 var(--space-6);
    }
}/* ===================================
    REUSABLE COMPONENT PATTERNS
    =================================== */

/* Card Component */
.card {
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-base);
    overflow: hidden;
}

.card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.card-interactive {
    cursor: pointer;
    transition: all var(--transition-fast);
}

.card-interactive:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
}

.card-header {
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--border-light);
}

.card-body {
    margin-bottom: var(--space-4);
}

.card-footer {
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

.card-header {
    margin-bottom: var(--space-4);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--border-light);
}

.card-body {
    margin-bottom: var(--space-4);
}

.card-footer {
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--border-light);
}

/* Grid System */
.grid {
    display: grid;
    gap: var(--space-6);
}

.grid-cols-1 {
    grid-template-columns: repeat(1, 1fr);
}

.grid-cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid-cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid-cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 768px) {

    .grid-cols-2,
    .grid-cols-3,
    .grid-cols-4 {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {

    .grid-cols-3,
    .grid-cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Flex Utilities */
.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.flex-wrap {
    flex-wrap: wrap;
}

.items-center {
    align-items: center;
}

.items-start {
    align-items: flex-start;
}

.items-end {
    align-items: flex-end;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-start {
    justify-content: flex-start;
}

.justify-end {
    justify-content: flex-end;
}

.gap-2 {
    gap: var(--space-2);
}

.gap-3 {
    gap: var(--space-3);
}

.gap-4 {
    gap: var(--space-4);
}

.gap-6 {
    gap: var(--space-6);
}

.gap-8 {
    gap: var(--space-8);
}

/* Spacing Utilities */
.m-0 {
    margin: 0;
}

.m-auto {
    margin: auto;
}

.mt-4 {
    margin-top: var(--space-4);
}

.mb-4 {
    margin-bottom: var(--space-4);
}

.my-4 {
    margin-top: var(--space-4);
    margin-bottom: var(--space-4);
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.p-4 {
    padding: var(--space-4);
}

.p-6 {
    padding: var(--space-6);
}

.py-4 {
    padding-top: var(--space-4);
    padding-bottom: var(--space-4);
}

.px-4 {
    padding-left: var(--space-4);
    padding-right: var(--space-4);
}

/* Text Utilities */
.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-primary {
    color: var(--text-primary);
}

.text-secondary {
    color: var(--text-secondary);
}

.text-muted {
    color: var(--text-muted);
}

.font-bold {
    font-weight: var(--font-bold);
}

.font-semibold {
    font-weight: var(--font-semibold);
}

.font-medium {
    font-weight: var(--font-medium);
}

/* Badge Component */
.badge {
    display: inline-flex;
    align-items: center;
    padding: var(--space-1) var(--space-3);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    border-radius: var(--radius-full);
    line-height: 1;
}

.badge-primary {
    background: var(--color-primary);
    color: var(--color-white);
}

.badge-success {
    background: var(--color-success);
    color: var(--color-white);
}

.badge-warning {
    background: var(--color-warning);
    color: var(--color-white);
}

.badge-error {
    background: var(--color-error);
    color: var(--color-white);
}

/* Input Component */
.input {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    font-size: var(--text-base);
    line-height: var(--leading-normal);
    color: var(--text-primary);
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.input:hover {
    border-color: var(--border-medium);
}

.input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.input:disabled {
    background: var(--bg-secondary);
    cursor: not-allowed;
    opacity: 0.6;
}

.input-error {
    border-color: var(--color-error);
}

.input-error:focus {
    border-color: var(--color-error);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

/* Label Component */
.label {
    display: block;
    margin-bottom: var(--space-2);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--text-primary);
}

/* Form Group */
.form-group {
    margin-bottom: var(--space-6);
}

.form-error {
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-error);
}

.form-help {
    margin-top: var(--space-2);
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Divider */
.divider {
    height: 1px;
    background: var(--border-default);
    margin: var(--space-6) 0;
}

/* Skeleton Loader */
.skeleton {
    background: linear-gradient(90deg,
            var(--color-gray-200) 25%,
            var(--color-gray-100) 50%,
            var(--color-gray-200) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s ease-in-out infinite;
    border-radius: var(--radius-md);
}

@keyframes skeleton-loading {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

/* Modal Backdrop */
.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: var(--z-modal-backdrop);
    animation: fadeIn 0.2s ease-out;
    backdrop-filter: blur(4px);
}

/* Modal */
.modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: var(--bg-primary);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-2xl);
    z-index: var(--z-modal);
    max-width: 90vw;
    max-height: 90vh;
    overflow: auto;
    animation: modalSlideIn 0.3s ease-out;
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -60%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

/* Overlay */
.overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(2px);
}

/* Product Card */
.product-card {
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-sm);
}

.product-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-4px);
    border-color: var(--border-medium);
}

.product-image {
    position: relative;
    overflow: hidden;
    aspect-ratio: 3/4;
}

.product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition-base);
}

.product-card:hover .product-image img {
    transform: scale(1.05);
}

.product-info {
    padding: var(--space-4);
}

.product-title {
    font-size: var(--text-lg);
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-2);
    color: var(--text-primary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-price {
    font-size: var(--text-xl);
    font-weight: var(--font-bold);
    color: var(--color-primary);
    margin-bottom: var(--space-2);
}

.product-price-original {
    text-decoration: line-through;
    color: var(--text-muted);
    font-size: var(--text-sm);
    margin-left: var(--space-2);
}

.product-discount {
    background: var(--color-success);
    color: var(--color-white);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
}

/* Button Enhancements */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-6);
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    border-radius: var(--radius-md);
    border: 1px solid transparent;
    cursor: pointer;
    transition: all var(--transition-fast);
    text-decoration: none;
    white-space: nowrap;
}

.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}

.btn-primary:hover:not(:disabled) {
    background: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background: var(--color-secondary);
    color: var(--color-white);
    border-color: var(--color-secondary);
}

.btn-secondary:hover:not(:disabled) {
    background: var(--color-secondary-dark);
    border-color: var(--color-secondary-dark);
}

.btn-outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-outline:hover:not(:disabled) {
    background: var(--color-primary);
    color: var(--color-white);
}

.btn-ghost {
    background: transparent;
    color: var(--text-primary);
    border-color: transparent;
}

.btn-ghost:hover:not(:disabled) {
    background: var(--bg-secondary);
}

.btn-lg {
    padding: var(--space-4) var(--space-8);
    font-size: var(--text-base);
}

.btn-sm {
    padding: var(--space-2) var(--space-4);
    font-size: var(--text-xs);
}

.btn-full {
    width: 100%;
}

/* Form Enhancements */
.form-section {
    background: var(--bg-primary);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: var(--space-6);
    margin-bottom: var(--space-6);
}

.form-section-header {
    margin-bottom: var(--space-6);
    padding-bottom: var(--space-4);
    border-bottom: 1px solid var(--border-light);
}

.form-section-title {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin-bottom: var(--space-2);
}

.form-section-description {
    color: var(--text-secondary);
    font-size: var(--text-sm);
}

.form-row {
    display: grid;
    gap: var(--space-4);
    margin-bottom: var(--space-6);
}

.form-row-2 {
    grid-template-columns: repeat(2, 1fr);
}

.form-row-3 {
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 768px) {
    .form-row-2,
    .form-row-3 {
        grid-template-columns: 1fr;
    }
}

/* Page Layouts */
.page-container {
    min-height: 100vh;
    background: var(--bg-primary);
}

.page-header {
    background: var(--bg-primary);
    border-bottom: 1px solid var(--border-default);
    padding: var(--space-6) 0;
}

.page-title {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--text-primary);
    margin-bottom: var(--space-2);
}

.page-description {
    font-size: var(--text-lg);
    color: var(--text-secondary);
    max-width: 42rem;
}

.page-content {
    padding: var(--space-8) 0;
}

.page-section {
    margin-bottom: var(--space-12);
}

.page-section-title {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    color: var(--text-primary);
    margin-bottom: var(--space-6);
    text-align: center;
}

.page-section-description {
    font-size: var(--text-base);
    color: var(--text-secondary);
    text-align: center;
    margin-bottom: var(--space-8);
    max-width: 42rem;
    margin-left: auto;
    margin-right: auto;
}

/* Loading States */
.loading-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid var(--border-default);
    border-radius: 50%;
    border-top-color: var(--color-primary);
    animation: spin 1s ease-in-out infinite;
}

.loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal);
}

/* Status Messages */
.status-message {
    padding: var(--space-4);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-4);
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.status-success {
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.2);
    color: var(--color-success);
}

.status-error {
    background: rgba(239, 68, 68, 0.1);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: var(--color-error);
}

.status-warning {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.2);
    color: var(--color-warning);
}

.status-info {
    background: rgba(59, 130, 246, 0.1);
    border: 1px solid rgba(59, 130, 246, 0.2);
    color: var(--color-info);
}