/* /Components/Layout/MainLayout.razor.rz.scp.css */

/* One-line footer, pinned to the bottom of the viewport.
   flex: 0 0 auto keeps it its natural height inside the .cc-layout column while .cc-content takes the
   remaining space and scrolls — so the bar never scrolls away, on a short page or a long one. */
.cc-footer[b-ymkv5utcwu] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 1rem;
    /* Right padding reserves the chat bubble's corner. ChatPanel is position:fixed at bottom/right 24px
       and 52px square, so it owns the last ~76px. While the footer scrolled with the page that collision
       was transient; pinned, the bubble would clip the tail of the company name and the SDS logo on
       every single portal page. Reserving the space here keeps the fix inside this layout rather than
       reaching across into another component's positioning. */
    padding: 0.55rem 5.5rem 0.55rem 1.25rem;
    font-size: 0.8rem;
    color: var(--cc-text-muted, #6b7280);
    background: var(--content-bg, #fff);
    border-top: 1px solid var(--cc-border, #e5e7eb);
}

    .cc-footer a[b-ymkv5utcwu] {
        color: inherit;
        text-decoration: none;
    }

    .cc-footer a:hover[b-ymkv5utcwu] {
        text-decoration: underline;
    }

    .cc-footer .cc-footer-sep[b-ymkv5utcwu] {
        margin: 0 0.5rem;
        opacity: 0.6;
    }

    /* Three zones: Stripe's badge left, policy links centred, our copyright hard right. The two ends
       size to their content and the links take what's left, so the bar reads as ours with Stripe
       credited rather than the two sharing a byline. */
    .cc-footer .cc-footer-links[b-ymkv5utcwu] {
        flex: 1 1 auto;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .cc-footer .cc-footer-stripe[b-ymkv5utcwu] {
        flex: 0 0 auto;
        line-height: 0;
    }

    .cc-footer .cc-footer-copyright[b-ymkv5utcwu] {
        flex: 0 0 auto;
        text-align: right;
        white-space: nowrap;
    }

    .cc-footer .cc-footer-stripe img[b-ymkv5utcwu] {
        height: 22px;
        width: auto;
        opacity: 0.75;
        transition: opacity 0.15s ease;
    }

    .cc-footer .cc-footer-stripe:hover img[b-ymkv5utcwu] {
        opacity: 1;
    }

    /* SDS logo reads as part of the company name, so it shares the link and sits on the text baseline.
       It trails the name — leading, it broke "© 2026 … Software Development Services" mid-phrase. */
    .cc-footer .cc-footer-company img[b-ymkv5utcwu] {
        height: 16px;
        width: auto;
        opacity: 0.6;
        vertical-align: text-bottom;
        margin-left: 6px;
    }

    .cc-footer .cc-footer-company:hover img[b-ymkv5utcwu] {
        opacity: 0.85;
    }

/* Below ~900px three zones on one line genuinely don't fit, so the row wraps and everything centres
   rather than the copyright being clipped at the right edge. */
@media (max-width: 900px) {
    .cc-footer[b-ymkv5utcwu] {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem;
        /* Same bubble reservation as desktop — it stays bottom-right at every width, and a wrapped
           footer is taller, so its last row runs further under it. */
        padding: 0.6rem 5rem 0.6rem 1rem;
    }

        .cc-footer .cc-footer-links[b-ymkv5utcwu] {
            flex: 1 0 100%;
            white-space: normal;
        }

        .cc-footer .cc-footer-copyright[b-ymkv5utcwu] {
            text-align: center;
            white-space: normal;
        }
}

#blazor-error-ui[b-ymkv5utcwu] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-ymkv5utcwu] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* ── Top nav bar ──────────────────────────────────────────────────── */
.cc-topnav[b-lxcswe8na0] {
    height: 58px;
    background: var(--sidebar-bg);
    display: flex;
    align-items: stretch;
    padding-left: 24px;
    padding-right: 20px;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

/* ── Brand ────────────────────────────────────────────────────────── */
.cc-topnav-brand[b-lxcswe8na0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 24px;
    border-right: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
    text-decoration: none;
}

.cc-topnav-name[b-lxcswe8na0] {
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
}

.cc-topnav-sub[b-lxcswe8na0] {
    color: rgba(255,255,255,.45);
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: .10em;
    font-weight: 600;
}

/* ── Nav items (desktop) ──────────────────────────────────────────── */
.cc-topnav-items[b-lxcswe8na0] {
    display: flex;
    align-items: stretch;
    flex: 1;
    padding-left: 4px;
}

[b-lxcswe8na0] .cc-tn-item {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 15px;
    height: 100%;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: rgba(255,255,255,.62);
    font-size: 13.5px;
    font-weight: 400;
    text-decoration: none;
    white-space: nowrap;
    transition: color .12s, border-color .12s, background .12s;
}

[b-lxcswe8na0] .cc-tn-item i {
    font-size: 14px;
    flex-shrink: 0;
}

[b-lxcswe8na0] .cc-tn-item:hover {
    color: rgba(255,255,255,.88);
    background: rgba(255,255,255,.07);
}

[b-lxcswe8na0] .cc-tn-item.active {
    color: #fff;
    font-weight: 600;
    border-bottom-color: var(--sidebar-active-bar);
}

[b-lxcswe8na0] .cc-tn-admin {
    opacity: .7;
}

/* Setup link — highlighted amber + pulsing when steps remain */
[b-lxcswe8na0] .cc-tn-setup-alert {
    color: #fbbf24 !important;
    font-weight: 600;
}

[b-lxcswe8na0] .cc-tn-setup-alert:hover {
    color: #fde68a !important;
    background: rgba(251,191,36,.12);
}

[b-lxcswe8na0] .cc-tn-setup-alert i {
    animation: setup-pulse-b-lxcswe8na0 2.4s ease-in-out infinite;
}

@keyframes setup-pulse-b-lxcswe8na0 {
    0%, 100% { opacity: 1; }
    50%       { opacity: .5; }
}

/* Setup link — green when all required steps are complete */
[b-lxcswe8na0] .cc-tn-setup-done {
    color: #4ade80 !important;
    font-weight: 600;
}

[b-lxcswe8na0] .cc-tn-setup-done:hover {
    color: #86efac !important;
    background: rgba(74,222,128,.12);
}

/* ── Right section ────────────────────────────────────────────────── */
.cc-topnav-right[b-lxcswe8na0] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding-left: 16px;
    border-left: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
}

[b-lxcswe8na0] .cc-tn-icon {
    color: rgba(255,255,255,.55);
    font-size: 17px;
    padding: 6px 7px;
    text-decoration: none;
    transition: color .12s;
    background: none;
    border: none;
    cursor: pointer;
    line-height: 1;
    display: flex;
    align-items: center;
    border-radius: var(--radius);
}

[b-lxcswe8na0] .cc-tn-icon:hover,
[b-lxcswe8na0] .cc-tn-icon.active { color: #fff; }

[b-lxcswe8na0] .cc-feedback-top-btn {
    color: rgba(255,255,255,.55);
}
[b-lxcswe8na0] .cc-feedback-top-btn:hover { color: #f4a261; }

.cc-topnav-avatar[b-lxcswe8na0] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    margin-left: 4px;
    flex-shrink: 0;
    cursor: default;
    user-select: none;
}

.cc-hamburger[b-lxcswe8na0] {
    display: none;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: rgba(255,255,255,.7);
    font-size: 20px;
    cursor: pointer;
    padding: 4px 6px;
    margin-left: 4px;
    border-radius: var(--radius);
    transition: color .12s;
}
.cc-hamburger:hover[b-lxcswe8na0] { color: #fff; }

/* ── Mobile drawer ────────────────────────────────────────────────── */
.cc-mobile-drawer[b-lxcswe8na0] {
    display: none;
    position: absolute;
    top: 58px;
    left: 0;
    right: 0;
    z-index: 99;
    background: var(--sidebar-bg);
    border-bottom: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 8px 24px rgba(0,0,0,.3);
}

.cc-mobile-drawer.open[b-lxcswe8na0] { display: block; }

[b-lxcswe8na0] .cc-drawer-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 20px;
    color: rgba(255,255,255,.65);
    text-decoration: none;
    font-size: 14px;
    border-left: 3px solid transparent;
    transition: background .1s;
    background: none;
    border-top: none;
    border-right: none;
    border-bottom: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    font-family: var(--font-sans);
}

[b-lxcswe8na0] .cc-drawer-item i { font-size: 15px; flex-shrink: 0; }

[b-lxcswe8na0] .cc-drawer-item:hover {
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.9);
}

[b-lxcswe8na0] .cc-drawer-item.active {
    color: #fff;
    font-weight: 600;
    border-left-color: var(--sidebar-active-bar);
    background: rgba(255,255,255,.1);
}

/* Setup link in mobile drawer — highlighted amber when steps remain */
[b-lxcswe8na0] .cc-drawer-setup-alert {
    color: #fbbf24 !important;
    font-weight: 600;
}

[b-lxcswe8na0] .cc-drawer-setup-alert:hover {
    color: #fde68a !important;
    background: rgba(251,191,36,.08);
}

[b-lxcswe8na0] .cc-drawer-setup-alert i {
    animation: setup-pulse-b-lxcswe8na0 2.4s ease-in-out infinite;
}

/* Setup link in mobile drawer — green when complete */
[b-lxcswe8na0] .cc-drawer-setup-done {
    color: #4ade80 !important;
    font-weight: 600;
}

[b-lxcswe8na0] .cc-drawer-setup-done:hover {
    color: #86efac !important;
    background: rgba(74,222,128,.08);
}

.cc-drawer-divider[b-lxcswe8na0] {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: rgba(255,255,255,.3);
    padding: 12px 20px 4px;
}

.cc-drawer-footer[b-lxcswe8na0] {
    border-top: 1px solid rgba(255,255,255,.1);
    padding: 6px 0;
}

.cc-drawer-settings[b-lxcswe8na0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    color: rgba(255,255,255,.5);
    font-size: 13.5px;
    text-decoration: none;
    transition: background .1s, color .1s;
    background: none;
    border: none;
    cursor: pointer;
    width: 100%;
    text-align: left;
    font-family: var(--font-sans);
}
.cc-drawer-settings:hover[b-lxcswe8na0] { color: rgba(255,255,255,.85); background: rgba(255,255,255,.05); }

.cc-drawer-feedback-btn[b-lxcswe8na0] { }

.cc-drawer-signout:hover[b-lxcswe8na0] { color: #ff8a80 !important; }

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    [b-lxcswe8na0] .cc-tn-item span { display: none; }
    [b-lxcswe8na0] .cc-tn-item       { padding: 0 10px; }
    .cc-topnav-subtitle[b-lxcswe8na0]      { display: none; }
}

@media (max-width: 639px) {
    .cc-topnav-items[b-lxcswe8na0]   { display: none; }
    .cc-hamburger[b-lxcswe8na0]      { display: flex; }
    .cc-topnav-settings[b-lxcswe8na0] { display: none; }
}

/* /Components/Layout/TenantSwitcher.razor.rz.scp.css */
.cc-tenant-switch[b-numjlv6pky] {
    position: relative;
    display: inline-flex;
}

.cc-tenant-btn[b-numjlv6pky] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 220px;
    padding: .35rem .6rem;
    background: var(--surface, #fff);
    border: 1px solid var(--border, #e2dbd0);
    border-radius: 8px;
    color: var(--text, #1c2a1e);
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .12s, background .12s;
}

.cc-tenant-btn:hover[b-numjlv6pky] { border-color: var(--accent, #d97746); }

.cc-tenant-label[b-numjlv6pky] {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}

.cc-tenant-caret[b-numjlv6pky] { font-size: .65rem; opacity: .6; }

.cc-tenant-menu[b-numjlv6pky] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 320px;
    max-width: 90vw;
    background: var(--surface, #fff);
    border: 1px solid var(--border, #e2dbd0);
    border-radius: 10px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .16);
    z-index: 1080;
    overflow: hidden;
}

.cc-tenant-search[b-numjlv6pky] { padding: .5rem; border-bottom: 1px solid var(--border, #e2dbd0); }

.cc-tenant-list[b-numjlv6pky] { max-height: 340px; overflow-y: auto; padding: .25rem; }

.cc-tenant-opt[b-numjlv6pky] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    width: 100%;
    text-align: left;
    padding: .4rem .55rem;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text, #1c2a1e);
    font-size: .82rem;
    cursor: pointer;
}

.cc-tenant-opt:hover[b-numjlv6pky] { background: var(--hover, #f4efe6); }

.cc-tenant-opt.active[b-numjlv6pky] {
    background: var(--accent, #d97746);
    color: #fff;
}

.cc-tenant-opt.active .cc-tenant-sub[b-numjlv6pky],
.cc-tenant-opt.active .text-muted[b-numjlv6pky] { color: rgba(255, 255, 255, .85) !important; }

.cc-tenant-name[b-numjlv6pky] { font-weight: 600; }
.cc-tenant-sub[b-numjlv6pky] { font-size: .72rem; color: var(--text-secondary, #4f6855); }

.cc-tenant-empty[b-numjlv6pky] {
    padding: .6rem .55rem;
    font-size: .8rem;
    color: var(--text-secondary, #4f6855);
}
