/**
 * Brmgina supplemental stylesheet entry (Phase 7 build).
 * Legacy rules remain in style.css / style-rtl.css until full migration.
 *//**
 * Shared breakpoint tokens (align with Bootstrap 5).
 */
:root {
	--brmgina-bp-sm: 576px;
	--brmgina-bp-md: 768px;
	--brmgina-bp-lg: 992px;
	--brmgina-bp-xl: 1200px;
	--brmgina-bp-xxl: 1400px;
}
/**
 * Motion preferences and hover-capable devices.
 */

@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;
	}

	.animate__animated {
		animation: none !important;
	}
}

@media (hover: hover) and (pointer: fine) {
	.projectHolder .img .projectIcons {
		display: none;
	}

	.projectHolder .img:hover .projectIcons {
		display: flex;
	}
}

/**
 * Global overflow containment (Phase 7.6).
 */

html {
	overflow-x: clip;
}

body {
	overflow-x: clip;
	max-width: 100%;
}

.mainHeader,
.mainFooter,
.normalBlock,
.popUpHolder {
	max-width: 100%;
}

/**
 * Header / top bar responsive behavior (Phase 7.10).
 */

@media (max-width: 767px) {
	.topBar .container {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}

	.topBar .row {
		flex-wrap: nowrap;
		min-width: min(100%, 36rem);
	}

	.mainContectItems {
		flex-wrap: nowrap;
		justify-content: center;
		gap: 0.5rem;
	}

	.mainContectItems .contactItem {
		white-space: nowrap;
		flex-shrink: 0;
	}
}

/**
 * Contact Form 7 responsive fields (Phase 7.9).
 */

@media (max-width: 767px) {
	.wpcf7 form .wpcf7-form-control-wrap,
	.wpcf7 form input:not([type='checkbox']):not([type='radio']):not([type='submit']):not([type='button']):not([type='hidden']),
	.wpcf7 form select,
	.wpcf7 form textarea {
		width: 100%;
		max-width: 100%;
	}

	.wpcf7 form .wpcf7-list-item-label {
		display: inline-block;
		max-width: 100%;
	}
}

@media (max-width: 575px) {
	.oneFieldForm .button {
		position: static;
		width: 100%;
		margin-top: 0.5rem;
		border-radius: 10px;
	}

	.oneFieldForm .inputHolder.txt input {
		border-radius: 10px;
	}
}

/**
 * Project cards — touch vs hover (Phase 7.12 complements 6.13).
 */

@media (max-width: 991px) {
	.projectHolder .img .projectIcons {
		display: flex;
	}
}

@media (hover: none), (pointer: coarse) {
	.projectHolder .img .projectIcons {
		display: flex;
	}
}

/**
 * Service programming levels — horizontal scroll on narrow viewports (Phase 7.8).
 */

.brmgina-service-levels {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

.brmgina-service-levels > .row {
	min-width: min(100%, 48rem);
}

@media (min-width: 992px) {
	.brmgina-service-levels {
		overflow-x: visible;
	}

	.brmgina-service-levels > .row {
		min-width: 0;
	}
}

/**
 * Front page spacing tweaks (Phase 7 pages layer).
 */

@media (max-width: 767px) {
	.frontPage .pageHeader {
		padding-bottom: 6rem;
	}
}

/**
 * Phase 5 — i18n: semantic color aliases, language fonts, RTL/LTR hooks.
 */

:root {
	--brmgina-color-primary: var(--e-global-color-primary);
	--brmgina-color-secondary: var(--e-global-color-secondary);
	--brmgina-color-text: var(--e-global-color-text);
	--brmgina-color-accent: var(--e-global-color-accent);
	--brmgina-color-white: var(--e-global-color-white);
	--brmgina-color-accent2: var(--e-global-color-accent2);
	--brmgina-color-orange: var(--e-global-color-orange);
	--brmgina-color-orange-lite: var(--e-global-color-orange-lite);
	--brmgina-color-primary2: var(--e-global-color-primary2);
	--brmgina-color-accent-lite: var(--e-global-color-accent-lite);
	--brmgina-color-primary-lite: var(--e-global-color-primary-lite);
	--brmgina-color-blue: var(--e-global-color-blue);
	--brmgina-color-blue-lite: var(--e-global-color-blue-lite);
	--brmgina-gradient-button: var(--e-global-gradient-button);
}

/* English UI font — loaded only when LTR stylesheet is enqueued. */

html[lang="ar"] body,
body.lang-ar {
	font-family: 'Noto Kufi Arabic', sans-serif;
}

html[lang="en"] body,
body.lang-en {
	font-family: 'Source Sans 3', 'Segoe UI', sans-serif;
}

/* Logical spacing for share links and inline actions (Phase 5.9 sample). */
.shareLinks .shareTxt {
	margin-right: 0.35rem;
}

.inlineLinks a {
	margin-right: 0.35rem;
}

.inlineLinks a:last-child {
	margin-right: 0;
}

.inlineLinks i {
	margin-right: 0.65rem;
}

/**
 * Screen reader and skip link utilities (Phase 6/7).
 */

.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;
}

.screen-reader-text:focus,
.skip-link:focus {
	background-color: var(--e-global-color-white);
	clip: auto !important;
	clip-path: none;
	color: var(--e-global-color-primary);
	display: block;
	font-size: 1rem;
	font-weight: 600;
	height: auto;
	left: 0.5rem;
	line-height: normal;
	padding: 0.75rem 1rem;
	-webkit-text-decoration: none;
	text-decoration: none;
	top: 0.5rem;
	width: auto;
	z-index: 100000;
}

.brmgina-map-embed iframe {
	border: 0;
	height: min(500px, 60vh);
	width: 100%;
}

.navBarToggle {
	border: none;
	font: inherit;
}

.toTop {
	border: none;
	font: inherit;
	padding: 0;
}

.projectIcons button.link {
	border: none;
	font: inherit;
}

.popUpHolder .popUp .closePopUp {
	font: inherit;
	padding: 0;
}

.brmgina-inline-start {
	margin-left: 0.5rem;
}

.brmgina-inline-end {
	margin-right: 0.5rem;
}