/* =============================================================================
   /account — личный кабинет покупателя.
   Тёмная тема в стилистике основного сайта, мин. зависимостей от других CSS.
   ============================================================================= */

.account-body {
    background: #000;
    color: #fff;
    font-family: 'Roboto Mono', monospace;
    min-height: 100vh;
    padding: 0;
    margin: 0;
}

.account-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 18px 24px;
    border-bottom: 1px solid #1a1a1a;
}
.account-header-logo img { height: 36px; display: block; }
.account-header-back {
    color: #888; text-decoration: none; font-size: 12px;
    letter-spacing: 0.06em; text-transform: uppercase;
}
.account-header-back:hover { color: #fff; }

.account-main {
    max-width: 640px;
    margin: 0 auto;
    padding: 48px 24px 96px;
}

.account-card {
    background: #0a0a0a;
    border: 1px solid #1a1a1a;
    padding: 28px;
    margin-bottom: 24px;
}
.account-card h1, .account-card h2 {
    margin: 0 0 10px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.account-card h1 { font-size: 22px; }
.account-card h2 { font-size: 16px; text-transform: uppercase; letter-spacing: 0.08em; }
.account-sub {
    color: #888; font-size: 13px; line-height: 1.55; margin: 0 0 22px;
}
.account-sub a { color: #fff; text-decoration: underline; }

/* Dashboard layout */
.account-dashboard { display: block; }
.dashboard-header {
    display: flex; justify-content: space-between; align-items: flex-end;
    margin-bottom: 24px; gap: 16px;
}
.dashboard-eyebrow { color: #666; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
#dashboard-email {
    font-size: 18px; margin: 4px 0 0; font-weight: 500;
    word-break: break-all;
}

/* Forms */
.account-form { display: flex; flex-direction: column; gap: 12px; }
.account-form label {
    font-size: 11px; color: #888; text-transform: uppercase; letter-spacing: 0.08em;
    margin-top: 6px;
}
.account-form input {
    background: #000; border: 1px solid #2a2a2a; color: #fff;
    padding: 12px 14px; font-family: inherit; font-size: 14px;
    outline: none;
}
.account-form input::placeholder { color: #555; }
.account-form input:focus { border-color: var(--accent); }

/* Браузерное автозаполнение (Chrome/Safari) по умолчанию красит фон в светло-жёлтый/белый
   и текст в чёрный — на тёмной теме это «навязчивое» белое поле. Перекрываем: держим
   фон чёрным и текст белым. box-shadow-трюк — единственный способ перебить системный
   фон автозаполнения, прямой background WebKit игнорирует. */
.account-form input:-webkit-autofill,
.account-form input:-webkit-autofill:hover,
.account-form input:-webkit-autofill:focus,
.account-form input:-webkit-autofill:active {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0 1000px #000 inset;
    box-shadow: 0 0 0 1000px #000 inset;
    caret-color: #fff;
    transition: background-color 9999s ease-in-out 0s;
}

/* Buttons */
.account-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 14px 20px; border: 1px solid transparent;
    font-family: inherit; font-size: 12px; letter-spacing: 0.08em;
    text-transform: uppercase; cursor: pointer; user-select: none;
    background: transparent; color: #fff;
}
.account-btn-primary { background: var(--accent); color: #fff; }
.account-btn-primary:hover { filter: brightness(1.1); }
.account-btn-secondary { background: transparent; color: #fff; border-color: #fff; }
.account-btn-secondary:hover { background: rgba(255, 255, 255, 0.08); }
.account-btn-ghost { border-color: #333; color: #aaa; }
.account-btn-ghost:hover { color: #fff; border-color: #555; }
.account-btn[disabled] { opacity: 0.5; cursor: not-allowed; }

/* Status messages */
.account-msg {
    min-height: 18px; font-size: 12px; margin-top: 8px;
    color: #888;
}
.account-msg[data-level="success"] { color: #4caf50; }
.account-msg[data-level="error"]   { color: #ff6b6b; }
.account-msg[data-level="info"]    { color: #888; }

/* Divider with text */
.account-divider {
    display: flex; align-items: center; gap: 12px;
    color: #555; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em;
    margin: 22px 0;
}
.account-divider::before,
.account-divider::after {
    content: ''; flex: 1; height: 1px; background: #1a1a1a;
}

/* Wallets list */
.wallet-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.wallet-empty { color: #666; font-size: 13px; }
.wallet-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px; background: #000; border: 1px solid #1a1a1a;
}
.wallet-addr {
    font-family: 'Roboto Mono', monospace; font-size: 13px; color: #fff;
    background: transparent;
}
.wallet-unlink {
    padding: 8px 14px; font-size: 11px;
}

/* Responsive */
@media (max-width: 600px) {
    .account-main { padding: 24px 16px 80px; }
    .account-card { padding: 20px; }
    .dashboard-header { flex-direction: column; align-items: stretch; }
    .dashboard-header #signout-btn { align-self: flex-start; }
}