@import '_content/ApprovalSubsystem.Blazor/ApprovalSubsystem.Blazor.gaty69ceng.bundle.scp.css';

/* /Foundation/Host/Routes.razor.rz.scp.css */
.zimam-route-state[b-s5kc2xnul0] {
    padding: 1.5rem;
    color: var(--color-text-secondary);
}
/* /Modules/Approvals/Pages/ApprovalsInbox/ApprovalsInbox.razor.rz.scp.css */
/* ── Approvals Inbox Page ─────────────────────────────────────── */

.approvals-inbox[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1rem 0;
}

.approvals-inbox__header[b-sxoottq9n1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    padding: 1.25rem 1.5rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-sm);
}

.approvals-inbox__headline[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
    min-width: 260px;
}

.approvals-inbox__title[b-sxoottq9n1] {
    font-size: var(--text-xl);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
    line-height: var(--lh-tight);
}

.approvals-inbox__subtitle[b-sxoottq9n1] {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: var(--lh-normal);
}

.approvals-inbox__stats[b-sxoottq9n1] {
    display: flex;
    gap: 0.75rem;
}

.approvals-inbox__stat[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.625rem 1rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    min-width: 88px;
}

.approvals-inbox__stat-label[b-sxoottq9n1] {
    font-size: var(--text-2xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.approvals-inbox__stat-value[b-sxoottq9n1] {
    font-size: var(--text-lg);
    color: var(--color-text-strong);
    font-weight: var(--fw-bold);
    font-feature-settings: "tnum";
}

.approvals-inbox__stat--accent[b-sxoottq9n1] {
    background: var(--color-warning-bg);
    border-color: var(--color-warning-border);
}

.approvals-inbox__stat--accent .approvals-inbox__stat-value[b-sxoottq9n1],
.approvals-inbox__stat--accent .approvals-inbox__stat-label[b-sxoottq9n1] {
    color: var(--color-warning-text);
}

/* ── Grid of cards ─────────────────────────────────────────────── */

.approvals-inbox__grid[b-sxoottq9n1] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 1rem;
}

.approvals-card[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1.125rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.approvals-card:hover[b-sxoottq9n1] {
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-floating);
    transform: translateY(-1px);
}

.approvals-card__top[b-sxoottq9n1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.approvals-card__title-group[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.approvals-card__title[b-sxoottq9n1] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
    line-height: var(--lh-tight);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.approvals-card__case[b-sxoottq9n1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.approvals-card__step-chip[b-sxoottq9n1] {
    flex-shrink: 0;
    padding: 0.25rem 0.625rem;
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    white-space: nowrap;
}

/* ── Transition row ─────────────────────────────────────────────── */

.approvals-card__transition[b-sxoottq9n1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    background: var(--color-bg-subtle);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-border);
}

.approvals-card__status[b-sxoottq9n1] {
    padding: 0.1875rem 0.5rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
}

.approvals-card__status--target[b-sxoottq9n1] {
    color: var(--color-text-strong);
    border-color: var(--color-border-hover);
    font-weight: var(--fw-semibold);
}

.approvals-card__arrow[b-sxoottq9n1] {
    color: var(--color-text-muted);
    font-size: var(--text-md);
    flex-shrink: 0;
}

/* ── Meta grid ──────────────────────────────────────────────────── */

.approvals-card__meta[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin: 0;
}

.approvals-card__meta-row[b-sxoottq9n1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: var(--text-xs);
}

.approvals-card__meta-row dt[b-sxoottq9n1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
    margin: 0;
}

.approvals-card__meta-row dd[b-sxoottq9n1] {
    color: var(--color-text);
    font-weight: var(--fw-medium);
    margin: 0;
    text-align: start;
}

/* ── Progress ───────────────────────────────────────────────────── */

.approvals-card__progress[b-sxoottq9n1] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.approvals-card__progress-bar[b-sxoottq9n1] {
    flex: 1;
    height: 6px;
    background: var(--color-border-light);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

.approvals-card__progress-fill[b-sxoottq9n1] {
    height: 100%;
    background: var(--color-success-text);
    border-radius: inherit;
    transition: width var(--duration-slow) var(--ease-out);
}

.approvals-card__progress-label[b-sxoottq9n1] {
    font-size: var(--text-2xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
    white-space: nowrap;
}

/* ── Footer / CTA ──────────────────────────────────────────────── */

.approvals-card__footer[b-sxoottq9n1] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.25rem;
    border-top: 1px solid var(--color-border-light);
    margin-top: auto;
}

.approvals-card__cta[b-sxoottq9n1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
}

/* ── Skeleton + Empty states ───────────────────────────────────── */

.approvals-card--skeleton[b-sxoottq9n1] {
    pointer-events: none;
}

.approvals-card--skeleton:hover[b-sxoottq9n1] {
    transform: none;
    border-color: var(--color-border);
    box-shadow: var(--shadow-sm);
}

.approvals-skel[b-sxoottq9n1] {
    background: linear-gradient(
        90deg,
        var(--color-border-light) 0%,
        var(--color-bg-subtle) 50%,
        var(--color-border-light) 100%
    );
    background-size: 200% 100%;
    animation: approvals-shimmer-b-sxoottq9n1 1.4s infinite;
    border-radius: var(--radius-sm);
}

@keyframes approvals-shimmer-b-sxoottq9n1 {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.approvals-inbox__empty[b-sxoottq9n1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem 1.5rem;
    background: var(--color-surface);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-card);
    color: var(--color-text-secondary);
    text-align: center;
}

.approvals-inbox__empty h2[b-sxoottq9n1] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0.25rem 0 0;
}

.approvals-inbox__empty p[b-sxoottq9n1] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Review drawer ──────────────────────────────────────────────── */

.approvals-drawer-header[b-sxoottq9n1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 0.75rem;
}

.approvals-drawer-header__kicker[b-sxoottq9n1] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.approvals-drawer-header__title[b-sxoottq9n1] {
    font-size: var(--text-lg);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}
/* /Modules/Auth/Pages/ResetPassword/ResetPassword.razor.rz.scp.css */
.zimam-reset-pw__login-link[b-rp0wh676u6] {
    display: block;
    text-align: center;
    margin-block-start: var(--space-card, 1.75rem);
    text-decoration: none;
}
/* /Modules/Auth/SharedComponents/AuthLayout/AuthLayout.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Auth Module — Login / Register / Forgot Password
   Design-system aligned, RTL-first, production-ready.
   ═══════════════════════════════════════════════════════ */

/* ── Root ── */
/* Chromium-only; Firefox/Safari gracefully degrade to instant page swap */
@view-transition {
    navigation: auto;
}

.zimam-auth-root[b-e91k7dd5ne] {
    min-height: 100vh;
    min-height: 100dvh;
    font-family: var(--font-family);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ── Split Layout ── */
.zimam-auth-layout[b-e91k7dd5ne] {
    display: flex;
    min-height: 100vh;
    min-height: 100dvh;
}

/* ── Brand Panel (Right in RTL) ── */
.zimam-auth-brand[b-e91k7dd5ne] {
    display: none;
    width: 50%;
    background: linear-gradient(140deg, #050505 0%, #111111 46%, #1a1a1a 100%);
    color: #fff;
    position: relative;
    overflow: hidden;
}

.zimam-auth-brand[b-e91k7dd5ne]::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 50% at 72% 36%, rgba(255, 255, 255, 0.08) 0%, transparent 60%),
        radial-gradient(ellipse 65% 45% at 24% 74%, rgba(255, 255, 255, 0.04) 0%, transparent 55%);
    pointer-events: none;
}

.zimam-auth-brand-inner[b-e91k7dd5ne] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 3rem;
}

.zimam-auth-logo[b-e91k7dd5ne] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.zimam-auth-logo-icon[b-e91k7dd5ne] {
    background: #fff;
    color: #101010;
    padding: 0.5rem;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.zimam-auth-logo-text[b-e91k7dd5ne] {
    font-size: 1.375rem;
    font-weight: var(--fw-bold);
    letter-spacing: -0.01em;
}

.zimam-auth-brand-content[b-e91k7dd5ne] {
    max-width: 32rem;
    margin-bottom: 4rem;
    animation: zimam-auth-brand-enter-b-e91k7dd5ne 0.4s ease both;
    view-transition-name: auth-brand;
}

.zimam-auth-brand-title[b-e91k7dd5ne] {
    font-size: 2.75rem;
    font-weight: var(--fw-bold);
    line-height: 1.2;
    margin-bottom: 1.5rem;
    letter-spacing: -0.01em;
}

.zimam-auth-brand-desc[b-e91k7dd5ne] {
    font-size: 1.0625rem;
    line-height: var(--lh-relaxed);
    color: #b3b3b3;
}

.zimam-auth-brand-dots[b-e91k7dd5ne] {
    display: flex;
    gap: 0.5rem;
    margin-top: 3rem;
}

.zimam-auth-dot[b-e91k7dd5ne] {
    width: 0.5rem;
    height: 0.25rem;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, 0.22);
    opacity: 0.55;
    transition: width 0.3s ease, opacity 0.3s ease, background-color 0.3s ease;
}

.zimam-auth-dot--active[b-e91k7dd5ne] {
    width: 2rem;
    opacity: 1;
    background: #fff;
}

/* ── Form Panel (Left in RTL) ── */
.zimam-auth-form-panel[b-e91k7dd5ne] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    background: #fff;
}

.zimam-auth-form-container[b-e91k7dd5ne] {
    width: 100%;
    max-width: 26rem;
}

/* ── Page Content ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-page {
    display: flex;
    flex-direction: column;
    animation: zimam-auth-page-enter-b-e91k7dd5ne 0.34s ease-out both;
    view-transition-name: auth-page;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-header {
    text-align: center;
    margin-bottom: 2rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-title {
    font-size: 1.75rem;
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-subtitle {
    font-size: var(--text-md);
    color: var(--color-text-muted);
    margin: 0;
    line-height: var(--lh-relaxed);
}

/* ── Form ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* ── Field ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-field {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-label {
    font-size: var(--text-base);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input-icon {
    position: absolute;
    right: 0.875rem;
    color: var(--color-text-faint);
    pointer-events: none;
    flex-shrink: 0;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input {
    width: 100%;
    padding: 0.75rem 2.75rem 0.75rem 2.75rem;
    font-size: var(--text-md);
    font-family: var(--font-family);
    line-height: 1.5;
    text-align: right;
    direction: rtl;
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input::placeholder {
    color: var(--color-text-faint);
    text-align: right; /* explicit for Safari compat */
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input:focus {
    border-color: #0f0f0f;
    box-shadow: 0 0 0 3px rgba(15, 15, 15, 0.14);
    background: #fff;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input.invalid,
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input:invalid:not(:placeholder-shown) {
    border-color: var(--color-error-border);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input:focus.invalid {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

/* ── Password toggle ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-toggle-pw {
    position: absolute;
    left: 0.75rem;
    background: none;
    border: none;
    padding: 0.25rem;
    cursor: pointer;
    color: var(--color-text-faint);
    transition: color 0.15s ease;
    display: flex;
    align-items: center;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-toggle-pw:hover {
    color: var(--color-text-secondary);
}

/* ── Options row ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.25rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-checkbox {
    width: 1rem;
    height: 1rem;
    border-radius: var(--radius-xs);
    border: 1.5px solid var(--color-border);
    accent-color: #0f0f0f;
    cursor: pointer;
}

/* ── Links ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-link {
    font-size: var(--text-sm);
    color: #111111;
    text-decoration: none;
    transition: color 0.15s ease;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-link:hover {
    color: #000;
    text-decoration: underline;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-link--bold {
    font-weight: var(--fw-semibold);
}

/* ── Primary button ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.8125rem;
    font-size: var(--text-md);
    font-family: var(--font-family);
    font-weight: var(--fw-semibold);
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
    margin-top: 0.5rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn:active:not(:disabled) {
    transform: scale(0.985);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn--primary {
    background: var(--color-text-strong);
    color: #fff;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn--primary:hover:not(:disabled) {
    background: #000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ── Spinner ── */
@keyframes zimam-auth-spin-b-e91k7dd5ne {
    to { transform: rotate(360deg); }
}

@keyframes zimam-auth-vt-old-b-e91k7dd5ne {
    from {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }

    to {
        opacity: 0;
        transform: translateX(16px);
        filter: blur(1px);
    }
}

@keyframes zimam-auth-vt-new-b-e91k7dd5ne {
    from {
        opacity: 0;
        transform: translateX(-16px);
        filter: blur(1px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

@keyframes zimam-auth-brand-enter-b-e91k7dd5ne {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes zimam-auth-brand-vt-old-b-e91k7dd5ne {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-8px);
    }
}

@keyframes zimam-auth-brand-vt-new-b-e91k7dd5ne {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes zimam-auth-page-enter-b-e91k7dd5ne {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-spinner {
    width: 1.125rem;
    height: 1.125rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: zimam-auth-spin-b-e91k7dd5ne 0.6s linear infinite;
}

[b-e91k7dd5ne]::view-transition-old(auth-page),
[b-e91k7dd5ne]::view-transition-new(auth-page) {
    animation-duration: 380ms;
    animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1);
}

[b-e91k7dd5ne]::view-transition-old(auth-page) {
    animation-name: zimam-auth-vt-old-b-e91k7dd5ne;
}

[b-e91k7dd5ne]::view-transition-new(auth-page) {
    animation-name: zimam-auth-vt-new-b-e91k7dd5ne;
}

[b-e91k7dd5ne]::view-transition-old(auth-brand),
[b-e91k7dd5ne]::view-transition-new(auth-brand) {
    animation-duration: 340ms;
    animation-timing-function: ease;
}

[b-e91k7dd5ne]::view-transition-old(auth-brand) {
    animation-name: zimam-auth-brand-vt-old-b-e91k7dd5ne;
}

[b-e91k7dd5ne]::view-transition-new(auth-brand) {
    animation-name: zimam-auth-brand-vt-new-b-e91k7dd5ne;
}

/* ── Alert ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
    margin-bottom: 0.5rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-alert svg {
    flex-shrink: 0;
    margin-top: 0.0625rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-alert--error {
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border: 1px solid var(--color-error-border);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-alert--success {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border: 1px solid var(--color-success-border);
}

/* ── Footer text ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-footer-text {
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin-top: 2rem;
}

/* ── Auth callback ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback__title {
    font-size: 1.25rem;
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0 0 1rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback__spinner {
    width: 2rem;
    height: 2rem;
    border: 4px solid rgba(15, 15, 15, 0.14);
    border-top-color: var(--color-text-strong);
    border-radius: 50%;
    animation: zimam-auth-spin-b-e91k7dd5ne 0.6s linear infinite;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback__text {
    margin: 1rem 0 0;
    color: var(--color-text-muted);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback__error {
    margin-top: 1.5rem;
    padding: 1rem;
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border: 1px solid var(--color-error-border);
    border-radius: var(--radius-md);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-callback__error-link {
    display: inline-block;
    margin-top: 0.5rem;
    font-weight: var(--fw-semibold);
    color: var(--color-error-text);
    text-decoration: underline;
}

/* ── Validation errors ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-field-error {
    font-size: var(--text-sm);
    color: var(--color-error-text);
    margin-top: 0.125rem;
}

/* ── Password requirements checklist ── */
.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rules {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0.625rem 0.75rem;
    background: var(--color-bg-subtle, #f8fafc);
    border: 1px solid var(--color-border-light, #e2e8f0);
    border-radius: 0.375rem;
    display: flex;
    flex-direction: column;
    gap: 0.3125rem;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    transition: color 0.2s ease;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule--pass {
    color: var(--color-success-text);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule--fail {
    color: var(--color-text-muted);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule__icon {
    flex-shrink: 0;
    transition: color 0.2s ease, transform 0.2s ease;
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule--pass .zimam-auth-pw-rule__icon {
    transform: scale(1.1);
}

.zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-pw-rule--fail .zimam-auth-pw-rule__icon {
    opacity: 0.5;
}

/* ═══════════════════════════════════════════════════════
   Responsive
   ═══════════════════════════════════════════════════════ */

@media (min-width: 1024px) {
    .zimam-auth-brand[b-e91k7dd5ne] {
        display: flex;
    }

    .zimam-auth-form-panel[b-e91k7dd5ne] {
        width: 50%;
        background: var(--color-bg-subtle);
    }

    .zimam-auth-form-container[b-e91k7dd5ne] {
        background: #fff;
        padding: 2.5rem;
        border-radius: var(--radius-card-lg);
        box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.06), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
        border: 1px solid var(--color-border-light);
    }

    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-header {
        text-align: right;
    }

    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-title {
        font-size: 2rem;
    }
}

@media (max-width: 480px) {
    .zimam-auth-form-panel[b-e91k7dd5ne] {
        padding: 1.5rem 1rem;
    }

    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-title {
        font-size: 1.5rem;
    }

    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-btn {
        padding: 0.875rem;
    }

    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-input {
        padding: 0.8125rem 2.75rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-page,
    .zimam-auth-brand-content[b-e91k7dd5ne],
    .zimam-auth-dot[b-e91k7dd5ne],
    .zimam-auth-form-container[b-e91k7dd5ne]  .zimam-auth-spinner,
    [b-e91k7dd5ne]::view-transition-old(auth-page),
    [b-e91k7dd5ne]::view-transition-new(auth-page),
    [b-e91k7dd5ne]::view-transition-old(auth-brand),
    [b-e91k7dd5ne]::view-transition-new(auth-brand) {
        animation: none !important;
    }
}
/* /Modules/Cases/Pages/CaseKanbanPage/CaseKanbanPage.razor.rz.scp.css */
/* Dedicated case board mirrors the lean Tasks Kanban page layout. */
.zimam-case-kanban-page[b-vygm197kgk] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-block-size: 0;
    inline-size: 100%;
}

.zimam-case-kanban-page__content[b-vygm197kgk] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem;
    min-block-size: 0;
    padding-block-end: 1.5rem;
}

.zimam-case-kanban-page__header[b-vygm197kgk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.zimam-case-kanban-page__header-text[b-vygm197kgk] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.zimam-case-kanban-page__title[b-vygm197kgk] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
}

.zimam-case-kanban-page__subtitle[b-vygm197kgk] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-md);
    line-height: var(--lh-relaxed);
}

.zimam-case-kanban-page__header-actions[b-vygm197kgk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zimam-case-kanban-page__secondary-btn[b-vygm197kgk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    block-size: 2.5rem;
    padding-inline: 1rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font-family: inherit;
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition:
        background var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default);
}

.zimam-case-kanban-page__secondary-btn:hover[b-vygm197kgk] {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
}

.zimam-case-kanban-page__secondary-btn:focus-visible[b-vygm197kgk] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-case-kanban-page__section[b-vygm197kgk] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-block-size: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.zimam-case-kanban-page__tabs[b-vygm197kgk] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding-block: 0;
    padding-inline: 0.75rem;
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-case-kanban-page__tab[b-vygm197kgk],
.zimam-case-kanban-page__toggle-btn[b-vygm197kgk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-block-end: -1px;
    padding-block: 0.75rem;
    padding-inline: 0.25rem;
    border: 0;
    border-block-end: 2px solid transparent;
    background: transparent;
    color: var(--color-text-muted);
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    white-space: nowrap;
    cursor: pointer;
    transition:
        color var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default);
}

.zimam-case-kanban-page__tab:hover[b-vygm197kgk],
.zimam-case-kanban-page__toggle-btn:hover[b-vygm197kgk] {
    color: var(--color-text-secondary);
    border-block-end-color: var(--color-border-hover);
}

.zimam-case-kanban-page__tab--active[b-vygm197kgk],
.zimam-case-kanban-page__tab--active:hover[b-vygm197kgk] {
    color: var(--color-text-strong);
    border-block-end-color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.zimam-case-kanban-page__toggle-btn[b-vygm197kgk] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint);
    border-block-end: 0;
    flex-shrink: 0;
}

.zimam-case-kanban-page__toggle-btn:hover[b-vygm197kgk] {
    border-block-end-color: transparent;
}

.zimam-case-kanban-page__toggle-btn:focus-visible[b-vygm197kgk],
.zimam-case-kanban-page__tab:focus-visible[b-vygm197kgk] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-case-kanban-page__results[b-vygm197kgk] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-block-size: 0;
    padding: 0;
}

.zimam-case-kanban-page__controls-wrap[b-vygm197kgk] {
    display: grid;
    grid-template-rows: 1fr;
    margin-block-end: 0.5rem;
    opacity: 1;
    transition:
        grid-template-rows 220ms var(--ease-default),
        opacity 180ms var(--ease-default),
        margin-block-end 220ms var(--ease-default);
}

.zimam-case-kanban-page__controls-inner[b-vygm197kgk] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    overflow: hidden;
}

.zimam-case-kanban-page__results--controls-collapsed .zimam-case-kanban-page__controls-wrap[b-vygm197kgk] {
    grid-template-rows: 0fr;
    margin-block-end: 0;
    opacity: 0;
}

.zimam-case-kanban-page__toolbar[b-vygm197kgk] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin: 0;
}

.zimam-case-kanban-page__search-wrap[b-vygm197kgk] {
    inline-size: 100%;
    max-inline-size: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__filter-btn[b-vygm197kgk] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    block-size: 2.125rem;
    margin-inline-start: auto;
    padding-inline: 0.75rem;
    border: 0;
    border-radius: var(--radius-md);
    background: var(--color-text-strong);
    color: var(--color-surface);
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
    flex-shrink: 0;
}

.zimam-table-toolbar__filter-btn:hover[b-vygm197kgk] {
    background: var(--color-text-secondary);
}

.zimam-table-toolbar__filter-btn:focus-visible[b-vygm197kgk] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-filter-count-badge[b-vygm197kgk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-inline-size: 1.125rem;
    block-size: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-case-kanban-page__board[b-vygm197kgk] {
    position: relative;
    flex: 1;
    min-block-size: 32rem;
    min-inline-size: 0;
    overflow: visible;
    background: transparent;
    --kanban-column-max-height: calc(100dvh - 20rem);
}

.zimam-case-kanban-page__board[b-vygm197kgk] (.zimam-data-state) {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-block-size: inherit;
}

.zimam-case-kanban-page__board[b-vygm197kgk] (.zimam-case-kanban-board) {
    block-size: 100%;
    min-block-size: inherit;
    background: transparent;
}

.zimam-case-kanban-page__board[b-vygm197kgk] (.zimam-case-kanban-board__track) {
    min-block-size: inherit;
    padding-block: 0;
    padding-inline: 0;
}

@media (max-width: 1024px) {
    .zimam-case-kanban-page__toolbar[b-vygm197kgk] {
        align-items: stretch;
    }

    .zimam-case-kanban-page__search-wrap[b-vygm197kgk] {
        inline-size: 100%;
        min-inline-size: 0;
        flex-basis: 100%;
    }

    .zimam-case-kanban-page__board[b-vygm197kgk] {
        --kanban-column-max-height: calc(100dvh - 22rem);
    }
}

@media (max-width: 768px) {
    .zimam-case-kanban-page__content[b-vygm197kgk] {
        gap: 0.75rem;
    }

    .zimam-case-kanban-page__header-actions[b-vygm197kgk],
    .zimam-case-kanban-page__toolbar[b-vygm197kgk] {
        inline-size: 100%;
    }

    .zimam-case-kanban-page__secondary-btn[b-vygm197kgk],
    .zimam-table-toolbar__filter-btn[b-vygm197kgk] {
        inline-size: 100%;
        justify-content: center;
    }

    .zimam-case-kanban-page__tabs[b-vygm197kgk] {
        flex-wrap: wrap;
    }

    .zimam-case-kanban-page__toggle-btn[b-vygm197kgk] {
        margin-inline-start: 0;
    }

    .zimam-case-kanban-page__board[b-vygm197kgk] {
        min-block-size: 28rem;
        --kanban-column-max-height: calc(100dvh - 24rem);
    }
}
/* /Modules/Cases/Pages/CaseManagement/CaseManagement.razor.rz.scp.css */
/* ==========================================================================
   CaseManagement — Page layout, header, stats, tracker, tabs
   Scoped to CaseManagement.razor via Blazor CSS isolation
   ========================================================================== */

/* ── Page shell ── */
.zimam-case-management[b-lsk4df2ggo] {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.zimam-case-management__content[b-lsk4df2ggo] {
    padding-inline: 0px;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 1.5rem;
}

.zimam-case-management__results[b-lsk4df2ggo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-top: 0.5rem;
    padding-inline: 0.75rem;
    padding-bottom: 0.75rem;
}

.zimam-case-management__controls-wrap[b-lsk4df2ggo] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
    opacity: 1;
    margin-bottom: 0.25rem;
    position: relative;
    z-index: var(--z-sticky);
}

.zimam-case-management__controls-inner[b-lsk4df2ggo] {
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-case-management__results--controls-collapsed .zimam-case-management__controls-wrap[b-lsk4df2ggo] {
    grid-template-rows: 0fr;
    opacity: 0;
    margin-bottom: 0;
}

.zimam-case-management__results--controls-collapsed .zimam-case-management__controls-inner[b-lsk4df2ggo] {
    overflow: hidden;
}

.zimam-case-management__table-well[b-lsk4df2ggo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 24rem;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    contain: layout style;
    font-size: 12px;
}

.zimam-case-management__kanban-well[b-lsk4df2ggo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 32rem;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
}

.zimam-case-management__kanban-well[b-lsk4df2ggo]  .zimam-data-state {
    flex: 1;
    min-height: inherit;
}

.zimam-case-management__kanban-well[b-lsk4df2ggo]  .zimam-case-kanban-board {
    flex: 1;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table-wrap {
    flex: 1;
    overflow-y: auto;
}

/* Real split layout: header is outside the scrollable body area. */
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-case-table-shell {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-case-table-head-wrap {
    flex-shrink: 0;
    overflow: hidden;
    border-bottom: 1px solid var(--color-border);
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-case-table-body-wrap {
    min-height: 0;
    overflow-y: auto;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table--head,
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table--body {
    table-layout: fixed;
    min-width: 100%;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table--head thead th {
    position: static;
    box-shadow: none;
    border-bottom: 0;
}

/* ── Table typography + row height: 38px ── */
/* font-size:12px × line-height:1.5 = 18px content → padding-block = (38-18)/2 = 10px */
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table thead th,
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table tbody td {
    font-size: 12px;
    padding-block: 0.625rem;  /* 10px × 2 + 18px ≈ 38px row height */
}

/* Keep loading/error/empty states the same height as the data table to prevent CLS */
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-data-state {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: inherit;
}

.zimam-case-overview[b-lsk4df2ggo] {
    margin-bottom: 1rem;
    padding-inline: 0;
}

/* ── Section group ── */
.zimam-section-group[b-lsk4df2ggo] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, 0.375rem);
    padding: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

/* ── Content layout: Results + Quick-Action Column ── */
.zimam-case-management__content-layout[b-lsk4df2ggo] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-height: 0;
    align-items: stretch;
    contain: layout style;
}

.zimam-case-management__quick-action-column[b-lsk4df2ggo] {
    width: 400px;
    flex-shrink: 0;
    align-self: stretch;
    position: relative;
    top: auto;
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1280px) {
    .zimam-case-management__quick-action-column[b-lsk4df2ggo] {
        width: 360px;
    }
}

@media (max-width: 1024px) {
    .zimam-case-management__content-layout[b-lsk4df2ggo] {
        flex-direction: column;
    }

    .zimam-case-management__quick-action-column[b-lsk4df2ggo] {
        width: 100%;
        position: static;
        min-height: 28rem;
    }
}

/* ── Module header ── */
.zimam-module-header[b-lsk4df2ggo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 0.75rem;
    position: relative;
    gap: 1rem;
}

/* Divider spanning main area width */
.zimam-module-header[b-lsk4df2ggo]::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline: -24px;
    height: 1px;
    background: var(--color-border);
}

.zimam-module-header__text[b-lsk4df2ggo] {
    flex: 1;
}

.zimam-module-header__title[b-lsk4df2ggo] {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-strong);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-top: 0px;
    margin-bottom: 1px;
}

.zimam-module-header__subtitle[b-lsk4df2ggo] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin-top: 0px;
    margin-bottom: 1px;
    max-width: 38rem;
    line-height: 1.5;
}

.zimam-module-header__actions[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
}

.zimam-module-header__btn[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.zimam-module-header__btn:hover[b-lsk4df2ggo] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.zimam-module-header__btn:active[b-lsk4df2ggo] {
    transform: translateY(0);
}

.zimam-module-header__btn--secondary[b-lsk4df2ggo] {
    background: #fff;
    color: var(--color-text-strong);
    border: 1px solid var(--color-border);
    position: relative;
    border-radius: 0.5rem;
}

.zimam-module-header__btn--secondary:hover[b-lsk4df2ggo] {
    background: var(--color-surface-hover);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.zimam-module-header__timeframe[b-lsk4df2ggo] {
    appearance: none;
    background: #fff;
    border: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 12px;
    font-weight: 500;
    border-radius: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem 2.25rem;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-module-header__timeframe:hover[b-lsk4df2ggo] {
    background: var(--color-surface-hover);
}

.zimam-module-header__timeframe:focus-visible[b-lsk4df2ggo] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-module-header__timeframe-wrap[b-lsk4df2ggo] {
    position: relative;
    display: inline-flex;
    align-items: center;
    contain: layout style;
    flex-shrink: 0;
}

.zimam-module-header__timeframe-chevron[b-lsk4df2ggo] {
    position: absolute;
    left: 0.75rem;
    top: 0;
    bottom: 0;
    margin-block: auto;
    display: block;
    pointer-events: none;
    color: var(--color-text-faint);
}

/* ── Active filter count badge ── */
.zimam-filter-count-badge[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Save View Dialog ── */
.zimam-dialog-overlay[b-lsk4df2ggo] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: zimam-fade-in-b-lsk4df2ggo 150ms ease;
}

.zimam-dialog[b-lsk4df2ggo] {
    background: var(--color-surface, #fff);
    border-radius: 0.75rem;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    width: min(24rem, 90vw);
    max-height: 80vh;
    overflow: auto;
}

.zimam-dialog__header[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
}

.zimam-dialog__title[b-lsk4df2ggo] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--color-text-strong, #0f172a);
}

.zimam-dialog__close[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: none;
    border-radius: 0.375rem;
    background: transparent;
    color: var(--color-text-muted, #94a3b8);
    cursor: pointer;
}

.zimam-dialog__close:hover[b-lsk4df2ggo] {
    background: var(--color-surface-secondary, #f1f5f9);
    color: var(--color-text-strong, #0f172a);
}

.zimam-dialog__body[b-lsk4df2ggo] {
    padding: 1.25rem;
}

.zimam-dialog__error[b-lsk4df2ggo] {
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: var(--color-danger, #dc2626);
}

.zimam-dialog__footer[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--color-border, #e2e8f0);
}

@keyframes zimam-fade-in-b-lsk4df2ggo {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ── Stat row & cards ── */
.zimam-stat-row[b-lsk4df2ggo] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

@media (max-width: 1400px) {
    .zimam-stat-row[b-lsk4df2ggo] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 1024px) {
    .zimam-stat-row[b-lsk4df2ggo] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .zimam-stat-row[b-lsk4df2ggo] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.625rem;
    }
}

@media (max-width: 480px) {
    .zimam-stat-row[b-lsk4df2ggo] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.zimam-stat-card[b-lsk4df2ggo] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem 0.375rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    min-height: 5.75rem; /* Minimum height to stabilize layout; content can grow if needed */
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

/* Stagger reveal: real stat cards fade in sequentially after skeleton */
.zimam-stat-card:not(.zimam-stat-card--loading)[b-lsk4df2ggo] {
    animation: zimam-content-appear 300ms ease-out backwards;
}
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(1)[b-lsk4df2ggo] { animation-delay:  0ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(2)[b-lsk4df2ggo] { animation-delay: 50ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(3)[b-lsk4df2ggo] { animation-delay: 100ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(4)[b-lsk4df2ggo] { animation-delay: 150ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(5)[b-lsk4df2ggo] { animation-delay: 200ms; }

.zimam-stat-card:hover[b-lsk4df2ggo] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-stat-card__icon[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-faint);
}

.zimam-stat-card__body[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
    margin-bottom: 0.25rem;
    flex: 1;
}

.zimam-stat-card__info[b-lsk4df2ggo] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__label[b-lsk4df2ggo] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin-bottom: 0.0125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__value[b-lsk4df2ggo] {
    font-size: 26px;
    font-weight: 700;
    color: #000;
    line-height: 0.9;
    margin-top: 2px;
}

.zimam-stat-card__trend-block[b-lsk4df2ggo] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
}

.zimam-stat-card__trend-badge[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1875rem 0.375rem;
    border-radius: 99px;
    font-size: var(--text-xs);
    font-weight: 600;
    white-space: nowrap;
}

.zimam-stat-card__trend-badge--up[b-lsk4df2ggo] {
    background: #d1fae5;
    color: #059669;
}

.zimam-stat-card__trend-badge--down[b-lsk4df2ggo] {
    background: #fee2e2;
    color: #dc2626;
}

.zimam-stat-card__trend-badge--neutral[b-lsk4df2ggo] {
    background: #f1f5f9;
    color: #475569;
}

.zimam-stat-card__timeframe[b-lsk4df2ggo] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    margin-top: 0.125rem;
}

.zimam-stat-card__divider[b-lsk4df2ggo] {
    height: 1px;
    background: var(--color-border-light);
    margin-bottom: 0.25rem;
}

.zimam-stat-card__footer[b-lsk4df2ggo] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 0.875rem;
}

.zimam-stat-card__footer-meta[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__footer-text[b-lsk4df2ggo] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__footer-link[b-lsk4df2ggo] {
    font-size: 0.75rem;
    color: #000;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
    flex-shrink: 0;
    flex-direction: row-reverse;
}

.zimam-stat-card__footer-link svg[b-lsk4df2ggo] {
    color: inherit;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.zimam-stat-card__footer-link span[b-lsk4df2ggo] {
    display: inline-block;
    font-size: var(--text-xs);
    color: inherit;
    margin-inline-start: 0.5rem;
}

.zimam-stat-card__footer-link:hover[b-lsk4df2ggo] {
    text-decoration: underline;
}

/* ── Loading skeleton ── */
.zimam-stat-card--loading[b-lsk4df2ggo] {
    overflow: hidden;
}

.zimam-stat-card--loading .zimam-stat-skeleton[b-lsk4df2ggo] {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-lsk4df2ggo 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes zimam-shimmer-b-lsk4df2ggo {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

/* ── Tracker grid ── */
.zimam-tracker-grid[b-lsk4df2ggo] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.875rem;
    margin-bottom: 1.25rem;
    animation: zimam-content-appear 300ms ease-out;
}

@media (max-width: 1280px) {
    .zimam-tracker-grid[b-lsk4df2ggo] {
        grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr));
    }
}

@media (max-width: 768px) {
    .zimam-tracker-grid[b-lsk4df2ggo] {
        grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    }
}

@media (max-width: 480px) {
    .zimam-tracker-grid[b-lsk4df2ggo] {
        grid-template-columns: 1fr;
    }
}

.zimam-tracker-card[b-lsk4df2ggo] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    padding: 0.625rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: var(--shadow-sm);
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-tracker-card:hover[b-lsk4df2ggo] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-tracker-card__header[b-lsk4df2ggo] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.zimam-tracker-card__icon[b-lsk4df2ggo] {
    margin-top: 0.125rem;
    color: var(--color-text-faint);
    flex-shrink: 0;
}

.zimam-tracker-card__number-label[b-lsk4df2ggo] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__number[b-lsk4df2ggo] {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__status-label[b-lsk4df2ggo] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.25rem;
}

.zimam-tracker-card__timeline[b-lsk4df2ggo] {
    background: var(--color-bg);
    border-radius: var(--radius-lg);
    padding: 0.5rem 0.625rem;
    flex: 1;
    margin-bottom: 0.5rem;
    position: relative;
}

.zimam-tracker-card__timeline-line[b-lsk4df2ggo] {
    position: absolute;
    right: calc(0.625rem + 11px);
    top: 1.5rem;
    bottom: 1.5rem;
    width: 1px;
    background: var(--color-text-strong);
}

.zimam-tracker-card__timeline-items[b-lsk4df2ggo] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
}

.zimam-tracker-card__timeline-item[b-lsk4df2ggo] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.zimam-tracker-card__timeline-dot[b-lsk4df2ggo] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.zimam-tracker-card__timeline-dot svg[b-lsk4df2ggo] {
    width: 0.75rem;
    height: 0.75rem;
    color: var(--color-surface);
}

.zimam-tracker-card__timeline-detail[b-lsk4df2ggo] {
    min-width: 0;
}

.zimam-tracker-card__timeline-time[b-lsk4df2ggo] {
    font-size: 0.625rem;
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__timeline-desc[b-lsk4df2ggo] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: var(--lh-tight);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-tracker-card__btn[b-lsk4df2ggo] {
    align-self: flex-start;
    margin-top: auto;
    min-height: 1.875rem;
    padding-inline: 0.75rem;
    font-size: var(--text-xs);
}

/* ── Tracker card loading skeleton ── */.zimam-tracker-card--loading[b-lsk4df2ggo] {
    pointer-events: none;
}

.zimam-tracker-skeleton[b-lsk4df2ggo] {
    display: block;
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-lsk4df2ggo 1.5s infinite;
    border-radius: var(--radius-sm);
}

/* ── Tracker empty state ── */
.zimam-tracker-empty[b-lsk4df2ggo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 0.75rem;
    color: var(--color-text-faint);
}

.zimam-tracker-empty__icon[b-lsk4df2ggo] {
    opacity: 0.4;
}

.zimam-tracker-empty__text[b-lsk4df2ggo] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Tracker controls (removed) ── */

/* ── Tabs ── */
.zimam-tabs[b-lsk4df2ggo] {
    display: flex;
    gap: 0.875rem;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 0 0.75rem;
}

.zimam-tab[b-lsk4df2ggo] {
    padding: 0.75rem 0.25rem;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-bottom: -1px;
}

/* ── Toggle Controls Button ── */
.zimam-tab--toggle[b-lsk4df2ggo] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint, #94a3b8);
    border-bottom: none;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-tab--toggle:hover[b-lsk4df2ggo] {
    color: var(--color-text-secondary, #64748b);
    border-bottom-color: transparent;
}

.zimam-tab--toggle-icon[b-lsk4df2ggo] {
    transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.zimam-tab--toggle-collapsed .zimam-tab--toggle-icon[b-lsk4df2ggo] {
    transform: rotate(-180deg);
}

.zimam-case-management__results .zimam-table-toolbar[b-lsk4df2ggo] {
    margin-top: 0;
    margin-bottom: 0;
    padding-block: 0.5rem 0.375rem;
    padding-inline: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Give cards view more breathing room between tabs row and controls row. */
.zimam-case-management__results--cards .zimam-table-toolbar[b-lsk4df2ggo] {
    margin-top: 0.5rem;
}

.zimam-case-management__results--cards[b-lsk4df2ggo]  .zimam-active-filter-bar {
    margin-top: 0.25rem;
}

/* ── Compact Table Styling (Specific to Case Management) ── */
.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table {
    font-size: 11px;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table thead th {
    font-size: 11px;
    font-weight: 700;
    height: 35px;
    padding-block: 8px;
    padding-inline: 12px;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-table tbody td {
    height: 35px;
    padding: 8px;
}

.zimam-case-management__table-well[b-lsk4df2ggo]  .zimam-pill {
    font-size: 11px;
    padding-inline: 2em;
    padding-block: 0.2em;
    line-height: 1.25;
    border-radius: 999em;
}

.zimam-table-toolbar__filter-btn[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
    position: relative;
    flex-shrink: 0;
    margin-inline-start: auto; /* RTL: margin-right: auto → pushes to far left */
}

.zimam-table-toolbar__filter-btn:hover[b-lsk4df2ggo] {
    background: #1e293b;
}

.zimam-table-toolbar__filter-btn:focus-visible[b-lsk4df2ggo] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Column Picker Dropdown ── */
.zimam-column-picker[b-lsk4df2ggo] {
    position: relative;
    flex-shrink: 0;
    z-index: 30;
    isolation: isolate;
}

.zimam-column-picker__trigger[b-lsk4df2ggo] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    padding: 0;
    background: var(--color-surface, #fff);
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.zimam-column-picker__unsaved-dot[b-lsk4df2ggo] {
    position: absolute;
    top: -3px;
    inset-inline-end: -3px;
    width: 8px;
    height: 8px;
    background: var(--color-warning, #f59e0b);
    border: 1.5px solid var(--color-surface, #fff);
    border-radius: 50%;
    pointer-events: none;
}

.zimam-column-picker__trigger:hover[b-lsk4df2ggo] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
    border-color: var(--color-border-hover, #cbd5e1);
}

.zimam-column-picker__trigger:focus-visible[b-lsk4df2ggo] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-column-picker__backdrop[b-lsk4df2ggo] {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-modal) - 1);
}

.zimam-column-picker__panel[b-lsk4df2ggo] {
    position: absolute;
    top: calc(100% + 0.375rem);
    inset-inline-end: 0;
    z-index: var(--z-modal);
    width: 14rem;
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10), 0 1px 4px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.zimam-column-picker__header[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text-strong, #0f172a);
}

.zimam-column-picker__count[b-lsk4df2ggo] {
    font-weight: 400;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-column-picker__list[b-lsk4df2ggo] {
    padding: 0.375rem 0;
    max-height: 18rem;
    overflow-y: auto;
}

.zimam-column-picker__item[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    font-size: 12px;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    transition: background 0.1s ease;
    user-select: none;
}

.zimam-column-picker__item:hover[b-lsk4df2ggo] {
    background: var(--color-surface-hover, #f8fafc);
}

.zimam-column-picker__item input[type="checkbox"][b-lsk4df2ggo] {
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.1875rem;
    border: 1.5px solid var(--color-border, #cbd5e1);
    accent-color: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
    cursor: pointer;
}

.zimam-column-picker__item-label[b-lsk4df2ggo] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Inline Save/Discard Actions ── */
.zimam-column-picker__actions[b-lsk4df2ggo] {
    display: flex;
    gap: 0.375rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--color-border, #e2e8f0);
}

.zimam-column-picker__btn[b-lsk4df2ggo] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.75rem;
    border: none;
    border-radius: 0.375rem;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, opacity 0.15s ease;
}

.zimam-column-picker__btn:disabled[b-lsk4df2ggo] {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-column-picker__btn--save[b-lsk4df2ggo] {
    background: var(--color-text-strong, #0f172a);
    color: #fff;
}

.zimam-column-picker__btn--save:hover:not(:disabled)[b-lsk4df2ggo] {
    background: #1e293b;
}

.zimam-column-picker__btn--discard[b-lsk4df2ggo] {
    background: transparent;
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
}

.zimam-column-picker__btn--discard:hover:not(:disabled)[b-lsk4df2ggo] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}



.zimam-search-wrapper[b-lsk4df2ggo] {
    width: 100%;
    max-width: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__total[b-lsk4df2ggo] {
    font-size: 12px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.zimam-table-toolbar__total-count[b-lsk4df2ggo] {
    font-weight: 600;
    color: var(--color-text-strong);
}

.zimam-tab:hover[b-lsk4df2ggo] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-tab--active[b-lsk4df2ggo] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-tab--active:hover[b-lsk4df2ggo] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

/* ── Tabs separator (vertical divider between view-mode & saved-views) ── */
.zimam-tabs__separator[b-lsk4df2ggo] {
    width: 1px;
    align-self: stretch;
    margin-block: 0.5rem;
    background: var(--color-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Saved-view tab variant ── */
.zimam-tab--view[b-lsk4df2ggo] {
    font-size: 12px;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Dropdown trigger tab ── */
.zimam-tab--dropdown[b-lsk4df2ggo] {
    gap: 0.375rem;
}

/* ── Custom Views Dropdown Container ── */
.zimam-views-dropdown[b-lsk4df2ggo] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-bottom: -1px;
}

.zimam-views-dropdown__chevron[b-lsk4df2ggo] {
    transition: transform 0.2s ease;
}

.zimam-views-dropdown__chevron--open[b-lsk4df2ggo] {
    transform: rotate(180deg);
}

/* ── Tab badge (count) ── */
.zimam-tab-badge[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-bg, #f1f5f9);
    color: var(--color-text-secondary, #475569);
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
}

.zimam-tab--active .zimam-tab-badge[b-lsk4df2ggo] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

/* ── Dropdown Backdrop (click-outside to close) ── */
.zimam-views-dropdown__backdrop[b-lsk4df2ggo] {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-tooltip, 60) - 1);
    background: transparent;
}

/* ── Dropdown Panel ── */
.zimam-views-dropdown__panel[b-lsk4df2ggo] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    width: min(22rem, 90vw);
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    z-index: var(--z-tooltip, 60);
    overflow: hidden;
    animation: zimam-dropdown-in-b-lsk4df2ggo 150ms ease;
}

@keyframes zimam-dropdown-in-b-lsk4df2ggo {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-views-dropdown__header[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--color-text-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.zimam-views-dropdown__count[b-lsk4df2ggo] {
    font-size: 0.625rem;
    font-weight: 500;
    color: var(--color-text-faint, #94a3b8);
}

/* ── Dropdown List ── */
.zimam-views-dropdown__list[b-lsk4df2ggo] {
    max-height: 16rem;
    overflow-y: auto;
    padding: 0.25rem;
    scrollbar-width: thin;
}

.zimam-views-dropdown__item[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    border-radius: 0.375rem;
    transition: background 0.1s ease;
}

.zimam-views-dropdown__item:hover[b-lsk4df2ggo] {
    background: var(--color-surface-secondary, #f8fafc);
}

.zimam-views-dropdown__item--active[b-lsk4df2ggo] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item--active:hover[b-lsk4df2ggo] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item-btn[b-lsk4df2ggo] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: none;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    text-align: start;
    min-width: 0;
}

.zimam-views-dropdown__item--active .zimam-views-dropdown__item-btn[b-lsk4df2ggo] {
    color: var(--color-text-strong, #0f172a);
    font-weight: 600;
}

.zimam-views-dropdown__item-name[b-lsk4df2ggo] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.zimam-views-dropdown__item-active-dot[b-lsk4df2ggo] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
}

.zimam-views-dropdown__item-delete[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    padding: 0;
    border: none;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--color-text-faint, #94a3b8);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease;
}

.zimam-views-dropdown__item:hover .zimam-views-dropdown__item-delete[b-lsk4df2ggo] {
    opacity: 1;
}

.zimam-views-dropdown__item-delete:hover[b-lsk4df2ggo] {
    background: var(--color-danger-surface, #fef2f2);
    color: var(--color-danger, #dc2626);
}

/* ── Edit action button in dropdown item ── */
.zimam-views-dropdown__item-action[b-lsk4df2ggo] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    padding: 0;
    border: none;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--color-text-faint, #94a3b8);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease;
}

.zimam-views-dropdown__item:hover .zimam-views-dropdown__item-action[b-lsk4df2ggo] {
    opacity: 1;
}

.zimam-views-dropdown__item-action:hover[b-lsk4df2ggo] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

/* ── Save View Button (toolbar, beside filter button) ── */
.zimam-table-toolbar__save-view-btn[b-lsk4df2ggo] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--duration-fast, 150ms) ease, transform var(--duration-fast, 150ms) ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.zimam-table-toolbar__save-view-btn:hover[b-lsk4df2ggo] {
    background: #1e293b;
    transform: translateY(-0.5px);
}

.zimam-table-toolbar__save-view-btn:active[b-lsk4df2ggo] {
    transform: translateY(0);
}

/* ── Infinite scroll sentinel ── */
.zimam-scroll-sentinel[b-lsk4df2ggo] {
    height: 1px;
    width: 100%;
}

/* ── Infinite scroll loading bar ── */
.zimam-table-loader[b-lsk4df2ggo] {
    width: 100%;
    height: 3px;
    background: var(--color-border, #e2e8f0);
    overflow: hidden;
    flex-shrink: 0;
}

.zimam-table-loader__bar[b-lsk4df2ggo] {
    width: 40%;
    height: 100%;
    background: var(--color-text-strong, #0f172a);
    border-radius: 2px;
    animation: zimam-loader-slide-b-lsk4df2ggo 1s ease-in-out infinite;
}

@keyframes zimam-loader-slide-b-lsk4df2ggo {
    0%   { transform: translateX(250%); }
    100% { transform: translateX(-100%); }
}
/* /Modules/Cases/SharedComponents/CaseDrawerHeader/CaseDrawerHeader.razor.rz.scp.css */
/* CaseDrawerHeader — aligns the case drawer hero with TaskDrawerHeader. */

.zimam-drawer-rich-header--case[b-t3wnltnyqz] {
    display: flex;
    flex-direction: column;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz] {
    margin-block-start: 0;
    margin-inline: -1.5rem;
    padding-block-start: 0;
    padding-inline: 1.5rem;
    gap: 0;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__content {
    gap: 0.375rem;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__decor {
    inset-block-start: 0.5rem;
    inset-inline-end: -2.5rem;
    opacity: 0.1;
    color: var(--color-text-faint);
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__decor svg {
    width: 10rem;
    height: 10rem;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__tabs {
    margin: 0 -1.5rem 1.25rem;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__title {
    margin-block-start: 0;
    font-size: 1.375rem;
    letter-spacing: -0.02em;
    padding-inline: 0;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__desc {
    margin-block-start: 0;
    max-width: 100%;
    line-height: 1.55;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-drawer-rich-header__case-actions {
    display: flex;
    justify-content: flex-start;
    margin-block-start: 0.75rem;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-case-header-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--radius-sm);
    min-block-size: 2.25rem;
    padding-inline: var(--text-md);
    border: 1px solid var(--color-text-strong);
    border-radius: var(--radius-md);
    background: var(--color-text-strong);
    color: var(--color-surface);
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
}

.zimam-drawer-rich-header--case[b-t3wnltnyqz]  .zimam-case-header-action:hover {
    border-color: var(--color-text);
    background: var(--color-text);
}
/* /Modules/Cases/SharedComponents/CaseForm/CaseForm.razor.rz.scp.css */
[b-25rz0z4h52] .zimam-case-employee-picker {
    position: relative;
    width: 100%;
}

[b-25rz0z4h52] .zimam-case-employee-picker__trigger {
    width: 100%;
    min-height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    text-align: start;
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default);
}

[b-25rz0z4h52] .zimam-case-employee-picker__trigger:hover,
[b-25rz0z4h52] .zimam-case-employee-picker__trigger--open {
    border-color: var(--color-border-hover);
}

[b-25rz0z4h52] .zimam-case-employee-picker__trigger:focus-visible {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

[b-25rz0z4h52] .zimam-case-employee-picker__trigger:disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

[b-25rz0z4h52] .zimam-case-employee-picker__placeholder {
    color: var(--color-text-muted);
}

[b-25rz0z4h52] .zimam-case-employee-picker__value {
    color: var(--color-text-strong);
    font-weight: var(--fw-medium);
}

[b-25rz0z4h52] .zimam-case-employee-picker__chevron {
    color: var(--color-text-muted);
    font-size: var(--text-lg);
    line-height: 1;
}

[b-25rz0z4h52] .zimam-case-employee-picker__menu {
    position: absolute;
    z-index: var(--z-modal);
    inset-block-start: calc(100% + 0.375rem);
    inset-inline: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-floating);
}

[b-25rz0z4h52] .zimam-case-employee-picker__search-input {
    width: 100%;
    min-height: 2.25rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    font: inherit;
}

[b-25rz0z4h52] .zimam-case-employee-picker__search-input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

[b-25rz0z4h52] .zimam-case-employee-picker__list {
    max-height: 18rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

[b-25rz0z4h52] .zimam-case-employee-picker__option {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text);
    font: inherit;
    text-align: start;
    cursor: pointer;
}

[b-25rz0z4h52] .zimam-case-employee-picker__option:hover,
[b-25rz0z4h52] .zimam-case-employee-picker__option--selected {
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
}

[b-25rz0z4h52] .zimam-case-employee-picker__option--muted {
    justify-content: center;
    color: var(--color-text-secondary);
    border-style: dashed;
}

[b-25rz0z4h52] .zimam-case-employee-picker__avatar {
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

[b-25rz0z4h52] .zimam-case-employee-picker__text {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-25rz0z4h52] .zimam-case-employee-picker__name {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-25rz0z4h52] .zimam-case-employee-picker__meta {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-25rz0z4h52] .zimam-case-employee-picker__loading,
[b-25rz0z4h52] .zimam-case-employee-picker__empty,
[b-25rz0z4h52] .zimam-case-employee-picker__error,
[b-25rz0z4h52] .zimam-case-employee-picker__hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

[b-25rz0z4h52] .zimam-case-employee-picker__error {
    color: var(--color-error-text);
    background: var(--color-error-bg);
    border: 1px solid var(--color-error-border);
    border-radius: var(--radius-md);
}
/* /Modules/Cases/SharedComponents/CaseKanbanBoard/CaseKanbanBoard.razor.rz.scp.css */
.zimam-case-kanban-board[b-p8arw834em] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: var(--color-surface);
}

.zimam-case-kanban-board__track[b-p8arw834em] {
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: 1rem;
    height: 100%;
    min-height: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 1rem;
    scrollbar-width: thin;
}

.zimam-case-kanban-board__track[b-p8arw834em]::-webkit-scrollbar {
    width: 0.375rem;
    height: 0.375rem;
}

.zimam-case-kanban-board__track[b-p8arw834em]::-webkit-scrollbar-track {
    background: transparent;
}

.zimam-case-kanban-board__track[b-p8arw834em]::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border-radius: var(--radius-pill);
}

.zimam-case-kanban-board__notice[b-p8arw834em] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-inline: 1rem;
    margin-block-end: 1rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-warning-border);
    border-radius: var(--radius-lg);
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}
/* /Modules/Cases/SharedComponents/CaseKanbanCard/CaseKanbanCard.razor.rz.scp.css */
.zimam-case-kanban-card[b-2mtq85c1vc] {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width: 100%;
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    cursor: pointer;
    user-select: none;
    transition: border-color var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default),
        transform var(--duration-fast) var(--ease-default);
}

.zimam-case-kanban-card[draggable="true"][b-2mtq85c1vc] {
    cursor: grab;
}

.zimam-case-kanban-card[draggable="true"]:active[b-2mtq85c1vc] {
    cursor: grabbing;
}

.zimam-case-kanban-card:hover[b-2mtq85c1vc] {
    border-color: var(--color-border);
    box-shadow: var(--shadow-floating);
    transform: translateY(-1px);
}

.zimam-case-kanban-card:focus-visible[b-2mtq85c1vc] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-case-kanban-card__header[b-2mtq85c1vc],
.zimam-case-kanban-card__footer[b-2mtq85c1vc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    background: var(--color-surface);
}

.zimam-case-kanban-card__header[b-2mtq85c1vc] {
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-case-kanban-card__footer[b-2mtq85c1vc] {
    border-block-start: 1px solid var(--color-border-light);
}

.zimam-case-kanban-card__number-wrap[b-2mtq85c1vc],
.zimam-case-kanban-card__body[b-2mtq85c1vc] {
    display: flex;
    flex-direction: column;
}

.zimam-case-kanban-card__number-wrap[b-2mtq85c1vc] {
    min-width: 0;
    gap: 0.125rem;
}

.zimam-case-kanban-card__number-label[b-2mtq85c1vc],
.zimam-case-kanban-card__progress-head[b-2mtq85c1vc],
.zimam-case-kanban-card__chip[b-2mtq85c1vc],
.zimam-case-kanban-card__late[b-2mtq85c1vc],
.zimam-case-kanban-card__assignee[b-2mtq85c1vc] {
    font-size: var(--text-2xs);
}

.zimam-case-kanban-card__number-label[b-2mtq85c1vc],
.zimam-case-kanban-card__progress-head[b-2mtq85c1vc] {
    color: var(--color-text-muted);
    font-weight: var(--fw-semibold);
}

.zimam-case-kanban-card__number[b-2mtq85c1vc] {
    color: var(--color-text-strong);
    font-size: var(--text-md);
    line-height: var(--lh-tight);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-case-kanban-card__dot[b-2mtq85c1vc] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: var(--radius-pill);
    flex-shrink: 0;
}

.zimam-case-kanban-card__body[b-2mtq85c1vc] {
    gap: 0.625rem;
    padding: 0.75rem 0.875rem;
}

.zimam-case-kanban-card__title[b-2mtq85c1vc] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-case-kanban-card__desc[b-2mtq85c1vc] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-case-kanban-card__chips[b-2mtq85c1vc] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.zimam-case-kanban-card__chip[b-2mtq85c1vc] {
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-sm);
    padding: 0.125rem 0.4375rem;
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
}

.zimam-case-kanban-card__progress[b-2mtq85c1vc] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.zimam-case-kanban-card__progress-head[b-2mtq85c1vc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.zimam-case-kanban-card__progress-track[b-2mtq85c1vc] {
    height: 0.375rem;
    overflow: hidden;
    border-radius: var(--radius-xs);
    background: var(--color-border);
}

.zimam-case-kanban-card__progress-fill[b-2mtq85c1vc] {
    height: 100%;
    border-radius: inherit;
    background: var(--color-text-strong);
    transition: width var(--duration-normal) var(--ease-default);
}

.zimam-case-kanban-card__late[b-2mtq85c1vc] {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border: 1px solid var(--color-error-border);
    font-weight: var(--fw-semibold);
}

.zimam-case-kanban-card__assignee[b-2mtq85c1vc] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
    color: var(--color-text-secondary);
    font-weight: var(--fw-medium);
}

.zimam-case-kanban-card__assignee span[b-2mtq85c1vc] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-case-kanban-card__avatar[b-2mtq85c1vc] {
    width: 1.375rem;
    height: 1.375rem;
    border-radius: var(--radius-pill);
    object-fit: cover;
    border: 1px solid var(--color-surface);
    box-shadow: var(--shadow-sm);
    flex-shrink: 0;
}

@media (prefers-reduced-motion: reduce) {
    .zimam-case-kanban-card[b-2mtq85c1vc],
    .zimam-case-kanban-card:hover[b-2mtq85c1vc],
    .zimam-case-kanban-card__progress-fill[b-2mtq85c1vc] {
        transition: none;
        transform: none;
    }
}
/* /Modules/Cases/SharedComponents/CaseKanbanColumn/CaseKanbanColumn.razor.rz.scp.css */
.zimam-case-kanban-column[b-cv911l0c90] {
    --case-kanban-column-spacing: 0.75rem;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-width: 18rem;
    height: 100%;
    max-height: var(--case-kanban-column-max-height, calc(100vh - 12rem));
    padding-block: var(--case-kanban-column-spacing);
    gap: var(--case-kanban-column-spacing);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-card);
    background: var(--color-bg-subtle);
    overflow: hidden;
}

.zimam-case-kanban-column__header[b-cv911l0c90] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-inline: var(--case-kanban-column-spacing);
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    flex-shrink: 0;
}

.zimam-case-kanban-column__header-row[b-cv911l0c90],
.zimam-case-kanban-column__header-info[b-cv911l0c90],
.zimam-case-kanban-column__health[b-cv911l0c90],
.zimam-case-kanban-column__meta[b-cv911l0c90] {
    display: flex;
    align-items: center;
}

.zimam-case-kanban-column__header-row[b-cv911l0c90] {
    justify-content: space-between;
    gap: 0.75rem;
}

.zimam-case-kanban-column__header-info[b-cv911l0c90] {
    gap: 0.5rem;
    min-width: 0;
}

.zimam-case-kanban-column__header-icon[b-cv911l0c90] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--color-primary);
}

.zimam-case-kanban-column__title[b-cv911l0c90] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-case-kanban-column__count[b-cv911l0c90],
.zimam-case-kanban-column__health-pip[b-cv911l0c90] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    line-height: 1;
}

.zimam-case-kanban-column__count[b-cv911l0c90] {
    min-width: 1.25rem;
    height: 1.25rem;
    padding-inline: 0.5rem;
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

.zimam-case-kanban-column__health[b-cv911l0c90] {
    gap: 0.25rem;
    flex-shrink: 0;
}

.zimam-case-kanban-column__health-pip[b-cv911l0c90] {
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.375rem;
}

.zimam-case-kanban-column__health-pip--late[b-cv911l0c90] {
    color: var(--color-error-text);
    background: var(--color-error-bg);
    border: 1px solid var(--color-error-border);
}

.zimam-case-kanban-column__health-pip--warning[b-cv911l0c90] {
    color: var(--color-warning-text);
    background: var(--color-warning-bg);
    border: 1px solid var(--color-warning-border);
}

.zimam-case-kanban-column__health-pip--on-time[b-cv911l0c90] {
    color: var(--color-success-text);
    background: var(--color-success-bg);
    border: 1px solid var(--color-success-border);
}

.zimam-case-kanban-column__meta[b-cv911l0c90] {
    justify-content: space-between;
    gap: 0.5rem;
    color: var(--color-text-muted);
    font-size: var(--text-2xs);
    font-weight: var(--fw-medium);
}

.zimam-case-kanban-column__list[b-cv911l0c90] {
    display: flex;
    flex: 1;
    min-height: 0;
    flex-direction: column;
    gap: 0.75rem;
    overflow-y: auto;
    padding-inline: var(--case-kanban-column-spacing);
    padding-block-end: var(--case-kanban-column-spacing);
    scrollbar-width: thin;
    border-radius: var(--radius-lg);
}

.zimam-case-kanban-column__list[b-cv911l0c90]::-webkit-scrollbar {
    width: 0.5rem;
}

.zimam-case-kanban-column__list[b-cv911l0c90]::-webkit-scrollbar-track {
    background: transparent;
}

.zimam-case-kanban-column__list[b-cv911l0c90]::-webkit-scrollbar-thumb {
    background-color: var(--color-border);
    border-radius: var(--radius-pill);
    border: 0.125rem solid transparent;
    background-clip: padding-box;
}

.zimam-case-kanban-column__empty[b-cv911l0c90] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 7rem;
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-lg);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    background: var(--color-surface);
}
/* /Modules/Cases/SharedComponents/CaseQuickActionColumn/CaseQuickActionColumn.razor.rz.scp.css */
/* ==========================================================================
   CaseQuickActionColumn — Quick-action side column for Case Management
   Scoped to CaseQuickActionColumn.razor via Blazor CSS isolation
   ========================================================================== */

/* ── Column shell ── */
.quick-action-column[b-fqmdj2qqrg] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

/* ── Tab bar ── */
.quick-action-column__tab-bar[b-fqmdj2qqrg] {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--color-border);
    padding-inline: 0.25rem;
    flex-shrink: 0;
}

.quick-action-column__tab[b-fqmdj2qqrg] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.625rem 0.5rem;
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    text-align: center;
    white-space: nowrap;
    transition: color var(--duration-fast) var(--ease-default),
                border-bottom-color var(--duration-fast) var(--ease-default);
    margin: 0;
    margin-bottom: -1px;
}

.quick-action-column__tab:hover[b-fqmdj2qqrg] {
    color: var(--color-text-secondary);
}

.quick-action-column__tab--active[b-fqmdj2qqrg] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

/* ── Section header (aligned with zimam-table-toolbar) ── */
.quick-action-column__section-header[b-fqmdj2qqrg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.125rem;
    margin-bottom: 0.5rem;
    padding-block: 0.375rem 0.25rem;
    padding-inline: 0.75rem;
    gap: 0.5rem;
}

.quick-action-column__section-meta[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.quick-action-column__section-title[b-fqmdj2qqrg] {
    font-size: var(--text-md);
    font-weight: 700;
    color: var(--color-text-strong);
    margin: 0;
    line-height: 1.3;
}

.quick-action-column__section-date[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: 1.4;
}

/* ── Filter button in section header ── */
.quick-action-column__filter-btn[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.quick-action-column__filter-btn:hover[b-fqmdj2qqrg] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border-color: var(--color-border-hover);
}

.quick-action-column__filter-btn--active[b-fqmdj2qqrg] {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border-color: var(--color-text-strong);
}

.quick-action-column__filter-btn--active:hover[b-fqmdj2qqrg] {
    background: var(--color-text-secondary);
    color: var(--color-surface);
}

.quick-action-column__filter-btn:focus-visible[b-fqmdj2qqrg] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Filter pills outer shell (visible container) ── */
.quick-action-column__filter-shell[b-fqmdj2qqrg] {
    position: relative;
    margin: 0 0.75rem 0.5rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    overflow: hidden;
    flex-shrink: 0;
}

/* Fade masks on edges to hint more content */
.quick-action-column__filter-shell[b-fqmdj2qqrg]::before,
.quick-action-column__filter-shell[b-fqmdj2qqrg]::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1.5rem;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--duration-fast) var(--ease-default);
}

/* RTL: right edge fade (start) */
.quick-action-column__filter-shell[b-fqmdj2qqrg]::before {
    right: 0;
    background: linear-gradient(to right, transparent, var(--color-bg-subtle));
}

/* RTL: left edge fade (end) */
.quick-action-column__filter-shell[b-fqmdj2qqrg]::after {
    left: 0;
    background: linear-gradient(to left, transparent, var(--color-bg-subtle));
}

/* Show fades when hovering / grabbing — JS toggles .is-grabbing on the inner bar */
.quick-action-column__filter-shell:hover[b-fqmdj2qqrg]::before,
.quick-action-column__filter-shell:hover[b-fqmdj2qqrg]::after {
    opacity: 1;
}

/* ── Filter pills scrollable track (inner) ── */
.quick-action-column__filter-bar[b-fqmdj2qqrg] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    overflow-x: auto;
    scrollbar-width: none;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: auto;
    user-select: none;
    -webkit-user-select: none;
}

.quick-action-column__filter-bar:global(.is-grabbing)[b-fqmdj2qqrg] {
    cursor: grabbing;
    scroll-behavior: auto;
}

.quick-action-column__filter-bar[b-fqmdj2qqrg]::-webkit-scrollbar {
    display: none;
}

.quick-action-column__filter-pill[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: 999em;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                transform 150ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.quick-action-column__filter-pill:active[b-fqmdj2qqrg] {
    transform: scale(0.92);
}

.quick-action-column__filter-pill:hover[b-fqmdj2qqrg] {
    background: var(--color-surface-hover);
    border-color: var(--color-border-hover);
    color: var(--color-text-strong);
}

.quick-action-column__filter-pill--active[b-fqmdj2qqrg] {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border-color: var(--color-text-strong);
}

.quick-action-column__filter-pill--active:hover[b-fqmdj2qqrg] {
    background: var(--color-text-secondary);
    color: var(--color-surface);
}

.quick-action-column__filter-badge[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: 999em;
    font-size: 0.625rem;
    font-weight: 700;
    background: rgba(0, 0, 0, 0.12);
    color: inherit;
    line-height: 1;
}

.quick-action-column__filter-pill--active .quick-action-column__filter-badge[b-fqmdj2qqrg] {
    background: rgba(255, 255, 255, 0.25);
}

/* ── Task list (infinite scroll, fills remaining space) ── */
.quick-action-column__task-list[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0 0.75rem 0.75rem;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    flex: 1 1 0;
    min-height: 0;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border) transparent;
}

.quick-action-column__task-list[b-fqmdj2qqrg]::-webkit-scrollbar {
    width: 6px;
}

.quick-action-column__task-list[b-fqmdj2qqrg]::-webkit-scrollbar-track {
    background: transparent;
}

.quick-action-column__task-list[b-fqmdj2qqrg]::-webkit-scrollbar-thumb {
    background: var(--color-border-hover);
    border-radius: 999em;
}

/* ── Load indicator (logo spinner) ── */
.quick-action-column__load-indicator[b-fqmdj2qqrg] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 0;
}

/* ── All-loaded message ── */
.quick-action-column__all-loaded[b-fqmdj2qqrg] {
    text-align: center;
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    padding: 0.5rem 0 0.25rem;
    margin: 0;
}

/* ── Error state with retry ── */
.quick-action-column__error-state[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 0.75rem;
}

.quick-action-column__error-text[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-danger-text);
    text-align: center;
    margin: 0;
}

.quick-action-column__retry-btn[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--color-text-secondary);
    background: transparent;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.quick-action-column__retry-btn:hover[b-fqmdj2qqrg] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border-color: var(--color-border-hover);
}

.quick-action-column__retry-btn:focus-visible[b-fqmdj2qqrg] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

@keyframes taskCardEnter-b-fqmdj2qqrg {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Task item card ── */
.task-item-card[b-fqmdj2qqrg] {
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    padding: 0.625rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    animation: taskCardEnter-b-fqmdj2qqrg 0.25s var(--ease-out) both;
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.task-item-card:hover[b-fqmdj2qqrg] {
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-sm);
}

.task-item-card__body[b-fqmdj2qqrg] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.task-item-card__content[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

.task-item-card__title[b-fqmdj2qqrg] {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-strong);
    margin: 0;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.task-item-card__case-name[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Completion toggle ── */
.task-item-card__completion-toggle[b-fqmdj2qqrg] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    border-radius: 50%;
    border: 1.5px solid var(--color-border);
    background: transparent;
    color: transparent;
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default);
}

.task-item-card__completion-toggle:hover[b-fqmdj2qqrg] {
    border-color: var(--color-text-strong);
    color: var(--color-text-strong);
}

.task-item-card__completion-toggle--done[b-fqmdj2qqrg] {
    background: var(--color-text-strong);
    border-color: var(--color-text-strong);
    color: var(--color-surface);
}

.task-item-card__completion-toggle--done:hover[b-fqmdj2qqrg] {
    background: var(--color-text-secondary);
    border-color: var(--color-text-secondary);
    color: var(--color-surface);
}

.task-item-card__completion-toggle:focus-visible[b-fqmdj2qqrg] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Card footer: timeframe + assignees ── */
.task-item-card__footer[b-fqmdj2qqrg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

/* ── Status badge ── */
.task-item-card__status[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-pill);
    font-size: var(--text-2xs);
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    border: 1px solid;
    flex-shrink: 0;
}

.task-item-card__status--in-progress[b-fqmdj2qqrg] {
    background: var(--color-info-bg);
    color: var(--color-info-text);
    border-color: var(--color-info-border);
}

.task-item-card__status--review[b-fqmdj2qqrg] {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    border-color: var(--color-warning-border);
}

.task-item-card__status--hold[b-fqmdj2qqrg] {
    background: var(--color-hold-bg);
    color: var(--color-hold-text);
    border-color: var(--color-hold-border);
}

.task-item-card__status--done[b-fqmdj2qqrg] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.task-item-card__status--urgent[b-fqmdj2qqrg] {
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border-color: var(--color-error-border);
}

.task-item-card__timeframe[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    white-space: nowrap;
}

/* ── Avatar stack ── */
.task-item-card__assignees[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: row-reverse;
}

.task-item-card__avatar[b-fqmdj2qqrg] {
    width: 1.375rem;
    height: 1.375rem;
    border-radius: 50%;
    background: var(--color-bg-subtle);
    border: 2px solid var(--color-surface);
    object-fit: cover;
    margin-inline-start: -0.375rem;
    flex-shrink: 0;
}

.task-item-card__avatar:last-child[b-fqmdj2qqrg] {
    margin-inline-start: 0;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
    .quick-action-column__tab[b-fqmdj2qqrg],
    .task-item-card[b-fqmdj2qqrg],
    .task-item-card__completion-toggle[b-fqmdj2qqrg],
    .msg-thread[b-fqmdj2qqrg],
    .activity-item__dot[b-fqmdj2qqrg] {
        transition: none;
    }
}

/* ==========================================================================
   Tab icon wrap + unread badge
   ========================================================================== */
.quick-action-column__tab-icon-wrap[b-fqmdj2qqrg] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.quick-action-column__tab-count[b-fqmdj2qqrg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border: 1px solid var(--color-border);
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
}

.quick-action-column__tab--active .quick-action-column__tab-count[b-fqmdj2qqrg] {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border-color: var(--color-text-strong);
}

/* ==========================================================================
   Shared scroll-area (Messages + Activity tabs)
   ========================================================================== */
.quick-action-column__scroll-area[b-fqmdj2qqrg] {
    flex: 1 1 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    padding: 0.5rem 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border) transparent;
}

.quick-action-column__scroll-area[b-fqmdj2qqrg]::-webkit-scrollbar { width: 6px; }
.quick-action-column__scroll-area[b-fqmdj2qqrg]::-webkit-scrollbar-track { background: transparent; }
.quick-action-column__scroll-area[b-fqmdj2qqrg]::-webkit-scrollbar-thumb {
    background: var(--color-border-hover);
    border-radius: 999em;
}

/* ==========================================================================
   Messages tab — conversation thread rows
   ========================================================================== */
.msg-thread[b-fqmdj2qqrg] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.5rem;
    border-radius: var(--radius-lg);
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    text-align: start;
    width: 100%;
    transition: background var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.msg-thread:hover[b-fqmdj2qqrg] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border);
}

.msg-thread--unread[b-fqmdj2qqrg] {
    background: var(--color-bg-subtle);
}

.msg-thread--unread:hover[b-fqmdj2qqrg] {
    background: var(--color-bg);
    border-color: var(--color-border);
}

/* Avatar column */
.msg-thread__avatar-wrap[b-fqmdj2qqrg] {
    position: relative;
    flex-shrink: 0;
}

.msg-thread__avatar[b-fqmdj2qqrg] {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    object-fit: cover;
    user-select: none;
    flex-shrink: 0;
}

.msg-thread__unread-dot[b-fqmdj2qqrg] {
    position: absolute;
    bottom: -1px;
    inset-inline-end: -1px;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    border: 2px solid var(--color-surface);
}

/* Body column */
.msg-thread__body[b-fqmdj2qqrg] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.msg-thread__top[b-fqmdj2qqrg] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.msg-thread__sender[b-fqmdj2qqrg] {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.msg-thread--unread .msg-thread__sender[b-fqmdj2qqrg] {
    color: var(--color-text-strong);
}

.msg-thread__time[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    white-space: nowrap;
    flex-shrink: 0;
}

.msg-thread__preview[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
}

.msg-thread--unread .msg-thread__preview[b-fqmdj2qqrg] {
    color: var(--color-text-strong);
    font-weight: 500;
}

.msg-thread__case-tag[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==========================================================================
   Activity tab — vertical timeline
   ========================================================================== */
.activity-timeline[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    padding-block: 0.25rem;
}

.activity-item[b-fqmdj2qqrg] {
    display: flex;
    gap: 0.75rem;
    align-items: stretch;
}

/* Rail: dot + connecting line */
.activity-item__rail[b-fqmdj2qqrg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 1.25rem;
}

.activity-item__dot[b-fqmdj2qqrg] {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    flex-shrink: 0;
    border: 2px solid;
    margin-top: 0.25rem;
    transition: transform var(--duration-fast) var(--ease-default);
}

/* Dot variants */
.activity-item__dot--done[b-fqmdj2qqrg]  { background: var(--color-success-text); border-color: var(--color-success-text); }
.activity-item__dot--edit[b-fqmdj2qqrg]  { background: var(--color-info-text); border-color: var(--color-info-text); }
.activity-item__dot--info[b-fqmdj2qqrg]  { background: var(--color-surface); border-color: var(--color-text-faint); }
.activity-item__dot--warn[b-fqmdj2qqrg]  { background: var(--color-warning-text); border-color: var(--color-warning-text); }

.activity-item__line[b-fqmdj2qqrg] {
    flex: 1;
    width: 2px;
    background: var(--color-border);
    min-height: 0.75rem;
    border-radius: 1px;
}

/* Content column */
.activity-item__content[b-fqmdj2qqrg] {
    flex: 1;
    min-width: 0;
    padding-bottom: 0.625rem;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding-inline-start: 0.125rem;
}

.activity-item--last .activity-item__content[b-fqmdj2qqrg] {
    padding-bottom: 0.25rem;
}

.activity-item__top[b-fqmdj2qqrg] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.activity-item__title[b-fqmdj2qqrg] {
    font-size: var(--text-sm, 0.8125rem);
    font-weight: 600;
    color: var(--color-text-strong);
    line-height: 1.4;
}

.activity-item__time[b-fqmdj2qqrg] {
    font-size: var(--text-xs, 0.725rem);
    color: var(--color-text-muted);
    white-space: nowrap;
    flex-shrink: 0;
}

.activity-item__desc[b-fqmdj2qqrg] {
    font-size: var(--text-xs, 0.725rem);
    color: var(--color-text-secondary);
    line-height: 1.45;
    font-style: italic;
    margin: 0;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Optional "by" user row */
.activity-item__by[b-fqmdj2qqrg] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.activity-item__by-avatar[b-fqmdj2qqrg] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    object-fit: cover;
    flex-shrink: 0;
    user-select: none;
}

.activity-item__by-name[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    font-weight: 500;
}

.activity-item__case-tag[b-fqmdj2qqrg] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* /Modules/Cases/SharedComponents/CaseSessions/DrawerCaseSessionsList.razor.rz.scp.css */
.zimam-case-sessions[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
}

.zimam-case-sessions__header[b-bs7s5k9pwr] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--form-field-gap);
    padding: var(--form-field-gap);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-case-sessions__title[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-case-sessions__subtitle[b-bs7s5k9pwr] {
    margin: 0;
    margin-block-start: var(--radius-xs);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    line-height: var(--lh-normal);
}

.zimam-case-sessions__add[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--radius-sm);
    min-block-size: 2.5rem;
    padding-inline: var(--form-field-gap);
    border: 1px solid var(--color-text-strong);
    border-radius: var(--radius-md);
    background: var(--color-text-strong);
    color: var(--color-surface);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    transition: background var(--duration-fast) var(--ease-default), border-color var(--duration-fast) var(--ease-default);
}

.zimam-case-sessions__add:hover:not(:disabled)[b-bs7s5k9pwr] {
    background: var(--color-text);
    border-color: var(--color-text);
}

.zimam-case-sessions__add:disabled[b-bs7s5k9pwr] {
    opacity: 0.7;
    cursor: not-allowed;
}

.zimam-case-session-form[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
    padding: var(--form-field-gap);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-case-session-form__section[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
    padding-block-start: var(--form-field-gap);
    border-block-start: 1px solid var(--color-border-light);
}

.zimam-case-session-form__section h4[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-case-session-form__readonly[b-bs7s5k9pwr] {
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

.zimam-case-session-form__assistant-search[b-bs7s5k9pwr] {
    margin-block-end: var(--radius-sm);
}

.zimam-case-session-form__assistants[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--radius-sm);
    padding: var(--text-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    max-block-size: 14rem;
    overflow-y: auto;
}

.zimam-case-session-form__hint[b-bs7s5k9pwr] {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.zimam-case-session-form__selected-assistants[b-bs7s5k9pwr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--radius-sm);
    margin-block-start: var(--radius-sm);
}

.zimam-case-session-form__selected-assistants span[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    min-block-size: 1.75rem;
    padding-inline: var(--text-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-case-session-form__future-grid[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--form-field-gap);
}

.zimam-case-session-form__future-card[b-bs7s5k9pwr] {
    display: flex;
    align-items: center;
    gap: var(--radius-sm);
    padding: var(--text-md);
    border: 1px dashed var(--color-border-hover);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}

.zimam-case-session-form__actions[b-bs7s5k9pwr] {
    display: flex;
    justify-content: flex-end;
    gap: var(--radius-sm);
    padding-block-start: var(--form-field-gap);
    border-block-start: 1px solid var(--color-border-light);
}

.zimam-case-session-form__button[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 2.5rem;
    padding-inline: var(--form-field-gap);
    border-radius: var(--radius-md);
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
}

.zimam-case-session-form__button--primary[b-bs7s5k9pwr] {
    border: 1px solid var(--color-text-strong);
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-case-session-form__button--primary:hover:not(:disabled)[b-bs7s5k9pwr] {
    border-color: var(--color-text);
    background: var(--color-text);
}

.zimam-case-session-form__button--secondary[b-bs7s5k9pwr] {
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-secondary);
}

.zimam-case-session-form__button--secondary:hover:not(:disabled)[b-bs7s5k9pwr] {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-case-session-form__button:disabled[b-bs7s5k9pwr] {
    cursor: not-allowed;
    opacity: 0.65;
}

.zimam-case-sessions__list[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
}

.zimam-case-sessions__empty[b-bs7s5k9pwr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--radius-sm);
    min-block-size: 7rem;
    padding: var(--form-field-gap);
    border: 1px dashed var(--color-border-hover);
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    text-align: center;
}

.zimam-case-session-card[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: 7rem minmax(0, 1fr) auto;
    gap: var(--form-field-gap);
    align-items: flex-start;
    padding: var(--form-field-gap);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-case-session-card--next[b-bs7s5k9pwr] {
    border-color: var(--color-text-strong);
    box-shadow: 0 0 0 1px var(--color-text-strong), var(--shadow-sm);
}

.zimam-case-session-card--completed[b-bs7s5k9pwr] {
    background: var(--color-bg-subtle);
    opacity: 0.82;
}

.zimam-case-session-card--canceled[b-bs7s5k9pwr] {
    border-color: var(--color-error-border);
    background: var(--color-error-bg);
    opacity: 0.9;
}

.zimam-case-session-card--late[b-bs7s5k9pwr] {
    border-color: var(--color-warning-border);
    background: var(--color-warning-bg);
}

.zimam-case-session-card__date[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--radius-xs);
    padding: var(--text-sm);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.zimam-case-session-card--next .zimam-case-session-card__date[b-bs7s5k9pwr] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-case-session-card--completed .zimam-case-session-card__date[b-bs7s5k9pwr] {
    background: var(--color-surface);
    color: var(--color-text-muted);
}

.zimam-case-session-card--canceled .zimam-case-session-card__date[b-bs7s5k9pwr] {
    background: var(--color-surface);
    color: var(--color-error-text);
}

.zimam-case-session-card--late .zimam-case-session-card__date[b-bs7s5k9pwr] {
    background: var(--color-warning-border);
    color: var(--color-text-strong);
}

.zimam-case-session-card__date strong[b-bs7s5k9pwr] {
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
}

.zimam-case-session-card__date small[b-bs7s5k9pwr] {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-case-session-card--next .zimam-case-session-card__date small[b-bs7s5k9pwr] {
    color: var(--color-surface);
    opacity: 0.82;
}

.zimam-case-session-card__content[b-bs7s5k9pwr] {
    min-width: 0;
}

.zimam-case-session-card__title-row[b-bs7s5k9pwr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--radius-sm);
}

.zimam-case-session-card__content h4[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-case-session-card__status[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    min-block-size: 1.625rem;
    padding-inline: var(--text-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    white-space: nowrap;
}

.zimam-case-session-card--next .zimam-case-session-card__status[b-bs7s5k9pwr] {
    border-color: var(--color-text-strong);
    color: var(--color-text-strong);
}

.zimam-case-session-card__meta[b-bs7s5k9pwr] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--radius-sm);
    margin-block-start: var(--radius-sm);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}

.zimam-case-session-card__assistants[b-bs7s5k9pwr],
.zimam-case-session-card__note[b-bs7s5k9pwr] {
    margin: 0;
    margin-block-start: var(--radius-sm);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-case-session-card__details[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--radius-xs);
    margin-block-start: var(--text-sm);
    padding: var(--text-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.zimam-case-session-card__details strong[b-bs7s5k9pwr] {
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
}

.zimam-case-session-card__details p[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-case-session-card__actions[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--radius-sm);
    align-items: stretch;
}

.zimam-case-session-card__link[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-block-size: 2rem;
    padding-inline: var(--text-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    text-decoration: none;
    cursor: pointer;
}

.zimam-case-session-card__link:hover[b-bs7s5k9pwr] {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
}

.zimam-case-session-details-form[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
}

.zimam-case-session-details-form .task-summary-header[b-bs7s5k9pwr] {
    padding-bottom: 0.75rem;
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-case-session-details-form .zimam-form-label[b-bs7s5k9pwr] {
    margin-block-end: 0.5rem;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
}

.zimam-case-session-details-form textarea.zimam-form-input[b-bs7s5k9pwr] {
    min-height: 8rem;
    font-size: var(--text-md);
    font-weight: var(--fw-normal);
    line-height: var(--lh-normal);
}

.zimam-case-session-details-form__error[b-bs7s5k9pwr] {
    padding: var(--text-sm);
    border: 1px solid var(--color-error-border);
    border-radius: var(--radius-md);
    background: var(--color-error-bg);
    color: var(--color-error-text);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
}

.zimam-session-secondary[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: 0;
    direction: rtl;
    text-align: right;
}

.zimam-session-secondary > .task-summary-card + .task-summary-card[b-bs7s5k9pwr] {
    margin-block-start: 1.125rem;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr] {
    margin-block-start: -0.875rem;
    margin-inline: -1.5rem;
    padding-block-start: 1.25rem;
    padding-inline: 1.5rem;
    gap: 0.5rem;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__decor {
    inset-block-start: 0.5rem;
    inset-inline-end: -2.5rem;
    opacity: 0.1;
    color: var(--color-text-faint);
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__decor svg {
    inline-size: 10rem;
    block-size: 10rem;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__content {
    gap: 0.375rem;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__title {
    margin-top: 0;
    font-size: 1.375rem;
    letter-spacing: -0.02em;
    padding-inline: 0;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__desc {
    margin-top: 0;
    max-width: 100%;
    line-height: 1.55;
    font-variant-numeric: tabular-nums;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__badge-row {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    row-gap: 0.375rem;
    margin-block-end: 0.5rem;
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__badge {
    gap: 0.375rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    color: var(--color-text-strong);
    padding: 0.25rem 0.625rem;
    border-radius: 1rem;
    font-size: var(--text-sm);
}

.zimam-session-secondary__rich-header[b-bs7s5k9pwr]  .zimam-drawer-rich-header__badge-dot {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: var(--radius-pill);
    background: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-session-secondary[b-bs7s5k9pwr]  .task-avatar,
.zimam-session-secondary .task-avatar[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-session-secondary .task-summary-card[b-bs7s5k9pwr] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 0.875rem 1.125rem;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    margin: 0;
}

.zimam-session-secondary .task-summary-header[b-bs7s5k9pwr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding-bottom: 0.75rem;
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-session-secondary__card-edit[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    min-height: 2rem;
    padding-inline: 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    font: inherit;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    white-space: nowrap;
    cursor: pointer;
    transition:
        background var(--duration-fast),
        border-color var(--duration-fast),
        color var(--duration-fast),
        transform var(--duration-fast);
}

.zimam-session-secondary__card-edit:hover:not(:disabled)[b-bs7s5k9pwr] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
    color: var(--color-text-strong);
    transform: translateY(-1px);
}

.zimam-session-secondary__card-edit:disabled[b-bs7s5k9pwr] {
    cursor: not-allowed;
    opacity: 0.6;
}

.zimam-session-secondary .task-summary-person[b-bs7s5k9pwr] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}

.zimam-session-secondary .task-summary-person-info[b-bs7s5k9pwr] {
    min-width: 0;
}

.zimam-session-secondary .task-summary-person-name[b-bs7s5k9pwr] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-session-secondary .task-summary-person-sub[b-bs7s5k9pwr] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
    margin-top: 0.125rem;
    line-height: 1.25;
}

.zimam-session-secondary .task-summary-date[b-bs7s5k9pwr] {
    text-align: start;
    flex-shrink: 0;
}

.zimam-session-secondary .task-summary-date-main[b-bs7s5k9pwr] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
}

.zimam-session-secondary .task-summary-date-sub[b-bs7s5k9pwr] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
    margin-top: 0.125rem;
    line-height: 1.25;
}

.zimam-session-secondary .task-summary-row[b-bs7s5k9pwr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 0;
    border-block-end: 1px solid var(--color-border-light);
    min-height: 0;
}

.zimam-session-secondary .task-summary-row:last-child[b-bs7s5k9pwr] {
    border-block-end: none;
    padding-bottom: 0.125rem;
}

.zimam-session-secondary .task-summary-label[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    font-size: var(--text-sm);
    line-height: 1.25;
    flex-shrink: 0;
}

.zimam-session-secondary .task-summary-label[b-bs7s5k9pwr]  svg {
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-session-secondary .task-summary-value[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    font-size: var(--text-sm);
    line-height: 1.25;
    min-width: 0;
    text-align: end;
    overflow-wrap: anywhere;
}

.zimam-session-secondary .task-summary-value--mono[b-bs7s5k9pwr],
.zimam-session-secondary .task-summary-value--date[b-bs7s5k9pwr] {
    font-variant-numeric: tabular-nums;
}

.zimam-session-secondary .task-edit-hint[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: background var(--duration-fast), border-color var(--duration-fast), color var(--duration-fast);
}

.zimam-session-secondary .task-edit-hint:hover:not(:disabled)[b-bs7s5k9pwr] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
    color: var(--color-text-strong);
}

.zimam-session-secondary__inline-input[b-bs7s5k9pwr] {
    width: min(15rem, 100%);
}

.zimam-session-secondary__time-input[b-bs7s5k9pwr] {
    width: 8rem;
}

.zimam-session-secondary__inline-stack[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    width: min(24rem, 100%);
}

.zimam-session-secondary__inline-stack > input:nth-child(3)[b-bs7s5k9pwr] {
    grid-column: 1 / -1;
}

.zimam-session-secondary__assistant-edit[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    width: 100%;
    max-height: 11rem;
    overflow-y: auto;
    padding: 0.5rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    text-align: start;
}

.zimam-session-secondary__assistant-edit small[b-bs7s5k9pwr] {
    grid-column: 1 / -1;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-session-secondary__assistant-edit .zimam-form-checkbox:checked[b-bs7s5k9pwr] {
    background-color: var(--color-text-strong);
    border-color: var(--color-text-strong);
}

.zimam-session-secondary__assistant-edit .zimam-form-checkbox:focus-visible[b-bs7s5k9pwr] {
    box-shadow: 0 0 0 2px var(--color-border-hover);
}

.zimam-session-secondary__text-card[b-bs7s5k9pwr] {
    gap: 0.75rem;
}

.zimam-session-secondary__text-header[b-bs7s5k9pwr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.625rem;
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-session-secondary__text-header > div[b-bs7s5k9pwr] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 0.125rem;
}

.zimam-session-secondary__text-card h3[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: 1.25;
}

.zimam-session-secondary__text-header p[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.35;
    white-space: normal;
}

.zimam-session-secondary__text-card p[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
    white-space: pre-line;
}

.zimam-session-secondary__confirm-card[b-bs7s5k9pwr] {
    gap: 0.375rem;
    border-color: var(--color-error-border);
    background: var(--color-error-bg);
}

.zimam-session-secondary__confirm-card strong[b-bs7s5k9pwr] {
    color: var(--color-error-text);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-session-secondary__confirm-card p[b-bs7s5k9pwr] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-session-secondary__edit-panel[b-bs7s5k9pwr] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
    margin-block-start: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
}

.zimam-session-secondary__edit-panel .zimam-form-grid-2[b-bs7s5k9pwr] {
    gap: var(--form-field-gap);
}

.zimam-session-secondary__edit-panel .zimam-form-field[b-bs7s5k9pwr] {
    margin-block-end: 0;
    min-width: 0;
}

.zimam-session-secondary__edit-panel .zimam-form-label[b-bs7s5k9pwr] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
}

.zimam-session-secondary__edit-panel .zimam-form-input[b-bs7s5k9pwr],
.zimam-session-secondary__edit-panel .zimam-form-select[b-bs7s5k9pwr],
.zimam-session-secondary__edit-panel[b-bs7s5k9pwr]  .zimam-form-input,
.zimam-session-secondary__edit-panel[b-bs7s5k9pwr]  .zimam-datepicker-input {
    height: 2.375rem;
    font-size: var(--text-md);
    font-weight: var(--fw-normal);
    line-height: var(--lh-normal);
}

.zimam-session-secondary__edit-panel[b-bs7s5k9pwr]  .date-picker-wrapper,
.zimam-session-secondary__edit-panel[b-bs7s5k9pwr]  .zimam-datepicker-field {
    width: 100%;
}

.zimam-session-secondary__edit-panel textarea[b-bs7s5k9pwr] {
    height: auto;
    min-height: 8rem;
    padding-block: 0.5rem;
    resize: vertical;
}

.zimam-session-secondary__edit-actions[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding-block-start: 0;
}

.zimam-session-secondary__footer[b-bs7s5k9pwr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 0.75rem;
    inline-size: 100%;
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn[b-bs7s5k9pwr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 100%;
    min-inline-size: 0;
    block-size: 2.375rem;
    padding-inline: 1rem;
    border-radius: var(--radius-md);
    font-family: inherit;
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
    white-space: nowrap;
    cursor: pointer;
    transition:
        background var(--duration-fast),
        color var(--duration-fast),
        border-color var(--duration-fast);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn--primary[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn--primary[b-bs7s5k9pwr] {
    border: 1px solid var(--color-text-strong);
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn--secondary[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn--secondary[b-bs7s5k9pwr] {
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn--danger[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn--danger[b-bs7s5k9pwr] {
    border: 1px solid var(--color-error-border);
    background: var(--color-error-bg);
    color: var(--color-error-text);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn--danger:hover:not(:disabled)[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn--danger:hover:not(:disabled)[b-bs7s5k9pwr] {
    background: var(--color-error-text);
    border-color: var(--color-error-text);
    color: var(--color-surface);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn--secondary:hover:not(:disabled)[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn--secondary:hover:not(:disabled)[b-bs7s5k9pwr] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.zimam-session-secondary__edit-actions .zimam-drawer-btn:disabled[b-bs7s5k9pwr],
.zimam-session-secondary__footer .zimam-drawer-btn:disabled[b-bs7s5k9pwr] {
    cursor: not-allowed;
    opacity: 0.65;
}

.zimam-session-secondary__footer a[b-bs7s5k9pwr] {
    text-decoration: none;
}

@media (max-width: 720px) {
    .zimam-case-sessions__header[b-bs7s5k9pwr],
    .zimam-case-session-card[b-bs7s5k9pwr] {
        grid-template-columns: 1fr;
    }

    .zimam-case-sessions__header[b-bs7s5k9pwr] {
        align-items: stretch;
    }

    .zimam-case-session-card__actions[b-bs7s5k9pwr] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .zimam-case-session-form__assistants[b-bs7s5k9pwr],
    .zimam-case-session-form__future-grid[b-bs7s5k9pwr],
    .zimam-session-secondary__inline-stack[b-bs7s5k9pwr],
    .zimam-session-secondary__assistant-edit[b-bs7s5k9pwr] {
        grid-template-columns: 1fr;
    }

    .zimam-session-secondary .task-summary-header[b-bs7s5k9pwr],
    .zimam-session-secondary .task-summary-row[b-bs7s5k9pwr],
    .zimam-session-secondary__text-header[b-bs7s5k9pwr] {
        align-items: stretch;
        flex-direction: column;
    }

    .zimam-session-secondary__card-edit[b-bs7s5k9pwr] {
        align-self: flex-start;
    }

    .zimam-session-secondary .task-summary-value[b-bs7s5k9pwr] {
        justify-content: flex-start;
        text-align: start;
        flex-wrap: wrap;
    }

    .zimam-session-secondary__inline-input[b-bs7s5k9pwr],
    .zimam-session-secondary__inline-stack[b-bs7s5k9pwr] {
        width: 100%;
    }

    .zimam-session-secondary__edit-panel[b-bs7s5k9pwr] {
        padding: 0.75rem;
    }

    .zimam-session-secondary__edit-actions[b-bs7s5k9pwr],
    .zimam-session-secondary__footer[b-bs7s5k9pwr] {
        grid-template-columns: 1fr;
    }
}
/* /Modules/Cases/SharedComponents/CaseTimelineOverview/CaseTimelineOverview.razor.rz.scp.css */
/* ==========================================================================
   Case Timeline Track & Layout
   RTL Localized & Optimized
   ========================================================================== */

/* ── Timeline Track Layout ── */
.zimam-case-timeline[b-j6qt7iwob0] {
    --timeline-rail-width: 6rem;
    --timeline-spine-offset: 3.75rem;
    --timeline-card-gap: 2.25rem;
    --timeline-card-to-spine: calc(var(--timeline-rail-width) - var(--timeline-spine-offset) + var(--timeline-card-gap));
    --timeline-task-column-offset: calc(var(--timeline-card-to-spine) - 0.5rem);
    --timeline-task-container-bridge-offset: calc(var(--timeline-task-column-offset) - 1rem);
    --timeline-merge-offset: calc(var(--timeline-task-column-offset) + 1.5rem);
    --timeline-time-width: calc(var(--timeline-spine-offset) - var(--text-sm));
    --timeline-task-time-offset: calc(-1 * (var(--timeline-rail-width) + var(--timeline-card-gap) + 1rem));
    direction: rtl;
    text-align: start;
    background-color: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    overflow: visible;
    width: 100%;
    min-width: 0;
}

.case-timeline-card-header[b-j6qt7iwob0] {
    padding: var(--text-md) var(--form-field-gap);
    border-bottom: 1px solid var(--color-border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-surface);
    position: sticky;
    top: 0;
    z-index: 20;
}

.case-timeline-card-title[b-j6qt7iwob0] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
}

.legend-line-completed[b-j6qt7iwob0] {
    width: 1rem;
    height: 2px;
    background-color: var(--color-primary); 
}

.legend-line-pending[b-j6qt7iwob0] {
    width: 1rem;
    height: 0;
    border-top: 2px dashed #cbd5e1;
}

.case-timeline-toggle[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.case-timeline-toggle-label[b-j6qt7iwob0] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.case-timeline-switch[b-j6qt7iwob0] {
    width: 2.75rem;
    height: 1.5rem;
    border-radius: var(--radius-pill);
    position: relative;
    cursor: pointer;
    transition: background-color var(--duration-fast);
    border: none;
}
.case-timeline-switch.active[b-j6qt7iwob0] { background-color: var(--color-text-strong); }
.case-timeline-switch.inactive[b-j6qt7iwob0] { background-color: var(--color-border); }

.case-timeline-switch-thumb[b-j6qt7iwob0] {
    position: absolute;
    top: 0.25rem;
    inset-inline-start: 0.25rem;
    width: 1rem;
    height: 1rem;
    background-color: white;
    border-radius: var(--radius-pill);
    transition: transform var(--duration-fast);
}
/* Flip translation for RTL */
.case-timeline-switch.active .case-timeline-switch-thumb[b-j6qt7iwob0] {
    transform: translateX(-1.25rem); /* Negative in RTL to move end-ward */
}

/* ── Timeline Body ── */
.case-timeline-skeleton[b-j6qt7iwob0] {
    pointer-events: none;
    user-select: none;
}

.case-timeline-body[b-j6qt7iwob0] {
    padding: var(--text-sm) var(--form-field-gap) var(--form-field-gap);
    position: relative;
    min-height: 30rem;
}

.case-timeline-items[b-j6qt7iwob0] {
    position: relative;
    z-index: 20;
}

/* ── Timeline Nodes ── */
.timeline-dot[b-j6qt7iwob0] {
    position: absolute;
    border-radius: 50%;
    border: 2px solid #000;
    background-color: #fff;
    z-index: 30;
    transform: translateY(-50%);
    transition: transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out), border-color var(--duration-normal);
}

/* Status-aware dot border colours */
.timeline-dot.finished[b-j6qt7iwob0]    { border-color: #10b981; }
.timeline-dot.in-progress[b-j6qt7iwob0] { border-color: var(--color-primary); }
.timeline-dot.awaiting[b-j6qt7iwob0]    { border-color: #cbd5e1; }
.timeline-dot.suspended[b-j6qt7iwob0]   { border-color: #dc2626; }
.timeline-dot.under-review[b-j6qt7iwob0] { border-color: #f59e0b; }

.timeline-dot.phase-dot[b-j6qt7iwob0] {
    width: 0.875rem;
    height: 0.875rem;
    transform: translate(50%, -50%);
    box-shadow: var(--shadow-sm);
}

.timeline-dot.task-dot[b-j6qt7iwob0] {
    width: 0.75rem;
    height: 0.75rem;
    transform: translate(50%, -50%);
}

/* ── Phase Row ── */
.phase-row[b-j6qt7iwob0] {
    position: relative;
    display: flex;
    padding-top: 1rem;
    padding-bottom: 1rem;
    /* CSS variables for branch line style — inherited by all descendants */
    --branch-color: #cbd5e1;
    --branch-style: dashed;
}
.phase-row.finished[b-j6qt7iwob0]    { --branch-color: #10b981; --branch-style: solid; }
.phase-row.in-progress[b-j6qt7iwob0] { --branch-color: var(--color-primary); --branch-style: solid; }
.phase-row.suspended[b-j6qt7iwob0]   { --branch-color: #dc2626; --branch-style: solid; }

/* Fork curve color = first task's color (defaults to dashed gray like tasks) */
.phase-row[b-j6qt7iwob0] { --fork-color: #cbd5e1; --fork-style: dashed; }
.phase-row:has(.task-row:first-child.finished)[b-j6qt7iwob0]    { --fork-color: #10b981; --fork-style: solid; }
.phase-row:has(.task-row:first-child.in-progress)[b-j6qt7iwob0] { --fork-color: var(--color-primary); --fork-style: solid; }
.phase-row:has(.task-row:first-child.suspended)[b-j6qt7iwob0]   { --fork-color: #dc2626; --fork-style: solid; }
.phase-row:has(.task-row:first-child.under-review)[b-j6qt7iwob0] { --fork-color: #f59e0b; --fork-style: solid; }

/* ── Phase Spine Connector ──
   Vertical line on .phase-row::after, from this phase dot center
   downward to the next phase dot or END node. */
.phase-row[b-j6qt7iwob0]::after {
    content: '';
    position: absolute;
    top: calc(1rem + 1.75rem);
    bottom: calc(-1rem - 1.75rem);
    width: 0;
    border-inline-start: 2px var(--branch-style) var(--branch-color);
    inset-inline-start: calc(var(--timeline-spine-offset) - 1px);
    z-index: 16;
    pointer-events: none;
}


/* ── END Node Row ──
   Terminal node after the last phase. Mirrors phase-row layout
   so spine/dot alignment is consistent. */
.end-node-row[b-j6qt7iwob0] {
    position: relative;
    display: flex;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
}
.end-node-col[b-j6qt7iwob0] {
    width: var(--timeline-rail-width);
    flex-shrink: 0;
    position: relative;
}
.end-node-col .timeline-dot.end-dot[b-j6qt7iwob0] {
    position: absolute;
    top: 1.75rem;
    inset-inline-start: var(--timeline-spine-offset);
    transform: translate(50%, -50%);
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 50%;
    background: var(--color-border);
    border: 2px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    z-index: 20;
}

.phase-left-col[b-j6qt7iwob0] {
    width: var(--timeline-rail-width);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
}

/* Phase date: far right, full width up to the spine dot */
.phase-left-col[b-j6qt7iwob0]  .timeline-time {
    position: absolute;
    top: 1.75rem;
    transform: translateY(-50%);
    inset-inline-start: 0;
    width: var(--timeline-time-width);
    white-space: nowrap;
    text-align: end;
}
.phase-left-col .phase-dot[b-j6qt7iwob0] {
    top: 1.75rem;
    inset-inline-start: var(--timeline-spine-offset);
}

/* ── Timeline Time (shared text styles) ── */
[b-j6qt7iwob0] .timeline-time {
    text-align: start;
}
[b-j6qt7iwob0] .timeline-time-date {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    margin: 0;
    transition: color var(--duration-fast), font-weight var(--duration-fast);
}
.phase-row:has(.phase-card:hover) > .phase-left-col[b-j6qt7iwob0]  .timeline-time-date,
.phase-row:has(.timeline-dot:hover) > .phase-left-col[b-j6qt7iwob0]  .timeline-time-date {
    color: var(--color-text-strong);
    font-weight: var(--fw-bold);
}
[b-j6qt7iwob0] .timeline-time-hour {
    font-size: 10px;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-faint);
    margin: 0;
}

.phase-right-col[b-j6qt7iwob0] {
    flex: 1;
    min-width: 0;
    padding-inline-start: var(--timeline-card-gap);
}

.phase-card[b-j6qt7iwob0] {
    position: relative; /* Anchor for branch curve pseudo-elements */
    background-color: white;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--duration-normal), transform var(--duration-normal), border-color var(--duration-normal);
}
/* Phase hover styles based on status */
.phase-card:hover[b-j6qt7iwob0], .phase-row:has(.timeline-dot:hover) .phase-card[b-j6qt7iwob0] { 
    box-shadow: var(--shadow-md); 
    transform: translateY(-1px);
    border-color: #000000; /* Solid Black hover by default */
}
.phase-row.finished:has(.timeline-dot:hover) .phase-card[b-j6qt7iwob0], .phase-row.finished:has(.phase-card:hover) .phase-card[b-j6qt7iwob0] { border-color: #10b981; /* Green when finished */ }
.phase-row.in-progress:has(.timeline-dot:hover) .phase-card[b-j6qt7iwob0], .phase-row.in-progress:has(.phase-card:hover) .phase-card[b-j6qt7iwob0] { border-color: var(--color-primary); }
.phase-row.suspended:has(.timeline-dot:hover) .phase-card[b-j6qt7iwob0], .phase-row.suspended:has(.phase-card:hover) .phase-card[b-j6qt7iwob0] { border-color: #dc2626; /* Red when suspended */ }
.phase-row.default:has(.timeline-dot:hover) .phase-card[b-j6qt7iwob0], .phase-row.default:has(.phase-card:hover) .phase-card[b-j6qt7iwob0] { border-color: #000000; }
.phase-card.expanded[b-j6qt7iwob0] { border-color: var(--color-border); box-shadow: var(--shadow-md); }

.timeline-dot.phase-dot:hover[b-j6qt7iwob0], .phase-row:has(.phase-card:hover) .timeline-dot.phase-dot[b-j6qt7iwob0] {
    transform: translate(50%, -50%) scale(1.3);
    box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-md);
}

.phase-card-header[b-j6qt7iwob0] {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 0.75rem; /* Standardized to match task cards */
    text-align: start;
    background: transparent;
    border: none;
    cursor: pointer;
}

.phase-header-top[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    width: 100%;
}

.phase-title-group[b-j6qt7iwob0] {
    display: flex;
    flex-direction: row; /* Linear Layout */
    align-items: center;
    gap: 0.5rem;
}
.phase-title[b-j6qt7iwob0] {
    font-size: var(--text-sm); /* Standardized to match task title */
    font-weight: 700;
    color: var(--color-text-strong);
    margin: 0;
}
.phase-code[b-j6qt7iwob0] {
    font-size: 10px; /* Standardized to match task code */
    font-family: monospace;
    font-weight: 700;
    color: var(--color-text-faint);
    background-color: var(--color-bg-subtle);
    padding: 0.125rem 0.375rem;
    border-radius: var(--radius-xs);
}

.phase-status-group[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.phase-status-group .icon-wrap[b-j6qt7iwob0] { color: var(--color-text-faint); }

.phase-progress-row[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    margin-top: 0.25rem;
}
.phase-progress-bar-bg[b-j6qt7iwob0] {
    flex: 1;
    height: 0.375rem;
    background-color: var(--color-bg);
    border-radius: var(--radius-pill);
    overflow: hidden;
}
.phase-progress-bar-fill[b-j6qt7iwob0] {
    height: 100%;
    border-radius: var(--radius-pill);
    background-color: var(--color-primary);
    transition: width 0.5s ease;
}
.phase-progress-bar-fill.complete[b-j6qt7iwob0] { background-color: #10b981; }
.phase-progress-text[b-j6qt7iwob0] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    width: 2rem;
    text-align: end;
}

/* Animation via grid hack for Phase Tasks */
.phase-details-anim[b-j6qt7iwob0] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows var(--duration-normal) var(--ease-out), opacity var(--duration-normal) var(--ease-out);
    overflow: hidden;
}
.phase-details-anim.expanded[b-j6qt7iwob0] {
    grid-template-rows: 1fr;
    opacity: 1;
    overflow: visible;
}

.phase-details-inner[b-j6qt7iwob0] {
    min-height: 0; /* Critical for grid track hack */
}

/* ── Tasks Area ── */
.phase-tasks-container[b-j6qt7iwob0] {
    padding: 0.5rem 1rem 1rem;
    border-top: 1px solid var(--color-bg-subtle);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: relative;
}

/* Bridge: fork curve end → first task row top.
   Covers the gap inside the tasks container, from its top edge
   down to the first task-row (0.5rem padding).
   Uses --fork-color (= first task's color). */
.phase-tasks-container[b-j6qt7iwob0]::before {
    content: '';
    position: absolute;
    inset-inline-start: calc(-1 * var(--timeline-task-container-bridge-offset));
    top: 0;
    height: calc(0.5rem + 0.25rem); /* container padding-top + small overlap */
    width: 0;
    border-inline-start: 2px var(--fork-style) var(--fork-color);
    pointer-events: none;
    z-index: 17;
}

/* Bridge: last task → merge: removed — last task’s ::after handles it. */

/* ── Fork curve: phase dot exits, curves to task column, goes DOWN to container.
   The border-inline-end vertical extends from curve to approximately the
   tasks container top. Uses --fork-color (= first task's color).
   This is safe because the only task whose area it enters is T-01. */
.phase-card.expanded:has(.task-row)[b-j6qt7iwob0]::before {
    content: '';
    position: absolute;
    top: 1.75rem;
    inset-inline-start: calc(-1 * var(--timeline-card-to-spine));
    width: 1.5rem;
    height: 6rem; /* curve (1rem) + straight to reach tasks container */
    border-top: 2px var(--fork-style) var(--fork-color);
    border-inline-end: 2px var(--fork-style) var(--fork-color);
    border-start-end-radius: 1rem;
    border-bottom: none;
    border-inline-start: none;
    pointer-events: none;
    z-index: 16;
}

/* ── Task Rows ── */
.task-row[b-j6qt7iwob0] {
    position: relative;
    display: flex;
    /* Per-task status colors — default to dashed gray */
    --task-color: #cbd5e1;
    --task-style: dashed;
}
.task-row.finished[b-j6qt7iwob0]    { --task-color: #10b981; --task-style: solid; }
.task-row.in-progress[b-j6qt7iwob0] { --task-color: var(--color-primary); --task-style: solid; }
.task-row.suspended[b-j6qt7iwob0]   { --task-color: #dc2626; --task-style: solid; }
.task-row.under-review[b-j6qt7iwob0] { --task-color: #f59e0b; --task-style: solid; }

/* First task: vertical from row top to dot center.
   Bridges the gap between fork curve end and this task's dot.
   Uses THIS TASK's own color (not fork/branch). */
.task-row:first-child[b-j6qt7iwob0]::before {
    content: '';
    position: absolute;
    inset-inline-start: calc(-1 * var(--timeline-task-column-offset));
    top: 0;
    height: 1.5rem; /* row top to dot center */
    width: 0;
    border-inline-start: 2px var(--task-style) var(--task-color);
    pointer-events: none;
    z-index: 17;
}

/* Task dot: anchored to card header center (0.75rem padding + ~0.875rem half-height ≈ 1.5rem).
   This stays fixed even when the card expands with details. */
.task-row .timeline-dot.task-dot[b-j6qt7iwob0] {
    position: absolute;
    top: 1.5rem;
    inset-inline-start: calc(-1 * var(--timeline-task-column-offset));
    transform: translate(50%, -50%);
    z-index: 30;
}

/* Task date: fixed top to match task dot */
.task-row[b-j6qt7iwob0]  .timeline-time.task-time {
    position: absolute;
    top: 1.5rem;
    transform: translateY(-50%);
    inset-inline-start: var(--timeline-task-time-offset);
    width: var(--timeline-time-width);
    text-align: end;
    white-space: nowrap;
    z-index: 20;
}

/* ── Vertical connector between task dots ──
   SINGLE downward line from each task's dot center to the next task's dot center.
   Color belongs to the SOURCE task (the one drawing the line).
   No ::before — avoids color collision at the junction.
   Math: bottom must cross the 1rem container gap + reach next dot at 1.5rem
         → bottom = -(gap + next-dot-top) = -(1rem + 1.5rem) = -2.5rem */
.task-row:not(:last-child)[b-j6qt7iwob0]::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(-1 * var(--timeline-task-column-offset));
    top: 1.5rem;
    bottom: calc(-1rem - 1.5rem); /* -(gap) - (next dot top) = -2.5rem */
    width: 0;
    border-inline-start: 2px var(--task-style) var(--task-color);
    pointer-events: none;
    z-index: 17;
}
/* Last task: single L-shaped element from dot center DOWN, curves to next phase dot.
   Draws the vertical, the curve, and the horizontal — one element, one color.
   Bottom: container-pad(1) + phase-pad-bot(1) + next-phase-pad-top(1) + next-dot(1.75) = 4.75rem
   Width: spine to task column = 1.5rem from task-row inline-start. */
.task-row:last-child[b-j6qt7iwob0]::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(-1 * var(--timeline-merge-offset));
    top: 1.5rem; /* dot center */
    bottom: -4.75rem; /* next phase dot center Y */
    width: 1.5rem;
    border-inline-end: 2px var(--task-style) var(--task-color); /* vertical on task-column side */
    border-bottom: 2px var(--task-style) var(--task-color); /* horizontal at bottom */
    border-end-end-radius: 1rem; /* curve from vertical to horizontal */
    border-top: none;
    border-inline-start: none;
    pointer-events: none;
    z-index: 17;
}

.task-card[b-j6qt7iwob0] {
    flex: 1;
    min-width: 0;
    background-color: oklch(98.5% 0.002 247.839); /* Enforced constant color as requested */
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-light);
    transition: box-shadow var(--duration-fast), transform var(--duration-fast), border-color var(--duration-fast);
}

.task-card:hover[b-j6qt7iwob0] { box-shadow: var(--shadow-md); transform: translateY(-1px); border-color: #000000; }
.task-row.finished .task-card:hover[b-j6qt7iwob0] { border-color: #10b981; }
.task-row.in-progress .task-card:hover[b-j6qt7iwob0] { border-color: var(--color-primary); }
.task-row.suspended .task-card:hover[b-j6qt7iwob0] { border-color: #dc2626; }
.task-row.default .task-card:hover[b-j6qt7iwob0] { border-color: #000000; }

.timeline-dot.task-dot:hover[b-j6qt7iwob0] {
    transform: translate(50%, -50%) scale(1.3);
    box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-sm);
}

.task-card-header[b-j6qt7iwob0] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem;
    text-align: start;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.task-card-header:hover[b-j6qt7iwob0] { background-color: rgba(241, 245, 249, 0.5); }

.task-title-group[b-j6qt7iwob0] {
    display: flex;
    flex-direction: row; /* Linear Layout */
    align-items: center;
    gap: 0.5rem;
}
.task-code[b-j6qt7iwob0] {
    font-size: 10px;
    font-weight: 700;
    color: oklch(70.7% 0.022 261.325); /* User requested color */
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.task-title[b-j6qt7iwob0] {
    font-size: var(--text-sm);
    font-weight: 700;
    color: oklch(55.1% 0.027 264.364); /* User requested color */
    margin: 0;
}
.task-title.finished[b-j6qt7iwob0] { color: var(--color-text-muted); }
.task-title.active[b-j6qt7iwob0] { color: var(--color-text-strong); }

.task-status-group[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.task-status-group .icon-wrap[b-j6qt7iwob0] { color: var(--color-text-faint); }

/* Animation via grid hack */
.task-details-anim[b-j6qt7iwob0] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows var(--duration-normal) var(--ease-out), opacity var(--duration-normal) var(--ease-out);
    overflow: hidden;
}
.task-details-anim.expanded[b-j6qt7iwob0] {
    grid-template-rows: 1fr;
    opacity: 1;
}

.task-details-inner[b-j6qt7iwob0] {
    min-height: 0; /* Critical for grid track hack */
}

.task-details[b-j6qt7iwob0] {
    padding: 0 0.75rem 0.75rem;
    border-top: 1px solid rgba(226, 232, 240, 0.6);
}

.task-docs-header[b-j6qt7iwob0] {
    font-size: 11px;
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.5rem;
}
.task-docs-grid[b-j6qt7iwob0] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}
.task-doc-item[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background-color: white;
    cursor: pointer;
    transition: background-color var(--duration-fast);
}
.task-doc-item:hover[b-j6qt7iwob0] { background-color: var(--color-bg-subtle); }
.task-doc-item .doc-info[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
}
.task-doc-item .doc-info .icon[b-j6qt7iwob0] { color: var(--color-primary); flex-shrink: 0; }
.task-doc-item .doc-info .name[b-j6qt7iwob0] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-meta-grid[b-j6qt7iwob0] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.5rem;
    background-color: white;
    padding: 1rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-light);
    margin-top: 0.5rem;
    box-shadow: var(--shadow-sm);
}

.task-meta-col[b-j6qt7iwob0] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}
.task-meta-col.full-col[b-j6qt7iwob0] {
    grid-column: 1 / -1;
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-bg-subtle);
}

.task-meta-label[b-j6qt7iwob0] {
    font-size: 10px;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}
.task-meta-value[b-j6qt7iwob0] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    margin-top: 0.125rem;
}

.task-assignee[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
}
.task-assignee .avatar[b-j6qt7iwob0] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: #dbeafe;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    flex-shrink: 0;
}
.task-assignee .name[b-j6qt7iwob0] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    transition: color var(--duration-fast);
}
.task-assignee:hover .name[b-j6qt7iwob0] { color: var(--color-primary); }

.task-notes[b-j6qt7iwob0] {
    background-color: var(--color-bg-subtle);
    padding: 0.75rem;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: var(--lh-relaxed);
    border: 1px solid var(--color-border-light);
}

.task-quick-actions[b-j6qt7iwob0] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--color-border-light);
}
.task-action-btn[b-j6qt7iwob0] {
    font-size: 11px;
    font-weight: var(--fw-medium);
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-xs);
    transition: color var(--duration-fast), background-color var(--duration-fast);
    background: transparent;
    border: none;
    cursor: pointer;
}
.task-action-btn.secondary[b-j6qt7iwob0] {
    color: var(--color-text-muted);
}
.task-action-btn.secondary:hover[b-j6qt7iwob0] {
    color: var(--color-text-strong);
    background-color: var(--color-bg);
}
.task-action-btn.primary[b-j6qt7iwob0] {
    color: var(--color-primary);
}
.task-action-btn.primary:hover[b-j6qt7iwob0] {
    color: #1d4ed8; 
    background-color: #eff6ff; 
}
/* ── Status badges ── */
.case-timeline-badge[b-j6qt7iwob0] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    border-radius: var(--radius-md);
    padding: 0.25rem 0.5rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    border: 1px solid transparent;
}

.case-timeline-badge.finished[b-j6qt7iwob0],
.case-timeline-badge.closed[b-j6qt7iwob0] {
    background-color: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.case-timeline-badge.in-progress[b-j6qt7iwob0] {
    background-color: var(--color-info-bg);
    color: var(--color-info-text);
    border-color: var(--color-info-border);
}

.case-timeline-badge.awaiting[b-j6qt7iwob0],
.case-timeline-badge.under-review[b-j6qt7iwob0] {
    background-color: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    border-color: var(--color-border);
}

.case-timeline-badge.suspended[b-j6qt7iwob0] {
    background-color: var(--color-error-bg);
    color: var(--color-error-text);
    border-color: var(--color-error-border);
}

/* ── :has() fallback for older browsers (Firefox < 121) ── */
@supports not selector(:has(a)) {
    .phase-card:hover[b-j6qt7iwob0] {
        box-shadow: var(--shadow-md);
        transform: translateY(-1px);
        border-color: var(--color-border);
    }
    .task-card:hover[b-j6qt7iwob0] {
        box-shadow: var(--shadow-md);
        transform: translateY(-1px);
        border-color: var(--color-border);
    }
    .timeline-dot.phase-dot:hover[b-j6qt7iwob0] {
        transform: translate(50%, -50%) scale(1.3);
        box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-md);
    }
}
/* /Modules/Cases/SharedComponents/CaseView/CaseInfoCard.razor.rz.scp.css */
.zimam-case-info-card[b-avaossse5s] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    min-width: 0;
}

.zimam-case-info-card__icon[b-avaossse5s] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    flex-shrink: 0;
}

.zimam-case-info-card__content[b-avaossse5s] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.zimam-case-info-card__label[b-avaossse5s] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
}

.zimam-case-info-card__value[b-avaossse5s] {
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Modules/Cases/SharedComponents/CaseView/CaseSummaryRow.razor.rz.scp.css */
.zimam-case-summary-row[b-ohvol04k88] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 0;
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-case-summary-row:last-child[b-ohvol04k88] {
    border-block-end: none;
    padding-block-end: 0.125rem;
}

.zimam-case-summary-row__label[b-ohvol04k88] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    font-size: var(--text-sm);
    line-height: var(--lh-tight);
}

.zimam-case-summary-row__label[b-ohvol04k88]  svg {
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-case-summary-row__value[b-ohvol04k88] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    font-size: var(--text-sm);
    line-height: var(--lh-tight);
    text-align: start;
}

.zimam-case-summary-row__value--mono[b-ohvol04k88] {
    font-family: var(--font-family);
    font-variant-numeric: tabular-nums;
}

.zimam-case-summary-row__value[b-ohvol04k88]  .zimam-pill {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    padding: 0.3125rem 0.625rem;
    line-height: 1.1;
    border-radius: var(--radius-md);
    gap: 0;
}

.zimam-case-summary-row__value[b-ohvol04k88]  .zimam-pill .zimam-dot {
    display: none;
}
/* /Modules/Cases/SharedComponents/CaseView/CaseView.razor.rz.scp.css */
/* CaseView — tab panel body for the rich case drawer. */

.zimam-case-view[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    direction: rtl;
    text-align: start;
}

.zimam-case-view__panel[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
}

.zimam-case-view__panel--overview[b-0ta4s9wi8d] {
    padding-block-end: var(--form-field-gap);
}

.zimam-case-overview-card[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
    padding: var(--form-field-gap);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-case-overview-card__header[b-0ta4s9wi8d] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--form-field-gap);
    padding-block-end: var(--form-field-gap);
    border-block-end: 1px solid var(--color-border-light);
}

.zimam-case-overview-card__title-group[b-0ta4s9wi8d] {
    display: flex;
    align-items: flex-start;
    gap: var(--text-md);
    min-width: 0;
}

.zimam-case-overview-card__icon[b-0ta4s9wi8d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: var(--space-section);
    block-size: var(--space-section);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-case-overview-card__heading[b-0ta4s9wi8d] {
    min-width: 0;
}

.zimam-case-overview-card__title[b-0ta4s9wi8d] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-case-overview-card__subtitle[b-0ta4s9wi8d] {
    margin: 0;
    margin-block-start: var(--radius-xs);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
}

.zimam-case-overview-card__meta[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--radius-xs);
    flex-shrink: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
}

.zimam-case-overview-card__meta-value[b-0ta4s9wi8d] {
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    font-variant-numeric: tabular-nums;
}

.zimam-case-overview-card__body[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
}

.zimam-case-status[b-0ta4s9wi8d],
.zimam-case-state[b-0ta4s9wi8d],
.zimam-case-health[b-0ta4s9wi8d] {
    display: inline-flex;
    align-items: center;
    gap: var(--radius-sm);
    border-radius: var(--radius-md);
    padding: var(--radius-xs) var(--text-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    border: 1px solid transparent;
    line-height: var(--lh-tight);
}

.zimam-case-status[b-0ta4s9wi8d] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border-color: var(--color-border);
}

.zimam-case-status__dot[b-0ta4s9wi8d],
.zimam-case-health__dot[b-0ta4s9wi8d] {
    inline-size: var(--radius-sm);
    block-size: var(--radius-sm);
    border-radius: var(--radius-pill);
    background: currentColor;
}

.zimam-case-state--active[b-0ta4s9wi8d] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.zimam-case-state--inactive[b-0ta4s9wi8d] {
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
    border-color: var(--color-border);
}

.zimam-case-health--on-track[b-0ta4s9wi8d],
.zimam-case-health--completed[b-0ta4s9wi8d] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.zimam-case-health--at-risk[b-0ta4s9wi8d] {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    border-color: var(--color-warning-border);
}

.zimam-case-health--off-track[b-0ta4s9wi8d] {
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border-color: var(--color-error-border);
}

.zimam-case-health--hold[b-0ta4s9wi8d],
.zimam-case-health--default[b-0ta4s9wi8d] {
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
    border-color: var(--color-border);
}

.zimam-case-progress[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    gap: var(--form-field-gap);
}

.zimam-case-progress__summary[b-0ta4s9wi8d] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    overflow: hidden;
}

.zimam-case-progress__item[b-0ta4s9wi8d] {
    display: flex;
    flex-direction: column;
    gap: var(--radius-xs);
    padding: var(--text-md);
    border-inline-end: 1px solid var(--color-border);
}

.zimam-case-progress__item:last-child[b-0ta4s9wi8d] {
    border-inline-end: none;
}

.zimam-case-progress__item span[b-0ta4s9wi8d] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: var(--lh-tight);
}

.zimam-case-progress__item strong[b-0ta4s9wi8d] {
    color: var(--color-text-strong);
    font-size: var(--text-xl);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
    font-variant-numeric: tabular-nums;
}

.zimam-case-progress__meta[b-0ta4s9wi8d] {
    display: flex;
    justify-content: space-between;
    gap: var(--form-field-gap);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-case-progress__track[b-0ta4s9wi8d] {
    block-size: var(--radius-sm);
    background: var(--color-border-light);
    border-radius: var(--radius-pill);
    overflow: hidden;
}

.zimam-case-progress__fill[b-0ta4s9wi8d] {
    block-size: 100%;
    inline-size: var(--case-progress-value, 0%);
    background: var(--color-text-strong);
    border-radius: var(--radius-pill);
    transition: inline-size var(--duration-slow) var(--ease-out);
}

.zimam-case-view__description[b-0ta4s9wi8d] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-normal);
    line-height: var(--lh-relaxed);
}

@media (max-width: 640px) {
    .zimam-case-overview-card__header[b-0ta4s9wi8d] {
        align-items: stretch;
        flex-direction: column;
    }

    .zimam-case-progress__summary[b-0ta4s9wi8d] {
        grid-template-columns: 1fr;
    }

    .zimam-case-progress__item[b-0ta4s9wi8d] {
        border-inline-end: none;
        border-block-end: 1px solid var(--color-border);
    }

    .zimam-case-progress__item:last-child[b-0ta4s9wi8d] {
        border-block-end: none;
    }
}
/* /Modules/Employees/Pages/EmployeeManagement/EmployeeManagement.razor.rz.scp.css */
/* ==========================================================================
   EmployeeManagement — Page layout, header, stats, tabs, table, cards
   Scoped to EmployeeManagement.razor via Blazor CSS isolation.
   Mirrors CaseManagement design language.
   ========================================================================== */

/* ── Page shell ── */
.zimam-employee-management[b-zqt3cjvgqp] {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.zimam-employee-management__content[b-zqt3cjvgqp] {
    padding-inline: 0px;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 1.5rem;
}

.zimam-employee-management__results[b-zqt3cjvgqp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-top: 0.5rem;
    padding-inline: 0.75rem;
    padding-bottom: 0.75rem;
}

/* ── Collapsible controls ── */
.zimam-employee-management__controls-wrap[b-zqt3cjvgqp] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
    opacity: 1;
    margin-bottom: 0.25rem;
}

.zimam-employee-management__controls-inner[b-zqt3cjvgqp] {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-employee-management__results--controls-collapsed .zimam-employee-management__controls-wrap[b-zqt3cjvgqp] {
    grid-template-rows: 0fr;
    opacity: 0;
    margin-bottom: 0;
}

/* ── Table well ── */
.zimam-employee-management__table-well[b-zqt3cjvgqp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 24rem;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    contain: layout style;
    font-size: 12px;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table-wrap {
    flex: 1;
    overflow-y: auto;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-case-table-shell {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-case-table-head-wrap {
    flex-shrink: 0;
    overflow: hidden;
    border-bottom: 1px solid var(--color-border);
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-case-table-body-wrap {
    min-height: 0;
    overflow-y: auto;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table--head,
.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table--body {
    table-layout: fixed;
    min-width: 100%;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table--head thead th {
    position: static;
    box-shadow: none;
    border-bottom: 0;
}

/* ── Table typography: 38px row height ── */
.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table thead th,
.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table tbody td {
    font-size: 12px;
    padding-block: 0.625rem;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table thead th {
    font-size: 11px;
    font-weight: 700;
    height: 35px;
    padding-block: 8px;
    padding-inline: 12px;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-table tbody td {
    height: 35px;
    padding: 8px;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-pill {
    font-size: 11px;
    padding-inline: 2em;
    padding-block: 0.2em;
    line-height: 1.25;
    border-radius: 999em;
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  .zimam-data-state {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: inherit;
}

/* ── Clickable rows ── */
.zimam-employee-management__table-well[b-zqt3cjvgqp]  [data-emp-row] {
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  [data-emp-row]:hover {
    background: var(--color-surface-hover, #f8fafc);
}

.zimam-employee-management__table-well[b-zqt3cjvgqp]  [data-emp-row]:focus-visible {
    outline: var(--focus-ring);
    outline-offset: -2px;
}

/* ── Employee name cell ── */
.zimam-emp-name-cell[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.zimam-emp-avatar[b-zqt3cjvgqp] {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--color-bg-subtle, #f1f5f9);
    border: 1px solid var(--color-border);
    object-fit: cover;
    flex-shrink: 0;
}

.zimam-emp-avatar--lg[b-zqt3cjvgqp] {
    width: 3rem;
    height: 3rem;
}

.zimam-emp-name-cell__text[b-zqt3cjvgqp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.zimam-emp-name-cell__name[b-zqt3cjvgqp] {
    font-weight: 600;
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-emp-name-cell__email[b-zqt3cjvgqp] {
    font-size: 0.6875rem;
    color: var(--color-text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Module Header (shared pattern with Cases) ── */
.zimam-module-header[b-zqt3cjvgqp] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 0.75rem;
    position: relative;
    gap: 1rem;
}

.zimam-module-header[b-zqt3cjvgqp]::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline: -24px;
    height: 1px;
    background: var(--color-border);
}

.zimam-module-header__text[b-zqt3cjvgqp] { flex: 1; }

.zimam-module-header__title[b-zqt3cjvgqp] {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-strong);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin: 0 0 1px 0;
}

.zimam-module-header__subtitle[b-zqt3cjvgqp] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin: 0;
    max-width: 38rem;
    line-height: 1.5;
}

.zimam-module-header__actions[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
}

.zimam-module-header__btn[b-zqt3cjvgqp] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.zimam-module-header__btn:hover[b-zqt3cjvgqp] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.zimam-module-header__btn:active[b-zqt3cjvgqp] {
    transform: translateY(0);
}

/* ── Stat overview ── */
.zimam-employee-overview[b-zqt3cjvgqp] {
    margin-bottom: 1rem;
    padding-inline: 0;
}

.zimam-stat-row[b-zqt3cjvgqp] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

@media (max-width: 768px) {
    .zimam-stat-row[b-zqt3cjvgqp] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.625rem;
    }
}

@media (max-width: 480px) {
    .zimam-stat-row[b-zqt3cjvgqp] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.zimam-stat-card[b-zqt3cjvgqp] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem 0.375rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    min-height: 5.75rem;
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-stat-card:not(.zimam-stat-card--loading)[b-zqt3cjvgqp] {
    animation: zimam-content-appear-b-zqt3cjvgqp 300ms ease-out backwards;
}
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(1)[b-zqt3cjvgqp] { animation-delay: 0ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(2)[b-zqt3cjvgqp] { animation-delay: 50ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(3)[b-zqt3cjvgqp] { animation-delay: 100ms; }

.zimam-stat-card:hover[b-zqt3cjvgqp] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-stat-card__icon[b-zqt3cjvgqp] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-faint);
}

.zimam-stat-card__icon--success[b-zqt3cjvgqp] { color: #059669; }
.zimam-stat-card__icon--muted[b-zqt3cjvgqp]   { color: var(--color-text-faint); }

.zimam-stat-card__body[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
    margin-bottom: 0.25rem;
    flex: 1;
}

.zimam-stat-card__info[b-zqt3cjvgqp] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__label[b-zqt3cjvgqp] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin-bottom: 0.0125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__value[b-zqt3cjvgqp] {
    font-size: 26px;
    font-weight: 700;
    color: #000;
    line-height: 0.9;
    margin-top: 2px;
}

.zimam-stat-card__divider[b-zqt3cjvgqp] {
    height: 1px;
    background: var(--color-border-light);
    margin-bottom: 0.25rem;
}

.zimam-stat-card__footer[b-zqt3cjvgqp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 0.875rem;
}

.zimam-stat-card__footer-meta[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__footer-text[b-zqt3cjvgqp] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Section group (cards container) ── */
.zimam-section-group[b-zqt3cjvgqp] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, 0.375rem);
    padding: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

/* ── Tabs ── */
.zimam-tabs[b-zqt3cjvgqp] {
    display: flex;
    gap: 0.875rem;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 0 0.75rem;
}

.zimam-tab[b-zqt3cjvgqp] {
    padding: 0.75rem 0.25rem;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-bottom: -1px;
}

.zimam-tab:hover[b-zqt3cjvgqp] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-tab--active[b-zqt3cjvgqp] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-tab--active:hover[b-zqt3cjvgqp] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.zimam-tab--toggle[b-zqt3cjvgqp] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint, #94a3b8);
    border-bottom: none;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-tab--toggle:hover[b-zqt3cjvgqp] {
    color: var(--color-text-secondary, #64748b);
    border-bottom-color: transparent;
}

.zimam-tab--toggle-icon[b-zqt3cjvgqp] {
    transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.zimam-tab--toggle-collapsed .zimam-tab--toggle-icon[b-zqt3cjvgqp] {
    transform: rotate(-180deg);
}

/* ── Toolbar ── */
.zimam-employee-management__results .zimam-table-toolbar[b-zqt3cjvgqp] {
    margin-top: 0;
    margin-bottom: 0;
    padding-block: 0.5rem 0.375rem;
    padding-inline: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zimam-employee-management__results--cards .zimam-table-toolbar[b-zqt3cjvgqp] {
    margin-top: 0.5rem;
}

.zimam-search-wrapper[b-zqt3cjvgqp] {
    width: 100%;
    max-width: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__total[b-zqt3cjvgqp] {
    font-size: 12px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.zimam-table-toolbar__total-count[b-zqt3cjvgqp] {
    font-weight: 600;
    color: var(--color-text-strong);
}

/* ── Column picker ── */
.zimam-column-picker[b-zqt3cjvgqp] {
    position: relative;
    flex-shrink: 0;
    margin-inline-start: auto;
    z-index: 30;
    isolation: isolate;
}

.zimam-column-picker__trigger[b-zqt3cjvgqp] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    padding: 0;
    background: var(--color-surface, #fff);
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.zimam-column-picker__trigger:hover[b-zqt3cjvgqp] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
    border-color: var(--color-border-hover, #cbd5e1);
}

.zimam-column-picker__trigger:focus-visible[b-zqt3cjvgqp] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-column-picker__backdrop[b-zqt3cjvgqp] {
    position: fixed;
    inset: 0;
    z-index: 99;
}

.zimam-column-picker__panel[b-zqt3cjvgqp] {
    position: absolute;
    top: calc(100% + 0.375rem);
    inset-inline-end: 0;
    z-index: 100;
    width: 14rem;
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10), 0 1px 4px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.zimam-column-picker__header[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text-strong, #0f172a);
}

.zimam-column-picker__count[b-zqt3cjvgqp] {
    font-weight: 400;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-column-picker__list[b-zqt3cjvgqp] {
    padding: 0.375rem 0;
    max-height: 18rem;
    overflow-y: auto;
}

.zimam-column-picker__item[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    font-size: 12px;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    transition: background 0.1s ease;
    user-select: none;
}

.zimam-column-picker__item:hover[b-zqt3cjvgqp] {
    background: var(--color-surface-hover, #f8fafc);
}

.zimam-column-picker__item input[type="checkbox"][b-zqt3cjvgqp] {
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.1875rem;
    border: 1.5px solid var(--color-border, #cbd5e1);
    accent-color: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
    cursor: pointer;
}

.zimam-column-picker__item-label[b-zqt3cjvgqp] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Tracker grid (card view) ── */
.zimam-tracker-grid[b-zqt3cjvgqp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.875rem;
    margin-bottom: 1.25rem;
    animation: zimam-content-appear-b-zqt3cjvgqp 300ms ease-out;
}

@media (max-width: 1280px) {
    .zimam-tracker-grid[b-zqt3cjvgqp] { grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr)); }
}

@media (max-width: 768px) {
    .zimam-tracker-grid[b-zqt3cjvgqp] { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
}

@media (max-width: 480px) {
    .zimam-tracker-grid[b-zqt3cjvgqp] { grid-template-columns: 1fr; }
}

.zimam-tracker-card[b-zqt3cjvgqp] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    padding: 0.625rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-tracker-card:hover[b-zqt3cjvgqp] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-tracker-card:focus-visible[b-zqt3cjvgqp] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-tracker-card__header[b-zqt3cjvgqp] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    align-items: center;
}

.zimam-tracker-card__avatar[b-zqt3cjvgqp] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-bg-subtle, #f1f5f9);
    border: 1px solid var(--color-border);
    object-fit: cover;
    flex-shrink: 0;
}

.zimam-tracker-card__number-label[b-zqt3cjvgqp] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__number[b-zqt3cjvgqp] {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__timeline[b-zqt3cjvgqp] {
    background: var(--color-bg);
    border-radius: var(--radius-lg);
    padding: 0.5rem 0.625rem;
    flex: 1;
    margin-bottom: 0.5rem;
}

.zimam-tracker-card__timeline-items[b-zqt3cjvgqp] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-tracker-card__timeline-item[b-zqt3cjvgqp] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.zimam-tracker-card__timeline-dot[b-zqt3cjvgqp] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.zimam-tracker-card__timeline-dot svg[b-zqt3cjvgqp] {
    width: 0.75rem;
    height: 0.75rem;
    color: var(--color-surface);
}

.zimam-tracker-card__timeline-detail[b-zqt3cjvgqp] { min-width: 0; }

.zimam-tracker-card__timeline-time[b-zqt3cjvgqp] {
    font-size: 0.625rem;
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__timeline-desc[b-zqt3cjvgqp] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: var(--lh-tight);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-tracker-card__btn[b-zqt3cjvgqp] {
    align-self: flex-start;
    margin-top: auto;
    min-height: 1.875rem;
    padding-inline: 0.75rem;
    font-size: var(--text-xs);
}

.zimam-tracker-card--loading[b-zqt3cjvgqp] {
    pointer-events: none;
}

/* ── Tracker empty state ── */
.zimam-tracker-empty[b-zqt3cjvgqp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 0.75rem;
    color: var(--color-text-faint);
}

.zimam-tracker-empty__icon[b-zqt3cjvgqp] { opacity: 0.4; }

.zimam-tracker-empty__text[b-zqt3cjvgqp] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Loading skeleton ── */
.zimam-stat-skeleton[b-zqt3cjvgqp] {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-zqt3cjvgqp 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes zimam-shimmer-b-zqt3cjvgqp {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

@keyframes zimam-content-appear-b-zqt3cjvgqp {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Infinite scroll sentinel ── */
.zimam-scroll-sentinel[b-zqt3cjvgqp] {
    height: 1px;
    width: 100%;
}

.zimam-table-loader[b-zqt3cjvgqp] {
    width: 100%;
    height: 3px;
    background: var(--color-border, #e2e8f0);
    overflow: hidden;
    flex-shrink: 0;
}

.zimam-table-loader__bar[b-zqt3cjvgqp] {
    width: 40%;
    height: 100%;
    background: var(--color-text-strong, #0f172a);
    border-radius: 2px;
    animation: zimam-loader-slide-b-zqt3cjvgqp 1s ease-in-out infinite;
}

@keyframes zimam-loader-slide-b-zqt3cjvgqp {
    0%   { transform: translateX(250%); }
    100% { transform: translateX(-100%); }
}

/* ── Employee detail in drawer ── */
.zimam-emp-detail[b-zqt3cjvgqp] {
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.zimam-emp-detail__header[b-zqt3cjvgqp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zimam-emp-detail__name[b-zqt3cjvgqp] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-strong);
    margin: 0;
}

.zimam-emp-detail__subtitle[b-zqt3cjvgqp] {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    margin: 0;
}

.zimam-emp-detail__fields[b-zqt3cjvgqp] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.zimam-emp-detail__row[b-zqt3cjvgqp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

.zimam-emp-detail__row:last-child[b-zqt3cjvgqp] {
    border-bottom: none;
}

.zimam-emp-detail__label[b-zqt3cjvgqp] {
    font-size: 0.8125rem;
    color: var(--color-text-muted);
}

.zimam-emp-detail__value[b-zqt3cjvgqp] {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-strong);
}

/* /Modules/Employees/SharedComponents/AddEmployeeDrawer/AddEmployeeDrawer.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   AddEmployeeDrawer — Vertical Accordion Stepper
   ─────────────────────────────────────────────────────────────
   Uses design tokens from 01-tokens.css.
   Vertical stepper: circle track + CSS Grid accordion.
   NOTE: ::deep is required for elements rendered by child
   components (InputText, EditForm, DateOnlyPicker, Icon, etc.)
   ═══════════════════════════════════════════════════════════════ */

/* ── Stepper Container ── */
.stepper-container[b-usrmxiyfxu] {
    position: relative;
    width: 100%;
    padding: 1rem 1.25rem;
    box-sizing: border-box;
    overflow: hidden;
}

/* ── Step Item ── */
.step-item[b-usrmxiyfxu] {
    position: relative;
    display: flex;
    align-items: flex-start;
    min-width: 0;
}

/* ── Connecting Line ── */
[b-usrmxiyfxu] .step-line {
    position: absolute;
    inset-inline-start: 15px;
    top: 2rem;
    bottom: -0.75rem;
    width: 1px;
    transition: background-color 0.3s ease;
}

[b-usrmxiyfxu] .step-line.completed {
    background-color: var(--color-text-strong, #0f172a);
}

[b-usrmxiyfxu] .step-line.active {
    background-color: var(--color-text-strong, #0f172a);
}

[b-usrmxiyfxu] .step-line.pending {
    background-color: var(--color-border, #e2e8f0);
}

/* ── Circle ── */
.step-circle[b-usrmxiyfxu] {
    position: relative;
    z-index: 10;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-pill, 9999px);
    margin-inline-end: 0.75rem;
    transition: all 0.3s ease;
    animation: popIn-b-usrmxiyfxu 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes popIn-b-usrmxiyfxu {
    0% { transform: scale(0.8); opacity: 0.5; }
    100% { transform: scale(1); opacity: 1; }
}

.step-circle.completed[b-usrmxiyfxu] {
    background-color: var(--color-text-strong, #0f172a);
    color: #fff;
    box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,0.05));
}

.step-circle.active[b-usrmxiyfxu] {
    background-color: var(--color-text-strong, #0f172a);
    color: #fff;
    font-weight: var(--fw-bold, 700);
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.1);
}

.step-circle.pending[b-usrmxiyfxu] {
    background-color: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    color: var(--color-text-muted, #64748b);
    font-weight: var(--fw-bold, 700);
}

[b-usrmxiyfxu] .step-circle-text {
    font-size: var(--text-sm, 0.75rem);
}

/* ── Content Wrapper ── */
.step-content-wrapper[b-usrmxiyfxu] {
    flex: 1;
    padding-bottom: 1.5rem;
    min-width: 0;
}

/* ── Trigger (clickable title + desc) ── */
.step-trigger[b-usrmxiyfxu] {
    text-align: start;
    width: 100%;
    background: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    margin-top: 0.125rem;
    padding: 0;
    font-family: inherit;
}

.step-trigger:focus-visible[b-usrmxiyfxu] {
    box-shadow: 0 0 0 2px var(--color-text-strong, #0f172a);
    border-radius: 4px;
}

[b-usrmxiyfxu] .step-title {
    font-size: 0.875rem;
    font-weight: var(--fw-bold, 700);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: color 0.3s ease;
    margin: 0;
}

[b-usrmxiyfxu] .step-title.active {
    color: var(--color-text-strong, #0f172a);
}

[b-usrmxiyfxu] .step-title.completed {
    color: var(--color-text-secondary, #475569);
}

[b-usrmxiyfxu] .step-title.pending {
    color: var(--color-text-muted, #64748b);
}

.step-item:hover[b-usrmxiyfxu]  .step-title.pending {
    color: var(--color-text-secondary, #475569);
}

[b-usrmxiyfxu] .step-desc {
    margin-top: 0.0625rem;
    font-size: var(--text-sm, 0.75rem);
    transition: color 0.3s ease;
}

[b-usrmxiyfxu] .step-desc.active,
[b-usrmxiyfxu] .step-desc.completed {
    color: var(--color-text-muted, #64748b);
}

[b-usrmxiyfxu] .step-desc.pending {
    color: var(--color-text-faint, #94a3b8);
}

.step-item:hover[b-usrmxiyfxu]  .step-desc.pending {
    color: var(--color-text-muted, #64748b);
}

/* ── Accordion Form Area (CSS Grid) ── */
.step-form-area[b-usrmxiyfxu] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    margin-top: 0;
    transition:
        grid-template-rows 0.4s cubic-bezier(0.16, 1, 0.3, 1),
        opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
        margin-top 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.step-form-area.open[b-usrmxiyfxu] {
    grid-template-rows: 1fr;
    opacity: 1;
    margin-top: 0.75rem;
}

/*
 * Review step: break the form area out of step-content-wrapper so it spans
 * the full stepper width. The circle (2rem) + its gap (0.75rem) = 2.75rem
 * offset on the inline-start side. Extend into that space.
 */
.step-form-area--review[b-usrmxiyfxu] {
    margin-inline-start: calc(-2rem - 0.75rem);
    width: calc(100% + 2rem + 0.75rem);
}

.step-form-inner[b-usrmxiyfxu] {
    overflow: hidden;
}

/* ── Form Card ── */
.step-form-card[b-usrmxiyfxu] {
    background-color: #fafafa;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-lg, 0.75rem);
    padding: 1.25rem;
    box-shadow: none;
    font-size: var(--text-base, 0.8125rem);
}

/*
 * ::deep needed because EditForm renders <form>, InputText renders <input>,
 * and these child-rendered elements don't get the Blazor scope attribute.
 */
.step-form-card[b-usrmxiyfxu]  form {
    width: 100%;
    display: block;
}

.step-form-card[b-usrmxiyfxu]  * {
    box-sizing: border-box;
}

/* ── Inline Step Actions ── */
.step-form-actions[b-usrmxiyfxu] {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.25rem;
    border-top: 1px dashed var(--color-border, #e2e8f0);
    padding-top: 1.25rem;
}

.btn-form-secondary[b-usrmxiyfxu] {
    flex: 1;
    padding: 0.5rem 0.875rem;
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-muted, #64748b);
    background-color: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-md, 0.5rem);
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

.btn-form-secondary:hover:not(:disabled)[b-usrmxiyfxu] {
    background-color: var(--color-bg, #f1f5f9);
    color: var(--color-text-strong, #0f172a);
}

.btn-form-secondary:disabled[b-usrmxiyfxu] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-form-primary[b-usrmxiyfxu] {
    flex: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.5rem 0.875rem;
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.75rem);
    color: #fff;
    background-color: var(--color-text-strong, #0f172a);
    border: 1px solid transparent;
    border-radius: var(--radius-md, 0.5rem);
    cursor: pointer;
    box-shadow: var(--shadow-md, 0 4px 6px -1px rgba(0,0,0,0.1));
    transition: all 0.2s ease;
    font-family: inherit;
}

.btn-form-primary:hover:not(:disabled)[b-usrmxiyfxu] {
    background-color: #1e293b;
}

.btn-form-primary:disabled[b-usrmxiyfxu] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-form-primary:active:not(:disabled)[b-usrmxiyfxu] {
    transform: scale(0.97);
}

/* ── Form Elements (::deep for child-rendered inputs) ── */
.step-form-card[b-usrmxiyfxu]  .form-group {
    margin-bottom: 1rem;
    text-align: start;
    width: 100%;
    min-width: 0;
}

.step-form-card[b-usrmxiyfxu]  .form-label {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary, #475569);
    margin-bottom: 0.375rem;
}

.step-form-card[b-usrmxiyfxu]  .form-input,
.step-form-card[b-usrmxiyfxu]  .form-select {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: var(--text-base, 0.8125rem);
    line-height: 1.5;
    color: var(--color-text-strong, #0f172a);
    background-color: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-lg, 0.75rem);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
    font-family: inherit;
    box-shadow: none;
    box-sizing: border-box;
    display: block;
}

.step-form-card[b-usrmxiyfxu]  .form-select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%239ca3af'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 0.75rem center;
    background-size: 1rem;
    padding-inline-start: 2.5rem;
}

.step-form-card[b-usrmxiyfxu]  .form-input:focus,
.step-form-card[b-usrmxiyfxu]  .form-select:focus {
    border-color: var(--color-text-strong, #0f172a);
    box-shadow: 0 0 0 1px var(--color-text-strong, #0f172a);
}

.step-form-card[b-usrmxiyfxu]  .form-input::placeholder {
    color: var(--color-text-faint, #94a3b8);
}

.step-form-card[b-usrmxiyfxu]  .form-row {
    display: flex;
    gap: 0.75rem;
    width: 100%;
}

.step-form-card[b-usrmxiyfxu]  .form-row > * {
    flex: 1;
    min-width: 0;
}

.step-form-card[b-usrmxiyfxu]  .form-divider {
    border: 0;
    border-top: 1px dashed var(--color-border, #e2e8f0);
    margin: 1rem 0;
}

.step-form-card[b-usrmxiyfxu]  .form-section-label {
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary, #475569);
    margin-bottom: 0.75rem;
    padding-bottom: 0.375rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

/* ── Required marker ── */
.step-form-card[b-usrmxiyfxu]  .emp-required {
    color: var(--color-error-text, #dc2626);
    font-weight: var(--fw-bold, 700);
    margin-inline-start: 0.125rem;
}

/* ── Hint text ── */
.step-form-card[b-usrmxiyfxu]  .emp-hint {
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-faint, #94a3b8);
    margin-block-start: 0.25rem;
    line-height: var(--lh-normal, 1.5);
}

/* ── Validation error ── */
.step-form-card[b-usrmxiyfxu]  .zimam-form-field-error {
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-error-text, #dc2626);
    margin-block-start: 0.25rem;
}

/* ── DateOnlyPicker inside form card ── */
.step-form-card[b-usrmxiyfxu]  .date-picker-wrapper,
.step-form-card[b-usrmxiyfxu]  .zimam-datepicker-field,
.step-form-card[b-usrmxiyfxu]  .zimam-datepicker-input {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

/* ── Centered review layout (last step — full width, no max constraint) ── */
.step-form-card.step-form-card--review[b-usrmxiyfxu] {
    width: 100%;
}

/* ── Review Sections (step 4) ── */
.step-form-card[b-usrmxiyfxu]  .review-sections {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
}

/* ── Review sections fill full width of card ── */
.step-form-card[b-usrmxiyfxu]  .emp-review-section {
    border-radius: var(--radius-md, 0.5rem);
    border: 1px solid var(--color-border, #e2e8f0);
    overflow: hidden;
    width: 100%;
}

.step-form-card[b-usrmxiyfxu]  .emp-review-section__header {
    padding: 0.375rem 0.75rem;
    background: var(--color-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary, #475569);
}

.step-form-card[b-usrmxiyfxu]  .emp-review-section__body {
    background: var(--color-surface, #fff);
}

.step-form-card[b-usrmxiyfxu]  .emp-review-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.375rem 0.75rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    gap: 0.75rem;
}

.step-form-card[b-usrmxiyfxu]  .emp-review-row:last-child {
    border-bottom: none;
}

.step-form-card[b-usrmxiyfxu]  .emp-review-row__label {
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-muted, #64748b);
    flex-shrink: 0;
}

.step-form-card[b-usrmxiyfxu]  .emp-review-row__value {
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong, #0f172a);
    text-align: start;
    word-break: break-word;
}



/* /Modules/Messaging/Components/ConversationList.razor.rz.scp.css */
/* ── Conversation List ── */

.zimam-conv-list[b-h9u8hmi924] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* ── Header ── */

.zimam-conv-list__header[b-h9u8hmi924] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-block-end: 1px solid var(--color-border);
}

.zimam-conv-list__title[b-h9u8hmi924] {
    font-size: var(--text-lg);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
}

.zimam-conv-list__new-btn[b-h9u8hmi924] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-conv-list__new-btn:hover[b-h9u8hmi924] {
    background: var(--color-primary-700);
}

.zimam-conv-list__new-btn:focus-visible[b-h9u8hmi924] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Search ── */

.zimam-conv-list__search[b-h9u8hmi924] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.75rem 1rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    transition: border-color var(--duration-fast) var(--ease-default);
}

.zimam-conv-list__search:focus-within[b-h9u8hmi924] {
    border-color: var(--color-text-strong);
}

.zimam-conv-list__search-input[b-h9u8hmi924] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--text-sm);
    color: var(--color-text);
    outline: none;
    font-family: inherit;
}

.zimam-conv-list__search-input[b-h9u8hmi924]::placeholder {
    color: var(--color-text-muted);
}

/* ── Items Container ── */

.zimam-conv-list__items[b-h9u8hmi924] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

/* ── Single Conversation Item ── */

.zimam-conv-item[b-h9u8hmi924] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
    padding: 0.875rem 1.25rem;
    border: none;
    background: transparent;
    text-align: start;
    cursor: pointer;
    font-family: inherit;
    transition: background var(--duration-fast) var(--ease-default);
    position: relative;
}

.zimam-conv-item:hover[b-h9u8hmi924] {
    background: var(--color-surface-hover);
}

.zimam-conv-item--active[b-h9u8hmi924] {
    background: var(--color-surface);
    border-inline-start: 3px solid var(--color-primary);
}

.zimam-conv-item:focus-visible[b-h9u8hmi924] {
    outline: var(--focus-ring);
    outline-offset: -2px;
}

/* ── Avatar ── */

.zimam-conv-item__avatar[b-h9u8hmi924] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

/* ── Body ── */

.zimam-conv-item__body[b-h9u8hmi924] {
    flex: 1;
    min-width: 0;
}

.zimam-conv-item__top-row[b-h9u8hmi924] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.zimam-conv-item__name[b-h9u8hmi924] {
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-conv-item__time[b-h9u8hmi924] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    white-space: nowrap;
    flex-shrink: 0;
}

.zimam-conv-item__preview[b-h9u8hmi924] {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    margin: 0.25rem 0 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Unread Badge ── */

.zimam-conv-item__badge[b-h9u8hmi924] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.375rem;
    border-radius: var(--radius-pill);
    background: var(--color-primary);
    color: #fff;
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    align-self: center;
}

/* ── Empty State ── */

.zimam-conv-list__empty[b-h9u8hmi924] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}
/* /Modules/Messaging/Components/MessageInput.razor.rz.scp.css */
/* ── Message Input ── */

.zimam-msg-input[b-zpecz84ejn] {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-block-start: 1px solid var(--color-border);
    background: var(--color-surface);
}

.zimam-msg-input__field[b-zpecz84ejn] {
    flex: 1;
    min-width: 0;
}

.zimam-msg-input__textarea[b-zpecz84ejn] {
    width: 100%;
    min-height: 2.375rem;
    max-height: 120px;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--text-md);
    line-height: var(--lh-normal);
    resize: none;
    overflow-y: auto;
    transition: border-color var(--duration-fast) var(--ease-default);
}

.zimam-msg-input__textarea:focus[b-zpecz84ejn] {
    outline: none;
    border-color: var(--color-text-strong);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

.zimam-msg-input__textarea[b-zpecz84ejn]::placeholder {
    color: var(--color-text-muted);
}

.zimam-msg-input__textarea:disabled[b-zpecz84ejn] {
    background: var(--color-bg);
    cursor: not-allowed;
    opacity: 0.6;
}

/* ── Send Button ── */

.zimam-msg-input__send-btn[b-zpecz84ejn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.375rem;
    height: 2.375rem;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-primary);
    color: #fff;
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                transform var(--duration-fast) var(--ease-default);
}

.zimam-msg-input__send-btn:hover:not(:disabled)[b-zpecz84ejn] {
    background: var(--color-primary-700);
}

.zimam-msg-input__send-btn:active:not(:disabled)[b-zpecz84ejn] {
    transform: scale(0.98);
}

.zimam-msg-input__send-btn:disabled[b-zpecz84ejn] {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-msg-input__send-btn:focus-visible[b-zpecz84ejn] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Spinner ── */

.zimam-msg-input__spinner[b-zpecz84ejn] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    border-radius: var(--radius-pill);
    animation: zimam-spin-b-zpecz84ejn 0.6s linear infinite;
}

@keyframes zimam-spin-b-zpecz84ejn {
    to { transform: rotate(360deg); }
}
/* /Modules/Messaging/Components/MessageThread.razor.rz.scp.css */
/* ── Message Thread ── */

.zimam-thread[b-qlnxp5asg1] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* ── Thread Header ── */

.zimam-thread__header[b-qlnxp5asg1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1.5rem;
    border-block-end: 1px solid var(--color-border);
    background: var(--color-surface);
}

.zimam-thread__header-avatar[b-qlnxp5asg1] {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

.zimam-thread__header-info[b-qlnxp5asg1] {
    min-width: 0;
}

.zimam-thread__header-name[b-qlnxp5asg1] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-thread__header-participants[b-qlnxp5asg1] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

/* ── Messages Container ── */

.zimam-thread__messages[b-qlnxp5asg1] {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
}

/* ── Date Separator ── */

.zimam-thread__date-sep[b-qlnxp5asg1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-block: 1rem;
}

.zimam-thread__date-sep[b-qlnxp5asg1]::before,
.zimam-thread__date-sep[b-qlnxp5asg1]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--color-border-light);
}

.zimam-thread__date-sep span[b-qlnxp5asg1] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    white-space: nowrap;
}

/* ── Message Bubble ── */

.zimam-msg[b-qlnxp5asg1] {
    display: flex;
    gap: 0.5rem;
    max-width: 75%;
}

.zimam-msg--mine[b-qlnxp5asg1] {
    align-self: flex-start;  /* RTL: start = right */
    flex-direction: row-reverse;
}

.zimam-msg--other[b-qlnxp5asg1] {
    align-self: flex-end;    /* RTL: end = left */
}

.zimam-msg__avatar[b-qlnxp5asg1] {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
    align-self: flex-end;
}

.zimam-msg__bubble[b-qlnxp5asg1] {
    padding: 0.625rem 1rem;
    border-radius: var(--radius-lg);
    max-width: 100%;
    word-break: break-word;
}

.zimam-msg--mine .zimam-msg__bubble[b-qlnxp5asg1] {
    background: var(--color-primary);
    color: #fff;
    border-end-start-radius: var(--radius-xs);
}

.zimam-msg--other .zimam-msg__bubble[b-qlnxp5asg1] {
    background: var(--color-bg);
    color: var(--color-text);
    border-end-end-radius: var(--radius-xs);
}

.zimam-msg__sender[b-qlnxp5asg1] {
    display: block;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
    margin-block-end: 0.25rem;
}

.zimam-msg--other .zimam-msg__sender[b-qlnxp5asg1] {
    color: var(--color-primary);
}

.zimam-msg__text[b-qlnxp5asg1] {
    margin: 0;
    font-size: var(--text-md);
    line-height: var(--lh-normal);
    white-space: pre-wrap;
}

.zimam-msg__time[b-qlnxp5asg1] {
    display: block;
    font-size: var(--text-2xs);
    margin-block-start: 0.25rem;
    text-align: end;
    opacity: 0.7;
}

.zimam-msg--mine .zimam-msg__time[b-qlnxp5asg1] {
    color: rgba(255, 255, 255, 0.7);
}

.zimam-msg--other .zimam-msg__time[b-qlnxp5asg1] {
    color: var(--color-text-muted);
}

/* ── Loading & Empty ── */

.zimam-thread__loading[b-qlnxp5asg1],
.zimam-thread__empty[b-qlnxp5asg1] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.zimam-thread__empty p[b-qlnxp5asg1] {
    margin: 0;
}
/* /Modules/Messaging/Components/NewConversationPanel.razor.rz.scp.css */
/* ── New Conversation Panel (Overlay) ── */

.zimam-new-conv-overlay[b-4q2ra3b2s3] {
    position: absolute;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
}

.zimam-new-conv__scrim[b-4q2ra3b2s3] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.3);
}

.zimam-new-conv[b-4q2ra3b2s3] {
    position: relative;
    z-index: 1;
    width: min(420px, 90%);
    max-height: 70vh;
    background: var(--color-surface);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-floating);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ── Header ── */

.zimam-new-conv__header[b-4q2ra3b2s3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-block-end: 1px solid var(--color-border);
}

.zimam-new-conv__header h3[b-4q2ra3b2s3] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
}

.zimam-new-conv__close[b-4q2ra3b2s3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-new-conv__close:hover[b-4q2ra3b2s3] {
    background: var(--color-bg);
}

/* ── Search ── */

.zimam-new-conv__search[b-4q2ra3b2s3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.75rem 1rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    transition: border-color var(--duration-fast) var(--ease-default);
}

.zimam-new-conv__search:focus-within[b-4q2ra3b2s3] {
    border-color: var(--color-text-strong);
}

.zimam-new-conv__search-input[b-4q2ra3b2s3] {
    flex: 1;
    border: none;
    background: transparent;
    font-size: var(--text-sm);
    color: var(--color-text);
    outline: none;
    font-family: inherit;
}

.zimam-new-conv__search-input[b-4q2ra3b2s3]::placeholder {
    color: var(--color-text-muted);
}

/* ── Employee List ── */

.zimam-new-conv__list[b-4q2ra3b2s3] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    max-height: 360px;
}

.zimam-new-conv__employee[b-4q2ra3b2s3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 1.25rem;
    border: none;
    background: transparent;
    text-align: start;
    cursor: pointer;
    font-family: inherit;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-new-conv__employee:hover:not(:disabled)[b-4q2ra3b2s3] {
    background: var(--color-surface-hover);
}

.zimam-new-conv__employee:disabled[b-4q2ra3b2s3] {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-new-conv__employee:focus-visible[b-4q2ra3b2s3] {
    outline: var(--focus-ring);
    outline-offset: -2px;
}

/* ── Employee Avatar ── */

.zimam-new-conv__emp-avatar[b-4q2ra3b2s3] {
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

.zimam-new-conv__emp-info[b-4q2ra3b2s3] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.zimam-new-conv__emp-name[b-4q2ra3b2s3] {
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
}

.zimam-new-conv__emp-title[b-4q2ra3b2s3] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

/* ── Loading / Empty ── */

.zimam-new-conv__loading[b-4q2ra3b2s3],
.zimam-new-conv__empty[b-4q2ra3b2s3] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}
/* /Modules/Messaging/Pages/MessagingPage/MessagingPage.razor.rz.scp.css */
/* ── Two-Panel Messaging Layout ── */

.zimam-messaging[b-oi408ge6nm] {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 0;
    height: calc(100vh - var(--zimam-header-height) - var(--space-page-y) * 2);
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-floating);
    overflow: hidden;
    position: relative;
}

/* ── Thread Panel (left in RTL — first grid column) ── */

.zimam-messaging__thread-panel[b-oi408ge6nm] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-inline-end: 1px solid var(--color-border);
}

/* ── List Panel (right in RTL — second grid column) ── */

.zimam-messaging__list-panel[b-oi408ge6nm] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--color-bg-subtle);
}

/* ── Empty State ── */

.zimam-messaging__empty-thread[b-oi408ge6nm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 0.75rem;
    color: var(--color-text-muted);
    padding: var(--space-card);
    text-align: center;
}

.zimam-messaging__empty-thread h2[b-oi408ge6nm] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-secondary);
    margin: 0;
}

.zimam-messaging__empty-thread p[b-oi408ge6nm] {
    font-size: var(--text-md);
    margin: 0;
}

/* ── Loading State ── */

.zimam-messaging__loading[b-oi408ge6nm] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--color-text-muted);
}

/* ── Responsive: stack on mobile ── */

@media (max-width: 767px) {
    .zimam-messaging[b-oi408ge6nm] {
        grid-template-columns: 1fr;
        height: calc(100vh - var(--zimam-header-height));
    }

    .zimam-messaging__thread-panel[b-oi408ge6nm] {
        border-inline-end: none;
    }

    .zimam-messaging__list-panel[b-oi408ge6nm] {
        display: none;
    }
}
/* /Modules/Profile/Pages/Profile/UserProfile.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   UserProfile — Two-Column Layout with Employee Card + Tabs
   Left sidebar: employee summary card (sticky)
   Right content: tab navigation + data sections
   ═══════════════════════════════════════════════════════════════ */

/* ── Loading / Empty States ── */
.prof-loading[b-pb0o5i8yg5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm, 0.75rem);
}

.prof-loading[b-pb0o5i8yg5]  svg {
    color: var(--color-border);
}

/* ── Alert Banners ── */
.prof-alert[b-pb0o5i8yg5] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-lg, 0.75rem);
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    animation: prof-alert-in-b-pb0o5i8yg5 0.25s ease-out;
    margin-bottom: 1rem;
}

@keyframes prof-alert-in-b-pb0o5i8yg5 {
    from { opacity: 0; transform: translateY(-0.5rem); }
    to   { opacity: 1; transform: translateY(0); }
}

.prof-alert--success[b-pb0o5i8yg5] {
    background: var(--color-success-bg, #ecfdf5);
    color: var(--color-success-text, #065f46);
    border: 1px solid var(--color-success-border, #a7f3d0);
}

.prof-alert--error[b-pb0o5i8yg5] {
    background: var(--color-error-bg, rgba(239, 68, 68, 0.12));
    color: var(--color-error-text, #dc2626);
    border: 1px solid var(--color-error-border, #fca5a5);
}

.prof-alert__dismiss[b-pb0o5i8yg5] {
    margin-inline-start: auto;
    background: none;
    border: none;
    color: inherit;
    opacity: 0.6;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: var(--radius-sm, 0.375rem);
    display: flex;
    align-items: center;
}

.prof-alert__dismiss:hover[b-pb0o5i8yg5] {
    opacity: 1;
}

/* ═══════════════════════════════════════════════
   TWO-COLUMN LAYOUT (mirrors CaseManagement content-layout)
   ═══════════════════════════════════════════════ */
.prof-layout[b-pb0o5i8yg5] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    min-height: 0;
}

/* ── Sidebar (Employee Card) ── */
.prof-sidebar[b-pb0o5i8yg5] {
    width: 280px;
    flex-shrink: 0;
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 7rem);
}

.prof-employee-card[b-pb0o5i8yg5] {
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-card, 1.25rem);
    padding: 1.75rem 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    text-align: center;
}

.prof-employee-card__avatar[b-pb0o5i8yg5] {
    width: 4.5rem;
    height: 4.5rem;
    border-radius: 50%;
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
    margin-bottom: 0.25rem;
    flex-shrink: 0;
}

.prof-employee-card__name[b-pb0o5i8yg5] {
    font-size: var(--text-lg, 0.9375rem);
    font-weight: var(--fw-bold, 700);
    color: var(--color-text-strong, #0f172a);
    margin: 0;
    line-height: var(--lh-tight, 1.3);
}

.prof-employee-card__title[b-pb0o5i8yg5] {
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-muted, #64748b);
    margin: 0;
    font-weight: var(--fw-medium, 500);
}

.prof-employee-card__status[b-pb0o5i8yg5] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.75rem;
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-semibold, 600);
    border-radius: var(--radius-pill, 9999px);
    margin-top: 0.125rem;
}

.prof-employee-card__status--active[b-pb0o5i8yg5],
.prof-employee-card__status--نشط[b-pb0o5i8yg5] {
    background: var(--color-success-bg, #ecfdf5);
    color: var(--color-success-text, #065f46);
    border: 1px solid var(--color-success-border, #a7f3d0);
}

.prof-employee-card__status--inactive[b-pb0o5i8yg5],
.prof-employee-card__status--غير[b-pb0o5i8yg5] {
    background: var(--color-error-bg, rgba(239, 68, 68, 0.12));
    color: var(--color-error-text, #dc2626);
    border: 1px solid var(--color-error-border, #fca5a5);
}

.prof-employee-card__details[b-pb0o5i8yg5] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    width: 100%;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-border-light, #f1f5f9);
}

.prof-employee-card__detail[b-pb0o5i8yg5] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    font-size: var(--text-xs, 0.6875rem);
    text-align: start;
}

.prof-employee-card__detail-label[b-pb0o5i8yg5] {
    font-size: 0.625rem;
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-muted, #94a3b8);
    text-transform: none;
    letter-spacing: 0.02em;
}

.prof-employee-card__detail-value[b-pb0o5i8yg5] {
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary, #64748b);
    word-break: break-word;
}

.prof-employee-card__detail[b-pb0o5i8yg5]  svg {
    flex-shrink: 0;
    color: var(--color-text-muted, #94a3b8);
}

.prof-employee-card__detail--mono[b-pb0o5i8yg5] {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

/* ── Content Area (Tabs + Data) ── */
.prof-content[b-pb0o5i8yg5] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}

/* ── Tabs (mirrors CaseManagement tab language) ── */
.zimam-tabs[b-pb0o5i8yg5] {
    display: flex;
    gap: 1.25rem;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 0 0.5rem;
}

.zimam-tab[b-pb0o5i8yg5] {
    padding: 0.75rem 0.25rem;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-bottom: -1px;
    font-family: inherit;
}

.zimam-tab:hover[b-pb0o5i8yg5] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-tab--active[b-pb0o5i8yg5] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-tab--active:hover[b-pb0o5i8yg5] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.prof-tab-panel[b-pb0o5i8yg5] {
    margin-top: 1rem;
    animation: prof-tab-in-b-pb0o5i8yg5 0.2s ease-out;
}

@keyframes prof-tab-in-b-pb0o5i8yg5 {
    from { opacity: 0; transform: translateY(0.25rem); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Section within Tab ── */
.prof-section[b-pb0o5i8yg5] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.prof-section__title[b-pb0o5i8yg5] {
    font-size: var(--text-lg, 0.9375rem);
    font-weight: var(--fw-bold, 700);
    color: var(--color-text-strong, #0f172a);
    margin: 0;
    line-height: var(--lh-tight, 1.3);
}

.prof-section__header-row[b-pb0o5i8yg5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* ═══════════════════════════════════════════════
   CARD
   ═══════════════════════════════════════════════ */
.prof-card[b-pb0o5i8yg5] {
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-card, 1.25rem);
    overflow: hidden;
}

.prof-card__header[b-pb0o5i8yg5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
}

.prof-card__subtitle[b-pb0o5i8yg5] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong, #0f172a);
    margin: 0;
}

/* ── Edit Button ── */
.prof-edit-btn[b-pb0o5i8yg5] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.875rem;
    font-family: inherit;
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong, #0f172a);
    background: transparent;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-md, 0.5rem);
    cursor: pointer;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
    white-space: nowrap;
}

.prof-edit-btn:hover[b-pb0o5i8yg5] {
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.prof-edit-btn[b-pb0o5i8yg5]  svg {
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════
   KEY/VALUE GRID
   ═══════════════════════════════════════════════ */
.prof-grid[b-pb0o5i8yg5] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
}

.prof-grid__item[b-pb0o5i8yg5] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

.prof-grid__item:nth-last-child(-n+2)[b-pb0o5i8yg5] {
    border-bottom: none;
}

.prof-grid__item:nth-child(odd)[b-pb0o5i8yg5] {
    border-inline-end: 1px solid var(--color-border-light, #f1f5f9);
}

.prof-grid__label[b-pb0o5i8yg5] {
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-muted, #64748b);
    letter-spacing: 0.01em;
}

.prof-grid__value[b-pb0o5i8yg5] {
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong, #0f172a);
}

.prof-grid__value--mono[b-pb0o5i8yg5] {
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
}

/* ── Tag / Badge ── */
.prof-tag[b-pb0o5i8yg5] {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-medium, 500);
    border-radius: var(--radius-pill, 9999px);
    background: var(--color-surface-secondary, #f1f5f9);
    color: var(--color-text-strong, #0f172a);
    border: 1px solid var(--color-border, #e2e8f0);
}

/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */
@media (max-width: 1280px) {
    .prof-sidebar[b-pb0o5i8yg5] {
        width: 260px;
    }
}

@media (max-width: 1024px) {
    .prof-layout[b-pb0o5i8yg5] {
        flex-direction: column;
    }

    .prof-sidebar[b-pb0o5i8yg5] {
        width: 100%;
        position: static;
        max-height: none;
    }

    .prof-employee-card[b-pb0o5i8yg5] {
        flex-direction: row;
        flex-wrap: wrap;
        text-align: start;
        padding: 1.25rem;
        gap: 0.75rem;
    }

    .prof-employee-card__avatar[b-pb0o5i8yg5] {
        width: 3.5rem;
        height: 3.5rem;
        font-size: 1.125rem;
        margin-bottom: 0;
    }

    .prof-employee-card__details[b-pb0o5i8yg5] {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.5rem 1.25rem;
    }
}

@media (max-width: 768px) {
    .prof-grid[b-pb0o5i8yg5] {
        grid-template-columns: 1fr;
    }

    .prof-grid__item:nth-child(odd)[b-pb0o5i8yg5] {
        border-inline-end: none;
    }

    .prof-grid__item:last-child[b-pb0o5i8yg5] {
        border-bottom: none;
    }

    .prof-card__header[b-pb0o5i8yg5] {
        padding: 0.875rem 1.25rem;
    }

    .prof-grid__item[b-pb0o5i8yg5] {
        padding: 0.875rem 1.25rem;
    }
}
/* /Modules/Projects/Pages/ProjectManagement/ProjectManagement.razor.rz.scp.css */
/* ==========================================================================
   ProjectManagement — Page layout, header, stats, tracker, tabs
   Scoped to ProjectManagement.razor via Blazor CSS isolation
   ========================================================================== */

/* ── Page shell ── */
.zimam-project-management[b-toq2hh3cfn] {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.zimam-project-management__content[b-toq2hh3cfn] {
    padding-inline: 0px;
    flex: 1;
    display: flex;
    flex-direction: column;
    inline-size: 100%;
    min-height: 0;
    padding-bottom: 1.5rem;
}

.zimam-project-management__results[b-toq2hh3cfn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    inline-size: 100%;
    min-height: 0;
    padding-top: 0.5rem;
    padding-inline: 0.75rem;
    padding-bottom: 0.75rem;
}

.zimam-project-management__controls-wrap[b-toq2hh3cfn] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
    opacity: 1;
    margin-bottom: 0.25rem;
    position: relative;
    z-index: var(--z-sticky);
}

.zimam-project-management__controls-inner[b-toq2hh3cfn] {
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-project-management__results--controls-collapsed .zimam-project-management__controls-wrap[b-toq2hh3cfn] {
    grid-template-rows: 0fr;
    opacity: 0;
    margin-bottom: 0;
}

.zimam-project-management__results--controls-collapsed .zimam-project-management__controls-inner[b-toq2hh3cfn] {
    overflow: hidden;
}

.zimam-project-management__table-well[b-toq2hh3cfn] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 24rem;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    contain: layout style;
    font-size: 12px;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table-wrap {
    flex: 1;
    overflow-y: auto;
}

/* Real split layout: header is outside the scrollable body area. */
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-project-table-shell {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-project-table-head-wrap {
    flex-shrink: 0;
    overflow: hidden;
    border-bottom: 1px solid var(--color-border);
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-project-table-body-wrap {
    min-height: 0;
    overflow-y: auto;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table--head,
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table--body {
    table-layout: fixed;
    min-width: 100%;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table--head thead th {
    position: static;
    box-shadow: none;
    border-bottom: 0;
}

/* ── Table typography + row height: 38px ── */
/* font-size:12px × line-height:1.5 = 18px content → padding-block = (38-18)/2 = 10px */
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table thead th,
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table tbody td {
    font-size: 12px;
    padding-block: 0.625rem;  /* 10px × 2 + 18px ≈ 38px row height */
}

/* Keep loading/error/empty states the same height as the data table to prevent CLS */
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-data-state {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: inherit;
}

.zimam-project-overview[b-toq2hh3cfn] {
    margin-bottom: 1rem;
    padding-inline: 0;
}

/* ── Section group ── */
.zimam-section-group[b-toq2hh3cfn] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, 0.375rem);
    padding: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

/* ── Content layout: Results + Quick-Action Column ── */
.zimam-project-management__content-layout[b-toq2hh3cfn] {
    display: flex;
    gap: 1rem;
    flex: 1;
    inline-size: 100%;
    min-height: 0;
    align-items: stretch;
    contain: layout style;
}

.zimam-project-management__content-layout > .zimam-section-group[b-toq2hh3cfn] {
    flex: 1 1 auto;
    inline-size: 100%;
    min-inline-size: 0;
}

.zimam-project-management__quick-action-column[b-toq2hh3cfn] {
    inline-size: clamp(18rem, 20vw, 21rem);
    flex-shrink: 0;
    align-self: stretch;
    position: relative;
    top: auto;
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1280px) {
    .zimam-project-management__quick-action-column[b-toq2hh3cfn] {
        inline-size: 18rem;
    }
}

@media (max-width: 1024px) {
    .zimam-project-management__content-layout[b-toq2hh3cfn] {
        flex-direction: column;
    }

    .zimam-project-management__quick-action-column[b-toq2hh3cfn] {
        inline-size: 100%;
        position: static;
        min-height: 28rem;
    }
}

/* ── Module header ── */
.zimam-module-header[b-toq2hh3cfn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 0.75rem;
    position: relative;
    gap: 1rem;
}

/* Divider spanning main area width */
.zimam-module-header[b-toq2hh3cfn]::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline: -24px;
    height: 1px;
    background: var(--color-border);
}

.zimam-module-header__text[b-toq2hh3cfn] {
    flex: 1;
}

.zimam-module-header__title[b-toq2hh3cfn] {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-strong);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-top: 0px;
    margin-bottom: 1px;
}

.zimam-module-header__subtitle[b-toq2hh3cfn] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin-top: 0px;
    margin-bottom: 1px;
    max-width: 38rem;
    line-height: 1.5;
}

.zimam-module-header__actions[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
}

.zimam-module-header__btn[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.zimam-module-header__btn:hover[b-toq2hh3cfn] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.zimam-module-header__btn:active[b-toq2hh3cfn] {
    transform: translateY(0);
}

.zimam-module-header__btn--secondary[b-toq2hh3cfn] {
    background: #fff;
    color: var(--color-text-strong);
    border: 1px solid var(--color-border);
    position: relative;
    border-radius: 0.5rem;
}

.zimam-module-header__btn--secondary:hover[b-toq2hh3cfn] {
    background: var(--color-surface-hover);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.zimam-module-header__timeframe[b-toq2hh3cfn] {
    appearance: none;
    background: #fff;
    border: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 12px;
    font-weight: 500;
    border-radius: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem 2.25rem;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-module-header__timeframe:hover[b-toq2hh3cfn] {
    background: var(--color-surface-hover);
}

.zimam-module-header__timeframe:focus-visible[b-toq2hh3cfn] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-module-header__timeframe-wrap[b-toq2hh3cfn] {
    position: relative;
    display: inline-flex;
    align-items: center;
    contain: layout style;
    flex-shrink: 0;
}

.zimam-module-header__timeframe-chevron[b-toq2hh3cfn] {
    position: absolute;
    left: 0.75rem;
    top: 0;
    bottom: 0;
    margin-block: auto;
    display: block;
    pointer-events: none;
    color: var(--color-text-faint);
}

/* ── Active filter count badge ── */
.zimam-filter-count-badge[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Save View Dialog ── */
.zimam-dialog-overlay[b-toq2hh3cfn] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    animation: zimam-fade-in-b-toq2hh3cfn 150ms ease;
}

.zimam-dialog[b-toq2hh3cfn] {
    background: var(--color-surface, #fff);
    border-radius: 0.75rem;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
    width: min(24rem, 90vw);
    max-height: 80vh;
    overflow: auto;
}

.zimam-dialog__header[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
}

.zimam-dialog__title[b-toq2hh3cfn] {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
    color: var(--color-text-strong, #0f172a);
}

.zimam-dialog__close[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: none;
    border-radius: 0.375rem;
    background: transparent;
    color: var(--color-text-muted, #94a3b8);
    cursor: pointer;
}

.zimam-dialog__close:hover[b-toq2hh3cfn] {
    background: var(--color-surface-secondary, #f1f5f9);
    color: var(--color-text-strong, #0f172a);
}

.zimam-dialog__body[b-toq2hh3cfn] {
    padding: 1.25rem;
}

.zimam-dialog__error[b-toq2hh3cfn] {
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: var(--color-danger, #dc2626);
}

.zimam-dialog__footer[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-top: 1px solid var(--color-border, #e2e8f0);
}

@keyframes zimam-fade-in-b-toq2hh3cfn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ── Stat row & cards ── */
.zimam-stat-row[b-toq2hh3cfn] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

@media (max-width: 1400px) {
    .zimam-stat-row[b-toq2hh3cfn] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 1024px) {
    .zimam-stat-row[b-toq2hh3cfn] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .zimam-stat-row[b-toq2hh3cfn] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.625rem;
    }
}

@media (max-width: 480px) {
    .zimam-stat-row[b-toq2hh3cfn] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.zimam-stat-card[b-toq2hh3cfn] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem 0.375rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    min-height: 5.75rem; /* Minimum height to stabilize layout; content can grow if needed */
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

/* Stagger reveal: real stat cards fade in sequentially after skeleton */
.zimam-stat-card:not(.zimam-stat-card--loading)[b-toq2hh3cfn] {
    animation: zimam-content-appear 300ms ease-out backwards;
}
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(1)[b-toq2hh3cfn] { animation-delay:  0ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(2)[b-toq2hh3cfn] { animation-delay: 50ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(3)[b-toq2hh3cfn] { animation-delay: 100ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(4)[b-toq2hh3cfn] { animation-delay: 150ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(5)[b-toq2hh3cfn] { animation-delay: 200ms; }

.zimam-stat-card:hover[b-toq2hh3cfn] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-stat-card__icon[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-faint);
}

.zimam-stat-card__body[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
    margin-bottom: 0.25rem;
    flex: 1;
}

.zimam-stat-card__info[b-toq2hh3cfn] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__label[b-toq2hh3cfn] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin-bottom: 0.0125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__value[b-toq2hh3cfn] {
    font-size: 26px;
    font-weight: 700;
    color: #000;
    line-height: 0.9;
    margin-top: 2px;
}

.zimam-stat-card__trend-block[b-toq2hh3cfn] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
}

.zimam-stat-card__trend-badge[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1875rem 0.375rem;
    border-radius: 99px;
    font-size: var(--text-xs);
    font-weight: 600;
    white-space: nowrap;
}

.zimam-stat-card__trend-badge--up[b-toq2hh3cfn] {
    background: #d1fae5;
    color: #059669;
}

.zimam-stat-card__trend-badge--down[b-toq2hh3cfn] {
    background: #fee2e2;
    color: #dc2626;
}

.zimam-stat-card__trend-badge--neutral[b-toq2hh3cfn] {
    background: #f1f5f9;
    color: #475569;
}

.zimam-stat-card__timeframe[b-toq2hh3cfn] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    margin-top: 0.125rem;
}

.zimam-stat-card__divider[b-toq2hh3cfn] {
    height: 1px;
    background: var(--color-border-light);
    margin-bottom: 0.25rem;
}

.zimam-stat-card__footer[b-toq2hh3cfn] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 0.875rem;
}

.zimam-stat-card__footer-meta[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__footer-text[b-toq2hh3cfn] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__footer-link[b-toq2hh3cfn] {
    font-size: 0.75rem;
    color: #000;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
    flex-shrink: 0;
    flex-direction: row-reverse;
}

.zimam-stat-card__footer-link svg[b-toq2hh3cfn] {
    color: inherit;
    stroke: currentColor !important;
    fill: currentColor !important;
}

.zimam-stat-card__footer-link span[b-toq2hh3cfn] {
    display: inline-block;
    font-size: var(--text-xs);
    color: inherit;
    margin-inline-start: 0.5rem;
}

.zimam-stat-card__footer-link:hover[b-toq2hh3cfn] {
    text-decoration: underline;
}

/* ── Loading skeleton ── */
.zimam-stat-card--loading[b-toq2hh3cfn] {
    overflow: hidden;
}

.zimam-stat-card--loading .zimam-stat-skeleton[b-toq2hh3cfn] {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-toq2hh3cfn 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes zimam-shimmer-b-toq2hh3cfn {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

/* ── Tracker grid ── */
.zimam-tracker-grid[b-toq2hh3cfn] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.875rem;
    margin-bottom: 1.25rem;
    animation: zimam-content-appear 300ms ease-out;
}

@media (max-width: 1280px) {
    .zimam-tracker-grid[b-toq2hh3cfn] {
        grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr));
    }
}

@media (max-width: 768px) {
    .zimam-tracker-grid[b-toq2hh3cfn] {
        grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    }
}

@media (max-width: 480px) {
    .zimam-tracker-grid[b-toq2hh3cfn] {
        grid-template-columns: 1fr;
    }
}

.zimam-tracker-card[b-toq2hh3cfn] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    padding: 0.625rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: var(--shadow-sm);
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-tracker-card:hover[b-toq2hh3cfn] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-tracker-card__header[b-toq2hh3cfn] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.zimam-tracker-card__icon[b-toq2hh3cfn] {
    margin-top: 0.125rem;
    color: var(--color-text-faint);
    flex-shrink: 0;
}

.zimam-tracker-card__number-label[b-toq2hh3cfn] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__number[b-toq2hh3cfn] {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__status-label[b-toq2hh3cfn] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.25rem;
}

.zimam-tracker-card__timeline[b-toq2hh3cfn] {
    background: var(--color-bg);
    border-radius: var(--radius-lg);
    padding: 0.5rem 0.625rem;
    flex: 1;
    margin-bottom: 0.5rem;
    position: relative;
}

.zimam-tracker-card__timeline-line[b-toq2hh3cfn] {
    position: absolute;
    right: calc(0.625rem + 11px);
    top: 1.5rem;
    bottom: 1.5rem;
    width: 1px;
    background: var(--color-text-strong);
}

.zimam-tracker-card__timeline-items[b-toq2hh3cfn] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
}

.zimam-tracker-card__timeline-item[b-toq2hh3cfn] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.zimam-tracker-card__timeline-dot[b-toq2hh3cfn] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.zimam-tracker-card__timeline-dot svg[b-toq2hh3cfn] {
    width: 0.75rem;
    height: 0.75rem;
    color: var(--color-surface);
}

.zimam-tracker-card__timeline-detail[b-toq2hh3cfn] {
    min-width: 0;
}

.zimam-tracker-card__timeline-time[b-toq2hh3cfn] {
    font-size: 0.625rem;
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__timeline-desc[b-toq2hh3cfn] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: var(--lh-tight);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-tracker-card__btn[b-toq2hh3cfn] {
    align-self: flex-start;
    margin-top: auto;
    min-height: 1.875rem;
    padding-inline: 0.75rem;
    font-size: var(--text-xs);
}

/* ── Tracker card loading skeleton ── */.zimam-tracker-card--loading[b-toq2hh3cfn] {
    pointer-events: none;
}

.zimam-tracker-skeleton[b-toq2hh3cfn] {
    display: block;
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-toq2hh3cfn 1.5s infinite;
    border-radius: var(--radius-sm);
}

/* ── Tracker empty state ── */
.zimam-tracker-empty[b-toq2hh3cfn] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 0.75rem;
    color: var(--color-text-faint);
}

.zimam-tracker-empty__icon[b-toq2hh3cfn] {
    opacity: 0.4;
}

.zimam-tracker-empty__text[b-toq2hh3cfn] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Tracker controls (removed) ── */

/* ── Tabs ── */
.zimam-tabs[b-toq2hh3cfn] {
    display: flex;
    gap: 0.875rem;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 0 0.75rem;
}

.zimam-tab[b-toq2hh3cfn] {
    padding: 0.75rem 0.25rem;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-bottom: -1px;
}

/* ── Toggle Controls Button ── */
.zimam-tab--toggle[b-toq2hh3cfn] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint, #94a3b8);
    border-bottom: none;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-tab--toggle:hover[b-toq2hh3cfn] {
    color: var(--color-text-secondary, #64748b);
    border-bottom-color: transparent;
}

.zimam-tab--toggle-icon[b-toq2hh3cfn] {
    transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.zimam-tab--toggle-collapsed .zimam-tab--toggle-icon[b-toq2hh3cfn] {
    transform: rotate(-180deg);
}

.zimam-project-management__results .zimam-table-toolbar[b-toq2hh3cfn] {
    margin-top: 0;
    margin-bottom: 0;
    padding-block: 0.5rem 0.375rem;
    padding-inline: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Give cards view more breathing room between tabs row and controls row. */
.zimam-project-management__results--cards .zimam-table-toolbar[b-toq2hh3cfn] {
    margin-top: 0.5rem;
}

.zimam-project-management__results--cards[b-toq2hh3cfn]  .zimam-active-filter-bar {
    margin-top: 0.25rem;
}

/* ── Compact Table Styling (Specific to Case Management) ── */
.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table {
    font-size: 11px;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table thead th {
    font-size: 11px;
    font-weight: 700;
    height: 35px;
    padding-block: 8px;
    padding-inline: 12px;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-table tbody td {
    height: 35px;
    padding: 8px;
}

.zimam-project-management__table-well[b-toq2hh3cfn]  .zimam-pill {
    font-size: 11px;
    padding-inline: 2em;
    padding-block: 0.2em;
    line-height: 1.25;
    border-radius: 999em;
}

.zimam-table-toolbar__filter-btn[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
    position: relative;
    flex-shrink: 0;
    margin-inline-start: auto; /* RTL: margin-right: auto → pushes to far left */
}

.zimam-table-toolbar__filter-btn:hover[b-toq2hh3cfn] {
    background: #1e293b;
}

.zimam-table-toolbar__filter-btn:focus-visible[b-toq2hh3cfn] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Column Picker Dropdown ── */
.zimam-column-picker[b-toq2hh3cfn] {
    position: relative;
    flex-shrink: 0;
    z-index: 30;
    isolation: isolate;
}

.zimam-column-picker__trigger[b-toq2hh3cfn] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    padding: 0;
    background: var(--color-surface, #fff);
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.zimam-column-picker__unsaved-dot[b-toq2hh3cfn] {
    position: absolute;
    top: -3px;
    inset-inline-end: -3px;
    width: 8px;
    height: 8px;
    background: var(--color-warning, #f59e0b);
    border: 1.5px solid var(--color-surface, #fff);
    border-radius: 50%;
    pointer-events: none;
}

.zimam-column-picker__trigger:hover[b-toq2hh3cfn] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
    border-color: var(--color-border-hover, #cbd5e1);
}

.zimam-column-picker__trigger:focus-visible[b-toq2hh3cfn] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-column-picker__backdrop[b-toq2hh3cfn] {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-modal) - 1);
}

.zimam-column-picker__panel[b-toq2hh3cfn] {
    position: absolute;
    top: calc(100% + 0.375rem);
    inset-inline-end: 0;
    z-index: var(--z-modal);
    width: 14rem;
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10), 0 1px 4px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.zimam-column-picker__header[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text-strong, #0f172a);
}

.zimam-column-picker__count[b-toq2hh3cfn] {
    font-weight: 400;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-column-picker__list[b-toq2hh3cfn] {
    padding: 0.375rem 0;
    max-height: 18rem;
    overflow-y: auto;
}

.zimam-column-picker__item[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    font-size: 12px;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    transition: background 0.1s ease;
    user-select: none;
}

.zimam-column-picker__item:hover[b-toq2hh3cfn] {
    background: var(--color-surface-hover, #f8fafc);
}

.zimam-column-picker__item input[type="checkbox"][b-toq2hh3cfn] {
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.1875rem;
    border: 1.5px solid var(--color-border, #cbd5e1);
    accent-color: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
    cursor: pointer;
}

.zimam-column-picker__item-label[b-toq2hh3cfn] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Inline Save/Discard Actions ── */
.zimam-column-picker__actions[b-toq2hh3cfn] {
    display: flex;
    gap: 0.375rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--color-border, #e2e8f0);
}

.zimam-column-picker__btn[b-toq2hh3cfn] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.75rem;
    border: none;
    border-radius: 0.375rem;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, opacity 0.15s ease;
}

.zimam-column-picker__btn:disabled[b-toq2hh3cfn] {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-column-picker__btn--save[b-toq2hh3cfn] {
    background: var(--color-text-strong, #0f172a);
    color: #fff;
}

.zimam-column-picker__btn--save:hover:not(:disabled)[b-toq2hh3cfn] {
    background: #1e293b;
}

.zimam-column-picker__btn--discard[b-toq2hh3cfn] {
    background: transparent;
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
}

.zimam-column-picker__btn--discard:hover:not(:disabled)[b-toq2hh3cfn] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}



.zimam-search-wrapper[b-toq2hh3cfn] {
    width: 100%;
    max-width: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__total[b-toq2hh3cfn] {
    font-size: 12px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.zimam-table-toolbar__total-count[b-toq2hh3cfn] {
    font-weight: 600;
    color: var(--color-text-strong);
}

.zimam-tab:hover[b-toq2hh3cfn] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-tab--active[b-toq2hh3cfn] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-tab--active:hover[b-toq2hh3cfn] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

/* ── Tabs separator (vertical divider between view-mode & saved-views) ── */
.zimam-tabs__separator[b-toq2hh3cfn] {
    width: 1px;
    align-self: stretch;
    margin-block: 0.5rem;
    background: var(--color-border, #e2e8f0);
    flex-shrink: 0;
}

/* ── Saved-view tab variant ── */
.zimam-tab--view[b-toq2hh3cfn] {
    font-size: 12px;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Dropdown trigger tab ── */
.zimam-tab--dropdown[b-toq2hh3cfn] {
    gap: 0.375rem;
}

/* ── Custom Views Dropdown Container ── */
.zimam-views-dropdown[b-toq2hh3cfn] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-bottom: -1px;
}

.zimam-views-dropdown__chevron[b-toq2hh3cfn] {
    transition: transform 0.2s ease;
}

.zimam-views-dropdown__chevron--open[b-toq2hh3cfn] {
    transform: rotate(180deg);
}

/* ── Tab badge (count) ── */
.zimam-tab-badge[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-bg, #f1f5f9);
    color: var(--color-text-secondary, #475569);
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
}

.zimam-tab--active .zimam-tab-badge[b-toq2hh3cfn] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

/* ── Dropdown Backdrop (click-outside to close) ── */
.zimam-views-dropdown__backdrop[b-toq2hh3cfn] {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-tooltip, 60) - 1);
    background: transparent;
}

/* ── Dropdown Panel ── */
.zimam-views-dropdown__panel[b-toq2hh3cfn] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    width: min(22rem, 90vw);
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    z-index: var(--z-tooltip, 60);
    overflow: hidden;
    animation: zimam-dropdown-in-b-toq2hh3cfn 150ms ease;
}

@keyframes zimam-dropdown-in-b-toq2hh3cfn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-views-dropdown__header[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--color-text-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.zimam-views-dropdown__count[b-toq2hh3cfn] {
    font-size: 0.625rem;
    font-weight: 500;
    color: var(--color-text-faint, #94a3b8);
}

/* ── Dropdown List ── */
.zimam-views-dropdown__list[b-toq2hh3cfn] {
    max-height: 16rem;
    overflow-y: auto;
    padding: 0.25rem;
    scrollbar-width: thin;
}

.zimam-views-dropdown__item[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    border-radius: 0.375rem;
    transition: background 0.1s ease;
}

.zimam-views-dropdown__item:hover[b-toq2hh3cfn] {
    background: var(--color-surface-secondary, #f8fafc);
}

.zimam-views-dropdown__item--active[b-toq2hh3cfn] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item--active:hover[b-toq2hh3cfn] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item-btn[b-toq2hh3cfn] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: none;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    text-align: start;
    min-width: 0;
}

.zimam-views-dropdown__item--active .zimam-views-dropdown__item-btn[b-toq2hh3cfn] {
    color: var(--color-text-strong, #0f172a);
    font-weight: 600;
}

.zimam-views-dropdown__item-name[b-toq2hh3cfn] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.zimam-views-dropdown__item-active-dot[b-toq2hh3cfn] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
}

.zimam-views-dropdown__item-delete[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    padding: 0;
    border: none;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--color-text-faint, #94a3b8);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease;
}

.zimam-views-dropdown__item:hover .zimam-views-dropdown__item-delete[b-toq2hh3cfn] {
    opacity: 1;
}

.zimam-views-dropdown__item-delete:hover[b-toq2hh3cfn] {
    background: var(--color-danger-surface, #fef2f2);
    color: var(--color-danger, #dc2626);
}

/* ── Edit action button in dropdown item ── */
.zimam-views-dropdown__item-action[b-toq2hh3cfn] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    padding: 0;
    border: none;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--color-text-faint, #94a3b8);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.1s ease, background 0.1s ease, color 0.1s ease;
}

.zimam-views-dropdown__item:hover .zimam-views-dropdown__item-action[b-toq2hh3cfn] {
    opacity: 1;
}

.zimam-views-dropdown__item-action:hover[b-toq2hh3cfn] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

/* ── Save View Button (toolbar, beside filter button) ── */
.zimam-table-toolbar__save-view-btn[b-toq2hh3cfn] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--duration-fast, 150ms) ease, transform var(--duration-fast, 150ms) ease;
    white-space: nowrap;
    flex-shrink: 0;
}

.zimam-table-toolbar__save-view-btn:hover[b-toq2hh3cfn] {
    background: #1e293b;
    transform: translateY(-0.5px);
}

.zimam-table-toolbar__save-view-btn:active[b-toq2hh3cfn] {
    transform: translateY(0);
}

/* ── Infinite scroll sentinel ── */
.zimam-scroll-sentinel[b-toq2hh3cfn] {
    height: 1px;
    width: 100%;
}

/* ── Infinite scroll loading bar ── */
.zimam-table-loader[b-toq2hh3cfn] {
    width: 100%;
    height: 3px;
    background: var(--color-border, #e2e8f0);
    overflow: hidden;
    flex-shrink: 0;
}

.zimam-table-loader__bar[b-toq2hh3cfn] {
    width: 40%;
    height: 100%;
    background: var(--color-text-strong, #0f172a);
    border-radius: 2px;
    animation: zimam-loader-slide-b-toq2hh3cfn 1s ease-in-out infinite;
}

@keyframes zimam-loader-slide-b-toq2hh3cfn {
    0%   { transform: translateX(250%); }
    100% { transform: translateX(-100%); }
}
/* /Modules/Projects/SharedComponents/ProjectQuickActionColumn/ProjectQuickActionColumn.razor.rz.scp.css */
.quick-action-column[b-wlj7odxo71] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.quick-action-column__tab-bar[b-wlj7odxo71] {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--color-border);
    padding-inline: 0.25rem;
    flex-shrink: 0;
}

.quick-action-column__tab[b-wlj7odxo71] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.75rem 0.5rem;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: color var(--duration-fast) var(--ease-default),
                border-bottom-color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.quick-action-column__tab:hover[b-wlj7odxo71] {
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
}

.quick-action-column__tab--active[b-wlj7odxo71] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-primary);
    font-weight: var(--fw-semibold);
}

.quick-action-column__tab-count[b-wlj7odxo71] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
}

.quick-action-column__tab--active .quick-action-column__tab-count[b-wlj7odxo71] {
    background: var(--color-primary-ring);
    color: var(--color-primary-700);
}

.quick-action-column__panel[b-wlj7odxo71] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.quick-action-column__section-header[b-wlj7odxo71] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 0.875rem 0.5rem;
    gap: 0.75rem;
    flex-shrink: 0;
}

.quick-action-column__section-meta[b-wlj7odxo71] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.quick-action-column__section-title[b-wlj7odxo71] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.quick-action-column__section-date[b-wlj7odxo71] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    line-height: var(--lh-normal);
}

.quick-action-column__refresh-btn[b-wlj7odxo71],
.quick-action-column__retry-btn[b-wlj7odxo71] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    min-height: 2rem;
    padding-inline: 0.75rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default);
}

.quick-action-column__refresh-btn:hover[b-wlj7odxo71],
.quick-action-column__retry-btn:hover[b-wlj7odxo71] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
    color: var(--color-text-strong);
}

.quick-action-column__project-list[b-wlj7odxo71] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    padding: 0 0.875rem 0.875rem;
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.quick-action-column__project-card[b-wlj7odxo71] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    width: 100%;
    padding: 0.875rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    cursor: pointer;
    text-align: start;
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                transform var(--duration-fast) var(--ease-default);
}

.quick-action-column__project-card:hover[b-wlj7odxo71] {
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.quick-action-column__project-card--selected[b-wlj7odxo71] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary-ring);
}

.quick-action-column__project-top[b-wlj7odxo71] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.quick-action-column__project-heading[b-wlj7odxo71] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.quick-action-column__project-code[b-wlj7odxo71] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.quick-action-column__project-title[b-wlj7odxo71] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-normal);
}

.quick-action-column__project-state[b-wlj7odxo71] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-inline: 0.5rem;
    min-height: 1.5rem;
    border-radius: var(--radius-pill);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    white-space: nowrap;
}

.quick-action-column__project-state--active[b-wlj7odxo71] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border: 1px solid var(--color-success-border);
}

.quick-action-column__project-state--inactive[b-wlj7odxo71] {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    border: 1px solid var(--color-warning-border);
}

.quick-action-column__project-meta[b-wlj7odxo71] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.875rem;
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
}

.quick-action-column__project-meta-item[b-wlj7odxo71] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.quick-action-column__project-footer[b-wlj7odxo71] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.625rem;
    border-top: 1px solid var(--color-border-light);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
}

.quick-action-column__project-status[b-wlj7odxo71] {
    color: var(--color-text-strong);
    font-weight: var(--fw-medium);
}

.quick-action-column__project-progress[b-wlj7odxo71] {
    color: var(--color-text-muted);
    white-space: nowrap;
}

.quick-action-column__load-indicator[b-wlj7odxo71],
.quick-action-column__error-state[b-wlj7odxo71],
.quick-action-column__empty-state[b-wlj7odxo71] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 1rem;
    text-align: center;
}

.quick-action-column__error-text[b-wlj7odxo71],
.quick-action-column__empty-text[b-wlj7odxo71] {
    margin: 0;
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.quick-action-column__error-text[b-wlj7odxo71] {
    color: var(--color-error-text);
}

.quick-action-column__empty-state[b-wlj7odxo71] {
    color: var(--color-text-muted);
}

@media (max-width: 1024px) {
    .quick-action-column[b-wlj7odxo71] {
        min-height: 28rem;
    }
}
/* /Modules/Projects/SharedComponents/ProjectTimelineOverview/ProjectTimelineOverview.razor.rz.scp.css */
/* ==========================================================================
   Case Timeline Track & Layout
   RTL Localized & Optimized
   ========================================================================== */

/* ── Timeline Track Layout ── */
.project-timeline-container[b-hq4y2byyt0] {
    background-color: rgba(248, 250, 252, 0.5); /* bg-gray-50/50 */
    padding: 0.5rem;
}

.project-timeline-card[b-hq4y2byyt0] {
    background-color: white;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    overflow: visible;
    width: 100%;
}

.project-timeline-card-header[b-hq4y2byyt0] {
    padding: 1rem;
    border-bottom: 1px solid var(--color-border-light);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: white;
    position: sticky;
    top: 0;
    z-index: 20;
}

.project-timeline-card-title[b-hq4y2byyt0] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
}

.legend-line-completed[b-hq4y2byyt0] {
    width: 1rem;
    height: 2px;
    background-color: var(--color-primary); 
}

.legend-line-pending[b-hq4y2byyt0] {
    width: 1rem;
    height: 0;
    border-top: 2px dashed #cbd5e1;
}

.project-timeline-toggle[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.project-timeline-toggle-label[b-hq4y2byyt0] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.project-timeline-switch[b-hq4y2byyt0] {
    width: 2.75rem;
    height: 1.5rem;
    border-radius: var(--radius-pill);
    position: relative;
    cursor: pointer;
    transition: background-color var(--duration-fast);
    border: none;
}
.project-timeline-switch.active[b-hq4y2byyt0] { background-color: var(--color-text-strong); }
.project-timeline-switch.inactive[b-hq4y2byyt0] { background-color: var(--color-border); }

.project-timeline-switch-thumb[b-hq4y2byyt0] {
    position: absolute;
    top: 0.25rem;
    inset-inline-start: 0.25rem;
    width: 1rem;
    height: 1rem;
    background-color: white;
    border-radius: var(--radius-pill);
    transition: transform var(--duration-fast);
}
/* Flip translation for RTL */
.project-timeline-switch.active .project-timeline-switch-thumb[b-hq4y2byyt0] {
    transform: translateX(-1.25rem); /* Negative in RTL to move end-ward */
}

/* ── Timeline Body ── */
.project-timeline-skeleton[b-hq4y2byyt0] {
    pointer-events: none;
    user-select: none;
}

.project-timeline-body[b-hq4y2byyt0] {
    padding: 10px 15px;
    position: relative;
    min-height: 500px;
}

.project-timeline-items[b-hq4y2byyt0] {
    position: relative;
    z-index: 20;
}

/* ── Timeline Nodes ── */
.timeline-dot[b-hq4y2byyt0] {
    position: absolute;
    border-radius: 50%;
    border: 2px solid #000;
    background-color: #fff;
    z-index: 30;
    transform: translateY(-50%);
    transition: transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out), border-color var(--duration-normal);
}

/* Status-aware dot border colours */
.timeline-dot.finished[b-hq4y2byyt0]    { border-color: #10b981; }
.timeline-dot.in-progress[b-hq4y2byyt0] { border-color: var(--color-primary); }
.timeline-dot.awaiting[b-hq4y2byyt0]    { border-color: #cbd5e1; }
.timeline-dot.suspended[b-hq4y2byyt0]   { border-color: #dc2626; }
.timeline-dot.under-review[b-hq4y2byyt0] { border-color: #f59e0b; }

.timeline-dot.phase-dot[b-hq4y2byyt0] {
    width: 0.875rem;
    height: 0.875rem;
    transform: translate(50%, -50%);
    box-shadow: var(--shadow-sm);
}

.timeline-dot.task-dot[b-hq4y2byyt0] {
    width: 0.75rem;
    height: 0.75rem;
    transform: translate(50%, -50%);
}

/* ── Phase Row ── */
.phase-row[b-hq4y2byyt0] {
    position: relative;
    display: flex;
    padding-top: 1rem;
    padding-bottom: 1rem;
    /* CSS variables for branch line style — inherited by all descendants */
    --branch-color: #cbd5e1;
    --branch-style: dashed;
}
.phase-row.finished[b-hq4y2byyt0]    { --branch-color: #10b981; --branch-style: solid; }
.phase-row.in-progress[b-hq4y2byyt0] { --branch-color: var(--color-primary); --branch-style: solid; }
.phase-row.suspended[b-hq4y2byyt0]   { --branch-color: #dc2626; --branch-style: solid; }

/* Fork curve color = first task's color (defaults to dashed gray like tasks) */
.phase-row[b-hq4y2byyt0] { --fork-color: #cbd5e1; --fork-style: dashed; }
.phase-row:has(.task-row:first-child.finished)[b-hq4y2byyt0]    { --fork-color: #10b981; --fork-style: solid; }
.phase-row:has(.task-row:first-child.in-progress)[b-hq4y2byyt0] { --fork-color: var(--color-primary); --fork-style: solid; }
.phase-row:has(.task-row:first-child.suspended)[b-hq4y2byyt0]   { --fork-color: #dc2626; --fork-style: solid; }
.phase-row:has(.task-row:first-child.under-review)[b-hq4y2byyt0] { --fork-color: #f59e0b; --fork-style: solid; }

/* ── Phase Spine Connector ──
   Vertical line on .phase-row::after, from this phase dot center
   downward to the next phase dot or END node. */
.phase-row[b-hq4y2byyt0]::after {
    content: '';
    position: absolute;
    top: calc(1rem + 1.75rem);
    bottom: calc(-1rem - 1.75rem);
    width: 0;
    border-inline-start: 2px var(--branch-style) var(--branch-color);
    inset-inline-start: calc(5rem - 1px);
    z-index: 16;
    pointer-events: none;
}


/* ── END Node Row ──
   Terminal node after the last phase. Mirrors phase-row layout
   so spine/dot alignment is consistent. */
.end-node-row[b-hq4y2byyt0] {
    position: relative;
    display: flex;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
}
.end-node-col[b-hq4y2byyt0] {
    width: 6rem;
    flex-shrink: 0;
    position: relative;
}
.end-node-col .timeline-dot.end-dot[b-hq4y2byyt0] {
    position: absolute;
    top: 1.75rem;
    inset-inline-start: 5rem;
    transform: translate(50%, -50%);
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 50%;
    background: var(--color-border);
    border: 2px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    z-index: 20;
}

.phase-left-col[b-hq4y2byyt0] {
    width: 6rem;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
}

/* Phase date: far right, full width up to the spine dot */
.phase-left-col[b-hq4y2byyt0]  .timeline-time {
    position: absolute;
    top: 1.75rem;
    transform: translateY(-50%);
    inset-inline-start: 0;
    width: calc(5rem - 0.75rem); /* up to dot minus gap */
    white-space: nowrap;
    text-align: end;
}
.phase-left-col .phase-dot[b-hq4y2byyt0] {
    top: 1.75rem;
    inset-inline-start: 5rem; /* Spine position within left column */
}

/* ── Timeline Time (shared text styles) ── */
[b-hq4y2byyt0] .timeline-time {
    text-align: start;
}
[b-hq4y2byyt0] .timeline-time-date {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    margin: 0;
    transition: color var(--duration-fast), font-weight var(--duration-fast);
}
.phase-row:has(.phase-card:hover) > .phase-left-col[b-hq4y2byyt0]  .timeline-time-date,
.phase-row:has(.timeline-dot:hover) > .phase-left-col[b-hq4y2byyt0]  .timeline-time-date {
    color: var(--color-text-strong);
    font-weight: var(--fw-bold);
}
[b-hq4y2byyt0] .timeline-time-hour {
    font-size: 10px;
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-faint);
    margin: 0;
}

.phase-right-col[b-hq4y2byyt0] {
    flex: 1;
    min-width: 0;
    padding-inline-start: 1.5rem;
}

.phase-card[b-hq4y2byyt0] {
    position: relative; /* Anchor for branch curve pseudo-elements */
    background-color: white;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border-light);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--duration-normal), transform var(--duration-normal), border-color var(--duration-normal);
}
/* Phase hover styles based on status */
.phase-card:hover[b-hq4y2byyt0], .phase-row:has(.timeline-dot:hover) .phase-card[b-hq4y2byyt0] { 
    box-shadow: var(--shadow-md); 
    transform: translateY(-1px);
    border-color: #000000; /* Solid Black hover by default */
}
.phase-row.finished:has(.timeline-dot:hover) .phase-card[b-hq4y2byyt0], .phase-row.finished:has(.phase-card:hover) .phase-card[b-hq4y2byyt0] { border-color: #10b981; /* Green when finished */ }
.phase-row.in-progress:has(.timeline-dot:hover) .phase-card[b-hq4y2byyt0], .phase-row.in-progress:has(.phase-card:hover) .phase-card[b-hq4y2byyt0] { border-color: var(--color-primary); }
.phase-row.suspended:has(.timeline-dot:hover) .phase-card[b-hq4y2byyt0], .phase-row.suspended:has(.phase-card:hover) .phase-card[b-hq4y2byyt0] { border-color: #dc2626; /* Red when suspended */ }
.phase-row.default:has(.timeline-dot:hover) .phase-card[b-hq4y2byyt0], .phase-row.default:has(.phase-card:hover) .phase-card[b-hq4y2byyt0] { border-color: #000000; }
.phase-card.expanded[b-hq4y2byyt0] { border-color: var(--color-border); box-shadow: var(--shadow-md); }

.timeline-dot.phase-dot:hover[b-hq4y2byyt0], .phase-row:has(.phase-card:hover) .timeline-dot.phase-dot[b-hq4y2byyt0] {
    transform: translate(50%, -50%) scale(1.3);
    box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-md);
}

.phase-card-header[b-hq4y2byyt0] {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding: 0.75rem; /* Standardized to match task cards */
    text-align: start;
    background: transparent;
    border: none;
    cursor: pointer;
}

.phase-header-top[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
    width: 100%;
}

.phase-title-group[b-hq4y2byyt0] {
    display: flex;
    flex-direction: row; /* Linear Layout */
    align-items: center;
    gap: 0.5rem;
}
.phase-title[b-hq4y2byyt0] {
    font-size: var(--text-sm); /* Standardized to match task title */
    font-weight: 700;
    color: var(--color-text-strong);
    margin: 0;
}
.phase-code[b-hq4y2byyt0] {
    font-size: 10px; /* Standardized to match task code */
    font-family: monospace;
    font-weight: 700;
    color: var(--color-text-faint);
    background-color: var(--color-bg-subtle);
    padding: 0.125rem 0.375rem;
    border-radius: var(--radius-xs);
}

.phase-status-group[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.phase-status-group .icon-wrap[b-hq4y2byyt0] { color: var(--color-text-faint); }

.phase-progress-row[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    margin-top: 0.25rem;
}
.phase-progress-bar-bg[b-hq4y2byyt0] {
    flex: 1;
    height: 0.375rem;
    background-color: var(--color-bg);
    border-radius: var(--radius-pill);
    overflow: hidden;
}
.phase-progress-bar-fill[b-hq4y2byyt0] {
    height: 100%;
    border-radius: var(--radius-pill);
    background-color: var(--color-primary);
    transition: width 0.5s ease;
}
.phase-progress-bar-fill.complete[b-hq4y2byyt0] { background-color: #10b981; }
.phase-progress-text[b-hq4y2byyt0] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    width: 2rem;
    text-align: end;
}

/* Animation via grid hack for Phase Tasks */
.phase-details-anim[b-hq4y2byyt0] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows var(--duration-normal) var(--ease-out), opacity var(--duration-normal) var(--ease-out);
    overflow: hidden;
}
.phase-details-anim.expanded[b-hq4y2byyt0] {
    grid-template-rows: 1fr;
    opacity: 1;
    overflow: visible;
}

.phase-details-inner[b-hq4y2byyt0] {
    min-height: 0; /* Critical for grid track hack */
}

/* ── Tasks Area ── */
.phase-tasks-container[b-hq4y2byyt0] {
    padding: 0.5rem 1rem 1rem;
    border-top: 1px solid var(--color-bg-subtle);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    position: relative;
}

/* Bridge: fork curve end → first task row top.
   Covers the gap inside the tasks container, from its top edge
   down to the first task-row (0.5rem padding).
   Uses --fork-color (= first task's color). */
.phase-tasks-container[b-hq4y2byyt0]::before {
    content: '';
    position: absolute;
    inset-inline-start: calc(-1rem); /* task-dot X relative to container */
    top: 0;
    height: calc(0.5rem + 0.25rem); /* container padding-top + small overlap */
    width: 0;
    border-inline-start: 2px var(--fork-style) var(--fork-color);
    pointer-events: none;
    z-index: 17;
}

/* Bridge: last task → merge: removed — last task’s ::after handles it. */

/* ── Fork curve: phase dot exits, curves to task column, goes DOWN to container.
   The border-inline-end vertical extends from curve to approximately the
   tasks container top. Uses --fork-color (= first task's color).
   This is safe because the only task whose area it enters is T-01. */
.phase-card.expanded:has(.task-row)[b-hq4y2byyt0]::before {
    content: '';
    position: absolute;
    top: 1.75rem;
    inset-inline-start: calc(-2.5rem);
    width: 1.5rem;
    height: 6rem; /* curve (1rem) + straight to reach tasks container */
    border-top: 2px var(--fork-style) var(--fork-color);
    border-inline-end: 2px var(--fork-style) var(--fork-color);
    border-start-end-radius: 1rem;
    border-bottom: none;
    border-inline-start: none;
    pointer-events: none;
    z-index: 16;
}

/* ── Task Rows ── */
.task-row[b-hq4y2byyt0] {
    position: relative;
    display: flex;
    /* Per-task status colors — default to dashed gray */
    --task-color: #cbd5e1;
    --task-style: dashed;
}
.task-row.finished[b-hq4y2byyt0]    { --task-color: #10b981; --task-style: solid; }
.task-row.in-progress[b-hq4y2byyt0] { --task-color: var(--color-primary); --task-style: solid; }
.task-row.suspended[b-hq4y2byyt0]   { --task-color: #dc2626; --task-style: solid; }
.task-row.under-review[b-hq4y2byyt0] { --task-color: #f59e0b; --task-style: solid; }

/* First task: vertical from row top to dot center.
   Bridges the gap between fork curve end and this task's dot.
   Uses THIS TASK's own color (not fork/branch). */
.task-row:first-child[b-hq4y2byyt0]::before {
    content: '';
    position: absolute;
    inset-inline-start: calc(-2rem);
    top: 0;
    height: 1.5rem; /* row top to dot center */
    width: 0;
    border-inline-start: 2px var(--task-style) var(--task-color);
    pointer-events: none;
    z-index: 17;
}

/* Task dot: anchored to card header center (0.75rem padding + ~0.875rem half-height ≈ 1.5rem).
   This stays fixed even when the card expands with details. */
.task-row .timeline-dot.task-dot[b-hq4y2byyt0] {
    position: absolute;
    top: 1.5rem;
    inset-inline-start: calc(-2rem);
    transform: translate(50%, -50%);
    z-index: 30;
}

/* Task date: fixed top to match task dot */
.task-row[b-hq4y2byyt0]  .timeline-time.task-time {
    position: absolute;
    top: 1.5rem;
    transform: translateY(-50%);
    inset-inline-start: -8.5rem;
    width: calc(5rem - 0.75rem);
    text-align: end;
    white-space: nowrap;
    z-index: 20;
}

/* ── Vertical connector between task dots ──
   SINGLE downward line from each task's dot center to the next task's dot center.
   Color belongs to the SOURCE task (the one drawing the line).
   No ::before — avoids color collision at the junction.
   Math: bottom must cross the 1rem container gap + reach next dot at 1.5rem
         → bottom = -(gap + next-dot-top) = -(1rem + 1.5rem) = -2.5rem */
.task-row:not(:last-child)[b-hq4y2byyt0]::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(-2rem);
    top: 1.5rem;
    bottom: calc(-1rem - 1.5rem); /* -(gap) - (next dot top) = -2.5rem */
    width: 0;
    border-inline-start: 2px var(--task-style) var(--task-color);
    pointer-events: none;
    z-index: 17;
}
/* Last task: single L-shaped element from dot center DOWN, curves to next phase dot.
   Draws the vertical, the curve, and the horizontal — one element, one color.
   Bottom: container-pad(1) + phase-pad-bot(1) + next-phase-pad-top(1) + next-dot(1.75) = 4.75rem
   Width: spine(5rem) to task-column(6.5rem) = 1.5rem from task-row inline-start(-3.5rem) */
.task-row:last-child[b-hq4y2byyt0]::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(-3.5rem); /* spine X relative to task-row */
    top: 1.5rem; /* dot center */
    bottom: -4.75rem; /* next phase dot center Y */
    width: 1.5rem; /* spine to task column */
    border-inline-end: 2px var(--task-style) var(--task-color); /* vertical on task-column side */
    border-bottom: 2px var(--task-style) var(--task-color); /* horizontal at bottom */
    border-end-end-radius: 1rem; /* curve from vertical to horizontal */
    border-top: none;
    border-inline-start: none;
    pointer-events: none;
    z-index: 17;
}

.task-card[b-hq4y2byyt0] {
    flex: 1;
    min-width: 0;
    background-color: oklch(98.5% 0.002 247.839); /* Enforced constant color as requested */
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-light);
    transition: box-shadow var(--duration-fast), transform var(--duration-fast), border-color var(--duration-fast);
}

.task-card:hover[b-hq4y2byyt0] { box-shadow: var(--shadow-md); transform: translateY(-1px); border-color: #000000; }
.task-row.finished .task-card:hover[b-hq4y2byyt0] { border-color: #10b981; }
.task-row.in-progress .task-card:hover[b-hq4y2byyt0] { border-color: var(--color-primary); }
.task-row.suspended .task-card:hover[b-hq4y2byyt0] { border-color: #dc2626; }
.task-row.default .task-card:hover[b-hq4y2byyt0] { border-color: #000000; }

.timeline-dot.task-dot:hover[b-hq4y2byyt0] {
    transform: translate(50%, -50%) scale(1.3);
    box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-sm);
}

.task-card-header[b-hq4y2byyt0] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem;
    text-align: start;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}
.task-card-header:hover[b-hq4y2byyt0] { background-color: rgba(241, 245, 249, 0.5); }

.task-title-group[b-hq4y2byyt0] {
    display: flex;
    flex-direction: row; /* Linear Layout */
    align-items: center;
    gap: 0.5rem;
}
.task-code[b-hq4y2byyt0] {
    font-size: 10px;
    font-weight: 700;
    color: oklch(70.7% 0.022 261.325); /* User requested color */
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.task-title[b-hq4y2byyt0] {
    font-size: var(--text-sm);
    font-weight: 700;
    color: oklch(55.1% 0.027 264.364); /* User requested color */
    margin: 0;
}
.task-title.finished[b-hq4y2byyt0] { color: var(--color-text-muted); }
.task-title.active[b-hq4y2byyt0] { color: var(--color-text-strong); }

.task-status-group[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.task-status-group .icon-wrap[b-hq4y2byyt0] { color: var(--color-text-faint); }

/* Animation via grid hack */
.task-details-anim[b-hq4y2byyt0] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows var(--duration-normal) var(--ease-out), opacity var(--duration-normal) var(--ease-out);
    overflow: hidden;
}
.task-details-anim.expanded[b-hq4y2byyt0] {
    grid-template-rows: 1fr;
    opacity: 1;
}

.task-details-inner[b-hq4y2byyt0] {
    min-height: 0; /* Critical for grid track hack */
}

.task-details[b-hq4y2byyt0] {
    padding: 0 0.75rem 0.75rem;
    border-top: 1px solid rgba(226, 232, 240, 0.6);
}

.task-docs-header[b-hq4y2byyt0] {
    font-size: 11px;
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    margin-bottom: 0.375rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.5rem;
}
.task-docs-grid[b-hq4y2byyt0] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}
.task-doc-item[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background-color: white;
    cursor: pointer;
    transition: background-color var(--duration-fast);
}
.task-doc-item:hover[b-hq4y2byyt0] { background-color: var(--color-bg-subtle); }
.task-doc-item .doc-info[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
}
.task-doc-item .doc-info .icon[b-hq4y2byyt0] { color: var(--color-primary); flex-shrink: 0; }
.task-doc-item .doc-info .name[b-hq4y2byyt0] {
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-meta-grid[b-hq4y2byyt0] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.5rem;
    background-color: white;
    padding: 1rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border-light);
    margin-top: 0.5rem;
    box-shadow: var(--shadow-sm);
}

.task-meta-col[b-hq4y2byyt0] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}
.task-meta-col.full-col[b-hq4y2byyt0] {
    grid-column: 1 / -1;
    padding-top: 0.75rem;
    border-top: 1px solid var(--color-bg-subtle);
}

.task-meta-label[b-hq4y2byyt0] {
    font-size: 10px;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}
.task-meta-value[b-hq4y2byyt0] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    margin-top: 0.125rem;
}

.task-assignee[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
}
.task-assignee .avatar[b-hq4y2byyt0] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: #dbeafe;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    flex-shrink: 0;
}
.task-assignee .name[b-hq4y2byyt0] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    transition: color var(--duration-fast);
}
.task-assignee:hover .name[b-hq4y2byyt0] { color: var(--color-primary); }

.task-notes[b-hq4y2byyt0] {
    background-color: var(--color-bg-subtle);
    padding: 0.75rem;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: var(--lh-relaxed);
    border: 1px solid var(--color-border-light);
}

.task-quick-actions[b-hq4y2byyt0] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--color-border-light);
}
.task-action-btn[b-hq4y2byyt0] {
    font-size: 11px;
    font-weight: var(--fw-medium);
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-xs);
    transition: color var(--duration-fast), background-color var(--duration-fast);
    background: transparent;
    border: none;
    cursor: pointer;
}
.task-action-btn.secondary[b-hq4y2byyt0] {
    color: var(--color-text-muted);
}
.task-action-btn.secondary:hover[b-hq4y2byyt0] {
    color: var(--color-text-strong);
    background-color: var(--color-bg);
}
.task-action-btn.primary[b-hq4y2byyt0] {
    color: var(--color-primary);
}
.task-action-btn.primary:hover[b-hq4y2byyt0] {
    color: #1d4ed8; 
    background-color: #eff6ff; 
}
/* ── Status badges ── */
.project-timeline-badge[b-hq4y2byyt0] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    border-radius: var(--radius-md);
    padding: 0.25rem 0.5rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    border: 1px solid transparent;
}

.project-timeline-badge.finished[b-hq4y2byyt0],
.project-timeline-badge.closed[b-hq4y2byyt0] {
    background-color: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.project-timeline-badge.in-progress[b-hq4y2byyt0] {
    background-color: var(--color-info-bg);
    color: var(--color-info-text);
    border-color: var(--color-info-border);
}

.project-timeline-badge.awaiting[b-hq4y2byyt0],
.project-timeline-badge.under-review[b-hq4y2byyt0] {
    background-color: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    border-color: var(--color-border);
}

.project-timeline-badge.suspended[b-hq4y2byyt0] {
    background-color: var(--color-error-bg);
    color: var(--color-error-text);
    border-color: var(--color-error-border);
}

/* ── :has() fallback for older browsers (Firefox < 121) ── */
@supports not selector(:has(a)) {
    .phase-card:hover[b-hq4y2byyt0] {
        box-shadow: var(--shadow-md);
        transform: translateY(-1px);
        border-color: var(--color-border);
    }
    .task-card:hover[b-hq4y2byyt0] {
        box-shadow: var(--shadow-md);
        transform: translateY(-1px);
        border-color: var(--color-border);
    }
    .timeline-dot.phase-dot:hover[b-hq4y2byyt0] {
        transform: translate(50%, -50%) scale(1.3);
        box-shadow: 0 0 0 4px var(--color-bg-subtle), var(--shadow-md);
    }
}
/* /Modules/Projects/SharedComponents/ProjectView/ProjectView.razor.rz.scp.css */
/* ==========================================================================
   ProjectView — Case Overview Header & Metadata
   Scoped to ProjectView.razor via Blazor CSS isolation
   ========================================================================== */

.project-overview-header[b-k59zrgdbbp] {
    padding: 1.5rem;
    border-bottom: 1px solid var(--color-border-light);
    flex-shrink: 0;
}

.project-overview-title-row[b-k59zrgdbbp] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    margin-bottom: 1.5rem;
}

.project-overview-title[b-k59zrgdbbp] {
    font-size: 1.375rem; /* 22px */
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    letter-spacing: -0.01em;
    margin: 0;
}

.project-overview-subtitle[b-k59zrgdbbp] {
    font-size: var(--text-sm); /* 12px */
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
}

.project-overview-meta-grid[b-k59zrgdbbp] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.project-overview-meta-group[b-k59zrgdbbp] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.project-overview-meta-label[b-k59zrgdbbp] {
    font-size: var(--text-base); /* 13px */
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.project-overview-meta-value[b-k59zrgdbbp] {
    font-size: var(--text-base); /* 13px */
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

/* Description variant — full-width with extra spacing */
.project-overview-meta-group--description[b-k59zrgdbbp] {
    margin-bottom: 2rem;
}

/* ── Status badges ── */
.project-timeline-badge[b-k59zrgdbbp] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    border-radius: var(--radius-md);
    padding: 0.25rem 0.5rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    border: 1px solid transparent;
}

.project-timeline-badge.finished[b-k59zrgdbbp],
.project-timeline-badge.closed[b-k59zrgdbbp] {
    background-color: var(--color-success-bg);
    color: var(--color-success-text);
    border-color: var(--color-success-border);
}

.project-timeline-badge.in-progress[b-k59zrgdbbp] {
    background-color: var(--color-info-bg);
    color: var(--color-info-text);
    border-color: var(--color-info-border);
}

.project-timeline-badge.awaiting[b-k59zrgdbbp],
.project-timeline-badge.under-review[b-k59zrgdbbp] {
    background-color: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    border-color: var(--color-border);
}

.project-timeline-badge.suspended[b-k59zrgdbbp] {
    background-color: var(--color-error-bg);
    color: var(--color-error-text);
    border-color: var(--color-error-border);
}

.project-overview-meta-group--description .project-overview-meta-label[b-k59zrgdbbp] {
    margin-bottom: 0.5rem;
}

@media (max-width: 640px) {
    .project-overview-meta-grid[b-k59zrgdbbp] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ── Case Health Section ── */
.zimam-project-view__health-section[b-k59zrgdbbp] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 1.5rem;
    background: var(--color-surface-alt, #f8fafc);
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-project-view__health-badge[b-k59zrgdbbp] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    width: fit-content;
}

.zimam-project-view__health-dot[b-k59zrgdbbp] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.zimam-project-view__health-badge--on-track[b-k59zrgdbbp] { background: #dcfce7; color: #166534; }
.zimam-project-view__health-badge--on-track .zimam-project-view__health-dot[b-k59zrgdbbp] { background: #22c55e; }
.zimam-project-view__health-badge--at-risk[b-k59zrgdbbp] { background: #fef3c7; color: #92400e; }
.zimam-project-view__health-badge--at-risk .zimam-project-view__health-dot[b-k59zrgdbbp] { background: #f59e0b; }
.zimam-project-view__health-badge--off-track[b-k59zrgdbbp] { background: #fee2e2; color: #991b1b; }
.zimam-project-view__health-badge--off-track .zimam-project-view__health-dot[b-k59zrgdbbp] { background: #ef4444; }
.zimam-project-view__health-badge--completed[b-k59zrgdbbp] { background: #dbeafe; color: #1e40af; }
.zimam-project-view__health-badge--completed .zimam-project-view__health-dot[b-k59zrgdbbp] { background: #3b82f6; }
.zimam-project-view__health-badge--default[b-k59zrgdbbp] { background: #f1f5f9; color: #64748b; }
.zimam-project-view__health-badge--default .zimam-project-view__health-dot[b-k59zrgdbbp] { background: #94a3b8; }

/* Progress bar */
.zimam-project-view__progress[b-k59zrgdbbp] { display: flex; flex-direction: column; gap: 6px; }
.zimam-project-view__progress-stats[b-k59zrgdbbp] { font-size: 0.8rem; color: var(--color-text-muted, #64748b); }
.zimam-project-view__late-count[b-k59zrgdbbp] { color: #dc2626; font-weight: 600; }
.zimam-project-view__progress-bar[b-k59zrgdbbp] {
    height: 6px;
    background: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
}
.zimam-project-view__progress-fill[b-k59zrgdbbp] {
    height: 100%;
    background: #3b82f6;
    border-radius: 3px;
    transition: width 0.3s ease;
}
/* /Modules/Settings/Account/AccountSettings.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   AccountSettings — Enterprise SaaS Redesign
   Two-column: sidebar nav + sectioned content cards
   ═══════════════════════════════════════════════════════════════ */

/* ── Loading ── */
.acct-loading[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

/* ── Two-Column Layout ── */
.acct-layout[b-77k0xauj60] {
    display: grid;
    grid-template-columns: 17rem 1fr;
    gap: var(--space-section, 2.25rem);
    align-items: start;
    max-width: 72rem;
}

/* ═══════════════════════════════════════════════
   SIDEBAR
   ═══════════════════════════════════════════════ */
.acct-sidebar[b-77k0xauj60] {
    position: sticky;
    top: 1rem;
    display: flex;
    flex-direction: column;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card, 1.25rem);
    overflow: hidden;
}

.acct-sidebar__nav[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    padding: 0.5rem;
}

.acct-sidebar__nav-item[b-77k0xauj60] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem;
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-secondary);
    background: none;
    border: none;
    border-radius: var(--radius-md, 0.5rem);
    cursor: pointer;
    text-align: start;
    transition: all var(--duration-fast) var(--ease-default);
    width: 100%;
}

.acct-sidebar__nav-item:hover[b-77k0xauj60] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.acct-sidebar__nav-item--active[b-77k0xauj60] {
    background: var(--color-primary, #2563eb);
    color: white;
}

.acct-sidebar__nav-item--active:hover[b-77k0xauj60] {
    background: var(--color-primary-700, #1d4ed8);
    color: white;
}

.acct-sidebar__nav-item--active[b-77k0xauj60]  svg {
    color: white;
}

.acct-sidebar__nav-text[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    gap: 0.0625rem;
    min-width: 0;
}

.acct-sidebar__nav-label[b-77k0xauj60] {
    font-weight: var(--fw-medium, 500);
    line-height: var(--lh-tight);
}

.acct-sidebar__nav-desc[b-77k0xauj60] {
    font-size: var(--text-2xs, 0.625rem);
    opacity: 0.7;
    line-height: var(--lh-tight);
}

.acct-sidebar__nav-item--active .acct-sidebar__nav-desc[b-77k0xauj60] {
    opacity: 0.8;
}

.acct-sidebar__footer[b-77k0xauj60] {
    padding: 0.5rem;
    border-top: 1px solid var(--color-border);
}

.acct-sidebar__link[b-77k0xauj60] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-md, 0.5rem);
    transition: all var(--duration-fast) var(--ease-default);
}

.acct-sidebar__link:hover[b-77k0xauj60] {
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

/* ═══════════════════════════════════════════════
   MAIN CONTENT
   ═══════════════════════════════════════════════ */
.acct-content[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

/* ── Card ── */
.acct-card[b-77k0xauj60] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card, 1.25rem);
    overflow: hidden;
}

.acct-card__header[b-77k0xauj60] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--color-border);
}

.acct-card__header-icon[b-77k0xauj60] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: var(--radius-lg, 0.75rem);
    flex-shrink: 0;
}

.acct-card__header-icon--security[b-77k0xauj60] {
    background: var(--color-info-bg, #eff6ff);
    color: var(--color-info-text, #1e40af);
}

.acct-card__header-icon--notif[b-77k0xauj60] {
    background: var(--color-warning-bg, #fffbeb);
    color: var(--color-warning-text, #b45309);
}

.acct-card__header-icon--appearance[b-77k0xauj60] {
    background: #f5f3ff;
    color: #7c3aed;
}

.acct-card__title[b-77k0xauj60] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    margin: 0 0 0.125rem;
    line-height: var(--lh-tight);
}

.acct-card__desc[b-77k0xauj60] {
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Alert Banners ── */
.acct-alert[b-77k0xauj60] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 1.5rem;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    animation: acct-alert-in-b-77k0xauj60 0.25s var(--ease-out);
    border-bottom: 1px solid transparent;
}

@keyframes acct-alert-in-b-77k0xauj60 {
    from { opacity: 0; transform: translateY(-0.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

.acct-alert--success[b-77k0xauj60] {
    background: var(--color-success-bg, #ecfdf5);
    color: var(--color-success-text, #065f46);
    border-bottom-color: var(--color-success-border, #a7f3d0);
}

.acct-alert--error[b-77k0xauj60] {
    background: var(--color-error-bg, rgba(239, 68, 68, 0.12));
    color: var(--color-error-text, #dc2626);
    border-bottom-color: var(--color-error-border, #fca5a5);
}

.acct-alert__dismiss[b-77k0xauj60] {
    margin-inline-start: auto;
    background: none;
    border: none;
    color: inherit;
    opacity: 0.6;
    cursor: pointer;
    padding: 0.25rem;
    border-radius: var(--radius-sm, 0.375rem);
    display: flex;
    align-items: center;
}

.acct-alert__dismiss:hover[b-77k0xauj60] {
    opacity: 1;
}

/* ── Form ── */
.acct-form[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
}

.acct-form__fields[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
}

.acct-form__footer[b-77k0xauj60] {
    display: flex;
    gap: 0.625rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--color-border-light, #f1f5f9);
    background: var(--color-bg-subtle, #f8fafc);
    border-radius: 0 0 var(--radius-card, 1.25rem) var(--radius-card, 1.25rem);
}

/* ── Field ── */
.acct-field[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.acct-field__label[b-77k0xauj60] {
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary);
}

.acct-field__hint[b-77k0xauj60] {
    font-size: var(--text-2xs, 0.625rem);
    color: var(--color-text-muted);
    margin: 0 0 0.25rem;
}

.acct-field__input-wrap[b-77k0xauj60] {
    position: relative;
    display: flex;
    align-items: center;
}

.acct-field__input[b-77k0xauj60] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    padding-inline-end: 2.75rem;
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-strong);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
    transition: border-color var(--duration-fast), box-shadow var(--duration-fast);
}

.acct-field__input:focus[b-77k0xauj60] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring, rgba(37, 99, 235, 0.18));
}

.acct-field__input[b-77k0xauj60]::placeholder {
    color: var(--color-text-faint);
}

.acct-field__select[b-77k0xauj60] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-text-strong);
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
    cursor: pointer;
    transition: border-color var(--duration-fast), box-shadow var(--duration-fast);
}

.acct-field__select:focus[b-77k0xauj60] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring, rgba(37, 99, 235, 0.18));
}

.acct-field__toggle[b-77k0xauj60] {
    position: absolute;
    inset-inline-end: 0.5rem;
    background: none;
    border: none;
    color: var(--color-text-muted);
    cursor: pointer;
    padding: 0.25rem;
    border-radius: var(--radius-sm, 0.375rem);
    display: flex;
    align-items: center;
}

.acct-field__toggle:hover[b-77k0xauj60] {
    color: var(--color-text-strong);
}

.acct-field__error[b-77k0xauj60] {
    font-size: var(--text-2xs, 0.625rem);
    color: var(--color-error-text, #dc2626);
}

/* ── Password Requirements ── */
.acct-pw-rules[b-77k0xauj60] {
    background: var(--color-bg-subtle, #f8fafc);
    border: 1px solid var(--color-border-light, #f1f5f9);
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.75rem 1rem;
    margin-top: 0.25rem;
}

.acct-pw-rules__title[b-77k0xauj60] {
    font-size: var(--text-2xs, 0.625rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary);
    margin: 0 0 0.5rem;
}

.acct-pw-rules__list[b-77k0xauj60] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.acct-pw-rule[b-77k0xauj60] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-2xs, 0.625rem);
    transition: color var(--duration-fast);
}

.acct-pw-rule--pass[b-77k0xauj60] {
    color: var(--color-success-text, #065f46);
}

.acct-pw-rule--fail[b-77k0xauj60] {
    color: var(--color-text-muted);
}

/* ── Toggle Group ── */
.acct-toggle-group[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    padding: 0;
}

.acct-toggle[b-77k0xauj60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    transition: background var(--duration-fast);
}

.acct-toggle:last-child[b-77k0xauj60] {
    border-bottom: none;
}

.acct-toggle:hover[b-77k0xauj60] {
    background: var(--color-bg-subtle);
}

.acct-toggle__info[b-77k0xauj60] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    min-width: 0;
}

.acct-toggle__icon[b-77k0xauj60] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md, 0.5rem);
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
    flex-shrink: 0;
}

.acct-toggle__label[b-77k0xauj60] {
    display: block;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    margin-bottom: 0.0625rem;
}

.acct-toggle__desc[b-77k0xauj60] {
    display: block;
    font-size: var(--text-2xs, 0.625rem);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed, 1.65);
}

/* ── Switch ── */
.acct-switch[b-77k0xauj60] {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    flex-shrink: 0;
}

.acct-switch input[type="checkbox"][b-77k0xauj60] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.acct-switch__slider[b-77k0xauj60] {
    width: 2.75rem;
    height: 1.5rem;
    background: var(--color-border);
    border-radius: var(--radius-pill, 9999px);
    position: relative;
    transition: background 0.2s var(--ease-default);
}

.acct-switch__slider[b-77k0xauj60]::after {
    content: "";
    position: absolute;
    top: 0.1875rem;
    inset-inline-start: 0.1875rem;
    width: 1.125rem;
    height: 1.125rem;
    background: white;
    border-radius: 50%;
    transition: transform 0.2s var(--ease-default);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
}

.acct-switch input:checked + .acct-switch__slider[b-77k0xauj60] {
    background: var(--color-primary, #2563eb);
}

.acct-switch input:checked + .acct-switch__slider[b-77k0xauj60]::after {
    transform: translateX(-1.25rem);
}

[dir="ltr"] .acct-switch input:checked + .acct-switch__slider[b-77k0xauj60]::after {
    transform: translateX(1.25rem);
}

.acct-switch input:focus-visible + .acct-switch__slider[b-77k0xauj60] {
    box-shadow: 0 0 0 3px var(--color-primary-ring, rgba(37, 99, 235, 0.18));
}

/* ── Theme Picker ── */
.acct-theme-picker[b-77k0xauj60] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.acct-theme-option[b-77k0xauj60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.acct-theme-option input[type="radio"][b-77k0xauj60] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.acct-theme-option__preview[b-77k0xauj60] {
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: var(--radius-md, 0.5rem);
    border: 2px solid var(--color-border);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: border-color var(--duration-fast), box-shadow var(--duration-fast);
}

.acct-theme-option--active .acct-theme-option__preview[b-77k0xauj60] {
    border-color: var(--color-primary, #2563eb);
    box-shadow: 0 0 0 3px var(--color-primary-ring, rgba(37, 99, 235, 0.18));
}

.acct-theme-option__preview--light[b-77k0xauj60] {
    background: #ffffff;
}

.acct-theme-option__preview--dark[b-77k0xauj60] {
    background: #1e293b;
}

.acct-theme-option__preview--system[b-77k0xauj60] {
    background: linear-gradient(135deg, #ffffff 50%, #1e293b 50%);
}

.acct-theme-option__bar[b-77k0xauj60] {
    height: 20%;
    width: 100%;
}

.acct-theme-option__preview--light .acct-theme-option__bar[b-77k0xauj60] {
    background: #f1f5f9;
    border-bottom: 1px solid #e2e8f0;
}

.acct-theme-option__preview--dark .acct-theme-option__bar[b-77k0xauj60] {
    background: #0f172a;
    border-bottom: 1px solid #334155;
}

.acct-theme-option__preview--system .acct-theme-option__bar[b-77k0xauj60] {
    background: linear-gradient(90deg, #f1f5f9 50%, #0f172a 50%);
}

.acct-theme-option__lines[b-77k0xauj60] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.1875rem;
    padding: 0.375rem;
}

.acct-theme-option__lines span[b-77k0xauj60] {
    height: 0.125rem;
    border-radius: 1px;
}

.acct-theme-option__preview--light .acct-theme-option__lines span[b-77k0xauj60] {
    background: #e2e8f0;
}

.acct-theme-option__preview--light .acct-theme-option__lines span:first-child[b-77k0xauj60] {
    width: 70%;
    background: #cbd5e1;
}

.acct-theme-option__preview--dark .acct-theme-option__lines span[b-77k0xauj60] {
    background: #334155;
}

.acct-theme-option__preview--dark .acct-theme-option__lines span:first-child[b-77k0xauj60] {
    width: 70%;
    background: #475569;
}

.acct-theme-option__preview--system .acct-theme-option__lines span[b-77k0xauj60] {
    background: linear-gradient(90deg, #e2e8f0 50%, #334155 50%);
}

.acct-theme-option__label[b-77k0xauj60] {
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-muted);
    transition: color var(--duration-fast);
}

.acct-theme-option--active .acct-theme-option__label[b-77k0xauj60] {
    color: var(--color-primary, #2563eb);
    font-weight: var(--fw-semibold, 600);
}

/* ═══════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════ */
@media (max-width: 768px) {
    .acct-layout[b-77k0xauj60] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .acct-sidebar[b-77k0xauj60] {
        position: static;
    }

    .acct-sidebar__nav[b-77k0xauj60] {
        flex-direction: row;
        overflow-x: auto;
        gap: 0.25rem;
    }

    .acct-sidebar__nav-item[b-77k0xauj60] {
        flex-direction: column;
        align-items: center;
        text-align: center;
        min-width: 5rem;
        padding: 0.625rem 0.5rem;
    }

    .acct-sidebar__nav-desc[b-77k0xauj60] {
        display: none;
    }

    .acct-card__header[b-77k0xauj60] {
        padding: 1rem 1.25rem;
    }

    .acct-form__fields[b-77k0xauj60] {
        padding: 1rem 1.25rem;
    }

    .acct-form__footer[b-77k0xauj60] {
        padding: 0.875rem 1.25rem;
    }

    .acct-toggle[b-77k0xauj60] {
        padding: 0.875rem 1.25rem;
    }

    .acct-theme-picker[b-77k0xauj60] {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
}
/* /Modules/Settings/Authorization/Pages/RolePermissions/RolePermissions.razor.rz.scp.css */
.zimam-role-permissions[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 100%;
    padding: 0;
    color: var(--color-text);
}

.zimam-role-permissions__header[b-gg01fyg9nm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.zimam-role-permissions__header-text[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
}

.zimam-role-permissions__header-actions[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.zimam-role-permissions__title[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
}

.zimam-role-permissions__subtitle[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-md);
    line-height: var(--lh-relaxed);
}

.zimam-role-permissions__primary-btn[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding-inline: 1rem;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-text-strong);
    color: var(--color-surface);
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    font-family: inherit;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__primary-btn:hover:not(:disabled)[b-gg01fyg9nm] {
    background: var(--color-text-secondary);
}

.zimam-role-permissions__primary-btn:focus-visible[b-gg01fyg9nm] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-role-permissions__primary-btn:disabled[b-gg01fyg9nm] {
    cursor: not-allowed;
    opacity: 0.55;
}

.zimam-role-permissions__inspector-actions[b-gg01fyg9nm],
.zimam-role-permissions__pager[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.zimam-role-permissions__button[b-gg01fyg9nm],
.zimam-role-permissions__icon-button[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    min-height: 2.125rem;
    padding-block: 0.5rem;
    padding-inline: 0.875rem;
    transition: background-color var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default),
        transform var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__button:active[b-gg01fyg9nm],
.zimam-role-permissions__icon-button:active[b-gg01fyg9nm] {
    transform: scale(0.98);
}

.zimam-role-permissions__button:disabled[b-gg01fyg9nm],
.zimam-role-permissions__icon-button:disabled[b-gg01fyg9nm] {
    cursor: not-allowed;
    opacity: 0.55;
    transform: none;
}

.zimam-role-permissions__button--soft[b-gg01fyg9nm],
.zimam-role-permissions__icon-button[b-gg01fyg9nm] {
    background: var(--color-surface);
    color: var(--color-text-secondary);
}

.zimam-role-permissions__button--soft:hover:not(:disabled)[b-gg01fyg9nm],
.zimam-role-permissions__icon-button:hover:not(:disabled)[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-role-permissions__button--dark[b-gg01fyg9nm] {
    background: var(--color-text-strong);
    border-color: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-role-permissions__button--dark:hover:not(:disabled)[b-gg01fyg9nm] {
    background: var(--color-text);
    border-color: var(--color-text);
}

.zimam-role-permissions__button--danger[b-gg01fyg9nm] {
    background: var(--color-error-bg);
    border-color: var(--color-error-border);
    color: var(--color-error-text);
}

.zimam-role-permissions__button--danger:hover:not(:disabled)[b-gg01fyg9nm] {
    background: var(--color-hold-bg);
}

.zimam-role-permissions__section[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.zimam-role-permissions__role-detail[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.zimam-role-permissions__back-row[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zimam-role-permissions__back-btn[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    background: transparent;
    border: 0;
    color: var(--color-text-muted);
    cursor: pointer;
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    padding: 0.375rem 0;
    transition: color var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__back-btn:hover[b-gg01fyg9nm] {
    color: var(--color-text-strong);
}

.zimam-role-permissions__back-btn:focus-visible[b-gg01fyg9nm] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-role-permissions__identity-pane[b-gg01fyg9nm],
.zimam-role-permissions__permissions-pane[b-gg01fyg9nm],
.zimam-role-permissions__role-employees-pane[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-block: 0.875rem;
}

.zimam-role-permissions__identity-pane .zimam-role-permissions__details-form[b-gg01fyg9nm] {
    max-width: 32rem;
}

.zimam-role-permissions__pane-summary[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.zimam-role-permissions__pane-summary p[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-role-permissions__pane-actions[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--color-border-light);
}

.zimam-role-permissions__tab-dot[b-gg01fyg9nm] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--color-warning, #f59e0b);
    margin-inline-start: 0.125rem;
}

.zimam-role-permissions__permission-editor--detail[b-gg01fyg9nm] {
    grid-template-columns: 18rem minmax(0, 1fr);
}

.zimam-role-permissions__toggle-row[b-gg01fyg9nm] {
    flex-direction: row !important;
    align-items: center;
}

.zimam-role-permissions__toggle-row input[b-gg01fyg9nm] {
    accent-color: var(--color-text-strong);
    width: 1.125rem;
    height: 1.125rem;
}

.zimam-role-permissions__top-tabs[b-gg01fyg9nm],
.zimam-role-permissions__inner-tabs[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-role-permissions__top-tab[b-gg01fyg9nm],
.zimam-role-permissions__inner-tab[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border: 0;
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 500;
    padding: 0.75rem 0.25rem;
    margin: 0;
    margin-bottom: -1px;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    transition: color var(--duration-fast) var(--ease-default),
        border-bottom-color var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__top-tab:hover[b-gg01fyg9nm],
.zimam-role-permissions__inner-tab:hover[b-gg01fyg9nm] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-role-permissions__top-tab--active[b-gg01fyg9nm],
.zimam-role-permissions__inner-tab--active[b-gg01fyg9nm] {
    color: var(--color-text-strong);
    font-weight: 600;
    border-bottom-color: var(--color-text-strong);
}

.zimam-role-permissions__top-tab--active:hover[b-gg01fyg9nm],
.zimam-role-permissions__inner-tab--active:hover[b-gg01fyg9nm] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.zimam-role-permissions__top-tab .zimam-tab-badge[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg);
    color: var(--color-text-secondary);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-role-permissions__top-tab--active .zimam-tab-badge[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-role-permissions__toolbar[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-block: 0.875rem;
}

.zimam-role-permissions__search[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: min(24rem, 100%);
    border: 1px solid var(--color-border-hover);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-muted);
    padding-inline: 0.625rem;
}

.zimam-role-permissions__search input[b-gg01fyg9nm] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--color-text);
    font: inherit;
    font-size: var(--text-sm);
    padding-block: 0.5rem;
}

.zimam-role-permissions__employee-grid[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(24rem, 0.75fr);
    min-height: 42rem;
}

.zimam-role-permissions__role-list[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    min-height: 32rem;
}

.zimam-role-permissions__panel-flat[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    overflow: hidden;
}

.zimam-role-permissions__table-wrap[b-gg01fyg9nm] {
    overflow: auto;
}

.zimam-role-permissions__data-table[b-gg01fyg9nm] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.zimam-role-permissions__data-table th[b-gg01fyg9nm] {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-bold);
    text-align: start;
    padding: 0.875rem 1rem;
    white-space: nowrap;
}

.zimam-role-permissions__data-table td[b-gg01fyg9nm] {
    border-top: 1px solid var(--color-border-light);
    color: var(--color-text);
    font-size: var(--text-sm);
    padding: 0.875rem 1rem;
    vertical-align: middle;
}

.zimam-role-permissions__data-table tbody tr[b-gg01fyg9nm] {
    cursor: default;
    transition: background-color var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__data-table--clickable tbody tr[b-gg01fyg9nm] {
    cursor: pointer;
}

.zimam-role-permissions__data-table--clickable tbody tr:focus-visible[b-gg01fyg9nm] {
    outline: 2px solid var(--color-primary);
    outline-offset: -2px;
}

.zimam-role-permissions__data-table tbody tr:hover[b-gg01fyg9nm],
.zimam-role-permissions__data-row--active[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
}

.zimam-role-permissions__row-affordance[b-gg01fyg9nm] {
    width: 2.5rem;
    text-align: center;
    color: var(--color-text-muted);
    opacity: 0.6;
    transition: opacity var(--duration-fast) var(--ease-default), color var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__data-table--clickable tbody tr:hover .zimam-role-permissions__row-affordance[b-gg01fyg9nm],
.zimam-role-permissions__data-table--clickable tbody tr:focus-visible .zimam-role-permissions__row-affordance[b-gg01fyg9nm] {
    opacity: 1;
    color: var(--color-primary);
}

.zimam-role-permissions__empty-state[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0.75rem;
    padding: 4rem 2rem;
    color: var(--color-text-muted);
}

.zimam-role-permissions__empty-state svg[b-gg01fyg9nm] {
    width: 3rem;
    height: 3rem;
    color: var(--color-text-subtle);
}

.zimam-role-permissions__empty-state h3[b-gg01fyg9nm] {
    font-size: var(--text-base);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
}

.zimam-role-permissions__empty-state p[b-gg01fyg9nm] {
    font-size: var(--text-sm);
    margin: 0;
    max-width: 28rem;
}

.zimam-role-permissions__role-name-cell[b-gg01fyg9nm],
.zimam-role-permissions__person[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.zimam-role-permissions__person-text[b-gg01fyg9nm] {
    display: grid;
    gap: 0.125rem;
    min-width: 0;
}

.zimam-role-permissions__role-title[b-gg01fyg9nm],
.zimam-role-permissions__person-name[b-gg01fyg9nm] {
    display: block;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-role-permissions__role-code[b-gg01fyg9nm],
.zimam-role-permissions__person-meta[b-gg01fyg9nm],
.zimam-role-permissions__muted[b-gg01fyg9nm] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
}

.zimam-role-permissions__role-dot[b-gg01fyg9nm] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: var(--radius-pill);
    background: var(--color-border-hover);
    box-shadow: 0 0 0 0.25rem var(--color-bg-subtle);
}

.zimam-role-permissions__role-dot--system[b-gg01fyg9nm] {
    background: var(--color-primary);
}

.zimam-role-permissions__avatar[b-gg01fyg9nm] {
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
    flex-shrink: 0;
}

.zimam-role-permissions__avatar--lg[b-gg01fyg9nm] {
    width: 2.75rem;
    height: 2.75rem;
}

.zimam-role-permissions__chips[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.zimam-role-permissions__chip[b-gg01fyg9nm],
.zimam-role-permissions__status[b-gg01fyg9nm],
.zimam-role-permissions__role-badge[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--color-border-hover);
    border-radius: var(--radius-pill);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    padding-block: 0.25rem;
    padding-inline: 0.625rem;
    white-space: nowrap;
}

.zimam-role-permissions__chip--count[b-gg01fyg9nm] {
    min-width: 1.75rem;
    justify-content: center;
    padding-inline: 0.5rem;
}

.zimam-role-permissions__status--active[b-gg01fyg9nm] {
    border-color: var(--color-success-border);
    background: var(--color-success-bg);
    color: var(--color-success-text);
}

.zimam-role-permissions__inspector[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    background: var(--color-bg-subtle);
    padding: 1rem;
}

.zimam-role-permissions__empty-inspector[b-gg01fyg9nm] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    color: var(--color-text-muted);
    text-align: center;
    padding: 2rem;
}

.zimam-role-permissions__empty-inspector h2[b-gg01fyg9nm],
.zimam-role-permissions__inspector-head h2[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-xl);
    font-weight: var(--fw-bold);
}

.zimam-role-permissions__empty-inspector p[b-gg01fyg9nm],
.zimam-role-permissions__inspector-head p[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.zimam-role-permissions__inspector-head[b-gg01fyg9nm] {
    display: flex;
    align-items: flex-start;
    gap: 0.875rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    padding: 1rem;
}

.zimam-role-permissions__inner-tabs[b-gg01fyg9nm] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
}

.zimam-role-permissions__permission-editor[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: 16rem minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    min-height: 0;
}

.zimam-role-permissions__permission-rail[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.zimam-role-permissions__permission-rail-item[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    background: transparent;
    color: var(--color-text-secondary);
    cursor: pointer;
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    min-height: 2.75rem;
    padding: 0.75rem 0.875rem;
    text-align: start;
}

.zimam-role-permissions__permission-rail-item:hover[b-gg01fyg9nm],
.zimam-role-permissions__permission-rail-item--active[b-gg01fyg9nm] {
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-role-permissions__matrix[b-gg01fyg9nm],
.zimam-role-permissions__role-checklist[b-gg01fyg9nm],
.zimam-role-permissions__effective-card[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    padding: 1rem;
}

.zimam-role-permissions__details-form[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.zimam-role-permissions__permission-section h4[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-bold);
}

.zimam-role-permissions__matrix[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border: 0;
    background: transparent;
    padding: 0;
    min-width: 0;
}

.zimam-role-permissions__divider[b-gg01fyg9nm] {
    height: 1px;
    width: 100%;
    border: 0;
    background: var(--color-border-light, #f1f5f9);
    margin: 0 0 1rem;
}

.zimam-role-permissions__permission-section[b-gg01fyg9nm] {
    --permission-action-column: minmax(19rem, 1fr);
    --permission-scope-column: 6rem;
    --permission-matrix-min-width: 43rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg, 0.75rem);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    overflow: auto;
}

.zimam-role-permissions__permission-section:first-of-type[b-gg01fyg9nm] {
    border-top: 1px solid var(--color-border);
    padding-top: 0;
}

.zimam-role-permissions__permission-section-head[b-gg01fyg9nm] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.125rem;
    background: var(--color-bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

.zimam-role-permissions__permission-section-text[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.zimam-role-permissions__permission-section-desc[b-gg01fyg9nm] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-regular);
    line-height: var(--lh-normal);
}

.zimam-role-permissions__permission-section-count[b-gg01fyg9nm] {
    flex-shrink: 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    background: var(--color-surface);
    border: 1px solid var(--color-border-light, #f1f5f9);
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.125rem 0.5rem;
    line-height: 1.5;
}

.zimam-role-permissions__permission-section-rows[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
}

.zimam-role-permissions__permission-scope-head[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: var(--permission-action-column) repeat(4, var(--permission-scope-column));
    align-items: stretch;
    gap: 0;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    background: linear-gradient(180deg, var(--color-surface) 0%, var(--color-bg-subtle) 100%);
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    min-width: var(--permission-matrix-min-width);
}

.zimam-role-permissions__permission-scope-head span[b-gg01fyg9nm] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    min-height: 2.625rem;
    padding-block: 0.5rem;
    padding-inline: 1.125rem;
}

.zimam-role-permissions__permission-scope-head span:first-child[b-gg01fyg9nm] {
    padding-inline-start: 1.125rem;
}

.zimam-role-permissions__permission-scope-head span:not(:first-child)[b-gg01fyg9nm] {
    justify-content: center;
    border-inline-start: 1px solid var(--color-border-light, #f1f5f9);
    padding-inline: 0.25rem;
    text-align: center;
}

.zimam-role-permissions__permission-row[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: var(--permission-action-column) repeat(4, var(--permission-scope-column));
    align-items: stretch;
    gap: 0;
    border: 0;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    border-radius: 0;
    background: var(--color-surface);
    min-width: var(--permission-matrix-min-width);
    min-height: 4rem;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__permission-section-rows .zimam-role-permissions__permission-row:last-child[b-gg01fyg9nm] {
    border-bottom: 0;
}

.zimam-role-permissions__permission-row:hover[b-gg01fyg9nm] {
    border-color: var(--color-border-light, #f1f5f9);
    background: var(--color-bg-subtle);
}

.zimam-role-permissions__permission-row--disabled[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
}

.zimam-role-permissions__permission-row--disabled:hover[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
}

.zimam-role-permissions__permission-row--superseded[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
}

.zimam-role-permissions__permission-row > div:first-child[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding-block: 0.875rem;
    padding-inline: 1.125rem;
}

.zimam-role-permissions__permission-row span[b-gg01fyg9nm] {
    display: block;
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
}

.zimam-role-permissions__permission-row small[b-gg01fyg9nm] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    line-height: var(--lh-normal);
}

.zimam-role-permissions__permission-row-hint[b-gg01fyg9nm] {
    display: block;
    margin-top: 0.25rem;
    color: var(--color-warning-text) !important;
    font-weight: var(--fw-semibold);
}

.zimam-role-permissions__permission-toggles[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
}

.zimam-role-permissions__permission-scope-cells[b-gg01fyg9nm] {
    display: contents;
}

.zimam-role-permissions__scope-cell[b-gg01fyg9nm] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    justify-self: stretch;
    inline-size: 100%;
    min-height: 100%;
    border-inline-start: 1px solid var(--color-border-light, #f1f5f9);
}

.zimam-role-permissions__scope-cell--disabled[b-gg01fyg9nm] {
    cursor: not-allowed;
}

.zimam-role-permissions__scope-unavailable[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px dashed var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg-subtle);
    color: var(--color-text-faint);
    font-size: var(--text-xs);
}

.zimam-role-permissions__checkbox-label[b-gg01fyg9nm] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.zimam-role-permissions__checkbox-label:not(.zimam-role-permissions__scope-cell)[b-gg01fyg9nm] {
    width: 1.125rem;
    height: 1.125rem;
}

.zimam-role-permissions__checkbox-label--disabled[b-gg01fyg9nm] {
    cursor: not-allowed;
}

.zimam-role-permissions__checkbox[b-gg01fyg9nm] {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.zimam-role-permissions__checkbox-visual[b-gg01fyg9nm],
.zimam-role-permissions__checkbox-placeholder[b-gg01fyg9nm] {
    position: relative;
    display: inline-block;
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px solid var(--color-border-hover);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    transition: border-color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-role-permissions__checkbox-placeholder[b-gg01fyg9nm] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-light);
    border-style: dashed;
    opacity: 0.5;
}

.zimam-role-permissions__checkbox-label:hover .zimam-role-permissions__checkbox-visual[b-gg01fyg9nm] {
    border-color: var(--color-text-strong);
}

.zimam-role-permissions__checkbox:checked + .zimam-role-permissions__checkbox-visual[b-gg01fyg9nm] {
    border-color: var(--color-text-strong);
    background: var(--color-text-strong);
}

.zimam-role-permissions__checkbox:checked + .zimam-role-permissions__checkbox-visual[b-gg01fyg9nm]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.32rem;
    height: 0.56rem;
    border-right: 2px solid var(--color-surface);
    border-bottom: 2px solid var(--color-surface);
    transform: translate(-50%, -58%) rotate(45deg);
}

.zimam-role-permissions__checkbox:focus-visible + .zimam-role-permissions__checkbox-visual[b-gg01fyg9nm] {
    outline: 2px solid var(--color-text-strong);
    outline-offset: 2px;
}

.zimam-role-permissions__checkbox:disabled + .zimam-role-permissions__checkbox-visual[b-gg01fyg9nm] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* RenderFragment-generated checkbox markup does not receive the component scope attribute. */
[b-gg01fyg9nm] .zimam-role-permissions__scope-cell {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    justify-self: stretch;
    inline-size: 100%;
    min-height: 100%;
    border-inline-start: 1px solid var(--color-border-light, #f1f5f9);
}

[b-gg01fyg9nm] .zimam-role-permissions__scope-cell--disabled {
    cursor: not-allowed;
}

[b-gg01fyg9nm] .zimam-role-permissions__scope-unavailable {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px dashed var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg-subtle);
    color: var(--color-text-faint);
    font-size: var(--text-xs);
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-label {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-label:not(.zimam-role-permissions__scope-cell) {
    width: 1.125rem;
    height: 1.125rem;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-label--disabled {
    cursor: not-allowed;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-visual,
[b-gg01fyg9nm] .zimam-role-permissions__checkbox-placeholder {
    position: relative;
    display: inline-block;
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px solid var(--color-border-hover);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    transition: border-color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-placeholder {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-light);
    border-style: dashed;
    opacity: 0.5;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox-label:hover .zimam-role-permissions__checkbox-visual {
    border-color: var(--color-text-strong);
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox:checked + .zimam-role-permissions__checkbox-visual {
    border-color: var(--color-text-strong);
    background: var(--color-text-strong);
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox:checked + .zimam-role-permissions__checkbox-visual::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.32rem;
    height: 0.56rem;
    border-right: 2px solid var(--color-surface);
    border-bottom: 2px solid var(--color-surface);
    transform: translate(-50%, -58%) rotate(45deg);
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox:focus-visible + .zimam-role-permissions__checkbox-visual {
    outline: 2px solid var(--color-text-strong);
    outline-offset: 2px;
}

[b-gg01fyg9nm] .zimam-role-permissions__checkbox:disabled + .zimam-role-permissions__checkbox-visual {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-role-permissions__role-option[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    cursor: pointer;
    padding: 0.75rem;
}

.zimam-role-permissions__role-option input[b-gg01fyg9nm] {
    accent-color: var(--color-text-strong);
}

.zimam-role-permissions__role-option-body[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.zimam-role-permissions__role-option-body strong[b-gg01fyg9nm] {
    color: var(--color-text-strong);
    font-size: var(--text-sm);
}

.zimam-role-permissions__role-option-body small[b-gg01fyg9nm],
.zimam-role-permissions__effective-label[b-gg01fyg9nm],
.zimam-role-permissions__dirty-label[b-gg01fyg9nm] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-role-permissions__details-form label[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
}

.zimam-role-permissions__details-form input[b-gg01fyg9nm],
.zimam-role-permissions__details-form textarea[b-gg01fyg9nm] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    font: inherit;
    font-size: var(--text-sm);
    padding: 0.625rem 0.75rem;
}

.zimam-role-permissions__details-form textarea[b-gg01fyg9nm] {
    min-height: 5rem;
    resize: vertical;
}

.zimam-role-permissions__field-error[b-gg01fyg9nm] {
    color: var(--color-danger);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    margin-top: 0.125rem;
}

.zimam-role-permissions__field-hint[b-gg01fyg9nm] {
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-regular);
    margin-top: 0.125rem;
}

.zimam-role-permissions__pager[b-gg01fyg9nm] {
    justify-content: flex-end;
    border-top: 1px solid var(--color-border-light);
    padding: 0.875rem 1rem;
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
}

@media (max-width: 1200px) {
    .zimam-role-permissions__employee-grid[b-gg01fyg9nm] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .zimam-role-permissions__header[b-gg01fyg9nm],
    .zimam-role-permissions__toolbar[b-gg01fyg9nm],
    .zimam-role-permissions__pane-actions[b-gg01fyg9nm],
    .zimam-role-permissions__inspector-actions[b-gg01fyg9nm] {
        align-items: stretch;
        display: flex;
        flex-direction: column;
    }

    .zimam-role-permissions__top-tabs[b-gg01fyg9nm],
    .zimam-role-permissions__inner-tabs[b-gg01fyg9nm] {
        overflow-x: auto;
    }

    .zimam-role-permissions__permission-editor[b-gg01fyg9nm],
    .zimam-role-permissions__permission-editor--detail[b-gg01fyg9nm] {
        grid-template-columns: 1fr;
    }
}


/* ── Loading skeletons (rp-c4) ── */
.zimam-role-permissions__skeleton[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0.5rem 0;
}

.zimam-role-permissions__skeleton-tabs[b-gg01fyg9nm] {
    display: flex;
    gap: 0.5rem;
}

.zimam-role-permissions__skeleton-card[b-gg01fyg9nm] {
    background: var(--zimam-surface, #fff);
    border: 1px solid var(--zimam-border-subtle, #e5e7eb);
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.zimam-role-permissions__skeleton-table[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.zimam-role-permissions__skeleton-table-row[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: 2.25rem 1fr auto auto 1rem;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0;
    border-bottom: 1px dashed var(--zimam-border-subtle, #e5e7eb);
}

.zimam-role-permissions__skeleton-table-row:last-child[b-gg01fyg9nm] {
    border-bottom: 0;
}

.zimam-role-permissions__skeleton-table-cell[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.zimam-role-permissions__skeleton-detail-hero[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem 0;
}

.zimam-role-permissions__skeleton-detail-grid[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(0, 2fr);
    gap: 1rem;
}

@media (max-width: 960px) {
    .zimam-role-permissions__skeleton-detail-grid[b-gg01fyg9nm] {
        grid-template-columns: 1fr;
    }
}

.zimam-role-permissions__skeleton-matrix[b-gg01fyg9nm] {
    display: grid;
    grid-template-columns: 12rem 1fr;
    gap: 1rem;
}

.zimam-role-permissions__skeleton-rail[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-role-permissions__skeleton-matrix-body[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.zimam-role-permissions__skeleton-row[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px dashed var(--zimam-border-subtle, #e5e7eb);
}

.zimam-role-permissions__skeleton-row:last-child[b-gg01fyg9nm] {
    border-bottom: 0;
}

.zimam-role-permissions__skeleton-row > div:first-child[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    flex: 1;
}

.zimam-role-permissions__skeleton-toggles[b-gg01fyg9nm] {
    display: flex;
    gap: 0.5rem;
}

/* Shimmer base */
.zimam-rp-skeleton[b-gg01fyg9nm] {
    background: linear-gradient(90deg, #f1f3f5 0%, #e9ecef 50%, #f1f3f5 100%);
    background-size: 200% 100%;
    border-radius: 6px;
    animation: zimam-rp-shimmer-b-gg01fyg9nm 1.4s ease-in-out infinite;
}

@keyframes zimam-rp-shimmer-b-gg01fyg9nm {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
    .zimam-rp-skeleton[b-gg01fyg9nm] { animation: none; }
}

.zimam-rp-skeleton--title[b-gg01fyg9nm]    { height: 1.25rem; width: 60%; }
.zimam-rp-skeleton--text[b-gg01fyg9nm]     { height: 0.75rem; width: 80%; }
.zimam-rp-skeleton--label[b-gg01fyg9nm]    { height: 0.625rem; width: 40%; }
.zimam-rp-skeleton--input[b-gg01fyg9nm]    { height: 2.25rem; width: 100%; border-radius: 8px; }
.zimam-rp-skeleton--input.zimam-rp-skeleton--tall[b-gg01fyg9nm] { height: 4.5rem; }
.zimam-rp-skeleton--pill[b-gg01fyg9nm]     { height: 1rem; border-radius: 999px; }
.zimam-rp-skeleton--tab[b-gg01fyg9nm]      { height: 2rem; width: 7rem; border-radius: 999px; }
.zimam-rp-skeleton--rail-item[b-gg01fyg9nm]{ height: 2.25rem; border-radius: 8px; }
.zimam-rp-skeleton--row-title[b-gg01fyg9nm]{ height: 0.875rem; width: 60%; }
.zimam-rp-skeleton--row-sub[b-gg01fyg9nm]  { height: 0.625rem; width: 40%; }
.zimam-rp-skeleton--toggle[b-gg01fyg9nm]   { height: 1.25rem; width: 2.25rem; border-radius: 999px; }
.zimam-rp-skeleton--avatar[b-gg01fyg9nm]   { height: 2rem; width: 2rem; border-radius: 50%; }
.zimam-rp-skeleton--chip[b-gg01fyg9nm]     { height: 1rem; width: 4rem; border-radius: 999px; }
.zimam-rp-skeleton--badge[b-gg01fyg9nm]    { height: 1rem; width: 2.5rem; border-radius: 6px; }
.zimam-rp-skeleton--icon[b-gg01fyg9nm]     { height: 0.75rem; width: 0.75rem; border-radius: 50%; }


/* ==========================================================================
   Create-Role Drawer — B&W card-based design (mirrors task drawer language)
   24px padding, white surface, black borders/text, no color accents.
   ========================================================================== */

.zimam-create-role-drawer[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    direction: rtl;
    text-align: right;
    background: #ffffff;
    min-height: 100%;
}

/* Ensure inputs/textareas inside drawer cards never overflow the card width. */
.zimam-create-role-drawer *[b-gg01fyg9nm],
.zimam-create-role-drawer *[b-gg01fyg9nm]::before,
.zimam-create-role-drawer *[b-gg01fyg9nm]::after {
    box-sizing: border-box;
}

/* ── Card ────────────────────────────────────────────────────────────────── */
.zimam-create-role-card[b-gg01fyg9nm] {
    background: #ffffff;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
}

.zimam-create-role-card__head[b-gg01fyg9nm] {
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    background: #ffffff;
}

.zimam-create-role-card__title[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #000000;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.zimam-create-role-card__title[b-gg01fyg9nm]  svg {
    color: #000000;
}

.zimam-create-role-card__sub[b-gg01fyg9nm] {
    margin: 6px 0 0;
    font-size: 0.75rem;
    color: #4a4a4a;
    line-height: 1.6;
}

.zimam-create-role-card__body[b-gg01fyg9nm] {
    padding: 18px 20px 20px;
    background: #ffffff;
}

/* ── Form fields (B&W) ───────────────────────────────────────────────────── */
.zimam-create-role-field[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 14px;
}

.zimam-create-role-field:last-child[b-gg01fyg9nm] {
    margin-bottom: 0;
}

.zimam-create-role-field__label[b-gg01fyg9nm] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #000000;
    letter-spacing: 0.02em;
}

.zimam-create-role-field__label em[b-gg01fyg9nm] {
    font-style: normal;
    color: #000000;
    font-weight: 700;
    margin-inline-start: 2px;
}

.zimam-create-role-field__input[b-gg01fyg9nm] {
    width: 100%;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 0.875rem;
    font-family: inherit;
    color: #000000;
    background: #ffffff;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.zimam-create-role-field__input[b-gg01fyg9nm]::placeholder {
    color: #9a9a9a;
}

.zimam-create-role-field__input:focus[b-gg01fyg9nm] {
    border-color: #000000;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
}

.zimam-create-role-field__input:disabled[b-gg01fyg9nm] {
    background: #f4f4f4;
    color: #6b6b6b;
    cursor: not-allowed;
}

.zimam-create-role-field__input--mono[b-gg01fyg9nm] {
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    direction: ltr;
    text-align: left;
    letter-spacing: 0.02em;
}

.zimam-create-role-field__input--textarea[b-gg01fyg9nm] {
    resize: vertical;
    min-height: 76px;
    line-height: 1.6;
}

.zimam-create-role-field__hint[b-gg01fyg9nm] {
    font-size: 0.7rem;
    color: #4a4a4a;
    line-height: 1.6;
}

.zimam-create-role-field__hint code[b-gg01fyg9nm] {
    background: #f0f0f0;
    border: 1px solid #d4d4d4;
    border-radius: 3px;
    padding: 0 4px;
    font-size: 0.85em;
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

.zimam-create-role-field__error[b-gg01fyg9nm] {
    font-size: 0.7rem;
    color: #000000;
    font-weight: 600;
    background: #f0f0f0;
    border-inline-start: 3px solid #000000;
    padding: 6px 10px;
    border-radius: 4px;
    line-height: 1.5;
}

/* ── Steps list (numbered) ───────────────────────────────────────────────── */
.zimam-create-role-steps[b-gg01fyg9nm] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.zimam-create-role-steps li[b-gg01fyg9nm] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.zimam-create-role-steps__num[b-gg01fyg9nm] {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #000000;
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.zimam-create-role-steps__title[b-gg01fyg9nm] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 2px;
}

.zimam-create-role-steps__desc[b-gg01fyg9nm] {
    font-size: 0.75rem;
    color: #4a4a4a;
    line-height: 1.65;
}

/* ── Tips list (bulleted) ────────────────────────────────────────────────── */
.zimam-create-role-tips[b-gg01fyg9nm] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zimam-create-role-tips li[b-gg01fyg9nm] {
    position: relative;
    padding-inline-start: 18px;
    font-size: 0.78rem;
    color: #2a2a2a;
    line-height: 1.65;
}

.zimam-create-role-tips li[b-gg01fyg9nm]::before {
    content: "";
    position: absolute;
    inset-inline-start: 4px;
    top: 0.5rem;
    width: 6px;
    height: 6px;
    background: #000000;
    border-radius: 50%;
}

.zimam-create-role-tips li strong[b-gg01fyg9nm] {
    color: #000000;
    font-weight: 700;
}

/* Spinner alignment inside drawer primary button */
.zimam-create-role-drawer ~ * .zimam-drawer-btn--primary[b-gg01fyg9nm],
.zimam-drawer-btn--primary[b-gg01fyg9nm] {
}

/* Ensure gap between spinner and label inside our drawer/danger buttons. */
.zimam-role-permissions__button--danger[b-gg01fyg9nm],
.zimam-role-permissions__button--dark[b-gg01fyg9nm] {
    gap: 0.5rem;
}
/* ── Employees-tab inline assign/unassign UX ──────────────────────────── */
.zimam-role-permissions__role-employees-pane .zimam-role-permissions__toolbar[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zimam-role-permissions__filter-toggle[b-gg01fyg9nm] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    cursor: pointer;
    user-select: none;
}

.zimam-role-permissions__filter-toggle input[type="checkbox"][b-gg01fyg9nm] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--color-text-primary);
    cursor: pointer;
}

.zimam-role-permissions__assigned-count[b-gg01fyg9nm] {
    margin-inline-start: auto;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.zimam-role-permissions__assigned-count strong[b-gg01fyg9nm] {
    color: var(--color-text-primary);
    font-weight: var(--fw-semibold);
}

.zimam-role-permissions__action-col[b-gg01fyg9nm] {
    width: 8.5rem;
    text-align: end;
    white-space: nowrap;
}

.zimam-role-permissions__row-action[b-gg01fyg9nm] {
    min-width: 6rem;
    justify-content: center;
    gap: 0.4rem;
}

/* ── Assign-employees drawer ───────────────────────────────────────────── */
.zimam-assign-drawer[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    background: #ffffff;
}

.zimam-assign-drawer__search[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #111827;
    border-radius: 8px;
    padding: 6px 10px;
    background: #ffffff;
}

.zimam-assign-drawer__search-input[b-gg01fyg9nm] {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font: inherit;
    color: #111827;
    padding: 4px 6px;
}

.zimam-assign-drawer__search-btn[b-gg01fyg9nm] {
    border: 1px solid #111827;
    background: #111827;
    color: #ffffff;
    padding: 6px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.85rem;
}

.zimam-assign-drawer__search-btn:disabled[b-gg01fyg9nm] {
    opacity: 0.55;
    cursor: not-allowed;
}

.zimam-assign-drawer__list-body[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.zimam-assign-drawer__loading[b-gg01fyg9nm],
.zimam-assign-drawer__empty[b-gg01fyg9nm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 28px 12px;
    color: #6b7280;
    font-size: 0.9rem;
}

.zimam-assign-drawer__error[b-gg01fyg9nm] {
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 0.88rem;
}

.zimam-assign-drawer__select-all[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 4px;
    border-bottom: 1px dashed #e5e7eb;
}

.zimam-assign-drawer__select-all label[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.88rem;
    color: #111827;
}

.zimam-assign-drawer__selected-count[b-gg01fyg9nm] {
    font-size: 0.82rem;
    color: #111827;
    background: #f3f4f6;
    padding: 3px 10px;
    border-radius: 999px;
    font-weight: 600;
}

.zimam-assign-drawer__list[b-gg01fyg9nm] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 440px;
    overflow-y: auto;
}

.zimam-assign-drawer__row[b-gg01fyg9nm] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    background: #ffffff;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.zimam-assign-drawer__row:hover[b-gg01fyg9nm] {
    background: #f9fafb;
    border-color: #111827;
}

.zimam-assign-drawer__row--selected[b-gg01fyg9nm] {
    background: #f3f4f6;
    border-color: #111827;
}

.zimam-assign-drawer__row input[type=checkbox][b-gg01fyg9nm] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.zimam-assign-drawer__row-text[b-gg01fyg9nm] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
/* /Modules/Settings/CaseConfig/CaseConfig/CaseConfig.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Case & Task Configuration — Settings Page
   Integrates with .zimam-page--full floating card system.
   Page content lives INSIDE the standard ZIMAM floating card.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ── The inner layout: sidebar + content side-by-side ── */
.case-config__inner[b-xq6gmvyg4m] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

/* ── Content Area ── */
.case-config__content[b-xq6gmvyg4m] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    padding: 15px 2.5rem;
}

/* ── Content Header ── */
.case-config__header[b-xq6gmvyg4m] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--color-border-light);
    gap: 2rem;
}

.case-config__header-text[b-xq6gmvyg4m] {
    flex: 1;
}

.case-config__title[b-xq6gmvyg4m] {
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    letter-spacing: -0.01em;
}

.case-config__subtitle[b-xq6gmvyg4m] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin-top: 0.375rem;
    max-width: 36rem;
    line-height: var(--lh-relaxed);
}

/* ── Add Button ── */
.case-config__add-btn[b-xq6gmvyg4m] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding-inline: 1.25rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    transition: opacity var(--duration-fast) var(--ease-default), transform var(--duration-fast) var(--ease-default), box-shadow var(--duration-fast) var(--ease-default);
    white-space: nowrap;
    flex-shrink: 0;
}

.case-config__add-btn:hover[b-xq6gmvyg4m] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.case-config__add-btn:active[b-xq6gmvyg4m] {
    transform: translateY(0);
}

/* ── Table Area ── */
.case-config__table-area[b-xq6gmvyg4m] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.case-config__table-well[b-xq6gmvyg4m] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, 0.375rem);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    contain: layout;
}

.case-config__drawer-title-row[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.case-config__drawer-title-icon[b-xq6gmvyg4m] {
    color: var(--color-primary);
}

.case-config__table-scroll[b-xq6gmvyg4m] {
    flex: 1;
    min-height: 0;
}

.case-config__table-index-column[b-xq6gmvyg4m] {
    width: 3rem;
}

.case-config__table-actions-column[b-xq6gmvyg4m] {
    width: 7.5rem;
    text-align: center;
}

.case-config__table-actions[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
}

.zimam-table .case-config__table-action-button--danger[b-xq6gmvyg4m] {
    color: var(--color-error-text);
}

.zimam-table .case-config__table-action-button--danger:hover[b-xq6gmvyg4m] {
    color: var(--color-error-text);
    background: var(--color-error-bg);
}
.case-config__empty[b-xq6gmvyg4m] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    text-align: center;
    color: var(--color-text-faint);
}

.case-config__empty-text[b-xq6gmvyg4m] {
    font-size: var(--text-md);
    color: var(--color-text-muted);
    font-weight: var(--fw-medium);
}

.case-config__form-error[b-xq6gmvyg4m] {
    margin: 0.75rem 1rem;
}

.case-config__form-fieldset[b-xq6gmvyg4m] {
    padding: 1.5rem;
    gap: 0;
}

.case-config__required[b-xq6gmvyg4m] {
    color: var(--color-error-text);
    font-weight: var(--fw-bold);
    font-size: 1.1em;
    margin-inline-start: 0.125rem;
}

.case-config__settings-panel[b-xq6gmvyg4m] {
    max-width: 37.5rem;
    margin: 2rem;
}

.case-config__form-field--spaced[b-xq6gmvyg4m] {
    margin-top: 1.5rem;
}

.case-config__form-actions--spaced[b-xq6gmvyg4m] {
    margin-top: 2rem;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════
   Status Timeline — Batch Manage Drawer (Case & Task Statuses)
   Numbered steps, design-system colors only, deactivation support.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ── Batch drawer intro heading ── */
.status-batch-intro[b-xq6gmvyg4m] {
    padding: 0.875rem 0 0;
}

.status-batch-intro__title[b-xq6gmvyg4m] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    line-height: var(--lh-relaxed);
    margin: 0;
    padding: 0.625rem 0.875rem;
    background: var(--color-bg-subtle);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border-light);
}

.status-batch-intro__icon[b-xq6gmvyg4m] {
    flex-shrink: 0;
    color: var(--color-text-faint);
    margin-top: 0.125rem;
}

/* ── Dismissible tutorial tip ── */
.status-batch-tip[b-xq6gmvyg4m] {
    margin: 0.5rem 0 0;
    padding: 0.75rem 1rem;
    background: color-mix(in srgb, var(--color-primary, #2563eb) 6%, var(--color-surface));
    border: 1px solid color-mix(in srgb, var(--color-primary, #2563eb) 18%, var(--color-border));
    border-radius: var(--radius-lg);
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.status-batch-tip__content[b-xq6gmvyg4m] {
    flex: 1;
    min-width: 0;
}

.status-batch-tip__heading[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-primary, #2563eb);
    margin-bottom: 0.375rem;
}

.status-batch-tip__heading svg[b-xq6gmvyg4m],
[b-xq6gmvyg4m] .status-batch-tip__heading svg {
    color: var(--color-primary, #2563eb);
    flex-shrink: 0;
}

.status-batch-tip__list[b-xq6gmvyg4m] {
    margin: 0;
    padding-inline-start: 1.25rem;
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: var(--lh-relaxed);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.status-batch-tip__list strong[b-xq6gmvyg4m] {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.status-batch-tip__close[b-xq6gmvyg4m] {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    border-radius: var(--radius-md);
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-primary, #2563eb);
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid color-mix(in srgb, var(--color-primary, #2563eb) 28%, transparent);
    background: color-mix(in srgb, var(--color-primary, #2563eb) 8%, transparent);
    transition: color var(--duration-fast) var(--ease-out),
                background var(--duration-fast) var(--ease-out),
                border-color var(--duration-fast) var(--ease-out);
}

.status-batch-tip__close:hover[b-xq6gmvyg4m] {
    background: color-mix(in srgb, var(--color-primary, #2563eb) 14%, transparent);
    border-color: color-mix(in srgb, var(--color-primary, #2563eb) 45%, transparent);
}

.status-batch-tip__close:focus-visible[b-xq6gmvyg4m] {
    outline: 2px solid var(--color-primary, #2563eb);
    outline-offset: 2px;
}

/* ── Timeline action toolbar: count + expand/activate controls ── */
.status-timeline-toolbar[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.25rem 0.625rem;
    margin-top: 0.625rem;
}

.status-timeline-toolbar__count[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.status-timeline-toolbar__count-meta[b-xq6gmvyg4m] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-faint);
}

.status-timeline-toolbar__actions[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.status-timeline-toolbar__btn[b-xq6gmvyg4m] {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-secondary);
    white-space: nowrap;
    transition: color var(--duration-fast) var(--ease-out),
                background var(--duration-fast) var(--ease-out),
                border-color var(--duration-fast) var(--ease-out),
                box-shadow var(--duration-fast) var(--ease-out);
}

.status-timeline-toolbar__btn:hover[b-xq6gmvyg4m] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-strong);
    color: var(--color-text-strong);
    box-shadow: var(--shadow-xs, 0 1px 2px rgba(0,0,0,0.06));
}

.status-timeline-toolbar__btn:active[b-xq6gmvyg4m] {
    transform: scale(0.97);
}

.status-timeline-toolbar__btn:focus-visible[b-xq6gmvyg4m] {
    outline: 2px solid var(--color-primary, #2563eb);
    outline-offset: 2px;
}

.status-timeline-toolbar__btn--success[b-xq6gmvyg4m] {
    color: var(--color-success-text);
    border-color: var(--color-success-border);
    background: var(--color-success-bg);
}

.status-timeline-toolbar__btn--success:hover[b-xq6gmvyg4m] {
    background: color-mix(in srgb, var(--color-success-bg) 80%, var(--color-surface));
    border-color: var(--color-success-text);
    color: var(--color-success-text);
}

.status-timeline-toolbar__btn--danger[b-xq6gmvyg4m] {
    color: var(--color-error-text);
    border-color: var(--color-error-border);
    background: var(--color-error-bg);
}

.status-timeline-toolbar__btn--danger:hover[b-xq6gmvyg4m] {
    background: color-mix(in srgb, var(--color-error-bg) 80%, var(--color-surface));
    border-color: var(--color-error-text);
    color: var(--color-error-text);
}

.status-timeline-toolbar__sep[b-xq6gmvyg4m] {
    display: inline-block;
    width: 1px;
    height: 1rem;
    background: var(--color-border);
    margin-inline: 0.125rem;
    flex-shrink: 0;
}

.status-timeline[b-xq6gmvyg4m] {
    display: flex;
    flex-direction: column;
    padding: 0 0 0.5rem;
    gap: 0;
    width: 100%;
    margin-top: 0;
}

/* ── Drag-active state applied to timeline container via JS ── */
.status-timeline--drag-active[b-xq6gmvyg4m]  .status-card:not(.status-card--dragging) .status-card__body {
    transition-duration: 210ms;
    opacity: 0.68;
    filter: saturate(0.88);
}

.status-timeline--drag-active[b-xq6gmvyg4m]  .status-card--drop-above .status-card__body,
.status-timeline--drag-active[b-xq6gmvyg4m]  .status-card--drop-below .status-card__body,
.status-timeline--drag-active[b-xq6gmvyg4m]  .status-card--dragging .status-card__body {
    opacity: 1;
    filter: none;
}


/* ── Section divider between existing & new cards ── */
.status-timeline__divider[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0.75rem 0;
    padding: 0;
    position: relative;
    /* Vertical dashed connector through the divider gap, aligned with step-number circle */
    background-image: repeating-linear-gradient(
        to bottom,
        var(--color-border) 0px, var(--color-border) 4px,
        transparent 4px, transparent 8px
    );
    background-size: 2px 8px;
    background-position: right 14px top;
    background-repeat: repeat-y;
}

.status-timeline__divider--top[b-xq6gmvyg4m] {
    margin-top: 0.75rem;
}

.status-timeline__divider[b-xq6gmvyg4m]::before,
.status-timeline__divider[b-xq6gmvyg4m]::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--color-border);
}

.status-timeline__divider-label[b-xq6gmvyg4m] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    color: var(--color-text-faint);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    white-space: nowrap;
}

/* ── Add button (inside timeline, aligned with card bodies) ── */
.status-card__add[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    margin-inline-start: calc(28px + 0.75rem);
    margin-top: 0.25rem;
    margin-bottom: 0.75rem;
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-lg);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    background: transparent;
    transition: border-color var(--duration-normal) var(--ease-out),
                color var(--duration-normal) var(--ease-out),
                background var(--duration-normal) var(--ease-out);
}

.status-card__add:hover[b-xq6gmvyg4m] {
    border-color: var(--color-text-faint);
    color: var(--color-text-strong);
    background: var(--color-bg-subtle);
}

.status-card__add:active[b-xq6gmvyg4m] {
    transform: scale(0.985);
    border-color: var(--color-text-secondary);
}

/* ── Batch footer ── */
.status-batch-footer[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
}

.status-batch-count[b-xq6gmvyg4m] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    font-weight: var(--fw-medium);
    margin-inline-start: auto;
}

.status-batch-count__sep[b-xq6gmvyg4m] {
    color: var(--color-text-faint);
}

/* ── Saving spinner inside primary button ── */
/* ── Drawer btn refinements (hover, disabled, active) ── */
[b-xq6gmvyg4m] .zimam-drawer-btn--primary:hover:not(:disabled) {
    background: color-mix(in srgb, var(--color-text-strong) 88%, white);
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

[b-xq6gmvyg4m] .zimam-drawer-btn--primary:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: none;
}

[b-xq6gmvyg4m] .zimam-drawer-btn--primary:disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

[b-xq6gmvyg4m] .zimam-drawer-btn--secondary:hover:not(:disabled) {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-strong);
}

[b-xq6gmvyg4m] .zimam-drawer-btn--secondary:disabled {
    opacity: 0.48;
    cursor: not-allowed;
}

/* /Modules/Settings/Theme/Pages/ThemeSettingsPage/ThemeSettingsPage.razor.rz.scp.css */
.zimam-theme-page[b-ljukeav2ji] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: var(--space-page-y) var(--space-page-x);
    max-width: 1400px;
}

.zimam-theme-page__header[b-ljukeav2ji] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.zimam-theme-page__title[b-ljukeav2ji] {
    font-size: 1.375rem;
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0 0 .25rem;
}

.zimam-theme-page__subtitle[b-ljukeav2ji] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    max-width: 640px;
}

.zimam-theme-page__actions[b-ljukeav2ji] {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.zimam-theme-page__mode-tabs[b-ljukeav2ji] {
    display: inline-flex;
    gap: .25rem;
    padding: .25rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    align-self: flex-start;
}

.zimam-theme-page__mode-tab[b-ljukeav2ji] {
    background: transparent;
    border: 0;
    padding: .375rem .875rem;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-theme-page__mode-tab.is-active[b-ljukeav2ji] {
    background: var(--color-surface);
    color: var(--color-text-strong);
    box-shadow: var(--shadow-sm);
    font-weight: var(--fw-semibold);
}

.zimam-theme-page__body[b-ljukeav2ji] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
}

@media (min-width: 1100px) {
    .zimam-theme-page__body[b-ljukeav2ji] {
        grid-template-columns: minmax(0, 2fr) minmax(360px, 1fr);
    }
}

.zimam-theme-page__form[b-ljukeav2ji] {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    min-width: 0;
}

.zimam-theme-section[b-ljukeav2ji] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.zimam-theme-section__summary[b-ljukeav2ji] {
    list-style: none;
    padding: 1rem 1.25rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: .125rem;
}

.zimam-theme-section__summary[b-ljukeav2ji]::-webkit-details-marker { display: none; }

.zimam-theme-section__title[b-ljukeav2ji] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.zimam-theme-section__desc[b-ljukeav2ji] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

.zimam-theme-section__grid[b-ljukeav2ji] {
    padding: 0 1.25rem 1.25rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 1rem;
    border-top: 1px solid var(--color-border-light);
    padding-top: 1.25rem;
}

.zimam-theme-page__preview[b-ljukeav2ji] {
    position: sticky;
    top: calc(var(--zimam-header-height) + 1rem);
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.zimam-theme-page__preview-title[b-ljukeav2ji] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.zimam-theme-page__dirty-hint[b-ljukeav2ji] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--color-warning-text);
    background: var(--color-warning-bg);
    border: 1px solid var(--color-warning-border);
    padding: .5rem .75rem;
    border-radius: var(--radius-md);
}
/* /Modules/Settings/Theme/SharedComponents/BadgePreviewGrid/BadgePreviewGrid.razor.rz.scp.css */
.zimam-badge-preview[b-1x5tjccgss] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 1.25rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
}

.zimam-badge-preview__group[b-1x5tjccgss] {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.zimam-badge-preview__title[b-1x5tjccgss] {
    margin: 0;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-muted);
}

.zimam-badge-preview__row[b-1x5tjccgss] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
/* /Modules/Settings/Theme/SharedComponents/ColorField/ColorField.razor.rz.scp.css */
.zimam-color-field[b-zs61l0gm6t] {
    display: flex;
    flex-direction: column;
    gap: .375rem;
}

.zimam-color-field__label[b-zs61l0gm6t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    font-weight: var(--fw-medium);
}

.zimam-color-field__reset[b-zs61l0gm6t] {
    background: transparent;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    cursor: pointer;
    line-height: 1;
    padding: 2px 6px;
}

.zimam-color-field__reset:hover[b-zs61l0gm6t] {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.zimam-color-field__row[b-zs61l0gm6t] {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.zimam-color-field__picker[b-zs61l0gm6t] {
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: transparent;
    cursor: pointer;
    flex-shrink: 0;
}

.zimam-color-field__picker[b-zs61l0gm6t]::-webkit-color-swatch-wrapper { padding: 2px; }
.zimam-color-field__picker[b-zs61l0gm6t]::-webkit-color-swatch { border: none; border-radius: 4px; }

.zimam-color-field__text[b-zs61l0gm6t] {
    flex: 1;
    min-width: 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: var(--text-sm);
    padding: .375rem .5rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text-strong);
}

.zimam-color-field__text:focus[b-zs61l0gm6t] {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

.zimam-color-field__swatch[b-zs61l0gm6t] {
    width: 20px;
    height: 20px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    flex-shrink: 0;
}
/* /Modules/Settings/TransitionPolicies/TransitionPolicies.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════════
   TransitionPolicies.razor.css
   Scoped styles for /settings/transition-policies
   All values reference tokens from 01-tokens.css. No hardcoded colors/spacing.
   Prefix: tp-
═══════════════════════════════════════════════════════════════════════════════ */

.tp-page[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-card);
    padding: var(--space-page-y) var(--space-page-x);
    min-height: 100%;
    color: var(--color-text);
    font-family: var(--font-family);
}

/* ── Header ─────────────────────────────────────────────────── */
.tp-header[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tp-header__title[b-fi179slslu] {
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
}

.tp-header__subtitle[b-fi179slslu] {
    font-size: var(--text-md);
    color: var(--color-text-secondary);
    line-height: var(--lh-normal);
    margin: 0;
}

/* ── Layout: sidebar + main ─────────────────────────────────── */
.tp-layout[b-fi179slslu] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: var(--space-card);
    align-items: start;
}

@media (max-width: 900px) {
    .tp-layout[b-fi179slslu] {
        grid-template-columns: 1fr;
    }
}

/* ── Templates sidebar ──────────────────────────────────────── */
.tp-templates[b-fi179slslu] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tp-templates__head[b-fi179slslu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.tp-templates__heading[b-fi179slslu] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
}

[b-fi179slslu] .tp-new-template-btn {
    padding-block: 0.375rem;
    padding-inline: 0.75rem;
    font-size: var(--text-sm);
}

.tp-templates__list[b-fi179slslu] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tp-template-item[b-fi179slslu] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default);
    border: 1px solid transparent;
}

.tp-template-item:hover[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-template-item--active[b-fi179slslu] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.tp-template-item__main[b-fi179slslu] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.tp-template-item__name[b-fi179slslu] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tp-template-item__badges[b-fi179slslu] {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
}

.tp-badge[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: var(--text-2xs);
    font-weight: var(--fw-medium);
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-pill);
    line-height: 1;
}

.tp-badge--default[b-fi179slslu] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border: 1px solid var(--color-success-border);
}

.tp-badge--inactive[b-fi179slslu] {
    background: var(--color-bg);
    color: var(--color-text-muted);
    border: 1px solid var(--color-border);
}

/* ── Menu dropdown ──────────────────────────────────────────── */
.tp-template-item__menu-wrap[b-fi179slslu] {
    position: relative;
}

.tp-menu[b-fi179slslu] {
    position: absolute;
    inset-inline-end: 0;
    top: calc(100% + 0.25rem);
    min-width: 12rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-floating);
    padding: 0.25rem;
    z-index: var(--z-sticky);
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.tp-menu button[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    border: none;
    background: transparent;
    color: var(--color-text);
    font-family: inherit;
    font-size: var(--text-sm);
    text-align: start;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default);
}

.tp-menu button:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-menu button:disabled[b-fi179slslu] {
    opacity: 0.5;
    cursor: not-allowed;
}

.tp-menu__danger[b-fi179slslu] {
    color: var(--color-error-text) !important;
}

.tp-menu__danger:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-error-bg) !important;
}

.tp-menu__separator[b-fi179slslu] {
    height: 1px;
    background: var(--color-border);
    margin: 0.25rem 0;
}

/* ── Main panel ─────────────────────────────────────────────── */
.tp-main[b-fi179slslu] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 0;
    min-height: 20rem;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.tp-main__empty[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 4rem 1rem;
    color: var(--color-text-muted);
    text-align: center;
}

.tp-main__empty-icon[b-fi179slslu] {
    color: var(--color-text-faint);
}

.tp-main__head[b-fi179slslu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--color-border-light);
    flex-wrap: wrap;
}

.tp-main__title[b-fi179slslu] {
    font-size: var(--text-xl);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
}

/* ── Solid (dark) primary button ─ matches image ── */
.tp-btn-primary--solid[b-fi179slslu] {
    background: var(--color-text-strong) !important;
    color: var(--color-surface) !important;
    border: 1px solid var(--color-text-strong) !important;
    padding: 0.5rem 1rem !important;
    font-weight: var(--fw-medium);
}

.tp-btn-primary--solid:hover:not(:disabled)[b-fi179slslu] {
    background: #000 !important;
    border-color: #000 !important;
}

.tp-btn-primary--solid:disabled[b-fi179slslu] {
    opacity: 0.55;
    cursor: not-allowed;
}

/* ── Tabs ──────────────────────────────────────────────────── */
.tp-tabs[b-fi179slslu] {
    display: flex;
    gap: 0;
    padding: 0 1.25rem;
    border-bottom: 1px solid var(--color-border-light);
    background: var(--color-surface);
}

.tp-tab[b-fi179slslu] {
    background: transparent;
    border: none;
    padding: 0.875rem 0.25rem;
    margin-inline-end: 1.25rem;
    font-family: inherit;
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    color: var(--color-text-muted);
    cursor: pointer;
    position: relative;
    transition: color var(--duration-fast) var(--ease-default);
}

.tp-tab:hover:not(:disabled)[b-fi179slslu] {
    color: var(--color-text-strong);
}

.tp-tab--active[b-fi179slslu] {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.tp-tab--active[b-fi179slslu]::after {
    content: '';
    position: absolute;
    inset-inline: 0;
    bottom: -1px;
    height: 2px;
    background: var(--color-text-strong);
    border-radius: 2px 2px 0 0;
}

/* ── Data table ────────────────────────────────────────────── */
.tp-table-wrap[b-fi179slslu] {
    padding: 1rem 1.25rem 1.25rem;
    flex: 1;
}

.tp-table[b-fi179slslu] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    font-size: var(--text-md);
}

.tp-table thead th[b-fi179slslu] {
    background: var(--color-bg-subtle);
    text-align: start;
    padding: 0.75rem 1rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    border-bottom: 1px solid var(--color-border);
    white-space: nowrap;
}

.tp-table__actions-col[b-fi179slslu] {
    width: 1%;
    white-space: nowrap;
}

.tp-table tbody td[b-fi179slslu] {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: middle;
    color: var(--color-text);
}

.tp-table tbody tr:last-child td[b-fi179slslu] {
    border-bottom: none;
}

.tp-table__row:hover td[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-table__empty-row td[b-fi179slslu] {
    padding: 2rem 1rem;
}

.tp-table-empty[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-muted);
    text-align: center;
}

.tp-table-empty__icon[b-fi179slslu] {
    color: var(--color-text-faint);
    margin-bottom: 0.25rem;
}

.tp-table-empty__title[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.tp-table-empty__sub[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-sm);
}

/* ── Table cells ──────────────────────────────────────────── */
.tp-cell-workflow[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.tp-cell-workflow__name[b-fi179slslu] {
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
}

.tp-cell-applies[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}

.tp-cell-approvers[b-fi179slslu] {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
}

.tp-cell-approvers--none[b-fi179slslu] {
    color: var(--color-text-faint);
    font-weight: var(--fw-normal);
}

.tp-cell-approvers--missing[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--color-error-text);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}

.tp-row-actions[b-fi179slslu] {
    display: inline-flex;
    gap: 0.25rem;
}

/* ── Tags (kept for table + drawer) ──────────────────────── */
.tp-tag[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: 1.4;
}

.tp-tag--direct[b-fi179slslu] {
    background: var(--color-success-bg);
    color: var(--color-success-text);
    border: 1px solid var(--color-success-border);
}

.tp-tag--gated[b-fi179slslu] {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    border: 1px solid var(--color-warning-border);
}

/* ── Linked tasks tab (placeholder) ─────────────────────── */
.tp-linked-empty[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 4rem 1rem;
    color: var(--color-text-muted);
    text-align: center;
}

.tp-linked-empty__icon[b-fi179slslu] {
    color: var(--color-text-faint);
}

.tp-linked-empty__title[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.tp-linked-empty__sub[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-sm);
}

/* ── Drawer: rule-edit additions ─────────────────────────── */
.tp-drawer-section[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.tp-drawer-section__title[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-drawer-hint[b-fi179slslu] {
    color: var(--color-text-secondary);
}

.tp-rule-summary[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: flex-end;
    min-width: 0;
}

.tp-rule-summary__value[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.tp-select--full[b-fi179slslu] {
    width: 100%;
}

.tp-mode-group[b-fi179slslu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    width: 100%;
}

@media (max-width: 520px) {
    .tp-mode-group[b-fi179slslu] {
        grid-template-columns: 1fr;
    }
}

.tp-mode-option[b-fi179slslu] {
    display: flex;
    gap: 0.5rem;
    padding: 0.8125rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
                background-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.tp-mode-option:hover[b-fi179slslu] {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
}

.tp-mode-option input[type="radio"][b-fi179slslu] {
    margin-top: 0.125rem;
    accent-color: var(--color-text-strong);
}

.tp-mode-option--selected[b-fi179slslu] {
    border-color: var(--color-text-strong);
    background: var(--color-bg-subtle);
    box-shadow: 0 0 0 1px var(--color-text-strong) inset;
}

.tp-mode-option__body[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.tp-mode-option__title[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.tp-mode-option__desc[b-fi179slslu] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}


/* ── Buttons & inputs (scoped) ──────────────────────────────── */
.tp-btn-primary[b-fi179slslu],
.tp-btn-secondary[b-fi179slslu],
.tp-btn-ghost[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.875rem;
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default);
    line-height: 1.2;
    border: 1px solid transparent;
}

.tp-btn-primary[b-fi179slslu] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.tp-btn-primary:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-text);
}

.tp-btn-primary:disabled[b-fi179slslu] {
    background: var(--color-border-hover);
    cursor: not-allowed;
}

.tp-btn-secondary[b-fi179slslu] {
    background: var(--color-surface);
    color: var(--color-text);
    border-color: var(--color-border);
}

.tp-btn-secondary:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.tp-btn-secondary:disabled[b-fi179slslu] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tp-btn-ghost[b-fi179slslu] {
    background: transparent;
    color: var(--color-text-secondary);
    padding: 0.25rem 0.5rem;
}

.tp-btn-ghost:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.tp-btn-ghost:disabled[b-fi179slslu] {
    opacity: 0.6;
    cursor: not-allowed;
}

.tp-icon-btn[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border: none;
    background: transparent;
    color: var(--color-text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    padding: 0;
    transition: background-color var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default);
}

.tp-icon-btn:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.tp-icon-btn--danger:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-error-bg);
    color: var(--color-error-text);
}

.tp-icon-btn:disabled[b-fi179slslu] {
    opacity: 0.5;
    cursor: not-allowed;
}

.tp-btn-primary:focus-visible[b-fi179slslu],
.tp-btn-secondary:focus-visible[b-fi179slslu],
.tp-btn-ghost:focus-visible[b-fi179slslu],
.tp-icon-btn:focus-visible[b-fi179slslu] {
    outline: none;
    box-shadow: 0 0 0 3px var(--color-border-light);
}

.tp-select[b-fi179slslu],
.tp-input[b-fi179slslu] {
    font-family: inherit;
    font-size: var(--text-sm);
    padding: 0.4375rem 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text);
    min-width: 10rem;
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.tp-input--sm[b-fi179slslu] {
    min-width: 8rem;
}

.tp-input--xs[b-fi179slslu] {
    min-width: 4rem;
    width: 4.5rem;
}

.tp-select:focus[b-fi179slslu],
.tp-input:focus[b-fi179slslu] {
    outline: none;
    border-color: var(--color-border-hover);
    box-shadow: 0 0 0 3px var(--color-border-light);
}

/* ── Modal (create/rename/duplicate) ─────────────────────────── */
.tp-modal[b-fi179slslu] {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
}

.tp-modal__backdrop[b-fi179slslu] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
}

.tp-modal__card[b-fi179slslu] {
    position: relative;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: 1.5rem;
    width: min(30rem, calc(100vw - 2rem));
    box-shadow: var(--shadow-floating);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.tp-modal__title[b-fi179slslu] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0;
}

.tp-modal__sub[b-fi179slslu] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.tp-modal__status[b-fi179slslu] {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    margin: 0;
}

.tp-modal__body[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.tp-modal__actions[b-fi179slslu] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--color-border-light);
}

.tp-form-field[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.tp-form-label[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
}

.tp-form-check[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-sm);
    color: var(--color-text);
    cursor: pointer;
}

.tp-form-check input[type="checkbox"][b-fi179slslu] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--color-text-strong);
}

/* ═══════════════════════════════════════════════════════════════════════════
   Drawer internals — redesigned for clarity + guidance
═══════════════════════════════════════════════════════════════════════════ */
[b-fi179slslu] .tp-approval-drawer .zimam-drawer-header {
    padding: 1rem 1.25rem;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border-light);
}

[b-fi179slslu] .tp-approval-drawer .zimam-drawer-body {
    background: var(--color-surface);
}

[b-fi179slslu] .tp-approval-drawer .zimam-drawer-footer {
    padding: 0.875rem 1.25rem;
    background: var(--color-surface);
    border-top: 1px solid var(--color-border-light);
}

.tp-drawer-header[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
}

.tp-drawer-header__mark[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    flex-shrink: 0;
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    color: var(--color-text-strong);
}

.tp-drawer-header__text[b-fi179slslu] {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    gap: 0.1875rem;
}

.tp-drawer-header h3[b-fi179slslu] {
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    margin: 0;
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-drawer-header__sub[b-fi179slslu] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.tp-drawer-arrow[b-fi179slslu] {
    display: inline-block;
    margin: 0 0.375rem;
    color: var(--color-text-faint);
}

.tp-drawer-body[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem 1.25rem 1.125rem;
    background: var(--color-bg-subtle);
}

.tp-drawer-footer[b-fi179slslu] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    width: 100%;
}

.tp-drawer-card[b-fi179slslu] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    overflow: visible;
}

.tp-drawer-card__header[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border-bottom: 1px solid var(--color-border-light);
    padding: 0.875rem 1.125rem;
}

.tp-drawer-card__icon[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    color: var(--color-text-strong);
}

.tp-drawer-card__heading[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.tp-drawer-card__subtitle[b-fi179slslu] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-medium);
    line-height: var(--lh-normal);
}

.tp-drawer-card__rows[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    padding-inline: 1.125rem;
}

.tp-drawer-row[b-fi179slslu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 2.875rem;
    padding-block: 0.625rem;
    border-bottom: 1px solid var(--color-border-light);
}

.tp-drawer-row:last-child[b-fi179slslu] {
    border-bottom: 0;
}

.tp-drawer-row--field[b-fi179slslu] {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.5rem;
}

.tp-drawer-row__label[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    font-size: var(--text-sm);
    line-height: var(--lh-tight);
}

.tp-drawer-row__label[b-fi179slslu]  svg {
    color: var(--color-text-strong);
    flex-shrink: 0;
}

/* ── Intro explainer ──────────────────────────────────────────── */
.tp-drawer-intro[b-fi179slslu] {
    animation: tp-fade-in-b-fi179slslu var(--duration-normal) var(--ease-out) both;
}

.tp-drawer-intro__icon[b-fi179slslu] {
    flex-shrink: 0;
    color: var(--color-text-secondary);
    line-height: 0;
    padding-top: 0.125rem;
}

.tp-drawer-intro__title[b-fi179slslu] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0 0 0.25rem;
}

.tp-drawer-intro__text[b-fi179slslu] {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: var(--lh-normal);
    margin: 0;
}

.tp-drawer-intro__text b[b-fi179slslu] {
    font-weight: var(--fw-semibold);
}

/* ── Loading state ─────────────────────────────────────────────── */
.tp-drawer-loading[b-fi179slslu] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    padding: 2.5rem 1rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.tp-spinner[b-fi179slslu] {
    width: 1.125rem;
    height: 1.125rem;
    border-radius: var(--radius-pill);
    border: 2px solid var(--color-border);
    border-top-color: var(--color-text-strong);
    animation: tp-spin-b-fi179slslu 0.75s linear infinite;
}

/* ── Empty state ───────────────────────────────────────────────── */
.tp-empty-state[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-bottom: 1rem;
    animation: tp-fade-in-b-fi179slslu var(--duration-normal) var(--ease-out) both;
}

.tp-empty-state > .tp-btn-primary[b-fi179slslu] {
    align-self: flex-start;
    margin-inline: 1.125rem;
}

.tp-empty-state__icon[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    border: 1px solid var(--color-border);
}

.tp-empty-state__title[b-fi179slslu] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-empty-state__text[b-fi179slslu] {
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
    line-height: var(--lh-normal);
    margin: 0 0 0.375rem;
    max-width: 26rem;
}

/* ── Requirement cards ─────────────────────────────────────────── */
.tp-req-list[b-fi179slslu] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.tp-req-card[b-fi179slslu] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: visible;
    box-shadow: var(--shadow-sm);
    animation: tp-slide-in-b-fi179slslu var(--duration-normal) var(--ease-out) both;
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.tp-req-card:hover[b-fi179slslu] {
    border-color: var(--color-border-hover);
}

.tp-req-card:focus-within[b-fi179slslu] {
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-sm), 0 0 0 3px var(--color-border-light);
}

.tp-req-card__head[b-fi179slslu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.875rem 1.125rem;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border-light);
}

.tp-req-card__head-left[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}

.tp-req-card__heading[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.tp-req-card__title[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.tp-req-card__meta[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: 1;
}

.tp-req-card__body[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    padding: 1rem 1.125rem 1.125rem;
}

.tp-req-step[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.625rem;
    height: 1.625rem;
    border-radius: var(--radius-lg);
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border: 1px solid var(--color-border-hover);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    flex-shrink: 0;
}

/* ── Fields ─────────────────────────────────────────────────── */
.tp-field[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
}

.tp-field--narrow[b-fi179slslu] {
    max-width: 11rem;
}

.tp-field__label[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-field__label[b-fi179slslu]  svg {
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.tp-field__hint[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
}

.tp-field-row[b-fi179slslu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.875rem 1rem;
    align-items: flex-start;
    padding-top: 0.875rem;
    border-top: 1px dashed var(--color-border-light);
}

/* ── Custom type dropdown (replaces native <select>) ─── */
.tp-type-dropdown[b-fi179slslu] {
    position: relative;
}

.tp-type-dropdown__trigger[b-fi179slslu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-family: inherit;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    cursor: pointer;
    text-align: start;
    color: var(--color-text);
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                background-color var(--duration-fast) var(--ease-default);
}

.tp-type-dropdown__trigger:hover:not(:disabled)[b-fi179slslu] {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
}

.tp-type-dropdown__trigger:focus-visible[b-fi179slslu],
.tp-type-dropdown--open .tp-type-dropdown__trigger[b-fi179slslu] {
    outline: none;
    border-color: var(--color-border-hover);
    box-shadow: 0 0 0 3px var(--color-border-light);
}

.tp-type-dropdown__selected[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
    flex: 1;
}

.tp-type-dropdown__icon[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

.tp-type-dropdown__text[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.tp-type-dropdown__label[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-type-dropdown__desc[b-fi179slslu] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: var(--lh-tight);
}

.tp-type-dropdown__chevron[b-fi179slslu] {
    color: var(--color-text-muted);
    display: inline-flex;
    transition: transform var(--duration-fast) var(--ease-default);
    flex-shrink: 0;
}

.tp-type-dropdown--open .tp-type-dropdown__chevron[b-fi179slslu] {
    transform: rotate(180deg);
}

/* click-away scrim */
.tp-type-dropdown__scrim[b-fi179slslu] {
    position: fixed;
    inset: 0;
    z-index: var(--z-drawer);
    background: transparent;
}

.tp-type-dropdown__menu[b-fi179slslu] {
    position: absolute;
    z-index: var(--z-drawer-stacked);
    top: calc(100% + 0.375rem);
    inset-inline-start: 0;
    inset-inline-end: 0;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-floating);
    padding: 0.25rem;
    list-style: none;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    animation: tp-dropdown-in-b-fi179slslu var(--duration-fast) var(--ease-out) both;
    max-height: 20rem;
    overflow-y: auto;
}

.tp-type-option[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.5rem 0.625rem;
    font-family: inherit;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    text-align: start;
    color: var(--color-text);
    transition: background-color var(--duration-fast) var(--ease-default);
}

.tp-type-option:hover:not(:disabled)[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-type-option--selected[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-type-option--selected:hover[b-fi179slslu] {
    background: var(--color-bg-subtle);
}

.tp-type-option__icon[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    color: var(--color-text-secondary);
}

.tp-type-option--selected .tp-type-option__icon[b-fi179slslu] {
    background: var(--color-surface);
    color: var(--color-text-strong);
    border: 1px solid var(--color-border);
}

.tp-type-option__text[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

.tp-type-option__label[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-type-option__desc[b-fi179slslu] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: var(--lh-tight);
}

.tp-type-option__check[b-fi179slslu] {
    color: var(--color-success-text);
    flex-shrink: 0;
    display: inline-flex;
    animation: tp-check-pop-b-fi179slslu var(--duration-fast) var(--ease-out) both;
}

/* ── Auto-resolved info panel (task.reviewer / task.assignee subject roles) ── */
.tp-auto-info[b-fi179slslu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.875rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
}

.tp-auto-info__icon[b-fi179slslu] {
    flex-shrink: 0;
    display: inline-flex;
    color: var(--color-text-strong);
}

/* ── Toggle switch (replaces plain checkbox for "متوازي") ── */
.tp-toggle[b-fi179slslu] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
    user-select: none;
    padding: 0.25rem 0;
}

.tp-toggle input[type="checkbox"][b-fi179slslu] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.tp-toggle__track[b-fi179slslu] {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 2.25rem;
    height: 1.25rem;
    background: var(--color-border-hover);
    border-radius: var(--radius-pill);
    transition: background-color var(--duration-fast) var(--ease-default);
    flex-shrink: 0;
}

.tp-toggle__thumb[b-fi179slslu] {
    position: absolute;
    inset-inline-start: 0.125rem;
    width: 1rem;
    height: 1rem;
    background: var(--color-surface);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    transition: transform var(--duration-fast) var(--ease-default);
}

.tp-toggle input:checked + .tp-toggle__track[b-fi179slslu] {
    background: var(--color-text-strong);
}

.tp-toggle input:checked + .tp-toggle__track .tp-toggle__thumb[b-fi179slslu] {
    /* RTL: active thumb moves toward end (left in RTL) */
    transform: translateX(-1rem);
}

[dir="ltr"] .tp-toggle input:checked + .tp-toggle__track .tp-toggle__thumb[b-fi179slslu] {
    transform: translateX(1rem);
}

.tp-toggle input:focus-visible + .tp-toggle__track[b-fi179slslu] {
    box-shadow: 0 0 0 3px var(--color-border-light);
}

.tp-toggle__text[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.tp-toggle__label[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.tp-toggle__desc[b-fi179slslu] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: var(--lh-tight);
}

/* ── Input refinements ──────────────────────────────────────────── */
.tp-input--with-icon[b-fi179slslu] {
    padding-inline-start: 2rem;
}

.tp-input--number[b-fi179slslu] {
    width: 100%;
    max-width: 6rem;
}

.tp-add-req-btn[b-fi179slslu] {
    align-self: flex-start;
    justify-content: center;
    margin-top: 0.125rem;
}

/* ── Employee picker refinements ──────────────────────────────── */
.tp-emp-picker[b-fi179slslu] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.tp-emp-picker__input-wrap[b-fi179slslu] {
    position: relative;
}

.tp-emp-picker__search-icon[b-fi179slslu] {
    position: absolute;
    inset-inline-start: 0.625rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-muted);
    pointer-events: none;
    line-height: 0;
}

.tp-emp-picker__results[b-fi179slslu] {
    position: static;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: none;
    list-style: none;
    padding: 0.25rem;
    margin: 0.25rem 0 0;
    max-height: 16rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    animation: tp-dropdown-in-b-fi179slslu var(--duration-fast) var(--ease-out) both;
}

.tp-emp-picker__results li[b-fi179slslu] {
    margin: 0;
    padding: 0;
}

.tp-emp-picker__option[b-fi179slslu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.625rem;
    font-family: inherit;
    text-align: start;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-text);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.tp-emp-picker__option:hover[b-fi179slslu],
.tp-emp-picker__option:focus-visible[b-fi179slslu] {
    outline: none;
    background: var(--color-bg-subtle);
    border-color: var(--color-border-light);
}

.tp-emp-picker__option--selected[b-fi179slslu] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.tp-emp-picker__result-text[b-fi179slslu] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
    flex: 1;
}

.tp-emp-picker__result-text span[b-fi179slslu] {
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-strong);
}

.tp-emp-picker__result-text small[b-fi179slslu] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}

.tp-emp-picker__check[b-fi179slslu] {
    display: inline-flex;
    flex-shrink: 0;
    color: var(--color-text-strong);
}

/* ── Animations ─────────────────────────────────────────────────── */
@keyframes tp-spin-b-fi179slslu {
    to { transform: rotate(360deg); }
}

@keyframes tp-fade-in-b-fi179slslu {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes tp-slide-in-b-fi179slslu {
    from { opacity: 0; transform: translateY(-6px); max-height: 0; }
    to   { opacity: 1; transform: translateY(0); max-height: 40rem; }
}

@keyframes tp-dropdown-in-b-fi179slslu {
    from { opacity: 0; transform: translateY(-4px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes tp-check-pop-b-fi179slslu {
    from { opacity: 0; transform: scale(0.7); }
    to   { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .tp-req-card[b-fi179slslu],
    .tp-drawer-intro[b-fi179slslu],
    .tp-empty-state[b-fi179slslu],
    .tp-type-dropdown__menu[b-fi179slslu],
    .tp-emp-picker__results[b-fi179slslu],
    .tp-type-option__check[b-fi179slslu] {
        animation: none !important;
    }
    .tp-spinner[b-fi179slslu] { animation-duration: 2s; }
    .tp-toggle__thumb[b-fi179slslu],
    .tp-toggle__track[b-fi179slslu],
    .tp-type-dropdown__chevron[b-fi179slslu] {
        transition: none !important;
    }
}

/* /Modules/Settings/Workflows/StatusCardItem/StatusCardItem.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   StatusCardItem — scoped CSS (clean rewrite)
   Every value is deliberate for drawer-width (~380 px usable).
   Uses CSS grid-row collapse for smooth expand/collapse.
   ═══════════════════════════════════════════════════════════════ */

/* ── Card wrapper: flex row = [timeline] [body] ── */
.status-card[b-ms9vocov0p] {
    display: flex;
    gap: 0.625rem;
    width: 100%;
    position: relative;
    padding-block: 0.25rem;
    transition: opacity 200ms var(--ease-out);
}

/* ── Timeline column (28 px fixed) ── */
.status-card__timeline[b-ms9vocov0p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 28px;
    flex-shrink: 0;
    padding-top: 0.5rem;
}

.status-card__step-number[b-ms9vocov0p] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    color: var(--color-surface);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    flex-shrink: 0;
    z-index: 1;
    transition: background 180ms var(--ease-out);
}

.status-card__step-number--inactive[b-ms9vocov0p] {
    background: var(--color-text-faint);
}

.status-card__line[b-ms9vocov0p] {
    width: 0;
    flex: 1;
    min-height: 0.5rem;
    border-inline-start: 2px dashed var(--color-border);
}

.status-card__line--inactive[b-ms9vocov0p] {
    border-inline-start-color: var(--color-border-light);
}

/* ── Card body ── */
.status-card__body[b-ms9vocov0p] {
    flex: 1;
    min-width: 0;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    overflow: hidden;
    margin-bottom: 0.375rem;
    transition: border-color 180ms var(--ease-out),
                background 180ms var(--ease-out);
}

/* ── State variants ── */
.status-card--new .status-card__body[b-ms9vocov0p] {
    border: 2px dashed var(--color-border);
    background: var(--color-bg-subtle);
}

.status-card--existing .status-card__body[b-ms9vocov0p] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border);
}

.status-card--modified .status-card__body[b-ms9vocov0p] {
    border-color: var(--color-warning-border, #d97706);
    background: color-mix(in srgb, #f59e0b 4%, var(--color-bg-subtle));
}

.status-card--modified .status-card__step-number[b-ms9vocov0p] {
    background: var(--color-warning-text, #b45309);
}

/* ── Hover: border darken only, no lift ── */
.status-card--existing .status-card__body:hover[b-ms9vocov0p] {
    border-color: var(--color-text-secondary);
}

.status-card--new .status-card__body:hover[b-ms9vocov0p] {
    border-color: var(--color-text-faint);
}

.status-card--modified .status-card__body:hover[b-ms9vocov0p] {
    border-color: var(--color-warning-text, #b45309);
}

/* ── Inactive ── */
.status-card__body--inactive[b-ms9vocov0p] {
    opacity: 0.65;
}

.status-card__body--inactive:hover[b-ms9vocov0p] {
    opacity: 0.8;
}

.status-card--inactive .status-card__title[b-ms9vocov0p] {
    color: var(--color-text-muted);
    text-decoration: line-through;
    text-decoration-color: var(--color-text-faint);
}

/* ── Card header ── */
.status-card__header[b-ms9vocov0p] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
    min-height: 2.25rem;
}

.status-card__body:has(.status-card__fields--expanded) .status-card__header[b-ms9vocov0p] {
    border-bottom: 1px solid var(--color-border-light);
}

/* Drag handle */
.status-card__drag-handle[b-ms9vocov0p] {
    cursor: grab;
    color: var(--color-text-faint);
    display: flex;
    align-items: center;
    padding: 0.125rem;
    border-radius: var(--radius-xs);
    transition: color 150ms var(--ease-out);
}

.status-card__drag-handle:hover[b-ms9vocov0p] {
    color: var(--color-text-secondary);
}

.status-card__drag-handle:active[b-ms9vocov0p] {
    cursor: grabbing;
}

/* Title area */
.status-card__title-wrap[b-ms9vocov0p] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.0625rem;
}

.status-card__heading[b-ms9vocov0p] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    min-width: 0;
}

.status-card__title[b-ms9vocov0p] {
    font-size: var(--text-sm);
    line-height: 1.4;
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.status-card__code-label[b-ms9vocov0p] {
    font-size: var(--text-2xs);
    color: var(--color-text-faint);
    background: var(--color-bg-subtle);
    padding: 0 0.25rem;
    border-radius: var(--radius-xs);
    white-space: nowrap;
    font-family: var(--font-mono, monospace);
}

.status-card--existing .status-card__code-label[b-ms9vocov0p] {
    background: var(--color-surface);
}

.status-card__desc-preview[b-ms9vocov0p] {
    font-size: var(--text-2xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.status-card__dirty-dot[b-ms9vocov0p] {
    display: inline-block;
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-warning-text, #b45309);
    flex-shrink: 0;
}

/* ── Card actions ── */
.status-card__actions[b-ms9vocov0p] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    margin-inline-start: auto;
    flex-shrink: 0;
}

.status-card__expand-btn[b-ms9vocov0p],
.status-card__remove-btn[b-ms9vocov0p] {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: var(--radius-xs);
    color: var(--color-text-faint);
    transition: color 150ms var(--ease-out),
                background 150ms var(--ease-out);
}

.status-card__expand-btn:hover[b-ms9vocov0p] {
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
}

.status-card__remove-btn:hover[b-ms9vocov0p] {
    color: var(--color-error-text);
    background: var(--color-error-bg);
}

.status-card__expand-btn svg[b-ms9vocov0p] {
    transition: transform 200ms cubic-bezier(0.2, 0.9, 0.25, 1);
}

.status-card__expand-btn--expanded svg[b-ms9vocov0p] {
    transform: rotate(180deg);
}

.status-card__expand-btn:focus-visible[b-ms9vocov0p],
.status-card__remove-btn:focus-visible[b-ms9vocov0p],
.status-card__toggle-btn:focus-visible[b-ms9vocov0p] {
    outline: 2px solid var(--color-text-strong);
    outline-offset: 1px;
}

/* Toggle button */
.status-card__toggle-btn[b-ms9vocov0p] {
    all: unset;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.125rem 0.375rem;
    border-radius: var(--radius-pill);
    transition: background 180ms var(--ease-out),
                border-color 180ms var(--ease-out),
                color 180ms var(--ease-out);
}

.status-card__toggle-label[b-ms9vocov0p] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    line-height: 1;
    white-space: nowrap;
}

.status-card__toggle-switch[b-ms9vocov0p] {
    width: 1.75rem;
    height: 0.875rem;
    border-radius: 999px;
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 0 0.125rem;
    direction: ltr;
    transition: background 180ms var(--ease-out);
}

.status-card__toggle-knob[b-ms9vocov0p] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    background: var(--color-surface);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    transform: translateX(0);
    transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.status-card__toggle-btn--off[b-ms9vocov0p] {
    color: var(--color-error-text);
    background: var(--color-error-bg);
    border: 1px solid var(--color-error-border);
}

.status-card__toggle-btn--off .status-card__toggle-switch[b-ms9vocov0p] {
    background: var(--color-error-border);
}

.status-card__toggle-btn--active[b-ms9vocov0p] {
    color: var(--color-success-text);
    background: var(--color-success-bg);
    border: 1px solid var(--color-success-border);
}

.status-card__toggle-btn--active .status-card__toggle-switch[b-ms9vocov0p] {
    background: var(--color-success-border);
}

.status-card__toggle-btn--active .status-card__toggle-knob[b-ms9vocov0p] {
    transform: translateX(0.85rem);
}

/* ══════════════════════════════════════════════════════════════
   EXPANDABLE FIELDS
   Uses CSS grid row collapse: grid-template-rows 0fr -> 1fr
   No max-height clipping, no translateY jank.
   ══════════════════════════════════════════════════════════════ */
.status-card__fields[b-ms9vocov0p] {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows 280ms cubic-bezier(0.2, 0.9, 0.25, 1),
                opacity 200ms var(--ease-out);
}

.status-card__fields--expanded[b-ms9vocov0p] {
    grid-template-rows: 1fr;
    opacity: 1;
}

/* Inner wrapper: overflow hidden required for grid-row trick */
.status-card__fields-inner[b-ms9vocov0p] {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* ── Fields layout ── */
.status-card__fields-row[b-ms9vocov0p] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem 0;
}

.status-card__fields-inner > .zimam-form-field[b-ms9vocov0p] {
    padding: 0.375rem 0.625rem 0.5rem;
}

/* ── Form field overrides (beat global 08-forms.css) ── */
.status-card__fields-inner .zimam-form-field[b-ms9vocov0p] {
    margin: 0;
}

.status-card__fields-inner .zimam-form-label[b-ms9vocov0p] {
    display: block;
    font-size: var(--text-2xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    margin-block-end: 0.125rem;
    line-height: 1.3;
}

.status-card__fields-inner .zimam-form-input[b-ms9vocov0p] {
    width: 100%;
    height: 1.75rem;
    padding-inline: 0.5rem;
    font-size: var(--text-xs);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    box-sizing: border-box;
}

.status-card__fields-inner .zimam-form-input:focus[b-ms9vocov0p] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px var(--color-primary-ring);
}

.status-card__fields-inner textarea.zimam-form-input[b-ms9vocov0p] {
    height: auto;
    min-height: 2.5rem;
    max-height: 4rem;
    padding-block: 0.25rem;
    resize: none;
    line-height: 1.4;
}

/* ── Drag states ── */
.status-card--dragging[b-ms9vocov0p] {
    opacity: 0.75;
}

.status-card--dragging .status-card__body[b-ms9vocov0p] {
    border-color: var(--color-text-strong);
    box-shadow: var(--shadow-md);
}

.status-card--ghost .status-card__body[b-ms9vocov0p] {
    border-color: var(--color-text-strong);
    box-shadow: var(--shadow-lg);
}

.status-card--drop-above .status-card__body[b-ms9vocov0p] {
    border-top-color: var(--color-text-strong);
    box-shadow: inset 0 2px 0 0 var(--color-text-strong);
}

.status-card--drop-below .status-card__body[b-ms9vocov0p] {
    border-bottom-color: var(--color-text-strong);
    box-shadow: inset 0 -2px 0 0 var(--color-text-strong);
}

.status-card:focus-visible[b-ms9vocov0p] {
    outline: 2px solid var(--color-text-strong);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .status-card[b-ms9vocov0p],
    .status-card__body[b-ms9vocov0p],
    .status-card__fields[b-ms9vocov0p] {
        transition: none !important;
    }
}
/* /Modules/Settings/Workflows/WorkflowCanvas/WorkflowCanvas.razor.rz.scp.css */
/* WorkflowCanvas CSS isolation.
   Classes on child components (nodes, connector, drawers) use ::deep so that
   Blazor CSS scoping does not prevent this parent-component stylesheet from
   reaching their DOM elements.
   Optimized for Arabic RTL layout with improved vertical spacing.
*/
/* ZIMAM Settings Workflow Editor
   Workflow editor canvas, nodes, connector menus, and configuration drawers.
   Enhanced for Arabic RTL interface.
*/

.zimam-settings-workflow-editor[b-d4be1dywyu] {
    --zimam-settings-workflow-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --zimam-settings-workflow-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --zimam-settings-workflow-slate-50: #f8fafc;
    --zimam-settings-workflow-slate-100: #f1f5f9;
    --zimam-settings-workflow-slate-200: #e2e8f0;
    --zimam-settings-workflow-slate-300: #cbd5e1;
    --zimam-settings-workflow-slate-400: #94a3b8;
    --zimam-settings-workflow-slate-500: #64748b;
    --zimam-settings-workflow-slate-600: #475569;
    --zimam-settings-workflow-slate-700: #334155;
    --zimam-settings-workflow-slate-800: #1e293b;
    --zimam-settings-workflow-emerald-50: #ecfdf5;
    --zimam-settings-workflow-emerald-300: #6ee7b7;
    --zimam-settings-workflow-emerald-500: #10b981;
    --zimam-settings-workflow-emerald-600: #059669;
    --zimam-settings-workflow-blue-50: #eff6ff;
    --zimam-settings-workflow-blue-300: #93c5fd;
    --zimam-settings-workflow-blue-500: #3b82f6;
    --zimam-settings-workflow-indigo-50: #eef2ff;
    --zimam-settings-workflow-indigo-300: #a5b4fc;
    --zimam-settings-workflow-indigo-400: #818cf8;
    --zimam-settings-workflow-indigo-600: #4f46e5;
    --zimam-settings-workflow-indigo-700: #4338ca;
    --zimam-settings-workflow-amber-50: #fffbeb;
    --zimam-settings-workflow-amber-300: #fcd34d;
    --zimam-settings-workflow-amber-400: #fbbf24;
    --zimam-settings-workflow-amber-500: #f59e0b;
    --zimam-settings-workflow-amber-600: #d97706;
    --zimam-settings-workflow-amber-700: #b45309;
    --zimam-settings-workflow-orange-500: #f97316;
    --zimam-settings-workflow-orange-600: #ea580c;
    --zimam-settings-workflow-purple-50: #faf5ff;
    --zimam-settings-workflow-purple-500: #a855f7;
    --zimam-settings-workflow-red-50: #fef2f2;
    --zimam-settings-workflow-red-100: #fee2e2;
    --zimam-settings-workflow-red-500: #ef4444;
    --zimam-settings-workflow-red-600: #dc2626;
    --zimam-settings-workflow-rose-50: #fff1f2;
    --zimam-settings-workflow-rose-300: #fda4af;
    --zimam-settings-workflow-rose-600: #e11d48;
    --zimam-settings-workflow-node-shadow: 0 2px 10px -3px rgba(6, 81, 237, 0.1);
    --zimam-settings-workflow-hover-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    position: relative;
    isolation: isolate;
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-xl);
    background: var(--zimam-settings-workflow-slate-50);
    color: var(--zimam-settings-workflow-slate-700);
    text-align: right; /* RTL text alignment */
    font-family: var(--zimam-settings-workflow-font-sans);
    direction: rtl; /* RTL direction at root level */
}

.zimam-settings-workflow-editor__header[b-d4be1dywyu] {
    position: relative;
    z-index: 10;
    display: flex;
    height: 3.5rem; /* Reduced from 4rem for better vertical spacing */
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--zimam-settings-workflow-slate-200);
    background: var(--color-surface);
    padding-inline: 1.5rem;
}

.zimam-settings-workflow-editor__header-info[b-d4be1dywyu],
.zimam-settings-workflow-editor__header-actions[b-d4be1dywyu] {
    display: flex;
    align-items: center;
}

.zimam-settings-workflow-editor__title-group[b-d4be1dywyu] {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.zimam-settings-workflow-editor__title-toggle[b-d4be1dywyu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
}

.zimam-settings-workflow-editor__title[b-d4be1dywyu] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--zimam-settings-workflow-slate-800);
    transition: color var(--duration-normal) var(--ease-out);
}

.zimam-settings-workflow-editor__title-icon[b-d4be1dywyu] {
    color: var(--zimam-settings-workflow-slate-400);
    transition: color var(--duration-normal) var(--ease-out);
}

.zimam-settings-workflow-editor__title-toggle:hover .zimam-settings-workflow-editor__title[b-d4be1dywyu] {
    color: var(--zimam-settings-workflow-orange-600);
}

.zimam-settings-workflow-editor__title-toggle:hover .zimam-settings-workflow-editor__title-icon[b-d4be1dywyu] {
    color: var(--zimam-settings-workflow-orange-500);
}

.zimam-settings-workflow-editor__subtitle[b-d4be1dywyu] {
    margin-top: 0.125rem;
    font-size: var(--text-sm);
    color: var(--zimam-settings-workflow-slate-400);
}

.zimam-settings-workflow-editor__header-actions[b-d4be1dywyu] {
    gap: 0.75rem;
    direction: ltr; /* Keep action buttons in LTR for consistent icon orientation */
}

.zimam-settings-workflow-editor__header-action-button[b-d4be1dywyu] {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    color: var(--zimam-settings-workflow-slate-500);
    cursor: pointer;
    transition:
        color var(--duration-normal) var(--ease-out),
        border-color var(--duration-normal) var(--ease-out),
        background-color var(--duration-normal) var(--ease-out);
}

.zimam-settings-workflow-editor__header-action-button:hover[b-d4be1dywyu] {
    background: var(--zimam-settings-workflow-slate-50);
    color: var(--zimam-settings-workflow-slate-700);
}

.zimam-settings-workflow-editor__header-action-button:focus-visible[b-d4be1dywyu],
[b-d4be1dywyu] .zimam-settings-workflow-node__section-action-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-node__delete-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__close-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__action-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__delete-button:focus-visible,
[b-d4be1dywyu] .zimam-settings-workflow-approval-toggle:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.18);
}

.zimam-settings-workflow-editor__header-action-icon--play[b-d4be1dywyu] {
    width: 14px;
    height: 14px;
    margin-right: 0.125rem; /* Changed from margin-left for RTL */
}

.zimam-settings-workflow-editor__body[b-d4be1dywyu] {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

.zimam-settings-workflow-editor__background-grid[b-d4be1dywyu] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: radial-gradient(var(--zimam-settings-workflow-slate-300) 1px, transparent 1px);
    background-size: 16px 16px;
}

.zimam-settings-workflow-editor__scroll-area[b-d4be1dywyu] {
    position: relative;
    z-index: 10;
    height: 100%;
    overflow: auto;
    padding: 3rem 1.5rem 3rem; /* Reduced from 4rem to 3rem for better vertical spacing */
    transition: padding var(--duration-normal) var(--ease-out);
}

@media (min-width: 1024px) {
    .zimam-settings-workflow-editor__scroll-area--drawer-open[b-d4be1dywyu] {
        padding-left: 24rem; /* Changed from padding-right for RTL */
    }
}

.zimam-settings-workflow-editor__node-column[b-d4be1dywyu] {
    display: flex;
    min-height: 100%;
    width: 100%;
    max-width: 520px;
    margin-inline: auto;
    flex-direction: column;
}

[b-d4be1dywyu] .zimam-settings-workflow-node {
    position: relative;
    margin-inline: auto;
    text-align: right; /* RTL text alignment for Arabic */
    direction: rtl; /* RTL direction for nodes */
    animation: zimam-settings-workflow-node-enter-b-d4be1dywyu 0.4s var(--ease-out) forwards;
}

[b-d4be1dywyu] .zimam-settings-workflow-node--interactive {
    cursor: pointer;
}

[b-d4be1dywyu] .zimam-settings-workflow-node--elevated {
    z-index: 20;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-xl);
    background: var(--color-surface);
    box-shadow: var(--zimam-settings-workflow-node-shadow);
    color: var(--zimam-settings-workflow-slate-700);
    font-family: var(--zimam-settings-workflow-font-sans);
    transition:
        border-color var(--duration-normal) var(--ease-out),
        box-shadow var(--duration-normal) var(--ease-out),
        background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card--start,
[b-d4be1dywyu] .zimam-settings-workflow-node__card--finish,
[b-d4be1dywyu] .zimam-settings-workflow-node__card--phase,
[b-d4be1dywyu] .zimam-settings-workflow-node__card--task {
    width: 300px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card--action {
    width: 280px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card--start:hover {
    border-color: var(--zimam-settings-workflow-emerald-300);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card--finish:hover {
    border-color: var(--zimam-settings-workflow-rose-300);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__card--task:hover {
    border-color: var(--zimam-settings-workflow-blue-300);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node--interactive:hover .zimam-settings-workflow-node__card--phase {
    border-color: var(--zimam-settings-workflow-indigo-300);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node--interactive:hover .zimam-settings-workflow-node__card--action {
    border-color: var(--zimam-settings-workflow-amber-300);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node--selected .zimam-settings-workflow-node__card--phase {
    border-color: var(--zimam-settings-workflow-indigo-400);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.14), var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node--selected .zimam-settings-workflow-node__card--action {
    border-color: var(--zimam-settings-workflow-amber-400);
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.14), var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle {
    position: absolute;
    left: 50%;
    z-index: 10;
    width: 10px;
    height: 10px;
    transform: translateX(-50%);
    border: 2px solid #fff;
    border-radius: 9999px;
    background: var(--zimam-settings-workflow-slate-300);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--top {
    top: -5px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--bottom {
    bottom: -5px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--start {
    background: var(--zimam-settings-workflow-emerald-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--approved,
[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--rejected {
    bottom: -1rem;
    width: 8px;
    height: 8px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--approved {
    background: var(--zimam-settings-workflow-emerald-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__connection-handle--rejected {
    background: var(--zimam-settings-workflow-red-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__header {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1rem; /* Reduced from 1rem to 0.75rem for better vertical spacing */
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon {
    display: flex;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-lg);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon--start {
    background: var(--zimam-settings-workflow-emerald-50);
    color: var(--zimam-settings-workflow-emerald-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon--finish {
    background: var(--zimam-settings-workflow-rose-50);
    color: var(--zimam-settings-workflow-rose-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon--phase {
    background: var(--zimam-settings-workflow-indigo-50);
    color: var(--zimam-settings-workflow-indigo-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon--action {
    background: var(--zimam-settings-workflow-amber-50);
    color: var(--zimam-settings-workflow-amber-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon--task {
    background: var(--zimam-settings-workflow-blue-50);
    color: var(--zimam-settings-workflow-blue-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon-graphic {
    width: 18px;
    height: 18px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-icon-graphic--play {
    margin-right: 0.125rem; /* Changed from margin-left for RTL */
}

[b-d4be1dywyu] .zimam-settings-workflow-node__content {
    min-width: 0;
    flex: 1;
    padding-top: 0.125rem;
    text-align: right; /* RTL alignment for Arabic text */
}

[b-d4be1dywyu] .zimam-settings-workflow-node__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-md); /* Using ZIMAM design token instead of 0.875rem */
    font-weight: var(--fw-semibold);
    line-height: 1.25;
    color: var(--zimam-settings-workflow-slate-800);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__subtitle {
    overflow: hidden;
    margin-top: 0.125rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-sm); /* Using ZIMAM design token instead of 0.75rem */
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-badge {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    font-size: var(--text-2xs); /* Using ZIMAM design token instead of 10px */
    font-weight: var(--fw-semibold);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-badge--start {
    background: var(--zimam-settings-workflow-emerald-50);
    color: var(--zimam-settings-workflow-emerald-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-badge--finish {
    background: var(--zimam-settings-workflow-rose-50);
    color: var(--zimam-settings-workflow-rose-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-badge--phase {
    background: var(--zimam-settings-workflow-indigo-50);
    color: var(--zimam-settings-workflow-indigo-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__category-badge--action {
    background: var(--zimam-settings-workflow-amber-50);
    color: var(--zimam-settings-workflow-amber-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section {
    border-top: 1px solid rgba(241, 245, 249, 0.6);
    padding: 0.625rem 1rem; /* Reduced from 0.75rem 0 and added horizontal padding for consistency */
    background: var(--color-surface);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section--muted,
[b-d4be1dywyu] .zimam-settings-workflow-node__footer {
    background: rgba(248, 250, 252, 0.5);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-title {
    margin-bottom: 0.5rem;
    font-size: 10px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-title--inset {
    padding-inline: 1rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding-inline: 1rem;
    margin-bottom: 0.5rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-list {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding-inline: 1rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-row {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 0.5rem;
    align-items: start;
    font-size: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-label {
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-value {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-value--accent {
    color: inherit;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-value--start {
    color: var(--zimam-settings-workflow-emerald-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__configuration-value--finish {
    color: var(--zimam-settings-workflow-rose-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__status-indicator {
    width: 6px;
    height: 6px;
    border-radius: 9999px;
    background: currentColor;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-action-button,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__action-button {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: var(--text-2xs); /* Using ZIMAM design token instead of 10px */
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-action-button--phase,
[b-d4be1dywyu] .zimam-settings-workflow-drawer--phase .zimam-settings-workflow-drawer__action-button {
    color: var(--zimam-settings-workflow-indigo-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__section-action-button--phase:hover,
[b-d4be1dywyu] .zimam-settings-workflow-drawer--phase .zimam-settings-workflow-drawer__action-button:hover {
    color: var(--zimam-settings-workflow-indigo-700);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer--action .zimam-settings-workflow-drawer__action-button {
    color: var(--zimam-settings-workflow-amber-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer--action .zimam-settings-workflow-drawer__action-button:hover {
    color: var(--zimam-settings-workflow-amber-700);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-list,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-list {
    padding-inline: 1rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-card,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-card--top-aligned,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item--top-aligned {
    align-items: flex-start;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-icon {
    display: flex;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-xs);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-icon--task {
    background: var(--zimam-settings-workflow-blue-50);
    color: var(--zimam-settings-workflow-blue-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-icon--condition {
    margin-top: 0.125rem;
    background: var(--zimam-settings-workflow-purple-50);
    color: var(--zimam-settings-workflow-purple-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-icon-graphic {
    width: 12px;
    height: 12px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-icon-graphic--condition {
    width: 10px;
    height: 10px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-label {
    overflow: hidden;
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-700);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__linked-condition-text {
    flex: 1;
    white-space: pre-wrap;
    font-family: var(--zimam-settings-workflow-font-mono);
    font-size: 11px;
    line-height: 1.625;
    color: var(--zimam-settings-workflow-slate-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__empty-state,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__empty-state {
    padding: 0.5rem 1rem;
    border: 1px dashed var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-sm);
    background: var(--zimam-settings-workflow-slate-50);
    text-align: center;
    font-size: 11px;
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__empty-state {
    padding-block: 1rem;
    font-size: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-list {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0 1rem 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-card {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    border: 1px solid var(--zimam-settings-workflow-slate-100);
    border-radius: var(--radius-sm);
    background: var(--zimam-settings-workflow-slate-50);
    font-size: 11px;
    color: var(--zimam-settings-workflow-slate-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-keyword {
    flex-shrink: 0;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-amber-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-condition,
[b-d4be1dywyu] .zimam-settings-workflow-node__rule-action {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-condition {
    flex: 1;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-action {
    max-width: 80px;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__rule-overflow-count {
    padding-top: 0.25rem;
    text-align: center;
    font-size: 10px;
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border-top: 1px solid rgba(241, 245, 249, 0.6);
    padding: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__footer-message {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.75rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__footer-label {
    font-size: 0.75rem;
    font-weight: var(--fw-semibold);
    color: var(--zimam-settings-workflow-slate-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-node__delete-button {
    position: absolute;
    top: -0.75rem;
    right: -0.75rem;
    z-index: 50;
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--zimam-settings-workflow-red-100);
    border-radius: 9999px;
    background: var(--zimam-settings-workflow-red-50);
    color: var(--zimam-settings-workflow-red-500);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    opacity: 0;
    transition:
        opacity var(--duration-normal) var(--ease-out),
        color var(--duration-normal) var(--ease-out),
        background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-node--interactive:hover .zimam-settings-workflow-node__delete-button,
[b-d4be1dywyu] .zimam-settings-workflow-node:focus-within .zimam-settings-workflow-node__delete-button,
[b-d4be1dywyu] .zimam-settings-workflow-node__delete-button--visible {
    opacity: 1;
}

[b-d4be1dywyu] .zimam-settings-workflow-node__delete-button:hover,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__delete-button:hover {
    background: var(--zimam-settings-workflow-red-100);
    color: var(--zimam-settings-workflow-red-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-approval-toggle {
    position: relative;
    width: 2rem;
    height: 1rem;
    border: 0;
    border-radius: 9999px;
    background: var(--zimam-settings-workflow-slate-300);
    cursor: pointer;
    transition: background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-approval-toggle--active {
    background: var(--zimam-settings-workflow-emerald-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-approval-toggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 9999px;
    background: #fff;
    transition: transform var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-approval-toggle--active .zimam-settings-workflow-approval-toggle__thumb {
    transform: translateX(16px);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__title {
    margin-bottom: 0.5rem;
    padding-inline: 0.75rem;
    font-size: 10px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--zimam-settings-workflow-orange-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__details {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-inline: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__label {
    color: var(--zimam-settings-workflow-slate-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__approver-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-700);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__branches {
    display: flex;
    justify-content: space-between;
    margin-top: 0.75rem;
    padding-bottom: 0.25rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__branch {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: var(--fw-medium);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__branch--approved {
    color: var(--zimam-settings-workflow-emerald-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__branch--rejected {
    color: var(--zimam-settings-workflow-red-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-task-approval__branch-icon {
    width: 14px;
    height: 14px;
}

[b-d4be1dywyu] .zimam-settings-workflow-connector {
    position: relative;
    z-index: 0;
    display: flex;
    width: 100%;
    height: 4rem;
    margin-block: -0.25rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__line {
    position: absolute;
    left: 50%;
    width: 1.5px;
    height: 100%;
    transform: translateX(-50%);
    background: var(--zimam-settings-workflow-slate-300);
    pointer-events: none;
    transition: background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector:hover .zimam-settings-workflow-connector__line {
    background: var(--zimam-settings-workflow-indigo-300);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__control {
    position: relative;
    z-index: 10;
    width: 2rem;
    height: 2rem;
    pointer-events: auto;
    transition: transform var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__control--shifted {
    transform: translateY(-38px);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--zimam-settings-workflow-slate-500);
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition:
        color var(--duration-normal) var(--ease-out),
        border-color var(--duration-normal) var(--ease-out),
        box-shadow var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button:hover,
[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button--open {
    border-color: var(--zimam-settings-workflow-indigo-400);
    color: var(--zimam-settings-workflow-indigo-600);
    box-shadow: var(--zimam-settings-workflow-hover-shadow);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button-icon {
    transition: transform var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button-icon--open {
    transform: rotate(45deg);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    z-index: 50;
    display: flex;
    width: 9rem;
    margin-top: 0.5rem;
    transform: translateX(-50%);
    transform-origin: top center;
    flex-direction: column;
    gap: 0.125rem;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    padding: 0.25rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
    animation: zimam-settings-workflow-connector-menu-enter-b-d4be1dywyu 150ms var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu-button {
    display: inline-flex;
    height: 2rem;
    align-items: center;
    gap: 0.5rem;
    border: 0;
    border-radius: var(--radius-sm);
    background: transparent;
    padding-inline: 0.625rem;
    color: var(--zimam-settings-workflow-slate-700);
    font-size: 0.875rem;
    font-weight: var(--fw-medium);
    text-align: left;
    cursor: pointer;
    transition: background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu-button:hover {
    background: var(--zimam-settings-workflow-slate-50);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu-icon {
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-connector__scrim {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer {
    --zimam-settings-workflow-accent: var(--zimam-settings-workflow-indigo-600);
    --zimam-settings-workflow-accent-soft: rgba(79, 70, 229, 0.18);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 30;
    display: flex;
    width: 24rem;
    max-width: 100%;
    height: 100%;
    flex-direction: column;
    border-left: 1px solid var(--zimam-settings-workflow-slate-200);
    background: var(--color-surface);
    color: var(--zimam-settings-workflow-slate-700);
    text-align: left;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    font-family: var(--zimam-settings-workflow-font-sans);
    animation: zimam-settings-workflow-drawer-enter-b-d4be1dywyu 200ms var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer--action {
    --zimam-settings-workflow-accent: var(--zimam-settings-workflow-amber-600);
    --zimam-settings-workflow-accent-soft: rgba(217, 119, 6, 0.18);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border-bottom: 1px solid var(--zimam-settings-workflow-slate-100);
    padding: 1rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__title {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--zimam-settings-workflow-slate-800);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__title-icon {
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__close-button,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__delete-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: var(--zimam-settings-workflow-slate-400);
    cursor: pointer;
    transition:
        color var(--duration-normal) var(--ease-out),
        background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__close-button {
    padding: 0.375rem;
    border-radius: var(--radius-sm);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__close-button:hover {
    background: var(--zimam-settings-workflow-slate-100);
    color: var(--zimam-settings-workflow-slate-600);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__delete-button {
    border-radius: var(--radius-sm);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__body {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__stack {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__section {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__section-title {
    font-size: 0.875rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-800);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__field {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__field--compact {
    gap: 0.375rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__label {
    font-size: 0.75rem;
    font-weight: var(--fw-medium);
    color: var(--zimam-settings-workflow-slate-500);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__label--caps {
    font-size: 10px;
    font-weight: var(--fw-semibold);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__input,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__select,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__textarea,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-input,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-textarea {
    width: 100%;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--zimam-settings-workflow-slate-700);
    font-family: var(--zimam-settings-workflow-font-sans);
    transition:
        border-color var(--duration-normal) var(--ease-out),
        box-shadow var(--duration-normal) var(--ease-out),
        background-color var(--duration-normal) var(--ease-out);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__input,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__select {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__textarea {
    min-height: 3.5rem;
    resize: none;
    padding: 0.375rem 0.625rem;
    font-family: var(--zimam-settings-workflow-font-mono);
    font-size: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__input:focus,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__select:focus,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__textarea:focus,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-input:focus,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-textarea:focus {
    outline: none;
    border-color: var(--zimam-settings-workflow-accent);
    box-shadow: 0 0 0 2px var(--zimam-settings-workflow-accent-soft);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item {
    background: var(--zimam-settings-workflow-slate-50);
    box-shadow: none;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-icon {
    flex-shrink: 0;
    color: var(--zimam-settings-workflow-slate-400);
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-icon--grab {
    cursor: grab;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-input,
[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-textarea {
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-input {
    flex: 1;
    font-size: 0.875rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__list-item-textarea {
    min-height: 3.5rem;
    flex: 1;
    resize: none;
    font-family: var(--zimam-settings-workflow-font-mono);
    font-size: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__rule-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    border: 1px solid var(--zimam-settings-workflow-slate-200);
    border-radius: var(--radius-lg);
    background: var(--zimam-settings-workflow-slate-50);
    padding: 0.75rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__rule-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-right: 1.5rem;
}

[b-d4be1dywyu] .zimam-settings-workflow-drawer__rule-card .zimam-settings-workflow-drawer__delete-button {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
}

@keyframes zimam-settings-workflow-node-enter-b-d4be1dywyu {
    0% {
        opacity: 0;
        transform: scale(0.94) translateY(-10px);
    }

    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes zimam-settings-workflow-drawer-enter-b-d4be1dywyu {
    0% {
        opacity: 0;
        transform: translateX(1rem);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes zimam-settings-workflow-connector-menu-enter-b-d4be1dywyu {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(-5px) scale(0.95);
    }

    100% {
        opacity: 1;
        transform: translateX(-50%) translateY(0) scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    [b-d4be1dywyu] .zimam-settings-workflow-node,
    [b-d4be1dywyu] .zimam-settings-workflow-drawer,
    [b-d4be1dywyu] .zimam-settings-workflow-connector__insert-menu {
        animation: none;
    }

    .zimam-settings-workflow-editor__scroll-area[b-d4be1dywyu],
    [b-d4be1dywyu] .zimam-settings-workflow-node__card,
    [b-d4be1dywyu] .zimam-settings-workflow-node__delete-button,
    [b-d4be1dywyu] .zimam-settings-workflow-connector__control,
    [b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button,
    [b-d4be1dywyu] .zimam-settings-workflow-connector__insert-button-icon,
    .zimam-settings-workflow-editor__header-action-button[b-d4be1dywyu],
    [b-d4be1dywyu] .zimam-settings-workflow-node__section-action-button,
    [b-d4be1dywyu] .zimam-settings-workflow-drawer__action-button,
    [b-d4be1dywyu] .zimam-settings-workflow-drawer__close-button,
    [b-d4be1dywyu] .zimam-settings-workflow-drawer__delete-button,
    [b-d4be1dywyu] .zimam-settings-workflow-approval-toggle,
    [b-d4be1dywyu] .zimam-settings-workflow-approval-toggle__thumb {
        transition: none;
    }
}
/* /Modules/Tasks/Pages/CalendarPage/CalendarPage.razor.rz.scp.css */
.zimam-calendar-page[b-awbxf29fp6] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    width: 100%;
}

.zimam-calendar-page__content[b-awbxf29fp6] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 1rem;
    min-height: 0;
    padding-bottom: 1.5rem;
}

.zimam-calendar-page__header[b-awbxf29fp6] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.zimam-calendar-page__header-text[b-awbxf29fp6] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.zimam-calendar-page__title[b-awbxf29fp6] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
}

.zimam-calendar-page__subtitle[b-awbxf29fp6] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-md);
    line-height: var(--lh-relaxed);
}

.zimam-calendar-page__header-actions[b-awbxf29fp6] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.zimam-calendar-page__primary-btn[b-awbxf29fp6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding-inline: 1rem;
    color: var(--color-surface);
    background: var(--color-text-strong);
    border: none;
    border-radius: var(--radius-md);
    font-family: inherit;
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-calendar-page__primary-btn:hover[b-awbxf29fp6] {
    background: var(--color-text-secondary);
}

.zimam-calendar-page__primary-btn:focus-visible[b-awbxf29fp6] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-calendar-page__section[b-awbxf29fp6] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    overflow: visible;
}

.zimam-calendar-page__tabs[b-awbxf29fp6] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0 0.75rem;
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-calendar-page__tab[b-awbxf29fp6],
.zimam-calendar-page__toggle-btn[b-awbxf29fp6] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 -1px;
    padding: 0.75rem 0.25rem;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.zimam-calendar-page__tab:hover[b-awbxf29fp6],
.zimam-calendar-page__toggle-btn:hover[b-awbxf29fp6] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-calendar-page__tab--active[b-awbxf29fp6] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-calendar-page__tab--active:hover[b-awbxf29fp6] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.zimam-views-dropdown[b-awbxf29fp6] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-bottom: 0;
}

.zimam-views-dropdown__backdrop[b-awbxf29fp6] {
    position: fixed;
    inset: 0;
    z-index: 59;
    background: transparent;
}

.zimam-views-dropdown__panel[b-awbxf29fp6] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    z-index: 60;
    width: min(22rem, 90vw);
    overflow: hidden;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.625rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
}

.zimam-views-dropdown__chevron[b-awbxf29fp6] {
    transition: transform var(--duration-fast) var(--ease-default);
}

.zimam-views-dropdown__chevron--open[b-awbxf29fp6] {
    transform: rotate(180deg);
}

.zimam-tab-badge[b-awbxf29fp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    color: var(--color-text-secondary);
    background: var(--color-bg);
    border-radius: var(--radius-pill);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-views-dropdown__header[b-awbxf29fp6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    color: var(--color-text-muted);
    border-bottom: 1px solid var(--color-border);
    font-size: 0.6875rem;
    font-weight: var(--fw-semibold);
}

.zimam-views-dropdown__list[b-awbxf29fp6] {
    max-height: 18rem;
    overflow-y: auto;
    padding: 0.375rem;
}

.zimam-views-dropdown__section-label[b-awbxf29fp6] {
    padding: 0.625rem 0.5rem 0.25rem;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-views-dropdown__item[b-awbxf29fp6] {
    border-radius: var(--radius-md);
}

.zimam-views-dropdown__item-btn[b-awbxf29fp6] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.625rem 0.5rem;
    color: var(--color-text-secondary);
    text-align: start;
    background: transparent;
    border: 0;
    border-radius: inherit;
    font-family: inherit;
    font-size: var(--text-sm);
    cursor: pointer;
}

.zimam-views-dropdown__item-btn:hover[b-awbxf29fp6],
.zimam-views-dropdown__item--active .zimam-views-dropdown__item-btn[b-awbxf29fp6] {
    color: var(--color-text-strong);
    background: var(--color-bg-subtle);
}

.zimam-views-dropdown__item-name[b-awbxf29fp6] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-views-dropdown__item-active-dot[b-awbxf29fp6] {
    width: 0.45rem;
    height: 0.45rem;
    margin-inline-start: auto;
    background: var(--color-text-strong);
    border-radius: 50%;
}

.zimam-calendar-page__results[b-awbxf29fp6] {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 0;
    padding-top: 0.5rem;
}

.zimam-calendar-page__controls-wrap[b-awbxf29fp6] {
    display: grid;
    grid-template-rows: 1fr;
    margin-bottom: 0.5rem;
    opacity: 1;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
}

.zimam-calendar-page__controls-inner[b-awbxf29fp6] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    overflow: visible;
}

.zimam-calendar-page__results--controls-collapsed .zimam-calendar-page__controls-wrap[b-awbxf29fp6] {
    grid-template-rows: 0fr;
    margin-bottom: 0;
    opacity: 0;
}

.zimam-calendar-page__results--controls-collapsed .zimam-calendar-page__controls-inner[b-awbxf29fp6] {
    overflow: hidden;
}

.zimam-calendar-page__toolbar[b-awbxf29fp6] {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    padding: 0;
}

.zimam-calendar-page__filter-layer[b-awbxf29fp6] {
    padding: 0.75rem;
    background: linear-gradient(180deg, var(--color-surface), color-mix(in srgb, var(--color-bg-subtle) 48%, var(--color-surface)));
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-card, var(--radius-lg));
    box-shadow: var(--shadow-xs, none);
}

.zimam-calendar-page__toolbar .zimam-table-toolbar__filter-btn[b-awbxf29fp6] {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.5rem;
    height: 2.125rem;
    margin-inline-start: auto;
    padding-inline: 0.75rem;
    color: var(--color-surface);
    background: var(--color-text-strong);
    border: none;
    border-radius: var(--radius-md);
    font-family: inherit;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-calendar-page__toolbar .zimam-table-toolbar__filter-btn:hover[b-awbxf29fp6] {
    background: var(--color-text-secondary);
}

.zimam-calendar-page__toolbar .zimam-table-toolbar__filter-btn:focus-visible[b-awbxf29fp6] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-calendar-page__toolbar .zimam-filter-count-badge[b-awbxf29fp6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    color: var(--color-text-strong);
    background: var(--color-surface);
    border-radius: var(--radius-pill);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-calendar-page__search-wrap[b-awbxf29fp6] {
    flex: 1 1 28rem;
    max-width: 36rem;
    min-width: 16rem;
}

.zimam-calendar-page__calendar[b-awbxf29fp6] {
    --calendar-view-max-height: calc(100dvh - 15rem);

    display: flex;
    flex: 1;
    min-height: 34rem;
    overflow: hidden;
}

.zimam-calendar-page__calendar[b-awbxf29fp6]  .zimam-task-calendar {
    flex: 1;
    min-height: 34rem;
    max-height: var(--calendar-view-max-height);
}

@media (max-width: 1024px) {
    .zimam-calendar-page__toolbar[b-awbxf29fp6] {
        flex-wrap: wrap;
    }

    .zimam-calendar-page__search-wrap[b-awbxf29fp6] {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .zimam-calendar-page__tabs[b-awbxf29fp6] {
        overflow-x: auto;
        padding-inline: 0.5rem;
    }

    .zimam-calendar-page__toolbar .zimam-table-toolbar__filter-btn[b-awbxf29fp6] {
        margin-inline-start: 0;
    }

    .zimam-calendar-page__calendar[b-awbxf29fp6] {
        --calendar-view-max-height: none;
        min-height: 28rem;
        overflow: visible;
    }

    .zimam-calendar-page__calendar[b-awbxf29fp6]  .zimam-task-calendar {
        max-height: none;
    }
}
/* /Modules/Tasks/Pages/KanbanPage/KanbanPage.razor.rz.scp.css */
/* ==========================================================================
   KanbanPage — Dedicated task board with the same header/toolbar language
   as the main task management page.
   ========================================================================== */

.zimam-kanban-page[b-dkp61wlhz7] {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.zimam-kanban-page__content[b-dkp61wlhz7] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 1.5rem;
}

.zimam-kanban-page__header[b-dkp61wlhz7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.zimam-kanban-page__header-text[b-dkp61wlhz7] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.zimam-kanban-page__title[b-dkp61wlhz7] {
    margin: 0;
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.zimam-kanban-page__subtitle[b-dkp61wlhz7] {
    margin: 0;
    font-size: var(--text-md);
    color: var(--color-text-muted);
    line-height: var(--lh-relaxed);
}

.zimam-kanban-page__header-actions[b-dkp61wlhz7] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zimam-kanban-page__primary-btn[b-dkp61wlhz7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding-inline: 1rem;
    border: none;
    border-radius: var(--radius-md);
    background: var(--color-text-strong);
    color: var(--color-surface);
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    font-family: inherit;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-kanban-page__primary-btn:hover[b-dkp61wlhz7] {
    background: var(--color-text-secondary);
}

.zimam-kanban-page__primary-btn:focus-visible[b-dkp61wlhz7] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-kanban-page__section[b-dkp61wlhz7] {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: visible;
}

.zimam-kanban-page__tabs[b-dkp61wlhz7] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0 0.75rem;
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-kanban-page__tab[b-dkp61wlhz7],
.zimam-kanban-page__toggle-btn[b-dkp61wlhz7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0.25rem;
    border: none;
    background: transparent;
    color: var(--color-text-muted);
    font-size: 12px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    margin: 0;
    margin-bottom: -1px;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}

.zimam-kanban-page__tab:hover[b-dkp61wlhz7],
.zimam-kanban-page__toggle-btn:hover[b-dkp61wlhz7] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-kanban-page__tab--active[b-dkp61wlhz7] {
    color: var(--color-text-strong);
    font-weight: 600;
    border-bottom-color: var(--color-text-strong);
}

.zimam-kanban-page__tab--active:hover[b-dkp61wlhz7] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.zimam-tabs__separator[b-dkp61wlhz7] {
    width: 1px;
    align-self: stretch;
    margin-block: 0.5rem;
    background: var(--color-border);
    flex-shrink: 0;
}

.zimam-kanban-page__tab--dropdown[b-dkp61wlhz7] {
    gap: 0.375rem;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-views-dropdown[b-dkp61wlhz7] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-bottom: -1px;
}

.zimam-views-dropdown__chevron[b-dkp61wlhz7] {
    transition: transform var(--duration-fast) var(--ease-default);
}

.zimam-views-dropdown__chevron--open[b-dkp61wlhz7] {
    transform: rotate(180deg);
}

.zimam-tab-badge[b-dkp61wlhz7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg);
    color: var(--color-text-secondary);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-kanban-page__tab--active .zimam-tab-badge[b-dkp61wlhz7] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-views-dropdown__backdrop[b-dkp61wlhz7] {
    position: fixed;
    inset: 0;
    z-index: 59;
    background: transparent;
}

.zimam-views-dropdown__panel[b-dkp61wlhz7] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    width: min(22rem, 90vw);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.625rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    z-index: 60;
    overflow: hidden;
    animation: zimam-kanban-views-dropdown-in-b-dkp61wlhz7 var(--duration-fast) var(--ease-default);
}

@keyframes zimam-kanban-views-dropdown-in-b-dkp61wlhz7 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-views-dropdown__header[b-dkp61wlhz7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    border-bottom: 1px solid var(--color-border);
    font-size: 0.6875rem;
    font-weight: var(--fw-semibold);
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.zimam-views-dropdown__count[b-dkp61wlhz7] {
    font-size: 0.625rem;
    font-weight: var(--fw-medium);
    color: var(--color-text-faint);
}

.zimam-views-dropdown__list[b-dkp61wlhz7] {
    max-height: 16rem;
    overflow-y: auto;
    padding: 0.25rem;
    scrollbar-width: thin;
}

.zimam-views-dropdown__section-label[b-dkp61wlhz7] {
    padding: 0.5rem 0.625rem 0.25rem;
    font-size: 0.6875rem;
    font-weight: var(--fw-semibold);
    color: var(--color-text-muted);
}

.zimam-views-dropdown__item[b-dkp61wlhz7] {
    display: flex;
    align-items: center;
    border-radius: var(--radius-sm);
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-views-dropdown__item:hover[b-dkp61wlhz7],
.zimam-views-dropdown__item--active[b-dkp61wlhz7],
.zimam-views-dropdown__item--active:hover[b-dkp61wlhz7] {
    background: var(--color-bg-subtle);
}

.zimam-views-dropdown__item-btn[b-dkp61wlhz7] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: none;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary);
    cursor: pointer;
    text-align: start;
    min-width: 0;
}

.zimam-views-dropdown__item--active .zimam-views-dropdown__item-btn[b-dkp61wlhz7] {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.zimam-views-dropdown__item-name[b-dkp61wlhz7] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.zimam-views-dropdown__item-active-dot[b-dkp61wlhz7] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    flex-shrink: 0;
}

.zimam-kanban-page__toggle-btn[b-dkp61wlhz7] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint);
    border-bottom: none;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-kanban-page__toggle-btn:hover[b-dkp61wlhz7] {
    color: var(--color-text-secondary);
    border-bottom-color: transparent;
}

.zimam-kanban-page__toggle-btn:focus-visible[b-dkp61wlhz7],
.zimam-kanban-page__tab:focus-visible[b-dkp61wlhz7] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-kanban-page__results[b-dkp61wlhz7] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0;
}

.zimam-kanban-page__controls-wrap[b-dkp61wlhz7] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
    opacity: 1;
    margin-bottom: 0.5rem;
}

.zimam-kanban-page__controls-inner[b-dkp61wlhz7] {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-kanban-page__results--controls-collapsed .zimam-kanban-page__controls-wrap[b-dkp61wlhz7] {
    grid-template-rows: 0fr;
    opacity: 0;
    margin-bottom: 0;
}

.zimam-kanban-page__toolbar[b-dkp61wlhz7] {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.zimam-kanban-page__search-wrap[b-dkp61wlhz7] {
    width: 100%;
    max-width: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__filter-btn[b-dkp61wlhz7] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong);
    color: var(--color-surface);
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: inherit;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
    position: relative;
    flex-shrink: 0;
    margin-inline-start: auto;
}

.zimam-table-toolbar__filter-btn:hover[b-dkp61wlhz7] {
    background: var(--color-text-secondary);
}

.zimam-table-toolbar__filter-btn:focus-visible[b-dkp61wlhz7] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-filter-count-badge[b-dkp61wlhz7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: var(--radius-pill);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font-size: var(--text-2xs);
    font-weight: var(--fw-bold);
    line-height: 1;
}

.zimam-kanban-page__board[b-dkp61wlhz7] {
    flex: 1;
    position: relative;
    min-height: 32rem;
    min-width: 0;
    background: transparent;
    overflow: visible;
    --kanban-column-max-height: calc(100dvh - 20rem);
}

.zimam-kanban-page__board[b-dkp61wlhz7]  .zimam-data-state {
    flex: 1;
    min-height: inherit;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1024px) {
    .zimam-kanban-page__toolbar[b-dkp61wlhz7] {
        align-items: stretch;
    }

    .zimam-kanban-page__search-wrap[b-dkp61wlhz7] {
        flex-basis: 100%;
        min-width: 0;
        width: 100%;
    }

    .zimam-kanban-page__board[b-dkp61wlhz7] {
        --kanban-column-max-height: calc(100dvh - 22rem);
    }
}

@media (max-width: 768px) {
    .zimam-kanban-page__content[b-dkp61wlhz7] {
        gap: 0.75rem;
    }

    .zimam-kanban-page__header-actions[b-dkp61wlhz7],
    .zimam-kanban-page__toolbar[b-dkp61wlhz7] {
        width: 100%;
    }

    .zimam-kanban-page__primary-btn[b-dkp61wlhz7],
    .zimam-table-toolbar__filter-btn[b-dkp61wlhz7] {
        width: 100%;
    }

    .zimam-kanban-page__tabs[b-dkp61wlhz7] {
        flex-wrap: wrap;
    }

    .zimam-kanban-page__toggle-btn[b-dkp61wlhz7] {
        margin-inline-start: 0;
    }

    .zimam-kanban-page__board[b-dkp61wlhz7] {
        min-height: 28rem;
        --kanban-column-max-height: calc(100dvh - 24rem);
    }
}
/* /Modules/Tasks/Pages/TaskListPage/TaskListPage/TaskListPage.razor.rz.scp.css */
/* ==========================================================================
   TaskListPage — Page layout, header, stats, content-layout, tabs, tracker
   Scoped to TaskListPage.razor via Blazor CSS isolation
   Mirrors CaseManagement design patterns with zimam-task-management__ prefix
   ========================================================================== */

/* ── Drawer breadcrumb (rendered in PrimarySubHeader slot) ── */

.drawer-breadcrumb[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs, 0.75rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary, #64748b);
    padding-top: 0.375rem;
}

.drawer-breadcrumb-link[b-c17p2zlnha] {
    background: none;
    border: none;
    padding: 0;
    color: var(--color-text-secondary, #64748b);
    font-size: inherit;
    font-weight: inherit;
    cursor: pointer;
    transition: color 0.15s;
}

.drawer-breadcrumb-link:hover[b-c17p2zlnha] {
    color: var(--color-primary, #2563eb);
    text-decoration: underline;
}

.drawer-breadcrumb-sep[b-c17p2zlnha] {
    color: var(--color-text-faint, #94a3b8);
    user-select: none;
}

.drawer-breadcrumb-current[b-c17p2zlnha] {
    color: var(--color-text-strong, #1e293b);
}

/* ── Page shell ── */
.zimam-task-management[b-c17p2zlnha] {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.zimam-task-management__content[b-c17p2zlnha] {
    padding-inline: 0px;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 1.5rem;
}

/* ── Content layout: Results + Quick-Action Column ── */
.zimam-task-management__content-layout[b-c17p2zlnha] {
    display: flex;
    gap: 1rem;
    flex: 1;
    min-height: 0;
    align-items: stretch;
    contain: layout style;
}

.zimam-task-management__quick-action-column[b-c17p2zlnha] {
    width: 400px;
    flex-shrink: 0;
    align-self: stretch;
    position: relative;
    top: auto;
    height: auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1280px) {
    .zimam-task-management__quick-action-column[b-c17p2zlnha] {
        width: 360px;
    }
}

@media (max-width: 1024px) {
    .zimam-task-management__content-layout[b-c17p2zlnha] {
        flex-direction: column;
    }

    .zimam-task-management__quick-action-column[b-c17p2zlnha] {
        width: 100%;
        position: static;
        min-height: 28rem;
    }

}

/* ── Results section ── */
.zimam-task-management__results[b-c17p2zlnha] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-top: 0.5rem;
    padding-inline: 0.75rem;
    padding-bottom: 0.75rem;
}

/* ── Controls collapse ── */
.zimam-task-management__controls-wrap[b-c17p2zlnha] {
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows 220ms var(--ease-default),
                opacity 180ms var(--ease-default),
                margin-bottom 220ms var(--ease-default);
    opacity: 1;
    margin-bottom: 0.25rem;
}

.zimam-task-management__controls-inner[b-c17p2zlnha] {
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-task-management__results--controls-collapsed .zimam-task-management__controls-wrap[b-c17p2zlnha] {
    grid-template-rows: 0fr;
    opacity: 0;
    margin-bottom: 0;
}

.zimam-task-management__results--controls-collapsed .zimam-task-management__controls-inner[b-c17p2zlnha] {
    overflow: hidden;
}

/* ── Section group ── */
.zimam-section-group[b-c17p2zlnha] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, 0.375rem);
    padding: 0;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

/* ── Cards well ── */
.zimam-task-management__cards-well[b-c17p2zlnha] {
    flex: 1;
    min-height: 24rem;
    overflow: auto;
    padding-top: 0.5rem;
}

/* ── Table well ── */
.zimam-task-management__table-well[b-c17p2zlnha] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 24rem;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    contain: layout style;
    font-size: 12px;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-table-wrap {
    flex: 1;
    overflow-y: auto;
}

/* ── Enterprise single-table pattern: one <table> with sticky <thead> ──
   - Guarantees header/body column alignment (single DOM table)
   - Horizontal scroll kicks in when viewport is narrower than the table
   - Vertical scroll lives on the same container; thead stays sticky
*/
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table-shell {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table-scroll {
    flex: 1;
    min-height: 0;
    overflow: auto;
    scrollbar-gutter: stable;
    contain: layout style;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table {
    table-layout: fixed;
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

/* Sticky header — matches Cases table header (bg-subtle + border shadow) */
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table thead th {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky, 10);
    background: var(--color-bg-subtle);
    box-shadow: 0 1px 0 0 var(--color-border);
    border-bottom: 0;
    white-space: nowrap;
}

/* Every body cell: single line + ellipsis (no wrapping anywhere) */
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table tbody td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-data-state {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: inherit;
}

/* ── Compact Table Styling — matches Cases (11px font, 35px row) ── */
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table {
    font-size: 11px;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table thead th,
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table tbody td {
    font-size: 11px;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table thead th {
    height: 35px;
    font-weight: 700;
    text-align: start;
    padding-block: 8px;
    padding-inline: 12px;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-table tbody td {
    height: 35px;
    padding: 8px;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-pill {
    font-size: 11px;
    padding-inline: 2em;
    padding-block: 0.2em;
    line-height: 1.25;
    border-radius: 999em;
}

/* ── Task name cell — same look as other cells, just bolder title ── */
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-task-name-cell {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

/* ── Column widths — title/action are fixed; remaining columns can expand
      so horizontal scrolling is available when the dataset needs it. */
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-col-title  { width: 14rem; }
.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-col-action { width: 3rem; }

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-col-action-cell {
    text-align: center;
    padding-block: 0;
    padding-inline: 0.25rem;
}

.zimam-task-management__table-well[b-c17p2zlnha]  .zimam-col-action-cell .zimam-action-btn {
    min-width: 2rem;
    min-height: 2rem;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
}

/* ── Task overview strip ── */
.zimam-task-overview[b-c17p2zlnha] {
    margin-bottom: 1rem;
    padding-inline: 0;
}

/* ── Module header ── */
.zimam-module-header[b-c17p2zlnha] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 0.75rem;
    position: relative;
    gap: 1rem;
}

.zimam-module-header[b-c17p2zlnha]::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline: -24px;
    height: 1px;
    background: var(--color-border);
}

.zimam-module-header__text[b-c17p2zlnha] {
    flex: 1;
}

.zimam-module-header__title[b-c17p2zlnha] {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-strong);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-top: 0px;
    margin-bottom: 1px;
}

.zimam-module-header__subtitle[b-c17p2zlnha] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin-top: 0px;
    margin-bottom: 1px;
    max-width: 38rem;
    line-height: 1.5;
}

.zimam-module-header__actions[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
}

.zimam-module-header__btn[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
    white-space: nowrap;
}

.zimam-module-header__btn:hover[b-c17p2zlnha] {
    opacity: 0.9;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.zimam-module-header__btn:active[b-c17p2zlnha] {
    transform: translateY(0);
}

.zimam-module-header__timeframe[b-c17p2zlnha] {
    appearance: none;
    background: #fff;
    border: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 12px;
    font-weight: 500;
    border-radius: 0.5rem;
    height: 2.25rem;
    padding-inline: 1rem 2.25rem;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-module-header__timeframe:hover[b-c17p2zlnha] {
    background: var(--color-surface-hover);
}

.zimam-module-header__timeframe:focus-visible[b-c17p2zlnha] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-module-header__timeframe-wrap[b-c17p2zlnha] {
    position: relative;
    display: inline-flex;
    align-items: center;
    contain: layout style;
    flex-shrink: 0;
}

.zimam-module-header__timeframe-chevron[b-c17p2zlnha] {
    position: absolute;
    left: 0.75rem;
    top: 0;
    bottom: 0;
    margin-block: auto;
    display: block;
    pointer-events: none;
    color: var(--color-text-faint);
}

/* ── Tabs (view switcher) ── */
.zimam-tabs[b-c17p2zlnha] {
    display: flex;
    gap: 0.875rem;
    border-bottom: 1px solid var(--color-border);
    margin: 0;
    padding: 0 0.75rem;
}

.zimam-tab[b-c17p2zlnha] {
    padding: 0.75rem 0.25rem;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-text-muted);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.15s ease, border-bottom-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    margin-bottom: -1px;
    white-space: nowrap;
}

.zimam-tab:hover[b-c17p2zlnha] {
    color: var(--color-text-secondary);
    border-bottom-color: var(--color-border-hover);
}

.zimam-tab--active[b-c17p2zlnha] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: 600;
}

.zimam-tab--active:hover[b-c17p2zlnha] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
}

.zimam-tabs__separator[b-c17p2zlnha] {
    width: 1px;
    align-self: stretch;
    margin-block: 0.5rem;
    background: var(--color-border, #e2e8f0);
    flex-shrink: 0;
}

.zimam-tab--dropdown[b-c17p2zlnha] {
    gap: 0.375rem;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-views-dropdown[b-c17p2zlnha] {
    position: relative;
    display: inline-flex;
    align-items: stretch;
    margin-bottom: -1px;
}

.zimam-views-dropdown__chevron[b-c17p2zlnha] {
    transition: transform 0.2s ease;
}

.zimam-views-dropdown__chevron--open[b-c17p2zlnha] {
    transform: rotate(180deg);
}

.zimam-tab-badge[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-bg, #f1f5f9);
    color: var(--color-text-secondary, #475569);
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
}

.zimam-tab--active .zimam-tab-badge[b-c17p2zlnha] {
    background: var(--color-bg-subtle, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

.zimam-views-dropdown__backdrop[b-c17p2zlnha] {
    position: fixed;
    inset: 0;
    z-index: 59;
    background: transparent;
}

.zimam-views-dropdown__panel[b-c17p2zlnha] {
    position: absolute;
    top: calc(100% + 4px);
    inset-inline-start: 0;
    width: min(22rem, 90vw);
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    z-index: 60;
    overflow: hidden;
    animation: zimam-task-views-dropdown-in-b-c17p2zlnha 150ms ease;
}

@keyframes zimam-task-views-dropdown-in-b-c17p2zlnha {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-views-dropdown__header[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.875rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--color-text-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.zimam-views-dropdown__count[b-c17p2zlnha] {
    font-size: 0.625rem;
    font-weight: 500;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-views-dropdown__list[b-c17p2zlnha] {
    max-height: 16rem;
    overflow-y: auto;
    padding: 0.25rem;
    scrollbar-width: thin;
}

.zimam-views-dropdown__section-label[b-c17p2zlnha] {
    padding: 0.5rem 0.625rem 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--color-text-muted, #64748b);
}

.zimam-views-dropdown__item[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    border-radius: 0.375rem;
    transition: background 0.1s ease;
}

.zimam-views-dropdown__item:hover[b-c17p2zlnha] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item--active[b-c17p2zlnha],
.zimam-views-dropdown__item--active:hover[b-c17p2zlnha] {
    background: var(--color-bg-subtle, #f8fafc);
}

.zimam-views-dropdown__item-btn[b-c17p2zlnha] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    background: transparent;
    border: none;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    text-align: start;
    min-width: 0;
}

.zimam-views-dropdown__item--active .zimam-views-dropdown__item-btn[b-c17p2zlnha] {
    color: var(--color-text-strong, #0f172a);
    font-weight: 600;
}

.zimam-views-dropdown__item-name[b-c17p2zlnha] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
}

.zimam-views-dropdown__item-active-dot[b-c17p2zlnha] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
}

/* ── Toggle Controls Button ── */
.zimam-tab--toggle[b-c17p2zlnha] {
    margin-inline-start: auto;
    padding: 0.5rem;
    color: var(--color-text-faint, #94a3b8);
    border-bottom: none;
    flex-shrink: 0;
    transition: color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default);
}

.zimam-tab--toggle:hover[b-c17p2zlnha] {
    color: var(--color-text-secondary, #64748b);
    border-bottom-color: transparent;
}

.zimam-tab--toggle-icon[b-c17p2zlnha] {
    transition: transform 220ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.zimam-tab--toggle-collapsed .zimam-tab--toggle-icon[b-c17p2zlnha] {
    transform: rotate(-180deg);
}

/* ── Table toolbar ── */
.zimam-task-management__results .zimam-table-toolbar[b-c17p2zlnha] {
    margin-top: 0;
    margin-bottom: 0;
    padding-block: 0.5rem 0.375rem;
    padding-inline: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.zimam-task-management__results--cards .zimam-table-toolbar[b-c17p2zlnha] {
    margin-top: 0.5rem;
}

.zimam-search-wrapper[b-c17p2zlnha] {
    width: 100%;
    max-width: 450px;
    flex-shrink: 0;
}

.zimam-table-toolbar__total[b-c17p2zlnha] {
    font-size: 12px;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.zimam-table-toolbar__total-count[b-c17p2zlnha] {
    font-weight: 600;
    color: var(--color-text-strong);
}

/* ── Filter button ── */
.zimam-table-toolbar__filter-btn[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 2.125rem;
    padding-inline: 0.75rem;
    background: var(--color-text-strong);
    color: #fff;
    border: none;
    border-radius: 0.5rem;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default);
    position: relative;
    flex-shrink: 0;
    margin-inline-start: auto;
}

.zimam-table-toolbar__filter-btn:hover[b-c17p2zlnha] {
    background: #1e293b;
}

.zimam-table-toolbar__filter-btn:focus-visible[b-c17p2zlnha] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Active filter count badge ── */
.zimam-filter-count-badge[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 9999px;
    background: var(--color-text-strong, #0f172a);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1;
}

/* ── Column Picker Dropdown ── */
.zimam-column-picker[b-c17p2zlnha] {
    position: relative;
    flex-shrink: 0;
    z-index: 30;
    isolation: isolate;
}

.zimam-column-picker__trigger[b-c17p2zlnha] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    padding: 0;
    background: var(--color-surface, #fff);
    color: var(--color-text-secondary, #64748b);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.zimam-column-picker__trigger:hover[b-c17p2zlnha] {
    background: var(--color-surface-hover, #f8fafc);
    color: var(--color-text-strong, #0f172a);
    border-color: var(--color-border-hover, #cbd5e1);
}

.zimam-column-picker__trigger:focus-visible[b-c17p2zlnha] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-column-picker__backdrop[b-c17p2zlnha] {
    position: fixed;
    inset: 0;
    z-index: 99;
}

.zimam-column-picker__panel[b-c17p2zlnha] {
    position: absolute;
    top: calc(100% + 0.375rem);
    inset-inline-end: 0;
    z-index: 100;
    width: 14rem;
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.625rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10), 0 1px 4px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.zimam-column-picker__header[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text-strong, #0f172a);
}

.zimam-column-picker__count[b-c17p2zlnha] {
    font-weight: 400;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-column-picker__list[b-c17p2zlnha] {
    padding: 0.375rem 0;
    max-height: 18rem;
    overflow-y: auto;
}

.zimam-column-picker__item[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4375rem 0.75rem;
    font-size: 12px;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    transition: background 0.1s ease;
    user-select: none;
}

.zimam-column-picker__item:hover[b-c17p2zlnha] {
    background: var(--color-surface-hover, #f8fafc);
}

.zimam-column-picker__item input[type="checkbox"][b-c17p2zlnha] {
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.1875rem;
    border: 1.5px solid var(--color-border, #cbd5e1);
    accent-color: var(--color-text-strong, #0f172a);
    flex-shrink: 0;
    cursor: pointer;
}

.zimam-column-picker__item-label[b-c17p2zlnha] {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Stat row & cards ── */
.zimam-stat-row[b-c17p2zlnha] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

@media (max-width: 1400px) {
    .zimam-stat-row[b-c17p2zlnha] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 1024px) {
    .zimam-task-management__results .zimam-table-toolbar[b-c17p2zlnha] {
        flex-wrap: wrap;
    }

    .zimam-search-wrapper[b-c17p2zlnha] {
        flex-basis: 100%;
        width: 100%;
        min-width: 0;
    }

    .zimam-stat-row[b-c17p2zlnha] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 768px) {
    .zimam-stat-row[b-c17p2zlnha] {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.625rem;
    }
}

@media (max-width: 480px) {
    .zimam-stat-row[b-c17p2zlnha] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.zimam-stat-card[b-c17p2zlnha] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem 0.375rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    min-height: 5.75rem;
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-stat-card:not(.zimam-stat-card--loading)[b-c17p2zlnha] {
    animation: zimam-content-appear-b-c17p2zlnha 300ms ease-out backwards;
}
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(1)[b-c17p2zlnha] { animation-delay:  0ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(2)[b-c17p2zlnha] { animation-delay: 50ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(3)[b-c17p2zlnha] { animation-delay: 100ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(4)[b-c17p2zlnha] { animation-delay: 150ms; }
.zimam-stat-card:not(.zimam-stat-card--loading):nth-child(5)[b-c17p2zlnha] { animation-delay: 200ms; }

.zimam-stat-card:hover[b-c17p2zlnha] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-stat-card__icon[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-faint);
}

.zimam-stat-card__body[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.375rem;
    margin-bottom: 0.25rem;
    flex: 1;
}

.zimam-stat-card__info[b-c17p2zlnha] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__label[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    margin-bottom: 0.0125rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-stat-card__value[b-c17p2zlnha] {
    font-size: 26px;
    font-weight: 700;
    color: #000;
    line-height: 0.9;
    margin-top: 2px;
}

.zimam-stat-card__trend-block[b-c17p2zlnha] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
}

.zimam-stat-card__trend-badge[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1875rem 0.375rem;
    border-radius: 99px;
    font-size: var(--text-xs);
    font-weight: 600;
    white-space: nowrap;
}

.zimam-stat-card__trend-badge--up[b-c17p2zlnha] {
    background: #d1fae5;
    color: #059669;
}

.zimam-stat-card__trend-badge--down[b-c17p2zlnha] {
    background: #fee2e2;
    color: #dc2626;
}

.zimam-stat-card__trend-badge--neutral[b-c17p2zlnha] {
    background: #f1f5f9;
    color: #475569;
}

.zimam-stat-card__timeframe[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    white-space: nowrap;
    margin-top: 0.125rem;
}

.zimam-stat-card__divider[b-c17p2zlnha] {
    height: 1px;
    background: var(--color-border-light);
    margin-bottom: 0.25rem;
}

.zimam-stat-card__footer[b-c17p2zlnha] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 0.875rem;
}

.zimam-stat-card__footer-meta[b-c17p2zlnha] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
}

.zimam-stat-card__footer-text[b-c17p2zlnha] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Loading skeleton ── */
.zimam-stat-card--loading[b-c17p2zlnha] {
    overflow: hidden;
}

.zimam-stat-card--loading .zimam-stat-skeleton[b-c17p2zlnha] {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-c17p2zlnha 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes zimam-shimmer-b-c17p2zlnha {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

@keyframes zimam-content-appear-b-c17p2zlnha {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Tracker grid (card view) ── */
.zimam-tracker-grid[b-c17p2zlnha] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.875rem;
    margin-bottom: 1.25rem;
    animation: zimam-content-appear-b-c17p2zlnha 300ms ease-out;
}

@media (max-width: 1280px) {
    .zimam-tracker-grid[b-c17p2zlnha] {
        grid-template-columns: repeat(auto-fit, minmax(15.5rem, 1fr));
    }
}

@media (max-width: 768px) {
    .zimam-tracker-grid[b-c17p2zlnha] {
        grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    }
}

@media (max-width: 480px) {
    .zimam-tracker-grid[b-c17p2zlnha] {
        grid-template-columns: 1fr;
    }
}

.zimam-tracker-card[b-c17p2zlnha] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    padding: 0.625rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: var(--shadow-sm);
    transition: border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-tracker-card:hover[b-c17p2zlnha] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.zimam-tracker-card__header[b-c17p2zlnha] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.zimam-tracker-card__icon[b-c17p2zlnha] {
    margin-top: 0.125rem;
    color: var(--color-text-faint);
    flex-shrink: 0;
}

.zimam-tracker-card__number-label[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__number[b-c17p2zlnha] {
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__status-label[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-bottom: 0.25rem;
}

.zimam-tracker-card__timeline[b-c17p2zlnha] {
    background: var(--color-bg);
    border-radius: var(--radius-lg);
    padding: 0.5rem 0.625rem;
    flex: 1;
    margin-bottom: 0.5rem;
    position: relative;
}

.zimam-tracker-card__timeline-line[b-c17p2zlnha] {
    position: absolute;
    right: calc(0.625rem + 11px);
    top: 1.5rem;
    bottom: 1.5rem;
    width: 1px;
    background: var(--color-text-strong);
}

.zimam-tracker-card__timeline-items[b-c17p2zlnha] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    position: relative;
    z-index: 1;
}

.zimam-tracker-card__timeline-item[b-c17p2zlnha] {
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.zimam-tracker-card__timeline-dot[b-c17p2zlnha] {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: var(--color-text-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.zimam-tracker-card__timeline-dot svg[b-c17p2zlnha] {
    width: 0.75rem;
    height: 0.75rem;
    color: var(--color-surface);
}

.zimam-tracker-card__timeline-detail[b-c17p2zlnha] {
    min-width: 0;
}

.zimam-tracker-card__timeline-time[b-c17p2zlnha] {
    font-size: 0.625rem;
    color: var(--color-text-faint);
    margin-bottom: 0.125rem;
}

.zimam-tracker-card__timeline-desc[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    line-height: var(--lh-tight);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-tracker-card__btn[b-c17p2zlnha] {
    align-self: flex-start;
    margin-top: auto;
    min-height: 1.875rem;
    padding-inline: 0.75rem;
    font-size: var(--text-xs);
}

/* ── Tracker card loading skeleton ── */
.zimam-tracker-card--loading[b-c17p2zlnha] {
    pointer-events: none;
}

.zimam-tracker-card__avatar[b-c17p2zlnha] {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-bg-subtle, #f1f5f9);
    border: 1px solid var(--color-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-text-secondary);
    flex-shrink: 0;
}

.zimam-tracker-card__identity[b-c17p2zlnha] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.zimam-tracker-card__name[b-c17p2zlnha] {
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm);
    color: var(--color-text-strong);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__sub[b-c17p2zlnha] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-tracker-card__footer[b-c17p2zlnha] {
    border-top: 1px solid var(--color-border, #e2e8f0);
    padding-top: 0.625rem;
    margin-top: auto;
    display: flex;
    justify-content: flex-end;
}

.zimam-tracker-card__view-btn[b-c17p2zlnha] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

.zimam-tracker-card__view-btn:hover[b-c17p2zlnha] {
    background: var(--color-bg-subtle, #f1f5f9);
    border-color: var(--color-text-muted);
}

.zimam-tracker-card__timeline-icon[b-c17p2zlnha] {
    color: var(--color-text-muted);
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.zimam-tracker-skeleton[b-c17p2zlnha] {
    display: block;
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: zimam-shimmer-b-c17p2zlnha 1.5s infinite;
    border-radius: var(--radius-sm);
}

/* ── Tracker empty state ── */
.zimam-tracker-empty[b-c17p2zlnha] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 1rem;
    gap: 0.75rem;
    color: var(--color-text-faint);
}

.zimam-tracker-empty__icon[b-c17p2zlnha] {
    opacity: 0.4;
}

.zimam-tracker-empty__text[b-c17p2zlnha] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
}

/* ── Infinite scroll sentinel ── */
.zimam-scroll-sentinel[b-c17p2zlnha] {
    height: 1px;
    width: 100%;
}

/* ── Infinite scroll loading bar ── */
.zimam-table-loader[b-c17p2zlnha] {
    width: 100%;
    height: 3px;
    background: var(--color-border, #e2e8f0);
    overflow: hidden;
    flex-shrink: 0;
}

.zimam-table-loader__bar[b-c17p2zlnha] {
    width: 40%;
    height: 100%;
    background: var(--color-text-strong, #0f172a);
    border-radius: 2px;
    animation: zimam-loader-slide-b-c17p2zlnha 1s ease-in-out infinite;
}

@keyframes zimam-loader-slide-b-c17p2zlnha {
    0%   { transform: translateX(250%); }
    100% { transform: translateX(-100%); }
}
/* /Modules/Tasks/SharedComponents/EditColumnModal/EditColumnModal.razor.rz.scp.css */
@keyframes zimam-kanban-edit-modal-in-b-vudv104e7i {
    from {
        opacity: 0;
        transform: translateY(-4px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.zimam-kanban-edit-card[b-vudv104e7i] {
    position: relative;
    background: var(--color-surface);
    width: 100%;
    max-width: 480px;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-floating);
    display: flex;
    flex-direction: column;
    overflow: visible;
    transform-origin: center;
    animation: zimam-kanban-edit-modal-in-b-vudv104e7i var(--duration-fast) var(--ease-out) both;
}

.zimam-kanban-edit-header[b-vudv104e7i] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.5rem 1rem;
    border-block-end: 1px solid var(--color-border-light);
    background: var(--color-surface);
}

.zimam-kanban-edit-header__title-group[b-vudv104e7i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.zimam-kanban-edit-title[b-vudv104e7i] {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

.zimam-kanban-edit-close[b-vudv104e7i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-faint);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
}

.zimam-kanban-edit-close:hover[b-vudv104e7i] {
    background: var(--color-bg);
    color: var(--color-text-secondary);
}

.zimam-kanban-edit-close:focus-visible[b-vudv104e7i],
.zimam-kanban-edit-btn:focus-visible[b-vudv104e7i],
.zimam-kanban-edit-color-btn:focus-visible[b-vudv104e7i],
.zimam-kanban-edit-icon-btn:focus-visible[b-vudv104e7i],
.zimam-kanban-edit-icon-picker-trigger:focus-visible[b-vudv104e7i] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-kanban-edit-close[b-vudv104e7i]  .zimam-icon,
.zimam-kanban-edit-btn[b-vudv104e7i]  .zimam-icon,
.zimam-kanban-edit-icon-picker-trigger[b-vudv104e7i]  .zimam-icon,
.zimam-kanban-edit-icon-btn[b-vudv104e7i]  .zimam-icon {
    display: block;
    flex-shrink: 0;
}

.zimam-kanban-edit-body[b-vudv104e7i] {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    overflow-y: visible;
}

.zimam-kanban-edit-preview[b-vudv104e7i] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 1rem;
    background: var(--color-bg-subtle);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-lg);
}

.zimam-kanban-edit-preview__pill[b-vudv104e7i] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.875rem;
    border-radius: var(--radius-pill);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    line-height: var(--lh-normal);
    background: var(--color-surface);
    color: var(--color-text-strong);
    border: 1px solid var(--color-border);
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--swatch, var(--color-border)) 18%, transparent);
}

.zimam-kanban-edit-colors__grid[b-vudv104e7i] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.zimam-kanban-edit-color-btn[b-vudv104e7i],
.zimam-kanban-edit-icon-btn[b-vudv104e7i] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    border-radius: var(--radius-sm);
    border: 2px solid var(--color-border);
    background: var(--color-surface);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
        transform var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default),
        background-color var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
}

.zimam-kanban-edit-color-btn:hover[b-vudv104e7i],
.zimam-kanban-edit-icon-btn:hover[b-vudv104e7i] {
    transform: scale(1.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.zimam-kanban-edit-color-btn__dot[b-vudv104e7i] {
    width: 1rem;
    height: 1rem;
    border-radius: var(--radius-xs);
    background: var(--swatch);
}

.zimam-kanban-edit-color-btn--selected[b-vudv104e7i] {
    border-color: var(--swatch);
    background: var(--swatch);
    color: #fff;
    transform: scale(1.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.zimam-kanban-edit-color-btn__check[b-vudv104e7i] {
    color: #fff;
}

.zimam-kanban-edit-icon-btn[b-vudv104e7i] {
    color: var(--color-text-secondary);
}

.zimam-kanban-edit-icon-btn:hover[b-vudv104e7i] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

.zimam-kanban-edit-icon-btn--selected[b-vudv104e7i] {
    border-color: var(--color-text-strong);
    background: var(--color-text-strong);
    color: var(--color-surface);
    transform: scale(1.08);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.zimam-kanban-edit-icon-btn--selected:hover[b-vudv104e7i] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-kanban-edit-icon-picker-trigger[b-vudv104e7i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 2.5rem;
    padding: 0 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-family: inherit;
    text-align: start;
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-kanban-edit-icon-picker-trigger:hover[b-vudv104e7i] {
    border-color: var(--color-primary);
}

.zimam-kanban-edit-icon-picker-backdrop[b-vudv104e7i] {
    position: fixed;
    inset: 0;
    z-index: var(--z-drawer-scrim);
}

.zimam-kanban-edit-icon-picker-popover[b-vudv104e7i] {
    position: absolute;
    bottom: calc(100% + 0.5rem);
    left: 0;
    right: 0;
    z-index: 1000;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-floating);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: zimam-kanban-edit-modal-in-b-vudv104e7i var(--duration-fast) var(--ease-out) both;
}

.zimam-kanban-edit-icon-picker-search[b-vudv104e7i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
}

.zimam-kanban-edit-icon-picker-input[b-vudv104e7i] {
    flex: 1;
    border: none;
    background: transparent;
    color: var(--color-text-strong);
    font-size: var(--text-sm);
    font-family: inherit;
    outline: none;
}

.zimam-kanban-edit-icon-picker-input[b-vudv104e7i]::placeholder {
    color: var(--color-text-faint);
}

.zimam-kanban-edit-icon-picker-grid[b-vudv104e7i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(2rem, 1fr));
    gap: 0.375rem;
    padding: 0.75rem;
    max-height: 200px;
    overflow-y: auto;
}

.zimam-kanban-edit-icon-picker-grid[b-vudv104e7i]::-webkit-scrollbar {
    width: 4px;
}

.zimam-kanban-edit-icon-picker-grid[b-vudv104e7i]::-webkit-scrollbar-track {
    background: transparent;
}

.zimam-kanban-edit-icon-picker-grid[b-vudv104e7i]::-webkit-scrollbar-thumb {
    background-color: var(--color-border);
    border-radius: 10px;
}

.zimam-kanban-edit-icon-picker-grid[b-vudv104e7i]::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-text-faint);
}

.zimam-kanban-edit-footer[b-vudv104e7i] {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--color-border-light);
    background: var(--color-bg-subtle);
}

.zimam-kanban-edit-btn[b-vudv104e7i] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 2.5rem;
    padding-inline: 1rem;
    border-radius: var(--radius-lg);
    border: 1px solid transparent;
    background: transparent;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: inherit;
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-kanban-edit-btn:disabled[b-vudv104e7i] {
    opacity: 0.5;
    cursor: not-allowed;
}

.zimam-kanban-edit-btn--primary[b-vudv104e7i] {
    background: var(--color-text-strong);
    border-color: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-kanban-edit-btn--primary:hover:not(:disabled)[b-vudv104e7i] {
    background: #1f2937;
    border-color: #1f2937;
}

.zimam-kanban-edit-btn--secondary[b-vudv104e7i] {
    background: var(--color-surface);
    border-color: var(--color-border);
    color: var(--color-text-secondary);
}

.zimam-kanban-edit-btn--secondary:hover:not(:disabled)[b-vudv104e7i] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-strong);
    color: var(--color-text-strong);
    box-shadow: var(--shadow-sm);
}
/* /Modules/Tasks/SharedComponents/KanbanBoard/KanbanBoard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Kanban board — matches ZIMAM.Insperation reference.
   Scrollbar + view switcher + status color utilities.
   ═══════════════════════════════════════════════════════ */

/* ── Board horizontal scroll area ── */
.zimam-kanban-scroll[b-1x4zedcs2f] {
    height: 100%;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    display: flex;
    flex-direction: column;
}

.zimam-kanban-scroll[b-1x4zedcs2f]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.zimam-kanban-scroll[b-1x4zedcs2f]::-webkit-scrollbar-track {
    background: transparent;
}

.zimam-kanban-scroll[b-1x4zedcs2f]::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border-radius: 10px;
}

.zimam-kanban-scroll[b-1x4zedcs2f]::-webkit-scrollbar-thumb:hover {
    background: var(--color-text-faint);
}

/* ── Column inner scrollbar (Clever padding trick) ── */
[b-1x4zedcs2f] .zimam-kanban-column__dropzone::-webkit-scrollbar {
    width: 8px;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropzone::-webkit-scrollbar-track {
    background: transparent;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropzone::-webkit-scrollbar-thumb {
    background-color: var(--color-border);
    border-radius: 100px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropzone::-webkit-scrollbar-thumb:hover {
    background-color: var(--color-text-faint);
}

/* ── Card grab cursor ── */
[b-1x4zedcs2f] .zimam-card-grab {
    cursor: grab;
}

[b-1x4zedcs2f] .zimam-card-grab:active {
    cursor: grabbing;
}

[b-1x4zedcs2f] .zimam-card-grab--dragging {
    opacity: 0.4;
}

/* ── Drop target dashed outline ── */
[b-1x4zedcs2f] .zimam-drop-target {
    outline: 2px dashed var(--color-primary);
    outline-offset: -2px;
    background-color: var(--color-primary-ring) !important;
}

/* ═══════════════════════════════════════════════════════
   Kanban Layout & Constraints
   Ensuring exact dimensional sizes and scroll areas
   ═══════════════════════════════════════════════════════ */

.zimam-kanban-board-track[b-1x4zedcs2f] {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 16px;
    padding: 16px;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

/* Trailing spacer removed — columns flex-grow to fill the track. */

[b-1x4zedcs2f] .zimam-kanban-column {
    --zimam-kanban-scrollbar-gutter: 8px;
    --zimam-kanban-column-spacing: 0.75rem;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
    min-width: 280px;
    height: 100%;
    max-height: var(--kanban-column-max-height, calc(100vh - 10rem));
    background-color: var(--color-kanban-column);
    border-radius: var(--radius-card);
    border: 1px solid var(--color-kanban-column-border);
    box-sizing: border-box;
    padding-block: var(--zimam-kanban-column-spacing);
    gap: var(--zimam-kanban-column-spacing);
    overflow: visible;
}

[b-1x4zedcs2f] .zimam-kanban-card {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    width: 100%;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    box-sizing: border-box;
    padding: 0;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    transition: box-shadow var(--duration-fast) var(--ease-default),
        transform var(--duration-fast) var(--ease-default),
        border-color var(--duration-fast) var(--ease-default);
    box-shadow: var(--shadow-sm);
}

[b-1x4zedcs2f] .zimam-kanban-card:hover {
    box-shadow: var(--shadow-floating);
    transform: translateY(-1px);
    border-color: var(--color-border);
}

@media (prefers-reduced-motion: reduce) {
    [b-1x4zedcs2f] .zimam-kanban-card,
    [b-1x4zedcs2f] .zimam-kanban-card:hover {
        transition: none;
        transform: none;
    }
}

/* ═══════════════════════════════════════════════════════
   Kanban column status colors — ZIMAM-prefixed to avoid
   Tailwind v4 @property / OKLCH conflicts.
   ═══════════════════════════════════════════════════════ */

/* ── Slate (To Do) ── */
.zimam-kanban-status--bg-slate[b-1x4zedcs2f] {
    background-color: var(--color-bg-subtle);
}

.zimam-kanban-status--text-slate[b-1x4zedcs2f] {
    color: var(--color-text-secondary);
}

/* ── Blue (In Progress) ── */
.zimam-kanban-status--bg-blue[b-1x4zedcs2f] {
    background-color: var(--color-info-bg);
}

.zimam-kanban-status--text-blue[b-1x4zedcs2f] {
    color: var(--color-primary);
}

/* ── Purple (Review) ── */
.zimam-kanban-status--bg-purple[b-1x4zedcs2f] {
    background-color: var(--color-bg-subtle);
}

.zimam-kanban-status--text-purple[b-1x4zedcs2f] {
    color: var(--color-text-secondary);
}

/* ── Emerald (Done) ── */
.zimam-kanban-status--bg-emerald[b-1x4zedcs2f] {
    background-color: var(--color-success-bg);
}

.zimam-kanban-status--text-emerald[b-1x4zedcs2f] {
    color: var(--color-success-text);
}

/* ── Dropdown & Modal entrance animations ── */
@keyframes kanbanMenuSlideIn-b-1x4zedcs2f {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* kanbanModalFadeIn removed — unused, EditColumnModal uses its own animation */

/* ═══════════════════════════════════════════════════════
   KanbanColumn — header, dropdown, add-task button
   ═══════════════════════════════════════════════════════ */

/* ── 1. Column Header ── */
[b-1x4zedcs2f] .zimam-kanban-column__header {
    margin-inline-start: 0.75rem;
    margin-inline-end: calc(0.75rem + var(--zimam-kanban-scrollbar-gutter));
    padding: 0.5rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    position: relative;
    flex-shrink: 0;
    border: 1px solid var(--color-kanban-column-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
}

[b-1x4zedcs2f] .zimam-kanban-column__header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

[b-1x4zedcs2f] .zimam-kanban-column__header-info {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

[b-1x4zedcs2f] .zimam-kanban-column__header-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

[b-1x4zedcs2f] .zimam-kanban-column__header-title {
    margin: 0;
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-1x4zedcs2f] .zimam-kanban-column__header-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.25rem;
    min-width: 1.25rem;
    padding-inline: 0.5rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    line-height: 1;
    flex-shrink: 0;
}

[b-1x4zedcs2f] .zimam-kanban-column__header-actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

/* ── Health distribution pips in column header ── */
[b-1x4zedcs2f] .zimam-kanban-column__health-pip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1rem;
    height: 1rem;
    padding-inline: 0.25rem;
    font-size: 0.6rem;
    font-weight: 600;
    border-radius: var(--radius-pill, 9999px);
    line-height: 1;
}

[b-1x4zedcs2f] .zimam-kanban-column__health-pip--late {
    background: var(--color-error-bg);
    color: var(--color-error-text);
}

[b-1x4zedcs2f] .zimam-kanban-column__health-pip--slightly-late {
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
}

[b-1x4zedcs2f] .zimam-kanban-column__health-pip--on-time {
    background: var(--color-success-bg);
    color: var(--color-success-text);
}

/* ── 2. Fixed Description ── */
[b-1x4zedcs2f] .zimam-kanban-column__description-area {
    padding-inline-start: 0.75rem;
    padding-inline-end: calc(0.75rem + var(--zimam-kanban-scrollbar-gutter));
    /* Recovered padding */
    flex-shrink: 0;
    border-block-end: 1px solid transparent;
}

[b-1x4zedcs2f] .zimam-kanban-column__description-text {
    display: block;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Menu Trigger ── */
[b-1x4zedcs2f] .zimam-kanban-column__menu-wrap {
    position: relative;
}

[b-1x4zedcs2f] .zimam-kanban-column__menu-trigger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border-radius: var(--radius-sm);
    border: none;
    background: transparent;
    color: var(--color-text-faint);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
}

[b-1x4zedcs2f] .zimam-kanban-column__menu-trigger:hover,
[b-1x4zedcs2f] .zimam-kanban-column__menu-trigger--open {
    background: var(--color-border);
    color: var(--color-text-secondary);
}

[b-1x4zedcs2f] .zimam-kanban-column__menu-trigger:focus-visible {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Dropdown Backdrop ── */
[b-1x4zedcs2f] .zimam-kanban-column__menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: var(--z-drawer-scrim);
}

/* ── Dropdown Panel ── */
[b-1x4zedcs2f] .zimam-kanban-column__dropdown {
    position: absolute;
    top: 2.50rem;
    inset-inline-end: 0.75rem;
    /* Align with dots, accounts for column padding exclusion */
    z-index: var(--z-drawer);
    width: 211px;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-floating);
    padding: 0.375rem;
    display: flex;
    flex-direction: column;
    outline: none;
    animation: kanbanMenuSlideIn-b-1x4zedcs2f var(--duration-fast) var(--ease-out) both;
}

/* ── Section Label ── */
[b-1x4zedcs2f] .zimam-kanban-column__dropdown-section {
    padding: 0.75rem 1rem 0.375rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-faint);
    letter-spacing: 0.03em;
}

/* ── Dropdown Items ── */
[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 28px;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    border: none;
    background: transparent;
    font-size: var(--text-md);
    font-family: inherit;
    color: var(--color-text-secondary);
    text-align: start;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
    line-height: var(--lh-normal);
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item:hover {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item-icon {
    display: flex;
    align-items: center;
    color: var(--color-text-faint);
    flex-shrink: 0;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item--danger {
    color: var(--color-error-text);
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item--danger:hover {
    background: var(--color-error-bg);
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item--danger .zimam-kanban-column__dropdown-item-icon {
    color: var(--color-error-focus);
}

/* Disabled Item */
[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item--disabled {
    color: var(--color-text-faint);
    cursor: not-allowed;
    flex-direction: column;
    align-items: flex-start;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-item--disabled:hover {
    background: transparent;
    color: var(--color-text-faint);
}

[b-1x4zedcs2f] .zimam-kanban-column__disabled-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-1x4zedcs2f] .zimam-kanban-column__disabled-hint {
    font-size: var(--text-sm);
    color: var(--color-text-faint);
    margin-inline-start: 1.75rem;
    margin-top: 0.125rem;
}

[b-1x4zedcs2f] .zimam-kanban-column__dropdown-divider {
    height: 1px;
    background: var(--color-border-light);
    margin: 0.375rem -0.375rem;
    /* Stretch past new container padding */
}

/* ── 3. Scrollable Drop Zone ── */
[b-1x4zedcs2f] .zimam-kanban-column__dropzone {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    padding-inline: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: background-color var(--duration-fast) var(--ease-default);
}

[b-1x4zedcs2f] .zimam-kanban-column__dropzone--active {
    background-color: var(--color-primary-ring);
}

/* ── Empty State (dashed dropzone) ── */
[b-1x4zedcs2f] .zimam-kanban-column__empty {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-text-faint);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    padding: 2rem 1rem;
    min-height: 120px;
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-lg);
    background: transparent;
}

/* ── 4. Fixed Footer ── */
[b-1x4zedcs2f] .zimam-kanban-column__footer {
    flex-shrink: 0;
    padding-inline-start: 0.75rem;
    padding-inline-end: calc(0.75rem + var(--zimam-kanban-scrollbar-gutter));
    /* Recovered padding */
    background: transparent;
    border-block-start: 1px solid transparent;
}

[b-1x4zedcs2f] .zimam-kanban-column__footer-add-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    width: 100%;
    height: 2.25rem;
    padding-inline: 0.75rem;
    border: none;
    background: transparent;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    font-family: inherit;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
        color var(--duration-fast) var(--ease-default);
}

[b-1x4zedcs2f] .zimam-kanban-column__footer-add-btn:hover {
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

[b-1x4zedcs2f] .zimam-kanban-column__footer-add-btn:focus-visible {
    outline: var(--focus-ring);
    outline-offset: -2px;
}

/* ═══════════════════════════════════════════════════════
   Add Column Board UI
   ═══════════════════════════════════════════════════════ */

/* Board-level menu backdrop (not ::deep — element is directly in KanbanBoard.razor) */
.zimam-kanban-board__menu-backdrop[b-1x4zedcs2f] {
    position: fixed;
    inset: 0;
    z-index: var(--z-drawer-scrim);
}

.zimam-kanban-board__add-column-wrap[b-1x4zedcs2f] {
    position: relative;
    flex-shrink: 0;
    margin-top: 0;
}

.zimam-kanban-board__add-column-btn[b-1x4zedcs2f] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: var(--radius-md);
    background-color: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default), color var(--duration-fast) var(--ease-default);
}

.zimam-kanban-board__add-column-btn:hover[b-1x4zedcs2f] {
    background-color: var(--color-bg);
    color: var(--color-text-strong);
}

.zimam-kanban-board__add-column-dropdown[b-1x4zedcs2f] {
    position: absolute;
    top: 48px;
    inset-inline-end: 0;
    width: 192px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-floating);
    z-index: var(--z-drawer);
    display: flex;
    flex-direction: column;
    padding: 6px;
    /* Compact inward padding */
}

.zimam-kanban-board__add-column-new-btn[b-1x4zedcs2f] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 8px 8px;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    background-color: var(--color-surface);
    border: 1px solid var(--color-primary);
    color: var(--color-primary);
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default);
}

.zimam-kanban-board__add-column-new-btn:hover[b-1x4zedcs2f] {
    background-color: var(--color-primary-ring);
}

.zimam-kanban-board__add-column-section[b-1x4zedcs2f] {
    display: flex;
    flex-direction: column;
}

.zimam-kanban-board__add-column-section--hidden[b-1x4zedcs2f] {
    margin: 8px -6px 0;
    border-block-start: 1px solid var(--color-border);
    padding: 8px 6px 0;
}

.zimam-kanban-board__add-column-heading[b-1x4zedcs2f] {
    padding: 4px 16px;
    font-size: var(--text-base);
    color: var(--color-text-muted);
}

.zimam-kanban-board__add-column-list[b-1x4zedcs2f] {
    display: flex;
    flex-direction: column;
}

.zimam-kanban-board__add-column-item[b-1x4zedcs2f] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    font-size: var(--text-md);
    color: var(--color-text);
    cursor: pointer;
    transition: background-color var(--duration-fast) var(--ease-default);
}

.zimam-kanban-board__add-column-item:hover[b-1x4zedcs2f] {
    background-color: var(--color-bg-subtle);
}

/* ═══════════════════════════════════════════════════════
   Pending-approval state (outer frame). Card inner styles
   live in KanbanCard.razor.css.
   ═══════════════════════════════════════════════════════ */

[b-1x4zedcs2f] .zimam-kanban-card--pending-approval {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
    cursor: default;
}

[b-1x4zedcs2f] .zimam-kanban-card--pending-approval:hover {
    box-shadow: 0 0 0 3px var(--color-primary-ring), var(--shadow-floating);
    transform: none;
}


/* /Modules/Tasks/SharedComponents/KanbanCard/KanbanCard.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   KanbanCard — 3-zone enterprise layout
   All values sourced from design tokens (01-tokens.css).
   ═══════════════════════════════════════════════════════ */

/* ── Shared dot (inside pills or standalone) ── */
.zimam-kanban-card__dot[b-m91spbtsxf] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}

/* ═══════════════════════════════════════════════════════
   1. Header strip (due countdown + health badge)
   ═══════════════════════════════════════════════════════ */
.zimam-kanban-card__header[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.875rem;
    background: var(--color-surface);
    border-block-end: 1px solid var(--color-border-light);
    color: var(--color-text-strong);
}

.zimam-kanban-card__due[b-m91spbtsxf] {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-kanban-card__due--overdue[b-m91spbtsxf],
.zimam-kanban-card__due--urgent[b-m91spbtsxf] {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

/* ═══════════════════════════════════════════════════════
   2. Body
   ═══════════════════════════════════════════════════════ */
.zimam-kanban-card__body[b-m91spbtsxf] {
    padding: 0.75rem 0.875rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.zimam-kanban-card__title[b-m91spbtsxf] {
    margin: 0;
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.zimam-kanban-card__desc[b-m91spbtsxf] {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* ── Context chips (case # + phase) ── */
.zimam-kanban-card__context[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.zimam-kanban-card__context-chip[b-m91spbtsxf] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-medium);
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    padding: 0.125rem 0.4375rem;
    border-radius: var(--radius-sm);
    line-height: 1.4;
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Subtasks panel (bordered) ── */
.zimam-kanban-card__subtasks[b-m91spbtsxf] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.zimam-kanban-card__subtasks-head[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.zimam-kanban-card__subtasks-label[b-m91spbtsxf] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-muted);
    letter-spacing: 0.02em;
}

.zimam-kanban-card__subtasks-count[b-m91spbtsxf] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
    background: var(--color-bg-subtle);
    padding: 0.0625rem 0.375rem;
    border-radius: var(--radius-xs);
}

/* Segmented bar (subtasks ≤ 12) */
.zimam-kanban-card__subtasks-segments[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    gap: 3px;
}

.zimam-kanban-card__subtasks-segment[b-m91spbtsxf] {
    flex: 1 1 0;
    height: 6px;
    border-radius: var(--radius-xs);
    background: var(--color-border);
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-kanban-card__subtasks-segment--done[b-m91spbtsxf] {
    background: var(--color-text-strong);
}

/* Fill bar fallback (subtasks > 12) */
.zimam-kanban-card__subtasks-bar[b-m91spbtsxf] {
    height: 6px;
    background: var(--color-border);
    border-radius: var(--radius-xs);
    overflow: hidden;
}

.zimam-kanban-card__subtasks-fill[b-m91spbtsxf] {
    height: 100%;
    background: var(--color-text-strong);
    border-radius: var(--radius-xs);
    transition: width var(--duration-normal) var(--ease-default);
}

/* ── Blocker chip ── */
.zimam-kanban-card__blocker[b-m91spbtsxf] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border: 1px solid var(--color-error-border);
    align-self: flex-start;
}

/* ═══════════════════════════════════════════════════════
   3. Footer strip (avatars + due chip + ping · priority)
   ═══════════════════════════════════════════════════════ */
.zimam-kanban-card__footer[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.875rem;
    background: var(--color-surface);
    border-block-start: 1px solid var(--color-border-light);
    color: var(--color-text-strong);
}

.zimam-kanban-card__footer-left[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

/* ── Avatar stack ── */
.zimam-kanban-card__people[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.zimam-kanban-card__person[b-m91spbtsxf] {
    display: inline-flex;
    align-items: center;
    transition: transform var(--duration-fast) var(--ease-default);
}

.zimam-kanban-card__person:hover[b-m91spbtsxf] {
    transform: translateY(-1px);
    z-index: 1;
}

.zimam-kanban-card__person--stacked[b-m91spbtsxf] {
    margin-inline-start: -0.375rem;
}

.zimam-kanban-card__avatar[b-m91spbtsxf] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid var(--color-surface);
    box-shadow: var(--shadow-sm);
    display: block;
}

/* ── Due date chip ── */
.zimam-kanban-card__due-chip[b-m91spbtsxf] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* ── Pending approval ping (animated dot) ── */
.zimam-kanban-card__ping[b-m91spbtsxf] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 8px;
    height: 8px;
    flex-shrink: 0;
}

.zimam-kanban-card__ping-ring[b-m91spbtsxf] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: var(--color-primary);
    opacity: 0.55;
    animation: zimam-kanban-ping-b-m91spbtsxf 1.4s cubic-bezier(0, 0, 0.2, 1) infinite;
}

.zimam-kanban-card__ping-dot[b-m91spbtsxf] {
    position: relative;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--color-primary);
}

@keyframes zimam-kanban-ping-b-m91spbtsxf {
    0% {
        transform: scale(1);
        opacity: 0.55;
    }
    75%, 100% {
        transform: scale(2.1);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zimam-kanban-card__ping-ring[b-m91spbtsxf] {
        animation: none;
        opacity: 0.35;
    }
    .zimam-kanban-card__subtasks-fill[b-m91spbtsxf],
    .zimam-kanban-card__subtasks-segment[b-m91spbtsxf],
    .zimam-kanban-card__person[b-m91spbtsxf] {
        transition: none;
    }
}

/* ═══════════════════════════════════════════════════════
   Approval state (outer card styling)
   ═══════════════════════════════════════════════════════ */
.zimam-kanban-card__approval-badge[b-m91spbtsxf] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.625rem;
    background: var(--color-warning-bg);
    color: var(--color-warning-text);
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    letter-spacing: 0.01em;
    border-block-end: 1px solid var(--color-warning-border);
}

.zimam-kanban-card__approval-badge svg[b-m91spbtsxf] {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}
/* /Modules/Tasks/SharedComponents/SubtaskList/SubtaskList.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   SubtaskList – Scoped CSS
   Matches inspiration: card container with
   checkbox items, see-more, and add footer.
   ═══════════════════════════════════════════ */

.subtask-list[b-1zpj44qgj0] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl, 12px);
    background: var(--color-surface);
    overflow: hidden;
    box-shadow: 0 1px 2px rgb(0 0 0 / .04);
}

/* ── Loading ── */
.subtask-list-loading[b-1zpj44qgj0] {
    padding: 2rem;
    text-align: center;
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

/* ── Items container ── */
.subtask-list-items[b-1zpj44qgj0] {
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

/* ── Single item row ── */
.subtask-item[b-1zpj44qgj0] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    position: relative;
}

.subtask-item:hover .subtask-delete[b-1zpj44qgj0] {
    opacity: 1;
}

/* ── Checkbox button ── */
.subtask-checkbox[b-1zpj44qgj0] {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-block-start: 1px;
    border-radius: var(--radius-sm, 4px);
    border: 1px solid var(--color-border);
    background: var(--color-surface-raised, var(--color-surface));
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 150ms, border-color 150ms;
    padding: 0;
    color: var(--color-text-secondary);
}

.subtask-checkbox:hover[b-1zpj44qgj0] {
    background: var(--color-surface-hover, #f1f5f9);
    border-color: var(--color-border-strong, #cbd5e1);
}

.subtask-checkbox--checked[b-1zpj44qgj0] {
    background: var(--color-primary, #3b82f6);
    border-color: var(--color-primary, #3b82f6);
    color: #fff;
}

.subtask-checkbox--checked:hover[b-1zpj44qgj0] {
    background: var(--color-primary-hover, #2563eb);
    border-color: var(--color-primary-hover, #2563eb);
}

/* ── Title text ── */
.subtask-title[b-1zpj44qgj0] {
    flex: 1;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary);
    line-height: 1.45;
}

.subtask-item--done .subtask-title[b-1zpj44qgj0] {
    text-decoration: line-through;
    opacity: 0.55;
}

/* ── Delete button (appears on hover) ── */
.subtask-delete[b-1zpj44qgj0] {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: var(--radius-sm, 4px);
    border: none;
    background: transparent;
    color: var(--color-text-tertiary, #94a3b8);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    transition: opacity 150ms, color 150ms, background 150ms;
    padding: 0;
}

.subtask-delete:hover[b-1zpj44qgj0] {
    color: var(--color-danger, #ef4444);
    background: rgb(239 68 68 / .08);
}

/* ── See More ── */
.subtask-see-more[b-1zpj44qgj0] {
    font-size: var(--text-xs, 0.75rem);
    color: var(--color-text-tertiary, #94a3b8);
    font-weight: var(--fw-medium, 500);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    padding-block-start: 0.25rem;
    transition: color 150ms;
}

.subtask-see-more:hover[b-1zpj44qgj0] {
    color: var(--color-text-secondary);
}

/* ── Inline add row ── */
.subtask-add-row[b-1zpj44qgj0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-inline: 1.25rem;
    padding-block: 0.5rem;
    border-block-start: 1px solid var(--color-border-light, var(--color-border));
}

.subtask-add-input[b-1zpj44qgj0] {
    flex: 1;
    font-size: var(--text-sm);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 8px);
    padding: 0.375rem 0.625rem;
    background: var(--color-surface);
    color: var(--color-text-strong);
    outline: none;
    transition: border-color 150ms;
}

.subtask-add-input:focus[b-1zpj44qgj0] {
    border-color: var(--color-primary, #3b82f6);
}

.subtask-add-input[b-1zpj44qgj0]::placeholder {
    color: var(--color-text-tertiary, #94a3b8);
}

.subtask-add-confirm[b-1zpj44qgj0],
.subtask-add-cancel[b-1zpj44qgj0] {
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: var(--radius-sm, 4px);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 150ms, color 150ms;
    padding: 0;
}

.subtask-add-confirm[b-1zpj44qgj0] {
    background: var(--color-primary, #3b82f6);
    color: #fff;
}

.subtask-add-confirm:hover:not(:disabled)[b-1zpj44qgj0] {
    background: var(--color-primary-hover, #2563eb);
}

.subtask-add-confirm:disabled[b-1zpj44qgj0] {
    opacity: 0.45;
    cursor: not-allowed;
}

.subtask-add-cancel[b-1zpj44qgj0] {
    background: transparent;
    color: var(--color-text-tertiary, #94a3b8);
}

.subtask-add-cancel:hover[b-1zpj44qgj0] {
    background: var(--color-surface-hover, #f1f5f9);
    color: var(--color-text-secondary);
}

/* ── Footer / Add button ── */
.subtask-footer[b-1zpj44qgj0] {
    border-block-start: 1px solid var(--color-border-light, var(--color-border));
    padding: 0.875rem;
    display: flex;
    justify-content: center;
}

.subtask-add-btn[b-1zpj44qgj0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary);
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color 150ms;
}

.subtask-add-btn:hover[b-1zpj44qgj0] {
    color: var(--color-text-strong);
}

.subtask-add-btn:disabled[b-1zpj44qgj0] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Modules/Tasks/SharedComponents/TaskCalendarView/TaskCalendarView.razor.rz.scp.css */
.zimam-task-calendar[b-8ryqb531yi] {
    --calendar-grid-line: var(--color-border-light);
    --calendar-cell-muted: color-mix(in srgb, var(--color-bg-subtle) 88%, var(--color-surface));
    --calendar-control-bg: var(--color-bg-subtle);
    --calendar-neutral-soft: color-mix(in srgb, var(--color-text-strong) 5%, var(--color-surface));
    --calendar-neutral-border: color-mix(in srgb, var(--color-text-strong) 18%, var(--color-border));
    --calendar-warning-soft: color-mix(in srgb, var(--color-warning-bg) 78%, var(--color-surface));

    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card-lg, var(--radius-lg));
    box-shadow: var(--shadow-sm);
}

.zimam-task-calendar__header[b-8ryqb531yi] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1rem;
    background: var(--color-surface);
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-task-calendar__title-wrap[b-8ryqb531yi] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.zimam-task-calendar__heading[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.1875rem;
    min-width: 0;
}

.zimam-task-calendar__eyebrow[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    width: fit-content;
    color: var(--color-text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__title[b-8ryqb531yi] {
    margin: 0;
    overflow: hidden;
    color: var(--color-text-strong);
    font-size: var(--text-xl);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__subtitle[b-8ryqb531yi] {
    margin: 0;
    overflow: hidden;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__actions[b-8ryqb531yi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    min-width: 0;
}

.zimam-task-calendar__actions-label[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    min-height: 2.125rem;
    padding-inline: 0.25rem;
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    white-space: nowrap;
}

.zimam-task-calendar__nav[b-8ryqb531yi],
.zimam-task-calendar__segmented[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.125rem;
    min-height: 2.125rem;
    padding: 0.125rem;
    background: var(--calendar-control-bg);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
}

.zimam-task-calendar__options[b-8ryqb531yi] {
    position: relative;
    display: inline-flex;
}

.zimam-task-calendar__control[b-8ryqb531yi],
.zimam-task-calendar__today[b-8ryqb531yi],
.zimam-task-calendar__segment[b-8ryqb531yi],
.zimam-task-calendar__options-trigger[b-8ryqb531yi],
.zimam-task-calendar__retry[b-8ryqb531yi] {
    font-family: var(--font-family);
}

.zimam-task-calendar__control[b-8ryqb531yi],
.zimam-task-calendar__today[b-8ryqb531yi],
.zimam-task-calendar__segment[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.875rem;
    padding: 0.375rem 0.625rem;
    color: var(--color-text-secondary);
    background: transparent;
    border: 0;
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    line-height: 1;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                transform var(--duration-fast) var(--ease-default);
}

.zimam-task-calendar__control[b-8ryqb531yi] {
    inline-size: 1.875rem;
    padding: 0;
}

.zimam-task-calendar__control:hover[b-8ryqb531yi],
.zimam-task-calendar__today:hover[b-8ryqb531yi],
.zimam-task-calendar__segment:hover[b-8ryqb531yi] {
    color: var(--color-text-strong);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-task-calendar__segment--active[b-8ryqb531yi],
.zimam-task-calendar__today[b-8ryqb531yi] {
    color: var(--color-text-strong);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
}

.zimam-task-calendar__options-trigger[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    min-height: 2.125rem;
    padding: 0.4375rem 0.75rem;
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.zimam-task-calendar__options-trigger:hover[b-8ryqb531yi],
.zimam-task-calendar__options-trigger[aria-expanded="true"][b-8ryqb531yi] {
    color: var(--color-text-strong);
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.zimam-task-calendar__options-badge[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.25rem;
    padding: 0.125rem 0.4375rem;
    color: var(--color-text-muted);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__options-chevron[b-8ryqb531yi] {
    transition: transform var(--duration-fast) var(--ease-default);
}

.zimam-task-calendar__options-chevron--open[b-8ryqb531yi] {
    transform: rotate(180deg);
}

.zimam-task-calendar__options-backdrop[b-8ryqb531yi] {
    position: fixed;
    inset: 0;
    z-index: var(--z-sticky);
    background: transparent;
    border: 0;
    cursor: default;
}

.zimam-task-calendar__options-panel[b-8ryqb531yi] {
    position: absolute;
    inset-block-start: calc(100% + 0.375rem);
    inset-inline-end: 0;
    z-index: calc(var(--z-sticky) + 1);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    inline-size: min(22rem, calc(100vw - 2rem));
    padding: 0.875rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-floating);
}

.zimam-task-calendar__options-group[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.zimam-task-calendar__options-label[b-8ryqb531yi] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__control:active[b-8ryqb531yi],
.zimam-task-calendar__today:active[b-8ryqb531yi],
.zimam-task-calendar__segment:active[b-8ryqb531yi],
.zimam-task-calendar__task:active[b-8ryqb531yi],
.zimam-task-calendar__retry:active[b-8ryqb531yi] {
    transform: scale(0.98);
}

.zimam-task-calendar__control:focus-visible[b-8ryqb531yi],
.zimam-task-calendar__today:focus-visible[b-8ryqb531yi],
.zimam-task-calendar__segment:focus-visible[b-8ryqb531yi],
.zimam-task-calendar__task:focus-visible[b-8ryqb531yi],
.zimam-task-calendar__retry:focus-visible[b-8ryqb531yi],
.zimam-task-calendar__options-trigger:focus-visible[b-8ryqb531yi] {
    outline: 2px solid var(--color-text-strong);
    outline-offset: var(--focus-offset);
}

.zimam-task-calendar__summary[b-8ryqb531yi] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: var(--color-bg-subtle);
    border-bottom: 1px solid var(--color-border-light);
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.zimam-task-calendar__summary:empty[b-8ryqb531yi] {
    display: none;
}

.zimam-task-calendar__summary span[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
    min-height: 1.5rem;
    padding: 0.1875rem 0.5rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-pill);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__summary-chip--warning[b-8ryqb531yi] {
    color: var(--color-warning-text) !important;
    background: var(--calendar-warning-soft) !important;
    border-color: var(--color-warning-border) !important;
}

.zimam-task-calendar__weekday-row[b-8ryqb531yi],
.zimam-task-calendar__month-grid[b-8ryqb531yi] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.zimam-task-calendar__weekday-row[b-8ryqb531yi] {
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border-bottom: 1px solid var(--calendar-grid-line);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    text-align: center;
}

.zimam-task-calendar__weekday-row span[b-8ryqb531yi] {
    padding: 0.625rem 0.375rem;
}

.zimam-task-calendar__month-grid[b-8ryqb531yi] {
    flex: 1;
    min-height: 0;
    min-width: 58rem;
    overflow: auto;
    background: var(--calendar-grid-line);
    gap: 1px;
    scrollbar-gutter: stable;
}

.zimam-task-calendar__day[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 8.5rem;
    padding: 0.5rem;
    background: var(--color-surface);
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-task-calendar__day:hover[b-8ryqb531yi] {
    background: var(--calendar-neutral-soft);
}

.zimam-task-calendar__day--empty[b-8ryqb531yi] {
    background: color-mix(in srgb, var(--color-surface) 96%, var(--color-bg-subtle));
}

.zimam-task-calendar__day--busy[b-8ryqb531yi],
.zimam-task-calendar__day--dense[b-8ryqb531yi] {
    background: color-mix(in srgb, var(--color-surface) 98%, var(--color-bg-subtle));
}

.zimam-task-calendar__day--muted[b-8ryqb531yi] {
    background: var(--calendar-cell-muted);
}

.zimam-task-calendar__day--muted .zimam-task-calendar__day-date strong[b-8ryqb531yi],
.zimam-task-calendar__day--muted .zimam-task-calendar__day-weekday[b-8ryqb531yi] {
    color: var(--color-text-faint);
}

.zimam-task-calendar__day--today[b-8ryqb531yi],
.zimam-task-calendar__lane--today[b-8ryqb531yi] {
    box-shadow: inset 0 0 0 1px var(--calendar-neutral-border);
}

.zimam-task-calendar__day-head[b-8ryqb531yi],
.zimam-task-calendar__lane-head[b-8ryqb531yi],
.zimam-task-calendar__agenda-head[b-8ryqb531yi] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    color: var(--color-text-strong);
}

.zimam-task-calendar__day-date[b-8ryqb531yi],
.zimam-task-calendar__lane-date[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.zimam-task-calendar__day-date strong[b-8ryqb531yi] {
    display: grid;
    place-items: center;
    inline-size: 1.5rem;
    block-size: 1.5rem;
    color: var(--color-text-strong);
    border-radius: 50%;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    line-height: 1;
}

.zimam-task-calendar__day--today .zimam-task-calendar__day-date strong[b-8ryqb531yi] {
    color: var(--color-surface);
    background: var(--color-text-strong);
}

.zimam-task-calendar__lane-date strong[b-8ryqb531yi] {
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
}

.zimam-task-calendar__day-weekday[b-8ryqb531yi],
.zimam-task-calendar__lane-date span[b-8ryqb531yi] {
    color: var(--color-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__day-badges[b-8ryqb531yi] {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.25rem;
}

.zimam-task-calendar__count-pill[b-8ryqb531yi],
.zimam-task-calendar__today-pill[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.25rem;
    padding: 0.1875rem 0.4375rem;
    border-radius: var(--radius-pill);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    line-height: 1;
}

.zimam-task-calendar__count-pill[b-8ryqb531yi] {
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
}

.zimam-task-calendar__today-pill[b-8ryqb531yi] {
    color: var(--color-text-strong);
    background: var(--calendar-neutral-soft);
    border: 1px solid var(--calendar-neutral-border);
}

.zimam-task-calendar__task-stack[b-8ryqb531yi],
.zimam-task-calendar__lane-body[b-8ryqb531yi],
.zimam-task-calendar__agenda-list[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.zimam-task-calendar__task[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-not-started-bg);
    --calendar-task-border: var(--badge-health-not-started-border);
    --calendar-task-shadow-color: transparent;

    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    min-height: 1.875rem;
    padding: 0.375rem 0.5625rem;
    color: var(--color-text-strong);
    text-align: start;
    background: var(--calendar-task-bg);
    border: 1px solid var(--calendar-task-border);
    border-radius: var(--radius-md);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 0 0 1px var(--calendar-task-shadow-color);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                transform var(--duration-fast) var(--ease-default);
}

.zimam-task-calendar__task:hover[b-8ryqb531yi] {
    background: color-mix(in srgb, var(--calendar-task-bg) 76%, var(--color-surface));
    border-color: color-mix(in srgb, var(--calendar-task-border) 76%, var(--color-border-hover));
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.zimam-task-calendar__task--health-not-started[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-not-started-bg);
    --calendar-task-border: var(--badge-health-not-started-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-not-started-dot) 8%, transparent);
}

.zimam-task-calendar__task--health-on-time[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-on-time-bg);
    --calendar-task-border: var(--badge-health-on-time-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-on-time-dot) 10%, transparent);
}

.zimam-task-calendar__task--health-slightly-late[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-slightly-late-bg);
    --calendar-task-border: var(--badge-health-slightly-late-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-slightly-late-dot) 10%, transparent);
}

.zimam-task-calendar__task--health-late[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-late-bg);
    --calendar-task-border: var(--badge-health-late-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-late-dot) 12%, transparent);
}

.zimam-task-calendar__task--health-completed[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-completed-bg);
    --calendar-task-border: var(--badge-health-completed-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-completed-dot) 10%, transparent);
}

.zimam-task-calendar__task--health-on-hold[b-8ryqb531yi] {
    --calendar-task-bg: var(--badge-health-on-hold-bg);
    --calendar-task-border: var(--badge-health-on-hold-border);
    --calendar-task-shadow-color: color-mix(in srgb, var(--badge-health-on-hold-dot) 8%, transparent);
}

.zimam-task-calendar__task-title[b-8ryqb531yi] {
    overflow: hidden;
    color: var(--color-text-strong);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__task-meta[b-8ryqb531yi] {
    overflow: hidden;
    color: color-mix(in srgb, currentColor 78%, var(--color-text-muted));
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__dot[b-8ryqb531yi] {
    inline-size: 0.5rem;
    block-size: 0.5rem;
    order: 2;
    border-radius: 50%;
}

.zimam-task-calendar__more[b-8ryqb531yi],
.zimam-task-calendar__lane-empty[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.625rem;
    padding: 0.25rem 0.5rem;
    color: var(--color-text-muted);
    background: var(--color-bg-subtle);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__more:hover[b-8ryqb531yi] {
    color: var(--color-text-strong);
}

.zimam-task-calendar__week-grid[b-8ryqb531yi] {
    display: grid;
    grid-template-columns: repeat(7, minmax(13rem, 1fr));
    flex: 1;
    min-height: 0;
    gap: 1px;
    overflow: auto;
    padding: 1px;
    background: var(--calendar-grid-line);
    scrollbar-gutter: stable;
}

.zimam-task-calendar__day-view[b-8ryqb531yi],
.zimam-task-calendar__agenda[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: auto;
    gap: 1px;
    background: var(--calendar-grid-line);
}

.zimam-task-calendar__lane[b-8ryqb531yi],
.zimam-task-calendar__agenda-day[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
    padding: 0.875rem;
    background: var(--color-surface);
}

.zimam-task-calendar__lane[b-8ryqb531yi] {
    min-height: 19rem;
}

.zimam-task-calendar__lane--wide[b-8ryqb531yi] {
    min-height: 22rem;
}

.zimam-task-calendar__lane-head[b-8ryqb531yi],
.zimam-task-calendar__agenda-head[b-8ryqb531yi] {
    padding-bottom: 0.625rem;
    border-bottom: 1px solid var(--color-border-light);
}

.zimam-task-calendar__card[b-8ryqb531yi] {
    position: relative;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
    min-height: auto;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(180deg, var(--calendar-task-bg), color-mix(in srgb, var(--calendar-task-bg) 76%, var(--color-surface)));
    border-color: var(--calendar-task-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.zimam-task-calendar__card:hover[b-8ryqb531yi] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--calendar-task-bg) 82%, var(--color-surface)), var(--color-surface));
    border-color: color-mix(in srgb, var(--calendar-task-border) 80%, var(--color-border-hover));
}

.zimam-task-calendar__card > .zimam-task-calendar__dot[b-8ryqb531yi] {
    margin-block-start: 0.875rem;
    margin-inline-start: 0.875rem;
}

.zimam-task-calendar__card-body[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
    padding: 0.75rem 0.875rem 0.75rem 0;
}

.zimam-task-calendar__card-title-row[b-8ryqb531yi] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    min-width: 0;
}

.zimam-task-calendar__card-title[b-8ryqb531yi] {
    overflow: hidden;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__card-desc[b-8ryqb531yi],
.zimam-task-calendar__card-line[b-8ryqb531yi] {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: color-mix(in srgb, currentColor 76%, var(--color-text-muted));
    font-size: var(--text-sm);
    line-height: var(--lh-normal);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-calendar__card-line[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.zimam-task-calendar__card-line--emphasis[b-8ryqb531yi] {
    color: inherit;
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__card-chips[b-8ryqb531yi] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    margin-top: 0.125rem;
}

.zimam-task-calendar__empty[b-8ryqb531yi],
.zimam-task-calendar__skeleton-grid[b-8ryqb531yi] {
    min-height: 18rem;
}

.zimam-task-calendar__empty[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    text-align: center;
    background: var(--calendar-cell-muted);
    border: 1px dashed var(--color-border);
}

.zimam-task-calendar__empty--inline[b-8ryqb531yi] {
    min-height: 12rem;
}

.zimam-task-calendar__empty h3[b-8ryqb531yi],
.zimam-task-calendar__empty p[b-8ryqb531yi] {
    margin: 0;
}

.zimam-task-calendar__empty h3[b-8ryqb531yi] {
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
}

.zimam-task-calendar__empty p[b-8ryqb531yi] {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.zimam-task-calendar__empty-icon[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 3rem;
    block-size: 3rem;
    color: var(--color-text-muted);
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: 50%;
}

.zimam-task-calendar__retry[b-8ryqb531yi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.5rem 0.875rem;
    color: var(--color-text-strong);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    cursor: pointer;
}

.zimam-task-calendar__skeleton-grid[b-8ryqb531yi] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    flex: 1;
    min-height: 0;
    overflow: auto;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--calendar-grid-line);
}

.zimam-task-calendar__skeleton-card[b-8ryqb531yi] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    min-height: 8rem;
    padding: 0.875rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-xl);
}

.zimam-task-calendar__skeleton[b-8ryqb531yi] {
    display: block;
    background: linear-gradient(90deg, var(--color-bg) 25%, var(--color-border) 50%, var(--color-bg) 75%);
    background-size: 200% 100%;
    border-radius: var(--radius-sm);
    animation: zimam-task-calendar-shimmer-b-8ryqb531yi 1.4s linear infinite;
}

.zimam-task-calendar__skeleton--line[b-8ryqb531yi] {
    inline-size: 45%;
    block-size: 0.75rem;
}

.zimam-task-calendar__skeleton--chip[b-8ryqb531yi] {
    inline-size: 80%;
    block-size: 1.875rem;
}

.zimam-task-calendar__skeleton--chip-short[b-8ryqb531yi] {
    inline-size: 56%;
    block-size: 1.875rem;
}

@keyframes zimam-task-calendar-shimmer-b-8ryqb531yi {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (max-width: 1080px) {
    .zimam-task-calendar__header[b-8ryqb531yi] {
        flex-direction: column;
        align-items: flex-start;
    }

    .zimam-task-calendar__actions[b-8ryqb531yi] {
        justify-content: flex-start;
        width: 100%;
    }
}

@media (max-width: 760px) {
    .zimam-task-calendar__header[b-8ryqb531yi] {
        padding: 0.875rem;
    }

    .zimam-task-calendar__summary[b-8ryqb531yi] {
        padding: 0.5rem 0.875rem;
    }

    .zimam-task-calendar__actions[b-8ryqb531yi],
    .zimam-task-calendar__nav[b-8ryqb531yi],
    .zimam-task-calendar__options[b-8ryqb531yi],
    .zimam-task-calendar__options-trigger[b-8ryqb531yi] {
        width: 100%;
    }

    .zimam-task-calendar__nav[b-8ryqb531yi],
    .zimam-task-calendar__segmented[b-8ryqb531yi] {
        overflow-x: auto;
    }

    .zimam-task-calendar__options-panel[b-8ryqb531yi] {
        inset-inline: 0 auto;
        width: min(22rem, calc(100vw - 2rem));
    }

    .zimam-task-calendar__weekday-row[b-8ryqb531yi] {
        display: none;
    }

    .zimam-task-calendar__month-grid[b-8ryqb531yi] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-width: 0;
    }

    .zimam-task-calendar__day[b-8ryqb531yi] {
        min-height: 6.5rem;
    }

    .zimam-task-calendar__day--muted[b-8ryqb531yi] {
        display: none;
    }

    .zimam-task-calendar__week-grid[b-8ryqb531yi] {
        grid-template-columns: minmax(16rem, 1fr);
        overflow: visible;
    }

    .zimam-task-calendar__card-title-row[b-8ryqb531yi] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Modules/Tasks/SharedComponents/TaskCardsView/TaskCardsView.razor.rz.scp.css */
.zimam-task-cards-view__grid[b-rd2fs0nkhl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: 1rem;
}

.zimam-task-cards-view__card[b-rd2fs0nkhl] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    min-height: 18rem;
    padding: 1rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-sm);
}

.zimam-task-cards-view__card--loading[b-rd2fs0nkhl] {
    pointer-events: none;
}

.zimam-task-cards-view__header[b-rd2fs0nkhl] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.zimam-task-cards-view__header-body[b-rd2fs0nkhl] {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0.1875rem;
    min-width: 0;
}

.zimam-task-cards-view__avatar[b-rd2fs0nkhl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 2.5rem;
    block-size: 2.5rem;
    flex-shrink: 0;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: 50%;
}

.zimam-task-cards-view__title[b-rd2fs0nkhl] {
    margin: 0;
    overflow: hidden;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    line-height: var(--lh-tight);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-cards-view__subtitle[b-rd2fs0nkhl] {
    margin: 0;
    overflow: hidden;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-cards-view__chips[b-rd2fs0nkhl] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-height: 1.75rem;
}

.zimam-task-cards-view__chip[b-rd2fs0nkhl] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding-block: 0.35rem;
    padding-inline: 0.625rem;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-pill);
    font-size: var(--text-sm);
    line-height: var(--lh-tight);
}

.zimam-task-cards-view__details[b-rd2fs0nkhl] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0;
    padding: 0.875rem;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-xl);
}

.zimam-task-cards-view__detail[b-rd2fs0nkhl] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.zimam-task-cards-view__detail-label[b-rd2fs0nkhl] {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    line-height: var(--lh-tight);
}

.zimam-task-cards-view__detail-value[b-rd2fs0nkhl] {
    margin: 0;
    overflow: hidden;
    color: var(--color-text-strong);
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    line-height: var(--lh-normal);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-task-cards-view__footer[b-rd2fs0nkhl] {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
    padding-top: 0.875rem;
    border-top: 1px solid var(--color-border-light);
}

.zimam-task-cards-view__button[b-rd2fs0nkhl] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-block-size: 2.25rem;
    padding-block: 0.5rem;
    padding-inline: 0.875rem;
    color: var(--color-text-secondary);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
                background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default);
}

.zimam-task-cards-view__button:hover[b-rd2fs0nkhl] {
    color: var(--color-text-strong);
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.zimam-task-cards-view__button:focus-visible[b-rd2fs0nkhl] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-task-cards-view__empty[b-rd2fs0nkhl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-height: 18rem;
    padding: 2rem 1rem;
    text-align: center;
    background: var(--color-surface);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-card);
}

.zimam-task-cards-view__empty-icon[b-rd2fs0nkhl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 3rem;
    block-size: 3rem;
    color: var(--color-text-faint);
    background: var(--color-bg-subtle);
    border-radius: 50%;
}

.zimam-task-cards-view__empty-title[b-rd2fs0nkhl] {
    margin: 0;
    color: var(--color-text-strong);
    font-size: var(--text-lg);
    font-weight: var(--fw-semibold);
}

.zimam-task-cards-view__empty-text[b-rd2fs0nkhl] {
    margin: 0;
    color: var(--color-text-muted);
    font-size: var(--text-md);
}

.zimam-task-cards-view__skeleton[b-rd2fs0nkhl] {
    background: linear-gradient(90deg, var(--color-bg) 25%, var(--color-border) 50%, var(--color-bg) 75%);
    background-size: 200% 100%;
    border-radius: var(--radius-sm);
    animation: zimam-task-card-shimmer-b-rd2fs0nkhl 1.4s linear infinite;
}

.zimam-task-cards-view__skeleton--avatar[b-rd2fs0nkhl] {
    inline-size: 2.5rem;
    block-size: 2.5rem;
    border-radius: 50%;
}

.zimam-task-cards-view__skeleton--title[b-rd2fs0nkhl] {
    inline-size: 70%;
    block-size: 0.875rem;
}

.zimam-task-cards-view__skeleton--sub[b-rd2fs0nkhl] {
    inline-size: 42%;
    block-size: 0.625rem;
}

.zimam-task-cards-view__skeleton--chip[b-rd2fs0nkhl] {
    inline-size: 5rem;
    block-size: 1.75rem;
    border-radius: var(--radius-pill);
}

.zimam-task-cards-view__skeleton--label[b-rd2fs0nkhl] {
    inline-size: 55%;
    block-size: 0.625rem;
}

.zimam-task-cards-view__skeleton--value[b-rd2fs0nkhl] {
    inline-size: 85%;
    block-size: 0.75rem;
}

.zimam-task-cards-view__skeleton--button[b-rd2fs0nkhl] {
    inline-size: 6.5rem;
    block-size: 2.25rem;
    border-radius: var(--radius-md);
}

@keyframes zimam-task-card-shimmer-b-rd2fs0nkhl {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

@media (max-width: 900px) {
    .zimam-task-cards-view__details[b-rd2fs0nkhl] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .zimam-task-cards-view__grid[b-rd2fs0nkhl] {
        grid-template-columns: 1fr;
    }
}
/* /Modules/Tasks/SharedComponents/TaskDescriptionEditor/TaskDescriptionEditor.razor.rz.scp.css */
/* ==========================================================================
   TaskDescriptionEditor — Inline click-to-edit rich description
   Scoped via Blazor CSS isolation.
   ========================================================================== */

.task-desc-editor[b-14bmhw974q] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    direction: rtl;
    text-align: right;
}

.task-desc-editor__header[b-14bmhw974q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.task-desc-editor__heading[b-14bmhw974q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.task-desc-editor__title[b-14bmhw974q] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    margin: 0;
}

.task-desc-editor__timestamp[b-14bmhw974q] {
    font-size: var(--text-2xs, 0.625rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-muted);
    background: var(--color-bg);
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-xs, 0.25rem);
}

.task-desc-editor__edit-btn[b-14bmhw974q] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary);
    background: transparent;
    border: 1px solid transparent;
    padding: 0.3125rem 0.625rem;
    border-radius: var(--radius-sm, 0.375rem);
    cursor: pointer;
    transition: color 150ms, background 150ms, border-color 150ms;
}

.task-desc-editor__edit-btn:hover[b-14bmhw974q] {
    color: var(--color-primary);
    background: var(--color-info-bg);
    border-color: var(--color-info-border);
}

/* ── Read mode ── */
.task-desc-editor__read[b-14bmhw974q] {
    all: unset;
    display: block;
    cursor: text;
    padding: 1.125rem 1.25rem;
    border-radius: var(--radius-xl, 1rem);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    transition: background 150ms, border-color 150ms;
}

.task-desc-editor__read:hover[b-14bmhw974q] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.task-desc-editor__read:focus-visible[b-14bmhw974q] {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.task-desc-editor__empty[b-14bmhw974q] {
    all: unset;
    display: block;
    cursor: text;
    padding: 1.125rem 1.25rem;
    font-size: var(--text-sm, 0.8125rem);
    color: var(--color-text-muted);
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-xl, 1rem);
    background: var(--color-surface);
    text-align: center;
    transition: color 150ms, background 150ms, border-color 150ms;
}

.task-desc-editor__empty:hover[b-14bmhw974q] {
    color: var(--color-primary);
    background: var(--color-info-bg);
    border-color: var(--color-info-border);
}

.task-desc-editor__rendered[b-14bmhw974q] {
    font-size: var(--text-md, 0.875rem);
    color: var(--color-text-secondary);
    line-height: 1.75;
}

.task-desc-editor__rendered h3[b-14bmhw974q] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    margin: 1rem 0 0.375rem;
}

.task-desc-editor__rendered h3:first-child[b-14bmhw974q] {
    margin-top: 0;
}

.task-desc-editor__rendered p[b-14bmhw974q] {
    margin: 0 0 0.625rem;
}

.task-desc-editor__rendered p:last-child[b-14bmhw974q] {
    margin-bottom: 0;
}

.task-desc-editor__rendered ul[b-14bmhw974q],
.task-desc-editor__rendered ol[b-14bmhw974q] {
    padding-inline-start: 1.25rem;
    margin: 0 0 0.625rem;
}

.task-desc-editor__rendered li[b-14bmhw974q] {
    margin-bottom: 0.25rem;
}

.task-desc-editor__rendered pre[b-14bmhw974q] {
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.75rem 0.875rem;
    font-family: ui-monospace, monospace;
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-secondary);
    overflow-x: auto;
    margin: 0 0 0.625rem;
    direction: ltr;
    text-align: left;
}

.task-desc-editor__rendered code[b-14bmhw974q] {
    background: var(--color-bg);
    color: var(--color-primary);
    padding: 0.0625rem 0.3125rem;
    border-radius: var(--radius-xs, 0.25rem);
    font-size: 0.8em;
    font-family: ui-monospace, monospace;
}

.task-desc-editor__rendered pre code[b-14bmhw974q] {
    background: transparent;
    color: inherit;
    padding: 0;
}

/* ── Edit mode ── */
.task-desc-editor__shell[b-14bmhw974q] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl, 1rem);
    overflow: hidden;
    background: var(--color-surface);
    box-shadow: var(--shadow-sm);
    transition: border-color 150ms, box-shadow 150ms;
}

.task-desc-editor__shell:focus-within[b-14bmhw974q] {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 4px var(--color-primary-ring);
}

.task-desc-editor__toolbar[b-14bmhw974q] {
    display: flex;
    align-items: center;
    gap: 0.125rem;
    padding: 0.375rem;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    flex-wrap: wrap;
}

.task-desc-editor__tool[b-14bmhw974q] {
    width: 1.75rem;
    height: 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: var(--color-text-secondary);
    border-radius: var(--radius-sm, 0.375rem);
    cursor: pointer;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    transition: background 150ms, color 150ms;
    padding: 0;
}

.task-desc-editor__tool:hover[b-14bmhw974q] {
    background: var(--color-border-light);
    color: var(--color-text-strong);
}

.task-desc-editor__tool--mono[b-14bmhw974q] {
    font-family: ui-monospace, monospace;
    font-size: 0.75rem;
}

.task-desc-editor__sep[b-14bmhw974q] {
    width: 1px;
    height: 1rem;
    background: var(--color-border);
    margin-inline: 0.25rem;
}

.task-desc-editor__surface[b-14bmhw974q] {
    min-height: 12rem;
    padding: 1.125rem 1.25rem;
    font-size: var(--text-md, 0.875rem);
    line-height: 1.75;
    color: var(--color-text);
    outline: none;
    direction: rtl;
    text-align: right;
}

.task-desc-editor__surface h3[b-14bmhw974q] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    margin: 0.75rem 0 0.375rem;
}

.task-desc-editor__surface p[b-14bmhw974q] {
    margin: 0 0 0.5rem;
}

.task-desc-editor__surface ul[b-14bmhw974q],
.task-desc-editor__surface ol[b-14bmhw974q] {
    padding-inline-start: 1.25rem;
    margin: 0 0 0.5rem;
}

.task-desc-editor__surface pre[b-14bmhw974q] {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.625rem 0.75rem;
    font-family: ui-monospace, monospace;
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-secondary);
    direction: ltr;
    text-align: left;
    overflow-x: auto;
}

.task-desc-editor__error[b-14bmhw974q] {
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-error-text);
    background: var(--color-error-bg);
    border: 1px solid var(--color-error-border);
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md, 0.5rem);
}

.task-desc-editor__actions[b-14bmhw974q] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.task-desc-editor__btn[b-14bmhw974q] {
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-medium, 500);
    padding: 0.4375rem 0.875rem;
    border-radius: var(--radius-sm, 0.375rem);
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 150ms, border-color 150ms, color 150ms;
}

.task-desc-editor__btn:disabled[b-14bmhw974q] {
    opacity: 0.6;
    cursor: not-allowed;
}

.task-desc-editor__btn--primary[b-14bmhw974q] {
    background: var(--color-primary);
    color: #fff;
    box-shadow: var(--shadow-sm);
}

.task-desc-editor__btn--primary:hover:not(:disabled)[b-14bmhw974q] {
    background: var(--color-primary-700);
}

.task-desc-editor__btn--secondary[b-14bmhw974q] {
    background: var(--color-surface);
    color: var(--color-text-secondary);
    border-color: var(--color-border);
}

.task-desc-editor__btn--secondary:hover:not(:disabled)[b-14bmhw974q] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}
/* /Modules/Tasks/SharedComponents/TaskDrawerHeader/TaskDrawerHeader.razor.rz.scp.css */
/* TaskDrawerHeader — bento hero styles layered on top of the shared
   .zimam-drawer-rich-header infrastructure in BaseDrawer.razor.css */

.zimam-drawer-rich-header--task[b-z15jlfcv31] {
    margin-block-start: 0;
    margin-inline: -1.5rem;
    padding-block-start: 0;
    padding-inline: 1.5rem;
    gap: 0;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__content {
    gap: 0.375rem;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__decor {
    inset-block-start: 0.5rem;
    inset-inline-end: -2.5rem;
    opacity: 0.1;
    color: var(--color-text-faint, #94a3b8);
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__decor svg {
    width: 10rem;
    height: 10rem;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__tabs {
    margin: 0 -1.5rem 1.25rem;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-row {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    row-gap: 0.375rem;
    margin-block-end: 0.5rem;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__case-link {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-muted);
    cursor: pointer;
    letter-spacing: 0.02em;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__case-link:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__case-link--plain {
    cursor: default;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__case-link--plain:hover {
    color: var(--color-text-muted);
    text-decoration: none;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__title {
    margin-top: 0;
    font-size: 1.375rem;
    letter-spacing: -0.02em;
    padding-inline: 0;
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__desc {
    margin-top: 0;
    max-width: 100%;
    line-height: 1.55;
}

/* Header actions now rendered in drawer footer; keep rule removed. */

/* Neutral badge + colored dot (inspiration parity) */
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge {
    gap: 0.375rem;
    background: var(--color-bg-subtle, #f8fafc);
    border: 1px solid var(--color-border);
    color: var(--color-text-strong);
    padding: 0.25rem 0.625rem;
    border-radius: 1rem;
    font-size: var(--text-sm, 0.75rem);
}

.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 9999px;
    background: var(--color-text-strong);
    flex-shrink: 0;
}

/* Dot colors delegated to global .zimam-dot--{success|warning|error|info|muted}
   via BadgePalette.ResolveStatus(...).DotClass — keeps drawer in sync with rest of app. */
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot.zimam-dot--success { background: var(--color-success-text); }
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot.zimam-dot--warning { background: var(--color-warning-text); }
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot.zimam-dot--error   { background: var(--color-hold-text); }
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot.zimam-dot--info    { background: var(--color-primary); }
.zimam-drawer-rich-header--task[b-z15jlfcv31]  .zimam-drawer-rich-header__badge-dot.zimam-dot--muted   { background: var(--color-text-muted); }
/* /Modules/Tasks/SharedComponents/TaskForm/TaskForm.razor.rz.scp.css */
[b-x9ph9cjsyl] .zimam-task-employee-picker {
    position: relative;
    width: 100%;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__trigger {
    width: 100%;
    min-height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    text-align: start;
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-default),
        box-shadow var(--duration-fast) var(--ease-default);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__trigger:hover,
[b-x9ph9cjsyl] .zimam-task-employee-picker__trigger--open {
    border-color: var(--color-border-hover);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__trigger:focus-visible {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__trigger:disabled {
    cursor: not-allowed;
    opacity: 0.65;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__placeholder {
    color: var(--color-text-muted);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__value {
    color: var(--color-text-strong);
    font-weight: var(--fw-medium);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__chevron {
    color: var(--color-text-muted);
    font-size: var(--text-lg);
    line-height: 1;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__menu {
    position: absolute;
    z-index: var(--z-modal);
    inset-block-start: calc(100% + 0.375rem);
    inset-inline: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    box-shadow: var(--shadow-floating);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__search-input {
    width: 100%;
    min-height: 2.25rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    color: var(--color-text);
    font: inherit;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__search-input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--color-primary-ring);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__list {
    max-height: 18rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__option {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem;
    border: 1px solid transparent;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text);
    font: inherit;
    text-align: start;
    cursor: pointer;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__option:hover,
[b-x9ph9cjsyl] .zimam-task-employee-picker__option--selected {
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__option--muted {
    justify-content: center;
    color: var(--color-text-secondary);
    border-style: dashed;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__avatar {
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__text {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__name {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__meta {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__loading,
[b-x9ph9cjsyl] .zimam-task-employee-picker__empty,
[b-x9ph9cjsyl] .zimam-task-employee-picker__error,
[b-x9ph9cjsyl] .zimam-task-employee-picker__hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

[b-x9ph9cjsyl] .zimam-task-employee-picker__error {
    color: var(--color-error-text);
    background: var(--color-error-bg);
    border: 1px solid var(--color-error-border);
    border-radius: var(--radius-md);
}
/* /Modules/Tasks/SharedComponents/TaskQuickActionColumn/TaskQuickActionColumn.razor.rz.scp.css */
/* ==========================================================================
   TaskQuickActionColumn — Unified tabs (مهامي / الموافقات / الإشعارات)
   Design-system tokens only
   ========================================================================== */

.quick-action-column[b-6wcmscvel1] {
    display: flex;
    flex-direction: column;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    flex: 1;
    min-height: 0;
}

/* ── Tab Bar ── */
.quick-action-column__tab-bar[b-6wcmscvel1] {
    display: flex;
    border-bottom: 1px solid var(--color-border);
    padding: 0;
    flex-shrink: 0;
    overflow-x: auto;
}

.quick-action-column__tab[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    border: none;
    background: transparent;
    color: var(--color-text-muted);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
    white-space: nowrap;
    flex: 1;
    justify-content: center;
}

.quick-action-column__tab:hover[b-6wcmscvel1] {
    color: var(--color-text-strong);
}

.quick-action-column__tab--active[b-6wcmscvel1] {
    color: var(--color-text-strong);
    border-bottom-color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.quick-action-column__tab-icon-wrap[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.quick-action-column__tab-count[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.125rem;
    padding: 0 0.375rem;
    border-radius: var(--radius-pill);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
}

.quick-action-column__tab--active .quick-action-column__tab-count[b-6wcmscvel1] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

/* ── Section Header (row: title+date on one side, filter button on the other) ── */
.quick-action-column__section-header[b-6wcmscvel1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.125rem;
    margin-bottom: 0.5rem;
    padding-block: 0.375rem 0.25rem;
    padding-inline: 0.75rem;
    flex-shrink: 0;
}

.quick-action-column__section-meta[b-6wcmscvel1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    min-width: 0;
}

.quick-action-column__section-title[b-6wcmscvel1] {
    font-size: var(--text-md);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
    line-height: 1.3;
}

.quick-action-column__section-date[b-6wcmscvel1] {
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    line-height: 1.4;
}

.quick-action-column__link[b-6wcmscvel1] {
    font-size: var(--text-xs);
    color: var(--color-text-strong);
    font-weight: var(--fw-medium);
    text-decoration: none;
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-sm);
    transition: background var(--duration-fast) var(--ease-default);
}

.quick-action-column__link:hover[b-6wcmscvel1] {
    background: var(--color-bg-subtle);
}

/* ── Filter toggle button in section header ── */
.quick-action-column__filter-btn[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text-muted);
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.quick-action-column__filter-btn:hover[b-6wcmscvel1] {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
    border-color: var(--color-border-hover);
}

.quick-action-column__filter-btn--active[b-6wcmscvel1] {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border-color: var(--color-text-strong);
}

.quick-action-column__filter-btn--active:hover[b-6wcmscvel1] {
    background: var(--color-text-secondary);
    color: var(--color-surface);
}

.quick-action-column__filter-btn:focus-visible[b-6wcmscvel1] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Filter pills outer shell (visible container) ── */
.quick-action-column__filter-shell[b-6wcmscvel1] {
    position: relative;
    margin: 0 0.75rem 0.5rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-subtle);
    overflow: hidden;
    flex-shrink: 0;
}

/* Fade masks on edges to hint more content when drag-scrolling */
.quick-action-column__filter-shell[b-6wcmscvel1]::before,
.quick-action-column__filter-shell[b-6wcmscvel1]::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1.5rem;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--duration-fast) var(--ease-default);
}

/* RTL: right edge fade (start) */
.quick-action-column__filter-shell[b-6wcmscvel1]::before {
    right: 0;
    background: linear-gradient(to right, transparent, var(--color-bg-subtle));
}

/* RTL: left edge fade (end) */
.quick-action-column__filter-shell[b-6wcmscvel1]::after {
    left: 0;
    background: linear-gradient(to left, transparent, var(--color-bg-subtle));
}

.quick-action-column__filter-shell:hover[b-6wcmscvel1]::before,
.quick-action-column__filter-shell:hover[b-6wcmscvel1]::after {
    opacity: 1;
}

/* ── Filter pills scrollable track (inner) ── */
.quick-action-column__filter-bar[b-6wcmscvel1] {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.375rem;
    padding: 0.375rem 0.5rem;
    overflow-x: auto;
    scrollbar-width: none;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: auto;
    user-select: none;
    -webkit-user-select: none;
}

.quick-action-column__filter-bar:global(.is-grabbing)[b-6wcmscvel1] {
    cursor: grabbing;
    scroll-behavior: auto;
}

.quick-action-column__filter-bar[b-6wcmscvel1]::-webkit-scrollbar {
    display: none;
}

.quick-action-column__filter-pill[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: 999em;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background var(--duration-fast) var(--ease-default),
                color var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                transform 150ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.quick-action-column__filter-pill:active[b-6wcmscvel1] {
    transform: scale(0.92);
}

.quick-action-column__filter-pill:hover[b-6wcmscvel1] {
    background: var(--color-surface);
    border-color: var(--color-border-hover);
    color: var(--color-text-strong);
}

.quick-action-column__filter-pill--active[b-6wcmscvel1] {
    background: var(--color-text-strong);
    color: var(--color-surface);
    border-color: var(--color-text-strong);
}

.quick-action-column__filter-pill--active:hover[b-6wcmscvel1] {
    background: var(--color-text-secondary);
    color: var(--color-surface);
}

.quick-action-column__filter-badge[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding-inline: 0.25rem;
    border-radius: 999em;
    font-size: 0.625rem;
    font-weight: 700;
    background: rgba(0, 0, 0, 0.12);
    color: inherit;
    line-height: 1;
}

.quick-action-column__filter-pill--active .quick-action-column__filter-badge[b-6wcmscvel1] {
    background: rgba(255, 255, 255, 0.25);
}

/* ── Body ── */
.quick-action-column__body[b-6wcmscvel1] {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

/* ── Cards ── */
.quick-action-column__card[b-6wcmscvel1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
    text-align: start;
    width: 100%;
}

.quick-action-column__card:hover[b-6wcmscvel1] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
    box-shadow: var(--shadow-sm);
}

.quick-action-column__card--overdue[b-6wcmscvel1] {
    border-inline-start: 3px solid var(--color-error-text);
}

.quick-action-column__card--approval[b-6wcmscvel1] {
    border-inline-start: 3px solid var(--color-text-strong);
}

.quick-action-column__card--unread[b-6wcmscvel1] {
    background: var(--color-info-bg);
    border-color: var(--color-info-border);
}

.quick-action-column__card--skeleton[b-6wcmscvel1] {
    pointer-events: none;
    min-height: 3.5rem;
}

.quick-action-column__card-header[b-6wcmscvel1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.quick-action-column__card-title[b-6wcmscvel1] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.quick-action-column__card-days-late[b-6wcmscvel1] {
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-error-text);
    white-space: nowrap;
    flex-shrink: 0;
    padding: 0.125rem 0.5rem;
    background: var(--color-error-bg);
    border-radius: var(--radius-sm);
}

.quick-action-column__card-step[b-6wcmscvel1] {
    font-size: var(--text-2xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
    padding: 0.125rem 0.5rem;
    flex-shrink: 0;
    white-space: nowrap;
}

.quick-action-column__card-dot[b-6wcmscvel1] {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: var(--radius-pill);
    background: var(--color-info-text);
    flex-shrink: 0;
}

.quick-action-column__card-transition[b-6wcmscvel1] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
}

.quick-action-column__card-transition--target[b-6wcmscvel1] {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold);
}

.quick-action-column__card-body[b-6wcmscvel1] {
    font-size: var(--text-xs);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: var(--lh-normal);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.quick-action-column__card-meta[b-6wcmscvel1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
    flex-wrap: wrap;
}

.quick-action-column__card-responsible[b-6wcmscvel1],
.quick-action-column__card-case[b-6wcmscvel1],
.quick-action-column__card-date[b-6wcmscvel1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

/* ── Empty State ── */
.quick-action-column__empty[b-6wcmscvel1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem 1rem;
    color: var(--color-text-faint);
    text-align: center;
    flex: 1;
}

.quick-action-column__empty p[b-6wcmscvel1] {
    font-size: var(--text-sm);
    margin: 0;
}

/* ── Skeleton ── */
.qac-skeleton[b-6wcmscvel1] {
    background: linear-gradient(
        90deg,
        var(--color-border-light) 25%,
        var(--color-bg-subtle) 50%,
        var(--color-border-light) 75%
    );
    background-size: 200% 100%;
    animation: qac-shimmer-b-6wcmscvel1 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes qac-shimmer-b-6wcmscvel1 {
    0%   { background-position: -200% 0; }
    100% { background-position:  200% 0; }
}

/* ── Infinite-scroll sentinel ──────────────────────────────────────────
   A minimum height is required so IntersectionObserver can reliably detect
   the element entering the viewport (zero-height elements are edge cases). */
.quick-action-column__sentinel[b-6wcmscvel1] {
    min-height: 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    padding: 0.5rem 0.75rem;
    border-radius: var(--radius-md);
}
/* /Modules/Tasks/SharedComponents/TaskView/TaskView.razor.rz.scp.css */
/* ==========================================================================
   TaskView — Bento-grid task detail view body (hero lives in drawer header)
   Scoped via Blazor CSS isolation.
   ========================================================================== */

.task-body[b-fyzg22kdgg] {
    display: flex;
    flex-direction: column;
    direction: rtl;
    text-align: right;
}

/* ── Bento Grid ────────────────────────────────────────────────────────── */

.task-bento-grid[b-fyzg22kdgg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding: 0;
    margin-bottom: 1rem;
}

.task-card[b-fyzg22kdgg] {
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl, 1rem);
    padding: 1.125rem 1.25rem;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0.625rem;
}

.task-card--full[b-fyzg22kdgg] {
    grid-column: 1 / -1;
}

.task-card__title[b-fyzg22kdgg] {
    font-size: var(--text-2xs, 0.625rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    margin-bottom: 0.125rem;
}

/* ── Summary Card (standalone, above the bento grid) ─────────────────────── */

.task-summary-card[b-fyzg22kdgg] {
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg, 0.75rem);
    padding: 0.875rem 1.125rem;
    box-shadow: var(--shadow-sm);
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
}

.task-summary-header[b-fyzg22kdgg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

.task-summary-person[b-fyzg22kdgg] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 0;
}

.task-summary-person[b-fyzg22kdgg]  .task-avatar {
    width: 2rem;
    height: 2rem;
    font-size: var(--text-sm, 0.8125rem);
}

.task-summary-person-info[b-fyzg22kdgg] {
    min-width: 0;
}

.task-summary-person-name[b-fyzg22kdgg] {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-summary-person-sub[b-fyzg22kdgg] {
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-muted, #64748b);
    font-weight: var(--fw-medium, 500);
    margin-top: 0.125rem;
    line-height: 1.25;
}

.task-summary-date[b-fyzg22kdgg] {
    text-align: start;
    flex-shrink: 0;
}

.task-summary-date-main[b-fyzg22kdgg] {
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
}

.task-summary-date-sub[b-fyzg22kdgg] {
    font-size: var(--text-xs, 0.6875rem);
    color: var(--color-text-muted, #64748b);
    font-weight: var(--fw-medium, 500);
    margin-top: 0.125rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
}

.task-summary-row[b-fyzg22kdgg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
    min-height: 0;
}

.task-summary-row:last-child[b-fyzg22kdgg] {
    border-bottom: none;
    padding-bottom: 0.125rem;
}

.task-summary-label[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.8125rem);
    line-height: 1.25;
}

.task-summary-label[b-fyzg22kdgg]  svg {
    color: var(--color-text-strong);
    flex-shrink: 0;
}

.task-summary-value[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.8125rem);
    line-height: 1.25;
}

.task-summary-value--mono[b-fyzg22kdgg] {
    font-family: var(--font-family);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
    color: var(--color-text-strong);
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-semibold, 600);
}

.task-summary-value[b-fyzg22kdgg]  .zimam-pill {
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-semibold, 600);
    padding: 5px 10px;
    line-height: 1.1;
    border-radius: var(--radius-md, 0.5rem);
    gap: 0;
    min-height: 0;
}

.task-body[b-fyzg22kdgg]  .zimam-pill .zimam-dot {
    display: none;
}

/* Composite status pill: shown when a task has a pending approval session transitioning it
   to a new status. Renders "target (dashed) ← current (solid)" so the user sees both states
   without losing the persisted value. Hidden automatically once approval resolves. */
.task-status-transition[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: nowrap;
}

.task-status-transition__arrow[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    opacity: 0.75;
}

.task-summary-value[b-fyzg22kdgg]  .zimam-pill--pending-target {
    border-style: dashed;
    border-width: 1.5px;
    background-color: transparent !important;
}

.task-summary-value--date[b-fyzg22kdgg] {
    gap: 0.375rem;
    position: relative;
}

.task-summary-inline-picker[b-fyzg22kdgg] {
    min-width: 10rem;
}

.task-summary-inline-picker--hidden[b-fyzg22kdgg] {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 100%;
    inline-size: 0;
    block-size: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    min-width: 0;
}

.task-summary-inline-picker[b-fyzg22kdgg]  .date-picker-wrapper {
    width: 100%;
}

.task-summary-inline-picker[b-fyzg22kdgg]  .zimam-datepicker-field {
    position: relative;
    display: block;
    width: 100%;
}

.task-summary-inline-picker[b-fyzg22kdgg]  .zimam-datepicker-input {
    width: 100%;
    border: 1px solid var(--color-border);
    background: var(--color-surface) !important;
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.4375rem 0.75rem !important;
    padding-inline-start: 2rem !important;
    padding-inline-end: 0.75rem !important;
    box-shadow: none;
    color: var(--color-text-strong);
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-semibold, 600);
    text-align: end;
}

.task-summary-inline-picker[b-fyzg22kdgg]  .zimam-datepicker-icon-container {
    right: auto;
    inset-inline-start: 0.625rem;
    color: var(--color-text-muted);
}

/* ── Linked Case Card extras ─────────────────────────────────────────────── */

.task-linked-card__open[b-fyzg22kdgg] {
    appearance: none;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-strong);
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md, 0.5rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--duration-fast, 150ms) var(--ease-default),
                border-color var(--duration-fast, 150ms) var(--ease-default);
}

.task-linked-card__open:hover[b-fyzg22kdgg] {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

.task-linked-card__open:active[b-fyzg22kdgg] {
    transform: scale(0.97);
}

.task-linked-parties[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.task-linked-parties__sep[b-fyzg22kdgg] {
    color: var(--color-text-muted);
    font-weight: var(--fw-medium, 500);
    font-size: var(--text-xs, 0.6875rem);
    padding: 0 0.125rem;
}

/* Meta rows inside card */

.meta-row[b-fyzg22kdgg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0;
    font-size: var(--text-md, 0.875rem);
    min-height: 2rem;
    flex: 1 1 auto;
}

.meta-row:last-child[b-fyzg22kdgg] {
    margin-bottom: 0;
}

.meta-label[b-fyzg22kdgg] {
    color: var(--color-text-muted, #64748b);
    font-weight: var(--fw-medium, 500);
    font-size: var(--text-sm, 0.8125rem);
}

.meta-value[b-fyzg22kdgg] {
    color: var(--color-text-strong, #0f172a);
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.8125rem);
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.meta-value--emphasis[b-fyzg22kdgg] {
    color: var(--color-text-strong, #0f172a);
    font-weight: var(--fw-semibold, 600);
}

.meta-value-dot[b-fyzg22kdgg] {
    width: 0.4375rem;
    height: 0.4375rem;
    border-radius: 9999px;
    background: var(--color-text-strong);
    flex-shrink: 0;
}

.meta-value--editable[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

/* Health row inside full-width card */

.task-health-grid[b-fyzg22kdgg] {
    display: grid;
    grid-template-columns: 1fr 1fr 1.5fr;
    gap: 1.25rem;
    align-items: center;
}

.task-health-col[b-fyzg22kdgg] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    min-width: 0;
}

.task-health-col--bordered[b-fyzg22kdgg] {
    padding-inline-start: 1.25rem;
    border-inline-start: 1px solid var(--color-border);
    gap: 0.5rem;
    justify-content: center;
}

.task-health-label[b-fyzg22kdgg] {
    font-size: var(--text-2xs, 0.625rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-muted, #64748b);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.task-progress-header[b-fyzg22kdgg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.task-progress-val[b-fyzg22kdgg] {
    font-size: var(--text-sm, 0.75rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    font-variant-numeric: tabular-nums;
}

.task-progress-track[b-fyzg22kdgg] {
    height: 0.375rem;
    background: var(--color-border-light, #e2e8f0);
    border-radius: 999px;
    overflow: hidden;
}

.task-progress-fill[b-fyzg22kdgg] {
    height: 100%;
    background: var(--color-text-strong);
    border-radius: 999px;
    transition: width 0.3s ease;
}

/* Progress row inside summary-card-style health card */
.task-summary-value--progress[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.task-summary-value--progress .task-progress-track[b-fyzg22kdgg] {
    width: 6rem;
}

/* Days-remaining tint via modifier class (inherited from meta-value) */
.task-days--overdue[b-fyzg22kdgg] {
    color: var(--color-error-text, #dc2626) !important;
}

.task-days--warning[b-fyzg22kdgg] {
    color: var(--color-warning-text, #b45309) !important;
}

/* People row */

.task-people-grid[b-fyzg22kdgg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.task-person-col[b-fyzg22kdgg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.task-person-info[b-fyzg22kdgg] {
    flex: 1;
    min-width: 0;
}

.task-person-label[b-fyzg22kdgg] {
    font-size: var(--text-2xs, 0.625rem);
    color: var(--color-text-muted, #64748b);
    font-weight: var(--fw-medium, 500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.125rem;
}

.task-person-value[b-fyzg22kdgg] {
    font-size: var(--text-sm, 0.8125rem);
    color: var(--color-text-strong, #0f172a);
    font-weight: var(--fw-semibold, 600);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.task-avatar[b-fyzg22kdgg] {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    flex-shrink: 0;
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
}

.task-avatar:not(img)[b-fyzg22kdgg] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs, 0.6875rem);
    font-weight: var(--fw-bold, 700);
}

.task-avatar--assigned[b-fyzg22kdgg] {
    background: var(--color-bg-subtle);
}

.task-avatar--reviewer[b-fyzg22kdgg] {
    background: var(--color-text-secondary, #475569);
}

.task-avatar--neutral[b-fyzg22kdgg] {
    background: var(--color-chip-bg);
    color: var(--color-text-strong);
}

.task-avatar--unassigned[b-fyzg22kdgg] {
    background: var(--color-bg, #f1f5f9);
    border: 1px dashed var(--color-border-hover, #cbd5e1);
    color: var(--color-text-muted, #64748b);
}

/* Blocker row below health card */
.task-blocker-row[b-fyzg22kdgg] {
    margin-top: 0.875rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--color-error-border, #fca5a5);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--text-sm, 0.75rem);
    color: var(--color-error-text);
}

.task-blocker-icon[b-fyzg22kdgg] {
    font-size: 0.875rem;
}

.task-blocker-reason[b-fyzg22kdgg] {
    font-weight: var(--fw-semibold, 600);
}

.task-blocker-date[b-fyzg22kdgg] {
    color: var(--color-text-muted);
    font-weight: var(--fw-normal, 400);
}

/* Extended toggle pill (inside timeline card) */
.task-status-circle[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-weight: var(--fw-semibold, 600);
    font-size: var(--text-sm, 0.8125rem);
}

.task-status-dot[b-fyzg22kdgg] {
    width: 0.4375rem;
    height: 0.4375rem;
    border-radius: 9999px;
    background: currentColor;
    flex-shrink: 0;
}

.task-extended--on[b-fyzg22kdgg] {
    color: var(--color-success-text, #065f46);
}

.task-extended--off[b-fyzg22kdgg] {
    color: var(--color-text-muted, #64748b);
}

/* Edit hint (pen) — shows on row hover */
.task-edit-hint[b-fyzg22kdgg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    padding: 0;
    border-radius: 9999px;
    border: none;
    background: transparent;
    color: var(--color-text-faint, #94a3b8);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s, background 0.15s, color 0.15s;
    flex-shrink: 0;
}

.meta-row:hover .task-edit-hint[b-fyzg22kdgg],
.task-person-col:hover .task-edit-hint[b-fyzg22kdgg] {
    opacity: 1;
}

.task-edit-hint:hover[b-fyzg22kdgg] {
    background: var(--color-border-light);
    color: var(--color-text-strong);
}

.task-edit-hint--inline[b-fyzg22kdgg] {
    opacity: 1;
    width: 1rem;
    height: 1rem;
    color: var(--color-text-muted, #64748b);
}

/* DateOnlyPicker — strip inner form chrome inside card */
.meta-value--editable[b-fyzg22kdgg]  .zimam-datepicker-field {
    display: flex;
    align-items: center;
    direction: rtl;
}

.meta-value--editable[b-fyzg22kdgg]  .zimam-datepicker-input {
    border: none;
    background: transparent;
    padding: 0 !important;
    padding-inline: 0 !important;
    margin: 0;
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
    cursor: pointer;
    width: auto;
    min-width: 0;
    box-shadow: none;
    outline: none;
    height: auto;
    line-height: 1.4;
    text-align: end;
}

.meta-value--editable[b-fyzg22kdgg]  .zimam-datepicker-input::placeholder {
    color: var(--color-text-strong);
    font-weight: var(--fw-semibold, 600);
    opacity: 1;
}

.meta-value--editable[b-fyzg22kdgg]  .zimam-datepicker-icon-container {
    display: none;
}

/* ── Tabs section ──────────────────────────────────────────────────────── */

.task-tabs-section[b-fyzg22kdgg] {
    display: flex;
    flex-direction: column;
    direction: rtl;
    text-align: right;
}

.task-tabs-section[b-fyzg22kdgg]  .zimam-tabs {
    margin-inline: 0;
    padding-inline: 1.5rem;
    direction: rtl;
    border-bottom: 1px solid var(--color-border);
}

.task-tabs-section[b-fyzg22kdgg]  .zimam-tab {
    font-size: var(--text-md, 0.875rem);
}

.task-tab-panel[b-fyzg22kdgg] {
    padding: 1rem 1.5rem 1.25rem;
}

/* Subtasks card shell */
.task-subtasks-card[b-fyzg22kdgg] {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl, 1rem);
    background: var(--color-surface);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.task-tab-card[b-fyzg22kdgg] {
    padding: 0;
    overflow: hidden;
    margin-bottom: 0;
}

.task-tab-card__body[b-fyzg22kdgg] {
    padding: 1rem 1.125rem 1.125rem;
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-list {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-list-items {
    padding: 0;
    gap: 0;
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-item {
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--color-border-light, #f1f5f9);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-checkbox {
    width: 1.375rem;
    height: 1.375rem;
    border-radius: var(--radius-md, 0.5rem);
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-checkbox:hover {
    border-color: var(--color-border-hover);
    background: var(--color-bg);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-checkbox--checked,
.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-checkbox--checked:hover {
    background: var(--color-text-strong);
    border-color: var(--color-text-strong);
    color: var(--color-surface);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-title {
    font-size: var(--text-md, 0.875rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-item--done .subtask-title {
    color: var(--color-text-muted);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-delete {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: var(--radius-md, 0.5rem);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-see-more {
    margin-top: 0.75rem;
    color: var(--color-text-secondary);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-row {
    padding: 1rem 0 0;
    margin-top: 0.75rem;
    border-block-start: 1px solid var(--color-border-light, #f1f5f9);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-input {
    min-height: 2.5rem;
    border-radius: var(--radius-md, 0.5rem);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-input:focus {
    border-color: var(--color-text-strong);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-confirm {
    background: var(--color-text-strong);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-confirm:hover:not(:disabled) {
    background: var(--color-text);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-cancel:hover {
    background: var(--color-bg-subtle);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-footer {
    justify-content: flex-start;
    padding: 1rem 0 0;
    margin-top: 0.75rem;
    border-block-start: 1px solid var(--color-border-light, #f1f5f9);
}

.task-tab-card--subtasks[b-fyzg22kdgg]  .subtask-add-btn {
    color: var(--color-text-strong);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-attachments {
    gap: 1rem;
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-status {
    margin: 0;
    padding: 1.25rem;
    border: 1px dashed var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
    text-align: center;
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-attachments-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.875rem;
    max-height: none;
    overflow: visible;
    padding-inline-end: 0;
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-file-card {
    border-color: var(--color-border);
    border-radius: var(--radius-md, 0.5rem);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-file-card:hover {
    border-color: var(--color-border-hover);
    background: var(--color-bg-subtle);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-file-icon {
    background: var(--color-bg-subtle);
    color: var(--color-text-secondary);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-file-meta {
    color: var(--color-text-muted);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-area {
    margin-top: 0;
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-dropzone {
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-dropzone:hover {
    border-color: var(--color-text-strong);
    background: var(--color-bg);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-label-icon {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-icon,
.task-tab-card--attachments[b-fyzg22kdgg]  .zimam-drawer-upload-label-title {
    color: var(--color-text-strong);
}

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

@media (max-width: 680px) {
    .task-bento-grid[b-fyzg22kdgg] {
        grid-template-columns: 1fr;
        padding: 0;
    }

    .task-health-grid[b-fyzg22kdgg] {
        grid-template-columns: 1fr;
        gap: 0.875rem;
    }

    .task-health-col--bordered[b-fyzg22kdgg] {
        padding-inline-start: 0;
        border-inline-start: none;
        padding-top: 0.875rem;
        border-top: 1px solid var(--color-border);
    }

    .task-people-grid[b-fyzg22kdgg] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Error.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   Error + Route State Surfaces
   Lightweight semantic styling for error and fallback pages.
   ═══════════════════════════════════════════════════════ */

.zimam-error-page[b-b6irdol65n] {
    max-width: 48rem;
    margin: 0 auto;
}

.zimam-error-page__card[b-b6irdol65n] {
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-card-lg);
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
}

.zimam-error-page__layout[b-b6irdol65n] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.zimam-error-page__icon-wrap[b-b6irdol65n] {
    width: 2.5rem;
    height: 2.5rem;
    display: grid;
    place-items: center;
    border-radius: var(--radius-lg);
    background: var(--color-error-bg);
    color: var(--color-error-text);
    border: 1px solid var(--color-error-border);
    flex-shrink: 0;
}

.zimam-error-page__icon[b-b6irdol65n] {
    width: 1.25rem;
    height: 1.25rem;
}

.zimam-error-page__content[b-b6irdol65n] {
    min-width: 0;
}

.zimam-error-page__title[b-b6irdol65n] {
    font-size: 1.125rem;
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
}

.zimam-error-page__message[b-b6irdol65n] {
    margin-top: 0.25rem;
    color: var(--color-text-muted);
}

.zimam-error-page__action[b-b6irdol65n] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1rem;
    height: 2.5rem;
    padding-inline: 1rem;
    border-radius: var(--radius-lg);
    background: var(--color-text-strong);
    color: var(--color-surface);
    text-decoration: none;
    transition: background-color var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default);
}

.zimam-error-page__action:hover[b-b6irdol65n] {
    background: #1f2937;
}

.zimam-error-page__action:focus-visible[b-b6irdol65n] {
    outline: 2px solid var(--color-text-strong);
    outline-offset: 2px;
}

/* /Pages/Home.razor.rz.scp.css */
/* ==========================================================================
   Dashboard — Main landing page (لوحة المعلومات)
   Inspiration-based layout: Welcome → Quick Actions → Task Lists → Timeline
   Scoped to Home.razor via Blazor CSS isolation
   ========================================================================== */

/* ── Page shell ── */
.zimam-dashboard[b-c98aq8n7c7] {
    width: 100%;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1;
}

.zimam-dashboard__content[b-c98aq8n7c7] {
    padding-inline: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 1.5rem;
    gap: 1.5rem;
}

.zimam-dashboard__alert[b-c98aq8n7c7] {
    padding: 0.875rem 1rem;
    border: 1px solid var(--color-error-border);
    border-radius: var(--radius-lg);
    background: var(--color-error-bg);
    color: var(--color-error-text);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
}

/* ── Module header (same pattern as CaseManagement) ── */
.zimam-module-header[b-c98aq8n7c7] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 0 12px 0;
    margin-bottom: 0;
    position: relative;
    gap: 1rem;
}

.zimam-module-header[b-c98aq8n7c7]::after {
    content: '';
    position: absolute;
    bottom: 0;
    inset-inline: -24px;
    height: 1px;
    background: var(--color-border);
}

.zimam-module-header__text[b-c98aq8n7c7] {
    flex: 1;
}

.zimam-module-header__title[b-c98aq8n7c7] {
    font-size: 24px;
    font-weight: 800;
    color: var(--color-text-strong);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin-top: 0;
    margin-bottom: 1px;
}

.zimam-module-header__subtitle[b-c98aq8n7c7] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    margin-top: 0;
    margin-bottom: 1px;
    max-width: 38rem;
    line-height: 1.5;
}

/* ==========================================================================
   Quick Actions — 4-column card grid
   ========================================================================== */
.zimam-quick-actions[b-c98aq8n7c7] {
    display: block;
}

.zimam-quick-actions__grid[b-c98aq8n7c7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.75rem;
}

@media (max-width: 1024px) {
    .zimam-quick-actions__grid[b-c98aq8n7c7] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .zimam-quick-actions__grid[b-c98aq8n7c7] {
        grid-template-columns: 1fr;
    }
}

.zimam-quick-action[b-c98aq8n7c7] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    width: 100%;
    padding: 1rem 1.25rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    text-decoration: none;
    color: inherit;
    font: inherit;
    text-align: start;
    cursor: pointer;
    transition: transform var(--duration-fast) var(--ease-default),
                box-shadow var(--duration-fast) var(--ease-default),
                border-color var(--duration-fast) var(--ease-default);
}

.zimam-quick-action:hover[b-c98aq8n7c7] {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07);
    border-color: #cbd5e1;
}

.zimam-quick-action:focus-visible[b-c98aq8n7c7] {
    outline: 2px solid #bfdbfe;
    outline-offset: 2px;
}

/* Icon circle with "+" badge overlay */
.zimam-quick-action__icon-wrap[b-c98aq8n7c7] {
    position: relative;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.zimam-quick-action__icon-wrap--blue[b-c98aq8n7c7] {
    background: #eff6ff;
    color: #2563eb;
}

.zimam-quick-action__icon-wrap--green[b-c98aq8n7c7] {
    background: #ecfdf5;
    color: #059669;
}

.zimam-quick-action__icon-wrap--purple[b-c98aq8n7c7] {
    background: #f5f3ff;
    color: #7c3aed;
}

.zimam-quick-action__icon-wrap--amber[b-c98aq8n7c7] {
    background: #fff7ed;
    color: #d97706;
}

.zimam-quick-action__badge[b-c98aq8n7c7] {
    position: absolute;
    top: -4px;
    inset-inline-end: -4px;
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 50%;
    background: var(--color-text-strong, #1e293b);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

.zimam-quick-action__text[b-c98aq8n7c7] {
    flex: 1;
    min-width: 0;
}

.zimam-quick-action__title[b-c98aq8n7c7] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin: 0 0 0.125rem;
}

.zimam-quick-action__subtitle[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==========================================================================
   Task Lists — 2-column grid of table cards
   ========================================================================== */
.zimam-dashboard-lists[b-c98aq8n7c7] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
}

@media (max-width: 768px) {
    .zimam-dashboard-lists[b-c98aq8n7c7] {
        grid-template-columns: 1fr;
    }
}

.zimam-list-card[b-c98aq8n7c7] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.zimam-list-card__header[b-c98aq8n7c7] {
    font-size: var(--text-md);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
    padding: 0.875rem 1.25rem 0.625rem;
}

.zimam-list-card__table-head[b-c98aq8n7c7] {
    display: grid;
    grid-template-columns: 1fr 7rem 7.5rem;
    gap: 0.5rem;
    padding: 0.375rem 1.25rem;
    background: #f8fafc;
    border-top: 1px solid var(--color-border-light, rgba(226, 232, 240, 0.6));
    border-bottom: 1px solid var(--color-border-light, rgba(226, 232, 240, 0.6));
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.zimam-list-card__col-name[b-c98aq8n7c7],
.zimam-list-card__col-project[b-c98aq8n7c7],
.zimam-list-card__col-date[b-c98aq8n7c7] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-list-card__empty[b-c98aq8n7c7] {
    padding: 2rem 1.25rem;
    text-align: center;
    color: var(--color-text-faint);
    font-size: var(--text-sm);
}

/* ── Task row ── */
.zimam-list-row[b-c98aq8n7c7] {
    display: grid;
    grid-template-columns: 1fr 7rem 7.5rem;
    gap: 0.5rem;
    align-items: center;
    width: 100%;
    padding: 0.625rem 1.25rem;
    border: 0;
    border-bottom: 1px solid var(--color-border-light, rgba(226, 232, 240, 0.6));
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: start;
    transition: background var(--duration-fast) var(--ease-default);
    cursor: pointer;
}

.zimam-list-row:last-child[b-c98aq8n7c7] {
    border-bottom: none;
}

.zimam-list-row:hover[b-c98aq8n7c7] {
    background: rgba(248, 250, 252, 0.8);
}

.zimam-list-row:focus-visible[b-c98aq8n7c7] {
    outline: 2px solid #bfdbfe;
    outline-offset: -2px;
}

.zimam-list-row__name[b-c98aq8n7c7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.zimam-list-row__check[b-c98aq8n7c7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    background: #ecfdf5;
    color: #059669;
    flex-shrink: 0;
}

.zimam-list-row__title[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-list-row__flag[b-c98aq8n7c7] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.zimam-list-row__flag--blue[b-c98aq8n7c7] { color: #2563eb; }
.zimam-list-row__flag--gray[b-c98aq8n7c7] { color: #94a3b8; }
.zimam-list-row__flag--red[b-c98aq8n7c7] { color: #dc2626; }
.zimam-list-row__flag--orange[b-c98aq8n7c7] { color: #ea580c; }

.zimam-list-row__name .zimam-pill[b-c98aq8n7c7] {
    flex-shrink: 0;
}

.zimam-list-row__project[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-list-row__date[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    white-space: nowrap;
}

.zimam-list-row__add-date[b-c98aq8n7c7] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--color-text-faint);
    font-size: var(--text-sm);
}

/* ==========================================================================
   Activity Timeline — Full-width section with connected dots
   ========================================================================== */
.zimam-activity[b-c98aq8n7c7] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.zimam-activity__header[b-c98aq8n7c7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1.25rem 0.625rem;
    border-bottom: 1px solid var(--color-border-light, rgba(226, 232, 240, 0.6));
}

.zimam-activity__title[b-c98aq8n7c7] {
    font-size: var(--text-md);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    margin: 0;
}

.zimam-activity__view-all[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-sm);
    transition: background var(--duration-fast) var(--ease-default);
}

.zimam-activity__view-all:hover[b-c98aq8n7c7] {
    background: #f1f5f9;
    color: var(--color-text-strong);
}

.zimam-activity__timeline[b-c98aq8n7c7] {
    padding: 1rem 1.25rem;
}

/* ── Activity item with timeline connector ── */
.zimam-activity-item[b-c98aq8n7c7] {
    display: flex;
    gap: 0.875rem;
    min-height: 0;
}

.zimam-activity-item__dot-col[b-c98aq8n7c7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    width: 1.5rem;
}

.zimam-activity-item__dot[b-c98aq8n7c7] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: #ecfdf5;
    color: #059669;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.zimam-activity-item__line[b-c98aq8n7c7] {
    width: 2px;
    flex: 1;
    background: #e2e8f0;
    min-height: 1rem;
}

.zimam-activity-item__body[b-c98aq8n7c7] {
    flex: 1;
    min-width: 0;
    padding-bottom: 1.25rem;
}

.zimam-activity-item:last-child .zimam-activity-item__body[b-c98aq8n7c7] {
    padding-bottom: 0;
}

.zimam-activity-item__head[b-c98aq8n7c7] {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.zimam-activity-item__title[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

.zimam-activity-item__time[b-c98aq8n7c7] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
}

.zimam-activity-item__desc[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    margin: 0.375rem 0 0;
    line-height: 1.6;
}

.zimam-activity-item__user[b-c98aq8n7c7] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.5rem;
}

.zimam-activity-item__user-label[b-c98aq8n7c7] {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
}

.zimam-activity-item__avatar[b-c98aq8n7c7] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    object-fit: cover;
    flex-shrink: 0;
}

.zimam-activity-item__user-name[b-c98aq8n7c7] {
    font-size: var(--text-sm);
    color: var(--color-text-strong);
    font-weight: 500;
}

.zimam-dashboard-drawer-header[b-c98aq8n7c7] {
    position: relative;
    width: 100%;
}

.zimam-dashboard-drawer-header__close[b-c98aq8n7c7] {
    position: absolute;
    inset-block-start: 0.875rem;
    inset-inline-end: 0.875rem;
    z-index: 1;
}
/* /SharedComponents/Controls/ActiveFilterBar.razor.rz.scp.css */
.zimam-filter-bar[b-fuq8vno28u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-block: 0.5rem;
    flex-wrap: wrap;
}

.zimam-filter-bar__chips[b-fuq8vno28u] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.zimam-filter-bar__clear[b-fuq8vno28u] {
    background: none;
    border: none;
    color: var(--color-danger, #dc2626);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    white-space: nowrap;
    transition: color var(--duration-fast, 150ms) ease, background var(--duration-fast, 150ms) ease;
    flex-shrink: 0;
}

.zimam-filter-bar__clear:hover[b-fuq8vno28u] {
    color: var(--color-danger-hover, #b91c1c);
    background: var(--color-danger-surface, #fef2f2);
}

.zimam-filter-bar__clear:focus-visible[b-fuq8vno28u] {
    outline: var(--focus-ring, 2px solid #3b82f6);
    outline-offset: var(--focus-offset, 1px);
}
/* /SharedComponents/Controls/ActiveFilterChip.razor.rz.scp.css */
.zimam-filter-chip[b-0p66alb51c] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    height: 1.75rem;
    padding-inline: 0.5rem 0.25rem;
    background: var(--color-surface-secondary, #f1f5f9);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    line-height: 1;
    color: var(--color-text-secondary, #475569);
    white-space: nowrap;
    transition: background var(--duration-fast, 150ms) ease;
}

.zimam-filter-chip__icon[b-0p66alb51c] {
    color: var(--color-text-muted, #94a3b8);
    flex-shrink: 0;
}

.zimam-filter-chip__label[b-0p66alb51c] {
    font-weight: 500;
    color: var(--color-text-secondary, #475569);
}

.zimam-filter-chip__value[b-0p66alb51c] {
    color: var(--color-text-strong, #0f172a);
    font-weight: 600;
}

.zimam-filter-chip__dismiss[b-0p66alb51c] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--color-text-muted, #94a3b8);
    cursor: pointer;
    transition: background var(--duration-fast, 150ms) ease, color var(--duration-fast, 150ms) ease;
    flex-shrink: 0;
}

.zimam-filter-chip__dismiss:hover[b-0p66alb51c] {
    background: var(--color-surface-hover, #e2e8f0);
    color: var(--color-text-strong, #0f172a);
}

.zimam-filter-chip__dismiss:focus-visible[b-0p66alb51c] {
    outline: var(--focus-ring, 2px solid #3b82f6);
    outline-offset: var(--focus-offset, 1px);
}
/* /SharedComponents/Controls/SavedViewBar.razor.rz.scp.css */
.zimam-saved-views[b-nswq4l0qc0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.zimam-saved-views__item[b-nswq4l0qc0] {
    display: inline-flex;
    align-items: center;
    gap: 0;
    height: 2rem;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    background: var(--color-surface, #fff);
    overflow: hidden;
    transition: border-color var(--duration-fast, 150ms) ease, box-shadow var(--duration-fast, 150ms) ease;
}

.zimam-saved-views__item:hover[b-nswq4l0qc0] {
    border-color: var(--color-border-hover, #cbd5e1);
}

.zimam-saved-views__item--active[b-nswq4l0qc0] {
    border-color: var(--color-primary, #3b82f6);
    background: var(--color-primary-surface, #eff6ff);
    box-shadow: 0 0 0 1px var(--color-primary, #3b82f6);
}

.zimam-saved-views__btn[b-nswq4l0qc0] {
    display: inline-flex;
    align-items: center;
    height: 100%;
    padding-inline: 0.625rem;
    border: none;
    background: transparent;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-secondary, #475569);
    cursor: pointer;
    white-space: nowrap;
    transition: color var(--duration-fast, 150ms) ease;
}

.zimam-saved-views__item--active .zimam-saved-views__btn[b-nswq4l0qc0] {
    color: var(--color-primary, #3b82f6);
    font-weight: 600;
}

.zimam-saved-views__btn:hover[b-nswq4l0qc0] {
    color: var(--color-text-strong, #0f172a);
}

.zimam-saved-views__delete[b-nswq4l0qc0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 100%;
    padding: 0;
    border: none;
    border-inline-start: 1px solid var(--color-border, #e2e8f0);
    background: transparent;
    color: var(--color-text-muted, #94a3b8);
    cursor: pointer;
    transition: background var(--duration-fast, 150ms) ease, color var(--duration-fast, 150ms) ease;
}

.zimam-saved-views__delete:hover[b-nswq4l0qc0] {
    background: var(--color-danger-surface, #fef2f2);
    color: var(--color-danger, #dc2626);
}

.zimam-saved-views__save-btn[b-nswq4l0qc0] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    height: 2rem;
    padding-inline: 0.625rem;
    border: 1px dashed var(--color-border, #e2e8f0);
    border-radius: 0.5rem;
    background: transparent;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-muted, #94a3b8);
    cursor: pointer;
    white-space: nowrap;
    transition: border-color var(--duration-fast, 150ms) ease, color var(--duration-fast, 150ms) ease, background var(--duration-fast, 150ms) ease;
}

.zimam-saved-views__save-btn:hover[b-nswq4l0qc0] {
    border-color: var(--color-primary, #3b82f6);
    color: var(--color-primary, #3b82f6);
    background: var(--color-primary-surface, #eff6ff);
}

.zimam-saved-views__save-btn:focus-visible[b-nswq4l0qc0] {
    outline: var(--focus-ring, 2px solid #3b82f6);
    outline-offset: var(--focus-offset, 1px);
}
/* /SharedComponents/Controls/ViewSwitcher.razor.rz.scp.css */
.zimam-view-switcher[b-wxeo1mkh3l] {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: var(--color-surface);
    height: 2.5rem;
}

.zimam-view-switcher__btn[b-wxeo1mkh3l] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 100%;
    border: none;
    background: none;
    color: var(--color-text-faint);
    cursor: pointer;
    transition: background-color 150ms, color 150ms;
    position: relative;
}

.zimam-view-switcher__btn:not(:last-child)[b-wxeo1mkh3l]::after {
    content: '';
    position: absolute;
    left: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background: var(--color-border);
}

.zimam-view-switcher__btn:hover[b-wxeo1mkh3l] {
    background: var(--color-bg-subtle);
    color: var(--color-text-muted);
}

.zimam-view-switcher__btn--active[b-wxeo1mkh3l] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-view-switcher__btn--active:hover[b-wxeo1mkh3l] {
    background: var(--color-text-strong);
    color: var(--color-surface);
}

.zimam-view-switcher__btn:focus-visible[b-wxeo1mkh3l] {
    outline: 2px solid var(--color-text-faint);
    outline-offset: -2px;
}
/* /SharedComponents/Display/SettingsCard.razor.rz.scp.css */
.zimam-settings-card[b-ra81stx0vz] {
    display: block;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    transition: transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out), border-color var(--duration-normal) var(--ease-out), background var(--duration-normal) var(--ease-out);
    text-decoration: none;
    height: 100%;
}

.zimam-settings-card:hover[b-ra81stx0vz] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-floating);
    border-color: var(--color-text-strong);
    background: var(--color-bg-subtle);
}

.zimam-settings-card__body[b-ra81stx0vz] {
    display: flex;
    align-items: flex-start;
    padding: 1.5rem;
    gap: 1.25rem;
}

.zimam-settings-card__content[b-ra81stx0vz] {
    flex: 1;
    min-width: 0;
}

.zimam-settings-card__title[b-ra81stx0vz] {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin-bottom: 0.5rem;
    line-height: var(--lh-tight);
}

.zimam-settings-card__description[b-ra81stx0vz] {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
}

.zimam-settings-card__icon-wrapper[b-ra81stx0vz] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-subtle);
    border-radius: var(--radius-md);
    color: var(--color-text-muted);
    transition: background var(--duration-normal) var(--ease-out), color var(--duration-normal) var(--ease-out);
}

.zimam-settings-card:hover .zimam-settings-card__icon-wrapper[b-ra81stx0vz] {
    background: var(--color-bg);
    color: var(--color-text-strong);
}

.zimam-settings-card__icon-wrapper[b-ra81stx0vz]  .zimam-settings-card__icon {
    display: block;
}
/* /SharedComponents/EntityDrawer/BaseDrawer.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   ZIMAM Drawer System (Side-sheets)
   Standardized floating panels, metadata grids, tabs, and timelines.
   Refactored from legacy drawer.css and drawer-view.css.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ── Core Infrastructure: Scrim & Layout ── */

@keyframes zimam-drawer-in-b-wwcr13zbvs {
    from {
        transform: translateX(calc(-100% - 0.75rem));
    }

    to {
        transform: translateX(0);
    }
}

@keyframes zimam-drawer-out-b-wwcr13zbvs {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-100% - 0.75rem));
    }
}

@keyframes zimam-drawer-scrim-in-b-wwcr13zbvs {
    from {
        opacity: 0;
    }

    to {
        opacity: var(--task-scrim-opacity, 0.4);
    }
}

@keyframes zimam-drawer-scrim-out-b-wwcr13zbvs {
    from {
        opacity: var(--task-scrim-opacity, 0.4);
    }

    to {
        opacity: 0;
    }
}

.zimam-drawer-scrim[b-wwcr13zbvs] {
    position: fixed;
    inset: 0;
    background: var(--color-text-strong);
    z-index: var(--z-drawer-scrim, 100);
    opacity: 0;
    pointer-events: none;
}

.zimam-drawer-scrim--visible[b-wwcr13zbvs] {
    opacity: var(--task-scrim-opacity, 0.4);
    pointer-events: auto;
    animation: zimam-drawer-scrim-in-b-wwcr13zbvs var(--duration-normal) var(--ease-out) both;
}

.zimam-drawer-scrim--exiting[b-wwcr13zbvs] {
    animation: zimam-drawer-scrim-out-b-wwcr13zbvs var(--duration-normal) var(--ease-in) both;
}

.zimam-drawer-scrim--hidden[b-wwcr13zbvs] {
    display: none;
}

.zimam-drawer-scrim--visible[b-wwcr13zbvs],
.zimam-drawer-scrim--exiting[b-wwcr13zbvs] {
    will-change: opacity;
}

/* Base Panel */
.zimam-drawer-panel[b-wwcr13zbvs] {
    position: fixed;
    inset-block: 0.75rem;
    left: 0.75rem;
    /* Forces left position even in RTL */
    width: min(600px, calc(100vw - 1.5rem));
    max-width: 100%;
    background: var(--color-surface);
    border-radius: var(--radius-card-lg, 1rem);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-floating);
    z-index: var(--z-drawer, 110);
    display: flex;
    flex-direction: column;
    transform: translateX(calc(-100% - 0.75rem));
    overflow: hidden;
    contain: layout;
}

.zimam-drawer-panel--visible[b-wwcr13zbvs] {
    transform: translateX(0);
    animation: zimam-drawer-in-b-wwcr13zbvs var(--duration-normal) var(--ease-out) both;
}

.zimam-drawer-panel--exiting[b-wwcr13zbvs] {
    animation: zimam-drawer-out-b-wwcr13zbvs var(--duration-normal) var(--ease-in) both;
}

.zimam-drawer-panel--hidden[b-wwcr13zbvs] {
    display: none;
}

.zimam-drawer-panel--visible[b-wwcr13zbvs],
.zimam-drawer-panel--exiting[b-wwcr13zbvs] {
    will-change: transform;
}

/* Secondary drawers use the exact primary panel shell; this class only stacks them above. */
.zimam-drawer-secondary[b-wwcr13zbvs] {
    z-index: var(--z-drawer-stacked, 120);
}

/* Use when a drawer is rendered inside an already transformed drawer panel.
   The transformed ancestor becomes the fixed-position containing block, so
   the nested drawer must cover that panel instead of adding the default inset. */
.zimam-drawer-panel--nested-cover[b-wwcr13zbvs] {
    inset-block: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
}

@media (prefers-reduced-motion: reduce) {
    .zimam-drawer-scrim--visible[b-wwcr13zbvs],
    .zimam-drawer-scrim--exiting[b-wwcr13zbvs],
    .zimam-drawer-panel--visible[b-wwcr13zbvs],
    .zimam-drawer-panel--exiting[b-wwcr13zbvs] {
        animation: none;
    }
}

/* ── Panel Components ── */

.zimam-drawer-header[b-wwcr13zbvs] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    padding: 0.875rem 1.25rem;
    gap: 0;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-surface);
}

/* Rich tabbed drawers flush tabs to the very top of the panel. */
.zimam-drawer-header:has(.zimam-drawer-rich-header--task)[b-wwcr13zbvs],
.zimam-drawer-header:has(.zimam-drawer-rich-header--case)[b-wwcr13zbvs] {
    padding-block-start: 0;
}

.zimam-drawer-header-row[b-wwcr13zbvs] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    order: 1;
}

[b-wwcr13zbvs] .zimam-drawer-sub-header {
    order: 2;
}

[b-wwcr13zbvs] .zimam-drawer-title {
    font-size: var(--text-lg, 1.125rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong);
}

[b-wwcr13zbvs] .zimam-drawer-header__content,
[b-wwcr13zbvs] .zimam-drawer-header__group,
[b-wwcr13zbvs] .zimam-drawer-header__actions {
    display: flex;
    align-items: center;
}

[b-wwcr13zbvs] .zimam-drawer-header__content {
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
}

[b-wwcr13zbvs] .zimam-drawer-header__group {
    gap: 0.5rem;
    min-width: 0;
}

[b-wwcr13zbvs] .zimam-drawer-header__group--spacious {
    gap: 0.75rem;
}

[b-wwcr13zbvs] .zimam-drawer-header__group--muted {
    color: var(--color-text-secondary);
}

[b-wwcr13zbvs] .zimam-drawer-header__actions {
    gap: 0.25rem;
}

[b-wwcr13zbvs] .zimam-drawer-header__icon {
    flex-shrink: 0;
    color: var(--color-text-faint);
}

[b-wwcr13zbvs] .zimam-drawer-header__icon--muted {
    color: var(--color-text-secondary);
}

[b-wwcr13zbvs] .zimam-drawer-header__icon--accent {
    color: var(--color-primary);
}

[b-wwcr13zbvs] .zimam-drawer-header__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-header__action:hover {
    background: var(--color-bg);
}

[b-wwcr13zbvs] .zimam-drawer-header__action--danger {
    color: var(--color-error-text);
}

[b-wwcr13zbvs] .zimam-drawer-header__action--danger:hover {
    background: var(--color-error-bg);
}

[b-wwcr13zbvs] .zimam-drawer-header__divider {
    width: 1px;
    height: 1rem;
    background: var(--color-border-light);
    margin-inline: 0.125rem;
}

[b-wwcr13zbvs] .zimam-drawer-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    color: var(--color-text-faint);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background var(--duration-fast), color var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-close:hover {
    background: var(--color-bg);
    color: var(--color-text-secondary);
}

[b-wwcr13zbvs] .zimam-drawer-rich-header {
    --zimam-drawer-rich-progress: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin: -0.875rem -1.25rem 0;
    padding: 1.25rem 1.25rem 0;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__decor {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    padding: 0.5rem;
    color: var(--color-border-light);
    transform: rotate(12deg) translateY(-1rem) translateX(-2rem);
    pointer-events: none;
    z-index: 0;
    opacity: 0.6;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 0.5rem;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__badge-row {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__badge {
    display: inline-flex;
    align-items: center;
    padding: 0.125rem 0.625rem;
    font-size: var(--text-xs);
    font-weight: var(--fw-semibold);
    color: var(--color-text-secondary);
    background: var(--color-bg);
    border-radius: var(--radius-pill);
    letter-spacing: 0.02em;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__sep {
    color: var(--color-text-faint);
    font-size: var(--text-xs);
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__step {
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    white-space: nowrap;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__title {
    margin: 0;
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    color: var(--color-text-strong);
    line-height: var(--lh-tight);
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__desc {
    margin: 0;
    font-size: var(--text-sm);
    color: var(--color-text-muted);
    line-height: var(--lh-normal);
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__progress-track {
    width: calc(100% + 2.5rem);
    margin-inline: -1.25rem;
    margin-top: 0.5rem;
    height: 3px;
    background: var(--color-border-light);
    position: relative;
    z-index: 1;
}

[b-wwcr13zbvs] .zimam-drawer-rich-header__progress-fill {
    height: 100%;
    width: var(--zimam-drawer-rich-progress);
    background: var(--color-text-strong);
    border-radius: 2px;
    transition: width var(--duration-slow) var(--ease-out);
}

.zimam-drawer-body[b-wwcr13zbvs] {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    /*
     * Universal drawer body padding so every consumer gets sensible spacing
     * without needing a bespoke wrapper. Override per-drawer with
     * `.zimam-drawer-body--bleed` (or by negating with margin) if you need
     * edge-to-edge content (banners, full-width media).
     */
    padding: 1.5rem;
    background: var(--color-surface);
}

.zimam-drawer-secondary:has(.zimam-session-secondary__rich-header) .zimam-drawer-body[b-wwcr13zbvs] {
    padding-block-start: 0.75rem;
}

/* Edge-to-edge drawer body for banner/hero content. Apply to the panel via
   AdditionalClass="zimam-drawer-panel--bleed" or directly to the outer body. */
.zimam-drawer-body--bleed[b-wwcr13zbvs],
.zimam-drawer-panel--bleed > .zimam-drawer-body[b-wwcr13zbvs] {
    padding: 0;
}

/* Scrollable Container inside Body. Padding now lives on the outer
   `.zimam-drawer-body`, so this wrapper only handles flow + sizing. */
[b-wwcr13zbvs] .zimam-drawer-body-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    padding: 0;
    box-sizing: border-box;
}

/* Drawer-safe form containment */
[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-field,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-input,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-select,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-grid-2,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-grid-2 > *,
[b-wwcr13zbvs] .zimam-drawer-body .date-picker-wrapper,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-datepicker-field,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-datepicker-input {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

[b-wwcr13zbvs] .zimam-drawer-body .zimam-form-grid-2,
[b-wwcr13zbvs] .zimam-drawer-body .date-picker-wrapper,
[b-wwcr13zbvs] .zimam-drawer-body .zimam-datepicker-field {
    width: 100%;
}

/* Shared responsive form layout for drawer edit/create forms. */
[b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form {
    container-type: inline-size;
}

[b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form .zimam-form-fieldset {
    gap: 0.875rem;
}

[b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form .zimam-form-field {
    margin-block-end: 0;
}

[b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form .zimam-form-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

[b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form textarea.zimam-form-input {
    min-height: 76px;
    max-height: 140px;
}

@container (max-width: 560px) {
    [b-wwcr13zbvs] .zimam-drawer-body .zimam-drawer-form .zimam-form-grid-2 {
        grid-template-columns: 1fr;
    }
}

.zimam-drawer-footer[b-wwcr13zbvs] {
    flex-shrink: 0;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--color-border-light);
    background: var(--color-bg-subtle);
    display: flex;
    gap: 0.75rem;
}

/* Rich tabbed drawers: standardized horizontal padding so content aligns across header, footer, and tab panels. */
.zimam-drawer-panel:has(.zimam-drawer-rich-header--task) .zimam-drawer-header[b-wwcr13zbvs],
.zimam-drawer-panel:has(.zimam-drawer-rich-header--task) .zimam-drawer-footer[b-wwcr13zbvs],
.zimam-drawer-panel:has(.zimam-drawer-rich-header--case) .zimam-drawer-header[b-wwcr13zbvs],
.zimam-drawer-panel:has(.zimam-drawer-rich-header--case) .zimam-drawer-footer[b-wwcr13zbvs],
.zimam-drawer-secondary:has(.zimam-drawer-rich-header--case) .zimam-drawer-header[b-wwcr13zbvs],
.zimam-drawer-secondary:has(.zimam-drawer-rich-header--case) .zimam-drawer-footer[b-wwcr13zbvs] {
    padding-inline: 1.5rem;
}

/* Rich tabbed drawers used to add inline padding to `.zimam-drawer-body-content`,
   but the outer `.zimam-drawer-body` now provides 1.5rem padding universally so
   the alignment is automatic. Rule kept (empty) for documentation. */

/* ── Secondary Navigation ── */

[b-wwcr13zbvs] .zimam-drawer-back-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--color-text-secondary);
    padding: 0;
    cursor: pointer;
    transition: background var(--duration-fast), color var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-back-btn:hover {
    background: var(--color-bg-subtle);
    color: var(--color-text-strong);
}

/* ── View Mode: Metadata Grid ── */

[b-wwcr13zbvs] .zimam-drawer-meta {
    background: var(--color-bg-subtle);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    padding: 0.5rem 1rem;
}

[b-wwcr13zbvs] .zimam-drawer-meta-item {
    display: grid;
    grid-template-columns: 1.5rem 6.5rem 1fr;
    align-items: center;
    gap: 0.75rem;
    padding-block: 0.75rem;
    border-bottom: 1px solid var(--color-border-light);
}

[b-wwcr13zbvs] .zimam-drawer-meta-item:last-child {
    border-bottom: none;
}

[b-wwcr13zbvs] .zimam-drawer-meta-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-faint);
}

[b-wwcr13zbvs] .zimam-drawer-meta-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.625rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    border-radius: var(--radius-md);
    transition: transform var(--duration-fast), box-shadow var(--duration-fast);
    border: 1px solid transparent;
}

[b-wwcr13zbvs] .zimam-drawer-meta-link--case {
    color: var(--color-text-secondary);
    background: var(--color-bg);
    border-color: var(--color-border-light);
}

[b-wwcr13zbvs] .zimam-drawer-meta-link:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

/* ── Linked Tasks ── */
[b-wwcr13zbvs] .zimam-drawer-linked-tasks {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

[b-wwcr13zbvs] .zimam-drawer-loading,
[b-wwcr13zbvs] .zimam-drawer-status {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block: 1rem;
    text-align: center;
    color: var(--color-text-muted);
}

[b-wwcr13zbvs] .zimam-drawer-linked-task-card {
    display: grid;
    grid-template-columns: 2.25rem 1fr 1.5rem;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    transition: border-color var(--duration-fast), background var(--duration-fast), transform var(--duration-fast), box-shadow var(--duration-fast);
    cursor: pointer;
}

[b-wwcr13zbvs] .zimam-drawer-linked-task-card:hover {
    border-color: var(--color-border);
    background: var(--color-bg-subtle);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

/* ── Input Groups (for adding comments/activities) ── */
[b-wwcr13zbvs] .zimam-drawer-input-group {
    display: flex;
    gap: 0.5rem;
    padding-block-start: 1rem;
    margin-block-start: 1rem;
    border-top: 1px solid var(--color-border-light);
}

[b-wwcr13zbvs] .zimam-drawer-input-group .zimam-form-input {
    flex: 1;
}

[b-wwcr13zbvs] .zimam-drawer-tabs {
    gap: 0;
    margin-bottom: 0;
    padding-inline: 0;
}

[b-wwcr13zbvs] .zimam-drawer-tab {
    padding: 0.75rem 1rem;
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    color: var(--color-text-faint);
    border-bottom: 2px solid transparent;
    transition: color var(--duration-fast), border-bottom-color var(--duration-fast);
    margin-block-end: -1.5px;
}

[b-wwcr13zbvs] .zimam-drawer-tab:hover {
    color: var(--color-text);
}

[b-wwcr13zbvs] .zimam-drawer-tab--active {
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
    font-weight: var(--fw-semibold);
}

/* ── Avatars ── */
[b-wwcr13zbvs] .zimam-drawer-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    color: #fff;
    flex-shrink: 0;
}

[b-wwcr13zbvs] .zimam-drawer-avatar--sm {
    width: 1.75rem;
    height: 1.75rem;
}

/* ── Description Box ── */
[b-wwcr13zbvs] .zimam-drawer-description {
    background: var(--color-bg-subtle);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border-light);
    padding: 1rem 1.25rem;
}

[b-wwcr13zbvs] .zimam-drawer-description-title {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    margin-block-end: 0.375rem;
}

[b-wwcr13zbvs] .zimam-drawer-description-text {
    font-size: var(--text-md);
    color: var(--color-text-secondary);
    line-height: var(--lh-relaxed);
}

/* ── Activity & Timeline ── */
[b-wwcr13zbvs] .zimam-drawer-timeline {
    display: flex;
    flex-direction: column;
}

[b-wwcr13zbvs] .zimam-drawer-event {
    display: grid;
    grid-template-columns: 2.5rem 1fr;
    gap: 0.75rem;
    padding-block: 0.75rem;
    position: relative;
}

[b-wwcr13zbvs] .zimam-drawer-event::before {
    content: "";
    position: absolute;
    inset-block-start: 2.75rem;
    inset-inline-start: 1.25rem;
    inset-block-end: -0.5rem;
    width: 0;
    border-inline-start: 1px dashed var(--color-border);
}

[b-wwcr13zbvs] .zimam-drawer-event:last-child::before {
    display: none;
}

[b-wwcr13zbvs] .zimam-drawer-event-text {
    font-size: var(--text-md);
    color: var(--color-text-secondary);
    line-height: var(--lh-normal);
}

[b-wwcr13zbvs] .zimam-drawer-event-author {
    color: var(--color-text-strong);
}

[b-wwcr13zbvs] .zimam-drawer-event-time {
    font-size: var(--text-sm);
    color: var(--color-text-faint);
    margin-block-start: 0.125rem;
}

[b-wwcr13zbvs] .zimam-drawer-meta-label {
    padding-block: 0.5rem;
    margin-block-end: 0.5rem;
    border-bottom: 1px solid var(--color-border-light);
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-secondary);
}

[b-wwcr13zbvs] .zimam-drawer-meta-value {
    font-size: var(--text-sm);
    color: var(--color-text);
    min-width: 0;
}

/* ── Comments ── */
[b-wwcr13zbvs] .zimam-drawer-comment {
    padding-block: 0.75rem;
    border-bottom: 1px solid var(--color-border-light);
}

[b-wwcr13zbvs] .zimam-drawer-comment:last-child {
    border-bottom: none;
}

[b-wwcr13zbvs] .zimam-drawer-comment-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-block-end: 0.375rem;
}

[b-wwcr13zbvs] .zimam-drawer-comment-author {
    font-size: var(--text-md);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

[b-wwcr13zbvs] .zimam-drawer-comment-time {
    font-size: var(--text-sm);
    color: var(--color-text-faint);
    margin-inline-start: auto;
}

[b-wwcr13zbvs] .zimam-drawer-comment-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-error-border);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: color var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-comment-delete:hover {
    color: var(--color-error-text);
}

[b-wwcr13zbvs] .zimam-drawer-comment-content {
    font-size: var(--text-md);
    color: var(--color-text);
    line-height: var(--lh-relaxed);
    padding-inline-start: 2.5rem;
}

/* ── File Attachments ── */
[b-wwcr13zbvs] .zimam-drawer-attachments {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[b-wwcr13zbvs] .zimam-drawer-attachments-list {
    max-height: 20rem;
    overflow-y: auto;
    padding-inline-end: 0.5rem;
}

/* Upload Area */
[b-wwcr13zbvs] .zimam-drawer-upload-area {
    margin-block-start: 0.5rem;
}

[b-wwcr13zbvs] .zimam-drawer-upload-error {
    margin-block-end: 0.75rem;
}

[b-wwcr13zbvs] .zimam-drawer-upload-dropzone {
    padding: 1.25rem;
    border: 2px dashed var(--color-border);
    border-radius: var(--radius-lg);
    background-color: var(--color-surface);
    transition: border-color var(--duration-normal), background-color var(--duration-normal);
    text-align: center;
}

[b-wwcr13zbvs] .zimam-drawer-upload-dropzone:hover {
    border-color: var(--color-text-strong);
    background-color: var(--color-bg-subtle);
}

[b-wwcr13zbvs] .zimam-drawer-upload-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: var(--color-text-secondary);
}

[b-wwcr13zbvs] .zimam-drawer-upload-label-icon {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: var(--color-bg);
    margin-block-end: 0.25rem;
}

[b-wwcr13zbvs] .zimam-drawer-upload-label-title {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
}

[b-wwcr13zbvs] .zimam-drawer-upload-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

[b-wwcr13zbvs] .zimam-drawer-upload-hint {
    margin-block-start: 0.75rem;
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    line-height: var(--lh-normal);
}

[b-wwcr13zbvs] .zimam-drawer-upload-hint-detail {
    margin-block-start: 0.25rem;
}

[b-wwcr13zbvs] .zimam-drawer-upload-progress {
    padding: 1.5rem;
    text-align: center;
    color: var(--color-text-secondary);
    background: var(--color-bg-subtle);
    border-radius: var(--radius-lg);
}

[b-wwcr13zbvs] .zimam-drawer-upload-progress-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

[b-wwcr13zbvs] .zimam-drawer-upload-avatar {
    background: var(--color-bg);
    border: 1px solid var(--color-border-light);
    color: var(--color-text-faint);
}

[b-wwcr13zbvs] .zimam-drawer-upload-icon {
    color: var(--color-text-faint);
}

[b-wwcr13zbvs] .zimam-drawer-upload-status {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text);
}

[b-wwcr13zbvs] .zimam-drawer-file-card {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-surface);
    transition: border-color var(--duration-fast), background var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-file-icon {
    width: 2.25rem;
    height: 2.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-subtle);
    border-radius: var(--radius-md);
    color: var(--color-text-faint);
    flex-shrink: 0;
}

[b-wwcr13zbvs] .zimam-drawer-file-info {
    flex: 1;
    min-width: 0;
}

[b-wwcr13zbvs] .zimam-drawer-file-name {
    font-size: var(--text-sm);
    font-weight: var(--fw-semibold);
    color: var(--color-text-strong);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

[b-wwcr13zbvs] .zimam-drawer-file-meta {
    font-size: var(--text-xs);
    color: var(--color-text-faint);
    margin-block-start: 1px;
}

[b-wwcr13zbvs] .zimam-drawer-file-delete {
    width: 1.75rem;
    height: 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    color: var(--color-text-faint);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: background var(--duration-fast), color var(--duration-fast);
}

[b-wwcr13zbvs] .zimam-drawer-file-delete:hover {
    background: var(--color-error-bg);
    color: var(--color-error-text);
}

/* ── Buttons (Specific to Drawers) ── */

[b-wwcr13zbvs] .zimam-drawer-btn {
    height: 2.375rem;
    padding-inline: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    font-size: var(--text-md);
    font-weight: var(--fw-medium);
    background: none;
    border: none;
    transition: background var(--duration-fast), color var(--duration-fast), border-color var(--duration-fast);
    cursor: pointer;
}

[b-wwcr13zbvs] .zimam-drawer-btn--primary {
    background: var(--color-text-strong);
    color: #fff;
    border: none;
}

[b-wwcr13zbvs] .zimam-drawer-btn--secondary {
    background: var(--color-surface);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

[b-wwcr13zbvs] .zimam-drawer-btn--secondary:hover:not(:disabled) {
    background: var(--color-bg-subtle);
    border-color: var(--color-border-hover);
}

[b-wwcr13zbvs] .zimam-drawer-btn__icon {
    display: inline-flex;
    align-items: center;
    margin-inline-end: 0.375rem;
}








/* /SharedComponents/EntityDrawer/DrawerActivityTimeline.razor.rz.scp.css */
/* ==========================================================================
   DrawerActivityTimeline — Vertical timeline (inspiration design)
   Scoped to DrawerActivityTimeline.razor via Blazor CSS isolation
   ========================================================================== */

/* Timeline container */
.zimam-drawer-timeline[b-rw9x2kwaaw] {
    position: relative;
    padding-inline-start: 0.75rem;
    margin-inline-start: 0.75rem;
    border-inline-start: 2px solid var(--color-border-light, #f1f5f9);
}

/* Date group label */
[b-rw9x2kwaaw] .zimam-drawer-meta-label {
    font-size: 0.75rem;
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-secondary, #64748b);
    padding-block: 0.5rem;
    margin-inline-start: 0.75rem;
}

/* Individual event */
[b-rw9x2kwaaw] .zimam-drawer-event {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0 0.75rem 0.75rem;
}

/* Timeline dot */
[b-rw9x2kwaaw] .zimam-drawer-event::before {
    content: '';
    position: absolute;
    inset-inline-start: calc(-0.75rem - 7px);
    top: 1.125rem;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 9999px;
    background: var(--color-border, #e2e8f0);
    border: 2px solid var(--color-surface, #fff);
    z-index: 1;
}

/* Avatar */
[b-rw9x2kwaaw] .zimam-drawer-avatar {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 9999px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--color-bg, #e2e8f0);
}

/* Event text */
[b-rw9x2kwaaw] .zimam-drawer-event-text {
    font-size: var(--text-sm, 0.8125rem);
    color: var(--color-text-secondary, #64748b);
    line-height: var(--lh-normal, 1.5);
}

[b-rw9x2kwaaw] .zimam-drawer-event-author {
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong, #0f172a);
}

/* Timestamp */
[b-rw9x2kwaaw] .zimam-drawer-event-time {
    font-size: 0.75rem;
    color: var(--color-text-faint, #94a3b8);
    margin-top: 0.125rem;
}

/* ── Input Area ── */

[b-rw9x2kwaaw] .zimam-drawer-input-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 0 0.75rem 0.75rem;
    margin-top: 0.5rem;
}

[b-rw9x2kwaaw] .zimam-drawer-input-group .zimam-form-input {
    flex: 1;
    font-size: var(--text-sm, 0.8125rem);
}

[b-rw9x2kwaaw] .zimam-drawer-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-medium, 500);
    border-radius: var(--radius-md, 0.375rem);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    border: none;
}

[b-rw9x2kwaaw] .zimam-drawer-btn--primary {
    background: var(--color-primary, #2563eb);
    color: #fff;
}

[b-rw9x2kwaaw] .zimam-drawer-btn--primary:hover {
    background: var(--color-primary-700, #1d4ed8);
}

[b-rw9x2kwaaw] .zimam-drawer-btn--primary:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Loading & Empty States ── */

[b-rw9x2kwaaw] .zimam-drawer-status {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block: 2rem;
    text-align: center;
    color: var(--color-text-muted, #94a3b8);
    font-size: var(--text-sm, 0.8125rem);
}
/* /SharedComponents/EntityDrawer/DrawerAttachmentList.razor.rz.scp.css */
/* ==========================================================================
   DrawerAttachmentList — Card-based attachment layout (inspiration design)
   Scoped to DrawerAttachmentList.razor via Blazor CSS isolation
   ========================================================================== */

[b-5iuirwp3l4] .zimam-drawer-attachments-list {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

/* Individual attachment card */
[b-5iuirwp3l4] .zimam-drawer-attachment-card {
    display: flex;
    align-items: center;
    padding: 0.75rem 1.25rem 0.75rem 0.75rem;
    border-radius: var(--radius-lg, 0.75rem);
    border: 1px solid var(--color-border, #e2e8f0);
    background: var(--color-surface, #fff);
    min-width: 220px;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-card:hover {
    border-color: var(--color-primary, #93c5fd);
    box-shadow: var(--shadow-sm);
    transform: translateY(-2px);
}

/* File type icon area */
[b-5iuirwp3l4] .zimam-drawer-attachment-icon {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: var(--radius-md, 0.5rem);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-inline-end: 0.75rem;
    flex-shrink: 0;
    transition: background 0.15s ease, transform 0.15s ease;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-card:hover .zimam-drawer-attachment-icon {
    transform: scale(1.05);
}

[b-5iuirwp3l4] .zimam-drawer-attachment-icon--pdf {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #ef4444;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-icon--image {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #f97316;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-icon--word {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #3b82f6;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-icon--default {
    background: var(--color-bg, #f1f5f9);
    border: 1px solid var(--color-border-light, #e2e8f0);
    color: var(--color-text-secondary, #64748b);
}

/* File info */
[b-5iuirwp3l4] .zimam-drawer-attachment-info {
    flex: 1;
    min-width: 0;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-name {
    font-size: var(--text-sm, 0.8125rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-strong, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color 0.15s ease;
}

[b-5iuirwp3l4] .zimam-drawer-attachment-card:hover .zimam-drawer-attachment-name {
    color: var(--color-primary, #2563eb);
}

[b-5iuirwp3l4] .zimam-drawer-attachment-meta {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: var(--color-text-secondary, #64748b);
}

[b-5iuirwp3l4] .zimam-drawer-attachment-meta-sep {
    color: var(--color-border, #cbd5e1);
}

/* Upload dropzone */
.zimam-drawer-upload-area[b-5iuirwp3l4] {
    margin-top: 1rem;
}

[b-5iuirwp3l4] .zimam-drawer-upload-dropzone {
    border: 2px dashed var(--color-border, #e2e8f0);
    border-radius: var(--radius-lg, 0.75rem);
    padding: 1.5rem;
    text-align: center;
    transition: border-color 0.2s ease, background 0.2s ease;
}

[b-5iuirwp3l4] .zimam-drawer-upload-dropzone:hover {
    border-color: var(--color-primary, #2563eb);
    background: rgba(37, 99, 235, 0.03);
}
/* /SharedComponents/EntityDrawer/DrawerCommentList.razor.rz.scp.css */
/* ==========================================================================
   DrawerCommentList — Threaded comment layout with reply connectors
   Scoped to DrawerCommentList.razor via Blazor CSS isolation
   ========================================================================== */

/* Container */
.zimam-drawer-timeline[b-uacra9d0k4] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Comment Thread (parent + replies group) ── */

[b-uacra9d0k4] .comment-thread {
    position: relative;
    padding-bottom: 0.25rem;
}

[b-uacra9d0k4] .comment-thread + .comment-thread {
    border-top: 1px solid var(--color-border-light, #f1f5f9);
}

/* ── Comment Card ── */

[b-uacra9d0k4] .comment-card {
    display: flex;
    gap: 0.75rem;
    padding: 0.875rem 0;
}

[b-uacra9d0k4] .comment-avatar {
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--color-bg, #e2e8f0);
    position: relative;
    z-index: 2;
}

[b-uacra9d0k4] .comment-avatar--sm {
    width: 1.75rem;
    height: 1.75rem;
}

[b-uacra9d0k4] .comment-body {
    flex: 1;
    min-width: 0;
}

[b-uacra9d0k4] .comment-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

[b-uacra9d0k4] .comment-author {
    font-size: 0.8125rem;
    font-weight: var(--fw-bold, 700);
    color: var(--color-text-strong, #0f172a);
}

[b-uacra9d0k4] .comment-time {
    font-size: 0.75rem;
    color: var(--color-text-secondary, #64748b);
}

[b-uacra9d0k4] .comment-text {
    font-size: 0.8125rem;
    color: var(--color-text, #334155);
    line-height: 1.6;
    margin: 0 0 0.5rem;
}

/* ── Action Bar (Reply + More) ── */

[b-uacra9d0k4] .comment-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

[b-uacra9d0k4] .comment-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0;
    border: none;
    background: transparent;
    font-size: 0.75rem;
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary, #64748b);
    cursor: pointer;
    transition: color 0.15s;
    font-family: inherit;
}

[b-uacra9d0k4] .comment-action-btn:hover {
    color: var(--color-text-strong, #0f172a);
}

[b-uacra9d0k4] .comment-action-btn--more {
    margin-inline-start: auto;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s;
}

[b-uacra9d0k4] .comment-card:hover .comment-action-btn--more {
    opacity: 1;
}

/* ── Thread Connector Lines (Chain Model) ── */

/*
 * Chain pattern: nodes connect sequentially, avatar-to-avatar.
 *   Root → first-L1 : L-curve (vertical down from root, curve, horizontal to L1 avatar)
 *   L1 → next-L1    : straight vertical at L1 avatar center column
 *   L1 → first-L2   : L-curve (vertical down from L1, curve, horizontal to L2 avatar)
 *   L2 → next-L2    : straight vertical at L2 avatar center column
 * No lines between root-to-root. The chain stays within each thread.
 */

/* Bridge: root avatar bottom → root card bottom (start of chain) */
[b-uacra9d0k4] .comment-card--threaded {
    position: relative;
}

[b-uacra9d0k4] .comment-card--threaded::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(1rem - 1px);   /* root avatar center (2rem / 2) */
    top: 2.875rem;                           /* 0.875rem card-padding + 2rem avatar */
    bottom: 0;
    width: 2px;
    background: var(--color-border, #e2e8f0);
    pointer-events: none;
    transition: background 0.2s;
    z-index: 0;
}

/* ── Replies region ── */
[b-uacra9d0k4] .comment-thread-replies {
    position: relative;
}

/* Reply node */
[b-uacra9d0k4] .comment-reply-node {
    position: relative;
}

/* Chain continuation: L1 avatar bottom → node bottom (to next sibling) */
[b-uacra9d0k4] .comment-thread-replies > .comment-reply-node:not(:last-child)::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(2.75rem + 0.875rem - 1px);  /* L1 avatar center */
    top: 2.25rem;                                          /* 0.5rem card-padding + 1.75rem avatar */
    bottom: 0;
    width: 2px;
    background: var(--color-border, #e2e8f0);
    pointer-events: none;
    z-index: 0;
    transition: background 0.2s;
}

/* Reply wrapper */
[b-uacra9d0k4] .comment-reply-wrapper {
    position: relative;
    padding-inline-start: 2.75rem;
}

/* ── L1 Branches ── */

/* First L1: L-curve from root avatar column → L1 avatar */
[b-uacra9d0k4] .comment-reply-branch {
    position: absolute;
    inset-inline-start: calc(1rem - 1px);            /* root avatar center */
    top: 0;
    height: calc(0.5rem + 0.875rem + 1px);           /* to L1 avatar vertical center */
    width: calc(2.75rem - 1rem + 1px);                /* horizontal reach to L1 content edge */
    border-inline-start: 2px solid var(--color-border, #e2e8f0);
    border-bottom: 2px solid var(--color-border, #e2e8f0);
    border-start-start-radius: 0;
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-end-start-radius: 0.5rem;
    background: transparent;
    pointer-events: auto;
    cursor: default;
    transition: border-color 0.2s;
    z-index: 1;
}

/* Non-first L1: vertical incoming at L1 avatar center (chain from previous sibling) */
[b-uacra9d0k4] .comment-thread-replies > .comment-reply-node:not(:first-child) > .comment-reply-wrapper > .comment-reply-branch {
    inset-inline-start: calc(2.75rem + 0.875rem - 1px);  /* L1 avatar center */
    width: 2px;
    height: calc(0.5rem + 0.875rem + 1px);
    padding: 0;
    border-inline-start: none;
    border-bottom: none;
    background: var(--color-border, #e2e8f0);
    background-clip: border-box;
    border-radius: 0;
    transition: background 0.2s;
}

/* ── L1→L2 bridge ── */

/* Bridge: L1 avatar bottom → L1 card bottom (start of L2 chain) */
[b-uacra9d0k4] .comment-card--threaded-l1 {
    position: relative;
}

[b-uacra9d0k4] .comment-card--threaded-l1::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(0.875rem - 1px);   /* L1 avatar center (1.75rem / 2) */
    top: 2.25rem;                                 /* 0.5rem padding + 1.75rem avatar */
    bottom: 0;
    width: 2px;
    background: var(--color-border, #e2e8f0);
    pointer-events: none;
    transition: background 0.2s;
    z-index: 0;
}

/* ── Level-2 children area ── */
[b-uacra9d0k4] .comment-reply-children {
    position: relative;
}

/* Chain continuation: L2 avatar bottom → wrapper bottom (to next L2 sibling) */
[b-uacra9d0k4] .comment-reply-children > .comment-reply-wrapper--l2:not(:last-child)::after {
    content: '';
    position: absolute;
    inset-inline-start: calc(5.25rem + 0.875rem - 1px);   /* L2 avatar center */
    top: 2.25rem;                                           /* 0.5rem padding + 1.75rem avatar */
    bottom: 0;
    width: 2px;
    background: var(--color-border, #e2e8f0);
    pointer-events: none;
    z-index: 0;
    transition: background 0.2s;
}

/* Level-2 wrapper */
[b-uacra9d0k4] .comment-reply-wrapper--l2 {
    padding-inline-start: 5.25rem;
}

/* ── L2 Branches ── */

/* First L2: L-curve from L1 avatar column → L2 avatar */
[b-uacra9d0k4] .comment-reply-branch--l2 {
    inset-inline-start: calc(2.75rem + 0.875rem - 1px);   /* L1 avatar center */
    width: calc(5.25rem - 2.75rem - 0.875rem + 1px);      /* horizontal reach to L2 content edge */
}

/* Non-first L2: vertical incoming at L2 avatar center (chain from previous sibling) */
[b-uacra9d0k4] .comment-reply-children > .comment-reply-wrapper--l2:not(:first-child) > .comment-reply-branch--l2 {
    inset-inline-start: calc(5.25rem + 0.875rem - 1px);   /* L2 avatar center */
    width: 2px;
    border-inline-start: none;
    border-bottom: none;
    background: var(--color-border, #e2e8f0);
    background-clip: border-box;
    border-radius: 0;
    transition: background 0.2s;
}

/* ── Hover: bottom-up path highlighting ──
 * Root hover      → only root bridge
 * L1 hover        → L1 branch + L1 trunk + root bridge
 * L2 hover        → L2 branch + L2 trunk + L1 bridge + L1 branch + root bridge
 * Each level bubbles :hover UP the DOM, so parent connectors auto-highlight.
 */

/* 1) Root bridge: highlight when ANYTHING in the thread is hovered */
[b-uacra9d0k4] .comment-thread:hover > .comment-card--threaded::after {
    background: var(--color-text-strong, #0f172a);
}

/* 2) L1 trunk (continuation lines between L1 nodes): highlight when replies area is hovered */
[b-uacra9d0k4] .comment-thread-replies:hover > .comment-reply-node:not(:last-child)::after {
    background: var(--color-text-strong, #0f172a);
}

/* 3) L1 branch (specific node): only the hovered node's L-curve */
[b-uacra9d0k4] .comment-reply-node:hover > .comment-reply-wrapper > .comment-reply-branch {
    border-color: var(--color-text-strong, #0f172a);
}

/* 3b) L1 vertical branch (non-first child, background-based) */
[b-uacra9d0k4] .comment-thread-replies > .comment-reply-node:not(:first-child):hover > .comment-reply-wrapper > .comment-reply-branch {
    background: var(--color-text-strong, #0f172a);
}

/* 4) L1→L2 bridge: highlight when L1 node is hovered (L2 hover bubbles up) */
[b-uacra9d0k4] .comment-reply-node:hover .comment-card--threaded-l1::after {
    background: var(--color-text-strong, #0f172a);
}

/* 5) L2 trunk (continuation lines between L2 nodes): highlight when L2 area is hovered */
[b-uacra9d0k4] .comment-reply-children:hover > .comment-reply-wrapper--l2:not(:last-child)::after {
    background: var(--color-text-strong, #0f172a);
}

/* 6) L2 branch (specific node): only the hovered L2's L-curve */
[b-uacra9d0k4] .comment-reply-wrapper--l2:hover > .comment-reply-branch--l2 {
    border-color: var(--color-text-strong, #0f172a);
}

/* 6b) L2 vertical branch (non-first child, background-based) */
[b-uacra9d0k4] .comment-reply-children > .comment-reply-wrapper--l2:not(:first-child):hover > .comment-reply-branch--l2 {
    background: var(--color-text-strong, #0f172a);
}

[b-uacra9d0k4] .comment-card--reply {
    padding-top: 0.5rem;
    padding-bottom: 0.625rem;
}

/* ── Inline Reply Input ── */

[b-uacra9d0k4] .comment-reply-input {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0 0.75rem;
}

[b-uacra9d0k4] .comment-reply-field {
    flex: 1;
    font-size: 0.8125rem;
    font-family: inherit;
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-md, 0.5rem);
    padding: 0.5rem 0.75rem;
    background: var(--color-surface, #fff);
    color: var(--color-text-strong, #0f172a);
    outline: none;
    transition: border-color 0.15s;
}

[b-uacra9d0k4] .comment-reply-field:focus {
    border-color: var(--color-primary, #3b82f6);
}

[b-uacra9d0k4] .comment-reply-field::placeholder {
    color: var(--color-text-faint, #94a3b8);
}

[b-uacra9d0k4] .comment-reply-send {
    padding: 0.5rem 1rem;
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: var(--fw-medium, 500);
    font-family: inherit;
    background: var(--color-primary, #2563eb);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background 0.15s;
    white-space: nowrap;
}

[b-uacra9d0k4] .comment-reply-send:hover:not(:disabled) {
    background: var(--color-primary-700, #1d4ed8);
}

[b-uacra9d0k4] .comment-reply-send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Top-Level Comment Input ── */

[b-uacra9d0k4] .comment-input-area {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--color-bg, #f8fafc);
    border-radius: var(--radius-lg, 0.75rem);
    padding: 0.75rem;
    margin-top: 0.75rem;
}

[b-uacra9d0k4] .comment-input-field {
    flex: 1;
    font-size: 0.8125rem;
    font-family: inherit;
    border: none;
    background: transparent;
    color: var(--color-text, #334155);
    padding: 0.25rem 0;
    outline: none;
}

[b-uacra9d0k4] .comment-input-field::placeholder {
    color: var(--color-text-faint, #94a3b8);
}

[b-uacra9d0k4] .comment-input-send {
    padding: 0.5rem 1.25rem;
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: var(--fw-medium, 500);
    font-family: inherit;
    background: var(--color-primary, #2563eb);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background 0.15s;
}

[b-uacra9d0k4] .comment-input-send:hover:not(:disabled) {
    background: var(--color-primary-700, #1d4ed8);
}

[b-uacra9d0k4] .comment-input-send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Loading & Empty States ── */

[b-uacra9d0k4] .zimam-drawer-status {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-block: 2rem;
    text-align: center;
    color: var(--color-text-muted, #94a3b8);
    font-size: var(--text-sm, 0.8125rem);
}
/* /SharedComponents/Layouts/Shell/MainLayout/MainLayout.razor.rz.scp.css */
.zimam-sidebar-overlay[b-95oskq2vh6] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(4px);
}

@media (min-width: 1024px) {
    .zimam-sidebar-overlay[b-95oskq2vh6] {
        display: none;
    }
}
/* /SharedComponents/Layouts/Shell/StalePermissionsBanner.razor.rz.scp.css */
.zimam-stale-permissions-banner[b-3yge0jij06] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--zimam-space-sm);
    padding: var(--zimam-space-sm) var(--zimam-space-md);
    background: var(--zimam-color-warning-soft, #fff7e6);
    color: var(--zimam-color-warning-strong, #8a5a00);
    border-bottom: 1px solid var(--zimam-color-warning-border, #f0c878);
    font-size: var(--zimam-font-size-sm);
    line-height: 1.5;
}

.zimam-stale-permissions-banner__content[b-3yge0jij06] {
    display: flex;
    align-items: center;
    gap: var(--zimam-space-xs);
}

.zimam-stale-permissions-banner__message[b-3yge0jij06] {
    font-weight: 500;
}

.zimam-stale-permissions-banner__dismiss[b-3yge0jij06] {
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
    padding: var(--zimam-space-2xs);
    border-radius: var(--zimam-radius-sm, 4px);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.zimam-stale-permissions-banner__dismiss:hover[b-3yge0jij06] {
    background: rgba(0, 0, 0, 0.05);
}
/* /SharedComponents/Layouts/Shell/UserMenu.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════
   UserMenu — Scoped Styles
   BEM: .zimam-user-menu-*
   ═══════════════════════════════════════════════════════════════ */

.zimam-user-menu[b-25hmt1t5d8] {
    position: relative;
}

.zimam-user-menu__trigger[b-25hmt1t5d8] {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    border-radius: 50%;
    transition: box-shadow 0.15s;
}

.zimam-user-menu__trigger:hover[b-25hmt1t5d8],
.zimam-user-menu__trigger:focus-visible[b-25hmt1t5d8] {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-text-strong, #1e293b) 20%, transparent);
}

.zimam-user-menu__avatar[b-25hmt1t5d8] {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    border: 1px solid var(--color-border);
    background: var(--color-bg-subtle);
    object-fit: cover;
    user-select: none;
}

/* ── Dropdown ── */
.zimam-user-menu__dropdown[b-25hmt1t5d8] {
    position: absolute;
    top: calc(100% + 0.5rem);
    inset-inline-end: 0;
    min-width: 14rem;
    background: var(--color-surface, #fff);
    border: 1px solid var(--color-border, #e2e8f0);
    border-radius: var(--radius-lg, 0.5rem);
    box-shadow: var(--shadow-floating, 0 10px 15px -3px rgb(0 0 0 / 0.1));
    z-index: 100;
    overflow: hidden;
    animation: zimam-user-menu-in-b-25hmt1t5d8 0.12s ease-out;
}

@keyframes zimam-user-menu-in-b-25hmt1t5d8 {
    from {
        opacity: 0;
        transform: translateY(-0.25rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.zimam-user-menu__header[b-25hmt1t5d8] {
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.zimam-user-menu__name[b-25hmt1t5d8] {
    font-size: var(--text-sm, 0.875rem);
    font-weight: var(--fw-semibold, 600);
    color: var(--color-text-strong, #0f172a);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-user-menu__email[b-25hmt1t5d8] {
    font-size: var(--text-xs, 0.75rem);
    color: var(--color-text-muted, #94a3b8);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-user-menu__divider[b-25hmt1t5d8] {
    height: 1px;
    background: var(--color-border, #e2e8f0);
}

.zimam-user-menu__item[b-25hmt1t5d8] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.5rem 1rem;
    font-size: var(--text-sm, 0.875rem);
    color: var(--color-text-secondary, #475569);
    background: none;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.1s, color 0.1s;
}

.zimam-user-menu__item:hover[b-25hmt1t5d8] {
    background: var(--color-bg-subtle, #f8fafc);
    color: var(--color-text-strong, #0f172a);
}

.zimam-user-menu__item--danger[b-25hmt1t5d8] {
    color: #dc2626;
}

.zimam-user-menu__item--danger:hover[b-25hmt1t5d8] {
    background: color-mix(in srgb, #dc2626 8%, transparent);
    color: #b91c1c;
}

.zimam-user-menu__logout-form[b-25hmt1t5d8] {
    margin: 0;
    padding: 0;
}
/* /SharedComponents/Layouts/Sidebar/AppSidebar/AppSidebar.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════
   ZIMAM — Enterprise Sidebar
   
   Three States (all CSS-driven):
   1. Pinned (expanded): full width, in grid flow
   2. Collapsed (icon rail): narrow, icons only
   3. Peek (CSS :hover on collapsed): overlays content
   
   RTL-first, production-grade.
   ═══════════════════════════════════════════════════════ */

.zimam-sidebar[b-hjy9o9qoed] {
    /* ── Design tokens ── */
    --sidebar-bg: var(--color-surface);
    --sidebar-text-primary: var(--color-text-strong);
    --sidebar-text-secondary: var(--color-text-secondary);
    --sidebar-text-muted: var(--color-text-muted);
    --sidebar-hover-bg: var(--color-bg-subtle);
    --sidebar-active-bg: var(--color-bg-subtle);
    --sidebar-active-text: var(--color-text-strong);
    --sidebar-accent: var(--color-text-strong);
    --sidebar-icon-size: 1.125rem;
    --sidebar-item-radius: var(--radius-sm);
    --sidebar-item-padding-y: 0.3125rem;
    --sidebar-item-padding-x: 0.625rem;
    --sidebar-item-gap: 0.5rem;
    --sidebar-icon-well-size: 1.25rem;

    /* ── Layout ── */
    height: 100vh;
    margin: 0;
    display: flex;
    flex-direction: column;
    background: var(--sidebar-bg);
    border-inline-end: 1px solid var(--color-border);
    position: relative;
    overflow: visible;
    transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);
    contain: layout style;
}

body.is-resizing .zimam-sidebar[b-hjy9o9qoed] {
    will-change: width;
}

.zimam-sidebar--mobile-open[b-hjy9o9qoed] {
    transform: translateX(0);
}

.zimam-sidebar--mobile-closed[b-hjy9o9qoed] {
    transform: translateX(100%);
}

.zimam-sidebar-shell[b-hjy9o9qoed] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    overflow: hidden;
    border-radius: inherit;
}

/* ── Drag Handle ── */
.zimam-sidebar-resizer[b-hjy9o9qoed] {
    position: absolute;
    inset-block: 0;
    inset-inline-end: -2px;
    width: 6px;
    cursor: col-resize;
    z-index: 100;
    transition: background-color 0.2s ease;
    opacity: 0;
}

.zimam-sidebar-resizer:hover[b-hjy9o9qoed],
body.is-resizing .zimam-sidebar-resizer[b-hjy9o9qoed] {
    background-color: var(--color-text-faint);
    opacity: 1;
}

/* ── Header Section ── */
/* No vertical padding — height is fixed to token; align-items: center handles centering */
.zimam-sidebar-header[b-hjy9o9qoed] {
    padding-inline: 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    height: var(--zimam-header-height);
    position: relative;
    border-bottom: 1px solid var(--color-border);
}

.zimam-sidebar-header .zimam-sidebar-brand-name[b-hjy9o9qoed] {
    color: var(--sidebar-text-primary);
}

.zimam-sidebar-header .zimam-sidebar-brand-sub[b-hjy9o9qoed] {
    color: var(--sidebar-text-muted);
}

.zimam-sidebar-logo[b-hjy9o9qoed] {
    width: 34px;
    height: 34px;
    border-radius: var(--radius-md);
    flex-shrink: 0;
    background: var(--color-text-strong);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.zimam-sidebar-brand[b-hjy9o9qoed] {
    flex: 1;
    overflow: hidden;
    min-width: 0;
}

.zimam-sidebar-brand-name[b-hjy9o9qoed] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--sidebar-text-primary);
    letter-spacing: -0.01em;
    line-height: 1.2;
    white-space: nowrap;
}

.zimam-sidebar-brand-sub[b-hjy9o9qoed] {
    font-size: 0.6875rem;
    color: var(--sidebar-text-muted);
    font-weight: 500;
    margin-top: 0.0625rem;
    white-space: nowrap;
}

/* ── Navigation List ── */
.zimam-sidebar-nav[b-hjy9o9qoed] {
    flex: 1;
    overflow-y: hidden;
    overflow-x: hidden;
    padding: 0.5rem 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    min-height: 0;
    /* Delay enabling scroll until flex layout has settled (~150ms) to prevent
       the scrollbar from flashing on first paint while the container calculates
       its final flex height. */
    animation: zimam-enable-sidebar-scroll-b-hjy9o9qoed 0s 150ms forwards;
}

@keyframes zimam-enable-sidebar-scroll-b-hjy9o9qoed {
    to { overflow-y: auto; }
}

.zimam-sidebar-nav[b-hjy9o9qoed]::-webkit-scrollbar { width: 4px; }
.zimam-sidebar-nav[b-hjy9o9qoed]::-webkit-scrollbar-track { background: transparent; }
.zimam-sidebar-nav[b-hjy9o9qoed]::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
    border-radius: 10px;
}
.zimam-sidebar-nav[b-hjy9o9qoed]::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

/* ── Collapse Toggle (circle with arrow) ── */
.zimam-sidebar-toggle[b-hjy9o9qoed] {
    appearance: none;
    width: 1.5rem;
    height: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    border: 1px solid var(--color-border);
    background: var(--color-surface);
    color: var(--sidebar-text-muted);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease,
                border-color 0.15s ease;
}

.zimam-sidebar-toggle svg[b-hjy9o9qoed] {
    width: 0.75rem;
    height: 0.75rem;
    display: block;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.zimam-sidebar-toggle--collapsed svg[b-hjy9o9qoed] {
    transform: rotate(180deg);
}

.zimam-sidebar-toggle:hover[b-hjy9o9qoed] {
    background: var(--sidebar-hover-bg);
    color: var(--sidebar-text-secondary);
    border-color: var(--color-border-hover);
}

.zimam-sidebar-toggle:focus-visible[b-hjy9o9qoed] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

/* ── Nav Content Animation ── */
.zimam-sidebar-nav-content[b-hjy9o9qoed] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    animation: sidebar-nav-enter-b-hjy9o9qoed 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes sidebar-nav-enter-b-hjy9o9qoed {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ══════════════════════════════════════════════════════
   ── COLLAPSED STATE (Icon Rail) ──
   
   CSS hides text and group structure.
   Full DOM stays in place — :hover restores it.
   ══════════════════════════════════════════════════════ */

/* Hide text elements + toggle in collapsed state */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-sidebar-brand,
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-sidebar-toggle {
    display: none !important;
}

/* Collapsed state: center logo only */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-sidebar-header {
    justify-content: center;
    padding-inline: 0.75rem;
}

/* Tighter spacing */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-sidebar-nav {
    padding: 0.5rem;
    gap: 0.125rem;
}

/* Hide resize handle */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-sidebar-resizer {
    display: none;
}

/* ══════════════════════════════════════════════════════
   ── Desktop Collapsed: Fixed Position ──
   
   The sidebar becomes position:fixed so it sits
   outside the grid flow. The grid column template
   still reserves the collapsed-width space.
   On :hover, ONLY width changes → no flicker.
   ══════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
    .zimam-sidebar--mobile-open[b-hjy9o9qoed],
    .zimam-sidebar--mobile-closed[b-hjy9o9qoed] {
        transform: none;
    }

    .zimam-sidebar--collapsed[b-hjy9o9qoed] {
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        left: auto;
        z-index: 50;
        width: var(--zimam-sidebar-collapsed-width);
        transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* PEEK: only width + shadow change. No position shift = no flicker */
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed] {
        width: var(--zimam-sidebar-width);
        box-shadow: 0 20px 60px -12px rgba(0,0,0,0.15),
                    0 8px 24px -8px rgba(0,0,0,0.08);
    }

    /* Restore text elements + toggle on peek */
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-sidebar-brand {
        display: block !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-sidebar-toggle {
        display: inline-flex !important;
    }

    /* Restore header layout */
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-sidebar-header {
        justify-content: flex-start;
        padding-inline: 1.25rem;
    }

    /* Restore nav padding */
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-sidebar-nav {
        padding: 0.5rem 0.75rem 1rem;
    }

    /* Show resize handle on peek */
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-sidebar-resizer {
        display: block;
    }
}

/* ══════════════════════════
   ── Mobile Responsive ──
   ══════════════════════════ */
/* From NavItem.razor.css */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-label,
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-badge {
    display: none !important;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-item {
    justify-content: center;
    padding: 0.5rem;
    gap: 0;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-icon {
    width: 1.25rem;
    height: 1.25rem;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-icon svg {
    width: 1.125rem;
    height: 1.125rem;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-item.active,
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-item[aria-current="page"] {
    background: var(--sidebar-active-bg);
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-item.active::before,
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-item[aria-current="page"]::before {
    display: none;
}

@media (min-width: 1024px) {
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-label {
        display: block !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-badge {
        display: inline-flex !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-item {
        justify-content: flex-start;
        padding: var(--sidebar-item-padding-y) var(--sidebar-item-padding-x);
        gap: var(--sidebar-item-gap);
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-icon {
        width: var(--sidebar-icon-well-size);
        height: var(--sidebar-icon-well-size);
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-icon svg {
        width: var(--sidebar-icon-size);
        height: var(--sidebar-icon-size);
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-item.active::before,
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-item[aria-current="page"]::before {
        display: block;
    }
}

/* From NavGroup.razor.css */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-group-title,
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-group-chevron {
    display: none !important;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-group-header {
    display: none !important;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-group-inner {
    padding-inline-start: 0;
    border-inline-start: none;
    margin-inline-start: 0;
    margin-top: 0;
    padding-top: 0;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-group {
    margin-top: 0.125rem;
}

@media (min-width: 1024px) {
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group-header {
        display: flex !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group-title {
        display: block !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group-chevron {
        display: inline-flex !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group-inner {
        padding-inline-start: 0.5rem;
        border-inline-start: 1.5px solid var(--color-border);
        margin-inline-start: 1rem;
        margin-top: 0.125rem;
        padding-top: 0.125rem;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group {
        margin-top: 0.625rem;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-group:first-child {
        margin-top: 0;
    }
}

/* From SettingsSidebar.razor.css — back button collapsed / peek */
.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-settings-back__label {
    display: none !important;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-settings-back__btn {
    justify-content: center;
    padding: 0.5rem;
    gap: 0;
}

.zimam-sidebar--collapsed[b-hjy9o9qoed]  .zimam-nav-separator {
    margin: 0.5rem 0.25rem;
}

@media (min-width: 1024px) {
    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-settings-back__label {
        display: inline !important;
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-settings-back__btn {
        justify-content: flex-start;
        padding: var(--sidebar-item-padding-y) var(--sidebar-item-padding-x);
        gap: var(--sidebar-item-gap);
    }

    .zimam-sidebar--collapsed:hover[b-hjy9o9qoed]  .zimam-nav-separator {
        margin: 0.75rem 0.75rem;
    }
}
/* /SharedComponents/Layouts/Sidebar/NavGroup/NavGroup.razor.rz.scp.css */
.zimam-nav-group[b-4z96e1u5aw] {
    display: flex;
    flex-direction: column;
    margin-top: 0.625rem;
}

.zimam-nav-group:first-child[b-4z96e1u5aw] {
    margin-top: 0;
}

.zimam-nav-group-header[b-4z96e1u5aw] {
    appearance: none;
    display: flex;
    align-items: center;
    gap: var(--sidebar-item-gap);
    padding: 0.375rem var(--sidebar-item-padding-x);
    width: 100%;
    min-height: 2rem;
    background: transparent;
    border: 1px solid transparent;
    color: var(--sidebar-text-muted);
    font-size: var(--text-xs);
    font-weight: var(--fw-bold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-align: start;
    cursor: pointer;
    border-radius: var(--sidebar-item-radius);
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
    user-select: none;
}

.zimam-nav-group-header:hover[b-4z96e1u5aw] {
    color: var(--sidebar-text-secondary);
    background: var(--sidebar-hover-bg);
    border-color: var(--color-border-light);
}

.zimam-nav-group-header:focus-visible[b-4z96e1u5aw] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}

.zimam-nav-group-icon[b-4z96e1u5aw] {
    width: var(--sidebar-icon-well-size, 1.25rem);
    height: var(--sidebar-icon-well-size, 1.25rem);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--sidebar-text-muted);
    background: transparent;
    border: none;
    border-radius: 0;
}

.zimam-nav-group-icon[b-4z96e1u5aw]  .zimam-icon {
    width: var(--sidebar-icon-size, 1.125rem);
    height: var(--sidebar-icon-size, 1.125rem);
    display: block;
}

.zimam-nav-group-title[b-4z96e1u5aw] {
    flex: 1;
    text-align: start;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zimam-nav-group-chevron[b-4z96e1u5aw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: var(--sidebar-text-muted);
    opacity: 0.6;
    transition: opacity 0.2s ease, color 0.2s ease;
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

.zimam-nav-group-header:hover .zimam-nav-group-chevron[b-4z96e1u5aw] {
    opacity: 1;
    color: var(--sidebar-text-secondary);
}

.zimam-nav-group-inner[b-4z96e1u5aw] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding-inline-start: 0.5rem;
    margin-top: 0.125rem;
    border-inline-start: 1.5px solid var(--color-border);
    margin-inline-start: 1rem;
    padding-top: 0.125rem;
}


/* /SharedComponents/Layouts/Sidebar/NavItem/NavItem.razor.rz.scp.css */
.zimam-nav-item-shell[b-orrkjkq8dl] {
    display: block;
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--sidebar-item-gap);
    min-height: 2rem;
    padding: var(--sidebar-item-padding-y) var(--sidebar-item-padding-x);
    border-radius: var(--sidebar-item-radius);
    border: 1px solid transparent;
    color: var(--sidebar-text-secondary);
    text-decoration: none;
    font-size: var(--text-base);
    font-weight: var(--fw-medium);
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
    cursor: pointer;
}

.zimam-nav-icon[b-orrkjkq8dl] {
    width: var(--sidebar-icon-well-size, 1.25rem);
    height: var(--sidebar-icon-well-size, 1.25rem);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--sidebar-text-muted);
    background: transparent;
    border: none;
    border-radius: 0;
    opacity: 1;
    transition: color 0.15s ease;
}

.zimam-nav-icon[b-orrkjkq8dl]  .zimam-icon {
    width: var(--sidebar-icon-size, 1.125rem);
    height: var(--sidebar-icon-size, 1.125rem);
    display: block;
}

.zimam-nav-label[b-orrkjkq8dl] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item:hover {
    background: var(--sidebar-hover-bg);
    color: var(--sidebar-text-primary);
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item:hover .zimam-nav-icon {
    color: var(--sidebar-text-secondary);
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item.active,
.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item[aria-current="page"] {
    background: var(--sidebar-active-bg);
    border-color: var(--color-border-light);
    color: var(--sidebar-active-text);
    font-weight: var(--fw-semibold);
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item.active .zimam-nav-icon,
.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item[aria-current="page"] .zimam-nav-icon {
    color: var(--sidebar-active-text);
}

.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item.active::before,
.zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item[aria-current="page"]::before {
    content: "";
    position: absolute;
    inset-block: 0.375rem;
    inset-inline-end: 0;
    width: 3px;
    background: var(--sidebar-accent);
    border-radius: 3px 0 0 3px;
}

[dir="rtl"] .zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item.active::before,
[dir="rtl"] .zimam-nav-item-shell[b-orrkjkq8dl]  .zimam-nav-item[aria-current="page"]::before {
    border-radius: 0 3px 3px 0;
}

.zimam-nav-badge[b-orrkjkq8dl] {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    border-radius: var(--radius-pill);
    background: var(--sidebar-accent);
    color: #fff;
    line-height: 1.2;
}




/* /SharedComponents/Layouts/Sidebar/NavMenu/NavMenu.razor.rz.scp.css */
.zimam-nav-list[b-b1pvzbv4vv] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.zimam-nav-separator[b-b1pvzbv4vv] {
    height: 1px;
    background: var(--color-border-light);
    margin: 0.75rem 0.75rem;
}

.zimam-nav-list--collapsed .zimam-nav-separator[b-b1pvzbv4vv] {
    margin: 0.5rem 0.75rem;
}


/* /SharedComponents/Layouts/Sidebar/SettingsSidebar/SettingsSidebar.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════════
   Settings Sidebar — Shared base + back button.
   NavGroup/NavItem components handle their own styling, but .zimam-nav-list
   and .zimam-nav-separator are scoped to NavMenu via CSS isolation.
   We duplicate the minimal base rules here so they apply in this component.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ── Nav list base (mirrored from NavMenu.razor.css) ── */
.zimam-nav-list[b-9j3kod3dos] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.zimam-nav-separator[b-9j3kod3dos] {
    height: 1px;
    background: var(--color-border-light);
    margin: 0.75rem 0.75rem;
}

.zimam-nav-list--collapsed .zimam-nav-separator[b-9j3kod3dos] {
    margin: 0.5rem 0.75rem;
}

/* ── Back Button ── */
.zimam-settings-back[b-9j3kod3dos] {
    margin-bottom: 0.25rem;
}

.zimam-settings-back__btn[b-9j3kod3dos] {
    appearance: none;
    display: flex;
    align-items: center;
    gap: var(--sidebar-item-gap);
    width: 100%;
    min-height: 2rem;
    padding: var(--sidebar-item-padding-y) var(--sidebar-item-padding-x);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--sidebar-item-radius);
    color: var(--sidebar-text-secondary);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    text-align: start;
}

.zimam-settings-back__btn:hover[b-9j3kod3dos] {
    background: var(--sidebar-hover-bg);
    color: var(--sidebar-text-primary);
    border-color: var(--color-border-light);
}

.zimam-settings-back__btn:focus-visible[b-9j3kod3dos] {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
}
/* /SharedComponents/Navigation/Breadcrumb.razor.rz.scp.css */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   ZIMAM Breadcrumb Module
   Standardized navigation path for all application pages.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

.zimam-breadcrumbs[b-b40l0mev3x] {
    display: flex;
    align-items: center;
    padding: 0;
    margin-bottom: 0.125rem;
}

.zimam-breadcrumbs__list[b-b40l0mev3x] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 0.5rem;
}

.zimam-breadcrumbs__item[b-b40l0mev3x] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-text-muted);
    font-size: 0.75rem; /* Smaller for header */
    font-weight: var(--fw-medium);
}

.zimam-breadcrumbs__content[b-b40l0mev3x] {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.zimam-breadcrumbs__icon[b-b40l0mev3x] {
    color: var(--color-text-secondary);
}

.zimam-breadcrumbs__link[b-b40l0mev3x] {
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease-default);
}

.zimam-breadcrumbs__link:hover[b-b40l0mev3x] {
    color: var(--color-primary);
    text-decoration: underline;
}

.zimam-breadcrumbs__text[b-b40l0mev3x] {
    color: var(--color-text-faint);
}

.zimam-breadcrumbs__text--active[b-b40l0mev3x] {
    color: var(--color-text-strong);
    font-size: var(--text-base);
    font-weight: var(--fw-bold);
    line-height: var(--lh-tight);
}

.zimam-breadcrumbs__separator[b-b40l0mev3x] {
    display: flex;
    align-items: center;
    color: var(--color-text-faint);
}

.zimam-breadcrumbs__description[b-b40l0mev3x] {
    font-size: var(--text-2xs);
    color: var(--color-text-muted);
    font-weight: var(--fw-normal);
    line-height: var(--lh-tight);
    margin: 0;
    margin-top: 2px;
}
/* /SharedComponents/Navigation/DrawerTabBar.razor.rz.scp.css */
/* ==========================================================================
   DrawerTabBar — Tab strip navigation
   Scoped to DrawerTabBar.razor via Blazor CSS isolation
   ========================================================================== */

.zimam-tabs[b-jhn6jbs2us] {
    display: flex;
    gap: 1.25rem;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 0;
    padding: 0 1.25rem;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.zimam-tabs[b-jhn6jbs2us]::-webkit-scrollbar {
    display: none;
}

.zimam-tab[b-jhn6jbs2us] {
    padding: 0.75rem 0.125rem;
    font-size: var(--text-base, 0.9375rem);
    font-weight: var(--fw-medium, 500);
    color: var(--color-text-secondary, #64748b);
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    transition: color 0.2s ease, border-bottom-color 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: -1px;
    white-space: nowrap;
    position: relative;
}

.zimam-tab:hover[b-jhn6jbs2us] {
    color: var(--color-text-main, #334155);
}

.zimam-tab--active[b-jhn6jbs2us] {
    color: var(--color-text-strong, #0f172a);
    border-bottom-color: var(--color-text-strong, #0f172a);
}

.zimam-tab--active:hover[b-jhn6jbs2us] {
    color: var(--color-text-strong, #0f172a);
    border-bottom-color: var(--color-text-strong, #0f172a);
}

/* Badge */
.zimam-tab-badge[b-jhn6jbs2us] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.0625rem 0.375rem;
    border-radius: var(--radius-md, 0.375rem);
    font-size: 0.6875rem;
    font-weight: var(--fw-semibold, 600);
    line-height: 1;
    min-width: 1.25rem;
    background: var(--color-bg, #f1f5f9);
    color: var(--color-text-secondary, #64748b);
}

.zimam-tab--active .zimam-tab-badge[b-jhn6jbs2us] {
    background: var(--color-primary-bg, #eff6ff);
    color: var(--color-primary, #2563eb);
}