/**
 * Device & OS Specific Fixes (STEP 9)
 * iOS Safari, Android Chrome, Windows, macOS specific adjustments
 * 
 * @package Higashimatudo_Shika
 */

/* ============================================
   iOS Safari Specific Fixes
   ============================================ */

@supports (-webkit-touch-callout: none) {
	/* iOS Safari detection */
	
	/* Fix for 100vh on mobile */
	html {
		height: 100%;
		height: 100vh;
	}

	body {
		height: 100%;
		overflow: hidden;
		overflow-y: scroll;
	}

	main {
		overflow: visible;
	}

	/* Fix for input zoom on focus */
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="number"],
	textarea,
	select {
		font-size: 16px;
	}

	/* Fix for button styling */
	button,
	input[type="button"],
	input[type="submit"],
	input[type="reset"] {
		-webkit-appearance: none;
		border-radius: 6px;
	}

	/* Fix for links */
	a {
		-webkit-tap-highlight-color: rgba(0, 102, 204, 0.2);
	}

	/* Fix for smooth scrolling */
	.mobile-menu {
		-webkit-overflow-scrolling: touch;
	}

	/* Safe area support for notch devices */
	@supports (padding: max(0px)) {
		header {
			padding-top: max(0px, env(safe-area-inset-top));
		}

		footer {
			padding-bottom: max(0px, env(safe-area-inset-bottom));
		}

		.mobile-menu {
			padding-right: max(0px, env(safe-area-inset-right));
			padding-left: max(0px, env(safe-area-inset-left));
		}
	}

	/* Fix for viewport scale */
	@media (max-width: 767px) {
		body {
			-webkit-user-select: text;
			-webkit-touch-callout: default;
		}
	}

	/* Better rendering */
	html {
		-webkit-font-smoothing: antialiased;
		-webkit-backface-visibility: hidden;
	}

	/* Fix for position fixed */
	.sticky-header {
		position: -webkit-sticky;
		position: sticky;
	}

	/* Reduce motion on iOS */
	@media (prefers-reduced-motion: reduce) {
		* {
			animation-duration: 0.01ms !important;
			animation-iteration-count: 1 !important;
			transition-duration: 0.01ms !important;
		}
	}
}

/* ============================================
   Android Chrome Specific Fixes
   ============================================ */

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) and (-webkit-min-device-pixel-ratio: 2) {
	/* Android Chrome */
	
	/* Better font rendering */
	body {
		-webkit-font-smoothing: antialiased;
		-webkit-backface-visibility: hidden;
		-webkit-text-size-adjust: 100%;
	}

	/* Fix for input styling */
	input,
	textarea,
	select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
	}

	/* Fix for select dropdown */
	select {
		background: transparent;
		border-radius: 0;
	}

	/* Better button rendering */
	button,
	input[type="button"],
	input[type="submit"] {
		-webkit-appearance: none;
		-webkit-user-select: none;
		user-select: none;
	}

	/* Smooth scrolling */
	main {
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
	}

	/* Fix for fixed elements */
	.mobile-menu {
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
	}

	/* Better link handling */
	a {
		-webkit-tap-highlight-color: rgba(0, 102, 204, 0.1);
		tap-highlight-color: rgba(0, 102, 204, 0.1);
	}

	/* Prevent Android zoom on input */
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	textarea,
	select {
		font-size: 16px;
		font-size: max(16px, 1em);
	}

	/* Fix for keyboard */
	input:focus,
	textarea:focus,
	select:focus {
		font-size: 16px;
	}

	/* Better rendering */
	* {
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}
}

/* ============================================
   Samsung Internet Specific
   ============================================ */

@supports (-webkit-app-region: drag) {
	/* Samsung Internet browser */
	
	/* Better scrolling */
	main {
		-webkit-overflow-scrolling: touch;
	}

	/* Better rendering */
	body {
		-webkit-font-smoothing: antialiased;
	}

	/* Fix for touch */
	input,
	textarea,
	select {
		-webkit-appearance: none;
	}
}

/* ============================================
   Firefox Mobile Specific
   ============================================ */

@-moz-document url-prefix() {
	/* Firefox mobile */
	
	/* Fix for scrolling */
	html {
		overflow-y: scroll;
		overflow: auto;
	}

	/* Better font rendering */
	body {
		-moz-osx-font-smoothing: grayscale;
	}

	/* Input styling */
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	textarea {
		-moz-appearance: none;
	}

	/* Fix for select */
	select {
		-moz-appearance: none;
		background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path fill='%23333' d='M0 0l6 8 6-8z'/></svg>");
		background-repeat: no-repeat;
		background-position: right 10px center;
		background-size: 12px 8px;
		padding-right: 30px;
	}

	/* Better link handling */
	a {
		outline-offset: 2px;
	}
}

/* ============================================
   Windows Phone / Edge Mobile
   ============================================ */

/* Windows Phone touch */
@media screen and (max-width: 767px) {
	/* Better button handling */
	button,
	input[type="button"],
	input[type="submit"],
	a.button {
		touch-action: manipulation;
	}

	/* Better text selection */
	* {
		-ms-touch-action: manipulation;
		touch-action: manipulation;
	}

	/* Input styling */
	input,
	textarea,
	select {
		-ms-appearance: none;
		appearance: none;
	}
}

/* ============================================
   Pixel Phone Specific
   ============================================ */

@media only screen and (device-width: 412px) and (device-height: 824px) and (-webkit-device-pixel-ratio: 2.625) {
	/* Pixel phone optimization */
	
	/* Better scaling */
	html {
		font-size: 16px;
	}

	/* Smooth scrolling */
	main {
		scroll-behavior: smooth;
	}
}

/* ============================================
   iPhone Specific (All Models)
   ============================================ */

@supports (-webkit-appearance: none) {
	/* iPhone */
	
	/* Better form handling */
	select,
	textarea,
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="number"],
	input[type="date"] {
		font-size: 16px;
		border-radius: 6px;
		-webkit-appearance: none;
		appearance: none;
	}

	/* Fix for -webkit-autofill */
	input:-webkit-autofill,
	input:-webkit-autofill:hover,
	input:-webkit-autofill:focus {
		-webkit-box-shadow: 0 0 0 1000px var(--color-background) inset !important;
		-webkit-text-fill-color: var(--color-text) !important;
	}

	/* Better button handling */
	button:not(:disabled) {
		cursor: pointer;
	}

	/* Fix for link outline */
	a:focus {
		outline-offset: 2px;
		outline: 2px solid var(--color-primary);
	}

	/* Better input focus */
	input:focus,
	textarea:focus,
	select:focus {
		-webkit-appearance: none;
	}
}

/* ============================================
   Tablet Specific Fixes
   ============================================ */

@media (min-width: 576px) and (max-width: 1024px) {
	/* Tablet optimization */
	
	/* Better spacing for touch */
	button,
	a,
	input[type="button"],
	input[type="submit"] {
		min-height: 48px;
		min-width: 48px;
	}

	/* Form sizing */
	input,
	textarea,
	select {
		font-size: 16px;
	}

	/* Better scrolling */
	main {
		-webkit-overflow-scrolling: touch;
	}
}

/* ============================================
   Desktop Browser Fixes
   ============================================ */

@media (min-width: 1200px) {
	/* Desktop optimization */
	
	/* Smooth scrolling */
	html {
		scroll-behavior: smooth;
	}

	/* Better link rendering */
	a {
		text-decoration: none;
		transition: color var(--transition-fast);
	}

	a:hover {
		text-decoration: underline;
	}

	/* Better form handling */
	input:focus,
	textarea:focus,
	select:focus {
		outline: 2px solid var(--color-primary);
		outline-offset: 2px;
	}
}

/* ============================================
   Webkit Browsers (Chrome, Safari, Edge)
   ============================================ */

/* Webkit specific optimizations */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--color-background-light);
}

::-webkit-scrollbar-thumb {
	background: var(--color-border-light);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--color-border);
}

/* Webkit input styling */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type="number"] {
	-moz-appearance: textfield;
}

/* Webkit autofill styling */
input:-webkit-autofill {
	box-shadow: 0 0 0 1000px var(--color-background) inset;
	-webkit-text-fill-color: var(--color-text);
}

/* ============================================
   High DPI Screens
   ============================================ */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	/* Retina display optimization */
	
	* {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	/* Sharper borders */
	border {
		border-width: 1px;
	}

	/* Better image rendering */
	img {
		image-rendering: -webkit-optimize-contrast;
	}
}

/* ============================================
   Dark Mode - Browser Support
   ============================================ */

@media (prefers-color-scheme: dark) {
	/* Dark mode colors */
	:root {
		color-scheme: dark;
	}

	body {
		background-color: var(--color-background);
		color: var(--color-text);
	}

	/* Form dark mode */
	input,
	textarea,
	select {
		background-color: var(--color-background);
		color: var(--color-text);
		border-color: var(--color-border-light);
	}

	/* Scrollbar dark mode */
	::-webkit-scrollbar-track {
		background: var(--color-background-light);
	}

	::-webkit-scrollbar-thumb {
		background: var(--color-border-light);
	}
}

/* ============================================
   Print Media
   ============================================ */

@media print {
	/* Print-specific adjustments */
	
	body {
		background: white;
		color: black;
	}

	a {
		text-decoration: underline;
	}

	a[href]::after {
		content: " (" attr(href) ")";
	}

	/* Hide navigation on print */
	header,
	footer,
	nav,
	.hamburger-menu,
	.no-print {
		display: none;
	}

	/* Better page breaks */
	h1, h2, h3 {
		page-break-after: avoid;
	}

	img {
		page-break-inside: avoid;
		max-width: 100%;
	}

	/* Print colors */
	::-webkit-scrollbar {
		display: none;
	}
}

/* ============================================
   Reduced Motion Support
   ============================================ */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	html {
		scroll-behavior: auto;
	}
}

/* ============================================
   High Contrast Mode
   ============================================ */

@media (prefers-contrast: more) {
	/* Increase contrast */
	button,
	input[type="button"],
	input[type="submit"],
	a.button {
		border-width: 2px;
	}

	input,
	textarea,
	select {
		border-width: 2px;
	}
}

/* ============================================
   Large Text Mode
   ============================================ */

@media (prefers-text-size: 200%) {
	/* Scale up for screen readers with text enlargement */
	html {
		font-size: 20px;
	}

	body {
		font-size: 1.2em;
	}

	h1 {
		font-size: 2.4em;
	}

	h2 {
		font-size: 2em;
	}

	button,
	input[type="button"],
	input[type="submit"] {
		font-size: 1.2em;
		padding: 0.8em 1.2em;
	}
}