/* ==========================================================================
   LeadVector — top menu (authorized user), Bootstrap 5.2.3
   Markup: parts/topbar.part.html. Load after css/bootstrap.min.css.
   Dropdowns are Bootstrap 5 dropdowns (data-bs-toggle="dropdown").
   The «credits + tariff» blocks come from the server with inline CSS;
   this file only adds their hover/focus states. The blocks never shrink:
   on narrow screens the other items are compacted instead (see the end).
   ========================================================================== */

.lv-topbar{
  --lv-tb-accent:#4450B2;
  --lv-tb-text:#344054;
  --lv-tb-muted:#98A2B3;
  --lv-tb-line:#E5E9F1;
  position:relative;z-index:1030;
  display:flex;align-items:center;gap:12px;
  height:64px;min-width:0;
  padding:0 22px;
  background:#FAFBFC;
  border-bottom:1px solid rgba(49,92,246,.08);
  color:var(--lv-tb-text);
  font-family:Onest,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:13px;line-height:normal;
  -webkit-font-smoothing:antialiased;
}

/* ---------- Search ---------- */
.lv-topbar-search{position:relative;flex:1 1 280px;min-width:160px;max-width:760px;height:40px}
.lv-topbar-search::before{
  content:"";position:absolute;left:12px;top:50%;z-index:2;width:15px;height:15px;transform:translateY(-50%);pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg width='15' height='15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.8 11.5a4.7 4.7 0 1 0 0-9.4 4.7 4.7 0 0 0 0 9.4ZM10.2 10.2l2.7 2.7' stroke='%2398A2B3' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.lv-topbar-search .form-control{
  height:40px;padding:0 12px 0 36px;
  border:1px solid #DCE3EF;border-radius:10px;background:#fff;
  color:#202636;font:500 13px Onest,system-ui,sans-serif;
  transition:border-color .16s,box-shadow .16s;
}
.lv-topbar-search .form-control::placeholder{color:var(--lv-tb-muted)}
.lv-topbar-search:hover .form-control{border-color:#C9D4E6;box-shadow:0 4px 14px rgba(17,24,39,.045)}
.lv-topbar-search .form-control:focus{border-color:#B9C6FF;box-shadow:0 0 0 3px rgba(49,92,246,.08),0 8px 22px rgba(17,24,39,.06)}
.lv-topbar-search .form-control::-webkit-search-cancel-button{display:none}
/* suggestions panel (filled by the site's global-search script; opens with .is-open) */
.lv-topbar-suggest{
  position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:90;padding:10px;
  border:1px solid rgba(226,232,240,.96);border-radius:16px;background:#fff;
  box-shadow:0 22px 54px rgba(15,23,42,.14),0 5px 14px rgba(15,23,42,.055);
  opacity:0;visibility:hidden;transform:translateY(-6px) scale(.992);transform-origin:50% 0;
  transition:opacity .18s cubic-bezier(.16,1,.3,1),transform .18s cubic-bezier(.16,1,.3,1),visibility .18s;
}
.lv-topbar-search.is-open .lv-topbar-suggest{opacity:1;visibility:visible;transform:none}
/* suggestion rows (.top-suggest-group / .top-suggest-item from account.styles.css) rise in on open */
.lv-topbar-search.is-open .top-suggest-group,
.lv-topbar-search.is-open .top-suggest-item{animation:lvTopSuggestRise .2s cubic-bezier(.16,1,.3,1) both}
.lv-topbar-search.is-open .top-suggest-group:nth-of-type(2){animation-delay:.03s}
.lv-topbar-search.is-open .top-suggest-group:nth-of-type(3){animation-delay:.05s}
.lv-topbar-search.is-open .top-suggest-group:nth-of-type(4){animation-delay:.07s}
@keyframes lvTopSuggestRise{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}

.lv-topbar-search-toggle{
  display:none;width:40px;height:40px;padding:0;border:1px solid #DCE3EF;border-radius:10px;background:#fff;
  color:#667085;align-items:center;justify-content:center;cursor:pointer;transition:border-color .15s,color .15s;
}
.lv-topbar-search-toggle:hover,.lv-topbar-search-toggle[aria-expanded="true"]{border-color:#C9D4E6;color:var(--lv-tb-accent)}
.lv-topbar-search-toggle:focus-visible{outline:2px solid rgba(68,80,178,.25);outline-offset:1px}
.lv-topbar-search-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}

/* ---------- Right side ---------- */
.lv-topbar-actions{display:flex;align-items:center;gap:12px;flex:0 0 auto;margin-left:auto;min-width:0}

/* plan slot: default «Тарифы» button */
.lv-plan-slot{display:flex;align-items:center;flex:0 0 auto;min-height:40px;margin-right:2px}
/* No Bootstrap .btn here on purpose: the site styles .btn globally
   (white text !important, lift on hover), so the topbar buttons are standalone. */
.lv-tariffs-btn,.lv-topbar-login,.lv-topbar-register{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  height:38px;padding:0 14px;border:1px solid transparent;border-radius:10px;
  font:600 13px/1 Onest,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.012em;
  white-space:nowrap;text-decoration:none;cursor:pointer;user-select:none;
  transition:color .15s,background-color .15s,border-color .15s,box-shadow .15s;
}
.lv-tariffs-btn:focus-visible,.lv-topbar-login:focus-visible,.lv-topbar-register:focus-visible{outline:0;box-shadow:0 0 0 .25rem rgba(68,80,178,.25)}
.lv-tariffs-btn{color:var(--lv-tb-accent,#4450B2);background:#EEF1FF;border-color:#EEF1FF}
.lv-tariffs-btn:hover{color:var(--lv-tb-accent,#4450B2);background:#E2E7FF;border-color:#E2E7FF}
.lv-tariffs-btn:active{background:#D9DFFF;border-color:#D9DFFF}
.lv-plan-slot.is-loaded{animation:lvPlanIn .2s ease-out}
@keyframes lvPlanIn{from{opacity:0}to{opacity:1}}

/* dynamic blocks (inline-styled): interaction only */
.lv-plan-tariff:hover .lv-plan-tariff-label,
.lv-plan-tariff:focus-visible .lv-plan-tariff-label{color:var(--lv-tb-accent)!important}
.lv-plan-tariff:focus-visible{outline:2px solid var(--lv-tb-accent);outline-offset:4px;border-radius:4px}

/* ---------- Dropdown triggers ---------- */
.lv-topbar-trigger{
  display:inline-flex;align-items:center;gap:8px;
  height:38px;padding:0 10px;border:0;border-radius:10px;background:transparent;
  color:var(--lv-tb-text);font:600 13px/1 Onest,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.012em;white-space:nowrap;
  cursor:pointer;transition:color .15s;
}
.lv-topbar-account{padding-right:6px}
.lv-topbar-trigger:hover,.lv-topbar-trigger[aria-expanded="true"]{color:var(--lv-tb-accent)}
.lv-topbar-trigger:focus-visible{outline:2px solid rgba(68,80,178,.25);outline-offset:1px}
.lv-topbar-icon{width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:#667085;transition:color .15s}
.lv-topbar-trigger:hover .lv-topbar-icon,.lv-topbar-trigger[aria-expanded="true"] .lv-topbar-icon{color:var(--lv-tb-accent)}
.lv-topbar-email{color:#202636;font-weight:650;letter-spacing:-.014em;max-width:240px;overflow:hidden;text-overflow:ellipsis}
.lv-topbar-trigger:hover .lv-topbar-email,.lv-topbar-trigger[aria-expanded="true"] .lv-topbar-email{color:var(--lv-tb-accent)}
.lv-topbar-chevron{width:15px;height:15px;flex:0 0 15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s}
.lv-topbar-trigger[aria-expanded="true"] .lv-topbar-chevron{transform:rotate(180deg)}

/* ---------- Dropdown menus (Bootstrap .dropdown-menu) ---------- */
.lv-topbar-dropdown{
  --bs-dropdown-min-width:230px;
  --bs-dropdown-padding-x:8px;--bs-dropdown-padding-y:8px;
  --bs-dropdown-border-color:#E3DCF1;--bs-dropdown-border-radius:12px;
  --bs-dropdown-box-shadow:0 18px 42px rgba(15,23,42,.13),0 4px 12px rgba(15,23,42,.05);
  --bs-dropdown-link-color:#344054;--bs-dropdown-link-hover-color:var(--lv-tb-accent);--bs-dropdown-link-hover-bg:#F6F8FC;
  --bs-dropdown-link-active-color:var(--lv-tb-accent);--bs-dropdown-link-active-bg:#EEF1FF;
  --bs-dropdown-item-padding-x:10px;--bs-dropdown-item-padding-y:8px;--bs-dropdown-item-border-radius:8px;
  --bs-dropdown-divider-bg:#EDF1F6;--bs-dropdown-divider-margin-y:4px;
  box-shadow:var(--bs-dropdown-box-shadow);
}
.lv-topbar-dropdown-support{min-width:248px}
.lv-topbar-dropdown.show{animation:lvTbDrop .16s ease-out}
@keyframes lvTbDrop{from{opacity:0;margin-top:-5px}to{opacity:1;margin-top:0}}
.lv-topbar-dropdown .dropdown-item{
  display:flex;align-items:center;gap:10px;min-height:40px;
  font:550 13px/1.25 Onest,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.01em;
}
.lv-topbar-support-inline,.lv-topbar-search-inline{display:none}
.lv-topbar-dropdown .dropdown-item svg{width:17px;height:17px;flex:0 0 17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Guest: «Вход» / «Регистрация» ---------- */
.lv-topbar-login{color:var(--lv-tb-text);background:#fff;border-color:#DDE3EF}
.lv-topbar-login:hover{color:var(--lv-tb-accent);border-color:#C7D0E4}
.lv-topbar-login:active{color:var(--lv-tb-accent);background:#F6F8FC;border-color:#C7D0E4}
.lv-topbar-login .lv-topbar-icon{width:17px;height:17px;flex-basis:17px;color:currentColor}
.lv-topbar-register{color:#fff;background:var(--lv-tb-accent);border-color:var(--lv-tb-accent);box-shadow:0 6px 14px rgba(56,68,155,.14)}
.lv-topbar-register:hover{color:#fff;background:#3D48A4;border-color:#3D48A4}
.lv-topbar-register:active{color:#fff;background:#363F91;border-color:#363F91}
.lv-topbar-more{display:none}

/* ==========================================================================
   Narrow screens — the «credits + tariff» blocks keep their full width.
   js/topbar.js measures the bar and adds these classes one by one, only
   while the content does not fit (so the result is right for any width of
   the blocks, e.g. «12 345 кредитов из 20 000»):
     tb-email-icon    e-mail → account icon
     tb-support-icon  «Поддержка» → icon
     tb-tight         smaller paddings / gaps, no chevrons
     tb-search-icon   search field → icon (opens over the bar)
     tb-no-support    support menu hidden, its links move into the account menu
     tb-no-search     search icon hidden, «Поиск» appears in the account menu
                      and opens the same search over the bar
     tb-plan-scroll   last resort (≈ ≤340px): the blocks keep their width and
                      scroll sideways inside their slot instead of breaking
                      the page
   ========================================================================== */
.lv-topbar.tb-email-icon .lv-topbar-email{display:none}
.lv-topbar.tb-email-icon .lv-topbar-account{padding-right:6px}

.lv-topbar.tb-support-icon .lv-topbar-support .lv-topbar-trigger-text{display:none}

.lv-topbar.tb-tight{padding:0 12px;gap:8px}
.lv-topbar.tb-tight .lv-topbar-actions{gap:6px}
.lv-topbar.tb-tight .lv-topbar-trigger{padding:0 6px;gap:4px}
.lv-topbar.tb-tight .lv-topbar-chevron{display:none}
.lv-topbar.tb-tight [data-lv-plan]{gap:14px!important}   /* space between the blocks, not the blocks */

.lv-topbar.tb-search-icon .lv-topbar-search{flex:0 0 40px;min-width:0;width:40px}
.lv-topbar.tb-search-icon .lv-topbar-search::before,
.lv-topbar.tb-search-icon .lv-topbar-search .form-control{display:none}
.lv-topbar.tb-search-icon .lv-topbar-search-toggle{display:inline-flex}
/* opened search covers the bar */
.lv-topbar.tb-search-open .lv-topbar-search{
  position:absolute;left:12px;right:12px;top:12px;z-index:40;width:auto;max-width:none;
  display:flex;gap:8px;
}
.lv-topbar.tb-search-open .lv-topbar-search::before{display:block;left:60px}
.lv-topbar.tb-search-open .lv-topbar-search .form-control{display:block;flex:1 1 auto;box-shadow:0 8px 22px rgba(17,24,39,.08)}
.lv-topbar.tb-search-open .lv-topbar-actions{visibility:hidden}

.lv-topbar.tb-no-support .lv-topbar-support{display:none}
.lv-topbar.tb-no-support .lv-topbar-support-inline{display:list-item}
.lv-topbar.tb-no-support{padding:0 8px;gap:6px}
.lv-topbar.tb-no-support .lv-topbar-actions{gap:4px}
.lv-topbar.tb-no-support [data-lv-plan]{gap:10px!important}

.lv-topbar.tb-no-search .lv-topbar-search{display:none}
.lv-topbar.tb-no-search .lv-topbar-search-inline{display:list-item}
.lv-topbar.tb-no-search.tb-search-open .lv-topbar-search{display:flex}
.lv-topbar.tb-no-search.tb-search-open .lv-topbar-search-toggle{display:inline-flex}

.lv-topbar.tb-plan-scroll .lv-topbar-actions{flex:1 1 auto}
.lv-topbar.tb-plan-scroll .lv-plan-slot{
  flex:1 1 auto;min-width:0;overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);
          mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);
}
.lv-topbar.tb-plan-scroll .lv-plan-slot::-webkit-scrollbar{display:none}

/* Guest bar steps (js/topbar.js, .lv-topbar-guest):
     tb-support-icon → tb-tight → tb-search-icon →
     tb-login-icon    «Вход» → icon button
     tb-guest-more    «Тарифы» and «Поддержка» move into the «⋯» menu
     tb-no-search     search icon hidden, «Поиск» appears in the «⋯» menu
     tb-btn-small     last resort: smaller «Регистрация» */
.lv-topbar.tb-tight .lv-tariffs-btn,
.lv-topbar.tb-tight .lv-topbar-login,
.lv-topbar.tb-tight .lv-topbar-register{padding:0 10px}
.lv-topbar.tb-login-icon .lv-topbar-login{padding:0;width:38px}
.lv-topbar.tb-login-icon .lv-topbar-login-text{display:none}
.lv-topbar.tb-guest-more .lv-topbar-tariffs,
.lv-topbar.tb-guest-more .lv-topbar-support{display:none}
.lv-topbar.tb-guest-more .lv-topbar-more{display:block}
.lv-topbar.tb-btn-small{padding:0 8px;gap:6px}
.lv-topbar.tb-btn-small .lv-topbar-actions{gap:4px}
.lv-topbar.tb-btn-small .lv-topbar-register{padding:0 8px;font-size:12px;height:34px}
.lv-topbar.tb-btn-small .lv-topbar-login{width:34px;height:34px}

/* «Требует продления»: the red dot slowly blinks (the animation itself is
   set inline in the fragment, the keyframes live here) */
@keyframes lvPlanBlink{0%,100%{opacity:1}50%{opacity:.2}}

@media (prefers-reduced-motion:reduce){
  .lv-topbar-dropdown.show,.lv-plan-slot.is-loaded{animation:none}
  .lv-plan-dot{animation:none!important}
}