/* ===== mobile base (<=960px) ===== */
:root{ --tabbar-h: 58px; }
html,body{ max-width:100vw; overflow-x:hidden; }
*, *::before, *::after{ box-sizing:border-box; min-width:0 } /* flex-переполнения */

.app__wrap{ display:block !important; }
.sidebar{ display:none !important; }
.app__main{
  padding: 14px 12px calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 12px) 12px !important;
  min-width:0; max-width:100%;
}

/* карточки/surfaces */
.card{ border-radius:16px; padding:14px !important; max-width:100% }
.grid{ display:grid; gap:12px }
.grid--2{ grid-template-columns: 1fr !important; }

/* KPI компакт */
.kpi__value{ font-size:18px }
.kpi__label{ opacity:.85 }

/* Графики */
canvas{ max-height:220px !important; }

/* Таблицы -> карточки; убираем nowrap вообще */
.table{ width:100%; border-collapse:collapse; table-layout:fixed }
.table *{ white-space:normal !important; word-break:break-word }
.table thead{ display:none }
.table tr{ display:block; padding:10px 12px; margin:10px 0; border-radius:14px;
  background: rgba(0,0,0,.22); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.table td{ display:flex; justify-content:space-between; gap:12px; padding:6px 0; border:none }
.table td + td{ border-top:1px dashed rgba(255,255,255,.06) }
.table td > *{ max-width:66% } /* значение справа не вываливается */

/* Формы и строки */
.row{ flex-wrap:wrap; gap:10px }
.input, select, .btn, .chip{ width:100%; max-width:100% }
.btn, .chip{ min-height:42px }

/* Мобильный таб-бар (иконки) */
.mobbar{
  position:fixed; left:0; right:0; bottom:0; height:var(--tabbar-h);
  padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
  background: rgba(10,40,24,.9); border-top:1px solid rgba(255,255,255,.06);
  backdrop-filter: blur(12px); display:flex; gap:10px; z-index:1000;
  transform: translateZ(0); /* предотвращает субпиксельные полосы */
}
.mobbar__item{
  flex:1; display:flex; align-items:center; justify-content:center;
  color:#d9ffe3; text-decoration:none; opacity:.9;
}
.mobbar__item--active{ color: var(--accent-300); text-shadow:0 0 18px rgba(34,197,94,.35); opacity:1 }
.mobbar__icon svg{ display:block; width:24px; height:24px }

/* На всякий — скрываем возможные десктопные хедеры */
header.top:not(.app-top), .topbar, .navbar, .site-top{ display:none !important; }

/* ==== улучшения: таблицы -> карточки с подписями ==== */
.table{ width:100%; border-collapse:collapse; table-layout:fixed }
.table thead{ display:none }
.table tr{ display:block; padding:12px; margin:10px 0; border-radius:14px;
  background: rgba(0,0,0,.22); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.table td{ position:relative; display:flex; gap:10px; padding:8px 0; border:none }
.table td+td{ border-top:1px dashed rgba(255,255,255,.07) }
.table td::before{
  content: attr(data-label);
  flex:0 0 42%;
  max-width:42%;
  opacity:.65; font-size:12px; line-height:1.2;
}
.table td > *{ flex:1 1 58%; max-width:58%; min-width:0; white-space:normal; word-break:break-word }

/* Майнеры: кнопки-экшены делаем на всю ширину в одну строку */
.miner-actions{ display:flex; gap:10px; }
.miner-actions .btn{ flex:1 1 auto }

/* Сводка: число + °C не рвутся */
.temp-nowrap{ display:inline-flex; align-items:center; gap:4px; white-space:nowrap }
.temp-nowrap .unit{ opacity:.85 }

/* Профиль/суб-аккаунты: аккуратные блоки на мобиле */
.subacc-card{ padding:12px; border-radius:14px; background:rgba(0,0,0,.22);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); margin:10px 0; }
.subacc-card .row{ flex-wrap:wrap; gap:10px }
.subacc-card .input, .subacc-card select, .subacc-card .btn{ width:100%; max-width:100% }

/* --- FIX: чипы/пилюли не должны ломаться на 2 строки (t° и т.п.) --- */
@media (max-width: 768px){
  .chip{ white-space:nowrap; display:inline-flex; align-items:center; gap:.35rem; }
}

/* --- FIX: кнопки-столбики превращаем в аккуратную сетку --- */
@media (max-width: 768px){
  .btn{ min-width:auto; padding:.55rem .75rem; font-size:.9rem; }
  td.actions, .actions-compact{
    display:grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap:.5rem;
  }
  td.actions .btn, .actions-compact .btn{ width:100%; }
}

/* --- Таблица в карточки (универсально для .table) --- */
@media (max-width: 768px){
  .table{ display:block; width:100%; }
  .table thead{ display:none; }
  .table tbody{ display:block; }
  .table tbody tr{
    display:block;
    margin:.75rem 0;
    padding:.75rem;
    border-radius:14px;
    background: rgba(255,255,255,.03);
    box-shadow: 0 8px 30px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.05);
  }
  .table tbody tr td{
    display:block;
    width:100%;
    padding:.35rem 0 !important;
    border:0 !important;
    word-break: break-word;
  }
  /* подпись поля берём из data-label, её проставит JS ниже */
  .table tbody tr td[data-label]::before{
    content: attr(data-label);
    display:block;
    opacity:.75;
    font-size:.8rem;
    margin-bottom:.15rem;
  }
  /* последняя ячейка действий — сетка кнопок */
  .table tbody tr td:last-child{
    margin-top:.5rem;
  }
}

/* --- Мелкий штрих для «—°C», когда значения нет --- */
@media (max-width: 768px){
  .status, .kpi, .statline{ white-space:normal; }
  .status .pill, .statline .pill{ white-space:nowrap; }
}
/* ===== mobile hardening ===== */
@media (max-width: 860px){

  /* Сводка: пилюли компактнее */
  .pill{ padding:6px 10px; font-size:14px; }

  /* Общие кнопки — плотнее, но не ломаются */
  .btn{ min-height:40px; padding:8px 12px; font-size:14px; }

  /* Табличные ячейки с кнопками: собираем в сетку 2×2 */
  td.actions, .actions-cell, .table td .actions{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(110px,1fr));
    gap:8px;
  }
  td.actions .btn, .actions-cell .btn, .table td .actions .btn{
    width:100%; text-align:center;
  }

  /* Если какой-то текст в таблицах всё равно лезет — режем до одной строки */
  .table td, .table th{ max-width: 280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

  /* Карточки в профиле не растягиваем — содержимое переносим */
  .card .row{ flex-wrap:wrap; }

}

/* === MH OVERRIDE: мобильный хедер и таб-бар в фиолетовой теме === */
.app-top{
  background: linear-gradient(180deg, rgba(27,20,48,.9), rgba(27,20,48,0));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.mobbar{
  background: rgba(27,20,48,.92);
  border-top:1px solid rgba(255,255,255,.08);
}
.mobbar__item--active{
  color:#fff;
  text-shadow:0 0 18px rgba(139,92,246,.35);
}

/* ==== MOBILE OVERRIDES ==== */
@media (max-width: 991.98px){
  /* Прячем десктоп-сайдбар */
  .sidebar, .leftbar, .desktop-sidebar{
    display: none !important;
  }
  /* Контент на всю ширину */
  .content, .page-content, .container{
    margin-left: 0 !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  /* Показываем мобильный нижний бар (если есть) */
  .mobile-nav, .mobile-bottom, .bottom-nav, #mobile-nav, #mobile-menu, .mbl-only{
    display: flex !important;
  }
}

/* На десктопе — мобильный бар всегда скрыт */
@media (min-width: 992px){
  .mobile-nav, .mobile-bottom, .bottom-nav, #mobile-nav, #mobile-menu, .mbl-only{
    display: none !important;
  }
}
/* === PROFILE: mobile tweaks === */
@media (max-width: 991.98px){
  .content ol > li{ padding-left: 42px; }
  .content ol > li .row{ grid-template-columns: 1fr; }
  .content .btn{ padding: 10px 14px; }
}

/* === MOBILE FIX (hide desktop sidebar, purple accents) === */
@media (max-width: 991.98px){
  .layout__sidebar{ display:none !important; }   /* прячем сайдбар */
  .app__main{ padding-left:0 !important; }      /* контент на всю ширину */
  .top{ padding-left:16px; }                     /* чутка воздуха слева */
}
/* нижняя моб.-навигация — фиолетовые акценты */
.mobbar .item.active,
.mobile-nav .item.active{
  background: linear-gradient(180deg,#6c5ce7,#5748c8) !important;
  border-color:#6c5ce7 !important;
  box-shadow:0 6px 24px rgba(108,92,231,.35) !important;
}

/* === HARD MOBILE HIDE (\20250825-024534) ========================================== */
@media (max-width: 991.98px){
  /* любые варианты сайдбара */
  aside.sidebar, .sidebar, .layout__sidebar, .leftbar, #sidebar{
    display:none !important;
  }

  /* контейнер под контент — на всю ширину */
  .layout, .app__wrap, .app__main, .layout__content, .content, .container{
    grid-template-columns: 1fr !important;
    margin-left:0 !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }
}

/* ===== PROFILE mobile miners fix (20250825-024807) ===================== */
@media (max-width: 991.98px){
  body.page-profile .content > :last-child,
  body.page-profile .miners-raw{
    background: var(--mh-card, #141423);
    border:1px solid var(--mh-outline, #2c2e40);
    border-radius:14px;
    padding:14px 14px;
    line-height:1.35;
    white-space: pre-line;
    columns: 1 !important;
  }
}