/**
 * Infynic Theme - Base Styles, Reset, Material & Atmosphere
 *
 * @package Infynic_Theme
 * @author Jyotirmay Ray <https://jyotirmayray.in/>
 */

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-family: var(--infynic-font-family);
	font-size: 16px;
	line-height: var(--infynic-line-height-normal);
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
	background-color: var(--infynic-bg-page);
	color: var(--infynic-text-primary);
}

body {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	background-color: var(--infynic-bg-page);
	color: var(--infynic-text-primary);
	overflow-x: hidden;
}

/* ==========================================================================
   Atmosphere & Ambient Background Lighting
   ========================================================================== */
.infynic-ambient-bg {
	position: relative;
	background-color: var(--infynic-bg-page);
	background-image: 
		radial-gradient(ellipse 80% 50% at 50% -20%, rgba(43, 93, 245, 0.08), transparent 70%),
		radial-gradient(circle 400px at 90% 20%, rgba(96, 144, 250, 0.04), transparent 80%),
		radial-gradient(circle 500px at 10% 80%, rgba(43, 93, 245, 0.03), transparent 80%);
}

.infynic-glow-blue {
	position: relative;
}

.infynic-glow-blue::before {
	content: '';
	position: absolute;
	inset: -20px;
	background: radial-gradient(circle, rgba(43, 93, 245, 0.15) 0%, transparent 70%);
	z-index: -1;
	pointer-events: none;
	border-radius: inherit;
}

/* ==========================================================================
   Liquid Glass Materials (iOS Inspired)
   ========================================================================== */
.infynic-glass-soft {
	background-color: var(--infynic-glass-soft-bg);
	backdrop-filter: var(--infynic-glass-soft-blur);
	-webkit-backdrop-filter: var(--infynic-glass-soft-blur);
	border: 1px solid var(--infynic-glass-soft-border);
	box-shadow: var(--infynic-shadow-xs);
}

.infynic-glass {
	background-color: var(--infynic-glass-bg);
	backdrop-filter: var(--infynic-glass-blur);
	-webkit-backdrop-filter: var(--infynic-glass-blur);
	border: 1px solid var(--infynic-glass-border);
	box-shadow: var(--infynic-shadow-glass);
	box-shadow: var(--infynic-glass-highlight), var(--infynic-shadow-glass);
}

.infynic-glass-strong {
	background-color: var(--infynic-glass-strong-bg);
	backdrop-filter: var(--infynic-glass-strong-blur);
	-webkit-backdrop-filter: var(--infynic-glass-strong-blur);
	border: 1px solid var(--infynic-glass-strong-border);
	box-shadow: var(--infynic-shadow-md);
}

/* Progressive Enhancement Fallback when backdrop-filter is unsupported */
@supports not ((-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px))) {
	.infynic-glass-soft,
	.infynic-glass,
	.infynic-glass-strong {
		background-color: var(--infynic-glass-fallback-bg);
		border-color: var(--infynic-border-default);
	}
}

/* ==========================================================================
   Accessibility: Screen Reader & Skip Link
   ========================================================================== */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link {
	position: absolute;
	top: -9999px;
	left: 1rem;
	background: var(--infynic-primary-500);
	color: var(--infynic-primary-contrast);
	padding: var(--infynic-space-3) var(--infynic-space-6);
	border-radius: var(--infynic-radius-md);
	font-weight: var(--infynic-font-weight-medium);
	z-index: 99999;
	text-decoration: none;
	box-shadow: var(--infynic-shadow-lg);
	transition: top var(--infynic-duration-fast) ease;
}

.skip-link:focus {
	top: 1rem;
}

/* ==========================================================================
   Focus State System
   ========================================================================== */
:focus-visible {
	outline: none;
	box-shadow: var(--infynic-focus-ring);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: none;
	box-shadow: var(--infynic-focus-ring);
}

/* ==========================================================================
   Text Selection & Scrollbars
   ========================================================================== */
::selection {
	background-color: var(--infynic-primary-100);
	color: var(--infynic-primary-900);
}

::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--infynic-bg-page);
}

::-webkit-scrollbar-thumb {
	background: var(--infynic-neutral-300);
	border-radius: var(--infynic-radius-pill);
}

::-webkit-scrollbar-thumb:hover {
	background: var(--infynic-neutral-400);
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
