/* Varsl PIM Branding Overrides
 *
 * The --varsl-* and --tw-colors-* custom properties consumed by the rules
 * below are emitted dynamically by Webkul\Branding\Services\BrandingManager::paletteCss()
 * into an inline <style> block, so values saved in Admin → Theme Settings
 * propagate without a rebuild.
 */

/* Base Overrides */
body {
    background-color: var(--varsl-bg-light) !important;
}

html.dark body {
    background-color: var(--tw-colors-cherry-800) !important;
}

/* Links and Highlights */
a.text-violet-700,
.text-violet-700 {
    color: var(--varsl-blue) !important;
}

a.text-violet-700:hover {
    color: var(--varsl-accent) !important;
}

html.dark a.text-violet-700,
html.dark .text-violet-700 {
    color: var(--varsl-accent) !important;
}

/* Button Overrides */
.primary-button {
    background-color: var(--varsl-blue) !important;
    border-color: var(--varsl-blue) !important;
    color: var(--varsl-white) !important;
}

.primary-button:hover {
    background-color: var(--varsl-accent) !important;
    border-color: var(--varsl-accent) !important;
    color: var(--varsl-dark) !important;
}

.secondary-button {
    background-color: var(--varsl-white) !important;
    border-color: var(--varsl-blue) !important;
    color: var(--varsl-blue) !important;
}

.secondary-button:hover {
    background-color: var(--varsl-blue) !important;
    border-color: var(--varsl-blue) !important;
    color: var(--varsl-white) !important;
}

.transparent-button {
    color: var(--varsl-blue) !important;
}
.transparent-button:hover {
    color: var(--varsl-accent) !important;
    background-color: var(--tw-colors-violet-50) !important;
}

html.dark .transparent-button {
    color: var(--varsl-accent) !important;
}
html.dark .transparent-button:hover {
    background-color: var(--tw-colors-cherry-700) !important;
}

/* Borders active */
.border-violet-700 {
    border-color: var(--varsl-accent) !important;
}

/* Background active / selection */
.bg-violet-100 {
    background-color: var(--tw-colors-violet-100) !important;
}

.bg-violet-600 {
    background-color: var(--varsl-blue) !important;
}

/* SVG icons active state */
.active [class^="icon-"], 
.active [class*=" icon-"] {
    color: var(--varsl-accent) !important;
}

/* Sidebar Active Items */
.group\/item.active > a {
    background-color: var(--tw-colors-violet-100) !important;
}

html.dark .group\/item.active > a {
    background-color: var(--tw-colors-cherry-600) !important;
}

/* Badges / Labels */
.bg-violet-400 {
    background-color: var(--varsl-accent) !important;
    color: var(--varsl-dark) !important;
}

/* Multiselect overrides */
.multiselect__option--highlight,
.multiselect__tag,
.multiselect__spinner:after {
    background-color: var(--tw-colors-violet-100) !important;
    color: var(--varsl-blue) !important;
}

html.dark .multiselect__option--highlight,
html.dark .multiselect__tag {
    background-color: var(--tw-colors-cherry-600) !important;
    color: var(--varsl-accent) !important;
}

/* Header Overrides */
header.sticky.top-0 {
    background-color: var(--varsl-accent) !important;
}

header.sticky.top-0 [class^="icon-"],
header.sticky.top-0 [class*=" icon-"] {
    color: var(--varsl-dark) !important;
}

header.sticky.top-0 [class^="icon-"]:hover,
header.sticky.top-0 [class*=" icon-"]:hover {
    background-color: var(--varsl-blue) !important;
    color: var(--varsl-white) !important;
}

header.sticky.top-0 .bg-violet-400 {
    background-color: var(--varsl-blue) !important;
    color: var(--varsl-white) !important;
}

header.sticky.top-0 button.bg-violet-400:hover,
header.sticky.top-0 button.bg-violet-400:focus {
    background-color: var(--varsl-dark) !important;
    color: var(--varsl-white) !important;
}

/* Hide Agenting PIM floating chat widget */
.ap-shell {
    display: none !important;
}