/*
 * consent.css — באנר הסכמת העוגיות.
 *
 * צורך את הטוקנים של התבנית, עם ערכי נפילה בכל var().
 */

/*
 * ⚠ position: fixed ו-z-index גבוה, ולא רק עיצוב.
 *
 * התבנית מציירת את האספלט בשלוש שכבות fixed (‎.at-road‎ ואחיותיה).
 * אלמנט בזרימה הרגילה נצבע מתחתן ופשוט לא נראה — הבאג שהפיל את פס
 * הפוטר. הערך כאן גבוה גם מהכותרת הדביקה (100), כי באנר הסכמה
 * שנחתך מאחורי הכותרת אינו הסכמה.
 */
.at-consent {
	position: fixed;
	inset-block-end: 0;
	inset-inline: 0;
	z-index: 1000;
	border-top: 1px solid var(--border, rgba(255, 255, 255, .09));
	background: var(--bg-raised, #1b1f26);
	box-shadow: 0 -8px 28px -12px rgba(0, 0, 0, .8);
}

.at-consent[hidden] {
	display: none;
}

/*
 * ⚠ justify-content: center ו-flex עם flex-grow: 0 על הטקסט.
 *
 * המטרה: הכפתור צמוד לסוף הטקסט ולא נדחק לקצה המסך. עם
 * space-between הוא היה עף לפינה הנגדית, ובמסך רחב נוצר ביניהם
 * חלל ריק של חצי מסך.
 *
 * הרוחב המורחב אינו קישוט — הוא מה שמקצר את הבאנר: אותו טקסט
 * בשורות ארוכות יותר תופס פחות שורות, והבאנר נמוך יותר וחוסם
 * פחות תוכן.
 */
.at-consent__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--space-s, 1rem);
	max-width: 88rem;
	margin-inline: auto;
	padding: var(--space-2xs, .5rem) var(--space-m, 1.5rem);
}

.at-consent__copy {
	flex: 0 1 auto;
	min-width: 0;
}

.at-consent__title {
	margin: 0 0 .15rem;
	font-size: var(--step-0, 1.08rem);
	font-weight: 700;
	line-height: var(--leading-tight, 1.15);
}

/* הכותרת כאן לא מקבלת את קו המדידה שמעל כותרות באתר — הבאנר הוא
   ממשק, לא פרק תוכן. */
.at-consent__title::before {
	content: none;
}

/* ⚠ max-width: none דורס את הכלל הגלובלי ‎p { max-width: var(--measure) }‎
   של התבנית, שמגביל פסקאות ל-~65 תווים לקריאוּת. בבאנר זה הפוך:
   שורה ארוכה חוסכת שורות, והבאנר נמוך יותר. */
.at-consent__text {
	max-width: none;
	margin: 0;
	font-size: var(--step--1, .92rem);
	line-height: var(--leading-snug, 1.35);
	text-align: center;
	text-wrap: pretty;
	color: var(--text-muted, #a7b0bf);
}

.at-consent__text a {
	color: var(--accent, #f5cf45);
}

.at-consent__text strong {
	color: var(--text, #eef1f7);
}

/* ── הכפתור ──
   כפתור יחיד ("הבנתי, תודה.") לפי החלטת בעל האתר. המחלקה נשארה
   רבים־בטוחה: אם תוחזר בעתיד אפשרות דחייה, שני הכפתורים יקבלו
   מראה זהה בלי שינוי CSS — וזה מה שהדין דורש כשיש בחירה. */
.at-consent__actions {
	display: flex;
	flex: none;
	gap: var(--space-2xs, .5rem);
}

/* מחלקת האב מנצחת את reset.css של hello-elementor, שמגדיר
   [type=button] בספציפיות זהה למחלקה בודדת ונטען אחרינו. */
/*
 * ⚠ הירוק מוגדר כאן ולא נלקח מהטוקנים, וזו חריגה מודעת.
 *
 * למערכת העיצוב אין ירוק: ‎--sig-ok‎ הוא כחול, והצהוב (‎--accent‎)
 * שמור לאינטראקציה. הירוק כאן הוא בקשה מפורשת של בעל האתר לבאנר
 * הזה בלבד. אם ייווסף ירוק סמנטי לטוקנים — להחליף בו.
 *
 * הגוון נבחר לניגודיות: ‎#2e9e5b‎ עם טקסט לבן נותן יחס של כ-4.6:1,
 * מעל סף 4.5:1 לטקסט רגיל.
 */
.at-consent .at-consent__btn {
	flex: none;
	padding: .55rem 1.6rem;
	font-family: inherit;
	font-size: var(--step--1, .92rem);
	font-weight: 700;
	white-space: nowrap;
	color: #fff;
	background: #2e9e5b;
	border: 1px solid #2e9e5b;
	border-radius: var(--radius-m, 8px);
	cursor: pointer;
	transition:
		background-color var(--dur-fast, .15s) var(--ease-out, ease),
		border-color var(--dur-fast, .15s) var(--ease-out, ease);
}

.at-consent .at-consent__btn:hover {
	background: #268a4e;
	border-color: #268a4e;
}

/* ⚠ טבעת הפוקוס לבנה ולא בצהוב האקצנט: על כפתור ירוק מלא הצהוב
   נקרא כמסגרת דקורטיבית שגויה ולא כסימון מקלדת. לבן על ירוק
   נותן ניגודיות טובה יותר וברור יותר כמה הוא סימון ולא עיצוב. */
.at-consent .at-consent__btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

@media (max-width: 40rem) {
	.at-consent__inner {
		flex-direction: column;
		align-items: stretch;
		gap: var(--space-s, 1rem);
	}

	.at-consent__actions {
		width: 100%;
	}

	/* שווים ברוחב גם בצר — שוב, דרישה ולא העדפה */
	.at-consent .at-consent__btn {
		flex: 1 1 0;
		min-width: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.at-consent .at-consent__btn {
		transition: none;
	}
}