/* /Components/Layout/LegalLayout.razor.rz.scp.css */
/* ── Unauthenticated: full-screen overlay over MainLayout ── */
.ll-overlay[b-7rz1qpcqyb] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: var(--clr-slate-100);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    overflow-y: auto;
    gap: 1.5rem;
}

/* ── Footer (mirrors LoginLayout footer) ─────────────────── */
.ll-footer[b-7rz1qpcqyb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    margin-top: 1.5rem;
    flex-shrink: 0;
}

.ll-footer a[b-7rz1qpcqyb] {
    color: var(--clr-slate-400);
    text-decoration: none;
    transition: color 0.15s;
}

.ll-footer a:hover[b-7rz1qpcqyb] {
    color: var(--clr-slate-600);
}

.ll-footer-sep[b-7rz1qpcqyb] {
    color: var(--clr-slate-300);
}
/* /Components/Layout/LoginLayout.razor.rz.scp.css */
.login-layout[b-8jnm98xrvt] {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--clr-slate-100);
    padding: 1rem;
}

.login-footer[b-8jnm98xrvt] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
}

.login-footer a[b-8jnm98xrvt] {
    color: var(--clr-slate-400);
    text-decoration: none;
    transition: color 0.15s;
}

.login-footer a:hover[b-8jnm98xrvt] {
    color: var(--clr-slate-600);
}

.login-footer-sep[b-8jnm98xrvt] {
    color: var(--clr-slate-300);
}

/* ── Dark mode: page bg darker than card bg ── */
html[data-theme="dark"] .login-layout[b-8jnm98xrvt] {
    background: #0b1728;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .login-layout[b-8jnm98xrvt] {
        background: #0b1728;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ── App Layout ──────────────────────────────────────── */

.app-layout[b-dmdybtf6c3] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
}

/* ── Mobile Header ──────────────────────────────────── */

.mobile-header[b-dmdybtf6c3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    height: 56px;
    padding: 0 1rem;
    background: var(--clr-slate-900);
    color: var(--clr-slate-100);
    position: sticky;
    top: 0;
    z-index: 80;
    flex-shrink: 0;
}

.menu-toggle[b-dmdybtf6c3] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    padding: 0.35rem;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}

.menu-toggle:hover[b-dmdybtf6c3] {
    background: var(--clr-slate-800);
    color: var(--clr-slate-100);
}

.mobile-brand[b-dmdybtf6c3] {
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
    color: inherit;
    text-decoration: none;
}

.mobile-user[b-dmdybtf6c3] {
    margin-left: auto;
    color: var(--clr-slate-400);
}

/* ── Sidebar ────────────────────────────────────────── */

.sidebar[b-dmdybtf6c3] {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 260px;
    background: var(--clr-slate-900);
    color: var(--clr-slate-200);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    z-index: 1000;
}

    .sidebar.open[b-dmdybtf6c3] {
        transform: translateX(0);
        z-index: 10000;
    }

.sidebar-backdrop[b-dmdybtf6c3] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s, visibility 0.25s;
}

.sidebar-backdrop.visible[b-dmdybtf6c3] {
    opacity: 1;
    visibility: visible;
}

.sidebar-brand[b-dmdybtf6c3] {
    display: flex;
    align-items: center;
    padding: 0.85rem 1rem;
    user-select: none;
}

.sidebar-brand-svg[b-dmdybtf6c3] {
    height: 32px;
    width: auto;
}

.sidebar-nav[b-dmdybtf6c3] {
    list-style: none;
    margin: 0;
    padding: 0;
}

[b-dmdybtf6c3] .sidebar-nav li {
    margin: 0;
}

[b-dmdybtf6c3] .sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 1.25rem;
    color: var(--clr-slate-400) !important;
    text-decoration: none !important;
    font-size: 0.92rem;
    font-weight: 500;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
}

[b-dmdybtf6c3] .sidebar-link:hover {
    background: var(--clr-slate-800);
    color: var(--clr-slate-100) !important;
    text-decoration: none !important;
}

[b-dmdybtf6c3] .sidebar-link.active {
    background: var(--clr-slate-800);
    color: var(--clr-slate-200) !important;
    border-left-color: var(--clr-blue-500);
}

[b-dmdybtf6c3] .sidebar-link .icon {
    opacity: 0.7;
}

.sidebar-icon[b-dmdybtf6c3] {
    width: 18px;
    height: 18px;
    opacity: 0.7;
    transition: opacity 0.15s;
}

[b-dmdybtf6c3] .sidebar-link:hover .sidebar-icon,
[b-dmdybtf6c3] .sidebar-link.active .sidebar-icon {
    opacity: 1;
}

[b-dmdybtf6c3] .sidebar-link:hover .icon,
[b-dmdybtf6c3] .sidebar-link.active .icon {
    opacity: 1;
}

.sidebar-divider[b-dmdybtf6c3] {
    list-style: none;
    margin: 0;
}

.sidebar-divider:empty[b-dmdybtf6c3] {
    height: 1px;
    background: var(--clr-slate-800);
    margin: 0.5rem 0;
}

.sidebar-divider:not(:empty)[b-dmdybtf6c3] {
    padding: 1rem 1.25rem 0.25rem;
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--clr-slate-700);
}

.badge-beta[b-dmdybtf6c3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 0.15rem 0.5rem;
    background: var(--clr-amber-400);
    color: var(--clr-amber-900);
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 3px;
    text-transform: uppercase;
}

/* ── Main Content ───────────────────────────────────── */

.main-content[b-dmdybtf6c3] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem 1rem;
}

/* ── Sidebar Footer ─────────────────────────────────── */

.sidebar-footer[b-dmdybtf6c3] {
    margin-top: auto;
    border-top: 1px solid var(--clr-slate-800);
}

.sidebar-settings-nav[b-dmdybtf6c3] {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.25s ease;
}

.sidebar-settings-nav.open[b-dmdybtf6c3] {
    grid-template-rows: 1fr;
}

.sidebar-settings-nav > div[b-dmdybtf6c3] {
    overflow: hidden;
}

/* Settings sub-links – same visual language as sidebar-sub-link */
[b-dmdybtf6c3] .sidebar-settings-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 1.25rem 0.45rem 2.75rem;
    color: var(--clr-slate-500) !important;
    text-decoration: none !important;
    font-size: 0.85rem;
    font-weight: 500;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
    /* button reset */
    background: none;
    border-top: none;
    border-right: none;
    border-bottom: none;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    width: 100%;
}

[b-dmdybtf6c3] .sidebar-settings-link:hover {
    background: var(--clr-slate-800);
    color: var(--clr-slate-300) !important;
    text-decoration: none !important;
}

[b-dmdybtf6c3] .sidebar-settings-link.active {
    background: var(--clr-slate-800);
    color: var(--clr-slate-200) !important;
    border-left-color: var(--clr-blue-500);
}

[b-dmdybtf6c3] .sidebar-settings-link .icon {
    opacity: 0.7;
}

[b-dmdybtf6c3] .sidebar-settings-link:hover .icon,
[b-dmdybtf6c3] .sidebar-settings-link.active .icon {
    opacity: 1;
}

/* User row – full-width button, reuses sidebar-link padding */
.sidebar-user-btn[b-dmdybtf6c3] {
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}

.sidebar-legal[b-dmdybtf6c3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem 0.75rem;
    font-size: 0.72rem;
}

.sidebar-legal a[b-dmdybtf6c3] {
    color: var(--clr-slate-600);
    text-decoration: none;
    transition: color 0.15s;
}

.sidebar-legal a:hover[b-dmdybtf6c3] {
    color: var(--clr-slate-300);
}

.sidebar-legal span[b-dmdybtf6c3] {
    color: var(--clr-slate-700);
}

/* Avatar circle with initials */
.sidebar-user-avatar[b-dmdybtf6c3] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--clr-blue-700, #1d4ed8);
    color: #fff;
    font-size: 0.67rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    letter-spacing: 0.04em;
}

/* ── Desktop (>= 768px) ────────────────────────────── */

@media (min-width: 768px) {
    .app-layout[b-dmdybtf6c3] {
        flex-direction: row;
    }

    .mobile-header[b-dmdybtf6c3] {
        display: none;
    }

    .sidebar[b-dmdybtf6c3] {
        position: static;
        transform: none;
        width: 240px;
        min-width: 240px;
        flex-shrink: 0;
    }

    .sidebar-backdrop[b-dmdybtf6c3] {
        display: none !important;
    }

    .main-content[b-dmdybtf6c3] {
        padding: 1.75rem 2rem;
    }
}

@media (min-width: 1024px) {
    .main-content[b-dmdybtf6c3] {
        padding: 2rem 2.5rem;
    }
}

/* ── Sidebar entrance transitions (desktop) ─────────── */

@media (min-width: 768px) {
    .sidebar-brand[b-dmdybtf6c3],
    .sidebar-nav li[b-dmdybtf6c3],
    .sidebar-footer[b-dmdybtf6c3] {
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .sidebar-nav li:nth-child(1)[b-dmdybtf6c3]  { transition-delay: 0.03s; }
    .sidebar-nav li:nth-child(2)[b-dmdybtf6c3]  { transition-delay: 0.06s; }
    .sidebar-nav li:nth-child(3)[b-dmdybtf6c3]  { transition-delay: 0.09s; }
    .sidebar-nav li:nth-child(4)[b-dmdybtf6c3]  { transition-delay: 0.12s; }
    .sidebar-nav li:nth-child(5)[b-dmdybtf6c3]  { transition-delay: 0.15s; }
    .sidebar-nav li:nth-child(6)[b-dmdybtf6c3]  { transition-delay: 0.18s; }
    .sidebar-nav li:nth-child(7)[b-dmdybtf6c3]  { transition-delay: 0.21s; }
    .sidebar-nav li:nth-child(8)[b-dmdybtf6c3]  { transition-delay: 0.24s; }
    .sidebar-nav li:nth-child(9)[b-dmdybtf6c3]  { transition-delay: 0.27s; }
    .sidebar-nav li:nth-child(10)[b-dmdybtf6c3] { transition-delay: 0.30s; }
    .sidebar-nav li:nth-child(11)[b-dmdybtf6c3] { transition-delay: 0.33s; }
    .sidebar-nav li:nth-child(12)[b-dmdybtf6c3] { transition-delay: 0.36s; }
    .sidebar-nav li:nth-child(13)[b-dmdybtf6c3] { transition-delay: 0.39s; }
    .sidebar-nav li:nth-child(14)[b-dmdybtf6c3] { transition-delay: 0.42s; }
    .sidebar-nav li:nth-child(15)[b-dmdybtf6c3] { transition-delay: 0.45s; }
    .sidebar-nav li:nth-child(16)[b-dmdybtf6c3] { transition-delay: 0.48s; }
    .sidebar-nav li:nth-child(17)[b-dmdybtf6c3] { transition-delay: 0.51s; }
    .sidebar-nav li:nth-child(18)[b-dmdybtf6c3] { transition-delay: 0.54s; }
    .sidebar-nav li:nth-child(19)[b-dmdybtf6c3] { transition-delay: 0.57s; }
    .sidebar-nav li:nth-child(20)[b-dmdybtf6c3] { transition-delay: 0.60s; }
    .sidebar-footer[b-dmdybtf6c3]               { transition-delay: 0.63s; }

    @starting-style {
        .sidebar-brand[b-dmdybtf6c3],
        .sidebar-nav li[b-dmdybtf6c3],
        .sidebar-footer[b-dmdybtf6c3] {
            opacity: 0;
            transform: translateX(-8px);
        }
    }
}

/* ── Blazor Error UI ────────────────────────────────── */

#blazor-error-ui[b-dmdybtf6c3] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-dmdybtf6c3] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* ── Collapsible Nav Groups ─────────────────────────── */

.sidebar-nav-group[b-dmdybtf6c3] {
    margin: 0;
}

.sidebar-group-toggle[b-dmdybtf6c3] {
    width: 100%;
    background: none;
    border: none;
    border-left: 3px solid transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}

.sidebar-toggle-end[b-dmdybtf6c3] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.sidebar-toggle-end .badge-beta[b-dmdybtf6c3] {
    margin-left: 0;
}

.sidebar-sub-nav[b-dmdybtf6c3] {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.25s ease;
}

.sidebar-sub-nav.open[b-dmdybtf6c3] {
    grid-template-rows: 1fr;
}

.sidebar-sub-nav > div[b-dmdybtf6c3] {
    overflow: hidden;
    position: relative;
}

[b-dmdybtf6c3] .sidebar-chevron {
    margin-left: auto;
    flex-shrink: 0;
    opacity: 0.45;
    transition: transform 0.2s ease, opacity 0.15s;
}

.sidebar-toggle-end[b-dmdybtf6c3]  .sidebar-chevron {
    margin-left: 0;
}

[b-dmdybtf6c3] .sidebar-group-toggle.expanded {
    background: var(--clr-slate-800);
    color: var(--clr-slate-200) !important;
    border-left-color: var(--clr-blue-500);
}

[b-dmdybtf6c3] .sidebar-group-toggle.expanded .icon {
    opacity: 1;
}

[b-dmdybtf6c3] .sidebar-group-toggle.expanded .sidebar-chevron {
    transform: rotate(90deg);
    opacity: 0.8;
}

[b-dmdybtf6c3] .sidebar-sub-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 1.25rem 0.45rem 2.75rem;
    color: var(--clr-slate-500) !important;
    text-decoration: none !important;
    font-size: 0.84rem;
    font-weight: 500;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
}

[b-dmdybtf6c3] .sidebar-sub-link:hover {
    background: var(--clr-slate-800);
    color: var(--clr-slate-300) !important;
}

[b-dmdybtf6c3] .sidebar-sub-link.active {
    background: rgba(59, 130, 246, 0.14);
    color: var(--clr-blue-200) !important;
    border-left-color: var(--clr-blue-400);
    font-weight: 600;
}

[b-dmdybtf6c3] .sidebar-sub-link.active .sub-dot {
    transform: scale(1.4);
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.08);
}

.sub-dot[b-dmdybtf6c3] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.sub-dot--all[b-dmdybtf6c3]        { background: var(--clr-slate-600); }
.sub-dot--open[b-dmdybtf6c3]       { background: var(--clr-amber-500); }
.sub-dot--active[b-dmdybtf6c3]     { background: var(--clr-blue-500); }
.sub-dot--inprogress[b-dmdybtf6c3] { background: var(--clr-blue-400); }
.sub-dot--completed[b-dmdybtf6c3]  { background: var(--clr-green-500); }
.sub-dot--cancelled[b-dmdybtf6c3]  { background: var(--clr-red-500); }

/* ── Floating Action Group (bottom-right) ───────────── */

.fab-group[b-dmdybtf6c3] {
    position: fixed;
    bottom: 2rem;
    z-index: 999;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    justify-content: center;
    left: 50%;
}

.fab-license[b-dmdybtf6c3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, var(--clr-blue-500), var(--clr-blue-600));
    color: var(--clr-always-white);
    border: none;
    border-radius: 100px;
    padding: 0.7rem 1.15rem;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.35);
    transition: all 0.2s;
    white-space: nowrap;
}

.fab-license:hover[b-dmdybtf6c3] {
    background: linear-gradient(135deg, var(--clr-blue-600), var(--clr-blue-700));
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.45);
    transform: translateY(-1px);
}

@media (max-width: 480px) {
    .fab-license span[b-dmdybtf6c3] {
        display: none;
    }

    .fab-license[b-dmdybtf6c3] {
        border-radius: 50%;
        padding: 0.75rem;
        width: 48px;
        height: 48px;
        justify-content: center;
    }
}

/* ── Dark Mode Sidebar Overrides ────────────────────── */

html[data-theme="dark"] .sidebar[b-dmdybtf6c3],
html[data-theme="dark"] .mobile-header[b-dmdybtf6c3] {
    background: #09111e;
}

html[data-theme="dark"] .sidebar-brand[b-dmdybtf6c3] {
    border-bottom-color: #162135;
    color: #f1f5f9;
}

html[data-theme="dark"] .sidebar-divider:empty[b-dmdybtf6c3] {
    background: #162135;
}

html[data-theme="dark"] .sidebar-footer[b-dmdybtf6c3] {
    border-top-color: #162135;
}

html[data-theme="dark"] .sidebar-admin-links[b-dmdybtf6c3] {
    border-bottom-color: #162135;
}

html[data-theme="dark"][b-dmdybtf6c3]  .sidebar-link:hover {
    background: #162135 !important;
}

html[data-theme="dark"][b-dmdybtf6c3]  .sidebar-link.active {
    background: #1b3260 !important;
}

html[data-theme="dark"][b-dmdybtf6c3]  .sidebar-group-toggle.expanded {
    background: #162135 !important;
}

html[data-theme="dark"][b-dmdybtf6c3]  .sidebar-sub-link:hover {
    background: #162135 !important;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .sidebar[b-dmdybtf6c3],
    html:not([data-theme]) .mobile-header[b-dmdybtf6c3] {
        background: #09111e;
    }

    html:not([data-theme]) .sidebar-brand[b-dmdybtf6c3] {
        border-bottom-color: #162135;
    }

    html:not([data-theme]) .sidebar-divider:empty[b-dmdybtf6c3] {
        background: #162135;
    }

    html:not([data-theme]) .sidebar-footer[b-dmdybtf6c3] {
        border-top-color: #162135;
    }

    html:not([data-theme]) .sidebar-admin-links[b-dmdybtf6c3] {
        border-bottom-color: #162135;
    }

    html:not([data-theme])[b-dmdybtf6c3]  .sidebar-link:hover {
        background: #162135 !important;
    }

    html:not([data-theme])[b-dmdybtf6c3]  .sidebar-link.active {
        background: #1b3260 !important;
    }

    html:not([data-theme])[b-dmdybtf6c3]  .sidebar-group-toggle.expanded {
        background: #162135 !important;
    }

    html:not([data-theme])[b-dmdybtf6c3]  .sidebar-sub-link:hover {
        background: #162135 !important;
    }
}
/* /Components/Layout/PublicFormLayout.razor.rz.scp.css */
.public-form-layout[b-e5h044jasr] {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(160deg, #f8fafc 0%, #e2e8f0 50%, #f1f5f9 100%);
}

.public-form-main[b-e5h044jasr] {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2.5rem 1.5rem 1rem;
}

.public-form-footer[b-e5h044jasr] {
    padding: 1rem 1.5rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.78rem;
}

.public-form-footer a[b-e5h044jasr] {
    color: var(--clr-slate-400);
    text-decoration: none;
    transition: color 0.15s;
}

.public-form-footer a:hover[b-e5h044jasr] {
    color: var(--clr-slate-600);
}

.public-form-footer-sep[b-e5h044jasr] {
    color: var(--clr-slate-300);
}

/* ── Dark mode ── */
html[data-theme="dark"] .public-form-layout[b-e5h044jasr] {
    background: linear-gradient(160deg, #0b1728 0%, #111827 50%, #0f172a 100%);
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .public-form-layout[b-e5h044jasr] {
        background: linear-gradient(160deg, #0b1728 0%, #111827 50%, #0f172a 100%);
    }
}

@media (max-width: 640px) {
    .public-form-main[b-e5h044jasr] {
        padding: 1rem 0.75rem 0.5rem;
    }
}

/* ── Blazor Error UI ────────────────────────────────── */

#blazor-error-ui[b-e5h044jasr] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-e5h044jasr] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
/* ── Zustands-Sichtbarkeit (Standard: versteckt) ────────────── */
.components-reconnect-first-attempt-visible[b-5cgcynu7yl],
.components-reconnect-repeated-attempt-visible[b-5cgcynu7yl],
.components-reconnect-failed-visible[b-5cgcynu7yl],
.components-pause-visible[b-5cgcynu7yl],
.components-resume-failed-visible[b-5cgcynu7yl] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-5cgcynu7yl],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-5cgcynu7yl],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-5cgcynu7yl],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-5cgcynu7yl],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-5cgcynu7yl] {
    display: block;
}

/* Buttons: nur sichtbar wenn zugehöriger Zustand aktiv */
#components-reconnect-modal:not(.components-reconnect-failed) #components-reconnect-button[b-5cgcynu7yl],
#components-reconnect-modal:not(.components-reconnect-paused):not(.components-reconnect-resume-failed) #components-resume-button[b-5cgcynu7yl] {
    display: none;
}

/* ── Modal: Vollbild-Overlay ─────────────────────────────────── */
#components-reconnect-modal:not([open])[b-5cgcynu7yl] {
    display: none;
}

#components-reconnect-modal[b-5cgcynu7yl] {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    border: none;
    padding: 0;
    margin: 0;
    color: #fff;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    overflow: hidden;
    background: transparent;
}

#components-reconnect-modal[open][b-5cgcynu7yl] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 28px;
    animation: fk-fade-in-b-5cgcynu7yl 0.5s ease-out 0.2s both;
}

#components-reconnect-container[b-5cgcynu7yl] {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #0f1b3d;
  border-radius: 20px;
  padding: 5rem;
  gap: 1rem;
  border: 5px white solid;
}

#components-reconnect-modal[b-5cgcynu7yl]::backdrop {
    backdrop-filter: blur(10px);
}

/* ── Wordmark ─────────────────────────────────────────────────── */
.fk-wordmark[b-5cgcynu7yl] {
    font-size: 38px;
    font-weight: 700;
    letter-spacing: -0.02em;
    opacity: 0;
    animation: fk-wm-fade-b-5cgcynu7yl 1.6s ease-out 0.6s forwards;
}

.fk-klar[b-5cgcynu7yl] {
    color: #F4B740;
}

/* ── Statustext ───────────────────────────────────────────────── */
#components-reconnect-modal p[b-5cgcynu7yl] {
    font-size: 15px;
    color: rgba(255, 255, 255, 0.75);
    text-align: center;
    max-width: 280px;
    line-height: 1.5;
    margin: 0;
}

/* ── Buttons ──────────────────────────────────────────────────── */
#components-reconnect-modal button[b-5cgcynu7yl] {
    background: #F4B740;
    color: #0F1B3D;
    border: none;
    border-radius: 8px;
    padding: 10px 28px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.15s;
}

#components-reconnect-modal button:hover[b-5cgcynu7yl] {
    opacity: 0.85;
}

/* ── SVG Orbit-Animation ─────────────────────────────────────── */
.fk-orbit[b-5cgcynu7yl] {
    transform-origin: 32px 32px;
    animation: fk-orbit-b-5cgcynu7yl 2.4s cubic-bezier(.65, .05, .36, 1) infinite;
}

/* ── Keyframes ───────────────────────────────────────────────── */
@keyframes fk-orbit-b-5cgcynu7yl {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes fk-wm-fade-b-5cgcynu7yl {
    0%   { opacity: 0; transform: translateY(4px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes fk-fade-in-b-5cgcynu7yl {
    0%   { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes fk-fade-out-b-5cgcynu7yl {
    0%   { opacity: 1; }
    100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .fk-orbit[b-5cgcynu7yl]    { animation: none; }
    .fk-wordmark[b-5cgcynu7yl] { animation: none; opacity: 1; }
}
/* /Components/Layout/SettingsLayout.razor.rz.scp.css */
/* ── App Layout (same structure as MainLayout) ──── */

.app-layout[b-673483a6zy] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
}

/* ── Mobile Header ──────────────────────────────── */

.mobile-header[b-673483a6zy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    height: 56px;
    padding: 0 1rem;
    background: var(--clr-slate-900);
    color: var(--clr-slate-100);
    position: sticky;
    top: 0;
    z-index: 80;
    flex-shrink: 0;
}

.menu-toggle[b-673483a6zy] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    padding: 0.35rem;
    border-radius: 6px;
    transition: background 0.15s, color 0.15s;
}

.menu-toggle:hover[b-673483a6zy] {
    background: var(--clr-slate-800);
    color: var(--clr-slate-100);
}

.mobile-brand[b-673483a6zy] {
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -0.02em;
}

.mobile-user[b-673483a6zy] {
    margin-left: auto;
    color: var(--clr-slate-400);
}

/* ── Sidebar ────────────────────────────────────── */

.sidebar[b-673483a6zy] {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 260px;
    background: var(--clr-slate-900);
    color: var(--clr-slate-200);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
}

    .sidebar.open[b-673483a6zy] {
        transform: translateX(0);
        z-index: 10000;
    }

.sidebar-backdrop[b-673483a6zy] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s, visibility 0.25s;
}

.sidebar-backdrop.visible[b-673483a6zy] {
    opacity: 1;
    visibility: visible;
}

.sidebar-brand[b-673483a6zy] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 1rem 1.25rem 0.75rem;
}

.sidebar-brand-svg[b-673483a6zy] {
    height: 28px;
    width: auto;
}


/* ── Back link ──────────────────────────────────── */

.sidebar-back-home[b-673483a6zy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--clr-slate-100);
    text-decoration: none !important;
    font-size: 0.92rem;
    font-weight: 600;
    transition: opacity 0.15s;
}

.sidebar-back-home:hover[b-673483a6zy] {
    opacity: 0.75;
}

html[data-theme="dark"] .sidebar-back-home[b-673483a6zy] {
    color: #f1f5f9;
}

html[data-theme="dark"] .sidebar-divider:empty[b-673483a6zy] {
    background: #162135;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .sidebar-divider:empty[b-673483a6zy] {
        background: #162135;
    }
}

/* ── Settings heading ───────────────────────────── */

.settings-heading[b-673483a6zy] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.25rem 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--clr-slate-600);
}

/* ── Nav ────────────────────────────────────────── */

.sidebar-nav[b-673483a6zy] {
    list-style: none;
    margin: 0;
    padding: 0.25rem 0;
}

[b-673483a6zy] .sidebar-nav li {
    margin: 0;
}

.sidebar-divider[b-673483a6zy] {
    list-style: none;
    margin: 0;
}

.sidebar-divider:empty[b-673483a6zy] {
    height: 1px;
    background: var(--clr-slate-800);
    margin: 0.5rem 0;
}

.sidebar-divider:not(:empty)[b-673483a6zy] {
    padding: 1rem 1.25rem 0.25rem;
    font-size: 0.63rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--clr-slate-700);
}

[b-673483a6zy] .sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 1.25rem;
    color: var(--clr-slate-400) !important;
    text-decoration: none !important;
    font-size: 0.92rem;
    font-weight: 500;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
}

[b-673483a6zy] .sidebar-link:hover {
    background: var(--clr-slate-800);
    color: var(--clr-slate-100) !important;
    text-decoration: none !important;
}

[b-673483a6zy] .sidebar-link.active {
    background: var(--clr-slate-800);
    color: var(--clr-slate-200) !important;
    border-left-color: var(--clr-blue-500);
}

[b-673483a6zy] .sidebar-link .icon {
    opacity: 0.7;
}

[b-673483a6zy] .sidebar-link:hover .icon,
[b-673483a6zy] .sidebar-link.active .icon {
    opacity: 1;
}

/* ── Main Content ───────────────────────────────── */

.main-content[b-673483a6zy] {
    flex: 1;
    overflow-y: auto;
    padding: 1.25rem 1rem;
}

/* ── Sidebar Footer ─────────────────────────────── */

.sidebar-footer[b-673483a6zy] {
    margin-top: auto;
    border-top: 1px solid #162135;
}

.sidebar-legal[b-673483a6zy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem 0.75rem;
    font-size: 0.72rem;
}

.sidebar-legal a[b-673483a6zy] {
    color: var(--clr-slate-600);
    text-decoration: none;
    transition: color 0.15s;
}

.sidebar-legal a:hover[b-673483a6zy] {
    color: var(--clr-slate-300);
}

.sidebar-legal span[b-673483a6zy] {
    color: var(--clr-slate-700);
}

/* ── Desktop (>= 768px) ─────────────────────────── */

@media (min-width: 768px) {
    .app-layout[b-673483a6zy] {
        flex-direction: row;
    }

    .mobile-header[b-673483a6zy] {
        display: none;
    }

    .sidebar[b-673483a6zy] {
        position: static;
        transform: none;
        width: 240px;
        min-width: 240px;
        flex-shrink: 0;
    }

    .sidebar-backdrop[b-673483a6zy] {
        display: none !important;
    }

    .main-content[b-673483a6zy] {
        padding: 1.75rem 2rem;
    }
}

@media (min-width: 1024px) {
    .main-content[b-673483a6zy] {
        padding: 2rem 2.5rem;
    }
}

/* ── Sidebar entrance transitions (desktop) ─────── */

@media (min-width: 768px) {
    .sidebar-brand[b-673483a6zy],
    .settings-heading[b-673483a6zy],
    .sidebar-nav li[b-673483a6zy],
    .sidebar-footer[b-673483a6zy] {
        transition: opacity 0.3s ease, transform 0.3s ease;
    }

    .settings-heading[b-673483a6zy]             { transition-delay: 0.04s; }
    .sidebar-nav li:nth-child(1)[b-673483a6zy]  { transition-delay: 0.08s; }
    .sidebar-nav li:nth-child(2)[b-673483a6zy]  { transition-delay: 0.12s; }
    .sidebar-nav li:nth-child(3)[b-673483a6zy]  { transition-delay: 0.16s; }
    .sidebar-nav li:nth-child(4)[b-673483a6zy]  { transition-delay: 0.20s; }
    .sidebar-nav li:nth-child(5)[b-673483a6zy]  { transition-delay: 0.24s; }
    .sidebar-nav li:nth-child(6)[b-673483a6zy]  { transition-delay: 0.28s; }
    .sidebar-nav li:nth-child(7)[b-673483a6zy]  { transition-delay: 0.32s; }
    .sidebar-nav li:nth-child(8)[b-673483a6zy]  { transition-delay: 0.36s; }
    .sidebar-nav li:nth-child(9)[b-673483a6zy]  { transition-delay: 0.40s; }
    .sidebar-nav li:nth-child(10)[b-673483a6zy] { transition-delay: 0.44s; }
    .sidebar-nav li:nth-child(11)[b-673483a6zy] { transition-delay: 0.48s; }
    .sidebar-nav li:nth-child(12)[b-673483a6zy] { transition-delay: 0.52s; }
    .sidebar-nav li:nth-child(13)[b-673483a6zy] { transition-delay: 0.56s; }
    .sidebar-nav li:nth-child(14)[b-673483a6zy] { transition-delay: 0.60s; }
    .sidebar-nav li:nth-child(15)[b-673483a6zy] { transition-delay: 0.64s; }
    .sidebar-footer[b-673483a6zy]               { transition-delay: 0.68s; }

    @starting-style {
        .sidebar-brand[b-673483a6zy],
        .settings-heading[b-673483a6zy],
        .sidebar-nav li[b-673483a6zy],
        .sidebar-footer[b-673483a6zy] {
            opacity: 0;
            transform: translateX(-8px);
        }
    }
}

/* ── Blazor Error UI ────────────────────────────── */

#blazor-error-ui[b-673483a6zy] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-673483a6zy] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Pages/AuditLog.razor.rz.scp.css */
/* ── Mobile card ─────────────────────────────────────── */

.audit-card[b-bcbyqzul1w] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.7rem 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.audit-card-top[b-bcbyqzul1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    min-width: 0;
}

.audit-card-time[b-bcbyqzul1w] {
    font-size: 0.72rem;
    color: var(--clr-text-muted);
    white-space: nowrap;
    flex-shrink: 0;
}

.audit-card-meta-row[b-bcbyqzul1w] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.audit-card-entity[b-bcbyqzul1w] {
    font-size: 0.73rem;
    padding: 0.1rem 0.45rem;
    border-radius: 4px;
    background: var(--clr-slate-100);
    color: var(--clr-text-secondary);
    white-space: nowrap;
}

.audit-card-user[b-bcbyqzul1w] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.78rem;
    color: var(--clr-text-secondary);
}

.audit-card-user--system[b-bcbyqzul1w] {
    color: var(--clr-text-muted);
    font-style: italic;
}

.audit-card-details[b-bcbyqzul1w] {
    font-size: 0.82rem;
    color: var(--clr-text-secondary);
    word-break: break-word;
    line-height: 1.4;
    padding-top: 0.35rem;
    margin-top: 0.05rem;
    border-top: 1px solid var(--clr-slate-100);
}

/* ── Table (desktop) ─────────────────────────────────── */

.audit-action-badge[b-bcbyqzul1w] {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-accent);
}

.audit-details-cell[b-bcbyqzul1w] {
    font-size: 0.85rem;
    color: var(--clr-text-secondary);
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Components/Pages/Calendar.razor.rz.scp.css */
/* ── Legend ──────────────────────────────────────────── */

.cal-legend[b-xa4es27abf] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 1rem;
    margin-bottom: 0.75rem;
}

.cal-legend-item[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--clr-slate-500);
}

.cal-legend-dot[b-xa4es27abf] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.cal-dot-open[b-xa4es27abf]        { background: var(--clr-amber-500); }
.cal-dot-inprogress[b-xa4es27abf]  { background: var(--clr-blue-500); }
.cal-dot-followup[b-xa4es27abf]    { background: var(--clr-violet-500); }
.cal-dot-completed[b-xa4es27abf]   { background: var(--clr-green-500); }
.cal-dot-cancelled[b-xa4es27abf]   { background: var(--clr-slate-400); }
.cal-dot-series[b-xa4es27abf]      { background: #10b981; }

/* ── Toolbar ─────────────────────────────────────── */

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

.cal-toolbar-actions[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

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

.cal-nav-btn[b-xa4es27abf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: none;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    color: var(--clr-slate-500);
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.cal-nav-btn:hover[b-xa4es27abf] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-900);
    border-color: var(--clr-slate-300);
}

.cal-today-btn[b-xa4es27abf] {
    height: 32px;
    padding: 0 0.85rem;
    background: none;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    color: var(--clr-slate-700);
    font-size: 0.82rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.cal-today-btn:hover[b-xa4es27abf] {
    background: var(--clr-slate-100);
    border-color: var(--clr-slate-300);
}

.cal-title[b-xa4es27abf] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin: 0 0 0 0.75rem;
    white-space: nowrap;
    letter-spacing: -0.01em;
}

/* ── Month view ─────────────────────────────────────── */

.cal-month[b-xa4es27abf] {
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    overflow: hidden;
    background: var(--clr-white);
    box-shadow: var(--shadow-sm);
}

.cal-weekday-header[b-xa4es27abf] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: var(--clr-slate-50);
    border-bottom: 1px solid var(--clr-slate-200);
}

.cal-weekday[b-xa4es27abf] {
    text-align: center;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    padding: 0.6rem 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.cal-grid[b-xa4es27abf] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.cal-day[b-xa4es27abf] {
    min-height: 5.5rem;
    min-width: 0;
    overflow: hidden;
    border-right: 1px solid var(--clr-slate-100);
    border-bottom: 1px solid var(--clr-slate-100);
    padding: 0.4rem 0.35rem;
    cursor: pointer;
    transition: background 0.12s;
}

.cal-day:nth-child(7n)[b-xa4es27abf] {
    border-right: none;
}

.cal-day:hover[b-xa4es27abf] {
    background: var(--clr-slate-50);
}

.cal-day-outside[b-xa4es27abf] {
    background: var(--clr-slate-50);
}

.cal-day-outside .cal-day-number[b-xa4es27abf] {
    color: var(--clr-slate-300);
}

.cal-day-today[b-xa4es27abf] {
    background: var(--clr-blue-50);
}

.cal-day-today:hover[b-xa4es27abf] {
    background: var(--clr-blue-100);
}

.cal-day-today .cal-day-number[b-xa4es27abf] {
    background: var(--clr-blue-600);
    color: var(--clr-always-white);
    border-radius: 50%;
    width: 1.55rem;
    height: 1.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.cal-day-number[b-xa4es27abf] {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--clr-slate-700);
    margin-bottom: 0.25rem;
    padding: 0.1rem 0.15rem;
}

.cal-day-events[b-xa4es27abf] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cal-event[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.3rem;
    border-radius: 4px;
    font-size: 0.69rem;
    font-weight: 500;
    line-height: 1.3;
    overflow: hidden;
    white-space: nowrap;
}

.cal-event-dot[b-xa4es27abf] {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    flex-shrink: 0;
}

.cal-event-text[b-xa4es27abf] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.cal-event-more[b-xa4es27abf] {
    font-size: 0.67rem;
    color: var(--clr-slate-400);
    padding: 0.1rem 0.3rem;
}

/* Event color variants */
.cal-ev-open[b-xa4es27abf] { background: var(--clr-amber-100); color: var(--clr-amber-800); }
.cal-ev-open .cal-event-dot[b-xa4es27abf],
.cal-ev-open .cal-agenda-event-dot[b-xa4es27abf] { background: var(--clr-amber-500); }

.cal-ev-inprogress[b-xa4es27abf] { background: var(--clr-blue-100); color: var(--clr-blue-800); }
.cal-ev-inprogress .cal-event-dot[b-xa4es27abf],
.cal-ev-inprogress .cal-agenda-event-dot[b-xa4es27abf] { background: var(--clr-blue-500); }

.cal-ev-followup[b-xa4es27abf] { background: var(--clr-violet-50); color: var(--clr-violet-700); }
.cal-ev-followup .cal-event-dot[b-xa4es27abf],
.cal-ev-followup .cal-agenda-event-dot[b-xa4es27abf] { background: var(--clr-violet-500); }

.cal-ev-completed[b-xa4es27abf] { background: var(--clr-green-100); color: var(--clr-green-800); }
.cal-ev-completed .cal-event-dot[b-xa4es27abf],
.cal-ev-completed .cal-agenda-event-dot[b-xa4es27abf] { background: var(--clr-green-500); }

.cal-ev-cancelled[b-xa4es27abf] { background: var(--clr-slate-100); color: var(--clr-slate-500); }
.cal-ev-cancelled .cal-event-dot[b-xa4es27abf],
.cal-ev-cancelled .cal-agenda-event-dot[b-xa4es27abf] { background: var(--clr-slate-400); }

.cal-ev-series[b-xa4es27abf] { background: #d1fae5; color: #065f46; }
.cal-ev-series .cal-event-dot[b-xa4es27abf],
.cal-ev-series .cal-agenda-event-dot[b-xa4es27abf] { background: #10b981; }

/* ── Week view ─────────────────────────────────────── */

.cal-week[b-xa4es27abf] {
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    overflow: hidden;
    background: var(--clr-white);
    box-shadow: var(--shadow-sm);
}

.cal-weekday-date[b-xa4es27abf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    padding: 0.65rem 0.25rem;
}

.cal-weekday-name[b-xa4es27abf] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.cal-weekday-num[b-xa4es27abf] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--clr-slate-800);
    line-height: 1;
}

.cal-weekday-today .cal-weekday-name[b-xa4es27abf] {
    color: var(--clr-blue-600);
}

.cal-weekday-today .cal-weekday-num[b-xa4es27abf] {
    background: var(--clr-blue-600);
    color: var(--clr-always-white);
    border-radius: 50%;
    width: 1.7rem;
    height: 1.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.cal-week-body[b-xa4es27abf] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    min-height: 22rem;
    border-top: 1px solid var(--clr-slate-100);
}

.cal-week-col[b-xa4es27abf] {
    border-right: 1px solid var(--clr-slate-100);
    padding: 0.5rem 0.35rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.cal-week-col:last-child[b-xa4es27abf] {
    border-right: none;
}

.cal-week-col-today[b-xa4es27abf] {
    background: var(--clr-blue-50);
}

.cal-week-event[b-xa4es27abf] {
    display: block;
    text-decoration: none;
    border: 1px solid transparent;
    border-left-width: 3px;
    border-left-color: var(--clr-slate-300);
    border-radius: 6px;
    background: var(--clr-slate-50);
    padding: 0.35rem 0.45rem;
    transition: box-shadow 0.15s, transform 0.1s;
    color: inherit;
}

.cal-week-event:hover[b-xa4es27abf] {
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.cal-ev-open.cal-week-event[b-xa4es27abf]       { border-left-color: var(--clr-amber-500); background: var(--clr-amber-50); }
.cal-ev-inprogress.cal-week-event[b-xa4es27abf]  { border-left-color: var(--clr-blue-500);  background: var(--clr-blue-50); }
.cal-ev-followup.cal-week-event[b-xa4es27abf]    { border-left-color: var(--clr-violet-500); background: var(--clr-violet-50); }
.cal-ev-completed.cal-week-event[b-xa4es27abf]   { border-left-color: var(--clr-green-500);  background: var(--clr-green-50); }
.cal-ev-cancelled.cal-week-event[b-xa4es27abf]   { border-left-color: var(--clr-slate-400);  background: var(--clr-slate-50); opacity: 0.65; }
.cal-ev-series.cal-week-event[b-xa4es27abf]      { border-left-color: #10b981; background: #d1fae5; color: #065f46; }

.cal-week-event-title[b-xa4es27abf] {
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--clr-slate-800);
}

.cal-week-event-meta[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.2rem;
    font-size: 0.68rem;
    color: var(--clr-slate-500);
}

.cal-ev-cancelled .cal-week-event-title[b-xa4es27abf] {
    text-decoration: line-through;
    opacity: 0.6;
}

.cal-week-empty[b-xa4es27abf] {
    flex: 1;
}

/* ── Agenda view ────────────────────────────────────── */

.cal-agenda[b-xa4es27abf] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cal-agenda-day[b-xa4es27abf] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-xs);
}

.cal-agenda-date[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 1rem;
    background: var(--clr-slate-50);
    border-bottom: 1px solid var(--clr-slate-100);
}

.cal-agenda-date-today[b-xa4es27abf] {
    background: var(--clr-blue-50);
}

.cal-agenda-date-today .cal-agenda-weekday[b-xa4es27abf] {
    color: var(--clr-blue-600);
}

.cal-agenda-weekday[b-xa4es27abf] {
    font-weight: 700;
    font-size: 0.82rem;
    color: var(--clr-slate-700);
    text-transform: capitalize;
    min-width: 80px;
}

.cal-agenda-daynum[b-xa4es27abf] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

.cal-agenda-events[b-xa4es27abf] {
    display: flex;
    flex-direction: column;
}

.cal-agenda-event[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid var(--clr-slate-50);
    text-decoration: none;
    color: inherit;
    transition: background 0.12s;
}

.cal-agenda-event:last-child[b-xa4es27abf] {
    border-bottom: none;
}

.cal-agenda-event:hover[b-xa4es27abf] {
    background: var(--clr-slate-50);
}

.cal-agenda-event-dot[b-xa4es27abf] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.cal-agenda-event-body[b-xa4es27abf] {
    min-width: 0;
    flex: 1;
}

.cal-agenda-event-title[b-xa4es27abf] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.cal-ev-cancelled .cal-agenda-event-title[b-xa4es27abf] {
    text-decoration: line-through;
    opacity: 0.55;
}

.cal-agenda-event-info[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.2rem;
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.cal-agenda-event-type[b-xa4es27abf] {
    color: var(--clr-slate-400);
}

/* ── Subscribe panel ────────────────────────────────── */

.cal-subscribe-panel[b-xa4es27abf] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    padding: 1rem 1.25rem;
    margin-bottom: 1rem;
    box-shadow: var(--shadow-sm);
}

.cal-subscribe-header[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    margin-bottom: 0.5rem;
}

.cal-subscribe-desc[b-xa4es27abf] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin: 0 0 0.75rem;
    line-height: 1.5;
}

.cal-subscribe-url-row[b-xa4es27abf] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 0.6rem;
}

.cal-subscribe-url[b-xa4es27abf] {
    flex: 1;
    min-width: 0;
    padding: 0.45rem 0.65rem;
    font-size: 0.8rem;
    font-family: monospace;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-slate-50);
    color: var(--clr-slate-700);
    outline: none;
}

.cal-subscribe-url:focus[b-xa4es27abf] {
    border-color: var(--clr-blue-400);
}

.cal-subscribe-actions[b-xa4es27abf] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.cal-subscribe-hint[b-xa4es27abf] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--clr-amber-600);
    margin: 0;
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 639px) {
    .cal-day[b-xa4es27abf] {
        min-height: 3.5rem;
        padding: 0.2rem 0.15rem;
    }

    .cal-day-number[b-xa4es27abf] {
        font-size: 0.7rem;
    }

    .cal-event[b-xa4es27abf] {
        padding: 0;
        background: none;
        justify-content: center;
    }

    .cal-event-text[b-xa4es27abf] {
        display: none;
    }

    .cal-event-dot[b-xa4es27abf] {
        width: 5px;
        height: 5px;
        margin: 1px 0;
    }

    .cal-day-events[b-xa4es27abf] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 2px;
        justify-content: center;
    }

    .cal-event-more[b-xa4es27abf] {
        font-size: 0;
    }

    .cal-event-more[b-xa4es27abf]::after {
        content: '…';
        font-size: 0.6rem;
    }

    .cal-week-body[b-xa4es27abf] {
        min-height: 12rem;
    }

    .cal-week-event-title[b-xa4es27abf] {
        font-size: 0.72rem;
    }

    .cal-week-event-meta[b-xa4es27abf] {
        display: none;
    }

    .cal-week-event[b-xa4es27abf] {
        padding: 0.2rem 0.25rem;
    }

    .cal-weekday-num[b-xa4es27abf] {
        font-size: 0.85rem;
    }

    .cal-agenda-event[b-xa4es27abf] {
        padding: 0.5rem 0.75rem;
    }

    .cal-agenda-date[b-xa4es27abf] {
        padding: 0.5rem 0.75rem;
    }
}
/* /Components/Pages/Controlling/FormValues.razor.rz.scp.css */
.back-link[b-5tei0ys05o] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.88rem;
    margin-bottom: 1rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

.back-link:hover[b-5tei0ys05o] {
    color: var(--clr-blue-500);
}

.empty-hint[b-5tei0ys05o] {
    color: #94a3b8;
    margin-top: 1rem;
}

.form-values-table-wrapper[b-5tei0ys05o] {
    overflow-x: auto;
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    background: var(--clr-white);
}

.form-values-table[b-5tei0ys05o] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
    white-space: nowrap;
}

.form-values-table th[b-5tei0ys05o],
.form-values-table td[b-5tei0ys05o] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--clr-slate-100);
    text-align: left;
}

.form-values-table thead th[b-5tei0ys05o] {
    background: var(--clr-slate-50);
    font-weight: 600;
    color: var(--clr-slate-700);
    position: sticky;
    top: 0;
    z-index: 1;
}

.form-values-table thead th.sortable[b-5tei0ys05o] {
    cursor: pointer;
    user-select: none;
}

.form-values-table thead th.sortable:hover[b-5tei0ys05o] {
    background: var(--clr-slate-100);
}

[b-5tei0ys05o] .sort-icon {
    font-size: 0.7rem;
    margin-left: 0.25rem;
    opacity: 0.3;
}

[b-5tei0ys05o] .sort-icon.active {
    opacity: 1;
    color: var(--clr-blue-600, #2563eb);
}

.form-values-table tbody tr:hover[b-5tei0ys05o] {
    background: var(--clr-slate-50);
}

.form-values-table .col-meta[b-5tei0ys05o] {
    min-width: 100px;
}

.form-values-table .col-action[b-5tei0ys05o] {
    width: 1%;
    white-space: nowrap;
    text-align: center;
}

.badge[b-5tei0ys05o] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.badge-green[b-5tei0ys05o] {
    background: var(--clr-green-100, #dcfce7);
    color: var(--clr-green-700, #15803d);
}

.badge-amber[b-5tei0ys05o] {
    background: var(--clr-amber-100, #fef3c7);
    color: var(--clr-amber-700, #b45309);
}

.result-count[b-5tei0ys05o] {
    margin-top: 0.75rem;
    font-size: 0.82rem;
    color: var(--clr-slate-500);
}
/* /Components/Pages/Controlling/ProjectAnalytics.razor.rz.scp.css */
/* ── Stat grid ── */
.analytics-stat-grid[b-lu02ectpco] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.analytics-stat-grid-4[b-lu02ectpco] {
    grid-template-columns: 1fr 1fr;
}

.analytics-stat-card[b-lu02ectpco] {
    background: var(--clr-white);
    border-radius: 10px;
    border: 1px solid var(--clr-slate-200);
    border-left: 4px solid var(--clr-slate-200);
    padding: 1rem 1.1rem;
    transition: box-shadow 0.15s;
}

.analytics-stat-card:hover[b-lu02ectpco] {
    box-shadow: var(--shadow-sm);
}

.stat-accent-blue[b-lu02ectpco]    { border-left-color: var(--clr-blue-500); }
.stat-accent-cyan[b-lu02ectpco]    { border-left-color: var(--clr-cyan-500); }
.stat-accent-green[b-lu02ectpco]   { border-left-color: var(--clr-green-500); }
.stat-accent-slate[b-lu02ectpco]   { border-left-color: var(--clr-slate-500); }

.analytics-stat-value[b-lu02ectpco] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--clr-slate-900);
}

.analytics-stat-label[b-lu02ectpco] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    font-weight: 500;
}

/* ── Section containers ── */
.analytics-section[b-lu02ectpco] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
}

.analytics-section h2[b-lu02ectpco] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    margin: 0 0 1rem 0;
}

/* ── Charts common ── */
.chart-container[b-lu02ectpco] {
    margin-bottom: 1rem;
}

.chart-legend[b-lu02ectpco] {
    display: flex;
    gap: 1rem;
    margin-top: 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.legend-item[b-lu02ectpco] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.legend-dot[b-lu02ectpco] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

/* ── Project progress ── */
.project-progress-list[b-lu02ectpco] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.project-progress-row[b-lu02ectpco] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--clr-slate-100);
}

.project-progress-row:last-child[b-lu02ectpco] {
    border-bottom: none;
}

.project-progress-info[b-lu02ectpco] {
    width: 160px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.project-progress-name[b-lu02ectpco] {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--clr-slate-900);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-progress-name:hover[b-lu02ectpco] {
    color: var(--clr-blue-500);
}

.project-progress-workflow[b-lu02ectpco] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}

.project-progress-bar-area[b-lu02ectpco] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.project-progress-track[b-lu02ectpco] {
    flex: 1;
    background: var(--clr-slate-100);
    border-radius: 6px;
    height: 20px;
    overflow: hidden;
}

.project-progress-fill[b-lu02ectpco] {
    height: 100%;
    border-radius: 6px;
    transition: width 0.4s ease;
    min-width: 2px;
}

.project-progress-fill.progress-high[b-lu02ectpco] {
    background: linear-gradient(90deg, var(--clr-green-500), #4ade80);
}

.project-progress-fill.progress-mid[b-lu02ectpco] {
    background: linear-gradient(90deg, var(--clr-amber-500), var(--clr-amber-400));
}

.project-progress-fill.progress-low[b-lu02ectpco] {
    background: linear-gradient(90deg, var(--clr-blue-500), var(--clr-blue-400));
}

.project-progress-pct[b-lu02ectpco] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    width: 40px;
    text-align: right;
    flex-shrink: 0;
}

.project-progress-meta[b-lu02ectpco] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.1rem;
    flex-shrink: 0;
    width: 60px;
}

.project-progress-tasks[b-lu02ectpco] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--clr-slate-700);
}

.project-progress-days[b-lu02ectpco] {
    font-size: 0.72rem;
    color: var(--clr-slate-400);
}

/* ── Stacked bar chart ── */
.stacked-bar-chart[b-lu02ectpco] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.stacked-row[b-lu02ectpco] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.stacked-label[b-lu02ectpco] {
    width: 140px;
    flex-shrink: 0;
    font-size: 0.85rem;
    color: var(--clr-slate-700);
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.stacked-track[b-lu02ectpco] {
    flex: 1;
    background: var(--clr-slate-100);
    border-radius: 6px;
    height: 24px;
    overflow: hidden;
    display: flex;
}

.stacked-segment[b-lu02ectpco] {
    height: 100%;
    transition: width 0.4s ease;
    min-width: 0;
}

.stacked-segment:first-child[b-lu02ectpco] {
    border-radius: 6px 0 0 6px;
}

.stacked-segment:last-child[b-lu02ectpco] {
    border-radius: 0 6px 6px 0;
}

.stacked-segment:only-child[b-lu02ectpco] {
    border-radius: 6px;
}

.stacked-completed[b-lu02ectpco] {
    background: var(--clr-green-500);
}

.stacked-active[b-lu02ectpco] {
    background: var(--clr-blue-500);
}

.stacked-cancelled[b-lu02ectpco] {
    background: var(--clr-slate-400);
}

.stacked-value[b-lu02ectpco] {
    width: 40px;
    flex-shrink: 0;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    text-align: right;
}

/* ── Tables ── */
.table-container[b-lu02ectpco] {
    display: none;
    overflow-x: auto;
}

.data-table[b-lu02ectpco] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.data-table th[b-lu02ectpco] {
    background: var(--clr-slate-50);
    color: var(--clr-slate-600);
    font-weight: 600;
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 2px solid var(--clr-slate-200);
    white-space: nowrap;
}

.data-table td[b-lu02ectpco] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--clr-slate-100);
    color: var(--clr-slate-700);
}

.data-table tbody tr:hover[b-lu02ectpco] {
    background: var(--clr-slate-50);
}

/* ── Completed cards (mobile) ── */
.completed-cards[b-lu02ectpco] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.completed-card[b-lu02ectpco] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.85rem 1rem;
}

.completed-card-header[b-lu02ectpco] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.completed-card-title[b-lu02ectpco] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--clr-slate-900);
    word-break: break-word;
}

.completed-card-duration[b-lu02ectpco] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--clr-blue-500);
    background: var(--clr-blue-50);
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.completed-card-meta[b-lu02ectpco] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.completed-card-meta .meta-label[b-lu02ectpco] {
    color: var(--clr-slate-400);
}

/* ── Responsive ── */
@media (min-width: 640px) {
    .analytics-stat-grid-4[b-lu02ectpco] {
        grid-template-columns: repeat(4, 1fr);
    }

    .table-container[b-lu02ectpco] {
        display: block;
    }

    .completed-cards[b-lu02ectpco] {
        display: none;
    }
}

@media (min-width: 900px) {
    .analytics-stat-grid-4[b-lu02ectpco] {
        grid-template-columns: repeat(4, 1fr);
    }
}
/* /Components/Pages/Controlling/WorkOrderAnalytics.razor.rz.scp.css */
/* ── Stat grid ── */
.analytics-stat-grid[b-3es40y2gcd] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.analytics-stat-card[b-3es40y2gcd] {
    background: var(--clr-white);
    border-radius: 10px;
    border: 1px solid var(--clr-slate-200);
    border-left: 4px solid var(--clr-slate-200);
    padding: 1rem 1.1rem;
    transition: box-shadow 0.15s;
}

.analytics-stat-card:hover[b-3es40y2gcd] {
    box-shadow: var(--shadow-sm);
}

.stat-accent-blue[b-3es40y2gcd]    { border-left-color: var(--clr-blue-500); }
.stat-accent-amber[b-3es40y2gcd]   { border-left-color: var(--clr-amber-500); }
.stat-accent-cyan[b-3es40y2gcd]    { border-left-color: var(--clr-cyan-500); }
.stat-accent-green[b-3es40y2gcd]   { border-left-color: var(--clr-green-500); }
.stat-accent-red[b-3es40y2gcd]     { border-left-color: var(--clr-red-500); }
.stat-accent-slate[b-3es40y2gcd]   { border-left-color: var(--clr-slate-500); }

.analytics-stat-value[b-3es40y2gcd] {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--clr-slate-900);
}

.analytics-stat-label[b-3es40y2gcd] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    font-weight: 500;
}

/* ── Section containers ── */
.analytics-section[b-3es40y2gcd] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    padding: 1.25rem;
    margin-bottom: 1.25rem;
}

.analytics-section h2[b-3es40y2gcd] {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    margin: 0 0 1rem 0;
}

/* ── Charts common ── */
.chart-container[b-3es40y2gcd] {
    margin-bottom: 1rem;
}

/* ── Vertical bar chart (Monthly trend) ── */
.bar-chart[b-3es40y2gcd] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    height: 180px;
    padding: 0 0.25rem;
}

.bar-group[b-3es40y2gcd] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.bar-pair[b-3es40y2gcd] {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    flex: 1;
    width: 100%;
    justify-content: center;
}

.bar[b-3es40y2gcd] {
    width: 18px;
    min-height: 2px;
    border-radius: 4px 4px 0 0;
    transition: height 0.4s ease;
    position: relative;
}

.bar-created[b-3es40y2gcd] {
    background: var(--clr-blue-300);
}

.bar-completed[b-3es40y2gcd] {
    background: var(--clr-green-500);
}

.bar-value[b-3es40y2gcd] {
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    white-space: nowrap;
}

.bar-label[b-3es40y2gcd] {
    font-size: 0.72rem;
    color: var(--clr-slate-500);
    margin-top: 0.4rem;
    white-space: nowrap;
}

.chart-legend[b-3es40y2gcd] {
    display: flex;
    gap: 1rem;
    margin-top: 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.legend-item[b-3es40y2gcd] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.legend-dot[b-3es40y2gcd] {
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

.legend-created[b-3es40y2gcd] {
    background: var(--clr-blue-300);
}

.legend-completed[b-3es40y2gcd] {
    background: var(--clr-green-500);
}

/* ── Horizontal bar chart ── */
.horizontal-bar-chart[b-3es40y2gcd] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.h-bar-row[b-3es40y2gcd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.h-bar-label[b-3es40y2gcd] {
    width: 130px;
    flex-shrink: 0;
    font-size: 0.85rem;
    color: var(--clr-slate-700);
    font-weight: 500;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.h-bar-track[b-3es40y2gcd] {
    flex: 1;
    background: var(--clr-slate-100);
    border-radius: 6px;
    height: 22px;
    overflow: hidden;
}

.h-bar-fill[b-3es40y2gcd] {
    height: 100%;
    border-radius: 6px;
    background: linear-gradient(90deg, var(--clr-blue-500), var(--clr-blue-400));
    transition: width 0.4s ease;
    min-width: 2px;
}

.h-bar-fill.h-bar-user[b-3es40y2gcd] {
    background: linear-gradient(90deg, var(--clr-violet-500), var(--clr-violet-400));
}

.h-bar-value[b-3es40y2gcd] {
    width: 60px;
    flex-shrink: 0;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    text-align: right;
}

/* ── Tables ── */
.table-container[b-3es40y2gcd] {
    display: none;
    overflow-x: auto;
}

.data-table[b-3es40y2gcd] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.data-table th[b-3es40y2gcd] {
    background: var(--clr-slate-50);
    color: var(--clr-slate-600);
    font-weight: 600;
    padding: 0.6rem 0.75rem;
    text-align: left;
    border-bottom: 2px solid var(--clr-slate-200);
    white-space: nowrap;
}

.data-table td[b-3es40y2gcd] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--clr-slate-100);
    color: var(--clr-slate-700);
}

.data-table tbody tr:hover[b-3es40y2gcd] {
    background: var(--clr-slate-50);
}

/* ── Completed cards (mobile) ── */
.completed-cards[b-3es40y2gcd] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.completed-card[b-3es40y2gcd] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.85rem 1rem;
}

.completed-card-header[b-3es40y2gcd] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.completed-card-title[b-3es40y2gcd] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--clr-slate-900);
    word-break: break-word;
}

.completed-card-duration[b-3es40y2gcd] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--clr-blue-500);
    background: var(--clr-blue-50);
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
    flex-shrink: 0;
}

.completed-card-meta[b-3es40y2gcd] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.completed-card-meta .meta-label[b-3es40y2gcd] {
    color: var(--clr-slate-400);
}

/* ── Responsive ── */
@media (min-width: 640px) {
    .analytics-stat-grid[b-3es40y2gcd] {
        grid-template-columns: repeat(3, 1fr);
    }

    .table-container[b-3es40y2gcd] {
        display: block;
    }

    .completed-cards[b-3es40y2gcd] {
        display: none;
    }

    .h-bar-label[b-3es40y2gcd] {
        width: 180px;
    }
}

@media (min-width: 900px) {
    .analytics-stat-grid[b-3es40y2gcd] {
        grid-template-columns: repeat(6, 1fr);
    }

    .bar[b-3es40y2gcd] {
        width: 28px;
    }
}
/* /Components/Pages/Datenschutz.razor.rz.scp.css */
.legal-page[b-10yjhcypf3] {
    display: flex;
    justify-content: center;
    padding: 2rem 1rem;
}

.legal-card[b-10yjhcypf3] {
    width: 100%;
    max-width: 720px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    padding: 2rem 2rem 2.5rem;
    align-self: flex-start;
}

.legal-back[b-10yjhcypf3] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    text-decoration: none;
    margin-bottom: 1.5rem;
    transition: color 0.15s;
}

.legal-back:hover[b-10yjhcypf3] {
    color: var(--clr-slate-800);
}

.legal-title[b-10yjhcypf3] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin: 0 0 1.75rem 0;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--clr-slate-100);
}

.legal-section[b-10yjhcypf3] {
    margin-bottom: 1.75rem;
}

.legal-section h2[b-10yjhcypf3] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--clr-slate-800);
    margin: 0 0 0.6rem 0;
}

.legal-section h3[b-10yjhcypf3] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clr-slate-700);
    margin: 1rem 0 0.4rem 0;
}

.legal-section p[b-10yjhcypf3],
.legal-section li[b-10yjhcypf3] {
    font-size: 0.9rem;
    color: var(--clr-slate-600);
    line-height: 1.65;
    margin: 0 0 0.5rem 0;
}

.legal-section ul[b-10yjhcypf3] {
    padding-left: 1.35rem;
    margin: 0.4rem 0 0.5rem;
}

.legal-section li[b-10yjhcypf3] {
    margin-bottom: 0.3rem;
}
/* /Components/Pages/Favorites.razor.rz.scp.css */
.fav-section[b-vjr7qqgdom] {
    margin-bottom: 1.5rem;
}

.fav-section-header[b-vjr7qqgdom] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    color: var(--clr-slate-600);
}

.fav-section-header h2[b-vjr7qqgdom] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.fav-section-count[b-vjr7qqgdom] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    background: var(--clr-slate-100);
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}

.fav-list[b-vjr7qqgdom] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.fav-card[b-vjr7qqgdom] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.fav-card:hover[b-vjr7qqgdom] {
    border-color: var(--clr-blue-300);
    box-shadow: var(--shadow-sm);
}

.fav-card-icon[b-vjr7qqgdom] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-600);
}

.fav-card-body[b-vjr7qqgdom] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.fav-card-title[b-vjr7qqgdom] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fav-card-subtitle[b-vjr7qqgdom] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fav-card-actions[b-vjr7qqgdom] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fav-card-type[b-vjr7qqgdom] {
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--clr-slate-400);
    white-space: nowrap;
}

.fav-remove-btn[b-vjr7qqgdom] {
    color: var(--clr-slate-400);
    transition: color 0.15s;
}

.fav-remove-btn:hover[b-vjr7qqgdom] {
    color: var(--clr-red-500);
}

@media (max-width: 640px) {
    .fav-card-type[b-vjr7qqgdom] {
        display: none;
    }
}
/* /Components/Pages/Feedback/CreateReportModal.razor.rz.scp.css */
/* ── Header ───────────────────────────────────────────── */

.crm-header-icon[b-v7tr2jmfyk] {
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

/* ── Body ─────────────────────────────────────────────── */

.crm-body[b-v7tr2jmfyk] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin: 0 -1.5rem;
    padding: 0.5rem 1.5rem 0;
    max-height: calc(100vh - 14rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Field groups ─────────────────────────────────────── */

.crm-field[b-v7tr2jmfyk] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    margin-bottom: 0.6rem;
}

/* Direct children that should still span the full width.
   Everything else (the Switch group, etc.) keeps its intrinsic width. */
.crm-field > .crm-label[b-v7tr2jmfyk],
.crm-field > .crm-input-wrap[b-v7tr2jmfyk],
.crm-field > .crm-textarea[b-v7tr2jmfyk],
.crm-field > .crm-type-grid[b-v7tr2jmfyk],
.crm-field > .crm-drop[b-v7tr2jmfyk],
.crm-field > .crm-chip-list[b-v7tr2jmfyk],
.crm-field > .crm-warning[b-v7tr2jmfyk] {
    align-self: stretch;
}

.crm-label[b-v7tr2jmfyk] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    margin: 0;
}

.crm-label-icon[b-v7tr2jmfyk] {
    color: var(--clr-blue-400);
    flex-shrink: 0;
}

.crm-required[b-v7tr2jmfyk] {
    color: var(--clr-red-500);
    font-weight: 700;
}

.crm-label-hint[b-v7tr2jmfyk] {
    margin-left: auto;
    font-weight: 400;
    font-size: 0.72rem;
    color: var(--clr-slate-400);
}

.crm-hint[b-v7tr2jmfyk] {
    font-size: 0.72rem;
    color: var(--clr-slate-500);
    line-height: 1.4;
}

.crm-hint--align-end[b-v7tr2jmfyk] {
    align-self: flex-end;
}

/* ── Type cards ───────────────────────────────────────── */

.crm-type-grid[b-v7tr2jmfyk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.4rem;
}

.crm-type-card[b-v7tr2jmfyk] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    padding: 0.7rem 0.85rem;
    background: var(--clr-slate-50);
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 10px;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s, transform 0.1s;
}

.crm-type-card:hover[b-v7tr2jmfyk] {
    background: var(--clr-white);
    border-color: var(--clr-slate-300);
}

.crm-type-card .crm-type-icon[b-v7tr2jmfyk] {
    color: var(--clr-slate-400);
    transition: color 0.15s;
}

.crm-type-title[b-v7tr2jmfyk] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.crm-type-hint[b-v7tr2jmfyk] {
    font-size: 0.72rem;
    color: var(--clr-slate-500);
    line-height: 1.35;
}

/* Active states – tinted by type */

.crm-type-card--bug.active[b-v7tr2jmfyk] {
    background: var(--clr-red-50, #fef2f2);
    border-color: var(--clr-red-300, #fca5a5);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.08);
}

.crm-type-card--bug.active .crm-type-icon[b-v7tr2jmfyk] {
    color: var(--clr-red-600, #dc2626);
}

.crm-type-card--feature.active[b-v7tr2jmfyk] {
    background: #f5f3ff;
    border-color: #c4b5fd;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);
}

.crm-type-card--feature.active .crm-type-icon[b-v7tr2jmfyk] {
    color: #7c3aed;
}

.crm-type-card--feedback.active[b-v7tr2jmfyk] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-300, #93c5fd);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.08);
}

.crm-type-card--feedback.active .crm-type-icon[b-v7tr2jmfyk] {
    color: var(--clr-blue-600);
}

/* ── Decorated text input (title) ─────────────────────── */

.crm-input-wrap[b-v7tr2jmfyk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.crm-input-wrap.focused[b-v7tr2jmfyk] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.crm-input-wrap--invalid[b-v7tr2jmfyk],
.crm-input-wrap--invalid.focused[b-v7tr2jmfyk] {
    border-color: var(--clr-red-400, #f87171);
    background: var(--clr-red-50, #fef2f2);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.crm-input-icon[b-v7tr2jmfyk] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.crm-input[b-v7tr2jmfyk] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.88rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.crm-input[b-v7tr2jmfyk]::placeholder {
    color: var(--clr-slate-400);
}

/* ── Textarea ─────────────────────────────────────────── */

.crm-textarea[b-v7tr2jmfyk] {
    resize: vertical;
    min-height: 110px;
    font-family: inherit;
}

.crm-textarea--invalid[b-v7tr2jmfyk] {
    border-color: var(--clr-red-400, #f87171) !important;
    background: var(--clr-red-50, #fef2f2);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

/* ── File drop / picker ───────────────────────────────── */

.crm-drop[b-v7tr2jmfyk] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    padding: 0.85rem 1rem;
    background: var(--clr-blue-50);
    border: 1.5px dashed var(--clr-blue-200);
    border-radius: 10px;
    cursor: pointer;
    text-align: center;
    transition: background 0.15s, border-color 0.15s;
}

.crm-drop:hover[b-v7tr2jmfyk] {
    background: var(--clr-blue-100);
    border-color: var(--clr-blue-300);
}

.crm-drop-icon[b-v7tr2jmfyk] {
    color: var(--clr-blue-500);
}

.crm-drop-title[b-v7tr2jmfyk] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--clr-blue-700);
}

.crm-drop-hint[b-v7tr2jmfyk] {
    font-size: 0.72rem;
    color: var(--clr-slate-500);
}

/* ── Image chip list ──────────────────────────────────── */

.crm-chip-list[b-v7tr2jmfyk] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-top: 0.3rem;
}

.crm-chip[b-v7tr2jmfyk] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 0.6rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
}

.crm-chip-icon[b-v7tr2jmfyk] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.crm-chip-text[b-v7tr2jmfyk] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.crm-chip-title[b-v7tr2jmfyk] {
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-chip-hint[b-v7tr2jmfyk] {
    font-size: 0.7rem;
    color: var(--clr-slate-400);
}

.crm-chip-remove[b-v7tr2jmfyk] {
    flex-shrink: 0;
    color: var(--clr-slate-400);
}

.crm-chip-remove:hover[b-v7tr2jmfyk] {
    color: var(--clr-red-600, #dc2626);
}

/* ── Nutzungsbedingungen ──────────────────────────────── */

.crm-terms-field[b-v7tr2jmfyk] {
    margin-top: 0.4rem;
}

.crm-terms[b-v7tr2jmfyk] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.65rem 0.75rem;
    background: var(--clr-slate-50);
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    align-self: stretch;
    width: 100%;
}

.crm-terms:hover[b-v7tr2jmfyk] {
    background: var(--clr-slate-100);
    border-color: var(--clr-slate-300);
}

.crm-terms--invalid[b-v7tr2jmfyk],
.crm-terms--invalid:hover[b-v7tr2jmfyk] {
    border-color: var(--clr-red-400, #f87171);
    background: var(--clr-red-50, #fef2f2);
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.crm-terms-checkbox[b-v7tr2jmfyk] {
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    margin: 0.15rem 0 0 0;
    accent-color: var(--clr-blue-500);
    cursor: pointer;
}

.crm-terms-text[b-v7tr2jmfyk] {
    font-size: 0.8rem;
    line-height: 1.45;
    color: var(--clr-slate-700);
}

.crm-terms-link[b-v7tr2jmfyk] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    color: var(--clr-blue-600);
    text-decoration: underline;
    text-underline-offset: 2px;
    font-weight: 500;
}

.crm-terms-link:hover[b-v7tr2jmfyk] {
    color: var(--clr-blue-700);
}

/* ── Warning / error ──────────────────────────────────── */

.crm-warning[b-v7tr2jmfyk] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 0.4rem 0.6rem;
    font-size: 0.78rem;
}

.crm-error[b-v7tr2jmfyk] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--clr-red-50, #fef2f2);
    color: var(--clr-red-600, #dc2626);
    border: 1px solid var(--clr-red-200, #fecaca);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
}
/* /Components/Pages/Feedback/Feedback.razor.rz.scp.css */
.feedback-tabs[b-p7vlynscgn] {
    margin-bottom: 1rem;
}

.feedback-loading[b-p7vlynscgn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem;
    color: #64748b;
    justify-content: center;
}

.feedback-list[b-p7vlynscgn] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.feedback-card[b-p7vlynscgn] {
    display: flex;
    align-items: stretch;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: var(--surface-card, #fff);
    border: 1px solid var(--border-default, #e2e8f0);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.feedback-card:hover[b-p7vlynscgn] {
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.feedback-vote[b-p7vlynscgn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--border-default, #e2e8f0);
    border-radius: 8px;
    background: #f8fafc;
    cursor: pointer;
    color: #475569;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.feedback-vote:hover[b-p7vlynscgn] {
    border-color: #94a3b8;
    background: #e2e8f0;
}

.feedback-vote.voted[b-p7vlynscgn] {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #93c5fd;
}

.feedback-vote-count[b-p7vlynscgn] {
    font-weight: 600;
    font-size: 0.9rem;
    margin-top: 1px;
}

.feedback-body[b-p7vlynscgn] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.feedback-card-header[b-p7vlynscgn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.feedback-type-badge[b-p7vlynscgn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
}

.feedback-type-bug[b-p7vlynscgn] {
    background: #fee2e2;
    color: #b91c1c;
}

.feedback-type-feature[b-p7vlynscgn] {
    background: #ede9fe;
    color: #6d28d9;
}

.feedback-type-feedback[b-p7vlynscgn] {
    background: #e0f2fe;
    color: #0369a1;
}

.feedback-status[b-p7vlynscgn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    font-weight: 500;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    background: #f1f5f9;
    color: #475569;
}

.feedback-status-open[b-p7vlynscgn] {
    background: #fef3c7;
    color: #92400e;
}

.feedback-status-planned[b-p7vlynscgn] {
    background: #e0e7ff;
    color: #3730a3;
}

.feedback-status-inprogress[b-p7vlynscgn] {
    background: #dbeafe;
    color: #1d4ed8;
}

.feedback-status-done[b-p7vlynscgn],
.feedback-status-released[b-p7vlynscgn] {
    background: #dcfce7;
    color: #166534;
}

.feedback-status-rejected[b-p7vlynscgn],
.feedback-status-duplicate[b-p7vlynscgn] {
    background: #f1f5f9;
    color: #64748b;
}

.feedback-status-needsinfo[b-p7vlynscgn] {
    background: #ffedd5;
    color: #9a3412;
}

.feedback-visibility-badge[b-p7vlynscgn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    background: #f0fdf4;
    color: #166534;
}

.feedback-title[b-p7vlynscgn] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: inherit;
    line-height: 1.3;
}

.feedback-preview[b-p7vlynscgn] {
    margin: 0;
    font-size: 0.85rem;
    color: #64748b;
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.feedback-meta[b-p7vlynscgn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: #94a3b8;
}

.feedback-meta span[b-p7vlynscgn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.feedback-meta-company[b-p7vlynscgn] {
    color: #cbd5e1;
}
/* /Components/Pages/Feedback/FeedbackDetailModal.razor.rz.scp.css */
/* ── Header ───────────────────────────────────────────── */

.fbd-header-icon[b-draretah2i] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.fbd-header-icon--bug[b-draretah2i] {
    background: var(--clr-red-100, #fee2e2);
    color: var(--clr-red-600, #dc2626);
}

.fbd-header-icon--feature[b-draretah2i] {
    background: #ede9fe;
    color: #7c3aed;
}

.fbd-header-icon--feedback[b-draretah2i] {
    background: #dbeafe;
    color: var(--clr-blue-600, #2563eb);
}

.fbd-header-text[b-draretah2i] {
    flex: 1;
    min-width: 0;
}

.fbd-header-text h3[b-draretah2i] {
    margin: 0;
    font-size: 1rem;
    line-height: 1.3;
    word-break: break-word;
}

.fbd-header-meta[b-draretah2i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

/* ── Status / chips ───────────────────────────────────── */

.fbd-status[b-draretah2i] {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    letter-spacing: 0.02em;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
}

.fbd-status--open[b-draretah2i] {
    background: #fef3c7;
    color: #92400e;
}

.fbd-status--planned[b-draretah2i] {
    background: #e0e7ff;
    color: #3730a3;
}

.fbd-status--inprogress[b-draretah2i] {
    background: #dbeafe;
    color: #1d4ed8;
}

.fbd-status--done[b-draretah2i],
.fbd-status--released[b-draretah2i] {
    background: #dcfce7;
    color: #166534;
}

.fbd-status--rejected[b-draretah2i],
.fbd-status--duplicate[b-draretah2i] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
}

.fbd-status--needsinfo[b-draretah2i] {
    background: #ffedd5;
    color: #9a3412;
}

.fbd-chip[b-draretah2i] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
}

.fbd-chip--community[b-draretah2i] {
    background: #f0fdf4;
    color: #166534;
}

/* ── Body ─────────────────────────────────────────────── */

.fbd-body[b-draretah2i] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 0 -1.5rem;
    padding: 0.5rem 1.5rem 1rem;
    max-height: calc(100vh - 13rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

.fbd-meta-row[b-draretah2i] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.fbd-meta-item[b-draretah2i] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.fbd-meta-company[b-draretah2i] {
    color: var(--clr-slate-400);
}

/* ── Vote card ────────────────────────────────────────── */

.fbd-vote-card[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.85rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
}

.fbd-vote[b-draretah2i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.05rem;
    min-width: 52px;
    padding: 0.4rem 0.5rem;
    border: 1px solid var(--clr-slate-200);
    background: var(--clr-white);
    color: var(--clr-slate-600);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.fbd-vote:hover[b-draretah2i] {
    border-color: var(--clr-slate-300);
    background: var(--clr-slate-100);
}

.fbd-vote.voted[b-draretah2i] {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #93c5fd;
}

.fbd-vote-count[b-draretah2i] {
    font-weight: 700;
    font-size: 0.95rem;
}

.fbd-vote-text[b-draretah2i] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.fbd-vote-title[b-draretah2i] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--clr-slate-700);
}

.fbd-vote-hint[b-draretah2i] {
    font-size: 0.72rem;
    color: var(--clr-slate-500);
}

/* ── Sections ─────────────────────────────────────────── */

.fbd-section[b-draretah2i] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.fbd-section-label[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fbd-section-icon[b-draretah2i] {
    color: var(--clr-slate-400);
}

.fbd-section-count[b-draretah2i] {
    margin-left: 0.15rem;
    padding: 0.05rem 0.4rem;
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
}

.fbd-description[b-draretah2i] {
    padding: 0.75rem 0.875rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
    font-size: 0.88rem;
    line-height: 1.6;
    color: var(--clr-slate-700);
}

.fbd-description p[b-draretah2i] {
    margin: 0 0 0.4rem 0;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.fbd-description p:last-child[b-draretah2i] {
    margin-bottom: 0;
}

/* ── Image gallery ────────────────────────────────────── */

.fbd-gallery[b-draretah2i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 0.45rem;
}

.fbd-gallery-tile[b-draretah2i] {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    overflow: hidden;
    background: var(--clr-slate-100);
    border: 1px solid var(--clr-slate-200);
    cursor: zoom-in;
    transition: border-color 0.12s ease, transform 0.12s ease;
}

.fbd-gallery-tile:hover[b-draretah2i] {
    border-color: var(--clr-slate-300);
    transform: scale(1.02);
}

.fbd-gallery-tile img[b-draretah2i] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ── Divider ──────────────────────────────────────────── */

.fbd-divider[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0.4rem 0 0.25rem;
    color: var(--clr-slate-400);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.fbd-divider[b-draretah2i]::before,
.fbd-divider[b-draretah2i]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--clr-slate-100);
}

/* ── Comment input ────────────────────────────────────── */

.fbd-input-section[b-draretah2i] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.fbd-label[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    margin: 0;
}

.fbd-label-icon[b-draretah2i] {
    color: var(--clr-blue-400);
    flex-shrink: 0;
}

.fbd-textarea[b-draretah2i] {
    resize: vertical;
    min-height: 72px;
    font-family: inherit;
}

.fbd-input-actions[b-draretah2i] {
    display: flex;
    justify-content: flex-end;
}

/* ── Comment list ─────────────────────────────────────── */

.fbd-comment-list[b-draretah2i] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.fbd-comment-item[b-draretah2i] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
    padding: 0.7rem 0.85rem;
}

.fbd-comment-header[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.4rem;
}

.fbd-avatar[b-draretah2i] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--clr-blue-100, #dbeafe);
    color: var(--clr-blue-600, #2563eb);
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.fbd-comment-meta[b-draretah2i] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    flex: 1;
    min-width: 0;
}

.fbd-comment-author[b-draretah2i] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fbd-comment-date[b-draretah2i] {
    font-size: 0.72rem;
    color: var(--clr-slate-400);
}

.fbd-comment-content[b-draretah2i] {
    font-size: 0.85rem;
    color: var(--clr-slate-700);
    line-height: 1.55;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* ── States ───────────────────────────────────────────── */

.fbd-loading[b-draretah2i] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    color: var(--clr-slate-500);
    font-size: 0.85rem;
}

.fbd-error[b-draretah2i] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--clr-red-50, #fef2f2);
    color: var(--clr-red-600, #dc2626);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
}

.fbd-empty[b-draretah2i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    padding: 1.25rem 0 0.75rem;
    color: var(--clr-slate-300);
    text-align: center;
}

.fbd-empty p[b-draretah2i] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--clr-slate-400);
}
/* /Components/Pages/Forms/FormSubmissionList.razor.rz.scp.css */
.form-card[b-hjq45sgejz] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.form-card-header[b-hjq45sgejz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.form-card-title[b-hjq45sgejz] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-card-meta[b-hjq45sgejz] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.6rem;
}

.form-card-meta a[b-hjq45sgejz] {
    color: var(--clr-primary-600);
    text-decoration: none;
}

.form-card-meta a:hover[b-hjq45sgejz] {
    text-decoration: underline;
}

.meta-label[b-hjq45sgejz] {
    font-weight: 600;
    color: var(--clr-slate-600);
}

.form-card-footer[b-hjq45sgejz] {
    display: flex;
    justify-content: flex-end;
    gap: 0.4rem;
}

/* ─── Status badges ─── */

.form-status-badge[b-hjq45sgejz] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 99px;
    font-size: 0.72rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

.form-status-badge.status-submitted[b-hjq45sgejz] {
    background: var(--clr-green-50);
    color: var(--clr-green-700);
}

.form-status-badge.status-draft[b-hjq45sgejz] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
}
/* /Components/Pages/Forms/FormSubmissionPage.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════════
   FormSubmissionPage – Scoped Styles
   ══════════════════════════════════════════════════════════ */

.fs-header[b-oayupnrwzv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.fs-title[b-oayupnrwzv] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.fs-title h1[b-oayupnrwzv] {
    margin-bottom: 0;
}

.fs-status-badge[b-oayupnrwzv] {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.15rem 0.6rem;
    border-radius: 6px;
    white-space: nowrap;
}

.fs-status-badge.draft[b-oayupnrwzv] {
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.fs-status-badge.submitted[b-oayupnrwzv] {
    background: var(--clr-green-100);
    color: var(--clr-green-800);
}

.fs-status-badge.editing[b-oayupnrwzv] {
    background: var(--clr-blue-100);
    color: var(--clr-blue-800);
}

.fs-actions[b-oayupnrwzv] {
    display: flex;
    gap: 0.5rem;
}

.fs-id-badge[b-oayupnrwzv] {
    font-size: 0.78rem;
    font-weight: 600;
    font-family: 'Courier New', monospace;
    padding: 0.15rem 0.55rem;
    border-radius: 6px;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
    white-space: nowrap;
}

.fs-qr-strip[b-oayupnrwzv] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
}

.fs-qr-code[b-oayupnrwzv] {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fs-qr-code[b-oayupnrwzv]  svg {
    display: block;
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.fs-qr-info[b-oayupnrwzv] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.fs-qr-id[b-oayupnrwzv] {
    font-family: 'Courier New', monospace;
    font-weight: 700;
    font-size: 1rem;
    color: var(--clr-slate-800);
}

.fs-qr-label[b-oayupnrwzv] {
    font-size: 0.85rem;
    color: var(--clr-slate-600);
}

.fs-qr-date[b-oayupnrwzv] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

@media print {
    @page {
        margin: 1cm;
    }

    /* Hide all chrome/UI elements – only the form content prints */
    .back-link[b-oayupnrwzv],
    .fs-header[b-oayupnrwzv],
    .fs-share-panel[b-oayupnrwzv],
    .danger-zone[b-oayupnrwzv],
    .fs-tabs[b-oayupnrwzv] {
        display: none !important;
    }

    .fs-qr-strip[b-oayupnrwzv] {
        border: 1px solid #ccc;
        break-inside: avoid;
    }

    /* Reset any spacing that bloats the printable area */
    .fs-pages-container[b-oayupnrwzv],
    .fs-page-wrapper[b-oayupnrwzv],
    .fs-page-inner[b-oayupnrwzv] {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
    }

    .fs-form[b-oayupnrwzv] {
        border: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .fs-page-wrapper[b-oayupnrwzv] {
        display: block !important;
    }

    .fs-page-wrapper.fs-page-break[b-oayupnrwzv] {
        break-after: page;
        page-break-after: always;
    }

    .fs-page-wrapper:last-child[b-oayupnrwzv] {
        break-after: auto !important;
        page-break-after: auto !important;
    }
}

body.pdf-exporting .back-link[b-oayupnrwzv],
body.pdf-exporting .fs-header[b-oayupnrwzv],
body.pdf-exporting .fs-share-panel[b-oayupnrwzv],
body.pdf-exporting .danger-zone[b-oayupnrwzv],
body.pdf-exporting .fs-tabs[b-oayupnrwzv] {
    display: none !important;
}

body.pdf-exporting .fs-pages-container[b-oayupnrwzv],
body.pdf-exporting .fs-page-wrapper[b-oayupnrwzv],
body.pdf-exporting .fs-page-inner[b-oayupnrwzv] {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}


body.pdf-exporting .fs-form[b-oayupnrwzv] {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.pdf-exporting .fs-page-wrapper[b-oayupnrwzv] {
    display: block !important;
}

body.pdf-exporting .fs-page-wrapper.fs-page-break[b-oayupnrwzv] {
    break-after: page;
    page-break-after: always;
}

body.pdf-exporting .fs-page-wrapper:last-child[b-oayupnrwzv] {
    break-after: auto !important;
    page-break-after: auto !important;
}

/* ── Tabs ──────────────────────────────────────────────── */
.fs-tabs[b-oayupnrwzv] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    border-bottom: 2px solid var(--clr-slate-200);
    margin: 0.75rem 0 1rem;
}

.fs-tab[b-oayupnrwzv] {
    padding: 0.55rem 1rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    border-radius: 6px 6px 0 0;
}

.fs-tab:hover[b-oayupnrwzv] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-50);
}

.fs-tab.active[b-oayupnrwzv] {
    color: var(--clr-blue-600);
    border-bottom-color: var(--clr-blue-500);
    font-weight: 600;
}

/* ── Page wrappers ─────────────────────────────────────── */
.fs-pages-container[b-oayupnrwzv] {
    display: block;
}

.fs-page-wrapper[b-oayupnrwzv] {
    display: block;
}

.fs-page-wrapper + .fs-page-wrapper[b-oayupnrwzv] {
    margin-top: 1.5rem;
}

/* In tabbed mode (multiple pages) only the active wrapper is shown on screen */
.fs-page-wrapper.fs-multi[b-oayupnrwzv] {
    display: none;
}

.fs-page-wrapper.fs-multi.active[b-oayupnrwzv] {
    display: block;
}

.fs-qr-page[b-oayupnrwzv] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    font-weight: 500;
}

.fs-form[b-oayupnrwzv] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    padding: 1.5rem;
}

.fs-fields[b-oayupnrwzv] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 1.25rem;
}

.fs-field-wrapper[b-oayupnrwzv] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.fs-label[b-oayupnrwzv] {
    font-weight: 500;
    font-size: 0.88em;
    color: var(--clr-slate-700);
}

.fs-required[b-oayupnrwzv] {
    color: var(--clr-red-500);
    margin-left: 0.15rem;
}

.fs-description[b-oayupnrwzv] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin: 0;
}

.fs-help[b-oayupnrwzv] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    margin: 0;
}

.fs-layout-field[b-oayupnrwzv] {
    min-width: 0;
}

.fs-layout-field h2[b-oayupnrwzv],
.fs-layout-field h3[b-oayupnrwzv],
.fs-layout-field h4[b-oayupnrwzv] {
    margin-bottom: 0;
}

.fs-layout-field h2[b-oayupnrwzv] { font-size: 1.4em; }
.fs-layout-field h3[b-oayupnrwzv] { font-size: 1.15em; }
.fs-layout-field h4[b-oayupnrwzv] { font-size: 1em; }

.fs-layout-field hr[b-oayupnrwzv] {
    border: none;
    border-top: 1px solid var(--clr-slate-200);
    margin: 0.25rem 0;
}

.fs-paragraph[b-oayupnrwzv] {
    color: var(--clr-slate-600);
    font-size: 0.92em;
    margin: 0;
    white-space: pre-wrap;
}

.fs-columns[b-oayupnrwzv] {
    display: grid;
    gap: 1.25rem;
}

.fs-columns[data-cols="2"][b-oayupnrwzv] { grid-template-columns: 1fr 1fr; }
.fs-columns[data-cols="3"][b-oayupnrwzv] { grid-template-columns: 1fr 1fr 1fr; }
.fs-columns[data-cols="4"][b-oayupnrwzv] { grid-template-columns: 1fr 1fr 1fr 1fr; }

.fs-column[b-oayupnrwzv] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.fs-rating[b-oayupnrwzv] {
    display: flex;
    gap: 0.15rem;
}

.fs-star[b-oayupnrwzv] {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--clr-slate-300);
    padding: 0.1rem;
    transition: color 0.15s;
    display: flex;
    align-items: center;
}

.fs-star.filled[b-oayupnrwzv] {
    color: var(--clr-amber-400);
}

.fs-star:not(:disabled):hover[b-oayupnrwzv] {
    color: var(--clr-amber-500);
}

.fs-star:disabled[b-oayupnrwzv] {
    cursor: default;
}

.fs-multiselect[b-oayupnrwzv] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.fs-checkbox-option[b-oayupnrwzv] {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.88rem;
    cursor: pointer;
}

.fs-checkbox-option input[type="checkbox"][b-oayupnrwzv] {
    accent-color: var(--clr-slate-800);
    width: 1rem;
    height: 1rem;
    margin-top: 0.1rem;
    flex-shrink: 0;
}

.fs-checkbox-content[b-oayupnrwzv] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.fs-checkbox-description[b-oayupnrwzv] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    font-weight: normal;
}

.fs-placeholder[b-oayupnrwzv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
    border: 1px dashed var(--clr-slate-300);
    border-radius: 8px;
    color: var(--clr-slate-400);
    font-size: 0.85rem;
}

/* ─── Share Panel ─── */

.fs-share-panel[b-oayupnrwzv] {
    background: var(--clr-blue-50);
    border: 1px solid var(--clr-blue-200);
    border-radius: 8px;
    padding: 0.85rem 1rem;
    margin-bottom: 1rem;
}

.fs-share-row[b-oayupnrwzv] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.4rem;
}

.fs-share-row .form-control[b-oayupnrwzv] {
    flex: 1;
    font-size: 0.82rem;
    background: var(--clr-white);
}

.fs-share-hint[b-oayupnrwzv] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    margin: 0;
}

/* ─── Responsive ─── */

@media (max-width: 639px) {
    .fs-columns[data-cols="2"][b-oayupnrwzv],
    .fs-columns[data-cols="3"][b-oayupnrwzv],
    .fs-columns[data-cols="4"][b-oayupnrwzv] {
        grid-template-columns: 1fr;
    }

    .fs-fields[b-oayupnrwzv] {
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }
}
/* /Components/Pages/Forms/FormTemplateEditor.razor.rz.scp.css */
/* ── Back link ─────────────────────────────────────────── */
.back-link[b-afdf1hlk3o] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.88rem;
    margin-bottom: 1rem;
}

.back-link:hover[b-afdf1hlk3o] {
    color: var(--clr-blue-500);
}

/* ── Header ───────────────────────────────────────────── */
.fe-header[b-afdf1hlk3o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.fe-title[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.fe-title h1[b-afdf1hlk3o] {
    margin: 0;
    font-size: 1.3rem;
}

.fe-publish-badge[b-afdf1hlk3o] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
}

.fe-publish-badge.published[b-afdf1hlk3o] {
    background: var(--clr-green-100);
    color: var(--clr-green-800);
}

.fe-publish-badge.draft[b-afdf1hlk3o] {
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.fe-actions[b-afdf1hlk3o] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.fe-tags-row[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

/* ── 3-Column Editor Layout ───────────────────────────── */
.fe-editor[b-afdf1hlk3o] {
    display: grid;
    grid-template-columns: 220px 1fr 300px;
    gap: 1rem;
    min-height: calc(100vh - 240px);
    align-items: start;
}

/* ── Toolbox (left) ───────────────────────────────────── */
.fe-toolbox[b-afdf1hlk3o] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    position: sticky;
    top: 1rem;
}

.fe-toolbox-title[b-afdf1hlk3o] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.5rem;
}

.fe-toolbox-title-spaced[b-afdf1hlk3o] {
    margin-top: 1rem;
}

.fe-toolbox-grid[b-afdf1hlk3o] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.4rem;
}

.fe-toolbox-item[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.55rem 0.25rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-slate-50);
    color: var(--clr-slate-700);
    font-size: 0.72rem;
    font-weight: 500;
    cursor: grab;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s, transform 0.15s;
    user-select: none;
    touch-action: none;
    -webkit-touch-callout: none;
}

.fe-toolbox-item:hover[b-afdf1hlk3o] {
    border-color: var(--clr-blue-300);
    background: var(--clr-blue-50);
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.fe-toolbox-item:active[b-afdf1hlk3o] {
    cursor: grabbing;
    transform: scale(0.95);
}

/* Layout toolbox items – distinct violet tint */
.fe-toolbox-item.fe-toolbox-layout[b-afdf1hlk3o] {
    border-color: var(--clr-violet-200);
    background: var(--clr-violet-50);
    color: var(--clr-violet-700);
}

.fe-toolbox-item.fe-toolbox-layout:hover[b-afdf1hlk3o] {
    border-color: var(--clr-violet-400);
    background: var(--clr-violet-100);
}

/* ── Canvas (center) ──────────────────────────────────── */
.fe-canvas[b-afdf1hlk3o] {
    background: var(--clr-slate-50);
    border: 2px dashed var(--clr-slate-200);
    border-radius: 12px;
    min-height: 400px;
    padding: 1rem;
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
}

.fe-canvas.drag-over[b-afdf1hlk3o] {
    border-color: var(--clr-blue-400);
    background: rgba(59, 130, 246, 0.04);
    box-shadow: inset 0 0 0 2px rgba(59, 130, 246, 0.08);
}

.fe-canvas.drag-over .fe-empty-canvas[b-afdf1hlk3o] {
    color: var(--clr-blue-400);
}

.fe-canvas.fe-drop-success[b-afdf1hlk3o] {
    animation: fe-drop-flash-b-afdf1hlk3o 0.4s ease-out;
}

@keyframes fe-drop-flash-b-afdf1hlk3o {
    0% { border-color: var(--clr-green-500); background: rgba(34, 197, 94, 0.08); }
    100% { border-color: var(--clr-slate-200); background: var(--clr-slate-50); }
}

/* ── Field landed animation ───────────────────────────── */
.fe-field-item.fe-just-landed[b-afdf1hlk3o] {
    animation: fe-field-land-b-afdf1hlk3o 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes fe-field-land-b-afdf1hlk3o {
    0% { opacity: 0; transform: translateY(-8px) scale(0.97); }
    60% { opacity: 1; transform: translateY(1px) scale(1.005); }
    100% { opacity: 1; transform: translateY(0) scale(1); }
}

.fe-empty-canvas[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 1rem;
    color: var(--clr-slate-400);
    text-align: center;
    transition: color 0.2s;
}

.fe-empty-canvas p[b-afdf1hlk3o] {
    margin: 0;
    font-size: 0.92rem;
}

/* ── Fields list – 12-column grid for width preview ───── */
.fe-fields-list[b-afdf1hlk3o] {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 0.5rem;
    position: relative;
}

/* ── Field item ───────────────────────────────────────── */
.fe-field-item[b-afdf1hlk3o] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    padding: 0.75rem;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, opacity 0.15s, transform 0.15s;
    position: relative;
    min-width: 0;
}

.fe-field-item:hover[b-afdf1hlk3o] {
    border-color: var(--clr-slate-300);
    box-shadow: var(--shadow-sm);
}

.fe-field-item.selected[b-afdf1hlk3o] {
    border-color: var(--clr-blue-500);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.fe-field-item.fe-dragging[b-afdf1hlk3o] {
    opacity: 0.25;
    transform: scale(0.97);
    box-shadow: none;
    pointer-events: none;
}

/* ── Layout field items – distinct dashed border ──────── */
.fe-field-item.fe-layout-item[b-afdf1hlk3o] {
    background: var(--clr-slate-50);
    border-style: dashed;
    border-color: var(--clr-slate-300);
}

.fe-field-item.fe-layout-item:hover[b-afdf1hlk3o] {
    border-color: var(--clr-slate-400);
}

.fe-field-item.fe-layout-item.selected[b-afdf1hlk3o] {
    border-color: var(--clr-blue-500);
    border-style: solid;
}

/* ── Drag handle ──────────────────────────────────────── */
.fe-drag-handle[b-afdf1hlk3o] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-top: 2px;
    color: var(--clr-slate-300);
    cursor: grab;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
    touch-action: none;
}

.fe-drag-handle:hover[b-afdf1hlk3o] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-100);
}

.fe-drag-handle:active[b-afdf1hlk3o] {
    cursor: grabbing;
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
}

/* ── Field content ────────────────────────────────────── */
.fe-field-content[b-afdf1hlk3o] {
    flex: 1;
    min-width: 0;
}

.fe-field-label-row[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.35rem;
    flex-wrap: wrap;
}

.fe-field-type-badge[b-afdf1hlk3o] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
    white-space: nowrap;
}

.fe-field-label[b-afdf1hlk3o] {
    font-weight: 600;
    font-size: 0.88em;
    color: var(--clr-slate-800);
}

.fe-required[b-afdf1hlk3o] {
    color: var(--clr-red-500);
    font-weight: 700;
    font-size: 1rem;
}

/* ── Width badge ──────────────────────────────────────── */
.fe-width-badge[b-afdf1hlk3o] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-600);
    border: 1px solid var(--clr-blue-200);
    white-space: nowrap;
}

/* ── Field preview ────────────────────────────────────── */
.fe-field-preview[b-afdf1hlk3o] {
    margin-top: 0.25rem;
}

.fe-field-preview :deep(input)[b-afdf1hlk3o],
.fe-field-preview :deep(textarea)[b-afdf1hlk3o],
.fe-field-preview :deep(select)[b-afdf1hlk3o] {
    max-width: 100%;
    pointer-events: none;
    opacity: 0.7;
    font-size: 0.82rem;
}

.fe-field-help[b-afdf1hlk3o] {
    font-size: 0.76rem;
    color: var(--clr-slate-400);
    margin-top: 0.3rem;
    font-style: italic;
}

/* ── Field actions (right side) ───────────────────────── */
.fe-field-actions[b-afdf1hlk3o] {
    flex-shrink: 0;
    display: flex;
    gap: 0.15rem;
    opacity: 0;
    transition: opacity 0.15s;
}

.fe-field-item:hover .fe-field-actions[b-afdf1hlk3o] {
    opacity: 1;
}

.fe-delete-btn:hover[b-afdf1hlk3o] {
    color: var(--clr-red-600) !important;
}

/* ── Properties Panel (right) ─────────────────────────── */
.fe-properties[b-afdf1hlk3o] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 240px);
    overflow-y: auto;
}

.fe-props-header[b-afdf1hlk3o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--clr-slate-200);
    position: sticky;
    top: 0;
    background: var(--clr-white);
    z-index: 1;
    border-radius: 10px 10px 0 0;
}

.fe-props-header h3[b-afdf1hlk3o] {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 600;
}

.fe-props-body[b-afdf1hlk3o] {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.fe-checkbox-group label[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.88rem;
    cursor: pointer;
}

/* ── Layout field previews ────────────────────────────── */
.fe-preview-heading[b-afdf1hlk3o] {
    margin: 0;
    font-weight: 700;
    color: var(--clr-slate-800);
    line-height: 1.3;
}

.fe-preview-heading[data-level="h2"][b-afdf1hlk3o] {
    font-size: 1.3em;
}

.fe-preview-heading[data-level="h3"][b-afdf1hlk3o] {
    font-size: 1.1em;
}

.fe-preview-heading[data-level="h4"][b-afdf1hlk3o] {
    font-size: 0.95em;
}

.fe-preview-paragraph[b-afdf1hlk3o] {
    margin: 0;
    font-size: 0.85em;
    color: var(--clr-slate-500);
    line-height: 1.5;
    white-space: pre-wrap;
    word-wrap: break-word;
}

.fe-preview-separator[b-afdf1hlk3o] {
    border: none;
    border-top: 2px solid var(--clr-slate-200);
    margin: 0.25rem 0;
}

.fe-preview-pagebreak[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.6rem 0.8rem;
    border-top: 2px dashed var(--clr-blue-400);
    border-bottom: 2px dashed var(--clr-blue-400);
    background: repeating-linear-gradient(
        45deg,
        var(--clr-blue-50),
        var(--clr-blue-50) 6px,
        transparent 6px,
        transparent 12px
    );
    color: var(--clr-blue-700);
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0.25rem 0;
}

/* ── Columns layout preview ──────────────────────────── */
.fe-preview-columns[b-afdf1hlk3o] {
    display: grid;
    gap: 0.5rem;
    margin: 0.25rem 0;
}

.fe-preview-columns[data-cols="2"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr;
}

.fe-preview-columns[data-cols="3"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr 1fr;
}

.fe-preview-columns[data-cols="4"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.fe-preview-col[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 0.5rem;
    border: 2px dashed var(--clr-violet-200);
    border-radius: 6px;
    background: var(--clr-violet-50);
    color: var(--clr-violet-400);
    font-size: 0.75rem;
    font-weight: 500;
    min-height: 48px;
}

/* ── Columns container (editor) ──────────────────────── */
.fe-columns-wrapper[b-afdf1hlk3o] {
    flex-direction: column;
}

.fe-columns-wrapper > .fe-drag-handle[b-afdf1hlk3o] {
    position: absolute;
    top: 0.5rem;
    left: 0.5rem;
}

.fe-columns-wrapper > .fe-field-actions[b-afdf1hlk3o] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    opacity: 0;
    transition: opacity 0.15s;
}

.fe-columns-wrapper:hover > .fe-field-actions[b-afdf1hlk3o] {
    opacity: 1;
}

.fe-columns-header[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.5rem;
    padding-left: 2rem;
}

.fe-columns-grid[b-afdf1hlk3o] {
    display: grid;
    gap: 0.5rem;
}

.fe-columns-grid[data-cols="2"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr;
}

.fe-columns-grid[data-cols="3"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr 1fr;
}

.fe-columns-grid[data-cols="4"][b-afdf1hlk3o] {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.fe-column-zone[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    min-height: 60px;
    padding: 0.5rem;
    border: 2px dashed var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-slate-50);
    transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
}

.fe-column-zone.fe-zone-active[b-afdf1hlk3o] {
    border-color: var(--clr-blue-400);
    background: rgba(59, 130, 246, 0.06);
    box-shadow: inset 0 0 0 1px rgba(59, 130, 246, 0.15);
}

.fe-column-zone.fe-zone-active .fe-column-empty[b-afdf1hlk3o] {
    display: none;
}

.fe-column-empty[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 1rem 0.5rem;
    color: var(--clr-slate-400);
    font-size: 0.75rem;
    font-weight: 500;
}

/* ── Column child field items ────────────────────────── */
.fe-column-child[b-afdf1hlk3o] {
    font-size: 0.85rem;
    padding: 0.5rem;
    border-radius: 6px;
}

.fe-column-child .fe-drag-handle[b-afdf1hlk3o] {
    width: 20px;
    height: 20px;
}

.fe-column-child .fe-field-type-badge[b-afdf1hlk3o] {
    font-size: 0.62rem;
}

.fe-column-child .fe-field-label[b-afdf1hlk3o] {
    font-size: 0.8rem;
}

.fe-column-child .fe-field-preview[b-afdf1hlk3o] {
    margin-top: 0.15rem;
}

.fe-column-child .fe-field-preview :deep(input)[b-afdf1hlk3o],
.fe-column-child .fe-field-preview :deep(textarea)[b-afdf1hlk3o],
.fe-column-child .fe-field-preview :deep(select)[b-afdf1hlk3o] {
    font-size: 0.75rem;
    padding: 0.25rem 0.4rem;
}

/* ── Input field preview helpers ──────────────────────── */
.fe-preview-checkbox-wrapper[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fe-preview-checkbox[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    color: var(--clr-slate-600);
}

.fe-checkbox-content[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.fe-checkbox-label[b-afdf1hlk3o] {
    font-weight: 500;
}

.fe-checkbox-description[b-afdf1hlk3o] {
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.fe-preview-rating[b-afdf1hlk3o] {
    display: flex;
    gap: 0.15rem;
    color: var(--clr-amber-400);
}

.fe-preview-file[b-afdf1hlk3o],
.fe-preview-signature[b-afdf1hlk3o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border: 2px dashed var(--clr-slate-200);
    border-radius: 8px;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
}

.fe-preview-multiselect[b-afdf1hlk3o] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.fe-preview-more[b-afdf1hlk3o] {
    font-size: 0.76rem;
    color: var(--clr-slate-400);
    margin-left: 1.25rem;
}

/* ── Empty state ──────────────────────────────────────── */
.empty-state[b-afdf1hlk3o] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width: 960px) {
    .fe-editor[b-afdf1hlk3o] {
        grid-template-columns: 1fr;
    }

    .fe-toolbox[b-afdf1hlk3o] {
        position: static;
    }

    .fe-toolbox-grid[b-afdf1hlk3o] {
        grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    }

    .fe-properties[b-afdf1hlk3o] {
        position: static;
        max-height: none;
    }

    .fe-fields-list[b-afdf1hlk3o] {
        grid-template-columns: 1fr;
    }

    .fe-field-item[b-afdf1hlk3o] {
        grid-column: span 1 !important;
    }
}
/* /Components/Pages/Forms/FormTemplateList.razor.rz.scp.css */
.page-header[b-w3g7bg8u77] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header h1[b-w3g7bg8u77] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

/* ── Card grid ──────────────────────────────────── */
.card-grid[b-w3g7bg8u77] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

/* ── Empty state ────────────────────────────────── */
.empty-state[b-w3g7bg8u77] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

.empty-state h3[b-w3g7bg8u77] {
    margin-top: 1rem;
    color: var(--clr-slate-700);
}

.empty-state p[b-w3g7bg8u77] {
    margin-bottom: 1.25rem;
}
/* /Components/Pages/Forms/PublicFormSubmission.razor.rz.scp.css */
/* ─── Wrapper ─── */
.pf-wrapper[b-0qopef8ciw] {
    width: 100%;
    max-width: 860px;
}

.pf-container[b-0qopef8ciw] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ─── Header Card ─── */
.pf-header-card[b-0qopef8ciw] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 16px;
    padding: 1.5rem 2rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
}

.pf-header-top[b-0qopef8ciw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

/* ─── Brand ─── */
.pf-brand[b-0qopef8ciw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.pf-logo[b-0qopef8ciw] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    object-fit: contain;
}

.pf-brand-info[b-0qopef8ciw] {
    display: flex;
    flex-direction: column;
}

.pf-brand-text[b-0qopef8ciw] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--clr-slate-800);
    line-height: 1.2;
}

.pf-brand-tagline[b-0qopef8ciw] {
    font-size: 0.72rem;
    color: var(--clr-slate-400);
    letter-spacing: 0.02em;
}

/* ─── Toolbar ─── */
.pf-toolbar[b-0qopef8ciw] {
    display: flex;
    gap: 0.375rem;
}

.pf-toolbar-btn[b-0qopef8ciw] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-white);
    color: var(--clr-slate-600);
    font-size: 0.82rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pf-toolbar-btn:hover[b-0qopef8ciw] {
    background: var(--clr-slate-50);
    border-color: var(--clr-slate-300);
    color: var(--clr-slate-800);
}

.pf-toolbar-btn-primary[b-0qopef8ciw] {
    background: var(--clr-blue-500);
    color: var(--clr-white);
    border-color: var(--clr-blue-500);
}

.pf-toolbar-btn-primary:hover[b-0qopef8ciw] {
    background: var(--clr-blue-600);
    border-color: var(--clr-blue-600);
    color: var(--clr-white);
}

/* ─── Title + QR Section ─── */
.pf-title-section[b-0qopef8ciw] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
}

.pf-title-text[b-0qopef8ciw] {
    flex: 1;
    min-width: 0;
}

.pf-title[b-0qopef8ciw] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin: 0 0 0.25rem;
    line-height: 1.3;
}

.pf-desc[b-0qopef8ciw] {
    font-size: 0.88rem;
    color: var(--clr-slate-500);
    margin: 0;
    line-height: 1.5;
}

/* ─── Title Row with ID Badge ─── */
.pf-title-row[b-0qopef8ciw] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pf-id-badge[b-0qopef8ciw] {
    font-size: 0.75rem;
    font-weight: 600;
    font-family: monospace;
    padding: 0.2rem 0.5rem;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
    border-radius: 6px;
    white-space: nowrap;
}

/* ─── QR Block ─── */
.pf-qr-block[b-0qopef8ciw] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.pf-qr-code[b-0qopef8ciw] {
    width: 80px;
    height: 80px;
    padding: 4px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pf-qr-code[b-0qopef8ciw]  svg {
    display: block;
    width: 72px;
    height: 72px;
    flex-shrink: 0;
}

/* ─── Submitted Banner ─── */
.pf-submitted-banner[b-0qopef8ciw] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.25rem;
    padding: 0.875rem 1rem;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    color: #166534;
}

.pf-submitted-banner strong[b-0qopef8ciw] {
    display: block;
    font-size: 0.88rem;
}

.pf-submitted-date[b-0qopef8ciw] {
    display: block;
    font-size: 0.78rem;
    opacity: 0.8;
}

/* ─── Empty State ─── */
.pf-card-empty[b-0qopef8ciw] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 16px;
    padding: 3rem 2rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    max-width: 480px;
    margin: 0 auto;
    text-align: center;
}

.pf-card-empty .pf-brand[b-0qopef8ciw] {
    justify-content: center;
    margin-bottom: 2rem;
}

.pf-empty[b-0qopef8ciw] {
    color: var(--clr-slate-400);
}

.pf-empty h2[b-0qopef8ciw] {
    color: var(--clr-slate-700);
    margin: 0.75rem 0 0.25rem;
    font-size: 1.2rem;
}

.pf-empty p[b-0qopef8ciw] {
    color: var(--clr-slate-500);
    font-size: 0.88rem;
    margin: 0;
}

/* ─── Shared form styles (fs-* classes used in the form body) ─── */
.fs-paragraph[b-0qopef8ciw] {
    white-space: pre-wrap;
}

/* ─── Form Card ─── */
.pf-form-card[b-0qopef8ciw] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
}

/* ─── Submit Bar ─── */
.pf-submit-bar[b-0qopef8ciw] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--clr-slate-100);
}

.pf-submit-btn[b-0qopef8ciw] {
    padding: 0.625rem 1.75rem;
    font-size: 0.92rem;
    font-weight: 600;
    border-radius: 10px;
    gap: 0.5rem;
}

/* ─── Footer ─── */
.pf-footer[b-0qopef8ciw] {
    text-align: center;
    padding: 0.5rem 0 1rem;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}

/* ─── Responsive ─── */
@media (max-width: 640px) {
    .pf-header-card[b-0qopef8ciw],
    .pf-form-card[b-0qopef8ciw] {
        padding: 1.25rem 1rem;
        border-radius: 12px;
    }

    .pf-header-top[b-0qopef8ciw] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .pf-toolbar[b-0qopef8ciw] {
        width: 100%;
    }

    .pf-toolbar-btn[b-0qopef8ciw] {
        flex: 1;
        justify-content: center;
    }

    .pf-title-section[b-0qopef8ciw] {
        flex-direction: column;
        gap: 1rem;
    }

    .pf-qr-block[b-0qopef8ciw] {
        flex-direction: row;
        gap: 0.75rem;
        align-self: flex-start;
    }

    .pf-qr-code[b-0qopef8ciw] {
        width: 60px;
        height: 60px;
    }

    .pf-title[b-0qopef8ciw] {
        font-size: 1.25rem;
    }

    .pf-toolbar-label[b-0qopef8ciw] {
        display: inline;
    }
}

@media (max-width: 400px) {
    .pf-toolbar-label[b-0qopef8ciw] {
        display: none;
    }

    .pf-toolbar-btn[b-0qopef8ciw] {
        padding: 0.5rem;
    }
}

/* ─── Tabs ─── */
.pf-tabs[b-0qopef8ciw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    border-bottom: 2px solid var(--clr-slate-200);
    margin: 0 0 0.5rem;
    padding: 0 0.5rem;
}

.pf-tab[b-0qopef8ciw] {
    padding: 0.6rem 1.1rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    border-radius: 8px 8px 0 0;
}

.pf-tab:hover[b-0qopef8ciw] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-50);
}

.pf-tab.active[b-0qopef8ciw] {
    color: var(--clr-blue-600);
    border-bottom-color: var(--clr-blue-500);
    font-weight: 600;
}

/* ─── QR Strip (per page, inside form card) ─── */
.pf-qr-strip[b-0qopef8ciw] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
}

.pf-qr-code[b-0qopef8ciw] {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pf-qr-code[b-0qopef8ciw]  svg {
    display: block;
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.pf-qr-info[b-0qopef8ciw] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.pf-qr-id[b-0qopef8ciw] {
    font-family: 'Courier New', monospace;
    font-weight: 700;
    font-size: 1rem;
    color: var(--clr-slate-800);
}

.pf-qr-label[b-0qopef8ciw] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.pf-qr-date[b-0qopef8ciw] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

.pf-qr-page[b-0qopef8ciw] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    font-weight: 500;
}

/* ─── Page wrappers ─── */
.pf-page-wrapper[b-0qopef8ciw] {
    display: block;
}

.pf-page-wrapper.pf-multi[b-0qopef8ciw] {
    display: none;
}

.pf-page-wrapper.pf-multi.active[b-0qopef8ciw] {
    display: block;
}

.pf-page-inner[b-0qopef8ciw] {
    display: block;
}

.pf-page-header[b-0qopef8ciw] {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--clr-slate-400);
    padding-bottom: 0.75rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--clr-slate-100);
}

/* ─── Submitted Banner ─── */
.pf-submitted-date[b-0qopef8ciw] {
    margin-left: 0.4rem;
}

/* ─── Print ─── */
@media print {
    @page {
        margin: 1cm;
    }

    .pf-wrapper[b-0qopef8ciw] {
        background: white;
        padding: 0;
        max-width: none;
    }

    .pf-toolbar[b-0qopef8ciw],
    .pf-tabs[b-0qopef8ciw],
    .pf-submit-bar[b-0qopef8ciw],
    .pf-footer[b-0qopef8ciw] {
        display: none !important;
    }

    .pf-header-card[b-0qopef8ciw] {
        display: none !important;
    }

    .pf-qr-strip[b-0qopef8ciw] {
        border: 1px solid #ccc !important;
        break-inside: avoid;
    }

    .pf-container[b-0qopef8ciw],
    .pf-page-wrapper[b-0qopef8ciw],
    .pf-page-inner[b-0qopef8ciw] {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        gap: 0 !important;
    }

    .pf-form-card[b-0qopef8ciw] {
        box-shadow: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .pf-page-wrapper[b-0qopef8ciw] {
        display: block !important;
    }

    .pf-page-wrapper.pf-page-break[b-0qopef8ciw] {
        break-after: page;
        page-break-after: always;
    }

    .pf-page-wrapper:last-child[b-0qopef8ciw] {
        break-after: auto !important;
        page-break-after: auto !important;
    }
}

body.pdf-exporting .pf-tabs[b-0qopef8ciw],
body.pdf-exporting .pf-toolbar[b-0qopef8ciw],
body.pdf-exporting .pf-submit-bar[b-0qopef8ciw],
body.pdf-exporting .pf-footer[b-0qopef8ciw] {
    display: none !important;
}

body.pdf-exporting .pf-header-card[b-0qopef8ciw] {
    display: none !important;
}

body.pdf-exporting .pf-qr-strip[b-0qopef8ciw] {
    border: 1px solid #ccc !important;
    break-inside: avoid;
}

body.pdf-exporting .pf-wrapper[b-0qopef8ciw],
body.pdf-exporting .pf-container[b-0qopef8ciw],
body.pdf-exporting .pf-page-wrapper[b-0qopef8ciw],
body.pdf-exporting .pf-page-inner[b-0qopef8ciw] {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    gap: 0 !important;
    overflow: visible !important;
}


body.pdf-exporting .pf-form-card[b-0qopef8ciw] {
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.pdf-exporting .pf-page-wrapper[b-0qopef8ciw] {
    display: block !important;
}

body.pdf-exporting .pf-page-wrapper.pf-page-break[b-0qopef8ciw] {
    break-after: page;
    page-break-after: always;
}

body.pdf-exporting .pf-page-wrapper:last-child[b-0qopef8ciw] {
    break-after: auto !important;
    page-break-after: auto !important;
}
/* /Components/Pages/FormValues.razor.rz.scp.css */
/* /Components/Pages/Handbook/HandbookDetail.razor.rz.scp.css */
/* ── Back link ───────────────────────────────────────── */

.back-link[b-l1kprdnffu] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.82rem;
    margin-bottom: 0.25rem;
    transition: color 0.15s;
}

.back-link:hover[b-l1kprdnffu] {
    color: var(--clr-blue-500);
}

/* ── Article Hero ────────────────────────────────────── */

.article-hero[b-l1kprdnffu] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 0 1.5rem 0;
}

.article-hero-icon[b-l1kprdnffu] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

.article-hero-title[b-l1kprdnffu] {
    margin: 0 0 0.4rem 0;
    font-size: 1.55rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    letter-spacing: -0.02em;
    line-height: 1.25;
}

.article-hero-meta[b-l1kprdnffu] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.8rem;
    color: var(--clr-slate-400);
    margin-bottom: 0.6rem;
}

.article-hero-meta span[b-l1kprdnffu] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.article-draft-badge[b-l1kprdnffu] {
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.article-tags[b-l1kprdnffu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.handbook-tag[b-l1kprdnffu] {
    display: inline-block;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
    border-radius: 6px;
    padding: 0.2rem 0.55rem;
    font-size: 0.74rem;
    font-weight: 500;
}

/* ── Article Card ────────────────────────────────────── */

.article-card[b-l1kprdnffu] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    padding: 2rem 2.25rem;
    box-shadow: var(--shadow-sm);
    max-width: 820px;
}

/* ── Article Content ─────────────────────────────────── */

.handbook-article-content[b-l1kprdnffu] {
    font-size: 0.93rem;
    line-height: 1.75;
    color: var(--clr-slate-800);
}

.handbook-article-content h1[b-l1kprdnffu],
.handbook-article-content h2[b-l1kprdnffu],
.handbook-article-content h3[b-l1kprdnffu] {
    margin-top: 1.75rem;
    margin-bottom: 0.6rem;
    color: var(--clr-slate-900);
    letter-spacing: -0.01em;
}

.handbook-article-content h1[b-l1kprdnffu] { font-size: 1.35rem; }
.handbook-article-content h2[b-l1kprdnffu] { font-size: 1.12rem; border-bottom: 1px solid var(--clr-slate-100); padding-bottom: 0.35rem; }
.handbook-article-content h3[b-l1kprdnffu] { font-size: 1rem; }

.handbook-article-content p[b-l1kprdnffu] {
    margin: 0.65rem 0;
}

.handbook-article-content ul[b-l1kprdnffu],
.handbook-article-content ol[b-l1kprdnffu] {
    padding-left: 1.5rem;
    margin: 0.65rem 0;
}

.handbook-article-content li[b-l1kprdnffu] {
    margin-bottom: 0.25rem;
}

.handbook-article-content blockquote[b-l1kprdnffu] {
    border-left: 3px solid var(--clr-blue-500);
    background: var(--clr-blue-50);
    padding: 0.65rem 1rem;
    margin: 1rem 0;
    border-radius: 0 8px 8px 0;
    color: var(--clr-blue-800);
    font-style: italic;
}

.handbook-article-content img[b-l1kprdnffu] {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 0.75rem 0;
}

.handbook-article-content table[b-l1kprdnffu] {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
    font-size: 0.88rem;
}

.handbook-article-content th[b-l1kprdnffu],
.handbook-article-content td[b-l1kprdnffu] {
    border: 1px solid var(--clr-slate-200);
    padding: 0.55rem 0.85rem;
    text-align: left;
}

.handbook-article-content th[b-l1kprdnffu] {
    background: var(--clr-slate-50);
    font-weight: 600;
    color: var(--clr-slate-700);
}

.handbook-article-content pre[b-l1kprdnffu] {
    background: var(--clr-code-bg);
    color: var(--clr-code-text);
    padding: 1rem 1.25rem;
    border-radius: 10px;
    overflow-x: auto;
    font-size: 0.82rem;
    margin: 0.75rem 0;
    line-height: 1.6;
}

.handbook-article-content code[b-l1kprdnffu] {
    background: var(--clr-slate-100);
    color: var(--clr-pink-700);
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    font-size: 0.82rem;
}

.handbook-article-content pre code[b-l1kprdnffu] {
    background: none;
    color: inherit;
    padding: 0;
}

/* ── Deletion Banner ─────────────────────────────────── */

.deletion-banner[b-l1kprdnffu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1.1rem;
    background: var(--clr-red-50, #fef2f2);
    border: 1px solid var(--clr-red-200, #fecaca);
    border-radius: 10px;
    margin-bottom: 1.25rem;
    color: var(--clr-red-800, #991b1b);
}

.deletion-banner-content[b-l1kprdnffu] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.83rem;
}

.deletion-banner-content strong[b-l1kprdnffu] {
    font-size: 0.88rem;
    font-weight: 600;
}

.deletion-banner-content span[b-l1kprdnffu] {
    color: var(--clr-red-600, #dc2626);
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 640px) {
    .article-card[b-l1kprdnffu] {
        padding: 1.25rem 1rem;
    }

    .article-hero-title[b-l1kprdnffu] {
        font-size: 1.25rem;
    }

    .article-hero-icon[b-l1kprdnffu] {
        display: none;
    }
}
/* /Components/Pages/Handbook/HandbookDirectoryPage.razor.rz.scp.css */
/* ── Breadcrumb ─────────────────────────────────────── */

.handbook-dir-breadcrumb[b-d02asatlb2] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.35rem;
}

.handbook-dir-breadcrumb a[b-d02asatlb2] {
    color: var(--clr-slate-500);
    text-decoration: none;
}

.handbook-dir-breadcrumb a:hover[b-d02asatlb2] {
    color: var(--clr-blue-600);
    text-decoration: underline;
}

.handbook-dir-breadcrumb .sep[b-d02asatlb2] {
    color: var(--clr-slate-300);
}

/* ── Section title ───────────────────────────────────── */

.handbook-section-title[b-d02asatlb2] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin: 1.5rem 0 0.5rem;
}

/* ── Subdirectory grid ───────────────────────────────── */

.handbook-subdir-grid[b-d02asatlb2] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.6rem;
    margin-bottom: 1.5rem;
}

.handbook-subdir-card[b-d02asatlb2] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.85rem 1rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: all 0.15s ease;
}

.handbook-subdir-card:hover[b-d02asatlb2] {
    border-color: var(--clr-blue-200);
    background: var(--clr-blue-50);
}

.handbook-subdir-icon[b-d02asatlb2] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-500);
    border-radius: 9px;
    flex-shrink: 0;
}

.handbook-subdir-card:hover .handbook-subdir-icon[b-d02asatlb2] {
    background: var(--clr-blue-100);
}

.handbook-subdir-body[b-d02asatlb2] {
    flex: 1;
    min-width: 0;
}

.handbook-subdir-name[b-d02asatlb2] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.handbook-subdir-meta[b-d02asatlb2] {
    font-size: 0.76rem;
    color: var(--clr-slate-400);
    margin-top: 0.15rem;
}
/* /Components/Pages/Handbook/HandbookList.razor.rz.scp.css */
/* ── Article List ────────────────────────────────────── */

.handbook-list[b-p93dxlouop] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 2rem;
}

/* ── View Toggle ─────────────────────────────────────── */

.handbook-view-toggle[b-p93dxlouop] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin: 0.6rem 0 0.4rem;
    flex-wrap: wrap;
}

.handbook-tree-actions[b-p93dxlouop] {
    display: flex;
    gap: 0.4rem;
    flex-wrap: wrap;
}

/* ── Directory Tree (TOC) ──────────────────────────── */

.handbook-tree[b-p93dxlouop] {
    display: flex;
    flex-direction: column;
    margin-bottom: 2rem;
}

.handbook-tree-node[b-p93dxlouop] {
    display: flex;
    flex-direction: column;
}

.handbook-tree-row-wrapper[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-left: calc(var(--depth, 0) * 1.4rem);
    border-radius: 8px;
    transition: background 0.15s ease;
}

.handbook-tree-row-wrapper:hover[b-p93dxlouop] {
    background: var(--clr-slate-100);
}

.handbook-tree-row[b-p93dxlouop] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.6rem;
    border-radius: 8px;
    color: var(--clr-slate-700);
    font-size: 0.92rem;
    font-weight: 500;
    transition: background 0.15s ease;
    min-width: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
}

.handbook-tree-row-wrapper:hover .handbook-tree-row[b-p93dxlouop] {
    color: var(--clr-slate-900);
}

.handbook-tree-chevron[b-p93dxlouop] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    color: var(--clr-slate-400);
    transition: color 0.15s;
}

.handbook-tree-row-wrapper:hover .handbook-tree-chevron[b-p93dxlouop] {
    color: var(--clr-slate-600);
}

.handbook-tree-chevron-spacer[b-p93dxlouop] {
    display: inline-flex;
    width: 14px;
    flex-shrink: 0;
}

.handbook-tree-row-leaf[b-p93dxlouop] {
    cursor: default;
}

.handbook-tree-children[b-p93dxlouop] {
    animation: treeExpand-b-p93dxlouop 0.18s ease-out;
}

@keyframes treeExpand-b-p93dxlouop {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.handbook-tree-article[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-left: calc(var(--depth, 1) * 1.4rem + 1.6rem);
    border-radius: 8px;
    transition: background 0.15s ease;
}

.handbook-tree-article:hover[b-p93dxlouop] {
    background: var(--clr-slate-100);
}

.handbook-tree-article-row[b-p93dxlouop] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
    border-radius: 8px;
    color: var(--clr-slate-600);
    font-size: 0.88rem;
    font-weight: 400;
    border: none;
    background: transparent;
    cursor: pointer;
    text-align: left;
    transition: background 0.15s ease;
}

.handbook-tree-article:hover .handbook-tree-article-row[b-p93dxlouop] {
    color: var(--clr-slate-900);
}

.handbook-tree-name[b-p93dxlouop] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.handbook-tree-name-empty[b-p93dxlouop] {
    color: var(--clr-slate-400);
    font-style: italic;
}

.handbook-tree-count[b-p93dxlouop] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
}

.handbook-tree-kebab[b-p93dxlouop] {
    flex-shrink: 0;
    color: var(--clr-slate-400);
    opacity: 0.55;
    transition: opacity 0.15s ease, color 0.15s ease, background 0.15s ease;
}

.handbook-tree-row-wrapper:hover .handbook-tree-kebab[b-p93dxlouop],
.handbook-tree-row-wrapper:focus-within .handbook-tree-kebab[b-p93dxlouop],
.handbook-tree-article:hover .handbook-tree-kebab[b-p93dxlouop],
.handbook-tree-article:focus-within .handbook-tree-kebab[b-p93dxlouop] {
    opacity: 1;
}

.handbook-tree-kebab:hover[b-p93dxlouop] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-100);
    opacity: 1;
}

@media (hover: none) {
    .handbook-tree-kebab[b-p93dxlouop] {
        opacity: 1;
    }
}

.btn-icon-sm[b-p93dxlouop] {
    padding: 0.3rem;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: var(--clr-slate-500);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-icon-sm:hover[b-p93dxlouop] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-700);
}

/* ── Drag & Drop ────────────────────────────────────── */

.handbook-tree-row-wrapper[draggable="true"][b-p93dxlouop],
.handbook-tree-article[draggable="true"][b-p93dxlouop] {
    cursor: grab;
}

.handbook-tree-row-wrapper[draggable="true"]:active[b-p93dxlouop],
.handbook-tree-article[draggable="true"]:active[b-p93dxlouop] {
    cursor: grabbing;
}

.handbook-tree-node-dragging[b-p93dxlouop] {
    opacity: 0.45;
}

.handbook-drag-over-dir[b-p93dxlouop] {
    background: var(--clr-blue-50, #eff6ff) !important;
    outline: 2px dashed var(--clr-blue-400, #60a5fa);
    outline-offset: -2px;
}

.handbook-drop-indicator[b-p93dxlouop] {
    height: 6px;
    margin: -3px 0;
    padding-left: calc(var(--depth, 0) * 1.4rem);
    position: relative;
    z-index: 1;
}

.handbook-drop-indicator-active[b-p93dxlouop],
.handbook-drop-indicator.handbook-drop-indicator-active[b-p93dxlouop] {
    height: 2px;
    margin: 2px 0;
    background: var(--clr-blue-500, #3b82f6);
    border-radius: 2px;
    padding-left: 0;
    margin-left: calc(var(--depth, 0) * 1.4rem + 0.6rem);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.18);
}

.handbook-tree-article-wrapper > .handbook-drop-indicator-active[b-p93dxlouop],
.handbook-tree-article-wrapper > .handbook-drop-indicator.handbook-drop-indicator-active[b-p93dxlouop] {
    margin-left: calc(var(--depth, 0) * 1.4rem + 1.6rem + 0.6rem);
}

.handbook-tree-article-wrapper[b-p93dxlouop] {
    display: flex;
    flex-direction: column;
}

.handbook-root-drop[b-p93dxlouop] {
    margin-top: 0.6rem;
    padding: 0.65rem 0.85rem;
    border: 1.5px dashed var(--clr-slate-200);
    border-radius: 8px;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
    display: none;
    align-items: center;
    gap: 0.4rem;
    text-align: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.handbook-tree:has(.handbook-tree-node-dragging) .handbook-root-drop[b-p93dxlouop] {
    display: flex;
}

.handbook-drag-over-root[b-p93dxlouop] {
    border-color: var(--clr-blue-400, #60a5fa);
    background: var(--clr-blue-50, #eff6ff);
    color: var(--clr-blue-700, #1d4ed8);
}

/* ── Tag Filter Bar ─────────────────────────────────── */

.handbook-tag-filter-bar[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    background: var(--clr-blue-50);
    border: 1px solid var(--clr-blue-200);
    border-radius: 10px;
    margin-bottom: 0.8rem;
    font-size: 0.82rem;
    color: var(--clr-blue-800);
    animation: htfbIn-b-p93dxlouop 0.3s ease-out;
}

@keyframes htfbIn-b-p93dxlouop {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.handbook-tag-filter-bar strong[b-p93dxlouop] {
    font-weight: 650;
}

.handbook-tag-filter-clear[b-p93dxlouop] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-blue-200);
    border-radius: 6px;
    padding: 0.2rem 0.5rem;
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--clr-blue-500);
    cursor: pointer;
    transition: all 0.15s;
}

.handbook-tag-filter-clear:hover[b-p93dxlouop] {
    background: var(--clr-blue-100);
    border-color: var(--clr-blue-300);
}

/* ── Card ───────────────────────────────────────────── */

.handbook-card[b-p93dxlouop] {
    background: var(--clr-white);
    border-radius: 10px;
    padding: 1.1rem 1.25rem 1.15rem;
    cursor: pointer;
    transition: background 0.15s ease;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    text-decoration: none;
    color: inherit;
}

.handbook-card:hover[b-p93dxlouop] {
    background: var(--clr-slate-50);
}

.handbook-card-icon[b-p93dxlouop] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-500);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.handbook-card-body[b-p93dxlouop] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.handbook-card-header[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.handbook-card-title[b-p93dxlouop] {
    margin: 0;
    font-size: 0.97rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.handbook-draft-badge[b-p93dxlouop] {
    flex-shrink: 0;
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.handbook-card-summary[b-p93dxlouop] {
    font-size: 0.83rem;
    color: var(--clr-slate-500);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.handbook-card-footer[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.handbook-card-meta[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.76rem;
    color: var(--clr-slate-400);
}

.handbook-card-meta span[b-p93dxlouop] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.handbook-card-tags[b-p93dxlouop] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.55rem;
}

.handbook-tag[b-p93dxlouop] {
    display: inline-block;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
    border-radius: 6px;
    padding: 0.15rem 0.55rem;
    font-size: 0.73rem;
    font-weight: 500;
}

.handbook-tag-more[b-p93dxlouop] {
    background: var(--clr-slate-200);
    color: var(--clr-slate-400);
}

/* ── Deleted Articles Section ───────────────────────── */

.handbook-deleted-section[b-p93dxlouop] {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.handbook-deleted-header[b-p93dxlouop] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.07em;
    padding: 0 0.25rem 0.6rem;
}

.handbook-card-deleted[b-p93dxlouop] {
    opacity: 0.72;
    cursor: default;
    pointer-events: none;
}

.handbook-card-deleted button[b-p93dxlouop] {
    pointer-events: auto;
}

.handbook-card-deleted .handbook-card-icon[b-p93dxlouop] {
    background: var(--clr-red-50, #fef2f2);
    color: var(--clr-red-400, #f87171);
}

.handbook-card-deleted .handbook-card-title[b-p93dxlouop] {
    color: var(--clr-slate-400);
    text-decoration: line-through;
}

.handbook-deleted-badge[b-p93dxlouop] {
    flex-shrink: 0;
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-red-100, #fee2e2);
    color: var(--clr-red-700, #b91c1c);
}

/* ── Alpha Separator ────────────────────────────────── */

.handbook-alpha-sep[b-p93dxlouop] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--clr-slate-400);
    letter-spacing: 0.1em;
    padding: 1.2rem 0.25rem 0.35rem;
    text-transform: uppercase;
}

.handbook-alpha-sep[b-p93dxlouop]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--clr-slate-100);
}

.handbook-alpha-sep:first-child[b-p93dxlouop] {
    padding-top: 0.2rem;
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 640px) {
    .handbook-card[b-p93dxlouop] {
        padding: 0.9rem 1rem;
        gap: 0.75rem;
    }

    .handbook-card-icon[b-p93dxlouop] {
        width: 34px;
        height: 34px;
    }
}

/* /Components/Pages/Home.razor.rz.scp.css */
/* ── Hero / Search ────────────────────────────────────── */
.dash-hero[b-of0eowznlu] {
    text-align: center;
    padding: 1.5rem 0 1rem;
    position: relative;
    z-index: 100;
}

.dash-greeting[b-of0eowznlu] {
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 0 0.15rem;
    color: var(--clr-slate-900);
}

.dash-subtitle[b-of0eowznlu] {
    font-size: 0.88rem;
    color: var(--clr-slate-500);
    margin: 0 0 1.25rem;
}

.dash-search-container[b-of0eowznlu] {
    position: relative;
    max-width: 560px;
    margin: 0 auto;
}

.dash-search-wrap[b-of0eowznlu] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    background: var(--clr-white);
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.dash-search-wrap.has-dropdown[b-of0eowznlu] {
    border-radius: 12px;
    box-shadow: none;
}

.dash-search-wrap.focused[b-of0eowznlu] {
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1), var(--shadow-md);
}

    .dash-search-wrap.focused.has-dropdown[b-of0eowznlu] {
        box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.1), var(--shadow-md);
    }

/* ── Search dropdown ─────────────────────────────────────── */
@keyframes dash-dropdown-appear-b-of0eowznlu {
    from {
        opacity: 0;
        transform: translateY(-6px) ;
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dash-search-dropdown[b-of0eowznlu] {
    position: absolute;
    top: 115%;
    left: -5px;
    right: -5px;
    background: var(--clr-white);
    border-top: 1px solid var(--clr-slate-200);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    max-height: 420px;
    overflow-y: auto;
    padding: 0.25rem 0;
    border-radius: 12px;
    transform-origin: top center;
    animation: dash-dropdown-appear-b-of0eowznlu 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.dash-search-backdrop[b-of0eowznlu] {
    position: fixed;
    inset: 0;
    z-index: 99;
}

.dash-dropdown-empty[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 1rem;
    color: var(--clr-slate-400);
    font-size: 0.88rem;
    justify-content: center;
}

.dash-dropdown-results[b-of0eowznlu] {
    display: flex;
    flex-direction: column;
}

.dash-dropdown-group-header[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.5rem 1rem 0.2rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.dash-dropdown-group + .dash-dropdown-group[b-of0eowznlu] {
    border-top: 1px solid var(--clr-slate-100);
    margin-top: 0.15rem;
    padding-top: 0.15rem;
}

.dash-dropdown-more[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 1rem;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    border-top: 1px solid var(--clr-slate-100);
    margin-top: 0.1rem;
}

.dash-dropdown-group .dash-result-row[b-of0eowznlu] {
    padding: 0.45rem 1rem;
    border-radius: 0;
}

.dash-dropdown-group .dash-result-row:hover[b-of0eowznlu] {
    background: var(--clr-slate-50);
}

.dash-search-icon[b-of0eowznlu] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.dash-search-input[b-of0eowznlu] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.95rem;
    font-family: inherit;
    color: var(--clr-slate-800);
    min-width: 0;
}

.dash-search-input[b-of0eowznlu]::placeholder {
    color: var(--clr-slate-400);
}

.dash-search-clear[b-of0eowznlu] {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--clr-slate-400);
    border-radius: 6px;
    display: inline-flex;
    transition: color 0.15s, background 0.15s;
}

.dash-search-clear:hover[b-of0eowznlu] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-100);
}

.dash-qr-btn[b-of0eowznlu] {
    flex-shrink: 0;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--clr-slate-400);
    border-radius: 6px;
    display: inline-flex;
    padding: 4px;
    transition: color 0.15s, background 0.15s;
}

.dash-qr-btn:hover[b-of0eowznlu] {
    color: var(--clr-blue-600, #2563eb);
    background: var(--clr-slate-100);
}

.dash-search-hint[b-of0eowznlu] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    margin: 0;
    padding: 0.4rem 1rem;
    border-bottom: 1px solid var(--clr-slate-100);
}

/* ── Stats strip ─────────────────────────────────────── */
.dash-stats[b-of0eowznlu] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.dash-stat[b-of0eowznlu] {
    position: relative;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.85rem 1rem 0.7rem;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s;
}

.dash-stat:hover[b-of0eowznlu] {
    box-shadow: var(--shadow-sm);
}

.dash-stat-value[b-of0eowznlu] {
    display: block;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--clr-slate-900);
}

.dash-stat-label[b-of0eowznlu] {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    margin-top: 0.1rem;
}

.dash-stat-bar[b-of0eowznlu] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
}

.dash-stat-bar--amber[b-of0eowznlu]  { background: var(--clr-amber-500); }
.dash-stat-bar--blue[b-of0eowznlu]   { background: var(--clr-blue-500); }
.dash-stat-bar--green[b-of0eowznlu]  { background: var(--clr-green-500); }
.dash-stat-bar--violet[b-of0eowznlu] { background: var(--clr-violet-500); }
.dash-stat-bar--star[b-of0eowznlu]   { background: var(--clr-amber-400); }

/* ── Sections ────────────────────────────────────────── */
.dash-section[b-of0eowznlu] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.85rem;
    margin-bottom: 0.75rem;
}

.dash-section--urgent[b-of0eowznlu] {
    border-color: var(--clr-red-200);
    background: var(--clr-red-50);
}

.dash-section-header[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.65rem;
}

.dash-section-header h2[b-of0eowznlu] {
    margin: 0;
    font-size: 1rem;
    flex: 1;
}

.dash-section-icon[b-of0eowznlu] {
    flex-shrink: 0;
}

.dash-section-icon--blue[b-of0eowznlu]    { color: var(--clr-blue-500); }
.dash-section-icon--amber[b-of0eowznlu]   { color: var(--clr-amber-500); }
.dash-section-icon--violet[b-of0eowznlu]  { color: var(--clr-violet-500); }
.dash-section-icon--green[b-of0eowznlu]   { color: var(--clr-green-500); }
.dash-section-icon--emerald[b-of0eowznlu] { color: var(--clr-emerald-500); }

.dash-section-count[b-of0eowznlu] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    background: var(--clr-slate-100);
    padding: 0.12rem 0.5rem;
    border-radius: 9999px;
}

.dash-section-count--red[b-of0eowznlu] {
    color: var(--clr-red-800);
    background: var(--clr-red-100);
}

/* ── Search results ──────────────────────────────────── */
.dash-results[b-of0eowznlu] {
    display: flex;
    flex-direction: column;
}

.dash-result-row[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.5rem;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background 0.1s;
}

.dash-result-row:hover[b-of0eowznlu] {
    background: var(--clr-slate-50);
}

.dash-result-row + .dash-result-row[b-of0eowznlu] {
    border-top: 1px solid var(--clr-slate-100);
}

.dash-result-main[b-of0eowznlu] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    text-align: left;
}

.dash-result-title[b-of0eowznlu] {
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-result-sub[b-of0eowznlu] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dash-result-arrow[b-of0eowznlu] {
    color: var(--clr-slate-300);
    flex-shrink: 0;
}

/* ── Empty states ────────────────────────────────────── */
.dash-empty[b-of0eowznlu] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-400);
}

.dash-empty-icon[b-of0eowznlu] {
    opacity: 0.4;
    margin-bottom: 0.5rem;
}

.dash-empty p[b-of0eowznlu] {
    margin: 0;
    font-size: 0.92rem;
}

.dash-inline-empty[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 0.5rem;
    color: var(--clr-slate-400);
    font-size: 0.88rem;
}

.dash-inline-empty-icon[b-of0eowznlu] {
    color: var(--clr-green-500);
    flex-shrink: 0;
}

/* ── Project cards ───────────────────────────────────── */
.dash-project-grid[b-of0eowznlu] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.6rem;
}

/* ── Favorites grid ─────────────────────────────────── */
.dash-section-more[b-of0eowznlu] {
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--clr-blue-600);
    text-decoration: none;
    margin-left: auto;
}

.dash-section-more:hover[b-of0eowznlu] {
    text-decoration: underline;
}

.dash-fav-grid[b-of0eowznlu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.dash-fav-chip[b-of0eowznlu] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.75rem;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--clr-slate-700);
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 9999px;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
}

.dash-fav-chip:hover[b-of0eowznlu] {
    background: var(--clr-amber-50);
    border-color: var(--clr-amber-300);
    color: var(--clr-amber-800);
}

.dash-project-card[b-of0eowznlu] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.85rem 1rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-left: 3px solid var(--clr-violet-500);
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.15s;
}

.dash-project-card:hover[b-of0eowznlu] {
    box-shadow: var(--shadow-sm);
}

.dash-project-card-top[b-of0eowznlu] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.dash-project-card-name[b-of0eowznlu] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
}

.dash-project-card-template[b-of0eowznlu] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.dash-project-card-bottom[b-of0eowznlu] {
    display: flex;
    align-items: center;
}

.dash-project-card-progress[b-of0eowznlu] {
    flex: 1;
    min-width: 0;
}

/* ── Responsive ──────────────────────────────────────── */
@media (min-width: 640px) {
    .dash-hero[b-of0eowznlu] {
        padding: 2rem 0 1.25rem;
    }

    .dash-greeting[b-of0eowznlu] {
        font-size: 1.65rem;
    }

    .dash-stats[b-of0eowznlu] {
        grid-template-columns: repeat(5, 1fr);
    }

    .dash-section[b-of0eowznlu] {
        padding: 1.25rem;
    }

    .dash-project-grid[b-of0eowznlu] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 768px) {
    .dash-project-grid[b-of0eowznlu] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Components/Pages/Impressum.razor.rz.scp.css */
.legal-page[b-y2zb5b3mg9] {
    display: flex;
    justify-content: center;
    padding: 2rem 1rem;
}

.legal-card[b-y2zb5b3mg9] {
    width: 100%;
    max-width: 720px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 14px;
    padding: 2rem 2rem 2.5rem;
    align-self: flex-start;
}

.legal-back[b-y2zb5b3mg9] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    text-decoration: none;
    margin-bottom: 1.5rem;
    transition: color 0.15s;
}

.legal-back:hover[b-y2zb5b3mg9] {
    color: var(--clr-slate-800);
}

.legal-title[b-y2zb5b3mg9] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin: 0 0 1.75rem 0;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--clr-slate-100);
}

.legal-section[b-y2zb5b3mg9] {
    margin-bottom: 1.75rem;
}

.legal-section h2[b-y2zb5b3mg9] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--clr-slate-800);
    margin: 0 0 0.6rem 0;
}

.legal-section h3[b-y2zb5b3mg9] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clr-slate-700);
    margin: 1rem 0 0.4rem 0;
}

.legal-section p[b-y2zb5b3mg9],
.legal-section li[b-y2zb5b3mg9] {
    font-size: 0.9rem;
    color: var(--clr-slate-600);
    line-height: 1.65;
    margin: 0 0 0.5rem 0;
}

.legal-section ul[b-y2zb5b3mg9] {
    padding-left: 1.35rem;
    margin: 0.4rem 0 0.5rem;
}

.legal-section li[b-y2zb5b3mg9] {
    margin-bottom: 0.3rem;
}
/* /Components/Pages/Login.razor.rz.scp.css */
.login-page[b-vlc6g7ijrk] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100%;
}

.login-card[b-vlc6g7ijrk] {
    background: var(--clr-white);
    border-radius: 12px;
    border: 1px solid var(--clr-slate-200);
    padding: 2rem 1.75rem;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

/* ── Dark mode: elevated card ── */
html[data-theme="dark"] .login-card[b-vlc6g7ijrk] {
    background: #1b2a3d;
    border-color: #2d4561;
    box-shadow: 0 4px 32px rgba(0, 0, 0, 0.4);
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .login-card[b-vlc6g7ijrk] {
        background: #1b2a3d;
        border-color: #2d4561;
        box-shadow: 0 4px 32px rgba(0, 0, 0, 0.4);
    }
}

.login-brand[b-vlc6g7ijrk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin-bottom: 1.5rem;
    justify-content: center;
    flex-direction: column;
}

    .login-brand img[b-vlc6g7ijrk] {
        height: 50px;
    }

.login-card h1[b-vlc6g7ijrk] {
    text-align: center;
    font-size: 1.25rem;
    margin-bottom: 1.25rem;
}

.login-btn[b-vlc6g7ijrk] {
    width: 100%;
    padding: 0.65rem 1rem;
    font-size: 0.92rem;
}

.login-divider[b-vlc6g7ijrk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1.25rem 0;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
}

.login-divider[b-vlc6g7ijrk]::before,
.login-divider[b-vlc6g7ijrk]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--clr-slate-200);
}

.login-error[b-vlc6g7ijrk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--clr-red-50);
    color: var(--clr-red-600);
    border: 1px solid var(--clr-red-200);
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

/* /Components/Pages/Projects/ProjectDetail.razor.rz.scp.css */
.back-link[b-xtkpt0y6kq] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.88rem;
    margin-bottom: 0.75rem;
    flex-shrink: 0;
}

.back-link:hover[b-xtkpt0y6kq] {
    color: var(--clr-blue-500);
}

.page-wrapper[b-xtkpt0y6kq] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.project-page[b-xtkpt0y6kq] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.project-header[b-xtkpt0y6kq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    gap: 0.75rem;
    flex-shrink: 0;
}

.editor-toolbar[b-xtkpt0y6kq] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.toolbar-group[b-xtkpt0y6kq] {
    display: flex;
    gap: 0.35rem;
}

.project-title-row[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.project-title-row h1[b-xtkpt0y6kq] {
    margin: 0;
    font-size: 1.3rem;
}

.project-status-dot[b-xtkpt0y6kq] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}

.project-status-dot.status-active[b-xtkpt0y6kq] { background: var(--clr-blue-500); }
.project-status-dot.status-completed[b-xtkpt0y6kq] { background: var(--clr-emerald-500); }
.project-status-dot.status-cancelled[b-xtkpt0y6kq] { background: var(--clr-slate-400); }

.project-status-badge[b-xtkpt0y6kq] {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: 6px;
}

.project-status-badge.status-active[b-xtkpt0y6kq] {
    background: var(--clr-blue-100);
    color: var(--clr-blue-800);
}

.project-status-badge.status-completed[b-xtkpt0y6kq] {
    background: var(--clr-emerald-100);
    color: var(--clr-emerald-900);
}

.project-status-badge.status-cancelled[b-xtkpt0y6kq] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
}

/* Project meta card */
.project-meta[b-xtkpt0y6kq] {
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.8rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    margin-bottom: 0.5rem;
    flex-shrink: 0;
}

.project-meta-row[b-xtkpt0y6kq] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.project-meta-label[b-xtkpt0y6kq] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    min-width: 88px;
    padding-top: 0.2rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}

.project-meta-value[b-xtkpt0y6kq] {
    font-size: 0.88rem;
    color: var(--clr-slate-700);
    flex: 1;
    min-width: 0;
}

.project-progress[b-xtkpt0y6kq] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.project-progress-header[b-xtkpt0y6kq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.progress-text[b-xtkpt0y6kq] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
}

.progress-pct[b-xtkpt0y6kq] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-600);
}

.progress-bar-container[b-xtkpt0y6kq] {
    width: 100%;
    height: 8px;
    background: var(--clr-slate-200);
    border-radius: 4px;
    overflow: hidden;
}

.progress-bar[b-xtkpt0y6kq] {
    height: 100%;
    background: var(--clr-emerald-500);
    border-radius: 4px;
    transition: width 0.3s;
}

/* Flowchart */
.flowchart-container[b-xtkpt0y6kq] {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.flowchart-canvas[b-xtkpt0y6kq] {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    overflow: auto;
    cursor: grab;
}

.flowchart-canvas:active[b-xtkpt0y6kq] {
    cursor: grabbing;
}

.flowchart-inner[b-xtkpt0y6kq] {
    position: relative;
    width: 3000px;
    height: 2000px;
    background-image: radial-gradient(circle, var(--clr-slate-200) 1px, transparent 1px);
    background-size: 20px 20px;
}

.flowchart-edges[b-xtkpt0y6kq] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

/* Flow Nodes */
.flow-node[b-xtkpt0y6kq] {
    position: absolute;
    width: 200px;
    background: var(--clr-white);
    border: 2px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.65rem 0.75rem;
    cursor: pointer;
    z-index: 2;
    transition: border-color 0.15s, box-shadow 0.15s;
    user-select: none;
    touch-action: none;
}

.flow-node.editable[b-xtkpt0y6kq] {
    cursor: move;
}

.flow-node.not-clickable[b-xtkpt0y6kq] {
    cursor: default;
}

.flow-node:hover[b-xtkpt0y6kq] {
    box-shadow: var(--shadow-md);
}

.flow-node.selected[b-xtkpt0y6kq] {
    border-color: var(--clr-blue-500);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.flow-node.node-open[b-xtkpt0y6kq] {
    border-color: var(--clr-amber-400);
}

.flow-node.node-inprogress[b-xtkpt0y6kq] {
    border-color: var(--clr-blue-500);
    border-style: solid;
}

.flow-node.node-completed[b-xtkpt0y6kq] {
    border-color: var(--clr-emerald-500);
}

.flow-node.node-cancelled[b-xtkpt0y6kq] {
    border-color: var(--clr-slate-400);
    opacity: 0.7;
}

.flow-node.node-pending[b-xtkpt0y6kq] {
    border-color: var(--clr-slate-200);
    border-style: dashed;
    opacity: 0.6;
}

/* Form node accent (purple, like a form/document) */
.flow-node.form-node[b-xtkpt0y6kq] {
    border-color: var(--clr-violet-300);
}

.flow-node.form-node.selected[b-xtkpt0y6kq] {
    border-color: var(--clr-violet-500);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2);
}

.flow-node.form-node.node-completed[b-xtkpt0y6kq] {
    border-color: var(--clr-emerald-500);
}

.form-status-pill[b-xtkpt0y6kq] {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 99px;
    line-height: 1.2;
}

.form-status-pill.submitted[b-xtkpt0y6kq] {
    background: var(--clr-emerald-100);
    color: var(--clr-emerald-800);
}

.form-status-pill.open[b-xtkpt0y6kq] {
    background: var(--clr-violet-100);
    color: var(--clr-violet-800);
}

.flow-badge[b-xtkpt0y6kq] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    display: inline-block;
    margin-bottom: 0.3rem;
}

.flow-badge.start[b-xtkpt0y6kq] {
    background: var(--clr-emerald-100);
    color: var(--clr-emerald-900);
}

.flow-node-header[b-xtkpt0y6kq] {
    margin-bottom: 0.25rem;
}

.flow-node-name[b-xtkpt0y6kq] {
    font-weight: 600;
    font-size: 0.85rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

.flow-node-status[b-xtkpt0y6kq] {
    margin-top: 0.2rem;
}

.flow-node-status.pending[b-xtkpt0y6kq] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    font-style: italic;
}

.flow-node-reason[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.72rem;
    color: var(--clr-slate-400);
    margin-top: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Floating Task Panel */
.task-panel[b-xtkpt0y6kq] {
    position: fixed;
    top: 50%;
    right: 1.25rem;
    transform: translateY(-50%);
    width: 360px;
    max-height: 60vh;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    z-index: 50;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: max-height 0.25s ease, box-shadow 0.25s ease;
}

.task-panel.minimized[b-xtkpt0y6kq] {
    max-height: 44px;
}

.task-panel-header[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.65rem 1rem;
    background: var(--clr-slate-50);
    border-bottom: 1px solid var(--clr-slate-200);
    cursor: grab;
    user-select: none;
    flex-shrink: 0;
}

.task-panel-header:active[b-xtkpt0y6kq] {
    cursor: grabbing;
}

.task-panel.minimized .task-panel-header[b-xtkpt0y6kq] {
    border-bottom: none;
}

.task-panel-header:hover[b-xtkpt0y6kq] {
    background: var(--clr-slate-100);
}

.task-panel-title[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--clr-slate-700);
}

.task-panel-count[b-xtkpt0y6kq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 0.35rem;
    background: var(--clr-blue-500);
    color: var(--clr-always-white);
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 10px;
}

.task-panel-toggle[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    padding: 0.2rem;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}

.task-panel-toggle:hover[b-xtkpt0y6kq] {
    color: var(--clr-slate-700);
    background: var(--clr-slate-200);
}

.task-panel-body[b-xtkpt0y6kq] {
    flex: 1;
    overflow-y: auto;
    padding: 0.75rem;
}

/* Task List */
.task-panel h2[b-xtkpt0y6kq] {
    font-size: 1.1rem;
    margin-bottom: 0.75rem;
}

.no-tasks[b-xtkpt0y6kq] {
    color: var(--clr-slate-400);
    font-size: 0.88rem;
}

.task-list[b-xtkpt0y6kq] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.task-item[b-xtkpt0y6kq] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.75rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    cursor: pointer;
    transition: border-color 0.15s;
}

.task-item:hover[b-xtkpt0y6kq] {
    border-color: var(--clr-blue-500);
}

.task-info[b-xtkpt0y6kq] {
    flex: 1;
    min-width: 0;
}

.task-info strong[b-xtkpt0y6kq] {
    display: block;
    font-size: 0.9rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-info small[b-xtkpt0y6kq] {
    color: var(--clr-slate-400);
    font-size: 0.78rem;
}

.empty-state[b-xtkpt0y6kq] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

/* ── Danger Zone ──────────────────────────────────── */

.danger-zone[b-xtkpt0y6kq] {
    flex-shrink: 0;
    margin-top: 0.5rem;
}

.danger-actions[b-xtkpt0y6kq] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Pages/Projects/ProjectList.razor.rz.scp.css */
/* ── Card ───────────────────────────────────────────── */

.project-card[b-kx7a5ced95] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-left: 3px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    transition: box-shadow 0.15s;
}

.project-card:hover[b-kx7a5ced95] {
    box-shadow: var(--shadow-sm);
}

.project-card.status-active[b-kx7a5ced95]    { border-left-color: var(--clr-blue-500); }
.project-card.status-completed[b-kx7a5ced95] { border-left-color: var(--clr-emerald-500); }
.project-card.status-cancelled[b-kx7a5ced95] { border-left-color: var(--clr-slate-400); opacity: 0.75; }

/* ── Card Header ────────────────────────────────────── */

.project-card-header[b-kx7a5ced95] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.project-card-title[b-kx7a5ced95] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    min-width: 0;
    word-break: break-word;
}

/* ── Card Meta ───────────────────────────────────────── */

.project-card-meta[b-kx7a5ced95] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.4rem;
}

.project-card-meta .meta-label[b-kx7a5ced95] {
    color: var(--clr-slate-400);
}

/* ── Card Footer ─────────────────────────────────────── */

.project-card-footer[b-kx7a5ced95] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.project-card-progress[b-kx7a5ced95] {
    flex: 1;
    min-width: 0;
}
/* /Components/Pages/Series/SeriesList.razor.rz.scp.css */
.page-header[b-le56tziho8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header h1[b-le56tziho8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

/* ── Empty state ────────────────────────────────── */
.empty-state[b-le56tziho8] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

.empty-state h3[b-le56tziho8] {
    margin-top: 1rem;
    color: var(--clr-slate-700);
}

.empty-state p[b-le56tziho8] {
    margin-bottom: 1.25rem;
}

/* ── Table inline badge ─────────────────────────── */
.badge-inactive[b-le56tziho8] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: var(--clr-slate-200);
    color: var(--clr-slate-600);
    margin-left: 0.4rem;
    vertical-align: middle;
}

/* ── Table actions cell ─────────────────────────── */
.series-card-actions[b-le56tziho8] {
    display: flex;
    gap: 0.25rem;
}

/* ── Mobile card (used inside DataTable MobileCard) */
.series-card[b-le56tziho8] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    transition: box-shadow 0.15s ease;
}

.series-card:hover[b-le56tziho8] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.series-card.inactive[b-le56tziho8] {
    opacity: 0.6;
}

.series-card-header[b-le56tziho8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.series-card-title[b-le56tziho8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.95rem;
}

.series-card-body[b-le56tziho8] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.series-meta[b-le56tziho8] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.82rem;
    color: var(--clr-slate-500);
}

.series-meta span[b-le56tziho8] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

/* ── Status indicator ───────────────────────────── */
.series-status-dot[b-le56tziho8] {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    vertical-align: middle;
    margin: 0 4px 1px 2px;
    flex-shrink: 0;
}

.series-status-dot--active[b-le56tziho8] {
    background: #10b981;
    animation: series-pulse-active-b-le56tziho8 1.8s ease-in-out infinite;
}

.series-status-dot--inactive[b-le56tziho8] {
    background: #ef4444;
}

@keyframes series-pulse-active-b-le56tziho8 {
    0%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5); }
    50%       { box-shadow: 0 0 0 5px rgba(16, 185, 129, 0); }
}
/* /Components/Pages/Settings/AttributeManagement.razor.rz.scp.css */
.attr-mgmt-card[b-e9fothr0cf] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.attr-mgmt-card-name[b-e9fothr0cf] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    display: block;
}

.attr-mgmt-card-meta[b-e9fothr0cf] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
    margin-bottom: 0.4rem;
}
/* /Components/Pages/Settings/FeedbackSettingsPage.razor.rz.scp.css */
.settings-intro[b-3g2p7xwhh5] {
    color: var(--clr-slate-500);
    font-size: 0.9rem;
    margin: 0 0 1rem 0;
    max-width: 720px;
}

/* ── Card ─────────────────────────────────────────────── */

.fbs-card[b-3g2p7xwhh5] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    max-width: 720px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.fbs-card--success[b-3g2p7xwhh5] {
    border-color: #bbf7d0;
    background: linear-gradient(0deg, var(--clr-white), #f0fdf4 200%);
}

.fbs-card--pending[b-3g2p7xwhh5] {
    border-color: #fde68a;
    background: linear-gradient(0deg, var(--clr-white), #fffbeb 200%);
}

.fbs-card-header[b-3g2p7xwhh5] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 1rem;
    background: var(--clr-slate-50);
    border-bottom: 1px solid var(--clr-slate-100);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--clr-slate-600);
}

.fbs-card--success .fbs-card-header[b-3g2p7xwhh5] {
    background: #f0fdf4;
    border-bottom-color: #dcfce7;
    color: #166534;
}

.fbs-card--pending .fbs-card-header[b-3g2p7xwhh5] {
    background: #fffbeb;
    border-bottom-color: #fef3c7;
    color: #92400e;
}

.fbs-card-icon[b-3g2p7xwhh5] {
    color: var(--clr-slate-400);
}

.fbs-card-icon--success[b-3g2p7xwhh5] {
    color: #16a34a;
}

.fbs-card-icon--pending[b-3g2p7xwhh5] {
    color: #d97706;
}

.fbs-card-body[b-3g2p7xwhh5] {
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ── Field / label ────────────────────────────────────── */

.fbs-field[b-3g2p7xwhh5] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.fbs-label[b-3g2p7xwhh5] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-700);
}

.fbs-required[b-3g2p7xwhh5] {
    color: var(--clr-red-500);
    font-weight: 700;
}

.fbs-hint[b-3g2p7xwhh5] {
    color: var(--clr-slate-500);
    font-size: 0.78rem;
    line-height: 1.45;
    margin: 0;
}

.fbs-checkbox[b-3g2p7xwhh5] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    font-size: 0.78rem;
    color: var(--clr-slate-600);
}

/* ── Actions row ──────────────────────────────────────── */

.fbs-actions[b-3g2p7xwhh5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

/* ── Info / success / error pills ─────────────────────── */

.fbs-info[b-3g2p7xwhh5],
.fbs-success[b-3g2p7xwhh5],
.fbs-error[b-3g2p7xwhh5] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    font-size: 0.82rem;
    line-height: 1.4;
}

.fbs-info[b-3g2p7xwhh5] {
    background: var(--clr-blue-50);
    color: var(--clr-blue-700, #1d4ed8);
    border: 1px solid #bfdbfe;
}

.fbs-success[b-3g2p7xwhh5] {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.fbs-error[b-3g2p7xwhh5] {
    background: #fef2f2;
    color: var(--clr-red-600, #dc2626);
    border: 1px solid #fecaca;
}

/* ── Connected identity card ──────────────────────────── */

.fbs-identity[b-3g2p7xwhh5] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
    padding: 0.75rem 0.875rem;
}

.fbs-identity-row[b-3g2p7xwhh5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
}

.fbs-identity-label[b-3g2p7xwhh5] {
    min-width: 80px;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.fbs-identity-value[b-3g2p7xwhh5] {
    color: var(--clr-slate-800);
    font-weight: 500;
}

.fbs-toggle[b-3g2p7xwhh5] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    font-size: 0.85rem;
    color: var(--clr-slate-700);
}

/* ── Pending state ────────────────────────────────────── */

.fbs-pending-text[b-3g2p7xwhh5] {
    margin: 0;
    font-size: 0.88rem;
    color: var(--clr-slate-700);
    line-height: 1.5;
}

.fbs-pending-meta[b-3g2p7xwhh5] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.fbs-pending-meta span[b-3g2p7xwhh5] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.fbs-pending-spinner[b-3g2p7xwhh5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.75rem;
    background: #fef3c7;
    color: #92400e;
    border-radius: 8px;
    font-size: 0.82rem;
    align-self: flex-start;
}

.fbs-pending-spinner :first-child[b-3g2p7xwhh5] {
    animation: fbs-spin-b-3g2p7xwhh5 1.5s linear infinite;
}

@keyframes fbs-spin-b-3g2p7xwhh5 {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* ── Advanced (manual token) card ─────────────────────── */

.fbs-card--advanced[b-3g2p7xwhh5] {
    background: var(--clr-slate-50);
    border-color: var(--clr-slate-200);
}

.fbs-card-toggle[b-3g2p7xwhh5] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1rem;
    background: transparent;
    border: none;
    border-bottom: 1px solid transparent;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--clr-slate-600);
    text-align: left;
    transition: background 0.12s, color 0.12s;
}

.fbs-card-toggle:hover[b-3g2p7xwhh5] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-800);
}

.fbs-card-toggle-label[b-3g2p7xwhh5] {
    flex: 1;
    min-width: 0;
}

.fbs-card-toggle-arrow[b-3g2p7xwhh5] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.fbs-card--advanced > .fbs-card-body[b-3g2p7xwhh5] {
    border-top: 1px solid var(--clr-slate-200);
    background: var(--clr-white);
}

/* ── Warning pill ─────────────────────────────────────── */

.fbs-warning[b-3g2p7xwhh5] {
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
    padding: 0.55rem 0.75rem;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
    border-radius: 8px;
    font-size: 0.8rem;
    line-height: 1.45;
}

.fbs-warning :first-child[b-3g2p7xwhh5] {
    flex-shrink: 0;
    margin-top: 0.15rem;
}

/* ── Token input with embedded eye toggle ─────────────── */

.fbs-token-wrap[b-3g2p7xwhh5] {
    position: relative;
    display: flex;
}

.fbs-token-input[b-3g2p7xwhh5] {
    flex: 1;
    padding-right: 2.5rem !important;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
    font-size: 0.85rem;
    letter-spacing: 0.02em;
}

.fbs-token-toggle[b-3g2p7xwhh5] {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: var(--clr-slate-400);
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
}

.fbs-token-toggle:hover[b-3g2p7xwhh5] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-700);
}

.fbs-token-toggle.active[b-3g2p7xwhh5] {
    background: var(--clr-blue-50);
    color: var(--clr-blue-600);
}
/* /Components/Pages/Settings/GroupManagement.razor.rz.scp.css */
.dept-card[b-3w7pwm2iqf] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.dept-card-name[b-3w7pwm2iqf] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    display: block;
}

.dept-card-meta[b-3w7pwm2iqf] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
    margin-bottom: 0.4rem;
}

.focus-default-badge[b-3w7pwm2iqf] {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    padding: 0.15rem 0.5rem;
    background: var(--clr-blue-50);
    border: 1px solid var(--clr-blue-200);
    border-radius: 4px;
    color: var(--clr-blue-700);
    font-weight: 500;
}
/* /Components/Pages/Settings/InitialSetup.razor.rz.scp.css */
.setup-intro[b-70oej5jasc] {
    color: var(--clr-slate-500, #64748b);
    font-size: 0.9rem;
    margin: 0 0 1.5rem;
    max-width: 640px;
    line-height: 1.5;
}

.setup-loading[b-70oej5jasc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--clr-primary, #3b82f6);
    font-size: 0.9rem;
    margin-bottom: 1rem;
}

.setup-loading .icon[b-70oej5jasc] {
    animation: setup-spin-b-70oej5jasc 1s linear infinite;
}

@keyframes setup-spin-b-70oej5jasc {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ── Grid ─────────────────────────────────────── */

.setup-grid[b-70oej5jasc] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}

.setup-card[b-70oej5jasc] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1.25rem;
    border: 1px solid var(--clr-slate-200, #e2e8f0);
    border-radius: 10px;
    background: var(--clr-white, #fff);
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.1s;
    text-align: left;
    position: relative;
}

.setup-card:hover:not(:disabled)[b-70oej5jasc] {
    border-color: var(--clr-primary, #3b82f6);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.10);
    transform: translateY(-1px);
}

.setup-card:disabled[b-70oej5jasc] {
    opacity: 0.6;
    cursor: not-allowed;
}

.setup-card.generated[b-70oej5jasc] {
    border-color: var(--clr-green-300, #86efac);
    background: var(--clr-green-50, #f0fdf4);
}

.setup-card-icon[b-70oej5jasc] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--clr-slate-100, #f1f5f9);
    color: var(--clr-primary, #3b82f6);
    flex-shrink: 0;
}

.setup-card.generated .setup-card-icon[b-70oej5jasc] {
    background: var(--clr-green-100, #dcfce7);
    color: var(--clr-green-600, #16a34a);
}

.setup-card-body h3[b-70oej5jasc] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--clr-slate-800, #1e293b);
}

.setup-card-body p[b-70oej5jasc] {
    margin: 0.25rem 0 0;
    font-size: 0.82rem;
    color: var(--clr-slate-500, #64748b);
    line-height: 1.4;
}

.setup-card-badge[b-70oej5jasc] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--clr-green-600, #16a34a);
    margin-top: auto;
}

/* ── Responsive ─────────────────────────────────── */

@media (max-width: 640px) {
    .setup-grid[b-70oej5jasc] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Settings/LegalTextEditor.razor.rz.scp.css */
.legal-editor-section[b-fkogun2mmt] {
    margin-bottom: 2rem;
}

.legal-editor-heading[b-fkogun2mmt] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    margin: 0 0 0.25rem 0;
}

.legal-editor-hint[b-fkogun2mmt] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin: 0 0 0.75rem 0;
}

.legal-editor-hint code[b-fkogun2mmt] {
    background: var(--clr-slate-100);
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    font-size: 0.8rem;
    color: var(--clr-pink-700);
}

.legal-editor-wrap[b-fkogun2mmt] {
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    overflow: hidden;
}

.legal-editor-actions[b-fkogun2mmt] {
    margin-top: 0.75rem;
    display: flex;
    gap: 0.5rem;
}

.legal-editor-divider[b-fkogun2mmt] {
    border: none;
    border-top: 1px solid var(--clr-slate-200);
    margin: 2rem 0;
}
/* /Components/Pages/Settings/License.razor.rz.scp.css */
/* ── Status-Banner ──────────────────────────────────────── */
.lic-banner[b-428yrdoxoe] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 1rem;
    border-radius: 8px;
    font-size: 0.84rem;
    font-weight: 500;
    border: 1px solid transparent;
    margin-bottom: 1.25rem;
}

.lic-banner-dot[b-428yrdoxoe] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.lic-banner-label[b-428yrdoxoe] { font-weight: 600; }

.lic-banner-time[b-428yrdoxoe] {
    margin-left: auto;
    font-weight: 400;
    opacity: 0.7;
    font-size: 0.8rem;
}

.lic-banner--active[b-428yrdoxoe]          { background: #f0fdf4; border-color: #bbf7d0; color: #15803d; }
.lic-banner--active .lic-banner-dot[b-428yrdoxoe] {
    background: #22c55e;
    animation: lic-pulse-b-428yrdoxoe 2.2s ease-in-out infinite;
}

.lic-banner--approved[b-428yrdoxoe]        { background: #f0fdfa; border-color: #99f6e4; color: #0f766e; }
.lic-banner--approved .lic-banner-dot[b-428yrdoxoe] {
    background: #14b8a6;
    animation: lic-pulse-teal-b-428yrdoxoe 2.2s ease-in-out infinite;
}

.lic-banner--inactive
.lic-banner--inactive .lic-banner-dot[b-428yrdoxoe] { background: var(--clr-slate-400); }

.lic-banner--pending[b-428yrdoxoe]         { background: var(--clr-slate-50, #f8fafc); border-color: var(--clr-slate-200); color: var(--clr-slate-600); }
.lic-banner--pending .lic-banner-dot[b-428yrdoxoe] { background: var(--clr-slate-400); }

.lic-banner--disconnected[b-428yrdoxoe]    { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.lic-banner--disconnected .lic-banner-dot[b-428yrdoxoe] { background: #f59e0b; }

.lic-banner--error[b-428yrdoxoe]           { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.lic-banner--error .lic-banner-dot[b-428yrdoxoe] { background: #ef4444; }

@keyframes lic-pulse-b-428yrdoxoe {
    0%, 100% { box-shadow: 0 0 0 0   rgba(34, 197, 94, 0.4); }
    50%       { box-shadow: 0 0 0 5px rgba(34, 197, 94, 0);   }
}

@keyframes lic-pulse-teal-b-428yrdoxoe {
    0%, 100% { box-shadow: 0 0 0 0   rgba(20, 184, 166, 0.4); }
    50%       { box-shadow: 0 0 0 5px rgba(20, 184, 166, 0);   }
}

/* ── Grid ────────────────────────────────────────────────── */
.lic-grid[b-428yrdoxoe] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1rem;
}

/* ── Card ───────────────────────────────────────────────── */
.lic-card[b-428yrdoxoe] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.lic-card-header[b-428yrdoxoe] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.25rem;
    background: var(--clr-slate-50, #f8fafc);
    border-bottom: 1px solid var(--clr-slate-100);
}

.lic-card-icon-wrap[b-428yrdoxoe] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: #eff6ff;
    border-radius: 6px;
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

.lic-card-title[b-428yrdoxoe] {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--clr-slate-800);
}

.lic-card-body[b-428yrdoxoe] {
    padding: 1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
}

/* ── Definition list ────────────────────────────────────── */
.lic-dl[b-428yrdoxoe] {
    display: grid;
    grid-template-columns: minmax(120px, auto) 1fr;
    font-size: 0.875rem;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow: hidden;
}

.lic-dl dt[b-428yrdoxoe],
.lic-dl dd[b-428yrdoxoe] {
    padding: 0.45rem 0.75rem;
    margin: 0;
    align-self: center;
}

.lic-dl dt[b-428yrdoxoe] {
    color: var(--clr-slate-500);
    font-weight: 500;
    background: var(--clr-slate-50, #f8fafc);
    border-right: 1px solid var(--clr-slate-100);
}

.lic-dl dd[b-428yrdoxoe] {
    color: var(--clr-slate-800);
    word-break: break-all;
}

/* row separators (every pair after the first) */
.lic-dl dt:not(:first-child)[b-428yrdoxoe],
.lic-dl dd:not(:nth-child(2))[b-428yrdoxoe] {
    border-top: 1px solid var(--clr-slate-100);
}

/* ── Error box ──────────────────────────────────────────── */
.lic-error-box[b-428yrdoxoe] {
    display: flex;
    gap: 0.6rem;
    align-items: flex-start;
    padding: 0.75rem 0.9rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    font-size: 0.83rem;
}

.lic-error-icon[b-428yrdoxoe] {
    color: #ef4444;
    flex-shrink: 0;
    margin-top: 1px;
}

.lic-error-box strong[b-428yrdoxoe] {
    display: block;
    color: #991b1b;
    font-size: 0.82rem;
    margin-bottom: 0.25rem;
}

.lic-error-msg[b-428yrdoxoe] {
    margin: 0;
    color: #b91c1c;
    font-family: var(--font-mono, monospace);
    font-size: 0.79rem;
    word-break: break-all;
    white-space: pre-wrap;
}

/* ── Validity block ─────────────────────────────────────── */
.lic-validity[b-428yrdoxoe] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border-radius: 8px;
    margin: 0.75rem;
    font-size: 0.875rem;
}

.lic-validity-icon[b-428yrdoxoe] { flex-shrink: 0; margin-top: 1px; }

.lic-validity strong[b-428yrdoxoe] {
    display: block;
    font-size: 0.92rem;
    margin-bottom: 0.2rem;
}

.lic-validity p[b-428yrdoxoe] { margin: 0; opacity: 0.85; }

.lic-validity--valid[b-428yrdoxoe]   { background: #f0fdf4; border: 1px solid #bbf7d0; color: #14532d; padding: 0.9rem 1rem; }
.lic-validity--invalid[b-428yrdoxoe] { background: #fff7ed; border: 1px solid #fed7aa; color: #7c2d12; padding: 0.9rem 1rem; }

/* ── Inline status badge ────────────────────────────────── */
.lic-badge[b-428yrdoxoe] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.22rem 0.65rem;
    border-radius: 999px;
    font-size: 0.775rem;
    font-weight: 600;
}

.lic-badge--active[b-428yrdoxoe]       { background: #dcfce7; color: #166534; }
.lic-badge--approved[b-428yrdoxoe]     { background: #ccfbf1; color: #0f766e; }
.lic-badge--inactive
.lic-badge--pending[b-428yrdoxoe]      { background: var(--clr-slate-100); color: var(--clr-slate-600); }
.lic-badge--disconnected[b-428yrdoxoe] { background: #fef3c7; color: #92400e; }
.lic-badge--error[b-428yrdoxoe]        { background: #fee2e2; color: #991b1b; }

/* ── Status dot (card header) ───────────────────────────── */
.lic-status-dot[b-428yrdoxoe] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-left: auto;
    flex-shrink: 0;
}

.lic-status-dot--active[b-428yrdoxoe]       { background: #10b981; box-shadow: 0 0 0 3px rgba(16,185,129,.2); }
.lic-status-dot--approved[b-428yrdoxoe]     { background: #14b8a6; box-shadow: 0 0 0 3px rgba(20,184,166,.2); }
.lic-status-dot--inactive
.lic-status-dot--pending[b-428yrdoxoe]      { background: var(--clr-slate-400); }
.lic-status-dot--disconnected[b-428yrdoxoe] { background: #f59e0b; }
.lic-status-dot--error[b-428yrdoxoe]        { background: #ef4444; }

/* ── Features ───────────────────────────────────────────── */
.lic-features-label[b-428yrdoxoe] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.5rem;
}

.lic-features-list[b-428yrdoxoe] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.lic-feature-badge[b-428yrdoxoe] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.65rem;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    font-size: 0.775rem;
    font-weight: 500;
    color: #1e40af;
}

/* ── Module list ────────────────────────────────────────── */
.lic-module-list[b-428yrdoxoe] {
    list-style: none;
    margin: 0.75rem;
    padding: 0;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow: hidden;
}

.lic-module-item[b-428yrdoxoe] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.55rem 0.85rem;
    font-size: 0.875rem;
    border-top: 1px solid var(--clr-slate-100);
}

.lic-module-item:first-child[b-428yrdoxoe] { border-top: none; }

.lic-module-item--on[b-428yrdoxoe]  { color: #166534; background: #f0fdf4; }
.lic-module-item--off[b-428yrdoxoe] { color: var(--clr-slate-500); background: var(--clr-white); }

.lic-module-label[b-428yrdoxoe] {
    font-weight: 500;
    color: var(--clr-slate-800);
}

.lic-module-item--off .lic-module-label[b-428yrdoxoe] { color: var(--clr-slate-500); }

.lic-module-state[b-428yrdoxoe] {
    margin-left: auto;
    font-size: 0.775rem;
    font-weight: 600;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
}

.lic-module-item--on  .lic-module-state[b-428yrdoxoe] { background: #dcfce7; color: #166534; }
.lic-module-item--off .lic-module-state[b-428yrdoxoe] { background: var(--clr-slate-100); color: var(--clr-slate-500); }

/* ── Misc ───────────────────────────────────────────────── */
.lic-link[b-428yrdoxoe] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-blue-600);
    text-decoration: none;
    font-size: 0.875rem;
}

.lic-link:hover[b-428yrdoxoe] { text-decoration: underline; }

.lic-na[b-428yrdoxoe] {
    color: var(--clr-slate-400);
    font-style: italic;
    font-size: 0.875rem;
}

.lic-na--mt[b-428yrdoxoe] { margin: 0; }

.lic-hint[b-428yrdoxoe] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.775rem;
    color: var(--clr-slate-400);
}

/* ── Sidebar separator ──────────────────────────────────── */
:global(.sidebar-nav-separator)[b-428yrdoxoe] {
    height: 1px;
    background: var(--clr-slate-200);
    margin: 0.4rem 0.75rem;
    list-style: none;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 640px) {
    .lic-grid[b-428yrdoxoe]              { grid-template-columns: 1fr; }
    .lic-banner-time[b-428yrdoxoe]       { display: none; }

    .lic-dl[b-428yrdoxoe] {
        grid-template-columns: 1fr;
    }

    .lic-dl dt[b-428yrdoxoe] {
        padding-bottom: 0.1rem;
        border-right: none;
        border-top: 1px solid var(--clr-slate-100);
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        background: transparent;
    }

    .lic-dl dd[b-428yrdoxoe] {
        padding-top: 0;
        border-top: none;
        padding-bottom: 0.5rem;
    }

    .lic-dl dt:first-child[b-428yrdoxoe] { border-top: none; }
}
/* /Components/Pages/Settings/RoleManagement.razor.rz.scp.css */
.role-card[b-hhc9ybtkbl] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.role-management-card[b-hhc9ybtkbl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.color-picker[b-hhc9ybtkbl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.color-swatch[b-hhc9ybtkbl] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    transition: border-color 0.15s, transform 0.15s;
    padding: 0;
}

.color-swatch:hover[b-hhc9ybtkbl] {
    transform: scale(1.1);
}

.color-swatch.selected[b-hhc9ybtkbl] {
    border-color: var(--clr-slate-900);
    box-shadow: 0 0 0 2px white, 0 0 0 3px var(--clr-slate-400);
}

.role-checkbox-list[b-hhc9ybtkbl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.role-type-badge[b-hhc9ybtkbl] {
    display: inline-block;
    padding: 0.1rem 0.55rem;
    border-radius: 6px;
    font-size: 0.74rem;
    font-weight: 600;
    white-space: nowrap;
}

.role-type-system[b-hhc9ybtkbl] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
}

.role-type-dept[b-hhc9ybtkbl] {
    background: var(--clr-blue-100);
    color: var(--clr-blue-800);
}

.role-checkbox-item[b-hhc9ybtkbl] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    cursor: pointer;
}

.role-checkbox-item input[type="checkbox"][b-hhc9ybtkbl] {
    margin: 0;
}
/* /Components/Pages/Settings/ShareLinkManagement.razor.rz.scp.css */
.sl-card[b-ncazaqff04] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.sl-card-name[b-ncazaqff04] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-primary-600);
    display: block;
    text-decoration: none;
}

.sl-card-name:hover[b-ncazaqff04] {
    text-decoration: underline;
}

.sl-card-template[b-ncazaqff04] {
    font-size: 0.85rem;
    color: var(--clr-slate-700);
    display: block;
}

.sl-card-meta[b-ncazaqff04] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
    margin-bottom: 0.4rem;
}

.sl-link[b-ncazaqff04] {
    font-weight: 600;
    color: var(--clr-primary-600);
    text-decoration: none;
}

.sl-link:hover[b-ncazaqff04] {
    text-decoration: underline;
}
/* /Components/Pages/Settings/TagManagement.razor.rz.scp.css */
.tag-mgmt-card[b-9zd839kwg2] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.tag-mgmt-card-name[b-9zd839kwg2] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    display: block;
}

.tag-mgmt-card-meta[b-9zd839kwg2] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
    margin-bottom: 0.4rem;
}
/* /Components/Pages/Settings/UserManagement.razor.rz.scp.css */
.user-card[b-waa8ivpd84] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    margin-bottom: 0.6rem;
}

.user-card-header[b-waa8ivpd84] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.user-card-name[b-waa8ivpd84] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
}

.user-card-username[b-waa8ivpd84] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-left: 0.35rem;
}

.user-card-meta[b-waa8ivpd84] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.6rem;
}
/* /Components/Pages/Settings/WebhookManagement.razor.rz.scp.css */
.webhook-mgmt-card[b-zk0cuakci6] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem 1rem;
    margin-bottom: 0.5rem;
}

.webhook-mgmt-card-header[b-zk0cuakci6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

.webhook-mgmt-card-name[b-zk0cuakci6] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
}

.webhook-mgmt-card-type[b-zk0cuakci6] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
}

.webhook-mgmt-card-meta[b-zk0cuakci6] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    display: block;
    margin-bottom: 0.4rem;
}

.webhook-name-cell[b-zk0cuakci6] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.webhook-name-row[b-zk0cuakci6] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.webhook-desc[b-zk0cuakci6] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
}

.wh-badge[b-zk0cuakci6] {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 99px;
    font-size: 0.75rem;
    font-weight: 600;
}

.wh-badge-success[b-zk0cuakci6] {
    background: var(--clr-green-50);
    color: var(--clr-green-700);
}

.wh-badge-muted[b-zk0cuakci6] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-500);
}

.wh-badge-secondary[b-zk0cuakci6] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
}

[b-zk0cuakci6] .wh-icon-success { color: var(--clr-green-500); }
[b-zk0cuakci6] .wh-icon-error { color: var(--clr-red-500); }
/* /Components/Pages/Templates/TemplateCreate.razor.rz.scp.css */
.checklist-step-row[b-dsvgv149uq] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin-bottom: 0.75rem;
}

.checklist-step-inputs[b-dsvgv149uq] {
    flex: 1;
}

.checklist-step-actions[b-dsvgv149uq] {
    display: flex;
    gap: 0.25rem;
    align-items: flex-start;
    margin-top: 0.6rem;
}

.checklist-step-actions .btn-icon[b-dsvgv149uq] {
    padding: 0.4rem;
    border-radius: 4px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background 0.15s;
}

.checklist-step-actions .btn-icon:hover[b-dsvgv149uq] {
    background: var(--clr-slate-100);
}
/* /Components/Pages/Templates/TemplateList.razor.rz.scp.css */
.page-header[b-wnkhd3w3ac] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header h1[b-wnkhd3w3ac] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

/* ── Card grid ──────────────────────────────────── */
.card-grid[b-wnkhd3w3ac] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

/* ── Empty state ────────────────────────────────── */
.empty-state[b-wnkhd3w3ac] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

.empty-state h3[b-wnkhd3w3ac] {
    margin-top: 1rem;
    color: var(--clr-slate-700);
}

.empty-state p[b-wnkhd3w3ac] {
    margin-bottom: 1.25rem;
}
/* /Components/Pages/Tips/TipDetail.razor.rz.scp.css */
/* ── Back link ───────────────────────────────────────── */

.back-link[b-1vurgqf2hs] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.82rem;
    margin-bottom: 0.25rem;
    transition: color 0.15s;
}

.back-link:hover[b-1vurgqf2hs] {
    color: var(--clr-amber-600, #d97706);
}

/* ── Hero ────────────────────────────────────────────── */

.tip-hero[b-1vurgqf2hs] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 0 1.5rem 0;
}

.tip-hero-icon[b-1vurgqf2hs] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--clr-amber-50, #fffbeb);
    color: var(--clr-amber-500, #f59e0b);
    flex-shrink: 0;
}

.tip-hero-title[b-1vurgqf2hs] {
    margin: 0 0 0.4rem 0;
    font-size: 1.55rem;
    font-weight: 700;
    color: var(--clr-slate-900);
    letter-spacing: -0.02em;
    line-height: 1.25;
}

.tip-hero-meta[b-1vurgqf2hs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.8rem;
    color: var(--clr-slate-400);
    margin-bottom: 0.6rem;
}

.tip-hero-meta span[b-1vurgqf2hs] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.tip-draft-badge[b-1vurgqf2hs] {
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-slate-200);
    color: var(--clr-slate-600);
}

.tip-detail-tags[b-1vurgqf2hs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

/* ── Detail Card (warm sticky note) ─────────────────── */

.tip-detail-card[b-1vurgqf2hs] {
    background: var(--clr-amber-50, #fffbeb);
    border: 1px solid var(--clr-amber-200, #fde68a);
    border-top: 3px solid var(--clr-amber-300, #fcd34d);
    border-radius: 4px 4px 14px 14px;
    padding: 2rem 2.25rem;
    box-shadow: var(--shadow-sm);
    max-width: 820px;
}

/* ── Article Content ─────────────────────────────────── */

.tip-article-content[b-1vurgqf2hs] {
    font-size: 0.93rem;
    line-height: 1.75;
    color: var(--clr-slate-800);
}

.tip-article-content h1[b-1vurgqf2hs],
.tip-article-content h2[b-1vurgqf2hs],
.tip-article-content h3[b-1vurgqf2hs] {
    margin-top: 1.75rem;
    margin-bottom: 0.6rem;
    color: var(--clr-slate-900);
    letter-spacing: -0.01em;
}

.tip-article-content h1[b-1vurgqf2hs] { font-size: 1.35rem; }
.tip-article-content h2[b-1vurgqf2hs] { font-size: 1.12rem; border-bottom: 1px solid var(--clr-amber-200, #fde68a); padding-bottom: 0.35rem; }
.tip-article-content h3[b-1vurgqf2hs] { font-size: 1rem; }

.tip-article-content p[b-1vurgqf2hs] {
    margin: 0.65rem 0;
}

.tip-article-content ul[b-1vurgqf2hs],
.tip-article-content ol[b-1vurgqf2hs] {
    padding-left: 1.5rem;
    margin: 0.65rem 0;
}

.tip-article-content li[b-1vurgqf2hs] {
    margin-bottom: 0.25rem;
}

.tip-article-content blockquote[b-1vurgqf2hs] {
    border-left: 3px solid var(--clr-amber-400, #fbbf24);
    background: var(--clr-amber-100, #fef3c7);
    padding: 0.65rem 1rem;
    margin: 1rem 0;
    border-radius: 0 8px 8px 0;
    color: var(--clr-amber-900, #78350f);
    font-style: italic;
}

.tip-article-content img[b-1vurgqf2hs] {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 0.75rem 0;
}

.tip-article-content table[b-1vurgqf2hs] {
    width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
    font-size: 0.88rem;
}

.tip-article-content th[b-1vurgqf2hs],
.tip-article-content td[b-1vurgqf2hs] {
    border: 1px solid var(--clr-amber-200, #fde68a);
    padding: 0.55rem 0.85rem;
    text-align: left;
}

.tip-article-content th[b-1vurgqf2hs] {
    background: var(--clr-amber-100, #fef3c7);
    font-weight: 600;
    color: var(--clr-slate-700);
}

.tip-article-content pre[b-1vurgqf2hs] {
    background: var(--clr-code-bg);
    color: var(--clr-code-text);
    padding: 1rem 1.25rem;
    border-radius: 10px;
    overflow-x: auto;
    font-size: 0.82rem;
    margin: 0.75rem 0;
    line-height: 1.6;
}

.tip-article-content code[b-1vurgqf2hs] {
    background: var(--clr-amber-100, #fef3c7);
    color: var(--clr-amber-800, #92400e);
    padding: 0.15rem 0.4rem;
    border-radius: 4px;
    font-size: 0.82rem;
}

.tip-article-content pre code[b-1vurgqf2hs] {
    background: none;
    color: inherit;
    padding: 0;
}

/* ── Rating ──────────────────────────────────────────── */

.tip-rating[b-1vurgqf2hs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.5rem;
    padding-top: 1.1rem;
    border-top: 1px solid var(--clr-amber-200, #fde68a);
}

.tip-rating-label[b-1vurgqf2hs] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    white-space: nowrap;
}

.tip-rating-actions[b-1vurgqf2hs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.tip-rating-btn[b-1vurgqf2hs] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.75rem;
    border-radius: 20px;
    border: 1.5px solid var(--clr-slate-200);
    background: transparent;
    color: var(--clr-slate-500);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.tip-rating-btn:hover[b-1vurgqf2hs] {
    border-color: var(--clr-slate-300);
    background: var(--clr-slate-50);
    color: var(--clr-slate-700);
}

.tip-rating-btn--active-up[b-1vurgqf2hs] {
    border-color: #22c55e;
    background: #f0fdf4;
    color: #16a34a;
}

.tip-rating-btn--active-down[b-1vurgqf2hs] {
    border-color: #ef4444;
    background: #fef2f2;
    color: #dc2626;
}

.tip-rating-bar-wrap[b-1vurgqf2hs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tip-rating-bar[b-1vurgqf2hs] {
    width: 100px;
    height: 7px;
    border-radius: 99px;
    background: var(--clr-slate-200);
    overflow: hidden;
}

.tip-rating-bar-fill[b-1vurgqf2hs] {
    height: 100%;
    border-radius: 99px;
    background: linear-gradient(90deg, #fbbf24 0%, #22c55e 100%);
    transition: width 0.4s ease;
}

.tip-rating-pct[b-1vurgqf2hs] {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    white-space: nowrap;
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 640px) {
    .tip-detail-card[b-1vurgqf2hs] {
        padding: 1.25rem 1rem;
    }

    .tip-hero-title[b-1vurgqf2hs] {
        font-size: 1.25rem;
    }

    .tip-hero-icon[b-1vurgqf2hs] {
        display: none;
    }
}
/* /Components/Pages/Tips/TipList.razor.rz.scp.css */
/* ── Tip Grid ────────────────────────────────────────── */

.tip-grid[b-nq27a7ff7z] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.25rem;
    margin-bottom: 2rem;
}

/* ── Card (sticky note look) ────────────────────────── */

.tip-card[b-nq27a7ff7z] {
    position: relative;
    background: var(--clr-amber-50, #fffbeb);
    border-radius: 4px 4px 12px 12px;
    padding: 1.5rem 1.25rem 1.15rem;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-height: 140px;
    box-shadow:
        0 2px 6px rgba(0, 0, 0, 0.06),
        0 1px 2px rgba(0, 0, 0, 0.04);
    border-top: 3px solid var(--clr-amber-300, #fcd34d);
}

.tip-card:hover[b-nq27a7ff7z] {
    transform: translateY(-3px);
    box-shadow:
        0 6px 16px rgba(0, 0, 0, 0.08),
        0 2px 4px rgba(0, 0, 0, 0.04);
}

/* Decorative pin */
.tip-card-pin[b-nq27a7ff7z] {
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--clr-amber-400, #fbbf24);
    border: 2px solid var(--clr-amber-200, #fde68a);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.tip-card-title[b-nq27a7ff7z] {
    margin: 0;
    font-size: 0.97rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tip-draft-badge[b-nq27a7ff7z] {
    align-self: flex-start;
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-slate-200);
    color: var(--clr-slate-600);
}

.tip-card-summary[b-nq27a7ff7z] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tip-card-footer[b-nq27a7ff7z] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.74rem;
    color: var(--clr-slate-400);
    margin-top: auto;
    padding-top: 0.5rem;
}

.tip-card-footer span[b-nq27a7ff7z] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}

.tip-card-tags[b-nq27a7ff7z] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: 0.35rem;
}

.tip-tag[b-nq27a7ff7z] {
    display: inline-block;
    background: var(--clr-amber-100, #fef3c7);
    color: var(--clr-amber-700, #b45309);
    border-radius: 5px;
    padding: 0.12rem 0.45rem;
    font-size: 0.7rem;
    font-weight: 500;
}

.tip-tag-more[b-nq27a7ff7z] {
    background: var(--clr-amber-200, #fde68a);
    color: var(--clr-amber-600, #d97706);
}

/* ── Card Rating Bar ─────────────────────────────────── */

.tip-card-rating[b-nq27a7ff7z] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--clr-amber-200, #fde68a);
}

.tip-card-rating-bar[b-nq27a7ff7z] {
    flex: 1;
    height: 5px;
    border-radius: 99px;
    background: var(--clr-slate-200);
    overflow: hidden;
}

.tip-card-rating-fill[b-nq27a7ff7z] {
    height: 100%;
    border-radius: 99px;
    background: linear-gradient(90deg, #fbbf24 0%, #22c55e 100%);
}

.tip-card-rating-text[b-nq27a7ff7z] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    font-size: 0.7rem;
    color: var(--clr-slate-400);
    white-space: nowrap;
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 640px) {
    .tip-grid[b-nq27a7ff7z] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Workflows/WorkflowEditor.razor.rz.scp.css */
.back-link[b-fb757khym2] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--clr-slate-500);
    text-decoration: none;
    font-size: 0.88rem;
    margin-bottom: 1rem;
}

.back-link:hover[b-fb757khym2] {
    color: var(--clr-blue-500);
}

.editor-header[b-fb757khym2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.editor-title[b-fb757khym2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.editor-title h1[b-fb757khym2] {
    margin: 0;
    font-size: 1.3rem;
}

.editor-toolbar[b-fb757khym2] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.toolbar-group[b-fb757khym2] {
    display: flex;
    gap: 0.35rem;
}

.editor-tags-row[b-fb757khym2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

/* Canvas */
.wf-canvas[b-fb757khym2] {
    position: relative;
    width: 100%;
    height: calc(100vh - 220px);
    min-height: 400px;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    overflow: auto;
    cursor: grab;
}

.wf-canvas:active[b-fb757khym2] {
    cursor: grabbing;
}

.wf-canvas-inner[b-fb757khym2] {
    position: relative;
    width: 3000px;
    height: 2000px;
    background-image: radial-gradient(circle, var(--clr-slate-200) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* SVG Edges */
.wf-edges-svg[b-fb757khym2] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1;
}

/* Nodes */
.wf-node[b-fb757khym2] {
    position: absolute;
    background: var(--clr-white);
    border: 2px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.75rem;
    box-sizing: border-box;
    cursor: move;
    z-index: 2;
    transition: border-color 0.15s, box-shadow 0.15s;
    user-select: none;
    touch-action: none;
}

.wf-node:hover[b-fb757khym2] {
    border-color: var(--clr-slate-400);
    box-shadow: var(--shadow-sm);
}

.wf-node.selected[b-fb757khym2] {
    border-color: var(--clr-blue-500);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

.wf-node.start-node[b-fb757khym2] {
    border-color: var(--clr-emerald-500);
}

.wf-node.start-node.selected[b-fb757khym2] {
    border-color: var(--clr-blue-500);
}

.wf-node.form-node[b-fb757khym2] {
    border-color: var(--clr-violet-300);
}

.wf-node.form-node.selected[b-fb757khym2] {
    border-color: var(--clr-violet-500);
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2);
}

.node-badge[b-fb757khym2] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    display: inline-block;
    margin-bottom: 0.35rem;
}

.node-badge.start[b-fb757khym2] {
    background: var(--clr-emerald-100);
    color: var(--clr-emerald-900);
}

.node-header[b-fb757khym2] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.node-name[b-fb757khym2] {
    font-weight: 600;
    font-size: 0.88rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.node-template[b-fb757khym2] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    margin-top: 0.25rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Node Footer with Delete Button */
.node-footer[b-fb757khym2] {
    position: relative;
    height: auto;
    margin-top: 0.5rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.25rem;
}

/* Connector */

/* Properties Panel - page-specific overrides only */

/* Empty state */
.empty-state[b-fb757khym2] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}
/* /Components/Pages/Workflows/WorkflowList.razor.rz.scp.css */
.page-header[b-ebpu1hnrit] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1rem;
}

.page-header h1[b-ebpu1hnrit] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

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

.empty-state[b-ebpu1hnrit] {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--clr-slate-500);
}

.empty-state h3[b-ebpu1hnrit] {
    margin-top: 1rem;
}
/* /Components/Pages/WorkOrders/WorkOrderDetail.razor.rz.scp.css */
/* ── Locked banner ─────────────────────────────────── */

.locked-banner[b-6u9g5mt45t] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    background: var(--clr-amber-100);
    border: 1px solid var(--clr-amber-400);
    border-radius: 8px;
    color: var(--clr-amber-800);
    font-size: 0.88rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

/* ── Inline field editing ────────────────────────────── */

.inline-edit-row[b-6u9g5mt45t] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.inline-edit-btn[b-6u9g5mt45t] {
    color: var(--clr-slate-400);
    padding: 0.15rem;
    margin: 5px 0 0 5px;
    border-radius: 4px;
    flex-shrink: 0;
    transition: color 0.15s, background 0.15s;
}

.inline-edit-btn:hover[b-6u9g5mt45t] {
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
}

.inline-edit-input[b-6u9g5mt45t] {
    font-size: 0.9rem;
    padding: 0.3rem 0.5rem;
}

.inline-edit-title[b-6u9g5mt45t] {
    font-size: 1.4rem;
    font-weight: 700;
}

.inline-edit-confirm[b-6u9g5mt45t] {
    color: var(--clr-green-600);
    padding: 0.2rem;
    border-radius: 4px;
    flex-shrink: 0;
}

.inline-edit-confirm:hover[b-6u9g5mt45t] {
    background: var(--clr-green-50);
    color: var(--clr-green-700);
}

.inline-edit-confirm:disabled[b-6u9g5mt45t] {
    opacity: 0.4;
    cursor: not-allowed;
}

.inline-edit-cancel[b-6u9g5mt45t] {
    color: var(--clr-slate-400);
    padding: 0.2rem;
    border-radius: 4px;
    flex-shrink: 0;
}

.inline-edit-cancel:hover[b-6u9g5mt45t] {
    color: var(--clr-red-600);
    background: var(--clr-red-50);
}

/* ── Checklist (WorkOrderDetail-specific) ────────────── */

.checklist-checkbox[b-6u9g5mt45t] {
    margin-top: 0.2rem;
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--clr-slate-800);
    cursor: pointer;
    flex-shrink: 0;
}

.checklist-dod[b-6u9g5mt45t] {
    font-size: 0.78rem;
    color: var(--clr-amber-700);
    margin-top: 0.15rem;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.checklist-actions[b-6u9g5mt45t] {
    display: flex;
    gap: 0.35rem;
    align-items: center;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.checklist-action-btn[b-6u9g5mt45t] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-600);
    cursor: pointer;
    padding: 0.3rem 0.55rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-family: inherit;
    font-weight: 500;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    white-space: nowrap;
}

.checklist-action-btn:hover[b-6u9g5mt45t] {
    background: var(--clr-slate-100);
    border-color: var(--clr-slate-300);
    color: var(--clr-slate-800);
}

.checklist-action-btn--comments:hover[b-6u9g5mt45t] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-200);
    color: var(--clr-blue-600);
}

.checklist-btn-label[b-6u9g5mt45t] {
    display: none;
}

@media (min-width: 768px) {
    .checklist-btn-label[b-6u9g5mt45t] {
        display: inline;
    }
}

/* ── Assign dropdown ────────────────────────────────── */

.assign-dropdown-wrapper[b-6u9g5mt45t] {
    position: relative;
    display: inline-block;
}

.assign-dropdown[b-6u9g5mt45t] {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 50;
    min-width: 180px;
    max-height: 200px;
    overflow-y: auto;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    box-shadow: var(--shadow-lg);
    padding: 0.25rem 0;
    margin-top: 0.25rem;
}

.assign-dropdown-item[b-6u9g5mt45t] {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 0.45rem 0.75rem;
    font-size: 0.85rem;
    cursor: pointer;
    font-family: inherit;
    color: var(--clr-slate-800);
}

.assign-dropdown-item:hover[b-6u9g5mt45t] {
    background: var(--clr-slate-100);
}

.assign-dropdown-empty[b-6u9g5mt45t] {
    padding: 0.45rem 0.75rem;
    font-size: 0.82rem;
    color: var(--clr-slate-400);
}

/* ── Comment bubble ─────────────────────────────────── */

.comment-count[b-6u9g5mt45t] {
    font-size: 0.7rem;
    font-weight: 700;
    background: var(--clr-blue-600);
    color: var(--clr-always-white);
    min-width: 1.15rem;
    height: 1.15rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0 0.25rem;
}

/* ── Comment markdown rendering ─────────────────────── */

.comment-md-body[b-6u9g5mt45t] {
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--clr-slate-800);
    word-break: break-word;
}

.comment-md-body p[b-6u9g5mt45t] {
    margin: 0 0 0.4rem;
}

.comment-md-body p:last-child[b-6u9g5mt45t] {
    margin-bottom: 0;
}

.comment-md-body code[b-6u9g5mt45t] {
    background: var(--clr-slate-100);
    padding: 0.1rem 0.35rem;
    border-radius: 4px;
    font-size: 0.82rem;
}

.comment-md-body pre[b-6u9g5mt45t] {
    background: var(--clr-slate-100);
    padding: 0.75rem;
    border-radius: 6px;
    overflow-x: auto;
    margin: 0.5rem 0;
}

.comment-md-body pre code[b-6u9g5mt45t] {
    background: none;
    padding: 0;
}

.comment-md-body ul[b-6u9g5mt45t],
.comment-md-body ol[b-6u9g5mt45t] {
    padding-left: 1.25rem;
    margin: 0.3rem 0;
}

.comment-md-body blockquote[b-6u9g5mt45t] {
    border-left: 3px solid var(--clr-slate-200);
    padding-left: 0.75rem;
    color: var(--clr-slate-500);
    margin: 0.3rem 0;
}

/* ── Notes ──────────────────────────────────────────── */

.note-input[b-6u9g5mt45t] {
    margin-bottom: 1rem;
}

.note-input textarea[b-6u9g5mt45t] {
    resize: vertical;
    min-height: 60px;
}

.notes-list[b-6u9g5mt45t] {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.note-item[b-6u9g5mt45t] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    padding: 0.65rem 0.85rem;
}

.note-text[b-6u9g5mt45t] {
    font-size: 0.88rem;
    color: var(--clr-slate-800);
    white-space: pre-wrap;
    line-height: 1.5;
}

.note-meta[b-6u9g5mt45t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.35rem;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}

/* ── Checklist edit controls ─────────────────────────── */

.checklist-actions-separator[b-6u9g5mt45t] {
    width: 1px;
    height: 1.2rem;
    background: var(--clr-slate-200);
    margin: 0 0.15rem;
    flex-shrink: 0;
}

.checklist-move-btn:disabled[b-6u9g5mt45t] {
    opacity: 0.3;
    cursor: not-allowed;
}

.checklist-action-btn--danger:hover[b-6u9g5mt45t] {
    background: var(--clr-red-50);
    border-color: var(--clr-red-200);
    color: var(--clr-red-600);
}

/* ── Signatures ────────────────────────────────────── */

.signature-grid[b-6u9g5mt45t] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.75rem;
    margin-top: 0.25rem;
}

.signature-card[b-6u9g5mt45t] {
    position: relative;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.signature-card:hover[b-6u9g5mt45t] {
    border-color: var(--clr-slate-300);
    box-shadow: var(--shadow-sm);
}

.signature-image-wrapper[b-6u9g5mt45t] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 6px;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
}

.signature-image[b-6u9g5mt45t] {
    max-height: 56px;
    max-width: 100%;
    object-fit: contain;
}

.signature-info[b-6u9g5mt45t] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.signature-name[b-6u9g5mt45t] {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.signature-meta[b-6u9g5mt45t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}

.signature-meta span[b-6u9g5mt45t] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}

.signature-delete[b-6u9g5mt45t] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    opacity: 0;
    transition: opacity 0.15s;
}

.signature-card:hover .signature-delete[b-6u9g5mt45t] {
    opacity: 1;
}

.signature-empty[b-6u9g5mt45t] {
    color: var(--clr-slate-400);
    margin-top: 0.5rem;
}

/[b-6u9g5mt45t]
/* /Components/Pages/WorkOrders/WorkOrderList.razor.rz.scp.css */
/* (scoped styles) */
/* /Components/Shared/AppTabs.razor.rz.scp.css */
.app-tabs-wrapper[b-1bcr0px9cs] {
    display: contents;
}

.app-tabs-wrapper[b-1bcr0px9cs]  .app-tabs {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 0;
    border-bottom: 1px solid var(--clr-slate-100);
    margin-bottom: 1rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.app-tabs-wrapper[b-1bcr0px9cs]  .app-tabs::-webkit-scrollbar {
    display: none;
}

.app-tabs-wrapper[b-1bcr0px9cs]  .app-tab {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.65rem 1.1rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--clr-slate-400);
    font-size: 0.88rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
    margin-bottom: -1px;
    white-space: nowrap;
    flex-shrink: 0;
}

.app-tabs-wrapper[b-1bcr0px9cs]  .app-tab:hover {
    color: var(--clr-slate-700);
}

.app-tabs-wrapper[b-1bcr0px9cs]  .app-tab.active {
    color: var(--clr-blue-500);
    border-bottom-color: var(--clr-blue-500);
}
/* /Components/Shared/AttributePicker.razor.rz.scp.css */
.attr-picker[b-ogxw5qu9go] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    min-height: 28px;
}

.tag-add-btn[b-ogxw5qu9go] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    height: 28px;
    padding: 0 0.6rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--clr-slate-400);
    background: transparent;
    border: 1.5px dashed var(--clr-slate-200);
    border-radius: 99px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    font-family: inherit;
    box-sizing: border-box;
}

.tag-add-btn:hover[b-ogxw5qu9go] {
    color: var(--clr-blue-500);
    border-color: var(--clr-blue-300);
    background: var(--clr-blue-50);
}

.tag-add-btn--empty[b-ogxw5qu9go] {
    padding: 0 0.75rem;
    color: var(--clr-slate-500);
    border-color: var(--clr-slate-300);
}
/* /Components/Shared/BadgeSelect.razor.rz.scp.css */
.badge-wrapper[b-e4kmotagsv] {
    
}

.badge-select[b-e4kmotagsv] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    position: relative;
    user-select: none;
}

.badge-select--interactive[b-e4kmotagsv] {
    padding: 0.2rem 0.5rem 0.2rem 0.15rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    cursor: pointer;
    background: var(--clr-white);
    transition: border-color 0.15s, box-shadow 0.15s;
    position: relative;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.badge-select--interactive:hover[b-e4kmotagsv] {
    border-color: var(--clr-slate-300);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.badge-select-arrow[b-e4kmotagsv] {
    color: var(--clr-slate-400);
    transition: transform 0.2s;
    flex-shrink: 0;
}

.badge-select-arrow.rotated[b-e4kmotagsv] {
    transform: rotate(180deg);
}

.bs-backdrop[b-e4kmotagsv] {
    position: fixed;
    inset: 0;
    z-index: 49;
}

.bs-dropdown[b-e4kmotagsv] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    z-index: 9999;
    min-width: 160px;
    padding: 0.3rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    --bs-slide: -4px;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.bs-dropdown--above[b-e4kmotagsv] {
    --bs-slide: 4px;
    transform-origin: bottom left;
}

@starting-style {
    .bs-dropdown[b-e4kmotagsv] {
        opacity: 0;
        transform: translateY(var(--bs-slide));
    }
}

.bs-option[b-e4kmotagsv] {
    display: flex;
    align-items: center;
    padding: 0.45rem 0.6rem;
    border: none;
    background: none;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.12s;
    font-family: inherit;
    width: 100%;
    text-align: left;
}

.bs-option:hover[b-e4kmotagsv] {
    background: var(--clr-slate-50);
}

.bs-option.active[b-e4kmotagsv] {
    background: var(--clr-slate-100);
}
/* /Components/Shared/ChecklistAssignees.razor.rz.scp.css */
/* ── Assignees container ─────────────────────────────── */

.checklist-assignees[b-ufqxp2vv9c] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

/* ── Assignee chips ──────────────────────────────────── */

.assignee-chip[b-ufqxp2vv9c] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: var(--clr-slate-200);
    color: var(--clr-slate-700);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
}

.assignee-remove[b-ufqxp2vv9c] {
    background: none;
    border: none;
    color: var(--clr-slate-400);
    font-size: 0.85rem;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    font-family: inherit;
    transition: color 0.15s;
}

.assignee-remove:hover[b-ufqxp2vv9c] {
    color: var(--clr-red-600);
}

.role-chip[b-ufqxp2vv9c] {
    background: var(--clr-violet-200);
    color: var(--clr-violet-800);
}

.role-chip .assignee-remove[b-ufqxp2vv9c] {
    color: var(--clr-violet-800);
}

/* ── Add chip button ─────────────────────────────────── */

.wo-add-chip[b-ufqxp2vv9c] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: 1.5px dashed var(--clr-slate-300);
    color: var(--clr-slate-500);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
    font-family: inherit;
}

.wo-add-chip:hover[b-ufqxp2vv9c] {
    border-color: var(--clr-blue-500);
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
}
/* /Components/Shared/ColorPicker.razor.rz.scp.css */
.cp-swatches[b-btf6vmxbcw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.cp-swatch[b-btf6vmxbcw] {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.12s, transform 0.1s;
    flex-shrink: 0;
    padding: 0;
}

.cp-swatch:hover[b-btf6vmxbcw] {
    transform: scale(1.1);
}

.cp-selected[b-btf6vmxbcw] {
    border-color: var(--clr-slate-700) !important;
    transform: scale(1.15);
}

.cp-swatch-none[b-btf6vmxbcw] {
    background: white;
    border: 2px dashed var(--clr-slate-300);
    color: var(--clr-slate-400);
    font-size: 0.65rem;
}

.cp-check[b-btf6vmxbcw] {
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

.cp-swatch-none .cp-check[b-btf6vmxbcw] {
    color: var(--clr-slate-500);
}
/* /Components/Shared/ContextMenu.razor.rz.scp.css */
.cm-trigger[b-rpjj6tktda] {
    display: inline-flex;
    align-items: center;
    user-select: none;
}

.cm-backdrop[b-rpjj6tktda] {
    position: fixed;
    inset: 0;
    z-index: 9998;
}

.cm-menu[b-rpjj6tktda] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
    z-index: 9999;
    padding: 0.3rem;
    min-width: 200px;
    max-height: 280px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
    animation: cm-slide-down-b-rpjj6tktda 0.12s ease-out;
}

.cm-menu--above[b-rpjj6tktda] {
    animation: cm-slide-up-b-rpjj6tktda 0.12s ease-out;
}

@keyframes cm-slide-down-b-rpjj6tktda {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes cm-slide-up-b-rpjj6tktda {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.cm-item[b-rpjj6tktda] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.65rem;
    border: none;
    background: none;
    border-radius: 7px;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.83rem;
    color: var(--clr-slate-700);
    width: 100%;
    text-align: left;
    white-space: nowrap;
    transition: background 0.12s, color 0.12s;
}

.cm-item:hover:not(:disabled)[b-rpjj6tktda],
.cm-item:focus-visible:not(:disabled)[b-rpjj6tktda] {
    background: var(--clr-slate-50);
    color: var(--clr-slate-900);
    outline: none;
}

.cm-item:disabled[b-rpjj6tktda] {
    color: var(--clr-slate-300);
    cursor: not-allowed;
}

.cm-item-label[b-rpjj6tktda] {
    flex: 1;
    min-width: 0;
}

.cm-item--danger[b-rpjj6tktda] {
    color: var(--clr-red-600, #dc2626);
}

.cm-item--danger:hover:not(:disabled)[b-rpjj6tktda],
.cm-item--danger:focus-visible:not(:disabled)[b-rpjj6tktda] {
    background: var(--clr-red-50, #fef2f2);
    color: var(--clr-red-700, #b91c1c);
}

.cm-separator[b-rpjj6tktda] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0.25rem 0.15rem;
}
/* /Components/Shared/DataTable.razor.rz.scp.css */
/* ── Mobile cards ─────────────────────────────────────── */
.dt-cards[b-sitea72y1d] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.dt-empty[b-sitea72y1d] {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--clr-slate-400);
    font-size: 0.88rem;
}

/* When no mobile cards are provided, always show the table */
.dt-no-cards[b-sitea72y1d] {
    display: block !important;
}

/* -- Container & Table --------------------------------------------- */
.table-container[b-sitea72y1d] {
    background: var(--clr-white);
    border-radius: 10px;
    border: 1px solid var(--clr-slate-200);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    display: none;
}

.data-table[b-sitea72y1d] {
    width: 100%;
    border-collapse: collapse;
    min-width: 560px;
}

.data-table th[b-sitea72y1d] {
    text-align: left;
    padding: 0.65rem 0.85rem;
    background: var(--clr-slate-50);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--clr-slate-200);
    white-space: nowrap;
}

/* td is inside the Row RenderFragment (rendered by parent) */
.data-table[b-sitea72y1d]  td {
    padding: 0.65rem 0.85rem;
    border-bottom: 1px solid var(--clr-slate-100);
    font-size: 0.88rem;
}

.data-table[b-sitea72y1d]  tr:last-child td {
    border-bottom: none;
}

.data-table[b-sitea72y1d]  tr:hover td {
    background: var(--clr-slate-50);
}

/* -- Name link (inside Row RenderFragment) -------------------------- */
.data-table[b-sitea72y1d]  .table-name-link {
    color: var(--clr-slate-900);
    text-decoration: none;
    font-weight: 600;
    position: relative;
    display: inline-block;
    transition: color 0.15s;
    padding: 10px;
    cursor: pointer;
}

.data-table[b-sitea72y1d]  .table-name-link:hover {
    color: var(--clr-blue-600);
}

/* -- Empty state ---------------------------------------------------- */
.table-empty[b-sitea72y1d] {
    text-align: center;
    padding: 2rem 1rem !important;
    color: var(--clr-slate-400);
    font-size: 0.88rem;
}

/* -- Sortable headers ----------------------------------------------- */
.sortable-header[b-sitea72y1d] {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.sortable-header:hover[b-sitea72y1d] {
    color: var(--clr-blue-600);
}

.sort-indicator[b-sitea72y1d] {
    font-size: 0.7rem;
    margin-left: 0.25rem;
    opacity: 0.7;
}

/* Hide cards on desktop, show table */
@media (min-width: 640px) {
    .dt-cards[b-sitea72y1d] {
        display: none;
    }

    .table-container[b-sitea72y1d] {
        display: block;
    }
}

/* ── Pagination ──────────────────────────────────────── */
.dt-pagination[b-sitea72y1d] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.75rem 0;
}

.dt-page-btn[b-sitea72y1d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.5rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 6px;
    background: var(--clr-white);
    color: var(--clr-slate-700);
    font-size: 0.82rem;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.dt-page-btn:hover:not(:disabled):not(.active)[b-sitea72y1d] {
    background: var(--clr-slate-50);
    border-color: var(--clr-slate-300);
}

.dt-page-btn.active[b-sitea72y1d] {
    background: var(--clr-blue-500);
    color: var(--clr-white);
    border-color: var(--clr-blue-500);
    font-weight: 600;
}

.dt-page-btn:disabled[b-sitea72y1d] {
    opacity: 0.4;
    cursor: not-allowed;
}

.dt-page-ellipsis[b-sitea72y1d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
}

@media (min-width: 1024px) {
    .data-table th[b-sitea72y1d] {
        padding: 1rem 1rem;
    }

    .data-table[b-sitea72y1d]  td {
        padding: 0.25rem 1rem;
    }
}
/* /Components/Shared/DropdownSelect.razor.rz.scp.css */
/* ── Container / trigger ──────────────────────────────── */
.dds-container[b-wu85vdiblv] {
    position: relative;
    display: inline-flex;
    user-select: none;
}

.dds-trigger[b-wu85vdiblv] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.55rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-white);
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
    min-width: 0;
    font-family: inherit;
    font-size: 0.8rem;
    color: var(--clr-slate-700);
    line-height: 1.3;
}

.dds-trigger:hover[b-wu85vdiblv] {
    border-color: var(--clr-slate-300);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.dds-trigger-text[b-wu85vdiblv] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

/* ── Arrow ───────────────────────────────────────────── */
.dds-arrow[b-wu85vdiblv] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
    transition: transform 0.2s;
}

.dds-arrow--open[b-wu85vdiblv] {
    transform: rotate(180deg);
}

/* ── Backdrop ────────────────────────────────────────── */
.dds-backdrop[b-wu85vdiblv] {
    position: fixed;
    inset: 0;
    z-index: 9998;
}

/* ── Menu ────────────────────────────────────────────── */
.dds-menu[b-wu85vdiblv] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
    z-index: 9999;
    padding: 0.3rem;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    max-height: 220px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
    animation: dds-slide-down-b-wu85vdiblv 0.12s ease-out;
}

.dds-menu--above[b-wu85vdiblv] {
    animation: dds-slide-up-b-wu85vdiblv 0.12s ease-out;
}

@keyframes dds-slide-down-b-wu85vdiblv {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes dds-slide-up-b-wu85vdiblv {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Option ──────────────────────────────────────────── */
.dds-option[b-wu85vdiblv] {
    display: flex;
    align-items: center;
    padding: 0.45rem 0.6rem;
    border: none;
    background: none;
    cursor: pointer;
    border-radius: 7px;
    transition: background 0.12s;
    font-family: inherit;
    font-size: 0.8rem;
    color: var(--clr-slate-700);
    width: 100%;
    text-align: left;
    white-space: nowrap;
}

.dds-option:hover[b-wu85vdiblv] {
    background: var(--clr-slate-50);
}

.dds-option--active[b-wu85vdiblv] {
    background: var(--clr-slate-100);
    font-weight: 600;
    color: var(--clr-slate-800);
}
/* /Components/Shared/Expander.razor.rz.scp.css */
.expander[b-45paaar7tc] {
    margin-bottom: 1rem;
}

.expander-toggle[b-45paaar7tc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem 0.5rem 0;
    background-color: transparent;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    font-family: inherit;
    color: var(--clr-slate-500);
    transition: color 0.2s ease;
    text-align: left;
}

.expander-toggle:hover[b-45paaar7tc] {
    color: var(--clr-slate-700);
}

.expander-content[b-45paaar7tc] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    padding: 0.75rem 0;
    animation: expanderSlideDown-b-45paaar7tc 0.2s ease-out;
}

@keyframes expanderSlideDown-b-45paaar7tc {
    from { opacity: 0; max-height: 0; overflow: hidden; }
    to   { opacity: 1; max-height: 500px; }
}

[b-45paaar7tc] .filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-45paaar7tc] .filter-group-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[b-45paaar7tc] .filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

@media (max-width: 768px) {
    .expander-content[b-45paaar7tc] {
        flex-direction: column;
        gap: 1rem;
    }

    [b-45paaar7tc] .filter-buttons {
        flex-direction: column;
    }

    [b-45paaar7tc] .filter-buttons .btn {
        width: 100%;
    }
}
/* /Components/Shared/FavoriteButton.razor.rz.scp.css */
.favorite-btn[b-qt37fyhj75] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: 4px;
    color: var(--clr-slate-400);
    transition: color 0.15s, transform 0.15s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.favorite-btn:hover[b-qt37fyhj75] {
    color: #f59e0b;
    transform: scale(1.15);
}

.favorite-btn.active[b-qt37fyhj75] {
    color: #f59e0b;
}

.favorite-btn.active :deep(polygon)[b-qt37fyhj75],
.favorite-btn.active :deep(path)[b-qt37fyhj75] {
    fill: currentColor;
}

.favorite-btn.active:hover[b-qt37fyhj75] {
    transform: scale(1.05);
}
/* /Components/Shared/FocusButton.razor.rz.scp.css */
.focus-button-wrapper[b-wxc1ufpcu9] {
    position: fixed;
    bottom: 2rem;
    right: calc(2rem + 56px + 0.75rem);
    z-index: 999;
}

.focus-button[b-wxc1ufpcu9] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0f172a;
    border: none;
    border-radius: 50%;
    color: white;
    cursor: pointer;
    width: 56px;
    height: 56px;
    box-shadow: var(--shadow-lg);
    transition: all 0.2s;
}

.focus-button:hover[b-wxc1ufpcu9] {
    background: #1e293b;
    color: var(--clr-blue-400);
    box-shadow: 0 6px 16px rgba(59, 130, 246, 0.3);
    transform: scale(1.05);
}

.focus-button.has-focus[b-wxc1ufpcu9] {
    background: var(--clr-blue-600);
    color: white;
}

.focus-button.has-focus:hover[b-wxc1ufpcu9] {
    background: var(--clr-blue-500);
    box-shadow: 0 6px 16px rgba(59, 130, 246, 0.4);
    transform: scale(1.05);
}

@media print {
    .focus-button-wrapper[b-wxc1ufpcu9] {
        display: none !important;
    }
}

body.pdf-exporting .focus-button-wrapper[b-wxc1ufpcu9] {
    display: none !important;
}
/* /Components/Shared/HandbookArticleCard.razor.rz.scp.css */
.handbook-card[b-hrtzv8slgg] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    transition: box-shadow 0.15s;
}

.handbook-card:hover[b-hrtzv8slgg] {
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.06);
}

.handbook-card-header[b-hrtzv8slgg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.handbook-card-title[b-hrtzv8slgg] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    min-width: 0;
    word-break: break-word;
}

.handbook-card-summary[b-hrtzv8slgg] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.4rem;
    line-height: 1.4;
}

.handbook-card-meta[b-hrtzv8slgg] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.75rem;
}

.handbook-card-meta span[b-hrtzv8slgg] {
    display: flex;
    gap: 0.35rem;
}

.handbook-card-meta .meta-label[b-hrtzv8slgg] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.handbook-card-footer[b-hrtzv8slgg] {
    display: flex;
    justify-content: flex-end;
}
/* /Components/Shared/HandbookArticleFullCard.razor.rz.scp.css */
/* ── Article Card ─────────────────────────────────── */

.handbook-card[b-2tz0wogknl] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--clr-slate-100);
    cursor: pointer;
    transition: background 0.15s ease;
    text-decoration: none;
    color: inherit;
}

.handbook-card:hover[b-2tz0wogknl] {
    background: var(--clr-slate-50);
}

.handbook-card-icon[b-2tz0wogknl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--clr-blue-50);
    color: var(--clr-blue-500);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.handbook-card-body[b-2tz0wogknl] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.handbook-card-header[b-2tz0wogknl] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.handbook-card-title[b-2tz0wogknl] {
    margin: 0;
    font-size: 0.97rem;
    font-weight: 600;
    color: var(--clr-slate-900);
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.handbook-draft-badge[b-2tz0wogknl] {
    flex-shrink: 0;
    font-size: 0.69rem;
    font-weight: 600;
    padding: 0.15rem 0.45rem;
    border-radius: 5px;
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.handbook-card-summary[b-2tz0wogknl] {
    font-size: 0.83rem;
    color: var(--clr-slate-500);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.handbook-card-footer[b-2tz0wogknl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-top: 0.25rem;
}

.handbook-card-meta[b-2tz0wogknl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.76rem;
    color: var(--clr-slate-400);
}

.handbook-card-meta span[b-2tz0wogknl] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.handbook-card-tags[b-2tz0wogknl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.55rem;
}

.handbook-tag[b-2tz0wogknl] {
    display: inline-block;
    background: var(--clr-slate-100);
    color: var(--clr-slate-600);
    border-radius: 6px;
    padding: 0.15rem 0.55rem;
    font-size: 0.73rem;
    font-weight: 500;
}

.handbook-tag-more[b-2tz0wogknl] {
    background: var(--clr-slate-200);
    color: var(--clr-slate-400);
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 640px) {
    .handbook-card[b-2tz0wogknl] {
        padding: 0.9rem 1rem;
        gap: 0.75rem;
    }

    .handbook-card-icon[b-2tz0wogknl] {
        width: 34px;
        height: 34px;
    }
}
/* /Components/Shared/HandbookTagCloud.razor.rz.scp.css */
/* -- Section ------------------------------------------- */

.tag-bar-section[b-qh5b5ajbqr] {
    margin-bottom: 1.1rem;
    animation: tbFadeIn-b-qh5b5ajbqr 0.35s ease-out both;
}

@keyframes tbFadeIn-b-qh5b5ajbqr {
    from { opacity: 0; transform: translateY(-5px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* -- Header ------------------------------------------- */

.tag-bar-header[b-qh5b5ajbqr] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--clr-slate-400);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.55rem;
}

.tag-bar-clear[b-qh5b5ajbqr] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    background: none;
    border: 1px solid var(--clr-slate-200);
    border-radius: 6px;
    padding: 0.15rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    cursor: pointer;
    text-transform: none;
    letter-spacing: 0;
    transition: all 0.15s;
}

.tag-bar-clear:hover[b-qh5b5ajbqr] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-700);
    border-color: var(--clr-slate-300);
}

/* -- Scrollable Tag Bar --------------------------------- */

.tag-bar[b-qh5b5ajbqr] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.4rem;
    overflow-x: auto;
    padding: 0.1rem 0.05rem 0.5rem;
    scrollbar-width: none;
}

.tag-bar[b-qh5b5ajbqr]::-webkit-scrollbar { display: none; }

/* -- Tag Items ----------------------------------------- */

.tag-bar-item[b-qh5b5ajbqr] {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    flex-shrink: 0;
    background: var(--clr-slate-100);
    border: 1px solid var(--clr-slate-200);
    border-radius: 999px;
    padding: 0.3rem 0.8rem;
    color: var(--clr-slate-600);
    font-size: 0.83rem;
    cursor: pointer;
    animation: tbSlideIn-b-qh5b5ajbqr 0.32s ease-out var(--td, 0s) both;
    transition:
        background   0.18s ease,
        color        0.18s ease,
        border-color 0.18s ease,
        box-shadow   0.2s ease,
        opacity      0.18s ease,
        filter       0.18s ease,
        scale        0.18s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes tbSlideIn-b-qh5b5ajbqr {
    from { opacity: 0; transform: translateX(-10px); }
    to   { opacity: 1; transform: translateX(0); }
}

.tag-bar-item:hover[b-qh5b5ajbqr] {
    background: var(--clr-indigo-100);
    color: var(--clr-indigo-800);
    border-color: var(--clr-indigo-200);
}

/* -- Count Badge --------------------------------------- */

.tag-bar-count[b-qh5b5ajbqr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.25rem;
    background: var(--clr-slate-200);
    border-radius: 999px;
    font-size: 0.67rem;
    font-weight: 700;
    color: inherit;
    line-height: 1;
    transition: background 0.18s;
}

/* -- Active State --------------------------------------- */

.tag-bar-item--active[b-qh5b5ajbqr] {
    background: var(--clr-blue-100);
    color: var(--clr-blue-800);
    border-color: var(--clr-blue-200);
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.12);
}

.tag-bar-item--active .tag-bar-count[b-qh5b5ajbqr] {
    background: rgba(30, 64, 175, 0.12);
}

.tag-bar-item--active:hover[b-qh5b5ajbqr] {
    background: var(--clr-blue-200);
    color: var(--clr-blue-900);
}

/* -- Filtered: dim others ------------------------------ */

.tag-bar--filtered .tag-bar-item:not(.tag-bar-item--active)[b-qh5b5ajbqr] {
    opacity: 0.42;

}

.tag-bar--filtered .tag-bar-item:not(.tag-bar-item--active):hover[b-qh5b5ajbqr] {
    opacity: 0.9;
}
/* /Components/Shared/InlineColorSelector.razor.rz.scp.css */
.ics-swatches[b-3c0kpcj31n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.ics-swatch[b-3c0kpcj31n] {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    border: 2px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.12s, transform 0.1s;
    flex-shrink: 0;
    padding: 0;
}

.ics-swatch:hover[b-3c0kpcj31n] {
    transform: scale(1.1);
}

.ics-selected[b-3c0kpcj31n] {
    border-color: var(--clr-slate-700) !important;
    transform: scale(1.15);
}

.ics-swatch-none[b-3c0kpcj31n] {
    background: white;
    border: 2px dashed var(--clr-slate-300);
    color: var(--clr-slate-400);
    font-size: 0.65rem;
}

.ics-check[b-3c0kpcj31n] {
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

.ics-swatch-none .ics-check[b-3c0kpcj31n] {
    color: var(--clr-slate-500);
}
/* /Components/Shared/LicenseStatus.razor.rz.scp.css */
.license-status[b-ookbk7yww8] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    font-size: 14px;
}

.status-row[b-ookbk7yww8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.status-row .label[b-ookbk7yww8] {
    font-weight: 600;
    color: var(--clr-slate-700);
    min-width: 140px;
}

.status-row .value[b-ookbk7yww8] {
    padding: 4px 8px;
    border-radius: 4px;
    font-weight: 500;
}

.status-row .value.valid[b-ookbk7yww8] {
    background: var(--clr-green-100);
    color: var(--clr-green-800);
}

.status-row .value.invalid[b-ookbk7yww8] {
    background: var(--clr-red-100);
    color: var(--clr-red-800);
}

.status-row .value.status-connected[b-ookbk7yww8] {
    background: var(--clr-emerald-100);
    color: var(--clr-emerald-900);
}

.status-row .value.status-disconnected[b-ookbk7yww8] {
    background: var(--clr-amber-100);
    color: var(--clr-amber-800);
}

.status-row .value.status-uninitialized[b-ookbk7yww8],
.status-row .value.status-error[b-ookbk7yww8] {
    background: var(--clr-red-100);
    color: var(--clr-red-800);
}

.features-list[b-ookbk7yww8] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.feature-badge[b-ookbk7yww8] {
    display: inline-block;
    padding: 4px 10px;
    background: var(--clr-blue-100);
    color: var(--clr-blue-800);
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}
/* /Components/Shared/ModalContainer.razor.rz.scp.css */
.dialog-backdrop[b-awcsveghwj] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 200;
    padding: 1rem;
    animation: fadeIn-b-awcsveghwj 0.15s ease;
}

.dialog[b-awcsveghwj] {
    background: var(--clr-white);
    border-radius: 14px;
    border: 1px solid var(--clr-slate-200);
    padding: 1.5rem;
    width: 100%;
    max-width: 420px;
    max-height: calc(100vh - 2rem);
    box-shadow: var(--shadow-lg);
    animation: scaleIn-b-awcsveghwj 0.15s ease;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

[b-awcsveghwj] .dialog-header {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.75rem;
}

[b-awcsveghwj] .dialog-header h3 {
    margin: 0;
    font-size: 1.05rem;
}

[b-awcsveghwj] .dialog-icon-danger {
    color: var(--clr-red-600);
    flex-shrink: 0;
}

[b-awcsveghwj] .dialog-body {
    font-size: 0.88rem;
    color: var(--clr-slate-600);
    margin: 0 0 1.25rem;
    line-height: 1.6;
}

[b-awcsveghwj] .dialog-actions {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
}

[b-awcsveghwj] .modal-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--clr-slate-200);
    margin-bottom: 0;
}

[b-awcsveghwj] .modal-tab {
    padding: 0.5rem 1rem;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--clr-slate-500);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

[b-awcsveghwj] .modal-tab:hover {
    color: var(--clr-slate-800);
}

[b-awcsveghwj] .modal-tab.active {
    color: var(--clr-blue-600);
    border-bottom-color: var(--clr-blue-600);
}

[b-awcsveghwj] .modal-footer {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

@keyframes fadeIn-b-awcsveghwj {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes scaleIn-b-awcsveghwj {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}
/* /Components/Shared/Modals/AssignGroupModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-vt8ajof4kl] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-vt8ajof4kl] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option ────────────────────────────────── */

.blank-option[b-vt8ajof4kl] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-vt8ajof4kl] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-vt8ajof4kl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-vt8ajof4kl] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-vt8ajof4kl] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-vt8ajof4kl] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-vt8ajof4kl] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-vt8ajof4kl] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-vt8ajof4kl]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-vt8ajof4kl] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-vt8ajof4kl]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-vt8ajof4kl] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── List Item Templates ─────────────────────────── */

[b-vt8ajof4kl] .select-item-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--clr-slate-800);
}

[b-vt8ajof4kl] .select-item-title {
    font-weight: 600;
    font-size: 0.92rem;
}

[b-vt8ajof4kl] .select-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-vt8ajof4kl] .meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.73rem;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    font-weight: 500;
}
/* /Components/Shared/Modals/AssignRoleModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-tgfcqcu36m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-tgfcqcu36m] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option ────────────────────────────────── */

.blank-option[b-tgfcqcu36m] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-tgfcqcu36m] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-tgfcqcu36m] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-tgfcqcu36m] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-tgfcqcu36m] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-tgfcqcu36m] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-tgfcqcu36m] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-tgfcqcu36m] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-tgfcqcu36m]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-tgfcqcu36m] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-tgfcqcu36m]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-tgfcqcu36m] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── List Item Templates ─────────────────────────── */

[b-tgfcqcu36m] .select-item-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--clr-slate-800);
}

[b-tgfcqcu36m] .select-item-title {
    font-weight: 600;
    font-size: 0.92rem;
}

[b-tgfcqcu36m] .select-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-tgfcqcu36m] .meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.73rem;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    font-weight: 500;
}
/* /Components/Shared/Modals/AssignUserModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-k9g3kiu4p0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-k9g3kiu4p0] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option ────────────────────────────────── */

.blank-option[b-k9g3kiu4p0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-k9g3kiu4p0] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-k9g3kiu4p0] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-k9g3kiu4p0] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-k9g3kiu4p0] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-k9g3kiu4p0] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-k9g3kiu4p0] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-k9g3kiu4p0] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-k9g3kiu4p0]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-k9g3kiu4p0] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-k9g3kiu4p0]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-k9g3kiu4p0] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── List Item Templates ─────────────────────────── */

[b-k9g3kiu4p0] .select-item-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--clr-slate-800);
}

[b-k9g3kiu4p0] .select-item-title {
    font-weight: 600;
    font-size: 0.92rem;
}

[b-k9g3kiu4p0] .select-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-k9g3kiu4p0] .meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.73rem;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    font-weight: 500;
}
/* /Components/Shared/Modals/AttributePickerModal.razor.rz.scp.css */
/* ── Modal body ──────────────────────────────────────────── */
.tpm-body[b-inw7b61rfj] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    margin: 0 -0.25rem;
}

/* ── Search bar ──────────────────────────────────────────── */
.tpm-search-wrap[b-inw7b61rfj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.65rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    margin: 0 0.25rem 0.5rem;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.tpm-search-wrap:focus-within[b-inw7b61rfj] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.tpm-search-icon[b-inw7b61rfj] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.tpm-search-input[b-inw7b61rfj] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.875rem;
    color: var(--clr-slate-800);
}

.tpm-search-input[b-inw7b61rfj]::placeholder {
    color: var(--clr-slate-400);
}

.tpm-search-clear[b-inw7b61rfj] {
    background: none;
    border: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    transition: color 0.12s, background 0.12s;
    flex-shrink: 0;
}

.tpm-search-clear:hover[b-inw7b61rfj] {
    color: var(--clr-slate-600);
    background: var(--clr-slate-200);
}

/* ── Scrollable list ─────────────────────────────────────── */
.tpm-list[b-inw7b61rfj] {
    max-height: 230px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    padding: 0 0.25rem;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Attribute row ───────────────────────────────────────── */
.tpm-tag-row[b-inw7b61rfj] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.42rem 0.55rem;
    border: none;
    background: none;
    border-radius: 7px;
    cursor: pointer;
    text-align: left;
    width: 100%;
    font-size: 0.875rem;
    color: var(--clr-slate-700);
    transition: background 0.1s;
    font-family: inherit;
}

.tpm-tag-row:hover[b-inw7b61rfj] {
    background: var(--clr-slate-100);
}

.tpm-tag-row--on[b-inw7b61rfj] {
    color: var(--clr-blue-700);
    background: var(--clr-blue-50);
}

.tpm-tag-row--on:hover[b-inw7b61rfj] {
    background: var(--clr-blue-100);
}

/* ── Checkbox ────────────────────────────────────────────── */
.tpm-checkbox[b-inw7b61rfj] {
    width: 16px;
    height: 16px;
    border: 1.5px solid var(--clr-slate-300);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: border-color 0.12s, background 0.12s;
}

.tpm-checkbox--on[b-inw7b61rfj] {
    background: var(--clr-blue-500);
    border-color: var(--clr-blue-500);
    color: var(--clr-always-white);
}

.tpm-tag-name[b-inw7b61rfj] {
    flex: 1;
    text-align: left;
}

/* ── Empty hint ──────────────────────────────────────────── */
.tpm-empty[b-inw7b61rfj] {
    text-align: center;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
    padding: 1.25rem 0;
    margin: 0;
}

/* ── Selected pills preview ──────────────────────────────── */
.tpm-selected[b-inw7b61rfj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.65rem 0.25rem 0.1rem;
    margin-top: 0.25rem;
    border-top: 1px solid var(--clr-slate-100);
}
/* /Components/Shared/Modals/ChecklistCommentsModal.razor.rz.scp.css */
/* ── Header ───────────────────────────────────────────── */

.ccm-header-icon[b-pi2jcz6plr] {
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

.ccm-subtitle[b-pi2jcz6plr] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin: 0.1rem 0 0;
    font-weight: 400;
}

/* ── Body ─────────────────────────────────────────────── */

.ccm-body[b-pi2jcz6plr] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0 -1.5rem;
    padding: 0.75rem 1.5rem 0;
    max-height: calc(100vh - 13rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Input section ────────────────────────────────────── */

.ccm-input-section[b-pi2jcz6plr] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
}

.ccm-label[b-pi2jcz6plr] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    margin: 0;
}

.ccm-label-icon[b-pi2jcz6plr] {
    color: var(--clr-blue-400);
    flex-shrink: 0;
}

.ccm-label-hint[b-pi2jcz6plr] {
    margin-left: auto;
    font-weight: 400;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}

.ccm-textarea[b-pi2jcz6plr] {
    resize: vertical;
    min-height: 72px;
}

.ccm-input-actions[b-pi2jcz6plr] {
    display: flex;
    justify-content: flex-end;
}

/* ── Divider ──────────────────────────────────────────── */

.ccm-divider[b-pi2jcz6plr] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1rem 0 0.75rem;
    color: var(--clr-slate-400);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ccm-divider[b-pi2jcz6plr]::before,
.ccm-divider[b-pi2jcz6plr]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--clr-slate-100);
}

/* ── Comment list ─────────────────────────────────────── */

.ccm-list[b-pi2jcz6plr] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-bottom: 0.5rem;
}

.ccm-item[b-pi2jcz6plr] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-100);
    border-radius: 10px;
    padding: 0.75rem 0.875rem;
}

.ccm-item-header[b-pi2jcz6plr] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
}

.ccm-avatar[b-pi2jcz6plr] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--clr-blue-100, #dbeafe);
    color: var(--clr-blue-600, #2563eb);
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ccm-item-meta[b-pi2jcz6plr] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    flex: 1;
    min-width: 0;
}

.ccm-author[b-pi2jcz6plr] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-700);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ccm-date[b-pi2jcz6plr] {
    font-size: 0.72rem;
    color: var(--clr-slate-400);
}

.ccm-delete[b-pi2jcz6plr] {
    margin-left: auto;
    opacity: 0;
    transition: opacity 0.15s;
    flex-shrink: 0;
}

.ccm-item:hover .ccm-delete[b-pi2jcz6plr] {
    opacity: 1;
}

.ccm-content[b-pi2jcz6plr] {
    font-size: 0.875rem;
    color: var(--clr-slate-700);
    line-height: 1.55;
}

/* ── Empty state ──────────────────────────────────────── */

.ccm-empty[b-pi2jcz6plr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 0 1rem;
    color: var(--clr-slate-300);
    text-align: center;
}

.ccm-empty p[b-pi2jcz6plr] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--clr-slate-400);
}
/* /Components/Shared/Modals/EditChecklistItemModal.razor.rz.scp.css */
/* ── Header icon ──────────────────────────────────────── */
.ecim-header-icon[b-z3h7t0c531] {
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

/* ── Body ─────────────────────────────────────────────── */
.ecim-body[b-z3h7t0c531] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin: 0 -1.5rem;
    padding: 0.5rem 1.5rem 0;
    max-height: calc(100vh - 14rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Field groups ─────────────────────────────────────── */
.ecim-field[b-z3h7t0c531] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.ecim-label[b-z3h7t0c531] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--clr-slate-600);
    margin: 0;
}

.ecim-required[b-z3h7t0c531] {
    color: var(--clr-red-500);
    font-weight: 700;
}

.ecim-label-icon[b-z3h7t0c531] {
    flex-shrink: 0;
}

.ecim-label-icon--amber[b-z3h7t0c531] {
    color: var(--clr-amber-500);
}

.ecim-label-icon--blue[b-z3h7t0c531] {
    color: var(--clr-blue-500);
}

/* ── Decorated input (Bezeichnung) ────────────────────── */
.ecim-input-wrap[b-z3h7t0c531] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.ecim-input-wrap.focused[b-z3h7t0c531] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.ecim-input-icon[b-z3h7t0c531] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.ecim-input[b-z3h7t0c531] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.88rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.ecim-input[b-z3h7t0c531]::placeholder {
    color: var(--clr-slate-400);
}

/* ── Article chip (selected state) ────────────────────── */
.ecim-article-chip[b-z3h7t0c531] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.6rem 0.75rem;
    background: var(--clr-blue-50);
    border: 1px solid var(--clr-blue-200);
    border-radius: 9px;
    transition: background 0.15s;
}

.ecim-article-chip--tip[b-z3h7t0c531] {
    background: var(--clr-amber-50);
    border-color: var(--clr-amber-200);
}

.ecim-article-chip-icon[b-z3h7t0c531] {
    color: var(--clr-blue-500);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.ecim-article-chip--tip .ecim-article-chip-icon[b-z3h7t0c531] {
    color: var(--clr-amber-500);
}

/* ── Tip link button (amber dashed) ───────────────────── */
.ecim-link-btn--tip[b-z3h7t0c531] {
    color: var(--clr-amber-700);
    background: var(--clr-amber-50);
    border-color: var(--clr-amber-300);
}

.ecim-link-btn--tip:hover[b-z3h7t0c531] {
    background: var(--clr-amber-100);
    border-color: var(--clr-amber-400);
}

.ecim-article-chip-text[b-z3h7t0c531] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.ecim-article-chip-title[b-z3h7t0c531] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    line-height: 1.35;
}

.ecim-article-chip-summary[b-z3h7t0c531] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ecim-article-chip-remove[b-z3h7t0c531] {
    flex-shrink: 0;
    margin-left: auto;
}

/* ── Link button (no article) ─────────────────────────── */
.ecim-link-btn[b-z3h7t0c531] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.85rem;
    font-size: 0.82rem;
    font-weight: 500;
    font-family: inherit;
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
    border: 1.5px dashed var(--clr-blue-200);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    align-self: flex-start;
}

.ecim-link-btn:hover[b-z3h7t0c531] {
    background: var(--clr-blue-100);
    border-color: var(--clr-blue-300);
}

/* ── Article picker panel ─────────────────────────────── */
.ecim-picker[b-z3h7t0c531] {
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    overflow: hidden;
    background: var(--clr-white);
    animation: ecimSlideDown-b-z3h7t0c531 0.15s ease;
}

.ecim-picker-search-wrap[b-z3h7t0c531] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid var(--clr-slate-100);
    background: var(--clr-slate-50);
    transition: background 0.15s;
}

.ecim-picker-search-wrap.focused[b-z3h7t0c531] {
    background: var(--clr-white);
}

.ecim-picker-search-icon[b-z3h7t0c531] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.ecim-picker-search[b-z3h7t0c531] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.85rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.ecim-picker-search[b-z3h7t0c531]::placeholder {
    color: var(--clr-slate-400);
}

/* ── Picker list ──────────────────────────────────────── */
.ecim-picker-list[b-z3h7t0c531] {
    max-height: 180px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

.ecim-picker-empty[b-z3h7t0c531] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 1.25rem 1rem;
    color: var(--clr-slate-400);
    font-size: 0.82rem;
}

.ecim-picker-empty-icon[b-z3h7t0c531] {
    opacity: 0.5;
}

/* ── Picker item rows ─────────────────────────────────── */
.ecim-picker-item[b-z3h7t0c531] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: none;
    background: none;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: background 0.1s;
}

.ecim-picker-item:hover[b-z3h7t0c531] {
    background: var(--clr-blue-50);
}

.ecim-picker-item + .ecim-picker-item[b-z3h7t0c531] {
    border-top: 1px solid var(--clr-slate-50);
}

.ecim-picker-item-icon[b-z3h7t0c531] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.ecim-picker-item:hover .ecim-picker-item-icon[b-z3h7t0c531] {
    color: var(--clr-blue-500);
}

.ecim-picker-item-text[b-z3h7t0c531] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.ecim-picker-item-title[b-z3h7t0c531] {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    line-height: 1.35;
}

.ecim-picker-item-summary[b-z3h7t0c531] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Animation ────────────────────────────────────────── */
@keyframes ecimSlideDown-b-z3h7t0c531 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Shared/Modals/EditRoleModal.razor.rz.scp.css */
/* ── Header icon ──────────────────────────────────────── */
.erm-header-icon[b-v2ldjbc75r] {
    color: var(--clr-blue-500);
    flex-shrink: 0;
}

/* ── Body ─────────────────────────────────────────────── */
.erm-body[b-v2ldjbc75r] {
    display: flex;
    flex-direction: column;
    margin: 0 -1.5rem;
}

/* ── Sections ─────────────────────────────────────────── */
.erm-section[b-v2ldjbc75r] {
    padding: 0.875rem 1.5rem;
}

.erm-section--perms[b-v2ldjbc75r] {
    padding-bottom: 0.25rem;
}

.erm-section-label[b-v2ldjbc75r] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    margin: 0 0 0.65rem 0;
}

.erm-divider[b-v2ldjbc75r] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0;
}

/* ── Permission list ─────────────────────────────────── */
.perm-list[b-v2ldjbc75r] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow-y: auto;
    max-height: 50vh;
}

.perm-row[b-v2ldjbc75r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid var(--clr-slate-100);
    transition: background 0.1s;
}

.perm-row:last-child[b-v2ldjbc75r] {
    border-bottom: none;
}

.perm-row:hover[b-v2ldjbc75r] {
    background: var(--clr-slate-50);
}

.perm-label[b-v2ldjbc75r] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-700);
    white-space: nowrap;
}
/* /Components/Shared/Modals/EditSeriesModal.razor.rz.scp.css */
/* ── Body ────────────────────────────────────────────── */
.esm-body[b-uf340j21lz] {
    display: flex;
    flex-direction: column;
    margin: 0 -1.5rem;
}

/* ── Sections ────────────────────────────────────────── */
.esm-section[b-uf340j21lz] {
    padding: 0.875rem 1.5rem;
}

.esm-section-label[b-uf340j21lz] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    margin: 0 0 0.65rem 0;
}

.esm-optional[b-uf340j21lz] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--clr-slate-400);
    text-transform: none;
    letter-spacing: 0;
}

.esm-divider[b-uf340j21lz] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0;
}

/* ── Recurrence row (type + interval side by side) ───── */
.esm-recurrence-row[b-uf340j21lz] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
}

/* ── Inline rows (Alle X Tage / Wochen …) ────────────── */
.esm-inline-row[b-uf340j21lz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.esm-num-input[b-uf340j21lz] {
    width: 72px;
    text-align: center;
}

/* ── Date row (start + time) ─────────────────────────── */
.esm-date-row[b-uf340j21lz] {
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.esm-date-row .form-group[b-uf340j21lz] {
    flex: 1;
}

/* ── Toggle row (label + switch) ─────────────────────── */
.esm-toggle-row[b-uf340j21lz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.esm-toggle-hint[b-uf340j21lz] {
    font-size: 0.82rem;
    color: var(--clr-slate-500);
    margin: 0;
    line-height: 1.45;
}

/* ── Offset formula box ──────────────────────────────── */
.esm-offset-box[b-uf340j21lz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 0.875rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    font-size: 0.875rem;
    color: var(--clr-slate-700);
}

.esm-offset-label[b-uf340j21lz] {
    white-space: nowrap;
    color: var(--clr-slate-500);
}

/* ── Footer ──────────────────────────────────────────── */
.modal-footer[b-uf340j21lz] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--clr-slate-200);
}
/* /Components/Shared/Modals/EditWebhookConnectionModal.razor.rz.scp.css */
.ewc-mono[b-kqcvgfmen3] {
    font-family: monospace;
    font-size: 0.82rem;
}

.ewc-hint[b-kqcvgfmen3] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 400;
}
/* /Components/Shared/Modals/FokusModal.razor.rz.scp.css */
.fokus-list[b-fywdaz38b7] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 320px;
    overflow-y: auto;
    margin-bottom: 0.75rem;
}

.fokus-item[b-fywdaz38b7] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: 8px;
    border: 1.5px solid var(--clr-slate-200);
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
    user-select: none;
}

.fokus-item:hover[b-fywdaz38b7] {
    border-color: var(--clr-blue-300);
    background: var(--clr-slate-50);
}

.fokus-item.selected[b-fywdaz38b7] {
    border-color: var(--clr-blue-500);
    background: var(--clr-blue-50);
}

.fokus-radio[b-fywdaz38b7] {
    flex-shrink: 0;
    margin-top: 2px;
}

.radio-dot[b-fywdaz38b7] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid var(--clr-slate-300);
    background: white;
    transition: border-color 0.15s, background 0.15s;
    position: relative;
}

.radio-dot.active[b-fywdaz38b7] {
    border-color: var(--clr-blue-500);
    background: var(--clr-blue-500);
}

.radio-dot.active[b-fywdaz38b7]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: white;
}

.fokus-item-content[b-fywdaz38b7] {
    flex: 1;
    min-width: 0;
}

.fokus-item-name[b-fywdaz38b7] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clr-slate-800);
    display: block;
    margin-bottom: 0.3rem;
}

.fokus-item-sub[b-fywdaz38b7] {
    font-size: 0.8rem;
    color: var(--clr-slate-400);
}

.fokus-item-tags[b-fywdaz38b7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.fokus-tag-badge[b-fywdaz38b7] {
    font-size: 0.72rem;
    padding: 0.1rem 0.45rem;
    background: var(--clr-slate-100);
    border-radius: 4px;
    color: var(--clr-slate-600);
    border: 1px solid var(--clr-slate-200);
}

.fokus-item-actions[b-fywdaz38b7] {
    display: flex;
    gap: 0.2rem;
    flex-shrink: 0;
    align-self: center;
}

.btn-icon-small[b-fywdaz38b7] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: none;
    background: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
}

.btn-icon-small:hover[b-fywdaz38b7],
.btn-icon-small:focus-visible[b-fywdaz38b7] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-700);
    outline: none;
}

.btn-icon-danger[b-fywdaz38b7] {
    color: var(--clr-red-400) !important;
}

.btn-icon-danger:hover[b-fywdaz38b7],
.btn-icon-danger:focus-visible[b-fywdaz38b7] {
    background: var(--clr-red-50) !important;
    color: var(--clr-red-600) !important;
}

.fokus-create-btn[b-fywdaz38b7] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
    padding: 0.55rem;
    border-radius: 8px;
    border: 1.5px dashed var(--clr-slate-300);
    background: none;
    color: var(--clr-slate-500);
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.15s;
}

.fokus-create-btn:hover[b-fywdaz38b7] {
    border-color: var(--clr-blue-400);
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
}

.fokus-tag-grid[b-fywdaz38b7] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    max-height: 160px;
    overflow-y: auto;
    padding: 0.6rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-slate-50);
}

.fokus-tag-chip[b-fywdaz38b7] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.8rem;
    padding: 0.25rem 0.65rem;
    border-radius: 20px;
    border: 1.5px solid var(--clr-slate-300);
    background: white;
    color: var(--clr-slate-600);
    cursor: pointer;
    transition: all 0.15s;
}

.fokus-tag-chip:hover[b-fywdaz38b7] {
    border-color: var(--clr-blue-400);
    color: var(--clr-blue-600);
}

.fokus-tag-chip.selected[b-fywdaz38b7] {
    border-color: var(--clr-blue-500);
    background: var(--clr-blue-500);
    color: white;
}

.fokus-group-empty[b-fywdaz38b7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    color: var(--clr-slate-400);
    font-size: 0.85rem;
    text-align: center;
}

.fokus-group-empty p[b-fywdaz38b7] {
    margin: 0;
}
/* /Components/Shared/Modals/FormSubmissionHistoryModal.razor.rz.scp.css */
.rev-scroll[b-ehzdikpzau] {
    max-height: 55vh;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.rev-timeline[b-ehzdikpzau] {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    padding-left: 1.1rem;
    margin-bottom: 1rem;
}

.rev-timeline[b-ehzdikpzau]::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 12px;
    bottom: 12px;
    width: 2px;
    background: var(--clr-slate-200);
    border-radius: 1px;
}

.rev-node[b-ehzdikpzau] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.55rem 0.65rem;
    border-radius: 8px;
    text-align: left;
    transition: background 0.12s;
    position: relative;
    font-family: inherit;
}

.rev-node:hover[b-ehzdikpzau] {
    background: var(--clr-slate-50);
}

.rev-node--active[b-ehzdikpzau] {
    background: var(--clr-blue-50);
}

.rev-node--active:hover[b-ehzdikpzau] {
    background: var(--clr-blue-50);
}

.rev-dot[b-ehzdikpzau] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--clr-slate-300);
    border: 2px solid var(--clr-white);
    flex-shrink: 0;
    margin-top: 0.25rem;
    position: relative;
    z-index: 1;
    transition: background 0.15s, transform 0.15s;
}

.rev-node--active .rev-dot[b-ehzdikpzau] {
    background: var(--clr-blue-500);
    transform: scale(1.25);
}

.rev-meta[b-ehzdikpzau] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.rev-date[b-ehzdikpzau] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.rev-author[b-ehzdikpzau] {
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.rev-summary[b-ehzdikpzau] {
    font-size: 0.72rem;
    color: var(--clr-amber-700);
    font-style: italic;
}

.rev-detail[b-ehzdikpzau] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    animation: revDetailIn-b-ehzdikpzau 0.15s ease;
}

.rev-detail-header[b-ehzdikpzau] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--clr-slate-200);
}

.rev-detail-header h4[b-ehzdikpzau] {
    margin: 0 0 0.15rem;
    font-size: 0.95rem;
    color: var(--clr-slate-900);
}

.rev-detail-date[b-ehzdikpzau] {
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.rev-empty[b-ehzdikpzau] {
    font-size: 0.85rem;
    color: var(--clr-slate-500);
}

.rev-table[b-ehzdikpzau] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.rev-table th[b-ehzdikpzau] {
    text-align: left;
    font-weight: 600;
    color: var(--clr-slate-600);
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--clr-slate-200);
}

.rev-table td[b-ehzdikpzau] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--clr-slate-100);
    color: var(--clr-slate-700);
}

.rev-field-name[b-ehzdikpzau] {
    font-weight: 500;
    white-space: nowrap;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rev-field-value[b-ehzdikpzau] {
    word-break: break-word;
}

.rev-field-empty[b-ehzdikpzau] {
    color: var(--clr-slate-400);
    font-style: italic;
}

@keyframes revDetailIn-b-ehzdikpzau {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}
/* /Components/Shared/Modals/GroupFocusModal.razor.rz.scp.css */
.fokus-list[b-dqtzdjp90f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 320px;
    overflow-y: auto;
    margin-bottom: 0.75rem;
}

.fokus-item[b-dqtzdjp90f] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: 8px;
    border: 1.5px solid var(--clr-slate-200);
    user-select: none;
}

.fokus-item-content[b-dqtzdjp90f] {
    flex: 1;
    min-width: 0;
}

.fokus-item-name[b-dqtzdjp90f] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--clr-slate-800);
    display: block;
    margin-bottom: 0.3rem;
}

.fokus-item-sub[b-dqtzdjp90f] {
    font-size: 0.8rem;
    color: var(--clr-slate-400);
}

.fokus-item-tags[b-dqtzdjp90f] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.fokus-tag-badge[b-dqtzdjp90f] {
    font-size: 0.72rem;
    padding: 0.1rem 0.45rem;
    background: var(--clr-slate-100);
    border-radius: 4px;
    color: var(--clr-slate-600);
    border: 1px solid var(--clr-slate-200);
}

.fokus-item-actions[b-dqtzdjp90f] {
    display: flex;
    gap: 0.2rem;
    flex-shrink: 0;
    align-self: center;
}

.btn-icon-small[b-dqtzdjp90f] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    border: none;
    background: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
}

.btn-icon-small:hover[b-dqtzdjp90f],
.btn-icon-small:focus-visible[b-dqtzdjp90f] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-700);
    outline: none;
}

.btn-icon-danger[b-dqtzdjp90f] {
    color: var(--clr-red-400) !important;
}

.btn-icon-danger:hover[b-dqtzdjp90f],
.btn-icon-danger:focus-visible[b-dqtzdjp90f] {
    background: var(--clr-red-50) !important;
    color: var(--clr-red-600) !important;
}

.fokus-create-btn[b-dqtzdjp90f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
    padding: 0.55rem;
    border-radius: 8px;
    border: 1.5px dashed var(--clr-slate-300);
    background: none;
    color: var(--clr-slate-500);
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.15s;
}

.fokus-create-btn:hover[b-dqtzdjp90f] {
    border-color: var(--clr-blue-400);
    color: var(--clr-blue-600);
    background: var(--clr-blue-50);
}

.fokus-tag-grid[b-dqtzdjp90f] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    max-height: 160px;
    overflow-y: auto;
    padding: 0.6rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: var(--clr-slate-50);
}

.fokus-tag-chip[b-dqtzdjp90f] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.8rem;
    padding: 0.25rem 0.65rem;
    border-radius: 20px;
    border: 1.5px solid var(--clr-slate-300);
    background: white;
    color: var(--clr-slate-600);
    cursor: pointer;
    transition: all 0.15s;
}

.fokus-tag-chip:hover[b-dqtzdjp90f] {
    border-color: var(--clr-blue-400);
    color: var(--clr-blue-600);
}

.fokus-tag-chip.selected[b-dqtzdjp90f] {
    border-color: var(--clr-blue-500);
    background: var(--clr-blue-500);
    color: white;
}
/* /Components/Shared/Modals/HandbookArticleViewModal.razor.rz.scp.css */
.handbook-modal-title[b-gbnssf8rs4] {
    margin-bottom: 0.5rem;
}

.handbook-modal-summary[b-gbnssf8rs4] {
    color: var(--clr-slate-500);
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

.handbook-modal-content[b-gbnssf8rs4] {
    max-height: 60vh;
    overflow-y: auto;
    padding: 0.75rem;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 6px;
    font-size: 0.9rem;
    line-height: 1.6;
}

.handbook-modal-attachments[b-gbnssf8rs4] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--clr-slate-200);
}

.handbook-modal-attachments-label[b-gbnssf8rs4] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.handbook-modal-footer[b-gbnssf8rs4] {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}
/* /Components/Shared/Modals/HandbookHistoryModal.razor.rz.scp.css */
/* ── Scrollable area ──────────────────────────────────── */
.rev-scroll[b-gw9kgg2lwx] {
    max-height: 55vh;
    overflow-y: auto;
    margin-bottom: 1rem;
}

/* ── Timeline ────────────────────────────────────────── */
.rev-timeline[b-gw9kgg2lwx] {
    display: flex;
    flex-direction: column;
    gap: 0;
    position: relative;
    padding-left: 1.1rem;
    margin-bottom: 1rem;
}

.rev-timeline[b-gw9kgg2lwx]::before {
    content: "";
    position: absolute;
    left: 5px;
    top: 12px;
    bottom: 12px;
    width: 2px;
    background: var(--clr-slate-200);
    border-radius: 1px;
}

/* ── Node button ─────────────────────────────────────── */
.rev-node[b-gw9kgg2lwx] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.55rem 0.65rem;
    border-radius: 8px;
    text-align: left;
    transition: background 0.12s;
    position: relative;
    font-family: inherit;
}

.rev-node:hover[b-gw9kgg2lwx] {
    background: var(--clr-slate-50);
}

.rev-node--active[b-gw9kgg2lwx] {
    background: var(--clr-blue-50);
}

.rev-node--active:hover[b-gw9kgg2lwx] {
    background: var(--clr-blue-50);
}

/* ── Dot ─────────────────────────────────────────────── */
.rev-dot[b-gw9kgg2lwx] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--clr-slate-300);
    border: 2px solid var(--clr-white);
    flex-shrink: 0;
    margin-top: 0.25rem;
    position: relative;
    z-index: 1;
    transition: background 0.15s, transform 0.15s;
}

.rev-node--active .rev-dot[b-gw9kgg2lwx] {
    background: var(--clr-blue-500);
    transform: scale(1.25);
}

/* ── Meta ────────────────────────────────────────────── */
.rev-meta[b-gw9kgg2lwx] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    min-width: 0;
}

.rev-date[b-gw9kgg2lwx] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.rev-author[b-gw9kgg2lwx] {
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.rev-title-change[b-gw9kgg2lwx] {
    font-size: 0.72rem;
    color: var(--clr-amber-700);
    font-style: italic;
}

/* ── Detail panel ────────────────────────────────────── */
.rev-detail[b-gw9kgg2lwx] {
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    animation: revDetailIn-b-gw9kgg2lwx 0.15s ease;
}

.rev-detail-header[b-gw9kgg2lwx] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--clr-slate-200);
}

.rev-detail-header h4[b-gw9kgg2lwx] {
    margin: 0 0 0.15rem;
    font-size: 0.95rem;
    color: var(--clr-slate-900);
}

.rev-detail-date[b-gw9kgg2lwx] {
    font-size: 0.75rem;
    color: var(--clr-slate-500);
}

.rev-detail-summary[b-gw9kgg2lwx] {
    font-size: 0.82rem;
    color: var(--clr-slate-600);
    margin: 0.35rem 0 0;
    font-style: italic;
}

.rev-detail-content[b-gw9kgg2lwx] {
    font-size: 0.85rem;
    color: var(--clr-slate-700);
    line-height: 1.65;
    overflow-wrap: break-word;
}

@keyframes revDetailIn-b-gw9kgg2lwx {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* /Components/Shared/Modals/LicensePricingModal.razor.rz.scp.css */
/* ── License Pricing Modal ───────────────────────────── */

.lpm[b-zrysl8p057] {
    margin: -1.5rem;
    border-radius: 14px;
    overflow: hidden;
    background: var(--clr-slate-50);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 2rem);
}

/* ── Header ──────────────────────────────────────────── */

.lpm-header[b-zrysl8p057] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    background: linear-gradient(135deg, var(--clr-navy-900) 0%, var(--clr-navy-700) 55%, var(--clr-navy-800) 100%);
    padding: 1.75rem 1.75rem 1.5rem;
}

.lpm-header-eyebrow[b-zrysl8p057] {
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--clr-sky-300);
    margin-bottom: 0.35rem;
    opacity: 0.85;
}

.lpm-title[b-zrysl8p057] {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--clr-always-white);
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.lpm-subtitle[b-zrysl8p057] {
    margin: 0.35rem 0 0;
    font-size: 0.84rem;
    color: #8aa3bf;
}

.lpm-close[b-zrysl8p057] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #8aa3bf;
    cursor: pointer;
    padding: 0.35rem;
    border-radius: 8px;
    transition: background 0.2s, color 0.2s;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.lpm-close:hover[b-zrysl8p057] {
    background: rgba(255, 255, 255, 0.14);
    color: #c4d5e7;
}

/* ── Body ────────────────────────────────────────────── */

.lpm-body[b-zrysl8p057] {
    padding: 1.5rem 1.75rem 1.5rem;
    overflow-y: auto;
    flex: 1;
}

/* ── Toggle ─────────────────────────────────────────── */

.lpm-toggle-row[b-zrysl8p057] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.lpm-toggle-hint-row[b-zrysl8p057] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 1.75rem;
    margin-bottom: 1.5rem;
}

.lpm-toggle-label[b-zrysl8p057] {
    font-size: 0.84rem;
    font-weight: 500;
    color: var(--clr-slate-400);
    transition: color 0.25s;
    user-select: none;
}

.lpm-toggle-label--active[b-zrysl8p057] {
    color: var(--clr-slate-700);
    font-weight: 600;
}

.lpm-toggle-hint[b-zrysl8p057] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.25rem 0.75rem;
    border-radius: 100px;
    animation: lpmHintIn-b-zrysl8p057 0.2s ease both;
}

@keyframes lpmHintIn-b-zrysl8p057 {
    from { opacity: 0; transform: translateY(-3px); }
    to   { opacity: 1; transform: translateY(0); }
}

.lpm-toggle-hint--green[b-zrysl8p057] {
    color: var(--clr-teal-600);
    background: var(--clr-teal-50);
    border: 1px solid var(--clr-teal-200);
}

.lpm-toggle-hint--neutral[b-zrysl8p057] {
    color: var(--clr-slate-500);
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
}

/* ── Cards ──────────────────────────────────────────── */

.lpm-cards[b-zrysl8p057] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
    align-items: start;
}

.lpm-card[b-zrysl8p057] {
    position: relative;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
    animation: lpmCardIn-b-zrysl8p057 0.35s ease both;
    height: 100%;
}

.lpm-cards .lpm-card:nth-child(1)[b-zrysl8p057] { animation-delay: 0.04s; }
.lpm-cards .lpm-card:nth-child(2)[b-zrysl8p057] { animation-delay: 0.12s; }
.lpm-cards .lpm-card:nth-child(3)[b-zrysl8p057] { animation-delay: 0.20s; }

@keyframes lpmCardIn-b-zrysl8p057 {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.lpm-card:hover[b-zrysl8p057] {
    border-color: var(--clr-slate-300);
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
}

.lpm-card--popular[b-zrysl8p057] {
    background: linear-gradient(170deg, var(--clr-blue-50) 0%, var(--clr-white) 42%);
    border-color: var(--clr-blue-200);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.1), var(--shadow-sm);
}

.lpm-card--popular:hover[b-zrysl8p057] {
    border-color: var(--clr-blue-300);
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.15), var(--shadow-md);
    transform: translateY(-4px);
}

.lpm-popular-stripe[b-zrysl8p057] {
    height: 3px;
    background: linear-gradient(90deg, var(--clr-blue-200), var(--clr-blue-400), var(--clr-blue-300), var(--clr-blue-400), var(--clr-blue-200));
    background-size: 300% 100%;
    animation: stripe-shimmer-b-zrysl8p057 5s ease-in-out infinite;
}

@keyframes stripe-shimmer-b-zrysl8p057 {
    0%, 100% { background-position: 0% 0; }
    50%       { background-position: 100% 0; }
}

.lpm-card-inner[b-zrysl8p057] {
    padding: 1.25rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* ── Card Header ─────────────────────────────────────── */

.lpm-card-top[b-zrysl8p057] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.lpm-card-badge[b-zrysl8p057] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}

.lpm-card-badge--popular[b-zrysl8p057] {
    background: var(--clr-blue-100);
    color: var(--clr-blue-500);
}

.lpm-popular-pill[b-zrysl8p057] {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--clr-blue-600);
    background: var(--clr-blue-100);
    border: 1px solid var(--clr-blue-200);
    padding: 0.15rem 0.55rem;
    border-radius: 100px;
    letter-spacing: 0.02em;
}

.lpm-card-name[b-zrysl8p057] {
    margin: 0 0 0.1rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--clr-slate-800);
    letter-spacing: -0.02em;
}

.lpm-card-users[b-zrysl8p057] {
    margin: 0;
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    font-weight: 500;
}

/* ── Price ───────────────────────────────────────────── */

.lpm-card-price[b-zrysl8p057] {
    margin: 1rem 0 0.75rem;
}

.lpm-price-block[b-zrysl8p057] {
    display: flex;
    align-items: flex-start;
    gap: 0.1rem;
    line-height: 1;
    margin-bottom: 0.1rem;
}

.lpm-currency[b-zrysl8p057] {
    font-size: 1rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    margin-top: 0.45rem;
}

.lpm-price[b-zrysl8p057] {
    font-size: 2.6rem;
    font-weight: 800;
    color: var(--clr-slate-800);
    letter-spacing: -0.04em;
    line-height: 1;
}

.lpm-price-period[b-zrysl8p057] {
    display: block;
    font-size: 0.71rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    margin-bottom: 0.2rem;
}

.lpm-price-detail[b-zrysl8p057] {
    font-size: 0.7rem;
    color: var(--clr-slate-400);
    margin: 0;
}

/* ── Divider ─────────────────────────────────────────── */

.lpm-divider[b-zrysl8p057] {
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--clr-slate-200) 20%, var(--clr-slate-200) 80%, transparent);
    margin: 0.9rem 0;
}

/* ── Description ─────────────────────────────────────── */

.lpm-card-desc[b-zrysl8p057] {
    margin: 0 0 0.85rem;
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    line-height: 1.6;
}

/* ── Features ────────────────────────────────────────── */

.lpm-features[b-zrysl8p057] {
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.lpm-features li[b-zrysl8p057] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    color: var(--clr-slate-600);
    font-weight: 500;
}

.lpm-features li :first-child[b-zrysl8p057] {
    color: var(--clr-teal-600);
    flex-shrink: 0;
}

.lpm-feature--highlight :first-child[b-zrysl8p057] {
    color: var(--clr-amber-700) !important;
}

.lpm-feature--highlight span[b-zrysl8p057] {
    font-weight: 600;
    color: var(--clr-slate-700);
}

/* ── Button ──────────────────────────────────────────── */

.lpm-btn[b-zrysl8p057] {
    display: block;
    width: 100%;
    padding: 0.68rem 1rem;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 10px;
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease, background 0.2s ease, border-color 0.2s ease;
    text-align: center;
    border: 1px solid transparent;
    font-family: inherit;
    letter-spacing: 0.01em;
    text-decoration: none;
}

.lpm-btn--primary[b-zrysl8p057] {
    background: var(--clr-blue-500);
    color: var(--clr-always-white);
    border-color: var(--clr-blue-500);
    box-shadow: 0 1px 4px rgba(59, 130, 246, 0.2), 0 4px 12px rgba(59, 130, 246, 0.2);
}

.lpm-btn--primary:hover[b-zrysl8p057] {
    background: var(--clr-blue-600);
    border-color: var(--clr-blue-600);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.25), 0 8px 20px rgba(59, 130, 246, 0.28);
    transform: translateY(-1px);
}

.lpm-btn--outline[b-zrysl8p057] {
    background: transparent;
    color: var(--clr-slate-600);
    border-color: var(--clr-slate-200);
}

.lpm-btn--outline:hover[b-zrysl8p057] {
    background: var(--clr-slate-50);
    border-color: var(--clr-slate-300);
    color: var(--clr-slate-700);
    transform: translateY(-1px);
}

/* ── Footer Note ─────────────────────────────────────── */

.lpm-footer-note[b-zrysl8p057] {
    text-align: center;
    font-size: 0.72rem;
    color: var(--clr-slate-400);
    margin: 0;
}

/* ── Responsive ──────────────────────────────────────── */

@media (max-width: 700px) {
    .lpm-body[b-zrysl8p057] {
        padding: 1.25rem 1.25rem 1rem;
    }

    .lpm-cards[b-zrysl8p057] {
        grid-template-columns: 1fr;
    }

    .lpm-card--popular[b-zrysl8p057] {
        order: -1;
    }
}
/* /Components/Shared/Modals/ListSelectModal.razor.rz.scp.css */
/* === List Select Modal (shared by multiple modals) === */

.user-select-list[b-7licqk05bu] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    max-height: 400px;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.user-select-item[b-7licqk05bu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 6px;
    padding: 0.6rem 0.85rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    text-align: left;
    width: 100%;
    font-family: inherit;
}

.user-select-item:hover[b-7licqk05bu] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-600);
}

.user-select-name[b-7licqk05bu] {
    font-weight: 500;
    font-size: 0.88rem;
    color: var(--clr-slate-800);
}

.user-select-username[b-7licqk05bu] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    margin-top: 0.1rem;
}
/* /Components/Shared/Modals/ManageGroupMembersModal.razor.rz.scp.css */
/* ── Header count badge ──────────────────────────────── */
.mdmm-header-count[b-ongufg8nae] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.55rem;
    border-radius: 9999px;
    margin-left: auto;
    align-self: center;
}

/* ── Body ─────────────────────────────────────────────── */
.mdmm-body[b-ongufg8nae] {
    display: flex;
    flex-direction: column;
    margin: 0 -1.5rem;
}

/* ── Sections ─────────────────────────────────────────── */
.mdmm-section[b-ongufg8nae] {
    padding: 1rem 1.5rem;
}

.mdmm-section--list[b-ongufg8nae] {
    padding-bottom: 0.5rem;
}

.mdmm-section-label[b-ongufg8nae] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    margin: 0 0 0.65rem 0;
}

.mdmm-divider[b-ongufg8nae] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0;
}

/* ── Add row (search + role select) ──────────────────── */
.mdmm-add-row[b-ongufg8nae] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.mdmm-search-wrap[b-ongufg8nae] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
    min-width: 0;
}

.mdmm-search-wrap.focused[b-ongufg8nae] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.mdmm-search-icon[b-ongufg8nae] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.mdmm-search-input[b-ongufg8nae] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.875rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.mdmm-search-input[b-ongufg8nae]::placeholder {
    color: var(--clr-slate-400);
}

.mdmm-role-select[b-ongufg8nae] {
    flex-shrink: 0;
    width: auto;
    max-width: 130px;
    font-size: 0.8rem;
}

/* ── Search results ───────────────────────────────────── */
.mdmm-search-results[b-ongufg8nae] {
    margin-top: 0.4rem;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow: hidden;
}

.mdmm-result-row[b-ongufg8nae] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    transition: background 0.1s;
}

.mdmm-result-row:not(:last-child)[b-ongufg8nae] {
    border-bottom: 1px solid var(--clr-slate-100);
}

.mdmm-result-row:hover[b-ongufg8nae] {
    background: var(--clr-slate-50);
}

.mdmm-result-info[b-ongufg8nae] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mdmm-result-name[b-ongufg8nae] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdmm-result-sub[b-ongufg8nae] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── State (empty / loading) ──────────────────────────── */
.mdmm-state[b-ongufg8nae] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 0;
    color: var(--clr-slate-400);
    font-size: 0.875rem;
}

.mdmm-state--sm[b-ongufg8nae] {
    padding: 0.6rem 0.75rem;
    align-items: flex-start;
}

.mdmm-state-icon[b-ongufg8nae] {
    color: var(--clr-slate-300);
}

/* ── Member list ──────────────────────────────────────── */
.mdmm-list[b-ongufg8nae] {
    max-height: 300px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Member row ───────────────────────────────────────── */
.mdmm-member-row[b-ongufg8nae] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.25rem;
    border-radius: 8px;
    transition: background 0.1s;
    min-height: 44px;
}

.mdmm-member-row:not(.mdmm-member-row--removing):hover[b-ongufg8nae] {
    background: var(--clr-slate-50);
}

.mdmm-member-row + .mdmm-member-row[b-ongufg8nae] {
    border-top: 1px solid var(--clr-slate-50);
}

.mdmm-member-info[b-ongufg8nae] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mdmm-member-name[b-ongufg8nae] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdmm-member-sub[b-ongufg8nae] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Row actions ─────────────────────────────────────── */
.mdmm-row-actions[b-ongufg8nae] {
    display: flex;
    align-items: center;
    gap: 0.1rem;
    opacity: 0;
    transition: opacity 0.12s;
}

.mdmm-member-row:hover .mdmm-row-actions[b-ongufg8nae] {
    opacity: 1;
}

/* ── Icon buttons ────────────────────────────────────── */
.mdmm-icon-btn[b-ongufg8nae] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--clr-slate-500);
    transition: background 0.12s, color 0.12s;
    flex-shrink: 0;
}

.mdmm-icon-btn:hover[b-ongufg8nae] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-800);
}

.mdmm-icon-btn--danger[b-ongufg8nae] {
    color: var(--clr-slate-500);
}

.mdmm-icon-btn--danger:hover[b-ongufg8nae] {
    background: var(--clr-red-50);
    color: var(--clr-red-600);
}

/* ── Remove confirm ──────────────────────────────────── */
.mdmm-remove-confirm[b-ongufg8nae] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    flex-wrap: wrap;
}

.mdmm-remove-icon[b-ongufg8nae] {
    color: var(--clr-amber-500);
    flex-shrink: 0;
}

.mdmm-remove-text[b-ongufg8nae] {
    font-size: 0.875rem;
    color: var(--clr-slate-700);
    flex: 1;
}

.mdmm-remove-actions[b-ongufg8nae] {
    display: flex;
    gap: 0.4rem;
    flex-shrink: 0;
}
/* /Components/Shared/Modals/ManageRoleUsersModal.razor.rz.scp.css */
/* ── Header count badge ──────────────────────────────── */
.mrum-header-count[b-qv8j2awifj] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.55rem;
    border-radius: 9999px;
    margin-left: auto;
    align-self: center;
}

/* ── Body ─────────────────────────────────────────────── */
.mrum-body[b-qv8j2awifj] {
    display: flex;
    flex-direction: column;
    margin: 0 -1.5rem;
}

/* ── Sections ─────────────────────────────────────────── */
.mrum-section[b-qv8j2awifj] {
    padding: 1rem 1.5rem;
}

.mrum-section--list[b-qv8j2awifj] {
    padding-bottom: 0.5rem;
}

.mrum-section-label[b-qv8j2awifj] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    margin: 0 0 0.65rem 0;
}

.mrum-divider[b-qv8j2awifj] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0;
}

/* ── Search input ─────────────────────────────────────── */
.mrum-search-wrap[b-qv8j2awifj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.mrum-search-wrap.focused[b-qv8j2awifj] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.mrum-search-icon[b-qv8j2awifj] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.mrum-search-input[b-qv8j2awifj] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.875rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.mrum-search-input[b-qv8j2awifj]::placeholder {
    color: var(--clr-slate-400);
}

/* ── Search results ───────────────────────────────────── */
.mrum-search-results[b-qv8j2awifj] {
    margin-top: 0.4rem;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow: hidden;
}

.mrum-result-row[b-qv8j2awifj] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    transition: background 0.1s;
}

.mrum-result-row:not(:last-child)[b-qv8j2awifj] {
    border-bottom: 1px solid var(--clr-slate-100);
}

.mrum-result-row:hover[b-qv8j2awifj] {
    background: var(--clr-slate-50);
}

.mrum-result-info[b-qv8j2awifj] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mrum-result-name[b-qv8j2awifj] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mrum-result-sub[b-qv8j2awifj] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── State (empty / loading) ──────────────────────────── */
.mrum-state[b-qv8j2awifj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 0;
    color: var(--clr-slate-400);
    font-size: 0.875rem;
}

.mrum-state--sm[b-qv8j2awifj] {
    padding: 0.6rem 0.75rem;
    align-items: flex-start;
}

.mrum-state-icon[b-qv8j2awifj] {
    color: var(--clr-slate-300);
}

/* ── Member list ──────────────────────────────────────── */
.mrum-list[b-qv8j2awifj] {
    max-height: 300px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Member row ───────────────────────────────────────── */
.mrum-member-row[b-qv8j2awifj] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.25rem;
    border-radius: 8px;
    transition: background 0.1s;
    min-height: 44px;
}

.mrum-member-row:not(.mrum-member-row--removing):hover[b-qv8j2awifj] {
    background: var(--clr-slate-50);
}

.mrum-member-row + .mrum-member-row[b-qv8j2awifj] {
    border-top: 1px solid var(--clr-slate-50);
}

.mrum-member-info[b-qv8j2awifj] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mrum-member-name[b-qv8j2awifj] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mrum-member-sub[b-qv8j2awifj] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Row actions ─────────────────────────────────────── */
.mrum-row-actions[b-qv8j2awifj] {
    display: flex;
    align-items: center;
    gap: 0.1rem;
    margin-left: auto;
    opacity: 0;
    transition: opacity 0.12s;
}

.mrum-member-row:hover .mrum-row-actions[b-qv8j2awifj] {
    opacity: 1;
}

/* ── Icon buttons ────────────────────────────────────── */
.mrum-icon-btn[b-qv8j2awifj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--clr-slate-500);
    transition: background 0.12s, color 0.12s;
    flex-shrink: 0;
}

.mrum-icon-btn:hover[b-qv8j2awifj] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-800);
}

.mrum-icon-btn--danger[b-qv8j2awifj] {
    color: var(--clr-slate-500);
}

.mrum-icon-btn--danger:hover[b-qv8j2awifj] {
    background: var(--clr-red-50);
    color: var(--clr-red-600);
}

/* ── Remove confirm ──────────────────────────────────── */
.mrum-remove-confirm[b-qv8j2awifj] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    flex-wrap: wrap;
}

.mrum-remove-icon[b-qv8j2awifj] {
    color: var(--clr-amber-500);
    flex-shrink: 0;
}

.mrum-remove-text[b-qv8j2awifj] {
    font-size: 0.875rem;
    color: var(--clr-slate-700);
    flex: 1;
}

.mrum-remove-actions[b-qv8j2awifj] {
    display: flex;
    gap: 0.4rem;
    flex-shrink: 0;
}
/* /Components/Shared/Modals/ManageTemplateAssignedGroupsModal.razor.rz.scp.css */
/* ── Header count badge ──────────────────────────────── */
.mtad-header-count[b-o3ns4ukxen] {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.55rem;
    border-radius: 9999px;
    margin-left: auto;
    align-self: center;
}

/* ── Body ─────────────────────────────────────────────── */
.mtad-body[b-o3ns4ukxen] {
    display: flex;
    flex-direction: column;
    margin: 0 -1.5rem;
}

/* ── Sections ─────────────────────────────────────────── */
.mtad-section[b-o3ns4ukxen] {
    padding: 1rem 1.5rem;
}

.mtad-section--list[b-o3ns4ukxen] {
    padding-bottom: 0.5rem;
}

.mtad-section-label[b-o3ns4ukxen] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--clr-slate-400);
    margin: 0 0 0.65rem 0;
}

.mtad-divider[b-o3ns4ukxen] {
    height: 1px;
    background: var(--clr-slate-100);
    margin: 0;
}

/* ── Add row (search) ────────────────────────────────── */
.mtad-add-row[b-o3ns4ukxen] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.mtad-search-wrap[b-o3ns4ukxen] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.7rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 9px;
    background: var(--clr-slate-50);
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
    min-width: 0;
}

.mtad-search-wrap.focused[b-o3ns4ukxen] {
    border-color: var(--clr-blue-500);
    background: var(--clr-white);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.mtad-search-icon[b-o3ns4ukxen] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.mtad-search-input[b-o3ns4ukxen] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.875rem;
    color: var(--clr-slate-800);
    font-family: inherit;
    min-width: 0;
}

.mtad-search-input[b-o3ns4ukxen]::placeholder {
    color: var(--clr-slate-400);
}

/* ── Search results ───────────────────────────────────── */
.mtad-search-results[b-o3ns4ukxen] {
    margin-top: 0.4rem;
    border: 1px solid var(--clr-slate-100);
    border-radius: 8px;
    overflow: hidden;
}

.mtad-result-row[b-o3ns4ukxen] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    transition: background 0.1s;
}

.mtad-result-row:not(:last-child)[b-o3ns4ukxen] {
    border-bottom: 1px solid var(--clr-slate-100);
}

.mtad-result-row:hover[b-o3ns4ukxen] {
    background: var(--clr-slate-50);
}

.mtad-result-info[b-o3ns4ukxen] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mtad-result-name[b-o3ns4ukxen] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── State (empty / loading) ──────────────────────────── */
.mtad-state[b-o3ns4ukxen] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1.5rem 0;
    color: var(--clr-slate-400);
    font-size: 0.875rem;
}

.mtad-state--sm[b-o3ns4ukxen] {
    padding: 0.6rem 0.75rem;
    align-items: flex-start;
}

.mtad-state-icon[b-o3ns4ukxen] {
    color: var(--clr-slate-300);
}

/* ── Department list ─────────────────────────────────── */
.mtad-list[b-o3ns4ukxen] {
    max-height: 300px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    scrollbar-width: thin;
    scrollbar-color: var(--clr-slate-200) transparent;
}

/* ── Department row ──────────────────────────────────── */
.mtad-dept-row[b-o3ns4ukxen] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.25rem;
    border-radius: 8px;
    transition: background 0.1s;
    min-height: 44px;
}

.mtad-dept-row:not(.mtad-dept-row--removing):hover[b-o3ns4ukxen] {
    background: var(--clr-slate-50);
}

.mtad-dept-row + .mtad-dept-row[b-o3ns4ukxen] {
    border-top: 1px solid var(--clr-slate-50);
}

.mtad-dept-info[b-o3ns4ukxen] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.mtad-dept-name[b-o3ns4ukxen] {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--clr-slate-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Row actions ─────────────────────────────────────── */
.mtad-row-actions[b-o3ns4ukxen] {
    display: flex;
    align-items: center;
    gap: 0.1rem;
    opacity: 0;
    transition: opacity 0.12s;
}

.mtad-dept-row:hover .mtad-row-actions[b-o3ns4ukxen] {
    opacity: 1;
}

/* ── Icon buttons ────────────────────────────────────── */
.mtad-icon-btn[b-o3ns4ukxen] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--clr-slate-500);
    transition: background 0.12s, color 0.12s;
    flex-shrink: 0;
}

.mtad-icon-btn:hover[b-o3ns4ukxen] {
    background: var(--clr-slate-100);
    color: var(--clr-slate-800);
}

.mtad-icon-btn--danger[b-o3ns4ukxen] {
    color: var(--clr-slate-500);
}

.mtad-icon-btn--danger:hover[b-o3ns4ukxen] {
    background: var(--clr-red-50);
    color: var(--clr-red-600);
}

/* ── Remove confirm ──────────────────────────────────── */
.mtad-remove-confirm[b-o3ns4ukxen] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    flex-wrap: wrap;
}

.mtad-remove-icon[b-o3ns4ukxen] {
    color: var(--clr-amber-500);
    flex-shrink: 0;
}

.mtad-remove-text[b-o3ns4ukxen] {
    font-size: 0.875rem;
    color: var(--clr-slate-700);
    flex: 1;
}

.mtad-remove-actions[b-o3ns4ukxen] {
    display: flex;
    gap: 0.4rem;
    flex-shrink: 0;
}
/* /Components/Shared/Modals/MyProfileModal.razor.rz.scp.css */
.profile-modal[b-sx3gy1x9x0] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Header ─────────────────────────────────────────── */

.profile-header[b-sx3gy1x9x0] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.25rem 0 1.25rem 0;
    border-bottom: 1px solid var(--clr-slate-100);
    margin-bottom: 0;
}

.profile-avatar[b-sx3gy1x9x0] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--clr-blue-600, #2563eb);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    flex-shrink: 0;
    user-select: none;
}

.profile-info[b-sx3gy1x9x0] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.profile-name[b-sx3gy1x9x0] {
    font-weight: 600;
    font-size: 1rem;
    color: var(--clr-slate-900);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.profile-username[b-sx3gy1x9x0] {
    font-size: 0.8rem;
    color: var(--clr-slate-400);
}

.profile-roles[b-sx3gy1x9x0] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: 0.15rem;
}

.profile-role-chip[b-sx3gy1x9x0] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    background: var(--clr-slate-200);
    border-radius: 0.25rem;
    font-size: 0.73rem;
    font-weight: 500;
    color: var(--clr-slate-600);
}

/* ── Tab Content ────────────────────────────────────── */

.profile-tab-content[b-sx3gy1x9x0] {
    padding: 1.25rem 0 0.25rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 160px;
}

.profile-tab-footer[b-sx3gy1x9x0] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
}

.profile-empty[b-sx3gy1x9x0] {
    color: var(--clr-slate-400);
    font-size: 0.88rem;
    margin: 0;
}

.profile-footer[b-sx3gy1x9x0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--clr-slate-100);
    margin-top: 1rem;
}

/* ── Theme Selector ─────────────────────────────────── */

.theme-selector[b-sx3gy1x9x0] {
    display: flex;
    gap: 0.6rem;
}

.theme-btn[b-sx3gy1x9x0] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 0.9rem 0.5rem 0.75rem;
    border: 1.5px solid var(--clr-slate-200);
    border-radius: 10px;
    background: var(--clr-white);
    color: var(--clr-slate-500);
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
}

.theme-btn:hover[b-sx3gy1x9x0] {
    border-color: var(--clr-slate-300);
    color: var(--clr-slate-700);
    background: var(--clr-slate-50);
}

.theme-btn.active[b-sx3gy1x9x0] {
    border-color: var(--clr-blue-500);
    background: var(--clr-blue-50);
    color: var(--clr-blue-600);
}

.theme-btn-label[b-sx3gy1x9x0] {
    font-size: 0.82rem;
    font-weight: 600;
}

.theme-btn-hint[b-sx3gy1x9x0] {
    font-size: 0.72rem;
    color: var(--clr-slate-400);
    font-weight: 400;
}
/* /Components/Shared/Modals/PasskeyModal.razor.rz.scp.css */
.passkey-list[b-9zflz4ytz5] {
    list-style: none;
    padding: 0;
    margin: 0 0 0.5rem 0;
}

.passkey-item[b-9zflz4ytz5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--clr-slate-100);
}

.passkey-item:last-child[b-9zflz4ytz5] {
    border-bottom: none;
}

.passkey-info[b-9zflz4ytz5] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.passkey-device[b-9zflz4ytz5] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 500;
    font-size: 0.88rem;
}

.passkey-meta[b-9zflz4ytz5] {
    font-size: 0.75rem;
    color: var(--clr-slate-400);
}
/* /Components/Shared/Modals/PromptModal.razor.rz.scp.css */
.modal-prompt[b-yul3r4v1h5]   {
    display: flex;
    flex-direction: column;
}

label[b-yul3r4v1h5] {
    margin: 1rem 0;
}
/* /Components/Shared/Modals/QrScannerModal.razor.rz.scp.css */
.qrs-body[b-sj6eo5i7xf] {
    padding: 0 1.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    min-height: 280px;
}

.qrs-header-icon[b-sj6eo5i7xf] {
    color: var(--clr-blue-600, #2563eb);
}

/* ── Viewfinder ──────────────────────────────────────── */
.qrs-viewfinder[b-sj6eo5i7xf] {
    width: 100%;
    min-height: 300px;
    border-radius: 16px;
    background: #0f172a;
}

/* let html5-qrcode internal elements render without clipping */
[b-sj6eo5i7xf] #qrs-reader video,
[b-sj6eo5i7xf] #qrs-reader canvas {
    border-radius: 16px;
}

[b-sj6eo5i7xf] #qrs-reader__dashboard {
    display: none !important;
}

/* ── Hint ────────────────────────────────────────────── */
.qrs-hint[b-sj6eo5i7xf] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.82rem;
    color: var(--clr-slate-400, #94a3b8);
    margin: 0;
}

/* ── Error state ─────────────────────────────────────── */
.qrs-error-state[b-sj6eo5i7xf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    text-align: center;
}

.qrs-error-icon[b-sj6eo5i7xf] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--clr-red-50, #fef2f2);
    color: var(--clr-red-500, #ef4444);
    display: flex;
    align-items: center;
    justify-content: center;
}

.qrs-error-text[b-sj6eo5i7xf] {
    margin: 0;
    font-size: 0.88rem;
    color: var(--clr-slate-600, #475569);
    line-height: 1.5;
    max-width: 300px;
}

/* ── Result state ────────────────────────────────────── */
.qrs-result-state[b-sj6eo5i7xf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1rem;
    text-align: center;
}

.qrs-result-icon[b-sj6eo5i7xf] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--clr-green-50, #f0fdf4);
    color: var(--clr-green-500, #22c55e);
    display: flex;
    align-items: center;
    justify-content: center;
}

.qrs-result-label[b-sj6eo5i7xf] {
    margin: 0;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 600;
    color: var(--clr-green-600, #16a34a);
}

.qrs-result-value[b-sj6eo5i7xf] {
    margin: 0;
    color: var(--clr-slate-700, #334155);
    background: var(--clr-slate-50, #f8fafc);
    border: 1px solid var(--clr-slate-200, #e2e8f0);
    border-radius: 8px;
    padding: 0.5rem 0.875rem;
    word-break: break-all;
    max-width: 100%;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 0.82rem;
}
/* /Components/Shared/Modals/SelectTemplateForNodeModal.razor.rz.scp.css */
.template-select-name[b-p6bk7rg9au] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--clr-slate-800);
}

.template-select-description[b-p6bk7rg9au] {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    font-style: italic;
    margin-top: 0.2rem;
}
/* /Components/Shared/Modals/SelectTemplateModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-zhops3l4t5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-zhops3l4t5] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option ────────────────────────────────── */

.blank-option[b-zhops3l4t5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-zhops3l4t5] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-zhops3l4t5] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-zhops3l4t5] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-zhops3l4t5] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-zhops3l4t5] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-zhops3l4t5] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-zhops3l4t5] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-zhops3l4t5]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-zhops3l4t5] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-zhops3l4t5]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-zhops3l4t5] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── List Item Templates ─────────────────────────── */

[b-zhops3l4t5] .select-item-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--clr-slate-800);
}

[b-zhops3l4t5] .select-item-title {
    font-weight: 600;
    font-size: 0.92rem;
}

[b-zhops3l4t5] .select-item-description {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-top: 0.2rem;
    line-height: 1.4;
}

[b-zhops3l4t5] .select-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-zhops3l4t5] .meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.73rem;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    font-weight: 500;
}
/* /Components/Shared/Modals/SelectWorkflowTemplateModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-n6vya6u7z4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-n6vya6u7z4] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option ────────────────────────────────── */

.blank-option[b-n6vya6u7z4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-n6vya6u7z4] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-n6vya6u7z4] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-n6vya6u7z4] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-n6vya6u7z4] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-n6vya6u7z4] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-n6vya6u7z4] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-n6vya6u7z4] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-n6vya6u7z4]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-n6vya6u7z4] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-n6vya6u7z4]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-n6vya6u7z4] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── List Item Templates ─────────────────────────── */

[b-n6vya6u7z4] .select-item-header {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--clr-slate-800);
}

[b-n6vya6u7z4] .select-item-title {
    font-weight: 600;
    font-size: 0.92rem;
}

[b-n6vya6u7z4] .select-item-description {
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-top: 0.2rem;
    line-height: 1.4;
}

[b-n6vya6u7z4] .select-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.35rem;
}

[b-n6vya6u7z4] .meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.73rem;
    color: var(--clr-slate-400);
    background: var(--clr-slate-100);
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    font-weight: 500;
}
/* /Components/Shared/Modals/TagPickerModal.razor.rz.scp.css */
/* ── Select Modal: Header ─────────────────────────── */

.select-modal-header[b-3pydkvwv9o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.25rem;
}

.select-modal-header h3[b-3pydkvwv9o] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

/* ── Blank Option (Create New) ───────────────────── */

.blank-option[b-3pydkvwv9o] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1rem;
    background: var(--clr-slate-50);
    border: 1.5px dashed var(--clr-slate-300);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    font-family: inherit;
    text-align: left;
}

.blank-option:hover[b-3pydkvwv9o] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-400);
}

.blank-option-icon[b-3pydkvwv9o] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    color: var(--clr-slate-500);
    flex-shrink: 0;
}

.blank-option:hover .blank-option-icon[b-3pydkvwv9o] {
    color: var(--clr-blue-600);
    border-color: var(--clr-blue-200);
}

.blank-option-content[b-3pydkvwv9o] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.blank-option-title[b-3pydkvwv9o] {
    font-weight: 500;
    font-size: 0.9rem;
    color: var(--clr-slate-800);
}

.blank-option-hint[b-3pydkvwv9o] {
    font-size: 0.78rem;
    color: var(--clr-slate-400);
}

[b-3pydkvwv9o] .blank-option-arrow {
    color: var(--clr-slate-300);
    flex-shrink: 0;
    transition: color 0.15s, transform 0.15s;
}

.blank-option:hover[b-3pydkvwv9o]  .blank-option-arrow {
    color: var(--clr-blue-500);
    transform: translateX(2px);
}

/* ── Divider ─────────────────────────────────────── */

.select-modal-divider[b-3pydkvwv9o] {
    position: relative;
    text-align: center;
    margin: 1rem 0;
}

.select-modal-divider[b-3pydkvwv9o]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--clr-slate-200);
}

.select-modal-divider span[b-3pydkvwv9o] {
    position: relative;
    background: var(--clr-white);
    padding: 0 0.75rem;
    font-size: 0.78rem;
    color: var(--clr-slate-400);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* ── Tag List ────────────────────────────────────── */

.user-select-list[b-3pydkvwv9o] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    max-height: 400px;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.user-select-item[b-3pydkvwv9o] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    background: var(--clr-slate-50);
    border: 1px solid var(--clr-slate-200);
    border-radius: 6px;
    padding: 0.6rem 0.85rem;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    text-align: left;
    width: 100%;
    font-family: inherit;
}

.user-select-item:hover[b-3pydkvwv9o] {
    background: var(--clr-blue-50);
    border-color: var(--clr-blue-600);
}

/* ── Tag selected state ──────────────────────────── */

.tag-item--selected[b-3pydkvwv9o] {
    background: var(--clr-blue-50) !important;
    border-color: var(--clr-blue-200) !important;
}

.tag-item--selected:hover[b-3pydkvwv9o] {
    border-color: var(--clr-blue-400) !important;
}

/* ── List Item Templates ─────────────────────────── */

.select-item-header[b-3pydkvwv9o] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--clr-slate-800);
}

.select-item-title[b-3pydkvwv9o] {
    font-weight: 500;
    font-size: 0.88rem;
}

/* ── Checkbox ────────────────────────────────────── */

.tag-checkbox[b-3pydkvwv9o] {
    width: 16px;
    height: 16px;
    border: 1.5px solid var(--clr-slate-300);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: border-color 0.12s, background 0.12s;
}

.tag-checkbox--on[b-3pydkvwv9o] {
    background: var(--clr-blue-500);
    border-color: var(--clr-blue-500);
    color: var(--clr-always-white);
}

/* ── Empty state ─────────────────────────────────── */

.list-select-empty[b-3pydkvwv9o] {
    text-align: center;
    color: var(--clr-slate-400);
    font-size: 0.85rem;
    padding: 1.5rem 0;
    margin: 0;
}

/* ── Selected pills preview ──────────────────────── */

.tag-selected-preview[b-3pydkvwv9o] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.65rem 0 0.1rem;
    margin-top: 0.25rem;
    border-top: 1px solid var(--clr-slate-100);
}

/* ── Footer ──────────────────────────────────────── */

.list-select-footer[b-3pydkvwv9o] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    border-top: 1px solid var(--clr-slate-100);
}
/* /Components/Shared/Modals/TipArticleViewModal.razor.rz.scp.css */
.tip-modal-title[b-y59ryvle4q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.tip-modal-title-icon[b-y59ryvle4q] {
    color: var(--clr-amber-500, #f59e0b);
}

.tip-modal-summary[b-y59ryvle4q] {
    color: var(--clr-slate-500);
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

.tip-modal-content[b-y59ryvle4q] {
    max-height: 60vh;
    overflow-y: auto;
    padding: 0.75rem;
    background: var(--clr-amber-50, #fffbeb);
    border: 1px solid var(--clr-amber-200, #fde68a);
    border-radius: 6px;
    font-size: 0.9rem;
    line-height: 1.6;
}

.tip-modal-attachments[b-y59ryvle4q] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--clr-slate-200);
}

.tip-modal-attachments-label[b-y59ryvle4q] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--clr-slate-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.tip-modal-footer[b-y59ryvle4q] {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}
/* /Components/Shared/Modals/WebhookDeliveryLogModal.razor.rz.scp.css */
.dlm-list[b-6r4x8blt8f] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 400px;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.dlm-row[b-6r4x8blt8f] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
    background: var(--clr-slate-50);
    border-radius: 8px;
    border-left: 3px solid var(--clr-green-400);
}

.dlm-row--error[b-6r4x8blt8f] {
    border-left-color: var(--clr-red-400);
    background: var(--clr-red-50, #fef2f2);
}

.dlm-status[b-6r4x8blt8f] {
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.dlm-row:not(.dlm-row--error) .dlm-status[b-6r4x8blt8f] { color: var(--clr-green-500); }
.dlm-row--error .dlm-status[b-6r4x8blt8f] { color: var(--clr-red-500); }

.dlm-info[b-6r4x8blt8f] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    flex: 1;
    min-width: 0;
}

.dlm-trigger[b-6r4x8blt8f] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--clr-slate-800);
}

.dlm-time[b-6r4x8blt8f] {
    font-size: 0.76rem;
    color: var(--clr-slate-500);
}

.dlm-error[b-6r4x8blt8f] {
    font-size: 0.78rem;
    color: var(--clr-red-600);
    word-break: break-all;
}

.dlm-http[b-6r4x8blt8f] {
    font-size: 0.78rem;
    color: var(--clr-slate-500);
    flex-shrink: 0;
    font-family: monospace;
}
/* /Components/Shared/NotificationBell.razor.rz.scp.css */
.notification-bell-wrapper[b-bzerrzyzus] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 999;
    display: inline-block;
}

.notification-bell[b-bzerrzyzus] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0f172a;
    border: none;
    border-radius: 50%;
    color: white;
    cursor: pointer;
    padding: 0.75rem;
    transition: all 0.2s;
    flex-shrink: 0;
    position: relative;
    width: 56px;
    height: 56px;
    box-shadow: var(--shadow-lg);
}

.notification-bell:hover[b-bzerrzyzus] {
    background: #1e293b;
    color: var(--clr-blue-400);
    box-shadow: 0 6px 16px rgba(59, 130, 246, 0.3);
    transform: scale(1.05);
}

.notification-bell.has-unread[b-bzerrzyzus] {
    background: var(--clr-blue-900);
    color: var(--clr-amber-400);
}

.notification-bell.has-unread:hover[b-bzerrzyzus] {
    background: var(--clr-blue-800);
    box-shadow: 0 6px 16px rgba(251, 191, 36, 0.3);
}

.notification-badge[b-bzerrzyzus] {
    position: absolute;
    top: -4px;
    right: -4px;
    background: var(--clr-red-500);
    color: white;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: bold;
}

.notification-panel[b-bzerrzyzus] {
    position: absolute;
    bottom: 100%;
    right: 0;
    background: #0f172a;
    border-radius: 8px;
    width: 380px;
    max-height: 600px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
    z-index: 1000;
    margin-bottom: 0.75rem;
}

.notification-panel-header[b-bzerrzyzus] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    flex-shrink: 0;
}

.notification-panel-header h3[b-bzerrzyzus] {
    margin: 0;
    font-size: 1rem;
    color: #e2e8f0;
    font-weight: 600;
}

.notification-panel-divider[b-bzerrzyzus] {
    height: 1px;
    background: #334155;
}

.notification-panel-empty[b-bzerrzyzus] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    color: var(--clr-slate-500);
    flex: 1;
}

.notification-panel-list[b-bzerrzyzus] {
    flex: 1;
    overflow-y: auto;
}

.notification-item[b-bzerrzyzus] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.75rem 1rem;
    cursor: pointer;
    transition: background 0.15s;
}

.notification-item:hover[b-bzerrzyzus] {
    background: #1e293b;
}

.notification-item[b-bzerrzyzus] {
    background: #1e293b;
}

.notification-content[b-bzerrzyzus] {
    flex: 1;
    min-width: 0;
}

.notification-title[b-bzerrzyzus] {
    font-weight: 600;
    color: #e2e8f0;
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
    word-break: break-word;
}

.notification-body[b-bzerrzyzus] {
    color: #94a3b8;
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
    white-space: normal;
    word-break: break-word;
}

.notification-time[b-bzerrzyzus] {
    color: #64748b;
    font-size: 0.75rem;
}

.notification-close[b-bzerrzyzus] {
    background: none;
    border: none;
    color: #64748b;
    cursor: pointer;
    font-size: 1.2rem;
    padding: 0;
    margin: 0;
    flex-shrink: 0;
    transition: color 0.15s;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notification-close:hover[b-bzerrzyzus] {
    color: #e2e8f0;
}

.notification-backdrop[b-bzerrzyzus] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 998;
}

.btn-icon-small[b-bzerrzyzus] {
    background: none;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s;
    width: 28px;
    height: 28px;
}

.btn-icon-small:hover[b-bzerrzyzus] {
    color: #e2e8f0;
}
/* /Components/Shared/PushNotificationToggle.razor.rz.scp.css */
.push-notification-toggle[b-wqqdrd1wc8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    gap: 0.75rem;
}

[b-wqqdrd1wc8] .toggle-text {
    color: var(--clr-slate-200) !important;
}
/* /Components/Shared/RememberMeCheckbox.razor.rz.scp.css */
/* ── Wrapper label ─────────────────────────────────────────── */
.remember-check[b-uph2gi03lp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
    margin-bottom: 1rem;
}

/* ── Hide native input while keeping it accessible + submittable ── */
.remember-check__input[b-uph2gi03lp] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    white-space: nowrap;
    clip: rect(0, 0, 0, 0);
    border: 0;
    margin: 0;
}

/* ── Custom visual box ─────────────────────────────────────── */
.remember-check__box[b-uph2gi03lp] {
    position: relative;
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
    border-radius: 4px;
    border: 1.5px solid var(--clr-slate-300);
    background: var(--clr-white);
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

/* ── Checkmark via ::after (rotated L-shape) ───────────────── */
.remember-check__box[b-uph2gi03lp]::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 5px;
    height: 9px;
    border: 2px solid var(--clr-always-white);
    border-top: none;
    border-left: none;
    transform: rotate(45deg) translateY(-1px);
    opacity: 0;
    transition: opacity 0.1s;
}

/* ── Hover ─────────────────────────────────────────────────── */
.remember-check:hover .remember-check__box[b-uph2gi03lp] {
    border-color: var(--clr-blue-400);
}

/* ── Keyboard focus ring ───────────────────────────────────── */
.remember-check__input:focus-visible + .remember-check__box[b-uph2gi03lp] {
    outline: 2px solid var(--clr-blue-400);
    outline-offset: 2px;
}

/* ── Checked state ─────────────────────────────────────────── */
.remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
    background: var(--clr-blue-500);
    border-color: var(--clr-blue-500);
}

.remember-check__input:checked + .remember-check__box[b-uph2gi03lp]::after {
    opacity: 1;
}

/* ── Checked + hover ───────────────────────────────────────── */
.remember-check:hover .remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
    background: var(--clr-blue-600);
    border-color: var(--clr-blue-600);
}

/* ── Label text ────────────────────────────────────────────── */
.remember-check__label[b-uph2gi03lp] {
    font-size: 0.85rem;
    color: var(--clr-slate-600);
    line-height: 1.4;
}

/* ══ Dark Mode ═════════════════════════════════════════════════
   Unchecked box: slightly darker than card bg (#1b2a3d)
   so the box boundary is always perceivable.
   Checked state uses --clr-blue-500 (#3b82f6) which is
   unchanged in dark mode — vivid and readable.
   ══════════════════════════════════════════════════════════════ */
html[data-theme="dark"] .remember-check__box[b-uph2gi03lp] {
    background: #0f1c2d;
    border-color: var(--clr-slate-300); /* #365470 in dark */
}

html[data-theme="dark"] .remember-check:hover .remember-check__box[b-uph2gi03lp] {
    border-color: #60a5fa; /* --clr-blue-400, static for dark */
}

html[data-theme="dark"] .remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
    background: var(--clr-blue-500);
    border-color: var(--clr-blue-500);
}

html[data-theme="dark"] .remember-check:hover .remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
    background: #2563eb; /* --clr-blue-600, slightly brighter on dark */
    border-color: #2563eb;
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme]) .remember-check__box[b-uph2gi03lp] {
        background: #0f1c2d;
        border-color: var(--clr-slate-300);
    }

    html:not([data-theme]) .remember-check:hover .remember-check__box[b-uph2gi03lp] {
        border-color: #60a5fa;
    }

    html:not([data-theme]) .remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
        background: var(--clr-blue-500);
        border-color: var(--clr-blue-500);
    }

    html:not([data-theme]) .remember-check:hover .remember-check__input:checked + .remember-check__box[b-uph2gi03lp] {
        background: #2563eb;
        border-color: #2563eb;
    }
}
/* /Components/Shared/SearchBar.razor.rz.scp.css */
.searchbar[b-xn3ko953x1] {
    margin-bottom: 1.25rem;
}

.searchbar-wrapper[b-xn3ko953x1] {
    position: relative;
    width: 100%;
}

.searchbar-icon[b-xn3ko953x1] {
    position: absolute;
    left: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--clr-slate-400);
    pointer-events: none;
    z-index: 1;
    display: flex;
    align-items: center;
}

.searchbar-input[b-xn3ko953x1] {
    width: 100%;
    padding: 0.625rem 2.75rem 0.625rem 2.75rem;
    font-size: 0.95rem;
    height: 2.75rem;
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    background: var(--clr-white);
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.searchbar-input:focus[b-xn3ko953x1] {
    border-color: var(--clr-blue-500);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    outline: none;
}

.searchbar-clear[b-xn3ko953x1] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--clr-slate-400);
    cursor: pointer;
    padding: 0.35rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s, background 0.15s;
    z-index: 2;
    width: 32px;
    height: 32px;
}

.searchbar-clear:hover[b-xn3ko953x1] {
    color: var(--clr-slate-900);
    background: var(--clr-slate-100);
}

.searchbar-results[b-xn3ko953x1] {
    font-size: 0.85rem;
    color: var(--clr-slate-400);
    margin-top: 0.5rem;
    margin-bottom: 0;
}
/* /Components/Shared/SignaturePad.razor.rz.scp.css */
.sig-pad-wrapper[b-dvz5c4dmui] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.sig-pad-canvas-area[b-dvz5c4dmui] {
    position: relative;
}

.sig-pad-canvas[b-dvz5c4dmui] {
    width: 100%;
    height: 150px;
    display: block;
    border: 1.5px solid var(--clr-slate-300);
    border-radius: 8px;
    background: white;
    cursor: crosshair;
    touch-action: none;
}

.sig-pad-saved-hint[b-dvz5c4dmui] {
    position: absolute;
    bottom: 0.5rem;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.65rem;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--clr-green-300);
    border-radius: 99px;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--clr-green-700);
    pointer-events: none;
    white-space: nowrap;
    animation: sig-fadein-b-dvz5c4dmui 0.15s ease;
}

@keyframes sig-fadein-b-dvz5c4dmui {
    from { opacity: 0; transform: translateX(-50%) translateY(4px); }
    to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

.sig-pad-footer[b-dvz5c4dmui] {
    display: flex;
    justify-content: flex-end;
}

@media print {
    .sig-pad-footer[b-dvz5c4dmui] {
        display: none !important;
    }
}

body.pdf-exporting .sig-pad-footer[b-dvz5c4dmui] {
    display: none !important;
}

.sig-pad-display[b-dvz5c4dmui] {
    max-width: 100%;
    max-height: 120px;
    border: 1px solid var(--clr-slate-200);
    border-radius: 8px;
    background: white;
    object-fit: contain;
}

.sig-pad-empty[b-dvz5c4dmui] {
    padding: 1.5rem;
    text-align: center;
    color: var(--clr-slate-400);
    font-size: 0.85rem;
    border: 1px dashed var(--clr-slate-300);
    border-radius: 8px;
}
/* /Components/Shared/Switch.razor.rz.scp.css */
.switch-group[b-wlvsku32n2] {
    display: flex;
    gap: 0;
    background: var(--clr-slate-100);
    border-radius: 10px;
    padding: 3px;
}

.switch-btn[b-wlvsku32n2] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.75rem;
    background: none;
    border: none;
    border-radius: 7px;
    color: var(--clr-slate-500);
    font-size: 0.82rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}

.switch-btn:hover[b-wlvsku32n2] {
    color: var(--clr-slate-700);
}

.switch-btn.active[b-wlvsku32n2] {
    background: var(--clr-white);
    color: var(--clr-slate-900);
    box-shadow: var(--shadow-xs);
}

.switch-label[b-wlvsku32n2] {
    display: none;
}

@media (min-width: 480px) {
    .switch-label[b-wlvsku32n2] {
        display: inline;
    }
}
/* /Components/Shared/TagPicker.razor.rz.scp.css */
.tag-picker[b-m8qsgywqls] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    min-height: 28px;
}

.tag-add-btn[b-m8qsgywqls] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    height: 28px;
    padding: 0 0.6rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--clr-slate-400);
    background: transparent;
    border: 1.5px dashed var(--clr-slate-200);
    border-radius: 99px;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s, background 0.15s;
    font-family: inherit;
    box-sizing: border-box;
}

.tag-add-btn:hover[b-m8qsgywqls] {
    color: var(--clr-blue-500);
    border-color: var(--clr-blue-300);
    background: var(--clr-blue-50);
}

.tag-add-btn--empty[b-m8qsgywqls] {
    padding: 0 0.75rem;
    color: var(--clr-slate-500);
    border-color: var(--clr-slate-300);
}
/* /Components/Shared/TemplateCard.razor.rz.scp.css */
.tmpl-card[b-ie6cihg03b] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 12px;
    padding: 1.25rem;
    cursor: pointer;
    transition: box-shadow 0.15s, border-color 0.15s, transform 0.15s;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tmpl-card:hover[b-ie6cihg03b] {
    border-color: var(--clr-blue-500);
    box-shadow: 0 4px 16px rgba(59, 130, 246, 0.14), var(--shadow-sm);
    transform: translateY(-2px);
}

.tmpl-card-header[b-ie6cihg03b] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--clr-blue-500);
}

.tmpl-card-header h3[b-ie6cihg03b] {
    margin: 0;
    font-size: 1.05rem;
    color: var(--clr-slate-800);
    font-weight: 600;
}

.tmpl-card-desc[b-ie6cihg03b] {
    color: var(--clr-slate-500);
    font-size: 0.88rem;
    margin: 0;
    line-height: 1.45;
}

/* ── Tags ───────────────────────────────────────── */
.tmpl-card-tags[b-ie6cihg03b] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.tmpl-tag[b-ie6cihg03b] {
    background: var(--clr-blue-50);
    color: var(--clr-blue-600);
    border: 1px solid var(--clr-blue-200);
    border-radius: 999px;
    font-size: 0.75rem;
    padding: 0.15rem 0.55rem;
    font-weight: 500;
}

/* ── Meta row ───────────────────────────────────── */
.tmpl-card-meta[b-ie6cihg03b] {
    display: flex;
    gap: 1rem;
    font-size: 0.82rem;
    color: var(--clr-slate-400);
    align-items: center;
    margin-top: auto;
}

.tmpl-card-meta span[b-ie6cihg03b] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

/* ── Footer ─────────────────────────────────────── */
.tmpl-card-footer[b-ie6cihg03b] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--clr-slate-100);
    padding-top: 0.65rem;
    margin-top: 0.25rem;
}

.tmpl-card-date[b-ie6cihg03b] {
    font-size: 0.8rem;
    color: var(--clr-slate-400);
}

.tmpl-card-actions[b-ie6cihg03b] {
    display: flex;
    gap: 0.5rem;
}
/* /Components/Shared/ToastContainer.razor.rz.scp.css */
.toast-container[b-kbct0ogxx5] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
}

.toast[b-kbct0ogxx5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--clr-always-white);
    box-shadow: var(--shadow-lg);
    pointer-events: auto;
    animation: toastIn-b-kbct0ogxx5 0.3s ease-out;
}

.toast-success[b-kbct0ogxx5] { background: var(--clr-green-600); }
.toast-error[b-kbct0ogxx5]   { background: var(--clr-red-600); }
.toast-info[b-kbct0ogxx5]    { background: var(--clr-blue-600); }

@keyframes toastIn-b-kbct0ogxx5 {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: translateX(0); }
}
/* /Components/Shared/Toggle.razor.rz.scp.css */
.toggle-label[b-c1lpjxvwy2] {
    position: relative;
    display: flex;
    gap: 0.5rem;
    height: 24px;
}

.toggle-checkbox[b-c1lpjxvwy2] {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider[b-c1lpjxvwy2] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    width: 44px;
    bottom: 0;
    background-color: var(--clr-slate-700);
    transition: 0.3s;
    border-radius: 24px;
}

    .toggle-slider[b-c1lpjxvwy2]:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 18px;
        left: 3px;
        bottom: 3px;
        background-color: white;
        transition: 0.3s;
        border-radius: 50%;
    }

.toggle-checkbox:checked + .toggle-slider[b-c1lpjxvwy2] {
    background-color: var(--clr-blue-500);
}

    .toggle-checkbox:checked + .toggle-slider[b-c1lpjxvwy2]:before {
        transform: translateX(20px);
    }

.toggle-text[b-c1lpjxvwy2] {
    color: var(--clr-slate-700);
    font-size: 0.9rem;
    font-weight: 500;
    margin: 0 0 0 50px;
}
/* /Components/Shared/VorgangCard.razor.rz.scp.css */
.vorgang-card[b-54ptvmsl6g] {
    background: var(--clr-white);
    border: 1px solid var(--clr-slate-200);
    border-radius: 10px;
    padding: 1rem;
    transition: box-shadow 0.15s;
}

.vorgang-card:hover[b-54ptvmsl6g] {
    box-shadow: var(--shadow-sm);
}

.vorgang-card-high[b-54ptvmsl6g] {
    border-left: 3px solid var(--clr-orange-500);
}

.vorgang-card-critical[b-54ptvmsl6g] {
    border-left: 3px solid var(--clr-red-500);
    background: var(--clr-red-50);
}

.vorgang-card-header[b-54ptvmsl6g] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.vorgang-card-title[b-54ptvmsl6g] {
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--clr-slate-900);
    min-width: 0;
    word-break: break-word;
}

.vorgang-card-meta[b-54ptvmsl6g] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    font-size: 0.8rem;
    color: var(--clr-slate-500);
    margin-bottom: 0.65rem;
}

.vorgang-card-meta span[b-54ptvmsl6g] {
    display: flex;
    gap: 0.35rem;
}

.vorgang-card-meta .meta-label[b-54ptvmsl6g] {
    color: var(--clr-slate-400);
    flex-shrink: 0;
}

.vorgang-card-assignees[b-54ptvmsl6g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.65rem;
}

.assignee-chip-sm[b-54ptvmsl6g] {
    display: inline-flex;
    align-items: center;
    font-size: 0.72rem;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    background: var(--clr-sky-100);
    color: var(--clr-sky-700);
    font-weight: 500;
    white-space: nowrap;
}

.role-chip-sm[b-54ptvmsl6g] {
    background: var(--clr-violet-100);
    color: var(--clr-violet-600);
}

.vorgang-card-footer[b-54ptvmsl6g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.vorgang-card-progress[b-54ptvmsl6g] {
    flex: 1;
    min-width: 0;
}