/* ============================================================
   Empir.Fun — account.css
   Неоновый рескин legacy (Bootstrap 3) классов личного кабинета.
   ВСЕ правила scoped под body.neon-account — не влияют на
   публичные неоновые страницы.
   ============================================================ */

/* ---------- Layout ---------- */
.neon-account .container{padding-top:34px;padding-bottom:10px}
/* шапка: контейнер .nav не должен получать padding-top (иначе строка меню «проседает» вниз) */
.neon-account .site-header .container{padding-top:0;padding-bottom:0}
.neon-account #main{padding:28px 0 20px}
.neon-account .section{padding:0}
.neon-account .row{display:flex;flex-wrap:wrap;margin:0 -10px}
.neon-account .row>[class*="col-"]{padding:0 10px;width:100%}
.neon-account .col-sm-6,.neon-account .col-md-6,.neon-account .col-lg-6{width:50%}
.neon-account .col-sm-8,.neon-account .col-md-8{width:66.66%}
.neon-account .col-sm-12,.neon-account .col-md-12{width:100%}
.neon-account .col-sm-offset-2,.neon-account .col-md-offset-3{margin-left:0}
.neon-account .pull-left{float:left}
.neon-account .pull-right{float:right}
.neon-account .text-center{text-align:center}
.neon-account .clearfix::after{content:"";display:table;clear:both}
.neon-account hr{border:0;border-top:1px solid var(--border);margin:18px 0}
.neon-account .img-circle{border-radius:50%;vertical-align:middle}
.neon-account .text-success{color:var(--green)}
.neon-account .text-info{color:var(--cyan)}
.neon-account .text-muted{color:var(--muted)}

/* ---------- Auth card (login / register) ---------- */
.neon-account .user-page{text-align:center}
.neon-account .user-account{
  position:relative;max-width:460px;margin:0 auto;text-align:left;
  background:linear-gradient(180deg,var(--panel),var(--bg-2));
  border:1px solid var(--border-2);border-radius:22px;padding:36px 34px;
  box-shadow:0 30px 80px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.03);
}
.neon-account .user-account::before{
  content:"";position:absolute;inset:-1px;border-radius:22px;padding:1px;
  background:linear-gradient(120deg,rgba(0,229,255,.5),transparent 30%,transparent 70%,rgba(139,92,255,.5));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.6;
}
.neon-account .user-account h2{
  font-size:26px;font-weight:800;text-align:center;margin-bottom:24px;
  background:linear-gradient(90deg,var(--cyan),var(--purple));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.neon-account .user-account .alert{text-align:left}
.neon-account a.btn-primary{
  display:block;text-align:center;margin-top:22px;
  background:linear-gradient(135deg,var(--cyan),#22d3ee);color:#04121a;
  padding:15px;border-radius:12px;font-weight:700;font-size:16px;
  box-shadow:var(--glow-cyan);transition:filter .18s;
}
.neon-account a.btn-primary:hover{filter:brightness(1.08);color:#04121a}

/* ---------- Forms ---------- */
.neon-account .form-group{margin-bottom:16px}
.neon-account .form-group label{
  display:block;font-size:13px;font-weight:700;color:var(--muted);
  letter-spacing:.3px;margin-bottom:8px;
}
.neon-account .form-control,.neon-account .form-control.input-lg,.neon-account .form_style_1{
  width:100%;background:var(--bg-2);border:1px solid var(--border-2);color:var(--text);
  padding:14px 16px;border-radius:12px;font-size:16px;font-weight:600;font-family:var(--font);
  transition:border-color .18s, box-shadow .18s;outline:none;
}
.neon-account .form-control::placeholder{color:var(--muted-2)}
.neon-account .form-control:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,229,255,.15)}
.neon-account .input-group{display:flex;align-items:stretch}
.neon-account .input-group .form-control{border-radius:12px 0 0 12px;position:relative;z-index:2}
.neon-account .input-group-addon{
  display:flex;align-items:center;background:var(--panel-3);border:1px solid var(--border-2);
  border-right:0;border-radius:0 12px 12px 0;padding:0 16px;color:var(--muted);font-weight:700;
  font-family:var(--mono);white-space:nowrap;
}
.neon-account .checkbox{margin-bottom:10px}
.neon-account .checkbox label{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;font-size:14px;margin:0}
.neon-account .checkbox input[type="checkbox"]{width:18px;height:18px;accent-color:var(--cyan);cursor:pointer}
.neon-account .user-option{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;flex-wrap:wrap}
.neon-account .forgot-password a{color:var(--muted);font-size:14px}
.neon-account .forgot-password a:hover{color:var(--cyan)}

/* ---------- Buttons ---------- */
.neon-account .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:none;cursor:pointer;font-family:var(--font);font-weight:700;font-size:15px;
  padding:13px 22px;border-radius:12px;transition:transform .15s, filter .18s, box-shadow .18s;
  text-decoration:none;
}
.neon-account .btn:active{transform:translateY(1px)}
.neon-account .btn-primary{
  background:linear-gradient(135deg,var(--cyan),#22d3ee);color:#04121a;box-shadow:var(--glow-cyan);
}
/* Заголовки h3 с кнопками действий (wallet / testimonials / withdrawals):
   делаем flex-ряд — заголовок слева, кнопки справа.
   Legacy span.pull-right — это float, который сжимается до ширины САМОЙ
   ШИРОКОЙ кнопки, и остальные кнопки переносятся вниз (вертикальный столбец).
   Flex-контейнер + flex-ряд кнопок это исправляет. */
.neon-account h3{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.neon-account h3 .pull-right{float:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.neon-account h3 .btn{width:auto;margin-top:0}
.neon-account .btn-primary:hover{filter:brightness(1.08);color:#04121a}
.neon-account .btn-success{background:rgba(25,240,160,.14);border:1px solid rgba(25,240,160,.4);color:var(--green)}
.neon-account .btn-success:hover{background:rgba(25,240,160,.22)}
.neon-account .btn-danger{background:rgba(255,84,112,.14);border:1px solid rgba(255,84,112,.4);color:var(--red)}
.neon-account .btn-danger:hover{background:rgba(255,84,112,.22)}
.neon-account .btn-info{background:rgba(0,229,255,.12);border:1px solid rgba(0,229,255,.4);color:var(--cyan)}
.neon-account .btn-info:hover{background:rgba(0,229,255,.2)}
.neon-account .btn-sm{padding:9px 16px;font-size:13.5px;border-radius:10px}
.neon-account .btn-lg{padding:16px 30px;font-size:17px}
.neon-account .btn-xs{padding:5px 11px;font-size:12.5px;border-radius:8px}
.neon-account .btn-block{display:flex;width:100%}

/* ---------- Panels ---------- */
.neon-account .panel{
  background:linear-gradient(180deg,var(--panel),var(--bg-2));
  border:1px solid var(--border);border-radius:16px;margin-bottom:18px;overflow:hidden;
}
.neon-account .panel-default{border-color:var(--border)}
.neon-account .panel-body{padding:20px}
.neon-account .panel-body h3{font-size:19px;font-weight:800;margin-bottom:14px}

/* ---------- Tables ---------- */
.neon-account .table{width:100%;border-collapse:collapse}
.neon-account .table td{padding:13px 14px;border-bottom:1px solid var(--border);font-size:14.5px;vertical-align:middle}
.neon-account .table tr:last-child td{border-bottom:none}
.neon-account .table-striped tbody tr:nth-child(odd) td{background:rgba(255,255,255,.015)}
.neon-account .table a{color:var(--cyan);font-weight:600}
.neon-account .table b{color:var(--text);font-weight:700}

/* ---------- Labels (badges) ---------- */
.neon-account .label{
  display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;
  padding:4px 11px;border-radius:999px;border:1px solid;white-space:nowrap;
}
.neon-account .label-default{background:rgba(132,147,178,.1);border-color:rgba(132,147,178,.35);color:var(--muted)}
.neon-account .label-info{background:rgba(0,229,255,.1);border-color:rgba(0,229,255,.35);color:var(--cyan)}
.neon-account .label-success{background:rgba(25,240,160,.1);border-color:rgba(25,240,160,.35);color:var(--green)}
.neon-account .label-warning{background:rgba(255,194,75,.1);border-color:rgba(255,194,75,.35);color:var(--amber)}
.neon-account .label-danger{background:rgba(255,84,112,.1);border-color:rgba(255,84,112,.35);color:var(--red)}

/* ---------- Alerts ---------- */
.neon-account .alert{padding:14px 18px;border-radius:12px;font-size:14.5px;font-weight:600;margin:14px 0;border:1px solid}
.neon-account .alert i{margin-right:8px}
.neon-account .alert a{color:inherit;text-decoration:underline}
.neon-account .alert-danger{background:rgba(255,84,112,.1);border-color:rgba(255,84,112,.35);color:var(--red)}
.neon-account .alert-success{background:rgba(25,240,160,.1);border-color:rgba(25,240,160,.35);color:var(--green)}
.neon-account .alert-info{background:rgba(0,229,255,.08);border-color:rgba(0,229,255,.3);color:var(--cyan)}

/* ---------- Account shell ---------- */
.neon-account .ad-profile{
  position:relative;background:linear-gradient(180deg,var(--panel),var(--bg-2));
  border:1px solid var(--border-2);border-radius:20px;padding:26px 28px;margin-bottom:22px;
}
.neon-account .user-profile{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.neon-account .user h2{
  font-size:24px;font-weight:800;
  background:linear-gradient(90deg,#fff,#c7d4f0 70%,#8ea0c8);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.neon-account .user h2 a{
  background:linear-gradient(90deg,var(--cyan),var(--purple));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.neon-account .user h5{font-size:13.5px;color:var(--muted);font-weight:500;margin-top:4px}
.neon-account .favorites-user .my-ads a{
  display:flex;flex-direction:column;align-items:flex-end;gap:2px;
  font-family:var(--mono);font-size:30px;font-weight:800;color:var(--cyan);text-decoration:none;
}
.neon-account .favorites-user .my-ads a:hover{color:#7df0ff}
.neon-account .favorites-user .my-ads a small{font-size:12px;color:var(--muted);font-family:var(--font);font-weight:600}
.neon-account .user-menu{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;padding-top:22px;border-top:1px solid var(--border)}
.neon-account .user-menu li{list-style:none;margin:0}
.neon-account .user-menu a{
  display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-weight:600;font-size:14px;
  padding:9px 15px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.02);
  transition:all .18s;
}
.neon-account .user-menu a:hover{color:var(--cyan);border-color:rgba(0,229,255,.4);background:rgba(0,229,255,.06)}
.neon-account .user-menu a.active{color:var(--cyan);border-color:rgba(0,229,255,.5);background:rgba(0,229,255,.10);box-shadow:0 0 14px rgba(0,229,255,.15)}
.neon-account .user-menu a i{font-size:14px}
/* Кнопка «Выход» — выделена красным, чтобы отличалась от навигации */
.neon-account .user-menu a.logout{color:var(--red);border-color:rgba(255,84,112,.4);background:rgba(255,84,112,.10);margin-left:auto}
.neon-account .user-menu a.logout:hover{color:#ff8098;border-color:rgba(255,84,112,.6);background:rgba(255,84,112,.18)}
.neon-account .ads-info{margin-top:0}
.neon-account .main-content{padding:4px 0}

/* ---------- Pagination ---------- */
.neon-account .pagination{display:flex;flex-wrap:wrap;gap:7px;list-style:none;margin:22px 0 0;padding:0}
.neon-account .pagination li{margin:0}
.neon-account .pagination a{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;
  padding:0 12px;border-radius:10px;border:1px solid var(--border);color:var(--muted);
  font-weight:700;font-family:var(--mono);font-size:14px;text-decoration:none;transition:all .18s;
}
.neon-account .pagination a:hover{color:var(--cyan);border-color:rgba(0,229,255,.4);background:rgba(0,229,255,.06)}
.neon-account .pagination a.active{background:linear-gradient(135deg,var(--cyan),#22d3ee);color:#04121a;border-color:transparent;box-shadow:var(--glow-cyan)}
.neon-account .pagination li.disabled a{opacity:.35;pointer-events:none}

/* ---------- Responsive ---------- */
@media(max-width:640px){
  .neon-account .user-account{padding:28px 22px}
  .neon-account .user-profile{flex-direction:column;align-items:flex-start}
  .neon-account .favorites-user .my-ads a{align-items:flex-start}
  .neon-account .ad-profile{padding:20px 18px}
  .neon-account .row{margin:0}
  .neon-account .row>[class*="col-"]{width:100%}

  /* Таблицы (выводы / кошелёк / транзакции / отзывы):
     превращаем сам <table> в горизонтальный скролл-контейнер —
     широкие таблицы не обрезаются, а прокручиваются. */
  .neon-account .table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .neon-account .table th{white-space:nowrap}

  /* Карточки обменов (Мои обмены / Рефералы): 4-колоночные строки
     складываем в вертикальный список — каждая ячейка на своей строке. */
  .neon-account .panel .table,
  .neon-account .panel .table thead,
  .neon-account .panel .table tbody,
  .neon-account .panel .table tr{display:block;overflow:visible}
  .neon-account .panel .table td{display:block;width:100%;padding:8px 2px}
  .neon-account .panel .table .pull-right{float:none;display:block;text-align:left;margin-top:6px}
}
