/* beverly — интерфейс /card и /dashboard поверх оболочки клона */
:root {
  --bev-line: rgba(255, 255, 255, 0.12);
  --bev-line-strong: rgba(255, 255, 255, 0.24);
  --bev-panel: rgba(10, 10, 12, 0.62);
  --bev-panel-solid: #0a0a0c;
  --bev-text: rgba(255, 255, 255, 0.92);
  --bev-muted: rgba(255, 255, 255, 0.5);
  --bev-dim: rgba(255, 255, 255, 0.34);
  --bev-accent: #8898e7;
  --bev-ok: #6ee7a8;
  --bev-bad: #ff7a7a;
  --bev-mono: "PP Supply Sans", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --bev-sans: "Fellix", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.bev-app-holder {
  grid-column: 1 / -1;
  width: 100%;
  display: flex;
  justify-content: center;
}

.bev-app {
  width: 100%;
  max-width: 1080px;
  font-family: var(--bev-sans);
  color: var(--bev-text);
  position: relative;
  z-index: 2;
}

.bev-boot { color: var(--bev-dim); font-family: var(--bev-mono); font-size: 12px;
  letter-spacing: .12em; text-transform: uppercase; padding: 2rem 0; }

.bev-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1.25rem; align-items: start; }
@media (max-width: 991px) { .bev-grid { grid-template-columns: 1fr; } }

.bev-card {
  border: 1px solid var(--bev-line);
  border-radius: 18px;
  background: var(--bev-panel);
  backdrop-filter: blur(14px);
  padding: 1.6rem;
}
.bev-card + .bev-card { margin-top: 1rem; }

.bev-label {
  font-family: var(--bev-mono); font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--bev-dim); display: block; margin-bottom: .7rem;
}
.bev-h { font-size: 1.35rem; line-height: 1.15; margin: 0 0 .5rem; font-weight: 400; letter-spacing: -.01em; }
.bev-p { color: var(--bev-muted); font-size: .92rem; line-height: 1.55; margin: 0; }
.bev-p + .bev-p { margin-top: .6rem; }

/* кнопки */
.bev-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .78rem 1.35rem; border-radius: 999px; border: 1px solid #fff; background: #fff;
  color: #08080a; font-family: var(--bev-sans); font-size: .9rem; font-weight: 500;
  cursor: pointer; transition: opacity .2s, transform .2s; text-decoration: none;
}
.bev-btn:hover { opacity: .88; }
.bev-btn:disabled { opacity: .4; cursor: default; }
.bev-btn.is-ghost { background: transparent; color: var(--bev-text); border-color: var(--bev-line-strong); }
.bev-btn.is-ghost:hover { border-color: #fff; }
.bev-btn.is-wide { width: 100%; }

.bev-row { display: flex; flex-wrap: wrap; gap: .6rem; }
.bev-row.is-tight { gap: .4rem; }

/* выбираемые плитки */
.bev-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: .55rem; }
.bev-tile {
  text-align: left; padding: .7rem .8rem; border-radius: 13px; border: 1px solid var(--bev-line);
  background: rgba(255, 255, 255, .03); color: var(--bev-text); cursor: pointer;
  transition: border-color .2s, background .2s; font-family: var(--bev-sans);
}
.bev-tile:hover { border-color: var(--bev-line-strong); }
.bev-tile.is-on { border-color: #fff; background: #fff; color: #08080a; }
.bev-tile.is-off { opacity: .35; cursor: default; }
.bev-tile b { display: block; font-size: .95rem; font-weight: 500; }
.bev-tile span { display: block; font-size: .74rem; margin-top: .18rem; color: inherit; opacity: .62; }

.bev-group + .bev-group { margin-top: 1.1rem; }
.bev-group-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; margin-bottom: .55rem; }
.bev-group-head span { font-size: .78rem; color: var(--bev-dim); }

/* поле ввода */
.bev-input {
  width: 100%; padding: .8rem .9rem; border-radius: 12px; border: 1px solid var(--bev-line);
  background: rgba(0, 0, 0, .45); color: var(--bev-text); font-family: var(--bev-mono);
  font-size: 1rem; outline: none;
}
.bev-input:focus { border-color: var(--bev-accent); }

/* сводка */
.bev-sum { display: flex; flex-direction: column; gap: .55rem; }
.bev-sum-line { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; font-size: .9rem; }
.bev-sum-line span { color: var(--bev-muted); }
.bev-sum-line b { font-weight: 500; font-family: var(--bev-mono); font-size: .88rem; }
.bev-sum-total { border-top: 1px solid var(--bev-line); padding-top: .7rem; margin-top: .3rem; }
.bev-sum-total b { font-size: 1.05rem; }

/* сообщения */
.bev-note { border-radius: 14px; border: 1px solid var(--bev-line); padding: .85rem 1rem;
  font-size: .88rem; line-height: 1.5; color: var(--bev-muted); }
.bev-note.is-bad { border-color: rgba(255, 122, 122, .32); background: rgba(255, 60, 60, .08); color: #ffd9d9; }
.bev-note.is-ok { border-color: rgba(110, 231, 168, .32); background: rgba(70, 220, 140, .08); color: #d6ffe9; }
.bev-note.is-busy { border-color: var(--bev-line-strong); }
.bev-note + .bev-note, .bev-note + .bev-row, .bev-row + .bev-note { margin-top: .8rem; }

.bev-spinner {
  width: 13px; height: 13px; border-radius: 50%; display: inline-block; vertical-align: -1px;
  border: 1.5px solid rgba(255, 255, 255, .28); border-top-color: #fff; margin-right: .5rem;
  animation: bev-spin .7s linear infinite;
}
@keyframes bev-spin { to { transform: rotate(360deg); } }

/* пластик */
.bev-plastic {
  position: relative; border-radius: 18px; padding: 1.3rem; overflow: hidden;
  border: 1px solid var(--bev-line-strong);
  background: linear-gradient(145deg, rgba(136, 152, 231, .22), rgba(10, 10, 14, .9) 60%);
  min-height: 176px; display: flex; flex-direction: column; justify-content: space-between;
}
.bev-plastic::after {
  content: ""; position: absolute; right: -40px; top: -60px; width: 190px; height: 190px;
  border-radius: 50%; background: rgba(136, 152, 231, .18); filter: blur(42px); pointer-events: none;
}
.bev-plastic-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.bev-plastic-brand { font-size: 1rem; letter-spacing: .02em; }
.bev-plastic-chip { width: 34px; height: 25px; border-radius: 6px;
  background: linear-gradient(140deg, rgba(255, 255, 255, .8), rgba(255, 255, 255, .35)); opacity: .8; }
.bev-plastic-pan { font-family: var(--bev-mono); font-size: 1.06rem; letter-spacing: .1em; }
.bev-plastic-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.bev-plastic-foot small { display: block; font-family: var(--bev-mono); font-size: .66rem;
  letter-spacing: .12em; text-transform: uppercase; color: var(--bev-dim); margin-bottom: .2rem; }
.bev-plastic-foot div { font-family: var(--bev-mono); font-size: .84rem; }

/* список карт */
.bev-list { display: flex; flex-direction: column; gap: .5rem; }
.bev-list-item {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%;
  padding: .8rem .95rem; border-radius: 13px; border: 1px solid var(--bev-line);
  background: rgba(255, 255, 255, .03); color: var(--bev-text); cursor: pointer; text-align: left;
  font-family: var(--bev-sans); transition: border-color .2s;
}
.bev-list-item:hover { border-color: var(--bev-line-strong); }
.bev-list-item.is-on { border-color: #fff; }
.bev-list-item b { font-family: var(--bev-mono); font-weight: 400; font-size: .9rem; }
.bev-list-item span { color: var(--bev-muted); font-size: .8rem; }

/* транзакции */
.bev-tx { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .75rem 0; border-bottom: 1px solid var(--bev-line); font-size: .88rem; }
.bev-tx:last-child { border-bottom: 0; }
.bev-tx small { display: block; color: var(--bev-dim); font-size: .74rem; margin-top: .16rem; }
.bev-tx b { font-family: var(--bev-mono); font-weight: 400; }

.bev-foot-links { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; margin-top: 1rem; }
.bev-link { color: var(--bev-muted); font-size: .82rem; text-decoration: none; border-bottom: 1px solid transparent; }
.bev-link:hover { color: #fff; border-bottom-color: var(--bev-line-strong); }

.bev-wallet-tag { font-family: var(--bev-mono); font-size: .74rem; letter-spacing: .08em;
  text-transform: uppercase; color: var(--bev-dim); }

@media (max-width: 479px) {
  .bev-card { padding: 1.15rem; border-radius: 15px; }
  .bev-h { font-size: 1.18rem; }
  .bev-tiles { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
}

/* ── подгонка донорской секции под широкое приложение ─────────────── */
.login-section {
  min-height: 100vh;
  height: auto;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 11rem 1.5rem 5rem;
}
.login-section .global-grid.is-login,
.nav-wrapper > .global-grid.is-login {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  display: block;
}
@media (max-width: 767px) {
  .login-section { padding: 8.5rem 1rem 3.5rem; }
}

.login-section > .full-video.is-login {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
}
.login-section > .global-grid.is-login { z-index: 2; }
.login-section > .nav-wrapper { z-index: 100; }

/* ── шапка страниц приложения ─────────────────────────────────────── */
.bev-nav {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.6rem 2.5rem;
  padding-right: 16rem;   /* место под плашку контракта */
  z-index: 100;
}
.bev-nav__logo { display: block; width: 118px; color: #fff; }
.bev-nav__logo .main-logo { width: 100%; height: auto; display: block; }
.bev-nav__links { display: flex; align-items: center; gap: .45rem; }
.bev-nav__link {
  font-family: var(--bev-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(255, 255, 255, .62); text-decoration: none; padding: .55rem .9rem; border-radius: 999px;
  border: 1px solid transparent; transition: color .2s, border-color .2s;
}
.bev-nav__link:hover { color: #fff; border-color: var(--bev-line-strong); }
.bev-nav__link.is-on { color: #08080a; background: #fff; border-color: #fff; }
@media (max-width: 479px) {
  .bev-nav { padding: 1.1rem 1rem; gap: .75rem; padding-right: 1rem; flex-wrap: wrap;
    justify-content: flex-start; }
  .bev-nav__links { width: 100%; margin-top: 2.6rem; }
  .bev-nav__logo { width: 96px; }
  .bev-nav__link { padding: .45rem .65rem; font-size: 10px; letter-spacing: .1em; }
}

/* ── счётчик часов ────────────────────────────────────────────────── */
.bev-hours { display: flex; align-items: center; gap: .7rem; }
.bev-hours__btn {
  width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--bev-line);
  background: rgba(255, 255, 255, .04); color: var(--bev-text); font-size: 1.15rem;
  cursor: pointer; transition: border-color .2s, background .2s; line-height: 1;
}
.bev-hours__btn:hover { border-color: #fff; }
.bev-hours__out {
  min-width: 110px; text-align: center; font-family: var(--bev-mono);
  font-size: 1rem; letter-spacing: .04em;
}

/* ── чипы фильтров ────────────────────────────────────────────────── */
.bev-chip {
  padding: .45rem .85rem; border-radius: 999px; border: 1px solid var(--bev-line);
  background: rgba(255, 255, 255, .03); color: var(--bev-muted);
  font-family: var(--bev-mono); font-size: 10.5px; letter-spacing: .12em;
  text-transform: uppercase; cursor: pointer; transition: color .2s, border-color .2s, background .2s;
}
.bev-chip:hover { color: #fff; border-color: var(--bev-line-strong); }
.bev-chip.is-on { background: #fff; border-color: #fff; color: #08080a; }

/* ── таблицы ──────────────────────────────────────────────────────── */
.bev-table { display: flex; flex-direction: column; width: 100%; overflow-x: auto; }
.bev-table__head, .bev-table__row {
  display: grid; grid-template-columns: 1.1fr .9fr .7fr .8fr .8fr;
  gap: .8rem; align-items: center; padding: .72rem 0;
  border-bottom: 1px solid var(--bev-line); font-size: .88rem;
}
.bev-table__head {
  font-family: var(--bev-mono); font-size: 10.5px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--bev-dim); border-bottom-color: var(--bev-line-strong);
}
.bev-table__row span:last-child { font-family: var(--bev-mono); }
.bev-table__row.is-best { color: #fff; }
.bev-table__row.is-best em {
  font-style: normal; font-family: var(--bev-mono); font-size: 9.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--bev-accent); margin-left: .45rem;
}
.bev-table.is-two .bev-table__head, .bev-table.is-two .bev-table__row {
  grid-template-columns: 1.4fr 1fr;
}
.bev-table.is-tiers .bev-table__head, .bev-table.is-tiers .bev-table__row {
  grid-template-columns: 1.1fr 1fr 1fr 1.2fr;
}
.bev-table__row:last-child { border-bottom: 0; }
.bev-table span { color: var(--bev-muted); }
.bev-table__row span:first-child { color: var(--bev-text); }

@media (max-width: 767px) {
  .bev-table { font-size: .8rem; }
  .bev-table__head, .bev-table__row { gap: .5rem; padding: .62rem 0; }
  .bev-table.is-tiers { min-width: 520px; }
}

/* ── фирменный знак ───────────────────────────────────────────────── */
.bev-lockup { display: flex; align-items: center; gap: .5rem; width: 100%; }
.bev-mark {
  width: 26px; height: 26px; flex: 0 0 auto; display: block;
  background: currentColor;
  -webkit-mask: url("/assets/logo.png") no-repeat center / contain;
  mask: url("/assets/logo.png") no-repeat center / contain;
}
.bev-mark.is-loader { width: 20px; height: 20px; }
/* донорский футер светлый и красит вордмарк в чёрный — знак идёт за ним */
.footer-section .bev-mark { background: #000; }
/* шапка донора лежит на тёмном фоне, ссылка своего цвета не задаёт */
.nav-wrapper .bev-mark { background: #fff; }
.bev-mark.is-btn { width: 15px; height: 15px; }
.bev-lockup .main-logo { flex: 0 1 auto; max-width: 108px; }
.bev-lockup .loader-logo { flex: 0 1 auto; max-width: 72px; }
.bev-nav__logo { width: auto; }
@media (max-width: 479px) {
  .bev-mark { width: 22px; height: 22px; }
  .bev-lockup .main-logo { max-width: 92px; }
}
