/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* App shell: sidebar + sticky top bar + content. Tokens only (the-couturier). */
.layout-root[b-6btkyuxcq2] {
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    background: var(--ap-bg);
}

.layout-root > .row[b-6btkyuxcq2] {
    flex: 1;
    min-height: 100vh;
    display: flex;
    flex-wrap: nowrap;
}

main[b-6btkyuxcq2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    min-width: 0; /* prevents wide grids pushing the layout */
}

.sidebar[b-6btkyuxcq2] {
    background: var(--ap-surface);
    border-right: 1px solid var(--ap-line);
}

/* Top bar: translucent paper with blur, so content scrolls softly underneath. */
.top-row[b-6btkyuxcq2] {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ap-space-4);
    height: var(--ap-topbar-height);
    padding: 0 var(--ap-gutter);
    background: color-mix(in srgb, var(--ap-bg) 82%, transparent);
    backdrop-filter: saturate(1.4) blur(12px);
    -webkit-backdrop-filter: saturate(1.4) blur(12px);
    border-bottom: 1px solid var(--ap-line);
    flex-shrink: 0;
}

.top-row-end[b-6btkyuxcq2] {
    display: flex;
    align-items: center;
    gap: var(--ap-space-4);
}

.top-row-link[b-6btkyuxcq2] {
    color: var(--ap-ink-muted);
    font-size: var(--ap-text-sm);
    font-weight: 500;
    white-space: nowrap;
}

.top-row-link:hover[b-6btkyuxcq2] {
    color: var(--ap-ink);
    text-decoration: none;
}

.main-section[b-6btkyuxcq2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: var(--ap-space-5) var(--ap-gutter) var(--ap-space-7);
}

.layout-root .content[b-6btkyuxcq2] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* Phone: the sidebar becomes a top bar with the menu button; the menu unfolds below it (NavMenu). */
@media (max-width: 640.98px) {
    .layout-root > .row[b-6btkyuxcq2] {
        flex-direction: column;
    }

    .sidebar[b-6btkyuxcq2] {
        position: sticky;
        top: 0;
        z-index: 1030;
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid var(--ap-line);
    }

    .top-row[b-6btkyuxcq2] {
        position: static;
        height: auto;
        padding: var(--ap-space-2) var(--ap-gutter);
    }

    .top-row-start[b-6btkyuxcq2] {
        display: none;
    }

    .top-row-end[b-6btkyuxcq2] {
        width: 100%;
        justify-content: space-between;
    }

    .main-section[b-6btkyuxcq2] {
        padding-top: var(--ap-space-4);
    }
}

@media (min-width: 641px) {
    .sidebar[b-6btkyuxcq2] {
        width: var(--ap-sidebar-width);
        height: 100vh;
        position: sticky;
        top: 0;
        flex: 0 0 var(--ap-sidebar-width);
        max-width: var(--ap-sidebar-width);
    }
}

/* Non-production marker (acceptance/test/development): striped so it is never mistaken for production. */
.environment-bar[b-6btkyuxcq2] {
    background: repeating-linear-gradient(135deg, var(--ap-warning-soft), var(--ap-warning-soft) 12px,
                                          var(--ap-surface-2) 12px, var(--ap-surface-2) 24px);
    color: var(--ap-warning);
    border-bottom: 1px solid var(--ap-warning-line);
    font-size: var(--ap-text-xs);
    letter-spacing: .01em;
    overflow-wrap: anywhere; /* long database/server names wrap instead of being cut off on phones */
    padding-inline: var(--ap-space-3);
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* Sidebar navigation. Tokens only (the-couturier). Links render inside NavLink (a child component), hence ::deep. */

/* ---------- Brand row (also the phone top bar) ---------- */
.nav-brand-row[b-8ljhiwxq0t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--ap-topbar-height);
    padding: 0 var(--ap-space-4) 0 var(--ap-space-5);
    border-bottom: 1px solid var(--ap-line);
}

.nav-brand[b-8ljhiwxq0t] {
    display: inline-flex;
    align-items: center;
    gap: var(--ap-space-3);
    color: var(--ap-ink);
    text-decoration: none;
}

.nav-brand:hover[b-8ljhiwxq0t] {
    color: var(--ap-ink);
    text-decoration: none;
}

/* The logo (wwwroot/favicon.svg, same as the tab icon). In dark mode its ink tile meets a dark surface, so a hairline keeps its edge. */
.nav-brand-mark[b-8ljhiwxq0t] {
    display: block;
    width: 2rem;
    height: 2rem;
    border-radius: var(--ap-radius-sm);
    transition: transform var(--ap-dur) var(--ap-ease);
}

:root[data-theme="dark"] .nav-brand-mark[b-8ljhiwxq0t] {
    box-shadow: 0 0 0 1px var(--ap-line-strong);
}

.nav-brand:hover .nav-brand-mark[b-8ljhiwxq0t] {
    transform: rotate(-12deg);
}

.nav-brand-text[b-8ljhiwxq0t] {
    font-family: var(--ap-font-heading);
    font-size: var(--ap-text-md);
    font-weight: var(--ap-weight-strong);
    letter-spacing: var(--ap-tracking-heading);
}

.nav-brand-text span[b-8ljhiwxq0t] {
    font-weight: 400;
    color: var(--ap-ink-muted);
}

.nav-toggler[b-8ljhiwxq0t] {
    display: none;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid var(--ap-line);
    border-radius: var(--ap-radius-pill);
    background: var(--ap-surface);
    color: var(--ap-ink);
    font-size: 1.2rem;
    cursor: pointer;
    transition: background-color var(--ap-dur-fast) var(--ap-ease);
}

.nav-toggler:hover[b-8ljhiwxq0t] {
    background: var(--ap-surface-2);
}

/* ---------- Menu container ---------- */
.nav-scrollable[b-8ljhiwxq0t] {
    display: none;
    width: 100%;
    padding: var(--ap-space-4) var(--ap-space-3);
}

@media (max-width: 640.98px) {
    .nav-toggler[b-8ljhiwxq0t] {
        display: inline-flex;
    }

    .nav-scrollable[data-open="true"][b-8ljhiwxq0t] {
        display: block;
        max-height: calc(100vh - var(--ap-topbar-height));
        overflow-y: auto;
        border-bottom: 1px solid var(--ap-line);
        animation: nav-drop-b-8ljhiwxq0t var(--ap-dur) var(--ap-ease-out);
    }
}

@media (min-width: 641px) {
    .nav-scrollable[b-8ljhiwxq0t] {
        display: block;
        height: calc(100vh - var(--ap-topbar-height));
        overflow-y: auto;
    }
}

@keyframes nav-drop-b-8ljhiwxq0t {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: none; }
}

.nav-menu[b-8ljhiwxq0t] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* ---------- Rows: links and group headers share one style ---------- */
.nav-menu[b-8ljhiwxq0t]  .nav-link,
.nav-group-title[b-8ljhiwxq0t] {
    position: relative;
    display: flex;
    align-items: center;
    gap: var(--ap-space-3);
    width: 100%;
    padding: .55rem .8rem;
    border: none;
    border-radius: var(--ap-radius-pill);
    background: transparent;
    color: var(--ap-ink-muted);
    font-size: var(--ap-text-sm);
    font-weight: 500;
    line-height: 1.25rem;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--ap-dur-fast) var(--ap-ease), color var(--ap-dur-fast) var(--ap-ease),
                transform var(--ap-dur) var(--ap-ease);
}

.nav-menu[b-8ljhiwxq0t]  .nav-link i,
.nav-group-title i[b-8ljhiwxq0t] {
    width: 1.25rem;
    font-size: 1rem;
    text-align: center;
    flex-shrink: 0;
    color: var(--ap-ink-subtle);
    transition: color var(--ap-dur-fast) var(--ap-ease);
}

.nav-menu[b-8ljhiwxq0t]  .nav-link:hover,
.nav-menu[b-8ljhiwxq0t]  .nav-link:focus-visible,
.nav-group-title:hover[b-8ljhiwxq0t],
.nav-group-title:focus-visible[b-8ljhiwxq0t] {
    background-color: var(--ap-surface-2);
    color: var(--ap-ink);
    text-decoration: none;
}

.nav-menu[b-8ljhiwxq0t]  .nav-link:hover i,
.nav-group-title:hover i[b-8ljhiwxq0t] {
    color: var(--ap-ink-muted);
}

/* Active: ink pill with a brass icon, the reference's dark pill. */
.nav-menu[b-8ljhiwxq0t]  .nav-link.active {
    background: var(--ap-ink);
    color: var(--ap-ink-inverse);
}

.nav-menu[b-8ljhiwxq0t]  .nav-link.active i {
    color: var(--ap-accent);
}

/* ---------- Groups: <details>/<summary> unfold without any script ---------- */
.nav-group-title[b-8ljhiwxq0t] {
    list-style: none;
}

.nav-group-title[b-8ljhiwxq0t]::-webkit-details-marker {
    display: none;
}

.nav-group-title .nav-chevron[b-8ljhiwxq0t] {
    margin-left: auto;
    font-size: .7rem;
    transition: transform var(--ap-dur) var(--ap-ease);
}

.nav-group[open] > .nav-group-title .nav-chevron[b-8ljhiwxq0t] {
    transform: rotate(180deg);
}

.nav-group[open] > .nav-group-title[b-8ljhiwxq0t] {
    color: var(--ap-ink);
}

.nav-group-items[b-8ljhiwxq0t] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 2px 0 var(--ap-space-2) 1.35rem;
    padding-left: var(--ap-space-2);
    border-left: 1px solid var(--ap-line);
}

.nav-group[open] > .nav-group-items[b-8ljhiwxq0t] {
    animation: nav-drop-b-8ljhiwxq0t var(--ap-dur) var(--ap-ease-out);
}

.nav-group-items form[b-8ljhiwxq0t] {
    margin: 0;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-c9tmw0yb3o],
.components-reconnect-repeated-attempt-visible[b-c9tmw0yb3o],
.components-reconnect-failed-visible[b-c9tmw0yb3o],
.components-pause-visible[b-c9tmw0yb3o],
.components-resume-failed-visible[b-c9tmw0yb3o],
.components-rejoining-animation[b-c9tmw0yb3o] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-retrying[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-failed[b-c9tmw0yb3o],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-c9tmw0yb3o] {
    display: block;
}


#components-reconnect-modal[b-c9tmw0yb3o] {
    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-c9tmw0yb3o 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-c9tmw0yb3o 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-c9tmw0yb3o 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-c9tmw0yb3o]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-c9tmw0yb3o 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-c9tmw0yb3o {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-c9tmw0yb3o {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-c9tmw0yb3o {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-c9tmw0yb3o] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-c9tmw0yb3o] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-c9tmw0yb3o] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-c9tmw0yb3o] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-c9tmw0yb3o] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-c9tmw0yb3o] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-c9tmw0yb3o] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-c9tmw0yb3o 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-c9tmw0yb3o] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-c9tmw0yb3o {
    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/Auctions.razor.rz.scp.css */
/* Center Syncfusion dialogs for this component via CssClass="centered-dialog" */
.centered-dialog[b-ngw4rkqc5a] {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  z-index: 2000 !important;
}

/* Ensure overlay sits behind the dialog */
.e-dlg-overlay[b-ngw4rkqc5a] {
  z-index: 1995 !important;
}

/* Tweak for the smaller confirm/delete dialog */
.centered-confirm-dialog[b-ngw4rkqc5a] {
  width: 400px !important;
  max-width: 90% !important;
}
/* /Components/Pages/Home.razor.rz.scp.css */
.home-section[b-7krbcvhb2j] {
    margin: var(--ap-space-6) 0;
}

.home-section-head[b-7krbcvhb2j] {
    display: flex;
    align-items: baseline;
    gap: var(--ap-space-3);
    margin-bottom: var(--ap-space-4);
}

.home-section-head h2[b-7krbcvhb2j] {
    display: inline-flex;
    align-items: center;
    gap: var(--ap-space-2);
    font-size: var(--ap-text-xl);
    margin: 0;
}

.home-state[b-7krbcvhb2j] {
    padding: var(--ap-space-5);
    border: 1px dashed var(--ap-line-strong);
    border-radius: var(--ap-radius);
    text-align: center;
}

/* Cards flow 1 / 2 / 3 / 4 across as the screen widens. */
.auction-card-grid[b-7krbcvhb2j] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
    gap: var(--ap-space-4);
}

/* Hero: generous on desktop, compact on a phone so "Live now" is visible without scrolling far. */
.home-hero[b-7krbcvhb2j] {
    padding: var(--ap-space-5) var(--ap-space-4);
    background: linear-gradient(180deg, var(--ap-surface) 0%, var(--ap-surface-2) 100%);
    border: 1px solid var(--ap-line);
}

.home-hero h1[b-7krbcvhb2j] {
    font-family: var(--ap-font-heading);
    font-size: clamp(1.75rem, 1.2rem + 2.6vw, 3.25rem);
    font-weight: 400;
    letter-spacing: -.03em;
    margin-bottom: var(--ap-space-3);
}

.home-hero .lead[b-7krbcvhb2j] {
    font-size: var(--ap-text-base);
    max-width: 46rem;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .home-hero[b-7krbcvhb2j] {
        padding: var(--ap-space-7) var(--ap-space-6);
    }

    .home-hero .lead[b-7krbcvhb2j] {
        font-size: var(--ap-text-md);
    }
}
/* /Components/Pages/Pedigree.razor.rz.scp.css */
/* Pedigree explorer: fits the viewport on desktop (the-curator). Tokens only (the-couturier). */
.pedigree-page[b-siuu2rnoo3] {
    --pedigree-chrome: calc(var(--ap-topbar-height) + var(--ap-space-5) + var(--ap-space-4));
    display: flex;
    flex-direction: column;
    gap: var(--ap-space-2);
}

.pedigree-toolbar[b-siuu2rnoo3],
.pedigree-filters[b-siuu2rnoo3] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ap-space-2);
}

.pedigree-search[b-siuu2rnoo3] {
    max-width: 26rem;
}

.pedigree-stable[b-siuu2rnoo3] {
    width: 16rem;
    max-width: 100%;
}

.pedigree-body[b-siuu2rnoo3] {
    display: grid;
    grid-template-columns: minmax(16rem, 1fr) minmax(0, 2.4fr);
    gap: var(--ap-space-3);
    min-height: 0;
}

.pedigree-panel[b-siuu2rnoo3] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--ap-surface);
    border: 1px solid var(--ap-line);
    border-radius: var(--ap-radius);
    overflow: hidden;
}

.pedigree-panel-header[b-siuu2rnoo3] {
    display: flex;
    align-items: center;
    gap: var(--ap-space-2);
    padding: var(--ap-space-2) var(--ap-space-3);
    border-bottom: 1px solid var(--ap-line);
    flex-shrink: 0;
}

.pedigree-scroll[b-siuu2rnoo3],
.pedigree-tab-body[b-siuu2rnoo3] {
    overflow: auto;
    min-height: 0;
}

.pedigree-detail[b-siuu2rnoo3] {
    display: flex;
    flex-direction: column;
    gap: var(--ap-space-2);
    min-height: 0;
}

.pedigree-head[b-siuu2rnoo3] {
    padding: var(--ap-space-2) var(--ap-space-3);
    gap: var(--ap-space-1);
    flex-shrink: 0;
}

/* Sold as lot: most important, always visible, a few rows high. */
.pedigree-sold[b-siuu2rnoo3] {
    flex-shrink: 0;
}

/* The grid inside sizes itself (SoldHeight) and scrolls its own rows: no second scrollbar around it. */
.pedigree-sold-body[b-siuu2rnoo3] {
    min-height: 0;
}

.pedigree-list .pedigree-scroll[b-siuu2rnoo3] {
    flex: 1;
}

.pedigree-list[b-siuu2rnoo3] {
    position: relative;
}

/* Busy overlay over the list while a search or filter is applied. Fades in late so a quick update does not blink. */
.pedigree-busy[b-siuu2rnoo3] {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: var(--ap-space-7);
    background: color-mix(in srgb, var(--ap-surface) 70%, transparent);
    animation: pedigree-busy-in-b-siuu2rnoo3 0.2s ease 0.15s both;
}

@keyframes pedigree-busy-in-b-siuu2rnoo3 {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .pedigree-busy[b-siuu2rnoo3] {
        animation: none;
    }
}

/* Desktop: lock the page to the viewport; panels scroll inside. Below lg the page simply scrolls. */
@media (min-width: 992px) {
    .pedigree-page[b-siuu2rnoo3] {
        height: calc(100dvh - var(--pedigree-chrome) - var(--pedigree-envbar, 0px));
    }

    .pedigree-body[b-siuu2rnoo3] {
        flex: 1;
    }

    .pedigree-tabs[b-siuu2rnoo3] {
        flex: 1;
    }

    .pedigree-tabs[b-siuu2rnoo3]  .e-tab {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .pedigree-tabs[b-siuu2rnoo3]  .e-tab > .e-content {
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }

    .pedigree-tabs[b-siuu2rnoo3]  .e-tab > .e-content > .e-item,
    .pedigree-tabs[b-siuu2rnoo3]  .pedigree-tab-body {
        height: 100%;
    }
}

@media (max-width: 991.98px) {
    .pedigree-body[b-siuu2rnoo3] {
        grid-template-columns: 1fr;
    }

    .pedigree-list .pedigree-scroll[b-siuu2rnoo3] {
        max-height: 18rem;
    }

    /* A fixed height (not max-height): grids with Height 100% need a sized parent to virtualize. */
    .pedigree-tab-body[b-siuu2rnoo3] {
        height: 24rem;
    }
}

/* Non-production shows an environment bar above the app; leave room for it. */
.layout-root:has(.environment-bar) .pedigree-page[b-siuu2rnoo3] {
    --pedigree-envbar: 1.75rem;
}
/* /Components/Shared/AuctionCard.razor.rz.scp.css */
.auction-card[b-1dvj5lk444] {
    color: var(--ap-ink);
    text-decoration: none;
}

.auction-card:hover[b-1dvj5lk444] {
    color: var(--ap-ink);
    text-decoration: none;
}

.auction-card.is-live[b-1dvj5lk444] {
    border-top: 3px solid var(--ap-live);
}

.auction-card-status[b-1dvj5lk444] {
    display: inline-flex;
    align-items: center;
    gap: var(--ap-space-2);
    font-size: var(--ap-text-xs);
    font-weight: var(--ap-weight-strong);
    letter-spacing: .06em;
    text-transform: uppercase;
}

.auction-card-title[b-1dvj5lk444] {
    font-size: var(--ap-text-md);
    font-weight: var(--ap-weight-strong);
    letter-spacing: -.01em;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.auction-card-when[b-1dvj5lk444] {
    font-size: var(--ap-text-sm);
}

.auction-card-stats[b-1dvj5lk444] {
    display: flex;
    gap: var(--ap-space-5);
    margin: 0;
    padding-top: var(--ap-space-3);
    border-top: 1px solid var(--ap-line);
}

.auction-card-stats dt[b-1dvj5lk444] {
    font-size: var(--ap-text-xs);
    font-weight: var(--ap-weight-strong);
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--ap-ink-muted);
}

.auction-card-stats dd[b-1dvj5lk444] {
    margin: 0;
    font-family: var(--ap-font-heading);
    font-size: var(--ap-text-lg);
    font-variant-numeric: tabular-nums;
}
/* /Components/Shared/Dashboard/Dashboard.razor.rz.scp.css */
.dashboard-container[b-0x5dxc5kfm] {
    width: 100%;
    height: 100%;
    user-select: none;
}

.dashboard-toolbar[b-0x5dxc5kfm] {
    padding: 15px 0;
    margin-bottom: 20px;
    border-bottom: 2px solid var(--ap-line);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.device-indicator[b-0x5dxc5kfm] {
    display: inline-flex;
    align-items: center;
}

.device-indicator .badge[b-0x5dxc5kfm] {
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.device-indicator .bi[b-0x5dxc5kfm] {
    font-size: 1rem;
}

.dashboard-layout[b-0x5dxc5kfm] {
    position: relative;
    background: var(--ap-surface-2);
    border: 2px dashed transparent;
    border-radius: 8px;
    overflow: hidden;
    transition: min-width 0.3s ease, min-height 0.3s ease;
    /* Prevent default touch behaviors that interfere with dragging */
    touch-action: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.dashboard-layout.edit-mode[b-0x5dxc5kfm] {
    border-color: var(--ap-accent);
    background: linear-gradient(45deg, var(--ap-surface-2) 25%, transparent 25%), 
                linear-gradient(-45deg, var(--ap-surface-2) 25%, transparent 25%), 
                linear-gradient(45deg, transparent 75%, var(--ap-surface-2) 75%), 
                linear-gradient(-45deg, transparent 75%, var(--ap-surface-2) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.empty-dashboard[b-0x5dxc5kfm] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.dashboard-panel[b-0x5dxc5kfm] {
    border: 2px solid var(--ap-line);
    background: var(--ap-surface);
    border-radius: 12px;
    box-shadow: var(--ap-shadow-1);
    overflow: hidden;
    transition: all 0.2s ease;
    /* Improved touch handling */
    touch-action: none;
}

.dashboard-panel:hover[b-0x5dxc5kfm] {
    box-shadow: var(--ap-shadow-2);
}

.dashboard-panel.editable[b-0x5dxc5kfm] {
    border-color: var(--ap-accent);
}

.dashboard-panel.editable:hover[b-0x5dxc5kfm] {
    border-color: var(--ap-accent-hover);
    transform: translateY(-2px);
}

.dashboard-panel.dragging[b-0x5dxc5kfm] {
    z-index: 1000 !important;
    transform: rotate(2deg) scale(1.02);
    box-shadow: var(--ap-shadow-3);
    border-color: var(--ap-accent-hover);
    opacity: 0.9;
    transition: none; /* Disable transitions during drag */
}

.dashboard-panel.resizing[b-0x5dxc5kfm] {
    z-index: 1000 !important;
    border-color: var(--ap-live);
    box-shadow: 0 8px 16px var(--ap-live-soft);
    transition: none; /* Disable transitions during resize */
}

.dashboard-panel.pushed[b-0x5dxc5kfm] {
    z-index: 100 !important;
    border-color: var(--ap-danger);
    box-shadow: 0 6px 12px var(--ap-danger-soft);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* Smooth push animation */
}

.dashboard-panel.pushed[b-0x5dxc5kfm]::before {
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border: 2px solid var(--ap-danger);
    border-radius: 15px;
    opacity: 0.6;
    animation: pushPulse-b-0x5dxc5kfm 0.6s ease-in-out;
    pointer-events: none;
    z-index: -1;
}

@keyframes pushPulse-b-0x5dxc5kfm {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.4;
    }
    100% {
        transform: scale(1);
        opacity: 0.6;
    }
}

.dashboard-panel.resizing .resize-handle[b-0x5dxc5kfm] {
    background-color: var(--ap-live) !important;
    opacity: 1 !important;
    transform: scale(1.2);
}

.panel-header[b-0x5dxc5kfm] {
    background: var(--ap-surface-2);
    border-bottom: 1px solid var(--ap-line);
    padding: 10px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    font-size: 14px;
    min-height: 41px;
    /* Enhanced touch support */
    touch-action: none;
}

.panel-header.draggable-header[b-0x5dxc5kfm] {
    cursor: move;
    /* Better touch indication */
    position: relative;
}

.panel-header.draggable-header:hover[b-0x5dxc5kfm] {
    background: var(--ap-surface-sunken);
}

.panel-header.draggable-header:active[b-0x5dxc5kfm] {
    cursor: grabbing;
}

/* Touch-specific styles */
@media (hover: none) and (pointer: coarse) {
    .panel-header.draggable-header[b-0x5dxc5kfm] {
        /* Larger touch target for mobile */
        min-height: 48px;
        padding: 12px 15px;
    }
    
    .resize-handle[b-0x5dxc5kfm] {
        /* Larger resize handle for touch devices */
        width: 24px !important;
        height: 24px !important;
    }
    
    .panel-controls .btn[b-0x5dxc5kfm] {
        /* Larger buttons for touch */
        min-width: 40px;
        min-height: 40px;
        padding: 8px;
    }
}

.panel-title[b-0x5dxc5kfm] {
    color: var(--ap-ink-muted);
    font-weight: 600;
    flex-grow: 1;
    pointer-events: none; /* Prevent text selection during drag */
}

.panel-controls[b-0x5dxc5kfm] {
    display: flex;
    gap: 5px;
    align-items: center;
    /* Allow interaction with control buttons */
    touch-action: auto;
}

.panel-controls .btn[b-0x5dxc5kfm] {
    pointer-events: auto;
    touch-action: auto;
}

.panel-content[b-0x5dxc5kfm] {
    padding: 15px;
    background: var(--ap-surface);
    /* Allow scrolling in panel content */
    touch-action: auto;
}

.default-content[b-0x5dxc5kfm] {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ap-ink-subtle);
    background: var(--ap-surface-2);
    border-radius: 6px;
}

.resize-handles[b-0x5dxc5kfm] {
    position: absolute;
    bottom: 0;
    right: 0;
    pointer-events: auto;
}

.resize-handle[b-0x5dxc5kfm] {
    position: absolute;
    background: var(--ap-accent);
    opacity: 0.8;
    transition: all 0.2s ease;
    pointer-events: auto;
    touch-action: none;
}

.resize-se[b-0x5dxc5kfm] {
    bottom: 0;
    right: 0;
    width: 16px;
    height: 16px;
    cursor: se-resize;
    clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
    border-radius: 0 0 10px 0;
}

.resize-handle:hover[b-0x5dxc5kfm] {
    opacity: 1;
    background: var(--ap-accent-hover);
    transform: scale(1.1);
}

.resize-handle:active[b-0x5dxc5kfm] {
    background: var(--ap-live);
    opacity: 1;
}

/* Dashboard expansion zones */
.dashboard-expansion-zones[b-0x5dxc5kfm] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 500;
}

.expansion-zone[b-0x5dxc5kfm] {
    position: absolute;
    background: var(--ap-accent-soft);
    border: 2px dashed var(--ap-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ap-accent);
    font-size: 24px;
    animation: expandPulse-b-0x5dxc5kfm 1s ease-in-out infinite alternate;
}

.expand-right[b-0x5dxc5kfm] {
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
}

.expand-bottom[b-0x5dxc5kfm] {
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
}

@keyframes expandPulse-b-0x5dxc5kfm {
    0% {
        opacity: 0.3;
        background: var(--ap-accent-soft);
    }
    100% {
        opacity: 0.7;
        background: var(--ap-accent-soft);
    }
}

/* Responsive Design */
@media (max-width: 768px) {
    .dashboard-toolbar[b-0x5dxc5kfm] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    
    .dashboard-toolbar .btn[b-0x5dxc5kfm],
    .dashboard-toolbar .dropdown[b-0x5dxc5kfm],
    .dashboard-toolbar .form-check[b-0x5dxc5kfm],
    .dashboard-toolbar .device-indicator[b-0x5dxc5kfm] {
        margin: 2px 0;
    }
    
    .device-indicator[b-0x5dxc5kfm] {
        justify-content: center;
    }
    
    .dashboard-panel.editable .panel-header[b-0x5dxc5kfm] {
        cursor: default;
    }
    
    .dashboard-layout.edit-mode[b-0x5dxc5kfm] {
        overflow-x: auto;
    }
}

@media (max-width: 576px) {
    .panel-header[b-0x5dxc5kfm] {
        padding: 8px 10px;
        font-size: 12px;
    }
    
    .panel-content[b-0x5dxc5kfm] {
        padding: 10px;
    }
}

/* Animation for smooth interactions */
@keyframes panelAppear-b-0x5dxc5kfm {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.dashboard-panel:not(.dragging):not(.resizing):not(.pushed)[b-0x5dxc5kfm] {
    animation: panelAppear-b-0x5dxc5kfm 0.3s ease-out;
}

/* Focus styles for accessibility */
.dashboard-panel:focus-within[b-0x5dxc5kfm] {
    outline: 2px solid var(--ap-accent);
    outline-offset: 2px;
}

.panel-controls .btn:focus[b-0x5dxc5kfm] {
    box-shadow: 0 0 0 0.2rem var(--ap-focus);
}

/* Ensure resize handle is always on top */
.resize-handles[b-0x5dxc5kfm] {
    z-index: 10;
}

.resize-handle[b-0x5dxc5kfm] {
    z-index: 11;
}

/* Improved drag handle styling */
.draggable-header[b-0x5dxc5kfm]::before {
    content: '⋮⋮';
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--ap-ink-subtle);
    font-size: 12px;
    line-height: 1;
    opacity: 0.5;
    pointer-events: none;
}

.draggable-header:hover[b-0x5dxc5kfm]::before {
    opacity: 0.8;
    color: var(--ap-ink-muted);
}

.draggable-header .panel-title[b-0x5dxc5kfm] {
    margin-left: 15px;
}
/* /Components/Shared/PedigreeTreeView.razor.rz.scp.css */
/* Pedigree tree: the horse left, parents to the right, sire above dam. Connectors are drawn with borders:
   each parent pair gets a bracket from the child's box. Colours come from the theme tokens (light and dark). */

.pt-toolbar[b-oz6wwe6pzc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-bottom: .75rem;
}

.pt-meta[b-oz6wwe6pzc] {
    color: var(--ap-ink-muted);
    font-size: var(--ap-text-sm);
}

/* Wide trees scroll inside the card, not the page. */
.pt-scroll[b-oz6wwe6pzc] {
    overflow-x: auto;
    padding-bottom: .25rem;
}

.pt-tree[b-oz6wwe6pzc] {
    display: flex;
    min-width: max-content;
}

.pt-node[b-oz6wwe6pzc] {
    display: flex;
    align-items: center;
}

.pt-box[b-oz6wwe6pzc] {
    width: 11.5rem;
    padding: .2rem 0 .3rem;
    border-bottom: 1px solid var(--ap-line-strong);
    line-height: 1.25;
}

.pt-root[b-oz6wwe6pzc] {
    width: 12.5rem;
}

.pt-root .pt-name[b-oz6wwe6pzc] {
    font-size: var(--ap-text-md);
}

.pt-name[b-oz6wwe6pzc] {
    font-weight: 600;
    color: var(--ap-ink);
    text-decoration: none;
    /* Long names wrap to a second line, never more. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: break-word;
}

a.pt-name:hover[b-oz6wwe6pzc],
a.pt-name:focus-visible[b-oz6wwe6pzc] {
    color: var(--ap-accent);
    text-decoration: underline;
}

.pt-details[b-oz6wwe6pzc] {
    display: block;
    min-height: 1.1em;
    color: var(--ap-ink-muted);
    font-size: var(--ap-text-xs);
}

.pt-unknown .pt-name[b-oz6wwe6pzc] {
    color: var(--ap-ink-subtle);
    font-weight: 400;
    font-style: italic;
}

.pt-unknown[b-oz6wwe6pzc] {
    border-bottom-style: dashed;
}

/* Parent pair: a horizontal stub from the box, then a bracket joining sire and dam. */
.pt-parents[b-oz6wwe6pzc] {
    position: relative;
    display: flex;
    flex-direction: column;
    padding-left: 1.25rem;
}

.pt-parents[b-oz6wwe6pzc]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: .625rem;
    border-top: 1px solid var(--ap-line-strong);
}

.pt-child[b-oz6wwe6pzc] {
    position: relative;
    padding: .35rem 0 .35rem .625rem;
}

.pt-child[b-oz6wwe6pzc]::before {
    content: "";
    position: absolute;
    left: -.625rem;
    top: 50%;
    width: 1.25rem;
    border-top: 1px solid var(--ap-line-strong);
}

.pt-child[b-oz6wwe6pzc]::after {
    content: "";
    position: absolute;
    left: -.625rem;
    height: 50%;
    border-left: 1px solid var(--ap-line-strong);
}

.pt-child:first-child[b-oz6wwe6pzc]::after {
    top: 50%;
}

.pt-child:last-child[b-oz6wwe6pzc]::after {
    top: 0;
}

/* Sire line and dam line lists. */
.pt-heading[b-oz6wwe6pzc] {
    font-size: var(--ap-text-sm);
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--ap-ink-muted);
    margin-bottom: .5rem;
}

.pt-line[b-oz6wwe6pzc] {
    list-style: none;
    padding: 0;
    margin: 0;
    border-left: 2px solid var(--ap-accent-line);
}

.pt-line > li[b-oz6wwe6pzc] {
    position: relative;
    padding: .25rem 0 .45rem .9rem;
}

.pt-line > li[b-oz6wwe6pzc]::before {
    content: "";
    position: absolute;
    left: -5px;
    top: .7rem;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--ap-surface);
    border: 2px solid var(--ap-accent);
}

.pt-line-gen[b-oz6wwe6pzc] {
    display: block;
    font-size: var(--ap-text-xs);
    color: var(--ap-ink-subtle);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.pt-line .pt-name[b-oz6wwe6pzc] {
    display: inline;
    white-space: normal;
}

.pt-line .pt-details[b-oz6wwe6pzc] {
    display: inline;
    margin-left: .35rem;
}

.pt-produce[b-oz6wwe6pzc] {
    font-size: var(--ap-text-xs);
    margin-top: .15rem;
}

@media (max-width: 575.98px) {
    .pt-box[b-oz6wwe6pzc] { width: 9.5rem; }
    .pt-root[b-oz6wwe6pzc] { width: 10rem; }
}

.pt-self[b-oz6wwe6pzc] {
    font-weight: 600;
}

/* Horses that appear more than once: the closer, the stronger the colour. Close repeats deserve a look; distant ones
   are common in sport horse breeding. */
.pt-repeat[b-oz6wwe6pzc] {
    padding-left: .4rem;
    border-left: 3px solid var(--pt-repeat-colour);
    background: var(--pt-repeat-soft);
}

.pt-close[b-oz6wwe6pzc] { --pt-repeat-colour: var(--ap-warning); --pt-repeat-soft: var(--ap-warning-soft); }
.pt-moderate[b-oz6wwe6pzc] { --pt-repeat-colour: var(--ap-info); --pt-repeat-soft: var(--ap-info-soft); }
.pt-distant[b-oz6wwe6pzc] { --pt-repeat-colour: var(--ap-line-strong); --pt-repeat-soft: transparent; }

.pt-repeat-badge[b-oz6wwe6pzc] {
    margin-left: .35rem;
    font-weight: 600;
    color: var(--pt-repeat-colour);
}

.pt-distant .pt-repeat-badge[b-oz6wwe6pzc] {
    color: var(--ap-ink-muted);
}

.pt-repeats[b-oz6wwe6pzc] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem;
    margin-top: .5rem;
    font-size: var(--ap-text-xs);
}

.pt-repeats-label[b-oz6wwe6pzc] {
    color: var(--ap-ink-muted);
}

.pt-repeat-chip[b-oz6wwe6pzc] {
    padding: .1rem .45rem;
    border-radius: 999px;
    border: 1px solid var(--pt-repeat-colour);
    background: var(--pt-repeat-soft);
    color: var(--ap-ink);
}
/* /Components/Shared/ThemeToggle.razor.rz.scp.css */
.theme-toggle[b-r67xjz9b4e] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    border-radius: var(--ap-radius-pill);
    background: var(--ap-surface-sunken);
    border: 1px solid var(--ap-line);
}

.theme-toggle-option[b-r67xjz9b4e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 1.75rem;
    border: 0;
    border-radius: var(--ap-radius-pill);
    background: transparent;
    color: var(--ap-ink-muted);
    font-size: .9rem;
    cursor: pointer;
    transition: background-color var(--ap-dur) var(--ap-ease), color var(--ap-dur-fast) var(--ap-ease),
                box-shadow var(--ap-dur) var(--ap-ease);
}

.theme-toggle-option:hover[b-r67xjz9b4e] {
    color: var(--ap-ink);
}

.theme-toggle-option[aria-pressed="true"][b-r67xjz9b4e] {
    background: var(--ap-surface);
    color: var(--ap-ink);
    box-shadow: var(--ap-shadow-1);
}

.theme-toggle-option:focus-visible[b-r67xjz9b4e] {
    outline: 2px solid var(--ap-accent);
    outline-offset: 1px;
}
/* /Components/Shared/WizardDialog.razor.rz.scp.css */
/* /Components/Wizards/AddAuctionWizard.razor.rz.scp.css */
/* Horse thumbnails in the preview grid (rendered inside AppGrid templates, hence ::deep). */
[b-yomvpx3e1x] .wizard-horse-thumb {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: var(--ap-radius-sm);
    border: 1px solid var(--ap-line);
}

[b-yomvpx3e1x] .wizard-horse-thumb-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ap-surface-sunken);
    color: var(--ap-ink-subtle);
}
