/* Личный кабинет: login.php и cabinet.php */
body[data-page="cabinet"] section.extra-page.small-margin>.container{max-width:1240px}

.cab-grid{display:grid;grid-template-columns:340px 1fr;gap:22px;align-items:start}
.cab-panel{border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(25,22,39,.82),rgba(9,8,15,.9));box-shadow:0 24px 80px rgba(0,0,0,.22);padding:28px}
.cab-side{position:sticky;top:100px}
.cab-kicker{font-size:10px;font-weight:700;letter-spacing:.22em;color:#b8a9e9;text-transform:uppercase;margin-bottom:14px}
.cab-account{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.cab-account__ava{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#2a2146,#161226);border:1px solid rgba(198,181,255,.22);color:#c9b9ff;font-size:20px;flex:none}
.cab-account__mail{color:#fff;font-weight:600;font-size:14px;word-break:break-all}
.cab-account__meta{color:#7f798c;font-size:11px;margin-top:3px}
.cab-balance{display:grid;gap:10px}
.cab-coin{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;border:1px solid rgba(198,181,255,.12);background:rgba(255,255,255,.03);position:relative;overflow:hidden}
.cab-coin:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:-50px;top:-50px;filter:blur(45px);opacity:.28}
.cab-coin--gold:after{background:#ffb938}
.cab-coin--gem:after{background:#6fd3ff}
.cab-coin__icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:17px;flex:none;position:relative;z-index:1}
.cab-coin--gold .cab-coin__icon{background:rgba(255,185,56,.12);color:#ffc75a;border:1px solid rgba(255,185,56,.25)}
.cab-coin--gem .cab-coin__icon{background:rgba(111,211,255,.1);color:#86dbff;border:1px solid rgba(111,211,255,.25)}
.cab-coin__label{font-size:11px;color:#8d879a;text-transform:uppercase;letter-spacing:.1em}
.cab-coin__value{font-size:22px;font-weight:700;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums;transition:color .4s}
.cab-coin__value.is-changed{color:#ff9aae}
.cab-note{margin-top:20px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid rgba(198,181,255,.1);color:#8f899c;font-size:12px;line-height:1.6}
.cab-note i{color:#b29aff;margin-right:6px}
.cab-logout{margin-top:18px;display:flex;justify-content:space-between;align-items:center;font-size:12px}
.cab-logout a{color:#8f899c}.cab-logout a:hover{color:#fff}

.cab-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}
.cab-head h2{margin:0;font-size:26px;font-weight:600;letter-spacing:-.02em;color:#fff}
.cab-head p{margin:6px 0 0;color:#8a8496;font-size:13px}
.cab-tabs{display:flex;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:999px;padding:3px}
.cab-tabs button{border:0;background:transparent;color:#8f899d;font-size:12px;padding:8px 14px;border-radius:999px;cursor:pointer;white-space:nowrap}
.cab-tabs button.active{background:#2b2542;color:#fff}
.cab-tabs .cnt{display:inline-block;min-width:18px;margin-left:6px;padding:1px 6px;border-radius:999px;background:rgba(255,255,255,.08);font-size:10px}

.cab-list{display:grid;gap:12px}
.cab-char{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:18px 20px;border:1px solid rgba(198,181,255,.14);border-radius:16px;background:linear-gradient(145deg,rgba(25,22,39,.78),rgba(11,10,18,.9));transition:border-color .25s,transform .25s,opacity .35s}
.cab-char:hover{border-color:rgba(190,160,255,.34)}
.cab-char.is-deleted{background:linear-gradient(145deg,rgba(30,18,26,.7),rgba(12,9,14,.9));border-color:rgba(255,70,110,.14)}
.cab-char.is-flash{animation:cabFlash 1.2s ease}
@keyframes cabFlash{0%{box-shadow:0 0 0 0 rgba(143,240,184,.0)}25%{box-shadow:0 0 0 3px rgba(143,240,184,.35)}100%{box-shadow:0 0 0 0 rgba(143,240,184,0)}}
.cab-char__ava{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:22px;font-weight:700;color:#fff;position:relative}
.cab-char__ava.sex-m{background:linear-gradient(135deg,#3a55ff,#7b42ff)}
.cab-char__ava.sex-f{background:linear-gradient(135deg,#ed2b92,#9d4bff)}
.cab-char.is-deleted .cab-char__ava{filter:grayscale(.85) brightness(.6)}
.cab-char__online{position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;border-radius:50%;background:#43e08a;border:3px solid #120f1c;box-shadow:0 0 10px rgba(67,224,138,.6)}
.cab-char__name{font-size:17px;font-weight:600;color:#fff;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cab-char.is-deleted .cab-char__name span.nm{text-decoration:line-through;text-decoration-color:rgba(255,120,150,.5);color:#bdb3c4}
.cab-badge{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:999px;border:1px solid}
.cab-badge--online{color:#8ff0b8;border-color:rgba(67,224,138,.3);background:rgba(67,224,138,.08)}
.cab-badge--deleted{color:#ff9aae;border-color:rgba(255,70,110,.28);background:rgba(255,50,96,.08)}
.cab-char__meta{display:flex;gap:16px;flex-wrap:wrap;margin-top:6px;color:#837d90;font-size:12px}
.cab-char__meta i{color:#6f6883;margin-right:5px;width:12px;text-align:center}
.cab-char__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.cab-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid rgba(198,181,255,.16);background:rgba(255,255,255,.05);color:#e9e4f5;transition:.2s;white-space:nowrap}
.cab-btn:hover:not(:disabled){border-color:rgba(198,181,255,.45);background:rgba(58,46,94,.45);color:#fff}
.cab-btn:disabled{opacity:.38;cursor:not-allowed}
.cab-btn i{font-size:12px;color:#b9a5ff}
.cab-btn--gold{border-color:rgba(255,185,56,.3);background:rgba(255,185,56,.08);color:#ffd88f}
.cab-btn--gold i{color:#ffc75a}
.cab-btn--gold:hover:not(:disabled){border-color:rgba(255,185,56,.6);background:rgba(255,185,56,.16);color:#fff}
.cab-btn--primary{border:0;background:linear-gradient(135deg,#c1afff,#9d7cff);color:#161020}
.cab-btn--primary:hover:not(:disabled){background:linear-gradient(135deg,#d0c2ff,#ab8dff);color:#161020}
.cab-btn--danger{border-color:rgba(255,70,110,.22);background:rgba(255,60,98,.1);color:#ff9aae}
.cab-hint{font-size:11px;color:#8a8496;text-align:right;margin-top:6px}
.cab-hint.warn{color:#ffb86b}
.cab-empty{padding:48px 20px;text-align:center;color:#7f798c;border:1px dashed rgba(198,181,255,.16);border-radius:16px}
.cab-empty i{font-size:30px;color:#4d4561;display:block;margin-bottom:12px}

/* модалка подтверждения */
.cab-modal{position:fixed;inset:0;z-index:1200;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(3,3,8,.72);backdrop-filter:blur(6px)}
.cab-modal.open{display:flex;animation:cabFade .18s ease}
@keyframes cabFade{from{opacity:0}to{opacity:1}}
.cab-modal__box{width:min(460px,100%);border:1px solid rgba(198,181,255,.2);border-radius:20px;background:linear-gradient(145deg,rgba(23,20,36,.98),rgba(9,8,15,.99));box-shadow:0 28px 90px rgba(0,0,0,.55);padding:30px;animation:cabPop .2s ease}
@keyframes cabPop{from{transform:translateY(10px) scale(.98)}to{transform:none}}
.cab-modal__icon{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:21px;margin-bottom:18px;background:#1b1530;color:#c0adff;border:1px solid rgba(189,169,255,.2)}
.cab-modal__icon.gold{background:rgba(255,185,56,.1);color:#ffc75a;border-color:rgba(255,185,56,.28)}
.cab-modal__box h3{margin:0 0 10px;font-size:20px;color:#fff}
.cab-modal__box p{margin:0;color:#a39db0;font-size:14px;line-height:1.65}
.cab-modal__price{margin-top:18px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(198,181,255,.12);display:grid;gap:8px;font-size:13px;color:#a39db0}
.cab-modal__price div{display:flex;justify-content:space-between}
.cab-modal__price b{color:#fff;font-variant-numeric:tabular-nums}
.cab-modal__price .minus{color:#ff9aae}
.cab-modal__price .after{border-top:1px solid rgba(198,181,255,.12);padding-top:8px}
.cab-modal__actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}

/* смена пароля */
.cab-pwd{display:grid;gap:14px;margin-top:20px}
.cab-field>span{display:block;font-size:11px;color:#8d879a;text-transform:uppercase;letter-spacing:.1em;margin-bottom:7px}
.cab-field__wrap{position:relative}
.cab-field input{width:100%;min-height:46px;padding:11px 48px 11px 14px;border-radius:11px;border:1px solid rgba(198,181,255,.16);background:rgba(255,255,255,.055);color:#fff;outline:none;transition:border-color .2s,box-shadow .2s}
.cab-field input:focus{border-color:rgba(183,151,255,.62);box-shadow:0 0 0 3px rgba(139,92,246,.12)}
.cab-field input.is-bad{border-color:rgba(255,77,119,.55)}
.cab-field input.is-good{border-color:rgba(66,220,135,.45)}
.cab-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:transparent;color:#8f82a8;cursor:pointer;display:grid;place-items:center}
.cab-eye:hover{color:#bca9ff}
.cab-pwd__error{margin-top:16px;padding:11px 14px;border-radius:11px;border:1px solid rgba(255,77,119,.25);background:rgba(255,50,96,.09);color:#ff9aae;font-size:13px}

/* уведомления */
.cab-toasts{position:fixed;z-index:1300;right:22px;top:100px;display:grid;gap:10px;width:min(360px,calc(100% - 44px))}
.cab-toast{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;font-size:13px;line-height:1.5;backdrop-filter:blur(12px);box-shadow:0 14px 40px rgba(0,0,0,.4);animation:cabToast .25s ease}
.cab-toast.ok{background:rgba(18,40,30,.94);border:1px solid rgba(66,220,135,.3);color:#b6f5cf}
.cab-toast.err{background:rgba(45,14,24,.94);border:1px solid rgba(255,77,119,.3);color:#ffb3c2}
.cab-toast i{margin-top:3px}
@keyframes cabToast{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}

.cab-spin{display:inline-block;width:13px;height:13px;border:2px solid rgba(22,16,32,.3);border-top-color:#161020;border-radius:50%;animation:cabSpin .7s linear infinite}
@keyframes cabSpin{to{transform:rotate(360deg)}}

@media (max-width:991px){
  .cab-grid{grid-template-columns:1fr}
  .cab-side{position:static}
}
@media (max-width:680px){
  .cab-char{grid-template-columns:auto 1fr}
  .cab-char__actions{grid-column:1/-1;justify-content:stretch}
  .cab-char__actions .cab-btn{flex:1;justify-content:center}
  .cab-hint{text-align:left}
  .cab-head{flex-direction:column;align-items:stretch}
}

/* ---------- Вход ---------- */
body[data-page="login"] .login-card{max-width:520px;margin:0 auto}
#loginForm .form-group{margin-bottom:16px}
#loginForm .password-field{position:relative}
#loginForm .password-field .form-control{padding-right:54px!important}
#loginForm .password-toggle{position:absolute;top:50%;right:16px;transform:translateY(-50%);width:36px;height:36px;padding:0;border:0;background:transparent;color:#8f82a8;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:17px;z-index:2}
#loginForm .password-toggle:hover{color:#bca9ff}
.login-title{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.login-title__icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:#1b1530;color:#c0adff;border:1px solid rgba(189,169,255,.2);font-size:19px}
.login-title h2{margin:0;font-size:22px;color:#fff}
.login-title p{margin:3px 0 0!important;color:#8a8496;font-size:13px}
.login-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:4px 0 18px;font-size:13px}
.login-row label{margin:0;display:flex;align-items:center;gap:8px;cursor:pointer}
.login-captcha{min-height:78px;margin-bottom:18px}
#loginForm .btn-info{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px}
#loginForm .btn-info:disabled{opacity:.55;cursor:not-allowed}
.login-foot{margin-top:22px;padding-top:18px;border-top:1px solid rgba(198,181,255,.12);text-align:center;font-size:13px;color:#8a8496}
.login-alert{display:flex;gap:10px;align-items:flex-start;margin-bottom:18px;padding:12px 14px;border-radius:12px;font-size:13px;line-height:1.55}
.login-alert.err{border:1px solid rgba(255,77,119,.25);background:rgba(255,50,96,.09);color:#ff9aae}
.login-alert.warn{border:1px solid rgba(255,185,56,.3);background:rgba(255,185,56,.08);color:#ffd28a}
.login-alert.ok{border:1px solid rgba(66,220,135,.28);background:rgba(40,190,110,.10);color:#8ff0b8}
.login-alert i{margin-top:3px}
.login-features{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:14px}
.login-features li{display:flex;gap:14px;align-items:flex-start;color:#a39db0;font-size:14px;line-height:1.55}
.login-features i{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.04);border:1px solid rgba(198,181,255,.14);color:#b9a5ff;font-size:14px}
.login-features b{color:#fff;display:block;font-weight:600}
.login-secure{margin-top:22px;font-size:12px;color:#7f798c}
.login-secure i{color:#65e49a;margin-right:6px}

.cab-btn .cab-spin{border-color:rgba(233,228,245,.3);border-top-color:#e9e4f5}
.cab-btn--primary .cab-spin{border-color:rgba(22,16,32,.3);border-top-color:#161020}
.cab-char.is-busy{opacity:.7}
.login-alert a{color:inherit;text-decoration:underline}
