/* =========================
   RIVALUTION DESIGN TOKENS
   Single source of truth
   ========================= */

:root {

	/* =========================
	   COLOR SYSTEM — CORE
	   ========================= */

	--rv-color-black: #000000;
	--rv-color-white: #FFFFFF;

	/* Brand (Rose System) */
	--rv-color-rose-base: #C6426E;
	--rv-color-rose-dark: #92264B;
	--rv-color-rose-mid: #A52E56;
	--rv-color-rose-light: #CC547C;
	--rv-color-rose-accent: #E7A8BD;

	/* Neutrals */
	--rv-color-gray-100: #F5F5F7;
	--rv-color-gray-200: #E6E6E6;
	--rv-color-gray-300: #D9D9D9;
	--rv-color-gray-400: #CFCFD3;
	--rv-color-gray-500: #B8BBC2;
	--rv-color-gray-600: #9F9F9F;
	--rv-color-gray-700: #333333;
	--rv-color-gray-800: #252D37;

	/* =========================
	   TEXT COLORS
	   ========================= */

	--rv-text-primary: #FFFFFF;
	--rv-text-secondary: rgba(255, 255, 255, 0.80);
	--rv-text-muted: rgba(255, 255, 255, 0.54);
	--rv-text-meta: rgba(255, 255, 255, 0.44);

	/* =========================
	   BACKGROUNDS
	   ========================= */

	--rv-bg-site: #000000;
	--rv-bg-panel: #252D37;
	--rv-bg-auth: #CC547C;

	/* =========================
	   BORDER / LINE SYSTEM
	   ========================= */

	--rv-border-subtle: rgba(255, 255, 255, 0.08);
	--rv-border-medium: rgba(255, 255, 255, 0.12);
	--rv-border-strong: rgba(255, 255, 255, 0.18);

	--rv-border-dark-subtle: rgba(0, 0, 0, 0.18);
	--rv-border-dark-strong: rgba(0, 0, 0, 0.25);

	/* =========================
	   SHADOW SYSTEM
	   ========================= */

	--rv-shadow-soft:
		0 8px 22px rgba(0, 0, 0, 0.16);

	--rv-shadow-elevated:
		0 24px 60px rgba(0, 0, 0, 0.28);

	--rv-shadow-inset-light:
		inset 0 1px 0 rgba(255, 255, 255, 0.05);

	--rv-shadow-inset-dark:
		inset 0 -1px 0 rgba(0, 0, 0, 0.08);

	/* =========================
	   GRADIENTS
	   ========================= */

	--rv-gradient-banner:
		linear-gradient(
			to bottom,
			#B2345E 0%,
			#A52E56 50%,
			#92264B 100%
		);

	--rv-gradient-banner-alt:
		linear-gradient(
			to bottom,
			#C84372 0%,
			#C03A67 50%,
			#B3325E 100%
		);

	/* =========================
	   TYPOGRAPHY
	   ========================= */

	--rv-font-body:
		Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

	--rv-font-heading:
		Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;

	/* =========================
	   SPACING SYSTEM
	   ========================= */

	--rv-space-xs: 4px;
	--rv-space-sm: 8px;
	--rv-space-md: 14px;
	--rv-space-lg: 20px;
	--rv-space-xl: 28px;
	--rv-space-2xl: 40px;
	--rv-space-3xl: 60px;

	/* =========================
	   RADIUS
	   ========================= */

	--rv-radius-sm: 6px;
	--rv-radius-md: 8px;
	--rv-radius-lg: 14px;
	--rv-radius-pill: 999px;

	/* =========================
	   MOTION SYSTEM
	   ========================= */

	--rv-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
	--rv-ease-press: cubic-bezier(0.34, 1.56, 0.64, 1);

	--rv-dur-fast: 0.14s;
	--rv-dur-ui: 0.18s;
	--rv-dur-panel: 0.26s;
	--rv-dur-page: 0.32s;

	/* =========================
	   COMPONENT TOKENS
	   ========================= */

	/* Banner */
	--rv-banner-bg: var(--rv-gradient-banner);
	--rv-banner-btn-bg: #FFFFFF;
	--rv-banner-btn-color: #7A2445;
	--rv-banner-border-top: 1px solid var(--rv-border-medium);
	--rv-banner-border-btm: 1px solid var(--rv-border-dark-strong);
	--rv-banner-phone-color: var(--rv-color-gray-300);

	/* Auth mode */
	--rv-auth-mode-text: var(--rv-text-meta);
	--rv-auth-mode-text-hover: rgba(255, 255, 255, 0.70);
	--rv-auth-mode-text-active: #FFFFFF;

	--rv-auth-mode-border: rgba(255, 255, 255, 0.07);
	--rv-auth-mode-border-active: var(--rv-border-strong);

	--rv-auth-mode-bg: rgba(0, 0, 0, 0.10);
	--rv-auth-mode-bg-active: rgba(255, 255, 255, 0.07);

	/* CTA icon */
	--rv-cta-icon: url('/files/images/icons/padlock-dark.png');
}