/* _content/CallLeads/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-wvp0xx188z] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-wvp0xx188z] {
    flex: 1;
}

.sidebar[b-wvp0xx188z] {
    background-image: linear-gradient(180deg, var(--cl-sidebar-grad-start, #1f2d1b) 0%, var(--cl-sidebar-grad-end, #2d4028) 100%);
}

@media (min-width: 641px) {
    .page[b-wvp0xx188z] {
        flex-direction: row;
    }

    .sidebar[b-wvp0xx188z] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    article[b-wvp0xx188z] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-wvp0xx188z] {
    color-scheme: light only;
    background: #fff3cd;
    border-top: 2px solid #ffc107;
    bottom: 0;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.15);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.75rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-size: 0.9rem;
}

    #blazor-error-ui .dismiss[b-wvp0xx188z] {
        cursor: pointer;
        margin-left: auto;
        font-size: 1.1rem;
        opacity: 0.6;
    }

    #blazor-error-ui .dismiss:hover[b-wvp0xx188z] {
        opacity: 1;
    }
/* _content/CallLeads/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-6q9klzt1xf] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-6q9klzt1xf] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-6q9klzt1xf] {
    /* min-height instead of fixed height — the row grows when the brand wraps
       to two lines (e.g. "Aprodu Law & Todd Siegel Law"). */
    min-height: 3.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: rgba(0,0,0,0.35);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.navbar-brand[b-6q9klzt1xf] {
    font-size: 0.95rem;
    line-height: 1.2;
    /* Override Bootstrap's nowrap so long site titles wrap onto a second line
       instead of overflowing the sidebar / colliding with the toggler. */
    white-space: normal;
    word-break: break-word;
    /* Leave room for the mobile navbar-toggler at top-right. */
    padding-right: 3.5rem;
    margin-right: 0;
}

/* Two-line brand for deployments where the firm name needs a deliberate break
   (e.g. "Aprodu Law &" / "Todd Siegel Law"). Both lines render at the SAME size
   and weight — they're two halves of one title, not a primary + sublabel. */
.navbar-brand .brand-line-1[b-6q9klzt1xf],
.navbar-brand .brand-line-2[b-6q9klzt1xf] {
    font-weight: 600;
}
.navbar-brand .brand-line-2[b-6q9klzt1xf] {
    margin-top: 0.05rem;
}

/* All sidebar icons render via the Bootstrap Icons font (loaded in App.razor).
   Fixed-width column for vertical alignment with the menu text; light amber
   accent so icons read as separate from the white labels but coordinate with
   the active-state amber chip. ::deep is required because the icon spans live
   inside the <NavLink> child component, across the scope boundary. */
.nav-item[b-6q9klzt1xf]  .nav-link .bi {
    display: inline-block;
    width: 1.4rem;
    text-align: center;
    margin-right: 0.65rem;
    font-size: 1.05rem;
    color: #fcd34d;
    flex-shrink: 0;
    line-height: 1;
}

.nav-item[b-6q9klzt1xf] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-6q9klzt1xf] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-6q9klzt1xf] {
        padding-bottom: 1rem;
    }

    .nav-item[b-6q9klzt1xf]  .nav-link {
        color: #f1f5f9;
        background: none;
        border: none;
        border-radius: 6px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
        font-weight: 600;
        transition: background-color 0.15s ease, color 0.15s ease;
    }

.nav-item[b-6q9klzt1xf]  a.active {
    background-color: var(--cl-sidebar-active-bg, #b45309);
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* Active row: invert icon to white so it pops against the amber chip. */
.nav-item[b-6q9klzt1xf]  a.active .bi {
    color: #ffffff;
}

.nav-item[b-6q9klzt1xf]  .nav-link:hover {
    background-color: var(--cl-sidebar-hover-bg, rgba(234, 179, 8, 0.15));
    color: #ffffff;
}

.nav-scrollable[b-6q9klzt1xf] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-6q9klzt1xf] {
    display: block;
}

.nav-version[b-6q9klzt1xf] {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.45);
    letter-spacing: 0.04em;
    user-select: none;
}

/* === Collapsible nav groups (Pipeline / Cases / Documents) ===
   Group header sits at the same indent as flat nav-items; the items inside are
   shifted right with a thin left guide line so the group structure reads. */
.nav-group[b-6q9klzt1xf] {
    padding: 0 0.75rem;
}

.nav-group-header[b-6q9klzt1xf] {
    color: rgba(241, 245, 249, 0.75);
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    height: 2.5rem;
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: 6px;
    padding: 0 0.5rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.nav-group-header:hover[b-6q9klzt1xf] {
    background-color: rgba(234, 179, 8, 0.10);
    color: #ffffff;
}

.nav-group-header .bi[b-6q9klzt1xf] {
    width: 1.4rem;
    text-align: center;
    margin-right: 0.65rem;
    font-size: 0.95rem;
    color: #fcd34d;
    flex-shrink: 0;
}

.nav-group-header .nav-group-label[b-6q9klzt1xf] {
    flex: 1;
}

.nav-group-header .nav-group-chevron[b-6q9klzt1xf] {
    margin-right: 0;
    margin-left: 0.5rem;
    font-size: 0.75rem;
    color: rgba(252, 211, 77, 0.6);
    transition: transform 0.2s ease;
}

.nav-group-header.open .nav-group-chevron[b-6q9klzt1xf] {
    transform: rotate(180deg);
}

.nav-group-items[b-6q9klzt1xf] {
    padding-left: 0.35rem;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    margin-left: 0.85rem;
    margin-bottom: 0.5rem;
}

/* Neutralize Bootstrap's px-3 on items inside groups — the group container
   already provides indent, and the doubled-up padding squeezes two-word labels
   ("Do Not Process", "Signed Documents") into a too-narrow column where they
   wrap onto multiple lines. */
.nav-group-items .nav-item[b-6q9klzt1xf] {
    padding-left: 0 !important;
    padding-right: 0.25rem !important;
    padding-bottom: 0.25rem;
}

.nav-group-items .nav-item:first-of-type[b-6q9klzt1xf] {
    padding-top: 0.25rem;
}

.nav-group-items .nav-item:last-of-type[b-6q9klzt1xf] {
    padding-bottom: 0.25rem;
}

/* Belt-and-suspenders: even when the column is tight, keep labels on one line
   so the active-pill chrome reads as a single row. ::deep crosses the scope
   boundary into the <NavLink> child. */
.nav-group-items[b-6q9klzt1xf]  .nav-link {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 641px) {
    .navbar-toggler[b-6q9klzt1xf] {
        display: none;
    }

    .nav-scrollable[b-6q9klzt1xf] {
        /* Never collapse the sidebar for wide screens */
        display: flex;
        flex-direction: column;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }

    .nav-scrollable .nav[b-6q9klzt1xf] {
        flex: 1 0 auto;
    }

    .nav-version[b-6q9klzt1xf] {
        margin-top: auto;
    }
}
/* _content/CallLeads/Components/Shared/GlobalSearchModal.razor.rz.scp.css */
/* Header uses the Dashboard gradient (per active palette) — light, so text stays dark. */
.gs-header[b-j3x3fldi21] {
    background: linear-gradient(135deg,
        var(--cl-dashboard-grad-start, #eef2ff) 0%,
        var(--cl-dashboard-grad-mid, #f5f3ff) 50%,
        var(--cl-dashboard-grad-end, #ecfeff) 100%);
    color: #1a3353;
    border-bottom: 1px solid rgba(var(--cl-primary-rgb, 13, 110, 253), 0.18);
}

/* Subtle primary-tinted accent strip at the very top of the modal. */
.gs-content[b-j3x3fldi21] {
    border-top: 4px solid var(--cl-primary, #0d6efd);
    border-radius: 0.5rem;
    overflow: hidden;
}

/* Colored container-card headers (primary tint), so each section reads at a glance. */
.gs-card-header[b-j3x3fldi21] {
    background: rgba(var(--cl-primary-rgb, 13, 110, 253), 0.10);
    color: var(--cl-primary, #0d6efd);
    font-weight: 600;
    border-bottom: 1px solid rgba(var(--cl-primary-rgb, 13, 110, 253), 0.18);
}

.gs-footer[b-j3x3fldi21] {
    background: #f8f9fb;
    border-top: 1px solid #eef0f4;
}

/* ---- Activity timeline: date grouping + pastel category bands ---- */

/* Sticky day header so the grouping stays oriented while scrolling the timeline. */
.gs-tl-date[b-j3x3fldi21] {
    position: sticky;
    top: 0;
    background: #ffffff;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6b7280;
    padding: 0.45rem 0.15rem 0.25rem;
    margin-top: 0.25rem;
    border-bottom: 1px solid #f0f0f0;
    z-index: 1;
}
.gs-tl-count[b-j3x3fldi21] {
    font-weight: 600;
    color: #9ca3af;
    margin-left: 0.4rem;
}

.gs-tl-item[b-j3x3fldi21] {
    display: flex;
    gap: 0.5rem;
    padding: 0.4rem 0.55rem;
    margin: 0.25rem 0;
    border-left: 3px solid #e5e7eb;
    border-radius: 6px;
    background: #fafafa;
}
.gs-tl-icon[b-j3x3fldi21] { width: 1rem; flex-shrink: 0; color: #9ca3af; }
.gs-tl-time[b-j3x3fldi21] { font-size: 0.72rem; color: #9ca3af; }

/* Pastel bands — light fill + a stronger left border + matching icon hue. */
.gs-tl-intake[b-j3x3fldi21]     { border-left-color: #93c5fd; background: #eff6ff; }
.gs-tl-intake .gs-tl-icon[b-j3x3fldi21] { color: #3b82f6; }
.gs-tl-call[b-j3x3fldi21]       { border-left-color: #86efac; background: #f0fdf4; }
.gs-tl-call .gs-tl-icon[b-j3x3fldi21] { color: #22c55e; }
.gs-tl-processing[b-j3x3fldi21] { border-left-color: #5eead4; background: #f0fdfa; }
.gs-tl-processing .gs-tl-icon[b-j3x3fldi21] { color: #14b8a6; }
.gs-tl-document[b-j3x3fldi21]   { border-left-color: #c4b5fd; background: #f5f3ff; }
.gs-tl-document .gs-tl-icon[b-j3x3fldi21] { color: #8b5cf6; }
.gs-tl-hearing[b-j3x3fldi21]    { border-left-color: #a5b4fc; background: #eef2ff; }
.gs-tl-hearing .gs-tl-icon[b-j3x3fldi21] { color: #6366f1; }
.gs-tl-disengaged[b-j3x3fldi21] { border-left-color: #cbd5e1; background: #f8fafc; }
.gs-tl-disengaged .gs-tl-icon[b-j3x3fldi21] { color: #64748b; }
.gs-tl-activity[b-j3x3fldi21]   { border-left-color: #e5e7eb; background: #fafafa; }
.gs-tl-activity .gs-tl-icon[b-j3x3fldi21] { color: #9ca3af; }
.gs-tl-warning[b-j3x3fldi21]    { border-left-color: #fcd34d; background: #fffbeb; }
.gs-tl-warning .gs-tl-icon[b-j3x3fldi21] { color: #f59e0b; }
.gs-tl-danger[b-j3x3fldi21]     { border-left-color: #fca5a5; background: #fef2f2; }
.gs-tl-danger .gs-tl-icon[b-j3x3fldi21] { color: #ef4444; }

/* Red, raised "3D" close button — a solid darker bottom edge simulates depth; the button
   presses down (translateY) and flattens its shadow on :active. */
.gs-close-3d[b-j3x3fldi21] {
    background: #dc3545;
    color: #fff;
    font-weight: 700;
    border: none;
    border-radius: 0.45rem;
    box-shadow: 0 4px 0 #a11823, 0 6px 10px rgba(0, 0, 0, 0.28);
    transition: transform 0.06s ease, box-shadow 0.06s ease, background 0.12s ease;
}

.gs-close-3d:hover[b-j3x3fldi21] {
    background: #e4525f;
    color: #fff;
}

.gs-close-3d:active[b-j3x3fldi21] {
    transform: translateY(4px);
    box-shadow: 0 0 0 #a11823, 0 2px 4px rgba(0, 0, 0, 0.2);
}

.gs-close-3d:focus-visible[b-j3x3fldi21] {
    outline: 2px solid rgba(220, 53, 69, 0.5);
    outline-offset: 2px;
}

/* ---- open / close animation ---- */
.gs-backdrop[b-j3x3fldi21] { animation: gsFadeIn-b-j3x3fldi21 0.4s ease; }
.gs-backdrop.gs-closing[b-j3x3fldi21] { animation: gsFadeOut-b-j3x3fldi21 0.38s ease forwards; }

/* Slower, more pronounced entrance with a slight overshoot. */
.gs-dialog[b-j3x3fldi21] { animation: gsZoomIn-b-j3x3fldi21 0.5s cubic-bezier(0.16, 0.84, 0.34, 1.12) both; }
/* Clearly visible exit: drops down + shrinks + fades. */
.gs-dialog.gs-closing[b-j3x3fldi21] { animation: gsZoomOut-b-j3x3fldi21 0.38s cubic-bezier(0.4, 0, 0.7, 0.2) forwards; }

/* results / profile fade in when they appear (and when switching picker <-> profile) */
.gs-fade[b-j3x3fldi21] { animation: gsFadeIn-b-j3x3fldi21 0.3s ease; }

@keyframes gsFadeIn-b-j3x3fldi21 { from { opacity: 0; } to { opacity: 1; } }
@keyframes gsFadeOut-b-j3x3fldi21 { from { opacity: 1; } to { opacity: 0; } }
@keyframes gsZoomIn-b-j3x3fldi21 {
    from { opacity: 0; transform: translateY(-40px) scale(0.85); }
    60% { opacity: 1; }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes gsZoomOut-b-j3x3fldi21 {
    from { opacity: 1; transform: translateY(0) scale(1); }
    to { opacity: 0; transform: translateY(60px) scale(0.85); }
}

/* ---- "searching" working indicator ---- */
.gs-progress[b-j3x3fldi21] {
    height: 3px;
    border-radius: 3px;
    background: rgba(var(--cl-primary-rgb, 13, 110, 253), 0.12);
    overflow: hidden;
}
.gs-progress-bar[b-j3x3fldi21] {
    height: 100%;
    width: 40%;
    border-radius: 3px;
    background: var(--cl-primary, #0d6efd);
    animation: gsSlide-b-j3x3fldi21 1.05s ease-in-out infinite;
}
@keyframes gsSlide-b-j3x3fldi21 {
    0% { margin-left: -42%; }
    100% { margin-left: 100%; }
}

/* animated trailing "…" */
.gs-dots[b-j3x3fldi21]::after {
    content: "";
    display: inline-block;
    width: 1.1em;
    text-align: left;
    animation: gsDots-b-j3x3fldi21 1.2s steps(1, end) infinite;
}
@keyframes gsDots-b-j3x3fldi21 {
    0% { content: ""; }
    25% { content: "."; }
    50% { content: ".."; }
    75% { content: "..."; }
    100% { content: ""; }
}

@media (prefers-reduced-motion: reduce) {
    .gs-backdrop[b-j3x3fldi21], .gs-backdrop.gs-closing[b-j3x3fldi21], .gs-dialog[b-j3x3fldi21], .gs-dialog.gs-closing[b-j3x3fldi21], .gs-fade[b-j3x3fldi21],
    .gs-progress-bar[b-j3x3fldi21], .gs-dots[b-j3x3fldi21]::after { animation: none; }
}
