/* ============================================================================
   Ghost Pro — тёмная тема «terminal». Слой-оверрайд поверх style.css.
   Подключается как <link id="neonTheme">; переключение — theme.js (link.disabled).
   Тема по умолчанию.
   ========================================================================= */

:root {
    --bg-page:   #080b11;
    --bg-card:   #0f1520;
    --bg-soft:   #151d2b;
    --bg-subtle: #121a26;
    --bg-inset:  #060910;

    --fg:        #dbe6f2;
    --fg-muted:  #8ba0b8;
    --fg-subtle: #64788f;
    --fg-invert: #0b1017;

    --line:        #1e293b;
    --line-strong: #2c3d54;
    --grid:        rgba(103, 232, 249, .045);

    --brand:      #22d3ee;
    --brand-2:    #06b6d4;
    --brand-3:    #67e8f9;
    --brand-ink:  #a5f3fc;
    --brand-soft: rgba(34, 211, 238, .13);
    --brand-grad: linear-gradient(135deg, #0891b2 0%, #22d3ee 55%, #67e8f9 100%);

    --term:      #4ade80;
    --term-soft: rgba(74, 222, 128, .13);
    --violet:      #a78bfa;
    --violet-soft: rgba(167, 139, 250, .14);

    --success:      #4ade80;
    --success-soft: rgba(74, 222, 128, .12);
    --success-line: rgba(74, 222, 128, .3);
    --danger:       #f87171;
    --danger-soft:  rgba(248, 113, 113, .12);
    --danger-line:  rgba(248, 113, 113, .3);
    --warning:      #fbbf24;
    --warning-soft: rgba(251, 191, 36, .12);
    --warning-line: rgba(251, 191, 36, .3);

    --sh-1: 0 1px 2px rgba(0, 0, 0, .5);
    --sh-2: 0 4px 14px rgba(0, 0, 0, .55);
    --sh-3: 0 20px 50px -18px rgba(0, 0, 0, .85), 0 0 24px -8px rgba(34, 211, 238, .25);
    --ring: 0 0 0 3px rgba(34, 211, 238, .28);
    --glow: 0 0 18px rgba(34, 211, 238, .3);
}

body {
    color: var(--fg);
    background-color: var(--bg-page);
    /* сетка + мягкое свечение в углах, как подсветка стойки */
    background-image:
        radial-gradient(900px 520px at 12% -8%, rgba(34, 211, 238, .07), transparent 60%),
        radial-gradient(760px 480px at 92% 4%, rgba(124, 58, 237, .07), transparent 62%),
        linear-gradient(var(--grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid) 1px, transparent 1px);
    background-size: auto, auto, 32px 32px, 32px 32px;
    background-attachment: fixed, fixed, scroll, scroll;
}

::selection { background: rgba(34, 211, 238, .28); color: #eaf9ff; }

/* ------------------------------------------------------------- элементы */

.topbar {
    background: rgba(10, 15, 23, .82);
    border-bottom-color: var(--line);
}
.topbar .nav a.active { background: var(--brand-soft); color: var(--brand-ink); }

.card, .panel, .app-card, .stat-card, .app-stat, .profile-card, .project-row {
    background: var(--bg-card); border-color: var(--line);
}

input[type=text], input[type=email], input[type=password], input[type=number],
input[type=search], input[type=url], select, textarea {
    background: #0b1220; border-color: var(--line); color: var(--fg);
}
input::placeholder, textarea::placeholder { color: #4d5f75; }

.btn, .app-btn { background: var(--bg-soft); border-color: var(--line); color: var(--fg); }
.btn:hover, .app-btn:hover { background: #1b2636; border-color: var(--line-strong); }
.btn-primary, .app-btn-primary {
    color: #04212a; background: var(--brand-grad); border: 0;
    box-shadow: 0 0 16px -4px rgba(34, 211, 238, .5); font-weight: 700;
}
.btn-danger { background: var(--danger-soft); color: var(--danger); border-color: var(--danger-line); }
.btn-danger:hover { background: var(--danger); color: #1a0505; }

.pill-admin     { background: var(--violet-soft);  color: #c4b5fd; border-color: rgba(167,139,250,.3); }
.pill-superuser { background: var(--brand-soft);   color: var(--brand-ink); border-color: rgba(34,211,238,.3); }
.pill-user      { background: var(--bg-soft);      color: var(--fg-muted); border-color: var(--line); }
.pill-ok        { background: var(--success-soft); color: #86efac; border-color: var(--success-line); }
.pill-block     { background: var(--danger-soft);  color: #fca5a5; border-color: var(--danger-line); }
.pill-pending   { background: var(--warning-soft); color: #fcd34d; border-color: var(--warning-line); }

.alert-error   { color: #fca5a5; }
.alert-success { color: #86efac; }
.alert-info    { color: var(--brand-ink); border-color: rgba(34,211,238,.3); }

.code, .code-pill, .short-pill { background: #0b1220; border-color: var(--line); color: var(--brand-ink); }
.mono-box { background: var(--bg-inset); border-color: var(--line); color: #a5f3fc; }

table.data thead th, table.app-table thead th {
    background: #0c131e; color: var(--fg-muted); border-bottom-color: var(--line);
}
table.data tbody td, table.app-table tbody td { border-bottom-color: rgba(30, 41, 59, .75); }
table.data tbody tr:hover, table.app-table tbody tr:hover { background: rgba(34, 211, 238, .05); }

.app-tabs { background: #0b1220; border-color: var(--line); }
.app-tabs button.active { background: var(--bg-soft); color: var(--brand); }

.app-modal { background: var(--bg-card); border-color: var(--line-strong); }
.app-overlay { background: rgba(3, 6, 12, .74); }

.user-chip { background: var(--bg-soft); border-color: var(--line); }
.theme-toggle { background: var(--bg-soft); border-color: var(--line); color: var(--fg-muted); }
.theme-toggle:hover { color: var(--brand); border-color: var(--brand); box-shadow: var(--glow); }

.stat-card .value, .stat-card strong, .app-stat .num { color: var(--brand); text-shadow: 0 0 18px rgba(34, 211, 238, .35); }

.auth-wrap .card { box-shadow: var(--sh-3); }

.wave-trim::before, .wave-trim::after { background: var(--brand); box-shadow: var(--glow); }

/* герой: на тёмной теме — «стойка с оборудованием» */
.home-hero, .app-hero {
    background: linear-gradient(135deg, #0a121d 0%, #0d2233 52%, #0a2c38 100%);
    border: 1px solid var(--line);
}
.home-hero::after, .app-hero::after { opacity: .22; }

/* карточки проектов: подсветка порта и мягкое свечение при наведении */
.project-card { background: var(--bg-card); }
.project-card:hover { box-shadow: 0 14px 30px -14px rgba(0,0,0,.9), 0 0 22px -8px var(--icon-fg, var(--brand)); }
.project-icon { background: rgba(148, 163, 184, .08); }
.project-badge { background: rgba(148, 163, 184, .1); color: var(--fg-subtle); border-color: var(--line); }

.color-cyan   { --icon-bg:rgba(34,211,238,.12);  --icon-fg:#22d3ee; --card-border:rgba(34,211,238,.28);  --card-shadow:rgba(34,211,238,.5); }
.color-green  { --icon-bg:rgba(74,222,128,.12);  --icon-fg:#4ade80; --card-border:rgba(74,222,128,.28);  --card-shadow:rgba(74,222,128,.5); }
.color-violet { --icon-bg:rgba(167,139,250,.14); --icon-fg:#a78bfa; --card-border:rgba(167,139,250,.3);  --card-shadow:rgba(167,139,250,.5); }
.color-indigo { --icon-bg:rgba(129,140,248,.14); --icon-fg:#818cf8; --card-border:rgba(129,140,248,.3);  --card-shadow:rgba(129,140,248,.5); }
.color-blue   { --icon-bg:rgba(96,165,250,.14);  --icon-fg:#60a5fa; --card-border:rgba(96,165,250,.3);   --card-shadow:rgba(96,165,250,.5); }
.color-amber  { --icon-bg:rgba(251,191,36,.14);  --icon-fg:#fbbf24; --card-border:rgba(251,191,36,.3);   --card-shadow:rgba(251,191,36,.5); }
.color-rose   { --icon-bg:rgba(251,113,133,.14); --icon-fg:#fb7185; --card-border:rgba(251,113,133,.3);  --card-shadow:rgba(251,113,133,.5); }
.color-pink   { --icon-bg:rgba(232,121,249,.14); --icon-fg:#e879f9; --card-border:rgba(232,121,249,.3);  --card-shadow:rgba(232,121,249,.5); }
.color-red    { --icon-bg:rgba(248,113,113,.14); --icon-fg:#f87171; --card-border:rgba(248,113,113,.3);  --card-shadow:rgba(248,113,113,.5); }
.color-slate  { --icon-bg:rgba(148,163,184,.12); --icon-fg:#94a3b8; --card-border:rgba(148,163,184,.26); --card-shadow:rgba(148,163,184,.4); }

.empty { color: var(--fg-subtle); }
.pill-btn { background: var(--bg-soft); border-color: var(--line); color: var(--fg-muted); }
.pill-btn:hover { color: var(--brand); border-color: var(--brand); }