/* ═══ purchase-form.css — עיצוב טופס-הרכישה, מקור יחיד ═══════════════════
   חולץ מ-live/רכישת-כרטיסים.html ‏(05/08/2026). נטען אחרי בלוק-הסגנון של
   הדף המארח כדי לשמר את סדר-הדריסה המקורי. ═══════════════════════════ */

/* ===== LAYER 2: POPUP OVERLAY ===== */
.popup-overlay{
  position:fixed;inset:0;z-index:200;
  background:rgba(0,0,0,0.5);
  display:none;align-items:flex-end;justify-content:center;
  opacity:0;transition:opacity .3s;
}
.popup-overlay.open{display:flex;opacity:1;}
.form-container{
  background:#fff;color:var(--tl-color-text-inverse-default,#000);
  border-radius:32px 32px 0 0;
  width:100%;
  height:95%;                   /* 95% of viewport (popup-overlay = inset:0 = full viewport) */
  display:flex;flex-direction:column;
  overflow:hidden;
  position:relative;
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.32,.72,0,1);
}
.popup-overlay.open .form-container{transform:translateY(0);}

/* ===== HEADER (from tickets screen) ===== */
.t-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--space-lg);
  flex-shrink:0;
}
.t-header-icons{display:flex;gap:var(--space-sm);align-items:center;}
.t-icon-btn{
  width:44px;height:44px;min-width:44px;padding:12px;
  border-radius:100px;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  background:var(--tl-color-bg-surface-inv);color:var(--tl-color-text-inverse-default,#000);
  transition:background .2s;
  position:relative;
}
.t-icon-btn:hover{background:rgba(0,0,0,0.1);}
.t-icon-btn .fi{position:relative;overflow:clip;width:20px;height:20px;flex-shrink:0;}
.t-icon-btn .fi>div{position:absolute;}
.t-icon-btn .fi>div>div{position:absolute;}
.t-icon-btn .fi>div>div>img,
.t-icon-btn .fi>div>img{display:block;width:100%;height:100%;}
.t-icon-btn .fi>div>img{position:absolute;inset:0;}
.t-icon-btn.accessibility .fi{width:22px;height:22px;}
.t-icon-btn.accessibility .fi img{filter:brightness(0);}
/* Profile avatar — hidden by default; shown when user is logged in */
.profile-avatar{
  display:none;
  width:100%;height:100%;
  border-radius:100px;
  object-fit:cover;
}
.t-icon-btn.profile-btn.is-logged-in{padding:0;background:transparent;overflow:hidden;}
.t-icon-btn.profile-btn.is-logged-in .fi{display:none;}
.t-icon-btn.profile-btn.is-logged-in .profile-avatar{display:block;}
/* Cart badge */
.t-icon-btn .cart-badge{
  position:absolute;top:2px;left:2px;
  min-width:18px;height:18px;
  border-radius:100px;
  background:var(--tl-color-brand-main);
  color:var(--tl-color-text-inverse-default,#000);
  font-family:'Google Sans','Rubik',sans-serif;
  font-size:10px;font-weight:var(--font-weight-bold);
  display:none;align-items:center;justify-content:center;
  padding:0 4px;
  line-height:1;
}
.t-icon-btn .cart-badge.visible{display:flex;}

/* Coupon button */
.t-icon-btn.coupon{
  background:linear-gradient(to right,var(--color-coupon-red, #ee3c5c),var(--color-coupon-orange, #fa6203));
  padding:9px;
}
.t-icon-btn.coupon .coupon-icon{filter:brightness(0) invert(1);width:26px;height:26px;display:block;}
.t-icon-btn.coupon.is-hidden{
  opacity:0;transform:scale(0);width:0;min-width:0;margin:0;padding:0;
  pointer-events:none;overflow:hidden;
  transition:opacity .3s, transform .3s, width .3s, margin .3s, padding .3s;
}

/* ===== FORM SCROLL AREA ===== */
.form-scroll{
  flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;
  padding:0 var(--space-lg) 120px;
  display:flex;flex-direction:column;gap:var(--space-lg);
}
.form-scroll::-webkit-scrollbar{display:none;}

/* ===== COUPON BANNER ===== */
.form-scroll .coupon-banner .coupon-banner__text{flex:1;text-align:right;}
.form-scroll .coupon-banner{
  width:auto;flex-shrink:0;overflow:clip;
  max-height:80px;transform-origin:top;
  transition:max-height .35s cubic-bezier(.4,0,.2,1), opacity .25s, margin .35s, padding .35s, transform .35s;
}
.form-scroll .coupon-banner.is-hidden{
  max-height:0;min-height:0;opacity:0;
  /* הבאנר נשאר פריט-flex גם כשהוא סגור → רווח-הרשימה (16) נספר פעמיים לפניו ואחריו.
     שוליים-שליליים בגובה הרווח מבטלים את הכפל (אסף 18/08: «כפל רווח»). */
  margin-top:0;margin-bottom:calc(-1 * var(--space-lg,16px));padding-top:0;padding-bottom:0;
  transform:scaleY(0.9);pointer-events:none;
}

/* ===== SUBSCRIPTION CONTAINER (morphing) ===== */
.subscription-container{
  width:100%;
  border:1px solid var(--tl-color-border-inverse-subtle);
  border-radius:var(--border-radius-lg);
  background:white;
  overflow:hidden;
  transition:height 0.4s cubic-bezier(0.4,0,0.2,1);
  position:relative;
  direction:rtl;
  flex-shrink:0;
}
.sub-panel{
  width:100%;
  padding:var(--space-md);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  position:absolute;
  top:0;left:0;right:0;
  opacity:0;
  transform:translateY(8px);
  transition:opacity 0.3s ease, transform 0.3s ease;
  pointer-events:none;
}
.sub-panel.active{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
  position:relative;
}

/* Subscription banner */
.subscription-banner{
  flex-direction:row;
  justify-content:center;
  align-items:center;
  gap:10px;
}
.connect-btn{
  min-width:85px;height:32px;border-radius:16px;
  background:var(--tl-color-bg-surface-inv);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;cursor:pointer;border:none;padding:0 12px;
}
.connect-btn span{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body-small,14px);line-height:1.2;color:var(--tl-color-text-inverse-default);
}
.banner-text{
  flex:1;display:flex;flex-direction:column;align-items:flex-start;color:var(--tl-color-text-inverse-default);min-width:0;
}
.banner-text-title{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body-small,14px);line-height:1.4;
  white-space:nowrap;text-align:right;width:100%;
}
.banner-text-sub{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-caption,12px);line-height:1.4;
  text-align:right;width:100%;
}
.banner-image{
  width:50px;height:50px;overflow:visible;flex-shrink:0;position:relative;
}
.banner-image img{
  width:154%;height:154%;position:absolute;top:-27%;left:-27%;object-fit:contain;
}

/* Login panel */
.login-title{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body-small,14px);line-height:1.4;color:var(--tl-color-text-inverse-default);text-align:center;
}
.login-google-btn{
  width:100%;height:44px;border:1px solid var(--tl-color-border-inverse-default);border-radius:140px;
  background:white;display:flex;align-items:center;justify-content:center;gap:8px;
  cursor:pointer;padding:0 12px;
}
.login-google-btn span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);}
.login-google-btn img,.login-google-btn svg{width:22px;height:22px;object-fit:contain;}
.login-divider{width:100%;display:flex;align-items:center;gap:10px;}
.login-divider-line{flex:1;height:1px;background:rgba(0,0,0,0.15);}
.login-divider span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.4));white-space:nowrap;}
.login-email-btn{
  width:100%;height:44px;border:1px solid var(--tl-color-border-inverse-default);border-radius:140px;
  background:white;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0 12px;
}
.login-email-btn span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:15px;color:var(--tl-color-text-inverse-default);}

/* Loading spinner */
.login-spinner{
  width:48px;height:48px;border:3px solid var(--tl-color-border-inverse-subtle);
  border-top-color:var(--tl-color-border-inverse-default);border-radius:50%;animation:spin 0.8s linear infinite;margin-top:8px;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* Success state — uses ../general/subscription-status.css (legacy .success-* aliases) */
.success-header{
  overflow:hidden;
  max-height:60px;
  /* All animations on a single timeline so collapse looks atomic */
  transition:max-height .4s cubic-bezier(.4,0,.2,1),
             opacity .4s cubic-bezier(.4,0,.2,1),
             padding .4s cubic-bezier(.4,0,.2,1),
             margin .4s cubic-bezier(.4,0,.2,1),
             border-color .4s cubic-bezier(.4,0,.2,1);
}
.success-header.is-collapsed{
  max-height:0;
  opacity:0;
  padding-top:0;padding-bottom:0;
  border-bottom-color:transparent;
  /* Negative margin-bottom cancels the .sub-panel gap (10px) so body slides up in sync */
  margin:0 0 -10px 0;
}

/* Connect/login hover */
.connect-btn:active{transform:scale(0.95);background:rgba(0,0,0,0.1);}
.login-google-btn:active,.login-email-btn:active{transform:scale(0.98);background:rgba(0,0,0,0.03);}

/* ===== TFC CARDS — sticker overrides ===== */
.form-scroll .tfc{flex-shrink:0;width:100%;position:relative;}

/* Qty tooltip — shows when user taps sticker instead of +/- (Figma 9212:28713) */
.qty-tooltip{
  position:absolute;
  top:8px;left:60px;
  background:var(--tl-color-bg-base,#333);
  color:var(--tl-color-text-default);
  padding:8px 16px;
  border-radius:10px;
  font-family:'Google Sans','Rubik','Assistant',sans-serif;
  font-size:14px;
  font-weight:400;
  white-space:nowrap;
  pointer-events:none;
  z-index:20;
  opacity:0;
  transform:translateX(6px) scale(.9);
  transition:opacity .2s ease, transform .28s cubic-bezier(.34,1.6,.64,1);
}
.qty-tooltip.is-visible{
  opacity:1;
  transform:translateX(0) scale(1);
}
.qty-tooltip.is-attention{
  animation:qtyTipWiggle 1s ease-in-out;
}
@keyframes qtyTipWiggle{
  0%,100%{transform:translateX(0) scale(1);}
  20%{transform:translateX(-3px) scale(1.04);}
  40%{transform:translateX(3px) scale(1.04);}
  60%{transform:translateX(-2px) scale(1.02);}
  80%{transform:translateX(0) scale(1);}
}
.qty-tooltip::before{
  content:"";
  position:absolute;
  top:50%;left:-5px;
  width:10px;height:10px;
  background:inherit;
  transform:translateY(-50%) rotate(45deg);
  border-radius:1px;
}

/* ===== CREDITS SCREEN ===== */
.credits-view{
  display:none;flex-direction:column;flex:1;width:100%;
  background:white;align-items:center;padding:0;
}
.credits-view.active-view{display:flex;animation:viewSlideIn 0.4s cubic-bezier(0.4,0,0.2,1);}
@keyframes viewSlideIn{from{opacity:0;transform:translateX(30px);}to{opacity:1;transform:translateX(0);}}
@keyframes viewSlideBack{from{opacity:0;transform:translateX(-30px);}to{opacity:1;transform:translateX(0);}}
.credits-view.slide-back{animation:viewSlideBack 0.3s cubic-bezier(0.4,0,0.2,1);}

/* ===== PAYMENT VIEWS (method selection / card form / processing / error / complete) ===== */
.view-pay{
  display:none;flex-direction:column;flex:1;width:100%;min-height:0;
  overflow-y:auto;
}
.view-pay.active-view{display:flex;animation:viewSlideIn 0.4s cubic-bezier(0.4,0,0.2,1);}
.view-pay.slide-back{animation:viewSlideBack 0.3s cubic-bezier(0.4,0,0.2,1);}
.view-pay::-webkit-scrollbar{display:none;}

/* ===== DETAILS VIEW (Figma 8296:21550) — personal info form =====
   Spec from Figma:
   • Slot 2 padding: 16 16 0 16, gap 24
   • Field list (רשימה שדות): gap 32
   • Section label "עוד קצת עליכם": padding-top 16, Rubik Regular 12/16
   • Google btn: 44h, padding 9px 12px, gap 40 between text/icon
*/
.details-view{align-items:stretch;}
.details-scroll{
  display:flex;flex-direction:column;
  gap:var(--space-2xl);                                 /* 28px between fields per Figma (Mobile) */
  padding:var(--space-lg) var(--space-lg) var(--space-3xl) var(--space-lg);
  width:100%;
}
.details-google-btn{
  width:100%;height:44px;
  border:1px solid var(--tl-color-border-inverse-default);
  border-radius:100px;
  background:var(--tl-color-bg-baseAlt);
  display:flex;align-items:center;justify-content:center;
  gap:var(--space-3xl);                                 /* 40px between label & logo per Figma (Mobile) */
  cursor:pointer;
  padding:9px var(--space-md);                          /* Figma: 9 12 9 12 */
  transition:background 0.2s, transform 0.1s;
}
.details-google-btn:active{transform:scale(0.98);background:rgba(0,0,0,0.03);}
.details-google-btn__spinner{
  display:none;
  width:22px;height:22px;
  border:2.5px solid rgba(0,0,0,0.12);
  border-top-color:var(--tl-color-text-inverse-default,#000);
  border-radius:50%;
  flex-shrink:0;
}
.details-google-btn.is-loading{
  pointer-events:none;
  background:rgba(0,0,0,0.03);
}
.details-google-btn.is-loading .details-google-btn__logo{display:none;}
.details-google-btn.is-loading .details-google-btn__spinner{
  display:block;
  animation:detailsGoogleSpin 0.8s linear infinite;
}
@keyframes detailsGoogleSpin{to{transform:rotate(360deg);}}
.details-google-btn.is-done{
  /* Collapse the button out — auth done, fields filled */
  height:0;
  margin:0;padding:0;border-width:0;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
  transition:height 0.3s ease, opacity 0.2s ease, padding 0.3s ease;
}
.details-google-btn span{
  font-family:var(--font-family-live);
  font-weight:var(--font-weight-regular);
  font-size:var(--font-size-button-primary);
  line-height:var(--line-height-button-primary);
  color:var(--tl-color-text-inverse-default);
}
.details-google-btn svg{width:26px;height:26px;flex-shrink:0;}
.details-lff,.auth-lff{width:100%;}
.details-lff .lff,.auth-lff .lff{width:100%;}
.details-lff .lff__hidden-input,.auth-lff .lff__hidden-input{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;border:none;background:transparent;outline:none;
  text-align:right;padding:var(--space-md) var(--space-lg);
  font-family:var(--font-family-live);font-size:var(--font-size-button-primary);
}
.details-section-label{
  font-family:var(--font-family-live);
  font-weight:var(--font-weight-regular);
  font-size:var(--font-size-caption);                   /* 12px */
  line-height:var(--line-height-caption);               /* 16px */
  color:var(--tl-color-text-inverse-default);
  text-align:center;
  padding-top:var(--space-lg);                          /* +16px on top of the 32 gap */
}

.credits-hero{
  display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;padding:12px 0 0 0;
}
.credits-stepper{display:flex;align-items:center;gap:32px;direction:rtl;}
.credits-step-btn{
  width:44px;height:44px;border-radius:100px;background:var(--tl-color-bg-surface-inv);
  border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background 0.15s, transform 0.1s;flex-shrink:0;
}
.credits-step-btn:active{transform:scale(0.92);background:rgba(0,0,0,0.1);}
.credits-step-btn.dim{opacity:0.3;cursor:default;}
.credits-step-btn.dim:active{transform:none;background:var(--tl-color-bg-surface-inv);}
.credits-step-btn svg{width:20px;height:20px;}
.credits-big-number{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:var(--font-weight-medium,500);font-size:104px;line-height:1;
  color:var(--tl-color-text-inverse-disabled);transition:color 0.3s, transform 0.2s;
}
.credits-subtitle{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);line-height:1.4;color:var(--tl-color-text-inverse-default);text-align:center;
}

/* Credits progress area */
.credits-progress-area{width:100%;padding:0 16px;display:flex;flex-direction:column;gap:4px;}
.credits-progress-area .progress-bar{height:13px;border-radius:999px;background:#e0e0e0;position:relative;overflow:hidden;width:100%;}
.credits-progress-area .progress-bar-used{
  position:absolute;right:0;top:0;height:100%;border-radius:999px;
  background:linear-gradient(270deg,#b9ca20,#d4e468);width:0;transition:width 0.45s ease-out;
}
.credits-progress-area .progress-stats{
  width:100%;display:flex;justify-content:space-between;
  font-family:'Google Sans','Rubik',sans-serif;font-weight:600;font-size:var(--font-size-caption,12px);color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.4));direction:rtl;
}
.credits-progress-area .progress-stats .stat{display:flex;align-items:flex-end;gap:4px;opacity:0.8;}
.credits-progress-area .progress-stats .stat-num{font-size:var(--font-size-body-small,14px);line-height:1;}
.credits-progress-area .progress-stats .stat-label{font-size:var(--font-size-caption,12px);line-height:1;}

/* Order summary card */
.order-summary-card{
  width:100%;background:white;border:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,0.1));border-radius:24px;
  padding:16px;display:flex;flex-direction:column;gap:12px;direction:rtl;
  box-shadow:0 4px 20px -2px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
}
/* Borderless variant — no card chrome but keep internal padding */
.order-summary-card--borderless{
  background:transparent;border:none;box-shadow:none;
  padding:16px;
}
.order-row{
  display:flex;justify-content:space-between;align-items:center;
  font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body-small,14px);line-height:1;
  color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.4));white-space:nowrap;
}
.order-row.credits-row .order-val{font-weight:400;color:#465b17;}
.order-row.payment-row .order-val{font-weight:700;color:#465b17;}
.order-divider{width:100%;height:1px;background:var(--tl-color-border-inverse-subtle);}
.order-balance-banner{
  width:100%;padding:16px;background:#fcffe7;border:1px solid #b9ca20;border-radius:12px;
  display:flex;align-items:center;justify-content:space-between;direction:rtl;
}
.order-balance-label{font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body-small,14px);color:#465b17;}
.order-balance-amount{font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:28px;line-height:1;color:var(--tl-color-text-inverse-default);}
.order-covered-banner{
  width:100%;padding:8px 12px;background:#fcffe7;border:1px solid #b9ca20;border-radius:8px;
  text-align:center;font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:13px;
  line-height:1.4;color:#465b17;display:none;
}
.order-covered-banner.visible{display:block;}

/* Counter shake */
@keyframes shake{
  0%,100%{transform:translateX(0);}20%{transform:translateX(-3px);}
  40%{transform:translateX(3px);}60%{transform:translateX(-2px);}80%{transform:translateX(2px);}
}
.credits-big-number.shake{animation:shake 0.35s ease;}

/* SSC styles imported from ../general/series-subscription-card.css (shared with sketch) */

/* Subtitle label above the SSC card */
.credits-subtitle-label{
  font-family:'Google Sans','Rubik',sans-serif;
  font-weight:400;font-size:var(--font-size-body-small,14px);line-height:20px;
  color:var(--tl-color-text-inverse-default,#000);text-align:center;
  width:100%;
}

/* Balance row — flat (replaces yellow banner) */
.order-row.balance-row{color:var(--tl-color-text-inverse-default,#000);}
.order-row.balance-row .order-label{color:var(--tl-color-text-inverse-default,#000);}
.order-row.balance-row .order-val{font-weight:700;color:var(--tl-color-text-inverse-default,#000);}

/* ===== ACTIONBAR — positioned at bottom of form-container ===== */
.form-container>.actionbar{
  position:absolute;bottom:var(--space-lg);left:var(--space-lg);right:var(--space-lg);
  width:auto;z-index:60;
  transition:transform .35s cubic-bezier(.32,.72,0,1), opacity .25s ease;
}
.form-container>.actionbar .actionbar__cta{justify-content:flex-end;}
.form-container>.actionbar.is-hidden{
  transform:translateY(calc(100% + var(--space-lg)));
  opacity:0;
  pointer-events:none;
}

/* ===== AUTH POPUP (Bottom Sheet) ===== */
.auth-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,0.45);z-index:500;
  opacity:0;pointer-events:none;transition:opacity 0.3s;
}
.auth-overlay.open{opacity:1;pointer-events:auto;}
.auth-popup{
  position:fixed;bottom:0;left:50%;
  transform:translateX(-50%) translateY(100%);
  width:100%;z-index:501;            /* fully flexible — matches the form-container width */
  transition:transform 0.35s cubic-bezier(0.4,0,0.2,1);
}
.auth-popup.open{transform:translateX(-50%) translateY(0);}
.auth-popup-sheet{
  position:relative;
  background:white;border-radius:var(--r-2xl,24px) var(--r-2xl,24px) 0 0;   /* 19/08: 24 כמו רכיב miniPopup (היה 40) */
  padding:24px 24px 32px 24px;
  display:flex;flex-direction:column;align-items:center;gap:28px;
}
/* פס סגירה/גרירה בראש ה-sheet — absolute כדי לא להוסיף ל-gap; אפור Grays/500, לחיץ לסגירה */
.auth-handle{
  position:absolute;top:12px;left:50%;transform:translateX(-50%);
  width:36px;height:var(--space-xs,4px);   /* 36 — מידת mp-handle (אין טוקן-רוחב) */padding:0;border:0;
  border-radius:var(--r-full,999px);
  background:var(--color-grays-500,#999);
  cursor:pointer;transition:background .15s;
}
.auth-handle:hover{background:var(--color-grays-600,#666);}
.auth-header{text-align:center;font-family:'Google Sans','Rubik',sans-serif;}
.auth-header .auth-title{font-weight:700;font-size:var(--font-size-body,16px);line-height:1.4;color:var(--tl-color-text-inverse-default);margin-bottom:4px;}
.auth-header .auth-subtitle{font-weight:400;font-size:var(--font-size-body,16px);line-height:1.4;color:var(--tl-color-text-inverse-default);}
.auth-google-btn{
  width:100%;height:44px;border:1px solid var(--tl-color-border-inverse-default);border-radius:140px;
  background:white;display:flex;align-items:center;justify-content:flex-end;
  gap:40px;padding:0 12px;cursor:pointer;direction:ltr;
}
.auth-google-btn span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);}
.auth-google-btn img,.auth-google-btn svg{width:26px;height:26px;object-fit:contain;}
.auth-google-btn:active{background:rgba(0,0,0,0.03);transform:scale(0.98);}
/* דרך שלישית: אורח — לינק, לא כפתור (אסף 27/08): טקסט עם קו-תחתון, בלי מסגרת ורקע */
.auth-guest-btn{
  width:100%;height:44px;border:none;border-radius:0;
  background:none;display:flex;align-items:center;justify-content:center;
  padding:0 12px;cursor:pointer;
}
.auth-guest-btn span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);text-decoration:underline;text-underline-offset:3px;}
.auth-guest-btn:active{opacity:.7;}
/* אורח — בלי שדה-נייד בטופס (פיגמה: נייח 2620:177812 · נייד 354:93399) */
.details-view.is-guest .details-lff[data-validate="phone"]{display:none;}
.auth-divider{width:100%;display:flex;align-items:center;gap:16px;height:20px;}
.auth-divider-line{flex:1;height:1px;background:var(--tl-color-border-inverse-subtle);}
.auth-divider span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body-small,14px);color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.4));white-space:nowrap;}
.auth-phone-section{width:100%;display:flex;flex-direction:column;gap:16px;}
.auth-phone-row{
  width:100%;height:44px;border:1px solid var(--tl-color-border-inverse-default);border-radius:100px;
  background:white;display:flex;align-items:center;padding:0 16px;gap:8px;direction:rtl;
}
.auth-phone-label{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);flex-shrink:0;}
.auth-phone-input{
  flex:1;border:none;outline:none;font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body,16px);
  color:var(--tl-color-text-inverse-default);background:transparent;direction:ltr;text-align:left;height:100%;
}
.auth-phone-input::placeholder{color:var(--tl-color-text-inverse-disabled,rgba(0,0,0,0.3));}
.auth-phone-sep{width:1px;height:20px;background:rgba(0,0,0,0.2);flex-shrink:0;}
.auth-phone-prefix{display:flex;align-items:center;gap:8px;flex-shrink:0;direction:ltr;}
.auth-phone-prefix .flag{font-size:var(--font-size-h2,20px);line-height:1;}
.auth-phone-prefix span{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);}
.auth-send-btn{
  width:100%;height:44px;border:none;border-radius:100px;
  background:var(--tl-color-brand-main);cursor:pointer;
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);
  transition:background 0.2s, transform 0.15s;
}
.auth-send-btn:active{transform:scale(0.97);background:#e6b800;}

/* OTP View */
.auth-otp-sheet{
  background:white;border-radius:24px 24px 0 0;
  padding:24px 16px 32px 16px;display:flex;flex-direction:column;align-items:center;gap:40px;
}
.otp-header{text-align:center;font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);}
.otp-header .otp-line1{font-weight:400;line-height:1.6;}
.otp-header .otp-line2{font-weight:700;line-height:1.6;}
.otp-body{width:100%;display:flex;flex-direction:column;align-items:center;gap:24px;}
.otp-info{text-align:center;font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);line-height:1.6;}
.otp-info .otp-timer{font-weight:700;}
.otp-boxes{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;direction:ltr;}
.otp-box{
  width:39px;height:57px;border:1px solid var(--tl-color-border-inverse-default);border-radius:5px;background:transparent;
  text-align:center;font-family:'Google Sans','Rubik',sans-serif;font-size:22px;font-weight:700;color:var(--tl-color-text-inverse-default);
  outline:none;caret-color:var(--tl-color-brand-main);
}
.otp-box:focus{border-color:var(--tl-color-brand-main);box-shadow:0 0 0 2px rgba(255,204,0,0.3);}
.otp-dash{font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-h3,18px);color:var(--tl-color-text-inverse-disabled,rgba(0,0,0,0.3));flex-shrink:0;}
.otp-actions{
  width:100%;display:flex;justify-content:space-between;
  font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body-small,14px);color:var(--tl-color-text-inverse-default);direction:rtl;
}
.otp-actions a{color:var(--tl-color-text-inverse-default);text-decoration:underline;cursor:pointer;}
.otp-change-phone{
  width:100%;height:44px;border:1px solid var(--tl-color-border-inverse-default);border-radius:140px;
  background:white;display:flex;align-items:center;justify-content:center;gap:24px;
  cursor:pointer;font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default);direction:rtl;padding:0 12px;
}
.otp-change-phone:active{background:rgba(0,0,0,0.03);transform:scale(0.98);}
.otp-change-phone img,.otp-change-phone svg{width:24px;height:28px;flex-shrink:0;}

.auth-view{display:none;}
.auth-view.active{
  display:block;
  animation:authViewIn 0.42s cubic-bezier(0.32,0.72,0,1) both;
}
@keyframes authViewIn{
  0%{opacity:0;transform:translateY(12px) scale(0.985);}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
/* Single animation only — combining spin + scale on transform broke rotation
   because spinnerPop's `both` fill held transform:scale(1) and overrode rotate. */
.login-spinner{
  animation: spin 0.8s linear infinite, spinnerFade 0.4s ease-out both;
}
@keyframes spinnerFade{
  0%{opacity:0;}
  100%{opacity:1;}
}
.auth-popup-sheet--loading .login-title{
  animation:fadeUp 0.35s 0.05s ease-out both;
}
@keyframes fadeUp{
  0%{opacity:0;transform:translateY(8px);}
  100%{opacity:1;transform:translateY(0);}
}
.auth-popup-sheet--confirm .sub-confirm-greeting{ animation:fadeUp 0.4s 0.05s ease-out both; }
.auth-popup-sheet--confirm .sub-confirm-progress{ animation:fadeUp 0.4s 0.12s ease-out both; }
.auth-popup-sheet--confirm .sub-confirm-actions{ animation:fadeUp 0.4s 0.20s ease-out both; }

/* ===== SUBSCRIPTION CONFIRMATION (auth popup view, after login from payment) ===== */
.auth-popup-sheet--loading{
  gap:var(--space-xl);
  padding:var(--space-2xl) var(--space-xl) calc(var(--space-2xl) + var(--space-md)) var(--space-xl);
}
/* גיליון «מתחבר…» בהתחברות מתוך «פרטים» — נייד (פיגמה 354:93807, אסף 19/08): ריפוד 24/24/32,
   קופסה פנימית ריפוד 12 רווח 10; טקסט Rubik Regular 14/20 (לא Bold); טוען 68. המנוי שומר את הגיליון הגדול שלו. */
.auth-popup[data-origin="details"] .auth-popup-sheet--loading{
  gap:10px;   /* מידה מהפיגמה — אין טוקן 10 */
  padding:calc(var(--space-xl,24px) + var(--space-md,12px)) calc(var(--space-xl,24px) + var(--space-md,12px)) calc(var(--space-2xl,32px) + var(--space-md,12px));
}
.auth-popup[data-origin="details"] .auth-popup-sheet--loading .login-title{
  font-weight:var(--font-weight-regular,400);font-size:var(--font-size-body-small,14px);line-height:20px;
}
.auth-popup[data-origin="details"] .auth-popup-sheet--loading .login-spinner{width:68px;height:68px;margin-top:0;}
.auth-popup-sheet--confirm{
  align-items:stretch;
  gap:var(--space-xl);
  padding:var(--space-md) var(--space-md) calc(var(--space-2xl) + var(--space-lg)) var(--space-md);
}
.sub-confirm-info{
  display:flex;flex-direction:column;gap:var(--space-sm);
  padding:0 var(--space-md);
}
.sub-confirm-greeting{
  font-family:var(--font-family-live);
  font-weight:var(--font-weight-regular);
  font-size:var(--font-size-body-small);
  line-height:140%;
  color:var(--tl-color-text-inverse-default);
  text-align:right;
}
.sub-confirm-greeting b{font-weight:var(--font-weight-bold);}
.sub-confirm-progress{display:flex;flex-direction:column;gap:var(--space-xs);}
.sub-confirm-bar-row{
  display:flex;direction:ltr;
  gap:2px;width:100%;height:4px;
}
.sub-confirm-bar{
  height:4px;
  border-radius:var(--border-radius-full);
  transition:flex-grow 0.4s cubic-bezier(0.4,0,0.2,1);
}
.sub-confirm-bar--empty{background:var(--color-grays-200);flex:0 1 0;}
.sub-confirm-bar--filled{background:var(--color-green-400);flex:0 1 0;}
.sub-confirm-stats{
  display:flex;justify-content:space-between;align-items:center;gap:var(--space-xs);
}
.sub-confirm-stat{
  font-family:var(--font-family-live);
  font-weight:var(--font-weight-regular);
  font-size:var(--font-size-caption);
  line-height:var(--line-height-caption);
  color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.4));
}
.sub-confirm-actions{
  display:flex;gap:var(--space-sm);
  padding:0 0;
}
.sub-confirm-actions > .btn{flex:1;min-width:0;}

/* ===== TOAST ===== */
.toast{
  position:fixed;top:70px;left:50%;
  transform:translateX(-50%) translateY(-20px);
  background:rgba(0,0,0,0.85);color:var(--tl-color-text-default);
  font-family:'Google Sans','Rubik',sans-serif;font-size:var(--font-size-body-small,14px);font-weight:600;
  padding:10px 20px;border-radius:100px;z-index:600;
  opacity:0;transition:opacity 0.3s, transform 0.3s;pointer-events:none;
  white-space:nowrap;direction:rtl;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ===== Coupon Popup Overlay ===== */
.coupon-popup-overlay{
  position:fixed;inset:0;z-index:300;
  background:rgba(0,0,0,0.5);
  display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .3s;
  padding-top:60px; /* room for illustration floating above */
}
.coupon-popup-overlay.is-open{
  opacity:1;pointer-events:auto;
}
.coupon-popup-overlay .coupon-popup{
  max-width:100%;
  height:95%;
  max-height:95%;
  overflow:visible;
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.32,.72,0,1);
  border-radius:var(--space-2xl) var(--space-2xl) 0 0;
  min-height:auto;
}
/* Body fills remaining space */
.coupon-popup-overlay .coupon-popup__body{
  flex:1;
}
.coupon-popup-overlay.is-open .coupon-popup{
  transform:translateY(0);
}
/* Body bottom corners — flat when docked to bottom */
.coupon-popup-overlay .coupon-popup__body{
  border-radius:var(--space-xl) var(--space-xl) 0 0;
  overflow-y:auto;
}
/* ===== GIFT EXPLOSION OVERLAY ===== */
.explosion-overlay{
  position:fixed;inset:0;z-index:600;
  background:radial-gradient(ellipse at 50% 40%,#1a0040 0%,#000010 100%);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .3s;
}
.explosion-overlay.active{opacity:1;pointer-events:auto;}
.explosion-overlay.fade-out{opacity:0;transition:opacity .5s;}

/* Stars */
.explosion-star{
  position:absolute;border-radius:50%;background:#fff;pointer-events:none;
  animation:starTwinkle 2s ease-in-out infinite;
}
@keyframes starTwinkle{0%,100%{opacity:.1}50%{opacity:.8}}

/* Gift scene */
.explosion-scene{position:relative;width:200px;height:200px;}
.explosion-gift{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
}
.explosion-gift img{width:160px;height:160px;object-fit:contain;}

/* Shake */
.explosion-gift.shake{animation:giftShake .85s ease-in-out;}
@keyframes giftShake{
  0%,100%{transform:translate(0) rotate(0)}
  10%{transform:translate(-10px) rotate(-3deg)}
  20%{transform:translate(10px) rotate(3deg)}
  30%{transform:translate(-12px) rotate(-4deg)}
  40%{transform:translate(12px) rotate(4deg)}
  50%{transform:translate(-8px) rotate(-2deg)}
  60%{transform:translate(8px) rotate(2deg)}
  70%{transform:translate(-4px) rotate(-1deg)}
  80%{transform:translate(4px) rotate(1deg)}
}

/* Explode */
.explosion-gift.explode{animation:giftExplode .25s ease-in forwards;}
@keyframes giftExplode{
  0%{transform:scale(1);opacity:1}
  50%{transform:scale(1.4);opacity:1}
  100%{transform:scale(0);opacity:0}
}

/* Gold ring */
.explosion-ring{
  position:absolute;left:50%;top:50%;
  border:5px solid #FFD700;
  border-radius:50%;
  box-shadow:0 0 30px 8px rgba(255,215,0,0.8),inset 0 0 20px rgba(255,215,0,0.33);
  pointer-events:none;
  animation:ringBurst .7s ease-out forwards;
}
@keyframes ringBurst{
  0%{width:60px;height:60px;margin-left:-30px;margin-top:-30px;opacity:1}
  100%{width:600px;height:600px;margin-left:-300px;margin-top:-300px;opacity:0}
}

/* Particles */
.explosion-particle{
  position:absolute;left:50%;top:50%;
  pointer-events:none;
  animation:particleFly 1.8s ease-out forwards;
}
@keyframes particleFly{
  0%{transform:translate(0,0) rotate(var(--r0)) scale(1);opacity:1}
  70%{opacity:.7}
  100%{transform:translate(var(--dx),var(--dy)) rotate(var(--r1)) scale(.4);opacity:0}
}

/* In-place gift explosion on success body — replaces dark overlay flow.
   Reuses keyframes giftShake / ringBurst / particleFly defined above. */
.cp-gift-wrap{
  position:relative;
  width:120px;height:120px;
  display:flex;align-items:center;justify-content:center;
  overflow:visible;
  flex-shrink:0;
}
.cp-gift-wrap .cp-applied-illustration{
  position:relative;z-index:2;
  transform-origin:center;
}
.cp-applied-illustration.is-shake{animation:giftShake 1.1s ease-in-out;}
.cp-applied-illustration.is-burst{animation:giftBurst .35s ease-in forwards;}
.cp-applied-illustration.is-comeback{animation:giftComeback .55s cubic-bezier(.25,.8,.3,1) forwards;}
@keyframes giftBurst{
  0%{transform:scale(1);opacity:1}
  50%{transform:scale(1.4);opacity:1}
  100%{transform:scale(0);opacity:0}
}
@keyframes giftComeback{
  0%{transform:scale(0);opacity:0}
  100%{transform:scale(1);opacity:1}
}
/* Ring + particles use position:fixed so they escape the popup body's overflow:auto.
   JS positions them at the gift wrap's viewport center via getBoundingClientRect(). */
.cp-gift-ring{
  position:fixed;
  border:5px solid #FFD700;
  border-radius:50%;
  box-shadow:0 0 30px 8px rgba(255,215,0,0.8),inset 0 0 20px rgba(255,215,0,0.33);
  pointer-events:none;
  animation:ringBurst .9s ease-out forwards;
  z-index:9999;
}
.cp-gift-particle{
  position:fixed;
  pointer-events:none;
  animation:particleFly 2.4s ease-out forwards;
  z-index:9999;
}
/* Applied state — CSS in shared coupon-popup.css */
/* Sub-overlays — club selector + code sheet as independent fixed overlays */
.cp-sub-overlay{
  position:fixed;inset:0;z-index:400;
  display:flex;align-items:flex-end;justify-content:center;
  opacity:0;pointer-events:none;
  transition:opacity .3s;
}
.cp-sub-overlay.is-open{
  opacity:1;pointer-events:auto;
}
.cp-sub-overlay__backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,0.5);
  touch-action:none;overscroll-behavior:contain;   /* נגיעה ברקע לא גוללת את הטופס שמאחור (אסף 23/08) */
}
.cp-sub-overlay__content{
  position:absolute;bottom:0;left:0;right:0;z-index:1;
  width:100%;max-height:80dvh;
  display:flex;flex-direction:column;
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.32,.72,0,1), bottom .2s ease;
}
.cp-sub-overlay.is-open .cp-sub-overlay__content{
  transform:none;   /* none ולא translateY(0): בזמן pf-lifting ה-input קבוע-לחלון, ואב עם transform היה «תופס» אותו */
}
/* miniPopup inside sub-overlay */
.cp-sub-overlay .minipopup{
  width:100%;
  border-radius:var(--r-2xl, 24px) var(--r-2xl, 24px) 0 0;
  box-shadow:none;
  animation:none;
  height:80dvh;
  max-height:80dvh;
  display:flex;flex-direction:column;
  overflow:hidden;
}
.cp-sub-overlay .club-popup__list{
  flex:1;min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:0;
  height:auto;
}
/* Code sheet inside sub-overlay */
.cp-sub-overlay .coupon-code-sheet{
  position:relative;
  width:100%;
  opacity:1;visibility:visible;
  transform:none;
  transition:none;
}
/* Code sheet — flat bottom corners when docked to bottom */
.cp-sub-overlay .coupon-code-sheet{
  border-radius:20px 20px 0 0;
}
/* lff override inside coupon popup in landing */
.coupon-popup-overlay .lff-wrap{width:100%;}

/* ===== "ניתן לממש במנוי" — באדג' על הכרטיס + פופאפ סדרות מנוי ===== */
/* תיוג "זמין במנוי" = badge ירוק מ-ticket-form-card.css (.tfc__badge--subscription), מוזרק ב-JS לראש .tfc__top */

/* פופאפ המימוש כמעט מסך מלא — 95dvh (גובר על 80dvh של ה-cp-sub-overlay הכללי) */
.redeem-popup .cp-sub-overlay__content{ max-height:95dvh; }
.redeem-popup .minipopup{ height:95dvh; max-height:95dvh; }

/* פס-הגרירה מגיע מהרכיב (.mp-handle ב-minipopup.css). הסגירה בלחיצה היא כפתור-התחתית — לא הפס. */

/* פופאפ — header */
.redeem-popup__header{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:var(--space-md,12px);
  padding:var(--space-md,12px) var(--space-xl,24px) var(--space-md,12px);
}
.redeem-popup__title{
  flex:1 1 auto; min-width:0; width:100%;
  white-space:normal; word-break:break-word; text-align:right; line-height:1.2;
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;
  font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-heading-modal,20px);
  color:var(--tl-color-text-inverse-default,#000);
}

/* פופאפ — רשימת כרטיסי מנוי בגודל מלא (Subscription Card במצב pending), גלילה אנכית (Figma 11121:25285) */
.cp-sub-overlay .redeem-popup__list{
  flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  display:flex; flex-direction:column; gap:var(--space-xl,24px);
  padding:var(--space-lg,16px);
}
.cp-sub-overlay .redeem-popup__list .sub-card{ flex-shrink:0; }

/* פופאפ — footer (כפתור התחברות + הסבר) */
/* footer = שורה אחת, 2 כפתורים זה לצד זה (פטרן minipopup הטבעי: .mp-footer .btn{flex:1}, גובה תקני 44px) */
.redeem-popup__footer{ align-items:stretch; }
.redeem-popup__hint{
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;
  font-size:var(--font-size-caption,12px); line-height:1.4;
  color:var(--tl-color-text-inverse-subtle,#666); text-align:center;
}
.coupon-popup-overlay .lff-wrap input[type="text"]{
  position:absolute;inset:0;opacity:0;
  width:100%;height:100%;border:none;background:transparent;outline:none;text-align:right;
}

/* ===== "מידע נוסף" — bottom-sheet עם תוכן עשיר נגלל (תמונות/וידאו/טקסט/קישורים) ===== */
.info-popup .cp-sub-overlay__content{ max-height:88dvh; }
.info-popup .minipopup{ height:88dvh; max-height:88dvh; }
/* ההדר משתמש ב-spacing של קומפוננט mp-header כפי שהוא (padding 24, gap 16, align center) — בלי override */
/* כותרת ארוכה (שם הכרטיס) — לאפשר שבירה לשורות במקום לעוף מחוץ למסך */
.info-popup__header .mp-title{ white-space:normal; flex:1; min-width:0; line-height:1.25; }
/* פרטי הכרטיס בראש החלון — מאוורר וברור, לפני סקשני המידע */
.info-popup__cardhead{
  display:flex; gap:var(--space-lg,16px); align-items:flex-start;
  padding-bottom:var(--space-xl,24px);
  border-bottom:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,.1));
}
.info-popup__cardhead:empty{ display:none; }
/* הסטיקר ב-cardhead = קומפוננט Sticker (general/sticker.css), גודל md */
.info-popup__ch-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:var(--space-sm,8px); }
.info-popup__cardhead .tfc__badges-row{ display:flex; flex-direction:row; gap:var(--space-sm,8px); flex-wrap:wrap; }
/* בתוך הפופאפ התיוג אינפורמטיבי בלבד — לא לחיץ, בלי "?" */
.info-popup__cardhead .tfc__badge--subscription{ cursor:default; }
.info-popup__cardhead .tfc__badge--subscription:hover{ background:var(--color-yellows-300,#ffde58); }
.info-popup__cardhead .tfc__badge-help{ display:none; }
.info-popup__ch-title{
  font-family:'Google Sans',var(--font-family-live,'Rubik',sans-serif); font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-heading-sub,18px); line-height:1.3;
  color:var(--tl-color-text-inverse-default,#000); word-break:break-word;
}
.info-popup__ch-price{ display:flex; align-items:baseline; gap:2px; }
.info-popup__ch-price .symbol{ 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); color:var(--tl-color-text-inverse-default,#000); }
.info-popup__ch-price .amount{ font-family:'Google Sans',var(--font-family-live,'Rubik',sans-serif); font-weight:var(--font-weight-bold,700); font-size:var(--font-size-heading-hero-name,24px); line-height:1; color:var(--tl-color-text-inverse-default,#000); }
/* גוף נגלל */
.info-popup__body{
  width:100%; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:0 var(--space-xl,24px) var(--space-xl,24px);
  display:flex; flex-direction:column; gap:var(--space-xl,24px);
}
.info-popup__media{
  width:100%; border-radius:var(--r-lg,12px); overflow:hidden; display:block;
  background:var(--tl-color-bg-surface-inverse,rgba(0,0,0,.05));
  aspect-ratio:16/9; object-fit:cover;
}
video.info-popup__media{ background:#000; }
/* thumbnail וידאו — תמונה + כפתור play (עוקף את quirk ה-poster של <video>) */
.info-popup__videobtn{
  position:relative; width:100%; padding-top:56.25%; cursor:pointer;
  border-radius:var(--r-lg,12px); overflow:hidden;
  background:#000 center/cover no-repeat;
}
.info-popup__play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.info-popup__videobtn:active .info-popup__play{ transform:scale(.94); }
/* גלריית תמונות — תמונה ראשונה רחבה (hero), השאר ברשת 2 טורים */
.info-popup__gallery{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-sm,8px); }
.info-popup__gallery img{
  width:100%; aspect-ratio:1/1; object-fit:cover;
  border-radius:var(--r-md,8px);
  background:var(--tl-color-bg-surface-inverse,rgba(0,0,0,.05));
}
.info-popup__gallery img:first-child{ grid-column:1 / -1; aspect-ratio:16/9; }
.info-popup__block{ display:flex; flex-direction:column; gap:var(--space-sm,8px); }
.info-popup__btitle{
  font-family:'Google Sans',var(--font-family-live,'Rubik',sans-serif); font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-heading-sub,18px); line-height:1.3;
  color:var(--tl-color-text-inverse-default,#000); margin:0;
}
.info-popup__text{
  font-family:'Google Sans',var(--font-family-live,'Rubik',sans-serif); font-weight:var(--font-weight-regular,400);
  font-size:var(--font-size-body,16px); line-height:1.5;
  color:var(--color-grays-700,#333); margin:0;
}
.info-popup__links{ display:flex; flex-direction:column; }
.info-popup__link{
  display:flex; align-items:center; gap:var(--space-md,12px);
  padding:var(--space-md,12px) 0; text-decoration:none;
  border-top:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,.1));
  color:var(--tl-color-text-inverse-default,#000);
  font-family:'Google Sans',var(--font-family-live,'Rubik',sans-serif); font-weight:var(--font-weight-medium,500);
  font-size:var(--font-size-body,16px); transition:opacity .15s;
}
.info-popup__link:last-child{ border-bottom:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,.1)); }
.info-popup__link:active{ opacity:.6; }
.info-popup__link-icon{ width:20px; height:20px; flex-shrink:0; color:var(--color-grays-600,#666); }
.info-popup__link-label{ flex:1; min-width:0; }
.info-popup__link-chev{ width:18px; height:18px; flex-shrink:0; color:var(--color-grays-500,#999); }
/* ── מסכי-התשלום (היה בלוק-סגנון שני בדף) ── */
/* Hide inline inputs on viewCardForm; click the wrap opens the popup sheet */
#viewCardForm .payment-form-wrap > .lff-wrap,
#viewCardForm .payment-form-wrap > .payment-row{cursor:pointer;}
#viewCardForm .payment-form-wrap input{display:none !important;}
/* בנייח (מגירה) כותבים ישירות בשדה — ה-input חוזר, שקוף מעל השדה (אסף 18/08) */
body.pf-drawer-mode #viewCardForm .payment-form-wrap input{display:block !important;}
body.pf-drawer-mode #viewCardForm .payment-form-wrap > .lff-wrap,
body.pf-drawer-mode #viewCardForm .payment-form-wrap > .payment-row{cursor:text;}
#ccSheet .lff-wrap input{
  position:absolute;inset:0;opacity:0;
  width:100%;height:100%;
  border:none;background:transparent;outline:none;
  text-align:right;font-size:var(--font-size-body,16px);pointer-events:auto;
}
/* viewSummary — order summary between details and payment */
#viewSummary{display:none;flex-direction:column;flex:1;width:100%;background:white;padding:0;overflow:hidden;}
#viewSummary.active-view{display:flex;animation:viewSlideIn 0.4s cubic-bezier(0.4,0,0.2,1);}
#viewSummary .summary-scroll{
  flex:1;min-height:0;overflow-y:auto;
  padding:var(--space-lg) var(--space-lg) 120px;
  display:flex;flex-direction:column;
  gap:var(--space-xl);
}
#viewSummary .summary-title-row{
  display:flex;align-items:center;justify-content:space-between;
}
#viewSummary .summary-title{
  font-family:var(--font-family-live);
  font-size:var(--font-size-heading-page,28px);
  font-weight:var(--font-weight-semibold);
  line-height:1.15;
  color:var(--tl-color-text-inverse-default);
}
#viewSummary .summary-coupon-btn{
  display:inline-flex;align-items:center;gap:var(--space-sm);
  padding:var(--space-sm) var(--space-md);
  border:1px solid var(--color-coupon-red,#ee3c5c);
  border-radius:100px;
  background:transparent;
  font-family:var(--font-family-live);
  font-size:var(--font-size-button-chip);    /* 12px */
  font-weight:var(--font-weight-bold);       /* 700 — chip Bold */
  line-height:var(--line-height-button-chip); /* 16px */
  color:var(--color-coupon-red,#ee3c5c);
  cursor:pointer;
  flex-shrink:0;
}
#viewSummary .summary-coupon-btn img{width:16px;height:16px;display:block;flex-shrink:0;}
#viewSummary .user-info-card{
  padding:var(--space-md) var(--space-lg);
  background:var(--tl-color-bg-baseAlt);
  border:1px solid var(--tl-color-border-inverse-subtle);
  border-radius:var(--border-radius-lg);
  display:flex;flex-direction:row;
  align-items:center;justify-content:space-between;
  gap:var(--space-md);
  text-align:right;
}
#viewSummary .user-info-card__text{
  display:flex;flex-direction:column;
  gap:var(--space-xs);
  flex:1;min-width:0;
}
#viewSummary .user-info-card__name{
  font-family:var(--font-family-live);
  font-size:var(--font-size-body);
  font-weight:var(--font-weight-bold);
  line-height:var(--line-height-button-primary);
  color:var(--tl-color-text-inverse-default);
}
#viewSummary .user-info-card__meta{
  font-family:var(--font-family-live);
  font-size:var(--font-size-caption);
  font-weight:var(--font-weight-regular);
  line-height:var(--line-height-caption);
  color:var(--color-grays-600);
}
/* Empty cart state — Figma 1025:11385, animated (matches רכישת-מינוי) */
#viewSummary .c-empty{
  flex:1;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:var(--space-lg);
  padding:var(--space-xl);
  text-align:center;
  position:relative;
  overflow:hidden;
}
#viewSummary .c-empty.is-hidden{display:none;}
#viewSummary .c-empty__scene{
  position:relative;
  width:227px;height:189px;
  flex-shrink:0;
  z-index:2;
}
#viewSummary .c-empty__illus{
  width:227px;height:189px;
  object-fit:contain;
  display:block;
  position:relative;
}
/* Falling credit cards — one-time shower, gravity-like fall, exits bottom */
#viewSummary .c-empty__card{
  position:absolute;
  top:-100px;
  width:44px;height:28px;
  border-radius:4px;
  z-index:3;
  opacity:0;
  box-shadow:0 4px 10px rgba(0,0,0,0.25);
  pointer-events:none;
  animation:card-fall 1.6s cubic-bezier(.45,0,.9,.9) forwards;
}
#viewSummary .c-empty__card::before{
  content:'';
  position:absolute;inset:4px 6px auto 6px;
  height:3px;border-radius:1px;
  background:rgba(255,255,255,0.55);
}
#viewSummary .c-empty__card::after{
  content:'';
  position:absolute;left:6px;bottom:5px;
  width:10px;height:6px;border-radius:1px;
  background:rgba(255,255,255,0.6);
}
#viewSummary .c-empty__card--1 {left:62%; --r:-24deg; background:#4f8ef7; animation-delay:.04s;}
#viewSummary .c-empty__card--2 {left:18%; --r:14deg;  background:#9b4fe8; animation-delay:.31s;}
#viewSummary .c-empty__card--3 {left:77%; --r:-8deg;  background:#ffc94a; animation-delay:.02s;}
#viewSummary .c-empty__card--4 {left:41%; --r:20deg;  background:#24c08f; animation-delay:.19s;}
#viewSummary .c-empty__card--5 {left:88%; --r:-14deg; background:#f05a6b; animation-delay:.46s;}
#viewSummary .c-empty__card--6 {left:9%;  --r:6deg;   background:#2fb6d1; animation-delay:.12s;}
#viewSummary .c-empty__card--7 {left:55%; --r:-18deg; background:#ff8a3d; animation-delay:.58s;}
#viewSummary .c-empty__card--8 {left:29%; --r:22deg;  background:#4fd6a0; animation-delay:.07s;}
#viewSummary .c-empty__card--9 {left:71%; --r:-6deg;  background:#e855b0; animation-delay:.36s;}
#viewSummary .c-empty__card--10{left:4%;  --r:12deg;  background:#5665f0; animation-delay:.24s;}
#viewSummary .c-empty__card--11{left:48%; --r:-20deg; background:#ffb347; animation-delay:0s;  }
#viewSummary .c-empty__card--12{left:85%; --r:10deg;  background:#3ad3ff; animation-delay:.52s;}
#viewSummary .c-empty__card--13{left:23%; --r:-12deg; background:#a44cff; animation-delay:.42s;}
#viewSummary .c-empty__card--14{left:66%; --r:18deg;  background:#ff5e7e; animation-delay:.28s;}
#viewSummary .c-empty__card--15{left:13%; --r:-28deg; background:#1fbf80; animation-delay:.16s;}
#viewSummary .c-empty__card--16{left:36%; --r:8deg;   background:#ff6b4a; animation-delay:.49s;}
#viewSummary .c-empty__card--17{left:58%; --r:-16deg; background:#6b5bff; animation-delay:.38s;}
#viewSummary .c-empty__card--18{left:82%; --r:24deg;  background:#ffd93d; animation-delay:.21s;}
#viewSummary .c-empty__card--19{left:33%; --r:-4deg;  background:#ec4899; animation-delay:.55s;}
#viewSummary .c-empty__card--20{left:74%; --r:16deg;  background:#06b6d4; animation-delay:.09s;}
#viewSummary .c-empty__text{
  font-family:var(--font-family-live);
  font-size:var(--font-size-h3,18px);
  font-weight:var(--font-weight-regular);
  line-height:1.2;
  color:var(--tl-color-text-inverse-default);
  max-width:280px;
  position:relative;
  animation:empty-shake 1.5s cubic-bezier(.36,.07,.19,.97) .5s;
}
#viewSummary .c-empty__cta{
  margin-top:var(--space-sm);
  position:relative;
  animation:empty-shake 1.5s cubic-bezier(.36,.07,.19,.97) .9s;
}
#viewSummary .c-empty__cta::after{
  content:'';
  position:absolute;inset:-4px;
  border-radius:100px;
  background:var(--tl-color-brand-main);
  opacity:0;z-index:-1;
  animation:empty-pulse 2.4s ease-out 1.2s infinite;
}
@keyframes card-fall{
  0%  {opacity:0; transform:translateY(0) rotate(calc(var(--r) - 10deg));}
  10% {opacity:1;}
  95% {opacity:1;}
  100%{opacity:0; transform:translateY(900px) rotate(calc(var(--r) + 120deg));}
}
@keyframes empty-shake{
  0%,100%{transform:translate(0,0) rotate(0);}
  10%{transform:translate(-2px,1px) rotate(-.5deg);}
  20%{transform:translate(3px,-1px) rotate(.6deg);}
  30%{transform:translate(-3px,2px) rotate(-.4deg);}
  40%{transform:translate(2px,-2px) rotate(.3deg);}
  50%{transform:translate(-2px,1px) rotate(-.3deg);}
  60%{transform:translate(2px,2px) rotate(.4deg);}
  70%{transform:translate(-1px,-1px) rotate(-.2deg);}
  80%{transform:translate(1px,1px) rotate(.2deg);}
  90%{transform:translate(-1px,0) rotate(-.1deg);}
}
@keyframes empty-pulse{
  0%{opacity:.35;transform:scale(1);}
  100%{opacity:0;transform:scale(1.25);}
}
@media (prefers-reduced-motion:reduce){
  #viewSummary .c-empty__illus,
  #viewSummary .c-empty__text,
  #viewSummary .c-empty__cta,
  #viewSummary .c-empty__cta::after{animation:none;opacity:1;transform:none;}
}
/* Hide rest of summary content when empty */
#viewSummary .summary-scroll.is-empty > .summary-title-row,
#viewSummary .summary-scroll.is-empty > .user-info-card,
#viewSummary .summary-scroll.is-empty > .cart-card,
#viewSummary .summary-scroll.is-empty > .cart-grand{display:none;}
#viewSummary .summary-scroll.is-empty{padding:0;}

#cartScreen .c-scroll,
#cartPop .c-scroll{gap:var(--space-lg);}
#cartScreen .cart-grand{margin-bottom:var(--space-md);}
/* «סיכום עגלה» קבוע בתחתית — הכלל חי ב-general/cart-popover.css (אסף 31/07) */

#cartScreen .c-scroll.is-empty > .cart-grand,
#cartPop .c-scroll.is-empty > .cart-grand{display:none;}

/* ============================================================
   COMPLETE V2 — Celebration → Receipt (sketch-completion-from-form)
   ============================================================ */
:root{
  --rcpt-page-bg:#fff;
  --rcpt-card-bg:var(--color-yellows-100,#fff8db);
}
.complete-v2{
  position:relative;
  flex:1;min-height:0;width:100%;
  display:flex;flex-direction:column;
  background:#fff;
  overflow:hidden;
}
.complete-v2 .v2-celebration{
  position:absolute;inset:0;z-index:10;
  background:var(--tl-color-brand-main,#ffcc00);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:var(--space-xl);
  overflow:hidden;
  transition:opacity .55s cubic-bezier(.34,1,.64,1) .1s;
}
.complete-v2.is-receipt-phase .v2-celebration{
  opacity:0;
  pointer-events:none;
}
.v2-celeb-hero{position:relative;width:280px;height:280px;}
.v2-celeb-hero img{position:absolute;display:block;filter:drop-shadow(0 12px 18px rgba(0,0,0,0.15));}
.v2-celeb-thumb{
  width:180px;height:180px;
  top:50%;left:50%;
  transform:translate(-50%,-50%) scale(0) rotate(-30deg);
  z-index:5;
  animation:v2ThumbBurst 0.8s cubic-bezier(.25,.8,.3,1) 0.1s forwards,
            v2ThumbFloat 3.2s ease-in-out 1s infinite;
}
@keyframes v2ThumbBurst{
  0%{transform:translate(-50%,-50%) scale(0) rotate(-30deg);opacity:0;}
  50%{transform:translate(-50%,-50%) scale(1.15) rotate(8deg);opacity:1;}
  100%{transform:translate(-50%,-50%) scale(1) rotate(-8deg);opacity:1;}
}
@keyframes v2ThumbFloat{
  0%,100%{transform:translate(-50%,calc(-50% + 0px)) rotate(-8deg);}
  50%{transform:translate(-50%,calc(-50% - 10px)) rotate(-12deg);}
}
.v2-celeb-star{
  width:64px;height:64px;
  top:50%;left:50%;
  z-index:4;opacity:0;
  --tx:0px;--ty:0px;--rot:0deg;--delay:0s;
  transform:translate(-50%,-50%) scale(0);
  animation:v2StarExplode 0.9s cubic-bezier(.25,.8,.3,1) var(--delay) forwards,
            v2StarFloat 3.6s ease-in-out calc(var(--delay) + 1s) infinite;
}
@keyframes v2StarExplode{
  0%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:0;}
  60%{opacity:1;}
  100%{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1) rotate(var(--rot));opacity:1;}
}
@keyframes v2StarFloat{
  0%,100%{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1) rotate(var(--rot));}
  50%{transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty) - 8px)) scale(1.05) rotate(calc(var(--rot) + 6deg));}
}
.v2-celeb-star.s1{--tx:-110px;--ty:-90px;--rot:-20deg;--delay:0.25s;width:72px;height:72px;}
.v2-celeb-star.s2{--tx:110px;--ty:-100px;--rot:25deg;--delay:0.32s;width:80px;height:80px;}
.v2-celeb-star.s3{--tx:-130px;--ty:70px;--rot:15deg;--delay:0.40s;width:56px;height:56px;}
.v2-celeb-star.s4{--tx:120px;--ty:80px;--rot:-18deg;--delay:0.48s;width:64px;height:64px;}
.v2-celeb-sparkle{
  width:36px;height:36px;
  top:50%;left:50%;
  z-index:3;opacity:0;
  --tx:0;--ty:0;--delay:0s;
  transform:translate(-50%,-50%) scale(0);
  animation:v2StarExplode 0.8s cubic-bezier(.25,.8,.3,1) var(--delay) forwards;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,0.1));
}
.v2-celeb-sparkle.k1{--tx:0;--ty:-130px;--delay:0.55s;width:32px;height:32px;}
.v2-celeb-sparkle.k2{--tx:-160px;--ty:-30px;--delay:0.60s;width:28px;height:28px;}
.v2-celeb-sparkle.k3{--tx:160px;--ty:0;--delay:0.65s;width:30px;height:30px;}
.v2-celeb-title{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-h1,32px);line-height:1.1;
  color:var(--tl-color-text-inverse-default,#000);text-align:center;letter-spacing:-1px;
  opacity:0;transform:translateY(20px);
  animation:v2TitleRise 0.6s cubic-bezier(.34,1.1,.64,1) 0.7s forwards;
}
.v2-celeb-subtitle{
  font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:17px;color:var(--tl-color-text-inverse-default,#000);
  text-align:center;line-height:1.4;max-width:300px;margin-top:-12px;
  opacity:0;transform:translateY(15px);
  animation:v2TitleRise 0.6s cubic-bezier(.34,1.1,.64,1) 0.85s forwards;
}
.v2-celeb-subtitle strong{font-weight:700;}
@keyframes v2TitleRise{to{opacity:1;transform:translateY(0);}}
.v2-celeb-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
.v2-confetti-piece{
  position:absolute;top:-20px;width:8px;height:14px;border-radius:1px;
  animation:v2FallSway 2.2s cubic-bezier(.4,0,.6,1) forwards;
}
@keyframes v2FallSway{
  0%{transform:translate(0,-30px) rotate(0);opacity:1;}
  100%{transform:translate(var(--dx,0),900px) rotate(var(--r,720deg));opacity:0.4;}
}

/* ===== Receipt area ===== */
.v2-receipt-area{
  flex:1;min-height:0;width:100%;
  display:flex;flex-direction:column;align-items:center;
  padding:96px var(--space-2xl) var(--space-xl);
  overflow-y:auto;
  opacity:0;transform:translateY(40px);
  transition:opacity .55s cubic-bezier(.34,1,.64,1) .35s,
             transform .65s cubic-bezier(.34,1.1,.64,1) .35s;
}
.complete-v2.is-receipt-phase .v2-receipt-area{opacity:1;transform:translateY(0);}
.v2-receipt-area::-webkit-scrollbar{display:none;}

.v2-mini-hero{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-lg);}
.v2-mini-group{position:relative;width:140px;height:90px;display:flex;align-items:center;justify-content:center;}
.v2-mini-group img{position:absolute;filter:drop-shadow(0 6px 10px rgba(0,0,0,0.15));}
.v2-mini-thumb{width:72px;height:72px;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);animation:v2MiniThumbFloat 3.2s ease-in-out infinite;}
@keyframes v2MiniThumbFloat{0%,100%{transform:translate(-50%,-50%) rotate(-6deg);}50%{transform:translate(-50%,calc(-50% - 4px)) rotate(-10deg);}}
.v2-mini-star{z-index:2;animation:v2MiniStarFloat 3.4s ease-in-out infinite;}
.v2-mini-star.ms1{width:28px;height:28px;top:6px;right:8px;--r:-15deg;animation-delay:.4s;}
.v2-mini-star.ms2{width:24px;height:24px;bottom:8px;left:10px;--r:18deg;animation-delay:.7s;}
.v2-mini-star.ms3{width:20px;height:20px;top:16px;left:18px;--r:-8deg;animation-delay:.2s;}
@keyframes v2MiniStarFloat{0%,100%{transform:rotate(var(--r,0));}50%{transform:translateY(-3px) rotate(calc(var(--r,0) + 8deg));}}
.v2-mini-sub{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:var(--font-size-caption,12px);color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.55));text-align:center;line-height:1.4;max-width:300px;}
.v2-mini-sub.success{color:var(--tl-color-state-success-main,#465b17);font-weight:700;display:inline-flex;align-items:center;gap:6px;justify-content:center;}
.v2-mini-sub.success svg{width:16px;height:16px;flex-shrink:0;color:var(--tl-color-state-success-main,#465b17);}
.v2-mini-check{width:20px;height:20px;flex-shrink:0;display:block;}

/* Printer slot + receipt extrusion */
.v2-printer{width:100%;display:flex;flex-direction:column;align-items:stretch;margin-top:var(--space-md);position:relative;z-index:1;}
.v2-printer-slot{
  height:8px;
  background:linear-gradient(to bottom,#2a2a2a 0%,#0a0a0a 50%,#1a1a1a 100%);
  border-radius:0;position:relative;
  margin-left:-6px;margin-right:-6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10);
  z-index:1;
}
.v2-receipt-clip{overflow:hidden;width:100%;margin-top:0;position:relative;z-index:10;}
.v2-receipt-card{
  background:var(--rcpt-card-bg);
  width:100%;border-radius:0;
  padding:var(--space-2xl) var(--space-lg) var(--space-lg);
  display:flex;flex-direction:column;gap:var(--space-sm);
  position:relative;
  transform:translateY(-110%);
  transition:transform 1.4s cubic-bezier(.16,1,.3,1) .4s;
  box-shadow:0 2px 4px rgba(0,0,0,0.06),0 8px 18px rgba(0,0,0,0.10),0 18px 32px rgba(0,0,0,0.06),inset 0 8px 12px -6px rgba(0,0,0,0.18);
}
.complete-v2.is-receipt-phase .v2-receipt-card{transform:translateY(0);}

.v2-receipt-main{
  display:flex;flex-direction:column;gap:var(--space-sm);
}
/* Fold block (with the wallet button) — collapsed (no height + folded 3D) until phase 2 */
.v2-receipt-fold{
  display:flex;flex-direction:column;gap:var(--space-sm);
  transform-origin:top center;
  max-height:0;overflow:hidden;
  transform:perspective(500px) rotateX(-90deg);
}
.complete-v2.is-receipt-phase .v2-receipt-fold{
  animation:rcptUnfoldDown 1s cubic-bezier(.34,1.4,.64,1) 2s forwards;
}
@keyframes rcptUnfoldDown{
  0%{
    transform:perspective(500px) rotateX(-90deg);
    max-height:0;
  }
  100%{
    transform:perspective(500px) rotateX(0deg);
    max-height:200px;
  }
}
/* Bottom edge — zigzag torn-paper teeth (white over cream) */
.v2-receipt-card{padding-bottom:calc(var(--space-lg) + 14px);}
.v2-receipt-card::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:10px;
  background-image:
    linear-gradient(45deg,var(--rcpt-page-bg) 50%,transparent 50%),
    linear-gradient(-45deg,var(--rcpt-page-bg) 50%,transparent 50%);
  background-size:10px 10px,10px 10px;
  background-position:0 0,5px 0;
  background-repeat:repeat-x;
}



.v2-receipt-event{font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-h3,18px);line-height:1.2;color:var(--tl-color-text-inverse-default,#000);text-align:center;}
.v2-receipt-event-meta{font-family:'Google Sans','Rubik',sans-serif;font-weight:400;font-size:13px;color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.55));text-align:center;}
.v2-receipt-divider{
  height:2px;
  background-image:linear-gradient(to left,rgba(0,0,0,0.22) 50%,transparent 50%);
  background-size:6px 2px;background-repeat:repeat-x;
  position:relative;margin:var(--space-md) calc(-1 * var(--space-lg));
}
.v2-receipt-divider::before,.v2-receipt-divider::after{
  content:"";position:absolute;width:20px;height:20px;border-radius:50%;
  background:var(--rcpt-page-bg);top:50%;transform:translateY(-50%);
}
.v2-receipt-divider::before{right:-10px;}
.v2-receipt-divider::after{left:-10px;}

.v2-receipt-meta-info{display:flex;flex-direction:column;gap:var(--space-xs);}
.v2-receipt-meta-row{display:flex;justify-content:space-between;align-items:baseline;font-family:'Google Sans','Rubik',sans-serif;font-size:13px;}
.v2-receipt-meta-row .lbl{font-weight:400;color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.65));}
.v2-receipt-meta-row .val{font-weight:700;color:var(--tl-color-text-inverse-default,#000);}

.v2-receipt-inner-actions{display:flex;gap:var(--space-sm);width:100%;justify-content:center;}
.v2-receipt-inner-btn{
  display:flex;align-items:center;justify-content:center;gap:var(--space-sm);
  padding:0 var(--space-xl);height:44px;width:100%;
  background:transparent;color:var(--tl-color-text-inverse-default,#000);
  border:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,0.18));border-radius:var(--r-full);
  font-family:'Google Sans','Rubik',sans-serif;font-size:14px;font-weight:700;cursor:pointer;
  transition:background .15s, transform .12s;
}
.v2-receipt-inner-btn:hover{background:rgba(0,0,0,0.04);}
.v2-receipt-inner-btn:active{transform:scale(.98);}
.v2-receipt-inner-btn svg{width:20px;height:20px;}
.v2-wallet-icon{width:20px;height:20px;flex-shrink:0;display:block;}
/* Black solid variant */
.v2-receipt-inner-btn.is-black{
  background:#000;color:var(--tl-color-text-default);border-color:var(--tl-color-text-inverse-default,#000);
}
.v2-receipt-inner-btn.is-black:hover{background:#1a1a1a;}

/* External round actions — buttons use button-system: btn icon-only cta primary live inverse */
.v2-actions{display:flex;justify-content:space-around;align-items:flex-start;width:100%;margin-top:var(--space-2xl);padding:0 var(--space-md);gap:var(--space-sm);}
.v2-action{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1;}
.v2-action span{font-family:'Google Sans','Rubik',sans-serif;font-size:11px;font-weight:400;color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.6));text-align:center;line-height:1.3;}

/* Invite frame */
.v2-invite-frame{
  width:100%;margin-top:var(--space-xl);
  padding:var(--space-md) var(--space-lg);
  border:1px solid var(--tl-color-border-inverse-subtle,rgba(0,0,0,0.15));border-radius:var(--r-lg);
  text-align:center;display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);
  box-sizing:border-box;
}
.v2-invite-title{font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body-small,14px);color:var(--tl-color-text-inverse-default,#000);}
.v2-invite-link{
  background:none;border:none;cursor:pointer;
  font-family:'Google Sans','Rubik',sans-serif;font-size:13px;color:var(--tl-color-text-inverse-subtle,rgba(0,0,0,0.6));
  text-decoration:underline;padding:4px 8px;
  display:inline-flex;align-items:center;gap:6px;
}
.v2-invite-link svg{width:14px;height:14px;}
.v2-invite-link:hover{color:var(--tl-color-text-inverse-default,#000);}

/* Wallet picker popup */
.v2-wallet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.45);opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:60;}
.v2-wallet-backdrop.is-open{opacity:1;pointer-events:auto;}
.v2-wallet-sheet{
  position:absolute;left:0;right:0;bottom:0;background:#fff;
  border-radius:var(--r-2xl) var(--r-2xl) 0 0;
  padding:var(--space-md) var(--space-lg) var(--space-2xl);
  z-index:61;transform:translateY(100%);
  transition:transform .3s cubic-bezier(.34,1.1,.64,1),box-shadow .15s linear;
  box-shadow:none;
}
.v2-wallet-sheet.is-open{transform:translateY(0);box-shadow:0 -8px 24px rgba(0,0,0,0.18);}
.v2-wallet-sheet__title{font-family:'Google Sans','Rubik',sans-serif;font-weight:700;font-size:var(--font-size-body,16px);color:var(--tl-color-text-inverse-default,#000);text-align:center;margin-bottom:var(--space-md);}
.v2-wallet-sheet__sub{font-family:'Google Sans','Rubik',sans-serif;font-size:13px;color:rgba(0,0,0,0.5);text-align:center;margin-top:-8px;margin-bottom:var(--space-lg);}
.v2-wallet-sheet__list{display:flex;flex-direction:column;gap:var(--space-sm);}
.v2-btn-apple-wallet{
  display:flex;align-items:center;justify-content:center;gap:6px;
  width:100%;height:48px;background:#000;color:#fff;border:none;border-radius:8px;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif;font-weight:500;font-size:var(--font-size-h3,18px);
  cursor:pointer;transition:background .15s,transform .12s;
}
.v2-btn-apple-wallet:hover{background:#1a1a1a;}
.v2-btn-apple-wallet:active{transform:scale(0.98);}
.v2-btn-apple-wallet svg{height:24px;}
.v2-btn-apple-wallet .add-to{font-weight:300;font-size:13px;line-height:1;}
.v2-btn-apple-wallet .stack{display:flex;flex-direction:column;align-items:flex-start;line-height:1;gap:2px;}
.v2-btn-apple-wallet .name{font-weight:600;font-size:var(--font-size-h3,18px);letter-spacing:-0.02em;}
.v2-btn-google-wallet{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;height:48px;background:#000;color:#fff;border:none;border-radius:8px;
  font-family:"Google Sans",Roboto,Arial,sans-serif;font-weight:500;font-size:var(--font-size-body-small,14px);
  cursor:pointer;transition:background .15s,transform .12s;
}
.v2-btn-google-wallet:hover{background:#1a1a1a;}
.v2-btn-google-wallet:active{transform:scale(0.98);}
.v2-btn-google-wallet svg{height:18px;}

/* Hide existing actionbar when complete-v2 is showing */
#viewComplete.is-v2-active ~ .actionbar{display:none;}

/* Hide progress tracker on V2 complete */
#viewComplete.is-v2-active ~ #mainPT,
.form-container.pf-complete-on #mainPT{display:none !important;}

/* In-button spinner (loading state) — centered absolutely inside button */
.actionbar__cta .cta-spinner{
  position:absolute;
  top:50%;left:50%;
  width:24px;height:24px;
  margin:-12px 0 0 -12px;
  border:3px solid rgba(0,0,0,0.20);
  border-top-color:var(--tl-color-text-inverse-default,#000);
  border-radius:50%;
  opacity:0;
  pointer-events:none;
  transform-origin:50% 50%;
}
@keyframes v2CtaSpin{to{transform:rotate(360deg);}}
.actionbar__cta.is-loading{
  background:linear-gradient(var(--tl-color-brand-main),var(--tl-color-brand-main)),#fff !important;
  color:transparent !important;
  pointer-events:none;
}
.actionbar__cta.is-loading > span,
.actionbar__cta.is-loading > img{opacity:0 !important;transition:opacity .15s;}
.actionbar__cta.is-loading .cta-spinner{
  opacity:1 !important;
  animation:v2CtaSpin 0.85s linear infinite;
}

/* === V2 single-overlay stage === */
/* viewComplete becomes a yellow overlay that grows from button position via clip-path,
   stays inside form-container (rounded corners visible), no view transitions. */
#viewComplete.is-v2-active{
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1000;
  background:var(--tl-color-brand-main,#ffcc00);
  overflow:hidden;
  padding:0;
  border-radius:32px 32px 0 0;   /* mirror form-container's rounded top */
  clip-path:circle(0 at 50% calc(100% - 50px));
  -webkit-clip-path:circle(0 at 50% calc(100% - 50px));
  animation:v2StageExpand 0.9s cubic-bezier(.5,0,.2,1) forwards;
  transition:background .45s ease;
}
@keyframes v2StageExpand{
  to{clip-path:circle(150% at 50% calc(100% - 50px));-webkit-clip-path:circle(150% at 50% calc(100% - 50px));}
}
/* Receipt phase — bg turns to receipt page (white-ish), celebration fades, receipt fades in */
#viewComplete.is-v2-active.is-receipt-phase{
  background:#fff;
}
#viewComplete.is-v2-active .v2-celebration{
  position:absolute;inset:0;
  background:transparent;
  opacity:0;
  transition:opacity .35s ease .35s;
}
#viewComplete.is-v2-active:not(.is-receipt-phase) .v2-celebration{
  opacity:1;
}
#viewComplete.is-v2-active.is-receipt-phase .v2-celebration{
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}
#viewComplete.is-v2-active .v2-receipt-area{
  position:absolute;inset:0;
  padding:var(--space-xl) var(--space-2xl);
  padding-top:88px;   /* clear t-header so 3D cluster doesn't collide on scroll */
  overflow-y:auto;
  opacity:0;
  pointer-events:none;
  transition:opacity .4s ease;
}
/* Receipt fades in AFTER celebration fully fades out — no cross-fade overlap */
#viewComplete.is-v2-active.is-receipt-phase .v2-receipt-area{
  opacity:1;pointer-events:auto;
  transition:opacity .4s ease .5s;
}
/* Hide actionbar during V2 */
#viewComplete.is-v2-active ~ .actionbar,
.form-container.pf-complete-on .actionbar{display:none;}
/* Hide progress tracker during V2 */
#viewComplete.is-v2-active ~ #mainPT,
.form-container.pf-complete-on #mainPT{display:none !important;}

/* Header: stays in DOM but z-index above viewComplete so it shows on receipt phase */
.t-header{position:relative;z-index:1100;}
/* During celebration (V2 active, not receipt yet) — hide header (yellow stays clean) */
.form-container.pf-complete-on:not(.pf-receipt) .t-header{
  opacity:0;
  pointer-events:none;
  transition:opacity .25s ease;
}
/* On receipt phase — restore header buttons + opaque bg so scroll content goes BEHIND it */
.form-container.pf-receipt .t-header{
  opacity:1;
  pointer-events:auto;
  background:var(--tl-color-bg-baseAlt,#fff);
  border-radius:32px 32px 0 0;   /* match form-container rounded top so corners stay round */
  transition:opacity .35s ease .2s;
}

/* שורת-האירוע בראש הטופס נמחקה — הכרעת אסף 05/08 («התכוונתי זה»).
   ה-API openFor נשאר; בלי השורה הוא פשוט פותח את הטופס. */


/* ══════════════════════════════════════════════════════════════════════════
   ניסוי 13/08 (אסף) — ראש-הטופס העצמאי: פס-גרירה במקום X, שורה אחת
   --------------------------------------------------------------------------
   מקור-האמת: פיגמה «Cart · Mobile» → FormContainer, צומת 102:27624.
   המידות נמדדו מהקובץ (לא הוערכו), ואלה היעדים — מרחק מראש הגיליון:

     פס-הגרירה .............. 12 · 36×4          (אזור-אחיזה 20)
     כפתור-הסל .............. 36 · 44×44
     כותרת-המסך ............. 36 · גובה 20       ← ראש-הכותרת = ראש-הכפתור
     פסי-ההתקדמות ........... 68 · גובה 4
     כפתור+שעון ............. 36 · גובה 79
     באנר-הקופון ............ 131 · שוליי-צד 16

   🔑 הכותרת והכפתור מיושרים **בראשם** (שניהם 36), לא במרכזם — הכפתור פשוט
   נמשך נמוך יותר. הפסים (68) עוברים בתוך טווח-הכפתור, ולכן הם מפנים לו
   מקום אופקית.

   מה שמוסתר בניסוי: ה-X, האווטר וכפתור-הנגישות. הסל והקופון נשארים.
   להסרת הניסוי — למחוק את כל המקטע הזה, את .pf-grab מ-purchase-form.html
   ואת מאזין-הגרירה מ-purchase-form.js. שום דבר אחר לא נגוע.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── מה יורד ──────────────────────────────────────────────────────────────── */
.t-header > .t-icon-btn[aria-label="סגור"],
.t-icon-btn.profile-btn,
.t-icon-btn.accessibility{display:none;}

/* ── פס-הגרירה ────────────────────────────────────────────────────────────────
   אותו רכיב-שפה כמו mp-handle של המיני-פופ (minipopup.css §40) — 36×4,
   grays-500, 12 מעל ו-4 מתחת. בזרימה, כך שהוא דוחף את השורה במקום לצוף. */
#formPopup .form-container{position:relative;}   /* עוגן לשורת-האייקונים */
.pf-grab{
  position:relative;
  width:36px;                              /* מידת mp-handle — אין לה טוקן-רוחב */
  height:var(--space-xs,4px);
  border-radius:var(--r-full,999px);
  background:var(--color-grays-500,#b1b1b1);
  margin:var(--space-md,12px) auto var(--space-xs,4px);
  flex-shrink:0;
  cursor:grab;
  touch-action:none;                       /* הגרירה שלנו, לא גלילת-הדף */
}
.pf-grab::before{                          /* יעד-מגע נדיב — 4px אי-אפשר לתפוס */
  content:'';position:absolute;
  inset:calc(-1*var(--space-md,12px)) calc(-1*var(--space-2xl,32px));
}
.pf-grab:active{cursor:grabbing;}
@media(min-width:1024px){ .pf-grab{display:none;} }   /* מחוות-מגע בלבד */

/* ── שורה אחת: כותרת מימין, סל משמאל ───────────────────────────────────────
   שורת-האייקונים יוצאת מהזרימה ומרחפת מעל שורת-הכותרת. שקופה — רק
   הכפתורים עצמם לוכדים לחיצות. */
.t-header{
  position:absolute; left:0; right:0;
  top:calc(var(--space-md,12px) + 2*var(--space-xs,4px));   /* 20 — מתחת לפס */
  pointer-events:none;
  justify-content:flex-end;                /* ה-X ירד; בלי זה הסל קופץ ימינה */
  /* 🔑 24 ולא 16 — בפיגמה הכפתור יושב ב-left:24 (אסף 13/08: «יש רווח בצד
     שמאל»). זה גם מה שנותן לגלולת-השעון, הרחבה מהכפתור, מקום לנשום
     במקום להיחתך בקצה. */
  padding-inline-end:var(--space-xl,24px);
}
.t-header .t-icon-btn{pointer-events:auto;}

/* ── מד-ההתקדמות ───────────────────────────────────────────────────────────
   #formContainer בכוונה: progress-tracker.css נטען אחרי הקובץ הזה, ובלי
   המזהה הוא מחזיר את השורה ל-20px — ואז הכפתור (44) גולש על הפסים. */
#formContainer .pt{
  margin-block:var(--space-lg,16px) var(--space-xl,24px);   /* ראש הכותרת ב-36 */
  gap:var(--space-md,12px);                                 /* הפסים ב-68 */
}
/* הפינוי לכפתור: 24 (ההיסט שלו) + 44 (רוחבו) + 24 (רווח) = 92 מהקצה.
   ל-.pt יש כבר 16 שוליים משלו, ולכן התוספת כאן היא 44+24+8. */
#formContainer .pt__row,
#formContainer .pt__bars{
  padding-left:calc(var(--dim-11,44px) + var(--space-xl,24px) + var(--space-sm,8px));
}
#formContainer .pt__row{
  height:var(--dim-5,20px);                /* גובה-הכותרת עצמה, לא גובה-הכפתור */
}
/* כותרת ארוכה נחתכת ולא זולגת מתחת לכפתורים */
#formContainer .pt__row .pt__label{min-width:0;overflow:hidden;text-overflow:ellipsis;}

/* כפתור-הקופון חוזר לשורה (אחרי סגירת-הבאנר) — מקום לשניים */
#formContainer.pf-coupon-on .pt__row,
#formContainer.pf-coupon-on .pt__bars{
  padding-left:calc(2*var(--dim-11,44px) + 2*var(--space-sm,8px) + var(--space-xl,24px));
}

/* ── מקום לשעון הצף ────────────────────────────────────────────────────────
   (אסף: «לא לזז לצד אלא לתת רווח למטה».) בפיגמה הכפתור+שעון = 79, ואחריהם
   16 עד הבאנר. הפסים נגמרים מעל תחתית-הכפתור, ולכן הרווח נמדד משם. */
#formContainer.pf-timer-on .pt{
  margin-bottom:calc(
    var(--space-sm,8px)      /* מהפסים עד תחתית-הכפתור */
    + var(--dim-6,24px)      /* גובה גלולת-השעון */
    + var(--space-sm,8px)    /* הזנב שלה */
    + var(--space-lg,16px)   /* ועד הבאנר */
  );
}

/* ── «הצלחנו!» — מיד אחרי האימות (פיגמה 2412:94923, אסף 18/08 — נייח וגם נייד): גיליון לבן (נייח 500 · נייד מלא),
   ריפוד 90/16/24/16, רווח 16; וי בעיגול green/50 בקוטר 119 שבולט חצי מעל הגיליון;
   כותרת Rubik Regular 44 · ברכה 18/120% · «המשך» brand 44 ברוחב מלא. ── */
/* ‎.auth-popup-sheet.‎ כפול — כדי לגבור על כלל-המגירה (body.pf-drawer-mode .auth-popup-sheet{padding…}) */
.auth-popup-sheet.auth-popup-sheet--done,
body.pf-drawer-mode .auth-popup-sheet.auth-popup-sheet--done{
  position:relative;
  padding:90px var(--space-lg,16px) var(--space-xl,24px);   /* 90 = מידה מהפיגמה (מקום לוי הבולט), אין טוקן */
  gap:var(--space-lg,16px);
  align-items:center;text-align:center;
  overflow:visible;
}
.auth-done__check{
  position:absolute;top:-59px;left:50%;transform:translateX(-50%);   /* חצי-קוטר מעל הקצה */
  width:119px;height:119px;border-radius:var(--r-full,999px);
  background:var(--color-green-50,#fcffe7);
  color:var(--color-green-400,#b9ca20);
  display:flex;align-items:center;justify-content:center;
}
.auth-done__check svg{width:65px;height:65px;display:block;}
.auth-done__title{
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-weight:var(--font-weight-regular,400);
  font-size:var(--font-size-heading-hero,44px);line-height:1.2;color:var(--ta-color-text-default,#000);   /* hero = 44 בנייח */
}
.auth-done__text{
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-weight:var(--font-weight-regular,400);
  font-size:18px;line-height:1.2;color:var(--ta-color-text-default,#000);
}
#authDoneNext{width:100%;}
/* בגיליון-ההצלחה אין שורת-ראש/X — סוגרים רק דרך «המשך» */

/* «המשך» בהצלחנו! — מד-התקדמות זמני שממלא את הכפתור לבד (אסף 18/08): שכבה כהה-שקופה
   שגדלה משמאל לימין במשך --auto-ms, ואז הזרימה ממשיכה; לחיצה מקדימה. */
#authDoneNext{position:relative;overflow:hidden;}
#authDoneNext.is-auto::before{
  content:'';position:absolute;inset:0;
  width:0;
  background:var(--color-black-alpha-10, rgba(0,0,0,0.1));
  animation:authDoneFill var(--auto-ms,3000ms) linear forwards;
  pointer-events:none;
}
#authDoneNext > *{position:relative;}
@keyframes authDoneFill{to{width:100%;}}
/* הוי בולט 59px מעל הגיליון — כשהפופ סגור (מוזז למטה) הוא הציץ מעל קצה-המסך; מסתירים אחרי המעבר */
.auth-popup:not(.open) .auth-done__check{opacity:0;transition:opacity 0s .35s;}
.auth-popup.open .auth-done__check{opacity:1;}
/* «סגור» בפופאפ מידע-נוסף — נייח בלבד (פיגמה 2425:187337); בנייד «הבנתי» לבד */
.info-popup__close{display:none;}

/* ── פופ-ההתחברות — נייד ונייח (פיגמה נייד 102:124839 · נייח מ2/מ3) — שורת-ראש (X + כותרת), סדר, ריפודים ── */
.auth-popup-sheet,
.auth-otp-sheet{
  /* נייד (102:124839): ריפוד 0/24/24, רווח 24; נייח מוסיף 16 למטה (purchase-drawer.css) */
  padding:0 var(--space-xl,24px) var(--space-xl,24px);
  gap:var(--space-xl,24px);
}
/* שורת-הראש: כותרת Bold 20 מימין + X עגול 32 משמאל (ריפוד 24/16 — מקזז את ריפוד-הגיליון) */
.pf-auth-head{
  display:flex;
  width:calc(100% + 2*var(--space-xl,24px));
  margin:0 calc(-1*var(--space-xl,24px));
  padding:var(--space-xl,24px) var(--space-lg,16px);
  margin-bottom:calc(-1 * var(--space-sm,8px));   /* מהראש (80) לגוף 16, לא 24 (ריפוד-הגוף בפיגמה 16) */
  align-items:center;justify-content:flex-end;gap:var(--space-lg,16px);
  direction:ltr;                                   /* X בקצה הימני, הכותרת צמודה אליו משמאלו — נייד ונייח (הכרעת אסף 19/08) */
}
/* בנייד יש פס-גרירה (20 גובה בפיגמה) לפני שורת-הראש; בנייח הוא מוסתר והרווח מתאפס (purchase-drawer.css) */
.auth-handle ~ .pf-auth-head{margin-top:20px;}
/* פרטים (354:91067): אין שורת-ראש — הכותרת יושבת 16 מתחת לפס-הגרירה (הפס 12 מהקצה + 4 גובה) */
#authLoginView .pf-auth-head[style*="display: none"] ~ .auth-header{margin-top:calc(12px + 4px + var(--space-lg,16px));}
.pf-auth-head__title{
  direction:rtl;text-align:right;
  font-family:'Google Sans',var(--font-family-live,'Rubik'),sans-serif;font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-heading-modal,20px);line-height:1;color:var(--tl-color-text-inverse-default,#000);
}
/* ה-X מגיע ממערכת-הכפתורים (btn icon-only category primary app = 32, אייקון 16) — בלי סגנון מקומי */
.pf-auth-head__x{flex:none;}
/* גוף גיליון-ההתחברות בסדר הפיגמה («פלואו סוגי הרשמה» נייח 2612:174071 · נייד 354:91067):
   כותרת-משנה → נייד + «שלח אימות» → «או» → Google → «או» → אורח (אסף 19/08) */
#authLoginView .auth-header{order:1;}
#authLoginView .auth-phone-section{order:2;}
#authLoginView .auth-divider{order:3;}
#authLoginView .auth-google-btn{order:4;}
#authLoginView .auth-google-btn ~ .auth-divider{order:5;}
#authLoginView .auth-guest-btn{order:6;}
#authLoginView .auth-title{display:none;}                 /* בפיגמה רק כותרת-המשנה */
#authLoginView .auth-subtitle{font-weight:var(--font-weight-bold,700);}
.auth-otp-sheet .otp-header{margin-top:0;}

/* ═══ Google Sign-in mock (פיגמה: נייח 2612:176263 · נייד 354:91935) ═══════════════
   מדמה את חלון-גוגל האמיתי: גופן Roboto/Google Sans, כחול #1a73e8, אפורים של גוגל.
   ברירת-המחדל (נייד) = גיליון-מלמטה; מ-900 ומעלה = חלון ממורכז «Choose an account». */
.gsi{position:fixed;inset:0;z-index:700;display:none;font-family:'Google Sans','Roboto','Rubik',Arial,sans-serif;color:#1f1f1f;}
.gsi.open{display:block;}
.gsi__scrim{position:absolute;inset:0;background:rgba(0,0,0,.5);opacity:0;transition:opacity .2s;}
.gsi.open .gsi__scrim{opacity:1;}
.gsi__dialog{position:absolute;background:#fff;box-shadow:0 4px 8px 3px rgba(0,0,0,.15),0 1px 3px rgba(0,0,0,.3);overflow:hidden;}
.gsi__dialog--chooser{display:none;}
.gsi__dialog--sheet{left:0;right:0;bottom:0;border-radius:28px 28px 0 0;transform:translateY(100%);transition:transform .28s cubic-bezier(.2,0,0,1);}
.gsi.open .gsi__dialog--sheet{transform:translateY(0);}
.gsi__bar{display:flex;align-items:center;gap:10px;height:56px;padding:0 16px;border-bottom:1px solid #dadce0;font-size:15px;font-weight:500;color:#1f1f1f;}
.gsi__bar .gsi__logo{flex:none;}
.gsi__x{margin-left:auto;border:0;background:transparent;color:#444746;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.gsi__x:hover{background:rgba(60,64,67,.08);}
.gsi__body{padding:24px 24px 16px;}
.gsi__h1{margin:0;font-weight:400;font-size:24px;line-height:32px;letter-spacing:0;color:#1f1f1f;}
.gsi__h1--sheet{font-size:22px;line-height:28px;margin:4px 0 16px;}
.gsi__row{display:flex;align-items:center;gap:16px;margin-bottom:20px;}
.gsi__desc{margin:0;font-size:14px;line-height:20px;color:#444746;flex:1;}
.gsi__art{flex:none;width:104px;height:88px;border-radius:16px;
  background:radial-gradient(circle at 35% 40%,#fbbc05 0 18px,transparent 19px),radial-gradient(circle at 70% 30%,#ea4335 0 12px,transparent 13px),
  radial-gradient(circle at 30% 75%,#34a853 0 14px,transparent 15px),radial-gradient(circle at 72% 72%,#4285f4 0 16px,transparent 17px),#f1f3f4;}
.gsi__continue{width:100%;height:48px;border:0;border-radius:24px;background:#0b57d0;color:#fff;font:500 15px/48px 'Google Sans','Roboto',Arial,sans-serif;cursor:pointer;}
.gsi__continue:hover{background:#0842a0;box-shadow:0 1px 2px rgba(60,64,67,.3);}
/* chooser */
.gsi__appmark{width:56px;height:56px;border-radius:14px;border:1px solid #dadce0;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:16px;background:#fff;}
.gsi__appmark img{width:44px;height:44px;object-fit:contain;}
.gsi__sub{margin:6px 0 20px;font-size:16px;line-height:24px;color:#1f1f1f;}
.gsi__sub a{color:#0b57d0;text-decoration:none;font-weight:500;}
.gsi__accounts{list-style:none;margin:0;padding:0;}
.gsi__accounts li{border-top:1px solid #dadce0;}
.gsi__accounts li:last-child{border-bottom:1px solid #dadce0;}
.gsi__acct{width:100%;display:flex;align-items:center;gap:16px;padding:12px 4px;border:0;background:transparent;cursor:pointer;text-align:left;font-family:inherit;border-radius:0;transition:background .12s;}
.gsi__acct:hover{background:#f8fafd;}
.gsi__avatar{flex:none;width:28px;height:28px;border-radius:50%;background:var(--c,#5f6368);color:#fff;font:500 14px/28px 'Roboto',Arial,sans-serif;text-align:center;}
.gsi__avatar--other{background:transparent;color:#444746;display:flex;align-items:center;justify-content:center;}
.gsi__acct-txt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.gsi__acct-txt b{font-weight:500;font-size:14px;line-height:20px;color:#1f1f1f;}
.gsi__acct-txt span{font-size:14px;line-height:20px;color:#444746;}
.gsi__acct--other .gsi__acct-txt b{font-weight:500;}
.gsi__signedout{font-size:12px;color:#444746;margin-right:4px;}
.gsi__legal{margin:20px 0 8px;font-size:14px;line-height:20px;color:#444746;}
.gsi__legal a{color:#0b57d0;text-decoration:none;font-weight:500;}
.gsi__foot{display:flex;align-items:center;justify-content:space-between;padding:12px 24px 16px;font-size:12px;color:#444746;}
.gsi__lang{display:inline-flex;align-items:center;gap:2px;}
.gsi__links{display:inline-flex;gap:16px;}
@media (min-width:900px){
  .gsi__dialog--sheet{display:none;}
  .gsi__dialog--chooser{display:block;left:50%;top:50%;width:min(488px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;border-radius:28px;
    transform:translate(-50%,-50%) scale(.96);opacity:0;transition:transform .2s cubic-bezier(.2,0,0,1),opacity .2s;}
  .gsi.open .gsi__dialog--chooser{transform:translate(-50%,-50%) scale(1);opacity:1;}
  .gsi__bar{border-bottom:1px solid #dadce0;}
}
/* בדמו-הנייח (מגירה) הפריים הוא 1000 רחב — החלון ממורכז על כל המסך, כמו בפיגמה */

/* ══════════════════════════════════════════════════════════════════════════
   מגירת-התוכן — אירוע מול מנוי (אסף 20/08: «Purchase אמור להיות הכל, מאוחד»)
   זהו המקום היחיד בטופס שבו השניים נבדלים. התהליך — פרטים, סיכום, תשלום,
   אשראי, סיום — משותף, ולכן תיקון בו נעשה פעם אחת ומגיע לשניהם.
   המצב נקבע ב-‎data-purchase-mode‎ על ‎#formContainer‎; ברירת-המחדל היא אירוע.
   ══════════════════════════════════════════════════════════════════════════ */
.pf-content{
  display:flex;flex-direction:column;
  gap:var(--space-lg,16px);
  min-height:0;
  flex-shrink:0;   /* בלי זה המכל נדחס לגובה הפנוי ב-form-scroll והרשימה לא נגללת (באג-הגלילה בנייד, אסף 26/08); מצב-מנוי דורס עם flex:1 בכוונה */
}
#formContainer[data-purchase-mode="subscription"] [data-purchase-content="event"],
#formContainer:not([data-purchase-mode="subscription"]) [data-purchase-content="subscription"]{
  display:none;
}
/* «יש לך מינוי? התחבר וממש קרדיטים» — תוכן-אירוע (מנוי קיים מממש); ברכישת
   מינוי אין למה להתחבר (אסף 20/08: «לא הגיוני להתחבר מינוי, הרי מדובר רכישת מינוי») */
#formContainer[data-purchase-mode="subscription"] .subscription-container{display:none;}
/* מגירת-המנוי ממלאת את הגובה — כרטיס-השורות נגלל בתוכה, כמו במסך-המחירון המקורי */
#formContainer[data-purchase-mode="subscription"] [data-purchase-content="subscription"]{
  flex:1;min-height:0;gap:0;
}
/* ‎viewTickets‎ כבר מרפד לרוחב (‎0 16px‎), ולכן שוליי-הרכיב היו מכפילים את ההזחה */
[data-purchase-content="subscription"] .pricing-card__sticky,
[data-purchase-content="subscription"] .pricing-card{
  margin-inline:0;
}

/* «התשלום עבר בהצלחה!» — כותרת מסך-הסיום במצב-מנוי (פיגמה 2474:104160);
   באירוע הכותרת חיה בשלב-החגיגה, ולכן כאן היא מוצגת במנוי בלבד */
.v2-mini-title{display:none;}
#formContainer[data-purchase-mode="subscription"] .v2-mini-title{
  display:block;
  font-family:'Google Sans','Rubik',sans-serif;
  font-weight:var(--font-weight-bold,700);
  font-size:var(--font-size-heading-modal,20px);
  line-height:1.2;text-align:center;
  color:var(--ta-color-text-default,#000);
}

/* פעולות-הסיום במצב-מנוי — הרווחים מהפיגמה (2633:50300): שלוש קוביות 70
   צמודות (רווח 0) וממורכזות; כפתור 44, תווית 6 מתחתיו. באירוע (4 פעולות)
   הפריסה נשארת מלוא-הרוחב. */
#formContainer[data-purchase-mode="subscription"] .v2-actions{
  justify-content:center;
  gap:0;
  padding:0;
}
#formContainer[data-purchase-mode="subscription"] .v2-action{
  flex:0 0 70px;
  width:70px;
}