/*
 * avloon-storefront — forms.css (B23): the native forms (contact, get-it, newsletter, retired stub).
 * Scoped under [data-avs-form], logical properties only (RTL Arabic and LTR /en/ alike), no icon fonts.
 * Parity values come from today's Elementor widgets 1398bc2 (contact), 39be8a7 (get-it), 2f74bad (newsletter)
 * and Elementor Pro's form defaults (field 40 px / 5 px 14 px / radius 3, column gap 10, row gap 10).
 */

[data-avs-form] {
	--avs-f-gap: 10px;
	--avs-f-row: 10px;
	--avs-f-border: #69727d;
	--avs-f-bw: 1px;
	--avs-f-bg: #fff;
	--avs-f-color: #1f2124;
	--avs-f-radius: 3px;
	--avs-f-font: inherit;
	--avs-f-size: 15px;
	--avs-f-weight: inherit;
	--avs-f-h: 40px;
	--avs-btn-h: 40px;
	--avs-label: inherit;
	--avs-label-font: inherit;
	--avs-label-size: inherit;
	--avs-label-weight: inherit;
	--avs-btn-bg: #000;
	--avs-btn-color: #fff;
	--avs-btn-radius: 3px;
	--avs-btn-pad: 0 24px;
	--avs-btn-font: inherit;
	--avs-btn-size: 15px;
	--avs-btn-weight: inherit;
	--avs-btn-border: 0 solid transparent;
	--avs-ok: #5cb85c;
	--avs-err: #d9534f;
	--avs-msg-font: inherit;
	--avs-msg-size: 1em;
	--avs-focus: #000;
	position: relative;
}

[data-avs-form] [hidden] { display: none !important; }

[data-avs-form] .avs-form__form { margin: 0; padding: 0; }

/* Grid: Elementor's flex wrapper with half-gap padding on each group. */
[data-avs-form] .avs-form__fields {
	display: flex;
	flex-wrap: wrap;
	margin-inline: calc(var(--avs-f-gap) / -2);
	margin-block-end: calc(var(--avs-f-row) * -1);
}
[data-avs-form] .avs-form__group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	box-sizing: border-box;
	inline-size: 100%;
	min-block-size: 1px;
	padding-inline: calc(var(--avs-f-gap) / 2);
	margin-block-end: var(--avs-f-row);
}
@media (min-width: 768px) {
	[data-avs-form] .avs-form__col-20 { inline-size: 20%; }
	[data-avs-form] .avs-form__col-25 { inline-size: 25%; }
	[data-avs-form] .avs-form__col-30 { inline-size: 30%; }
	[data-avs-form] .avs-form__col-33 { inline-size: 33.333%; }
	[data-avs-form] .avs-form__col-50 { inline-size: 50%; }
	[data-avs-form] .avs-form__col-70 { inline-size: 70%; }
	[data-avs-form] .avs-form__col-75 { inline-size: 75%; }
	[data-avs-form] .avs-form__col-80 { inline-size: 80%; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	[data-avs-form] .avs-form__col-md-30 { inline-size: 30%; }
	[data-avs-form] .avs-form__col-md-70 { inline-size: 70%; }
}
@media (max-width: 767px) {
	[data-avs-form] .avs-form__col-sm-25 { inline-size: 25%; }
	[data-avs-form] .avs-form__col-sm-75 { inline-size: 75%; }
}

/* Labels. */
[data-avs-form] .avs-form__label {
	flex-basis: 100%;
	display: block;
	margin: 0;
	padding: 0;
	cursor: pointer;
	color: var(--avs-label);
	font-family: var(--avs-label-font);
	font-size: var(--avs-label-size);
	font-weight: var(--avs-label-weight);
}
/* 0.2.1: A's labels kept the theme's label margin (.5rem: 8 px desktop / 7 px on phones; field pitch 85 / 81 px). */
[data-avs-form].avs-form--labels-above .avs-form__label:not(.avs-sr) { margin-block-end: .5rem; }
[data-avs-form] .avs-sr {
	position: absolute !important;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Controls (explicit on every property so theme input styles do not leak in). */
[data-avs-form] .avs-form__input {
	display: block;
	box-sizing: border-box;
	flex-basis: 100%;
	inline-size: 100%;
	max-inline-size: 100%;
	block-size: auto;
	min-block-size: var(--avs-f-h);
	margin: 0;
	padding-block: 5px;
	padding-inline: 14px;
	border: var(--avs-f-bw) solid var(--avs-f-border);
	border-radius: var(--avs-f-radius);
	background: var(--avs-f-bg);
	color: var(--avs-f-color);
	font-family: var(--avs-f-font);
	font-size: var(--avs-f-size);
	font-weight: var(--avs-f-weight);
	line-height: 1.4;
	text-align: start;
	box-shadow: none;
	vertical-align: middle;
	-webkit-appearance: none;
	appearance: none;
}
[data-avs-form] .avs-form__input::placeholder { color: inherit; font-family: inherit; opacity: .6; }
[data-avs-form] .avs-form__input:focus { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1); outline: 0; }
[data-avs-form] .avs-form__input:focus-visible { outline: 2px solid var(--avs-focus); outline-offset: 2px; }
[data-avs-form] .avs-form__input[aria-invalid="true"] { border-color: var(--avs-err); }
[data-avs-form] .avs-form__textarea { min-block-size: 0; resize: vertical; }
[data-avs-form] input[type="number"].avs-form__input { -moz-appearance: textfield; }
[data-avs-form] input[type="tel"].avs-form__input,
[data-avs-form] input[type="email"].avs-form__input,
[data-avs-form] input[type="url"].avs-form__input { direction: inherit; }

[data-avs-form] .avs-form__select { position: relative; display: flex; flex-basis: 100%; inline-size: 100%; }
[data-avs-form] .avs-form__select .avs-form__input { padding-inline-end: 30px; cursor: pointer; }
[data-avs-form] .avs-form__caret {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: 10px;
	transform: translateY(-50%);
	display: flex;
	color: var(--avs-f-color);
	pointer-events: none;
}

/* 0.2.1 PG-11: as A's Elementor upload field — a white rounded box holding the browser's own file button
   (34 px at 15 px, measured 385–1054 × 883–916 at 1440); the button keeps the browser default look. */
[data-avs-form] .avs-form__file {
	display: block;
	box-sizing: border-box;
	flex-basis: 100%;
	inline-size: 100%;
	margin: 0;
	padding: 0;
	background: var(--avs-f-bg);
	border: 0;
	border-radius: var(--avs-f-radius);
	color: var(--avs-f-color);
	font-family: var(--avs-f-font);
	font-size: var(--avs-f-size);
}
[data-avs-form] .avs-form__file:focus-visible { outline: 2px solid var(--avs-focus); outline-offset: 2px; }

/* Button. */
[data-avs-form] .avs-form__group--submit { align-items: flex-end; }
[data-avs-form] .avs-form__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	box-sizing: border-box;
	min-block-size: var(--avs-btn-h);
	margin: 0;
	padding: var(--avs-btn-pad);
	border: var(--avs-btn-border);
	border-radius: var(--avs-btn-radius);
	background: var(--avs-btn-bg);
	color: var(--avs-btn-color);
	font-family: var(--avs-btn-font);
	font-size: var(--avs-btn-size);
	font-weight: var(--avs-btn-weight);
	line-height: 1;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	cursor: pointer;
	transition: opacity .2s ease;
}
[data-avs-form] .avs-form__button:hover,
[data-avs-form] .avs-form__button:focus { background: var(--avs-btn-bg); color: var(--avs-btn-color); }
[data-avs-form] .avs-form__button:focus-visible { outline: 2px solid var(--avs-focus); outline-offset: 2px; }
[data-avs-form].avs-form--stretch .avs-form__button { flex-basis: 100%; inline-size: 100%; }
[data-avs-form].is-busy .avs-form__button { opacity: .6; cursor: progress; }

/* Messages (Elementor .elementor-message equivalents) and field errors. */
[data-avs-form] .avs-form__status:empty { display: none; }
[data-avs-form] .avs-form__msg {
	display: flex;
	align-items: center;
	gap: 5px;
	margin: 10px 0 0;
	font-family: var(--avs-msg-font);
	font-size: var(--avs-msg-size);
	line-height: 1.4;
}
[data-avs-form] .avs-form__msg::before {
	content: "";
	flex: none;
	inline-size: 1em;
	block-size: 1em;
	background: currentColor;
	-webkit-mask: var(--avs-msg-icon) center / contain no-repeat;
	mask: var(--avs-msg-icon) center / contain no-repeat;
}
[data-avs-form] .avs-form__msg--ok {
	color: var(--avs-ok);
	--avs-msg-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7.25' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M4.8 8.3l2.1 2.1 4.3-4.6' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
[data-avs-form] .avs-form__msg--err {
	color: var(--avs-err);
	--avs-msg-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='7.25' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M8 4.3v4.6' stroke='%23000' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='11.4' r='1'/%3E%3C/svg%3E");
}
[data-avs-form] .avs-form__caret .avs-form__icon { flex: none; inline-size: 10px; block-size: 6px; }
[data-avs-form] .avs-form__error {
	flex-basis: 100%;
	margin: 4px 0 0;
	color: var(--avs-err);
	font-size: 13px;
	line-height: 1.4;
}

/* Honeypot: off-screen for people, present for bots. */
[data-avs-form] .avs-form__hp {
	position: absolute !important;
	inset-block-start: 0;
	inset-inline-start: 0;
	inline-size: 1px;
	block-size: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
}

/* Contact (1398bc2). */
[data-avs-form].avs-form--contact {
	--avs-f-row: 15px;
	--avs-f-border: #E1E1E1;
	--avs-f-color: #323232;
	--avs-f-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-f-weight: 300;
	--avs-btn-font: "AvloonF", sans-serif;
	--avs-btn-size: 16px;
	--avs-btn-weight: 500;
	--avs-btn-radius: 5px;
	--avs-btn-pad: 8px 30px 10px;
	--avs-ok: #009520;
	--avs-err: #D80000;
	--avs-msg-font: "Readex Pro", sans-serif;
	--avs-msg-size: 18px;
}
@media (max-width: 767px) {
	[data-avs-form].avs-form--contact { margin-block-start: 25px; }
}
/* 0.2.1 PG-12: A's text fields are 43 px tall from 768 px (40 px on phones) and its buttons 42 px (contact, get-it). */
[data-avs-form].avs-form--contact,
[data-avs-form].avs-form--get-it { --avs-btn-h: 42px; }
@media (min-width: 768px) {
	[data-avs-form].avs-form--contact,
	[data-avs-form].avs-form--get-it { --avs-f-h: 43px; }
}

/* Get it with Avloon (39be8a7). */
[data-avs-form].avs-form--get-it {
	--avs-f-border: #DCDCDC;
	--avs-f-radius: 5px;
	--avs-f-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-label: #878787;
	--avs-label-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-label-size: 14px;
	--avs-label-weight: 400;
	--avs-btn-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-btn-radius: 5px;
	--avs-btn-pad: 10px 25px;
	--avs-ok: #008D29;
	--avs-err: #D30000;
	--avs-msg-font: var(--avs-din, "DINNextLTArabic", sans-serif);
}

/* Footer newsletter (2f74bad): pill field without border, pill button with a grey outline. */
[data-avs-form].avs-form--newsletter {
	--avs-f-gap: 5px;
	--avs-f-bw: 0px;
	--avs-f-radius: 50px;
	--avs-f-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-btn-font: var(--avs-din, "DINNextLTArabic", sans-serif);
	--avs-btn-radius: 50px;
	--avs-btn-pad: 0;
	--avs-btn-border: 1px solid #B7B7B7;
}
[data-avs-form].avs-form--newsletter .avs-form__input { block-size: 35px; }
[data-avs-form] .avs-form__consent {
	margin: 8px 0 0;
	color: #5b6472;
	font-size: 12px;
	line-height: 1.5;
}

/* Retired shipping-address stub. */
[data-avs-form].avs-form--retired { padding-block: 10px; }
[data-avs-form] .avs-form__retired { margin: 0 0 8px; font-size: 16px; }
[data-avs-form] .avs-form__retired-link { margin: 0; }
[data-avs-form] .avs-form__retired-link a { color: inherit; text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
	[data-avs-form] .avs-form__button { transition: none; }
}