/**
 * Design Tokens for Rowan Electric
 *
 * This file contains Rowan-specific design tokens.
 * These are placeholders that will be customized with Rowan brand values.
 *
 * All tokens use the --rowan- prefix to avoid conflicts.
 */

:root {
	/* ============================================
	   Base Color Palette
	   ============================================ */
	--rowan-color-primary: #315677;
	--rowan-color-secondary: #FFFFFF;
	--rowan-color-text: #5a5a5a;
	--rowan-color-accent: #F6851F;

	/* ============================================
	   Typography
	   ============================================ */
	--rowan-font-base: 'Montserrat', sans-serif;
	--rowan-font-heading: 'Montserrat', sans-serif;
	--rowan-font-mono: 'Courier New', Courier, monospace;

	/* Fluid font sizes using clamp() for responsive scaling */
	--rowan-font-size-xs: clamp(0.75rem, 0.7rem + 0.2vw, 0.8rem);
	--rowan-font-size-sm: clamp(0.875rem, 0.8rem + 0.3vw, 0.95rem);
	--rowan-font-size-md: clamp(1rem, 0.95rem + 0.3vw, 1.125rem);
	--rowan-font-size-lg: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
	--rowan-font-size-xl: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
	--rowan-font-size-2xl: clamp(2rem, 1.7rem + 1.2vw, 3rem);
	--rowan-font-size-3xl: clamp(2.5rem, 2rem + 2vw, 4rem);

	/* Font weights */
	--rowan-font-weight-normal: 400;
	--rowan-font-weight-medium: 500;
	--rowan-font-weight-semibold: 600;
	--rowan-font-weight-bold: 700;

	/* Line heights */
	--rowan-line-height-tight: 1.2;
	--rowan-line-height-normal: 1.5;
	--rowan-line-height-relaxed: 1.75;

	/* ============================================
	   Spacing Scale
	   ============================================ */
	--rowan-space-xs: 0.25rem;
	/* 4px */
	--rowan-space-sm: 0.5rem;
	/* 8px */
	--rowan-space-md: 1rem;
	/* 16px */
	--rowan-space-lg: 1.5rem;
	/* 24px */
	--rowan-space-xl: 2rem;
	/* 32px */
	--rowan-space-2xl: 3rem;
	/* 48px */
	--rowan-space-3xl: 4rem;
	/* 64px */
	--rowan-space-4xl: 6rem;
	/* 96px */

	/* Fluid spacing for responsive layouts */
	--rowan-space-section: clamp(2rem, 5vw, 4rem);
	--rowan-space-container: clamp(1rem, 4vw, 3rem);

	/* ============================================
	   Layout & Containers
	   ============================================ */
	--rowan-container-max-width: 100%;
	--rowan-container-padding: var(--rowan-space-container);

	/* ============================================
	   Border Radius
	   ============================================ */
	--rowan-radius-sm: 0.25rem;
	--rowan-radius-md: 0.5rem;
	--rowan-radius-lg: 1rem;
	--rowan-radius-xl: 1.5rem;
	--rowan-radius-full: 9999px;

	/* ============================================
	   Shadows
	   ============================================ */
	--rowan-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	--rowan-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	--rowan-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
	--rowan-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);

	/* ============================================
	   Transitions
	   ============================================ */
	--rowan-transition-fast: 150ms ease-in-out;
	--rowan-transition-base: 250ms ease-in-out;
	--rowan-transition-slow: 350ms ease-in-out;

	/* ============================================
	   Z-Index Scale
	   ============================================ */
	--rowan-z-dropdown: 1000;
	--rowan-z-sticky: 1020;
	--rowan-z-fixed: 1030;
	--rowan-z-modal-backdrop: 1040;
	--rowan-z-modal: 1050;
	--rowan-z-popover: 1060;
	--rowan-z-tooltip: 1070;
}