﻿/**
 * Nexus — Panel shell v3 (редизайн оболочки).
 * Подключать после monitoring-theme.css.
 */

/* ── Логин: отдельная «станция» входа ─────────────────────── */
body.login-page .login-card {
    max-width: 420px;
    border-radius: calc(var(--radius-bento-card) + 4px);
    border: 1px solid color-mix(in srgb, var(--accent-primary) 22%, var(--glass-border));
    box-shadow:
        var(--shadow-glass-lg),
        0 0 0 1px rgba(255, 255, 255, 0.04) inset,
        0 0 80px color-mix(in srgb, var(--accent-primary) 12%, transparent);
    position: relative;
    overflow: hidden;
}

body.login-page .login-card::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent-primary) 45%, transparent),
        transparent 40%,
        color-mix(in srgb, var(--accent-secondary) 35%, transparent)
    );
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
    opacity: 0.75;
}

.login-header p {
    font-family: var(--font-ui);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-secondary);
    letter-spacing: 0.02em;
    margin: 0.35rem 0 0;
}

/* ── Основной контент приложения ────────────────────────── */
.app-container {
    position: relative;
}

.main-content {
    position: relative;
    z-index: 1;
}

.main-content-scroll {
    min-height: 100%;
    scroll-behavior: smooth;
}

/* Чуть шире «окно» контента на десктопе */
body:not(.login-page) .app-container > .main-content,
body:not(.login-page) .app-container > .main-wrapper .main-content {
    padding-left: clamp(18px, 4vw, 48px);
    padding-right: clamp(18px, 4vw, 48px);
}

/* Появление страницы — единый fade в style.css (nexus-page-ready) */
body.roles-ready:not(.login-page) .main-content-scroll > *:first-child {
    animation: none;
}

.page-sms .page-header,
.page-accounts .page-header,
.page-activity-logs .page-header,
.page-pushes .page-header {
    margin-bottom: clamp(18px, 3vw, 28px);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-bento-card);
    background: var(--glass-card);
    border: 1px solid var(--glass-border);
    box-shadow: var(--shadow-glass);
}

.page-sms .page-header h1,
.page-accounts .page-header h1,
.page-activity-logs .page-header h1,
.page-pushes .page-header h1 {
    font-family: var(--font-display);
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 6px;
}

.page-sms .toolbar,
.page-accounts .toolbar,
.page-activity-logs .toolbar,
.page-pushes .toolbar {
    padding: var(--space-3);
    border-radius: var(--radius-bento-card);
    background: color-mix(in srgb, var(--surface-1) 85%, transparent);
    border: 1px solid var(--glass-border);
    margin-bottom: var(--space-4);
}

/*
 * Финальный слой: убрать системную обводку браузера у полей ввода на всех страницах.
 * Визуальный фокус задают компоненты (.form-group, .st-input, .search-box, VNC .form-input, …).
 */
:is(
    input:not([type]),
    input[type="text"],
    input[type="search"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="url"],
    input[type="number"],
    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"],
    input[type="week"],
    textarea,
    select
):focus,
:is(
    input:not([type]),
    input[type="text"],
    input[type="search"],
    input[type="password"],
    input[type="email"],
    input[type="tel"],
    input[type="url"],
    input[type="number"],
    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"],
    input[type="week"],
    textarea,
    select
):focus-visible {
    outline: 2px solid var(--focus-ring-color, rgba(99, 140, 255, 0.85)) !important;
    outline-offset: 2px;
    -webkit-tap-highlight-color: transparent;
}

/* Поиск: одна обводка только на .search-box, не на input внутри */
.search-box input:is(:focus, :focus-visible, :active) {
    outline: none !important;
    outline-offset: 0;
    border: none !important;
    box-shadow: none !important;
}