/* ═══════════════════════════════════════════════════════════════
   Dashboard Base — Tokens, Layout, Card System, Chips
   ═══════════════════════════════════════════════════════════════ */

/*
 * Dashboard-scoped design tokens.
 *
 * These alias the global spacing scale (_variables.css --wsscd-spacing-*)
 * into a short-hand namespace consumed by all dashboard partials.
 * The radius, surface, and shadow tokens are intentionally larger
 * than the global defaults to give the dashboard a more spacious feel.
 */
.wsscd-main-dashboard {
	--wsscd-space-1: var(--wsscd-spacing-xs);
	--wsscd-space-2: var(--wsscd-spacing-sm);
	--wsscd-space-3: var(--wsscd-spacing-md);
	--wsscd-space-4: var(--wsscd-spacing-base);
	--wsscd-space-lg: var(--wsscd-spacing-lg);
	--wsscd-space-5: var(--wsscd-spacing-xl);
	--wsscd-space-6: var(--wsscd-spacing-xxl);
	--wsscd-radius-sm: 8px;
	--wsscd-radius-md: 12px;
	--wsscd-radius-lg: 16px;
	--wsscd-surface: var(--wsscd-color-white, #ffffff);
	--wsscd-surface-muted: var(--wsscd-color-surface, #f8fafc);
	--wsscd-border: var(--wsscd-color-border, #d9e2ec);
	--wsscd-text: var(--wsscd-color-text, #1d2327);
	--wsscd-text-muted: var(--wsscd-color-text-muted, #646970);
	--wsscd-shadow-1: var(--wsscd-shadow-sm);
	--wsscd-shadow-2: 0 8px 24px rgba(9, 30, 66, 0.08);
	--wsscd-info: var(--wsscd-color-primary);
	--wsscd-warn: var(--wsscd-color-warning-dark, #b19313);
	--wsscd-critical: var(--wsscd-color-danger, #d63638);
	--wsscd-card-header-border-color: var(--wsscd-border);
	--wsscd-card-header-title-size: var(--wsscd-font-size-large);
	--wsscd-card-header-description-margin-top: var(--wsscd-space-1);
	--wsscd-card-header-description-font-size: var(--wsscd-font-size-base);
	--wsscd-card-header-description-line-height: var(--wsscd-line-height-base);
	--wsscd-card-header-description-color: var(--wsscd-text-muted);
	--wsscd-card-heading-gap: var(--wsscd-space-3);
	max-width: 1360px;
	padding-bottom: var(--wsscd-space-6);
}

.wsscd-main-dashboard > .wp-header-end {
	margin: 0;
	padding: 0;
	border: none;
	height: 0;
	visibility: hidden;
}

/* WP `.notice` base layout + Freemius title hide: shared/_components.css */

/* ─── Native Discount Notice ───────────────────────────────── */

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice {
	--wsscd-notice-accent: #ea580c;
	--wsscd-notice-border: #fed7aa;
	--wsscd-notice-text: #9a3412;
	--wsscd-notice-heading: #7c2d12;
	--wsscd-notice-icon-bg: rgba(234, 88, 12, 0.15);
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: var(--wsscd-space-4);
	align-items: center;
	margin: 0 0 var(--wsscd-space-5);
	padding: var(--wsscd-space-4) var(--wsscd-space-5);
	border: 1px solid var(--wsscd-notice-border);
	border-left: 4px solid var(--wsscd-notice-accent);
	border-radius: var(--wsscd-radius-md);
	background: linear-gradient(135deg, #fff7ed 0%, #ffffff 72%);
	box-shadow: var(--wsscd-shadow-1);
}

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	background: var(--wsscd-notice-icon-bg);
	color: var(--wsscd-notice-text);
}

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__content {
	min-width: 0;
}

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__title {
	margin: 0 0 var(--wsscd-space-1);
	font-size: var(--wsscd-font-size-medium-large);
	line-height: var(--wsscd-line-height-tight);
	color: var(--wsscd-notice-heading);
}

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__text {
	margin: 0;
	font-size: var(--wsscd-font-size-base);
	line-height: var(--wsscd-line-height-base);
	color: var(--wsscd-notice-text);
}

.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__actions {
	display: inline-flex;
	flex-wrap: wrap;
	gap: var(--wsscd-space-2);
	justify-content: flex-end;
}

/* Card system + variants live in shared/_components.css now. */

/* Card structure */

.wsscd-main-dashboard .wsscd-card__body {
	padding: var(--wsscd-space-4) var(--wsscd-space-5);
}

.wsscd-main-dashboard .wsscd-card__body--flush {
	padding: 0;
}

.wsscd-main-dashboard .wsscd-card__title-row {
	display: flex;
	align-items: center;
	gap: var(--wsscd-space-2);
}

/* Shared dashboard primitives used across verdict and workspace sections. */

.wsscd-card-link,
.wsscd-opp-panel__cta,
.wsscd-is-hero__action-alt-cta {
	display: inline-flex;
	align-items: center;
	font-family: inherit;
	font-size: var(--wsscd-font-size-base);
	font-weight: var(--wsscd-font-weight-semibold);
	text-decoration: none;
	cursor: pointer;
}

.wsscd-opp-panel__cta,
.wsscd-is-hero__action-alt-cta {
	white-space: nowrap;
}

.wsscd-campaign-empty__text,
.wsscd-opp-empty__text {
	display: flex;
	flex-direction: column;
	gap: var(--wsscd-spacing-xs);
}

.wsscd-opp-hero__badge-dot,
.wsscd-opp-panel__badge-dot,
.wsscd-opp-linked__dot,
.wsscd-is-diagnostics-row__dot {
	border-radius: 50%;
	flex-shrink: 0;
}

.wsscd-main-dashboard .wsscd-card__footer {
	display: flex;
	align-items: center;
	gap: var(--wsscd-space-3);
	padding: var(--wsscd-space-4) var(--wsscd-space-5) var(--wsscd-space-5);
	border-top: 1px solid var(--wsscd-border);
}

.wsscd-main-dashboard .wsscd-card__footer--between {
	justify-content: space-between;
}

.wsscd-main-dashboard .wsscd-card__footer--end {
	justify-content: flex-end;
}

.wsscd-main-dashboard .wsscd-card__footer--stack {
	flex-direction: column;
	align-items: stretch;
}

/* ─── Chips ────────────────────────────────────────────────── */

.wsscd-main-dashboard .wsscd-chip {
	display: inline-flex;
	align-items: center;
	padding: var(--wsscd-spacing-xxs) var(--wsscd-spacing-sm);
	border-radius: 999px;
	border: 1px solid var(--wsscd-border);
	background: var(--wsscd-surface);
	color: var(--wsscd-text);
	font-size: var(--wsscd-font-size-small);
	font-weight: var(--wsscd-font-weight-semibold);
	line-height: var(--wsscd-line-height-tight);
}

.wsscd-main-dashboard .wsscd-chip--info {
	background: rgba(37, 99, 235, 0.08);
	border-color: rgba(37, 99, 235, 0.2);
	color: var(--wsscd-info);
}

.wsscd-main-dashboard .wsscd-chip--warn {
	background: rgba(180, 83, 9, 0.12);
	border-color: rgba(180, 83, 9, 0.2);
	color: var(--wsscd-warn);
}

.wsscd-main-dashboard .wsscd-chip--down {
	background: var(--wsscd-color-danger-alpha-15, rgba(220, 38, 38, 0.12));
	border-color: var(--wsscd-color-danger-alpha-25, rgba(220, 38, 38, 0.2));
	color: var(--wsscd-critical);
}

.wsscd-main-dashboard .wsscd-chip--success {
	background: rgba(22, 163, 74, 0.12);
	border-color: rgba(22, 163, 74, 0.22);
	color: var(--wsscd-color-success-dark, #166534);
}

.wsscd-main-dashboard .wsscd-chip--neutral {
	background: var(--wsscd-surface-muted);
	border-color: var(--wsscd-border);
	color: var(--wsscd-text-muted);
}

/* ─── Responsive ───────────────────────────────────────────── */

@media (max-width: 900px) {
	.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice {
		grid-template-columns: 1fr;
	}

	.wsscd-main-dashboard .wsscd-dashboard-native-discount-notice__actions {
		justify-content: flex-start;
	}
}

@media screen and (max-width: 600px) {
	.wsscd-dashboard-native-discount-notice {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.wsscd-opp-panel__cta {
		white-space: normal;
	}
}
