/*!
 * MoonPress Chat — front-end widget styles (static half).
 * The one dynamic rule — per-site appearance tokens on #kb — is attached at
 * runtime via wp_add_inline_style on this same handle (includes/widget.php).
 */
:where(#kb, #kb *){box-sizing:border-box;margin:0;padding:0;}
#kb{--txt:#14161A;--sub:#6C6F74;--line:rgba(9,14,21,.08);--field:#F5F5F5;--bubble:#F2F3F5;
  font-family:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  position:fixed;z-index:999990;right:var(--iqb-side);bottom:var(--iqb-bottom);font-size:14px;color:var(--txt);}
#kb.iqb-left{right:auto;left:var(--iqb-side);}

/* Launcher */
#iqb-bubble{width:var(--iqb-launcher);height:var(--iqb-launcher);border-radius:50%;background:var(--iqb-accent);
  color:var(--iqb-accent-ink);display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 2px 12px rgba(9,14,21,.24);transition:transform .15s ease;}
#iqb-bubble:hover{transform:scale(1.06);}
#iqb-bubble svg{width:24px;height:24px;fill:currentColor;}
#iqb-bubble .iqb-ic-close{display:none;}
#kb.iqb-open #iqb-bubble .iqb-ic-chat{display:none;}
#kb.iqb-open #iqb-bubble .iqb-ic-close{display:block;}

/* Panel */
#iqb-panel{position:absolute;bottom:calc(var(--iqb-launcher) + 16px);right:0;width:400px;
  height:min(704px,calc(100vh - var(--iqb-bottom) - var(--iqb-launcher) - 36px));
  background:#fff;border-radius:24px;box-shadow:0 5px 40px rgba(9,14,21,.16);overflow:hidden;
  display:none;flex-direction:column;}
#kb.iqb-left #iqb-panel{right:auto;left:0;}
#kb.iqb-open #iqb-panel{display:flex;}
.iqb-view{display:flex;flex-direction:column;flex:1;min-height:0;}
.iqb-view.hide{display:none;}

/* Home: header zone (290px) + fade into white content */
.iqb-hero{position:relative;flex:none;height:290px;padding:20px 20px 0;color:var(--iqb-header-text);
  background:var(--iqb-header-bg);display:flex;flex-direction:column;}
.iqb-hero-bg{position:absolute;inset:0;background-image:var(--iqb-header-img);background-size:cover;background-position:center;}
.iqb-hero::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:80px;
  background:linear-gradient(rgba(255,255,255,0),#fff);pointer-events:none;}
.iqb-hero-top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;min-height:32px;}
.iqb-hero-top img{height:32px;max-width:140px;object-fit:contain;display:block;}
/* Inline avatar for a site with no logo of its own — same box as the <img> it
   replaces, stroked with the header's text colour (contrast-checked), so it is
   visible on a light header as well as a dark one. */
.iqb-hero-top>.iqb-ava{height:32px;width:32px;color:var(--iqb-header-text);}
.iqb-ava{position:relative;display:block;flex:none;}
.iqb-ava>svg{width:100%;height:100%;display:block;}
.iqb-ava>img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;}
.iqb-hero-top img[src=""]{display:none;}
.iqb-hero-actions{position:relative;display:flex;align-items:center;gap:2px;}
.iqb-cls{position:relative;background:none;border:0;color:inherit;font-size:22px;line-height:1;cursor:pointer;opacity:.9;padding:4px;}
.iqb-hi1{position:relative;margin-top:auto;font-size:28px;font-weight:600;opacity:.72;}
.iqb-hi2{position:relative;font-size:28px;font-weight:600;padding-bottom:88px;}

/* Language switcher (R5): globe button + dropdown in the hero, before the close button. */
.iqb-langs{position:relative;}
.iqb-langbtn{position:relative;background:none;border:0;color:inherit;cursor:pointer;opacity:.9;padding:4px;display:flex;align-items:center;}
.iqb-langbtn svg{width:20px;height:20px;display:block;}
.iqb-langmenu{position:absolute;top:100%;right:0;margin-top:6px;background:#fff;border-radius:12px;
  box-shadow:0 4px 28px rgba(9,14,21,.06),0 1px 4px rgba(9,14,21,.06);padding:6px;min-width:140px;z-index:2;}
.iqb-langmenu[hidden]{display:none;}
.iqb-langmenu button{display:block;width:100%;text-align:left;background:none;border:0;color:var(--txt);
  font:inherit;font-size:13.5px;padding:8px 10px;border-radius:8px;cursor:pointer;}
.iqb-langmenu button:hover{background:var(--field);color:var(--iqb-accent);}

/* Content scroller + cards */
.iqb-scroll{flex:1;min-height:0;overflow-y:auto;padding:0 20px 16px;background:#fff;}
#iqb-home .iqb-scroll{margin-top:-48px;position:relative;z-index:1;background:transparent;}
.iqb-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:#fff;border:0;
  border-radius:12px;box-shadow:0 4px 28px rgba(9,14,21,.06),0 1px 4px rgba(9,14,21,.06);
  padding:16px;margin-bottom:12px;cursor:pointer;color:var(--txt);text-decoration:none;font:inherit;}
.iqb-card .st{display:block;font-size:14px;font-weight:600;color:var(--txt);}
.iqb-card .ss{display:block;font-size:14px;color:var(--sub);margin-top:2px;}
.iqb-card .iqb-ib{flex:none;width:36px;height:36px;border-radius:10px;background:var(--field);
  display:flex;align-items:center;justify-content:center;color:var(--iqb-accent);}
.iqb-card .iqb-ib svg{width:20px;height:20px;}
.iqb-card .sa{margin-left:auto;color:var(--iqb-accent);}
.iqb-card .sa svg{width:16px;height:16px;display:block;}

/* Chevron rows (topics on Home, questions in Help) */
.iqb-rows{background:#fff;border-radius:12px;box-shadow:0 4px 28px rgba(9,14,21,.06),0 1px 4px rgba(9,14,21,.06);
  padding:6px 16px;margin-bottom:12px;}
.iqb-row{display:flex;align-items:center;width:100%;background:none;border:0;cursor:pointer;font:inherit;
  color:var(--txt);text-align:left;padding:11px 0;font-size:14px;border-bottom:1px solid var(--line);gap:10px;}
.iqb-row:last-child{border-bottom:0;}
.iqb-row .sa{margin-left:auto;color:var(--iqb-accent);flex:none;}
.iqb-row .sa svg{width:14px;height:14px;display:block;}
.iqb-lbl{font-size:14px;font-weight:600;margin:4px 2px 10px;}

/* Search field */
.iqb-search{display:flex;align-items:center;height:40px;border-radius:8px;background:var(--field);
  padding:10px 12px;margin:12px 0;gap:8px;}
.iqb-search .si{color:var(--iqb-accent);flex:none;}
.iqb-search input{flex:1;border:0;background:none;outline:none;font:inherit;font-weight:600;color:var(--txt);}
.iqb-search input::placeholder{color:var(--txt);opacity:.9;}

/* Bottom nav */
.iqb-nav{flex:none;height:81px;display:flex;background:#fff;box-shadow:0 0 25px rgba(9,14,21,.06);position:relative;}
.iqb-nav button{flex:1;background:none;border:0;cursor:pointer;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px;color:var(--sub);font-size:14px;font-weight:400;font-family:inherit;}
.iqb-nav button .ic{width:24px;height:24px;display:flex;align-items:center;justify-content:center;}
.iqb-nav button .ic svg{width:24px;height:24px;}
.iqb-nav button.on{color:var(--iqb-accent);font-weight:600;}

/* Chat view */
.iqb-chead{flex:none;display:flex;align-items:center;gap:10px;height:56px;padding:0 12px;background:#fff;
  box-shadow:0 1px 0 var(--line);position:relative;z-index:1;}
.iqb-back{background:none;border:0;font-size:24px;line-height:1;cursor:pointer;color:var(--txt);padding:4px 6px;}
.iqb-av{width:32px;height:32px;border-radius:50%;overflow:hidden;background:var(--field);flex:none;}
.iqb-av img{width:100%;height:100%;object-fit:cover;display:block;}
.iqb-av>.iqb-ava{width:100%;height:100%;color:var(--txt);}
.iqb-av .iqb-ava>svg{width:20px;height:20px;margin:6px;}
.iqb-av img[src=""]{display:none;}
.iqb-chead .cn{font-size:15px;font-weight:600;}
.iqb-chead .cr{font-size:12px;color:var(--sub);display:flex;align-items:center;gap:5px;}
.iqb-chead .cr i{width:7px;height:7px;border-radius:50%;background:#22C55E;display:inline-block;}
.iqb-chead .iqb-call{margin-left:auto;display:flex;align-items:center;gap:5px;color:var(--iqb-accent);
  text-decoration:none;font-size:13px;font-weight:600;}
.iqb-ct b{display:block;font-size:15px;}
.iqb-ct span{font-size:12px;color:var(--sub);}

#iqb-msgs{flex:1;min-height:0;overflow-y:auto;padding:16px 16px 8px;background:#fff;display:flex;flex-direction:column;}
.iqb-meta{font-size:12px;color:#9AA0A6;margin:0 4px 12px;clear:both;}

/* Composer: floating card, accent ring on focus */
.iqb-inwrap{flex:none;padding:0 12px;background:#fff;}
.iqb-inbox{border:1.5px solid var(--line);border-radius:20px;background:#fff;padding:10px 12px 8px;
  transition:border-color .15s ease, box-shadow .15s ease;}
.iqb-inbox:focus-within{border-color:var(--iqb-accent);box-shadow:0 4px 20px rgba(9,14,21,.08);}
.iqb-in{width:100%;border:0;outline:none;resize:none;font:inherit;font-size:14px;color:var(--txt);
  max-height:120px;background:none;}
.iqb-inbar{display:flex;align-items:center;margin-top:4px;}
.iqb-inicons{display:flex;gap:4px;}
.iqb-iconbtn{background:none;border:0;cursor:pointer;color:var(--sub);padding:5px;border-radius:8px;}
.iqb-iconbtn:hover{color:var(--txt);background:var(--field);}
.iqb-iconbtn svg{width:18px;height:18px;display:block;}
.iqb-iconbtn.rec{color:#DC2626;}
.iqb-sendbtn{margin-left:auto;width:32px;height:32px;border-radius:50%;border:0;cursor:pointer;
  background:var(--field);color:var(--sub);display:flex;align-items:center;justify-content:center;
  transition:background .15s ease,color .15s ease;}
.iqb-sendbtn.ready{background:var(--iqb-accent);color:var(--iqb-accent-ink);}
.iqb-sendbtn svg{width:16px;height:16px;}
.iqb-sendbtn:disabled{opacity:.5;cursor:default;}

/* Disclaimer / footer lines */
.iqb-disc,.iqb-cdisc{flex:none;text-align:center;font-size:12px;color:#9AA0A6;padding:8px 16px;background:#fff;}
.iqb-disc b,.iqb-cdisc b{font-weight:400;}

/* Consent gate: bot-card styling (ids/flow unchanged) */
#iqb-consent{background:var(--bubble);border-radius:16px;border-bottom-left-radius:6px;padding:14px;
  margin-bottom:12px;font-size:13.5px;line-height:1.5;}
#iqb-consent button{margin-top:10px;background:var(--iqb-accent);color:var(--iqb-accent-ink);border:0;
  border-radius:10px;padding:9px 16px;font:inherit;font-weight:600;cursor:pointer;}

/* CTA chips inside chat */
.iqb-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px;}
.iqb-cta{background:#fff;border:1.5px solid var(--iqb-accent);color:var(--iqb-accent);border-radius:999px;
  padding:8px 14px;font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;gap:6px;}
.iqb-cta:hover{background:var(--iqb-accent);color:var(--iqb-accent-ink);}

/* My requests */
.iqb-mine-item{display:block;width:100%;text-align:left;background:#fff;border:0;font:inherit;cursor:pointer;
  border-radius:12px;box-shadow:0 4px 28px rgba(9,14,21,.06),0 1px 4px rgba(9,14,21,.06);
  padding:14px 16px;margin-bottom:10px;}
.iqb-mine-q{font-weight:600;font-size:14px;margin:6px 0 4px;}
.iqb-mine-meta{font-size:12px;color:var(--sub);}
.iqb-mine-empty{color:var(--sub);font-size:14px;padding:24px 8px;text-align:center;}
.iqb-tag{display:inline-block;font-size:11px;font-weight:600;border-radius:999px;padding:2px 8px;
  background:var(--field);color:var(--sub);}
.iqb-tag.new{background:#E8F1FF;color:#1D4ED8;}
.iqb-tag.progress{background:#FEF3C7;color:#B45309;}
.iqb-tag.done{background:#DCFCE7;color:#15803D;}
.iqb-tag.op{background:#DCFCE7;color:#15803D;}

/* Scroll cue + fade (Home topics overflow) */
.iqb-fade{position:absolute;left:0;right:0;bottom:81px;height:56px;pointer-events:none;
  background:linear-gradient(rgba(255,255,255,0),#fff);transition:opacity .2s;}
.iqb-fade.hide{opacity:0;}
.iqb-scrollcue{position:absolute;left:50%;transform:translateX(-50%) rotate(180deg);bottom:92px;width:32px;height:32px;
  border-radius:50%;border:0;background:var(--iqb-accent);color:var(--iqb-accent-ink);cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(9,14,21,.2);transition:opacity .2s;}
.iqb-scrollcue svg{width:18px;height:18px;fill:currentColor;}
.iqb-scrollcue.hide{opacity:0;pointer-events:none;}

/* Typing dots (keep the existing markup hooks) */
.iqb-typing{display:inline-flex;gap:4px;padding:12px 14px;background:var(--bubble);border-radius:16px;
  border-bottom-left-radius:6px;margin-bottom:12px;}
.iqb-typing i{width:6px;height:6px;border-radius:50%;background:#9AA0A6;animation:iqbty 1s infinite;}
.iqb-typing i:nth-child(2){animation-delay:.15s;}
.iqb-typing i:nth-child(3){animation-delay:.3s;}
@keyframes iqbty{0%,60%,100%{opacity:.35;transform:translateY(0);}30%{opacity:1;transform:translateY(-3px);}}

/* Backdrop (mobile) */
#iqb-backdrop{display:none;}

/* Mobile: full-screen sheet */
@media (max-width:480px){
  #iqb-panel{position:fixed;inset:0;width:100%;height:100dvh;border-radius:0;bottom:0;}
  #kb.iqb-open #iqb-bubble{display:none;}
  #iqb-backdrop{position:fixed;inset:0;background:rgba(9,14,21,.4);}
  #kb.iqb-open #iqb-backdrop{display:block;}
}

/* =====================================================================
   Carried over from the pre-R7 stylesheet (Task 2 does not touch markup
   or JS — that is Tasks 3-4). Everything below styles a class the current
   markup/JS still emits that has no equivalent in the block above:
   the rating widget, the FAQ accordion, the Home topic-card list, chat
   bubbles under their pre-migration class names ("iqb-b"/"bot"/"me"), the
   quick-reply chip button, and a couple of stray icon/wrapper hooks.
   Colors/backgrounds/text/radii are mapped onto the new tokens; layout is
   otherwise unchanged. See task-2-report.md for the full carried-over vs
   dropped selector list. ===================================================== */

/* Home topic list container — markup still pairs this class with .iqb-rows
   on the same element (`class="iqb-topics iqb-rows"`, see #iqb-topics
   above). .iqb-rows alone already supplies the card chrome and the hairline
   separators between rows; the old flex/gap here just stacked a second
   12px gap on top of those hairlines, so the rule is dropped rather than
   trimmed — nothing else in it survives the merge into .iqb-rows. */

/* Card content wrapper + "dark" card modifier (markup still wraps .st/.ss in
   .iqb-ctext, and the phone-call card still carries the old "dark" class). */
.iqb-ctext{flex:1;min-width:0;}
.iqb-card.dark .iqb-ib{background:var(--txt);color:#fff;}
.iqb-card.dark .sa{background:var(--field);}

/* Call/CTA inline icon sizing (svg carries class="iqb-ico", not scoped by
   the new stylesheet). */
.iqb-call .iqb-ico,.iqb-cta .iqb-ico{width:14px;height:14px;flex:none;}

/* Chat bubbles: JS builds every message bubble as className="iqb-b bot"/
   "iqb-b me" — these are the only bubble classes the widget ever emits, so
   this is the live styling, not a legacy fallback. #iqb-msgs is a flex
   column (see the #iqb-msgs rule above), which is what makes the
   margin-right/margin-left:auto alignment below actually shrink-to-fit
   instead of stretching to a fixed width. Bot rows get their breathing room
   from the trailing .iqb-meta line (margin-bottom:12px) sitting right under
   each bubble, so the 4px here just keeps bubble and meta close together;
   user messages have no meta line following them, so .iqb-b.me carries its
   own larger margin-bottom to keep consecutive user bubbles from touching. */
.iqb-b{max-width:82%;margin-bottom:4px;padding:12px 14px;border-radius:16px;font-size:14px;line-height:1.45;
  white-space:pre-wrap;word-wrap:break-word;}
.iqb-b.bot{background:var(--bubble);color:var(--txt);border-bottom-left-radius:6px;margin-right:auto;}
.iqb-b.me{background:var(--iqb-accent);color:var(--iqb-accent-ink);border-bottom-right-radius:6px;margin-left:auto;margin-bottom:10px;}

/* Typing indicator dots: JS builds <span> children, not the <i> the new
   .iqb-typing rule above targets — reuses the same @keyframes iqbty. */
.iqb-typing span{width:6px;height:6px;border-radius:50%;background:#9AA0A6;animation:iqbty 1s infinite;}
.iqb-typing span:nth-child(2){animation-delay:.15s;}
.iqb-typing span:nth-child(3){animation-delay:.3s;}

/* Quick-reply chip row (chipsRow() still builds className="iqb-chip"). */
.iqb-chip{background:#fff;border:1px solid var(--line);color:var(--sub);font-size:12.5px;padding:7px 12px;
  border-radius:999px;cursor:pointer;font:inherit;}
.iqb-chip:hover{border-color:var(--iqb-accent);color:var(--txt);}

/* Answer rating (P2-7) — no equivalent in the new design. */
.iqb-rate{display:flex;align-items:center;gap:6px;margin:2px 0 4px 2px;}
.iqb-rate .lbl{color:var(--sub);font-size:11.5px;margin-right:2px;}
.iqb-rate button{width:26px;height:26px;border:1px solid var(--line);background:#fff;border-radius:12px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--sub);padding:0;}
.iqb-rate button:hover{border-color:var(--iqb-accent);color:var(--txt);}
.iqb-rate button svg{width:14px;height:14px;}
.iqb-rate button.on{background:var(--iqb-accent);border-color:var(--iqb-accent);color:var(--iqb-accent-ink);}
.iqb-rate .thanks{color:#0b7a3b;font-size:11.5px;}
.iqb-rf{display:flex;gap:6px;margin:0 0 6px 2px;}
.iqb-rf input{flex:1;min-width:0;font-size:12.5px;padding:7px 10px;border:1px solid var(--line);border-radius:12px;}
.iqb-rf button{font-size:12px;font-weight:700;border:0;border-radius:12px;padding:0 12px;background:var(--txt);color:#fff;cursor:pointer;}

/* «Мои обращения» list: JS still nests date + status tag in .iqb-mine-top/
   .iqb-mine-date, which the new .iqb-mine-item rules don't cover. */
.iqb-mine-top{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap;}
.iqb-mine-date{color:var(--sub);font-size:11.5px;font-weight:600;}

/* FAQ accordion (Help tab) — no equivalent in the new design. */
.iqb-grp{padding:0 16px;margin-top:14px;}
.iqb-gh{width:100%;text-align:left;background:none;border:0;cursor:pointer;display:flex;align-items:center;
  gap:10px;padding:6px 2px;color:var(--txt);font-weight:800;font-size:15px;font:inherit;}
.iqb-gh .gn{flex:0 1 auto;}
.iqb-gh .gc{margin-left:auto;color:var(--sub);font-size:12px;font-weight:700;}
.iqb-gh .gx{color:var(--iqb-accent);font-size:16px;transition:.2s;flex:none;}
.iqb-grp.closed .gx{transform:rotate(-90deg);}
.iqb-grp.closed .iqb-faq{display:none;}
.iqb-faq{padding:10px 0 0;display:flex;flex-direction:column;gap:9px;}
.iqb-fi{background:#fff;border:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 28px rgba(9,14,21,.06),0 1px 4px rgba(9,14,21,.06);}
.iqb-fq{width:100%;text-align:left;background:none;border:0;color:var(--txt);font-size:13.5px;font-weight:600;
  padding:12px 13px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;font:inherit;}
.iqb-fp{color:var(--iqb-accent);font-size:18px;font-weight:700;flex:none;transition:.2s;}
.iqb-fi.open .iqb-fp{transform:rotate(45deg);}
.iqb-fa{max-height:0;overflow:hidden;color:var(--sub);font-size:13px;line-height:1.5;padding:0 13px;transition:.22s;}
.iqb-fi.open .iqb-fa{max-height:600px;padding:0 13px 13px;}