@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.25o87uqmvr.bundle.scp.css';

/* _content/CommercialsW/Components/Layout/MainLayout.razor.rz.scp.css */
/* ===== App Layout ===== */
.app-layout[b-g4n6geo4q9] {
    min-height: 100vh;
    background: var(--bg-primary, #f0f2f5);
}

/* ===== Top Header ===== */
.app-header[b-g4n6geo4q9] {
    /* min-height (not a fixed height) so the menu bar may wrap onto a second row on narrower screens
       instead of overflowing off the right edge. The brand + header-right stay vertically centred. */
    min-height: 56px;
    /* Broadcast kékes-fekete — a korábbi lila (#2D1A30) végpont kivezetve; a brand a vékony
       magenta alsó élben él tovább, nem a háttérben. */
    background: linear-gradient(135deg, #0B0D12 0%, #141821 100%);
    border-bottom: 2px solid rgba(223, 54, 119, 0.55);
    display: flex;
    align-items: center;
    padding: 0.3rem 1.5rem;
    gap: 1.5rem;
    position: sticky;
    top: 0;
    z-index: 100;
    box-shadow: 0 2px 12px rgba(0,0,0,0.25);
}

.brand[b-g4n6geo4q9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.01em;
    flex-shrink: 0;
}

.brand i[b-g4n6geo4q9] {
    font-size: 1.3rem;
    color: #DF3677;
}

/* Hamburger toggle — hidden on desktop, revealed when the menu bar collapses (<=900px). */
.nav-toggle[b-g4n6geo4q9] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 8px;
    background: rgba(255,255,255,0.08);
    color: #fff;
    font-size: 1.3rem;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s;
}

.nav-toggle:hover[b-g4n6geo4q9] { background: rgba(255,255,255,0.16); }

/* ===== Windows-style Menu Bar ===== */
.menubar[b-g4n6geo4q9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    row-gap: 0.3rem;
    flex: 1;
    /* min-width:0 lets the flex item shrink below its content width, and flex-wrap lets the items flow
       onto a second row instead of running off the right edge (which pushed the page wider than the
       viewport). No overflow is used here on purpose — that would clip the hover dropdowns. */
    min-width: 0;
    flex-wrap: wrap;
}

.menubar-item[b-g4n6geo4q9] {
    position: relative;
}

.menubar-link[b-g4n6geo4q9] {
    color: rgba(255,255,255,0.85);
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.5rem 0.875rem;
    border-radius: 6px;
    transition: all 0.15s;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
    white-space: nowrap;
}

.menubar-link:hover[b-g4n6geo4q9],
.menubar-item.has-dropdown:hover > .menubar-link[b-g4n6geo4q9] {
    color: #fff;
    background: rgba(255,255,255,0.12);
}

/* Aktív ("benne vagyok") állapot — a menü mutatja, HOL jár a user: magenta tint + izzó alsó sáv.
   Erősebb a hovernél, hogy a három állapot (normál / hover / aktív) ránézésre elváljon. */
.menubar-link.on[b-g4n6geo4q9],
.menubar-link.on:hover[b-g4n6geo4q9],
.menubar-item.has-dropdown:hover > .menubar-link.on[b-g4n6geo4q9] {
    position: relative;
    color: #fff;
    background: color-mix(in srgb, var(--accent, #DF3677) 30%, transparent);
}

.menubar-link.on[b-g4n6geo4q9]::after {
    content: "";
    position: absolute;
    left: 0.6rem;
    right: 0.6rem;
    bottom: 1px;
    height: 2px;
    border-radius: 99px;
    background: var(--accent, #DF3677);
    box-shadow: 0 0 8px color-mix(in srgb, var(--accent, #DF3677) 80%, transparent);
}

/* Dropdown menu */
.menubar-dropdown[b-g4n6geo4q9] {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0.25rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: var(--shadow-md);
    min-width: 200px;
    padding: 0.375rem;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.menubar-dropdown.show[b-g4n6geo4q9] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.menubar-dropdown-item[b-g4n6geo4q9] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.875rem;
    border-radius: 6px;
    font-size: 0.8125rem;
    color: var(--text-primary);
    text-decoration: none;
    transition: all 0.15s;
    font-weight: 500;
    cursor: pointer;
}

.menubar-dropdown-item:hover[b-g4n6geo4q9] {
    background: rgba(223,54,119,0.12);
    color: var(--accent);
}

/* Aktív lenyíló-elem: az éppen nyitott oldal a listában is jelölve. */
.menubar-dropdown-item.on[b-g4n6geo4q9] {
    background: color-mix(in srgb, var(--accent, #DF3677) 16%, transparent);
    color: var(--accent);
    font-weight: 650;
}

.menubar-dropdown-item.on i[b-g4n6geo4q9] { opacity: 1; }

.menubar-dropdown-item i[b-g4n6geo4q9] {
    font-size: 0.9rem;
    width: 1.1rem;
    text-align: center;
    opacity: 0.7;
}

/* Grouped "Beállítások" dropdown: section headers, dividers, scroll, active language */
.menubar-dropdown.settings-dropdown[b-g4n6geo4q9] {
    min-width: 260px;
    max-height: 78vh;
    overflow-y: auto;
}

.menubar-dropdown-header[b-g4n6geo4q9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.875rem 0.3rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-secondary);
    opacity: 0.75;
}

.menubar-dropdown-header i[b-g4n6geo4q9] {
    font-size: 0.8rem;
}

.menubar-dropdown-divider[b-g4n6geo4q9] {
    height: 1px;
    background: var(--border);
    margin: 0.375rem 0.25rem;
}

.menubar-dropdown-item.active-lang[b-g4n6geo4q9] {
    color: var(--accent);
    font-weight: 600;
}

.menubar-dropdown-item.active-lang i[b-g4n6geo4q9] {
    opacity: 1;
}

.color-dot[b-g4n6geo4q9] {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* ===== Old header-nav (deprecated) ===== */

.header-nav[b-g4n6geo4q9] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.header-nav-link[b-g4n6geo4q9] {
    color: rgba(255,255,255,0.7);
    text-decoration: none;
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.375rem 0.75rem;
    border-radius: 8px;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.header-nav-link:hover[b-g4n6geo4q9] {
    color: #fff;
    background: rgba(255,255,255,0.1);
}

.header-right[b-g4n6geo4q9] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.header-user-name[b-g4n6geo4q9] {
    color: rgba(255,255,255,0.85);
    font-size: 0.8125rem;
    font-weight: 500;
    white-space: nowrap;
}

.header-icon-btn[b-g4n6geo4q9] {
    position: relative;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: none;
    background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s;
    font-size: 1rem;
}

.header-icon-btn:hover[b-g4n6geo4q9] {
    background: rgba(255,255,255,0.15);
    color: #fff;
}

.notif-dot[b-g4n6geo4q9] {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ef4444;
    border: 2px solid #141821;   /* a fejléc sötét végpontja — a lila kivezetve */
}

.header-avatar[b-g4n6geo4q9] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: linear-gradient(135deg, #DF3677, #F04E8C);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    cursor: pointer;
}

/* ===== Content ===== */
.app-content[b-g4n6geo4q9] {
    /* Full-width: reach the right edge on every monitor (the old max-width:1680 + margin:auto left a
       dark empty band on wide screens and, combined with the header overflow, looked cut off even at
       1600px). The header is full-width too, so the content now lines up with it edge-to-edge. */
    width: 100%;
    padding: 1.5rem;
}

/* ===== Mobile / narrow (<=900px): collapse the hover menu bar into a tap-driven accordion panel =====
   On touch there is no hover, so the desktop hover dropdowns are unreachable. Here the whole menu bar
   drops to its own full-width row (revealed by the hamburger), and each parent expands inline on tap
   (the .show class is toggled by ToggleMenu in MainLayout.razor). Desktop hover behaviour is untouched. */
@media (max-width: 900px) {
    .app-header[b-g4n6geo4q9] {
        flex-wrap: wrap;
        gap: 0.6rem;
        padding: 0.4rem 1rem;
    }

    .nav-toggle[b-g4n6geo4q9] { display: inline-flex; }
    .header-right[b-g4n6geo4q9] { margin-left: auto; }

    .menubar[b-g4n6geo4q9] {
        display: none;
        flex-basis: 100%;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.1rem;
        padding: 0.35rem 0;
        margin-top: 0.15rem;
        border-top: 1px solid rgba(255,255,255,0.1);
    }

    .menubar.open[b-g4n6geo4q9] { display: flex; }

    .menubar-item[b-g4n6geo4q9] { width: 100%; position: static; }

    .menubar-link[b-g4n6geo4q9] {
        width: 100%;
        justify-content: space-between;
        padding: 0.7rem 0.75rem;
        font-size: 0.9rem;
    }

    /* Dropdowns become inline accordions instead of floating cards; shown only when tapped (.show). */
    .menubar-dropdown[b-g4n6geo4q9] {
        position: static;
        display: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border: none;
        border-radius: 0;
        min-width: 0;
        margin: 0 0 0.25rem;
        padding: 0.1rem 0 0.2rem 0.75rem;
        background: transparent;
    }

    .menubar-dropdown.show[b-g4n6geo4q9] { display: block; }
    .menubar-dropdown.settings-dropdown[b-g4n6geo4q9] { max-height: none; overflow: visible; }

    /* On the dark header panel the light dropdown chrome must become light-on-dark to stay readable. */
    .menubar-dropdown-item[b-g4n6geo4q9] { color: rgba(255,255,255,0.85); padding: 0.6rem 0.75rem; }
    .menubar-dropdown-item:hover[b-g4n6geo4q9] { background: rgba(255,255,255,0.12); color: #fff; }
    .menubar-dropdown-header[b-g4n6geo4q9] { color: rgba(255,255,255,0.55); }
    .menubar-dropdown-divider[b-g4n6geo4q9] { background: rgba(255,255,255,0.14); }
}

@media (max-width: 767.98px) {
    .app-header[b-g4n6geo4q9] {
        padding: 0.3rem 1rem;
        gap: 0.6rem;
    }
    .brand span[b-g4n6geo4q9] { display: none; }
    .app-content[b-g4n6geo4q9] { padding: 1rem; }
}

/* ===== In-page friendly error panel (ErrorBoundary) ===== */
.page-error[b-g4n6geo4q9] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 2.5rem 1.5rem;
}

.page-error-card[b-g4n6geo4q9] {
    max-width: 560px;
    width: 100%;
    text-align: center;
    background: var(--surface);
    color: var(--text-primary);
    border: 1px solid var(--border);
    border-top: 4px solid var(--accent);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    padding: 2rem 1.75rem;
}

.page-error-icon[b-g4n6geo4q9] {
    font-size: 2.5rem;
    color: var(--accent);
    line-height: 1;
    margin-bottom: 0.75rem;
}

.page-error-card h2[b-g4n6geo4q9] {
    font-size: 1.25rem;
    margin: 0 0 0.5rem;
    color: var(--text-primary);
}

.page-error-card p[b-g4n6geo4q9] {
    color: var(--text-secondary);
    margin: 0 0 1.25rem;
    line-height: 1.5;
}

.page-error-detail[b-g4n6geo4q9] {
    text-align: left;
    background: var(--bg-primary);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 0.8rem;
    padding: 0.75rem;
    margin: 0 0 1.25rem;
    max-height: 220px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.page-error-actions[b-g4n6geo4q9] {
    display: flex;
    gap: 0.6rem;
    justify-content: center;
    flex-wrap: wrap;
}

.page-error-btn[b-g4n6geo4q9] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1.1rem;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text-primary);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, opacity 0.15s ease;
}

.page-error-btn:hover[b-g4n6geo4q9] { background: var(--bg-primary); }

.page-error-btn.primary[b-g4n6geo4q9] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}

.page-error-btn.primary:hover[b-g4n6geo4q9] { opacity: 0.9; background: var(--accent); }

/* ===== Last-resort Blazor circuit error bar =====
   Blazor toggles this element with an inline `display: block`, so the layout
   must work in normal block flow (no flexbox). */
#blazor-error-ui[b-g4n6geo4q9] {
    background: var(--surface);
    color: var(--text-primary);
    border-top: 3px solid var(--accent);
    box-shadow: 0 -4px 14px rgba(0,0,0,0.35);
    display: none;
    bottom: 0;
    left: 0;
    padding: 0.85rem 1.5rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-size: 0.95rem;
    line-height: 1.8;
}

#blazor-error-ui .reload[b-g4n6geo4q9] {
    color: #fff;
    background: var(--accent);
    padding: 0.4rem 0.9rem;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    margin-left: 0.75rem;
}

#blazor-error-ui .dismiss[b-g4n6geo4q9] {
    cursor: pointer;
    float: right;
    font-size: 1.1rem;
    opacity: 0.7;
}

#blazor-error-ui .dismiss:hover[b-g4n6geo4q9] { opacity: 1; }
/* _content/CommercialsW/Components/Layout/NavMenu.razor.rz.scp.css */
/* unused — menu is in Home.razor */
/* _content/CommercialsW/Components/Pages/Alkalmazasok/Booster.razor.rz.scp.css */
/* ==================================================================================================
   Booster közös beállítások — a lap saját elrendezése.
   Két oszlop, mint az AdminTools panelje: balra a fa és a két szerkesztő, jobbra a fájl-alapú
   beállítások és a számolás-kapcsoló. Keskeny képernyőn egymás alá csúszik.
   ================================================================================================== */

.booster-grid[b-vi8r1q8mkr] {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.booster-col[b-vi8r1q8mkr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

@media (max-width: 1100px) {
    .booster-grid[b-vi8r1q8mkr] { grid-template-columns: minmax(0, 1fr); }
}

.booster-section[b-vi8r1q8mkr] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.9rem;
    font-size: 0.95rem;
    font-weight: 700;
}

.booster-section .bi[b-vi8r1q8mkr] { color: var(--accent); }

/* ── fa ─────────────────────────────────────────────────────────────────────────────────────── */

.booster-tree[b-vi8r1q8mkr],
.booster-tree ul[b-vi8r1q8mkr] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.booster-tree ul[b-vi8r1q8mkr] { padding-left: 1.15rem; }

.booster-tree[b-vi8r1q8mkr] { max-height: 420px; overflow: auto; }

.booster-node[b-vi8r1q8mkr] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.22rem 0.4rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.84rem;
    user-select: none;
}

.booster-node:hover[b-vi8r1q8mkr] { background: color-mix(in srgb, var(--accent) 8%, transparent); }

.booster-node.on[b-vi8r1q8mkr] {
    background: color-mix(in srgb, var(--accent) 16%, transparent);
    font-weight: 600;
}

/* Az alkategória-sor csak megjelenik (az AdminTools sem szerkeszti) — ne csábítson kattintásra. */
.booster-node-readonly[b-vi8r1q8mkr] {
    cursor: default;
    color: var(--text-muted);
}

.booster-node-readonly:hover[b-vi8r1q8mkr] { background: none; }

.booster-caret[b-vi8r1q8mkr] {
    font-size: 0.62rem;
    width: 0.9rem;
    color: var(--text-muted);
    flex: 0 0 auto;
}

.booster-caret:hover[b-vi8r1q8mkr] { color: var(--accent); }

.booster-dot[b-vi8r1q8mkr] {
    width: 11px;
    height: 11px;
    border-radius: 3px;
    border: 1px solid var(--border);
    flex: 0 0 auto;
}

/* ── űrlap ──────────────────────────────────────────────────────────────────────────────────── */

.booster-check[b-vi8r1q8mkr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.7rem 0 0;
    font-size: 0.84rem;
}

.booster-check label[b-vi8r1q8mkr] {
    cursor: pointer;
    margin: 0;
}

.booster-actions[b-vi8r1q8mkr] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

/* 2026-09-27 (TOPIC 4): az űrlap-kártyák törzse .form-stack (app.css) — a mezők (felirat + mező) eddig összeértek.
   A köz a gap-ből jön, ezért a szekciócím, a jelölőnégyzet-sor és a gombsor saját függőleges margója nem
   duplázódhat rá; a gombsor egy hajszálnyival távolabb marad, mint eddig (a gap + 0.15rem ≈ az eddigi 1rem). */
.form-stack > .booster-section[b-vi8r1q8mkr] { margin-bottom: 0; }
.form-stack > .booster-check[b-vi8r1q8mkr] { margin-top: 0; }
.form-stack > .booster-actions[b-vi8r1q8mkr] { margin-top: 0.15rem; }
/* _content/CommercialsW/Components/Pages/Alkalmazasok/Mam.razor.rz.scp.css */
/* ==================================================================================================
   MAM beállítások — a lap saját elrendezése. Fent a fájl és az ütemező állapota, alatta négy kártya:
   életciklus-alapértékek, lomtár-mappák, ütemezett lomtárazás a mai képpel, a fájl-lomtár gondnoka.
   ================================================================================================== */

.mams-head-actions[b-bwbjodm0kk] { display: flex; gap: 0.5rem; align-items: center; }

.mams-status[b-bwbjodm0kk] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-start;
}

.mams-status-item[b-bwbjodm0kk] { min-width: 260px; flex: 1; }

.mams-status-title[b-bwbjodm0kk] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
}

.mams-status-value[b-bwbjodm0kk] { font-size: 0.82rem; }

.mams-status-note[b-bwbjodm0kk] {
    flex-basis: 100%;
    font-size: 0.8rem;
    color: var(--text-muted);
}

.mams-section[b-bwbjodm0kk] {
    margin: 0 0 0.35rem;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.mams-hint[b-bwbjodm0kk] {
    margin: 0 0 0.8rem;
    font-size: 0.8rem;
    color: var(--text-muted);
}

.mams-muted[b-bwbjodm0kk] {
    font-size: 0.74rem;
    color: var(--text-muted);
    margin-top: 0.15rem;
    word-break: break-all;
}

.mams-path[b-bwbjodm0kk] { font-size: 0.8rem; word-break: break-all; }

.mams-table[b-bwbjodm0kk] { width: 100%; }
.mams-table[b-bwbjodm0kk]  input.form-input { max-width: 100%; }

.mams-num[b-bwbjodm0kk] { text-align: right; white-space: nowrap; }

.mams-fields[b-bwbjodm0kk] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
    align-items: flex-end;
}

.mams-fields[b-bwbjodm0kk]  .form-group { margin: 0; min-width: 0; }

.mams-check[b-bwbjodm0kk] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.mams-check[b-bwbjodm0kk]  label { cursor: pointer; margin: 0; }

.mams-kinds[b-bwbjodm0kk] { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; }

.mams-actions[b-bwbjodm0kk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 0.9rem;
}

.mams-rule[b-bwbjodm0kk] { display: flex; flex-direction: column; gap: 0.3rem; min-width: 260px; }

/* Az életciklus-idővonal: Felvétel ▶ Érvényes ▶ Már nem ▶ Törlendő, állapotonként a napokkal. */
.mams-life[b-bwbjodm0kk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.6rem;
}

.mams-life-node[b-bwbjodm0kk] { font-size: 0.8rem; color: var(--text-muted); white-space: nowrap; }

.mams-life-arrow[b-bwbjodm0kk] { color: var(--text-muted); font-size: 0.85rem; }

.mams-life-seg[b-bwbjodm0kk] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
}

.mams-life-seg small[b-bwbjodm0kk] { font-size: 0.74rem; color: var(--text-muted); white-space: nowrap; }

.mams-life-edit[b-bwbjodm0kk] { display: flex; flex-direction: column; gap: 0.4rem; }

.mams-life-row[b-bwbjodm0kk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
}

.mams-life-row[b-bwbjodm0kk]  .life-badge { min-width: 5.2rem; text-align: center; }

.mams-life-lbl[b-bwbjodm0kk] { font-size: 0.8rem; color: var(--text-muted); }

.mams-seg[b-bwbjodm0kk] { display: flex; gap: 0.25rem; }

.mams-rule-in[b-bwbjodm0kk] { display: flex; align-items: center; gap: 0.4rem; }

.mams-days[b-bwbjodm0kk] { width: 6.5rem; }
.mams-date[b-bwbjodm0kk] { width: 11rem; }
/* _content/CommercialsW/Components/Pages/Alkalmazasok/NewMedia.razor.rz.scp.css */
/* ==================================================================================================
   NewMedia beállítások — a lap saját elrendezése.
   Fent a rádióválasztó és a két tár állapota, alatta a fülek (a kanonikus .modal-tabs / .tab-btn),
   fülenként kártyákba rendezett mezőcsoportok. Keskeny képernyőn minden egy oszlopba csúszik.
   ================================================================================================== */

.nm-status[b-4zpmu5udc3] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-start;
}

.nm-status-item[b-4zpmu5udc3] {
    min-width: 220px;
    flex: 1;
}

.nm-status-title[b-4zpmu5udc3] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
}

.nm-status-value[b-4zpmu5udc3] { font-size: 0.82rem; }

.nm-status-note[b-4zpmu5udc3] {
    flex-basis: 100%;
    font-size: 0.8rem;
    color: var(--text-muted);
}

.nm-divergence[b-4zpmu5udc3] { display: block; }
.nm-divergence summary[b-4zpmu5udc3] { cursor: pointer; }

.nm-card[b-4zpmu5udc3] { padding: 0; overflow: hidden; }

.nm-body[b-4zpmu5udc3] { padding-top: 0.9rem; }

.nm-toolbar[b-4zpmu5udc3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
}

.nm-scope[b-4zpmu5udc3] {
    font-size: 0.82rem;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.nm-actions[b-4zpmu5udc3] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.nm-groups[b-4zpmu5udc3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 1rem;
    align-items: start;
}

@media (max-width: 860px) {
    .nm-groups[b-4zpmu5udc3] { grid-template-columns: minmax(0, 1fr); }
}

.nm-group[b-4zpmu5udc3] {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.9rem 1rem 1rem;
    background: var(--surface);
    min-width: 0;
}

.nm-section[b-4zpmu5udc3] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
    font-size: 0.92rem;
    font-weight: 700;
}

.nm-section .bi[b-4zpmu5udc3] { color: var(--accent); }

.nm-fields[b-4zpmu5udc3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.55rem 0.9rem;
    align-items: end;
}

.nm-fields .form-group[b-4zpmu5udc3] { margin: 0; min-width: 0; }

.nm-wide[b-4zpmu5udc3] { grid-column: 1 / -1; }

.nm-check[b-4zpmu5udc3] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    font-size: 0.84rem;
}

.nm-check label[b-4zpmu5udc3] { cursor: pointer; }

.nm-hint[b-4zpmu5udc3] {
    display: block;
    font-size: 0.76rem;
    color: var(--text-muted);
    margin-top: 0.25rem;
}

.nm-runtime[b-4zpmu5udc3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.25rem;
    font-size: 0.84rem;
}

.nm-secret[b-4zpmu5udc3] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.nm-secret .form-input[b-4zpmu5udc3] { flex: 1; min-width: 0; }

.nm-secret-clear[b-4zpmu5udc3],
.nm-mini[b-4zpmu5udc3] {
    padding: 0.3rem 0.5rem;
    line-height: 1;
}

.nm-row-off td[b-4zpmu5udc3] { color: var(--text-muted); }

.nm-target-form[b-4zpmu5udc3] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--border);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Local path setting: the text field + the "Tallózás" button of the shared server-side browser. */
.nm-path[b-4zpmu5udc3] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.nm-path .form-input[b-4zpmu5udc3] { flex: 1; min-width: 0; }

.nm-browse[b-4zpmu5udc3] {
    white-space: nowrap;
    padding: 0.35rem 0.6rem;
}

.nm-picker-field[b-4zpmu5udc3] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-muted);
}
/* _content/CommercialsW/Components/Pages/Alkalmazasok/Rds.razor.rz.scp.css */
/* ==================================================================================================
   RDS beállítások — a lap saját elrendezése.
   Fent a beállítás állapota és a szervíz-mód; alatta balra a szervíz → rádió → kódoló fa, jobbra a
   kiválasztott kódoló fülei (a kanonikus .modal-tabs / .tab-btn). Keskeny képernyőn egy oszlop.
   ================================================================================================== */

.rds-status[b-0ak421qjrz] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-start;
}

.rds-status-item[b-0ak421qjrz] {
    min-width: 240px;
    flex: 1;
}

.rds-status-title[b-0ak421qjrz] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
}

.rds-status-value[b-0ak421qjrz] { font-size: 0.82rem; }

.rds-status-note[b-0ak421qjrz] {
    flex-basis: 100%;
    font-size: 0.8rem;
    color: var(--text-muted);
}

.rds-layout[b-0ak421qjrz] {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

/* Below 1200px the side-by-side editor gets too narrow for its five tabs (the last one scrolled out of sight at 1024px),
   so the tree moves above the editor and both get the full width. */
@media (max-width: 1200px) {
    .rds-layout[b-0ak421qjrz] { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- the tree ---------- */

.rds-tree .card-body[b-0ak421qjrz] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.rds-service[b-0ak421qjrz] {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.7rem 0.75rem 0.75rem;
    background: var(--surface);
    min-width: 0;
}

.rds-service-head[b-0ak421qjrz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.rds-service-head > .bi[b-0ak421qjrz] { color: var(--accent); font-size: 1.05rem; }

.rds-service-title[b-0ak421qjrz] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    line-height: 1.2;
}

.rds-service-title strong[b-0ak421qjrz] {
    font-size: 0.92rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rds-service-kind[b-0ak421qjrz] {
    font-size: 0.66rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted);
}

.rds-counts[b-0ak421qjrz] {
    font-size: 0.74rem;
    color: var(--text-muted);
    white-space: nowrap;
}

.rds-warning[b-0ak421qjrz] {
    font-size: 0.76rem;
    color: var(--warning);
    margin: 0 0 0.45rem;
    display: flex;
    gap: 0.35rem;
}

.rds-radio[b-0ak421qjrz] {
    border-top: 1px dashed var(--border);
    padding: 0.45rem 0 0.15rem;
}

.rds-radio-head[b-0ak421qjrz] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.86rem;
}

.rds-radio-head > .bi[b-0ak421qjrz] { color: var(--text-muted); }

.rds-radio-title[b-0ak421qjrz] {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rds-radio-head .rds-mini[b-0ak421qjrz] { margin-left: auto; }

.rds-radio-sub[b-0ak421qjrz] {
    font-size: 0.76rem;
    color: var(--text-muted);
    margin: 0.15rem 0 0.25rem 1.35rem;
}

.rds-encoder[b-0ak421qjrz] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    width: calc(100% - 1.35rem);
    margin: 0.25rem 0 0 1.35rem;
    padding: 0.38rem 0.55rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 0.8rem;
    text-align: left;
    cursor: pointer;
    min-width: 0;
}

.rds-encoder:hover:not(:disabled)[b-0ak421qjrz] { border-color: var(--accent); }

.rds-encoder.active[b-0ak421qjrz] {
    border-color: var(--accent);
    box-shadow: inset 3px 0 0 var(--accent);
}

.rds-encoder.off[b-0ak421qjrz] { opacity: 0.65; }

.rds-encoder:disabled[b-0ak421qjrz] { cursor: default; }

.rds-encoder-addr[b-0ak421qjrz] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-muted);
}

.rds-chip[b-0ak421qjrz] {
    display: inline-block;
    padding: 0.08rem 0.45rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    /* the canonical filled chip (app.css .chip-on): tinted accent, readable in both themes */
    background: color-mix(in srgb, var(--accent) 16%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 42%, transparent);
    color: var(--accent);
    white-space: nowrap;
}

.rds-chip-off[b-0ak421qjrz] {
    background: transparent;
    color: var(--text-muted);
    border: 1px solid var(--border);
}

.rds-muted[b-0ak421qjrz] { color: var(--text-muted); font-size: 0.8rem; }

.rds-mini[b-0ak421qjrz] {
    padding: 0.25rem 0.45rem;
    line-height: 1;
}

/* ---------- the editor ---------- */

.rds-editor[b-0ak421qjrz] { padding: 0; overflow: hidden; min-width: 0; }

.rds-editor-head[b-0ak421qjrz] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.9rem 1rem 0.6rem;
}

.rds-editor-title[b-0ak421qjrz] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
}

.rds-editor-title .bi[b-0ak421qjrz] { color: var(--accent); }

.rds-actions[b-0ak421qjrz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.rds-inline[b-0ak421qjrz] { margin: 0 1rem 0.6rem; }

.rds-body[b-0ak421qjrz] { padding-top: 0.9rem; }

.rds-groups[b-0ak421qjrz] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1rem;
    align-items: start;
}

@media (max-width: 760px) {
    .rds-groups[b-0ak421qjrz] { grid-template-columns: minmax(0, 1fr); }
}

.rds-group[b-0ak421qjrz] {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.9rem 1rem 1rem;
    background: var(--surface);
    min-width: 0;
}

.rds-section[b-0ak421qjrz] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
    font-size: 0.92rem;
    font-weight: 700;
}

.rds-section .bi[b-0ak421qjrz] { color: var(--accent); }

.rds-fields[b-0ak421qjrz] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.55rem 0.9rem;
    align-items: end;
}

.rds-fields .form-group[b-0ak421qjrz] { margin: 0; min-width: 0; }

.rds-check[b-0ak421qjrz] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    font-size: 0.84rem;
}

.rds-check label[b-0ak421qjrz] { cursor: pointer; }

.rds-wide-check[b-0ak421qjrz] { grid-column: 1 / -1; }

.rds-wide-check .rds-hint[b-0ak421qjrz] { flex-basis: 100%; margin-top: 0; padding-left: 1.6rem; }

.rds-hint[b-0ak421qjrz] {
    display: block;
    font-size: 0.76rem;
    color: var(--text-muted);
    margin-top: 0.25rem;
}

.rds-commands td[b-0ak421qjrz] { vertical-align: middle; }

.rds-commands .form-input[b-0ak421qjrz] { width: 100%; min-width: 0; }

.rds-row-relevant td:first-child[b-0ak421qjrz] { box-shadow: inset 3px 0 0 var(--accent); }

/* ---------- Magic RDS import ---------- */

/* The file zone: the input covers the whole box, so a dropped file lands without script (same as the phonebook import). */
.rds-drop[b-0ak421qjrz] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    min-height: 4.5rem;
    padding: 0.9rem;
    border: 2px dashed var(--border);
    border-radius: 10px;
    color: var(--text-muted);
    cursor: pointer;
    text-align: center;
    font-size: 0.86rem;
}

.rds-drop:hover[b-0ak421qjrz],
.rds-drop.has-file[b-0ak421qjrz] { border-color: var(--accent); color: var(--text-primary); }

.rds-drop .bi[b-0ak421qjrz] { font-size: 1.5rem; color: var(--accent); }

.rds-drop input[type="file"][b-0ak421qjrz] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

.rds-import-head[b-0ak421qjrz] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    margin: 0.8rem 0 0.4rem;
    font-size: 0.86rem;
}

.rds-import-warn[b-0ak421qjrz] { margin: 0.4rem 0; }

.rds-import-table[b-0ak421qjrz] {
    max-height: 46vh;
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.rds-import-table table[b-0ak421qjrz] { margin: 0; font-size: 0.8rem; }

.rds-import-table td code[b-0ak421qjrz] { font-size: 0.76rem; }
/* "stays on the encoder" rows of the import preview, and disabled encoders in the tree */
.rds-row-off td[b-0ak421qjrz] { color: var(--text-muted); }
/* ---------- the import call-to-action in the status bar ---------- */
.rds-import-cta[b-0ak421qjrz] { display: flex; flex-direction: column; gap: 0.35rem; }
.rds-import-cta .btn[b-0ak421qjrz] { align-self: flex-start; }

/* ---------- live 42NET Service status (its :5091 /status.json) under a service head ---------- */
.rds-live[b-0ak421qjrz] {
    position: relative;
    margin: 0 0 0.55rem;
    padding: 0.5rem 2.2rem 0.5rem 0.65rem;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--surface-alt, var(--surface)) 70%, transparent);
    font-size: 0.78rem;
}

.rds-live.ok[b-0ak421qjrz] { border-color: color-mix(in srgb, var(--success) 45%, transparent); }
.rds-live.ok .rds-live-head .bi[b-0ak421qjrz] { color: var(--success); }
.rds-live.warn[b-0ak421qjrz] { border-color: color-mix(in srgb, var(--warning) 55%, transparent); }
.rds-live.warn .rds-live-head .bi[b-0ak421qjrz] { color: var(--warning); }
.rds-live.off[b-0ak421qjrz] { border-color: color-mix(in srgb, var(--danger) 45%, transparent); color: var(--danger); }

.rds-live-head[b-0ak421qjrz] { display: flex; justify-content: space-between; gap: 0.6rem; flex-wrap: wrap; }
.rds-live-drivers[b-0ak421qjrz] { margin-top: 0.25rem; }
.rds-live-line[b-0ak421qjrz] { margin-top: 0.2rem; word-break: break-word; }
.rds-live-line code[b-0ak421qjrz] { font-size: 0.72rem; margin-right: 0.3rem; }
.rds-live-line.err[b-0ak421qjrz] { color: var(--danger); }
.rds-live-line.match[b-0ak421qjrz] { color: var(--success); }
.rds-live-line.stale[b-0ak421qjrz] { color: var(--warning); }
.rds-live-line .bi[b-0ak421qjrz] { margin-right: 0.25rem; }
.rds-live-log-title[b-0ak421qjrz] { margin-top: 0.45rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.75; }
.rds-live-line .bi[b-0ak421qjrz] { margin-right: 0.25rem; }
.rds-live-log-title[b-0ak421qjrz] { margin-top: 0.45rem; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.75; }
.rds-live > .rds-mini[b-0ak421qjrz] { position: absolute; top: 0.4rem; right: 0.4rem; }
.rds-live-body[b-0ak421qjrz] { min-width: 0; }
/* _content/CommercialsW/Components/Pages/Alkalmazasok/Streamer.razor.rz.scp.css */
/* ==================================================================================================
   Streamer beállítások — a lap saját elrendezése (a NewMedia lap mintájára).
   Fent a két tár állapota, alatta a fülek (a kanonikus .modal-tabs / .tab-btn), a fül eszközsorában
   a stream- és a gépválasztó, alatta kártyákba rendezett mezőcsoportok. Keskeny képernyőn minden
   egy oszlopba csúszik.
   ================================================================================================== */

.st-status[b-fgpl68iig6] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: flex-start;
}

.st-status-item[b-fgpl68iig6] {
    min-width: 220px;
    flex: 1;
}

.st-status-title[b-fgpl68iig6] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
}

.st-status-value[b-fgpl68iig6] { font-size: 0.82rem; }

.st-status-note[b-fgpl68iig6] {
    flex-basis: 100%;
    font-size: 0.8rem;
    color: var(--text-muted);
}

.st-divergence[b-fgpl68iig6] { display: block; }
.st-divergence summary[b-fgpl68iig6] { cursor: pointer; }

.st-card[b-fgpl68iig6] { padding: 0; overflow: hidden; }

.st-body[b-fgpl68iig6] { padding-top: 0.9rem; }

.st-toolbar[b-fgpl68iig6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
}

.st-scope[b-fgpl68iig6] {
    font-size: 0.82rem;
    color: var(--text-muted);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.9rem;
}

.st-picker[b-fgpl68iig6] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 220px;
}

.st-picker label[b-fgpl68iig6] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--text-muted);
    white-space: nowrap;
}

.st-picker[b-fgpl68iig6]  .searchable-select { min-width: 180px; }

.st-scope-hint[b-fgpl68iig6] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.st-actions[b-fgpl68iig6] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.st-groups[b-fgpl68iig6] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 1rem;
    align-items: start;
}

@media (max-width: 860px) {
    .st-groups[b-fgpl68iig6] { grid-template-columns: minmax(0, 1fr); }
    .st-picker[b-fgpl68iig6] { min-width: 0; flex: 1 1 100%; }
}

.st-group[b-fgpl68iig6] {
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.9rem 1rem 1rem;
    background: var(--surface);
    min-width: 0;
}

.st-section[b-fgpl68iig6] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
    font-size: 0.92rem;
    font-weight: 700;
}

.st-section .bi[b-fgpl68iig6] { color: var(--accent); }

.st-fields[b-fgpl68iig6] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.55rem 0.9rem;
    align-items: end;
}

.st-fields .form-group[b-fgpl68iig6] { margin: 0; min-width: 0; }

.st-wide[b-fgpl68iig6] { grid-column: 1 / -1; }

.st-check[b-fgpl68iig6] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2rem;
    font-size: 0.84rem;
}

.st-check label[b-fgpl68iig6] { cursor: pointer; }

.st-hint[b-fgpl68iig6] {
    display: block;
    font-size: 0.76rem;
    color: var(--text-muted);
    margin-top: 0.25rem;
}

.st-secret[b-fgpl68iig6] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.st-secret .form-input[b-fgpl68iig6] { flex: 1; min-width: 0; }

.st-secret-clear[b-fgpl68iig6] {
    padding: 0.3rem 0.5rem;
    line-height: 1;
}
/* _content/CommercialsW/Components/Pages/Blokkok/Beosztas.razor.rz.scp.css */
/* ============================================================
   Beosztas.razor.css — Spot-schedule matrix (LENS C "Tactile Spring")
   ------------------------------------------------------------
   Scoped CSS-isolation stylesheet for the Beosztás schedule grid.
   Rows = ad blocks (time slots), columns = days; cells drag-select
   to schedule a campaign into a block on a day.

   Identity: indigo/violet 2027 control-room system. Cells invite
   touch — hover lifts + tints, selection pops with a spring
   (cubic-bezier overshoot) and the check scales in, today's column
   glows, the MA badge softly pulses. All motion is reduced-motion safe.

   Defeats the global .data-grid !important rules (app.css) by
   re-declaring th/td background/padding/font-size/color/border with
   !important and switching to border-collapse:separate so sticky
   freeze cells render clean hairline borders. Works in light + dark
   purely through design tokens (no hardcoded theme colors — only
   subtle rgba overlays/glows on top of tokens).
   ============================================================ */

/* ---- Local spring + timing tokens (component-scoped) ---- */
.schedule-grid[b-q3zz08ueyv] {
    --sched-spring: cubic-bezier(.34, 1.56, .64, 1);   /* overshoot pop */
    --sched-snap: cubic-bezier(.2, .8, .25, 1);        /* quick settle  */
    --sched-hover-tint: rgba(223, 54, 119, .07);
    --sched-row-h: 2.55rem;
}

/* ============================================================
   1. SCROLL VIEWPORT  (.grid-scroll-wrapper)
   The card-body already sets p-0 + overflow-x:auto globally; we
   re-scope it into a true 2-axis sticky viewport with a sane height
   so vertical freeze is meaningful, plus refined thin scrollbars.
   ============================================================ */
.grid-scroll-wrapper[b-q3zz08ueyv] {
    position: relative;
    overflow: auto;
    max-height: calc(100vh - 280px);
    border-radius: 0 0 var(--radius) var(--radius);
    /* Firefox: vastag, jól látható, könnyen megfogható görgetősáv */
    scrollbar-width: auto;
    scrollbar-color: var(--text-muted) var(--bg-primary);
    /* a whisper of inner depth so the frozen edges read as layered */
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border) 55%, transparent);
}

/* Keyboard a11y: the wrapper is tabindex=0 — give it a crisp focus ring. */
.grid-scroll-wrapper:focus-visible[b-q3zz08ueyv] {
    outline: 2px solid var(--accent);
    outline-offset: -2px;
    box-shadow: inset 0 0 0 1px var(--accent),
                0 0 0 4px rgba(223, 54, 119, .15);
}

/* Refined WebKit scrollbars (scoped) */
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar {
    width: 18px;
    height: 18px;
}
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar-track {
    background: var(--bg-primary);
    border-radius: 8px;
}
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar-thumb {
    background: var(--text-muted);
    border-radius: 9px;
    border: 2px solid var(--bg-primary);   /* a fogantyú jól elkülönül a csatornától, de vastag marad */
    background-clip: padding-box;
    min-height: 40px;                       /* kényelmes fogófelület függőlegesen */
    min-width: 40px;                        /* és vízszintesen */
}
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar-thumb:hover {
    background: var(--accent);
    background-clip: padding-box;
}
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar-thumb:active {
    background: var(--accent2);
    background-clip: padding-box;
}
.grid-scroll-wrapper[b-q3zz08ueyv]::-webkit-scrollbar-corner {
    background: var(--bg-primary);
}

/* ============================================================
   2. THE GRID TABLE  (.schedule-grid)
   border-collapse:separate is MANDATORY so sticky cells keep their
   own borders (collapsed borders bleed under sticky layers).
   ============================================================ */
.schedule-grid[b-q3zz08ueyv] {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100%;                 /* töltse ki a helyet — a nap-oszlopok osztoznak a maradékon, nincs holt tér */
    table-layout: fixed;
    background: var(--surface);
    /* selection should never paint the OS blue highlight on a drag-select */
    -webkit-user-select: none;
    user-select: none;
}

/* ============================================================
   3. HEADER ROW  (sticky top)  — defeat .data-grid th !important
   ============================================================ */
.schedule-grid thead th[b-q3zz08ueyv] {
    position: sticky;
    top: 0;
    z-index: 3;                                  /* header row above body cells (z1) + first col (z2) */
    background: var(--bg-primary) !important;
    color: var(--text-secondary) !important;
    font-size: .7rem !important;
    font-weight: 600 !important;
    padding: .45rem .5rem !important;
    border-bottom: 1px solid var(--border) !important;
    text-align: center;
    text-transform: none;
    letter-spacing: 0;
    box-shadow: 0 1px 0 0 var(--border);         /* hairline that survives sticky overlap */
}

/* ---- Top-left frozen corner: HIGHEST layer (over header + first col) ---- */
.schedule-corner[b-q3zz08ueyv] {
    position: sticky;
    left: 0;
    top: 0;
    z-index: 6 !important;
    background: var(--bg-primary) !important;
    color: var(--text-muted) !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
    text-transform: uppercase;
    text-align: left !important;
    padding: .45rem .85rem !important;
    width: 11rem;                /* fix blokk-oszlop szélesség (fixed layout: a thead határozza meg) */
    /* double hairline (right + bottom) so the corner crisply frames both frozen edges */
    border-right: 1px solid var(--border) !important;
    box-shadow: 1px 0 0 0 var(--border), 0 1px 0 0 var(--border);
}

/* ---- Day column header (clickable) ---- */
.schedule-day-head[b-q3zz08ueyv] {
    cursor: pointer;
    min-width: 3.1rem;
    white-space: nowrap;
    transition: background-color .12s var(--sched-snap),
                color .12s var(--sched-snap),
                box-shadow .12s var(--sched-snap);
}

.schedule-day-head:hover[b-q3zz08ueyv] {
    background: color-mix(in srgb, var(--accent) 12%, var(--bg-primary)) !important;
    color: var(--text-primary) !important;
}
.schedule-day-head:active[b-q3zz08ueyv] {
    background: color-mix(in srgb, var(--accent) 20%, var(--bg-primary)) !important;
}

/* date + day-of-week stack inside the header */
.schedule-head-date[b-q3zz08ueyv] {
    display: block;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: .8rem;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: .01em;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.schedule-head-dow[b-q3zz08ueyv] {
    display: block;
    margin-top: 1px;
    font-size: .62rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .03em;
    color: var(--text-muted);
    text-transform: uppercase;
}

/* VB6-örökség: a nap-fejléc darabszám-sora ("N sug.") — szürke alapon sárga, mint a varázsló-rácsban. */
.schedule-head-count[b-q3zz08ueyv] {
    display: block;
    width: max-content;
    margin: 2px auto 0;
    padding: 0 6px;
    border-radius: 8px;
    font-size: .64rem;
    font-weight: 700;
    line-height: 1.35;
    font-variant-numeric: tabular-nums;
    color: #facc15;
    background: #4b5563;
}

/* ---- TODAY column header: accent highlight + soft glow ---- */
.schedule-head-today[b-q3zz08ueyv] {
    background: linear-gradient(180deg,
                color-mix(in srgb, var(--accent) 22%, var(--bg-primary)),
                color-mix(in srgb, var(--accent) 12%, var(--bg-primary))) !important;
    border-bottom: 2px solid var(--accent) !important;
    box-shadow: 0 1px 0 0 var(--accent),
                inset 0 -8px 14px -10px var(--accent);
}
.schedule-head-today .schedule-head-date[b-q3zz08ueyv] { color: var(--accent); }
.schedule-head-today .schedule-head-dow[b-q3zz08ueyv] {
    color: color-mix(in srgb, var(--accent) 70%, var(--text-secondary));
}
.schedule-head-today:hover[b-q3zz08ueyv] {
    background: linear-gradient(180deg,
                color-mix(in srgb, var(--accent) 30%, var(--bg-primary)),
                color-mix(in srgb, var(--accent) 18%, var(--bg-primary))) !important;
}

/* ---- WEEKEND column header: muted/neutral ---- */
.schedule-head-weekend[b-q3zz08ueyv] {
    background: color-mix(in srgb, var(--text-muted) 9%, var(--bg-primary)) !important;
}
.schedule-head-weekend .schedule-head-date[b-q3zz08ueyv] { color: var(--text-secondary); }

/* ---- 'MA' (today) pill badge: glowing + soft pulse ---- */
.schedule-head-today-badge[b-q3zz08ueyv] {
    display: inline-block;
    margin-top: 3px;
    padding: 1px 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--accent), var(--accent2));
    color: #fff;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: .56rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .08em;
    box-shadow: 0 0 0 0 rgba(223, 54, 119, .55);
    animation: sched-ma-pulse-b-q3zz08ueyv 2.4s ease-in-out infinite;
}

@keyframes sched-ma-pulse-b-q3zz08ueyv {
    0%, 100% { box-shadow: 0 0 0 0 rgba(223, 54, 119, .45),
                            0 1px 4px rgba(223, 54, 119, .35); }
    50%      { box-shadow: 0 0 0 5px rgba(223, 54, 119, 0),
                            0 1px 7px rgba(240, 78, 140, .5); }
}

/* ============================================================
   4. FIRST COLUMN — block head (sticky left)  — defeat .data-grid td
   ============================================================ */
.schedule-block-head[b-q3zz08ueyv] {
    position: sticky;
    left: 0;
    z-index: 2;                                  /* above normal cells, below header row */
    background: var(--surface) !important;       /* OPAQUE so cells don't bleed through */
    color: var(--text-primary) !important;
    cursor: pointer;
    width: 11rem;
    padding: .35rem .85rem !important;
    font-size: .8125rem;
    border-right: 1px solid var(--border) !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: 1px 0 0 0 var(--border);         /* clean right freeze edge */
    transition: background-color .12s var(--sched-snap);
}

.schedule-block-head:hover[b-q3zz08ueyv] {
    background: color-mix(in srgb, var(--accent) 8%, var(--surface)) !important;
}
.schedule-block-head:active[b-q3zz08ueyv] {
    background: color-mix(in srgb, var(--accent) 14%, var(--surface)) !important;
}

/* time — Rubik, bold, tabular */
.schedule-block-time[b-q3zz08ueyv] {
    display: block;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: .01em;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

/* title — muted, single-line ellipsis */
.schedule-block-title[b-q3zz08ueyv] {
    display: block;
    margin-top: 1px;
    max-width: 9.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .68rem;
    font-weight: 500;
    line-height: 1.2;
    color: var(--text-muted);
}

/* múltbeli (elment) blokk — nem lehet bele új spotot tenni */
.schedule-past[b-q3zz08ueyv] {
    opacity: .45;
    cursor: not-allowed;
    background-image: repeating-linear-gradient(45deg,
        transparent, transparent 5px,
        color-mix(in srgb, var(--text-muted) 9%, transparent) 5px,
        color-mix(in srgb, var(--text-muted) 9%, transparent) 10px);
}

/* meglévő elhelyezés, aminek a kijelölését levetted => Mentéskor törlődik */
.schedule-remove[b-q3zz08ueyv] {
    box-shadow: inset 0 0 0 2px #ef4444;
}

/* 2026-10-10 (állomás-kérés): kategória-ütközés a RAKÁS pillanatában — a kijelölt új cella narancs keretet és
   bal felső sarkában nyolcszög-jelet kap, ha a blokkban már van ugyanilyen besorolású másik reklám.
   A túltöltés (piros inline keret) erősebb, az felülírja. */
.schedule-cell.schedule-catclash[b-q3zz08ueyv] {
    box-shadow: inset 0 0 0 2px var(--warning, #f59e0b);
}
.schedule-catclash-ico[b-q3zz08ueyv] {
    position: absolute;
    top: 2px;
    left: 3px;
    font-size: .6rem;
    color: var(--warning, #f59e0b);
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .35));
}
.schedule-catclash-chip[b-q3zz08ueyv] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .08rem .55rem;
    border-radius: 999px;
    font-size: .74rem;
    color: var(--warning, #f59e0b);
    background: color-mix(in srgb, var(--warning, #f59e0b) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--warning, #f59e0b) 45%, transparent);
    white-space: nowrap;
}

/* ezen a napon nincs ilyen (a kampány típusának megfelelő) blokk — a cella üres, nem jelölhető
   (VB6: a varázsló-rács üres cellája). Tömör, tompa kitöltés, a „kattints ide" pöttye nélkül. */
.schedule-cell.schedule-noblock[b-q3zz08ueyv] {
    cursor: not-allowed;
    background: color-mix(in srgb, var(--text-muted) 16%, var(--surface)) !important;
    background-image: none !important;
    box-shadow: none;
}
.schedule-cell.schedule-noblock:hover[b-q3zz08ueyv],
.schedule-cell.schedule-noblock:active[b-q3zz08ueyv] {
    transform: none;
    box-shadow: none;
    background-color: color-mix(in srgb, var(--text-muted) 16%, var(--surface)) !important;
}
.schedule-cell.schedule-noblock[b-q3zz08ueyv]::before {
    content: "";
    position: absolute;
    left: 30%;
    right: 30%;
    top: 50%;
    border-top: 1px solid color-mix(in srgb, var(--text-muted) 55%, transparent);
}
/* régi elhelyezés egy olyan blokkban, amely a nap rendjében nincs: figyelmeztető keret, levehető */
.schedule-cell.schedule-noblock.schedule-existing-mark[b-q3zz08ueyv] {
    box-shadow: inset 0 0 0 2px #f59e0b;
}

/* block-type colour dot — matches the swatch used in the other dispo views */
.schedule-block-swatch[b-q3zz08ueyv] {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}

/* ============================================================
   5. SCHEDULE CELLS  (.schedule-cell)  — defeat .data-grid td
   Default: faint, invites clicking; crisp row/column separation.
   ============================================================ */
.schedule-cell[b-q3zz08ueyv] {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    width: 3.1rem;
    min-width: 3.1rem;
    height: var(--sched-row-h);
    padding: 0 !important;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background: var(--surface) !important;
    color: var(--text-secondary) !important;
    border-right: 1px solid color-mix(in srgb, var(--border) 60%, transparent) !important;
    border-bottom: 1px solid var(--border) !important;
    /* a faint dotted "drop target" affordance, centered, idle */
    background-image: radial-gradient(circle at center,
                      color-mix(in srgb, var(--text-muted) 28%, transparent) 1.1px,
                      transparent 1.4px);
    background-size: 100% 100%;
    background-position: center;
    transition: background-color .1s var(--sched-snap),
                box-shadow .1s var(--sched-snap),
                transform .12s var(--sched-snap);
    /* keep transform crisp & contained without per-cell will-change */
    transform: translateZ(0);
}

/* Hover: gentle lift + accent tint (compositor-friendly translate/scale). */
.schedule-cell:hover[b-q3zz08ueyv] {
    background-color: var(--sched-hover-tint) !important;
    background-image: radial-gradient(circle at center,
                      color-mix(in srgb, var(--accent) 55%, transparent) 2px,
                      transparent 2.4px);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 32%, transparent),
                0 2px 8px -4px rgba(223, 54, 119, .45);
    transform: translateY(-1px) scale(1.015);
    z-index: 2;
}
.schedule-cell:active[b-q3zz08ueyv] {
    transform: translateY(0) scale(.97);
    transition-duration: .06s;
}

/* Neutralize the global .data-grid tr:hover row tint so per-CELL hover wins. */
.schedule-grid tbody tr:hover[b-q3zz08ueyv] {
    background: transparent !important;
}

/* ---- WEEKEND cell: subtle warm/neutral tint ---- */
.schedule-cell-weekend[b-q3zz08ueyv] {
    background-color: color-mix(in srgb, #f59e0b 5%, var(--surface)) !important;
}
.schedule-cell-weekend:hover[b-q3zz08ueyv] {
    background-color: color-mix(in srgb, var(--accent) 7%, color-mix(in srgb, #f59e0b 6%, var(--surface))) !important;
}

/* ============================================================
   6. EXISTING MARK  (.schedule-existing-mark)
   ALREADY persisted previously — calmer than 'selected': an accent
   ring + left rail + corner dot. Co-occurs with .schedule-selected.
   ============================================================ */
.schedule-existing-mark[b-q3zz08ueyv] {
    background-color: color-mix(in srgb, var(--accent) 9%, var(--surface)) !important;
    box-shadow: inset 3px 0 0 0 color-mix(in srgb, var(--accent2) 80%, var(--accent)),
                inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
    background-image: none;
}
/* corner dot marking persisted state */
.schedule-existing-mark[b-q3zz08ueyv]::after {
    content: "";
    position: absolute;
    top: 4px;
    right: 4px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--accent2);
    box-shadow: 0 0 4px color-mix(in srgb, var(--accent2) 70%, transparent);
}
.schedule-existing-mark:hover[b-q3zz08ueyv] {
    background-color: color-mix(in srgb, var(--accent) 14%, var(--surface)) !important;
}

/* ============================================================
   7. SELECTED NOW  (.schedule-selected) — strongest signal.
   Bold filled accent->accent2 gradient + spring pop + white check.
   ============================================================ */
.schedule-selected[b-q3zz08ueyv] {
    background-color: var(--accent) !important;
    background-image: linear-gradient(135deg, var(--accent), var(--accent2)) !important;
    color: #fff !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18),
                0 3px 10px -4px rgba(223, 54, 119, .65);
    animation: sched-pop-b-q3zz08ueyv .18s var(--sched-spring);
    z-index: 2;
}
.schedule-selected:hover[b-q3zz08ueyv] {
    background-image: linear-gradient(135deg,
                      color-mix(in srgb, var(--accent) 88%, #fff),
                      color-mix(in srgb, var(--accent2) 88%, #fff)) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3),
                0 5px 14px -4px rgba(240, 78, 140, .75);
    transform: translateY(-1px) scale(1.03);
}

/* selected + existing together: keep the filled look, add an outer ring
   so its "persisted" lineage still reads. */
.schedule-selected.schedule-existing-mark[b-q3zz08ueyv] {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22),
                0 0 0 2px color-mix(in srgb, var(--accent2) 55%, transparent),
                0 3px 10px -4px rgba(223, 54, 119, .65);
}
.schedule-selected.schedule-existing-mark[b-q3zz08ueyv]::after { display: none; }

@keyframes sched-pop-b-q3zz08ueyv {
    0%   { transform: scale(.8); }
    60%  { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/* ---- The check icon: scales in with the spring ---- */
.schedule-check[b-q3zz08ueyv] {
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    color: #fff;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .25));
    transform-origin: center;
    animation: sched-check-in-b-q3zz08ueyv .22s var(--sched-spring);
}

@keyframes sched-check-in-b-q3zz08ueyv {
    0%   { transform: scale(0) rotate(-18deg); opacity: 0; }
    55%  { transform: scale(1.25) rotate(4deg); opacity: 1; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}

/* ============================================================
   8. USAGE CHIP  (.schedule-usage)
   Block-fullness % — bottom-right micro chip. Heatmap COLOR comes
   from inline C# style, so we NEVER touch color: only size/weight/
   placement + tabular digits. Sits beneath/with the check.
   ============================================================ */
.schedule-usage[b-q3zz08ueyv] {
    position: absolute;
    right: 3px;
    bottom: 2px;
    padding: 0 3px;
    border-radius: 5px;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: .58rem;
    font-weight: 700;
    line-height: 1.45;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    background: color-mix(in srgb, var(--surface) 78%, transparent);
    backdrop-filter: blur(2px);
    pointer-events: none;
}

/* On a filled (selected) cell the surface-tinted chip would vanish —
   give it a translucent dark plate so the inline heatmap color stays legible. */
.schedule-selected .schedule-usage[b-q3zz08ueyv] {
    background: rgba(15, 23, 42, .32);
    color: #fff !important;          /* override inline heatmap ONLY here for contrast on the gradient */
}

/* 2026-10-10 (állomás-kérés): a százalék ALATT a blokk hossza is ott van (MM:SS.s — töltés, vagy
   kijelölt cellán a várható töltés). Ugyanabban a chipben, két sorban, a chip helye/háttere változatlan;
   a szín a chipé (inline heatmap), így a hossz is a telítettség színét viseli. */
.schedule-usage[b-q3zz08ueyv] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.schedule-usage-pct[b-q3zz08ueyv] {
    line-height: 1.2;
}
.schedule-usage-len[b-q3zz08ueyv] {
    font-size: .54rem;
    font-weight: 600;
    line-height: 1.15;
    letter-spacing: 0;
    opacity: .92;
}

/* ============================================================
   9. REDUCED MOTION — drop transforms/animation, keep state legible
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    .schedule-cell[b-q3zz08ueyv],
    .schedule-day-head[b-q3zz08ueyv],
    .schedule-block-head[b-q3zz08ueyv] {
        transition: background-color .01ms linear, box-shadow .01ms linear;
    }
    .schedule-cell:hover[b-q3zz08ueyv],
    .schedule-selected:hover[b-q3zz08ueyv],
    .schedule-cell:active[b-q3zz08ueyv] {
        transform: none;
    }
    .schedule-selected[b-q3zz08ueyv],
    .schedule-check[b-q3zz08ueyv],
    .schedule-head-today-badge[b-q3zz08ueyv] {
        animation: none;
    }
    /* keep the MA badge readable without the pulse */
    .schedule-head-today-badge[b-q3zz08ueyv] {
        box-shadow: 0 1px 4px rgba(223, 54, 119, .35);
    }
}
/* _content/CommercialsW/Components/Pages/Blokkok/GanttNezet.razor.rz.scp.css */
/* ============================================================
   GanttNezet.razor.css — több-rádiós, kezdési idő szerint
   szinkronizált napi diszpó-létra (scoped CSS-isolation).
   Oszlop = rádió (átrendezhető), sor = blokk-kezdési idő;
   azonos kezdési idő => azonos vízszintes vonal minden oszlopban.
   ============================================================ */

.gantt-wrapper[b-jqtb7vxbxd] {
    position: relative;
    overflow: auto;
    max-height: calc(100vh - 320px);
    scrollbar-width: auto;
    scrollbar-color: var(--text-muted) var(--bg-primary);
}

.gantt-grid[b-jqtb7vxbxd] {
    display: grid;
    width: max-content;
    min-width: 100%;
    background: var(--surface);
    isolation: isolate;
}

/* ---- fejléc ---- */
.gantt-corner[b-jqtb7vxbxd] {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 7;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.5rem 0.5rem;
    background: var(--bg-primary);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.gantt-radio-head[b-jqtb7vxbxd] {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 0.5rem 0.65rem;
    background: var(--bg-primary);
    border-left: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    cursor: grab;
    user-select: none;
    box-shadow: inset 0 -1px 0 var(--border);
    transition: background-color 0.12s ease;
}

.gantt-radio-head:hover[b-jqtb7vxbxd] {
    background: color-mix(in srgb, var(--accent) 9%, var(--bg-primary));
}

.gantt-radio-head:active[b-jqtb7vxbxd] { cursor: grabbing; }
.gantt-dragging[b-jqtb7vxbxd] { opacity: 0.45; }

.gantt-grip[b-jqtb7vxbxd] { color: var(--text-muted); font-size: 0.7rem; margin-right: 0.15rem; }

.gantt-radio-name[b-jqtb7vxbxd] {
    font-family: 'Rubik', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.82rem;
    color: var(--text-primary);
    white-space: nowrap;
}

.gantt-radio-sub[b-jqtb7vxbxd] { font-size: 0.62rem; color: var(--text-muted); }

/* ---- idő-oszlop (bal, ragadós) ---- */
.gantt-time[b-jqtb7vxbxd] {
    position: sticky;
    left: 0;
    z-index: 4;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 0.35rem 0.45rem;
    background: var(--surface);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    font-family: 'Rubik', 'Inter', sans-serif;
    font-weight: 600;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

/* ---- cellák ---- */
.gantt-cell[b-jqtb7vxbxd] {
    display: flex;
    padding: 3px;
    border-left: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    min-width: 0;
}

.gantt-block[b-jqtb7vxbxd] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--surface);
    padding: 4px 7px 5px;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    align-self: flex-start;
    transition: box-shadow 0.12s ease, border-color 0.12s ease;
}

.gantt-block:hover[b-jqtb7vxbxd] {
    box-shadow: var(--shadow-md);
    border-color: color-mix(in srgb, var(--accent) 30%, var(--border));
}

.gantt-block-open[b-jqtb7vxbxd] { box-shadow: var(--shadow-md); }

.gantt-block-chev[b-jqtb7vxbxd] { color: var(--text-muted); font-size: 0.6rem; flex-shrink: 0; }

/* ---- nyitott nézet: blokk tartalma (tételek) ---- */
.gantt-items[b-jqtb7vxbxd] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px dashed var(--border);
    cursor: default;
}

.gantt-item[b-jqtb7vxbxd] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;              /* 2026-10-11 (owner): 10,9 px → 12 px */
    color: var(--text-secondary);
}

.gantt-item-title[b-jqtb7vxbxd] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-primary);
}

.gantt-item-len[b-jqtb7vxbxd] {
    flex-shrink: 0;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

.gantt-item-empty[b-jqtb7vxbxd] { font-style: italic; color: var(--text-muted); justify-content: center; }

.gantt-block-head[b-jqtb7vxbxd] { display: flex; align-items: center; gap: 5px; min-width: 0; }

.gantt-block-title[b-jqtb7vxbxd] {
    /* 2026-10-11 (owner): 12 px minimum, két sorba törhet */
    flex: 1;
    min-width: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 600;
    color: var(--text-primary);
}

.gantt-block-count[b-jqtb7vxbxd] {
    flex-shrink: 0;
    min-width: 18px;
    padding: 1px 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    color: var(--accent);
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.gantt-bar-track[b-jqtb7vxbxd] {
    height: 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 18%, transparent);
    overflow: hidden;
}

.gantt-bar-fill[b-jqtb7vxbxd] { height: 100%; border-radius: 999px; transition: width 0.25s ease; }

.gantt-block-foot[b-jqtb7vxbxd] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 12px;              /* 2026-10-11 (owner): 9,6 px → 12 px */
    line-height: 1.25;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}
.gantt-block-foot > span[b-jqtb7vxbxd] { white-space: nowrap; }

.gantt-empty[b-jqtb7vxbxd] {
    flex: 1;
    border-radius: 7px;
    background: repeating-linear-gradient(45deg,
        transparent, transparent 6px,
        color-mix(in srgb, var(--text-muted) 6%, transparent) 6px,
        color-mix(in srgb, var(--text-muted) 6%, transparent) 12px);
    opacity: 0.5;
}

/* a kiválasztás-sorrend buborék a rádió-gombokon */
.gantt-order-pill[b-jqtb7vxbxd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.25);
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
}

@media (prefers-reduced-motion: reduce) {
    .gantt-radio-head[b-jqtb7vxbxd], .gantt-bar-fill[b-jqtb7vxbxd] { transition: none !important; }
}

/* 2026-10-10: órahatár-sáv (60 perc = egy óra) — az összes rádió-oszlopon átnyúlik, a kezdési idők fölött. */
.gantt-hourband[b-jqtb7vxbxd] {
    grid-column: 1 / -1;
    position: sticky;
    left: 0;
    display: flex;
    align-items: center;
    padding: 0.2rem 0.5rem 0.15rem;
    margin-top: 0.3rem;
    border-top: 2px solid color-mix(in srgb, var(--accent) 45%, var(--border));
    background: color-mix(in srgb, var(--accent) 6%, var(--surface));
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.72rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--accent);
    z-index: 3;
}
/* _content/CommercialsW/Components/Pages/Blokkok/Network.razor.rz.scp.css */
/* ============================================================
   Network.razor.css — hálózati wallok napi idővonalon.
   Oszlop = adó (master kiemelve), sor = óra (0–23, csak ahol van wall).
   Minden wall egy buborék: cél-hossz, reklám-dobozok, szignál-sorok.
   A Gantt nézet vizuális nyelvét követi (scoped CSS-isolation).
   ============================================================ */

.net-wrap[b-5pe4mkfsh4] {
    position: relative;
    overflow: auto;
    max-height: calc(100vh - 300px);
    scrollbar-width: auto;
    scrollbar-color: var(--text-muted) var(--bg-primary);
}

/* A rács a kártya szélességét kapja (definit méret), SOHA nem content-alapút:
   width:max-content alatt a flex-wrap/ellipsis nem érvényesül (a max-content méretezés
   egysorosnak számolja a chipeket és a nowrap címeket), így egy kiegyenlítés-előnézet
   több ezer px-re robbantotta az oszlopokat és vele az egész oldalt. Definit szélességnél
   a minmax() oszlop-korlát kemény: a tartalom törik/ellipszálódik, sok adónál pedig a
   .net-wrap görget vízszintesen — az oldal (body) soha. */
.net-grid[b-5pe4mkfsh4] {
    display: grid;
    width: 100%;
    background: var(--surface);
    isolation: isolate;
}

/* ---- fejléc ---- */
.net-corner[b-5pe4mkfsh4] {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 7;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.5rem;
    background: var(--bg-primary);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
}

.net-head[b-5pe4mkfsh4] {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0.5rem 0.7rem;
    background: var(--bg-primary);
    border-left: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

.net-head-name[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.84rem;
    color: var(--text-primary);
    white-space: nowrap;
}

.net-head-sub[b-5pe4mkfsh4] { font-size: 0.64rem; color: var(--text-muted); }

/* ---- master/slave badge ---- */
.net-badge[b-5pe4mkfsh4] {
    display: inline-flex;
    align-items: center;
    padding: 0 0.4rem;
    height: 15px;
    border-radius: 999px;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-left: 0.25rem;
}

/* A badge tömör, sötét chip színes felirattal — az áttetsző (color-mix) háttér az AKTÍV
   accent-gombon magenta-alapon-magenta lett, olvashatatlanul. Így minden háttéren látszik. */
.net-badge-master[b-5pe4mkfsh4] {
    background: var(--bg-primary);
    border: 1px solid color-mix(in srgb, var(--warning) 45%, transparent);
    color: var(--warning);
}

.net-badge-slave[b-5pe4mkfsh4] {
    background: var(--bg-primary);
    border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent);
    color: var(--accent);
}

/* ---- óra-oszlop (bal, ragadós) ---- */
.net-hour[b-5pe4mkfsh4] {
    position: sticky;
    left: 0;
    z-index: 4;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 0.5rem 0.45rem;
    background: var(--surface);
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    font-family: 'Rubik', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

/* ---- cellák ---- */
.net-cell[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 5px;
    border-left: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    min-width: 0;
}

.net-empty[b-5pe4mkfsh4] {
    flex: 1;
    min-height: 14px;
    border-radius: 7px;
    background: repeating-linear-gradient(45deg,
        transparent, transparent 6px,
        color-mix(in srgb, var(--text-muted) 6%, transparent) 6px,
        color-mix(in srgb, var(--text-muted) 6%, transparent) 12px);
    opacity: 0.4;
}

/* ---- wall buborék ---- */
.net-bubble[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 5px;
    border: 1px solid var(--border);
    border-left: 3px solid var(--accent);
    border-radius: 9px;
    background: var(--surface);
    padding: 7px 9px 8px;
    box-shadow: var(--shadow-sm);
}

.net-bubble-master[b-5pe4mkfsh4] { border-left-color:var(--warning); }

.net-bubble-head[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.net-wno[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 16%, transparent);
    color: var(--accent);
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.64rem;
    font-weight: 700;
}

.net-time[b-5pe4mkfsh4] {
    flex: 1;
    min-width: 0;
    font-size: 0.66rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.net-target[b-5pe4mkfsh4] {
    flex-shrink: 0;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.74rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
}

.net-bar-track[b-5pe4mkfsh4] {
    height: 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 18%, transparent);
    overflow: hidden;
}

.net-bar-fill[b-5pe4mkfsh4] {
    height: 100%;
    border-radius: 999px;
    background: var(--accent);
    transition: width 0.25s ease;
}

.net-bubble-foot[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.62rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
}

.net-ok[b-5pe4mkfsh4] { color: #22c55e; font-weight: 700; }
.net-warn[b-5pe4mkfsh4] { color:var(--warning); font-weight: 700; }

/* ---- chevron + hosszú-műsorsáv jelölés ---- */
.net-chev[b-5pe4mkfsh4] { flex-shrink: 0; font-size: 0.6rem; color: var(--text-muted); }

.net-long-tag[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, #f59e0b 20%, transparent);
    color:var(--warning);
    font-size: 0.56rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.net-bubble-long[b-5pe4mkfsh4] { border-left-color:var(--warning); }

/* ---- a wall tartalma: EGYETLEN időrendi lista, fentről le ---- */
.net-content[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-top: 3px;
    padding-top: 4px;
    border-top: 1px dashed var(--border);
    max-height: 320px;
    overflow-y: auto;
    cursor: default;
}

.net-row[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 4px;
    border-radius: 5px;
    font-size: 0.68rem;
    color: var(--text-secondary);
}

/* CLX-blokk (hírek/időjárás/reklámblokk): összecsukott „doboz", a hossz a lényeg */
.net-row-clx[b-5pe4mkfsh4] {
    background: color-mix(in srgb, #f59e0b 11%, var(--surface));
    border: 1px solid color-mix(in srgb, #f59e0b 30%, transparent);
}

.net-row-clx .net-row-ico[b-5pe4mkfsh4] { color:var(--warning); }
.net-row-clx .net-row-title[b-5pe4mkfsh4] { font-weight: 700; }
.net-row-clx .net-row-len[b-5pe4mkfsh4] { color: var(--text-primary); font-weight: 700; }

.net-row-clx-tag[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, #f59e0b 22%, transparent);
    color:var(--warning);
    font-size: 0.54rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

/* reklám (önálló): kiemelt „dobozos" sor */
.net-row-ad[b-5pe4mkfsh4] {
    background: color-mix(in srgb, var(--accent) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--accent) 26%, transparent);
}

.net-row-ad .net-row-ico[b-5pe4mkfsh4] { color: var(--accent); }
.net-row-ad .net-row-title[b-5pe4mkfsh4] { font-weight: 600; }

/* szignál: könnyű sor */
.net-row-sig .net-row-ico[b-5pe4mkfsh4] { color: var(--text-muted); }

/* zene: halvány */
.net-row-song[b-5pe4mkfsh4] { opacity: 0.65; }
.net-row-song .net-row-ico[b-5pe4mkfsh4] { color: var(--text-muted); }

/* info/óraforduló: leghalványabb */
.net-row-info[b-5pe4mkfsh4] { opacity: 0.55; font-style: italic; }
.net-row-info .net-row-ico[b-5pe4mkfsh4] { color: var(--text-muted); }

.net-row-time[b-5pe4mkfsh4] {
    flex-shrink: 0;
    width: 56px;
    font-size: 0.58rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
}

.net-row-ico[b-5pe4mkfsh4] { flex-shrink: 0; font-size: 0.62rem; }

.net-row-title[b-5pe4mkfsh4] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-primary);
}

.net-row-len[b-5pe4mkfsh4] {
    flex-shrink: 0;
    font-size: 0.6rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
}

/* voice / wav loose items */
.net-row-voice .net-row-ico[b-5pe4mkfsh4] { color: #F04E8C; }
.net-row-wav .net-row-ico[b-5pe4mkfsh4] { color: #38bdf8; }

/* ---- wall nyitó/záró sor (AWS/AWE marker) ---- */
.net-row-wallstart[b-5pe4mkfsh4],
.net-row-wallend[b-5pe4mkfsh4] {
    background: color-mix(in srgb, var(--accent) 14%, var(--surface));
    border: 1px dashed color-mix(in srgb, var(--accent) 40%, transparent);
    font-weight: 700;
}

.net-row-wallstart .net-row-ico[b-5pe4mkfsh4],
.net-row-wallend .net-row-ico[b-5pe4mkfsh4] { color: var(--accent); }

.net-row-wallstart .net-row-title[b-5pe4mkfsh4],
.net-row-wallend .net-row-title[b-5pe4mkfsh4] {
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.62rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.net-row-wallend .net-row-len[b-5pe4mkfsh4] { color: var(--text-primary); font-weight: 700; }

/* ---- óraforduló (CLOCK) elválasztó sor ---- */
.net-row-clock[b-5pe4mkfsh4] {
    background: color-mix(in srgb, var(--text-muted) 10%, transparent);
    border-top: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--text-muted) 22%, transparent);
    margin: 2px 0;
}

.net-row-clock .net-row-ico[b-5pe4mkfsh4] { color: var(--text-secondary); }

.net-row-clock .net-row-title[b-5pe4mkfsh4] {
    font-family: 'Rubik', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 0.64rem;
    color: var(--text-secondary);
    letter-spacing: 0.02em;
}

/* ---- RDS Traffic Announcement jelölés ---- */
.net-row-ta-tag[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, #ef4444 20%, transparent);
    color: #ef4444;
    font-size: 0.52rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

/* ---- Dal-placeholder (Flag='O') — a Player futáskor tölti be a tényleges zenét ---- */
.net-row-placeholder[b-5pe4mkfsh4] { opacity: 0.5; }
.net-row-placeholder .net-row-ico[b-5pe4mkfsh4] { color: var(--text-muted); }
.net-row-placeholder .net-row-title[b-5pe4mkfsh4] { font-style: italic; }

.net-row-ph-tag[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 18%, transparent);
    color: var(--text-secondary);
    font-size: 0.52rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

/* ---- Kitöltő (compact fill) jelölés: legacy GlobalUniqID=2 ill. saját CWFILL sor ---- */
.net-row-fill-tag[b-5pe4mkfsh4] {
    flex-shrink: 0;
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--warning) 18%, transparent);
    color: var(--warning);
    font-size: 0.52rem;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.net-row-fill-own[b-5pe4mkfsh4] {
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    color: var(--accent);
}

/* ---- CLX-blokk altípusok: hír / reklám / normál ---- */
.net-clx-chev[b-5pe4mkfsh4] { flex-shrink: 0; font-size: 0.56rem; color: var(--text-muted); }

/* alapból (normal) a meglévő amber .net-row-clx; az altípusok felülírják a színt */
.net-clx-news[b-5pe4mkfsh4] {
    background: color-mix(in srgb, #38bdf8 12%, var(--surface));
    border-color: color-mix(in srgb, #38bdf8 32%, transparent);
}

.net-clx-news .net-row-ico[b-5pe4mkfsh4] { color: #38bdf8; }

.net-clx-commertials[b-5pe4mkfsh4] {
    background: color-mix(in srgb, var(--accent) 13%, var(--surface));
    border-color: color-mix(in srgb, var(--accent) 30%, transparent);
}

.net-clx-commertials .net-row-ico[b-5pe4mkfsh4] { color: var(--accent); }

.net-clx-tag-news[b-5pe4mkfsh4] { background: color-mix(in srgb, #38bdf8 22%, transparent); color: #38bdf8; }
.net-clx-tag-commertials[b-5pe4mkfsh4] { background: color-mix(in srgb, var(--accent) 22%, transparent); color: var(--accent); }
.net-clx-tag-normal[b-5pe4mkfsh4] { background: color-mix(in srgb, #f59e0b 22%, transparent); color:var(--warning); }

/* ---- CLX kibontott belső tételek ---- */
.net-clx-children[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 1px 0 3px 22px;
    padding-left: 8px;
    border-left: 2px solid color-mix(in srgb, var(--text-muted) 25%, transparent);
}

.net-clx-child[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 1px 4px;
    font-size: 0.64rem;
    color: var(--text-secondary);
}

.net-clx-child-ico[b-5pe4mkfsh4] { flex-shrink: 0; font-size: 0.58rem; color: var(--text-muted); }

.net-clx-child-title[b-5pe4mkfsh4] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.net-clx-child-len[b-5pe4mkfsh4] {
    flex-shrink: 0;
    font-size: 0.56rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
}

/* a kezdő/záró szignál és aláfestés könnyű kiemelése */
.net-clx-child-start .net-clx-child-ico[b-5pe4mkfsh4],
.net-clx-child-end .net-clx-child-ico[b-5pe4mkfsh4] { color: var(--accent); }
.net-clx-child-bed .net-clx-child-ico[b-5pe4mkfsh4] { color: #F04E8C; }

/* ---- kiegyenlítés-előnézet (step 3, csak számol) ---- */
.net-fill[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
    padding: 5px 7px;
    border-radius: 7px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 7%, var(--surface));
}

.net-fill-ok[b-5pe4mkfsh4] { border-color: color-mix(in srgb, #22c55e 40%, transparent); }
.net-fill-warn[b-5pe4mkfsh4] { border-color: color-mix(in srgb, #f59e0b 40%, transparent); }

.net-fill-head[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 0.64rem;
    font-variant-numeric: tabular-nums;
    color: var(--text-secondary);
}

.net-fill-head .bi-magic[b-5pe4mkfsh4] { color: var(--accent); }
.net-fill-head b[b-5pe4mkfsh4] { color: var(--text-primary); }
.net-fill-sep[b-5pe4mkfsh4] { color: var(--text-muted); }

.net-fill-tries[b-5pe4mkfsh4] {
    padding: 0 5px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--text-muted) 18%, transparent);
    color: var(--text-secondary);
    font-size: 0.58rem;
    font-weight: 600;
}

.net-fill-resid[b-5pe4mkfsh4] {
    margin-left: auto;
    font-weight: 700;
    color: var(--text-secondary);
}

.net-fill-ok .net-fill-resid[b-5pe4mkfsh4] { color: #22c55e; }
.net-fill-warn .net-fill-resid[b-5pe4mkfsh4] { color:var(--warning); }

/* A javasolt kitöltők playlist-hű, FÜGGŐLEGES listája (a korábbi vízszintes chip-felhő
   helyett): egy sor = egy szignál, időponttal, ahogy a Playlist/CLX Diszpó mutatná. */
.net-fill-list[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    max-height: 240px;
    overflow-y: auto;
}

.net-fill-row[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 4px;
    border-radius: 5px;
    font-size: 0.66rem;
    background: color-mix(in srgb, var(--accent) 10%, transparent);
    color: var(--text-secondary);
}

.net-fill-row-ico[b-5pe4mkfsh4] { flex-shrink: 0; font-size: 0.62rem; color: var(--accent); }

.net-fill-row-title[b-5pe4mkfsh4] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-primary);
}

/* Distinct (nem ismétlődik aznap) sor-változat */
.net-fill-row-distinct[b-5pe4mkfsh4] { background: color-mix(in srgb, #F04E8C 13%, transparent); }
.net-fill-row-distinct .net-fill-row-ico[b-5pe4mkfsh4] { color: #F04E8C; }

.net-fill-items[b-5pe4mkfsh4] {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}

.net-fill-chip[b-5pe4mkfsh4] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent) 14%, transparent);
    color: var(--text-primary);
    font-size: 0.6rem;
    font-variant-numeric: tabular-nums;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.net-fill-chip .bi[b-5pe4mkfsh4] { color: var(--accent); flex-shrink: 0; }

.net-fill-chip-slot[b-5pe4mkfsh4] {
    flex-shrink: 0;
    min-width: 12px;
    padding: 0 3px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--accent) 30%, transparent);
    color: var(--text-primary);
    font-size: 0.54rem;
    font-weight: 700;
    text-align: center;
}

/* Distinct (nem ismétlődik aznap) — eltérő kiemelés a sima kitöltő-szignáltól */
.net-fill-chip-distinct[b-5pe4mkfsh4] {
    background: color-mix(in srgb, #F04E8C 16%, transparent);
}

.net-fill-chip-distinct .bi[b-5pe4mkfsh4] { color: #F04E8C; }
.net-fill-chip-distinct .net-fill-chip-slot[b-5pe4mkfsh4] { background: color-mix(in srgb, #F04E8C 32%, transparent); }

.net-fill-note[b-5pe4mkfsh4] {
    font-size: 0.62rem;
    font-style: italic;
    color: var(--text-muted);
    overflow-wrap: anywhere;
}

/* ── Writer actions (apply / undo) ── */
.net-write[b-5pe4mkfsh4] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 5px;
}

.net-write-btn[b-5pe4mkfsh4] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    border-radius: 5px;
    border: 1px solid var(--border, #2a2f3a);
    background: var(--surface-2, #1a1d27);
    color: var(--text-secondary);
    font-size: 0.62rem;
    font-weight: 600;
    cursor: pointer;
}

.net-write-btn:hover:not(:disabled)[b-5pe4mkfsh4] { color: var(--text-primary); border-color: var(--accent); }
.net-write-btn:disabled[b-5pe4mkfsh4] { opacity: 0.5; cursor: default; }

.net-write-live-ghost[b-5pe4mkfsh4] { border-color: #ef4444; color: #ef4444; }
.net-write-live[b-5pe4mkfsh4] {
    background: #ef4444;
    border-color: #ef4444;
    color: #fff;
}
.net-write-confirm[b-5pe4mkfsh4] { font-size: 0.62rem; font-weight: 700; color: #ef4444; }
.net-write-busy .bi[b-5pe4mkfsh4] { color: var(--accent); }

.net-write-out[b-5pe4mkfsh4] {
    margin-top: 4px;
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 0.6rem;
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-wrap: anywhere;
}

.net-write-out-ok[b-5pe4mkfsh4] { background: color-mix(in srgb, #22c55e 16%, transparent); color: var(--success); }
.net-write-out-dry[b-5pe4mkfsh4] { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--text-secondary); }
.net-write-out-err[b-5pe4mkfsh4] { background: color-mix(in srgb, #ef4444 16%, transparent); color: #ef4444; }

/* ── Day-health KPI strip ── */
.net-kpi-card[b-5pe4mkfsh4] { margin-bottom: 1rem; padding: 0.6rem 1rem; }

.net-kpi-strip[b-5pe4mkfsh4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.4rem;
    align-items: stretch;
}

.net-kpi[b-5pe4mkfsh4] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 0.2rem 0.9rem 0.2rem 0.6rem;
    border-left: 3px solid var(--accent);
    min-width: 120px;
}

.net-kpi-good[b-5pe4mkfsh4] { border-left-color: #22c55e; }
.net-kpi-warn[b-5pe4mkfsh4] { border-left-color:var(--warning); }
.net-kpi-bad[b-5pe4mkfsh4] { border-left-color: #ef4444; }

.net-kpi-val[b-5pe4mkfsh4] {
    font-family: 'Rubik', 'Inter', sans-serif;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.net-kpi-good .net-kpi-val[b-5pe4mkfsh4] { color: #22c55e; }
.net-kpi-warn .net-kpi-val[b-5pe4mkfsh4] { color:var(--warning); }
.net-kpi-bad .net-kpi-val[b-5pe4mkfsh4] { color: #ef4444; }

.net-kpi-lbl[b-5pe4mkfsh4] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 4px;
}

.net-kpi-lbl .bi[b-5pe4mkfsh4] { color: var(--text-muted); }
.net-kpi-sub[b-5pe4mkfsh4] { font-size: 0.6rem; color: var(--text-muted); }

@media (prefers-reduced-motion: reduce) {
    .net-bar-fill[b-5pe4mkfsh4] { transition: none !important; }
}
/* _content/CommercialsW/Components/Pages/Gyartas/GyartasiLapokStatusz.razor.rz.scp.css */
/* TOPIC 6 (2026-09-27): the status's "záró" (closing) switch in the page header — theme tokens only. */
.gls-closing[b-4xqolmts96] {
    display: flex;
    align-items: center;
}

.gls-closing-toggle[b-4xqolmts96] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.8rem;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--surface);
    color: var(--text-primary);
    font-size: 0.82rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
}

.gls-closing-toggle i[b-4xqolmts96] {
    color: var(--accent);
}
/* _content/CommercialsW/Components/Pages/Home.razor.rz.scp.css */
/* ===== 2027 hero (zeroth) card ===== */
.hero-section[b-0qtevwqi4p] {
    margin-bottom: 1.25rem;
}

.hero-card[b-0qtevwqi4p] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
    padding: 1.4rem 1.6rem;
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(223, 54, 119, 0.16), rgba(240, 78, 140, 0.10)),
        var(--surface);
    border: 1px solid rgba(240, 78, 140, 0.25);
    box-shadow: 0 10px 40px -12px rgba(223, 54, 119, 0.45);
    overflow: hidden;
}

.hero-card[b-0qtevwqi4p]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(1200px 220px at 0% 0%, rgba(223, 54, 119, 0.18), transparent 60%);
    pointer-events: none;
}

.hero-brand[b-0qtevwqi4p] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    position: relative;
}

.hero-logo[b-0qtevwqi4p] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #DF3677, #F04E8C);
    color: #fff;
    font-size: 1.6rem;
    box-shadow: 0 8px 20px -6px rgba(223, 54, 119, 0.7);
}

.hero-title[b-0qtevwqi4p] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--text-primary);
    line-height: 1.1;
}

.hero-subtitle[b-0qtevwqi4p] {
    margin: 0.1rem 0 0;
    font-size: 0.72rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.hero-greeting[b-0qtevwqi4p] {
    flex: 1;
    min-width: 180px;
    position: relative;
}

.hero-hello[b-0qtevwqi4p] {
    font-size: 1.05rem;
    color: var(--text-primary);
    font-weight: 500;
}

.hero-meta[b-0qtevwqi4p] {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
    position: relative;
}

.hero-chip[b-0qtevwqi4p] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.85rem;
    border-radius: 12px;
    background: rgba(127, 127, 127, 0.08);
    border: 1px solid var(--border);
    font-size: 0.85rem;
    color: var(--text-primary);
    backdrop-filter: blur(6px);
    white-space: nowrap;
}

.hero-chip i[b-0qtevwqi4p] {
    color: var(--accent);
}

.hero-wx-emoji[b-0qtevwqi4p] {
    font-size: 1rem;
    line-height: 1;
}

/* Motor City gag tile */
.detroit-chip[b-0qtevwqi4p] {
    gap: 0.55rem;
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(59, 130, 246, 0.14));
    border-color: rgba(59, 130, 246, 0.3);
}

.detroit-chip .detroit-name[b-0qtevwqi4p] {
    font-weight: 700;
    letter-spacing: 0.01em;
}

.detroit-chip .detroit-wx[b-0qtevwqi4p],
.detroit-chip .detroit-time[b-0qtevwqi4p] {
    opacity: 0.92;
    font-variant-numeric: tabular-nums;
}

.detroit-chip .detroit-time[b-0qtevwqi4p] {
    padding-left: 0.55rem;
    border-left: 1px solid var(--border);
}

.live-clock[b-0qtevwqi4p] {
    display: inline-flex;
    gap: 0.55rem;
    align-items: baseline;
}

.live-clock .lc-time[b-0qtevwqi4p] {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.live-clock .lc-date[b-0qtevwqi4p] {
    opacity: 0.85;
}

/* ===== 2027 account (last) card ===== */
.account-section[b-0qtevwqi4p] {
    margin-top: 1.5rem;
    max-width: 440px;
}

.account-card[b-0qtevwqi4p] {
    border-radius: 20px;
    padding: 1.3rem;
    background: linear-gradient(160deg, rgba(240, 78, 140, 0.10), transparent), var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.account-head[b-0qtevwqi4p] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.account-avatar[b-0qtevwqi4p] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #DF3677, #F04E8C);
    color: #fff;
    font-size: 1.3rem;
    flex-shrink: 0;
}

.account-name[b-0qtevwqi4p] {
    font-weight: 700;
    color: var(--text-primary);
}

.account-status[b-0qtevwqi4p] {
    font-size: 0.78rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.dot-online[b-0qtevwqi4p] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
}

.account-row[b-0qtevwqi4p] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.55rem 0;
    border-top: 1px solid var(--border);
}

.account-row-label[b-0qtevwqi4p] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: var(--text-primary);
}

.account-row-label i[b-0qtevwqi4p] {
    color: var(--accent);
}

.account-select[b-0qtevwqi4p] {
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.4rem 0.6rem;
    font-size: 0.85rem;
    cursor: pointer;
    min-width: 140px;
}

.account-toggle[b-0qtevwqi4p] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-primary);
    padding: 0.25rem 0.7rem 0.25rem 0.3rem;
    cursor: pointer;
    color: var(--text-primary);
    font-size: 0.82rem;
    transition: all 0.2s;
}

.account-toggle-knob[b-0qtevwqi4p] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #f59e0b;
    transition: all 0.2s;
}

.account-toggle.on[b-0qtevwqi4p] {
    background: linear-gradient(135deg, rgba(223, 54, 119, 0.18), rgba(240, 78, 140, 0.18));
    border-color: rgba(240, 78, 140, 0.4);
}

.account-toggle.on .account-toggle-knob[b-0qtevwqi4p] {
    background: #F04E8C;
    transform: translateX(2px);
}

.account-links[b-0qtevwqi4p] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    border-top: 1px solid var(--border);
    padding-top: 0.85rem;
}

.account-links a[b-0qtevwqi4p] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--text-secondary);
    text-decoration: none;
    padding: 0.35rem 0.6rem;
    border-radius: 9px;
    cursor: pointer;
    transition: all 0.15s;
}

.account-links a:hover[b-0qtevwqi4p] {
    background: rgba(223, 54, 119, 0.12);
    color: var(--accent);
}

.account-logout[b-0qtevwqi4p] {
    margin-top: 0.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.65rem;
    border-radius: 12px;
    border: 1px solid rgba(239, 68, 68, 0.3);
    background: rgba(239, 68, 68, 0.08);
    color: #ef4444;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}

.account-logout:hover[b-0qtevwqi4p] {
    background: rgba(239, 68, 68, 0.16);
}
/* _content/CommercialsW/Components/Pages/Karbantartas/EmailSettings.razor.rz.scp.css */
/* ===== E-mail beállítások — kézbesítési útvonal hero ===== */

.mail-hero[b-qan7r6xyx3] {
    position: relative;
    overflow: hidden;
    padding: 1.4rem 1.5rem 1.1rem;
    margin-bottom: 1rem;
}

.mail-hero-glow[b-qan7r6xyx3] {
    position: absolute;
    inset: -40% -10% auto;
    height: 130%;
    background:
        radial-gradient(60% 80% at 15% 0%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%),
        radial-gradient(50% 70% at 85% 10%, color-mix(in srgb, var(--accent) 9%, transparent), transparent 70%);
    pointer-events: none;
}

.mail-path[b-qan7r6xyx3] {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: .4rem;
    flex-wrap: wrap;
}

.mail-node[b-qan7r6xyx3] {
    flex: 1 1 150px;
    min-width: 150px;
    text-align: center;
    padding: .4rem .3rem;
}

.mail-node-icon[b-qan7r6xyx3] {
    width: 52px;
    height: 52px;
    margin: 0 auto .45rem;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, var(--surface-alt));
    border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--border));
    transition: transform .18s ease, box-shadow .18s ease;
}

.mail-node:hover .mail-node-icon[b-qan7r6xyx3] { transform: translateY(-2px); }

.mail-node-icon.ok[b-qan7r6xyx3] {
    color: var(--success);
    background: color-mix(in srgb, var(--success) 12%, var(--surface-alt));
    border-color: color-mix(in srgb, var(--success) 30%, var(--border));
}

.mail-node-icon.warn[b-qan7r6xyx3] {
    color: var(--warning);
    background: color-mix(in srgb, var(--warning) 12%, var(--surface-alt));
    border-color: color-mix(in srgb, var(--warning) 30%, var(--border));
}

.mail-node-label[b-qan7r6xyx3] { font-weight: 600; font-size: .85rem; color: var(--text-primary); overflow-wrap: anywhere; }
.mail-node-sub[b-qan7r6xyx3] { font-size: .74rem; color: var(--text-muted); margin-top: .1rem; overflow-wrap: anywhere; }

.mail-wire[b-qan7r6xyx3] {
    position: relative;
    flex: 0 1 70px;
    min-width: 34px;
    align-self: flex-start;
    margin-top: 25px;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--border) 0 6px, transparent 6px 12px);
}

.mail-dot[b-qan7r6xyx3] {
    position: absolute;
    top: -3px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--accent);
    opacity: 0;
}

.mail-path.sent .mail-dot[b-qan7r6xyx3] { animation: mail-travel-b-qan7r6xyx3 1.1s ease-in-out infinite; }
.mail-path.sent .mail-dot.d2[b-qan7r6xyx3] { animation-delay: .18s; }
.mail-path.sent .mail-dot.d3[b-qan7r6xyx3] { animation-delay: .36s; }

@keyframes mail-travel-b-qan7r6xyx3 {
    0% { left: 0; opacity: 0; }
    15% { opacity: 1; }
    85% { opacity: 1; }
    100% { left: calc(100% - 8px); opacity: 0; }
}

.mail-hero-meta[b-qan7r6xyx3] {
    position: relative;
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .9rem;
    padding-top: .8rem;
    border-top: 1px solid var(--border);
}

.mail-chip[b-qan7r6xyx3] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .28rem .65rem;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 600;
    color: var(--text-primary);
    background: var(--surface-alt);
    border: 1px solid var(--border);
}

.mail-chip.ok[b-qan7r6xyx3] {
    color: var(--success);
    background: color-mix(in srgb, var(--success) 10%, var(--surface-alt));
    border-color: color-mix(in srgb, var(--success) 28%, var(--border));
}

.mail-chip.warn[b-qan7r6xyx3] {
    color: var(--warning);
    background: color-mix(in srgb, var(--warning) 10%, var(--surface-alt));
    border-color: color-mix(in srgb, var(--warning) 28%, var(--border));
}

.mail-chip.muted[b-qan7r6xyx3] { color: var(--text-muted); font-weight: 500; }

/* ===== Szolgáltató-sablon kártyák ===== */

.provider-row[b-qan7r6xyx3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.provider-card[b-qan7r6xyx3] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .35rem;
    padding: 1.3rem 1rem 1.1rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    cursor: pointer;
    font: inherit;
    color: var(--text-primary);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.provider-card:hover[b-qan7r6xyx3] {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--accent) 12%, transparent);
    border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
}

.provider-card.selected[b-qan7r6xyx3] {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}

.provider-check[b-qan7r6xyx3] {
    position: absolute;
    top: .6rem;
    right: .6rem;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    color: #fff;
    background: var(--accent);
    opacity: 0;
    transform: scale(.6);
    transition: opacity .16s ease, transform .16s ease;
}

.provider-card.selected .provider-check[b-qan7r6xyx3] { opacity: 1; transform: scale(1); }

.provider-logo[b-qan7r6xyx3] {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: .2rem;
}

.provider-logo svg[b-qan7r6xyx3] { height: 34px; width: auto; }
.provider-logo.custom[b-qan7r6xyx3] { font-size: 2rem; color: var(--accent); }

.provider-name[b-qan7r6xyx3] { font-weight: 700; font-size: .95rem; }
.provider-sub[b-qan7r6xyx3] { font-size: .74rem; color: var(--text-muted); }

/* ===== Űrlap ===== */

.mailcfg-grid[b-qan7r6xyx3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
}

/* 2026-09-27 (TOPIC 4): a Feladó és a Kiszolgáló kártya EGYMÁS MELLETT áll — az app.css egymás alatti kártyáknak
   szóló „.data-card + .data-card { margin-top }" szabálya a jobb oldalit 1rem-mel lejjebb tolta. A köz a gap-ből jön. */
.mailcfg-grid > .data-card + .data-card[b-qan7r6xyx3] { margin-top: 0; }

.mailcfg-form[b-qan7r6xyx3] { display: flex; flex-direction: column; }

.mailcfg-label[b-qan7r6xyx3] {
    font-size: .76rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--text-muted);
    margin: .85rem 0 .3rem;
}

.mailcfg-form .mailcfg-label:first-child[b-qan7r6xyx3] { margin-top: 0; }

.mailcfg-pw[b-qan7r6xyx3] { display: flex; align-items: center; gap: .4rem; }
.mailcfg-pw .form-input[b-qan7r6xyx3] { flex: 1; }

.mailcfg-hint[b-qan7r6xyx3] {
    display: flex;
    gap: .5rem;
    align-items: flex-start;
    margin-top: .7rem;
    padding: .6rem .75rem;
    border-radius: 10px;
    font-size: .8rem;
    line-height: 1.45;
    color: var(--text-primary);
    background: color-mix(in srgb, var(--accent) 7%, var(--surface-alt));
    border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--border));
}

.mailcfg-hint i[b-qan7r6xyx3] { color: var(--accent); margin-top: .1rem; }

.mailcfg-hint.warn[b-qan7r6xyx3] {
    background: color-mix(in srgb, var(--warning) 9%, var(--surface-alt));
    border-color: color-mix(in srgb, var(--warning) 28%, var(--border));
}

.mailcfg-hint.warn i[b-qan7r6xyx3] { color: var(--warning); }

/* Szegmentált választó (portszám, titkosítás) */

.seg-row[b-qan7r6xyx3] { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }

.seg[b-qan7r6xyx3] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .42rem .85rem;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface-alt);
    color: var(--text-primary);
    font: inherit;
    font-size: .84rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .14s ease, background .14s ease;
}

.seg small[b-qan7r6xyx3] { font-weight: 500; font-size: .68rem; color: var(--text-muted); }

.seg:hover[b-qan7r6xyx3] { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }

.seg.on[b-qan7r6xyx3] {
    background: color-mix(in srgb, var(--accent) 14%, var(--surface-alt));
    border-color: var(--accent);
    color: var(--accent);
}

.seg.on small[b-qan7r6xyx3] { color: color-mix(in srgb, var(--accent) 70%, var(--text-muted)); }

.seg-input[b-qan7r6xyx3] { width: 96px; }

.mailcfg-testrow[b-qan7r6xyx3] { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
/* _content/CommercialsW/Components/Pages/Karbantartas/ErtesitesiSzabalyok.razor.rz.scp.css */
/* TOPIC 6 (2026-09-27): the recipient matrix of the notification rules — theme tokens only. */
.ertr-cell[b-qo947opvpv] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.ertr-chips[b-qo947opvpv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.ertr-chip[b-qo947opvpv] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0.45rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface-alt);
    color: var(--text-secondary);
    font-size: 0.7rem;
    white-space: nowrap;
}

.ertr-chip i[b-qo947opvpv] {
    color: var(--accent);
    font-size: 0.68rem;
}

.ertr-src[b-qo947opvpv] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    font-size: 0.66rem;
    color: var(--text-muted);
    border: 1px dashed var(--border);
}

.ertr-src.custom[b-qo947opvpv] {
    color: var(--accent);
    border-color: color-mix(in srgb, var(--accent) 45%, transparent);
}

.ertr-note[b-qo947opvpv] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.75rem;
    padding: 0.5rem 0.7rem;
    border-radius: 8px;
    background: var(--surface-alt);
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.ertr-note-warn[b-qo947opvpv] {
    color: var(--warning);
    background: color-mix(in srgb, var(--warning) 10%, transparent);
}

.ertr-matrix[b-qo947opvpv] {
    width: 100%;
}

.ertr-role-desc[b-qo947opvpv] {
    margin-top: 0.15rem;
    font-size: 0.72rem;
    color: var(--text-muted);
}

.ertr-partner[b-qo947opvpv] {
    margin-left: 0.3rem;
    color: var(--text-muted);
    font-size: 0.8rem;
}

.ertr-named[b-qo947opvpv] {
    padding-top: 0.75rem;
}

.ertr-named-ch[b-qo947opvpv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 1.1rem;
    margin-top: 0.6rem;
    font-size: 0.8rem;
    color: var(--text-secondary);
}

.ertr-named-ch label[b-qo947opvpv] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: normal;
    color: var(--text-primary);
}

/* A „Levél szövege” oszlop sablon-linkje a 180 px-es cellán belül tördel (2026-09-27): a hosszú sablonnév
   (pl. „Gyártási lap értesítő (producer + ügynök)”) eddig egy sorban kilógott a kártyából. */
.ertr-tpl-link[b-qo947opvpv] {
    white-space: normal;
    max-width: 100%;
    height: auto;
    min-height: 30px;
    line-height: 1.25;
    text-align: left;
    align-items: flex-start;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
}
.ertr-tpl-link i[b-qo947opvpv] { margin-top: 0.1rem; flex: 0 0 auto; }
/* _content/CommercialsW/Components/Pages/Karbantartas/Frissitesek.razor.rz.scp.css */
/* Karbantartás › Frissítések — the self-update status console (42NET VIVID tiles on the app tokens). */

.upd-panel .card-body[b-5dpq5d9gxd] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.upd-head[b-5dpq5d9gxd] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.upd-head-tile[b-5dpq5d9gxd] {
    width: 3.25rem;
    height: 3.25rem;
    font-size: 1.6rem;
    flex: 0 0 auto;
}

.upd-tile-muted[b-5dpq5d9gxd] {
    background-image: none;
    background: var(--text-muted);
    box-shadow: none;
}

.upd-head-text[b-5dpq5d9gxd] {
    flex: 1 1 18rem;
    min-width: 0;
}

.upd-state-line[b-5dpq5d9gxd] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.upd-state-label[b-5dpq5d9gxd] {
    font-size: .75rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.upd-state[b-5dpq5d9gxd] {
    display: inline-flex;
    padding: .15rem .65rem;
    border-radius: 20px;
    font-size: .75rem;
    font-weight: 700;
}

.upd-state-ok[b-5dpq5d9gxd] { background: rgba(16,185,129,.12); color: #059669; }
.upd-state-busy[b-5dpq5d9gxd] { background: rgba(0,91,234,.12); color: #1d64d8; }
.upd-state-warn[b-5dpq5d9gxd] { background: rgba(245,158,11,.14); color: #b45309; }
.upd-state-muted[b-5dpq5d9gxd] { background: rgba(100,116,139,.12); color: #475569; }

.upd-critical[b-5dpq5d9gxd] {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .75rem;
    font-weight: 700;
    color: #dc2626;
}

.upd-message[b-5dpq5d9gxd] {
    margin-top: .35rem;
    font-size: 1rem;
    font-weight: 600;
}

.upd-actions[b-5dpq5d9gxd] {
    flex: 0 0 auto;
}

.upd-actions .btn-grd:disabled[b-5dpq5d9gxd],
.modal-footer .btn-grd:disabled[b-5dpq5d9gxd] {
    opacity: .5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.upd-progress[b-5dpq5d9gxd] {
    height: .5rem;
    border-radius: 999px;
    background: var(--border);
    overflow: hidden;
}

.upd-progress-bar[b-5dpq5d9gxd] {
    height: 100%;
    background-image: var(--grd-info);
    transition: width .4s ease;
}

.upd-sub[b-5dpq5d9gxd] {
    font-size: .8125rem;
    color: var(--text-muted);
}

.upd-quiet[b-5dpq5d9gxd] {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: .75rem 1rem;
    border-radius: 10px;
    background: rgba(245,158,11,.08);
    border: 1px solid rgba(245,158,11,.25);
}

.upd-quiet > .bi[b-5dpq5d9gxd] {
    font-size: 1.25rem;
    color: #d97706;
}

.upd-tiles[b-5dpq5d9gxd] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: .75rem;
}

.upd-tile[b-5dpq5d9gxd] {
    padding: .75rem 1rem;
    border-radius: 10px;
    border: 1px solid var(--border);
}

.upd-tile-label[b-5dpq5d9gxd] {
    font-size: .75rem;
    color: var(--text-muted);
    display: flex;
    align-items: center;
    gap: .35rem;
}

.upd-tile-value[b-5dpq5d9gxd] {
    margin-top: .25rem;
    font-size: 1.05rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    word-break: break-all;
}

.upd-note[b-5dpq5d9gxd] {
    padding: .75rem 1rem;
    border-radius: 10px;
    border: 1px dashed var(--border);
}

.upd-note-text[b-5dpq5d9gxd] {
    margin-top: .35rem;
    white-space: pre-line;
}

.upd-interval[b-5dpq5d9gxd] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem 1rem;
    border-top: 1px solid var(--border);
    padding-top: .75rem;
}

.upd-interval-label[b-5dpq5d9gxd] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-weight: 600;
}

.upd-interval-select[b-5dpq5d9gxd] {
    width: 13rem;
    max-width: 100%;
}

.upd-foot[b-5dpq5d9gxd] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    font-size: .8125rem;
    color: var(--text-muted);
    border-top: 1px solid var(--border);
    padding-top: .75rem;
}

.upd-foot span[b-5dpq5d9gxd] {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    word-break: break-all;
}

.upd-how-title[b-5dpq5d9gxd] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin: 0 0 .75rem;
}

.upd-how[b-5dpq5d9gxd] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.upd-how li[b-5dpq5d9gxd] {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
}

.upd-how li .bi[b-5dpq5d9gxd] {
    color: var(--accent);
    margin-top: .15rem;
}
/* _content/CommercialsW/Components/Pages/Mail/Mailbox.razor.rz.scp.css */
/* Levelezés — háromhasábos elrendezés: mappák | levéllista | olvasó.
   A magasság a nézetablakhoz kötött, hogy mindhárom hasáb SAJÁT MAGÁN görgessen, és a fejléc/menü
   ne csússzon ki a képből egy hosszú levéltől. */
.mailbox-grid[b-089gx05gr4] {
    display: grid;
    grid-template-columns: 220px 380px 1fr;
    gap: 1rem;
    height: calc(100vh - 190px);
    min-height: 420px;
}

.mailbox-folders[b-089gx05gr4],
.mailbox-list[b-089gx05gr4],
.mailbox-reader[b-089gx05gr4] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0;
}

.mailbox-list-body[b-089gx05gr4] {
    overflow-y: auto;
    padding: 0.35rem;
    flex: 1;
}

/* ── Mappák ── */
.mailbox-folder[b-089gx05gr4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.45rem 0.6rem;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--text-primary);
    font-size: 0.82rem;
    text-align: left;
    cursor: pointer;
}

.mailbox-folder:hover[b-089gx05gr4] { background: var(--surface-2, rgba(127,127,127,0.12)); }

.mailbox-folder.on[b-089gx05gr4] {
    background: var(--accent);
    color: #fff;
    font-weight: 600;
}

.mailbox-folder-name[b-089gx05gr4] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailbox-badge[b-089gx05gr4] {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.05rem 0.4rem;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
}

.mailbox-folder.on .mailbox-badge[b-089gx05gr4] { background: rgba(255,255,255,0.28); }

/* ── Levéllista ── */
.mailbox-item[b-089gx05gr4] {
    display: block;
    width: 100%;
    padding: 0.5rem 0.6rem;
    margin-bottom: 0.25rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    text-align: left;
    cursor: pointer;
    color: var(--text-primary);
}

.mailbox-item:hover[b-089gx05gr4] { background: var(--surface-2, rgba(127,127,127,0.1)); }

.mailbox-item.on[b-089gx05gr4] {
    border-color: var(--accent);
    background: var(--surface-2, rgba(127,127,127,0.12));
}

/* Az olvasatlan levél a SÚLYÁVAL válik ki, nem külön színnel — így a kiemelés a sötét és a világos
   témában is ugyanúgy működik, és nem ütközik a kijelölés színével. */
.mailbox-item.unread .mailbox-item-from[b-089gx05gr4],
.mailbox-item.unread .mailbox-item-subject[b-089gx05gr4] { font-weight: 700; }

.mailbox-item-top[b-089gx05gr4] {
    display: flex;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--text-muted);
}

.mailbox-item-from[b-089gx05gr4] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailbox-item-date[b-089gx05gr4] { flex: 0 0 auto; }

.mailbox-item-subject[b-089gx05gr4] {
    font-size: 0.82rem;
    margin-top: 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailbox-item-preview[b-089gx05gr4] {
    font-size: 0.74rem;
    color: var(--text-muted);
    margin-top: 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mailbox-pager[b-089gx05gr4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.25rem 0.25rem;
}

/* ── Olvasó ── */
.mailbox-reader-head[b-089gx05gr4] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--border);
}

.mailbox-reader-head h4[b-089gx05gr4] {
    margin: 0 0 0.4rem;
    font-size: 1rem;
}

.mailbox-reader-meta[b-089gx05gr4] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    font-size: 0.78rem;
    color: var(--text-muted);
}

.mailbox-images[b-089gx05gr4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    font-size: 0.76rem;
    color: var(--text-muted);
}

.mailbox-attachments[b-089gx05gr4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.6rem;
}

/* Melléklet-jelvény: típus-ikon + név + méret. A típus SZÍNNEL is megkülönböztethető, hogy a sok
   melléklet közül a keresett fajta ránézésre kiváljon — nem csak a kiterjesztést kelljen olvasni. */
.mail-attachment[b-089gx05gr4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 260px;
    padding: 0.3rem 0.55rem 0.3rem 0.35rem;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--surface, transparent);
    color: var(--text-primary);
    text-decoration: none;
    font-size: 0.78rem;
    transition: border-color .12s ease, transform .12s ease;
}

.mail-attachment:hover[b-089gx05gr4] {
    border-color: var(--accent);
    transform: translateY(-1px);
}

.mail-attachment-icon[b-089gx05gr4] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 26px;
    height: 26px;
    border-radius: 7px;
    font-size: 0.95rem;
    color: #fff;
    background: #64748b;   /* ismeretlen típus */
}

.mail-attachment.pdf   .mail-attachment-icon[b-089gx05gr4] { background: #dc2626; }
.mail-attachment.doc   .mail-attachment-icon[b-089gx05gr4] { background: #2563eb; }
.mail-attachment.sheet .mail-attachment-icon[b-089gx05gr4] { background: #16a34a; }
.mail-attachment.slide .mail-attachment-icon[b-089gx05gr4] { background: #ea580c; }
.mail-attachment.zip   .mail-attachment-icon[b-089gx05gr4] { background: #a16207; }
.mail-attachment.image .mail-attachment-icon[b-089gx05gr4] { background: #7c3aed; }
.mail-attachment.audio .mail-attachment-icon[b-089gx05gr4] { background: #db2777; }
.mail-attachment.video .mail-attachment-icon[b-089gx05gr4] { background: #0891b2; }
.mail-attachment.text  .mail-attachment-icon[b-089gx05gr4] { background: #475569; }
.mail-attachment.mail  .mail-attachment-icon[b-089gx05gr4] { background: #0f766e; }

.mail-attachment-text[b-089gx05gr4] {
    display: flex;
    flex-direction: column;
    min-width: 0;          /* enélkül a hosszú fájlnév szétfeszíti a jelvényt */
    line-height: 1.25;
}

.mail-attachment-name[b-089gx05gr4] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.mail-attachment-size[b-089gx05gr4] {
    font-size: 0.68rem;
    color: var(--text-muted);
}

.mail-attachment-go[b-089gx05gr4] {
    font-size: 0.8rem;
    color: var(--text-muted);
    opacity: 0;
    transition: opacity .12s ease;
}

.mail-attachment:hover .mail-attachment-go[b-089gx05gr4] { opacity: 1; }

/* Betöltés-jelző a lista alján, amíg a további levelek érkeznek. */
.mailbox-loading-more[b-089gx05gr4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.6rem;
    font-size: 0.76rem;
    color: var(--text-muted);
}

/* Fehér háttér: a levelek túlnyomó része világos háttérre készült, sötét témában átszíneznénk a
   feladó saját formázását. */
.mailbox-body[b-089gx05gr4] {
    flex: 1;
    width: 100%;
    border: 0;
    background: #fff;
}

.mailbox-empty[b-089gx05gr4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 100%;
    color: var(--text-muted);
}

.mailbox-empty i[b-089gx05gr4] { font-size: 2.4rem; opacity: 0.5; }
.mailbox-empty p[b-089gx05gr4] { margin: 0; font-size: 0.85rem; }

.mailbox-muted[b-089gx05gr4] {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0.4rem 0.5rem;
}

/* ── Levélírás (2026-09-27) ── */
.mailbox-compose-btn[b-089gx05gr4] {
    margin-left: auto;
    white-space: nowrap;
}

/* Válasz / Válasz mindenkinek / Továbbítás: a tárgy mellett jobbra, keskeny olvasónál a tárgy fölé tördelve. */
.mailbox-reader-actions[b-089gx05gr4] {
    float: right;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem;
    margin: 0 0 0.4rem 0.75rem;
}

.mailbox-reader-actions .btn-secondary[b-089gx05gr4] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}

/* Az eredmény-jelzés alul középen: a jobb alsó sarok a folyamat-kártyáé (MailProgressPanel) és az értesítéseké. */
.mailbox-toast[b-089gx05gr4] {
    position: fixed;
    left: 50%;
    bottom: 22px;
    transform: translateX(-50%);
    z-index: 1650;
    display: flex;
    align-items: center;
    gap: 0.55rem;
    max-width: min(560px, 92vw);
    padding: 0.65rem 0.8rem 0.65rem 1rem;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--success) 45%, transparent);
    background: color-mix(in srgb, var(--success) 12%, var(--surface));
    color: var(--text-primary);
    font-size: 0.84rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
}

.mailbox-toast i[b-089gx05gr4] { color: var(--success); font-size: 1.05rem; }

.mailbox-toast.error[b-089gx05gr4] {
    border-color: color-mix(in srgb, var(--danger) 45%, transparent);
    background: color-mix(in srgb, var(--danger) 12%, var(--surface));
}

.mailbox-toast.error i[b-089gx05gr4] { color: var(--danger); }

.mailbox-toast-close[b-089gx05gr4] {
    all: unset;
    cursor: pointer;
    margin-left: 0.35rem;
    font-size: 1.1rem;
    line-height: 1;
    opacity: 0.6;
}

.mailbox-toast-close:hover[b-089gx05gr4] { opacity: 1; }

/* Keskeny képernyőn a három hasáb egymás alá kerül, és a magasság-kötés megszűnik. */
@media (max-width: 1200px) {
    .mailbox-grid[b-089gx05gr4] {
        grid-template-columns: 1fr;
        height: auto;
    }

    .mailbox-list-body[b-089gx05gr4] { max-height: 420px; }
    .mailbox-body[b-089gx05gr4] { min-height: 520px; }
}
/* _content/CommercialsW/Components/Pages/Profil/Ertesiteseim.razor.rz.scp.css */
/* TOPIC 6 (2026-09-27): personal notification settings — theme tokens only. */
.erm-intro[b-pht0hwb4ws] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    max-width: 900px;
    font-size: 0.8rem;
    line-height: 1.45;
    color: var(--text-secondary);
}

.erm-intro i[b-pht0hwb4ws] {
    color: var(--accent);
    margin-top: 0.1rem;
}

.erm-grid[b-pht0hwb4ws] {
    width: 100%;
}

.erm-sub td[b-pht0hwb4ws] {
    background: var(--surface-alt);
}

.erm-status[b-pht0hwb4ws] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding-left: 1rem;
    font-size: 0.82rem;
    color: var(--text-secondary);
}

.erm-expand[b-pht0hwb4ws] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-left: 0.6rem;
    padding: 0.1rem 0.45rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: transparent;
    color: var(--text-secondary);
    font-size: 0.7rem;
    cursor: pointer;
}

.erm-expand:hover[b-pht0hwb4ws] {
    color: var(--accent);
    border-color: var(--accent);
}

.erm-na[b-pht0hwb4ws] {
    color: var(--text-muted);
}

.erm-chip[b-pht0hwb4ws] {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    border: 1px dashed var(--border);
    color: var(--text-muted);
    font-size: 0.7rem;
}

.erm-chip.custom[b-pht0hwb4ws] {
    border-style: solid;
    border-color: color-mix(in srgb, var(--accent) 45%, transparent);
    color: var(--accent);
}
/* _content/CommercialsW/Components/Pages/Torzsadatok/AdTemplateEditor.razor.rz.scp.css */
/* Sablonok szerkesztése — állomás-panasz 2026-09-30: „a színek mintha el lennének mosva", „a modál egy 768 px magas
   képernyőn nem fér ki". Szabályok ezen a lapon:
   - adat soha nem --text-muted (világos témán 2,6:1 — olvashatatlan), hanem --text-primary / --text-secondary;
   - adat-betű legalább 0.78rem (a régi kártyák 0.6rem-es sorai megszűntek);
   - a blokk típus színe tömör csík + pötty, nem 4 %-os áttetsző háttér;
   - a modálok két oszlopban használják ki a szélességet, hogy alacsony képernyőn is kiférjenek. */

/* ---- fejléc és eszköztár ---- */
.tpl-head[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.5rem; min-width: 0; }
.tpl-head strong[b-c2i3q48v3q] { font-size: 1rem; color: var(--text-primary); }
.tpl-head-count[b-c2i3q48v3q] { font-size: 0.82rem; color: var(--text-secondary); }

.tpl-tb-text[b-c2i3q48v3q] {
    width: auto;
    padding: 0 0.7rem;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    white-space: nowrap;
}
.tpl-tb-on[b-c2i3q48v3q] {
    border-color: var(--accent);
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 10%, transparent);
}

/* ---- csoportos kijelölés panel ---- */
.tpl-select-panel[b-c2i3q48v3q] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.65rem 1rem 0.75rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 4%, var(--surface));
}
.tpl-select-top[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
.tpl-select-title[b-c2i3q48v3q] { font-size: 0.85rem; font-weight: 700; color: var(--text-primary); margin-right: 0.4rem; }
.tpl-select-count[b-c2i3q48v3q] { margin-left: auto; font-size: 0.85rem; font-weight: 600; color: var(--text-primary); font-variant-numeric: tabular-nums; }

.tpl-filter-rows[b-c2i3q48v3q] { display: flex; flex-direction: column; gap: 0.35rem; }
.tpl-filter-row[b-c2i3q48v3q] { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 0.5rem; align-items: start; }
.tpl-filter-label[b-c2i3q48v3q] { font-size: 0.8rem; font-weight: 700; color: var(--text-primary); padding-top: 0.25rem; }
.tpl-filter-chips[b-c2i3q48v3q] { display: flex; flex-wrap: wrap; gap: 0.3rem; }
.tpl-filter-chips .chip[b-c2i3q48v3q] { font-size: 0.8rem; color: var(--text-primary); display: inline-flex; align-items: center; gap: 0.3rem; }
.tpl-chip-n[b-c2i3q48v3q] { font-size: 0.7rem; opacity: 0.75; font-variant-numeric: tabular-nums; }

.tpl-select-actions[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; padding-top: 0.2rem; }
.tpl-select-hint[b-c2i3q48v3q] { margin-right: auto; font-size: 0.78rem; color: var(--text-secondary); }

/* ---- blokk-lista (sűrű rács) ---- */
.tpl-blocks-scroll[b-c2i3q48v3q] { max-height: 70vh; overflow: auto; }
.tpl-empty[b-c2i3q48v3q] { text-align: center; padding: 2rem; color: var(--text-secondary); font-size: 0.9rem; }
.tpl-empty i[b-c2i3q48v3q] { font-size: 1.4rem; margin-right: 0.4rem; vertical-align: middle; }

.tpl-grid[b-c2i3q48v3q] { font-size: 0.85rem; }
.tpl-grid thead th[b-c2i3q48v3q] { position: sticky; top: 0; z-index: 1; background: var(--surface); }
.tpl-grid td[b-c2i3q48v3q] { color: var(--text-primary); }
.tpl-num[b-c2i3q48v3q] { text-align: right; }
.tpl-col-chk[b-c2i3q48v3q] { width: 2rem; text-align: center; }

.tpl-hour-row td[b-c2i3q48v3q] {
    background: color-mix(in srgb, var(--text-primary) 5%, var(--surface));
    border-top: 1px solid var(--border);
    padding-top: 0.3rem !important;
    padding-bottom: 0.3rem !important;
}
.tpl-hour[b-c2i3q48v3q] { font-size: 0.95rem; font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; margin-right: 0.5rem; }
.tpl-hour-count[b-c2i3q48v3q] { font-size: 0.8rem; font-weight: 600; color: var(--text-secondary); }
.tpl-hour-select[b-c2i3q48v3q] { margin-left: 0.75rem; font-size: 0.74rem; }

.tpl-row[b-c2i3q48v3q] { cursor: pointer; }
.tpl-row > td:first-child[b-c2i3q48v3q] { box-shadow: inset 4px 0 0 var(--type-color, transparent); }
.tpl-row-sel > td[b-c2i3q48v3q] { background: color-mix(in srgb, var(--accent) 12%, transparent); }

.tpl-time[b-c2i3q48v3q] { font-weight: 700; font-variant-numeric: tabular-nums; }
.tpl-title[b-c2i3q48v3q] { font-weight: 600; }
.tpl-clx[b-c2i3q48v3q] { color: var(--text-primary); }
.tpl-len[b-c2i3q48v3q] { font-weight: 700; font-variant-numeric: tabular-nums; }
.tpl-fix[b-c2i3q48v3q] { color: var(--danger); }
.tpl-missing[b-c2i3q48v3q] { color: var(--warning); font-style: italic; }

.tpl-type[b-c2i3q48v3q] { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; color: var(--text-primary); }
.tpl-type-dot[b-c2i3q48v3q] { display: inline-block; width: 0.6rem; height: 0.6rem; border-radius: 50%; flex: 0 0 auto; }

.tpl-dup[b-c2i3q48v3q] { margin-left: 0.4rem; font-size: 0.74rem; font-weight: 600; color: var(--warning); }

.tpl-uniq[b-c2i3q48v3q] { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 0.78rem; color: var(--text-secondary); }
.tpl-uniq-bad[b-c2i3q48v3q],
.tpl-uniq-ok[b-c2i3q48v3q] {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.05rem 0.5rem;
    border-radius: 5px;
}
.tpl-uniq-bad[b-c2i3q48v3q] { color: var(--danger); background: color-mix(in srgb, var(--danger) 14%, transparent); }
.tpl-uniq-ok[b-c2i3q48v3q] { color: var(--success); background: color-mix(in srgb, var(--success) 14%, transparent); }

/* ---- modálok ---- */
.tpl-modal-error[b-c2i3q48v3q] { margin: 0; }
.tpl-modal-head-right[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.5rem; }
.tpl-uniq-label[b-c2i3q48v3q] { font-size: 0.78rem; color: var(--text-secondary); }
.tpl-uniq-hint[b-c2i3q48v3q] { font-size: 0.78rem; font-style: italic; color: var(--text-secondary); }

.tpl-form-grid[b-c2i3q48v3q] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.7rem 1rem; align-items: start; }
.tpl-span2[b-c2i3q48v3q] { grid-column: 1 / -1; }

.tpl-time-inputs[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.35rem; min-width: 0; }
.tpl-time-inputs[b-c2i3q48v3q]  .searchable-select { flex: 1 1 0; min-width: 72px; }
.tpl-colon[b-c2i3q48v3q] { font-weight: 700; font-size: 1.05rem; color: var(--text-primary); }
.tpl-len-note[b-c2i3q48v3q] { font-size: 0.82rem; font-weight: 600; color: var(--text-secondary); white-space: nowrap; font-variant-numeric: tabular-nums; }

.tpl-title-input[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.35rem; }
.tpl-title-input .form-input[b-c2i3q48v3q] { flex: 1 1 auto; min-width: 0; }
.tpl-title-input .btn-icon[b-c2i3q48v3q] { width: 36px; height: 36px; flex: 0 0 auto; }

.tpl-warn[b-c2i3q48v3q] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 0.7rem;
    border-radius: 8px;
    font-size: 0.84rem;
    font-weight: 500;
    color: var(--warning);
    background: color-mix(in srgb, var(--warning) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--warning) 35%, transparent);
}

.tpl-preview-line[b-c2i3q48v3q] {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem;
    padding: 0.45rem 0.7rem;
    border-radius: 8px;
    background: var(--bg-primary);
    font-size: 0.84rem;
    color: var(--text-secondary);
}
.tpl-preview-line strong[b-c2i3q48v3q] { color: var(--text-primary); }
.tpl-preview-label[b-c2i3q48v3q] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; margin-right: 0.25rem; }

.tpl-section-title[b-c2i3q48v3q] { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--text-primary); }
.tpl-hint[b-c2i3q48v3q] { font-size: 0.8rem; color: var(--text-secondary); }

.tpl-seg[b-c2i3q48v3q] { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.tpl-seg button[b-c2i3q48v3q] {
    border: 0;
    background: transparent;
    padding: 0.3rem 0.7rem;
    font-family: inherit;
    font-size: 0.8rem;
    color: var(--text-secondary);
    cursor: pointer;
}
.tpl-seg button + button[b-c2i3q48v3q] { border-left: 1px solid var(--border); }
.tpl-seg button.on[b-c2i3q48v3q] { background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--text-primary); font-weight: 700; }

.tpl-check-row[b-c2i3q48v3q] { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; }
.tpl-check[b-c2i3q48v3q] { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.84rem; font-weight: 600; color: var(--text-primary); cursor: pointer; }

/* ---- varázsló ---- */
.tpl-wiz[b-c2i3q48v3q] { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1rem 1.25rem; align-items: start; }
.tpl-wiz-col[b-c2i3q48v3q] { display: flex; flex-direction: column; gap: 0.6rem; min-width: 0; }
.tpl-wiz-head[b-c2i3q48v3q] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; }
.tpl-wiz-block[b-c2i3q48v3q] { display: flex; flex-direction: column; gap: 0.35rem; }
.tpl-wiz-sub[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; font-size: 0.8rem; font-weight: 700; color: var(--text-primary); }
.tpl-wiz-sub > span:first-child[b-c2i3q48v3q] { margin-right: 0.3rem; }
.tpl-wiz-sub-sep[b-c2i3q48v3q] { margin-left: auto; font-weight: 600; color: var(--text-secondary); }

.tpl-tog-grid[b-c2i3q48v3q] { display: grid; gap: 3px; }
.tpl-tog-hours[b-c2i3q48v3q] { grid-template-columns: repeat(12, minmax(0, 1fr)); }
.tpl-tog-minutes[b-c2i3q48v3q] { grid-template-columns: repeat(15, minmax(0, 1fr)); }
.tpl-tog[b-c2i3q48v3q] {
    height: 26px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--surface);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}
.tpl-tog:hover[b-c2i3q48v3q] { border-color: var(--accent); }
.tpl-tog.on[b-c2i3q48v3q] { background: var(--accent); border-color: var(--accent); color: #fff; }

.tpl-wiz-range[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; font-size: 0.8rem; color: var(--text-secondary); }
.tpl-mini-select[b-c2i3q48v3q] { width: 78px; }
.tpl-num-input[b-c2i3q48v3q] { width: 64px; padding: 0.3rem 0.4rem; }
.tpl-apply[b-c2i3q48v3q] { padding: 0.3rem 0.6rem; font-size: 0.78rem; }

.tpl-step-row[b-c2i3q48v3q] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 110px; gap: 0.6rem; align-items: end; }
.tpl-step-n .form-input[b-c2i3q48v3q] { width: 100%; text-align: right; }

.tpl-wiz-preview[b-c2i3q48v3q],
.tpl-bulk-preview[b-c2i3q48v3q] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-primary);
}
.tpl-wiz-preview-head[b-c2i3q48v3q] { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.tpl-count-ok[b-c2i3q48v3q] { font-size: 0.84rem; font-weight: 700; color: var(--success); }
.tpl-count-warn[b-c2i3q48v3q] { font-size: 0.84rem; font-weight: 600; color: var(--warning); }

.tpl-slots[b-c2i3q48v3q] { display: flex; flex-wrap: wrap; gap: 0.25rem; max-height: 96px; overflow-y: auto; }
.tpl-slot[b-c2i3q48v3q] {
    padding: 0.08rem 0.4rem;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: var(--surface);
    color: var(--text-primary);
    font-size: 0.78rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.tpl-slot-skip[b-c2i3q48v3q] { text-decoration: line-through; color: var(--text-secondary); opacity: 0.7; }
.tpl-slot-warn[b-c2i3q48v3q] { border-color: var(--warning); color: var(--warning); }

/* ---- tömeges módosítás ---- */
.tpl-bulk-grid[b-c2i3q48v3q] {
    display: grid;
    grid-template-columns: minmax(170px, max-content) minmax(0, 1fr) minmax(170px, max-content) minmax(0, 1fr);
    gap: 0.55rem 1rem;
    align-items: center;
}
.tpl-bulk-check[b-c2i3q48v3q] { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.84rem; font-weight: 700; color: var(--text-primary); cursor: pointer; }
.tpl-off[b-c2i3q48v3q] { opacity: 0.45; }
.tpl-bulk-table[b-c2i3q48v3q] { max-height: 190px; overflow-y: auto; }
.tpl-bulk-table .data-grid td[b-c2i3q48v3q] { color: var(--text-primary); }
.tpl-diff[b-c2i3q48v3q] { max-width: none !important; white-space: normal !important; color: var(--text-primary); }
.tpl-propagate[b-c2i3q48v3q] { flex-wrap: wrap; }
.tpl-date[b-c2i3q48v3q] { width: auto; }

@media (max-width: 900px) {
    .tpl-form-grid[b-c2i3q48v3q],
    .tpl-wiz[b-c2i3q48v3q] { grid-template-columns: minmax(0, 1fr); }
    .tpl-bulk-grid[b-c2i3q48v3q] { grid-template-columns: minmax(150px, max-content) minmax(0, 1fr); }
    .tpl-filter-row[b-c2i3q48v3q] { grid-template-columns: minmax(0, 1fr); gap: 0.2rem; }
    .tpl-tog-minutes[b-c2i3q48v3q] { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .tpl-step-row[b-c2i3q48v3q] { grid-template-columns: minmax(0, 1fr); }
}
/* _content/CommercialsW/Components/Pages/Workboard.razor.rz.scp.css */
/* Workboard — Kanban board. Uses the app design tokens (magenta accent, dark-native). */

.wb-toolbar[b-xbpa68iy0s] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.wb-modes[b-xbpa68iy0s] { display: inline-flex; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.wb-mode[b-xbpa68iy0s] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.9rem;
    background: var(--surface);
    border: none;
    color: var(--text-secondary);
    font-size: 0.82rem;
    cursor: pointer;
}
.wb-mode + .wb-mode[b-xbpa68iy0s] { border-left: 1px solid var(--border); }
.wb-mode.active[b-xbpa68iy0s] { background: var(--accent); color: #fff; font-weight: 600; }

.wb-groupby[b-xbpa68iy0s], .wb-mine[b-xbpa68iy0s], .wb-search[b-xbpa68iy0s] { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; color: var(--text-secondary); }
.wb-mine input[b-xbpa68iy0s] { accent-color: var(--accent); }
.wb-search[b-xbpa68iy0s] { position: relative; }
.wb-search i[b-xbpa68iy0s] { color: var(--text-muted); }

.wb-input[b-xbpa68iy0s] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: 0.82rem;
    font-family: inherit;
}
.wb-input:focus[b-xbpa68iy0s] { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 15%, transparent); }

.wb-truncated[b-xbpa68iy0s] { font-size: 0.72rem; color: var(--text-muted); font-style: italic; }

/* Board */
.wb-board[b-xbpa68iy0s] {
    display: flex;
    gap: 0.85rem;
    overflow-x: auto;
    padding-bottom: 1rem;
    align-items: flex-start;
}

.wb-col[b-xbpa68iy0s] {
    flex: 0 0 288px;
    max-width: 288px;
    background: var(--bg-primary);
    border: 1px solid var(--border);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 220px);
}

.wb-col-head[b-xbpa68iy0s] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 0.75rem;
    border-bottom: 2px solid var(--c, var(--border));
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-primary);
    position: sticky;
    top: 0;
    background: var(--bg-primary);
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.wb-col-dot[b-xbpa68iy0s] { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.wb-col-title[b-xbpa68iy0s] { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wb-col-count[b-xbpa68iy0s] {
    flex: 0 0 auto;
    background: color-mix(in srgb, var(--c, var(--accent)) 15%, transparent);
    color: var(--text-secondary);
    font-size: 0.7rem;
    padding: 0.05rem 0.45rem;
    border-radius: 999px;
}

.wb-col-body[b-xbpa68iy0s] {
    padding: 0.55rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    overflow-y: auto;
    min-height: 60px;
}
.wb-col-empty[b-xbpa68iy0s] { color: var(--text-muted); font-size: 0.8rem; text-align: center; padding: 0.5rem; }

/* Card */
.wb-card[b-xbpa68iy0s] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0.6rem 0.65rem;
    cursor: grab;
    box-shadow: var(--shadow-sm);
    transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.1s ease;
}
.wb-card:hover[b-xbpa68iy0s] { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: color-mix(in srgb, var(--accent) 35%, var(--border)); }
.wb-card:active[b-xbpa68iy0s] { cursor: grabbing; }
.wb-card.done[b-xbpa68iy0s] { opacity: 0.6; }
.wb-card.done .wb-card-title[b-xbpa68iy0s] { text-decoration: line-through; }

.wb-card-title[b-xbpa68iy0s] { font-size: 0.83rem; font-weight: 600; color: var(--text-primary); line-height: 1.25; }
.wb-card-sub[b-xbpa68iy0s] { font-size: 0.72rem; color: var(--text-secondary); margin-top: 0.2rem; display: flex; align-items: center; gap: 0.3rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.wb-dots[b-xbpa68iy0s] { display: flex; align-items: center; gap: 0.3rem; margin-top: 0.4rem; }
.wb-dot[b-xbpa68iy0s] { width: 10px; height: 10px; border-radius: 50%; }
.wb-taskbadge[b-xbpa68iy0s] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.68rem;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    padding: 0.02rem 0.4rem;
    border-radius: 999px;
}

.wb-card-foot[b-xbpa68iy0s] { display: flex; align-items: center; gap: 0.4rem; margin-top: 0.45rem; flex-wrap: wrap; }
.wb-kind[b-xbpa68iy0s] { font-size: 0.66rem; color: var(--text-secondary); background: color-mix(in srgb, var(--accent) 8%, transparent); padding: 0.05rem 0.4rem; border-radius: 999px; }

.wb-avatar[b-xbpa68iy0s] {
    width: 22px; height: 22px; border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent2, #F04E8C));
    color: #fff; font-size: 0.62rem; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
.wb-value[b-xbpa68iy0s] { font-size: 0.72rem; color: var(--text-primary); font-weight: 600; font-family: 'Rubik', var(--font, inherit); }
.wb-dates[b-xbpa68iy0s] { font-size: 0.68rem; color: var(--text-muted); margin-left: auto; }
.wb-due[b-xbpa68iy0s] { font-size: 0.68rem; color: var(--text-secondary); display: inline-flex; align-items: center; gap: 0.2rem; }
.wb-due.overdue[b-xbpa68iy0s] { color: var(--danger, #E74C3C); font-weight: 600; }
.wb-prio[b-xbpa68iy0s] { color: var(--p); font-size: 0.75rem; }
/* _content/CommercialsW/Components/Shared/ActionToast.razor.rz.scp.css */
/* Művelet-eredmény felugró — a NotificationToasts kánonja: jobb alsó sarok, a MailProgressPanel (z:1700) ALATT.
   A bal oldali sáv színe mondja meg az eredményt (siker / hiba), a téma-tokenekből. */
.atoast-stack[b-eiqlazi7zw] {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1600;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    width: min(400px, 92vw);
    pointer-events: none;
}

/* Nyitott modálnál a jobb FELSŐ sarok (2026-09-30): lent a kártya a modál Mentés gombját takarta — egy 20 mp-es
   hibaüzenet alatt nem lehetett újra menteni. Fent legfeljebb a fejléc X-ét fedi, annak a láblécben ott a Mégse. */
:root:has(.modal-overlay) .atoast-stack[b-eiqlazi7zw] {
    top: 12px;
    bottom: auto;
}

.atoast[b-eiqlazi7zw] {
    pointer-events: auto;
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.7rem 0.8rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-left: 3px solid var(--success);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30);
    animation: atoast-in-b-eiqlazi7zw 0.28s cubic-bezier(0.21, 1.02, 0.73, 1);
}

.atoast-ok[b-eiqlazi7zw] { border-left-color: var(--success); }
.atoast-error[b-eiqlazi7zw] { border-left-color: var(--danger); }
.atoast-leave[b-eiqlazi7zw] { animation: atoast-out-b-eiqlazi7zw 0.22s ease forwards; }

.atoast-icon[b-eiqlazi7zw] {
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.95rem;
    color: var(--success);
    background: color-mix(in srgb, var(--success) 14%, var(--surface));
}

.atoast-error .atoast-icon[b-eiqlazi7zw] {
    color: var(--danger);
    background: color-mix(in srgb, var(--danger) 14%, var(--surface));
}

.atoast-body[b-eiqlazi7zw] { flex: 1 1 auto; min-width: 0; }
.atoast-title[b-eiqlazi7zw] { font-weight: 600; font-size: 0.85rem; color: var(--text); line-height: 1.3; }
.atoast-text[b-eiqlazi7zw] { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.15rem; word-break: break-word; }

.atoast-close[b-eiqlazi7zw] {
    flex: 0 0 auto;
    background: transparent;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    padding: 0.1rem 0.2rem;
    font-size: 0.8rem;
}

.atoast-close:hover[b-eiqlazi7zw] { color: var(--text); }

@keyframes atoast-in-b-eiqlazi7zw {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to { opacity: 1; transform: none; }
}

@keyframes atoast-out-b-eiqlazi7zw {
    to { opacity: 0; transform: translateX(24px); }
}

@media (prefers-reduced-motion: reduce) {
    .atoast[b-eiqlazi7zw], .atoast-leave[b-eiqlazi7zw] { animation: none; }
}
/* _content/CommercialsW/Components/Shared/ColorPicker.razor.rz.scp.css */
/* ==================================================================================================
   42NET színválasztó — színmező az űrlapban, kattintásra színválasztó ablak (spektrum + gyorsszínek).
   Natív <input type="color"> SEHOL.
   ================================================================================================== */

.cpick[b-uqzyirlkbo] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

/* ── Színmező (teljes mód): úgy néz ki, mint egy beviteli mező ─────────────────────────────────── */

.cpick-field[b-uqzyirlkbo] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    max-width: 260px;
    min-height: 38px;
    padding: 0.3rem 0.75rem 0.3rem 0.35rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    color: var(--text-primary);
    font: inherit;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.cpick-field:hover:not(:disabled)[b-uqzyirlkbo],
.cpick-field:focus-visible[b-uqzyirlkbo] {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
    outline: none;
}

.cpick-field:disabled[b-uqzyirlkbo] { cursor: default; }

.cpick-code[b-uqzyirlkbo] {
    flex: 1 1 auto;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    font-size: 0.8rem;
    letter-spacing: 0.03em;
}

.cpick-field-icon[b-uqzyirlkbo] {
    color: var(--text-muted);
    font-size: 0.95rem;
}

/* Előnézet: a szín ÚGY, ahogy a listákban chipként megjelenik — beleértve a szöveg kontrasztját. */
.cpick-preview[b-uqzyirlkbo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 28px;
    border-radius: 6px;
    border: 1px solid color-mix(in srgb, #000 18%, transparent);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    flex: 0 0 auto;
}

.cpick-off .cpick-preview[b-uqzyirlkbo] { opacity: 0.75; }
.cpick-off .cpick-field[b-uqzyirlkbo] { opacity: 0.8; }

/* ── Kompakt mód: egyetlen színkocka sorban/rácsban ──────────────────────────────────────────── */

.cpick-compact[b-uqzyirlkbo] {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    outline: none;
}

.cpick-trigger[b-uqzyirlkbo] {
    width: 40px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid var(--border);
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    transition: border-color 0.15s, transform 0.1s;
}

.cpick-trigger:hover:not(:disabled)[b-uqzyirlkbo] { border-color: var(--accent); transform: scale(1.05); }

/* ── A színválasztó ablak ────────────────────────────────────────────────────────────────────── */

.cpm[b-uqzyirlkbo] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1.5rem;
}

@media (max-width: 640px) {
    .cpm[b-uqzyirlkbo] { grid-template-columns: minmax(0, 1fr); }
}

.cpm-col[b-uqzyirlkbo] {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-width: 0;
}

/* Spektrum-négyzet: vízszintesen telítettség, függőlegesen világosság, alatta a kiválasztott árnyalat. */
.cpm-sv[b-uqzyirlkbo] {
    position: relative;
    height: 220px;
    border-radius: 10px;
    background-image: linear-gradient(to top, #000, rgba(0, 0, 0, 0)), linear-gradient(to right, #fff, rgba(255, 255, 255, 0));
    cursor: crosshair;
    touch-action: none;
    user-select: none;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 15%, transparent);
}

.cpm-hue[b-uqzyirlkbo] {
    position: relative;
    height: 14px;
    border-radius: 999px;
    background: linear-gradient(to right, #f00 0%, #ff0 16.66%, #0f0 33.33%, #0ff 50%, #00f 66.66%, #f0f 83.33%, #f00 100%);
    cursor: pointer;
    touch-action: none;
    user-select: none;
    margin: 0.35rem 0.5rem 0.2rem;
}

.cpm-handle[b-uqzyirlkbo] {
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35), 0 2px 6px rgba(0, 0, 0, 0.35);
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.cpm-hue-handle[b-uqzyirlkbo] { top: 50%; }

.cpm-hexrow[b-uqzyirlkbo] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 0.2rem;
}

.cpm-swatch[b-uqzyirlkbo] {
    width: 44px;
    height: 36px;
    border-radius: 8px;
    flex: 0 0 auto;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #000 18%, transparent);
}

.cpm-hex[b-uqzyirlkbo] {
    max-width: 130px;
    font-family: 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Előnézet mindkét témán — szándékosan rögzített háttérrel, a mostani témától függetlenül. */
.cpm-previews[b-uqzyirlkbo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}

.cpm-theme[b-uqzyirlkbo] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.6rem 0.7rem;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 600;
}

.cpm-theme-light[b-uqzyirlkbo] { background: #FFFFFF; color: #1A1D27; border: 1px solid #E5E7EB; }
.cpm-theme-dark[b-uqzyirlkbo] { background: #12151B; color: #E5E7EB; border: 1px solid #262B36; }

.cpm-chip[b-uqzyirlkbo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 28px;
    padding: 0 0.45rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
}

.cpm-warn[b-uqzyirlkbo] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: #B45309;
    background: rgba(245, 158, 11, 0.12);
    border-radius: 8px;
    padding: 0.35rem 0.6rem;
}

/* ── Gyorsszínek (divatszínek, árnyalatok) ───────────────────────────────────────────────────── */

.cpick-next[b-uqzyirlkbo] {
    align-self: flex-start;
    padding: 4px 12px;
    font-size: 0.75rem;
    white-space: nowrap;
    margin-top: 0.25rem;
}

.cpick-label[b-uqzyirlkbo] {
    font-size: 0.63rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.15rem;
}

.cpick-grid[b-uqzyirlkbo] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cpick-sw[b-uqzyirlkbo] {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    border: 1px solid color-mix(in srgb, #000 25%, transparent);
    padding: 0;
    cursor: pointer;
    transition: transform 0.1s, box-shadow 0.1s;
}

.cpick-sw:hover:not(:disabled)[b-uqzyirlkbo] { transform: scale(1.18); }

.cpick-sw.on[b-uqzyirlkbo] {
    box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent);
}

/* Az ablakban a gyorsszínek nagyobbak és kerekek — ujjal és egérrel is kényelmesen eltalálhatók. */
.cpm-sw[b-uqzyirlkbo] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
}

/* Az árnyalatsor egy skála: kerekebb sarok és alacsonyabb, hogy ránézésre elváljon a palettától. */
.cpick-sw-shade[b-uqzyirlkbo] {
    width: 26px;
    height: 16px;
    border-radius: 4px;
}

.cpm-sw-shade[b-uqzyirlkbo] {
    width: 34px;
    height: 20px;
    border-radius: 6px;
}
/* _content/CommercialsW/Components/Shared/DocumentSendPicker.razor.rz.scp.css */
/* Dokumentum-választó: a sorok nem mező-feliratok, ezért nem kapják a .form-group label nagybetűs stílusát
   (a közös label.lbl-plain ugyanezt teszi; ez a komponens saját, attól független stílusa). */
.dsp[b-93q6msb7xd] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.9rem;
}

label.dsp-opt[b-93q6msb7xd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    font-size: 0.9rem;
    color: var(--text);
    margin: 0;
}

.dsp-fmt[b-93q6msb7xd] { color: var(--text-muted); font-size: 0.78rem; }

.dsp-detail[b-93q6msb7xd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: -0.1rem 0 0.2rem 1.6rem;
    font-size: 0.8rem;
}

.dsp-inv[b-93q6msb7xd] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    color: var(--text);
}

.dsp-warn[b-93q6msb7xd] { color: var(--warning); font-size: 0.8rem; }
.dsp-note[b-93q6msb7xd] { color: var(--text-muted); font-size: 0.75rem; margin-top: 0.2rem; }

.dsp-recipients[b-93q6msb7xd] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.35rem;
    font-size: 0.8rem;
}

.dsp-rec-title[b-93q6msb7xd] { color: var(--text-muted); font-weight: 600; }

.dsp-rec[b-93q6msb7xd] {
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    color: var(--text);
}
/* _content/CommercialsW/Components/Shared/GridPaginator.razor.rz.scp.css */
/* The QuickGrid package's own scoped pager look (Microsoft.AspNetCore.Components.QuickGrid 9.0,
   Pagination/Paginator.razor.css), reproduced 1:1 for the localized GridPaginator — the component that renders
   the markup has to carry the scoped rules. app.css adds the magenta glyphs, the border and the grid-footer
   sizing on top, exactly as it did for the built-in pager. */
.paginator[b-td5nsiajbx] {
    display: flex;
    border-top: 1px solid #ccc;
    margin-top: 0.5rem;
    padding: 0.25rem 0;
    align-items: center;
}

.pagination-text[b-td5nsiajbx] {
    margin: 0 0.5rem;
}

nav[b-td5nsiajbx] {
    display: flex;
    margin-left: auto;
    gap: 0.5rem;
    align-items: center;
}

    nav button[b-td5nsiajbx] {
        border: 0;
        background: none center center / 1rem no-repeat;
        width: 2rem;
        height: 2rem;
    }

    nav button[disabled][b-td5nsiajbx] {
        opacity: 0.4;
    }

    nav button:not([disabled]):hover[b-td5nsiajbx] {
        background-color: #eee;
    }

    nav button:not([disabled]):active[b-td5nsiajbx] {
        background-color: #aaa;
    }

.go-first[b-td5nsiajbx], .go-last[b-td5nsiajbx] {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g transform="rotate(90) scale(0.8)" transform-origin="12 12"><path d="m 2,1.5 l 10,17.5 l 10,-17.5 l -10,7.75 l -10,-7.75 z"/><rect height="2" width="20" y="20.5" x="2"/></g></svg>');
}

.go-previous[b-td5nsiajbx], .go-next[b-td5nsiajbx] {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g transform="rotate(90)" transform-origin="12 12"><path d="M 2 3.25 L 12 20.75 L 22 3.25 L 12 11 z" /></g></svg>');
}

.go-next[b-td5nsiajbx], .go-last[b-td5nsiajbx] {
    transform: scaleX(-1);
}
/* _content/CommercialsW/Components/Shared/InvoiceEditor.razor.rz.scp.css */
/* Számla-szerkesztő — a korábbi inline stílusok osztályokba költöztek (E-d, 2026-09-27), a megjelenés változatlan.
   Csak a téma-tokeneket használja (--text-muted, --border, --accent, --warning, --success, --danger). */

.ie-loading[b-947mk8gcv9] {
    padding: 2rem;
    text-align: center;
    color: var(--text-muted);
}

/* Fejléc: szám + az EGY állapot-chip és jelvényei */
.ie-head[b-947mk8gcv9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.ie-head-main[b-947mk8gcv9] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.ie-lock[b-947mk8gcv9] {
    font-size: 0.78rem;
    color: var(--text-muted);
}

.ie-dirty[b-947mk8gcv9] {
    font-size: 0.78rem;
    color: var(--warning);
}

/* Szállító / vevő kártyák */
.ie-party-title[b-947mk8gcv9] {
    font-weight: 600;
    color: var(--accent, #DF3677);
    font-size: 0.8rem;
    margin-bottom: 0.4rem;
}

.ie-muted[b-947mk8gcv9] {
    font-size: 0.82rem;
    color: var(--text-muted);
}

/* A régi piszkozat dátum-igazítása: látható sáv, nem néma módosítás */
.ie-date-notice[b-947mk8gcv9] {
    margin-bottom: 0.6rem;
    border: 1px solid var(--warning);
}

/* Előlegszámla: saját sor, sima (nem felirat-stílusú) címkével */
.ie-advance-row[b-947mk8gcv9] {
    display: flex;
    align-items: center;
    margin: 0 0 0.75rem;
}

.ie-check[b-947mk8gcv9] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: normal;
    color: var(--text);
}

/* Tételek fejléce + eszközök */
.ie-lines-head[b-947mk8gcv9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.3rem;
}

.ie-lines-tools[b-947mk8gcv9] {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    flex-wrap: wrap;
}

/* Tételgombok panel (BillingLineCreator) */
.ie-lines-panel[b-947mk8gcv9] {
    border: 1px dashed var(--border);
    border-radius: 6px;
    padding: 0.5rem 0.6rem;
    margin-bottom: 0.45rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.ie-lines-panel-row[b-947mk8gcv9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ie-lines-basis[b-947mk8gcv9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 520px;
}

.ie-lines-basis-label[b-947mk8gcv9] {
    margin: 0;
    font-size: 0.78rem;
    color: var(--text-muted);
    white-space: nowrap;
}

.ie-lines-note[b-947mk8gcv9] {
    color: var(--text-muted);
    font-size: 0.76rem;
}

.ie-lines-currency[b-947mk8gcv9] {
    color: var(--text-muted);
    font-size: 0.72rem;
    opacity: 0.85;
}

/* A művelet eredménye a gombsor fölött is (a görgetett szerkesztőben a lap teteje messze van) */
.ie-inline-result[b-947mk8gcv9] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    margin-top: 0.75rem;
    padding: 0.45rem 0.7rem;
    border-radius: 6px;
    font-size: 0.85rem;
    color: var(--text);
}

.ie-inline-ok[b-947mk8gcv9] {
    border: 1px solid var(--success);
    background: color-mix(in srgb, var(--success) 10%, transparent);
}

.ie-inline-err[b-947mk8gcv9] {
    border: 1px solid var(--danger);
    background: color-mix(in srgb, var(--danger) 10%, transparent);
}

/* Műveletek — csak az állapotban érvényes gombok */
.ie-actions[b-947mk8gcv9] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-top: 0.75rem;
    flex-wrap: wrap;
}
/* _content/CommercialsW/Components/Shared/InvoiceInfoPopover.razor.rz.scp.css */
/* Hover-revealed invoice-info popover. The comment/campaign render instantly from the passed parameters
   (pure CSS :hover, no server round-trip); the line items fill in shortly after via a one-time lazy load. */

.inv-info[b-gkfhyvocmg] {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 0.3rem;
    cursor: help;
}

.inv-info-icon[b-gkfhyvocmg] {
    color: var(--accent, #DF3677);
    font-size: 0.85rem;
    opacity: 0.75;
    transition: opacity 0.12s ease;
}

.inv-info:hover .inv-info-icon[b-gkfhyvocmg] {
    opacity: 1;
}

.inv-info-pop[b-gkfhyvocmg] {
    position: absolute;
    top: 1.4rem;
    left: 0;
    z-index: 1200;
    width: 30rem;
    max-width: 70vw;
    max-height: 24rem;
    overflow-y: auto;
    padding: 0.7rem 0.8rem;
    background: var(--surface-elevated, #222636);
    border: 1px solid var(--border, #2E3347);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
    color: var(--text, #E6E8F0);
    font-size: 0.8rem;
    line-height: 1.35;
    text-align: left;
    white-space: normal;
    /* hidden until hover */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.12s ease, transform 0.12s ease, visibility 0.12s;
    pointer-events: none;
}

.inv-info:hover .inv-info-pop[b-gkfhyvocmg] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* Flip to the right edge when the icon sits late in a wide row (avoids clipping off-screen left). */
.inv-info-pop[b-gkfhyvocmg] {
    right: auto;
}

.inv-info-head[b-gkfhyvocmg] {
    font-weight: 700;
    color: var(--accent, #DF3677);
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.inv-info-campaign[b-gkfhyvocmg] {
    font-weight: 600;
    color: var(--text, #E6E8F0);
    margin-bottom: 0.2rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.inv-info-period[b-gkfhyvocmg] {
    color: var(--text-muted, #6E7490);
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.inv-info-comment[b-gkfhyvocmg] {
    white-space: pre-wrap;
    word-break: break-word;
    color: var(--text, #E6E8F0);
    background: rgba(0, 0, 0, 0.18);
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
    margin-bottom: 0.4rem;
    max-height: 9rem;
    overflow-y: auto;
}

.inv-info-muted[b-gkfhyvocmg] {
    color: var(--text-muted, #6E7490);
    font-size: 0.78rem;
}

.inv-info-err[b-gkfhyvocmg] {
    color: var(--danger, #ef4444);
    margin: 0.3rem 0;
}

.inv-info-table[b-gkfhyvocmg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.74rem;
    margin-top: 0.2rem;
}

.inv-info-table th[b-gkfhyvocmg] {
    text-align: left;
    color: var(--text-muted, #6E7490);
    font-size: 0.66rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.2rem 0.35rem;
    border-bottom: 1px solid var(--border, #2E3347);
}

.inv-info-table td[b-gkfhyvocmg] {
    padding: 0.2rem 0.35rem;
    border-bottom: 1px solid color-mix(in srgb, var(--text-primary) 6%, transparent);
    vertical-align: top;
}

.inv-info-table .num[b-gkfhyvocmg] {
    text-align: right;
    white-space: nowrap;
}

.inv-info-desc[b-gkfhyvocmg] {
    max-width: 16rem;
    word-break: break-word;
}

.inv-info-btn[b-gkfhyvocmg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.45rem;
    padding: 0.25rem 0.6rem;
    font-size: 0.74rem;
    background: var(--accent, #DF3677);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

.inv-info-btn:disabled[b-gkfhyvocmg] {
    opacity: 0.6;
    cursor: default;
}

.spin[b-gkfhyvocmg] {
    animation: inv-info-spin-b-gkfhyvocmg 0.8s linear infinite;
    display: inline-block;
}

@keyframes inv-info-spin-b-gkfhyvocmg {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* _content/CommercialsW/Components/Shared/InvoiceStateChip.razor.rz.scp.css */
/* Számla-állapot chip + jelvények — téma-tokenekből (világos/sötét), a 42NET magenta palettán.
   Az elsődleges chip kiállított bizonylatnál teli, piszkozatnál keretes, a színe a bizonylat típusa; a jelvények
   halványabbak: egy pillantásra látszik, mi az állapot, és mi a kiegészítő tény. */
.inv-state[b-umox68l7w7] {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
    vertical-align: middle;
}

.inv-chip[b-umox68l7w7],
.inv-badge[b-umox68l7w7] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.14rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
    border: 1px solid transparent;
}

.inv-state-compact .inv-chip[b-umox68l7w7],
.inv-state-compact .inv-badge[b-umox68l7w7] {
    padding: 0.08rem 0.45rem;
    font-size: 0.68rem;
}

/* PiDRó, 2026-09-28: a SZÍN a bizonylat típusa (.inv-t-* az app.css-ben — számla zöld, sztornó számla piros, a
   sztornózott eredeti narancs, helyesbítő magenta, előleg ibolya, végszámla türkiz), a KITÖLTÉS a tény: a kiállított
   bizonylat teli chip fehér felirattal — mint a NAV / Számlázz.hu forrás-jelvény, ami tényadatból jön —, a piszkozat
   keretes. A tartalék szín csak akkor él, ha a típus-osztály hiányozna. */
.inv-chip-filled[b-umox68l7w7] { color: #fff; background: var(--inv-f, var(--success)); border-color: var(--inv-f, var(--success)); }
.inv-chip-outline[b-umox68l7w7] { color: var(--inv-c, var(--warning)); background: transparent; border-color: var(--inv-c, var(--warning)); }

/* A sztornózott eredeti áthúzva marad — a jelentés (már nem érvényes) a színtől függetlenül is látszik. */
.inv-chip-reversed[b-umox68l7w7] { text-decoration: line-through; }

.inv-chip-link[b-umox68l7w7] { text-decoration: none; cursor: pointer; }
.inv-chip-link:hover[b-umox68l7w7] { filter: brightness(1.12); text-decoration: underline; }
/* The reversed original is a link in the list (to its storno); without this the link rule above wiped its line-through. */
.inv-chip-reversed.inv-chip-link[b-umox68l7w7] { text-decoration: line-through; }
.inv-chip-reversed.inv-chip-link:hover[b-umox68l7w7] { text-decoration: line-through underline; }

.inv-badge[b-umox68l7w7] { font-weight: 500; }
.inv-badge-ok[b-umox68l7w7] { color: var(--success); background: color-mix(in srgb, var(--success) 10%, transparent); }
.inv-badge-wait[b-umox68l7w7] { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, transparent); }
.inv-badge-bad[b-umox68l7w7] { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, transparent); }
.inv-badge-muted[b-umox68l7w7] { color: var(--text-muted); background: color-mix(in srgb, var(--text-muted) 10%, transparent); }
.inv-badge-sent[b-umox68l7w7] { color: var(--info); background: color-mix(in srgb, var(--info) 10%, transparent); }
/* _content/CommercialsW/Components/Shared/MailComposeDialog.razor.rz.scp.css */
/* Levélíró ablak (MailComposeDialog) — csak a saját elemei; a keret (ModalShell, form-row, form-group, SaveButton)
   a közös app.css-ből jön. Színek kizárólag téma-tokenekből, egyetlen kivétellel: a levél „papírja" fehér —
   lásd lent. */

.mail-compose-alert[b-80sfsus2gn] {
    margin-bottom: 0;
}

/* A feladó nem szerkeszthető: a lap fiókválasztója dönti el. Olvasható, de nem mezőnek látszó sor. */
.mail-compose-from[b-80sfsus2gn] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    background: var(--surface-alt);
    color: var(--text-secondary);
    cursor: default;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mail-compose-caption[b-80sfsus2gn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    min-height: 1.4rem;
}

.mail-compose-caption-actions[b-80sfsus2gn] {
    display: inline-flex;
    gap: 0.25rem;
}

.mail-compose-caption-actions .btn-link[b-80sfsus2gn] {
    padding: 0.1rem 0.4rem;
    font-size: 0.72rem;
}

/* Felirat a .form-group-on kívül (a Mellékletek sor): ugyanaz a megjelenés, mint a mezőcímkéké. */
.mail-compose-caption-text[b-80sfsus2gn] {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* A levél papírja FEHÉR, mint az olvasó panelé (Mailbox.razor.css .mailbox-body): az aláírás és az idézett levél
   saját színekkel érkezik, amit világos háttérre terveztek — sötét felületen olvashatatlan volna, és a címzett is
   fehér lapon kapja meg. Az eszköztár a témát követi. */
.mail-compose-editor[b-80sfsus2gn]  .rte-content,
.mail-compose-quote[b-80sfsus2gn]  .rte-content {
    background: #ffffff;
    color: #222222;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 0.9rem;
    line-height: 1.5;
}

.mail-compose-quote[b-80sfsus2gn] {
    border: 1px dashed var(--border);
    border-radius: 8px;
    padding: 0.45rem 0.6rem 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.mail-compose-quote-head[b-80sfsus2gn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.mail-compose-check[b-80sfsus2gn] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    color: var(--text-secondary);
    cursor: pointer;
}

.mail-compose-note[b-80sfsus2gn] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.74rem;
    color: var(--text-muted);
}

.mail-compose-quote-body.excluded[b-80sfsus2gn] {
    opacity: 0.45;
}

.mail-compose-attachments[b-80sfsus2gn] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.mail-compose-attach[b-80sfsus2gn] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
}

/* A fájlválasztó maga rejtve: a felirat-gomb nyitja meg. */
.mail-compose-attach[b-80sfsus2gn]  input[type="file"] {
    display: none;
}

.mail-compose-upload-error[b-80sfsus2gn] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--danger);
}

.mail-compose-att-list[b-80sfsus2gn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.mail-compose-att[b-80sfsus2gn] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    max-width: 300px;
    padding: 0.3rem 0.55rem;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--surface);
    color: var(--text-primary);
    font-family: inherit;
    font-size: 0.78rem;
}

button.mail-compose-att[b-80sfsus2gn] {
    cursor: pointer;
}

button.mail-compose-att:hover[b-80sfsus2gn] {
    border-color: var(--accent);
}

.mail-compose-att i[b-80sfsus2gn] {
    color: var(--accent);
}

.mail-compose-att.off[b-80sfsus2gn] {
    opacity: 0.55;
}

.mail-compose-att.off .mail-compose-att-name[b-80sfsus2gn] {
    text-decoration: line-through;
}

.mail-compose-att.off i[b-80sfsus2gn] {
    color: var(--text-muted);
}

.mail-compose-att-name[b-80sfsus2gn] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.mail-compose-att-size[b-80sfsus2gn] {
    flex: 0 0 auto;
    font-size: 0.7rem;
    color: var(--text-muted);
}

.mail-compose-att-remove[b-80sfsus2gn] {
    all: unset;
    cursor: pointer;
    opacity: 0.6;
    font-size: 1rem;
    line-height: 1;
    padding: 0 2px;
}

.mail-compose-att-remove:hover[b-80sfsus2gn] {
    opacity: 1;
}

.mail-compose-hint[b-80sfsus2gn] {
    margin-right: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.74rem;
    color: var(--text-muted);
}
/* _content/CommercialsW/Components/Shared/MultiSelectChips.razor.rz.scp.css */
/* MultiSelectChips — AUTOCOMPLETE / FREE-TEXT mode only (2026-09-27). The column-filter mode keeps its global
   .ms-* rules in app.css untouched; every selector here targets an element that exists only in the new mode. */

.ms-autocomplete[b-p0vzyv6du5] {
    position: relative;
    gap: 0.3rem;
}

/* Chips and the type-in box share one frame, like a mail client's recipient line. */
.ms-ac-box[b-p0vzyv6du5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem;
    min-height: 38px;
    padding: 0.25rem 0.45rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    cursor: text;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.ms-ac-box:focus-within[b-p0vzyv6du5] {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.ms-ac-box.invalid[b-p0vzyv6du5] {
    border-color: var(--danger);
}

.ms-ac-input[b-p0vzyv6du5] {
    flex: 1 1 180px;
    min-width: 120px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-primary);
    font-family: inherit;
    font-size: 0.8125rem;
    padding: 0.2rem 0.1rem;
}

.ms-ac-error[b-p0vzyv6du5] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--danger);
}

/* The suggestion list floats over the fields below it (it never pushes the dialog layout around). */
.ms-ac-suggest[b-p0vzyv6du5] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 2px);
    z-index: 40;
    max-height: 280px;
    overflow-y: auto;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
    padding: 0.2rem 0;
}

.ms-ac-item[b-p0vzyv6du5] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    padding: 0.35rem 0.65rem;
    cursor: pointer;
    font-size: 0.8125rem;
    color: var(--text-primary);
}

.ms-ac-item span[b-p0vzyv6du5] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-ac-item small[b-p0vzyv6du5] {
    color: var(--text-muted);
    font-size: 0.72rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-ac-item:hover[b-p0vzyv6du5],
.ms-ac-item.hl[b-p0vzyv6du5] {
    background: color-mix(in srgb, var(--accent) 14%, transparent);
}

.ms-ac-item.sel span[b-p0vzyv6du5]::after {
    content: " ✓";
    color: var(--accent);
}
/* _content/CommercialsW/Components/Shared/Newsletter/NewsletterQuickSendDialog.razor.rz.scp.css */
/* Quick letter dialog (topic 9, 2026-09-27): the test address sits in the footer next to its button. */
.nl-quick-test[b-2u50ma8fuq] {
    width: 240px;
    max-width: 40vw;
}

@media (max-width: 700px) {
    .nl-quick-test[b-2u50ma8fuq] {
        width: 100%;
        max-width: 100%;
    }
}
/* _content/CommercialsW/Components/Shared/Newsletter/NewsletterTextBlocksEditor.razor.rz.scp.css */
/* The "write the letter" editor (topic 9, 2026-09-27): subject row + the design's writable texts, stacked. */
.nl-textblocks[b-ft6i3pddfk] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.nl-subject-row[b-ft6i3pddfk] {
    flex-wrap: nowrap;
    align-items: stretch;
}

.nl-subject-row .nl-subject-input[b-ft6i3pddfk] {
    flex: 1 1 auto;
    min-width: 0;
}

.nl-subject-row[b-ft6i3pddfk]  .searchable-select {
    flex: 0 0 240px;
    max-width: 45%;
}

.nl-sample-chip[b-ft6i3pddfk] {
    margin: .15rem 0 .35rem;
    align-self: flex-start;
}

@media (max-width: 700px) {
    .nl-subject-row[b-ft6i3pddfk] {
        flex-wrap: wrap;
    }

    .nl-subject-row[b-ft6i3pddfk]  .searchable-select {
        flex: 1 1 100%;
        max-width: 100%;
    }
}
/* _content/CommercialsW/Components/Shared/NotificationBell.razor.rz.scp.css */
/* NotificationBell — header bell + dropdown. Uses the app design tokens. */

.nb-root[b-hej2e7qpuu] { position: relative; display: inline-flex; }

.nb-bell[b-hej2e7qpuu] {
    position: relative;
    background: transparent;
    border: none;
    color: var(--text-secondary);
    font-size: 1.1rem;
    cursor: pointer;
    padding: 0.35rem 0.45rem;
    border-radius: 8px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
}
.nb-bell:hover[b-hej2e7qpuu] { color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }

.nb-badge[b-hej2e7qpuu] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    box-shadow: 0 0 0 2px var(--surface, #fff);
}

.nb-backdrop[b-hej2e7qpuu] {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: transparent;
}

.nb-panel[b-hej2e7qpuu] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: 340px;
    max-height: 460px;
    overflow-y: auto;
    background: var(--surface-elevated, var(--surface));
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: var(--shadow-md);
    z-index: 1401;
    animation: nbIn-b-hej2e7qpuu 0.14s ease;
}

@keyframes nbIn-b-hej2e7qpuu {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
}

.nb-head[b-hej2e7qpuu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.65rem 0.85rem;
    border-bottom: 1px solid var(--border);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    position: sticky;
    top: 0;
    background: var(--surface-elevated, var(--surface));
}
.nb-head i[b-hej2e7qpuu] { color: var(--accent); }

.nb-mark[b-hej2e7qpuu] {
    border: none;
    background: transparent;
    color: var(--accent);
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    text-transform: none;
    letter-spacing: 0;
}
.nb-mark:hover[b-hej2e7qpuu] { text-decoration: underline; }

.nb-empty[b-hej2e7qpuu] { padding: 1.25rem 0.85rem; color: var(--text-muted); font-size: 0.82rem; text-align: center; }

.nb-list[b-hej2e7qpuu] { display: flex; flex-direction: column; }

.nb-item[b-hej2e7qpuu] {
    display: flex;
    gap: 0.6rem;
    padding: 0.6rem 0.85rem;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    transition: background 0.12s ease;
}
.nb-item:hover[b-hej2e7qpuu] { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.nb-item.unread[b-hej2e7qpuu] { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.nb-item.unread .nb-title[b-hej2e7qpuu] { font-weight: 700; }

.nb-icon[b-hej2e7qpuu] {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    color: var(--accent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
}

.nb-body[b-hej2e7qpuu] { flex: 1 1 auto; min-width: 0; }
.nb-title[b-hej2e7qpuu] { font-size: 0.82rem; color: var(--text-primary); }
.nb-text[b-hej2e7qpuu] { font-size: 0.75rem; color: var(--text-secondary); margin-top: 0.1rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.nb-meta[b-hej2e7qpuu] { font-size: 0.68rem; color: var(--text-muted); margin-top: 0.15rem; display: flex; gap: 0.3rem; }

/* TOPIC 6: the settings (gear) link beside "Mind olvasott" — the title takes the free space. */
.nb-head > span:first-child[b-hej2e7qpuu] { flex: 1; }
.nb-settings[b-hej2e7qpuu] { margin-left: 0.6rem; font-size: 0.85rem; line-height: 1; }
.nb-settings i[b-hej2e7qpuu] { color: var(--text-secondary); }
.nb-settings:hover i[b-hej2e7qpuu] { color: var(--accent); }
/* _content/CommercialsW/Components/Shared/NotificationToasts.razor.rz.scp.css */
/* FB-stílusú értesítés-felugrók — jobb alsó sarok, a MailProgressPanel (z:1700) ALATT,
   hogy futó folyamat-kártyát sose takarjon. */
.ntoast-stack[b-7alrikw72p] {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1600;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    width: min(380px, 92vw);
    pointer-events: none; /* a rés nem fog kattintást — csak maguk a kártyák */
}

.ntoast[b-7alrikw72p] {
    pointer-events: auto;
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.7rem 0.8rem;
    background: var(--surface);
    border: 1px solid var(--border);
    border-left: 3px solid var(--accent);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.30);
    cursor: pointer;
    animation: ntoast-in-b-7alrikw72p 0.28s cubic-bezier(0.21, 1.02, 0.73, 1);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ntoast:hover[b-7alrikw72p] {
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.38);
}

.ntoast-leave[b-7alrikw72p] {
    animation: ntoast-out-b-7alrikw72p 0.22s ease forwards;
}

.ntoast-icon[b-7alrikw72p] {
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 14%, var(--surface));
    color: var(--accent);
    font-size: 0.95rem;
}

.ntoast-body[b-7alrikw72p] {
    flex: 1 1 auto;
    min-width: 0;
}

.ntoast-title[b-7alrikw72p] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--text);
    line-height: 1.3;
}

.ntoast-text[b-7alrikw72p] {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.15rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ntoast-meta[b-7alrikw72p] {
    font-size: 0.72rem;
    color: var(--text-muted);
    opacity: 0.85;
    margin-top: 0.25rem;
}

.ntoast-close[b-7alrikw72p] {
    flex: 0 0 auto;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 0.75rem;
    padding: 0.15rem 0.25rem;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1;
}

.ntoast-close:hover[b-7alrikw72p] {
    color: var(--text);
    background: color-mix(in srgb, var(--text) 10%, transparent);
}

@keyframes ntoast-in-b-7alrikw72p {
    from { opacity: 0; transform: translateY(14px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes ntoast-out-b-7alrikw72p {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(10px); }
}

@media (prefers-reduced-motion: reduce) {
    .ntoast[b-7alrikw72p] { animation: none; }
    .ntoast-leave[b-7alrikw72p] { animation: none; opacity: 0; }
}
/* _content/CommercialsW/Components/Shared/OrderCollaboration.razor.rz.scp.css */
/* OrderCollaboration — Monday-style order workspace. Uses the app design tokens (magenta accent, dark-native). */

.oc-root[b-ct554o4o8d] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.oc-empty[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1.25rem;
    color: var(--text-secondary);
    background: var(--surface);
    border: 1px dashed var(--border);
    border-radius: var(--radius);
    font-size: 0.85rem;
}

.oc-empty-line[b-ct554o4o8d] {
    padding: 0.75rem 0.25rem;
    color: var(--text-muted);
    font-size: 0.8rem;
    font-style: italic;
}

.oc-card[b-ct554o4o8d] {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 0.9rem 1rem 1rem;
    box-shadow: var(--shadow-sm);
}

.oc-card-head[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--text-secondary);
    margin-bottom: 0.75rem;
}

.oc-card-head .oc-count[b-ct554o4o8d],
.oc-card-head .oc-toggle[b-ct554o4o8d] {
    margin-left: auto;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 500;
    font-size: 0.72rem;
    color: var(--text-muted);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* ── Pipeline stepper ─────────────────────────────────────────────────────── */
.oc-pipe[b-ct554o4o8d] { margin-bottom: 0.9rem; }
.oc-pipe:last-child[b-ct554o4o8d] { margin-bottom: 0; }

.oc-pipe-title[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.45rem;
}

.oc-pipe-title i[b-ct554o4o8d] { color: var(--pipe); }

.oc-pipe-current[b-ct554o4o8d] {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: 600;
    color: #fff;
    background: var(--pipe);
    padding: 0.12rem 0.55rem;
    border-radius: 999px;
}

.oc-stepper[b-ct554o4o8d] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.oc-step[b-ct554o4o8d] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.65rem;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg-primary);
    color: var(--text-secondary);
    font-size: 0.74rem;
    cursor: pointer;
    transition: all 0.14s ease;
    white-space: nowrap;
}

.oc-step .oc-step-dot[b-ct554o4o8d] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--step);
    opacity: 0.45;
    transition: opacity 0.14s ease, box-shadow 0.14s ease;
}

.oc-step.past[b-ct554o4o8d] { color: var(--text-primary); border-color: color-mix(in srgb, var(--step) 45%, var(--border)); }
.oc-step.past .oc-step-dot[b-ct554o4o8d] { opacity: 0.85; }

.oc-step.current[b-ct554o4o8d] {
    color: #fff;
    background: var(--step);
    border-color: var(--step);
    font-weight: 700;
    box-shadow: 0 2px 10px -2px color-mix(in srgb, var(--step) 60%, transparent);
}
.oc-step.current .oc-step-dot[b-ct554o4o8d] { opacity: 1; background: #fff; }

.oc-step.future[b-ct554o4o8d] { opacity: 0.7; }

.oc-step:not(.disabled):hover[b-ct554o4o8d] {
    transform: translateY(-1px);
    border-color: var(--step);
}
.oc-step.current:not(.disabled):hover[b-ct554o4o8d] { transform: translateY(-1px); }

.oc-step.disabled[b-ct554o4o8d] { cursor: default; opacity: 0.55; }

/* ── Suggestions ("billentés") ────────────────────────────────────────────── */
.oc-suggest[b-ct554o4o8d] {
    margin-top: 0.85rem;
    border-top: 1px dashed var(--border);
    padding-top: 0.7rem;
}

.oc-suggest-head[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.76rem;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 0.5rem;
}

.oc-suggest-row[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.55rem 0.7rem;
    border: 1px solid var(--border);
    border-left: 3px solid var(--accent);
    border-radius: 8px;
    background: color-mix(in srgb, var(--accent) 4%, var(--surface));
    margin-bottom: 0.4rem;
}

.oc-suggest-row.sensitive[b-ct554o4o8d] {
    border-left-color: var(--warning, #F0A030);
    background: color-mix(in srgb, var(--warning, #F0A030) 6%, var(--surface));
}

.oc-suggest-body[b-ct554o4o8d] { flex: 1 1 auto; min-width: 0; }
.oc-suggest-desc[b-ct554o4o8d] { font-size: 0.74rem; color: var(--text-secondary); margin-top: 0.15rem; }
.oc-suggest-actions[b-ct554o4o8d] { display: flex; gap: 0.35rem; flex: 0 0 auto; }

/* ── Task quick-add + list ────────────────────────────────────────────────── */
.oc-quickadd[b-ct554o4o8d] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
    align-items: center;
}

.oc-input[b-ct554o4o8d] {
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-primary);
    color: var(--text-primary);
    font-size: 0.8rem;
    font-family: inherit;
}
.oc-input:focus[b-ct554o4o8d] { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 15%, transparent); }
.oc-grow[b-ct554o4o8d] { flex: 1 1 180px; min-width: 140px; }
.oc-assignee-pick[b-ct554o4o8d] { flex: 0 0 190px; min-width: 160px; }
.oc-mention[b-ct554o4o8d] { flex: 0 0 190px; min-width: 160px; }

.oc-tasklist[b-ct554o4o8d] { display: flex; flex-direction: column; gap: 0.3rem; }

.oc-task[b-ct554o4o8d] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.6rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg-primary);
    transition: background 0.12s ease;
}
.oc-task:hover[b-ct554o4o8d] { background: var(--surface-hover, color-mix(in srgb, var(--accent) 3%, var(--bg-primary))); }
.oc-task.done[b-ct554o4o8d] { opacity: 0.6; }
.oc-task.done .oc-task-title[b-ct554o4o8d] { text-decoration: line-through; }

.oc-check[b-ct554o4o8d] { width: 17px; height: 17px; accent-color: var(--accent); cursor: pointer; }
.oc-task-icon[b-ct554o4o8d] { color: var(--text-muted); }
.oc-task-main[b-ct554o4o8d] { flex: 1 1 auto; min-width: 0; }
.oc-task-title[b-ct554o4o8d] { font-size: 0.83rem; color: var(--text-primary); font-weight: 500; }
.oc-task-meta[b-ct554o4o8d] { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.15rem; }

.oc-kind[b-ct554o4o8d] {
    font-size: 0.68rem;
    color: var(--text-secondary);
    background: color-mix(in srgb, var(--accent) 8%, transparent);
    padding: 0.06rem 0.4rem;
    border-radius: 999px;
}

.oc-assignee-name[b-ct554o4o8d] { font-size: 0.72rem; color: var(--text-secondary); }

.oc-due[b-ct554o4o8d] {
    font-size: 0.72rem;
    color: var(--text-secondary);
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
.oc-due.overdue[b-ct554o4o8d] { color: var(--danger, #E74C3C); font-weight: 600; }

.oc-prio[b-ct554o4o8d] { color: var(--p); font-size: 0.85rem; flex: 0 0 auto; }

/* ── Avatars, badges ──────────────────────────────────────────────────────── */
.oc-avatar[b-ct554o4o8d] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent2, #F04E8C));
    color: #fff;
    font-size: 0.66rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    letter-spacing: 0.02em;
}
.oc-avatar-me[b-ct554o4o8d] { background: linear-gradient(135deg, #5BB8FF, #3F51B5); }

.oc-badge[b-ct554o4o8d] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.66rem;
    color: var(--text-muted);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 0.02rem 0.4rem;
}
.oc-badge-warn[b-ct554o4o8d] { color: var(--warning, #F0A030); border-color: color-mix(in srgb, var(--warning, #F0A030) 40%, var(--border)); }

/* ── Buttons ──────────────────────────────────────────────────────────────── */
.oc-btn[b-ct554o4o8d] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--surface);
    color: var(--text-secondary);
    font-size: 0.76rem;
    cursor: pointer;
    transition: all 0.12s ease;
}
.oc-btn:hover:not(:disabled)[b-ct554o4o8d] { border-color: var(--accent); color: var(--text-primary); }
.oc-btn:disabled[b-ct554o4o8d] { opacity: 0.5; cursor: default; }

.oc-btn-accent[b-ct554o4o8d] {
    background: var(--accent);
    border-color: var(--accent);
    color: #fff;
}
.oc-btn-accent:hover:not(:disabled)[b-ct554o4o8d] { background: var(--accent2, #F04E8C); border-color: var(--accent2, #F04E8C); color: #fff; }

.oc-icon-btn[b-ct554o4o8d] {
    border: none;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 6px;
    flex: 0 0 auto;
}
.oc-icon-btn:hover:not(:disabled)[b-ct554o4o8d] { color: var(--danger, #E74C3C); background: color-mix(in srgb, var(--danger, #E74C3C) 10%, transparent); }

/* ── Comments ─────────────────────────────────────────────────────────────── */
.oc-composer[b-ct554o4o8d] {
    display: flex;
    gap: 0.6rem;
    margin-bottom: 0.85rem;
    align-items: flex-start;
}
.oc-composer textarea[b-ct554o4o8d] { resize: vertical; }
.oc-composer-side[b-ct554o4o8d] { display: flex; flex-direction: column; gap: 0.4rem; flex: 0 0 auto; }

.oc-thread[b-ct554o4o8d] { display: flex; flex-direction: column; gap: 0.7rem; }

.oc-comment[b-ct554o4o8d] { display: flex; gap: 0.6rem; }
.oc-comment-body[b-ct554o4o8d] { flex: 1 1 auto; min-width: 0; }
.oc-comment-head[b-ct554o4o8d] { display: flex; align-items: center; gap: 0.45rem; margin-bottom: 0.15rem; }
.oc-comment-head strong[b-ct554o4o8d] { font-size: 0.8rem; color: var(--text-primary); }
.oc-time[b-ct554o4o8d] { font-size: 0.68rem; color: var(--text-muted); }
.oc-comment-text[b-ct554o4o8d] {
    font-size: 0.83rem;
    color: var(--text-primary);
    white-space: pre-wrap;
    word-break: break-word;
    background: var(--bg-primary);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 0.45rem 0.6rem;
}
.oc-comment-del[b-ct554o4o8d] {
    margin-left: auto;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}
.oc-comment-del:hover:not(:disabled)[b-ct554o4o8d] { color: var(--danger, #E74C3C); }

/* ── Timeline ─────────────────────────────────────────────────────────────── */
.oc-timeline[b-ct554o4o8d] { display: flex; flex-direction: column; }

.oc-tl-item[b-ct554o4o8d] {
    display: flex;
    gap: 0.6rem;
    padding: 0.4rem 0;
    border-left: 2px solid color-mix(in srgb, var(--tl) 45%, var(--border));
    padding-left: 0.75rem;
    margin-left: 0.5rem;
}

.oc-tl-icon[b-ct554o4o8d] {
    width: 22px;
    height: 22px;
    margin-left: -1.6rem;
    border-radius: 50%;
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--tl) 50%, var(--border));
    color: var(--tl);
    font-size: 0.66rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.oc-tl-body[b-ct554o4o8d] { flex: 1 1 auto; min-width: 0; }
.oc-tl-title[b-ct554o4o8d] { font-size: 0.8rem; color: var(--text-primary); display: flex; gap: 0.5rem; align-items: baseline; flex-wrap: wrap; }
.oc-tl-text[b-ct554o4o8d] { font-size: 0.74rem; color: var(--text-secondary); margin-top: 0.1rem; word-break: break-word; }
.oc-tl-user[b-ct554o4o8d] { font-size: 0.68rem; color: var(--text-muted); margin-top: 0.05rem; }

.oc-toggle input[b-ct554o4o8d] { accent-color: var(--accent); }

/* ── Követés / értesítendők (TOPIC 6, 2026-09-27) ── */
.oc-follow[b-ct554o4o8d] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 1rem;
    margin-top: 0.2rem;
}
.oc-follow-me[b-ct554o4o8d] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--text-primary);
    cursor: pointer;
}
.oc-follow-list[b-ct554o4o8d] { flex: 1 1 320px; min-width: 220px; }
.oc-follow-note[b-ct554o4o8d] {
    margin-top: 0.45rem;
    font-size: 0.72rem;
    color: var(--text-muted);
}
/* _content/CommercialsW/Components/Shared/ServerPathBrowser.razor.rz.scp.css */
/* ServerPathBrowser — the shared server-side tallózó. The look follows the original Hanganyagok import browser
   (imp-browse-*), so moving that page onto this component changes nothing visually. */

.spb[b-wl7nxrwfkd] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.spb-path[b-wl7nxrwfkd] {
    font-size: 0.82rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spb-path-input[b-wl7nxrwfkd] { font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.82rem; }

.spb-list[b-wl7nxrwfkd] {
    max-height: 46vh;
    overflow-y: auto;
    border: 1px solid var(--border);
    border-radius: 8px;
}

.spb-item[b-wl7nxrwfkd] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.3rem 0.6rem;
    font-size: 0.84rem;
    cursor: pointer;
    user-select: none;
}

.spb-item:hover[b-wl7nxrwfkd] { background: color-mix(in srgb, var(--accent) 10%, transparent); }

.spb-item .bi-folder[b-wl7nxrwfkd] { color: var(--accent); }

.spb-file .bi-file-earmark[b-wl7nxrwfkd] { color: var(--text-muted); }

.spb-file.on[b-wl7nxrwfkd] {
    background: color-mix(in srgb, var(--accent) 18%, transparent);
    font-weight: 600;
}

.spb-empty[b-wl7nxrwfkd] { padding: 1rem; color: var(--text-disabled); font-size: 0.82rem; }

.spb-error[b-wl7nxrwfkd] { color: var(--danger); }

.spb-selected[b-wl7nxrwfkd] {
    font-size: 0.8rem;
    color: var(--text-muted);
    word-break: break-all;
}
/* _content/CommercialsW/Components/Shared/SoundTrashPanel.razor.rz.scp.css */
/* A hanganyag-lomtár panel saját elrendezése — a rács és a gombok a globális kánonból jönnek. */
.stp[b-6g5iwrm5i6] { display: flex; flex-direction: column; gap: 0.6rem; }

.stp-head[b-6g5iwrm5i6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.stp-title[b-6g5iwrm5i6] {
    font-weight: 700;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.stp-compact .stp-title[b-6g5iwrm5i6] { font-size: 0.85rem; }

.stp-tools[b-6g5iwrm5i6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.stp-tools[b-6g5iwrm5i6]  .search-box { min-width: 200px; }

.stp-empty[b-6g5iwrm5i6] {
    padding: 1rem;
    color: var(--text-muted);
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* A rács a panelen BELÜL görgethető vízszintesen — a gombok nem tolhatják szét az oldalt. */
.stp-grid-wrap[b-6g5iwrm5i6] { overflow-x: auto; max-width: 100%; }
.stp-grid[b-6g5iwrm5i6] { width: 100%; min-width: 760px; }

.stp-mode[b-6g5iwrm5i6] { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.stp-actions[b-6g5iwrm5i6] { text-align: right; white-space: nowrap; }
.stp-actions[b-6g5iwrm5i6]  button + button { margin-left: 0.35rem; }

.stp-danger[b-6g5iwrm5i6] { color: var(--danger); border-color: var(--danger); }
/* _content/CommercialsW/Components/Shared/UserAccountLinkField.razor.rz.scp.css */
/* Partner → user-account link field (TOPIC 6): the muted one-line explanation under the picker. */
.ual-hint[b-gk9q0gjken] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.3rem;
    font-size: 0.72rem;
    line-height: 1.35;
    color: var(--text-muted);
}