/* Base visuals */
.ykfm{--ykfm-bg:#fff;--ykfm-text:#1b1b1b;--ykfm-bubble:#f2f3f5;--ykfm-bubble2:#d8fdd2;--ykfm-border:rgba(0,0,0,.08);--ykfm-time:#8b8b8b;--ykfm-radius:16px;--ykfm-gap:8px;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ykfm-text)}
.ykfm .ykfm-header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border:1px solid var(--ykfm-border);border-bottom:none;border-radius:14px 14px 0 0;background:var(--ykfm-header,#075e55);color:#fff}
.ykfm .ykfm-h-left{display:flex;gap:10px;align-items:center}
.ykfm .ykfm-h-ava{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.35)}
.ykfm .ykfm-h-title{font-weight:600}
.ykfm .ykfm-h-sub{font-size:12px;opacity:.9}
.ykfm .ykfm-h-right{display:flex;gap:10px;align-items:center;opacity:.95}
.ykfm .ykfm-h-icon{width:16px;height:16px;display:inline-block;background:currentColor;mask:center/contain no-repeat}
.ykfm .ykfm-chat{background:var(--ykfm-bg);border:1px solid var(--ykfm-border);border-radius:0 0 14px 14px;padding:12px;max-width:800px;margin:0 auto}
.ykfm .ykfm-msgwrap{display:flex;gap:10px;margin:10px 0}
.ykfm .ykfm-left{flex-direction:row}
.ykfm .ykfm-right{flex-direction:row-reverse}
.ykfm .ykfm-ava{width:32px;min-width:32px;height:32px;border-radius:50%;overflow:hidden}
.ykfm .ykfm-avatar{width:32px;height:32px;display:block;border-radius:50%}
.ykfm .ykfm-bubble{max-width:75%;padding:1px 8px 8px 10px;border-radius:18px 18px 18px 4px;background:var(--ykfm-bubble);position:relative}
.ykfm .ykfm-right .ykfm-bubble{background:var(--ykfm-bubble2);border-radius:18px 18px 4px 18px}
.ykfm .ykfm-time{gap:1ch;font-size:11px;color:var(--ykfm-time);margin-top:4px;text-align:right;display:inline-flex;align-items:center margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch;}
/* Service */
.ykfm .ykfm-service{display:flex;justify-content:center;margin:12px 0;color:#666;font-size:12px}
.ykfm .ykfm-divider span{background:#eee;border-radius:12px;padding:2px 8px}
.ykfm .ykfm-typing .ykfm-dots b{display:inline-block;width:6px;height:6px;border-radius:50%;background:#bbb;margin:0 2px;animation:ykfm-blink 1s infinite}
.ykfm .ykfm-dots b:nth-child(2){animation-delay:.2s}.ykfm .ykfm-dots b:nth-child(3){animation-delay:.4s}
@keyframes ykfm-blink{0%,80%,100%{opacity:.2}40%{opacity:1}}
/* Input wrapper */
.ykfm .ykfm-inputwrap{margin-top:10px;border-top:1px dashed var(--ykfm-border);padding-top:10px}
.ykfm .ykfm-fakeinput{display:flex;align-items:center;gap:8px;border:1px solid var(--ykfm-border);border-radius:999px;padding:6px 10px;background:#fff;margin-top:8px}
.ykfm .ykfm-fakeinput input{border:0;outline:none;flex:1;background:transparent}
.ykfm .ykfm-fakeinput .clip,.ykfm .ykfm-fakeinput .emo,.ykfm .ykfm-fakeinput .mic{width:18px;height:18px;background:currentColor;opacity:.7;mask:center/contain no-repeat}
.ykfm .ykfm-fakeinput .clip{mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M16.5,6.5v9.4c0,2.5-2,4.6-4.5,4.6S7.5,18.4,7.5,15.9V6.5c0-1.7,1.3-3,3-3s3,1.3,3,3v9.1c0,0.8-0.7,1.4-1.5,1.4S10.5,16.4,10.5,15.6V7.5h-1v8.1c0,1.4,1.1,2.5,2.5,2.5s2.5-1.1,2.5-2.5V6.5c0-2.2-1.8-4-4-4S6.5,4.3,6.5,6.5v9.4c0,3,2.5,5.5,5.5,5.5s5.5-2.5,5.5-5.5V6.5H16.5z"/></svg>')}
.ykfm .ykfm-fakeinput .emo{mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 2a10 10 0 100 20 10 10 0 000-20zm-3 7a1.5 1.5 0 110 3 1.5 1.5 0 010-3zm6 0a1.5 1.5 0 110 3 1.5 1.5 0 010-3zM7.5 14a5.5 5.5 0 009 0H7.5z"/></svg>')}
.ykfm .ykfm-fakeinput .mic{mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%23000" d="M12 14a3 3 0 003-3V6a3 3 0 10-6 0v5a3 3 0 003 3zm5-3a5 5 0 01-10 0H5a7 7 0 0014 0h-2zm-5 7a7 7 0 007-7h-2a5 5 0 01-10 0H5a7 7 0 007 7zm-1 2h2v2h-2v-2z"/></svg>')}
/* Twemoji images */
.ykfm .ykfm-bubble .ykfm-emo{height:1em;width:1em;vertical-align:-0.2em}

/* Background patterns */

.ykfm.ykfm-skin-whatsapp .ykfm-chat{
  background-color:#E5DDD5;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='216' height='216' viewBox='0 0 216 216'><g fill='none' stroke='%23D7CCC8' stroke-width='1' opacity='.55'><path d='M0 108h216'/><path d='M108 0v216'/></g><g fill='%23D7CCC8' opacity='.35'><circle cx='54' cy='54' r='2'/><circle cx='162' cy='54' r='2'/><circle cx='54' cy='162' r='2'/><circle cx='162' cy='162' r='2'/></g></svg>");
  background-size:216px 216px;
}

.ykfm.ykfm-skin-telegram .ykfm-chat{background-image:radial-gradient(#e2eefc 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-instagram .ykfm-chat{background-image:linear-gradient(135deg, rgba(255,0,150,.07), rgba(0,120,255,.07))}
.ykfm.ykfm-skin-vk .ykfm-chat{background-image:radial-gradient(#e2f0ff 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-snapchat .ykfm-chat{background-image:radial-gradient(#fff4a3 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-yandex .ykfm-chat{background-image:radial-gradient(#ffe1e1 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-skype .ykfm-chat{background-image:radial-gradient(#cdefff 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-fb .ykfm-chat{background-image:radial-gradient(#dbe7ff 1px, transparent 1px);background-size:18px 18px}
.ykfm.ykfm-skin-gray .ykfm-chat{background-image:none}

/* Header colors per skin */
.ykfm.ykfm-skin-whatsapp .ykfm-header{--ykfm-header:#075e55}
.ykfm.ykfm-skin-telegram .ykfm-header{--ykfm-header:#2a9df4}
.ykfm.ykfm-skin-vk .ykfm-header{--ykfm-header:#2787f5}
.ykfm.ykfm-skin-instagram .ykfm-header{--ykfm-header:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}

/* Merge header+chat borders */
.ykfm .ykfm-header + .ykfm-chat{border-top:none;border-radius:0 0 14px 14px}

/* Phone frames (iPhone light) */
.ykfm-frame-iphone{padding:18px;background:#fff;border:1px solid #ddd;border-radius:34px;box-shadow:0 10px 30px rgba(0,0,0,.08);position:relative}
.ykfm-frame-iphone:before{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:90px;height:6px;border-radius:3px;background:#ddd}
.ykfm-frame-android{padding:14px;background:#0b0b0b;border-radius:22px;box-shadow:0 10px 30px rgba(0,0,0,.15)}

.ykfm .ykfm-tick{display:inline-block;width:16px;height:12px;background:currentColor;opacity:.85;vertical-align:middle;mask:center/contain no-repeat;margin-left:4px}

.ykfm .ykfm-time{gap:1ch;gap:8px margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch; margin-left:1ch; display:inline-flex; align-items:center; gap:1ch;}
.ykfm .ykfm-tick.one{mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 14"><path fill="%23000" d="M7 10L2.5 5.5 1 7l6 6 12-12L17.5 0z"/></svg>')}
.ykfm .ykfm-tick.two{mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 14"><path fill="%23000" d="M8 10L3.5 5.5 2 7l6 6 12-12L18.5 0zM13 10L8.5 5.5 7 7l6 6 12-12L23.5 0z"/></svg>')}
.ykfm .ykfm-tick.seen{color:#53bdeb}
.ykfm .ykfm-h-right .ykfm-ico{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:8px;opacity:.95}

/* Telegram-like look */
.ykfm.ykfm-skin-telegram{--ykfm-bg:#e9eff5;--ykfm-bubble:#ffffff;--ykfm-bubble2:#d2f0ff}
.ykfm.ykfm-skin-telegram .ykfm-header{--ykfm-header:#2a9df4}
.ykfm.ykfm-skin-telegram .ykfm-chat{background-image:none}
.ykfm.ykfm-skin-telegram .ykfm-bubble{border-radius:16px 16px 16px 4px;box-shadow:0 1px 0 rgba(0,0,0,.03)}
.ykfm.ykfm-skin-telegram .ykfm-right .ykfm-bubble{border-radius:16px 16px 4px 16px}
.ykfm.ykfm-skin-telegram .ykfm-time{opacity:.8}

.ykfm .ykfm-h-ava img{width:28px;height:28px;border-radius:50%;display:block}

.ykfm .ykfm-ticks{display:inline-flex;align-items:center;margin-left:1ch}
.ykfm .ykfm-seen{color:var(--ykfm-seen,#34b7f1)}

/* VK */
.ykfm.ykfm-skin-vk .ykfm-header{--ykfm-header:#2787F5}
.ykfm.ykfm-skin-vk .ykfm-chat{background:#EEF3F7}
.ykfm.ykfm-skin-vk{--ykfm-bubble:#fff;--ykfm-bubble2:#DAF1FF;--ykfm-time:#6b7c8f;--ykfm-seen:#4A90E2}
/* Skype */
.ykfm.ykfm-skin-skype .ykfm-header{--ykfm-header:#00AFF0}
.ykfm.ykfm-skin-skype .ykfm-chat{background:#E8F7FF}
.ykfm.ykfm-skin-skype{--ykfm-bubble:#fff;--ykfm-bubble2:#DDF4FF;--ykfm-time:#5a6a7a;--ykfm-seen:#00AFF0}
/* Facebook Messenger */
.ykfm.ykfm-skin-fb .ykfm-header{--ykfm-header:#0084FF}
.ykfm.ykfm-skin-fb .ykfm-chat{background:#EAF3FF}
.ykfm.ykfm-skin-fb{--ykfm-bubble:#fff;--ykfm-bubble2:#E1F0FF;--ykfm-time:#657786;--ykfm-seen:#218AFF}
/* Yandex */
.ykfm.ykfm-skin-yandex .ykfm-header{--ykfm-header:#FF2E2E}
.ykfm.ykfm-skin-yandex .ykfm-chat{background:#FFF4F4}
.ykfm.ykfm-skin-yandex{--ykfm-bubble:#fff;--ykfm-bubble2:#FFEDED;--ykfm-time:#6c6c6c;--ykfm-seen:#FF2E2E}
/* Snapchat */
.ykfm.ykfm-skin-snapchat .ykfm-header{--ykfm-header:#FFFC00;color:#000}
.ykfm.ykfm-skin-snapchat .ykfm-chat{background:#FFFCE1}
.ykfm.ykfm-skin-snapchat{--ykfm-bubble:#fff;--ykfm-bubble2:#FFF68A;--ykfm-time:#6c6c6c;--ykfm-seen:#000}
/* Gray */
.ykfm.ykfm-skin-gray .ykfm-header{--ykfm-header:#3b3b3b}
.ykfm.ykfm-skin-gray .ykfm-chat{background:#f2f2f2}
.ykfm.ykfm-skin-gray{--ykfm-bubble:#fff;--ykfm-bubble2:#e9f5ff;--ykfm-time:#666;--ykfm-seen:#2b80ff}

/* Neutral skin: very subtle */
.ykfm.ykfm-skin-neutral{--ykfm-header:#666; --ykfm-time:#777; --ykfm-bubble:#fff; --ykfm-bubble2:#f7f7f7; --ykfm-seen:#999}
.ykfm.ykfm-skin-neutral .ykfm-header{background:transparent;color:inherit;border:none}
.ykfm.ykfm-skin-neutral .ykfm-wrap{box-shadow:none;border:1px solid rgba(0,0,0,.06)}
.ykfm.ykfm-skin-neutral .ykfm-chat{background:transparent}
.ykfm.ykfm-skin-neutral .ykfm-bubble{background:var(--ykfm-bubble);border:1px solid rgba(0,0,0,.05)}
.ykfm.ykfm-skin-neutral .ykfm-right .ykfm-bubble{background:var(--ykfm-bubble2)}

.ykfm .ykfm-map-wrapper{margin:.5rem 0;overflow:hidden;border-radius:10px}

.ykfm .ykfz-typing{display:inline-flex;gap:.35ch;margin-left:1ch;align-items:center}
.ykfm .ykfz-typing i{width:4px;height:4px;border-radius:50%;background:var(--ykfm-time,#888);opacity:.6;display:block;animation:ykfz-blink 1.2s infinite}
.ykfm .ykfz-typing i:nth-child(2){animation-delay:.2s}
.ykfm .ykfz-typing i:nth-child(3){animation-delay:.4s}
@keyframes ykfz-blink{0%,80%,100%{opacity:.3}40%{opacity:1}}

.ykfm .ykfm-bubble{font-family: var(--ykfm-font, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial), 'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji', sans-serif;}

/* scroll modes */
.ykfm-messages.ykfm-scroll-off{overflow:hidden;}

/* disable scroll checkbox */
.ykfm-messages.ykfm-scroll-disabled{overflow:hidden !important;}

/* ===== Phone placement for WhatsApp skin ===== */
.ykfm-widget.ykfm-skin-whatsapp .ykfm-head,
.ykfm-widget.whatsapp .ykfm-head,
.whatsapp .ykfm-head{display:flex;align-items:baseline}

.ykfm-widget.ykfm-skin-whatsapp .ykfz-name,
.ykfm-widget.whatsapp .ykfz-name,
.whatsapp .ykfz-name{font-weight:600}

.ykfm-widget.ykfm-skin-whatsapp .ykfz-phone,
.ykfm-widget.whatsapp .ykfz-phone,
.whatsapp .ykfz-phone{
    margin-left:auto;
    color:#8f9ca1;
    font-size:inherit;
    line-height:1.2;
    white-space:nowrap;
    opacity:.9;
}



/* ===== Fix phone placement (WhatsApp skin) ===== */
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble > .ykfm-head{display:flex;align-items:baseline;gap:.5em;width:100%}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble > .ykfm-head .ykfz-phone{margin-left:auto;color:#8f9ca1;font-size:inherit;white-space:nowrap;opacity:.9}

/* Fallbacks in case .ykfm-head is not present due to template */
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble .ykfz-name + .ykfz-phone{display:inline-block;float:right;white-space:nowrap;color:#8f9ca1}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble .ykfz-name{display:inline}

/* ===== WhatsApp: place phone on the right of name (robust, no wrapper needed) ===== */
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble,
.ykfm-widget.whatsapp .ykfm-bubble,
.whatsapp .ykfm-bubble{
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble .ykfz-name,
.ykfm-widget.whatsapp .ykfm-bubble .ykfz-name,
.whatsapp .ykfm-bubble .ykfz-name{
    order:0;
    display:inline;
}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble .ykfz-phone,
.ykfm-widget.whatsapp .ykfm-bubble .ykfz-phone,
.whatsapp .ykfm-bubble .ykfz-phone{
    order:1;
    margin-left:auto;
    color:#8f9ca1;
    font-size:inherit;
    white-space:nowrap;
    opacity:.9;
}
/* everything else goes to next line */
.ykfm-widget.ykfm-skin-whatsapp .ykfm-bubble > :not(.ykfz-name):not(.ykfz-phone),
.ykfm-widget.whatsapp .ykfm-bubble > :not(.ykfz-name):not(.ykfz-phone),
.whatsapp .ykfm-bubble > :not(.ykfz-name):not(.ykfz-phone){
    order:3;
    flex-basis:100%;
}

/* ===== Robust phone alignment (generic fallback) ===== */
.ykfm-widget .ykfm-bubble{display:flex !important; flex-wrap:wrap !important; align-items:baseline !important;}
.ykfm-widget .ykfm-bubble .ykfz-name{order:0 !important; display:inline !important;}
.ykfm-widget .ykfm-bubble .ykfz-phone{order:1 !important; margin-left:auto !important; white-space:nowrap !important;}
/* WhatsApp aesthetic */
.ykfm-widget .ykfm-bubble .ykfz-phone{color:#8f9ca1 !important; opacity:.9 !important;}
/* keep other elements natural order */

/* ===== Phone/name first row (generic) ===== */
.ykfm-widget .ykfm-bubble{display:flex;flex-wrap:wrap;align-items:baseline}
.ykfm-widget .ykfm-bubble .ykfz-name{order:0;display:inline}
.ykfm-widget .ykfm-bubble .ykfz-phone{order:1;margin-left:auto;white-space:nowrap}

/* ===== Message layout: head (name+phone), body, meta ===== */
.ykfm-bubble .ykfm-head{display:flex;align-items:center;gap:.5em;margin-bottom:.25rem;white-space:nowrap}
.ykfm-bubble .ykfm-head .ykfz-name{font-weight:600}
.ykfm-bubble .ykfm-head .ykfz-phone{margin-left:auto;white-space:nowrap}
.ykfm-bubble .ykfm-body{display:block}
.ykfm-bubble .ykfm-meta{display:flex;gap:.5em;align-items:center;justify-content:flex-start;margin-top:.25rem;font-size:.92em;opacity:.85}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-head .ykfz-phone{color:#8f9ca1}

/* ===== Canonical message layout (0.11.9) ===== */
.ykfm-bubble .ykfm-head{display:flex;align-items:center;gap:.5em;margin-bottom:.25rem;white-space:nowrap}
.ykfm-bubble .ykfm-head .ykfz-name{font-weight:600}
.ykfm-bubble .ykfm-head .ykfz-phone{margin-left:auto;white-space:nowrap}
.ykfm-bubble .ykfm-body{display:block}
.ykfm-bubble .ykfm-meta{display:flex;gap:.5em;align-items:center;justify-content:flex-start;margin-top:.25rem;font-size:.92em;opacity:.85}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-head .ykfz-phone{color:#8f9ca1}

/* ===== Canonical message layout (0.12.0) ===== */
.ykfm-bubble .ykfm-head{display:flex;align-items:center;gap:.5em;margin-bottom:.25rem;white-space:nowrap}
.ykfm-bubble .ykfm-head .ykfz-name{font-weight:600}
.ykfm-bubble .ykfm-head .ykfz-phone{margin-left:auto;white-space:nowrap}
.ykfm-bubble .ykfm-body{display:block}
.ykfm-bubble .ykfm-meta{display:flex;gap:.5em;align-items:center;justify-content:flex-start;margin-top:.25rem;font-size:.92em;opacity:.85}
.ykfm-widget.ykfm-skin-whatsapp .ykfm-head .ykfz-phone{color:#8f9ca1}



/* === YouKit FAQ 0.12.3: unified Name(left) + Phone(right) header & adaptive spacing === */
.ykfm-bubble{position:relative}
.ykfm-bubble .ykfz-name,.ykfm-bubble .ykfz-phone{float:none!important;margin:0!important;padding:0!important}
.ykfm-bubble .ykfz-name{position:absolute;left:14px;top:8px;font-weight:600;opacity:.95;line-height:1.1}
.ykfm-bubble .ykfz-phone{position:absolute;right:12px;top:8px;font-size:12px;opacity:.6;white-space:nowrap}
/* Adaptive top padding so message text never overlaps the header */
.ykfm-bubble{padding-top:calc(1.8em + 14px)}
@media (max-width:480px){
  .ykfm-bubble{padding-top:calc(2.2em + 16px)}
  .ykfm-bubble .ykfz-name{max-width:calc(100% - 150px);overflow:hidden;text-overflow:ellipsis}
}
/* === /unified header === */


/* === YouKit FAQ 0.12.3.2: robust header spacer to avoid overlap === */
.ykfm-bubble{
  position:relative;
  --ykfz-header-gap: calc(1.5em + 10px);
}
/* flexible gap: mobile */
@media (max-width:480px){.ykfm-bubble{--ykfz-header-gap: calc(1.8em + 12px);}}

/* Spacer before the actual message content to guarantee room for Name/Phone header */
.ykfm-bubble::before{
  content:"";
  display:block;
  height:var(--ykfz-header-gap);
}

/* First content nudge for skins with inner wrappers */
.ykfm-bubble > :not(.ykfz-name):not(.ykfz-phone):first-child{ margin-top: .1em; }

/* Safety margins for common wrappers */
.ykfm-bubble .ykfm-text,
.ykfm-bubble .ykfm-message,
.ykfm-bubble .ykfm-content,
.ykfm-bubble p:first-child{
  margin-top: 0.1em;
}
/* === /robust header spacer === */

/* YKFZ: enforce max-height + scroll modes on messages container */
.ykfm .ykfz-messages{
  max-height: var(--ykfz-max-height, none);
  overflow: auto;
}
.ykfm .ykfz-messages[data-scroll="off"]{
  overflow: visible;
}

/* === youkit-faq-zumer patch: avatar circle + tighter header/message gap === */
.ykfm .ykfm-avatar{
  width: clamp(36px, 6vw, 48px);
  height: clamp(36px, 6vw, 48px);
  aspect-ratio: 1 / 1;
  border-radius: 9999px;
  overflow: hidden;
  flex: 0 0 auto;
}
.ykfm .ykfm-avatar img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ykfm .ykfm-row,
.ykfm .ykfm-bubble-row{
  align-items: flex-start;
}
.ykfm .ykfm-bubble .ykfz-name,
.ykfm .ykfm-bubble .ykfz-phone{
  margin: 0;
  line-height: 1.15;
}
.ykfm .ykfm-bubble .ykfz-name + .ykfz-phone{ margin-top: 0px; }
.ykfm .ykfm-bubble .ykfz-phone + *,
.ykfm .ykfm-bubble .ykfz-name + *{ margin-top: 1px; }
.ykfm .ykfm-bubble .ykfm-msg{ margin-top: 1px !important; }
/* === /patch === */

/* === Patch r2: avatar circle + anti-squash + tighter header gap === */
.ykfm .ykfm-ava{
  width: clamp(36px, 6vw, 48px);
  min-width: clamp(36px, 6vw, 48px);
  height: clamp(36px, 6vw, 48px);
  aspect-ratio: 1/1;
  border-radius: 9999px;
  overflow: hidden;
  flex: 0 0 auto;
}
.ykfm img.ykfm-avatar,
.ykfm .ykfm-avatar img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}
/* Header-name/phone compact spacing */
.ykfm .ykfm-bubble .ykfz-name,
.ykfm .ykfm-bubble .ykfz-phone{ margin:0; line-height:1.15; }
.ykfm .ykfm-bubble .ykfz-name + .ykfz-phone{ margin-top:2px; }
.ykfm .ykfm-bubble .ykfz-phone + *,
.ykfm .ykfm-bubble .ykfz-name + *{ margin-top:4px; }
.ykfm .ykfm-bubble .ykfm-msg{ margin-top:4px !important; }

/* --- Fix: header avatar circle --- */
.ykfm .ykfm-h-ava img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  aspect-ratio: 1/1;
  display: block;
}
.ykfm .ykfm-h-ava {
  width: clamp(28px, 6vw, 36px);
  height: clamp(28px, 6vw, 36px);
  border-radius: 50%;
  overflow: hidden;
  flex: 0 0 auto;
  
}