/*
 * Re-skins Dokan's vendor dashboard from its stock purple to the Secure Auto
 * Market blue.
 *
 * Dokan drives almost all of its chrome from `--dokan-*` custom properties with
 * hard-coded purple fallbacks, e.g.
 *   background-color: var(--dokan-sidebar-background-color, #322067)
 * so defining those properties once re-colours the sidebar, buttons, links,
 * badges and popovers in both dokan-lite and dokan-pro without touching a line
 * of their CSS. That is why this file survives Dokan updates.
 *
 * The exceptions are handled further down: a handful of Tailwind
 * arbitrary-value utilities (`.bg-[#7047EB]`) and the legacy `.dokan-btn-theme`
 * button, which bake the hex in directly.
 *
 * Palette — one hue (220), one saturation (55%), four steps, taken from the
 * Woodmart theme's own primary colour rgb(53,95,183):
 *   #355FB7  L46%  primary            (was #7047eb)
 *   #2A4C92  L37%  primary hover      (was #502bbf)
 *   #24417D  L32%  pressed / borders  (was #370eb1)
 *   #1F3965  L26%  sidebar ground     (was #322067)
 *   #CCDFFF  L90%  tint / sidebar text (was #daceff)
 */

:root {
	--sam-blue: #355fb7;
	--sam-blue-hover: #2a4c92;
	--sam-blue-pressed: #24417d;
	--sam-blue-dark: #1f3965;
	--sam-blue-muted: #88a4dd;
	--sam-blue-tint: #ccdfff;
	--sam-blue-tint-a: #ccdfff82;

	/* Primary buttons. */
	--dokan-button-background-color: var(--sam-blue);
	--dokan-button-border-color: var(--sam-blue);
	--dokan-button-hover-background-color: var(--sam-blue-hover);
	--dokan-button-hover-border-color: var(--sam-blue-pressed);
	--dokan-button-hover-color: var(--sam-blue-hover);

	/* Secondary (outlined) buttons. */
	--dokan-button-secondary-text-color: var(--sam-blue);
	--dokan-button-secondary-border-color: var(--sam-blue);
	--dokan-button-secondary-hover-background-color: var(--sam-blue-tint-a);
	--dokan-button-secondary-hover-border-color: var(--sam-blue);
	--dokan-button-secondary-hover-text-color: var(--sam-blue-hover);

	/* Tertiary (ghost) buttons. */
	--dokan-button-tertiary-text-color: var(--sam-blue);
	--dokan-button-tertiary-hover-text-color: var(--sam-blue-hover);
	--dokan-button-tertiary-hover-background-color: var(--sam-blue-tint-a);
	--dokan-button-tertiary-hover-border-color: var(--sam-blue-tint-a);

	/* Links. */
	--dokan-link-color: var(--sam-blue);
	--dokan-link-hover-color: var(--sam-blue-hover);

	/* Dashboard sidebar. */
	--dokan-sidebar-background-color: var(--sam-blue-dark);
	--dokan-sidebar-hover-background-color: var(--sam-blue);
	--dokan-sidebar-text-color: var(--sam-blue-tint);
	--dokan-sidebar-hover-text-color: #ffffff;

	/* Toggles. */
	--dokan-toggle-active-color: var(--sam-blue);
}

/*
 * Tailwind arbitrary-value utilities. Dokan emits these with the hex baked into
 * both the class name and the declaration, so the custom properties above can't
 * reach them. The `html` prefix lifts specificity one notch above Dokan's own
 * `:is(.pui-root,.dokan-layout) .x` rules, which are already `!important`.
 */
html :is(.pui-root, .dokan-layout) .bg-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .hover\:bg-\[\#7047EB\]:hover,
html :is(.pui-root, .dokan-layout) .bg-\[\#6F4CEB\],
html :is(.pui-root, .dokan-layout) .hover\:bg-\[\#7C3AED\]:hover,
html :is(.pui-root, .dokan-layout) .\[\&\:\:-moz-progress-bar\]\:bg-\[\#7047EB\]::-moz-progress-bar,
html :is(.pui-root, .dokan-layout) .\[\&\:\:-webkit-progress-value\]\:bg-\[\#7047EB\]::-webkit-progress-value {
	background-color: var(--sam-blue) !important;
}

html :is(.pui-root, .dokan-layout) .group-hover\:bg-\[\#502BBF\]:is(:where(.group):hover *) {
	background-color: var(--sam-blue-hover) !important;
}

html :is(.pui-root, .dokan-layout) .bg-\[rgba\(124\,58\,237\,0\.1\)\] {
	background-color: var(--sam-blue-tint-a) !important;
}

html :is(.pui-root, .dokan-layout) .text-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .\!text-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .text-\[\#7C3AED\],
html :is(.pui-root, .dokan-layout) .hover\:text-\[\#7047EB\]:hover,
html :is(.pui-root, .dokan-layout) .hover\:\!text-\[\#7047EB\]:hover,
html :is(.pui-root, .dokan-layout) .group-hover\:text-\[\#7047EB\]:is(:where(.group):hover *),
html :is(.pui-root, .dokan-layout) .data-active\:text-\[\#7047EB\]\![data-active] {
	color: var(--sam-blue) !important;
}

html :is(.pui-root, .dokan-layout) .\!fill-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .group-hover\:fill-\[\#7047EB\]:is(:where(.group):hover *) {
	fill: var(--sam-blue) !important;
}

html :is(.pui-root, .dokan-layout) .border-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .\!border-\[\#7047EB\],
html :is(.pui-root, .dokan-layout) .border-\[\#7C3AED\],
html :is(.pui-root, .dokan-layout) .hover\:border-\[\#7047EB\]:hover,
html :is(.pui-root, .dokan-layout) .hover\:\!border-\[\#7047EB\]:hover,
html :is(.pui-root, .dokan-layout) .focus\:border-\[\#7047EB\]:focus {
	border-color: var(--sam-blue) !important;
}

html :is(.pui-root, .dokan-layout) .ring-\[\#7047EB\] {
	--tw-ring-color: var(--sam-blue) !important;
}

/*
 * Legacy `.dokan-btn-theme`. Still rendered by the older PHP templates that the
 * new dashboard hosts (store settings, our own Deliveries and Shipping Guide
 * tabs), and hard-coded purple in dokan-lite's style.css.
 */
input[type='submit'].dokan-btn-theme,
a.dokan-btn-theme,
.dokan-btn-theme {
	background-color: var(--sam-blue);
	border-color: var(--sam-blue);
}

input[type='submit'].dokan-btn-theme:hover,
a.dokan-btn-theme:hover,
.dokan-btn-theme:hover,
input[type='submit'].dokan-btn-theme:focus,
a.dokan-btn-theme:focus,
.dokan-btn-theme:focus,
input[type='submit'].dokan-btn-theme:active,
a.dokan-btn-theme:active,
.dokan-btn-theme:active,
input[type='submit'].dokan-btn-theme.active,
a.dokan-btn-theme.active,
.dokan-btn-theme.active {
	background-color: var(--sam-blue-hover);
	border-color: var(--sam-blue-pressed);
}

input[type='submit'].dokan-btn-theme[disabled],
a.dokan-btn-theme[disabled],
.dokan-btn-theme[disabled],
input[type='submit'].dokan-btn-theme.disabled,
a.dokan-btn-theme.disabled,
.dokan-btn-theme.disabled {
	background-color: var(--sam-blue-muted);
	border-color: var(--sam-blue-muted);
}

input[type='submit'].dokan-btn-theme .badge,
a.dokan-btn-theme .badge,
.dokan-btn-theme .badge {
	color: var(--sam-blue);
}

/*
 * Belt and braces for the earning hint (see class-sam-vendor-earning.php): the
 * legacy product templates print it server-side, where there is no value left
 * to zero out. Scoped tightly to the price fields on the product edit form —
 * `.vendor-earning` is also the class on the Reports earning figure, which the
 * vendor does want to see.
 */
.vendor-earning.simple-product,
.vendor-earning.subscription-product,
label > span.vendor-earning,
.content-half-part > span.vendor-earning {
	display: none !important;
}

/*
 * Legacy dashboard sidebar. dokan-lite's style.css hard-codes purple on the
 * active/hover menu item rather than reading `--dokan-sidebar-*`, and the
 * full-width React layout still renders that markup underneath its own sidebar
 * (`.dokan-dashboard-wrap > .dokan-dash-sidebar`), so it has to be covered.
 * Note the wrapper class: Dokan's own rules key off `.dokan-dashboard`, which
 * this layout does not set — matching on `.dokan-dashboard-wrap` keeps equal
 * specificity, and source order does the rest.
 */
.dokan-dashboard-wrap .dokan-dash-sidebar,
.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu {
	background-color: var(--sam-blue-dark);
}

.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu li:hover,
.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu li.active,
.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu li.dokan-common-links a:hover {
	background: var(--sam-blue);
}

.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu li.active ul.navigation-submenu {
	border-bottom-color: var(--sam-blue);
}

.dokan-dashboard-wrap .dokan-dash-sidebar ul.dokan-dashboard-menu li ul.sub-menu a:hover {
	background: var(--sam-blue-muted);
}
