@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');

body,
button,
input,
select,
textarea,
.user-shell,
.user-shell *,
.user-sidebar,
.user-sidebar *,
.user-shell-sidebar,
.user-shell-sidebar *{
  font-family:"Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}

.user-brand-mark,
.user-shell-brand-mark{
  width:84px !important;
  height:84px !important;
  min-width:84px !important;
  max-width:84px !important;
  flex:0 0 84px !important;
  border-radius:16px !important;
  object-fit:contain !important;
  background:linear-gradient(180deg,rgba(7,24,58,.92),rgba(10,34,80,.94)) !important;
  padding:0 !important;
  box-sizing:border-box !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  display:block !important;
  overflow:hidden !important;
  opacity:0;
  transition:opacity .18s ease;
}
body.sidebar-collapsed .user-brand-mark,
body.sidebar-collapsed .user-shell-brand-mark{
  width:56px !important;
  height:56px !important;
  min-width:56px !important;
  max-width:56px !important;
  flex:0 0 56px !important;
}
@media (max-width:980px){
  .user-brand-mark,
  .user-shell-brand-mark{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    max-width:56px !important;
    flex:0 0 56px !important;
  }
  body.sidebar-open .user-brand-mark,
  body.sidebar-open .user-shell-brand-mark{
    width:84px !important;
    height:84px !important;
    min-width:84px !important;
    max-width:84px !important;
    flex:0 0 84px !important;
  }
}

.user-brand-subtitle,
.user-shell-brand-subtitle{
  white-space:pre-line;
  line-height:1.3;
}

.user-burger,
.user-shell-burger,
.user-sidebar-head-toggle,
.user-shell-head-toggle,
.user-nav-toggle,
.user-shell-nav-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.user-burger svg,
.user-shell-burger svg,
.user-sidebar-head-toggle svg,
.user-shell-head-toggle svg,
.user-nav-toggle svg,
.user-shell-nav-toggle svg{
  width:18px;
  height:18px;
  display:block;
}

.user-sidebar-head,
.user-shell-head{
  position:relative;
}

.user-sidebar-head-toggle,
.user-shell-head-toggle{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  border-radius:15px !important;
  border:1px solid transparent !important;
  background:rgba(255,255,255,.09) !important;
  color:#fff !important;
  cursor:pointer !important;
  margin:2px auto 10px !important;
  padding:0 !important;
  box-shadow:none !important;
}

.user-sidebar > #userSidebarHeadToggle,
.user-shell-sidebar > #userShellHeadToggle{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  border-radius:15px !important;
  border:1px solid transparent !important;
  background:rgba(255,255,255,.09) !important;
  color:#fff !important;
  margin:2px auto 10px !important;
  padding:0 !important;
  box-shadow:none !important;
}

.user-sidebar-head-toggle:hover,
.user-shell-head-toggle:hover{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.12) !important;
}

.user-sidebar > #userSidebarHeadToggle:hover,
.user-shell-sidebar > #userShellHeadToggle:hover{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.12) !important;
}

button.user-nav-toggle,
button.user-shell-nav-toggle{
  width:100% !important;
  font:inherit !important;
  text-align:left !important;
  cursor:pointer !important;
  margin:0 !important;
  background:transparent !important;
  border-color:transparent !important;
}

button.user-nav-toggle.user-sidebar-head-toggle,
button.user-shell-nav-toggle.user-shell-head-toggle{
  height:auto !important;
  min-width:0 !important;
  border-radius:14px !important;
  box-shadow:none !important;
}

body:not(.sidebar-collapsed) button.user-nav-toggle,
body:not(.sidebar-collapsed) button.user-shell-nav-toggle{
  justify-content:flex-start !important;
  padding-left:12px !important;
  padding-right:12px !important;
}

body.sidebar-collapsed button.user-nav-toggle,
body.sidebar-collapsed button.user-shell-nav-toggle{
  justify-content:center !important;
  padding-left:4px !important;
  padding-right:4px !important;
}

button.user-nav-toggle .user-nav-icon,
button.user-shell-nav-toggle .user-shell-nav-icon{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  flex:0 0 40px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.09) !important;
}

.user-nav-link .user-nav-icon,
.user-shell-nav-link .user-shell-nav-icon,
.user-shell-logout .user-shell-nav-icon{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  flex:0 0 40px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.09) !important;
}

.user-nav-link .user-nav-icon svg,
.user-shell-nav-link .user-shell-nav-icon svg,
.user-shell-logout .user-shell-nav-icon svg{
  width:18px !important;
  height:18px !important;
  display:block !important;
}

.user-topbar-left .user-burger,
.user-page-head .user-shell-burger{
  display:none !important;
}

.user-sidebar-footer,
.user-shell-sidebar-footer{
  margin-top:auto !important;
  padding-top:4px;
}

.user-sidebar,
.user-shell-sidebar{
  min-height:100dvh !important;
  padding-top:8px !important;
  padding-bottom:16px !important;
}

.user-sidebar-footer,
.user-shell-footer{
  position:static !important;
  width:auto !important;
  margin-top:auto !important;
  padding-top:4px !important;
}

body.sidebar-collapsed .user-sidebar-footer,
body.sidebar-collapsed .user-shell-footer{
  width:auto !important;
}

@media (max-width:980px){
  body.sidebar-collapsed .user-sidebar-footer,
  body.sidebar-collapsed .user-shell-footer,
  .user-sidebar-footer,
  .user-shell-footer{
    width:auto !important;
  }
}

.user-nav-link.logout-link,
.user-shell-nav-link.logout-link{
  width:100%;
  background:transparent;
  font:inherit;
  cursor:pointer;
  text-decoration:none !important;
}

.user-nav-link.logout-link *,
.user-shell-nav-link.logout-link *,
.user-shell-logout,
.user-shell-logout *{
  text-decoration:none !important;
}

.user-nav-link.logout-link .user-nav-icon,
.user-shell-nav-link.logout-link .user-shell-nav-icon,
.user-shell-logout .user-shell-nav-icon{
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  flex:0 0 40px !important;
  background:rgba(255,255,255,.12) !important;
}

.user-nav-link.logout-link .user-nav-icon svg,
.user-shell-nav-link.logout-link .user-shell-nav-icon svg,
.user-shell-logout .user-shell-nav-icon svg{
  width:18px !important;
  height:18px !important;
}

.user-nav-link.logout-link,
.user-shell-nav-link.logout-link,
.user-shell-logout{
  padding-top:2px !important;
  padding-bottom:2px !important;
}

/* Сайдбар кабинета: шапка с лого, переключатель и блок «Выход» зафиксированы,
   скроллится только список пунктов меню (страницы с .user-sidebar height:100vh). */
.user-sidebar{
  overflow:hidden !important;
}
.user-sidebar-head,
.user-sidebar-head-toggle,
.user-sidebar-title{
  flex:0 0 auto !important;
}
.user-nav{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
.user-sidebar-footer{
  flex:0 0 auto !important;
}

/* Подменю-вкладки страниц кабинета: название каждой вкладки не рвётся посреди
   строки — вкладка целиком переносится на следующую строку (контейнеры уже
   flex-wrap:wrap / горизонтальный скролл). Важно для мобильной вёрстки. */
.settings-tab,
.communication-tab,
.mgmt-tab,
.mkt-tab,
.mkt-subtab,
.ch-subtab,
.ch-cat-tab,
.acc-subtab,
.harness-tab,
.doc-tab,
.doc-type-tab{
  white-space:nowrap;
}

.user-topbar-actions,
.top-actions{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-left:auto;
}

.mab-balance-stack{
  display:grid;
  gap:2px;
  min-width:0;
  max-width:min(42vw, 260px);
  align-items:start;
}

.mab-balance-meta{
  color:rgba(255,255,255,.74);
  font-family:"Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size:11px;
  font-weight:500;
  line-height:1.25;
  white-space:normal;
}

.mab-balance-plan-link,
.mab-balance-plan-link:visited,
.mab-balance-plan-link:active{
  color:#fff !important;
  text-decoration:underline !important;
  text-underline-offset:2px;
}

.mab-balance-plan-link:hover,
.mab-balance-plan-link:focus{
  color:#fff !important;
  text-decoration:underline !important;
  opacity:.88;
}

.user-balance-link,
.user-shell-balance-link,
.balance-link{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  text-decoration:none !important;
  color:#fff !important;
  font-weight:700 !important;
  font-family:"Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size:16px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  line-height:1.2 !important;
}

.user-balance-link:hover,
.user-balance-link:visited,
.user-balance-link:active,
.user-balance-link:focus,
.user-shell-balance-link:hover,
.user-shell-balance-link:visited,
.user-shell-balance-link:active,
.user-shell-balance-link:focus,
.balance-link:hover,
.balance-link:visited,
.balance-link:active,
.balance-link:focus{
  color:#fff !important;
  text-decoration:underline !important;
}

.user-balance-add,
.user-shell-balance-add,
.balance-add-link{
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  border-radius:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  color:#fff !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-weight:800 !important;
  font-family:"Montserrat", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size:20px !important;
  line-height:1 !important;
  padding:0 !important;
  margin:0 !important;
}

.user-balance-add:hover,
.user-balance-add:visited,
.user-balance-add:active,
.user-balance-add:focus,
.user-shell-balance-add:hover,
.user-shell-balance-add:visited,
.user-shell-balance-add:active,
.user-shell-balance-add:focus,
.balance-add-link:hover,
.balance-add-link:visited,
.balance-add-link:active,
.balance-add-link:focus{
  background:transparent !important;
  box-shadow:none !important;
  color:#fff !important;
  text-decoration:none !important;
}

.user-top-avatar,
.profile-trigger{
  display:none !important;
}

@media (max-width:980px){
  .user-topbar,
  header{
    position:relative;
  }

  .user-topbar-left,
  .user-page-head{
    padding-right:150px;
  }

  .user-topbar-actions,
  .top-actions{
    position:absolute !important;
    top:18px !important;
    right:18px !important;
    width:auto !important;
    justify-content:flex-end !important;
    align-items:center !important;
    margin-left:0 !important;
    z-index:3;
  }
}

@media (max-width:520px){
  .user-topbar-left,
  .user-page-head{
    padding-right:132px;
  }

  .user-balance-link,
  .user-shell-balance-link,
  .balance-link{
    font-size:14px !important;
  }

  .mab-balance-stack{
    max-width:min(46vw, 210px);
  }

  .mab-balance-meta{
    font-size:10px;
  }

  .user-balance-add,
  .user-shell-balance-add,
  .balance-add-link{
    font-size:20px !important;
  }
}

@media (max-width:980px){
  :root{
    --mab-mobile-rail:72px;
    --mab-mobile-sidebar:min(280px,66vw);
  }

  .user-sidebar,
  .user-shell-sidebar{
    position:fixed !important;
    inset:0 0 0 auto !important;
    left:auto !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:var(--mab-mobile-rail) !important;
    max-height:100dvh !important;
    transform:none !important;
    box-shadow:none !important;
    padding:14px 8px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    z-index:100 !important;
    overflow:hidden !important;
    isolation:isolate !important;
    background:linear-gradient(180deg,rgba(7,24,58,.96),rgba(10,34,80,.98)) !important;
  }

  html::before,
  body::before{
    content:"" !important;
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:var(--mab-mobile-rail) !important;
    background:linear-gradient(180deg,rgba(7,24,58,.98),rgba(10,34,80,.99)) !important;
    z-index:99 !important;
    pointer-events:none !important;
  }

  html::before{
    z-index:98 !important;
  }

  body.sidebar-open::before,
  html:has(body.sidebar-open)::before{
    width:var(--mab-mobile-sidebar) !important;
  }

  .user-sidebar::before,
  .user-shell-sidebar::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:100%;
    background:linear-gradient(180deg,rgba(7,24,58,.96),rgba(10,34,80,.98));
    z-index:-1;
    pointer-events:none;
  }

  body.sidebar-open .user-sidebar,
  body.sidebar-open .user-shell-sidebar{
    width:var(--mab-mobile-sidebar) !important;
    padding-left:14px !important;
    padding-right:14px !important;
    overflow:visible !important;
    box-shadow:-12px 0 40px rgba(15,23,42,.34) !important;
  }

  .user-sidebar-head-toggle,
  .user-shell-head-toggle{
    display:inline-flex !important;
    position:static !important;
    margin:2px auto 10px !important;
  }

  /* Мобильный drawer: список пунктов меню заполняет всю высоту вплоть до
     футера «Выход» и скроллится внутри себя. Нижняя зона скролла доходит
     до линии над «Выход», без пустого воздуха между меню и футером. */
  body.sidebar-open .user-nav,
  body.sidebar-open .user-shell-nav{
    margin-top:8px !important;
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
  }

  /* Мобильный свёрнутый рельс (меню закрыто): иконки меню скроллятся,
     «Выход» прижат к низу рельса (у тач-бара). */
  body:not(.sidebar-open) .user-nav,
  body:not(.sidebar-open) .user-shell-nav{
    flex:0 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
  }
  body:not(.sidebar-open) .user-sidebar-footer,
  body:not(.sidebar-open) .user-shell-footer{
    margin-top:auto !important;
  }


  .user-shell-mobile-close,
  .user-topbar-left .user-burger,
  .user-page-head .user-shell-burger{
    display:none !important;
  }

  body.sidebar-open .user-brand,
  body.sidebar-open .user-shell-brand{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .user-brand-text,
  .user-sidebar-title,
  .user-nav-text,
  .user-shell-brand-text,
  .user-shell-nav-title,
  .user-shell-nav-text{
    display:none !important;
  }

  body.sidebar-open .user-brand-text,
  body.sidebar-open .user-sidebar-title,
  body.sidebar-open .user-nav-text,
  body.sidebar-open .user-shell-brand-text,
  body.sidebar-open .user-shell-nav-title,
  body.sidebar-open .user-shell-nav-text{
    display:grid !important;
  }

  body.sidebar-open .user-sidebar-title,
  body.sidebar-open .user-shell-nav-title{
    display:block !important;
  }

  .user-sidebar-head,
  .user-shell-head,
  .user-nav-link,
  .user-shell-nav-link{
    justify-content:center !important;
  }

  .user-brand,
  .user-shell-brand{
    width:100% !important;
    justify-content:center !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.sidebar-open .user-sidebar-head,
  body.sidebar-open .user-shell-head,
  body.sidebar-open .user-nav-link,
  body.sidebar-open .user-shell-nav-link{
    justify-content:flex-start !important;
  }

  .user-nav-link,
  .user-shell-nav-link{
    padding-left:4px !important;
    padding-right:4px !important;
  }

  body.sidebar-open .user-nav-link,
  body.sidebar-open .user-shell-nav-link{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .user-main,
  header,
  main{
    margin-left:0 !important;
    margin-right:var(--mab-mobile-rail) !important;
    width:calc(100vw - var(--mab-mobile-rail)) !important;
    max-width:calc(100vw - var(--mab-mobile-rail)) !important;
    box-sizing:border-box !important;
  }

  .user-sidebar-backdrop,
  .user-shell-backdrop{
    left:0 !important;
    right:var(--mab-mobile-sidebar) !important;
    z-index:90 !important;
  }

  .user-sidebar-footer,
  .user-shell-footer{
    left:auto !important;
    right:14px !important;
  }

  .user-topbar,
  header{
    position:relative !important;
  }

  .user-topbar-actions,
  .top-actions{
    position:absolute !important;
    top:10px !important;
    right:14px !important;
    width:auto !important;
    justify-content:flex-end !important;
    align-items:center !important;
    margin-left:0 !important;
    z-index:4 !important;
  }

  .user-topbar-left,
  .user-page-head{
    padding:34px 0 0 !important;
  }

  .user-card,
  .finance-panel,
  .finance-filters,
  .wallet-grid,
  .form-grid{
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    box-shadow:none !important;
  }

  .finance-filters.is-custom-period,
  .finance-filters{
    grid-template-columns:minmax(0,1fr) !important;
    overflow:hidden !important;
  }

  .finance-filters input,
  .finance-filters select,
  .finance-filters button,
  .finance-filters input[type="date"]{
    width:100% !important;
    max-width:100% !important;
    max-inline-size:100% !important;
    min-width:0 !important;
    min-inline-size:0 !important;
    box-sizing:border-box !important;
  }

  .finance-filters.is-custom-period input[type="date"]{
    display:block !important;
    width:calc(100% - 96px) !important;
    max-width:calc(100% - 96px) !important;
    inline-size:calc(100% - 96px) !important;
    max-inline-size:calc(100% - 96px) !important;
    overflow:hidden !important;
    justify-self:start !important;
    appearance:none !important;
    -webkit-appearance:none !important;
    background-clip:padding-box !important;
  }

  .finance-filters input[type="date"]::-webkit-date-and-time-value{
    min-width:0 !important;
    text-align:left !important;
  }

  .user-page-kicker,
  .user-page-subtitle{
    display:none !important;
  }

  .mab-balance-meta{
    white-space:normal;
  }
}

@media (max-width:760px){
  .user-main{
    padding:10px 8px 10px 10px !important;
  }

  .user-page-title{
    font-size:30px !important;
    line-height:1.05 !important;
  }

  .user-balance-link,
  .user-shell-balance-link,
  .balance-link{
    font-size:14px !important;
    white-space:nowrap !important;
  }
}

/* ── Toast-уведомления ─────────────────────────────────────────── */
.mab-toast-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none;max-width:380px;width:calc(100vw - 32px)}
.mab-toast{display:flex;align-items:flex-start;gap:10px;padding:14px 12px 14px 16px;border-radius:16px;box-shadow:0 8px 32px rgba(15,23,42,.18),0 2px 8px rgba(15,23,42,.10);background:#fff;border:1px solid #e5e7eb;pointer-events:all;opacity:0;transform:translateY(-10px);transition:opacity .24s ease,transform .24s ease;min-width:0}
.mab-toast.mab-toast-in{opacity:1;transform:translateY(0)}
.mab-toast.mab-toast-out{opacity:0;transform:translateY(-10px)}
.mab-toast-ok{border-left:4px solid #22c55e}
.mab-toast-err{border-left:4px solid #ef4444}
.mab-toast-warn{border-left:4px solid #f59e0b}
.mab-toast-info{border-left:4px solid #3b82f6}
.mab-toast-icon{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex:0 0 22px;margin-top:1px}
.mab-toast-ok .mab-toast-icon{background:#dcfce7;color:#15803d}
.mab-toast-err .mab-toast-icon{background:#fee2e2;color:#b91c1c}
.mab-toast-warn .mab-toast-icon{background:#fef9c3;color:#92400e}
.mab-toast-info .mab-toast-icon{background:#dbeafe;color:#1d4ed8}
.mab-toast-text{font-size:14px;color:#1e293b;line-height:1.5;flex:1;min-width:0;word-break:break-word;font-family:"Montserrat",system-ui,sans-serif}
.mab-toast-close{width:22px;height:22px;border:none;background:none;cursor:pointer;color:#94a3b8;font-size:14px;display:flex;align-items:center;justify-content:center;border-radius:7px;padding:0;flex:0 0 22px;transition:background .12s,color .12s;line-height:1}
.mab-toast-close:hover{background:#f1f5f9;color:#475569}
.mab-toast-progress{position:absolute;bottom:0;left:0;height:3px;border-radius:0 0 0 12px;background:currentColor;opacity:.25;animation:mab-toast-bar linear forwards}
@keyframes mab-toast-bar{from{width:100%}to{width:0}}
@media(max-width:520px){.mab-toast-container{width:calc(100vw - 32px)}}
