/**
 * Purple Theme - Based on JK VYNTRA color palette from reference images
 * Deep purple primary, light grey backgrounds, gold accents
 */

:root {
    /* Primary - Deep Purple */
    --main-color: #6a1b9a !important;
    --main-gradient-start: #7b2cbf !important;
    --main-gradient-end: #9c4dcc !important;
    --main_gradient-color: linear-gradient(180deg, #7b2cbf 0%, #9c4dcc 100%) !important;
    --main_gradient-color2: linear-gradient(90deg, #7b2cbf 0%, #9c4dcc 100%) !important;
    
    /* Backgrounds - Light grey / off-white */
    --bg_HomeModule_Stroke: #7b2cbf !important;
    --bg_HomeModule_Padding: linear-gradient(180deg, #f5f5f5 0%, #e8e8e8 100%) !important;
    --bg_color_L1: #f0f0f0 !important;
    --bg_color_L2: #ffffff!important;
    --bg_color_L3: #f8f8f8 !important;
    
    /* Text colors */
    --text_color_L1: #333333 !important;
    --text_color_L2: #555555 !important;
    --text_color_L3: #888888 !important;
    --text_color_L4: #ffffff !important;
    
    /* Accents */
    --norm_red-color: #D23838 !important;
    --norm_green-color: #17B15E !important;
    --norm_secondary-color: #dd9138!important;
    --norm_Purple-color: #7b2cbf !important;
    --button_dis_color: #b39ddb !important;
    --Dividing-line_color: #e0e0e0 !important;
    --sheet_nva_color: #7b2cbf !important;
    --sheet_detail_bg_color: #f5f5f5 !important;
    
    /* Van component overrides */
    --van-popup-background: #ffffff !important;
    --van-dialog-background: #ffffff !important;
    --van-cell-background: #ffffff !important;
    --van-calendar-background: #f8f8f8 !important;
    --van-grid-item-content-background: #f0f0f0 !important;
    --van-collapse-item-content-background: #f8f8f8 !important;
    --van-action-sheet-item-background: #ffffff !important;
    --van-action-sheet-item-text-color: #333333 !important;
    --van-slider-inactive-background: #e0e0e0 !important;
    --van-popover-light-background: #ffffff !important;
    --van-circle-layer-color: #f0f0f0 !important;
}

/* Body and app background */
html, body {
    background-color: #e8e8e8 !important;
}

#app {
    background: var(--bg_color_L1) !important;
}

/* Navbar / Header - Deep purple */
.navbar .navbar-fixed,
.navbar-fixed,
.navbar.activity .navbar-fixed,
.van-nav-bar,
.van-nav-bar__content,
.van-nav-bar__title,
.nav-bar,
header,
.header {
    background: var(--main_gradient-color) !important;
    background-color: #FFE6FF !important;
    background-image: none !important;
    color: #ffffff !important;
}

.navbar-fixed .navbar__content-center,
.navbar-fixed .navbar__content-left .van-icon {
    color: #ffffff !important;
}

/* Notice bar - Purple style */
#app .noticeBar__container {
    border: 1px solid #7b2cbf !important;
    background: linear-gradient(180deg, #f3e5f5 0%, #e1bee7 100%) !important;
    border-radius: 0.26667rem !important;
}

/* Tab bar - Light grey with purple active */
.tabbar__container {
    background: #ffffff !important;
    box-shadow: 0 -1px 4px rgba(0,0,0,0.1) !important;
}

.tabbar__container-item {
    color: #888888 !important;
}

.tabbar__container-item.active,
.tabbar__container-item.home {
    color: #6a1b9a !important;
}

.tabbar-item--active,
.router-link-active,
.nav-item.active,
.van-tabbar-item--active {
    color: #6a1b9a !important;
}

.tabbar-item--active svg,
.router-link-active svg,
.nav-item.active svg,
.van-tabbar-item--active svg,
svg use[href*="icon-91-homeDown"] {
    fill: #6a1b9a !important;
    color: #6a1b9a !important;
}

/* PWA / Add to Desktop button */
#app .btn.pwa-btn {
    background: var(--main_gradient-color) !important;
    border: 1px solid #6a1b9a !important;
}

#app .btn.pwa-btn .text,
#app .btn.pwa-btn .close {
    color: #ffffff !important;
}

#app .languageName {
    color: #6a1b9a !important;
}