/*
 * Curated design tokens mirrored from the Trellis design system
 * (@rentvine/trellis, values read from the rendered theme in the React portals on
 * 2026-10-06). The account app has no build step, so Trellis utilities cannot be
 * used directly; these variables let account-theme.css reproduce the same look.
 * If Trellis rebrands, re-sync these from a portal page's computed CSS variables.
 */
:root {
	/* Brand / primary (color-background-primary*) */
	--rv-primary: #03893f;
	--rv-primary-hover: #097239;
	--rv-primary-active: #0a5d31;
	--rv-primary-contrast: #ffffff;

	/* Surfaces and neutrals */
	--rv-bg: #f5f6f6; /* surface-recessed */
	--rv-surface: #ffffff; /* surface-default / elevated */
	--rv-surface-hover: #f5f6f6; /* surface-hover */
	--rv-muted: #e5e8e8; /* background-neutral-muted (secondary buttons) */
	--rv-muted-hover: #cdd3d4;
	--rv-muted-active: #aab4b6;
	--rv-border: rgba(47, 53, 56, 0.2); /* border-default (neutral-faint) */
	--rv-text: #2f3538; /* foreground-neutral */
	--rv-text-muted: #566164; /* foreground-neutral-muted */
	--rv-text-disabled: #aab4b6; /* foreground-disabled, also input placeholders */
	--rv-control-border: #647276; /* border-neutral (checkbox outline) */
	--rv-link: #1473cc; /* foreground-link */
	--rv-link-hover: #105294; /* foreground-link-hover */

	/* Feedback (background-*-surface / foreground-*-strong / border-*-faint) */
	--rv-danger: #c10f11;
	--rv-danger-surface: #ffe0e0;
	--rv-danger-strong: #6f0709;
	--rv-danger-border: rgba(193, 15, 17, 0.3);
	--rv-success: #03893f;
	--rv-success-surface: #dafce8;
	--rv-success-strong: #0a5d31;
	--rv-success-border: rgba(3, 137, 63, 0.3);
	--rv-warning-surface: #fdf2d5;
	--rv-warning-strong: #74350b;
	--rv-warning-border: rgba(195, 86, 4, 0.3);
	--rv-info-surface: #e2eefc;
	--rv-info-strong: #143c66;
	--rv-info-border: rgba(20, 115, 204, 0.3);

	/* Shape (border-radius-200 for cards, border-radius-100 for controls) */
	--rv-radius: 16px;
	--rv-radius-sm: 8px;
	--rv-radius-pill: 999px;

	/* Typography (font-sans, heading-lg/md/sm, body-md/sm) */
	--rv-font: 'Inter', Helvetica, sans-serif;
	--rv-weight-regular: 400;
	--rv-weight-medium: 500;
	--rv-weight-semi-bold: 600;
	--rv-heading-lg-size: 28px;
	--rv-heading-lg-line: 34px;
	--rv-heading-lg-tracking: -0.8px;
	--rv-heading-md-size: 22px;
	--rv-heading-md-line: 28px;
	--rv-heading-md-tracking: -0.4px;
	--rv-heading-sm-size: 18px;
	--rv-heading-sm-line: 24px;
	--rv-heading-sm-tracking: -0.4px;
	--rv-body-md-size: 14px;
	--rv-body-md-line: 20px;
	--rv-body-sm-size: 12px;
	--rv-body-sm-line: 16px;

	/* Elevation (shadow-300 floating card) */
	--rv-shadow: 0 4px 6px -2px rgba(0, 0, 0, 0.08), 0 5px 12px -3px rgba(0, 0, 0, 0.14);

	/* Focus: Trellis draws a 2px solid outline with a 2px gap, not a glow (border-focus-default) */
	--rv-focus: #1473cc;
	--rv-focus-outline: 2px solid var(--rv-focus);
	--rv-focus-offset: 2px;
}