/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* MainLayout — app chrome. Depends on tokens defined in
   /wwwroot/css/theme.css. Do not introduce hard-coded hex
   values here; status colors flow from --status-* and brand
   colors from --brand-*. */

.web-app-shell[b-rcrf517nbc] {
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
}

.web-app-header[b-rcrf517nbc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.7rem;
    padding: 0.34rem 0.85rem;
    background:
        linear-gradient(180deg, color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface)) 0%, var(--surface) 92%),
        var(--surface);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    position: relative;
}

/* Thin brand stripe along the bottom of the header — anchors
   the eye at the top of every page. Gradient draws from the
   primary sea blue through the sky-glow highlight. */
.web-app-header[b-rcrf517nbc]::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 2px;
    background: linear-gradient(90deg,
        var(--brand-sea) 0%,
        var(--brand-glow) 50%,
        var(--brand-sea) 100%);
}

.web-app-brand[b-rcrf517nbc] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.web-app-brand__mark[b-rcrf517nbc] {
    width: 1.55rem;
    height: 1.55rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: var(--radius-sm);
    background: color-mix(in oklab, var(--brand-sea-soft) 80%, var(--surface));
    border: 1px solid color-mix(in oklab, var(--brand-sea) 22%, var(--border));
    box-shadow: inset 0 0 12px color-mix(in oklab, var(--brand-glow) 18%, transparent);
}
.web-app-brand__mark img[b-rcrf517nbc] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.web-app-brand__text[b-rcrf517nbc] {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}

.web-app-brand__name[b-rcrf517nbc] {
    font-family: var(--font-display);
    color: var(--text);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.01em;
}

.web-app-brand__tagline[b-rcrf517nbc] {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.6rem;
    line-height: 1.1;
}

.web-app-actions[b-rcrf517nbc] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.web-header-btn[b-rcrf517nbc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.34rem;
    min-height: 1.8rem;
    padding: 0.28rem 0.55rem;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.72rem;
    transition: border-color 120ms ease, background 120ms ease, transform 120ms ease;
}

.web-header-btn__icon[b-rcrf517nbc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 0.82rem;
    height: 0.82rem;
    font-size: 0.74rem;
    line-height: 1;
}

.web-header-btn:hover[b-rcrf517nbc] {
    border-color: color-mix(in oklab, var(--brand-sea) 40%, var(--border-strong));
    background: color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface));
    color: var(--text);
    transform: translateY(-1px);
}

.web-header-btn--primary[b-rcrf517nbc] {
    background: linear-gradient(180deg, var(--brand-sea) 0%, var(--brand-sea-ink) 100%);
    color: #fff;
    border-color: transparent;
    box-shadow: var(--shadow-sm);
}

.web-header-btn--primary:hover[b-rcrf517nbc] {
    color: #fff;
    filter: brightness(1.05);
    box-shadow: var(--shadow-md);
    background: linear-gradient(180deg, var(--brand-sea) 0%, var(--brand-sea-ink) 100%);
}

.web-header-btn--ghost[b-rcrf517nbc] {
    background: color-mix(in oklab, var(--surface) 82%, var(--bg));
}

/* Theme toggle — icon-only button that flips data-theme via
   a small client script (see MainLayout.razor). */
.web-theme-toggle[b-rcrf517nbc] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text-muted);
    cursor: pointer;
    transition: color 120ms ease, border-color 120ms ease, background 120ms ease;
}
.web-theme-toggle:hover[b-rcrf517nbc] {
    color: var(--brand-sea);
    border-color: color-mix(in oklab, var(--brand-sea) 45%, var(--border-strong));
    background: color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface));
}
.web-theme-toggle svg[b-rcrf517nbc] {
    width: 0.96rem;
    height: 0.96rem;
}

.web-utility-menu[b-rcrf517nbc] {
    position: relative;
}

.web-utility-menu[open][b-rcrf517nbc] {
    z-index: 30;
}

.web-utility-toggle[b-rcrf517nbc] {
    list-style: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    color: var(--text-muted);
    cursor: pointer;
    transition: color 120ms ease, border-color 120ms ease, background 120ms ease;
}

.web-utility-toggle[b-rcrf517nbc]::-webkit-details-marker {
    display: none;
}

.web-utility-toggle:hover[b-rcrf517nbc],
.web-utility-menu[open] > .web-utility-toggle[b-rcrf517nbc] {
    color: var(--brand-sea);
    border-color: color-mix(in oklab, var(--brand-sea) 45%, var(--border-strong));
    background: color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface));
}

.web-utility-toggle svg[b-rcrf517nbc] {
    width: 0.94rem;
    height: 0.94rem;
}

.web-utility-popover[b-rcrf517nbc] {
    position: absolute;
    right: 0;
    top: calc(100% + 0.45rem);
    min-width: 10rem;
    padding: 0.4rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background: var(--surface-raised);
    box-shadow: var(--shadow-md);
    display: grid;
    gap: 0.2rem;
}

.web-utility-link[b-rcrf517nbc] {
    display: flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.36rem 0.55rem;
    border-radius: var(--radius-sm);
    color: var(--text);
    text-decoration: none;
    font-size: 0.78rem;
    font-weight: 600;
}

.web-utility-link:hover[b-rcrf517nbc] {
    background: color-mix(in oklab, var(--brand-sea-soft) 52%, var(--surface));
    color: var(--brand-sea);
}

.web-utility-divider[b-rcrf517nbc] {
    /* Separates the "tool" section (Reports, Exports) from the
       "configuration" section (Settings, Company, Rooms, ...). Kept
       quiet so it reads as grouping rather than competing for
       attention. */
    margin: 0.28rem 0.15rem;
    border: none;
    border-top: 1px solid var(--border);
    opacity: 0.6;
}

.web-auth-chip[b-rcrf517nbc] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 1.8rem;
    padding: 0.2rem 0.3rem 0.2rem 0.55rem;
    border-radius: 999px;
    border: 1px solid var(--border-strong);
    background: color-mix(in oklab, var(--surface) 88%, var(--bg));
    font-size: 0.72rem;
    font-weight: 700;
}

.web-auth-chip form[b-rcrf517nbc] {
    margin: 0;
}

.web-auth-chip__action[b-rcrf517nbc] {
    border: 0;
    background: color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface));
    color: var(--brand-sea);
    border-radius: 999px;
    padding: 0.2rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
}

.web-content-shell[b-rcrf517nbc] {
    padding: 1rem 1rem 3rem;
    max-width: 1600px;
    margin: 0 auto;
}

.web-legacy-toolbar[b-rcrf517nbc] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.35rem 1rem 0.45rem;
    background: color-mix(in oklab, var(--surface) 88%, var(--bg));
    border-bottom: 1px solid var(--border);
}

.web-legacy-link[b-rcrf517nbc] {
    display: inline-flex;
    align-items: center;
    min-height: 1.75rem;
    padding: 0.24rem 0.62rem;
    border-radius: 999px;
    border: 1px solid color-mix(in oklab, var(--border-strong) 78%, transparent);
    background: color-mix(in oklab, var(--surface) 92%, var(--bg));
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.01em;
    transition: border-color 120ms ease, color 120ms ease, background 120ms ease, transform 120ms ease;
}

.web-legacy-link:hover[b-rcrf517nbc] {
    color: var(--brand-sea);
    border-color: color-mix(in oklab, var(--brand-sea) 36%, var(--border));
    background: color-mix(in oklab, var(--brand-sea-soft) 50%, var(--surface));
    transform: translateY(-1px);
}

.web-legacy-link.active[b-rcrf517nbc] {
    color: var(--text-inverse);
    border-color: transparent;
    background: linear-gradient(180deg, var(--brand-sea) 0%, var(--brand-sea-ink) 100%);
    box-shadow: var(--shadow-sm);
}

#blazor-error-ui[b-rcrf517nbc] {
    color-scheme: light only;
    background: var(--status-warning-soft);
    color: var(--status-warning-ink);
    bottom: 0;
    box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.75rem 1.25rem 0.85rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

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

@media (max-width: 720px) {
    .web-app-header[b-rcrf517nbc] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.5rem;
    }
    .web-app-actions[b-rcrf517nbc] {
        justify-content: space-between;
    }

    .web-legacy-toolbar[b-rcrf517nbc] {
        padding-top: 0.4rem;
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* NavMenu — tokenised. Active link now uses the brand-sea
   gradient instead of flat ink black; non-active links are
   muted until hover so the current page reads as the focal
   point. */

.web-module-nav[b-1tvai779q2] {
    display: flex;
    gap: 0.25rem;
    flex-wrap: wrap;
    padding: 0.55rem 1rem 0.65rem;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
}

.web-module-nav[b-1tvai779q2]  .web-module-link {
    display: inline-flex;
    align-items: center;
    min-height: 1.85rem;
    padding: 0.28rem 0.78rem;
    border-radius: 999px;
    color: var(--text-muted);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.8rem;
    line-height: 1;
    border: 1px solid transparent;
    transition: color 120ms ease, background 120ms ease, border-color 120ms ease;
}

.web-module-nav[b-1tvai779q2]  .web-module-link:hover {
    color: var(--brand-sea);
    background: color-mix(in oklab, var(--brand-sea-soft) 55%, var(--surface));
    border-color: color-mix(in oklab, var(--brand-sea) 22%, var(--border));
}

.web-module-nav[b-1tvai779q2]  a.active,
.web-module-nav[b-1tvai779q2]  a.active:hover,
.web-module-nav[b-1tvai779q2]  a.active:focus-visible {
    /* Single rule for active + active-hover + active-focus so the
       base .web-module-link:hover background can never blank out
       the gradient underneath the white text. */
    background: linear-gradient(180deg, var(--brand-sea) 0%, var(--brand-sea-ink) 100%);
    color: #ffffff;
    border-color: transparent;
    box-shadow: var(--shadow-sm);
}

.web-module-nav[b-1tvai779q2]  a.active:hover {
    filter: brightness(1.05);
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-lneei1k5q3],
.components-reconnect-repeated-attempt-visible[b-lneei1k5q3],
.components-reconnect-failed-visible[b-lneei1k5q3],
.components-pause-visible[b-lneei1k5q3],
.components-resume-failed-visible[b-lneei1k5q3],
.components-rejoining-animation[b-lneei1k5q3] {
    display: none;
}

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


#components-reconnect-modal[b-lneei1k5q3] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-lneei1k5q3 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-lneei1k5q3 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-lneei1k5q3 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-lneei1k5q3]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-lneei1k5q3 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-lneei1k5q3 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-lneei1k5q3 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-lneei1k5q3 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-lneei1k5q3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-lneei1k5q3] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-lneei1k5q3] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-lneei1k5q3] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-lneei1k5q3] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-lneei1k5q3] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-lneei1k5q3] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-lneei1k5q3 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-lneei1k5q3] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-lneei1k5q3 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* Home page scoped styles. Relies on the global tokens from
   /wwwroot/css/theme.css. */

.home-hero[b-1sivlem6g5] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 1fr);
    gap: 1.25rem;
    align-items: center;
    overflow: hidden;
}

.home-hero__copy[b-1sivlem6g5] {
    min-width: 0;
}

.home-hero__ctas[b-1sivlem6g5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1rem;
}

.home-hero__art[b-1sivlem6g5] {
    position: relative;
    display: grid;
    place-items: center;
    padding: 0.25rem;
    /* The shipped splash PNG is roughly 16:9 (about 1.9:1).
       Framing it via aspect-ratio keeps the hero panel a
       consistent shape while Grok / swap-in art may vary
       slightly in output dimensions. */
    aspect-ratio: 16 / 9;
    min-height: 14rem;
    max-height: 22rem;
    border-radius: var(--radius-md);
    overflow: hidden;
    /* Subtle tinted bed behind the image so a PNG with a
       transparent background still reads as a framed focal. */
    background:
        linear-gradient(180deg,
            color-mix(in oklab, var(--brand-sea-soft) 70%, var(--surface)) 0%,
            var(--surface) 100%);
    box-shadow: inset 0 0 0 1px var(--border);
}

.home-hero__art picture[b-1sivlem6g5],
.home-hero__art picture img[b-1sivlem6g5],
.home-hero__art > img[b-1sivlem6g5] {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: 50% 42%;
    /* Soft halo around the whole image so it feels lifted off
       the card; the inner glow in the artwork itself handles
       the rest. */
    filter: drop-shadow(0 18px 34px color-mix(in oklab, var(--brand-sea) 22%, transparent));
}

/* Collapse to single column on small screens — art goes
   underneath the copy so the call-to-action stays above the
   fold. */
@media (max-width: 900px) {
    .home-hero[b-1sivlem6g5] {
        grid-template-columns: 1fr;
    }
    .home-hero__art[b-1sivlem6g5] {
        order: 2;
    }
    .home-hero__copy[b-1sivlem6g5] {
        order: 1;
    }
}
/* /Components/Pages/Portal/Dashboard.razor.rz.scp.css */
/*
 * PBI #13780 / Task #13785 — portal theme polish.
 *
 * Scoped to Dashboard.razor + reused by PortalBidDetail/CommentThread
 * via deep selectors below. ALL colors via theme tokens — no hex.
 * The portal eventually serves logged-in customers; styling matches
 * the existing app shell (same theme.css tokens) so light + dark
 * theme parity is automatic.
 */

[b-0n0xvi9dk4] .portal-header {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

[b-0n0xvi9dk4] .portal-header__brand {
    min-width: 0;
}

[b-0n0xvi9dk4] .portal-header .app-headline {
    margin: 0.15rem 0 0.4rem;
}

[b-0n0xvi9dk4] .portal-rep-card {
    background: var(--brand-sea-soft);
    border: 1px solid var(--border);
    border-radius: 0.55rem;
    padding: 0.85rem 1rem;
    min-width: 14rem;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-rep-card__name {
    font-weight: 600;
    margin: 0.25rem 0 0.5rem;
    color: var(--brand-sea-ink);
}

[b-0n0xvi9dk4] .portal-rep-card p {
    margin: 0.15rem 0;
    font-size: 0.9rem;
}

[b-0n0xvi9dk4] .portal-link {
    color: var(--brand-sea);
    text-decoration: none;
}

[b-0n0xvi9dk4] .portal-link:hover {
    text-decoration: underline;
}

[b-0n0xvi9dk4] .portal-section {
    margin-bottom: 1.75rem;
}

[b-0n0xvi9dk4] .portal-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

[b-0n0xvi9dk4] .portal-section__title {
    margin: 0;
    font-size: 1.1rem;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-empty {
    padding: 1rem;
    color: var(--text-muted);
    font-style: italic;
    border: 1px dashed var(--border);
    border-radius: 0.5rem;
    text-align: center;
}

/* ── Bid card grid ─────────────────────────────────────── */

[b-0n0xvi9dk4] .portal-bid-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
    gap: 0.85rem;
}

[b-0n0xvi9dk4] .portal-bid-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0.55rem;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

[b-0n0xvi9dk4] .portal-bid-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

[b-0n0xvi9dk4] .portal-bid-card__link {
    display: block;
    padding: 0.95rem 1rem;
    color: var(--text);
    text-decoration: none;
}

[b-0n0xvi9dk4] .portal-bid-card__heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

[b-0n0xvi9dk4] .portal-bid-card__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

[b-0n0xvi9dk4] .portal-bid-card__meta {
    margin: 0 0 0.5rem;
    color: var(--text-muted);
    font-size: 0.85rem;
}

[b-0n0xvi9dk4] .portal-bid-card__cta {
    margin: 0;
    color: var(--brand-sea);
    font-size: 0.9rem;
    font-weight: 600;
}

/* ── Rep list ──────────────────────────────────────────── */

[b-0n0xvi9dk4] .portal-rep-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
    gap: 0.6rem;
}

[b-0n0xvi9dk4] .portal-rep-list__item {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0.45rem;
    padding: 0.75rem 0.9rem;
}

[b-0n0xvi9dk4] .portal-rep-list__name {
    margin: 0 0 0.2rem;
    font-weight: 600;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-rep-list__contact {
    margin: 0;
    font-size: 0.85rem;
    color: var(--text-muted);
}

/* ── Bid detail: rooms + line items ─────────────────────── */

[b-0n0xvi9dk4] .portal-room-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0.55rem;
    margin-bottom: 0.85rem;
    overflow: hidden;
}

[b-0n0xvi9dk4] .portal-room-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.65rem 1rem;
    background: var(--surface-sunken);
    border-bottom: 1px solid var(--border);
}

[b-0n0xvi9dk4] .portal-room-card__title {
    margin: 0;
    font-size: 0.95rem;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-room-card__total {
    font-weight: 600;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-line-items {
    list-style: none;
    margin: 0;
    padding: 0;
}

[b-0n0xvi9dk4] .portal-line-item {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.55rem 1rem;
    border-bottom: 1px solid var(--border);
}

[b-0n0xvi9dk4] .portal-line-item:last-child {
    border-bottom: none;
}

[b-0n0xvi9dk4] .portal-line-item__main {
    flex: 1 1 auto;
}

[b-0n0xvi9dk4] .portal-line-item__name {
    margin: 0;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-line-item__meta {
    margin: 0.15rem 0 0;
    font-size: 0.8rem;
    color: var(--text-muted);
}

[b-0n0xvi9dk4] .portal-line-item__price {
    margin: 0;
    flex: 0 0 auto;
    align-self: center;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

/* ── Comment thread ─────────────────────────────────────── */

[b-0n0xvi9dk4] .portal-comments {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 0.55rem;
    padding: 1rem;
}

[b-0n0xvi9dk4] .portal-comments__compose {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--border);
}

[b-0n0xvi9dk4] .portal-comments__label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-comments__name,
[b-0n0xvi9dk4] .portal-comments__body {
    width: 100%;
    padding: 0.5rem 0.65rem;
    border: 1px solid var(--border);
    border-radius: 0.4rem;
    background: var(--surface);
    color: var(--text);
    font: inherit;
}

[b-0n0xvi9dk4] .portal-comments__body {
    min-height: 5rem;
    resize: vertical;
}

[b-0n0xvi9dk4] .portal-comments__error {
    margin: 0;
    padding: 0.4rem 0.6rem;
    color: var(--status-danger-ink);
    background: var(--status-danger-soft);
    border-radius: 0.35rem;
    font-size: 0.85rem;
}

[b-0n0xvi9dk4] .portal-comments__actions {
    display: flex;
    justify-content: flex-end;
}

[b-0n0xvi9dk4] .portal-comments__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

[b-0n0xvi9dk4] .portal-comment {
    background: var(--surface-sunken);
    border-left: 3px solid var(--brand-sea);
    border-radius: 0.4rem;
    padding: 0.65rem 0.85rem;
}

[b-0n0xvi9dk4] .portal-comment--rep {
    border-left-color: var(--status-success);
    background: var(--status-success-soft);
}

[b-0n0xvi9dk4] .portal-comment__head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
}

[b-0n0xvi9dk4] .portal-comment__author {
    font-weight: 600;
    color: var(--text);
}

[b-0n0xvi9dk4] .portal-comment__when {
    margin-left: auto;
    color: var(--text-muted);
    font-size: 0.8rem;
}

[b-0n0xvi9dk4] .portal-comment__body {
    margin: 0;
    color: var(--text);
    white-space: pre-wrap;
}

/* ── Mobile carve ──────────────────────────────────────── */

@media (max-width: 720px) {
    [b-0n0xvi9dk4] .portal-header {
        grid-template-columns: 1fr;
    }

    [b-0n0xvi9dk4] .portal-rep-card {
        min-width: 0;
    }
}
/* /Components/Pages/Portal/Login.razor.rz.scp.css */
/*
 * PBI #13786 / Task #13787 — portal auth pages styles.
 * Scoped via Login.razor's component CSS but applied to siblings
 * (PasswordRequest.razor) via ::deep selectors. Theme tokens only.
 */

[b-5r1tlarazi] .portal-auth-shell {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 6rem);
    padding: 2rem 1rem;
}

[b-5r1tlarazi] .portal-auth-card {
    max-width: 30rem;
    width: 100%;
}

[b-5r1tlarazi] .portal-auth-form {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-top: 1rem;
}

[b-5r1tlarazi] .portal-auth-label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    margin-top: 0.4rem;
}

[b-5r1tlarazi] .portal-auth-input {
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: 0.4rem;
    background: var(--surface);
    color: var(--text);
    font: inherit;
}

[b-5r1tlarazi] .portal-auth-input:focus {
    outline: 2px solid var(--ring);
    outline-offset: 1px;
    border-color: var(--brand-sea);
}

[b-5r1tlarazi] .portal-auth-checkbox {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.35rem 0 0.6rem;
    font-size: 0.9rem;
    color: var(--text);
}

[b-5r1tlarazi] .portal-auth-banner {
    margin-top: 0.85rem;
    padding: 0.55rem 0.75rem;
    border-radius: 0.4rem;
    font-size: 0.9rem;
}

[b-5r1tlarazi] .portal-auth-banner--ok {
    background: var(--status-success-soft);
    color: var(--status-success-ink);
}

[b-5r1tlarazi] .portal-auth-banner--err {
    background: var(--status-danger-soft);
    color: var(--status-danger-ink);
}

[b-5r1tlarazi] .portal-auth-foot {
    margin: 1rem 0 0;
    text-align: center;
    font-size: 0.9rem;
}