/* ═══ 21.10.2026 v8: подвал кабинета = ТОЧНЫЕ замеры /docs/ ═══

ЭТАЛОН (замерено):
  .doc-brand-foot : display grid, padding 0 24px, margin 0 140px 24px, height 60
                    лого span: 18px/18px, затем <p> 15px/25.92px
  .doc-foot       : display FLEX, gap 16px, padding 24px, border-top 1px,
                    height 71 (= 24 + 22 + 24 + 1), два span в ОДНОЙ строке, 13px/22.1px

ОШИБКА v7: подвал был display:block → два span переносились на две строки
→ высота 93 вместо 71 и страница вылезала на 38px.
*/

html, body { min-height: 100%; }

#app {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

#app > main {
  flex: 1 0 auto;
  padding-bottom: 0;
  margin-bottom: 0;
}

#app > .cb-foot-wrap {
  flex: 0 0 auto;
  margin-top: auto;
  width: 100%;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  box-sizing: border-box;
  text-align: left;
}

/* ── бренд: grid как на /docs/ ── */
.cb-foot-wrap .doc-brand-foot {
  display: grid;
  grid-template-columns: 1fr;
  align-content: center;
  padding: 0 24px;
  margin: 0 0 24px;
  height: 60px;
  text-align: left;
}

.cb-foot-wrap .doc-brand-foot .doc-brand-logo {
  display: block;
  font-size: 18px;
  font-weight: 700;
  line-height: 18px;
  color: #ececf5;
  margin: 0;
}

.cb-foot-wrap .doc-brand-foot .doc-brand-logo span { color: #f97316; }

.cb-foot-wrap .doc-brand-foot p {
  margin: 0;
  padding: 0;
  font-size: 15px;
  line-height: 25.92px;
  color: #ececf5;
}

/* ── подвал: FLEX + gap 16px, два span в одной строке → высота 71 ── */
.cb-foot-wrap .cb-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  padding: 24px;
  margin: 0;
  border-top: 1px solid #262636;
  font-size: 13px;
  line-height: 22.1px;
  color: #9a9ab4;
  text-align: left;
  box-sizing: border-box;
}

.cb-foot-wrap .cb-foot > span {
  display: block;
  margin: 0;
  padding: 0;
  font-size: 13px;
  line-height: 22.1px;
  color: #9a9ab4;
}

/* старое правило .ft не должно влиять */
#app > footer.ft { display: none; }

/* ── блок $0.10: статус зелёный ── */
#demoStatusLine { color: #3fbf7f !important; }
#demoStatusLine.is-used { color: #9a9ab8 !important; }

@media (max-width: 640px) {
  .cb-foot-wrap .doc-brand-foot { padding: 0 20px; height: auto; }
  .cb-foot-wrap .cb-foot { padding: 20px; gap: 10px; }
}
/* 21.10.2026 v9: убираем последние 17px переполнения.
   Секция .screen имеет padding-bottom:70px — из-за него body = 1097 при viewport 1080.
   Подвал уже прижат через flex, поэтому нижний padding секции можно уменьшить. */
#app > main > section.screen {
  padding-bottom: 53px;
}
@media (max-width: 640px) {
  #app > main > section.screen { padding-bottom: 30px; }
}
/* ═══ 21.10.2026: КАРТОЧКИ ТИПОВ ПРОКСИ (восстановлено) ═══
   Было потеряно: правила .px-types жили в cabinet-sticky-*.css, который я
   заменил на cabinet-foot-*.css при доводке подвала → карточки разъехались
   в столбик по 1072px (display:block, без сетки и рамок).
   Возвращаем: элегантная сетка 3 в ряд, цветные рамки по типу.
*/

.px-types {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin: 18px 0 20px;
}

.px-type {
  border: 1px solid #2a2a3e;
  border-radius: 13px;
  padding: 15px 16px;
  background: rgba(139, 92, 246, .05);
  display: block;
  box-sizing: border-box;
}

.px-type h4 {
  margin: 0 0 7px;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.px-type p {
  margin: 0 0 9px;
  font-size: 13px;
  line-height: 1.55;
  color: #9a9ab8;
}

.px-type ul {
  margin: 0;
  padding-left: 18px;
  font-size: 12.5px;
  line-height: 1.65;
  color: #9a9ab8;
}

.px-type ul li {
  margin-bottom: 2px;
}

.px-type .px-tag {
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid currentColor;
  opacity: .9;
  white-space: nowrap;
}

/* цветовые акценты по типу */
.px-type.is-v4 {
  border-color: rgba(139, 92, 246, .40);
  background: rgba(139, 92, 246, .07);
}
.px-type.is-v4 .px-tag { color: #a78bfa; }
.px-type.is-v4 h4 { color: #c4b5fd; }

.px-type.is-v6 {
  border-color: rgba(63, 191, 127, .40);
  background: rgba(63, 191, 127, .07);
}
.px-type.is-v6 .px-tag { color: #3fbf7f; }
.px-type.is-v6 h4 { color: #6ee7a8; }

.px-type.is-v3 {
  border-color: rgba(249, 115, 22, .40);
  background: rgba(249, 115, 22, .07);
}
.px-type.is-v3 .px-tag { color: #f97316; }
.px-type.is-v3 h4 { color: #fdba74; }

@media (max-width: 900px) {
  .px-types { grid-template-columns: 1fr; }
}
/* 21.10.2026: подвал — «Payments in USDC» СПРАВА, как на /docs/ и всех страницах проекта.
   Эталон: display flex, justify-content space-between, gap 16px,
   копирайт left 164, платежи right до 1236 при ширине 1120. */

#app > .cb-foot-wrap .cb-foot {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 24px;
  margin: 0;
  border-top: 1px solid #262636;
  font-size: 13px;
  line-height: 22.1px;
  color: #9a9ab4;
  text-align: left;
  box-sizing: border-box;
}

#app > .cb-foot-wrap .cb-foot > span {
  display: block;
  margin: 0;
  padding: 0;
  font-size: 13px;
  line-height: 22.1px;
  color: #9a9ab4;
  white-space: nowrap;
}

/* «link a wallet» — ссылка на вкладку Wallet */
#demoText a.js-goto-wallet {
  color: #a78bfa;
  text-decoration: underline;
  text-underline-offset: 2px;
}
#demoText a.js-goto-wallet:hover {
  color: #c4b5fd;
}

@media (max-width: 640px) {
  #app > .cb-foot-wrap .cb-foot {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 20px;
  }
}

/* 21.10.2026: убрать линию (подчёркивание) над итогами History */
.tbl-foot, #histFoot, div.tbl-foot.reveal {
  border-top: 0 !important;
  border-bottom: 0 !important;
  text-decoration: none !important;
  padding-top: 14px;
}
#histFoot span { text-decoration: none !important; border-bottom: 0 !important; }
#histTotalSum b { text-decoration: none !important; border-bottom: 0 !important; color: #ececf5; }
