/*
	Theme Name: Events Miskart
	Theme URI: https://events.miskartinstitute.org/
	Description: Child theme of Hello Elementor built for the Miskart events platform. Adds design tokens, event listing styles and the site-specific hooks the parent theme intentionally leaves out.
	Author: events.miskartinstitute.org
	Author URI: https://events.miskartinstitute.org/
	Template: hello-elementor
	Version: 1.0.1
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: events-miskart
	Tags: custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, translation-ready, accessibility-ready
*/

/* Design tokens. Elementor's Site Settings still win for anything it controls. */
:root {
	/* Latin and Arabic both resolve to HT Rakik; the fallbacks cover both scripts. */
	--em-font-primary: 'HT Rakik', 'Segoe UI', Tahoma, Arial, sans-serif;

	--em-color-teal: #005556;
	--em-color-brand: #1b3a5c;
	--em-color-brand-hover: #14293f;
	--em-color-accent: #e0603a;
	--em-color-text: #23282d;
	--em-color-muted: #5c6b7a;
	--em-color-border: #e2e6ea;
	--em-color-surface: #ffffff;
	--em-color-surface-alt: #f6f8fa;

	--em-radius: 6px;
	--em-radius-lg: 12px;
	--em-shadow: 0 1px 2px rgba(27, 58, 92, .06), 0 8px 24px rgba(27, 58, 92, .08);
	--em-transition: 160ms ease;

	--em-space-xs: .5rem;
	--em-space-sm: .75rem;
	--em-space-md: 1.25rem;
	--em-space-lg: 2rem;
	--em-space-xl: 3.5rem;
}

body {
	color: var(--em-color-text);
	font-family: var(--em-font-primary);
	-webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
	font-family: inherit;
}

a {
	transition: color var(--em-transition);
}

/* Visible focus ring — the parent reset removes the browser default in places. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--em-color-accent);
	outline-offset: 2px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link:focus {
	position: fixed;
	top: var(--em-space-xs);
	inset-inline-start: var(--em-space-xs);
	z-index: 100000;
	width: auto;
	height: auto;
	padding: var(--em-space-xs) var(--em-space-md);
	clip: auto;
	background-color: var(--em-color-surface);
	border-radius: var(--em-radius);
	box-shadow: var(--em-shadow);
	color: var(--em-color-brand);
	text-decoration: none;
}
