/* === ORIGINAL STYLES (left intact) === */
body { background: #fff; color: #212529; }
.card { border-radius: 1rem; }
.card { background: #fff; border: 1px solid #dee2e6; }
.form-control, .form-select { background: #fff; color: #212529; border-color: #ced4da; }
.form-control:focus, .form-select:focus { border-color: #4f8cff; box-shadow: 0 0 0 .2rem rgba(79,140,255,.15); }
.btn-primary { background: #4f8cff; border-color: #4f8cff; }
.btn-outline-light { border-color: #ced4da; color:#212529; }
.btn-outline-light:hover { background:#f8f9fa; }
.dropzone { border:1px dashed #adb5bd; border-radius:.75rem; padding:1rem; text-align:center; cursor:pointer; background:#f8f9fa; transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease; }
.dropzone.is-invalid { border-color: var(--bs-danger); background: #fff; box-shadow: 0 0 0 .2rem rgba(220,53,69,.15); }
.thumb { position:relative; border:1px solid #dee2e6; border-radius:.5rem; overflow:hidden; }
.thumb img { width:100%; height:140px; object-fit:cover; }
.thumb .remove { position:absolute; right:.5rem; top:.5rem; }
.required::after { content:" *"; color:#dc3545; }
.brand-logo {
  max-height: 100px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
}
.tg-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;display:inline-block}
.tg-initials{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#e9ecef;font-weight:600;font-size:12px}
.tg-user{display:inline-flex;align-items:center;gap:.5rem}

/* прячем автодобавляемый блок профиля в форме, если JS его вставляет */
#form .tg-user { display: none !important; }

:root{
  --dark-gray-oldtrade:#333a42;
  --red-oldtrade:#df4346;
}

/* WPHeader / desktop top-bar (старый вариант — отключён)
header[itemtype="http://schema.org/WPHeader"] .top-bar{
  position:relative; overflow:hidden; min-height:2.3rem;
  background:var(--dark-gray-oldtrade); color:#fff; font-size:.8rem;
}
.top-bar-right_absolute{ position:absolute; top:0; bottom:0; right:0;
  display:flex; align-items:center; gap:.25rem; padding-right:.5rem; }
.top-bar__login-btn{ padding:0 .8rem; color:#fff; text-decoration:none; }
.top-bar__login-btn:hover{ color:#fff; text-decoration:underline; }
.top-bar__reg-btn{ height:100%; margin:0 -2px 0 0; font-size:.8rem;
  display:inline-flex; align-items:center; padding:0 .6rem;
  background:var(--red-oldtrade); color:#fff; border:0; border-radius:.25rem; text-decoration:none; }
*/

/* Foundation-like утилита */
@media (max-width:991.98px){ .show-for-large{ display:none!important; } }
@media (min-width:992px){ .show-for-large{ display:block!important; } }

/* MobileSearch стили (по мотивам _desktopSearch.scss) */
.search-block{ background:#fff; border-bottom:1px solid #d0d0d0; padding:.6rem; }
.search-block .input-group, .search-block .button-group{ margin:0; }
.search-tabs .nav-link{ border-radius:0; }

/* логотип */
.logo {
  height: 70px;
  width: auto;
  max-width: 100%;
}

/* темно-серая полоса шапки */
.top-bar {
  background-color: #353c43;
}
.top-bar a {
  color: #0d6efd; /* синий bootstrap primary */
}
.top-bar a:hover {
  text-decoration: underline;
}

/* кнопка Log in в верхней серой полосе */
.top-bar .btn-login{
  display:inline-block; 
/*  padding:.45rem 1rem;*/
  background:#0d6efd; color:#fff!important; border:0; border-radius:0;
  font-weight:500; line-height:1; text-decoration:none;
}
.top-bar .btn-login:hover{ background:#0b5ed7; color:#fff!important; text-decoration:none; }

/* цвет логина в top-bar (поверх bootstrap) */
.top-bar #topUser {
  color: #fff !important;     /* белый текст */
  font-weight: 500 !important;
}

/* === FIX: гарантируем, что блоки .show-for-large скрыты на мобилке === */
@media (max-width: 991.98px) {
  .show-for-large { display: none !important; }
}
@media (min-width: 992px) {
  .show-for-large { display: block !important; }
}

/* убрать скругления у чёрной шапки в моб версии полностью */
.navbar { --bs-navbar-border-radius: 0; border-radius: 0 !important; }
.navbar .container { border-radius: 0 !important; }

/* Фиксируем только мобильную шапку */
@media (max-width: 991.98px) {
  .navbar.navbar-dark.bg-dark.d-lg-none {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
  }
  /* добавляем отступ, чтобы контент не налезал */
  body { padding-top: 56px; } /* подгони под реальную высоту navbar */
}

/* Offcanvas: аватар в шапке меню */
.menu-avatar .avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: #e9ecef;
}

.menu-avatar .avatar-initials {
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 600;
  background: #e9ecef; color: #495057;
}

/* Десктопный сайдбар */
@media (min-width: 992px) {
  .sidebar-desktop {
    position: fixed;
    z-index: 1010;
    top: 92px; /* ← высота твоей верхней шапки (top-bar + белая полоса) */
    left: 0;
    bottom: 0;
    width: 240px;
    background: #fff;
    border-right: 1px solid #e9ecef;
    overflow-y: auto;
  }

  /* теперь body сдвигаем только влево, а сверху ничего не прибавляем */
  body { padding-left: 240px; }

  .sidebar-desktop .sd-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    border-bottom: 1px solid #eee;
  }

  .sd-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    background: #e9ecef;
  }

  .sd-avatar-initials {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    background: #e9ecef;
    color: #495057;
  }

  .sidebar-desktop .sd-nav .list-group-item {
    padding: .65rem 1rem;
    border: none;
    border-bottom: 1px solid #f1f3f5;
  }

  .sidebar-desktop .sd-nav .list-group-item i {
    width: 18px;
    text-align: center;
  }
}
/* === override: десктопный сайдбар под шапкой + отступ контента ===
   НИЧЕГО сверху не удаляем — просто перекрываем предыдущие значения */
@media (min-width: 992px) {
  .sidebar-desktop {
    top: 120px;           /* подгони под фактическую высоту твоей шапки */
  }
  body {
    padding-left: 240px;  /* как было */
    padding-top: 120px;   /* добавляем верхний отступ = высоте шапки */
  }
}
/* ==== desktop: сайдбар под шапкой, шапку не сдвигаем ==== */
@media (min-width: 992px) {
  :root { --header-h: 120px; } /* подгони под реальную высоту твоей шапки */

  /* сайдбар стартует строго под шапкой */
  .sidebar-desktop { top: var(--header-h); }

  /* шапку НЕ двигаем: body без верхнего отступа */
  body { padding-top: 0; padding-left: 240px; }

  /* двигаем вниз именно контент страницы */
  main { padding-top: var(--header-h); }
}

/* ==== DESKTOP: шапка поверх всего, сайдбар под ней (окончательный оверрайд) ==== */
@media (min-width: 992px) {
  /* фактическая суммарная высота твоей шапки (серая полоса + белая строка) */
  :root { --header-h: 136px; } /* ← при необходимости подстрой: 128–140px */

  /* фиксируем шапку поверх сайдбара и контента */
  header[itemtype="http://schema.org/WPHeader"] {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1200; /* больше, чем у .sidebar-desktop */
  }

  /* сайдбар стартует строго под шапкой и ниже по z-index */
  .sidebar-desktop {
    top: var(--header-h);
    z-index: 1100;
  }

  /* шапку НЕ двигаем: body без верхнего отступа,
     левый отступ — ширина сайдбара */
  body {
    padding-left: 240px;
    padding-top: 0;
  }

  /* двигаем вниз только контент страницы */
  main {
    padding-top: var(--header-h) !important;
  }
}
/* ==== DESKTOP FIX: контент всегда ниже фикс-шапки ==== */
@media (min-width: 992px) {
  /* подстрой при необходимости — это суммарная высота серой полосы + белой строки */
  :root { --header-h: 105px; }

  /* шапка фиксирована поверх всего */
  header[itemtype="http://schema.org/WPHeader"] {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1200;
  }

  /* сайдбар ровно под шапкой */
  .sidebar-desktop {
    top: var(--header-h);
    z-index: 1100;
  }

/* === FONT WEIGHT (DESKTOP): базово 200 для всех, 600 только для верхнего уровня === */
.sidebar-desktop .sd-nav .list-group-item {
  font-weight: 200;                            /* подпункты сразу 200 — без мигалки */
  transition: color .15s, background-color .15s !important; /* убираем анимацию веса */
}

.sidebar-desktop .sd-nav > .list-group-item {
  font-weight: 400;                            /* жирный только верхний уровень */
}

  /* двигаем вниз именно контент страницы */
  main {
    margin-top: var(--header-h) !important;
    padding-top: 0 !important; /* на случай, если где-то было задано другое */
  }
}

/* Фолбэк на случай, если переменные вдруг не применятся */
@supports not (margin-top: var(--header-h)) {
  @media (min-width: 992px) {
    main { margin-top: 160px !important; }
  }
}
/* ==== Mobile offcanvas: черные пункты меню ==== */
#offcanvasMenu .list-group-item a,
#offcanvasMenu .list-group-item button.btn-link {
  color: #212529 !important;             /* текст пунктов */
  text-decoration: none;
}
/* === FONT WEIGHT (MOBILE): базово 200 для всех, 600 только для верхнего уровня === */
#offcanvasMenu .sd-nav .list-group-item {
  font-weight: 200;                            /* подпункты сразу 200 — без мигалки */
  transition: color .15s, background-color .15s !important; /* не анимируем font-weight */
}

#offcanvasMenu .sd-nav > .list-group-item {
  font-weight: 400;                            /* жирный только верхний уровень */
}
#offcanvasMenu .list-group-item i {
  color: #212529 !important;             /* иконки FontAwesome */
}

/* :hover / :focus — легкая подсветка фона, без синего */
#offcanvasMenu .list-group-item a:hover,
#offcanvasMenu .list-group-item a:focus,
#offcanvasMenu .list-group-item button.btn-link:hover,
#offcanvasMenu .list-group-item button.btn-link:focus {
  background: #f8f9fa;
  color: #212529 !important;
  text-decoration: none;
}

/* Не трогаем красный пункт «Выйти» */
#offcanvasMenu .list-group-item .text-danger,
#offcanvasMenu .list-group-item .text-danger i {
  color: #dc3545 !important;
}
/* === статус "Online" всегда зелёный === */
#sideUserSub,
#deskUserSub {
  color: #28a745 !important; /* зелёный Bootstrap */
  font-weight: 500;
}


/* выравниваем шапку с учётом фикс-сайдбара на десктопе */
@media (min-width: 992px){
  :root { --sidebar-w: 240px; }

  /* серая верхняя полоса */
  header[itemtype="http://schema.org/WPHeader"] .top-bar .container{
    max-width: 100%;
    padding-left: calc(var(--sidebar-w) + 1rem); /* 1rem — внутренний отступ как у .container */
    padding-right: 1rem;
  }

  /* белая строка с логотипом/поиском/кнопкой */
  header[itemtype="http://schema.org/WPHeader"] .bg-white .container{
    max-width: 100%;
    padding-left: calc(var(--sidebar-w) + 1rem);
    padding-right: 1rem;
  }
}

/* === FORCE FIX: шапка над всем, сайдбар под шапкой, контент ниже === */
@media (min-width: 992px){
  :root { --sidebar-w: 240px; --header-h: 120px; } /* подгони высоту при необходимости */

  header[itemtype="http://schema.org/WPHeader"]{
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 1200 !important;
    background:#fff;
  }

  .sidebar-desktop{
    position: fixed !important;
    top: var(--header-h) !important;
    left: 0; bottom: 0;
    width: var(--sidebar-w);
    z-index: 1100 !important;
    background:#fff;
  }

  main{ margin-top: var(--header-h) !important; }
  body{ padding-left: var(--sidebar-w) !important; }

  header[itemtype="http://schema.org/WPHeader"] .top-bar .container,
  header[itemtype="http://schema.org/WPHeader"] .bg-white .container{
    max-width: 100% !important;
    padding-left: calc(var(--sidebar-w) + 1rem) !important;
    padding-right: 1rem !important;
  }
}
/* ==== DESKTOP: логотип ровно у левого края шапки ==== */
@media (min-width: 992px){
  :root{ --sidebar-w: 240px; --header-pad: 1rem; }

  header[itemtype="http://schema.org/WPHeader"] .bg-white .row > [class*="col-"]:first-child{
    margin-left: calc(-1 * (var(--sidebar-w) + var(--header-pad)));
  }
}

/* === DYNAMIC HEADER (резиновая высота) — НЕ ЛОМАЕТ СТАРОЕ, а перекрывает === */
@media (min-width: 992px){
  header[itemtype="http://schema.org/WPHeader"]{
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 1300 !important; /* чуть выше, чтобы наверняка */
  }
  .sidebar-desktop{
    top: var(--header-h) !important;
  }
  main{
    margin-top: var(--header-h) !important; /* контент ниже шапки */
  }
}
/* Окрашиваю фразу "Для публикаций авторизация обязательна" в красный цвет */
#authHint {
  color: red !important;
  font-weight: 500; /* по желанию — сделать чуть жирнее */
}

/* Каталог — мегаменю (десктоп) */
#catMega { max-height: 70vh; overflow: hidden; }
#catMega .list-unstyled > li > a { display:block; padding:.25rem .5rem; border-radius:.5rem; }
#catMega .list-unstyled > li > a:hover { background:#f8f9fa; }

/* На мобилке мегаменю не показываем */
@media (max-width: 991.98px){
  #catalogRoot > .dropdown-menu { display:none !important; }
}

#catalogPanelMobile { width: 100%; }

/* === MOBILE SIDEBAR FIX === */
@media (max-width: 991.98px){
  #offcanvasMenu .sd-header{
    display:flex; align-items:center; gap:.75rem;
  }
  .sd-avatar,
  .sd-avatar-initials{
    width:48px; height:48px;
    border-radius:50%;
    object-fit:cover;
    display:block;
    background:#e9ecef;
  }
  .sd-avatar-initials{
    display:flex; align-items:center; justify-content:center;
    font-weight:600;
    color:#495057;
  }
  #mobUserSub{
    color:#28a745 !important;
    font-weight:500;
  }
}

/* === OFFCANVAS (MOBILE) FINAL SPACING FIX === */
@media (max-width: 991.98px){
  #offcanvasMenu .offcanvas-body{
    display: flex;
    flex-direction: column;
    padding: 0 !important;
    gap: 0 !important;
  }
  #offcanvasMenu .offcanvas-body > *{ margin: 0 !important; }
  #offcanvasMenu .sd-header{ flex: 0 0 auto; }
  #offcanvasMenu .sd-nav{ flex: 0 0 auto; margin-top: 0 !important; }
  #offcanvasMenu .mt-auto, #offcanvasMenu .spacer{ margin-top: 0 !important; }
  #offcanvasMenu .list-group{ margin: 0 !important; }
  #offcanvasMenu .list-group-item{ margin: 0 !important; }
}
/* Показываем/скрываем элементы по auth-состоянию */
[data-auth="in"]  .auth-out { display: none !important; }
[data-auth="out"] .auth-in  { display: none !important; }

/* Сайдбар статичен на ≥lg */
@media (min-width: 992px) {
  #offcanvasMenu.offcanvas-lg {
    position: static !important;
    visibility: visible !important;
    transform: none !important;
    display: block !important;
  }
  .offcanvas-backdrop { display: none !important; }
  .sidebar-desktop { width: 280px; }
}

/* при необходимости — отступ основного контента */
@media (min-width: 992px) {
  .main-with-sidebar { margin-left: 280px; }
}

/* ============================================================
   FINAL OVERRIDES (mobile/desktop fixes)
   ============================================================ */

/* Общие переменные под реальную высоту шапки и ширину сайдбара */
:root{
  --header-h: 120px;   /* подстрой при необходимости */
  --sidebar-w: 280px;
}

/* --- MOBILE: убираем дефолтные отступы и растягиваем navbar на всю ширину --- */
html, body { height: 100%; }
body { margin: 0 !important; }                 /* убираем 8px браузера */

@media (max-width: 991.98px){
  /* гасим утилиту pt-5 на body, если она где-то прилипла */
  body.pt-5{ padding-top: 0 !important; }

  /* контейнер у navbar без внутренних полей/гаттеров */
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-fluid,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-sm,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-md,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-lg,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-xl,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-xxl{
    --bs-gutter-x: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* сама тёмная полоса — sticky, поверх контента */
  header[itemtype="http://schema.org/WPHeader"] .navbar{
    position: sticky !important;
    top: 0;
    z-index: 1030;
  }
}

/* --- DESKTOP: фиксируем шапку/сайдбар, контент ниже шапки и справа от сайдбара --- */
@media (min-width: 992px){
  header[itemtype="http://schema.org/WPHeader"]{
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 1300 !important;
    background: #fff;
  }
  .sidebar-desktop{
    position: fixed !important;
    top: var(--header-h) !important;
    left: 0; bottom: 0;
    width: var(--sidebar-w) !important;
    z-index: 1100 !important;
    background:#fff;
    overflow-y: auto;
  }
  body{
    padding-left: var(--sidebar-w) !important;
    padding-top: 0 !important;
  }
  main{
    margin-top: var(--header-h) !important;
    padding-top: 0 !important;
    min-width: 0;
  }
  /* выравниваем контейнеры шапки с учётом сайдбара */
  header[itemtype="http://schema.org/WPHeader"] .top-bar .container,
  header[itemtype="http://schema.org/WPHeader"] .bg-white .container{
    max-width: 100% !important;
    padding-left: calc(var(--sidebar-w) + 1rem) !important;
    padding-right: 1rem !important;
  }
}
/* ===== MOBILE ULTRA-SAFE APPEND (≤991.98px) ===== */
@media (max-width: 991.98px){

  /* убираем дефолтные отступы и «pt-5», даже если где-то переопределено */
  html, body { margin:0 !important; padding:0 !important; height:100%; }
  html body.pt-5 { padding-top: 0 !important; }

  /* чёрная шапка без боковых гаттеров, на всю ширину */
  header[itemtype="http://schema.org/WPHeader"] .navbar{
    position: fixed !important;
    top: 0; left: 0; right: 0;
    z-index: 1050;
    width: 100%;
  }
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-sm,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-md,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-lg,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-xl,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-xxl,
  header[itemtype="http://schema.org/WPHeader"] .navbar > .container-fluid{
    --bs-gutter-x: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* контент строго под шапкой (56px — типовая высота navbar) */
  main#content { margin-top: 56px !important; }

  /* гасим верхний внутренний отступ/маргин у первого контейнера в main */
  main#content > .container-xxl.py-3 { padding-top: 29px !important; }

  /* на случай, если где-то стоит общий .py-3 сверху в main */
  main#content :is(.py-3, .pt-3) { padding-top: 0 !important; }
}

main.container {
  margin-top: 80px; /* или подгони под точную высоту шапки */
}

/* === spacer под фикс-шапку (чтобы main не залезал под header) === */
#header-spacer { height: 56px; } /* мобайл */
@media (min-width: 992px) {
  #header-spacer { height: 43px; } /* десктоп */
}

/* === финальный блок отступов под контент === */
main,
main.container,
main#content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}



/* по умолчанию без отступа (для ЛК и т.п.) */
main:not(#app-content) {
  margin-top: 30px !important;
  padding-top: 0 !important;
}

/* а для страницы создания запроса добавляем отступ */
body.page-create main:not(#app-content) {
  margin-top: 80px !important;
}

.text-muted.small {
  text-align: center;
  margin-top: 6px;
}

/* === MOBILE: выезжающий поиск из-под мобильного header === */

/* точная высота мобильной шапки */
:root { --header-h: 56px; }               /* если другая — подставь свою */

/* сам мобильный header всегда выше шторки */
.navbar.navbar-dark.bg-dark.d-lg-none {
  position: fixed;                         /* если уже fixed — ок */
  top: 0; left: 0; right: 0;
  z-index: 1300;                           /* ВЫШЕ шторки */
}

.container.py-3.search-block {
  position: fixed;
  top: var(--header-h);
  left: 0; right: 0;
  z-index: 1200;
  max-width: none !important;
  width: 100vw !important;
  margin: 0 !important;
  background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
  padding-top: 6rem !important;
}

/* на всякий: чтобы поля не прилипали к краю */
.container.py-3.search-block .form-control,
.container.py-3.search-block .btn { 
  /* твои стандартные отступы остаются */
}

/* === FIX: точный сдвиг только для выезжающего поиска === */
@media (max-width: 991.98px){
  main#content .search-block.py-3{
    padding-top: 85px !important; /* выезд ровно на высоту шапки */
  }
}
@media (max-width: 991.98px) {
  /* убираем внутренние отступы у основного контента */
  main#content :is(.py-3, .pt-3) {
    padding-top: 8px !important;
  }
}
/* === MOBILE: offcanvas-меню под шапкой === */
@media (max-width: 991.98px){
  :root { --mob-header-h: 70px; } /* высота твоей мобильной шапки */

  /* само меню начинаетcя ровно под шапкой */
  #offcanvasMenu.offcanvas.offcanvas-start{
    top: var(--mob-header-h) !important;
    height: calc(100vh - var(--mob-header-h)) !important;
    /* z-index ниже шапки, но выше контента */
    z-index: 1250 !important;
  }

  /* тёмный фон тоже от нижнего края шапки */
  body:has(#offcanvasMenu.show) .offcanvas-backdrop.show{
    top: var(--mob-header-h) !important;
    height: calc(100vh - var(--mob-header-h)) !important;
    z-index: 1240 !important;
  }

  /* (удалено) — не добавляем внутренний padding-top у .sd-header,
     чтобы не было двойного сдвига аватара */
}

/* === PAGE: balance — фикс отступа под шапку === */
@media (min-width: 992px){
  body.page-balance main#app-content {
    margin-top: var(--header-h) !important;  /* перекрываем общий reset */
    padding-top: 0 !important;
  }
}

/* На мобилке у баланса отступ равен высоте шапки */
@media (max-width: 991.98px){
  body.page-balance main#app-content {
    margin-top: var(--mob-header-h, 56px) !important; /* у тебя --mob-header-h уже задан (=70px); если нет — 56px */
    padding-top: 0 !important;
  }
}
/* Синий только для иконки "Избранное" в меню */
#mobMenuWishlist i.fa,
#deskMenuWishlist i.fa {
  color: #2196F3 !important; /* var(--bs-primary) по умолчанию */
}

/* Активная кнопка периода — как btn-primary */
#po-billing .btn.btn-primary {
  background-color: #0d6efd; /* var(--bs-primary) */
  border-color: #0d6efd;
  color: #fff;
}

/* Неактивные — outline */
#po-billing .btn.btn-outline-secondary {
  background-color: #fff;
  border-color: #ced4da;
  color: #212529;
}

/* === Отступ под фикс-шапку (адаптивно) === */

/* По умолчанию (десктоп ≥992px) */
main:not(#app-content) {
  margin-top: 70px !important;
  padding-top: 0 !important;
}

/* Мобильная версия (<992px): больше отступ, чтобы хлебные крошки не залезали под шапку */
@media (max-width: 991.98px) {
  main:not(#app-content) {
    margin-top: 90px !important;
  }
}

/* Заголовки H1 в катагориях - Только для заголовка на страницах категорий */
.page-category h1.mb-3 {
  font-size: 1rem;     /* ← нужный тебе размер, например 32px */
  font-weight: 500;    /* можно тоньше или толще */
}
/* Категории: 2 карточки в ряд на мобильных */
@media (max-width: 767.98px) {
  .page-category .tef-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .5rem !important;
  }
}

/* Очень узкие экраны — вернём 1 колонку, чтобы не ломалось */
@media (max-width: 360px) {
  .page-category .tef-cards {
    grid-template-columns: 1fr !important;
  }
}

.tefact-footer {
  background: #2f3437;
}
.tefact-footer a:hover {
  color: #fff;
  text-decoration: underline;
}

/* === FOOTER layout fix === */
.tefact-footer {
  background-color: #2f3437;
  color: #ccc;
  padding: 1.5rem 0;
  text-align: center;
  margin-top: auto; /* прижимает к низу при коротком контенте */
}

/* не даём ему наезжать на секции с фоном */
main, #app-content {
  position: relative;
  z-index: 2;
}

/* если есть тёмный хедер (как в профиле) — отступ снизу */
body:has(.profile-header),
.page-user,
.page-balance,
.page-favorite {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.page-user main {
  flex: 1 0 auto;
}

.tefact-footer {
  flex-shrink: 0;
  z-index: 1;
}
/*СТРАНИЦА БАЛАНСА*/

  .sub-info-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 12px 16px;
  }

  .sub-divider {
    border-left: 1px solid #e5e5e5;
    height: 40px;
    margin: auto 0;
  }

  @media (max-width: 767.98px) {
    .sub-divider {
      display: none; /* на мобилке без вертикального разделителя */
    }
  }

  /* История оплат */
.tef-payments-table thead th {
  font-size: 0.95rem;
}

.tef-payments-table tbody tr + tr {
  border-top: 1px solid var(--bs-border-color, #e5e5e5); /* тонкая серая линия как в примере */
}

.payment-card-logo {
  width: 32px;
  height: 24px;
  object-fit: contain;
  display: inline-block;
}

/* Кнопка «Показать ещё» — как лёгкая «плашка» */
.tef-payments-more {
  border: 1px solid var(--bs-border-color, #e5e5e5);
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

/* === Подписка: три колонки с вертикальными разделителями === */
.sub-info {
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 768px) {
  .sub-info + .sub-info {
    border-left: 1px solid var(--bs-border-color, #e5e5e5);
  }
}