/* bot.css (ns-q, 05/11): the site's bot ("הבוטית של האקדמיה") in the new design, on every page that has it.
 * Kate 05/11: a gold WhatsApp bubble with the title "יש לי שאלה" above it; "אני רק שאלה" lives inside the bot (no page).
 * Overrides the drafts' green .wa-fab / .wa-panel by specificity (html body ...), the page's own script stays as it is.
 * Colours: the bot prototype (טיוטות-מלאות/bot): gold #F3DC92 > #D4AF37 > #7D6212, ink #17110F, cream #F5F1EA. */
:root{
  --wq-bg:#F5F1EA; --wq-card:#FFFDF9; --wq-ink:#17110F; --wq-dim:#5E534E; --wq-line:rgba(125,98,18,.24);
  --wq-gold:#6E4A08; --wq-head:#17110F; --wq-head-ink:#F6EFE7; --wq-head-gold:#F0CE6B; --wq-me:#17110F; --wq-me-ink:#F5F1EA;
  --wq-tag-bg:#17110F; --wq-tag-ink:#F7DF97; --wq-focus:#17110F; --wq-pink:#D10A75;
  --wq-orb:radial-gradient(120% 120% at 30% 22%,#FFF4CC 0%,#F3DC92 22%,#D4AF37 55%,#A8841F 82%,#7D6212 100%);
  --wq-shadow:0 30px 60px -22px rgba(23,17,15,.42),0 2px 8px rgba(23,17,15,.10);
  --wq-ease:cubic-bezier(.23,1,.32,1);
}
:root[data-theme="dark"]{
  --wq-bg:#171214; --wq-card:#211A1C; --wq-ink:#F6EFE7; --wq-dim:#C9BDB6; --wq-line:rgba(225,199,115,.26);
  --wq-gold:#F0CE6B; --wq-head:#0B0807; --wq-me:#F5F1EA; --wq-me-ink:#17110F;
  --wq-tag-bg:#F5F1EA; --wq-tag-ink:#17110F; --wq-focus:#F7DF97;
  --wq-shadow:0 30px 60px -20px rgba(0,0,0,.7),0 2px 8px rgba(0,0,0,.4);
}

/* ---------- the bubble ---------- */
html body .wa-fab{background:var(--wq-orb);box-shadow:0 14px 30px -12px rgba(125,98,18,.75),inset 0 0 0 1px rgba(255,244,204,.55);
  transition:transform .15s var(--wq-ease)}
html body .wa-fab svg{fill:#17110F}
html body .wa-fab:hover{transform:translateY(-2px)}
html body .wa-fab:active{transform:scale(.96)}
html body .wa-fab:focus-visible{outline:3px solid var(--wq-focus);outline-offset:3px}
/* the title above the bubble: part of the bubble's own name (aria-label), so the visible pill is aria-hidden */
.wa-tag{position:fixed;z-index:60;left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(86px + env(safe-area-inset-bottom,0px));
  display:block;padding:8px 13px;border-radius:999px;background:var(--wq-tag-bg);color:var(--wq-tag-ink);
  font:700 13.5px/1 Heebo,system-ui,sans-serif;white-space:nowrap;cursor:pointer;border:1px solid rgba(212,175,55,.6);
  box-shadow:0 8px 20px -8px rgba(23,17,15,.4);transition:opacity .2s ease,transform .3s var(--wq-ease);user-select:none}
.wa-tag::after{content:"";position:absolute;bottom:-5px;left:24px;width:9px;height:9px;background:inherit;
  border-right:1px solid rgba(212,175,55,.6);border-bottom:1px solid rgba(212,175,55,.6);transform:rotate(45deg)}
@media (max-width:700px){.wa-tag{bottom:calc(78px + env(safe-area-inset-bottom,0px));font-size:12.5px;padding:7px 11px}.wa-tag::after{left:21px}}
.wa-panel.open ~ .wa-tag,.wa-tag.is-off{opacity:0;transform:translateY(6px);pointer-events:none}
@media (prefers-reduced-motion:no-preference){.wa-tag{animation:wqTagIn .5s var(--wq-ease) .8s backwards}}
@keyframes wqTagIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- the panel ---------- */
html body .wa-panel{background:var(--wq-bg);color:var(--wq-ink);border:1px solid var(--wq-line);box-shadow:var(--wq-shadow);
  bottom:calc(132px + env(safe-area-inset-bottom,0px));width:min(360px,calc(100vw - 32px));display:flex;flex-direction:column;
  max-height:min(640px,calc(100vh - 152px - env(safe-area-inset-bottom,0px)));max-height:min(640px,calc(100dvh - 152px - env(safe-area-inset-bottom,0px)))}
@media (max-width:700px){html body .wa-panel{bottom:calc(120px + env(safe-area-inset-bottom,0px));max-height:calc(100dvh - 136px - env(safe-area-inset-bottom,0px))}}
html body .wa-panel .bar{background:var(--wq-head);color:var(--wq-head-ink);padding:10px 12px;flex:none}
html body .wa-panel .bar i{background:var(--wq-orb);color:#17110F}
html body .wa-panel .bar b{color:var(--wq-head-gold)}
html body .wa-panel .bar small{color:var(--wq-head-ink);opacity:.82}
html body .wa-panel .bar button{width:44px;height:44px;border-radius:50%;color:var(--wq-head-ink)}
html body .wa-panel .bar button:focus-visible{outline:2px solid #F7DF97;outline-offset:-2px}
html body .wa-panel .body{flex:1 1 auto;min-height:0;max-height:none}
html body .wa-panel .b{background:var(--wq-card);color:var(--wq-ink);border:1px solid var(--wq-line)}
html body .wa-panel .b.me{background:var(--wq-me);color:var(--wq-me-ink);border-color:transparent}
html body .wa-panel .b a{color:var(--wq-gold);font-weight:700}
html body .wa-panel .chips button{min-height:44px;border:1px solid rgba(168,132,31,.7);background:var(--wq-card);color:var(--wq-ink);
  font-weight:600;padding:8px 14px;transition:transform .15s var(--wq-ease),background-color .2s ease}
html body .wa-panel .chips button:hover{background:rgba(243,220,146,.32)}
html body .wa-panel .chips button:active{transform:scale(.96)}
html body .wa-panel button:focus-visible,html body .wa-panel a:focus-visible,html body .wa-panel summary:focus-visible{outline:2px solid var(--wq-focus);outline-offset:2px}

/* the way into "אני רק שאלה" at the foot of the bot */
.wa-qentry{flex:none;transition:transform .15s var(--wq-ease);display:flex;align-items:center;gap:10px;width:100%;min-height:56px;padding:10px 14px;border:0;border-top:1px solid var(--wq-line);
  background:linear-gradient(100deg,#F3DC92,#E1C773 55%,#D4AF37);color:#17110F;font:inherit;text-align:start;cursor:pointer}
.wa-qentry b{display:block;font-size:14.5px;font-weight:900}
.wa-qentry small{display:block;font-size:12.5px;font-weight:600;color:#3A2E12}
.wa-qentry svg{margin-inline-start:auto;flex:none;width:20px;height:20px}
.wa-qentry:active{transform:scale(.985)}
.wa-qentry:focus-visible{outline:2px solid #17110F;outline-offset:-4px}
.wa-panel.is-q .body,.wa-panel.is-q .wa-qentry{display:none}

/* ---------- the "אני רק שאלה" screen ---------- */
.wa-q{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:12px 14px 16px;font:300 14.5px/1.55 Heebo,system-ui,sans-serif}
.wa-q[hidden]{display:none}
.wa-q h2,.wa-q h3{margin:0;font-weight:900;color:var(--wq-ink);letter-spacing:-.01em}
.wa-q p{margin:0}
.wa-q bdi{unicode-bidi:isolate}
.wq-back{position:sticky;top:-12px;z-index:1;display:flex;align-items:center;gap:6px;width:calc(100% + 28px);min-height:44px;padding:0 14px;margin:-12px -14px 6px;border:0;border-bottom:1px solid var(--wq-line);background:var(--wq-bg);
  color:var(--wq-ink);font:600 13.5px Heebo,system-ui,sans-serif;cursor:pointer;border-radius:0}
.wq-back svg{width:18px;height:18px}
.wq-hero{display:grid;grid-template-columns:112px 1fr;gap:12px;align-items:center;margin-bottom:10px}
.wq-ph{width:112px;height:140px;border-radius:16px;object-fit:cover;object-position:50% 10%;background:#D8CFC4;border:1px solid var(--wq-line)}
.wq-hero h2{font-size:24px;line-height:1.05}
.wq-hero p{margin-top:6px;font-size:15px;font-weight:600;line-height:1.3}
.wq-g{color:var(--wq-gold)}
.wq-sub{color:var(--wq-dim);font-size:13.5px}
.wq-sub+.wq-sub{margin-top:4px}
.wq-stats{list-style:none;margin:14px 0;padding:10px 0;display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--wq-line)}
.wq-stats li{padding:0 6px;text-align:center}
.wq-stats li+li{border-inline-start:1px solid var(--wq-line)}
.wq-stats b{display:block;font:800 19px/1.1 Syne,Heebo,system-ui,sans-serif;color:var(--wq-gold)}
.wq-stats span{display:block;font-size:12.5px;font-weight:600;color:var(--wq-dim);line-height:1.25;margin-top:2px}
.wa-q h3{font-size:16px;margin:16px 0 8px}
.wq-steps{list-style:none;margin:0;padding:0;display:grid;gap:8px;counter-reset:wq}
.wq-steps li{counter-increment:wq;display:grid;grid-template-columns:28px 1fr;gap:8px;align-items:start}
.wq-steps li::before{content:"0" counter(wq);font:800 15px/1.5 Syne,system-ui,sans-serif;color:var(--wq-gold)}
.wq-steps b{font-weight:800}
.wq-price{margin:4px 0 4px;padding:14px;border-radius:18px;background:var(--wq-card);border:1px solid rgba(212,175,55,.55)}
.wq-price .amt{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.wq-price .amt b{font:800 30px/1 Syne,Heebo,system-ui,sans-serif;color:var(--wq-ink)}
.wq-price .amt span{font-size:13px;color:var(--wq-dim);font-weight:600}
.wq-price .amt strong{flex-basis:100%;font-size:15px;font-weight:900}
.wq-price ul{list-style:none;margin:10px 0 12px;padding:0;display:grid;gap:4px;font-size:13.5px}
.wq-price li{display:flex;gap:7px;align-items:baseline}
.wq-price li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:#D4AF37;transform:translateY(-1px)}
.wq-cta{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 18px;border-radius:999px;
  background:var(--wq-pink);color:#fff;font:800 15px Heebo,system-ui,sans-serif;text-decoration:none;transition:transform .15s var(--wq-ease),background-color .2s ease}
.wq-cta:hover{background:#B30863}
.wq-cta:active{transform:scale(.96)}
.wq-fine{margin-top:8px!important;font-size:12.5px;color:var(--wq-dim);text-align:center}
.wq-recs{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.wq-recs li{background:var(--wq-card);border:1px solid var(--wq-line);border-radius:14px 14px 14px 4px;padding:9px 11px}
.wq-recs blockquote{margin:0;font-size:14px;font-weight:400}
.wq-recs .st{display:block;color:#A8841F;font-size:12px;letter-spacing:2px;margin-bottom:2px}
.wq-recs cite{display:block;margin-top:4px;font-style:normal;font-size:12.5px;font-weight:700;color:var(--wq-dim)}
.wq-kate p+p{margin-top:6px}
.wq-faq details{border-bottom:1px solid var(--wq-line)}
.wq-faq summary{min-height:44px;display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:700;list-style:none;padding:6px 0}
.wq-faq summary::-webkit-details-marker{display:none}
.wq-faq summary::after{content:"+";margin-inline-start:auto;font-weight:400;font-size:20px;color:var(--wq-gold)}
.wq-faq details[open] summary::after{content:"−"}
.wq-faq details p{padding:0 0 10px;color:var(--wq-dim)}
.wq-end{margin-top:16px}

/* ---------- the gentle offer above the bubble ---------- */
.wa-nudge{position:fixed;z-index:62;left:calc(16px + env(safe-area-inset-left,0px));bottom:calc(132px + env(safe-area-inset-bottom,0px));
  width:min(300px,calc(100vw - 32px));padding:14px 14px 12px;border-radius:20px 20px 20px 6px;background:var(--wq-bg);color:var(--wq-ink);
  border:1px solid rgba(212,175,55,.6);box-shadow:var(--wq-shadow);font:300 14px/1.5 Heebo,system-ui,sans-serif;
  opacity:0;transform:translateY(10px);visibility:hidden;transition:opacity .3s ease,transform .4s var(--wq-ease),visibility 0s linear .4s}
.wa-nudge.on{opacity:1;transform:none;visibility:visible;transition:opacity .3s ease,transform .4s var(--wq-ease),visibility 0s}
@media (max-width:700px){.wa-nudge{bottom:calc(120px + env(safe-area-inset-bottom,0px))}}
.wa-nudge h2{margin:0 0 6px;padding-inline-end:34px;font:900 16.5px/1.25 Heebo,system-ui,sans-serif;color:var(--wq-ink)}
.wa-nudge p{margin:0 0 10px;color:var(--wq-dim)}
.wa-nudge .x{position:absolute;top:4px;inset-inline-end:4px;width:44px;height:44px;border:0;border-radius:50%;background:none;color:var(--wq-ink);
  font-size:22px;line-height:1;cursor:pointer}
.wa-nudge .go{display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;border:0;border-radius:999px;background:var(--wq-head);
  color:var(--wq-head-gold);font:800 14.5px Heebo,system-ui,sans-serif;cursor:pointer;transition:transform .15s var(--wq-ease)}
:root[data-theme="dark"] .wa-nudge .go{background:#F5F1EA;color:#17110F}
.wa-nudge .go:active{transform:scale(.96)}
.wa-nudge button:focus-visible{outline:2px solid var(--wq-focus);outline-offset:2px}

@media (prefers-reduced-motion:reduce){
  .wa-tag,.wa-nudge,.wa-nudge.on,html body .wa-fab,html body .wa-panel{transition:none!important;animation:none!important}
  html body .wa-fab:hover{transform:none}
}
.wa-q .sr,.wa-nudge .sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:root[data-theme="dark"] .wa-panel .bar{border-bottom:1px solid var(--wq-line)}
.wq-recs+.wq-sub,.wa-q h3+.wq-sub{margin:-4px 0 8px}
