/* =========================================
   GLOBAL CSS CONFIG - Base Variables & Defaults
   Minimal, safe foundation settings
   ========================================= */

/* CSS Variables - Global defaults */
:root {
	/* Base typography */
	--base-font-size: 10px;
	--base-line-height: 1.5;
	
	/* Colors - Minimal set (extend as needed) */
	--color-primary: #0c93d2;
	--color-primary-dark: #0a7bb0;
	--color-text: #333333;
	--color-text-light: #666666;
	--color-bg: #ffffff;
	--color-bg-light: #f5f5f5;
	--color-border: #e5e7eb;
	
	/* Spacing scale */
	--spacing-xs: 4px;
	--spacing-sm: 8px;
	--spacing-md: 16px;
	--spacing-lg: 24px;
	--spacing-xl: 32px;
	--spacing-2xl: 48px;
	
	/* Border radius */
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 12px;
	--radius-xl: 16px;
	
	/* Shadows */
	--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
	--shadow-md: 0 2px 8px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.15);
	
	/* Z-index scale */
	--z-dropdown: 1000;
	--z-sticky: 1020;
	--z-fixed: 1030;
	--z-modal-backdrop: 1040;
	--z-modal: 1050;
	--z-popover: 1060;
	--z-tooltip: 1070;
	
	/* Container widths */
	--container-sm: 576px;
	--container-md: 768px;
	--container-lg: 992px;
	--container-xl: 1200px;
	--container-xxl: 1400px;
}

/* Box-sizing reset - Global */
*, *::before, *::after {
	box-sizing: border-box;
}

/* HTML base */
html {
	font-size: var(--base-font-size, 10px);
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

/* Body defaults - Minimal (only if not set elsewhere) */
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Image & media defaults */
img, video, iframe {
	max-width: 100%;
	height: auto;
	display: block;
}

/* Safe image handling */
img {
	vertical-align: middle;
}

/* SVG defaults */
svg {
	vertical-align: middle;
	fill: currentColor;
}