/*
Theme Name: Arab Results Theme
Theme URI: https://arab-results.example
Author: Arab Results
Author URI: https://arab-results.example
Description: قالب عربي رسمي وبسيط لمنصة نتيجة نت — استعلام نتائج الطلاب في الدول العربية.
Version: 2.5.4
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: arab-results-theme
Domain Path: /languages
Tags: rtl-language-support, translation-ready, custom-menu, featured-images, theme-options, education

نتيجة نت — هوية رسمية بسيطة
Navy #0C2340 · Steel #1B4F72 · Brass #B08D57 · Paper #EEF1F5
*/

:root {
	/* Brand — official portal */
	--ar-ink: #0C2340;
	--ar-ink-soft: #163556;
	--ar-teal: #1B4F72;
	--ar-teal-dark: #143D59;
	--ar-teal-soft: rgba(27, 79, 114, 0.1);
	--ar-gold: #B08D57;
	--ar-gold-soft: rgba(176, 141, 87, 0.14);

	/* Semantic aliases */
	--ar-primary: var(--ar-ink);
	--ar-primary-light: var(--ar-ink-soft);
	--ar-primary-dark: #071628;
	--ar-secondary: var(--ar-teal);
	--ar-secondary-light: #2E6A93;
	--ar-accent: var(--ar-gold);
	--ar-warning: #B45309;
	--ar-danger: #B91C1C;
	--ar-success: #1F6B4A;

	/* Surfaces — soft paper, not flat white */
	--ar-bg: #EEF1F5;
	--ar-bg-muted: #E3E8EF;
	--ar-card: #FFFFFF;
	--ar-text: #1A2332;
	--ar-text-muted: #5B6B7C;
	--ar-border: #D5DCE6;
	--ar-border-strong: #B8C3D1;

	/* Elevation — restrained */
	--ar-shadow: 0 1px 2px rgba(12, 35, 64, 0.04);
	--ar-shadow-md: 0 2px 8px rgba(12, 35, 64, 0.06);
	--ar-shadow-lg: 0 8px 24px rgba(12, 35, 64, 0.08);
	--ar-shadow-hover: 0 4px 14px rgba(12, 35, 64, 0.1);

	/* Shape & type — official, not bubbly */
	--ar-radius: 6px;
	--ar-radius-sm: 4px;
	--ar-radius-xs: 3px;
	--ar-radius-pill: 4px;
	--ar-font: "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
	--ar-font-display: "El Messiri", "Noto Sans Arabic", sans-serif;
	--ar-font-mono: "IBM Plex Mono", Consolas, monospace;

	/* Layout */
	--ar-header-height: 48px;
	--ar-container: 1120px;
	--ar-transition: 0.2s ease;
	--ar-space-section: clamp(2.5rem, 5vw, 4rem);

	/* Alert */
	--ar-alert-bg: var(--ar-ink);
	--ar-alert-text: #E8EEF5;

	/* Hero */
	--ar-hero-from: #0C2340;
	--ar-hero-via: #12324F;
	--ar-hero-to: #1B4F72;

	/* Typography tokens */
	--ar-heading: var(--ar-ink);
	--ar-link: var(--ar-teal);
	--ar-link-hover: var(--ar-teal-dark);
}

[data-theme="dark"] {
	--ar-bg: #0A1018;
	--ar-bg-muted: #121A24;
	--ar-card: #151E2A;
	--ar-text: #E8EEF5;
	--ar-text-muted: #9AA8B8;
	--ar-heading: #F4F7FA;
	--ar-link: #7EB3D4;
	--ar-link-hover: #A8CDE4;
	--ar-border: #243041;
	--ar-border-strong: #354659;
	--ar-ink-soft: #1A334D;
	--ar-secondary-light: #7EB3D4;
	--ar-teal-dark: #7EB3D4;
	--ar-teal-soft: rgba(126, 179, 212, 0.14);
	--ar-gold-soft: rgba(176, 141, 87, 0.2);
	--ar-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
	--ar-shadow-md: 0 2px 8px rgba(0, 0, 0, 0.35);
	--ar-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4);
	--ar-shadow-hover: 0 4px 14px rgba(0, 0, 0, 0.4);
	--ar-alert-bg: #071628;
	--ar-alert-text: #D8E2EC;
	--ar-hero-from: #060D14;
	--ar-hero-via: #0C1A28;
	--ar-hero-to: #14324A;
	color-scheme: dark;
}

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

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--ar-font);
	font-size: 16px;
	line-height: 1.7;
	color: var(--ar-text);
	background-color: var(--ar-bg);
	background-image:
		radial-gradient(ellipse 80% 50% at 100% 0%, rgba(27, 79, 114, 0.06), transparent 55%),
		radial-gradient(ellipse 60% 40% at 0% 100%, rgba(176, 141, 87, 0.05), transparent 50%),
		repeating-linear-gradient(
			0deg,
			transparent,
			transparent 23px,
			rgba(12, 35, 64, 0.015) 23px,
			rgba(12, 35, 64, 0.015) 24px
		);
	background-attachment: fixed;
	direction: rtl;
	text-align: right;
	-webkit-font-smoothing: antialiased;
}

[data-theme="dark"] body {
	background-image:
		radial-gradient(ellipse 70% 45% at 100% 0%, rgba(126, 179, 212, 0.06), transparent 55%),
		repeating-linear-gradient(
			0deg,
			transparent,
			transparent 23px,
			rgba(255, 255, 255, 0.015) 23px,
			rgba(255, 255, 255, 0.015) 24px
		);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--ar-link);
	text-decoration: none;
	transition: color var(--ar-transition);
}

a:hover {
	color: var(--ar-link-hover);
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--ar-font-display);
	font-weight: 600;
	line-height: 1.35;
	color: var(--ar-heading);
	margin: 0 0 0.5em;
}

p {
	margin: 0 0 1em;
}

ul, ol {
	margin: 0 0 1em;
	padding-inline-start: 1.25rem;
}

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

:focus-visible {
	outline: 2px solid var(--ar-teal);
	outline-offset: 2px;
}

.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;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link:focus {
	clip: auto;
	clip-path: none;
	height: auto;
	width: auto;
	z-index: 100000;
	background: var(--ar-ink);
	color: #fff;
	padding: 0.75rem 1rem;
	inset-inline-start: 1rem;
	top: 1rem;
}