/* ═══ purchase-drawer.css — מגירת-הרכישה בנייח (דף-מרכז) ═══════════════════
   פיגמה: Cart · Desktop, section «פלואו כרטיסים רגיל» (2412:98987).
   שכבת-הצגה בלבד מעל הרכיב המשותף purchase-form — לא נוגעת בזרימה עצמה.

   ההסכם (אסף, 18/08):
   · בחירת-כרטיסים ומסכי-הסיום — מגירה ברוחב 500, צמודה לשמאל, גובה מלא.
   · פרטים / תשלום — המגירה מתרחבת ל-1000: הטופס משמאל, סיכום-ההזמנה מימין.
   · ה-X יושב **מחוץ** לטופס, על ההחשכה, בצמוד לקצה המגירה.

   נדלק רק כשהמארח מוסיף body.pf-drawer-mode — דף-מרכז מוסיף אותה בנייח בלבד
   (purchase-drawer.js); במובייל הגיליון-מלמטה הקיים נשאר כמו שהוא. */

body.pf-drawer-mode .popup-overlay#formPopup{
  align-items:stretch;
  justify-content:flex-start;   /* RTL: flex-start = ימין; המגירה נדחפת שמאלה ב-margin */
}
body.pf-drawer-mode #formPopup .form-container{
  margin-right:auto;            /* מצמיד לשמאל בלי לשנות את כיוון-המסמך */
  width:min(500px, 100vw);
  height:100%;
  border-radius:0 32px 32px 0;  /* אין טוקן-רדיוס 32 (2xl=24) — מידה מהפיגמה. פינות 32 בקצה החיצוני (ימין) — פיגמה FormContainer נייח (אסף 18/08) */
  overflow:hidden;
  transform:translateX(-100%);  /* נכנסת מהשמאל */
  transition:transform .35s cubic-bezier(.32,.72,0,1),
             width .35s cubic-bezier(.4,0,.2,1);
}
body.pf-drawer-mode #formPopup.open .form-container{transform:translateX(0);}

/* פס-הגרירה של הגיליון — שייך למובייל; במגירה אין מה לגרור */
body.pf-drawer-mode #formPopup #pfGrab{display:none;}

/* ── המצב הרחב — פרטים / תשלום (1000) ─────────────────────────────────────
   הווים (viewDetails וכו') הם ילדים ישירים של המכל, בפריסת-עמודה. במצב הרחב
   הכותרת ומד-ההתקדמות נשארים על כל הרוחב; הוויו הפעיל מוצמד לטור-שמאל (500),
   וטור-הסיכום יושב מוחלט על החצי הימני. */
body.pf-drawer-mode #formPopup .form-container.pf-wide{width:min(1000px, 100vw);}

body.pf-drawer-mode #formPopup .form-container.pf-wide > .form-scroll,
body.pf-drawer-mode #formPopup .form-container.pf-wide > .view-pay,
body.pf-drawer-mode #formPopup .form-container.pf-wide > .credits-view{
  width:500px;
  margin-right:auto;            /* RTL: נדחף לשמאל המכל */
}
/* במצב הרחב הרצועה נמתחת על כל המגירה; הצהוב נשאר בטור-הטופס (שמאל),
   והעיגול-חזרה בקצה הרחוק — כמו בפיגמה (מסכים 2–4) */
body.pf-drawer-mode #formPopup .form-container.pf-wide > .actionbar{
  left:0;right:0;width:auto;
}

/* ── טור סיכום-ההזמנה (נבנה ב-purchase-drawer.js) ─────────────────────────── */
#pfDrawerSide{
  display:none;
  position:absolute;top:96px;bottom:0;right:0;
  width:calc(100% - 500px);
  /* ריפוד-עליון 24 — ראש הכרטיס מיושר לגובה ראש-התוכן של הטופס (אסף 21/08: «שניהם באותו גובה») */
  padding:var(--space-xl,24px) 24px 40px 8px;
  overflow-y:auto;
  flex-direction:column;gap:16px;
}
#pfDrawerSide::-webkit-scrollbar{display:none;}
body.pf-drawer-mode #formPopup .form-container.pf-wide #pfDrawerSide{display:flex;}
#pfSideCards{display:flex;flex-direction:column;gap:12px;}
#pfSideCards .cart-card{width:100%;max-width:100%;box-sizing:border-box;}
#pfDrawerSide{overflow-x:hidden;}

/* כרטיסי-הסל בתוך הטור — אותו רכיב משותף (cart-cards.js), רק רקע לבן ומסגרת */
#pfDrawerSide .cart-card{background:#fff;}

/* שורת «סיכום הזמנה» — פיגמה: אייקון עגול אפור + כותרת + מטא + סכום גדול */
.pf-side-grand{
  display:flex;align-items:center;gap:12px;
  padding:4px 8px;
}
.pf-side-grand__icon{
  width:44px;height:44px;border-radius:100px;flex:none;
  background:var(--tl-color-bg-surface-inv);
  display:flex;align-items:center;justify-content:center;
}
.pf-side-grand__icon img{width:22px;height:22px;display:block;}
.pf-side-grand__titles{flex:1;min-width:0;}
.pf-side-grand__title{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:16px;
  color:var(--tl-color-text-inverse-default,#000);
}
.pf-side-grand__meta{
  font-family:'Google Sans','Rubik',sans-serif;font-size:12px;
  color:var(--tl-color-text-inverse-subtle,#6b6b6b);
}
.pf-side-grand__total{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:22px;
  color:var(--tl-color-text-inverse-default,#000);
  white-space:nowrap;
}

/* ── ה-X שמחוץ לטופס ──────────────────────────────────────────────────────── */
#pfDrawerClose{
  position:absolute;top:16px;
  /* צמוד לקצה הימני של המגירה, בחוץ. left מחושב ב-JS לפי רוחב המגירה
     כדי שילווה את ההתרחבות באותה אנימציה. */
  left:516px;
  width:44px;height:44px;border-radius:100px;border:none;cursor:pointer;
  background:#fff;color:var(--tl-color-text-inverse-default);
  display:none;align-items:center;justify-content:center;
  box-shadow:0 2px 12px rgba(0,0,0,0.18);
  transition:left .35s cubic-bezier(.4,0,.2,1), opacity .2s;
  z-index:2;
}
#pfDrawerClose:hover{background:#f2f2f2;}
#pfDrawerClose svg{width:18px;height:18px;display:block;}
/* מגירת-הסל פתוחה מעל הטופס ⇒ הכפתור הצף הוא «חזרה» (חץ), לא X (אסף 21/08).
   ההחלפה מונפשת («שמבינים שיש שינוי»): היוצא מסתובב ומתכווץ, הנכנס מסתובב
   פנימה עם קפיצה קטנה, והכפתור עצמו נושם. שני האייקונים יושבים זה על זה. */
#pfDrawerClose{position:absolute;}
#pfDrawerClose .pfx-x, #pfDrawerClose .pfx-back{
  position:absolute;top:13px;left:13px;
  transition:transform .42s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
#pfDrawerClose .pfx-x{transform:rotate(0) scale(1);opacity:1;}
#pfDrawerClose .pfx-back{transform:rotate(-120deg) scale(.3);opacity:0;}
#pfDrawerClose.pf-back-mode .pfx-x{transform:rotate(120deg) scale(.3);opacity:0;}
#pfDrawerClose.pf-back-mode .pfx-back{transform:rotate(0) scale(1);opacity:1;}
#pfDrawerClose.pf-swap{animation:pfxBreath .45s cubic-bezier(.34,1.56,.64,1);}
@keyframes pfxBreath{0%{scale:1;}40%{scale:1.18;}100%{scale:1;}}
@media(prefers-reduced-motion:reduce){
  #pfDrawerClose .pfx-x, #pfDrawerClose .pfx-back{transition:opacity .15s;}
  #pfDrawerClose.pf-swap{animation:none;}
}
body.pf-drawer-mode #formPopup.open #pfDrawerClose{display:flex;}
body.pf-drawer-mode #formPopup.open #pfDrawerClose.pf-wide{left:1016px;}

/* ── סרגל-הפעולה בנייח — device=desktop, entry=direct (פיגמה 154:2892) ──────
   «המשך» צהוב (עד 480) בצד אחד, עיגול-חזרה כחלחל-שקוף בצד השני. אין
   «להמשיך בקניות» — אסף, 18/08: «בנייח חייב זה». */
/* רצועת-הזכוכית של הנייח — מלבן מקצה-לקצה בתחתית המגירה, באותו אפקט-זכוכית
   של הסרגל; רק הצורה השתנתה (אסף 18/08: «מלבן רוחב גמיש עד סוף קצה —
   אבל המלבן הוא זכוכית!»). הצהוב שבפנים נשאר גלולה. */
body.pf-drawer-mode #formPopup .form-container > .actionbar{
  /* !important — כי לדף-מרכז יש חוק ‎#formPopup .actionbar{bottom:max(16px,…)!important}‎
     שמרים את הגלולה של המובייל; במגירה הרצועה צמודה לתחתית ממש. */
  bottom:0 !important;left:0;right:0;
  border-radius:0;
  padding:var(--space-lg);
  box-shadow:0 -6px 24px rgba(0,0,0,0.06);
}
body.pf-drawer-mode #formActionbar .actionbar__inner{
  display:flex;gap:12px;align-items:center;justify-content:space-between;
}
body.pf-drawer-mode #formActionbar .actionbar__cta{flex:1;min-width:0;max-width:480px;}
/* חץ-חזרה: אין כזה בפיגמה במסך-הבחירה (אסף 18/08) — היציאה היא ה-X.
   במצב הרחב (פרטים/תשלום) הפיגמה כן מציגה עיגול-חזרה, בפינת המגירה. */
body.pf-drawer-mode #formActionbar #formAbBack{display:none;}
/* במצב הרחב העיגול חי בתוך שורת-הסרגל, בקצה הימני (פיגמה: back ב-x=924,
   ה-CTA משמאל) — פריט-פלקס רגיל, לא מיקום-מוחלט שנחתך ב-overflow */
body.pf-drawer-mode .form-container.pf-wide #formActionbar #formAbBack{
  display:flex;align-items:center;justify-content:center;
  position:static;
  width:44px;height:44px;min-width:44px;border-radius:100px;border:none;
  background:var(--color-slate-alpha-25, rgba(61,105,140,0.25));
  order:2;                     /* אחרי ה-CTA בשורה */
}
/* בשורה הרחבה: «המשך» בצד טור-הטופס (שמאל), העיגול בקצה הרחוק (ימין) */
body.pf-drawer-mode .form-container.pf-wide #formActionbar .actionbar__inner{
  flex-direction:row-reverse;  /* RTL: הופך — ה-CTA (הילד השני) נוחת שמאלה */
}

/* ── מסך-הפרטים בנייח — הפאנל האפור-כחול והרווחים (פיגמה 2412:99557) ──────
   טור-הטופס יושב בפאנל: רקע Blue-Grays/50, מסגרת Blue-Grays/200, פינות 24.
   שם-פרטי ושם-משפחה — זה-לצד-זה; שאר השדות על כל הרוחב, מרווח 24. */
body.pf-drawer-mode .form-container.pf-wide #viewDetails.active-view{padding-top:0;}
body.pf-drawer-mode .form-container.pf-wide #viewDetails.active-view{display:flex;}
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-scroll{
  background:var(--color-slate-50, #F8FAFC);
  /* בלי קו-מסגרת — בפיגמה לפאנל יש רק רקע (אסף 18/08) */
  border:none;
  border-radius:24px 24px 0 0;      /* הרקע יורד עד סוף המגירה — פינות רק למעלה */
  width:auto;                        /* מבטל את width:100% של המובייל — שומר רווח 16 גם משמאל */
  flex:1;
  margin:0 16px;                     /* בלי מרווח-תחתון: הפאנל נמתח עד למטה, כמו בפיגמה */
  padding:24px 24px 120px;           /* ריווח פנימי לרצועת-«המשך» */
  display:grid;grid-template-columns:1fr 1fr;
  gap:24px 12px;
  align-content:start;
}
/* הכותרת — סגנון heading-modal מהפיגמה: 20 / 120% (תוקן 18/08 לפי האינספקטור).
   בפיגמה הפונט SimplerPro — לא הוחלף כאן כי «שינוי פונט» עוד פתוח ברשימה של אסף. */
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-scroll::before{
  content:'בבקשה למלא פרטים';
  grid-column:1 / -1;
  text-align:center;
  font-family:'Google Sans','Rubik',sans-serif;font-weight:400;   /* משקל רגיל — אסף 18/08 */
  font-size:20px;
  line-height:1.2;
  color:var(--tl-color-text-inverse-default, #000);
}
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-scroll > *{grid-column:1 / -1;}
/* בלי סימוני «* חובה» במגירת-הנייח (אסף 18/08) */
body.pf-drawer-mode #formPopup .lff__required{display:none;}

/* שם-פרטי ושם-משפחה — חצי-חצי (עוגן לפי השדה, לא לפי מיקום ברשימה) */
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-scroll > .lff-wrap:has(#detailsFirstName),
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-scroll > .lff-wrap:has(#detailsLastName){grid-column:auto;}

/* חוצצי-הקו («או» · «עוד קצת עליכם») — קו בכל צד, כמו בפיגמה */
.pf-details-divider{display:none;}
/* מדויק מהפיגמה (2412:99590): קו 150 בכל צד, צבע Blue-Grays/300, רווח 10,
   הטקסט 12 שחור, הכל ממורכז */
body.pf-drawer-mode .form-container.pf-wide #viewDetails .pf-details-divider,
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-section-label{
  grid-column:1 / -1;
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin:0;padding:0;
  font-family:'Google Sans','Rubik',sans-serif;font-size:12px;font-weight:400;
  line-height:16px;
  color:var(--tl-color-text-inverse-default, #000);
  text-align:center;white-space:nowrap;
}
body.pf-drawer-mode .form-container.pf-wide #viewDetails .pf-details-divider::before,
body.pf-drawer-mode .form-container.pf-wide #viewDetails .pf-details-divider::after,
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-section-label::before,
body.pf-drawer-mode .form-container.pf-wide #viewDetails .details-section-label::after{
  content:'';flex:none;width:150px;height:1px;
  background:var(--color-slate-300, #a3c1d6);
}

/* ── בנייח אין פופ-התחברות קופץ ──────────────────────────────────────────
   «רכישה בקלות» הוא דפוס-מובייל (גיליון מלמטה). בנייח ההתחברות יושבת
   בתוך הטופס עצמו (פיגמה, מסך «פרטים»: כפתור Google בראש הטור).
   אסף 18/08: «בפרטים לא צריך קופץ פופ — רק נייח».
   ⚠️ 18/08 (מאוחר יותר): החוק היה display:none על הפופ כולו — וזה חסם גם את
   התחברות-המנוי (מ2/מ3 בפיגמה). עכשיו החסימה ממוקדת: purchase-drawer.js מדלג רק
   על הפתיחה-האוטומטית בפרטים (origin='details'); שאר הפתיחות עובדות. */

/* מסך צר מדי להתרחבות מלאה — המגירה תופסת את מה שיש, וה-X נשאר בפנים-המסך */
@media (max-width:1080px){
  body.pf-drawer-mode #formPopup .form-container.pf-wide{width:calc(100vw - 60px);}
  body.pf-drawer-mode #formPopup.open #pfDrawerClose.pf-wide{left:calc(100vw - 44px - 8px);}
}

/* ── פינות המגירה: 32 בקצה החיצוני (ימין) בלבד — פיגמה FormContainer נייח (אסף 18/08).
   בגיליון-המובייל הפינות למעלה (32 32 0 0); במגירה הן עוקבות אחרי המכל. ── */
body.pf-drawer-mode #viewComplete.is-v2-active,
body.pf-drawer-mode .form-container.pf-receipt .t-header{
  border-radius:0 32px 32px 0;
}

/* ── כותרת-המגירה + מד-ההתקדמות — רווחים לפי פיגמה 2412:99262 (אסף 18/08) ──
   בלוק-הכותרת 103 גבוה: כותרת «כרטיסים» Rubik SemiBold 18/20 ב-y=24, ריפוד-ימין 24;
   פסי-ההתקדמות 12 מתחת (y=56), 4 גבוהים, רווח 8, מ-x=116 עד 476;
   כפתור-הסל 44 ב-(24,24); התוכן מתחיל ב-103 + ריפוד 16 = 119. */
body.pf-drawer-mode #formPopup .t-header{top:var(--space-xl,24px);padding-top:0;padding-bottom:0;height:var(--dim-11,44px);min-height:0;}
body.pf-drawer-mode #formPopup #mainPT{
  margin:var(--space-xl,24px) 0 var(--space-xl,24px);padding:0 var(--space-xl,24px);
  transition:margin-bottom .3s cubic-bezier(.2,.8,.2,1);   /* לא קופץ (אסף 18/08) */
}
/* נבחר פריט והשעון רץ → 43 מתחת לפסים (פיגמה 2412:99262) — מקום לגלולת-השעון;
   הסל התרוקן → חוזר ל-24. */
body.pf-drawer-mode #formPopup .form-container.pf-timer-on #mainPT{margin-bottom:43px;}   /* 43 = מידה מהפיגמה (בלוק-כותרת 103), אין לה טוקן */
body.pf-drawer-mode #formPopup #mainPT .pt__label{font-size:18px;line-height:20px;font-weight:600;}
/* הפסים מתחילים מיד אחרי אשכול-הכפתורים (ריפוד-שמאל של המד = 0 — אסף בפיגמה 18/08):
   סל 44 + 24 ריפוד = 68 מעבר לריפוד-24 של המד → x=92 */
body.pf-drawer-mode #formPopup #mainPT .pt__row,
body.pf-drawer-mode #formPopup #mainPT .pt__bars{padding-left:calc(var(--dim-11,44px) + var(--space-xl,24px));}
body.pf-drawer-mode #formPopup .form-container > .form-scroll{padding-top:var(--space-lg,16px);}

/* כפתור-הקופון (אחרי סגירת-הבאנר) יושב ליד הסל: 44+8+44 — הפסים מתחילים ב-146 (פיגמה) */
body.pf-drawer-mode #formPopup .form-container.pf-coupon-on #mainPT .pt__row,
body.pf-drawer-mode #formPopup .form-container.pf-coupon-on #mainPT .pt__bars{padding-left:calc(2*var(--dim-11,44px) + var(--space-sm,8px) + var(--space-xl,24px));}   /* סל 44 + 8 + קופון 44 + 24 → x=146 */
/* הפסים גמישים — כשהקופון נכנס הם מתקצרים ברכות, לא בקפיצה */
body.pf-drawer-mode #formPopup #mainPT .pt__row,
body.pf-drawer-mode #formPopup #mainPT .pt__bars{transition:padding-left .3s cubic-bezier(.2,.8,.2,1);}

/* אחרי התחברות-גוגל הכפתור נעלם — גם ה«או» שאחריו (אסף 18/08: «נשאר ״או״») */

/* ── פופאפ «ניתן למימוש במנוי» בנייח — גיליון-מלמטה בתוך המגירה (פיגמה 2412:93690, אסף 18/08) ──
   הרכיבים הקיימים (cp-sub-overlay + minipopup + sub-card) — רק כיווץ למגירה ומידות:
   רוחב 500 מוצמד-לשמאל, עמעום על המגירה בלבד, גובה לפי תוכן;
   כותרת: ריפוד 24, Rubik Bold 20/100% · רשימה: ריפוד 0/24/24, רווח 24 · תחתית: ריפוד 24, רווח 12, קו-עליון שחור 10%. */
body.pf-drawer-mode .cp-sub-overlay.redeem-popup{
  right:auto;
  width:min(500px, 100vw);
  justify-content:flex-start;
}
body.pf-drawer-mode .cp-sub-overlay.redeem-popup .cp-sub-overlay__content{max-height:calc(100dvh - var(--space-xl,24px));}
body.pf-drawer-mode .redeem-popup .minipopup{
  height:auto;max-height:calc(100dvh - var(--space-xl,24px));
  /* פינות-עליונות של הגיליון (24, טוקן הרכיב) + פינה-ימנית-תחתונה עוקבת אחרי המגירה (32, אין טוקן) — אסף 18/08 */
  border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 32px 0;
}
body.pf-drawer-mode .redeem-popup .mp-handle{display:none;}   /* בנייח אין פס-גרירה (אסף 18/08) */
body.pf-drawer-mode .redeem-popup__header{
  gap:var(--space-lg,16px);
  padding:var(--space-xl,24px);
}
body.pf-drawer-mode .redeem-popup__title{line-height:1;}
body.pf-drawer-mode .cp-sub-overlay .redeem-popup__list{
  padding:0 var(--space-xl,24px) var(--space-xl,24px);
  gap:var(--space-xl,24px);
}
body.pf-drawer-mode .redeem-popup__footer{
  padding:var(--space-xl,24px);
  gap:var(--space-md,12px);
  border-top:1px solid var(--color-black-alpha-10, rgba(0,0,0,0.1));
}
body.pf-drawer-mode .redeem-popup .minipopup{max-width:none;width:100%;}   /* המיני-פופ מוגבל ל-375 בנייח — כאן ממלא את המגירה (500) */
body.pf-drawer-mode .redeem-popup .sub-card--guest .sub-card__badges{display:none;}   /* אורח (2412:93690): בלי תגית «סדרה פתוחה»; מחובר (110:129655): עם */

/* ⚡ ביצועים (אסף 18/08 «הדף נהיה איטי»): מצבים כמו שעון-רץ / קופון-גלוי / פרטים-מוצגים / קבלה
   מסומנים במחלקות ע"י purchase-drawer.js (pf-timer-on · pf-coupon-on · pf-details-shown · pf-receipt) —
   לא ב-:has(), שגרם לחישוב-סגנון של כל הדף בכל שנייה של השעון. */

/* ── פופ-ההתחברות (התחברות → מסרון) בנייח — אותה זרימה מהנייד, מוצמדת למגירה
   (פיגמה מ2 2412:93691 · מ3 2412:94015, אסף 18/08): גיליון-מלמטה 500 בתוך המגירה,
   עמעום על המגירה בלבד, בלי פס-גרירה, פינות 24 למעלה, כותרת + X (32) בשורת-הראש. ── */
body.pf-drawer-mode .auth-overlay{right:auto;width:min(500px,100vw);}
body.pf-drawer-mode .auth-popup{
  left:0;width:min(500px,100vw);
  transform:translateY(100%);
}
body.pf-drawer-mode .auth-popup.open{transform:translateY(0);}
body.pf-drawer-mode .auth-handle{display:none;}
body.pf-drawer-mode .auth-handle ~ .pf-auth-head{margin-top:0;}
/* שאר סגנון-הגיליון (שורת-ראש, סדר, ריפודים) — משותף, ב-purchase-form.css. נייח: תחתית 40 (24+16), פינה עוקבת אחרי המגירה */
body.pf-drawer-mode .auth-popup-sheet,
body.pf-drawer-mode .auth-otp-sheet{
  border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 32px 0;
  padding-bottom:calc(var(--space-xl,24px) + var(--space-lg,16px));
}
/* גיליון-המסרון (מ3): למטה 16 בלבד — לגיליון עצמו אין ריפוד-תחתון בפיגמה, רק לגוף */
body.pf-drawer-mode .auth-otp-sheet{padding-bottom:var(--space-lg,16px);}
/* ── התחברות בפרטים (נייח) — לוח בתוך טור-הטופס (פיגמה «פלואו סוגי הרשמה» 2412:98662,
   מסך 1: 2612:174071). purchase-drawer.js מעביר את #authPopup לתוך .details-scroll ומדליק
   body.pf-auth-inline; כאן: הפופ הופך סטטי, ההחשכה נעלמת, ושדות-הטופס מוסתרים עד שמתחברים
   או בוחרים «אורח». (אסף 19/08) ── */
body.pf-drawer-mode.pf-auth-inline .auth-overlay{display:none !important;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .details-scroll > *:not(.auth-popup){display:none !important;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .details-scroll::before{display:none;}   /* «בבקשה למלא פרטים» — רק אחרי ההתחברות */
body.pf-drawer-mode.pf-auth-inline #viewDetails .details-scroll > .auth-popup{
  position:static;grid-column:1 / -1;
  width:100%;max-width:none;left:auto;bottom:auto;z-index:auto;
  transform:none !important;transition:none;
}
/* הגיליון בתוך הפאנל: בלי רקע-לבן ובלי פינות — הפאנל האפור-כחול הוא הרקע (2612:174071) */
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-popup-sheet,
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-otp-sheet{
  background:transparent;border-radius:0;padding:0;
}
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-popup-sheet{gap:24px;}
/* כותרת-הגוף «להתחברות לחשבון» (= auth-subtitle במערכת-הראש המשותפת) — Bold 16, מרכז, כמו 2612:174071 */
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-header{text-align:center;}
/* שורת-הראש («התחברות» + X) שייכת לגיליון-הקופץ — בלוח-הפנימי הטופס כבר בתוך המגירה עם X משלה */
body.pf-drawer-mode.pf-auth-inline #viewDetails .pf-auth-head{display:none;}
/* בלוח-הנייח: Google על רקע לבן (2612:174071); אורח הפך ללינק — נשאר שקוף (אסף 27/08) */
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-google-btn{background:#fff;}
/* גיליון-המסרון בלוח-הנייח (פיגמה 2498:55612): הכותרת («הטסנו אליכם מסרון») בראש הפאנל,
   רווח 16; שאר הגוף (הודעה → קוביות → קישורים → «עדכן מספר») ממורכז אנכית בשטח שנותר, רווח 24.
   הפאנל עצמו נמתח לגובה המגירה — לכן הפופ, ובתוכו הגיליון, ממלאים גובה. */
body.pf-drawer-mode.pf-auth-inline .form-container.pf-wide #viewDetails .details-scroll{display:flex;flex-direction:column;align-content:normal;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .details-scroll > .auth-popup{flex:1;display:flex;flex-direction:column;min-height:0;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-view.active{flex:1;display:flex;flex-direction:column;min-height:0;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-otp-sheet{
  flex:1;min-height:0;padding-bottom:0;gap:var(--space-lg,16px);
  display:flex;flex-direction:column;align-items:center;
}
body.pf-drawer-mode.pf-auth-inline #viewDetails .otp-header{flex:none;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .otp-body{flex:1;justify-content:center;gap:var(--space-xl,24px);}
/* שורת-הקישורים («קוד קולי» · «שלח שוב») — בקצוות, כמו בפיגמה (gap 196 = רוחב מלא) */
body.pf-drawer-mode.pf-auth-inline #viewDetails .otp-actions{width:100%;justify-content:space-between;}
/* «זה לא הטלפון שלי» — רוחב מלא */
body.pf-drawer-mode.pf-auth-inline #viewDetails .otp-change-phone{width:100%;}
/* גם לוח-ההתחברות ולוח-הטעינה: הגיליון בראש, לא ממורכז (2612:174071) */
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-popup-sheet{justify-content:flex-start;}
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-popup-sheet.auth-popup-sheet--loading{flex:1;justify-content:center;}
/* «בודק ומתחבר...» — מרכז הפאנל (2612:175287) */
body.pf-drawer-mode.pf-auth-inline #viewDetails .auth-popup-sheet.auth-popup-sheet--loading{padding:40px 0;}


/* גיליון-הטעינה («התחברות לחשבון המנוי» + ספינר): כלל-המגירה איפס לו את הריפוד-העליון — מחזירים את מידות-הרכיב */
body.pf-drawer-mode .auth-popup-sheet.auth-popup-sheet--loading{
  padding:var(--space-2xl,32px) var(--space-xl,24px) calc(var(--space-2xl,32px) + var(--space-md,12px));
  gap:var(--space-xl,24px);
  align-items:center;
}

/* ── מסך-הקרדיטים («בחרו מספר קרדיטים למימוש») בנייח — פיגמה מ6 2412:95814 (אסף 18/08):
   ריפוד-עליון 16 · ערימת-המנויים 400 במרכז (הכרטיס-האחורי מציץ 33 מעל) · נקודות 16 מתחת · סיכום 16 מתחת ── */
body.pf-drawer-mode #viewCredits > div{padding-top:var(--space-lg,16px) !important;}   /* !important — הריפוד כתוב inline בתבנית */
body.pf-drawer-mode #viewCredits .subs-stack{
  width:400px;max-width:100%;margin-left:auto;margin-right:auto;
  --subs-peek-top:33px;                 /* 33 — מידה מהפיגמה (208 → 263 עם ההצצה+נקודות) */
}
body.pf-drawer-mode #viewCredits .subs-stack-dots{margin-top:0;}   /* רווח-הרשימה (16) כבר מפריד — הנקודות 16 מתחת לכרטיס */

/* ── «תשלום בקרדיטים» בטור-הסיכום (פיגמה 2454:53390): קופסה 38, מסגרת #e2e8f0 (Blue-Grays/100-ish, אין טוקן), רדיוס 12,
   ריפוד 8/16; תווית Rubik 14 subtle · ערך Rubik Bold 14 בירוק-הצלחה. מוצג רק כשמימשו קרדיטים חלקית. ── */
.pf-side-credits{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--space-sm,8px) var(--space-lg,16px);
  border:1px solid var(--color-blue-grays-100,#e2e8f0);
  border-radius:var(--border-radius-lg,12px);
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-size:var(--font-size-body-small,14px);line-height:20px;
  direction:rtl;
}
.pf-side-credits[hidden]{display:none;}
.pf-side-credits__label{color:var(--ta-color-text-subtle,rgba(0,0,0,0.4));}
.pf-side-credits__val{font-weight:var(--font-weight-bold,700);color:var(--tl-color-state-success-main,#465b17);direction:ltr;}

/* ── כרטיס-המשתמש בטור-הסיכום (פיגמה 2448:68665, אסף 18/08 «רק אחרי בפרטים»):
   מסגרת שחור 10%, רדיוס 12, ריפוד 12, רווח 8; שם Rubik Bold 16/20 · פרטים Assistant 12/16 subtle;
   «יש לי קופון» — גלולה 32 עם מסגרת+טקסט בגרדיאנט-הקופון (אדום→כתום), Bold 12, אייקון-מתנה 17. ── */
.pf-side-user{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm,8px);
  padding:var(--space-md,12px);
  border:1px solid var(--ta-color-border-subtle,rgba(0,0,0,0.1));
  border-radius:var(--border-radius-lg,12px);
  direction:rtl;
}
.pf-side-user[hidden]{display:none;}
.pf-side-user__txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-xs,4px);}
.pf-side-user__name{
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-body,16px);line-height:20px;color:var(--ta-color-text-default,#000);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pf-side-user__meta{
  font-family:'Google Sans','Assistant',sans-serif;font-size:var(--font-size-caption,12px);line-height:16px;
  color:var(--ta-color-text-subtle,rgba(0,0,0,0.4));direction:ltr;text-align:right;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pf-side-user__coupon{
  flex:none;height:32px;padding:0 var(--space-lg,16px);
  display:inline-flex;align-items:center;gap:var(--space-xs,4px);
  border-radius:var(--r-full,999px);cursor:pointer;
  background:var(--ta-color-bg-base,#fff);
  border:1px solid transparent;
  /* מסגרת-גרדיאנט: שכבת-רקע כפולה (לבן בפנים, גרדיאנט בקו) */
  background-image:linear-gradient(var(--ta-color-bg-base,#fff),var(--ta-color-bg-base,#fff)),
                   linear-gradient(to right,var(--color-coupon-red,#ee3c5c),var(--color-coupon-orange,#fa6203));
  background-origin:border-box;background-clip:padding-box,border-box;
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-caption,12px);line-height:16px;
}
.pf-side-user__coupon span{
  background:linear-gradient(to right,var(--color-coupon-red,#ee3c5c),var(--color-coupon-orange,#fa6203));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.pf-side-user__coupon img{width:17px;height:17px;display:block;}

/* ── פופאפ «מידע נוסף» בנייח — פיגמה 2425:187337 (אסף 19/08): גיליון 500 בתוך המגירה, בלי פס-גרירה,
   פינות 24; כותרת Bold 20/120% (ריפוד 24); גוף: ריפוד 0/24/24, רווח 24;
   ראש-הכרטיס: מדבקה 104 · תג · שם Rubik Regular 20/120% · מחיר Rubik SemiBold 28/115%;
   בלוקים: כותרת SemiBold 16 · טקסט Regular 16/150% שחור · וידאו 184 r12 · גלריה r8;
   קישורים: שורות 44 (ריפוד 12/0), Regular 16, מפרידים 10%; תחתית 80: «המשך» + «סגור» 220 כ״א, רווח 12. ── */
body.pf-drawer-mode .cp-sub-overlay.info-popup{right:auto;width:min(500px,100vw);justify-content:flex-start;}
body.pf-drawer-mode .info-popup .cp-sub-overlay__content{max-height:calc(100dvh - 76px);}      /* 76 = כותרת-הטופס נשארת גלויה מעל (פיגמה: 948 מתוך 1024) */
body.pf-drawer-mode .info-popup .minipopup{
  height:auto;max-height:calc(100dvh - 76px);
  max-width:none;width:100%;
  border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 32px 0;   /* פינה ימנית-תחתונה עוקבת אחרי המגירה (32, אין טוקן) */
}
body.pf-drawer-mode .info-popup .mp-handle{display:none;}
body.pf-drawer-mode .info-popup__header .mp-title{font-size:var(--font-size-heading-modal,20px);line-height:1.2;}
/* ראש-הכרטיס */
body.pf-drawer-mode .info-popup__cardhead .sticker{width:104px;height:104px;border-radius:var(--r-md,8px);flex:none;}   /* size=lg */
body.pf-drawer-mode .info-popup__ch-title{font-weight:var(--font-weight-regular,400);font-size:var(--font-size-heading-modal,20px);line-height:1.2;}
body.pf-drawer-mode .info-popup__ch-price{gap:0;}
body.pf-drawer-mode .info-popup__ch-price .symbol,
body.pf-drawer-mode .info-popup__ch-price .amount{font-weight:var(--font-weight-semibold,600);font-size:var(--font-size-heading-page,28px);line-height:1.15;}
body.pf-drawer-mode .info-popup__cardhead .tfc__badge--subscription:hover{background:var(--color-yellows-50,#fffceb);}   /* אינפורמטיבי — בלי hover */
/* בלוקים */
body.pf-drawer-mode .info-popup__btitle{font-weight:var(--font-weight-semibold,600);font-size:var(--font-size-body,16px);line-height:1.2;}
body.pf-drawer-mode .info-popup__text{color:var(--tl-color-text-inverse-default,#000);}
body.pf-drawer-mode .info-popup__videobtn{padding-top:0;height:184px;}   /* 184 — מידה מהפיגמה */
/* קישורים */
body.pf-drawer-mode .info-popup__link{font-weight:var(--font-weight-regular,400);}
body.pf-drawer-mode .info-popup__link-icon,body.pf-drawer-mode .info-popup__link-chev{color:var(--tl-color-text-inverse-default,#000);}
/* תחתית: שני כפתורים */
body.pf-drawer-mode .info-popup__footer{
  height:80px;flex:none;padding:0 var(--space-xl,24px);gap:var(--space-md,12px);align-items:center;
  border-top:1px solid var(--color-black-alpha-10,rgba(0,0,0,0.1));
}
body.pf-drawer-mode .info-popup__footer #cpInfoCta{order:2;}
body.pf-drawer-mode .info-popup__footer #cpInfoClose{order:1;}
body.pf-drawer-mode .info-popup__footer #cpInfoClose{display:flex;}   /* מוצג רק בנייח */

/* ── משפחת-הקופון בנייח — אותם פופים מהנייד, רק ברוחב-המגירה (אסף 21/08: «אין הבדלים, רק שינוי רוחב»;
   פיגמה 2412:90641 «פלואו הוספת קופונים» · 2475:165382 «קופון ועד או מועדון»):
   רצועת 500 מוצמדת-שמאל, עמעום על המגירה בלבד, פינה ימנית-תחתונה עוקבת אחרי המגירה (32, אין טוקן). ── */
body.pf-drawer-mode .coupon-popup-overlay,
body.pf-drawer-mode #cpClubOverlay,
body.pf-drawer-mode #cpExtClubOverlay,
body.pf-drawer-mode #cpCodeOverlay{
  right:auto;
  width:min(500px,100vw);
}
body.pf-drawer-mode .coupon-popup-overlay .coupon-popup__body{border-radius:var(--space-xl,24px) var(--space-xl,24px) 32px 0;}
body.pf-drawer-mode #cpClubOverlay .minipopup,
body.pf-drawer-mode #cpExtClubOverlay .minipopup{border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 32px 0;}
body.pf-drawer-mode #cpCodeOverlay .coupon-code-sheet{border-radius:20px 20px 32px 0;}

/* ── «הנה זה» — הבהוב-הקפה על טור-הסיכום כשלוחצים סל והוא כבר מוצג (אסף 21/08) ── */
@keyframes pfSideFlash{
  0%  { box-shadow:0 0 0 0 rgba(255,204,0,0); }
  20% { box-shadow:0 0 0 4px var(--tl-color-brand-main,#ffcc00), 0 8px 32px rgba(255,204,0,.35); }
  60% { box-shadow:0 0 0 4px var(--tl-color-brand-main,#ffcc00), 0 8px 32px rgba(255,204,0,.35); }
  100%{ box-shadow:0 0 0 0 rgba(255,204,0,0); }
}
#pfDrawerSide.pf-side-flash{
  animation:pfSideFlash 1.5s ease-out;
  border-radius:var(--border-radius-xl,16px);
}

/* ── קופון בנייח — השדה + «הפעל» ישר בפופ (פיגמה Coupon/Popup state=default 3536:14683;
   אסף 23/08). במובייל נשאר הכפתור שפותח גיליון. ── */
body.pf-drawer-mode #cpInlineCode{display:flex;align-items:flex-start;gap:var(--space-md,12px);}
body.pf-drawer-mode #cpInlineCode .lff-wrap{flex:1;min-width:0;}
body.pf-drawer-mode #cpInlineCode #cpInlineApply{flex:none;justify-content:center;}
body.pf-drawer-mode #cpOpenCodeSheet{display:none;}

/* ── פופי-המועדון בנייח: נמתחים לרוחב רצועת-ה-500 — משחרר את תקרת-375 הכללית של
   miniPopup במסך רחב (כמו redeem-popup ו-info-popup שכבר עושים זאת). אסף 23/08 ── */
body.pf-drawer-mode #cpClubOverlay .minipopup,
body.pf-drawer-mode #cpExtClubOverlay .minipopup{
  max-width:none;
  width:100%;
}

/* בנייח אין פס-גרירה בפופי-המועדון (כמו redeem/info) — הפס הוא סימן-מובייל */
body.pf-drawer-mode #cpClubOverlay .mp-handle,
body.pf-drawer-mode #cpExtClubOverlay .mp-handle{display:none;}

/* ── רשימת-ההטבות המלאה בנייח (נעמי 27/08) ─────────────────────────────
   בלי זה הגיליון נפרש על כל החלון ונחת בצד-ימין, לצד המגירה — שני לוחות
   זה ליד זה. אותו טיפול כמו «ניתן למימוש במנוי»: רוחב-המגירה, מוצמד לשמאל. */
body.pf-drawer-mode #cpBenefitsOverlay{
  right:auto;
  width:min(500px, 100vw);
  justify-content:flex-start;
}
body.pf-drawer-mode #cpBenefitsOverlay .cp-sub-overlay__content{max-height:calc(100dvh - var(--space-xl,24px));}
body.pf-drawer-mode #cpBenefitsOverlay .minipopup{
  height:auto;max-height:calc(100dvh - var(--space-xl,24px));
  border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 32px 0;
}
body.pf-drawer-mode #cpBenefitsOverlay .mp-handle{display:none;}