/* ==========================================================================
   «تواصل معنا» (includes/contact.php): the contact form inside the Divi page + the social/contact cards' icons.
   ========================================================================== */

/* ---------- Form ---------- */
.yns-cf { display: flex; flex-direction: column; gap: 16px; }
.yns-cf__hp { position: absolute !important; inset-inline-start: -9999px; width: 1px; height: 1px; overflow: hidden; }
.yns-cf__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.yns-cf__field { display: flex; flex-direction: column; gap: 6px; }
.yns-cf__field--full { grid-column: 1 / -1; }
@media (max-width: 767px) { .yns-cf__grid { grid-template-columns: minmax(0, 1fr); } }
.yns-cf__field > span { font-size: 14px; font-weight: 700; color: var(--yn-heading, #1E293B); }
html body .yns-cf input,
html body .yns-cf select,
html body .yns-cf textarea {
	width: 100%;
	min-height: 50px;
	padding: 12px 16px;
	border: 1.5px solid var(--yn-border, #D1D5DB);
	border-radius: 16px;
	background: #FFFFFC;
	color: var(--yn-heading, #1E293B);
	font: inherit;
	font-size: 16px;
	line-height: 1.5;
	box-shadow: 0 1px 0 rgba(30, 41, 59, .03);
	transition: border-color .2s, box-shadow .2s;
}
html body .yns-cf textarea { resize: vertical; min-height: 140px; }
html body .yns-cf input::placeholder, html body .yns-cf textarea::placeholder { color: var(--yn-muted, #69727D); opacity: 1; }
html body .yns-cf input[dir="ltr"] { text-align: right; }
html body .yns-cf select { appearance: none; -webkit-appearance: none; padding-inline-end: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E293B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left 16px center; background-size: 18px; }
html body .yns-cf input:hover, html body .yns-cf select:hover, html body .yns-cf textarea:hover { border-color: rgba(30, 41, 59, .35); }
html body .yns-cf input:focus-visible, html body .yns-cf select:focus-visible, html body .yns-cf textarea:focus-visible { outline: none; border-color: var(--yn-primary, #0258A2); box-shadow: 0 0 0 3px rgba(2, 88, 162, .18); }
html body .yns-cf .yns-cf__submit { align-self: flex-start; min-height: 52px; font-size: 16px; padding-inline: 2em; }
.yns-cf.is-busy .yns-cf__submit { opacity: .7; cursor: progress; }
.yns-cf__msg { margin: 0; padding: 12px 16px; border-radius: 16px; background: #EEF5FC; color: var(--yn-heading, #1E293B); font-size: 15px; line-height: 1.7; }
.yns-cf__msg.is-error { background: #FFF1F0; color: #B42318; }

/* ---------- Icon badges on the contact + social cards (inline SVG from the page) ---------- */
.yn-badge p { display: flex; align-items: center; justify-content: center; margin: 0; }
.yn-badge svg { display: block; width: 26px; height: 26px; }