/**
 * Employer Dashboard — Base styles.
 *
 * Tokens, gate (logged-out), shell (sidebar+main wrapper), and base
 * layout primitives shared across every view. Per-section rules live in:
 *
 *   styles/sidebar.css   Sidebar wrapper, nav, CTA, user/company row.
 *   styles/main.css      Main content area, view-panel frame, panel base.
 *   styles/views.css     Per-view rules (jobs, applications, profile form).
 *   styles/widgets.css   Stats cards, company preview, bell, credit banners.
 *
 * Split per the upscale stabilization plan
 * (plan/upscale-stabilization-plan-2026-05-07.md F4 / Task 5.1) — the
 * single 1774-LOC mega-file slowed editor diff review and mixed concerns.
 *
 * @package WP_Career_Board
 * @since   1.2.2
 */

/* -- Design tokens -- */
.wcb-dashboard {
	font-family: inherit;
	font-size: var(--wcb-text-base);
	color: var(--wcb-contrast);
}

/* -- Gate (logged-out) -- */
.wcb-db-gate {
	text-align: center;
	padding: var(--wcb-space-4xl) var(--wcb-space-lg);
}

.wcb-db-gate p {
	color: var(--wcb-text-secondary);
	margin-bottom: var(--wcb-space-lg);
}

/* -- Shell -- sidebar + main -- */
.wcb-dashboard-shell {
	display: flex;
	min-height: 600px;
	align-items: stretch;
}

/* -- Interactivity API show/hide utilities -- */
.wcb-shown  { display: block; }

/* -- Loading skeleton -- */
.wcb-db-loading {
	display: none;
	flex-direction: column;
	gap: var(--wcb-space-md);
}

.wcb-db-loading.wcb-shown {
	display: flex;
}

.wcb-skeleton-row {
	height: 72px;
	background: linear-gradient(90deg, var(--wcb-surface, var(--wp--preset--color--wcb-surface)) 25%, var(--wcb-border) 50%, var(--wcb-surface, var(--wp--preset--color--wcb-surface)) 75%);
	background-size: 200% 100%;
	border-radius: var(--wcb-radius-lg);
	animation: wcb-shimmer 1.4s infinite;
}

@keyframes wcb-shimmer {
	0%   { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* -- Empty and error states -- */
.wcb-db-empty {
	display: none;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wcb-space-lg);
	padding: 2.5rem;
	background: var(--wcb-bg-subtle);
	border: 1px dashed var(--wcb-text-tertiary);
	border-radius: var(--wcb-radius-lg);
}

.wcb-db-empty.wcb-shown {
	display: flex;
}

.wcb-db-empty-msg {
	color: var(--wcb-text-secondary);
	margin: 0;
	font-size: var(--wcb-text-md);
}

/* -- Onboarding banner (overview) -- */
.wcb-db-onboard {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: var(--wcb-space-lg);
	flex-wrap: wrap;
	padding: var(--wcb-space-lg) 1.5rem;
	margin-bottom: var(--wcb-space-lg);
	background: var(--wcb-primary-bg, #eff6ff);
	border: 1px solid var(--wcb-primary-border, #bfdbfe);
	border-radius: var(--wcb-radius-lg);
}

.wcb-db-onboard.wcb-shown {
	display: flex;
}

.wcb-db-onboard__title {
	margin: 0;
	font-weight: 600;
	color: var(--wcb-text-primary);
}

.wcb-db-onboard__msg {
	margin: 0.25rem 0 0;
	color: var(--wcb-text-secondary);
	font-size: var(--wcb-text-md);
}

@media (max-width: 640px) {
	.wcb-db-onboard {
		flex-direction: column;
		align-items: flex-start;
	}
}

.wcb-db-error {
	display: none;
	color: var(--wcb-danger);
	background: var(--wcb-danger-bg);
	border: 1px solid var(--wcb-danger-border, #fecaca);
	padding: var(--wcb-space-md) var(--wcb-space-lg);
	border-radius: var(--wcb-radius-md);
	font-size: var(--wcb-text-base);
	margin-bottom: var(--wcb-space-lg);
}

.wcb-db-error.wcb-shown {
	display: block;
}

/* Mobile nav toggle -- hidden on desktop */
.wcb-nav-toggle {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.wcb-skeleton-row {
		animation: none;
	}
}