/* Customer H5 theme layer. All selectors are scoped to avoid changing the admin UI. */
html.client-theme-violet {
    --client-violet: #6942c7;
    --client-violet-deep: #4b2a9d;
    --client-violet-soft: #f1edff;
    --client-violet-line: #e8defd;
    --client-violet-bg: #f8f6ff;
}

html.client-theme-violet body {
    background-color: var(--client-violet-bg);
}

html.client-theme-violet .tech-navbar {
    border-top-color: var(--client-violet-line);
}

html.client-theme-violet .tech-navbar-container {
    border-color: var(--client-violet-line);
    box-shadow: 0 8px 30px rgba(75, 42, 157, .12);
}

html.client-theme-violet .tech-nav-icon {
    background: var(--client-violet-soft);
    color: var(--client-violet);
}

html.client-theme-violet .tech-nav-item.active,
html.client-theme-violet .tech-nav-item:hover {
    color: var(--client-violet);
}

html.client-theme-violet .tech-nav-item.active .tech-nav-icon {
    background: var(--client-violet);
}

html.client-theme-violet .page-header,
html.client-theme-violet .shop-header {
    background: linear-gradient(135deg, var(--client-violet-deep), #8d6be4);
    color: #fff;
}

html.client-theme-violet .head a,
html.client-theme-violet .back-button,
html.client-theme-violet .category-item.active,
html.client-theme-violet .section-title,
html.client-theme-violet .product-price,
html.client-theme-violet .price,
html.client-theme-violet .order-agreement a {
    color: var(--client-violet);
}

html.client-theme-violet .category-tabs,
html.client-theme-violet .product-card,
html.client-theme-violet .card,
html.client-theme-violet .theme-picker {
    border-color: var(--client-violet-line);
}

html.client-theme-violet .category-item.active .category-icon,
html.client-theme-violet .section-title {
    border-color: var(--client-violet);
}

html.client-theme-violet .order-btn,
html.client-theme-violet .btn-primary,
html.client-theme-violet .primary-btn,
html.client-theme-violet .submit-btn {
    background-color: var(--client-violet);
    border-color: var(--client-violet);
}

html.client-theme-violet .order-btn:hover,
html.client-theme-violet .btn-primary:hover,
html.client-theme-violet .primary-btn:hover,
html.client-theme-violet .submit-btn:hover {
    background-color: var(--client-violet-deep);
    border-color: var(--client-violet-deep);
}