/*
 * Dark Plum swaps BuddyBoss' own color variables so the parent theme remains
 * the source of layout, spacing, component states, and interaction behavior.
 */

html[data-ea-dark-plum="on"] {
	color-scheme: dark;

	--bb-primary-color: #FF6FBE;
	--bb-primary-color-rgb: 255, 111, 190;
	--bb-body-background-color: #121216;
	--bb-body-background-color-rgb: 18, 18, 22;
	--bb-content-background-color: #1E1D24;
	--bb-content-alternate-background-color: #2A2831;
	--bb-content-border-color: #5F5768;
	--bb-content-border-color-rgb: 95, 87, 104;
	--bb-cover-image-background-color: #34303B;
	--bb-headings-color: #F8F3FA;
	--bb-headings-color-rgb: 248, 243, 250;
	--bb-body-text-color: #E4DDE8;
	--bb-body-text-color-rgb: 228, 221, 232;
	--bb-alternate-text-color: #B9AFBF;
	--bb-alternate-text-color-rgb: 185, 175, 191;

	--bb-primary-button-background-regular: #2F55E8;
	--bb-primary-button-background-hover: #2447CB;
	--bb-primary-button-border-regular: #2F55E8;
	--bb-primary-button-border-hover: #2447CB;
	--bb-primary-button-text-regular: #FFFFFF;
	--bb-primary-button-text-regular-rgb: 255, 255, 255;
	--bb-primary-button-text-hover: #FFFFFF;
	--bb-primary-button-text-hover-rgb: 255, 255, 255;
	--bb-secondary-button-background-regular: #2A2831;
	--bb-secondary-button-background-hover: #2F55E8;
	--bb-secondary-button-border-regular: #5F5768;
	--bb-secondary-button-border-hover: #2F55E8;
	--bb-secondary-button-text-regular: #F3EDF5;
	--bb-secondary-button-text-hover: #FFFFFF;

	--bb-header-background: #16141A;
	--bb-header-alternate-background: #24212B;
	--bb-header-links: #F3EDF5;
	--bb-header-links-hover: #FF8DCE;

	--bb-sidenav-background: #18161C;
	--bb-sidenav-text-regular: #E4DDE8;
	--bb-sidenav-text-hover: #FFFFFF;
	--bb-sidenav-text-active: #FFFFFF;
	--bb-sidenav-menu-background-color-regular: #18161C;
	--bb-sidenav-menu-background-color-hover: #24212B;
	--bb-sidenav-menu-background-color-active: #2F55E8;
	--bb-sidenav-count-text-color-regular: #F3EDF5;
	--bb-sidenav-count-text-color-hover: #FFFFFF;
	--bb-sidenav-count-text-color-active: #FFFFFF;
	--bb-sidenav-count-background-color-regular: #2A2831;
	--bb-sidenav-count-background-color-hover: #2F55E8;
	--bb-sidenav-count-background-color-active: #FF6FBE;

	--bb-footer-background: #121216;
	--bb-footer-widget-background: #1E1D24;
	--bb-footer-text-color: #D8D0DC;
	--bb-footer-menu-link-color-regular: #D8D0DC;
	--bb-footer-menu-link-color-hover: #FF8DCE;
	--bb-footer-menu-link-color-active: #F8F3FA;

	--bb-admin-screen-bgr-color: #16141A;
	--bb-admin-screen-txt-color: #F8F3FA;
	--bb-login-register-link-color-regular: #D8D0DC;
	--bb-login-register-link-color-hover: #FF8DCE;
	--bb-login-register-button-background-color-regular: #2F55E8;
	--bb-login-register-button-background-color-hover: #2447CB;
	--bb-login-register-button-border-color-regular: #2F55E8;
	--bb-login-register-button-border-color-hover: #2447CB;
	--bb-login-register-button-text-color-regular: #FFFFFF;
	--bb-login-register-button-text-color-hover: #FFFFFF;

	--bb-label-background-color: #47243B;
	--bb-label-text-color: #FFD9EF;
	--bb-tooltip-background: #24212B;
	--bb-tooltip-background-rgb: 36, 33, 43;
	--bb-tooltip-color: #FFFFFF;
	--bb-default-notice-color: #2F55E8;
	--bb-default-notice-color-rgb: 47, 85, 232;
	--bb-success-color: #167A43;
	--bb-success-color-rgb: 22, 122, 67;
	--bb-warning-color: #F0B13E;
	--bb-warning-color-rgb: 240, 177, 62;
	--bb-danger-color: #B4234D;
	--bb-danger-color-rgb: 180, 35, 77;

	--bb-primary-button-focus-shadow: 0 0 0 2px rgba(var(--bb-primary-color-rgb), 0.22);
	--bb-secondary-button-focus-shadow: 0 0 0 2px rgba(var(--bb-content-border-color-rgb), 0.28);
	--bb-outline-button-focus-shadow: 0 0 0 2px rgba(var(--bb-content-border-color-rgb), 0.28);
	--bb-input-focus-shadow: 0 0 0 2px rgba(var(--bb-primary-color-rgb), 0.18);
}

html[data-ea-dark-plum="on"] body {
	background-color: var(--bb-body-background-color);
	color: var(--bb-body-text-color);
}

/* Header dropdowns include a few fixed surface treatments in BuddyBoss. */
html[data-ea-dark-plum="on"] .site-header,
html[data-ea-dark-plum="on"] .sticky-header .site-header,
html[data-ea-dark-plum="on"] .site-header .site-header-container {
	background-color: var(--bb-header-background);
	border-color: rgba(var(--bb-content-border-color-rgb), 0.65);
}

html[data-ea-dark-plum="on"] .site-header .sub-menu,
html[data-ea-dark-plum="on"] .site-header .wrapper,
html[data-ea-dark-plum="on"] .site-header .ab-sub-wrapper,
html[data-ea-dark-plum="on"] .site-header .ab-submenu,
html[data-ea-dark-plum="on"] .site-header .user-wrap-container > .sub-menu {
	background-color: var(--bb-header-alternate-background);
	border-color: var(--bb-content-border-color);
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.42);
}

html[data-ea-dark-plum="on"] .site-header .sub-menu a,
html[data-ea-dark-plum="on"] .site-header .sub-menu a .user-mention {
	color: var(--bb-header-links);
}

html[data-ea-dark-plum="on"] .site-header .sub-menu a:hover,
html[data-ea-dark-plum="on"] .site-header .sub-menu a:hover .user-mention {
	background-color: var(--bb-content-alternate-background-color);
	color: var(--bb-header-links-hover);
}

/* Fixed white controls need direct treatment after the variable layer swaps. */
html[data-ea-dark-plum="on"] input:not([type="button"]):not([type="submit"]):not([type="reset"]),
html[data-ea-dark-plum="on"] select,
html[data-ea-dark-plum="on"] textarea,
html[data-ea-dark-plum="on"] .select2-container .select2-selection {
	background-color: var(--bb-content-background-color);
	border-color: var(--bb-content-border-color);
	color: var(--bb-body-text-color);
}

html[data-ea-dark-plum="on"] input::placeholder,
html[data-ea-dark-plum="on"] textarea::placeholder {
	color: var(--bb-alternate-text-color);
}

html[data-ea-dark-plum="on"] :where(.bb-modal-overlay, .mfp-bg, .modal-backdrop) {
	background-color: rgba(18, 18, 22, 0.86);
}

html[data-ea-dark-plum="on"] :where(.bb-modal, .bb-modal-box, .mfp-content, .bb-dropdown, .popover, .tooltipster-box) {
	background-color: var(--bb-content-background-color);
	border-color: var(--bb-content-border-color);
	box-shadow: 0 22px 60px rgba(0, 0, 0, 0.48);
	color: var(--bb-body-text-color);
}

html[data-ea-dark-plum="on"] :where(.bs-item-wrap, .bb-card, .activity-list .activity-item, .bp-list > li, .widget, .entry-content-wrap) {
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.26);
}

.ea-dark-plum-toggle-source[hidden] {
	display: none !important;
}

.ea-dark-plum-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 30px;
	margin: 0 10px 0 0;
	padding: 6px 10px;
	border: 1px solid var(--bb-content-border-color);
	border-radius: 999px;
	background: var(--bb-content-alternate-background-color);
	color: var(--bb-header-links);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.ea-dark-plum-toggle:hover,
.ea-dark-plum-toggle--active {
	border-color: var(--bb-primary-color);
	background: rgba(var(--bb-primary-color-rgb), 0.16);
	color: var(--bb-header-links-hover);
}

.ea-dark-plum-toggle:focus-visible {
	outline: 0;
	box-shadow: var(--bb-input-focus-shadow);
}

.ea-dark-plum-toggle__icon {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 0 3px rgba(var(--bb-primary-color-rgb), 0.18);
}

@media (max-width: 799px) {
	.ea-dark-plum-toggle {
		margin-right: 6px;
		padding-inline: 8px;
	}

	.ea-dark-plum-toggle__text {
		display: none;
	}
}