/* ── fortune-v2 UI polish ───────────────────────────────────────
   Scope: only loaded by /fortune-v2/. Brand-consistent modals,
   next-available badges, teacher match quiz, sticky mobile CTA,
   scroll reveals. */

/* ═══ 1. Phone flow dialog → warm brand ═══ */
.phone-flow-dialog{
  background:linear-gradient(165deg, #fffdf8 0%, #fff5e4 100%);
  border:1px solid rgba(199,164,106,.42);
  box-shadow:0 30px 70px rgba(92,69,38,.32);
}
.phone-flow-dialog::backdrop{
  background:rgba(46,33,16,.5);
  backdrop-filter:blur(4px);
}
.phone-flow-head h3{ color:#3d2c14; }
.phone-flow-close{
  background:rgba(199,164,106,.18);
  color:#6b4d31;
  font-weight:700;
}
.phone-flow-close:hover{ background:rgba(199,164,106,.32); }
.phone-flow-body{ color:#5a4a33; }
.phone-flow-label{ color:#6b4d31; }
.phone-flow-body ul li::marker{ color:#b08136; }

/* Zoom install link → button (text swapped by fortune-v2-ui-polish.js) */
.phone-flow-body a[data-edit-key="fortune-flow-dialog-zoom-link"]{
  display:inline-flex;
  align-items:center;
  gap:8px;
  justify-self:start;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  background:linear-gradient(135deg, #4a3623 0%, #715230 100%);
  color:#fff4da;
  text-decoration:none;
  border:1px solid rgba(69,49,29,.62);
  border-radius:999px;
  padding:10px 18px;
  font-weight:700;
  font-size:14px;
  box-shadow:0 10px 22px rgba(89,62,36,.28);
}
.phone-flow-body a[data-edit-key="fortune-flow-dialog-zoom-link"]:hover{
  background:linear-gradient(135deg, #5b422b 0%, #84603a 100%);
  color:#fff4da;
}

/* ═══ 2. Slot booking dialog → warm brand ═══ */
.fortune-booking-dialog::backdrop{
  background:rgba(46,33,16,.5);
  backdrop-filter:blur(4px);
}
.fortune-booking-dialog__card{
  background:linear-gradient(165deg, #fffdf8 0%, #fff7e9 100%);
  border:1px solid rgba(199,164,106,.4);
  box-shadow:0 30px 70px rgba(92,69,38,.32);
}
.fortune-booking-dialog__head{
  border-bottom:1px solid rgba(199,164,106,.26);
  background:linear-gradient(135deg, rgba(255,250,240,.92), rgba(255,242,214,.55));
}
.fortune-booking-dialog__head h3{ color:#3d2c14; }
#v2SlotDialog .fortune-book-now__panel{
  background:transparent;
  border:none;
  box-shadow:none;
}
#v2SlotDialog .fortune-book-now__tz{ color:#8a7559; }
#v2SlotDialog .fortune-book-now__open-hours{
  color:#6f614d;
  font-size:12px;
  line-height:1.42;
  font-weight:760;
}
#v2SlotDialog .fortune-book-now__open-hours.is-alert{ color:#c56a12; }
#v2SlotDialog .fortune-book-now__day{
  background:rgba(255,255,255,.9);
  border-color:rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .18);
  color:#3d2c14;
  box-shadow:0 8px 18px rgba(82,57,22,.045), inset 0 1px 0 rgba(255,255,255,.7);
}
#v2SlotDialog .fortune-book-now__day.is-active{
  background:
    linear-gradient(135deg, rgba(255,255,255,.24) 0%, rgba(255,255,255,0) 38%),
    linear-gradient(135deg, #8f5a16 0%, #c78a2c 44%, #f0c76a 100%);
  border-color:rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .16);
  color:#fffdf7;
  box-shadow:0 14px 24px rgba(120,74,18,.24), inset 0 1px 0 rgba(255,255,255,.3), inset 0 -2px 0 rgba(90,53,10,.16);
}
#v2SlotDialog .fortune-book-now__slot{
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(255,252,247,.96) 100%);
  border-color:rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .24);
  box-shadow:0 10px 20px rgba(64,42,15,.055), inset 0 1px 0 rgba(255,255,255,.74);
}
#v2SlotDialog .fortune-book-now__slot:hover{
  border-color:rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .42);
  box-shadow:0 14px 26px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .11), inset 0 1px 0 rgba(255,255,255,.78);
}
#v2SlotDialog .fortune-book-now__slot.is-selected{
  border-color:rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .46);
  background:linear-gradient(180deg, #fffdf8 0%, var(--slot-brand-gold-soft, #fff4df) 100%);
  box-shadow:0 12px 24px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .09), inset 3px 0 0 rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .82), inset 0 1px 0 rgba(255,255,255,.78);
}
#v2SlotDialog .fortune-book-now__slot.is-disabled,
#v2SlotDialog .fortune-book-now__slot.is-booked,
#v2SlotDialog .fortune-book-now__slot.is-held-other{
  background:rgba(246,246,245,.94);
  border-color:rgba(119,111,101,.16);
  color:#9a9690;
}
#v2SlotDialog .phone-flow-close,
#v2SlotDialog #v2SlotClose{
  background:rgba(255,255,255,.72);
  border:1px solid rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .16);
  color:var(--slot-brand-gold-dark, #7d5b23);
  box-shadow:0 8px 18px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .08);
}
#v2SlotDialog #v2SlotRefresh{
  background:rgba(255,255,255,.78);
  border:1px solid rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .24);
  color:var(--slot-brand-gold-dark, #7d5b23);
  font-weight:700;
  box-shadow:0 8px 16px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .07);
}
#v2SlotDialog #v2SlotRefresh:hover{
  background:rgba(255,255,255,.94);
  border-color:rgba(var(--slot-brand-gold-rgb, 184, 137, 54), .38);
  box-shadow:0 12px 22px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .1);
}
#v2SlotDialog #v2SlotCta{
  background:
    linear-gradient(135deg, rgba(255,255,255,.24) 0%, rgba(255,255,255,0) 38%),
    linear-gradient(135deg, var(--slot-brand-gold-dark, #7d5b23) 0%, var(--slot-brand-gold, #b88936) 100%);
  color:#fffdf7;
  border:1px solid rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .16);
  box-shadow:0 16px 30px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .24), inset 0 1px 0 rgba(255,255,255,.3), inset 0 -2px 0 rgba(90,53,10,.16);
  font-weight:900;
}
#v2SlotDialog #v2SlotCta:hover{
  filter:saturate(1.03) brightness(1.02);
  border-color:rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .22);
  color:#fffdf7;
  box-shadow:0 20px 34px rgba(var(--slot-brand-gold-dark-rgb, 125, 91, 35), .28), inset 0 1px 0 rgba(255,255,255,.32), inset 0 -2px 0 rgba(90,53,10,.18);
}

/* ═══ 3. Next-available slot badge on teacher cards ═══ */
.fv2-next-slot{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-top:7px;
  padding:4px 12px;
  border-radius:14px;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.01em;
  line-height:1.4;
  color:#136036;
  background:linear-gradient(135deg, #ecfdf3 0%, #d8f6e4 100%);
  border:1px solid rgba(22,128,70,.3);
  box-shadow:0 6px 14px rgba(22,128,70,.1);
  max-width:100%;
  box-sizing:border-box;
  white-space:normal;
  overflow-wrap:anywhere;
}
.fv2-next-slot__main{
  min-width:0;
}
.fv2-next-slot::before{ content:"⚡"; font-size:11px; flex:0 0 auto; }
.fv2-next-slot__tz{
  font-size:11px;
  font-weight:700;
  color:#2f7d52;
  white-space:nowrap;
}
/* the badge lives inside a flex row next to the avatar — let it shrink */
.fortunev2-teacher-head .fortunev2-teacher-meta{ min-width:0; }

.fortunev2-teachers .fortunev2-teacher-head{
  min-height:184px;
  height:auto;
}

@media (max-width: 900px){
  .fortunev2-teachers .fortunev2-teacher-head{
    min-height:164px;
    height:auto;
  }
}

@media (max-width: 520px){
  .fortunev2-teachers .fortunev2-teacher-head{
    min-height:150px;
    height:auto;
  }

  .fv2-next-slot{
    display:grid;
    grid-template-columns:auto minmax(0, 1fr);
    column-gap:8px;
    row-gap:2px;
    align-items:center;
    width:100%;
    padding:6px 12px;
    overflow-wrap:normal;
  }
  .fv2-next-slot::before{
    grid-column:1;
    grid-row:1 / span 2;
    align-self:center;
    margin-top:1px;
  }
  .fv2-next-slot__main{
    grid-column:2;
    grid-row:1;
    white-space:normal;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .fv2-next-slot__tz{
    grid-column:2;
    grid-row:2;
    white-space:normal;
    line-height:1.3;
  }
}

/* ═══ 4. Teacher match quiz ═══ */
.fv2-quiz-trigger{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  margin:12px 0 4px;
  padding:12px 14px;
  border:1px solid rgba(159,121,48,.22);
  border-radius:16px;
  background:linear-gradient(135deg, rgba(255,255,255,.94), rgba(255,248,234,.82));
  box-shadow:0 8px 20px rgba(57,42,18,.07);
  cursor:pointer;
  font:inherit;
  text-align:left;
  transition:border-color .18s ease, box-shadow .18s ease;
  box-sizing:border-box;
}
.fv2-quiz-trigger:hover{
  border-color:rgba(176,129,54,.5);
  box-shadow:0 12px 26px rgba(57,42,18,.12);
}
.fv2-quiz-trigger__text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:1px;
}
.fv2-quiz-trigger__title{
  display:block;
  font-size:14.5px;
  font-weight:800;
  color:#3d2c14;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.fv2-quiz-trigger__sub{
  display:block;
  font-size:12.5px;
  color:#8a7559;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.fv2-quiz-trigger__go{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:8px 14px;
  border-radius:999px;
  background:#fffdfa;
  border:1.5px solid rgba(194,151,84,.55);
  color:#8c642d;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
.fv2-quiz-trigger:hover .fv2-quiz-trigger__go{
  background:#fff5e1;
  border-color:rgba(176,129,54,.8);
}

.fv2-quiz-dialog{
  border:1px solid rgba(199,164,106,.42);
  border-radius:22px;
  padding:0;
  width:min(480px, 94vw);
  background:linear-gradient(165deg, #fffdf8 0%, #fff5e4 100%);
  box-shadow:0 30px 70px rgba(92,69,38,.32);
}
.fv2-quiz-dialog::backdrop{
  background:rgba(46,33,16,.5);
  backdrop-filter:blur(4px);
}
.fv2-quiz{
  padding:20px;
  display:grid;
  gap:14px;
}
.fv2-quiz__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.fv2-quiz__title{
  margin:0;
  font-size:18px;
  font-weight:900;
  color:#3d2c14;
}
.fv2-quiz__progress{
  display:flex;
  gap:6px;
}
.fv2-quiz__dot{
  width:26px;
  height:5px;
  border-radius:999px;
  background:rgba(199,164,106,.25);
  transition:background .25s ease;
}
.fv2-quiz__dot.is-on{
  background:linear-gradient(135deg, #ffb347, #d97706);
}
.fv2-quiz__q{
  margin:0;
  font-size:15.5px;
  font-weight:800;
  color:#5a4a33;
}
.fv2-quiz__options{
  display:grid;
  gap:9px;
}
.fv2-quiz__opt{
  display:flex;
  align-items:center;
  gap:10px;
  padding:13px 16px;
  border:1.5px solid rgba(159,121,48,.3);
  border-radius:15px;
  background:#fffdfa;
  color:#3d2c14;
  font-size:14.5px;
  font-weight:700;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
}
.fv2-quiz__opt:hover{
  border-color:rgba(166,96,20,.62);
  background:#fff5e1;
  transform:translateY(-1px);
}
.fv2-quiz__opt-emoji{ font-size:18px; flex:0 0 auto; }
.fv2-quiz__close{
  border:none;
  background:rgba(199,164,106,.18);
  color:#6b4d31;
  border-radius:999px;
  width:28px;
  height:28px;
  cursor:pointer;
  font-weight:700;
}
.fv2-quiz__close:hover{ background:rgba(199,164,106,.32); }
.fv2-quiz__back{
  justify-self:start;
  border:none;
  background:none;
  color:#8a7559;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  padding:4px 2px;
  font-family:inherit;
}
.fv2-quiz__back:hover{ color:#5a4a33; text-decoration:underline; }

/* result card */
.fv2-quiz__result{
  display:grid;
  gap:12px;
  justify-items:center;
  text-align:center;
  padding:6px 0 2px;
}
.fv2-quiz__result-label{
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.08em;
  color:#8c642d;
  text-transform:uppercase;
}
.fv2-quiz__result-avatar{
  width:84px;
  height:84px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(199,164,106,.55);
  box-shadow:0 12px 26px rgba(92,69,38,.22);
  background:#fffdfa;
}
.fv2-quiz__result-avatar--emoji{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:36px;
}
.fv2-quiz__result-name{
  margin:0;
  font-size:20px;
  font-weight:900;
  color:#3d2c14;
}
.fv2-quiz__result-why{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:center;
}
.fv2-quiz__result-chip{
  padding:4px 12px;
  border-radius:999px;
  font-size:12.5px;
  font-weight:800;
  color:#6e5222;
  background:rgba(246,238,223,.95);
  border:1px solid rgba(199,164,106,.45);
}
.fv2-quiz__result-note{
  margin:0;
  font-size:13px;
  line-height:1.65;
  color:#8a7559;
}
.fv2-quiz__result-actions{
  display:grid;
  gap:9px;
  width:100%;
  margin-top:4px;
}
.fv2-quiz__result-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:13px 18px;
  border-radius:999px;
  border:1px solid rgba(166,96,20,.68);
  background:linear-gradient(135deg, #ffb347 0%, #f28c28 46%, #d97706 100%);
  color:#fff;
  font-size:15px;
  font-weight:900;
  cursor:pointer;
  font-family:inherit;
  box-shadow:0 14px 28px rgba(231,137,30,.38);
}
.fv2-quiz__result-cta:hover{ filter:brightness(1.05); }
.fv2-quiz__result-ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 18px;
  border-radius:999px;
  border:1.5px solid rgba(194,151,84,.55);
  background:#fffdfa;
  color:#6b4d31;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
  font-family:inherit;
}
.fv2-quiz__result-ghost:hover{ background:#fff5e1; }

/* ═══ 5. Sticky mobile CTA ═══ */
.fv2-sticky-cta{
  position:fixed;
  left:12px;
  right:12px;
  bottom:calc(12px + env(safe-area-inset-bottom));
  z-index:60;
  display:none;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px 10px 16px;
  border-radius:999px;
  border:1px solid rgba(69,49,29,.55);
  background:linear-gradient(135deg, rgba(58,42,24,.97) 0%, rgba(86,62,35,.97) 100%);
  box-shadow:0 18px 40px rgba(40,28,12,.45);
  opacity:0;
  transform:translateY(14px);
  transition:opacity .3s ease, transform .3s ease;
  pointer-events:none;
}
body.uc-mobile-nav-enabled .fv2-sticky-cta{
  bottom:calc(74px + env(safe-area-inset-bottom));
}
.fv2-sticky-cta.is-on{
  opacity:1;
  transform:none;
  pointer-events:auto;
}
.fv2-sticky-cta__text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#ffeec9;
  font-size:13.5px;
  font-weight:800;
}
.fv2-sticky-cta__btn{
  flex:0 0 auto;
  border:1px solid rgba(166,96,20,.68);
  border-radius:999px;
  padding:9px 16px;
  background:linear-gradient(135deg, #ffb347 0%, #f28c28 46%, #d97706 100%);
  color:#fff;
  font-size:13.5px;
  font-weight:900;
  cursor:pointer;
  font-family:inherit;
  box-shadow:0 10px 20px rgba(231,137,30,.4);
  white-space:nowrap;
}
@media (min-width:769px){
  .fv2-sticky-cta{ display:none !important; }
}
@media (max-width:768px){
  .fv2-sticky-cta{ display:flex; }
}

/* ═══ 6. Scroll reveals + CTA shimmer (motion-safe only) ═══ */
@media (prefers-reduced-motion: no-preference){
  .fv2-reveal{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .55s ease, transform .55s cubic-bezier(.22,.61,.36,1);
    will-change:opacity, transform;
  }
  .fv2-reveal.is-in{
    opacity:1;
    transform:none;
  }

  .fortunev2-hero-cta-row > .hero-cta__primary{
    position:relative;
    overflow:hidden;
  }
  .fortunev2-hero-cta-row > .hero-cta__primary::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.34) 50%, transparent 68%);
    transform:translateX(-130%);
    animation:fv2Shimmer 4.2s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes fv2Shimmer{
    0%{ transform:translateX(-130%); }
    52%{ transform:translateX(130%); }
    100%{ transform:translateX(130%); }
  }
}