/* ==========================================================================
   NetSentinel – vzhled konzole
   Postaveno nad Bootstrap 5.3, světlý i tmavý režim (data-bs-theme).
   Bezpečnostní pravidla (CSP) nepovolují styly vepsané do stránky: vše je tady, šířky ukazatelů jsou třídy ns-w-*.
   Písmo Inter (OFL) a ikony Bootstrap Icons (MIT) jsou v wwwroot/lib, nic se nenačítá z cizích serverů.
   ========================================================================== */

/* Písmo nápisu NetSentinel (Righteous, vybral uživatel 2026-10-07; u nás na serveru, licence OFL). */
@font-face {
    font-family: "Righteous";
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url("../lib/righteous/righteous-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Righteous";
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: url("../lib/righteous/righteous-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../lib/inter/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../lib/inter/inter-latin-wght-normal.woff2") format("woff2-variations");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root,
[data-bs-theme="light"] {
    --ns-bg: #f4f6fb;
    --ns-surface: #ffffff;
    --ns-surface-2: #f8fafc;
    --ns-border: #d5dbe6;
    /* Rámeček oken (karty, okna, nabídky): ve světlém režimu výrazný, ať je vidět i na slabě kontrastním monitoru. */
    --ns-frame: #aeb8ca;
    --ns-frame-width: 2px;
    --ns-text: #0f172a;
    --ns-muted: #64748b;
    --ns-primary: #4f46e5;
    --ns-primary-hover: #4338ca;
    --ns-primary-soft: #eef2ff;
    --ns-success: #059669;
    --ns-success-soft: #ecfdf5;
    --ns-warning: #d97706;
    --ns-warning-soft: #fffbeb;
    --ns-danger: #dc2626;
    --ns-danger-soft: #fef2f2;
    --ns-info: #0284c7;
    --ns-info-soft: #f0f9ff;
    /* Boční menu ve světlém režimu: světle modré (přání uživatele 2026-10-07). */
    --ns-sidebar: #dbe6f5;
    --ns-sidebar-border: #c3d2e8;
    --ns-sidebar-text: #3d4d66;
    --ns-sidebar-strong: #1b2840;
    --ns-sidebar-section: #6a7b96;
    --ns-sidebar-hover: rgba(27, 40, 64, .06);
    --ns-sidebar-active: #ffffff;
    --ns-sidebar-active-icon: #4f46e5;
    --ns-sidebar-box: rgba(255, 255, 255, .55);
    --ns-sidebar-role: #5b6b84;
    --ns-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 1px 3px rgba(15, 23, 42, .06);

    --bs-body-bg: var(--ns-bg);
    --bs-body-color: var(--ns-text);
    --bs-border-color: var(--ns-border);
    --bs-primary: var(--ns-primary);
    --bs-primary-rgb: 79, 70, 229;
    --bs-success: var(--ns-success);
    --bs-success-rgb: 5, 150, 105;
    --bs-warning: var(--ns-warning);
    --bs-warning-rgb: 217, 119, 6;
    --bs-danger: var(--ns-danger);
    --bs-danger-rgb: 220, 38, 38;
    --bs-info: var(--ns-info);
    --bs-info-rgb: 2, 132, 199;
    --bs-link-color: var(--ns-primary);
    --bs-link-color-rgb: 79, 70, 229;
    --bs-link-hover-color: var(--ns-primary-hover);
    --bs-link-hover-color-rgb: 67, 56, 202;
    --bs-secondary-color: var(--ns-muted);
    --bs-tertiary-bg: var(--ns-surface-2);
    --bs-font-sans-serif: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

[data-bs-theme="dark"] {
    --ns-bg: #0b1120;
    --ns-surface: #111827;
    --ns-surface-2: #0f172a;
    --ns-border: #1f2937;
    --ns-frame: #334155;
    --ns-frame-width: 2px;
    --ns-text: #e2e8f0;
    --ns-muted: #94a3b8;
    --ns-primary: #818cf8;
    --ns-primary-hover: #a5b4fc;
    --ns-primary-soft: rgba(129, 140, 248, .14);
    --ns-success: #34d399;
    --ns-success-soft: rgba(52, 211, 153, .12);
    --ns-warning: #fbbf24;
    --ns-warning-soft: rgba(251, 191, 36, .12);
    --ns-danger: #f87171;
    --ns-danger-soft: rgba(248, 113, 113, .12);
    --ns-info: #38bdf8;
    --ns-info-soft: rgba(56, 189, 248, .12);
    --ns-sidebar: #070b16;
    --ns-sidebar-border: rgba(255, 255, 255, .06);
    --ns-sidebar-text: #94a3b8;
    --ns-sidebar-strong: #e2e8f0;
    --ns-sidebar-section: #475569;
    --ns-sidebar-hover: rgba(255, 255, 255, .04);
    --ns-sidebar-active: #172033;
    --ns-sidebar-active-icon: #818cf8;
    --ns-sidebar-box: rgba(255, 255, 255, .04);
    --ns-sidebar-role: #64748b;
    --ns-shadow: none;

    --bs-body-bg: var(--ns-bg);
    --bs-body-color: var(--ns-text);
    --bs-border-color: var(--ns-border);
    --bs-primary: var(--ns-primary);
    --bs-primary-rgb: 129, 140, 248;
    --bs-success: var(--ns-success);
    --bs-success-rgb: 52, 211, 153;
    --bs-warning: var(--ns-warning);
    --bs-warning-rgb: 251, 191, 36;
    --bs-danger: var(--ns-danger);
    --bs-danger-rgb: 248, 113, 113;
    --bs-info: var(--ns-info);
    --bs-info-rgb: 56, 189, 248;
    --bs-link-color: var(--ns-primary);
    --bs-link-color-rgb: 129, 140, 248;
    --bs-link-hover-color: var(--ns-primary-hover);
    --bs-link-hover-color-rgb: 165, 180, 252;
    --bs-secondary-color: var(--ns-muted);
    --bs-tertiary-bg: var(--ns-surface-2);
}

html { font-size: 16px; } /* dřív 14 px; uživatel chtěl čitelnější text (2026-10-07) */

body {
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
    font-feature-settings: "cv11", "ss01";
    background: var(--ns-bg);
    color: var(--ns-text);
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; }
a:hover { text-decoration: underline; }
.text-muted, .text-secondary { color: var(--ns-muted) !important; }
.fw-medium { font-weight: 500; }
.tabular { font-variant-numeric: tabular-nums; }
.min-w-0 { min-width: 0; }
.mono { font-family: ui-monospace, "Cascadia Code", Consolas, monospace; font-size: .92em; }
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 { letter-spacing: -.01em; }

/* ---------- Rozvržení: postranní menu + obsah ---------- */
.app { display: flex; min-height: 100vh; }

.sidebar {
    width: 268px;
    flex-shrink: 0;
    background: var(--ns-sidebar);
    color: var(--ns-sidebar-text);
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid var(--ns-sidebar-border);
}

.sidebar .brand {
    display: block;
    padding: 1.3rem 1.5rem 1.15rem;
    color: var(--ns-sidebar-strong);
    font-family: "Righteous", "Inter", sans-serif;
    font-weight: 400;
    font-size: 1.75rem;
    line-height: 1.1;
    letter-spacing: 0;
}

.sidebar .brand:hover { text-decoration: none; color: var(--ns-sidebar-strong); }

/* Název firmy (admin firmy) pod logem. */
.sidebar-tenant {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin: 0 .75rem .5rem;
    padding: .6rem .75rem;
    border-radius: 8px;
    background: var(--ns-sidebar-box);
    border: 1px solid var(--ns-sidebar-border);
    color: var(--ns-sidebar-strong);
    font-weight: 600;
    font-size: .9rem;
}

.sidebar-tenant i { color: var(--ns-sidebar-active-icon); }
.sidebar-tenant span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Přepínač firem (admin ve více firmách): název firmy je tlačítko s nabídkou. */
.sidebar-tenant-switch { margin: 0 .75rem .5rem; }
.sidebar-tenant-switch .sidebar-tenant { margin: 0; width: 100%; text-align: left; cursor: pointer; font-family: inherit; }
.sidebar-tenant-switch .sidebar-tenant:hover, .sidebar-tenant-switch .sidebar-tenant:focus-visible { border-color: var(--ns-sidebar-active-icon); }
.tenant-menu { min-width: 16rem; max-height: 70vh; overflow-y: auto; }
.tenant-menu .dropdown-item { display: flex; align-items: center; gap: .5rem; }

.sidebar .nav-section {
    padding: 1.1rem 1.4rem .4rem;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ns-sidebar-section);
    font-weight: 600;
}

.sidebar .nav-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin: 2px .75rem;
    padding: .6rem .75rem;
    border-radius: 8px;
    color: var(--ns-sidebar-text);
    font-weight: 500;
}

.sidebar .nav-link i { font-size: 1.05rem; width: 1.2rem; text-align: center; }
.sidebar .nav-link:hover { color: var(--ns-sidebar-strong); background: var(--ns-sidebar-hover); text-decoration: none; }
.sidebar .nav-link.active { color: var(--ns-sidebar-strong); background: var(--ns-sidebar-active); }
.sidebar .nav-link.active i { color: var(--ns-sidebar-active-icon); }

.sidebar-footer {
    margin-top: auto;
    padding: 1rem;
    border-top: 1px solid var(--ns-sidebar-border);
}

.sidebar-user {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .5rem;
    border-radius: 8px;
    color: var(--ns-sidebar-strong);
}

.sidebar-user:hover, .sidebar-user.active { background: var(--ns-sidebar-hover); text-decoration: none; color: var(--ns-sidebar-strong); }
.sidebar-user-role { color: var(--ns-sidebar-role); }

.avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #312e81;
    color: #c7d2fe;
    font-weight: 600;
    font-size: .85rem;
    text-transform: uppercase;
    flex-shrink: 0;
}

.sidebar .btn-icon { color: var(--ns-sidebar-text); }
.sidebar .btn-icon:hover { color: var(--ns-sidebar-strong); background: var(--ns-sidebar-hover); }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }

.topbar {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 2rem;
    background: var(--ns-surface);
    border-bottom: 1px solid var(--ns-border);
    position: sticky;
    top: 0;
    z-index: 10;
}

.topbar-end { margin-left: auto; display: flex; align-items: center; gap: .5rem; }
.topbar .search { max-width: 380px; flex: 1; min-width: 0; margin-left: auto; position: relative; }
.topbar .search + .topbar-end { margin-left: 0; }
.topbar .search i { position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); color: var(--ns-muted); pointer-events: none; }
.topbar .search input { padding-left: 2.3rem; background: var(--ns-surface-2); }
.topbar .btn-icon { color: var(--ns-muted); font-size: 1.1rem; }
.topbar .btn-icon:hover { color: var(--ns-text); }

/* Ikona tlačítka vzhledu podle volby (atribut nastavuje js/theme.js). */
.ns-vzhled-ikona { display: none; }
html:not([data-vzhled-volba]) .ns-vzhled-auto,
html[data-vzhled-volba="auto"] .ns-vzhled-auto,
html[data-vzhled-volba="light"] .ns-vzhled-light,
html[data-vzhled-volba="dark"] .ns-vzhled-dark { display: inline-block; }

/* Přepínač jazyka: zkratka jazyka (CS / EN) místo ikony, v tlačítku i v nabídce. */
.ns-jazyk-kod { font-size: .72rem; font-weight: 700; letter-spacing: .04em; line-height: 1; }
.dropdown-item .ns-jazyk-kod { display: inline-block; min-width: 1.4rem; margin-right: .5rem; color: var(--ns-muted); }
.dropdown-item.active .ns-jazyk-kod { color: inherit; }

.dropdown-menu {
    --bs-dropdown-bg: var(--ns-surface);
    --bs-dropdown-border-color: var(--ns-frame);
    --bs-dropdown-border-width: var(--ns-frame-width);
    --bs-dropdown-link-hover-bg: var(--ns-surface-2);
    --bs-dropdown-link-active-bg: var(--ns-primary-soft);
    --bs-dropdown-link-active-color: var(--ns-primary);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .12);
    padding: .35rem;
}

.dropdown-item { border-radius: 6px; display: flex; align-items: center; gap: .6rem; padding: .45rem .7rem; font-weight: 500; }

.content { padding: 1.75rem 2rem 3rem; }

.page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.page-title { font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em; margin: 0; }
.page-subtitle { color: var(--ns-muted); margin: .25rem 0 0; }
.section-title { font-size: 1.05rem; font-weight: 700; margin: 0; }

@media (max-width: 991.98px) {
    .sidebar { position: fixed; left: -280px; z-index: 1045; transition: left .2s ease; }
    .sidebar.open { left: 0; box-shadow: 0 0 0 100vmax rgba(0, 0, 0, .45); }
    .topbar, .content { padding-left: 1rem; padding-right: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .sidebar { transition: none; }
}

/* ---------- Karty ---------- */
.card {
    background: var(--ns-surface);
    border: var(--ns-frame-width) solid var(--ns-frame);
    border-radius: 12px;
    box-shadow: var(--ns-shadow);
    --bs-card-cap-bg: transparent;
    --bs-card-bg: var(--ns-surface);
    --bs-card-border-color: var(--ns-frame);
    --bs-card-border-width: var(--ns-frame-width);
}

.card-header {
    background: transparent;
    border-bottom: 1px solid var(--ns-border);
    padding: 1rem 1.25rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.card-header > i { color: var(--ns-muted); }
.card-header .count { background: var(--ns-surface-2); border: 1px solid var(--ns-border); border-radius: 999px; padding: 0 .5rem; font-size: .75rem; color: var(--ns-muted); }
.card-header .header-action { margin-left: auto; font-weight: 500; font-size: .875rem; }
.card-header .header-note { font-weight: 400; font-size: .8rem; color: var(--ns-muted); }
.card-header .header-filter { margin-left: auto; max-width: 260px; }
.card-body { padding: 1.25rem; }
/* Tabulka v kartě: zaoblené rohy uvnitř rámečku (vnitřní poloměr = 12px - šířka rámečku), jinak pozadí záhlaví
   tabulky přečnívá přes zaoblený roh a rámeček vypadá nedokreslený. */
.card > .table-responsive:first-child, .card > .table-scroll:first-child {
    border-top-left-radius: calc(12px - var(--ns-frame-width)); border-top-right-radius: calc(12px - var(--ns-frame-width));
}
.card > .table-responsive:last-child, .card > .table-scroll:last-child {
    border-bottom-left-radius: calc(12px - var(--ns-frame-width)); border-bottom-right-radius: calc(12px - var(--ns-frame-width));
}

/* Statistické dlaždice */
.stat, .card.stat {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    height: 100%;
}

.stat-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.stat-value { font-size: 1.75rem; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.stat-label { color: var(--ns-muted); font-size: .825rem; font-weight: 500; }

.soft-primary { background: var(--ns-primary-soft); color: var(--ns-primary); }
.soft-success { background: var(--ns-success-soft); color: var(--ns-success); }
.soft-warning { background: var(--ns-warning-soft); color: var(--ns-warning); }
.soft-danger { background: var(--ns-danger-soft); color: var(--ns-danger); }
.soft-info { background: var(--ns-info-soft); color: var(--ns-info); }
.soft-muted { background: var(--ns-surface-2); color: var(--ns-muted); }

/* ---------- Štítky a stavy ---------- */
.pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .2rem .6rem;
    border-radius: 999px;
    font-size: .775rem;
    font-weight: 600;
    white-space: nowrap;
    line-height: 1.5;
    vertical-align: middle;
}

.pill i { font-size: .8rem; }
.pill-success { background: var(--ns-success-soft); color: var(--ns-success); }
.pill-warning { background: var(--ns-warning-soft); color: var(--ns-warning); }
.pill-danger { background: var(--ns-danger-soft); color: var(--ns-danger); }
.pill-info { background: var(--ns-info-soft); color: var(--ns-info); }
.pill-primary { background: var(--ns-primary-soft); color: var(--ns-primary); }
.pill-muted { background: var(--ns-surface-2); color: var(--ns-muted); border: 1px solid var(--ns-border); }
.pills { display: inline-flex; flex-wrap: wrap; gap: .35rem; }
/* Dlouhý štítek (Klíč PC): na úzké obrazovce se zalomí a nevyteče z karty. */
.pill.pill-wrap { white-space: normal; overflow-wrap: anywhere; max-width: 100%; border-radius: 12px; }
.pill.pill-wrap i { flex-shrink: 0; }

.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; vertical-align: middle; }
.dot-online { background: var(--ns-success); box-shadow: 0 0 0 3px var(--ns-success-soft); }
.dot-offline { background: #94a3b8; }
.dot-blocked { background: var(--ns-danger); box-shadow: 0 0 0 3px var(--ns-danger-soft); }

/* Čeká se na vyžádané údaje ("Aktualizovat nyní"): tečka bliká. */
.dot-waiting { animation: ns-blink 1.1s ease-in-out infinite; }

@keyframes ns-blink {
    50% { opacity: .25; }
}

@media (prefers-reduced-motion: reduce) {
    .dot-waiting, .spinner-border { animation: none; }
}

/* ---------- Tabulky ---------- */
.table { --bs-table-bg: transparent; --bs-table-color: var(--ns-text); --bs-table-striped-bg: var(--ns-surface-2); margin: 0; }
.table > :not(caption) > * > * { padding: .8rem 1rem; border-bottom-color: var(--ns-border); }

.table thead th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--ns-muted);
    font-weight: 600;
    background: var(--ns-surface-2);
    white-space: nowrap;
}

.table tbody tr:last-child > * { border-bottom: 0; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: var(--ns-surface-2); }
.table td { vertical-align: middle; }
.table-sm > :not(caption) > * > * { padding: .55rem 1rem; }
.table th[scope="row"] { font-weight: 600; }
.table tr.row-danger > * { --bs-table-bg-state: var(--ns-danger-soft); }
.table tr.row-muted > * { color: var(--ns-muted); }

.table tbody + tbody { border-top: 1px solid var(--ns-border); }

/* Záhlaví skupiny jako tlačítko: rozbalit / sbalit (js/groups.js). */
.group-toggle {
    display: flex;
    width: 100%;
    align-items: center;
    gap: .35rem;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
    cursor: pointer;
}

.group-toggle:focus-visible { outline: 2px solid var(--ns-primary); outline-offset: 3px; border-radius: 4px; }
.group-chevron { transition: transform .15s ease; }
.group-toggle[aria-expanded="false"] .group-chevron { transform: rotate(-90deg); }
tbody.sbaleno > tr:not(.group-row) { display: none; }

@media (prefers-reduced-motion: reduce) {
    .group-chevron { transition: none; }
}

.table tr.group-row > td {
    background: var(--ns-surface-2);
    font-weight: 700;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--ns-muted);
    padding-top: .55rem;
    padding-bottom: .55rem;
}

.table tr.group-row i { margin-right: .35rem; }
.table tr.group-row .count { background: var(--ns-surface); border: 1px solid var(--ns-border); border-radius: 999px; padding: 0 .5rem; margin-left: .35rem; }
.table-hover > tbody > tr.group-row:hover > * { --bs-table-bg-state: var(--ns-surface-2); }
.table tr.group-empty > td { color: var(--ns-muted); font-size: .875rem; }

/* Celý řádek otevře detail (js/rows.js). */
tr[data-odkaz] { cursor: pointer; }

/* Dlouhé tabulky v detailu: posuvník uvnitř karty, záhlaví zůstává nahoře. */
.table-scroll { max-height: 34rem; overflow: auto; }
.table-scroll thead th { position: sticky; top: 0; z-index: 1; }

.device-cell { display: flex; align-items: center; gap: .8rem; }

.device-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: var(--ns-primary-soft);
    color: var(--ns-primary);
    font-size: 1.1rem;
    flex-shrink: 0;
}

.device-icon.is-blocked { background: var(--ns-danger-soft); color: var(--ns-danger); }
.device-cell .name { font-weight: 600; color: var(--ns-text); white-space: nowrap; }
.device-cell .name:hover { color: var(--ns-primary); }
.device-cell .sub { color: var(--ns-muted); font-size: .8rem; }
.device-cell .pill { margin-left: .35rem; }

.disk-cell { min-width: 170px; }
.disk-cell .disk-text { display: flex; gap: .35rem; align-items: baseline; margin-bottom: .3rem; white-space: nowrap; }

.mini-bar { height: 6px; border-radius: 6px; background: var(--ns-border); overflow: hidden; min-width: 70px; }
.mini-bar > div { height: 100%; border-radius: 6px; }
.mini-bar.mini-bar-lg { height: 12px; }
.bar-success { background: var(--ns-success); }
.bar-warning { background: var(--ns-warning); }
.bar-danger { background: var(--ns-danger); }
.bar-primary { background: var(--ns-primary); }
.bar-muted { background: #94a3b8; }

/* Šířky ukazatelů po 5 % (DeviceFormat.Width). Šířka nejde zapsat do stránky: CSP nepovoluje styly ve stránce. */
.ns-w-0 { width: 0%; }
.ns-w-5 { width: 5%; }
.ns-w-10 { width: 10%; }
.ns-w-15 { width: 15%; }
.ns-w-20 { width: 20%; }
.ns-w-25 { width: 25%; }
.ns-w-30 { width: 30%; }
.ns-w-35 { width: 35%; }
.ns-w-40 { width: 40%; }
.ns-w-45 { width: 45%; }
.ns-w-50 { width: 50%; }
.ns-w-55 { width: 55%; }
.ns-w-60 { width: 60%; }
.ns-w-65 { width: 65%; }
.ns-w-70 { width: 70%; }
.ns-w-75 { width: 75%; }
.ns-w-80 { width: 80%; }
.ns-w-85 { width: 85%; }
.ns-w-90 { width: 90%; }
.ns-w-95 { width: 95%; }
.ns-w-100 { width: 100%; }

/* Ukazatel s popisem nad ním (disky, zatížení). */
.meter + .meter { margin-top: 1rem; }
.meter-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .45rem; }
.meter-head .meter-value { font-weight: 600; font-variant-numeric: tabular-nums; }
.meter-head .fw-semibold i { color: var(--ns-muted); margin-right: .25rem; }

.process-bar { display: flex; align-items: center; gap: .75rem; min-width: 200px; }
.process-bar .mini-bar { flex: 1; }
.process-bar span { min-width: 4.5rem; text-align: right; }

/* ---------- Klíč–hodnota seznamy ---------- */
.kv { display: grid; grid-template-columns: minmax(130px, 40%) 1fr; gap: .55rem 1rem; margin: 0; }
.kv dt { color: var(--ns-muted); font-weight: 500; }
.kv dd { margin: 0; font-weight: 500; word-break: break-word; }

@media (max-width: 575.98px) {
    .kv { grid-template-columns: 1fr; gap: .1rem; }
    .kv dd { margin-bottom: .5rem; }
}

/* Údaj chybí (starší agent, chyba sběru). */
.ns-chybi {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    color: var(--ns-muted);
    font-size: .875rem;
    font-weight: 400;
    padding: .55rem .75rem;
    border: 1px dashed var(--ns-border);
    border-radius: 8px;
    background: var(--ns-surface-2);
}

.ns-chybi + .ns-chybi, .ns-chybi + .kv, .ns-chybi + .check-list { margin-top: .75rem; }
.card > .ns-chybi { margin: 1rem 1.25rem; }

/* ---------- Detail zařízení ---------- */
.device-hero { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; }
.device-hero .device-icon { width: 64px; height: 64px; border-radius: 16px; font-size: 1.9rem; }
.device-hero > .hero-actions { margin-left: auto; align-self: flex-start; flex-shrink: 0; display: flex; gap: .5rem; flex-wrap: wrap; }
.device-hero > .hero-actions form { margin: 0; }
.device-hero h1 { font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em; margin: 0; word-break: break-word; }
@media (min-width: 992px) { .device-hero { flex-wrap: nowrap; } }

.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }

.chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .25rem .65rem;
    border-radius: 8px;
    background: var(--ns-surface-2);
    border: 1px solid var(--ns-border);
    color: var(--ns-muted);
    font-size: .8rem;
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chip i { font-size: .85rem; }

.freshness {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1.5rem;
    font-size: .8rem;
    color: var(--ns-muted);
    padding: .6rem 1rem;
    background: var(--ns-surface);
    border: 1px solid var(--ns-border);
    border-radius: 10px;
}

.freshness i { margin-right: .25rem; }
.freshness strong { color: var(--ns-text); font-weight: 600; }
.freshness .freshness-state { margin-left: auto; display: inline-flex; align-items: center; gap: .4rem; }

.metric .metric-label { color: var(--ns-muted); font-size: .8rem; font-weight: 500; display: flex; align-items: center; gap: .4rem; }
.metric .metric-value { font-size: 1.15rem; font-weight: 700; margin: .25rem 0 .5rem; letter-spacing: -.01em; }
.metric .metric-sub { color: var(--ns-muted); font-size: .8rem; }

.nav-tabs-ns { border-bottom: 1px solid var(--ns-border); gap: .25rem; margin-bottom: 1.25rem; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }

.nav-tabs-ns .nav-link {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--ns-muted);
    font-weight: 600;
    padding: .7rem 1rem;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: .45rem;
    background: transparent;
}

.nav-tabs-ns .nav-link:hover { color: var(--ns-text); text-decoration: none; }
.nav-tabs-ns .nav-link.active { color: var(--ns-primary); border-bottom-color: var(--ns-primary); }
.nav-tabs-ns .count { background: var(--ns-surface-2); border: 1px solid var(--ns-border); border-radius: 999px; padding: 0 .45rem; font-size: .78rem; }
.nav-tabs-ns .count-danger { background: var(--ns-danger-soft); border-color: transparent; color: var(--ns-danger); }

.check-list { list-style: none; margin: 0; padding: 0; }
.check-list li { display: flex; align-items: center; gap: .85rem; padding: .8rem 1.25rem; border-bottom: 1px solid var(--ns-border); }
.check-list li:last-child { border-bottom: 0; }
.check-list .check-icon { width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; flex-shrink: 0; }
.check-list .check-title { font-weight: 600; }
.check-list .check-detail { color: var(--ns-muted); font-size: .825rem; word-break: break-word; }
.check-list .check-end { margin-left: auto; display: flex; gap: .35rem; flex-wrap: wrap; justify-content: flex-end; flex-shrink: 0; }
.check-list li > .pill { margin-left: auto; }
.check-list li.is-disabled .check-title { color: var(--ns-muted); }
.card-body .check-list li { padding-left: 0; padding-right: 0; }

/* Grafika paměťových slotů na základní desce */
.ram-board {
    background: var(--ns-surface-2);
    border: 1px solid var(--ns-border);
    border-radius: 10px;
    padding: .9rem 1rem 1rem;
}

.ram-board-title { display: flex; justify-content: space-between; gap: 1rem; color: var(--ns-muted); font-size: .8rem; font-weight: 500; margin-bottom: .75rem; }
.ram-slots { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.ram-slot { display: flex; flex-direction: column; align-items: center; gap: .35rem; min-width: 46px; }

.ram-slot-stick {
    width: 22px;
    height: 86px;
    border-radius: 5px;
    border: 2px dashed var(--ns-border);
    background: transparent;
}

[data-bs-theme="dark"] .ram-slot-stick { border-color: #334155; }

.ram-slot.used .ram-slot-stick {
    border: 0;
    background:
        repeating-linear-gradient(180deg, rgba(255, 255, 255, .28) 0 5px, transparent 5px 12px) center / 8px 70% no-repeat,
        linear-gradient(180deg, var(--ns-primary), #06b6d4);
    box-shadow: 0 4px 14px rgba(79, 70, 229, .35);
}

.ram-slot-size { font-size: .78rem; font-weight: 600; color: var(--ns-muted); white-space: nowrap; }
.ram-slot.used .ram-slot-size { color: var(--ns-primary); }
.ram-slot-label { font-size: .78rem; font-weight: 700; font-family: ui-monospace, "Cascadia Code", Consolas, monospace; }
.ram-slot:not(.used) .ram-slot-label { color: var(--ns-muted); font-weight: 500; }

.big-value { font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; }

.empty-state { text-align: center; padding: 3rem 1rem; color: var(--ns-muted); }
.empty-state i { font-size: 2.4rem; display: block; margin-bottom: .75rem; opacity: .6; }
.empty-state p { margin: 0; }
.empty-state .btn { margin-top: 1rem; }

/* Síť: firma ještě neprohledávala (popis a výrazné tlačítko), jinak "Naposledy prohledáno" vedle tlačítka. */
.network-intro .card-body { padding: 2rem; }
.network-intro h2 { font-size: 1.4rem; font-weight: 700; margin: 1rem 0 .5rem; }
.network-intro-lead { font-size: 1.05rem; max-width: 48rem; margin-bottom: 1.25rem; }
.network-intro-points { list-style: none; padding: 0; margin: 0 0 1.5rem; display: grid; gap: .7rem; max-width: 48rem; }
.network-intro-points li { display: flex; gap: .7rem; align-items: flex-start; }
.network-intro-points i { color: var(--ns-primary); font-size: 1.1rem; line-height: 1.4; flex-shrink: 0; }
.network-scan-bar { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.network-last-scan { color: var(--ns-muted); font-weight: 500; }

.list-plain { list-style: none; margin: 0 0 .75rem; padding: 0; }
.list-plain li { padding: .35rem 0; border-bottom: 1px solid var(--ns-border); font-weight: 500; }
.list-plain li:last-child { border-bottom: 0; }

.hint { color: var(--ns-muted); font-size: .825rem; margin: 0; }
.hint i { margin-right: .3rem; }

/* ---------- Formuláře a tlačítka ---------- */
.form-control, .form-select {
    border-radius: 8px;
    border-color: var(--ns-border);
    background-color: var(--ns-surface);
    color: var(--ns-text);
    padding: .55rem .85rem;
}

.form-control-sm { padding: .35rem .7rem; }
/* Výběrová pole: vpravo místo pro šipku (obecné odsazení výš by ho jinak přepsalo a text by zajel pod šipku). */
.form-select { padding-right: 2.25rem; background-position: right .75rem center; }
.form-select-sm { padding: .35rem 2rem .35rem .7rem; background-position: right .6rem center; }
.form-control:focus, .form-select:focus { border-color: var(--ns-primary); box-shadow: 0 0 0 3px var(--ns-primary-soft); background-color: var(--ns-surface); color: var(--ns-text); }
.form-control[readonly] { background-color: var(--ns-surface-2); }
.form-label { font-weight: 500; font-size: .875rem; }
.form-check-input { border-color: #cbd5e1; }
[data-bs-theme="dark"] .form-check-input { border-color: #475569; background-color: var(--ns-surface-2); }
.form-check-input:checked { background-color: var(--ns-primary); border-color: var(--ns-primary); }
.form-check-input:focus { box-shadow: 0 0 0 3px var(--ns-primary-soft); border-color: var(--ns-primary); }
.field-validation-error { font-size: .825rem; }

.btn { border-radius: 8px; font-weight: 600; padding: .5rem 1rem; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.btn-sm { padding: .3rem .7rem; font-size: .825rem; }
.btn-lg { padding: .7rem 1.2rem; font-size: 1rem; }
.btn:focus-visible { box-shadow: 0 0 0 3px var(--ns-primary-soft); }

.btn-primary {
    --bs-btn-bg: var(--ns-primary);
    --bs-btn-border-color: var(--ns-primary);
    --bs-btn-hover-bg: #4338ca;
    --bs-btn-hover-border-color: #4338ca;
    --bs-btn-active-bg: #3730a3;
    --bs-btn-active-border-color: #3730a3;
    --bs-btn-disabled-bg: var(--ns-primary);
    --bs-btn-disabled-border-color: var(--ns-primary);
}

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-color: #0b1120;
    --bs-btn-hover-bg: #a5b4fc;
    --bs-btn-hover-border-color: #a5b4fc;
    --bs-btn-hover-color: #0b1120;
    --bs-btn-active-bg: #c7d2fe;
    --bs-btn-active-border-color: #c7d2fe;
    --bs-btn-active-color: #0b1120;
    --bs-btn-disabled-color: #0b1120;
}

.btn-light {
    --bs-btn-bg: var(--ns-surface);
    --bs-btn-border-color: var(--ns-border);
    --bs-btn-hover-bg: var(--ns-surface-2);
    --bs-btn-hover-border-color: var(--ns-border);
    --bs-btn-active-bg: var(--ns-surface-2);
    --bs-btn-active-border-color: var(--ns-border);
    --bs-btn-color: var(--ns-text);
    --bs-btn-hover-color: var(--ns-text);
    --bs-btn-active-color: var(--ns-text);
}

.btn-outline-primary {
    --bs-btn-color: var(--ns-primary);
    --bs-btn-border-color: var(--ns-primary);
    --bs-btn-hover-bg: var(--ns-primary);
    --bs-btn-hover-border-color: var(--ns-primary);
    --bs-btn-active-bg: var(--ns-primary);
    --bs-btn-active-border-color: var(--ns-primary);
}

.btn-outline-success { --bs-btn-color: var(--ns-success); --bs-btn-border-color: var(--ns-success); --bs-btn-hover-bg: var(--ns-success); --bs-btn-hover-border-color: var(--ns-success); }
.btn-outline-danger { --bs-btn-color: var(--ns-danger); --bs-btn-border-color: var(--ns-danger); --bs-btn-hover-bg: var(--ns-danger); --bs-btn-hover-border-color: var(--ns-danger); }
.btn-outline-secondary { --bs-btn-color: var(--ns-muted); --bs-btn-border-color: var(--ns-border); --bs-btn-hover-bg: var(--ns-surface-2); --bs-btn-hover-border-color: var(--ns-border); --bs-btn-hover-color: var(--ns-text); }
[data-bs-theme="dark"] .btn-outline-success:hover, [data-bs-theme="dark"] .btn-outline-danger:hover { --bs-btn-hover-color: #0b1120; }

.btn-icon {
    width: 34px;
    height: 34px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    border: 0;
    background: transparent;
    color: inherit;
}

.btn-icon:hover { background: var(--ns-surface-2); }

.code-key { font-family: ui-monospace, "Cascadia Code", Consolas, monospace; font-size: .92em; background: var(--ns-surface-2); border: 1px solid var(--ns-border); border-radius: 6px; padding: .1rem .4rem; color: var(--ns-text); word-break: break-all; }
code { color: var(--ns-primary); }

.codes { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: .35rem .75rem; margin: .5rem 0 0; padding: .75rem 1rem; background: var(--ns-surface-2); border: 1px solid var(--ns-border); border-radius: 8px; font-family: ui-monospace, "Cascadia Code", Consolas, monospace; color: var(--ns-text); }

.qr { display: block; background: #fff; padding: .5rem; border-radius: 10px; border: 1px solid var(--ns-border); }

.step-title { display: flex; align-items: center; gap: .6rem; font-size: 1rem; font-weight: 700; margin: 1.5rem 0 .75rem; }
.step-title .step-no { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--ns-primary-soft); color: var(--ns-primary); font-size: .8rem; }

/* ---------- Hlášky ---------- */
.alert { border-radius: 10px; border: 0; display: flex; align-items: flex-start; gap: .6rem; }
.alert > i { margin-top: .1rem; }
.alert > div { min-width: 0; flex: 1; }
.alert-success { --bs-alert-bg: var(--ns-success-soft); --bs-alert-color: var(--ns-success); }
.alert-danger { --bs-alert-bg: var(--ns-danger-soft); --bs-alert-color: var(--ns-danger); }
.alert-warning { --bs-alert-bg: var(--ns-warning-soft); --bs-alert-color: var(--ns-warning); }
.alert-info { --bs-alert-bg: var(--ns-info-soft); --bs-alert-color: var(--ns-info); }
.alert-secondary { --bs-alert-bg: var(--ns-surface-2); --bs-alert-color: var(--ns-muted); border: 1px solid var(--ns-border); }
.alert .form-control { color: var(--ns-text); }

.breadcrumb { --bs-breadcrumb-divider-color: var(--ns-muted); --bs-breadcrumb-item-active-color: var(--ns-muted); }

/* ---------- Přihlášení a další samostatné stránky ---------- */
.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 1.5rem;
    background:
        radial-gradient(1000px 500px at 10% -10%, rgba(99, 102, 241, .18), transparent 60%),
        radial-gradient(800px 500px at 110% 110%, rgba(6, 182, 212, .14), transparent 60%),
        #e9eff8;
}

[data-bs-theme="dark"] .auth-page {
    background:
        radial-gradient(1000px 500px at 10% -10%, rgba(99, 102, 241, .35), transparent 60%),
        radial-gradient(800px 500px at 110% 110%, rgba(6, 182, 212, .25), transparent 60%),
        #0b1120;
}

.auth-wrap { width: 100%; max-width: 420px; }
.auth-wrap.auth-wide { max-width: 560px; }
.auth-card { width: 100%; border: 0; border-radius: 16px; box-shadow: 0 20px 50px rgba(15, 23, 42, .12); }
[data-bs-theme="dark"] .auth-card { box-shadow: 0 25px 60px rgba(0, 0, 0, .35); }
.auth-card .card-body { padding: 2.25rem; }
.auth-card h1 { font-size: 1.35rem; font-weight: 700; margin-bottom: .25rem; }
.auth-lead { color: var(--ns-muted); margin-bottom: 1.5rem; }
.auth-brand { display: block; text-align: center; color: #1b2840; font-family: "Righteous", "Inter", sans-serif; font-size: 2.5rem; font-weight: 400; margin-bottom: 1.25rem; letter-spacing: 0; }
.auth-brand:hover { color: #1b2840; text-decoration: none; }
[data-bs-theme="dark"] .auth-brand,
[data-bs-theme="dark"] .auth-brand:hover { color: #fff; }
.auth-foot { text-align: center; font-size: .875rem; margin-top: 1.5rem; color: #64748b; }
/* Přepínač vzhledu na přihlášení: vpravo nahoře, jako v horní liště konzole. */
.auth-tools { position: fixed; top: 1rem; right: 1.25rem; z-index: 10; display: flex; gap: .5rem; }
.auth-tools .btn-icon { color: #3d4d66; background: rgba(255, 255, 255, .6); border: 1px solid #c3d2e8; }
.auth-tools .btn-icon:hover { color: #1b2840; background: #fff; }
[data-bs-theme="dark"] .auth-tools .btn-icon { color: #94a3b8; background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .1); }
[data-bs-theme="dark"] .auth-tools .btn-icon:hover { color: #e2e8f0; background: rgba(255, 255, 255, .08); }

@media (max-width: 575.98px) {
    .auth-card .card-body { padding: 1.5rem; }
}
.auth-card .card { border: 0; box-shadow: none; }
.auth-card .empty-state { padding: 1rem 0; }

/* Rozdělení fyzického disku (Hardware): pruh s oddíly a seznam. Šířky dílků třídami ns-w-*, malé oddíly part-tiny. */
.check-list li.has-parts { border-bottom: 0; padding-bottom: .4rem; }
.check-list li.part-row { display: block; padding-top: 0; }
.part-bar { display: flex; gap: 3px; height: 22px; border-radius: 7px; overflow: hidden; background: var(--ns-border); }
.part-seg { flex: 0 1 auto; min-width: 6px; height: 100%; }
.part-seg.part-tiny { flex: 0 0 8px; width: 8px; }
.part-system { background: var(--ns-info); }
.part-reserved { background: #94a3b8; }
.part-recovery { background: var(--ns-warning); }
.part-data { background: var(--ns-primary); }
.part-other { background: #cbd5e1; }
[data-bs-theme="dark"] .part-reserved { background: #64748b; }
[data-bs-theme="dark"] .part-other { background: #475569; }
.part-list { list-style: none; margin: .8rem 0 0; padding: 0; font-size: 1rem; }
.part-list li { padding: .45rem 0; }
.check-list .part-list li { display: block; border-bottom: 0; padding: .45rem 0; }
.part-line { display: flex; align-items: center; gap: .5rem; }
.part-dot { width: 12px; height: 12px; border-radius: 3px; flex-shrink: 0; }
.part-name { font-weight: 500; }
.part-size { margin-left: auto; color: var(--ns-muted); white-space: nowrap; }
.part-free { display: flex; align-items: center; gap: 1rem; margin: .45rem 0 0 1.3rem; }
.part-free .mini-bar { flex: 1; }
.part-free span { white-space: nowrap; font-weight: 600; }
.part-free .mini-bar { height: 10px; }

/* Zařízení USB: součásti počítače sbalené pod seznamem připojených (details, bez skriptu). */
.usb-internal { border-top: 1px solid var(--ns-border); }
.usb-internal > summary { padding: .7rem 1.25rem; color: var(--ns-muted); font-size: .85rem; cursor: pointer; }
.usb-internal > summary i { margin-right: .4rem; }
.usb-internal > summary .count { background: var(--ns-surface-2); border: 1px solid var(--ns-border); border-radius: 999px; padding: 0 .45rem; font-size: .78rem; margin-left: .25rem; }
.check-list-sm li { padding-top: .5rem; padding-bottom: .5rem; }
.check-list-sm .check-icon { width: 26px; height: 26px; font-size: .85rem; }
.check-list-sm .check-title { font-weight: 500; font-size: .875rem; }
.usb-internal .check-list { border-top: 1px solid var(--ns-border); }

/* Stav PC: karta "Co je potřeba vyřešit" v Přehledu (barevný proužek podle nejvážnějšího problému). */
.health-card { border-left: 4px solid var(--ns-warning); }
.health-card.is-critical { border-left-color: var(--ns-danger); }
.health-card.is-warning .card-header i { color: var(--ns-warning); }
.health-card.is-critical .card-header i { color: var(--ns-danger); }
.health-list { list-style: none; margin: 0; padding: 0; }
.health-list li { display: flex; align-items: baseline; gap: .75rem; padding: .6rem 1.25rem; border-bottom: 1px solid var(--ns-border); }
.health-list li:last-child { border-bottom: 0; }
.health-list .pill { flex-shrink: 0; min-width: 5.5rem; justify-content: center; }

/* Dlaždice, která zároveň filtruje (Upozornění). */
a.stat-link { color: inherit; text-decoration: none; transition: border-color .15s; }
a.stat-link:hover { border-color: var(--ns-primary); }
a.stat-link.is-active { border-color: var(--ns-primary); box-shadow: 0 0 0 1px var(--ns-primary); }

/* Restart a vypnutí: historie příkazů v detailu PC. */
.command-list { list-style: none; margin: 1rem 0 0; padding: 0; border-top: 1px solid var(--ns-border); }
.command-list li { display: flex; align-items: baseline; gap: .75rem; padding: .5rem 0; border-bottom: 1px solid var(--ns-border); }
.command-list li:last-child { border-bottom: 0; }

/* Ztráta klíče PC: časová osa kroků systému (docs/phase5-key-recovery.md). */
.key-steps { list-style: none; margin: 0 0 .75rem; padding: 0 0 0 1rem; border-left: 2px solid var(--ns-border); }
.key-steps li { display: flex; flex-wrap: wrap; gap: .25rem .75rem; padding: .35rem 0; position: relative; }
.key-steps li::before { content: ""; position: absolute; left: calc(-1rem - 5px); top: .8rem; width: 8px; height: 8px; border-radius: 50%; background: var(--ns-muted); }

/* Seznam PC: tlačítko restart/vypnutí v řádku. */
.row-action { padding: .35rem .65rem; font-size: 1.1rem; line-height: 1; border: 1px solid var(--ns-border); }
.row-action:hover { color: var(--ns-danger); border-color: var(--ns-danger); }
.dropdown-menu .dropdown-item i { margin-right: .5rem; }

/* Naplánovaný restart/vypnutí v detailu PC (se zrušením) a v seznamu PC. */
.scheduled-box { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; padding: .85rem 1rem; margin-bottom: 1rem;
    border: 1px solid var(--ns-warning); border-left-width: 4px; border-radius: 10px; background: var(--ns-warning-soft); }
.scheduled-box .bi { color: var(--ns-warning); margin-right: .25rem; }

/* Kategorie PC od admina (správa pod seznamem PC). */
.category-list { list-style: none; margin: 0; padding: 0; }
.category-list li { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding: .5rem 0; border-bottom: 1px solid var(--ns-border); }
.category-list li:last-child { border-bottom: 0; }
.category-name { max-width: 22rem; }

/* Síť: výběr jedné sítě (zařízení z různých sítí se jinak smíchají). */
.network-filter { display: flex; flex-wrap: wrap; gap: .5rem; }
.network-filter .btn { display: inline-flex; align-items: center; gap: .4rem; }

/* Přesun PC mezi kategoriemi: zaškrtávátka, lišta a přetažení myší (js/move.js). */
.move-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.select-cell { width: 2.5rem; }
tr[draggable="true"] { cursor: grab; }
tr.is-dragged { opacity: .5; }
tbody.drop-target > tr > td { background: var(--ns-info-soft); }
tbody.drop-target > tr.group-row > td { outline: 2px dashed var(--ns-info); outline-offset: -2px; }
/* Pořadí PC ve skupině (js/move.js) a sloupců (js/columns.js): čára, kam se přetahovaný řádek/sloupec vloží. */
tr.drop-before > td { box-shadow: inset 0 3px 0 var(--ns-primary); }
tr.drop-after > td { box-shadow: inset 0 -3px 0 var(--ns-primary); }
th[draggable="true"] { cursor: grab; user-select: none; }
th.is-dragged { opacity: .5; }
th.drop-before { box-shadow: inset 3px 0 0 var(--ns-primary); }
th.drop-after { box-shadow: inset -3px 0 0 var(--ns-primary); }
/* Nastavení přehledu (js/field-order.js): vlevo zobrazené údaje v pořadí sloupců (shora dolů = zleva doprava), vpravo
   nabídka dalších údajů po skupinách. */
.column-settings { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
@media (max-width: 991.98px) { .column-settings { grid-template-columns: minmax(0, 1fr); } }
.column-settings .card-header { display: flex; align-items: center; gap: .5rem; }
.column-preview {
    display: flex; flex-wrap: wrap; gap: .25rem; margin-bottom: 1rem; padding: .5rem; border-radius: .5rem;
    background: var(--ns-surface-2); font-size: .875rem; color: var(--ns-muted);
}
.column-preview span span, .column-preview-fixed { padding: .125rem .5rem; border-radius: .375rem; background: var(--ns-surface); border: 1px solid var(--ns-border); }
.column-preview-fixed { font-weight: 600; color: var(--ns-text); }
.column-preview [data-poradi-nahled] { display: contents; }
.column-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .375rem; }
.column-shown { counter-reset: column; }
.column-row {
    display: flex; align-items: center; gap: .5rem; padding: .375rem .5rem; min-height: 2.75rem;
    border: var(--ns-frame-width) solid var(--ns-border); border-radius: .5rem; background: var(--ns-surface);
}
.column-shown .column-row { cursor: grab; }
.column-row.is-dragged { opacity: .5; }
.column-row.drop-before { box-shadow: 0 -3px 0 var(--ns-primary); }
.column-row.drop-after { box-shadow: 0 3px 0 var(--ns-primary); }
.column-name { flex: 1 1 auto; min-width: 0; padding-left: 1.75em; }
.column-grip { color: var(--ns-muted); }
.column-index { min-width: 1.75rem; text-align: right; font-weight: 600; color: var(--ns-primary); font-variant-numeric: tabular-nums; }
.column-shown .column-index::before { counter-increment: column; content: counter(column) "."; }
.column-actions { display: flex; gap: .25rem; flex: 0 0 auto; }
.column-move, .column-remove { padding: .125rem .375rem; line-height: 1; }
.column-available .column-grip, .column-available .column-index, .column-available .column-move, .column-available .column-remove,
.column-shown .column-add { display: none; }
.column-available .column-row { min-height: 2.5rem; }
.column-empty, .column-group-empty { margin: .5rem 0 0; color: var(--ns-muted); font-size: .9rem; }
.column-group + .column-group { margin-top: 1.25rem; }
.column-group-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .5rem; font-size: 1rem; font-weight: 600; }
.column-settings .card-body > .hint { margin-bottom: 1rem; }
.column-available { display: grid; grid-template-columns: repeat(auto-fill, minmax(17.5rem, 1fr)); }
/* Se skriptem stačí tlačítka Přidat / × (zaškrtávátko zůstává pro odeslání formuláře a pro prohlížeč bez skriptu). */
.column-settings.is-enhanced .column-name .form-check-input { position: absolute; opacity: 0; pointer-events: none; }
.column-settings.is-enhanced .column-name { padding-left: 0; }

/* Vzdálená správa PC (Firma/Vzdalene, js/remote.js) */
.remote-bar { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem; }
.remote-status { font-weight: 600; }
/* Běžící sezení: jen zelená tečka (js/remote.js status). */
.remote-status.is-connected { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; background: var(--ns-success); flex: none; overflow: hidden; font-size: 0; color: transparent; }
.remote-view { position: relative; background: #111; border-radius: .5rem; overflow: hidden; display: flex; justify-content: center; }
.remote-screen { display: block; flex: none; outline: none; } /* velikost nastaví js/remote.js (fit) */
.remote-screen:focus-visible { outline: 2px solid var(--ns-info); }
.remote-cursor { position: absolute; width: 0; height: 0; pointer-events: none; }
.remote-cursor.has-shape { background-size: 100% 100%; background-repeat: no-repeat; }
.remote-cursor.has-shape::before { display: none; }
.remote-cursor::before { content: ""; position: absolute; left: -1px; top: -1px; border-style: solid; border-width: 0 0 14px 9px;
    border-color: transparent transparent transparent #fff; filter: drop-shadow(0 0 1px #000); }
.remote-note { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; border-radius: .4rem;
    background: var(--ns-info-soft); color: var(--ns-info); font-size: .875rem; }
.remote-group { display: inline-flex; flex-wrap: wrap; gap: .25rem; }
/* Cesta spojení (část 15): přímé spojení zeleně, přes server neutrálně; zpoždění a datový tok menším písmem */
.remote-link { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; border-radius: .4rem; font-size: .875rem;
    background: var(--ns-surface-2, rgba(127,127,127,.12)); color: var(--ns-text); white-space: nowrap; }
.remote-link.is-direct { background: var(--ns-success-soft); color: var(--ns-success); }
.remote-link-stats { opacity: .8; font-variant-numeric: tabular-nums; }
.remote-link-stats:empty { display: none; }
.remote-group .bi-star-fill { font-size: .75em; }
.remote-combos .dropdown-item { display: flex; align-items: center; gap: .75rem; }
.remote-combos kbd { min-width: 7.5rem; text-align: center; }
.remote:fullscreen { background: #000; padding: 0; display: flex; flex-direction: column; }
.remote:fullscreen .remote-view { flex: 1 1 auto; min-height: 0; align-items: center; border-radius: 0; }
/* Schránka a soubory (js/remote-files.js): přetahování souborů do obrazu PC a správce souborů (dvě strany jako Supremo) */
.remote-drop { outline: 3px dashed var(--ns-info); outline-offset: -3px; }
.remote-confirm { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .5rem; padding: .2rem .6rem; border-radius: .4rem;
    background: var(--ns-warning-soft); color: var(--ns-text); }
.remote-files { width: min(1280px, 96vw); height: min(860px, 92vh); max-width: none; max-height: none; padding: 1rem;
    border: var(--ns-frame-width) solid var(--ns-frame); border-radius: .75rem; background: var(--ns-surface); color: var(--ns-text); }
.remote-files[open] { display: flex; flex-direction: column; gap: .75rem; }
.remote-files::backdrop { background: rgba(15, 23, 42, .55); }
.remote-files-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.remote-files-title { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1.25rem; font-weight: 600; }
.remote-files-panes { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.remote-pane { display: flex; flex-direction: column; gap: .5rem; min-height: 0; min-width: 0; }
.remote-pane-title { margin: 0; font-size: 1.1rem; font-weight: 600; color: var(--ns-primary); }
.remote-pane-path, .remote-pane-actions, .remote-pane-prompt { display: flex; align-items: center; gap: .5rem; }
.remote-pane-path .form-control { flex: 1 1 auto; min-width: 0; }
.remote-path-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: var(--ns-surface-2); }
.remote-places { flex: 0 0 auto; width: 9.5rem; }
.remote-pane-prompt { flex-wrap: wrap; padding: .5rem; border-radius: .5rem; background: var(--ns-warning-soft); }
.remote-pane-prompt .form-control { flex: 1 1 12rem; width: auto; }
.remote-pane-status { margin: 0; color: var(--ns-muted); }
.remote-table-wrap { flex: 1 1 auto; min-height: 0; overflow: auto; border: 1px solid var(--ns-border); border-radius: .5rem; }
.remote-table { margin: 0; }
.remote-table thead th { position: sticky; top: 0; z-index: 1; background: var(--ns-surface-2); white-space: nowrap; }
.remote-table thead .link-button { font-weight: 600; color: inherit; }
.remote-table th[aria-sort="ascending"] .link-button::after { content: " \25B2"; font-size: .75em; }
.remote-table th[aria-sort="descending"] .link-button::after { content: " \25BC"; font-size: .75em; }
.remote-table tbody tr { cursor: default; user-select: none; }
.remote-table tbody td { white-space: nowrap; }
.remote-table tbody tr.selected > td { background: var(--ns-primary-soft); }
.remote-table tbody tr:focus-visible { outline: 2px solid var(--ns-primary); outline-offset: -2px; }
.remote-file-name { max-width: 22rem; overflow: hidden; text-overflow: ellipsis; }
.remote-file-name .bi { margin-right: .5rem; color: var(--ns-muted); }
.remote-file-name .bi-folder-fill, .remote-file-name .bi-folder-symlink-fill { color: var(--ns-warning); }
.remote-pane-empty { margin: 1rem; color: var(--ns-muted); }
.remote-transfers { max-height: 9rem; overflow: auto; display: flex; flex-direction: column; gap: .25rem;
    border-top: 1px solid var(--ns-border); padding-top: .5rem; }
.remote-transfer { display: grid; grid-template-columns: auto minmax(8rem, 1fr) 10rem minmax(10rem, 1.5fr) auto; align-items: center; gap: .5rem; }
.remote-transfer-name, .remote-transfer-state { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.remote-transfer.done .remote-transfer-state { color: var(--ns-muted); }
.remote-transfer progress { width: 100%; }
@media (max-width: 900px) {
    .remote-files-panes { grid-template-columns: 1fr; overflow: auto; }
    .remote-pane { min-height: 22rem; }
}
/* Tlačítko formuláře vzhledu odkazu (přechod do firmy z profilu Vše: POST, ne odkaz). */
.link-button { background: none; border: 0; padding: 0; font: inherit; text-align: left; cursor: pointer; }
.link-button:hover { text-decoration: underline; }

/* ---------- Okna (Bootstrap modal) a lišta nad tabulkou PC ---------- */
.modal {
    --bs-modal-bg: var(--ns-surface);
    --bs-modal-color: var(--ns-text);
    --bs-modal-border-color: var(--ns-frame);
    --bs-modal-border-width: var(--ns-frame-width);
    --bs-modal-header-border-color: var(--ns-border);
    --bs-modal-footer-border-color: var(--ns-border);
    --bs-modal-border-radius: 12px;
}
.modal-title { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: 1.25rem; font-weight: 600; }
.modal-backdrop { --bs-backdrop-bg: #0f172a; --bs-backdrop-opacity: .55; }
.modal .column-settings .card { box-shadow: none; }
.table-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: .75rem; }
/* Pole formulářů: ve světlém režimu výraznější okraj (jako rámečky oken). */
.form-control, .form-select { border-color: var(--ns-frame); }

/* ---------- Aplikace NetSentinel (stránky /App, docs/desktop-app.md) ---------- */
.aplikace-bar { padding: .75rem 1.5rem; gap: .9rem; }
.aplikace-brand { font-family: "Righteous", "Inter", sans-serif; font-size: 1.5rem; line-height: 1; color: var(--ns-text); white-space: nowrap; }
.aplikace-firma {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    max-width: 18rem;
    padding: .45rem .75rem;
    border-radius: 8px;
    border: 1px solid var(--ns-border);
    background: var(--ns-surface-2);
    color: var(--ns-text);
    font-weight: 600;
    font-size: .9rem;
    font-family: inherit;
}
.aplikace-firma > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.aplikace-firma > i:first-child { color: var(--ns-primary); }
.aplikace-firma > .bi-chevron-expand { color: var(--ns-muted); margin-left: .15rem; }
button.aplikace-firma:hover, button.aplikace-firma:focus-visible { border-color: var(--ns-primary); }
.aplikace-firma.is-static { cursor: default; }
.topbar .search.aplikace-hledat { max-width: 420px; margin-left: 0; }
.aplikace-content { padding: 1.25rem 1.5rem 2rem; }
.aplikace-souhrn { margin-left: auto; display: inline-flex; align-items: center; gap: .5rem; font-weight: 500; font-size: .85rem; color: var(--ns-muted); }
.aplikace-nazev { display: flex; align-items: center; gap: .5rem; flex-wrap: nowrap; white-space: nowrap; }
.aplikace-nazev .dot { margin-right: .1rem; }
.aplikace-nazev .pill { margin-left: 0; }
.aplikace-tabulka td { vertical-align: middle; }
/* Akce u PC: velká tlačítka s textem (Připojit se, Otevřít ve webové konzoli). */
.aplikace-akce-skupina { display: inline-flex; gap: .5rem; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
/* Užší okno: tlačítka pod sebou místo vodorovného posuvníku. */
.aplikace-tabulka > :not(caption) > * > * { padding: .75rem .8rem; }
.aplikace-tabulka .disk-cell { min-width: 140px; }
.aplikace-akce { display: inline-flex; align-items: center; gap: .5rem; padding: .55rem 1rem; font-weight: 600; white-space: nowrap; }
.aplikace-akce i { font-size: 1.1rem; }
.aplikace-prazdne { padding: 2rem 1.25rem; margin: 0; color: var(--ns-muted); text-align: center; }
.aplikace-karta { max-width: 40rem; margin: 2rem auto; }
.aplikace-odhlaseno-ikona { font-size: 2.5rem; color: var(--ns-muted); }
.aplikace-prejmenovat { width: 28px; height: 28px; color: var(--ns-muted); }
.aplikace-prejmenovat:hover, .aplikace-prejmenovat:focus-visible { color: var(--ns-primary); }
.aplikace-uzivatel { display: inline-flex; align-items: center; gap: .5rem; min-width: 0; max-width: 18rem; font-size: .9rem; font-weight: 500; color: var(--ns-text); }
.aplikace-uzivatel-jmeno { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1100px) { .aplikace-uzivatel-jmeno { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }

@media (max-width: 767.98px) {
    .aplikace-bar { flex-wrap: wrap; }
    .topbar .search.aplikace-hledat { order: 3; max-width: none; flex-basis: 100%; }
}

/* Počet nových oznámení u ikony v horní liště (Notifications). */
.ns-badge-count { position: absolute; top: 2px; right: 0; min-width: 1.1rem; height: 1.1rem; padding: 0 .3rem; border-radius: 999px;
  background: var(--bs-danger); color: #fff; font-size: .72rem; font-weight: 600; line-height: 1.1rem; text-align: center; }
/* Okno vzdálené správy v aplikaci (Firm/Remote, _AppLayout bez lišty): obraz PC přes co největší část okna. */
.aplikace-vzdalene .aplikace-content { padding: .25rem .25rem 0; }
/* Okno sezení v aplikaci bez posuvníku stránky: obraz se vejde vždy (fit), posuvník by jen rozkmital velikost obrazu. */
html:has(body.aplikace-vzdalene), body.aplikace-vzdalene { overflow: hidden; }
.aplikace-vzdalene .remote-bar { margin-bottom: .25rem; gap: .35rem; }
.aplikace-vzdalene .remote-view { border-radius: 0; }
.aplikace-vzdalene .alert { margin-bottom: .25rem; }

/* Kompaktní aplikace (přání uživatele 2026-10-20: menší okno jako Supremo, víc PC na obrazovce). Jen stránky aplikace
   (_AppLayout); webová konzole zůstává 16 px. Drobné texty nejméně ~12–13 px. */
html:has(> body.aplikace) { font-size: 14px; }
.aplikace .aplikace-bar { padding: .4rem .75rem; gap: .6rem; }
.aplikace .aplikace-brand { font-size: 1.2rem; }
.aplikace .aplikace-firma { padding: .3rem .6rem; max-width: 14rem; }
.aplikace .topbar .search.aplikace-hledat { max-width: 320px; }
.aplikace .topbar .search.aplikace-hledat .form-control { padding-top: .3rem; padding-bottom: .3rem; }
.aplikace .aplikace-content { padding: .6rem .75rem 1rem; }
.aplikace .aplikace-seznam > .card-header { padding: .5rem .75rem; gap: .5rem; }
.aplikace .aplikace-tabulka > :not(caption) > * > * { padding: .35rem .5rem; }
.aplikace .aplikace-tabulka thead th { font-size: .9rem; }
.aplikace .aplikace-tabulka .device-cell { gap: .5rem; }
.aplikace .aplikace-tabulka .device-icon { width: 28px; height: 28px; border-radius: 7px; font-size: .95rem; }
.aplikace .aplikace-tabulka .device-cell .sub { font-size: .9rem; }
.aplikace .aplikace-tabulka .disk-cell { min-width: 110px; }
.aplikace .aplikace-tabulka .disk-text { margin-bottom: .15rem; }
.aplikace .aplikace-tabulka .pill { font-size: .85rem; }
.aplikace .aplikace-tabulka tr.group-row > td { padding: .3rem .5rem; }
.aplikace .aplikace-akce-skupina { gap: .3rem; flex-wrap: nowrap; }
.aplikace .aplikace-akce { padding: .25rem .6rem; gap: .35rem; font-size: .93rem; }
.aplikace .aplikace-akce i { font-size: 1rem; }
.aplikace-ikona { padding: .25rem .45rem; line-height: 1.2; }
.aplikace .aplikace-prejmenovat { width: 22px; height: 22px; }
.aplikace-obnovit { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; }
.aplikace-souhrn + form { margin-left: .5rem !important; }
.aplikace-skupina-oddel { margin: 0 .35rem; color: var(--ns-muted); }
.aplikace-zjistuji { color: var(--ns-info); animation: ns-otacet 1.2s linear infinite; }
@keyframes ns-otacet { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .aplikace-zjistuji { animation: none; } }

.aplikace-kategorie-pc { width: 28px; height: 28px; color: var(--ns-muted); }

/* Aplikace: PC ve skupině odsazená pod záhlaví kategorie (přání vlastníka 2026-10-20), se svislou čarou pod ikonou
   složky jako ve stromu a výrazným oddělením skupin, ať je hned vidět, kde která kategorie končí. Jen skupiny se záhlavím
   (firma bez kategorií záhlaví nemá). */
.aplikace .aplikace-tabulka tbody.aplikace-skupina-odsazena > tr:not(.group-row) > td:first-child {
  padding-left: 2.6rem;
  background-image: linear-gradient(color-mix(in srgb, var(--ns-muted) 45%, transparent), color-mix(in srgb, var(--ns-muted) 45%, transparent));
  background-size: 2px 100%; background-position: 1.15rem 0; background-repeat: no-repeat; }
.aplikace .aplikace-tabulka tbody.aplikace-skupina-odsazena > tr:not(.group-row):last-child > td:first-child { background-size: 2px 50%; }
.aplikace .aplikace-tabulka tbody + tbody > tr.group-row > td { border-top: 2px solid var(--ns-border); padding-top: .55rem; }
.aplikace .aplikace-tabulka tbody.aplikace-skupina-odsazena > tr:not(.group-row):last-child > td { border-bottom: 0; padding-bottom: .55rem; }

/* Vzdálená správa v celé obrazovce (přání vlastníka 2026-10-20, jako Supremo): lišta se schová a vysune najetím myší
   k hornímu okraji; obraz zabere celou obrazovku. Tenký proužek nahoře ukazuje, kde lišta je. */
.remote-bar-handle { display: none; }
.remote:fullscreen { position: relative; }
.remote:fullscreen .remote-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 5; margin: 0; padding: .4rem .6rem;
  background: rgba(17, 24, 39, .92); color: #e2e8f0; box-shadow: 0 2px 12px rgba(0, 0, 0, .5);
  transform: translateY(-100%); transition: transform .18s ease-out; }
.remote:fullscreen.remote-bar-shown .remote-bar { transform: none; }
.remote:fullscreen .remote-bar-handle { display: block; position: absolute; top: 0; left: 50%; z-index: 4; width: 6rem; height: 6px;
  margin-left: -3rem; border-radius: 0 0 6px 6px; background: rgba(148, 163, 184, .55); }
.remote:fullscreen.remote-bar-shown .remote-bar-handle { display: none; }
/* Měřítko 100 %: obraz ve skutečné velikosti, oblast obrazu se posouvá. */
.remote-view.remote-actual { overflow: auto; justify-content: flex-start; align-items: flex-start; }

/* Síť serveru (Admin/Network): graf provozu po hodinách (SVG z webu, barvy třídami kvůli CSP). */
.net-chart { width: 100%; height: auto; max-height: 220px; display: block; }
.net-chart .net-in, .net-legend.net-in { fill: var(--bs-primary); background: var(--bs-primary); }
.net-chart .net-out, .net-legend.net-out { fill: var(--bs-success); background: var(--bs-success); }
.net-chart .net-axis { fill: var(--ns-muted); font-size: 11px; }
.net-legend { display: inline-block; width: .7rem; height: .7rem; border-radius: 2px; margin-right: .3rem; vertical-align: middle; }

/* Podpora (Support, Admin/Support): počet nepřečtených v menu, konverzace podnětu. */
.sidebar .nav-count { margin-left: auto; min-width: 1.3rem; padding: 0 .4rem; border-radius: 999px; font-size: .75rem; font-weight: 600;
  line-height: 1.3rem; text-align: center; background: var(--ns-primary-soft); color: var(--ns-primary); }
.sidebar .nav-count.nav-count-danger { background: var(--bs-danger); color: #fff; }
.support-list .list-group-item.unread .support-subject { font-weight: 700; }
.support-dot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--ns-primary); flex-shrink: 0; }
.support-messages { display: flex; flex-direction: column; gap: .85rem; }
.support-message { max-width: 85%; padding: .75rem 1rem; border-radius: 12px; border: 1px solid var(--ns-border); background: var(--ns-surface-2); }
.support-message.from-me { align-self: flex-end; background: var(--ns-primary-soft); border-color: transparent; }
.support-message .support-meta { font-size: .8rem; color: var(--ns-muted); margin-bottom: .3rem; }
.support-message .support-body { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
/* Celý řádek podnětu je odkaz (stretched-link na předmětu). */
.support-item { cursor: pointer; }
.support-item:hover { background: var(--ns-surface-2); }
.support-item .support-subject { color: inherit; text-decoration: none; }
.support-item:hover .support-subject { color: var(--ns-primary); }
/* Nabídka aktualizace v aplikaci (App/UpdateAvailable): přes celé okno pod lištou. */
.aplikace-aktualizace { min-height: calc(100vh - 80px); display: grid; place-items: center; padding: 2rem 1.5rem; }
.aplikace-aktualizace-obsah { max-width: 34rem; text-align: center; }
.aplikace-aktualizace-ikona { width: 4.5rem; height: 4.5rem; margin: 0 auto 1.25rem; border-radius: 50%; display: grid; place-items: center;
  background: var(--ns-primary-soft); color: var(--ns-primary); font-size: 2.2rem; }
.aplikace-aktualizace h1 { font-size: 1.6rem; font-weight: 700; margin-bottom: .75rem; }
.aplikace-aktualizace .lead { font-weight: 600; margin-bottom: .5rem; }
.aplikace-aktualizace-tlacitka { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin: 1.5rem 0 1rem; }
.aplikace-aktualizace-tlacitka .btn { display: inline-flex; align-items: center; gap: .5rem; }
.aplikace-aktualizace-stav { min-height: 1.5em; font-weight: 500; margin-bottom: .5rem; }
.aplikace-aktualizace-pozn { font-size: .85rem; color: var(--ns-muted); margin: 0; }
/* Odeslané e-maily (Admin/Mail): adresa celá na jednom řádku (lámat se smí jen extrémně dlouhá), druh se zalomí,
   výsledek s chybou má dost místa (dřív se adresy dělily uprostřed, protože druh se nesměl zalomit). */
.mail-kind { min-width: 9rem; }
.mail-recipient { white-space: nowrap; }
.mail-result { max-width: 26rem; }
.mail-result > div { min-width: 14rem; } /* min-width buňky tabulka nedodrží, obsah ano */
.mail-result .mono { overflow-wrap: anywhere; }

/* Zprávy z webu (Admin/Contact): vyřízené méně výrazně. */
.contact-handled { opacity: .7; }
.contact-body { white-space: pre-wrap; overflow-wrap: anywhere; }
