/* WP Career Board — Reign Theme Compatibility
 *
 * Adjustments so WCB blocks sit correctly inside Reign's content canvas.
 * Bridges WCB design tokens to Reign's BuddyBoss-derived `--bb-*` palette.
 * The `--wcb-reign-primary` Customizer setting (wcb_reign_primary_color)
 * still wins for explicit brand overrides; everything else inherits Reign.
 *
 * Loaded on any page rendering a WCB block or CPT.
 */

/*
 * Token bridge — re-map WCB tokens to Reign's `--bb-*` variables. Reign
 * flips its palette under `body.dark-mode` / `html.dark-mode` automatically,
 * so the WCB UI re-colors for free in both modes. Hex literals in the
 * fallback slot mirror our default token values, used only when Reign
 * isn't loaded (e.g. WCB block in a non-Reign theme on the same site).
 */
:root,
body.dark-mode,
html.dark-mode {
	/* Brand — WCB primary follows Reign's Customizer "Primary Color".
	   `--wcb-reign-primary` is set inline by the integration when the
	   site owner picks a custom color; otherwise we inherit `--bb-primary-color`. */
	--wcb-primary: var( --wcb-reign-primary, var( --bb-primary-color, var( --bb-primary-button-background, #2563eb ) ) );

	/* Theme-aware primary tints — older browsers fall back to the static
	   rgba on the first declaration; modern browsers use color-mix below. */
	--wcb-primary-soft: rgba( 37, 99, 235, 0.08 );
	--wcb-primary-ring: rgba( 37, 99, 235, 0.16 );
	--wcb-primary-soft: color-mix( in srgb, var( --wcb-primary ) 8%, transparent );
	--wcb-primary-ring: color-mix( in srgb, var( --wcb-primary ) 16%, transparent );

	/* Text — `--bb-headings-color` for strong contrast titles, `--bb-body-text-color`
	   (sometimes `--bb-content-color`) for body copy, lighter alt-text for tertiary. */
	--wcb-contrast:       var( --bb-headings-color, #0f172a );
	--wcb-text-secondary: var( --bb-body-text-color, var( --bb-content-color, #475569 ) );
	--wcb-text-tertiary:  var( --bb-content-alternate-text-color, #9ca3af );

	/* Surfaces — Reign uses `--bb-content-background-color` for the main
	   canvas and `--bb-content-alternate-background-color` for subtle bands. */
	--wcb-base:      var( --bb-content-background-color, #ffffff );
	--wcb-surface:   var( --bb-content-alternate-background-color, #f8fafc );
	--wcb-bg-subtle: var( --bb-content-alternate-background-color, #f8fafc );
	--wcb-bg-hover:  color-mix( in srgb, var( --wcb-primary ) 6%, var( --wcb-base, #ffffff ) );

	/* Borders — `--bb-content-border-color` is used for cards/widgets;
	   falls back to the generic content border. */
	--wcb-border: var( --bb-content-border-color, var( --bb-body-border-color, #e2e8f0 ) );

	/* Status — Reign exposes semantic colors that map cleanly to ours. */
	--wcb-success: var( --bb-success-color, #16a34a );
	--wcb-warning: var( --bb-warning-color, #d97706 );
	--wcb-danger:  var( --bb-danger-color, #dc2626 );
	--wcb-info:    var( --bb-info-color, var( --bb-primary-color, #2563eb ) );

	/* Avatar background — uses Reign's heading color so initials read
	   correctly against the theme's preferred contrast tone. */
	--wcb-avatar-bg: var( --bb-headings-color, #1e293b );
}

/* Honour the Customizer primary colour on WCB interactive elements */
.wcb-btn-primary,
.wcb-apply-btn,
.wcb-save-btn {
	background-color: var( --wcb-primary );
	border-color: var( --wcb-primary );
}

.wcb-btn-primary:hover,
.wcb-apply-btn:hover,
.wcb-save-btn:hover {
	filter: brightness( 1.1 );
}

/* Strip double padding that Reign adds to .entry-content inside its content canvas */
.reign-content-area .wcb-job-single,
.reign-content-area .wcb-job-listings {
	padding: 0;
}

/* Align WCB search bar with Reign's content width */
.wcb-search-bar {
	max-width: 100%;
}

/* Restore left padding for the search icon — Reign resets input padding */
.wcb-listings-search {
	padding-inline-start: 2.25rem !important;
}

/* Filter chips and "Clear all" — survive Reign's link/button resets. */
.wcb-chip:hover {
	border-color: var( --wcb-primary );
	color: var( --wcb-primary );
}

.wcb-chip.wcb-chip-active {
	border-color: var( --wcb-primary );
	background: var( --wcb-primary );
	color: var( --bb-primary-button-text, #ffffff );
}

.wcb-clear-all:hover {
	color: var( --wcb-contrast );
}

/* Featured job card — prevent Reign's global :focus-within outline from bleeding in */
.wcb-job-card.wcb-featured:focus-within {
	outline: 2px solid transparent;
}

/* Keep a clean focus ring on focusable elements inside featured cards */
.wcb-job-card.wcb-featured *:focus-visible {
	outline: 2px solid var( --wcb-primary );
	outline-offset: 2px;
	transition: outline-color var( --wcb-transition-snappy, 0.15s ease );
}

/* Load more button - retired in 1.2.x. The unified .wcb-cbtn--ghost rule
   in assets/css/wcb-ui.css now scopes the Load more button alongside the
   in-card View Job / View Profile / View Company CTAs, so a Reign-specific
   override is no longer needed. */

/* Reign uses box-shadows for card depth — match WCB job cards */
.wcb-job-card {
	box-shadow: var( --wcb-shadow-sm, 0 1px 3px rgba( 0, 0, 0, 0.08 ) );
	border-radius: var( --wcb-radius-sm, 6px );
}

/* Status badges inside Reign tables */
.wcb-status-badge {
	font-size: 0.78em;
}