/**
 * AlloQuinte Design System — Base, Tokens & Typography
 *
 * Light-mode primary design tokens, CSS reset, and accessible keyboard focus outlines.
 *
 * @package AlloQuinte
 */

:root {
	/* Core Color Palette */
	--aq-primary: #0e6245;
	--aq-primary-hover: #094631;
	--aq-primary-light: #ecfdf5;
	--aq-accent: #b45309;
	--aq-accent-hover: #92400e;
	--aq-accent-light: #fef3c7;

	/* Surfaces & Backgrounds */
	--aq-background: #f8fafc;
	--aq-surface: #ffffff;
	--aq-surface-alt: #f1f5f9;
	--aq-surface-hover: #f8fafc;

	/* Borders */
	--aq-border: #e2e8f0;
	--aq-border-focus: #0e6245;
	--aq-border-light: #edf2f7;

	/* Typography */
	--aq-text: #0f172a;
	--aq-text-muted: #64748b;
	--aq-text-inverse: #ffffff;

	/* Status Indicators */
	--aq-success: #16a34a;
	--aq-success-bg: #dcfce7;
	--aq-warning: #ea580c;
	--aq-warning-bg: #ffedd5;
	--aq-danger: #dc2626;
	--aq-danger-bg: #fee2e2;

	/* Shoeing Equipment Colors */
	--aq-shoe-d4-bg: #dcfce7;
	--aq-shoe-d4-text: #15803d;
	--aq-shoe-dp-bg: #e0f2fe;
	--aq-shoe-dp-text: #0369a1;
	--aq-shoe-da-bg: #fef3c7;
	--aq-shoe-da-text: #b45309;
	--aq-shoe-f-bg: #f1f5f9;
	--aq-shoe-f-text: #475569;

	/* Font Stacks */
	--aq-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--aq-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

	/* Spacing Scale */
	--aq-space-1: 0.25rem;  /* 4px */
	--aq-space-2: 0.5rem;   /* 8px */
	--aq-space-3: 0.75rem;  /* 12px */
	--aq-space-4: 1rem;     /* 16px */
	--aq-space-5: 1.25rem;  /* 20px */
	--aq-space-6: 1.5rem;   /* 24px */
	--aq-space-8: 2rem;     /* 32px */
	--aq-space-10: 2.5rem;  /* 40px */
	--aq-space-12: 3rem;    /* 48px */
	--aq-space-16: 4rem;    /* 64px */

	/* Radius */
	--aq-radius-sm: 4px;
	--aq-radius-md: 8px;
	--aq-radius-lg: 12px;
	--aq-radius-full: 9999px;

	/* Elevation Shadows */
	--aq-shadow-sm: 0 1px 2px 0 rgba(15, 23, 42, 0.05);
	--aq-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05);
	--aq-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04);

	/* Container Max Width */
	--aq-container-max: 1280px;
}

/* Box Sizing & Reset */
*, *::before, *::after {
	box-sizing: border-box;
}

html {
	font-family: var(--aq-font-sans);
	font-size: 16px;
	line-height: 1.6;
	color: var(--aq-text);
	background-color: var(--aq-background);
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	background-color: var(--aq-background);
	color: var(--aq-text);
}

/* Accessible Skip Link */
.aq-skip-link {
	position: absolute;
	top: -9999px;
	left: var(--aq-space-4);
	background: var(--aq-primary);
	color: var(--aq-text-inverse);
	padding: var(--aq-space-2) var(--aq-space-4);
	border-radius: var(--aq-radius-sm);
	font-weight: 600;
	z-index: 99999;
	text-decoration: none;
	transition: top 0.15s ease-in-out;
}

.aq-skip-link:focus {
	top: var(--aq-space-4);
}

/* Headings & Hierarchy */
h1, h2, h3, h4, h5, h6 {
	color: var(--aq-text);
	margin-top: 0;
	margin-bottom: var(--aq-space-3);
	font-weight: 700;
	line-height: 1.25;
}

h1 { font-size: clamp(1.75rem, 3.5vw, 2.25rem); }
h2 { font-size: clamp(1.35rem, 2.5vw, 1.75rem); }
h3 { font-size: clamp(1.15rem, 2vw, 1.35rem); }
h4 { font-size: 1.125rem; }

p {
	margin-top: 0;
	margin-bottom: var(--aq-space-4);
}

a {
	color: var(--aq-primary);
	text-decoration: none;
	transition: color 0.15s ease;
}

a:hover {
	color: var(--aq-primary-hover);
}

/* Visible Keyboard Focus Ring */
:focus-visible {
	outline: 2px solid var(--aq-primary);
	outline-offset: 2px;
}

img, svg {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}