@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Home/FeaturedEventsBlock.razor.rz.scp.css */
/* The home page's FEATURED EVENTS block (#7562). Moved here verbatim from Home.razor.css
   when the section became its own component. */

/* ============================================
   Featured event banners
   ============================================ */

.featured-events[b-nzlf7c920l] {
    max-width: 1200px;
    margin: 4rem auto 0 auto;
    padding: 0 4rem;
    display: grid;
    gap: 1.5rem;
}

.featured-event-card[b-nzlf7c920l] {
    display: grid;
    grid-template-columns: minmax(0, 280px) 1fr;
    gap: 0;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.featured-event-card[b-nzlf7c920l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--wheat-gold, #D4AF37) 0%, var(--cedar-green, #2D5016) 100%);
    z-index: 1;
}

.featured-event-card:hover[b-nzlf7c920l] {
    transform: translateY(-3px);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.1);
}

/* Featured event with no flyer collapses to a single column so the body
   isn't shoved into the right half of an empty 2-column grid. */
.featured-event-card-noflyer[b-nzlf7c920l] {
    grid-template-columns: 1fr;
}

.featured-flyer[b-nzlf7c920l] {
    background-size: cover;
    background-position: center;
    background-color: rgba(var(--cedar-green-rgb), 0.08);
    min-height: 220px;
}

.featured-body[b-nzlf7c920l] {
    padding: 1.75rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.featured-badge[b-nzlf7c920l] {
    display: inline-block;
    align-self: flex-start;
    padding: 0.25rem 0.625rem;
    background: var(--wheat-gold, #D4AF37);
    color: #111827;
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.featured-title[b-nzlf7c920l] {
    font-family: var(--font-display);
    font-size: 1.625rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    line-height: 1.15;
    text-transform: uppercase;
    letter-spacing: -0.01em;
}

.featured-meta[b-nzlf7c920l] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    color: #4b5563;
    font-size: 0.9375rem;
}

.featured-meta i[b-nzlf7c920l] {
    width: 16px;
    color: #9ca3af;
    margin-right: 0.375rem;
}

.featured-free[b-nzlf7c920l] {
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
}

.featured-description[b-nzlf7c920l] {
    margin: 0;
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.55;
}

.featured-cta[b-nzlf7c920l] {
    margin-top: auto;
    align-self: flex-start;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.875rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--cedar-green, #2D5016);
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
}

.featured-cta i[b-nzlf7c920l] {
    transition: transform 0.2s ease;
}

.featured-event-card:hover .featured-cta i[b-nzlf7c920l] {
    transform: translateX(3px);
}

@media (max-width: 768px) {
    .featured-events[b-nzlf7c920l] {
        padding: 0 1.5rem;
        margin-top: 3rem;
    }

    .featured-event-card[b-nzlf7c920l] {
        grid-template-columns: 1fr;
    }

    .featured-flyer[b-nzlf7c920l] {
        min-height: 160px;
    }

    .featured-body[b-nzlf7c920l] {
        padding: 1.25rem 1.25rem 1.5rem 1.25rem;
    }

    .featured-title[b-nzlf7c920l] {
        font-size: 1.375rem;
    }
}
/* /Components/Home/GroupCoachingBlock.razor.rz.scp.css */
/* The home page's GROUP COACHING block (#7562). Moved here verbatim from Home.razor.css
   when the section became its own component. */

/* ============================================
   GROUP COACHING SPOTLIGHT
   ============================================ */

.coaching-section[b-vvn7x68liv] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 8rem 4rem 0;
}

.coaching-intro[b-vvn7x68liv] {
    font-size: 1rem;
    line-height: 1.7;
    color: #6b7280;
    margin: 0 0 3rem 0;
    max-width: 700px;
}

.coaching-grid[b-vvn7x68liv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.coaching-card[b-vvn7x68liv] {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.coaching-card:hover[b-vvn7x68liv] {
    border-color: var(--cedar-green, #2D5016);
    transform: translateY(-2px);
}

.coaching-card-top[b-vvn7x68liv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.coaching-format[b-vvn7x68liv] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.6rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.format-inperson[b-vvn7x68liv] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
}

.format-online[b-vvn7x68liv] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    color: var(--wilson-blue, #4A6FA5);
}

.coaching-skill[b-vvn7x68liv] {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #b8941e;
    border-radius: 2px;
}

.coaching-card-title[b-vvn7x68liv] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem 0;
    line-height: 1.3;
}

.coaching-card-details[b-vvn7x68liv] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
}

.coaching-detail[b-vvn7x68liv] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6b7280;
}

.coaching-detail i[b-vvn7x68liv] {
    width: 14px;
    text-align: center;
    font-size: 0.75rem;
    color: #9ca3af;
}

.coaching-topics[b-vvn7x68liv] {
    font-size: 0.85rem;
    color: #6b7280;
    line-height: 1.5;
    margin: 0 0 auto 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.coaching-card-footer[b-vvn7x68liv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    gap: 0.5rem;
    flex-wrap: wrap;
}

.coaching-spots[b-vvn7x68liv] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
}

.coaching-spots.spots-full[b-vvn7x68liv] {
    color: #dc2626;
}

.coaching-price[b-vvn7x68liv] {
    font-size: 0.75rem;
    color: #9ca3af;
}

.coaching-cta[b-vvn7x68liv] {
    text-align: center;
    padding: 2rem 0;
}

.coaching-cta-link[b-vvn7x68liv] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green, #2D5016);
    padding: 0.75rem 2rem;
    border: 2px solid var(--cedar-green, #2D5016);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.coaching-cta-link:hover[b-vvn7x68liv] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
}

.coaching-cta-link i[b-vvn7x68liv] {
    font-size: 0.8em;
    transition: transform 0.3s ease;
}

.coaching-cta-link:hover i[b-vvn7x68liv] {
    transform: translateX(3px);
}

/* The section header this block shares with the other home blocks that carry one. CSS
   isolation scopes a stylesheet to ONE component, so the rules a block draws have to live
   with that block - the duplication is what keeps this section looking exactly like the
   others while each block owns its own markup. */

.section-title[b-vvn7x68liv] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 4rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.section-title h2[b-vvn7x68liv] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.section-link[b-vvn7x68liv] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green);
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.section-link:hover[b-vvn7x68liv] {
    opacity: 0.7;
}

@media (max-width: 768px) {
    .coaching-section[b-vvn7x68liv] {
        padding: 6rem 2rem 0;
    }

    .coaching-grid[b-vvn7x68liv] {
        grid-template-columns: 1fr;
    }

    .section-title[b-vvn7x68liv] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .section-title h2[b-vvn7x68liv] {
        font-size: 1.75rem;
    }
}
/* /Components/Home/HeroBlock.razor.rz.scp.css */
/* The home page's HERO block (#7562). Moved here verbatim from Home.razor.css when the
   section became its own component, so the club it was written for renders exactly what it
   rendered before - CSS isolation means these rules only ever reach this block's markup. */

/* ============================================
   HERO - Minimal, Bold Typography
   ============================================ */

.hero[b-kxhhs944ze] {
    min-height: 90vh;
    display: flex;
    align-items: center;
    padding: 8rem 4rem;
    background: #000000;
    position: relative;
    overflow: hidden;
}

.hero-background[b-kxhhs944ze] {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-bg-layer[b-kxhhs944ze] {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    opacity: 0;
    animation: heroCrossfade-b-kxhhs944ze 20s ease-in-out infinite, helicopterZoom-b-kxhhs944ze 15s ease-in-out infinite alternate;
    will-change: opacity, transform;
}

/* The club's own rotation photographs (#7839). The pictures come from the club's settings as
   an inline background-image; the stylesheet only times the crossfade, so the second layer
   runs half a cycle behind the first. */
.hero-bg-layer.hero-bg-rotation[b-kxhhs944ze] {
    animation-delay: 0s, 0s;
}

.hero-bg-layer.hero-bg-rotation-second[b-kxhhs944ze] {
    animation-delay: -10s, -7.5s;
}

/* A club's OWN hero photograph: one still layer, no crossfade and no zoom, with the brand
   gradient over it so the white lettering keeps its contrast on every part of the photo. */
.hero-bg-photo[b-kxhhs944ze] {
    animation: none;
    opacity: 1;
}

.hero-gradient[b-kxhhs944ze] {
    position: absolute;
    inset: 0;
    background: var(--gradient-brand);
    opacity: 0.82;
}

/* Photo credit, small, at the hero's bottom edge - the photographer is named on the page
   that uses their picture. */
.hero-credit[b-kxhhs944ze] {
    position: absolute;
    right: 2rem;
    bottom: 1.25rem;
    z-index: 1;
    margin: 0;
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.65);
}

/* Chess piece overlay removed on home hero so rotating photos stay clean */

@keyframes heroCrossfade-b-kxhhs944ze {
    0%, 45% { opacity: 0.15; }
    50%, 95% { opacity: 0; }
    100% { opacity: 0.15; }
}

@keyframes helicopterZoom-b-kxhhs944ze {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-bg-layer[b-kxhhs944ze] {
        animation: none;
        opacity: 0.15;
    }

    .hero-bg-layer.hero-bg-rotation-second[b-kxhhs944ze] {
        opacity: 0;
    }
}

.hero-grid[b-kxhhs944ze] {
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
    position: relative;
    z-index: 1;
}

.hero-eyebrow[b-kxhhs944ze] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 4rem;
    text-transform: uppercase;
}

.dot[b-kxhhs944ze] {
    margin: 0 1rem;
    opacity: 0.3;
}

.hero-title[b-kxhhs944ze] {
    font-family: var(--font-display);
    font-weight: 700;
    line-height: 0.95;
    margin: 0 0 4rem 0;
    letter-spacing: -0.04em;
}

.hero-title .line[b-kxhhs944ze] {
    display: block;
    font-size: clamp(3rem, 10vw, 8rem);
    color: #ffffff;
}

.hero-title .line.gold[b-kxhhs944ze] {
    color: var(--accent-text-on-dark);
}

.hero-title .line i[b-kxhhs944ze] {
    font-size: 0.8em;
    margin-left: 0.2em;
}

.hero-lead[b-kxhhs944ze] {
    max-width: 540px;
    margin-bottom: 4rem;
}

.hero-lead p[b-kxhhs944ze] {
    font-size: 1.25rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 400;
    margin: 0;
}

.hero-actions[b-kxhhs944ze] {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

.action-link[b-kxhhs944ze] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 1rem 2.5rem;
    border: 2px solid;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.action-link.primary[b-kxhhs944ze] {
    background: var(--cedar-green);
    color: #ffffff;
    border-color: var(--cedar-green);
}

.action-link[b-kxhhs944ze] {
    background: transparent;
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

.action-link:hover[b-kxhhs944ze] {
    background: transparent;
    color: #ffffff;
    border-color: #ffffff;
}

.action-link.primary:hover[b-kxhhs944ze] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

@media (max-width: 768px) {
    .hero[b-kxhhs944ze] {
        min-height: 80vh;
        padding: 6rem 2rem;
    }

    .hero-eyebrow[b-kxhhs944ze] {
        font-size: 0.6875rem;
        margin-bottom: 3rem;
    }

    .hero-title .line[b-kxhhs944ze] {
        font-size: clamp(2.5rem, 12vw, 5rem);
    }

    .hero-title .accent[b-kxhhs944ze] {
        margin-left: 0;
    }

    .hero-lead p[b-kxhhs944ze] {
        font-size: 1.125rem;
    }

    .hero-actions[b-kxhhs944ze] {
        flex-direction: column;
        gap: 1rem;
        align-items: stretch;
    }

    .action-link[b-kxhhs944ze] {
        text-align: center;
    }
}
/* /Components/Home/HomeBody.razor.rz.scp.css */
/* ============================================
   HomeBody - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

/* Home is a composition of blocks (#7562), so the sections' rules now live with the
   components that draw them under Components/Home. What is left here is the page ground the
   blocks sit on, which belongs to the composition and to nothing else (drawn by HomeBody,
   the home page's interactive island, since #7572). */

.home-page[b-mn4ncccm01] {
    background: #ffffff;
}
/* /Components/Home/JoinBlock.razor.rz.scp.css */
/* The join block (#7562). The section's ground, measure and spacing come from PageSection and
   the buttons from the shared Button, so this stylesheet only sets the type and the button
   row. Colours reach through tokens, so a club's own palette paints them. */

.home-join-title[b-wotfbgbgfl] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    color: var(--cedar-green);
    margin: 0 0 1rem 0;
}

.home-join-lead[b-wotfbgbgfl] {
    font-size: 1.0625rem;
    line-height: 1.7;
    color: #4b5563;
    margin: 0 0 2rem 0;
}

.home-join-actions[b-wotfbgbgfl] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

@media (max-width: 768px) {
    .home-join-title[b-wotfbgbgfl] {
        font-size: 1.5rem;
    }

    .home-join-actions[b-wotfbgbgfl] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Home/LadderBlock.razor.rz.scp.css */
/* The home page's LADDER block (#7562). Moved here verbatim from Home.razor.css when the
   section became its own component. */

/* ============================================
   LADDER SPOTLIGHT
   ============================================ */

.ladder-section[b-k8fhwwjuhx] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 3rem 4rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.ladder-intro[b-k8fhwwjuhx] {
    font-size: 1rem;
    line-height: 1.7;
    color: #4b5563;
    margin: 0 0 1.5rem 0;
    max-width: 700px;
}

.ladder-stats-row[b-k8fhwwjuhx] {
    display: flex;
    gap: 2.5rem;
    margin-bottom: 1.5rem;
}

.ladder-stat[b-k8fhwwjuhx] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.ladder-stat-number[b-k8fhwwjuhx] {
    font-size: 1.75rem;
    font-weight: 800;
    color: #111827;
    font-variant-numeric: tabular-nums;
}

.ladder-stat-label[b-k8fhwwjuhx] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
    font-weight: 600;
}

.ladder-top-players[b-k8fhwwjuhx] {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.06);
    margin-bottom: 1.5rem;
}

.ladder-player-row[b-k8fhwwjuhx] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.6rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
    font-size: 0.9rem;
}

.ladder-player-row:last-child[b-k8fhwwjuhx] {
    border-bottom: none;
}

.ladder-pos[b-k8fhwwjuhx] {
    font-weight: 800;
    font-size: 0.85rem;
    min-width: 2rem;
    text-align: center;
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

.ladder-pos.pos-gold[b-k8fhwwjuhx] {
    color: var(--wheat-gold, #D4AF37);
}

.ladder-pos.pos-silver[b-k8fhwwjuhx] {
    color: #94a3b8;
}

.ladder-pos.pos-bronze[b-k8fhwwjuhx] {
    color: #b45309;
}

.ladder-name[b-k8fhwwjuhx] {
    font-weight: 700;
    color: #111827;
    flex: 1;
}

.ladder-rating[b-k8fhwwjuhx] {
    font-weight: 600;
    color: #374151;
    font-variant-numeric: tabular-nums;
    min-width: 3rem;
    text-align: right;
}

.ladder-record[b-k8fhwwjuhx] {
    color: #6b7280;
    font-size: 0.8rem;
    min-width: 4rem;
    text-align: center;
}

.ladder-streak[b-k8fhwwjuhx] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #f97316;
    padding: 0.1rem 0.35rem;
    background: rgba(249, 115, 22, 0.08);
    border-radius: 2px;
}

.ladder-cta[b-k8fhwwjuhx] {
    text-align: left;
}

.ladder-cta-link[b-k8fhwwjuhx] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 700;
    font-size: 0.85rem;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.5rem 0;
    transition: gap 0.2s ease;
}

.ladder-cta-link:hover[b-k8fhwwjuhx] {
    gap: 0.75rem;
}

/* The section header this block shares with the other home blocks that carry one. CSS
   isolation scopes a stylesheet to ONE component, so the rules a block draws have to live
   with that block - the duplication is what keeps this section looking exactly like the
   others while each block owns its own markup. */

.section-title[b-k8fhwwjuhx] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 4rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.section-title h2[b-k8fhwwjuhx] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.section-link[b-k8fhwwjuhx] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green);
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.section-link:hover[b-k8fhwwjuhx] {
    opacity: 0.7;
}

@media (max-width: 768px) {
    .ladder-stats-row[b-k8fhwwjuhx] {
        justify-content: flex-start;
    }

    .ladder-player-row[b-k8fhwwjuhx] {
        font-size: 0.85rem;
    }

    .section-title[b-k8fhwwjuhx] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .section-title h2[b-k8fhwwjuhx] {
        font-size: 1.75rem;
    }
}
/* /Components/Home/NewsBlock.razor.rz.scp.css */
/* The home page's news block (#7562). The section rhythm, the card and the type all come from the
   page shell; this stylesheet only arranges the cards and paints the two pieces of chrome
   the shell has no opinion about. Every colour reaches through a token so a club's own
   palette lands here too. */

.home-news-all[b-trnvmctag9] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green);
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.home-news-all:hover[b-trnvmctag9] {
    opacity: 0.7;
}

.home-news-grid[b-trnvmctag9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 1.5rem;
}

.home-news-summary[b-trnvmctag9] {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #4b5563;
}
/* /Components/Home/UpcomingEventsBlock.razor.rz.scp.css */
/* The home page's UPCOMING EVENTS block (#7562). Moved here verbatim from Home.razor.css
   when the section became its own component. */

/* ============================================
   EVENTS SECTION - Minimal List
   ============================================ */

.events-section[b-d8f3qodjuj] {
    max-width: 1200px;
    margin: 8rem auto;
    padding: 0 4rem;
}

.section-title[b-d8f3qodjuj] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 4rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.section-title h2[b-d8f3qodjuj] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.section-link[b-d8f3qodjuj] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green);
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.section-link:hover[b-d8f3qodjuj] {
    opacity: 0.7;
}

.events-list[b-d8f3qodjuj] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

@media (max-width: 768px) {
    .events-section[b-d8f3qodjuj] {
        margin: 6rem auto;
        padding: 0 2rem;
    }

    .section-title[b-d8f3qodjuj] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .section-title h2[b-d8f3qodjuj] {
        font-size: 1.75rem;
    }
}
/* /Components/Home/VenuesBlock.razor.rz.scp.css */
/* The home page's VENUES block (#7562) - "where we meet". Moved here verbatim from
   Home.razor.css when the section became its own component. The one addition is the
   "stacked" layout a club can choose, which is the block's own setting. */

/* ============================================
   INFO SECTION - Minimal Grid
   ============================================ */

.info-section[b-13bhdg55w9] {
    padding: 8rem 4rem;
    background: #ffffff;
}

.info-row[b-13bhdg55w9] {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6rem;
}

.info-item[b-13bhdg55w9] {
    position: relative;
}

.info-number[b-13bhdg55w9] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.3);
    margin-bottom: 2rem;
    letter-spacing: 0.15em;
}

.info-icon[b-13bhdg55w9] {
    display: none;
}

.info-item h2[b-13bhdg55w9] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0;
}

.info-item p[b-13bhdg55w9] {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: #6b7280;
    margin: 0;
}

.location-link[b-13bhdg55w9] {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: #6b7280;
    text-decoration: none;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: block;
}

.location-link:hover[b-13bhdg55w9] {
    color: var(--cedar-green);
}

.schedule[b-13bhdg55w9] {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.6;
    color: var(--cedar-green);
}

/* The block's "stacked" layout setting: one venue card per line at every width, for a club
   whose card copy is too long to sit three across. */
.info-row-stacked[b-13bhdg55w9] {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 1024px) {
    .info-row[b-13bhdg55w9] {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .info-item[b-13bhdg55w9] {
        padding-bottom: 3rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    .info-item:last-child[b-13bhdg55w9] {
        border-bottom: none;
        padding-bottom: 0;
    }
}

@media (max-width: 768px) {
    .info-section[b-13bhdg55w9] {
        padding: 6rem 2rem;
    }
}
/* /Components/Layout/KioskLayout.razor.rz.scp.css */
/* Device-registration gate overlay — rendered inside the kiosk PAGES (@Body),
   so ::deep is required to reach it from the layout's scoped stylesheet. */
[b-d8df6h90j8] .kiosk-gate-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 1rem;
    padding: 2rem;
}
[b-d8df6h90j8] .kiosk-gate-overlay h2 { margin: 0; color: #111827; }
[b-d8df6h90j8] .kiosk-gate-overlay p { margin: 0; max-width: 600px; color: #6b7280; font-size: 1.05rem; line-height: 1.5; }
[b-d8df6h90j8] .gate-spin { font-size: 2.5rem; color: var(--cedar-green, #2D5016); }
[b-d8df6h90j8] .gate-x { font-size: 3rem; color: var(--tobacco-barn-red, #8B4513); }

/* ============================================================
   Check-in kiosk shell + shared kiosk page styles.
   On WilcoChess brand: editorial look (black hero, gold/white
   title, sharp flat edges, cedar-green actions, display font),
   sized up for tablet touch. Page elements use ::deep (the
   layout only owns .kiosk-root directly).
   ============================================================ */

.kiosk-root[b-d8df6h90j8] {
    position: fixed;
    inset: 0;
    background: #ffffff;
    color: var(--cedar-green, #2D5016);
    overflow-y: auto;
    -webkit-text-size-adjust: 100%;
    -webkit-touch-callout: none;
    user-select: none;
    font-family: var(--font-sans, 'source-sans-pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif);
}

[b-d8df6h90j8] .kiosk { max-width: 900px; margin: 0 auto; padding: 0 0 4rem; }

[b-d8df6h90j8] .kiosk-center {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; min-height: 55vh; gap: 1.25rem;
}
[b-d8df6h90j8] .kiosk-muted { color: #6b7280; font-size: 1.15rem; }

/* ---- Editorial hero header (black, gold/white, decorative piece) ---- */
[b-d8df6h90j8] .kiosk-head {
    position: relative;
    background: #000000;
    color: #ffffff;
    padding: 2.75rem 2.5rem;
    margin-bottom: 2.5rem;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
}
[b-d8df6h90j8] .kiosk-head::before {
    content: '\265E'; /* black knight */
    position: absolute;
    top: 50%; right: -2%;
    transform: translateY(-50%) rotate(12deg);
    font-size: 320px; line-height: 1;
    color: rgba(255, 255, 255, 0.06);
    pointer-events: none; user-select: none;
}
[b-d8df6h90j8] .kiosk-eyebrow {
    text-transform: uppercase; letter-spacing: 0.18em;
    font-size: 0.85rem; font-weight: 700;
    color: var(--wheat-gold, #D4AF37);
}
[b-d8df6h90j8] .kiosk-title {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    margin: 0.4rem 0 0;
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 700; line-height: 1.05;
    text-transform: uppercase; letter-spacing: -0.01em;
    color: #ffffff;
    position: relative; z-index: 1;
}
[b-d8df6h90j8] .kiosk-sub { margin-top: 0.5rem; color: rgba(255,255,255,0.85); font-size: 1.05rem; position: relative; z-index: 1; }

/* Reader picker (in the hero, right-aligned) */
[b-d8df6h90j8] .kiosk-reader { text-align: right; position: relative; z-index: 1; flex: 0 0 auto; }
[b-d8df6h90j8] .kiosk-reader label {
    display: block; color: var(--wheat-gold, #D4AF37);
    text-transform: uppercase; letter-spacing: 0.1em; font-size: 0.7rem; margin-bottom: 0.3rem;
}
[b-d8df6h90j8] .kiosk-reader select {
    min-height: 46px; border: none; border-radius: 0; padding: 0 0.75rem; font-size: 1rem;
    background: #ffffff; color: var(--cedar-green, #2D5016);
}
[b-d8df6h90j8] .reader-warn { color: var(--wheat-gold, #D4AF37); font-weight: 700; }

/* ---- Card surface (sharp, flat, subtle border — no heavy rounding/shadow) ---- */
[b-d8df6h90j8] .kiosk-card {
    background: #ffffff;
    color: #1f2937;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-top: 4px solid var(--cedar-green, #2D5016);
    border-radius: 0;
    padding: 2.5rem;
    margin: 0 1.5rem;
}

/* ---- Form ---- */
[b-d8df6h90j8] .field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
[b-d8df6h90j8] .field { display: flex; flex-direction: column; }
[b-d8df6h90j8] .field-wide { grid-column: 1 / -1; }
[b-d8df6h90j8] .field label {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    text-transform: uppercase; letter-spacing: 0.04em;
    font-weight: 700; margin-bottom: 0.45rem; font-size: 1.05rem; color: var(--cedar-green, #2D5016);
}
/* The "(optional)" and "(required)" hints beside a label take the muted-text token: #9ca3af read 2.53:1 on the
   card's white (#8394, WALK-1004b c2-8363). */
[b-d8df6h90j8] .field .opt { font-weight: 400; color: var(--color-text-secondary); font-size: 0.85rem; letter-spacing: 0; text-transform: none; }

[b-d8df6h90j8] .kiosk-card input,
[b-d8df6h90j8] .kiosk-card select {
    min-height: 58px; font-size: 1.2rem; padding: 0 1rem;
    border: 1px solid #d1d5db; border-radius: 0; width: 100%;
    background: #fff; color: #1f2937;
    transition: border-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
[b-d8df6h90j8] .kiosk-card input:focus,
[b-d8df6h90j8] .kiosk-card select:focus {
    outline: none; border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.15);
}

/* USCF lookup */
[b-d8df6h90j8] .uscf-row { display: flex; gap: 0.6rem; align-items: stretch; }
[b-d8df6h90j8] .returning-lookup { margin-bottom: 1.25rem; padding-bottom: 1.25rem; border-bottom: 1px solid rgba(0,0,0,0.08); }
[b-d8df6h90j8] .returning-lookup > label { display: block; margin-bottom: 0.4rem; font-weight: 600; color: #374151; }
[b-d8df6h90j8] .tier-toggle {
    display: flex;
    margin-bottom: 1.25rem;
    border: 1px solid #d1d5db;
    overflow: hidden;
}
[b-d8df6h90j8] .tier-toggle button {
    flex: 1;
    padding: 0.7rem 1rem;
    border: none;
    background: #fff;
    color: #374151;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
}
[b-d8df6h90j8] .tier-toggle button.active { background: var(--cedar-green, #2D5016); color: #fff; }
[b-d8df6h90j8] .free-note { margin: 0 0 0.75rem; }

[b-d8df6h90j8] .family-block { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid rgba(0,0,0,0.1); }
[b-d8df6h90j8] .family-h { font-size: 1rem; font-weight: 700; color: var(--cedar-green, #2D5016); margin: 0 0 0.6rem; }
[b-d8df6h90j8] .family-h .opt { font-weight: 400; color: var(--color-text-secondary); font-size: 0.85rem; }
[b-d8df6h90j8] .family-note { margin: 0 0 0.75rem; color: #6b7280; font-size: 0.95rem; }
[b-d8df6h90j8] .family-member { margin-bottom: 0.5rem; }
[b-d8df6h90j8] .family-row { display: flex; gap: 0.5rem; align-items: stretch; }
[b-d8df6h90j8] .family-row input { flex: 1 1 0; min-width: 0; }
/* While the age floor is in force a row also takes the member's birth date (#8363 review round 2), and four inputs
   split one line four ways left the date too narrow for its year at tablet widths ("10/04/2" at 768; #8394, WALK-1004b
   b1-8363) - the year is what decides the floor. The dated row takes two lines: the names, then the email, the birth
   date and the remove button, so every field has half the card; a narrow screen takes one field per line (below). */
[b-d8df6h90j8] .family-row-dated { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
[b-d8df6h90j8] .family-row-dated input[type="email"] { grid-column: 1; }
[b-d8df6h90j8] .family-row-error { margin-top: 0.35rem; color: var(--tobacco-barn-red, #8B4513); font-size: 0.95rem; }
[b-d8df6h90j8] .join-total { margin: 1.25rem 0 0.75rem; font-size: 1.2rem; color: #111827; }
[b-d8df6h90j8] .join-total strong { color: var(--cedar-green, #2D5016); }
[b-d8df6h90j8] .uscf-row .uscf-id { flex: 0 0 130px; }
[b-d8df6h90j8] .uscf-row .uscf-term { flex: 1 1 auto; }
[b-d8df6h90j8] .uscf-hint { margin-top: 0.5rem; color: var(--tobacco-barn-red, #8B4513); font-size: 0.95rem; }
/* A returning attendee's email on file (#8168): shown masked, in place of the email input. */
[b-d8df6h90j8] .on-file {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.6rem;
    min-height: 58px; padding: 0.5rem 1rem; border: 1px solid #d1d5db; background: var(--river-pearl, #F5F5F0);
    color: #1f2937; font-size: 1.1rem; overflow-wrap: anywhere;
}
[b-d8df6h90j8] .on-file-hint { margin-top: 0.5rem; color: #374151; font-size: 0.95rem; }
/* #8296: a Tennessee Chess Association member ID is short; the field need not span the form. */
[b-d8df6h90j8] .tca-id { max-width: 22rem; }
[b-d8df6h90j8] .title-select { flex: 0 0 160px; }
[b-d8df6h90j8] .title-verify { display: flex; align-items: center; gap: 0.5rem; font-size: 1rem; color: #374151; }
[b-d8df6h90j8] .title-verify input[type="checkbox"] { width: 1.4rem; height: 1.4rem; }
[b-d8df6h90j8] .title-free { margin-top: 0.5rem; color: var(--cedar-green, #2D5016); font-weight: 700; }
[b-d8df6h90j8] .uscf-results { list-style: none; margin: 0.6rem 0 0; padding: 0; border: 1px solid #e5e7eb; }
[b-d8df6h90j8] .uscf-results li + li { border-top: 1px solid #e5e7eb; }
[b-d8df6h90j8] .uscf-results button {
    width: 100%; text-align: left; background: var(--river-pearl, #F5F5F0); border: none;
    padding: 0.9rem 1rem; cursor: pointer; display: flex; flex-direction: column; gap: 0.15rem;
    transition: background-color 0.15s ease;
}
[b-d8df6h90j8] .uscf-results button:hover { background: var(--limestone-cream, #E8DCC4); }
[b-d8df6h90j8] .uscf-name { font-weight: 700; font-size: 1.05rem; color: var(--cedar-green, #2D5016); }
/* The muted line under a name (#8289): #6b7280 measured 4.42:1 on the editorial river pearl. */
[b-d8df6h90j8] .uscf-meta { color: var(--color-text-secondary); font-size: 0.9rem; }

/* ---- Buttons: flat, sharp, display font, uppercase ---- */
[b-d8df6h90j8] .kiosk-btn {
    min-height: 62px; font-family: var(--font-display, 'Bebas Neue', sans-serif);
    font-size: 1.25rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
    border-radius: 0; border: none; cursor: pointer; padding: 0 1.75rem;
    transition: background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1), transform 0.08s ease;
}
[b-d8df6h90j8] .kiosk-btn:active { transform: translateY(1px); }
[b-d8df6h90j8] .kiosk-btn:disabled { opacity: 0.5; cursor: default; }
[b-d8df6h90j8] .kiosk-btn-go { width: 100%; margin-top: 1.75rem; background: var(--cedar-green, #2D5016); color: #fff; }
[b-d8df6h90j8] .kiosk-btn-go:hover:not(:disabled) { background: #244011; }
[b-d8df6h90j8] .kiosk-btn-ghost { background: transparent; color: var(--cedar-green, #2D5016); border: 2px solid var(--cedar-green, #2D5016); }
[b-d8df6h90j8] .kiosk-btn-ghost:hover:not(:disabled) { background: var(--limestone-cream, #E8DCC4); }
[b-d8df6h90j8] .kiosk-btn-sm { min-height: 58px; font-size: 1.05rem; padding: 0 1.2rem; flex: 0 0 auto; }

/* Desk-operator switch between check-in and results, sitting in the black hero.
   Gold outline so it reads on the dark header (the cedar-green ghost would not). */
[b-d8df6h90j8] .kiosk-head-actions { display: flex; align-items: flex-end; gap: 1.25rem; position: relative; z-index: 1; flex: 0 0 auto; }
[b-d8df6h90j8] .kiosk-switch {
    display: inline-flex; align-items: center; gap: 0.5rem; white-space: nowrap; text-decoration: none;
    background: transparent; color: var(--wheat-gold, #D4AF37); border: 2px solid var(--wheat-gold, #D4AF37);
}
[b-d8df6h90j8] .kiosk-switch:hover { background: var(--wheat-gold, #D4AF37); color: #000000; }

[b-d8df6h90j8] .kiosk-error {
    margin-top: 1rem; background: #fdf2f2; border: 1px solid #e7c3c3; border-left: 4px solid var(--tobacco-barn-red, #8B4513);
    color: #7a2e12; padding: 0.85rem 1rem; font-size: 1.05rem;
}

/* ---- Charging ---- */
[b-d8df6h90j8] .charge-amount { font-family: var(--font-display, 'Bebas Neue', sans-serif); font-size: 4rem; font-weight: 700; color: var(--cedar-green, #2D5016); }
[b-d8df6h90j8] .charge-msg { font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase; letter-spacing: 0.02em; font-size: 1.7rem; margin: 0.25rem 0; color: #1f2937; }
[b-d8df6h90j8] .charge-actions { display: flex; gap: 0.75rem; margin-top: 1.75rem; flex-wrap: wrap; justify-content: center; }
[b-d8df6h90j8] .charge-spinner {
    width: 58px; height: 58px; border-radius: 50%;
    border: 6px solid var(--limestone-cream, #E8DCC4); border-top-color: var(--cedar-green, #2D5016);
    animation: kiosk-spin-b-d8df6h90j8 0.9s linear infinite;
}
@keyframes kiosk-spin-b-d8df6h90j8 { to { transform: rotate(360deg); } }

/* ---- Success / fail ---- */
[b-d8df6h90j8] .kiosk-success .success-check {
    width: 96px; height: 96px; background: var(--cedar-green, #2D5016); color: #fff;
    font-size: 3.5rem; line-height: 96px; /* circle kept for instant read; everything else is sharp */ border-radius: 50%;
}
[b-d8df6h90j8] .kiosk-success h2 { font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase; color: var(--cedar-green, #2D5016); font-size: 2.25rem; margin: 0.5rem 0 0; }
[b-d8df6h90j8] .kiosk-failed .fail-x {
    width: 96px; height: 96px; background: var(--tobacco-barn-red, #8B4513); color: #fff;
    font-size: 3.5rem; line-height: 96px; font-weight: 800; border-radius: 50%;
}
[b-d8df6h90j8] .kiosk-failed h2 { font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase; color: var(--tobacco-barn-red, #8B4513); font-size: 2rem; margin: 0.5rem 0 0; }
/* A charge the station can no longer watch (#8272): neither a success nor a decline. */
[b-d8df6h90j8] .kiosk-ended .ended-mark {
    width: 96px; height: 96px; background: var(--wheat-gold, #D4AF37); color: #000000;
    font-size: 2.75rem; line-height: 96px; border-radius: 50%;
}
[b-d8df6h90j8] .kiosk-ended h2 { font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase; color: #1f2937; font-size: 2rem; margin: 0.5rem 0 0; }
[b-d8df6h90j8] .kiosk-ended .kiosk-ended-sentence { font-size: 1.15rem; font-weight: 600; color: #1f2937; margin: 0.5rem 0 0; }

/* ---- Event picker ---- */
[b-d8df6h90j8] .event-list { display: flex; flex-direction: column; gap: 1rem; }
[b-d8df6h90j8] .event-pick {
    text-align: left; background: #ffffff; border: 1px solid rgba(0,0,0,0.12); border-left: 4px solid var(--cedar-green, #2D5016);
    border-radius: 0; padding: 1.2rem 1.4rem; cursor: pointer; display: flex; flex-direction: column; gap: 0.3rem;
    transition: background-color 0.15s ease, border-left-color 0.15s ease;
}
[b-d8df6h90j8] .event-pick:hover { background: var(--river-pearl, #F5F5F0); border-left-color: var(--wheat-gold, #D4AF37); }
[b-d8df6h90j8] .event-pick-title { font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase; font-size: 1.4rem; font-weight: 700; color: var(--cedar-green, #2D5016); }
[b-d8df6h90j8] .event-pick-meta { color: #6b7280; font-size: 1.05rem; }

/* ---- "Which club tonight?" (#7666) ----
   The first screen of a tablet that serves more than one club. Each choice is a large
   touch target showing that club's own mark and name; the club whose site this already is
   is a button (continue), every other club is a link to its own site. The remembered choice
   is outlined in gold, never followed on its own. */
[b-d8df6h90j8] .kiosk-club-pick { padding: 2.75rem 1.5rem 0; }
[b-d8df6h90j8] .kiosk-club-pick-title {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    margin: 0.4rem 0 0;
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 700; line-height: 1.05;
    text-transform: uppercase; letter-spacing: -0.01em;
    color: var(--cedar-green, #2D5016);
}
[b-d8df6h90j8] .kiosk-club-pick-sub { margin: 0.75rem 0 0; color: #6b7280; font-size: 1.15rem; }
[b-d8df6h90j8] .kiosk-club-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin-top: 2rem; }
[b-d8df6h90j8] .kiosk-club {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.9rem;
    min-height: 220px; padding: 1.75rem 1.5rem;
    background: #ffffff; color: var(--cedar-green, #2D5016);
    border: 1px solid rgba(0, 0, 0, 0.12); border-top: 4px solid var(--cedar-green, #2D5016); border-radius: 0;
    text-align: center; text-decoration: none; cursor: pointer;
    font-family: inherit;
    transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.08s ease;
}
[b-d8df6h90j8] .kiosk-club:hover { background: var(--river-pearl, #F5F5F0); }
[b-d8df6h90j8] .kiosk-club:active { transform: translateY(1px); }
[b-d8df6h90j8] .kiosk-club.selected { border-color: var(--wheat-gold, #D4AF37); box-shadow: 0 0 0 3px var(--wheat-gold, #D4AF37); }
[b-d8df6h90j8] .kiosk-club-logo { max-height: 96px; max-width: 200px; object-fit: contain; }
[b-d8df6h90j8] .kiosk-club-name {
    font-family: var(--font-display, 'Bebas Neue', sans-serif); text-transform: uppercase;
    font-size: 1.6rem; font-weight: 700; line-height: 1.1; color: var(--cedar-green, #2D5016);
}
[b-d8df6h90j8] .kiosk-club-meta { color: #6b7280; font-size: 1rem; }

/* Cancellation/result banner reuse */
[b-d8df6h90j8] .status-banner { margin: 0 1.5rem 1.5rem; padding: 1rem 1.25rem; background: var(--river-pearl, #F5F5F0); border-left: 4px solid var(--cedar-green, #2D5016); color: var(--cedar-green, #2D5016); }

@media (max-width: 680px) {
    [b-d8df6h90j8] .field-grid { grid-template-columns: 1fr; }
    [b-d8df6h90j8] .family-row-dated { grid-template-columns: minmax(0, 1fr); }
    [b-d8df6h90j8] .kiosk-head { flex-direction: column; align-items: flex-start; padding: 2rem 1.5rem; }
    [b-d8df6h90j8] .kiosk-reader { text-align: left; }
    [b-d8df6h90j8] .kiosk-card { margin: 0 1rem; padding: 1.5rem; }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* ============================================
   Main Layout Styles - Modern Minimal
   ============================================ */

/* Skip-to-content styles live in wwwroot/app.css so they're unscoped and
   guaranteed to apply to the <a> rendered by this layout. Leaving the
   rules scoped here caused the link to render as an in-flow anchor in
   prod when the scope attribute didn't get attached. */

/* .visually-hidden used to be duplicated here and .footer-contact outlived its markup. Both
   were dead: a scoped rule only reaches elements carrying THIS layout's scope attribute, the
   layout renders neither class, and every real .visually-hidden use is in a shared component
   or a page, which reach the unscoped rule in wwwroot/app.css. The class-versus-rule ratchet
   (LayoutsWearTheirOwnStylesheetTests) now keeps both directions of that drift out. */

.page[b-jx92xal3l1] {
    min-height: 100vh;
    display: flex;
    width: 100%;
    background: #ffffff;
}

.page-wrapper[b-jx92xal3l1] {
    flex: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    transition: margin-left 0.3s ease;
    min-height: 100vh;
    background: #ffffff;
}

@media (max-width: 968px) {
    .page-wrapper[b-jx92xal3l1] {
        padding-top: 70px;
    }
}

@media (min-width: 969px) {
    .page-wrapper[b-jx92xal3l1] {
        margin-left: 240px;
        width: calc(100% - 240px);
    }
}

/* ============================================
   Sticky Banner Stack
   ============================================ */

.banner-stack[b-jx92xal3l1] {
    position: sticky;
    top: 0;
    z-index: 999;
}

/* ============================================
   Main Content
   ============================================ */

.main-content[b-jx92xal3l1] {
    flex: 1;
    width: 100%;
    align-self: stretch;
    margin: 0;
    padding: 0;
    background: #ffffff;
}

/* ============================================
   Footer - Minimal Editorial Style
   ============================================ */

.footer-main[b-jx92xal3l1] {
    background: #000000;
    color: #ffffff;
    border-top: 2px solid var(--cedar-green);
    margin-top: auto;
    position: relative;
    width: 100%;
    align-self: stretch;
    /* Room for the fixed Join / Upgrade pill (#8042, app.css): zero unless the pill is on the
       page, so the footer's last link can always scroll clear of it. */
    padding-bottom: var(--join-cta-clearance, 0px);
}

.footer-container[b-jx92xal3l1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem 3rem;
}

.footer-grid[b-jx92xal3l1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 4rem;
    margin-bottom: 3rem;
}

.footer-section[b-jx92xal3l1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.footer-title[b-jx92xal3l1] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.footer-title[b-jx92xal3l1]  .gold,
.footer-bottom[b-jx92xal3l1]  .gold {
    color: var(--wheat-gold, #D4AF37);
}

.footer-heading[b-jx92xal3l1] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    margin: 0;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.15em;
}

.footer-description[b-jx92xal3l1],
.footer-text[b-jx92xal3l1] {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

/* Venue and meeting time, straight off the club row. Each part is optional, so a club
   that has not filled these in renders no address block at all. */
.footer-address[b-jx92xal3l1] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-top: 0.75rem;
    font-style: normal;
    font-size: 0.875rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.7);
}

/* The WHERE. Venue, street, city and ZIP arrive concatenated onto one line, so this is the
   part of the footer that wraps on a phone; the measure keeps it from running the full width
   of a 1200px footer column, and `pretty` keeps it from leaving one orphaned word. */
.footer-venue[b-jx92xal3l1] {
    max-width: 40ch;
    text-wrap: pretty;
}

/* The WHEN - the single fact a visitor most often opens a club footer for. It is the one line
   in the address block that is not muted, and it is SET OFF BY the club's accent rather than
   painted in it, because gold and grey are accents here, never running text. `align-self`
   keeps the rule the width of the words instead of the whole column. */
.footer-schedule[b-jx92xal3l1] {
    align-self: flex-start;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 2px solid var(--accent-rule);
    color: var(--color-white);
    font-weight: 600;
}

.footer-links[b-jx92xal3l1] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.footer-links a[b-jx92xal3l1] {
    color: #ffffff;
    text-decoration: none;
    font-size: 0.9375rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-block;
}

.footer-links a:hover[b-jx92xal3l1] {
    color: var(--cedar-green);
    transform: translateX(4px);
}

.footer-bottom[b-jx92xal3l1] {
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
}

.footer-bottom p[b-jx92xal3l1] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    color: #ffffff;
}

/* The organization line (#8146): "{club} is a club of {organization}, {status}." Fine print
   above the copyright, in the footer's muted white, with the organization's name underlined as
   a link - never a color-only link inside running text. No text-transform: a legal name renders
   exactly as the organization registered it. */
.footer-bottom .footer-org[b-jx92xal3l1] {
    max-width: 60ch;
    margin: 0 auto 1rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.75);
    text-wrap: pretty;
}

.footer-org[b-jx92xal3l1]  a {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.footer-org[b-jx92xal3l1]  a:hover {
    text-decoration-thickness: 2px;
}

.footer-legal-links[b-jx92xal3l1] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-top: 0.5rem;
}

.footer-legal-links a[b-jx92xal3l1] {
    color: #ffffff;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.footer-legal-links a:hover[b-jx92xal3l1] {
    color: var(--cedar-green);
}

.footer-legal-links .separator[b-jx92xal3l1] {
    color: rgba(255, 255, 255, 0.3);
    font-size: 0.875rem;
}

/* The social row moved to Components/Shared/ClubSocialBlock.razor.css (#7588): the block is
   rendered by that child component and PhotoLayout renders it too, so a ::deep from HERE
   styled it on the editorial skin only. */

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .footer-container[b-jx92xal3l1] {
        padding: 4rem 2rem 2rem;
    }

    .footer-grid[b-jx92xal3l1] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}

/* ============================================
   Blazor Error UI
   ============================================ */
/* /Components/Layout/OrganizationLayout.razor.rz.scp.css */
/* ============================================
   Organization host layout (#8184): no club chrome.
   Tokens only; the organization's own address wears
   the platform's defaults, never a club's palette.
   ============================================ */

.organization-page[b-743k05o0sq] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--color-surface);
    color: var(--color-text);
}

.organization-header[b-743k05o0sq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--color-border);
}

.organization-brand[b-743k05o0sq] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: var(--color-text);
}

.organization-crest[b-743k05o0sq] {
    height: 2.25rem;
    width: auto;
}

.organization-name[b-743k05o0sq] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
}

.organization-nav[b-743k05o0sq] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1rem;
}

.organization-nav-link[b-743k05o0sq] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    padding: 0.25rem 0;
}

.organization-nav-link:hover[b-743k05o0sq],
.organization-nav-link:focus-visible[b-743k05o0sq] {
    text-decoration: underline;
    outline: none;
}

.organization-main[b-743k05o0sq] {
    flex: 1;
    width: 100%;
}

.organization-footer[b-743k05o0sq] {
    padding: 1.5rem;
    border-top: 1px solid var(--color-border);
    color: var(--color-text-secondary);
    font-size: 0.875rem;
}

.organization-footer-line[b-743k05o0sq] {
    margin: 0;
}

@media (max-width: 480px) {
    .organization-header[b-743k05o0sq] {
        padding: 0.75rem 1rem;
    }

    .organization-footer[b-743k05o0sq] {
        padding: 1rem;
    }
}
/* /Components/Layout/PhotoLayout.razor.rz.scp.css */
/* ============================================
   Photo Layout - sidebar, full-bleed content column, dark footer
   Structure for the photo skin (#7560); #7561 restyles.

   Owner ruling 2026-09-10: "I want a sidebar, not topbar on desktop." The layout
   renders the SAME <Navigation /> the editorial layout does, so the geometry here
   matches MainLayout's exactly - a 240px fixed sidebar above 969px, and a 70px
   fixed mobile header below it. The difference is what the skin paints on it.
   ============================================ */

.photo-shell[b-jl0eidonbs] {
    min-height: 100vh;
    display: flex;
    width: 100%;
    background: var(--color-background, #ffffff);
}

/* The content column. `min-width: 0` is what stops a wide child (a table, a
   calendar) from pushing the column past the viewport instead of scrolling
   inside its own ScrollRegion. */
.photo-wrapper[b-jl0eidonbs] {
    flex: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    background: var(--color-surface, #ffffff);
}

@media (max-width: 968px) {
    /* The mobile header is fixed and 70px tall, like the editorial one. */
    .photo-wrapper[b-jl0eidonbs] {
        padding-top: 70px;
    }
}

@media (min-width: 969px) {
    .photo-wrapper[b-jl0eidonbs] {
        margin-left: 240px;
        width: calc(100% - 240px);
    }
}

.banner-stack[b-jl0eidonbs] {
    position: sticky;
    top: 0;
    z-index: 999;
}

.photo-main[b-jl0eidonbs] {
    flex: 1;
    width: 100%;
    margin: 0;
    padding: 0;
    background: var(--color-surface, #ffffff);
}

/* ---- Footer ---- */

.photo-footer[b-jl0eidonbs] {
    background: var(--color-dark);
    color: #ffffff;
    margin-top: auto;
    width: 100%;
    /* Room for the fixed Join / Upgrade pill (#8042, app.css): zero unless the pill is on the
       page, so the footer's last link can always scroll clear of it. */
    padding-bottom: var(--join-cta-clearance, 0px);
}

.photo-footer-inner[b-jl0eidonbs] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem 2rem 2rem;
}

.photo-footer-grid[b-jl0eidonbs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 3rem;
    margin-bottom: 3rem;
}

.photo-footer-section[b-jl0eidonbs] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* The identity column: the wordmark, the club's blurb, and the club's meeting facts. It is
   the one footer section that is prose rather than a link list, so it gets a looser rhythm -
   and the facts get a rule above them and the full white. Without one, the venue and the
   meeting time render at the same size in the same muted white as the paragraph above and
   read as a fourth line of the blurb, when they are the two things a visitor most often opens
   a club footer for. The editorial footer separates them the same way. Gold is the RULE here,
   never the running text.
   The grid is deliberately left alone: auto-fit already balances the columns, and spanning
   this one drops the last section onto a ragged second row the moment a club adds a
   Resources list. */
.photo-footer-identity[b-jl0eidonbs] {
    gap: 1.25rem;
}

.photo-footer-identity .photo-footer-address[b-jl0eidonbs] {
    padding-top: 0.75rem;
    border-top: 2px solid var(--accent-rule);
    color: var(--color-white);
}

.photo-footer-title[b-jl0eidonbs] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    color: #ffffff;
}

.photo-footer-title[b-jl0eidonbs]  .gold,
.photo-footer-bottom[b-jl0eidonbs]  .gold {
    color: var(--accent-text-on-dark);
}

.photo-footer-description[b-jl0eidonbs],
.photo-footer-text[b-jl0eidonbs] {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.75);
}

.photo-footer-address[b-jl0eidonbs] {
    font-style: normal;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.75);
}

.photo-footer-heading[b-jl0eidonbs] {
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin: 0;
    color: var(--wheat-gold);
}

.photo-footer-links[b-jl0eidonbs] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.photo-footer-links a[b-jl0eidonbs] {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    font-size: 0.95rem;
    transition: color var(--transition-fast);
}

.photo-footer-links a:hover[b-jl0eidonbs],
.photo-footer-links a:focus-visible[b-jl0eidonbs] {
    color: #ffffff;
    text-decoration: underline;
}

.photo-footer-bottom[b-jl0eidonbs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.65);
}

.photo-footer-bottom p[b-jl0eidonbs] {
    margin: 0;
}

/* The organization line (#8146): a full-width row of its own at the top of the bottom bar, so
   the copyright and the legal links keep sharing the row beneath it. The bar's own size, in the
   legal links' brighter white, with the organization's name underlined as a link. No
   text-transform: a legal name renders exactly as the organization registered it. */
.photo-footer-bottom .photo-footer-org[b-jl0eidonbs] {
    flex-basis: 100%;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.75);
    text-wrap: pretty;
}

.photo-footer-org[b-jl0eidonbs]  a {
    color: #ffffff;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.photo-footer-org[b-jl0eidonbs]  a:hover,
.photo-footer-org[b-jl0eidonbs]  a:focus-visible {
    text-decoration-thickness: 2px;
}

.photo-footer-legal[b-jl0eidonbs] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.photo-footer-legal a[b-jl0eidonbs] {
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
}

.photo-footer-legal a:hover[b-jl0eidonbs],
.photo-footer-legal a:focus-visible[b-jl0eidonbs] {
    color: #ffffff;
    text-decoration: underline;
}

.separator[b-jl0eidonbs] {
    color: rgba(255, 255, 255, 0.35);
}

@media (max-width: 640px) {
    .photo-footer-inner[b-jl0eidonbs] {
        padding: 3rem 1.25rem 1.5rem;
    }

    .photo-footer-bottom[b-jl0eidonbs] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Components/Pages/About.razor.rz.scp.css */
/* ============================================
   About Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.about-page[b-mfkyz5yena] {
    background: #ffffff;
}

/* ============================================
   Content Sections - Editorial Layout
   ============================================ */

.about-content[b-mfkyz5yena] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 8rem 4rem;
}

.about-section[b-mfkyz5yena] {
    padding-bottom: 6rem;
    margin-bottom: 6rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.about-section:last-child[b-mfkyz5yena] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.section-icon[b-mfkyz5yena] {
    margin-bottom: 1.5rem;
}

.section-icon i[b-mfkyz5yena] {
    font-size: 2.5rem;
    color: var(--cedar-green);
    opacity: 0.8;
}

.about-section h2[b-mfkyz5yena] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0 0 2rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.about-section p[b-mfkyz5yena] {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: #6b7280;
    margin: 0 0 1.5rem 0;
    max-width: 800px;
}

.about-section p:last-child[b-mfkyz5yena] {
    margin-bottom: 0;
}

/* The organization the club belongs to (#8146). The sentence reads as the page's running text;
   the organization's name inside it is a link, underlined so it is never told apart by color
   alone. No text-transform: a legal name renders exactly as the organization registered it. */
.about-organization-statement[b-mfkyz5yena] {
    text-wrap: pretty;
}

.about-organization-statement[b-mfkyz5yena]  a {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.about-organization-statement[b-mfkyz5yena]  a:hover {
    color: var(--cedar-green-dark);
}

/* ============================================
   Meeting Details - Minimal Layout
   ============================================ */

.meeting-details-box[b-mfkyz5yena] {
    background: rgba(var(--cedar-green-rgb), 0.02);
    padding: 3rem;
    margin: 2rem 0;
    max-width: 600px;
    border-left: 3px solid var(--cedar-green);
}

.chapter-heading[b-mfkyz5yena] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.meeting-detail-item[b-mfkyz5yena] {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: #6b7280;
    margin-bottom: 1.5rem;
}

.meeting-detail-item:last-of-type[b-mfkyz5yena] {
    margin-bottom: 0;
}

.meeting-detail-item strong[b-mfkyz5yena] {
    color: #000000;
    font-weight: 600;
}

.directions-button[b-mfkyz5yena] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem;
    background: var(--cedar-green);
    color: #ffffff;
    border: 2px solid var(--cedar-green);
    text-decoration: none;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 2rem;
}

.directions-button:hover[b-mfkyz5yena] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

/* ============================================
   Activities Grid - Minimal Cards
   ============================================ */

.activities-grid[b-mfkyz5yena] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
    gap: 3rem;
    margin-top: 3rem;
}

.activity-card[b-mfkyz5yena] {
    text-align: left;
}

.activity-card i[b-mfkyz5yena] {
    font-size: 2.5rem;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    display: block;
}

.activity-card h3[b-mfkyz5yena] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
    letter-spacing: 0;
}

.activity-card p[b-mfkyz5yena] {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: #6b7280;
    margin: 0;
}

/* ============================================
   Membership Benefits - Simple List
   ============================================ */

.membership-benefits[b-mfkyz5yena] {
    list-style: none;
    padding: 0;
    margin: 2rem 0;
    max-width: 600px;
}

.membership-benefits li[b-mfkyz5yena] {
    padding: 0.75rem 0;
    padding-left: 2rem;
    position: relative;
    font-size: 1.0625rem;
    line-height: 1.7;
    color: #6b7280;
}

.membership-benefits li[b-mfkyz5yena]::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--cedar-green);
    font-weight: bold;
    font-size: 1.25rem;
}

/* ============================================
   Contact Section - Centered
   ============================================ */

.about-contact[b-mfkyz5yena] {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.phone-link[b-mfkyz5yena] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem;
    background: var(--cedar-green);
    color: #ffffff;
    border: 2px solid var(--cedar-green);
    text-decoration: none;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin: 1.5rem 0;
    /* Never wider than the column: a club's contact address is one long word, and at 344px it
       pushed the page 17px past the screen (#8149). It breaks before it overflows. */
    max-width: 100%;
    overflow-wrap: anywhere;
}

.phone-link:hover[b-mfkyz5yena] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

.contact-note[b-mfkyz5yena] {
    font-size: 0.9375rem;
    color: #6b7280;
}

.contact-note a[b-mfkyz5yena] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s ease;
}

.contact-note a:hover[b-mfkyz5yena] {
    color: var(--cedar-green-dark);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1024px) {
    .about-content[b-mfkyz5yena] {
        padding: 6rem 3rem;
    }

    .about-section[b-mfkyz5yena] {
        padding-bottom: 4rem;
        margin-bottom: 4rem;
    }
}

@media (max-width: 768px) {

    .about-content[b-mfkyz5yena] {
        padding: 4rem 2rem;
    }

    .about-section[b-mfkyz5yena] {
        padding-bottom: 3rem;
        margin-bottom: 3rem;
    }

    .about-section h2[b-mfkyz5yena] {
        font-size: 1.75rem;
    }

    .phone-link[b-mfkyz5yena] {
        padding: 1rem 1.25rem;
        letter-spacing: 0.02em;
    }

    .meeting-details-box[b-mfkyz5yena] {
        padding: 2rem;
    }

    .activities-grid[b-mfkyz5yena] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
}
/* /Components/Pages/Account/ChessComCallback.razor.rz.scp.css */
.callback-page[b-gjjag1zxd2] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}

.callback-card[b-gjjag1zxd2] {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 3rem;
    box-shadow: var(--shadow-lg);
    max-width: 500px;
    width: 100%;
    text-align: center;
}

.callback-loading[b-gjjag1zxd2],
.callback-success[b-gjjag1zxd2],
.callback-error[b-gjjag1zxd2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.callback-loading .spinner[b-gjjag1zxd2] {
    width: 4rem;
    height: 4rem;
    border: 4px solid var(--color-gray-light);
    border-top-color: var(--wilson-blue);
    border-radius: 50%;
    animation: spin-b-gjjag1zxd2 0.8s linear infinite;
}

@keyframes spin-b-gjjag1zxd2 {
    to { transform: rotate(360deg); }
}

.callback-loading h2[b-gjjag1zxd2],
.callback-success h2[b-gjjag1zxd2],
.callback-error h2[b-gjjag1zxd2] {
    font-family: var(--font-display);
    font-size: var(--font-size-2xl);
    color: var(--cedar-green);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.callback-loading p[b-gjjag1zxd2],
.callback-success p[b-gjjag1zxd2],
.callback-error p[b-gjjag1zxd2] {
    color: var(--color-text-secondary);
    margin: 0;
}

.callback-success i[b-gjjag1zxd2] {
    font-size: 4rem;
    color: #10b981;
}

.callback-error i[b-gjjag1zxd2] {
    font-size: 4rem;
    color: var(--color-error);
}

.btn-primary[b-gjjag1zxd2] {
    display: inline-block;
    padding: 0.875rem 2rem;
    background: linear-gradient(135deg, var(--wilson-blue) 0%, var(--cedar-green) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-base);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
    margin-top: 1rem;
}

.btn-primary:hover[b-gjjag1zxd2] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}
/* /Components/Pages/Account/ClaimAccount.razor.rz.scp.css */
.claim-page[b-fcb0tz2wjd] { background: #ffffff; }

.page-content[b-fcb0tz2wjd] { max-width: 560px; margin: 0 auto; padding: 3rem 1.5rem 4rem; }

.claim-card[b-fcb0tz2wjd] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    border-radius: 0;
}

.claim-grid[b-fcb0tz2wjd] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

.claim-field[b-fcb0tz2wjd] { display: flex; flex-direction: column; margin-bottom: 1.1rem; }
.claim-field label[b-fcb0tz2wjd] { font-weight: 600; margin-bottom: 0.4rem; color: #1f2937; }
.claim-field .hint[b-fcb0tz2wjd] { font-weight: 400; color: #6b7280; font-size: 0.85rem; }

.claim-field input[b-fcb0tz2wjd] {
    min-height: 48px;
    padding: 0 0.9rem;
    border: 1px solid #d1d5db;
    border-radius: 0.4rem;
    font-size: 1rem;
}
.claim-field input:focus[b-fcb0tz2wjd] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}
.claim-field input:disabled[b-fcb0tz2wjd] { background: #f3f4f6; color: #6b7280; }

.claim-error[b-fcb0tz2wjd] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
    padding: 0.75rem 1rem;
    border-radius: 0.4rem;
    margin-bottom: 1rem;
}

.claim-ok h2[b-fcb0tz2wjd] { color: var(--cedar-green, #2D5016); }
.claim-bad h2[b-fcb0tz2wjd] { color: #b91c1c; }
.claim-card h2[b-fcb0tz2wjd] { margin-top: 0; }

@media (max-width: 520px) {
    .claim-grid[b-fcb0tz2wjd] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Account/ConfirmEmail.razor.rz.scp.css */
/* Override login container width for confirmation pages */
[b-p9ybeszmln] .login-container {
    max-width: 600px;
}

[b-p9ybeszmln] .login-card {
    padding: 3rem 2.5rem;
}

.success-icon[b-p9ybeszmln] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.success-icon i[b-p9ybeszmln] {
    font-size: 4rem;
    color: var(--cedar-green);
}

.error-icon[b-p9ybeszmln] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.error-icon i[b-p9ybeszmln] {
    font-size: 4rem;
    color: var(--color-error);
}

.loading-spinner[b-p9ybeszmln] {
    text-align: center;
    padding: 2rem 0;
}

.spinner[b-p9ybeszmln] {
    width: 3rem;
    height: 3rem;
    border: 3px solid var(--color-gray-light);
    border-top-color: var(--cedar-green);
    border-radius: 50%;
    animation: spin-b-p9ybeszmln 0.8s linear infinite;
    margin: 0 auto 1rem auto;
}

@keyframes spin-b-p9ybeszmln {
    to { transform: rotate(360deg); }
}

.success-message[b-p9ybeszmln] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 4px solid var(--cedar-green);
    padding: 1.5rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
}

.success-message p[b-p9ybeszmln] {
    margin: 0 0 0.75rem 0;
    line-height: 1.6;
}

.success-message p:last-child[b-p9ybeszmln] {
    margin-bottom: 0;
}

[b-p9ybeszmln] .btn-primary {
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-lg);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
    text-decoration: none;
    display: inline-block;
    text-align: center;
    margin-bottom: 1rem;
}

[b-p9ybeszmln] .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.help-text[b-p9ybeszmln] {
    text-align: center;
    padding: 1rem;
    margin-bottom: 1rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.help-text strong[b-p9ybeszmln] {
    color: var(--color-text);
    display: block;
    margin-bottom: 0.5rem;
}

.help-text a[b-p9ybeszmln] {
    color: var(--cedar-green);
    text-decoration: none;
}

.help-text a:hover[b-p9ybeszmln] {
    text-decoration: underline;
}

.back-link[b-p9ybeszmln] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.back-link:hover[b-p9ybeszmln] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    [b-p9ybeszmln] .login-card {
        padding: 2rem 1.5rem;
    }

    [b-p9ybeszmln] .login-card h1 {
        font-size: var(--font-size-3xl);
    }
}
/* /Components/Pages/Account/DeleteAccount.razor.rz.scp.css */
/* ============================================
   Delete account - what the page shell has no opinion on (#8200)
   ============================================
   The layout is the shell's (PageHero / PageSection / ContentCard / Button / ErrorMessage).
   What is left here is the list of consequences, the warning note, the two form fields and the
   action row. Every color is a token; nothing is sized in a fixed pixel width, so the form fits
   a 344px phone without a sideways scroll.
   ============================================ */

.delete-cards[b-ywytyrd1k0] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    min-width: 0;
}

.delete-list[b-ywytyrd1k0] {
    margin: 0 0 1rem 0;
    padding: 0 0 0 1.25rem;
    max-width: 60ch;
    line-height: 1.6;
}

.delete-list li[b-ywytyrd1k0] {
    margin: 0 0 0.5rem 0;
    overflow-wrap: break-word;
}

/* The one sentence that matters most, marked with the error token rather than the accent: this
   is a warning, not a hint. The link inside it is underlined, not told apart by color alone, and
   drawn in the body ink: the site's link blue read 3.76:1 on this parchment ground on the
   editorial skin (#8391, WALK-1004b b2-8200), and the body ink is the text every skin draws on it. */
.delete-note[b-ywytyrd1k0] {
    margin: 0;
    padding: 0.875rem 1rem;
    border-left: 3px solid var(--color-error);
    background: var(--color-background);
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
    overflow-wrap: break-word;
}

.delete-note a[b-ywytyrd1k0] {
    color: var(--color-text);
    text-decoration: underline;
}

/* One field: its label, the control, and a hint under it. */
.delete-field[b-ywytyrd1k0] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin: 0 0 1.25rem 0;
    min-width: 0;
}

.delete-field label[b-ywytyrd1k0] {
    font-weight: 600;
    line-height: 1.4;
    color: var(--color-dark);
    overflow-wrap: break-word;
}

/* <InputText> renders the <input> inside the FRAMEWORK's component, so it carries no scope
   attribute of this page; ::deep is what reaches it. */
[b-ywytyrd1k0] .delete-input {
    width: 100%;
    max-width: 24rem;
    min-width: 0;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    line-height: 1.4;
}

[b-ywytyrd1k0] .delete-input:focus {
    outline: 2px solid var(--cedar-green);
    outline-offset: 1px;
    border-color: var(--cedar-green);
}

.delete-hint[b-ywytyrd1k0] {
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

/* Delete and Cancel wrap rather than overflow. */
.delete-actions[b-ywytyrd1k0] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    min-width: 0;
}
/* /Components/Pages/Account/EmailPreferences.razor.rz.scp.css */
/* ============================================
   Email preferences - what the page shell has no opinion on (#7587)
   ============================================
   The page had NO stylesheet and 69 inert Tailwind utility names, so the whole form - card,
   measure, spacing, checkbox chrome, buttons - came from nowhere. The layout is the shell's
   now (PageHero / PageSection / ContentCard / SuccessMessage / ErrorMessage / EmptyState /
   Button), which leaves one shape here: the preference ROW, a control beside the name of the
   thing it switches and one line saying what that thing is.

   Every color is a token, so a member of each club gets their own club's
   palette on the same markup. Nothing is sized in a fixed pixel width, so the row stacks into
   a 390px phone without the page scrolling sideways.
   ============================================ */

/* The stack of notification groups. One gap value, the shell's card rhythm. */
.preference-groups[b-3rt182rgoa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    min-width: 0;
    margin: 0 0 1.5rem 0;
}

/* The sentence that explains a whole group before its rows - why the library notifications
   cannot be switched off. It sets no colour: the card's own body ink reaches it. */
.preference-intro[b-3rt182rgoa] {
    margin: 0 0 1.25rem 0;
    max-width: 60ch;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.preference-list[b-3rt182rgoa] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.125rem;
    min-width: 0;
}

/* One row: the control, then the name and the explanation. The control column is sized by its
   own content rather than a fixed width, so a browser that draws a larger checkbox still
   lines the text up. `align-items: start` keeps the box on the first line of a name that
   wraps on a phone. */
.preference[b-3rt182rgoa] {
    display: flex;
    align-items: start;
    gap: 0.75rem;
    min-width: 0;
}

/* The checkbox. <InputCheckbox> renders the <input> inside the FRAMEWORK's component, so it
   carries no scope attribute of this page and a plain descendant selector would never reach
   it - ::deep is what does, and it reaches the three plain disabled inputs authored here too.
   accent-color is the whole of the chrome: the club's primary token paints the checked box,
   so each club's member sees that club's own brand color. */
.preference[b-3rt182rgoa]  input[type="checkbox"] {
    flex: 0 0 auto;
    width: 1.125rem;
    height: 1.125rem;
    margin: 0.125rem 0 0 0;
    accent-color: var(--cedar-green);
    cursor: pointer;
}

.preference[b-3rt182rgoa]  input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.preference-text[b-3rt182rgoa] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

/* The name of the preference. A <label> authored in this page, so no ::deep is needed. */
.preference-text label[b-3rt182rgoa] {
    font-weight: 600;
    line-height: 1.4;
    color: var(--color-dark);
    cursor: pointer;
    overflow-wrap: break-word;
}

.preference-hint[b-3rt182rgoa] {
    font-size: 0.875rem;
    line-height: 1.55;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

/* When the member last changed any of this - a quiet line, not a heading. */
.preference-updated[b-3rt182rgoa] {
    margin: 1.25rem 0 0 0;
    font-size: 0.875rem;
    color: var(--color-text-secondary);
}

/* Save and Cancel. They wrap rather than overflow, which is the difference between two
   buttons and a sideways scrollbar on a 390px phone. */
.preference-actions[b-3rt182rgoa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.5rem;
    min-width: 0;
}

/* #8173: the line that says the organization-wide unsubscribe is in force. The card's own ink and
   the intro's measure; only the weight marks it, so it reads as the state of the switch below. */
.organization-state[b-3rt182rgoa] {
    font-weight: 600;
}

/* #8173 review: under the switch, while club email is on, one line per sister club where the
   member's own news or event choice is off there (those stay per club). The intro's measure and
   size, set below the list rather than above it. */
.organization-note[b-3rt182rgoa] {
    margin: 1.25rem 0 0 0;
    max-width: 60ch;
    font-size: 0.9375rem;
    line-height: 1.6;
}

.organization-note + .organization-note[b-3rt182rgoa] {
    margin-top: 0.5rem;
}
/* /Components/Pages/Account/FamilyMembers.razor.rz.scp.css */
.family-page[b-gufue800wm] {
    max-width: 820px;
    margin: 0 auto;
    padding: 3rem 1.5rem 5rem;
}

.section-title[b-gufue800wm] {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin: 0 0 1rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Not-a-paid-member notice */
.notice[b-gufue800wm] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.5rem;
    background: var(--river-pearl, #F5F5F0);
    border-left: 4px solid var(--wheat-gold, #D4AF37);
}
.notice > i[b-gufue800wm] { color: var(--cedar-green, #2D5016); font-size: 1.4rem; margin-top: 0.1rem; }
.notice p[b-gufue800wm] { margin: 0 0 1rem; color: #374151; line-height: 1.5; }

/* Current family */
.family-section[b-gufue800wm] { margin-bottom: 2.5rem; }

.member-list[b-gufue800wm] { display: flex; flex-direction: column; gap: 0.5rem; }

.member-row[b-gufue800wm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #ffffff;
}

.member-main[b-gufue800wm] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.member-name[b-gufue800wm] { font-weight: 700; color: #111827; }
.member-email[b-gufue800wm] { font-size: 0.85rem; color: #6b7280; overflow: hidden; text-overflow: ellipsis; }

.member-badges[b-gufue800wm] { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }

.tier-badge[b-gufue800wm] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.55rem;
    color: var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.08);
}

.claim-badge[b-gufue800wm] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.78rem;
    font-weight: 600;
}
.claim-badge.claimed[b-gufue800wm] { color: var(--cedar-green, #2D5016); }
.claim-badge.pending[b-gufue800wm] { color: var(--tobacco-barn-red, #8B4513); }
.claim-badge.activating[b-gufue800wm] { color: var(--cedar-green, #2D5016); }

/* Add members */
.add-section[b-gufue800wm] { margin-top: 1rem; }
.hint[b-gufue800wm] { color: #4b5563; line-height: 1.6; margin: 0 0 1.25rem; }

.new-member[b-gufue800wm] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}
.new-member .num[b-gufue800wm] {
    flex: 0 0 1.6rem;
    height: 1.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    color: #fff;
    background: var(--cedar-green, #2D5016);
    border-radius: 50%;
}
.new-member .fld[b-gufue800wm] {
    flex: 1 1 0;
    min-width: 0;
    padding: 0.6rem 0.75rem;
    border: 1px solid #d1d5db;
    font-size: 0.95rem;
    font-family: inherit;
}
.new-member .fld:focus[b-gufue800wm] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}
.new-member .remove[b-gufue800wm] {
    flex: 0 0 auto;
    border: none;
    background: transparent;
    color: #9ca3af;
    cursor: pointer;
    font-size: 1rem;
    padding: 0.4rem;
}
.new-member .remove:hover[b-gufue800wm] { color: var(--tobacco-barn-red, #8B4513); }

.add-row[b-gufue800wm] {
    border: 1px dashed #9ca3af;
    background: transparent;
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
    padding: 0.55rem 1rem;
    cursor: pointer;
    margin-top: 0.25rem;
}
.add-row:hover[b-gufue800wm] { border-color: var(--cedar-green, #2D5016); background: rgba(var(--cedar-green-rgb), 0.04); }

.add-actions[b-gufue800wm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.total[b-gufue800wm] { font-size: 1.05rem; color: #111827; }
.total strong[b-gufue800wm] { color: var(--cedar-green, #2D5016); font-size: 1.25rem; }
.total-sub[b-gufue800wm] { display: block; font-size: 0.8rem; color: #6b7280; font-weight: 400; }

@media (max-width: 640px) {
    .new-member[b-gufue800wm] { flex-wrap: wrap; }
    .new-member .fld[b-gufue800wm] { flex: 1 1 100%; }
}

/* #8384: a covered member's birth date, given by the primary - attached under the member's row. */
.member-birth-date[b-gufue800wm] {
    margin-top: -0.5rem;
    padding: 0.75rem 1.1rem 0.9rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-top: none;
    background: var(--river-pearl, #F5F5F0);
    min-width: 0;
}
.member-birth-date label[b-gufue800wm] {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
    overflow-wrap: break-word;
}
.member-birth-date-row[b-gufue800wm] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}
.member-birth-date-row input[b-gufue800wm] {
    flex: 1 1 10rem;
    min-width: 0;
    max-width: 16rem;
    min-height: 2.5rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    background: #ffffff;
    font-size: 0.95rem;
    font-family: inherit;
}
.member-birth-date-row input:focus[b-gufue800wm] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}
.member-birth-date-hint[b-gufue800wm] {
    display: block;
    margin-top: 0.4rem;
    font-size: 0.8rem;
    line-height: 1.5;
    color: #4b5563;
}
.member-birth-date-error[b-gufue800wm] {
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-left: 3px solid #dc2626;
    background: rgba(220, 38, 38, 0.08);
    color: #b91c1c;
    font-size: 0.9rem;
}
.member-birth-date-saved[b-gufue800wm] {
    margin: 0.75rem 0 0;
    padding: 0.6rem 0.9rem;
    border-left: 3px solid var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.08);
    color: #1f2937;
    line-height: 1.5;
}
/* /Components/Pages/Account/ForgotPassword.razor.rz.scp.css */
.login-page[b-0e7lgqxmkm] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    padding: 2rem 1rem;
}

.login-container[b-0e7lgqxmkm] {
    width: 100%;
    max-width: 450px;
}

.login-card[b-0e7lgqxmkm] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
}

.login-card h1[b-0e7lgqxmkm] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.5rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.subtitle[b-0e7lgqxmkm] {
    text-align: center;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    font-size: var(--font-size-base);
}

.alert-info[b-0e7lgqxmkm] {
    background: #ecfdf5;
    border: 1px solid #10b981;
    color: #065f46;
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary[b-0e7lgqxmkm] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary ul[b-0e7lgqxmkm] {
    margin: 0;
    padding-left: 1.5rem;
}

.form-group[b-0e7lgqxmkm] {
    margin-bottom: 1.5rem;
}

.form-group label[b-0e7lgqxmkm] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-0e7lgqxmkm] .form-input,
[b-0e7lgqxmkm] input[type="email"] {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}

[b-0e7lgqxmkm] .form-input::placeholder,
[b-0e7lgqxmkm] input::placeholder {
    color: var(--color-gray);
}

[b-0e7lgqxmkm] .form-input:hover,
[b-0e7lgqxmkm] input:hover {
    border-color: var(--color-gray);
}

[b-0e7lgqxmkm] .form-input:focus,
[b-0e7lgqxmkm] input:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08);
    background: var(--color-white);
}

.validation-message[b-0e7lgqxmkm] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin-top: 0.5rem;
    display: block;
}

.btn-primary[b-0e7lgqxmkm] {
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-lg);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.btn-primary:hover:not(:disabled)[b-0e7lgqxmkm] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-primary:active:not(:disabled)[b-0e7lgqxmkm] {
    transform: translateY(0);
}

.btn-primary:disabled[b-0e7lgqxmkm] {
    opacity: 0.6;
    cursor: not-allowed;
}

.login-footer[b-0e7lgqxmkm] {
    margin-top: 2rem;
    text-align: center;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.login-footer a[b-0e7lgqxmkm] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.login-footer a:hover[b-0e7lgqxmkm] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .login-card[b-0e7lgqxmkm] {
        padding: 2rem 1.5rem;
    }

    .login-card h1[b-0e7lgqxmkm] {
        font-size: var(--font-size-3xl);
    }
}
/* /Components/Pages/Account/GuardianConsent.razor.rz.scp.css */
/* A parent's or guardian's consent (#8177). The layout is the shell's; what is left is the consent
   form's rows and the list of people. Every color is a token; nothing has a fixed pixel width, so
   the rows stack at 344px. */

.consent-groups[b-f6434eaxfy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    min-width: 0;
}

.consent-lead[b-f6434eaxfy] {
    margin: 0 0 1rem 0;
    line-height: 1.6;
}

.consent-relationship[b-f6434eaxfy] {
    border: 0;
    margin: 0 0 1rem 0;
    padding: 0;
    display: grid;
    gap: 0.5rem;
}

.consent-relationship legend[b-f6434eaxfy] {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.consent-check[b-f6434eaxfy] {
    display: flex;
    align-items: start;
    gap: 0.75rem;
    margin: 0 0 0.75rem 0;
}

.consent-check input[b-f6434eaxfy] {
    flex: 0 0 auto;
    margin-top: 0.2rem;
    accent-color: var(--cedar-green);
}

.consent-list[b-f6434eaxfy] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 1rem;
}

.consent-row[b-f6434eaxfy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

.consent-row-text[b-f6434eaxfy] {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.consent-row-text span[b-f6434eaxfy] {
    color: var(--color-text-secondary);
}

/* #8178: a consent to a full name or to photos names what it is for, above its status. */
.consent-row-text .consent-purpose[b-f6434eaxfy] {
    color: var(--color-text);
    font-size: 0.85rem;
    font-weight: 600;
}

/* #8442: the family card. Each young member is a block - their name and where they stand on the lists,
   the attestation to being THEIR parent or guardian, then one row per purpose with its own button - so
   the blocks stack at 344px like the rest. */
.family-list[b-f6434eaxfy] {
    gap: 1.5rem;
}

.family-member[b-f6434eaxfy] {
    display: grid;
    gap: 0.75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--color-gray-light);
    min-width: 0;
}

.family-member-head[b-f6434eaxfy] {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.family-listing[b-f6434eaxfy] {
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
}

.family-member .consent-list[b-f6434eaxfy] {
    gap: 0.75rem;
}

/* #8442 review round 3, finding 5: the member's answer sits in their block. The wrapper is a marker only, so its
   children are the block's own grid items: the refusal when there is one, and the success's live region - which,
   empty, is out of the flow (SuccessMessage.razor.css) and so adds no row and no gap to the block. */
.family-member-result[b-f6434eaxfy] {
    display: contents;
}
/* /Components/Pages/Account/LegacyUnsubscribeLink.razor.rz.scp.css */
/* ============================================
   The legacy unsubscribe link (#8173) - what the page shell has no opinion on
   ============================================
   The same two shapes as the unsubscribe page beside it: the running line inside the card, and
   the aside about the email an unsubscribe does not stop. Every color is a token, so each club's
   member sees their own club's palette. Nothing has a fixed width, so it wraps at 344px.
   ============================================ */

.legacy-lead[b-egt9nmtw3u] {
    margin: 0 0 1rem 0;
    max-width: 60ch;
    line-height: 1.7;
}

.legacy-note[b-egt9nmtw3u] {
    margin: 0;
    padding: 0.875rem 1rem;
    border-left: 3px solid var(--accent-rule);
    background: var(--color-background);
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
    overflow-wrap: break-word;
}
/* /Components/Pages/Account/LichessCallback.razor.rz.scp.css */
.callback-page[b-dq0ozw47f2] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}

.callback-card[b-dq0ozw47f2] {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 3rem;
    box-shadow: var(--shadow-lg);
    max-width: 500px;
    width: 100%;
    text-align: center;
}

.callback-loading[b-dq0ozw47f2],
.callback-success[b-dq0ozw47f2],
.callback-error[b-dq0ozw47f2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.callback-loading .spinner[b-dq0ozw47f2] {
    width: 4rem;
    height: 4rem;
    border: 4px solid var(--color-gray-light);
    border-top-color: var(--wilson-blue);
    border-radius: 50%;
    animation: spin-b-dq0ozw47f2 0.8s linear infinite;
}

@keyframes spin-b-dq0ozw47f2 {
    to { transform: rotate(360deg); }
}

.callback-loading h2[b-dq0ozw47f2],
.callback-success h2[b-dq0ozw47f2],
.callback-error h2[b-dq0ozw47f2] {
    font-family: var(--font-display);
    font-size: var(--font-size-2xl);
    color: var(--cedar-green);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.callback-loading p[b-dq0ozw47f2],
.callback-success p[b-dq0ozw47f2],
.callback-error p[b-dq0ozw47f2] {
    color: var(--color-text-secondary);
    margin: 0;
}

.callback-success i[b-dq0ozw47f2] {
    font-size: 4rem;
    color: #10b981;
}

.callback-error i[b-dq0ozw47f2] {
    font-size: 4rem;
    color: var(--color-error);
}

.btn-primary[b-dq0ozw47f2] {
    display: inline-block;
    padding: 0.875rem 2rem;
    background: linear-gradient(135deg, var(--wilson-blue) 0%, var(--cedar-green) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-base);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
    margin-top: 1rem;
}

.btn-primary:hover[b-dq0ozw47f2] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}
/* /Components/Pages/Account/ListingSettings.razor.rz.scp.css */
/* The member's own listing (#8177). The layout is the shell's (PageHero, PageSection, ContentCard,
   Button, SuccessMessage, ErrorMessage); what is left here is the status list and the two choices.
   Every color is a token, and nothing has a fixed pixel width, so the cards stack at 344px. */

.listing-groups[b-g8usoife6u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    min-width: 0;
}

.listing-status[b-g8usoife6u] {
    list-style: none;
    margin: 0 0 1rem 0;
    padding: 0;
    display: grid;
    gap: 0.5rem;
}

.listing-state[b-g8usoife6u] {
    margin: 0 0 1rem 0;
    font-weight: 600;
    color: var(--color-text);
}

.listing-note[b-g8usoife6u] {
    margin: 0.5rem 0 0 0;
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
}

/* A link in a note is told from its sentence by more than color (#8443, WALK-1005f b2-consent: axe
   link-in-text-block, the "profile page" link at 1.47:1 against the note's own words). */
.listing-note a[b-g8usoife6u] {
    text-decoration: underline;
}

.listing-choice[b-g8usoife6u] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.75rem;
    margin: 0 0 1.5rem 0;
    min-width: 0;
}

.listing-check[b-g8usoife6u] {
    display: flex;
    align-items: start;
    gap: 0.75rem;
}

.listing-check input[type="checkbox"][b-g8usoife6u] {
    flex: 0 0 auto;
    margin-top: 0.2rem;
    accent-color: var(--cedar-green);
}

.listing-label[b-g8usoife6u] {
    margin: 0;
    font-weight: 600;
    color: var(--color-text);
}
/* /Components/Pages/Account/Login.razor.rz.scp.css */
.login-page[b-0uf60j7hdg] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    padding: 2rem 1rem;
}

.login-container[b-0uf60j7hdg] {
    width: 100%;
    max-width: 450px;
}

.login-card[b-0uf60j7hdg] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
}

.login-card h1[b-0uf60j7hdg] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.5rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.subtitle[b-0uf60j7hdg] {
    text-align: center;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    font-size: var(--font-size-base);
}

.alert-error[b-0uf60j7hdg] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary[b-0uf60j7hdg] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary ul[b-0uf60j7hdg] {
    margin: 0;
    padding-left: 1.5rem;
}

.form-group[b-0uf60j7hdg] {
    margin-bottom: 1.5rem;
}

.form-group label[b-0uf60j7hdg] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-0uf60j7hdg] .form-input,
[b-0uf60j7hdg] input[type="email"],
[b-0uf60j7hdg] input[type="password"],
[b-0uf60j7hdg] input[type="text"] {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}

[b-0uf60j7hdg] .form-input::placeholder,
[b-0uf60j7hdg] input::placeholder {
    color: var(--color-gray);
}

[b-0uf60j7hdg] .form-input:hover,
[b-0uf60j7hdg] input:hover {
    border-color: var(--color-gray);
}

[b-0uf60j7hdg] .form-input:focus,
[b-0uf60j7hdg] input:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08);
    background: var(--color-white);
}

.checkbox-group[b-0uf60j7hdg] {
    margin-bottom: 1.5rem;
}

.checkbox-group label[b-0uf60j7hdg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: normal;
    text-transform: none;
    letter-spacing: normal;
}

.checkbox-group input[type="checkbox"][b-0uf60j7hdg] {
    width: 1.25rem;
    height: 1.25rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

.validation-message[b-0uf60j7hdg] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin-top: 0.5rem;
    display: block;
}

.btn-primary[b-0uf60j7hdg] {
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-lg);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.btn-primary:hover:not(:disabled)[b-0uf60j7hdg] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-primary:active:not(:disabled)[b-0uf60j7hdg] {
    transform: translateY(0);
}

.btn-primary:disabled[b-0uf60j7hdg] {
    opacity: 0.6;
    cursor: not-allowed;
}

.login-divider[b-0uf60j7hdg] {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 2rem 0 1.5rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
}

.login-divider[b-0uf60j7hdg]::before,
.login-divider[b-0uf60j7hdg]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--color-gray-light);
}

.login-divider span[b-0uf60j7hdg] {
    padding: 0 1rem;
}

.btn-secondary[b-0uf60j7hdg] {
    width: 100%;
    padding: 0.875rem 1.5rem;
    background: var(--color-white);
    color: var(--cedar-green);
    border: 1.5px solid var(--cedar-green);
    border-radius: var(--radius-lg);
    font-size: var(--font-size-base);
    font-weight: 600;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.btn-secondary:hover:not(:disabled)[b-0uf60j7hdg] {
    background: var(--cedar-green);
    color: var(--color-white);
}

.btn-secondary:disabled[b-0uf60j7hdg] {
    opacity: 0.6;
    cursor: not-allowed;
}

.alert-info[b-0uf60j7hdg] {
    background: #ecfdf5;
    border: 1px solid var(--cedar-green);
    color: var(--cedar-green);
    padding: 1rem 1.25rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1rem;
    font-size: var(--font-size-sm);
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    line-height: 1.5;
}

.alert-info i[b-0uf60j7hdg] {
    font-size: 1.25rem;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.login-footer[b-0uf60j7hdg] {
    margin-top: 2rem;
    text-align: center;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.login-footer a[b-0uf60j7hdg] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.login-footer a:hover[b-0uf60j7hdg] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .login-card[b-0uf60j7hdg] {
        padding: 2rem 1.5rem;
    }

    .login-card h1[b-0uf60j7hdg] {
        font-size: var(--font-size-3xl);
    }
}

/* ---- Sister-club sign-in (#7561) ---- */

.sister-signin[b-0uf60j7hdg] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

/* An anchor styled as the page's secondary button, so it lines up with the magic-link
   button below it rather than reading as a stray link. */
.sister-signin-button[b-0uf60j7hdg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    text-decoration: none;
    text-align: center;
}

.sister-signin-copy[b-0uf60j7hdg] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--color-text-secondary);
    text-align: center;
}
/* /Components/Pages/Account/Logout.razor.rz.scp.css */
.logout-page[b-rarzw5x34w] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--wilson-blue, #4A6FA5) 0%, var(--cedar-green, #2D5016) 100%);
}

.logout-container[b-rarzw5x34w] {
    width: 100%;
    max-width: 400px;
    padding: 2rem;
}

.logout-card[b-rarzw5x34w] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
    text-align: center;
}

.logout-spinner[b-rarzw5x34w] {
    width: 50px;
    height: 50px;
    margin: 0 auto 1.5rem;
    border: 4px solid var(--color-gray-lighter);
    border-top: 4px solid var(--wilson-blue);
    border-radius: 50%;
    animation: spin-b-rarzw5x34w 1s linear infinite;
}

@keyframes spin-b-rarzw5x34w {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.logout-card h2[b-rarzw5x34w] {
    color: var(--cedar-green);
    font-size: var(--font-size-2xl);
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0;
}
/* /Components/Pages/Account/MagicLinkConfirm.razor.rz.scp.css */
.login-page[b-qrzcrqzkte] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    padding: 2rem 1rem;
}

.login-container[b-qrzcrqzkte] {
    width: 100%;
    max-width: 450px;
}

.login-card[b-qrzcrqzkte] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
    text-align: center;
}

.login-card h1[b-qrzcrqzkte] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin: 1rem 0 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.subtitle[b-qrzcrqzkte] {
    color: var(--color-text-secondary);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-base);
}

.success-icon[b-qrzcrqzkte],
.error-icon[b-qrzcrqzkte] {
    font-size: 3.5rem;
    line-height: 1;
}

.success-icon[b-qrzcrqzkte] {
    color: var(--cedar-green);
}

.error-icon[b-qrzcrqzkte] {
    color: var(--color-error);
}

.email-callout[b-qrzcrqzkte] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--cedar-green);
    margin: 0.25rem 0 2rem;
    word-break: break-all;
}

.btn-primary[b-qrzcrqzkte] {
    width: 100%;
    padding: 1rem 1.5rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: var(--color-white);
    border: none;
    border-radius: 50px;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn-primary:hover[b-qrzcrqzkte] {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(var(--cedar-green-rgb), 0.25);
}

.alert-error[b-qrzcrqzkte] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin: 1.5rem 0;
    font-size: var(--font-size-sm);
    text-align: left;
}

.help-text[b-qrzcrqzkte] {
    margin-top: 1.5rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.login-footer[b-qrzcrqzkte] {
    margin-top: 1.5rem;
    text-align: center;
}

.login-footer a[b-qrzcrqzkte] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
}

.login-footer a:hover[b-qrzcrqzkte] {
    text-decoration: underline;
}
/* /Components/Pages/Account/MyData.razor.rz.scp.css */
/* ============================================
   My data - what the page shell has no opinion on (#8200)
   ============================================
   The layout is the shell's (PageHero / PageSection / ContentCard / Button / SuccessMessage /
   ErrorMessage). What is left here is the running prose inside the cards, the list of what the
   download holds, the quieter note about what it never holds, and the action row. Every color
   is a token, so a member of either club reads it in their own club's palette, and nothing is
   sized in a fixed pixel width, so the cards stack into a 344px phone without a sideways scroll.
   ============================================ */

.data-cards[b-gzxmi5zaqg] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    min-width: 0;
}

/* Running prose inside a card. It sets no color: the card's own body ink reaches it. */
.data-lead[b-gzxmi5zaqg] {
    margin: 0 0 1rem 0;
    max-width: 60ch;
    line-height: 1.7;
    overflow-wrap: break-word;
}

.data-list[b-gzxmi5zaqg] {
    margin: 0 0 1rem 0;
    padding: 0 0 0 1.25rem;
    max-width: 60ch;
    line-height: 1.6;
}

.data-list li[b-gzxmi5zaqg] {
    margin: 0 0 0.5rem 0;
    overflow-wrap: break-word;
}

/* What a download never contains: a quieter step beside the list, marked by the club's accent rule. */
.data-note[b-gzxmi5zaqg] {
    margin: 0 0 1.25rem 0;
    padding: 0.875rem 1rem;
    border-left: 3px solid var(--accent-rule);
    background: var(--color-background);
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
    overflow-wrap: break-word;
}

/* The action row wraps rather than overflows. */
.data-actions[b-gzxmi5zaqg] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin: 0 0 1rem 0;
    min-width: 0;
}

.data-actions:last-child[b-gzxmi5zaqg] {
    margin-bottom: 0;
}
/* /Components/Pages/Account/MyEvents.razor.rz.scp.css */
.my-events-page[b-p7xh99r1ng] {
    background: #ffffff;
}

.page-content[b-p7xh99r1ng] {
    max-width: 1100px;
    margin: 0 auto;
    padding: 3.5rem 2rem;
}

.registration-list[b-p7xh99r1ng] {
    display: grid;
    gap: 1.25rem;
}

.reg-card[b-p7xh99r1ng] {
    padding: 1.5rem 1.75rem;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.reg-card.reg-past[b-p7xh99r1ng] {
    opacity: 0.72;
}

.reg-card-top[b-p7xh99r1ng] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.reg-status-badge[b-p7xh99r1ng] {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
}

.reg-status-badge.status-pending[b-p7xh99r1ng] {
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #a67b1e;
}

.reg-status-badge.status-cancelled[b-p7xh99r1ng] {
    background: rgba(107, 114, 128, 0.15);
    color: #374151;
}

.reg-status-badge.status-checkedin[b-p7xh99r1ng] {
    background: rgba(var(--wilson-blue-rgb), 0.12);
    color: var(--wilson-blue, #4A6FA5);
}

.reg-past-badge[b-p7xh99r1ng] {
    font-size: 0.7rem;
    color: var(--color-text-secondary);
    text-transform: uppercase;
    font-family: var(--font-display);
    letter-spacing: 0.05em;
}

/* The event is no longer on the site (#8188). Darker than "Past" so it still reads on a past row, which the card fades to 0.72. */
.reg-removed-badge[b-p7xh99r1ng] {
    font-size: 0.7rem;
    color: #374151;
    text-transform: uppercase;
    font-family: var(--font-display);
    letter-spacing: 0.05em;
}

.reg-title[b-p7xh99r1ng] {
    font-family: var(--font-display);
    font-size: 1.375rem;
    font-weight: 700;
    margin: 0;
    color: #111827;
}

.reg-title a[b-p7xh99r1ng] {
    color: inherit;
    text-decoration: none;
}

.reg-title a:hover[b-p7xh99r1ng] {
    color: var(--cedar-green, #2D5016);
}

.reg-meta[b-p7xh99r1ng] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.5rem 1.25rem;
    color: #4b5563;
    font-size: 0.9375rem;
}

.reg-meta i[b-p7xh99r1ng] {
    width: 18px;
    color: var(--color-text-secondary);
    margin-right: 0.375rem;
}

/* The host club (#8268): the list spans every club of the organization, so each card says whose event it is. */
.reg-club[b-p7xh99r1ng] {
    font-weight: 600;
    color: #374151;
}

.reg-actions[b-p7xh99r1ng] {
    margin-top: 0.5rem;
}

/* In place of Cancel on an upcoming row whose event was removed (#8254). */
.reg-removed-note[b-p7xh99r1ng] {
    margin: 0.5rem 0 0;
    color: var(--color-gray-dark);
    font-size: 0.9375rem;
}

.reg-removed-note a[b-p7xh99r1ng] {
    color: var(--cedar-green);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .page-content[b-p7xh99r1ng] { padding: 2rem 1.25rem; }
    .reg-card[b-p7xh99r1ng] { padding: 1.25rem; }
}

.reg-status-badge.status-waitlisted[b-p7xh99r1ng] {
    background: rgba(var(--wheat-gold-rgb), 0.18);
    color: #8a6b11;
}

/* Cancellation / refund confirmation */
.cancel-status[b-p7xh99r1ng] {
    margin: 1rem 0;
    padding: 0.75rem 1rem;
    border-left: 3px solid var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.06);
    color: var(--cedar-green, #2D5016);
    font-size: 0.95rem;
}
/* /Components/Pages/Account/PaymentHistory.razor.rz.scp.css */
.payment-history-container[b-yjx3b5j0ty] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.loading-state[b-yjx3b5j0ty] {
    text-align: center;
    padding: 4rem 2rem;
}

.loading-state i[b-yjx3b5j0ty] {
    font-size: 3rem;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.loading-state p[b-yjx3b5j0ty] {
    font-size: 1.25rem;
    color: #666;
}

.error-message[b-yjx3b5j0ty] {
    background: #fee;
    border: 2px solid #e44;
    color: #c33;
    padding: 1.5rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2rem;
}

.error-message i[b-yjx3b5j0ty] {
    font-size: 1.5rem;
}

/* Current Subscription */
.current-subscription[b-yjx3b5j0ty] {
    margin-bottom: 3rem;
}

.current-subscription h2[b-yjx3b5j0ty] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.subscription-card[b-yjx3b5j0ty] {
    background: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.subscription-header[b-yjx3b5j0ty] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 2px solid var(--limestone-cream);
}

.tier-badge[b-yjx3b5j0ty] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.5rem;
    font-weight: 700;
}

.tier-badge.community[b-yjx3b5j0ty] { color: var(--wilson-blue); }
.tier-badge.basic[b-yjx3b5j0ty] { color: var(--cedar-green); }
.tier-badge.standard[b-yjx3b5j0ty] { color: var(--wheat-gold); }
.tier-badge.premium[b-yjx3b5j0ty] { color: var(--tobacco-barn-red); }
.tier-badge.champion[b-yjx3b5j0ty] { color: #C41E3A; }

.subscription-status[b-yjx3b5j0ty] {
    padding: 0.5rem 1.5rem;
    border-radius: 2rem;
    font-weight: 700;
    font-size: 1rem;
}

/* Status grounds are the status tokens (#8150): white text on each reads 4.5:1 or better. */
.subscription-status.active[b-yjx3b5j0ty] {
    background: var(--status-success);
    color: var(--status-ink);
}

.subscription-status.cancelled[b-yjx3b5j0ty],
.subscription-status.refunded[b-yjx3b5j0ty] {
    background: var(--status-danger);
    color: var(--status-ink);
}

.subscription-status.pastdue[b-yjx3b5j0ty],
.subscription-status.pending[b-yjx3b5j0ty] {
    background: var(--status-warning);
    color: var(--status-ink);
}

.subscription-status.expired[b-yjx3b5j0ty] {
    background: var(--status-neutral);
    color: var(--status-ink);
}

.subscription-details[b-yjx3b5j0ty] {
    margin-bottom: 1rem;
}

.detail-row[b-yjx3b5j0ty] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--limestone-cream);
}

.detail-row:last-child[b-yjx3b5j0ty] {
    border-bottom: none;
}

.detail-row .label[b-yjx3b5j0ty] {
    font-weight: 600;
    color: #666;
}

.detail-row .value[b-yjx3b5j0ty] {
    font-weight: 700;
    color: var(--cedar-green);
    /* A value that wraps at phone width stays against the right edge. */
    text-align: right;
}

/* Under the details: the membership does not renew and nothing is charged again (#8061). */
.renewal-note[b-yjx3b5j0ty] {
    margin: 0 0 2rem 0;
}

.subscription-actions[b-yjx3b5j0ty] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
}

.no-subscription[b-yjx3b5j0ty] {
    background: white;
    padding: 3rem 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    text-align: center;
    margin-bottom: 3rem;
}

.no-subscription i[b-yjx3b5j0ty] {
    font-size: 3rem;
    color: var(--wilson-blue);
    margin-bottom: 1rem;
}

.no-subscription p[b-yjx3b5j0ty] {
    font-size: 1.25rem;
    color: #666;
    margin-bottom: 1.5rem;
}

/* Payment History Table */
.payment-history-section[b-yjx3b5j0ty] {
    margin-bottom: 3rem;
}

.payment-history-section h2[b-yjx3b5j0ty] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.payments-table-wrapper[b-yjx3b5j0ty] {
    background: white;
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.payments-table[b-yjx3b5j0ty] {
    width: 100%;
    border-collapse: collapse;
}

.payments-table thead[b-yjx3b5j0ty] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.payments-table th[b-yjx3b5j0ty] {
    padding: 1rem;
    text-align: left;
    font-weight: 700;
    font-size: 0.95rem;
}

.payments-table td[b-yjx3b5j0ty] {
    padding: 1rem;
    border-bottom: 1px solid var(--limestone-cream);
}

.payments-table tbody tr:hover[b-yjx3b5j0ty] {
    background: var(--river-pearl);
}

.payments-table tbody tr:last-child td[b-yjx3b5j0ty] {
    border-bottom: none;
}

/* A sister club's payment names the club that holds it (#8268), on its own line under the description. */
.payment-club[b-yjx3b5j0ty] {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.85rem;
    color: #4b5563;
}

.payment-type[b-yjx3b5j0ty] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    background: var(--limestone-cream);
    color: var(--cedar-green);
    border-radius: 1rem;
    font-size: 0.875rem;
    font-weight: 600;
}

.amount[b-yjx3b5j0ty] {
    font-weight: 700;
    color: var(--cedar-green);
    font-size: 1.125rem;
}

.amount .refunded[b-yjx3b5j0ty] {
    color: var(--status-danger);
}

.status-badge[b-yjx3b5j0ty] {
    display: inline-block;
    padding: 0.375rem 0.875rem;
    border-radius: 1rem;
    font-size: 0.875rem;
    font-weight: 700;
}

.status-badge.completed[b-yjx3b5j0ty] {
    background: var(--status-success);
    color: var(--status-ink);
}

.status-badge.pending[b-yjx3b5j0ty] {
    background: var(--status-warning);
    color: var(--status-ink);
}

.status-badge.failed[b-yjx3b5j0ty] {
    background: var(--status-danger);
    color: var(--status-ink);
}

.status-badge.refunded[b-yjx3b5j0ty],
.status-badge.cancelled[b-yjx3b5j0ty] {
    background: var(--status-neutral);
    color: var(--status-ink);
}

.receipt-link[b-yjx3b5j0ty] {
    color: var(--wilson-blue);
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.receipt-link:hover[b-yjx3b5j0ty] {
    color: var(--cedar-green);
    text-decoration: underline;
}

.refund-row[b-yjx3b5j0ty] {
    background: #fef3c7 !important;
}

.refund-row td[b-yjx3b5j0ty] {
    padding: 0.75rem 1rem !important;
    font-style: italic;
    color: #92400e;
}

.refund-row i[b-yjx3b5j0ty] {
    margin-right: 0.5rem;
}

.text-muted[b-yjx3b5j0ty] {
    color: var(--color-text-secondary);
}

/* Buttons */
.btn[b-yjx3b5j0ty] {
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-yjx3b5j0ty] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-primary:hover[b-yjx3b5j0ty] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
}

.btn-secondary[b-yjx3b5j0ty] {
    background: var(--wheat-gold);
    color: var(--on-gold);
}

.btn-secondary:hover[b-yjx3b5j0ty] {
    background: #C49F27;
    transform: translateY(-2px);
}

.btn-danger[b-yjx3b5j0ty] {
    background: var(--status-danger);
    color: var(--status-ink);
}

.btn-danger:hover[b-yjx3b5j0ty] {
    background: #dc2626;
    transform: translateY(-2px);
}

/* Upgrade Section */
.upgrade-section[b-yjx3b5j0ty] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
}

.upgrade-section h3[b-yjx3b5j0ty] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.upgrade-section h3 i[b-yjx3b5j0ty] {
    color: var(--wheat-gold);
}

.upgrade-intro[b-yjx3b5j0ty] {
    color: #666;
    margin-bottom: 1.5rem;
    font-size: 1rem;
}

.upgrade-options[b-yjx3b5j0ty] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.upgrade-card[b-yjx3b5j0ty] {
    background: linear-gradient(135deg, var(--river-pearl) 0%, #fff 100%);
    border: 2px solid var(--limestone-cream);
    border-radius: 1rem;
    padding: 1.5rem;
    transition: all 0.3s ease;
}

.upgrade-card:hover[b-yjx3b5j0ty] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(var(--cedar-green-rgb), 0.15);
    border-color: var(--cedar-green);
}

.upgrade-card.basic[b-yjx3b5j0ty] {
    border-color: var(--cedar-green);
}

.upgrade-card.standard[b-yjx3b5j0ty] {
    border-color: var(--wheat-gold);
}

.upgrade-card.premium[b-yjx3b5j0ty] {
    border-color: var(--tobacco-barn-red);
}

.upgrade-card.champion[b-yjx3b5j0ty] {
    border-color: #C41E3A;
}

.upgrade-card-header[b-yjx3b5j0ty] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--limestone-cream);
}

.upgrade-tier-badge[b-yjx3b5j0ty] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.upgrade-tier-badge i[b-yjx3b5j0ty] {
    font-size: 1.5rem;
}

.upgrade-card.basic .upgrade-tier-badge[b-yjx3b5j0ty] { color: var(--cedar-green); }
.upgrade-card.standard .upgrade-tier-badge[b-yjx3b5j0ty] { color: var(--wheat-gold); }
.upgrade-card.premium .upgrade-tier-badge[b-yjx3b5j0ty] { color: var(--tobacco-barn-red); }
.upgrade-card.champion .upgrade-tier-badge[b-yjx3b5j0ty] { color: #C41E3A; }

.upgrade-price[b-yjx3b5j0ty] {
    text-align: right;
}

.upgrade-price .price[b-yjx3b5j0ty] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.upgrade-price .period[b-yjx3b5j0ty] {
    font-size: 0.875rem;
    color: #666;
}

.upgrade-benefits[b-yjx3b5j0ty] {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem 0;
}

.upgrade-benefits li[b-yjx3b5j0ty] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.5rem 0;
    font-size: 0.95rem;
    color: #333;
}

.upgrade-benefits li i[b-yjx3b5j0ty] {
    color: #22c55e;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.btn-upgrade[b-yjx3b5j0ty] {
    width: 100%;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    padding: 0.875rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.btn-upgrade:hover[b-yjx3b5j0ty] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--cedar-green-rgb), 0.3);
}

.upgrade-note[b-yjx3b5j0ty],
.renewal-note[b-yjx3b5j0ty] {
    font-size: 0.875rem;
    color: #666;
    background: var(--river-pearl);
    padding: 1rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.upgrade-note i[b-yjx3b5j0ty],
.renewal-note i[b-yjx3b5j0ty] {
    color: var(--wilson-blue);
    margin-top: 0.125rem;
    flex-shrink: 0;
}

/* Responsive Design */
@media (max-width: 992px) {
    .subscription-header[b-yjx3b5j0ty] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .subscription-actions[b-yjx3b5j0ty] {
        justify-content: flex-start;
    }

    .payments-table-wrapper[b-yjx3b5j0ty] {
        overflow-x: auto;
    }

    .payments-table[b-yjx3b5j0ty] {
        min-width: 800px;
    }
}

@media (max-width: 768px) {

    .subscription-card[b-yjx3b5j0ty] {
        padding: 1.5rem;
    }

    .tier-badge[b-yjx3b5j0ty] {
        font-size: 1.25rem;
    }

    .subscription-actions[b-yjx3b5j0ty] {
        flex-direction: column;
    }

    .btn[b-yjx3b5j0ty] {
        width: 100%;
        justify-content: center;
    }

    .upgrade-section h3[b-yjx3b5j0ty] {
        font-size: 1.25rem;
    }

    .upgrade-options[b-yjx3b5j0ty] {
        grid-template-columns: 1fr;
    }

    .upgrade-card-header[b-yjx3b5j0ty] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .upgrade-price[b-yjx3b5j0ty] {
        text-align: left;
    }
}
/* /Components/Pages/Account/Profile.razor.rz.scp.css */
.profile-page[b-5yi39oc8u3] {
    background: #ffffff;
}

/* ============================================
   Hero Section - Editorial Design
   ============================================ */

.hero[b-5yi39oc8u3] {
    min-height: 45vh;
    display: flex;
    align-items: center;
    padding: 6rem 4rem;
    background: #000000;
    position: relative;
    overflow: hidden;
}

.dot[b-5yi39oc8u3] {
    margin: 0 1rem;
    opacity: 0.3;
}

.hero-photo[b-5yi39oc8u3] {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.hero-photo-wrapper[b-5yi39oc8u3] {
    position: relative;
    display: inline-block;
}

.hero-profile-photo[b-5yi39oc8u3] {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid var(--wheat-gold);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

.hero-photo-placeholder[b-5yi39oc8u3] {
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    border: 4px solid rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-photo-placeholder i[b-5yi39oc8u3] {
    font-size: 4rem;
    color: rgba(255, 255, 255, 0.3);
}

.hero-photo-upload-btn[b-5yi39oc8u3] {
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--wheat-gold);
    color: #000000;
    border: 3px solid #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.hero-photo-upload-btn:hover[b-5yi39oc8u3] {
    background: #ffffff;
    transform: scale(1.1);
}

.hero-photo-upload-btn i[b-5yi39oc8u3] {
    font-size: 1.25rem;
}

/* The file input is visually hidden and keeps the keyboard focus; the camera label beside it
   shows the ring. InputFile renders the <input>, so it carries no scope attribute: ::deep. */
.hero-photo-wrapper[b-5yi39oc8u3]  .hero-photo-input:focus-visible + .hero-photo-upload-btn {
    outline: 2px solid var(--wheat-gold);
    outline-offset: 2px;
}

.hero-upload-status[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.875rem;
}

.hero-upload-spinner[b-5yi39oc8u3] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: var(--wheat-gold);
    border-radius: 50%;
    animation: spin-b-5yi39oc8u3 0.6s linear infinite;
}

.hero-upload-message[b-5yi39oc8u3] {
    font-size: 0.875rem;
    margin: 0;
    padding: 0.5rem 1rem;
    border-radius: 4px;
}

.hero-upload-message.upload-success[b-5yi39oc8u3] {
    background: rgba(16, 185, 129, 0.2);
    color: #10b981;
}

.hero-upload-message.upload-error[b-5yi39oc8u3] {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}

/* ============================================
   Profile Content Section
   ============================================ */

.profile-content[b-5yi39oc8u3] {
    max-width: 64rem;
    margin: 0 auto;
    padding: 3rem 4rem;
}

.loading-spinner[b-5yi39oc8u3] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem 0;
}

.spinner[b-5yi39oc8u3] {
    width: 3rem;
    height: 3rem;
    border: 3px solid var(--color-gray-light);
    border-top-color: var(--cedar-green);
    border-radius: 50%;
    animation: spin-b-5yi39oc8u3 0.8s linear infinite;
}

@keyframes spin-b-5yi39oc8u3 {
    to { transform: rotate(360deg); }
}

.alert-error[b-5yi39oc8u3] {
    background: #fee2e2;
    border-left: 4px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
}

.alert-success[b-5yi39oc8u3] {
    background: #d1fae5;
    border-left: 4px solid #10b981;
    color: #065f46;
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
}

.section-card[b-5yi39oc8u3] {
    background: var(--color-white);
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: var(--shadow-sm);
    margin-bottom: 2rem;
}

.section-title[b-5yi39oc8u3] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.section-subtitle[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin-bottom: 1rem;
}

/* Photo Section */
.photo-section[b-5yi39oc8u3] {
    display: flex;
    align-items: flex-start;
    gap: 2rem;
}

.photo-container[b-5yi39oc8u3] {
    flex-shrink: 0;
}

.photo-wrapper[b-5yi39oc8u3] {
    position: relative;
    display: inline-block;
}

.profile-photo[b-5yi39oc8u3] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid var(--color-gray-light);
}

.photo-placeholder[b-5yi39oc8u3] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--color-gray-light);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 4px solid var(--color-gray);
}

.photo-placeholder svg[b-5yi39oc8u3] {
    width: 4rem;
    height: 4rem;
    color: var(--color-gray);
}

.photo-upload-btn[b-5yi39oc8u3] {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--wilson-blue);
    color: white;
    border: 3px solid white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.photo-upload-btn:hover[b-5yi39oc8u3] {
    background: var(--cedar-green);
    transform: scale(1.1);
}

.photo-upload-btn i[b-5yi39oc8u3] {
    font-size: 1.125rem;
}

.photo-upload[b-5yi39oc8u3] {
    flex-grow: 1;
}

.file-input[b-5yi39oc8u3] {
    display: block;
    width: 100%;
    font-size: var(--font-size-sm);
    color: var(--color-text);
    padding: 0.75rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: var(--radius-lg);
    cursor: pointer;
    background: var(--color-white);
    transition: all var(--transition-base);
}

.file-input:hover[b-5yi39oc8u3] {
    border-color: var(--wilson-blue);
}

.file-input[b-5yi39oc8u3]::file-selector-button {
    margin-right: 1rem;
    padding: 0.5rem 1.25rem;
    background: var(--wilson-blue);
    color: white;
    border: none;
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: background var(--transition-base);
}

.file-input[b-5yi39oc8u3]::file-selector-button:hover {
    background: var(--cedar-green);
}

.photo-hint[b-5yi39oc8u3] {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: 0.5rem;
}

.upload-status[b-5yi39oc8u3] {
    margin-top: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-sm);
}

.upload-spinner[b-5yi39oc8u3] {
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--color-gray-light);
    border-top-color: var(--wilson-blue);
    border-radius: 50%;
    animation: spin-b-5yi39oc8u3 0.6s linear infinite;
}

.upload-success[b-5yi39oc8u3] {
    color: #10b981;
}

.upload-error[b-5yi39oc8u3] {
    color: var(--color-error);
}

/* Form Fields */
.form-grid[b-5yi39oc8u3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.form-group[b-5yi39oc8u3] {
    margin-bottom: 0;
}

.form-label[b-5yi39oc8u3] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-5yi39oc8u3] .form-input,
[b-5yi39oc8u3] input[type="text"],
[b-5yi39oc8u3] input[type="number"],
[b-5yi39oc8u3] input[type="email"],
[b-5yi39oc8u3] textarea {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}

[b-5yi39oc8u3] .form-input:disabled,
[b-5yi39oc8u3] input:disabled,
[b-5yi39oc8u3] textarea:disabled {
    background: var(--color-gray-lighter);
    color: var(--color-text-secondary);
    cursor: not-allowed;
    opacity: 0.6;
}

[b-5yi39oc8u3] .form-input::placeholder,
[b-5yi39oc8u3] input::placeholder,
[b-5yi39oc8u3] textarea::placeholder {
    color: var(--color-gray);
}

[b-5yi39oc8u3] .form-input:hover:not(:disabled),
[b-5yi39oc8u3] input:hover:not(:disabled),
[b-5yi39oc8u3] textarea:hover:not(:disabled) {
    border-color: var(--color-gray);
}

[b-5yi39oc8u3] .form-input:focus,
[b-5yi39oc8u3] input:focus,
[b-5yi39oc8u3] textarea:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08);
    background: var(--color-white);
}

textarea[b-5yi39oc8u3] {
    resize: vertical;
    min-height: 120px;
}

.field-hint[b-5yi39oc8u3] {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: 0.5rem;
}

/* Underlined, so the link is not told apart by color alone (WCAG 1.4.1; #8296 walk B1). */
.field-hint a[b-5yi39oc8u3] {
    text-decoration: underline;
}

/* Checkbox Groups */
.checkbox-group[b-5yi39oc8u3] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0;
}

.checkbox-wrapper[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    height: 1.25rem;
}

[b-5yi39oc8u3] input[type="checkbox"] {
    width: 1.25rem;
    height: 1.25rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
    border: 1.5px solid var(--color-gray-light);
}

[b-5yi39oc8u3] input[type="checkbox"]:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.checkbox-label[b-5yi39oc8u3] {
    flex-grow: 1;
}

.checkbox-title[b-5yi39oc8u3] {
    font-weight: 600;
    color: var(--color-text);
    display: block;
    margin-bottom: 0.25rem;
}

.checkbox-description[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* Info Banner */
.info-banner[b-5yi39oc8u3] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    border-left: 4px solid var(--wilson-blue);
    padding: 1rem;
    margin-bottom: 1rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    color: #1e40af;
}

.info-banner-icon[b-5yi39oc8u3] {
    color: var(--wilson-blue);
    margin-right: 0.5rem;
}

/* Subsections */
.subsection[b-5yi39oc8u3] {
    border-bottom: 1px solid var(--color-gray-light);
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
}

.subsection:last-child[b-5yi39oc8u3] {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.subsection-title[b-5yi39oc8u3] {
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-gray-dark);
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nested-checkbox[b-5yi39oc8u3] {
    margin-left: 2rem;
}

/* Membership Info */
.info-grid[b-5yi39oc8u3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
}

.info-item[b-5yi39oc8u3] {
    padding: 0;
}

.info-label[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text-secondary);
    margin-bottom: 0.25rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.info-value[b-5yi39oc8u3] {
    font-size: var(--font-size-lg);
    color: var(--color-text);
    font-weight: 600;
}

.info-value-expired[b-5yi39oc8u3] {
    color: var(--color-error);
}

/* Subscription Actions */
.subscription-actions[b-5yi39oc8u3] {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.action-link[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-decoration: none;
    transition: all var(--transition-base);
    background: rgba(0, 0, 0, 0.03);
    color: var(--color-text-secondary);
    border: 1px solid transparent;
}

.action-link:hover[b-5yi39oc8u3] {
    background: rgba(0, 0, 0, 0.06);
    border-color: rgba(0, 0, 0, 0.1);
}

.action-link i[b-5yi39oc8u3] {
    font-size: 0.875rem;
}

.action-link-primary[b-5yi39oc8u3] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.action-link-primary:hover[b-5yi39oc8u3] {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.action-link-danger[b-5yi39oc8u3] {
    color: #dc2626;
}

.action-link-danger:hover[b-5yi39oc8u3] {
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.2);
}

/* Who renews a lapsed family member's membership (#8145 owner ruling 4), under "Renews with your family". */
.family-renewal-note[b-5yi39oc8u3] {
    margin: 0.75rem 0 0;
    font-size: var(--font-size-sm);
    line-height: 1.5;
    color: var(--color-text-secondary);
}

/* Action Buttons */
.actions[b-5yi39oc8u3] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1rem;
}

.btn-primary[b-5yi39oc8u3] {
    padding: 0.875rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-base);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.btn-primary:hover:not(:disabled)[b-5yi39oc8u3] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-primary:active:not(:disabled)[b-5yi39oc8u3] {
    transform: translateY(0);
}

.btn-primary:disabled[b-5yi39oc8u3] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-content[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-spinner[b-5yi39oc8u3] {
    width: 1.25rem;
    height: 1.25rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-5yi39oc8u3 0.6s linear infinite;
}

/* Responsive */
@media (max-width: 768px) {
    .hero[b-5yi39oc8u3] {
        padding: 4rem 2rem;
        min-height: auto;
    }

    .hero-profile-photo[b-5yi39oc8u3],
    .hero-photo-placeholder[b-5yi39oc8u3] {
        width: 140px;
        height: 140px;
    }

    .hero-photo-placeholder i[b-5yi39oc8u3] {
        font-size: 3rem;
    }

    .hero-photo-upload-btn[b-5yi39oc8u3] {
        width: 40px;
        height: 40px;
        bottom: 4px;
        right: 4px;
    }

    .hero-photo-upload-btn i[b-5yi39oc8u3] {
        font-size: 1rem;
    }

    .profile-content[b-5yi39oc8u3] {
        padding: 2rem;
    }

    .form-grid[b-5yi39oc8u3] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .info-grid[b-5yi39oc8u3] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .section-card[b-5yi39oc8u3] {
        padding: 1.5rem;
    }

    .section-title[b-5yi39oc8u3] {
        font-size: var(--font-size-lg);
    }

    .nested-checkbox[b-5yi39oc8u3] {
        margin-left: 1.5rem;
    }
}

/* Chess.com Stats Styling */
.chesscom-stats-grid[b-5yi39oc8u3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stat-card[b-5yi39oc8u3] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.5rem;
    text-align: center;
    transition: all 0.3s ease;
}

.stat-card:hover[b-5yi39oc8u3] {
    transform: translateY(-4px);
    box-shadow: 0 8px 16px rgba(var(--cedar-green-rgb), 0.15);
    border-color: var(--cedar-green);
}

.stat-label[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-gray);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.stat-icon[b-5yi39oc8u3] {
    font-size: 1rem;
    color: var(--wilson-blue);
}

.stat-icon-svg[b-5yi39oc8u3] {
    width: 1rem;
    height: 1rem;
    fill: var(--wilson-blue);
}

.stat-emoji[b-5yi39oc8u3] {
    font-size: 1.125rem;
    line-height: 1;
}

.stat-value[b-5yi39oc8u3] {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.5rem;
}

.stat-record[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    color: var(--color-gray-dark);
    display: flex;
    gap: 0.75rem;
    justify-content: center;
}

.stat-wins[b-5yi39oc8u3] {
    color: #10b981;
    font-weight: 600;
}

.stat-draws[b-5yi39oc8u3] {
    color: #6b7280;
    font-weight: 600;
}

.stat-losses[b-5yi39oc8u3] {
    color: #ef4444;
    font-weight: 600;
}

.stat-games[b-5yi39oc8u3] {
    color: var(--color-gray-dark);
    font-weight: 500;
}

.stat-provisional[b-5yi39oc8u3] {
    color: #f59e0b;
    font-weight: 600;
    font-size: var(--font-size-xs);
}

.stats-footer[b-5yi39oc8u3] {
    text-align: center;
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
}

.stats-link[b-5yi39oc8u3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    font-size: var(--font-size-sm);
    transition: all 0.2s ease;
}

.stats-link:hover[b-5yi39oc8u3] {
    color: var(--wilson-blue);
    gap: 0.75rem;
}

.loading-spinner-small[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 2rem;
    color: var(--color-gray);
}

.loading-spinner-small .spinner[b-5yi39oc8u3] {
    width: 2rem;
    height: 2rem;
}

.alert-info[b-5yi39oc8u3] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    border-left: 4px solid var(--wilson-blue);
    color: #0369a1;
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin: 1rem 0;
}

/* OAuth Connection Buttons */
.input-with-button[b-5yi39oc8u3] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

.input-with-button[b-5yi39oc8u3]  input {
    flex: 1;
    min-height: 44px;
}

.btn-connect[b-5yi39oc8u3],
.btn-disconnect[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 1.125rem;
    min-height: 44px;
    border: none;
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    white-space: nowrap;
}

.btn-connect[b-5yi39oc8u3] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-connect:hover:not(:disabled)[b-5yi39oc8u3] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(var(--cedar-green-rgb), 0.3);
}

.btn-disconnect[b-5yi39oc8u3] {
    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%);
    color: white;
}

.btn-disconnect:hover:not(:disabled)[b-5yi39oc8u3] {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(107, 114, 128, 0.3);
}

.btn-connect:disabled[b-5yi39oc8u3],
.btn-disconnect:disabled[b-5yi39oc8u3] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-spinner-small[b-5yi39oc8u3] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-5yi39oc8u3 0.6s linear infinite;
}

/* Library Checkouts */

.checkouts-list[b-5yi39oc8u3] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.checkout-card[b-5yi39oc8u3] {
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1rem;
    transition: all 0.2s;
}

.checkout-card.overdue[b-5yi39oc8u3] {
    border-color: #fca5a5;
    background-color: #fef2f2;
}

.checkout-card:hover[b-5yi39oc8u3] {
    border-color: var(--cedar-green);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.checkout-book-info[b-5yi39oc8u3] {
    display: flex;
    gap: 1rem;
}

.checkout-cover[b-5yi39oc8u3] {
    width: 80px;
    height: 120px;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

.checkout-details[b-5yi39oc8u3] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.checkout-title[b-5yi39oc8u3] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--cedar-green);
    text-decoration: none;
    transition: color 0.2s;
}

.checkout-title:hover[b-5yi39oc8u3] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.checkout-author[b-5yi39oc8u3] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
}

.checkout-dates[b-5yi39oc8u3] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.875rem;
    color: #374151;
    margin-top: 0.5rem;
}

.checkout-due.overdue-text[b-5yi39oc8u3] {
    color: #dc2626;
    font-weight: 600;
}

.history-list[b-5yi39oc8u3] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.history-item[b-5yi39oc8u3] {
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    transition: all 0.2s;
}

.history-item:hover[b-5yi39oc8u3] {
    background-color: #f9fafb;
    border-color: #d1d5db;
}

.history-cover[b-5yi39oc8u3] {
    width: 50px;
    height: 75px;
    object-fit: cover;
    border-radius: 0.25rem;
    flex-shrink: 0;
}

.history-details[b-5yi39oc8u3] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.history-title[b-5yi39oc8u3] {
    font-weight: 600;
    color: var(--cedar-green);
    text-decoration: none;
    font-size: 0.9375rem;
    transition: color 0.2s;
}

.history-title:hover[b-5yi39oc8u3] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.history-author[b-5yi39oc8u3] {
    color: #6b7280;
    font-size: 0.8125rem;
    margin: 0;
}

.history-dates[b-5yi39oc8u3] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.overdue-badge[b-5yi39oc8u3] {
    color: #dc2626;
    font-weight: 600;
}

.view-library-link[b-5yi39oc8u3] {
    display: inline-block;
    margin-top: 1rem;
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s;
}

.view-library-link:hover[b-5yi39oc8u3] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

/* USCF Stats Section */
.uscf-member-info[b-5yi39oc8u3] {
    margin-bottom: 1.5rem;
}

.uscf-status[b-5yi39oc8u3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    border-radius: var(--radius-md);
    font-weight: 600;
    font-size: var(--font-size-sm);
}

.uscf-status.status-active[b-5yi39oc8u3] {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
    border: 1px solid rgba(16, 185, 129, 0.3);
}

.uscf-status.status-expired[b-5yi39oc8u3] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.uscf-status i[b-5yi39oc8u3] {
    font-size: 1rem;
}

.expiration-date[b-5yi39oc8u3] {
    margin-left: 0.75rem;
    padding-left: 0.75rem;
    border-left: 1px solid currentColor;
    opacity: 0.8;
    font-weight: 500;
}

.uscf-rankings[b-5yi39oc8u3] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    padding: 1rem 0;
    margin-top: 0.5rem;
    border-top: 1px solid var(--color-border);
}

.ranking-item[b-5yi39oc8u3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ranking-label[b-5yi39oc8u3] {
    font-size: var(--font-size-sm);
    color: var(--color-gray-dark);
    font-weight: 500;
}

.ranking-value[b-5yi39oc8u3] {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--cedar-green);
}

.stat-value.provisional[b-5yi39oc8u3] {
    color: #f59e0b;
}

@media (max-width: 768px) {
    .input-with-button[b-5yi39oc8u3] {
        flex-direction: column;
    }

    .btn-connect[b-5yi39oc8u3],
    .btn-disconnect[b-5yi39oc8u3] {
        width: 100%;
        justify-content: center;
    }

    .checkout-book-info[b-5yi39oc8u3] {
        flex-direction: column;
    }

    .checkout-cover[b-5yi39oc8u3] {
        width: 100%;
        height: auto;
        max-height: 300px;
    }
}

/* Event-registration "complete your profile" highlight */
.form-group.form-group-highlight[b-5yi39oc8u3] {
    padding: 0.75rem 1rem;
    background: rgba(var(--wheat-gold-rgb), 0.1);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    animation: highlight-pulse-b-5yi39oc8u3 1.2s ease-out 1;
}

.form-group.form-group-highlight .form-hint[b-5yi39oc8u3] {
    margin: 0.5rem 0 0 0;
    color: #8a6b11;
    font-size: 0.875rem;
    font-weight: 500;
}

@keyframes highlight-pulse-b-5yi39oc8u3 {
    0%   { background: rgba(var(--wheat-gold-rgb), 0.25); }
    100% { background: rgba(var(--wheat-gold-rgb), 0.1); }
}

/* The markup has always asked for these two, and no rule the page could reach
   defined them, so the descriptions rendered unstyled and the fields marked
   full-width were not full width (#7588 found it). These are the same
   declarations the sibling pages use, tokens only. */
.section-description[b-5yi39oc8u3] {
    font-size: var(--font-size-base);
    color: var(--color-gray);
    margin: 0;
    line-height: 1.6;
}

.form-group.full-width[b-5yi39oc8u3] {
    grid-column: 1 / -1;
}

@media (max-width: 768px) {
    .form-group.full-width[b-5yi39oc8u3] {
        grid-column: 1;
    }
}

/* A field's own refusal, under the field (#8296: the TCA member ID). */
.field-error[b-5yi39oc8u3] {
    font-size: var(--font-size-xs);
    color: var(--color-error);
    font-weight: 600;
    margin-top: 0.5rem;
}

/* #8200: the data-rights line under the privacy checkbox. A sentence of its own under the row,
   with its link underlined rather than told apart by color alone (#8296 walk B1). */
.privacy-data-rights[b-5yi39oc8u3] {
    margin: 1rem 0 0 0;
}

.privacy-data-rights a[b-5yi39oc8u3] {
    text-decoration: underline;
}
/* /Components/Pages/Account/Register.razor.rz.scp.css */
.register-page[b-gyf14eyqsh] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    padding: 2rem 1rem;
}

.register-container[b-gyf14eyqsh] {
    width: 100%;
    max-width: 700px;
}

.register-card[b-gyf14eyqsh] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
}

/* Fieldset reset — browsers add default border + inline padding that
   conflicts with our card layout. We rely on form-fieldset for semantics
   (screen-reader grouping) but want it to look like the rest of the form. */
.form-fieldset[b-gyf14eyqsh] {
    border: none;
    padding: 0;
    margin: 0 0 1.5rem 0;
    min-width: 0;
}

.form-legend[b-gyf14eyqsh] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0;
}

.register-card h1[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.5rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.subtitle[b-gyf14eyqsh] {
    text-align: center;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    font-size: var(--font-size-base);
}

.alert-error[b-gyf14eyqsh] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary[b-gyf14eyqsh] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary ul[b-gyf14eyqsh] {
    margin: 0;
    padding-left: 1.5rem;
}

.form-section[b-gyf14eyqsh] {
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--color-border);
}

.form-section:last-of-type[b-gyf14eyqsh] {
    border-bottom: none;
}

.form-section-title[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-row[b-gyf14eyqsh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.form-group[b-gyf14eyqsh] {
    margin-bottom: 1.5rem;
}

.form-group label[b-gyf14eyqsh] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-gyf14eyqsh] .form-input,
[b-gyf14eyqsh] .form-select,
[b-gyf14eyqsh] input[type="email"],
[b-gyf14eyqsh] input[type="password"],
[b-gyf14eyqsh] input[type="text"],
[b-gyf14eyqsh] input[type="tel"],
[b-gyf14eyqsh] input[type="number"],
[b-gyf14eyqsh] select {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}

[b-gyf14eyqsh] .form-input::placeholder,
[b-gyf14eyqsh] .form-select::placeholder,
[b-gyf14eyqsh] input::placeholder,
[b-gyf14eyqsh] select::placeholder {
    color: var(--color-gray);
}

[b-gyf14eyqsh] .form-input:hover,
[b-gyf14eyqsh] .form-select:hover,
[b-gyf14eyqsh] input:hover,
[b-gyf14eyqsh] select:hover {
    border-color: var(--color-gray);
}

[b-gyf14eyqsh] .form-input:focus,
[b-gyf14eyqsh] .form-select:focus,
[b-gyf14eyqsh] input:focus,
[b-gyf14eyqsh] select:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08);
    background: var(--color-white);
}

.form-hint[b-gyf14eyqsh] {
    display: block;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin-top: 0.5rem;
}

.validation-message[b-gyf14eyqsh] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin-top: 0.5rem;
    display: block;
}

.btn-primary[b-gyf14eyqsh] {
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-lg);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.btn-primary:hover:not(:disabled)[b-gyf14eyqsh] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-primary:active:not(:disabled)[b-gyf14eyqsh] {
    transform: translateY(0);
}

.btn-primary:disabled[b-gyf14eyqsh] {
    opacity: 0.6;
    cursor: not-allowed;
}

.register-footer[b-gyf14eyqsh] {
    margin-top: 2rem;
    text-align: center;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.register-footer a[b-gyf14eyqsh] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.register-footer a:hover[b-gyf14eyqsh] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .register-card[b-gyf14eyqsh] {
        padding: 2rem 1.5rem;
    }

    .register-card h1[b-gyf14eyqsh] {
        font-size: var(--font-size-3xl);
    }

    .form-row[b-gyf14eyqsh] {
        grid-template-columns: 1fr;
    }
}

/* ============================================
   Membership tier picker (radio cards)
   ============================================ */

.tier-picker[b-gyf14eyqsh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.tier-card[b-gyf14eyqsh] {
    position: relative;
    display: block;
    padding: 1.5rem 1.25rem;
    background: var(--color-white, #ffffff);
    border: 2px solid var(--color-border, #d1d5db);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.tier-card:hover[b-gyf14eyqsh] {
    border-color: var(--cedar-green, #2D5016);
    transform: translateY(-1px);
}

/* CSS-only selected state — works in static SSR without a server round-trip */
.tier-card:has(input[type="radio"]:checked)[b-gyf14eyqsh] {
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.15);
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.tier-card input[type="radio"][b-gyf14eyqsh] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.tier-recommended[b-gyf14eyqsh] {
    position: absolute;
    top: -0.65rem;
    left: 1rem;
    padding: 0.2rem 0.6rem;
    background: var(--wheat-gold, #D4AF37);
    color: #111827;
    font-family: var(--font-display);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 2px;
}

.tier-card-body[b-gyf14eyqsh] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.tier-header[b-gyf14eyqsh] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.tier-header h4[b-gyf14eyqsh] {
    margin: 0;
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.tier-price[b-gyf14eyqsh] {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    line-height: 1.05;
}

.tier-price strong[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: 2rem;
    color: #111827;
    font-weight: 800;
}

.tier-price-period[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: 0.72rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-top: 0.25rem;
}

.tier-price-breakdown[b-gyf14eyqsh] {
    font-size: 0.8rem;
    color: #4b5563;
    background: rgba(var(--wheat-gold-rgb), 0.1);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    padding: 0.5rem 0.75rem;
    margin-top: -0.25rem;
    line-height: 1.45;
}

.tier-price-breakdown strong[b-gyf14eyqsh] {
    color: #111827;
    font-weight: 700;
}

.tier-benefits[b-gyf14eyqsh] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tier-benefits li[b-gyf14eyqsh] {
    font-size: 0.875rem;
    line-height: 1.45;
    color: #374151;
    display: flex;
    gap: 0.5rem;
    align-items: flex-start;
}

.tier-benefits i[b-gyf14eyqsh] {
    width: 16px;
    color: var(--cedar-green, #2D5016);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.tier-card-community .tier-benefits i[b-gyf14eyqsh] {
    color: #6b7280;
}

@media (max-width: 640px) {
    .tier-picker[b-gyf14eyqsh] {
        grid-template-columns: 1fr;
    }

    .tier-recommended[b-gyf14eyqsh] {
        left: auto;
        right: 1rem;
    }
}

/* ============================================
   Family members (#7677) - the kiosk join's rows, on the static form
   ============================================ */

.family-block[b-gyf14eyqsh] {
    margin-top: 1.5rem;
    padding: 1.25rem;
    border: 1.5px dashed var(--color-border, #d1d5db);
    border-radius: 12px;
    background: rgba(var(--cedar-green-rgb), 0.02);
}

.family-title[b-gyf14eyqsh] {
    margin: 0 0 0.25rem;
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.family-opt[b-gyf14eyqsh] {
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    font-weight: 500;
    color: var(--color-text-secondary);
    text-transform: none;
    letter-spacing: normal;
}

.family-note[b-gyf14eyqsh] {
    margin: 0 0 1rem;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.family-rows[b-gyf14eyqsh] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.family-member[b-gyf14eyqsh] {
    min-width: 0;
}

/* First name, last name, a wider email, and the remove button; one column on a phone. */
.family-row[b-gyf14eyqsh] {
    display: grid;
    grid-template-columns: 1fr 1fr 1.5fr auto;
    gap: 0.5rem;
    align-items: center;
}

/* While the age floor is in force each row also takes the member's birth date (#8363 review round 2), drawn as the
   page's fields (#8395). A date input never draws narrower than its whole date, so a fourth field on one line took
   the width from the names: their placeholders, the only label they show, clipped to "First nam" and "Last nam" at
   1440 (#8395 review). The dated row takes two lines, as the kiosk's does (#8394): the names, then the email, the
   birth date and the remove button, each field sharing its line equally whatever its own width (minmax(0, 1fr)).
   A phone keeps one field per line (.family-row, below). */
.family-row-dated[b-gyf14eyqsh] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
}

.family-row-dated input[type="email"][b-gyf14eyqsh] {
    grid-column: 1;
}

.family-remove[b-gyf14eyqsh],
.family-add[b-gyf14eyqsh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    background: var(--color-white);
    color: var(--color-text-secondary);
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    cursor: pointer;
    transition: all var(--transition-base);
}

.family-remove[b-gyf14eyqsh] {
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
}

.family-add[b-gyf14eyqsh] {
    padding: 0.6rem 1rem;
    font-weight: 600;
}

.family-remove:hover[b-gyf14eyqsh],
.family-add:hover[b-gyf14eyqsh] {
    border-color: var(--cedar-green, #2D5016);
    color: var(--cedar-green, #2D5016);
}

.family-row-error[b-gyf14eyqsh] {
    margin-top: 0.35rem;
    color: var(--color-error);
    font-size: var(--font-size-sm);
}

.family-total[b-gyf14eyqsh] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
    font-weight: 600;
    color: var(--color-gray-dark);
}

.family-total strong[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    color: var(--cedar-green, #2D5016);
}

.family-total-sub[b-gyf14eyqsh] {
    margin-left: 0.4rem;
    font-weight: 400;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

@media (max-width: 640px) {
    .family-row[b-gyf14eyqsh] {
        grid-template-columns: 1fr;
    }

    .family-remove[b-gyf14eyqsh] {
        width: 100%;
    }

    .family-total[b-gyf14eyqsh] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }
}

/* ============================================
   Home location picker (radio cards)
   ============================================ */

.location-picker[b-gyf14eyqsh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 0.25rem;
}

/* One column per card up to four: the page sets --location-columns from the club's own
   venue count (#7593), so a club with two venues gets three tidy columns and never a gap. */
@media (min-width: 768px) {
    .location-picker[b-gyf14eyqsh] {
        grid-template-columns: repeat(var(--location-columns, 4), minmax(0, 1fr));
    }
}

.location-card[b-gyf14eyqsh] {
    position: relative;
    display: block;
    padding: 1rem;
    background: var(--color-white, #ffffff);
    border: 2px solid var(--color-border, #d1d5db);
    border-radius: 12px;
    cursor: pointer;
    text-align: center;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.location-card:hover[b-gyf14eyqsh] {
    border-color: var(--cedar-green, #2D5016);
    transform: translateY(-1px);
}

.location-card:has(input[type="radio"]:checked)[b-gyf14eyqsh] {
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.15);
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.location-card input[type="radio"][b-gyf14eyqsh] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.location-card-body[b-gyf14eyqsh] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.location-city[b-gyf14eyqsh] {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
}

.location-region[b-gyf14eyqsh] {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #6b7280;
}

@media (max-width: 640px) {
    .location-picker[b-gyf14eyqsh] {
        grid-template-columns: 1fr;
    }
}

/* Events-Only card is visually distinguished as a non-venue option:
   slightly muted accent so the club's real meeting places stay primary, but
   still discoverable. Wheat-gold accent ties it to the "different track"
   semantics without dropping a11y contrast. */
.location-card-events-only .location-city[b-gyf14eyqsh] {
    color: #6b4f0f;
}

.location-card-events-only:has(input[type="radio"]:checked)[b-gyf14eyqsh] {
    border-color: var(--wheat-gold, #D4AF37);
    box-shadow: 0 0 0 3px rgba(var(--wheat-gold-rgb), 0.2);
    background: rgba(var(--wheat-gold-rgb), 0.05);
}

.location-card-events-only:hover[b-gyf14eyqsh] {
    border-color: var(--wheat-gold, #D4AF37);
}

/* Helper text under a field. The markup asked for this and no stylesheet in the
   project defined it anywhere, so the hint rendered as plain default text
   (#7588 found it). Tokens only, matching the .help-text treatment used
   elsewhere for the same job. */
.form-help[b-gyf14eyqsh] {
    display: block;
    margin-top: 0.25rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}
/* /Components/Pages/Account/RegistrationSuccess.razor.rz.scp.css */
/* Override login container width for confirmation pages */
[b-5g4u4qa8da] .login-container {
    max-width: 600px;
}

[b-5g4u4qa8da] .login-card {
    padding: 3rem 2.5rem;
}

.success-icon[b-5g4u4qa8da] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.success-icon i[b-5g4u4qa8da] {
    font-size: 4rem;
    color: var(--cedar-green);
}

.error-icon[b-5g4u4qa8da] {
    text-align: center;
    margin-bottom: 1.5rem;
}

.error-icon i[b-5g4u4qa8da] {
    font-size: 4rem;
    color: var(--color-error);
}

.loading-spinner[b-5g4u4qa8da] {
    text-align: center;
    padding: 2rem 0;
}

.spinner[b-5g4u4qa8da] {
    width: 3rem;
    height: 3rem;
    border: 3px solid var(--color-gray-light);
    border-top-color: var(--cedar-green);
    border-radius: 50%;
    animation: spin-b-5g4u4qa8da 0.8s linear infinite;
    margin: 0 auto 1rem auto;
}

@keyframes spin-b-5g4u4qa8da {
    to { transform: rotate(360deg); }
}

.success-message[b-5g4u4qa8da] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 4px solid var(--cedar-green);
    padding: 1.5rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
}

.success-message p[b-5g4u4qa8da] {
    margin: 0 0 0.75rem 0;
    line-height: 1.6;
}

.success-message p:last-child[b-5g4u4qa8da] {
    margin-bottom: 0;
}

.email-address[b-5g4u4qa8da] {
    font-weight: 700;
    font-size: var(--font-size-lg);
    color: var(--cedar-green);
    text-align: center;
    padding: 0.5rem 0;
}

.info-box[b-5g4u4qa8da] {
    background: rgba(var(--wilson-blue-rgb), 0.05);
    border-left: 4px solid var(--wilson-blue);
    padding: 1.5rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
}

.info-box h3[b-5g4u4qa8da] {
    margin: 0 0 1rem 0;
    color: var(--cedar-green);
    font-size: var(--font-size-lg);
    font-weight: 700;
}

.info-box h3 i[b-5g4u4qa8da] {
    margin-right: 0.5rem;
    color: var(--wilson-blue);
}

.info-box ol[b-5g4u4qa8da] {
    margin: 0;
    padding-left: 1.5rem;
}

.info-box li[b-5g4u4qa8da] {
    margin-bottom: 0.5rem;
    line-height: 1.6;
}

.info-box li:last-child[b-5g4u4qa8da] {
    margin-bottom: 0;
}

.help-text[b-5g4u4qa8da] {
    text-align: center;
    padding: 1rem;
    margin-bottom: 1rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.help-text strong[b-5g4u4qa8da] {
    color: var(--color-text);
    display: block;
    margin-bottom: 0.5rem;
}

.help-text a[b-5g4u4qa8da] {
    color: var(--cedar-green);
    text-decoration: none;
}

.help-text a:hover[b-5g4u4qa8da] {
    text-decoration: underline;
}

.back-link[b-5g4u4qa8da] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.back-link:hover[b-5g4u4qa8da] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    [b-5g4u4qa8da] .login-card {
        padding: 2rem 1.5rem;
    }

    [b-5g4u4qa8da] .login-card h1 {
        font-size: var(--font-size-3xl);
    }
}
/* /Components/Pages/Account/ResetPassword.razor.rz.scp.css */
.login-page[b-tde7dgjq85] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    padding: 2rem 1rem;
}

.login-container[b-tde7dgjq85] {
    width: 100%;
    max-width: 450px;
}

.login-card[b-tde7dgjq85] {
    background: var(--color-white, white);
    border-radius: 12px;
    padding: 3rem 2rem;
    box-shadow: var(--shadow-xl);
}

.login-card h1[b-tde7dgjq85] {
    font-family: var(--font-display);
    font-size: var(--font-size-4xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 0.5rem;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.subtitle[b-tde7dgjq85] {
    text-align: center;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    font-size: var(--font-size-base);
}

.alert-error[b-tde7dgjq85] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.alert-info[b-tde7dgjq85] {
    background: #ecfdf5;
    border: 1px solid #10b981;
    color: #065f46;
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.success-icon[b-tde7dgjq85] {
    text-align: center;
    font-size: 4rem;
    color: #10b981;
    margin-bottom: 1rem;
}

.validation-summary[b-tde7dgjq85] {
    background: #fee2e2;
    border: 1px solid var(--color-error);
    color: var(--color-error);
    padding: 1rem;
    border-radius: var(--radius-lg);
    margin-bottom: 1.5rem;
    font-size: var(--font-size-sm);
}

.validation-summary ul[b-tde7dgjq85] {
    margin: 0;
    padding-left: 1.5rem;
}

.form-group[b-tde7dgjq85] {
    margin-bottom: 1.5rem;
}

.form-group label[b-tde7dgjq85] {
    display: block;
    font-weight: 600;
    color: var(--color-gray-dark);
    margin-bottom: 0.5rem;
    font-size: var(--font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.hint[b-tde7dgjq85] {
    display: block;
    margin-top: 0.5rem;
    color: var(--color-text-secondary);
    font-size: var(--font-size-xs);
}

[b-tde7dgjq85] .form-input,
[b-tde7dgjq85] input[type="password"],
[b-tde7dgjq85] input[type="text"] {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}

[b-tde7dgjq85] .form-input::placeholder,
[b-tde7dgjq85] input::placeholder {
    color: var(--color-gray);
}

[b-tde7dgjq85] .form-input:hover,
[b-tde7dgjq85] input:hover {
    border-color: var(--color-gray);
}

[b-tde7dgjq85] .form-input:focus,
[b-tde7dgjq85] input:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08);
    background: var(--color-white);
}

.validation-message[b-tde7dgjq85] {
    color: var(--color-error);
    font-size: var(--font-size-sm);
    margin-top: 0.5rem;
    display: block;
}

.btn-primary[b-tde7dgjq85] {
    display: inline-block;
    width: 100%;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: var(--radius-lg);
    font-size: var(--font-size-lg);
    font-weight: 700;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
    text-align: center;
    text-decoration: none;
}

.btn-primary:hover:not(:disabled)[b-tde7dgjq85] {
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

.btn-primary:active:not(:disabled)[b-tde7dgjq85] {
    transform: translateY(0);
}

.btn-primary:disabled[b-tde7dgjq85] {
    opacity: 0.6;
    cursor: not-allowed;
}

.login-footer[b-tde7dgjq85] {
    margin-top: 2rem;
    text-align: center;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.login-footer a[b-tde7dgjq85] {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: none;
    transition: color var(--transition-base);
}

.login-footer a:hover[b-tde7dgjq85] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .login-card[b-tde7dgjq85] {
        padding: 2rem 1.5rem;
    }

    .login-card h1[b-tde7dgjq85] {
        font-size: var(--font-size-3xl);
    }
}
/* /Components/Pages/Account/Security.razor.rz.scp.css */
/* ============================================
   Sign-in & Security (#8165) - what the page shell has no opinion on
   ============================================
   The layout is the shell's (PageHero / PageSection / ContentCard / SuccessMessage /
   ErrorMessage / Button). What is left here: the setup steps, the QR code and the key a
   person types into their app, the one-field code forms, and the recovery codes as a list a
   person reads off and writes down. Every color is a token; nothing is a fixed pixel width
   wider than a phone.
   ============================================ */

.security-page[b-6g5mctpk6z] {
    min-width: 0;
}

.security-copy[b-6g5mctpk6z] {
    margin: 0 0 1rem 0;
    max-width: 60ch;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.security-steps[b-6g5mctpk6z] {
    margin: 0 0 1.25rem 1.25rem;
    padding: 0;
    line-height: 1.6;
    max-width: 60ch;
}

.security-steps li[b-6g5mctpk6z] {
    margin-bottom: 0.5rem;
}

/* The QR code: the SVG scales to its box, and the box never exceeds the card or a phone. */
.security-qr[b-6g5mctpk6z] {
    width: min(100%, 14rem);
    margin: 0 0 1rem 0;
    padding: 0.5rem;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.security-qr[b-6g5mctpk6z]  svg {
    display: block;
    width: 100%;
    height: auto;
}

.security-key[b-6g5mctpk6z] {
    font-family: var(--font-mono, monospace);
    font-size: var(--font-size-lg);
    letter-spacing: 0.08em;
    margin: 0 0 1.5rem 0;
    overflow-wrap: anywhere;
    user-select: all;
}

.security-field[b-6g5mctpk6z] {
    margin-bottom: 1rem;
    max-width: 20rem;
}

.security-label[b-6g5mctpk6z] {
    display: block;
    font-weight: 600;
    font-size: var(--font-size-sm);
    margin-bottom: 0.5rem;
}

[b-6g5mctpk6z] .security-input {
    width: 100%;
    box-sizing: border-box;
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: var(--radius-md);
    font-size: var(--font-size-lg);
    letter-spacing: 0.15em;
    font-family: var(--font-sans);
    background: var(--color-surface);
    color: var(--color-text);
}

[b-6g5mctpk6z] .security-input:focus {
    outline: 2px solid var(--cedar-green);
    outline-offset: 1px;
}

/* The recovery codes: two columns where there is room, one on a phone. */
.security-codes[b-6g5mctpk6z] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(10rem, 100%), 1fr));
    gap: 0.5rem 1.5rem;
}

.security-code[b-6g5mctpk6z] {
    font-family: var(--font-mono, monospace);
    font-size: var(--font-size-lg);
    letter-spacing: 0.08em;
    padding: 0.5rem 0.75rem;
    background: var(--color-gray-lightest);
    border-radius: var(--radius-sm);
    overflow-wrap: anywhere;
    user-select: all;
}

[b-6g5mctpk6z] .security-codes-card {
    border-left: 4px solid var(--wheat-gold);
}
/* /Components/Pages/Account/Unsubscribe.razor.rz.scp.css */
/* ============================================
   Unsubscribe - what the page shell has no opinion on (#7587)
   ============================================
   The page had NO stylesheet at all and 42 inert Tailwind utility names, so every shape on it
   - the card, the measure, the spacing, the buttons - came from nowhere. The layout is the
   shell's now (PageHero / PageSection / ContentCard / EmptyState / Button), which leaves this
   file with exactly two things: the running line inside the confirmation card, and the aside
   that says which email still arrives after an unsubscribe.

   Every colour is a token. A member of either club lands here from their own club's email, so
   nothing on this page may be one club's palette by construction.
   ============================================ */

/* Running prose inside the confirmation card. It sets no colour: the card's own body ink
   reaches it by inheritance, in whichever skin the club wears. */
.unsubscribe-lead[b-8ydpysbfgh] {
    margin: 0 0 1rem 0;
    max-width: 60ch;
    line-height: 1.7;
}

.unsubscribe-lead:last-child[b-8ydpysbfgh] {
    margin-bottom: 0;
}

/* The aside about the email an unsubscribe does NOT stop - a password reset still has to
   arrive. It reads as a quieter step beside the confirmation rather than a second card: the
   club's accent rule marks it on the leading edge and the page's pale ground carries it. */
.unsubscribe-note[b-8ydpysbfgh] {
    margin: 0 0 1rem 0;
    padding: 0.875rem 1rem;
    border-left: 3px solid var(--accent-rule);
    background: var(--color-background);
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
    overflow-wrap: break-word;
}

.unsubscribe-note:last-child[b-8ydpysbfgh] {
    margin-bottom: 0;
}
/* /Components/Pages/Admin/Administrators.razor.rz.scp.css */
.admin-form-page[b-i4a782t7kh] { background: #ffffff; }
.admin-content[b-i4a782t7kh] { max-width: 1300px; margin: 0 auto; }

.administrators-page[b-i4a782t7kh] { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.toolbar[b-i4a782t7kh] { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.search[b-i4a782t7kh] {
    flex: 1 1 280px; padding: 0.55rem 0.75rem; border: 1px solid #d1d5db; border-radius: 0.4rem;
    font-size: 0.9rem;
}
.search:focus[b-i4a782t7kh] { outline: none; border-color: var(--cedar-green, #2D5016); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb),0.12); }
.count[b-i4a782t7kh] { font-size: 0.85rem; color: #6b7280; }

.grid-wrap[b-i4a782t7kh] { overflow-x: auto; border: 1px solid rgba(0,0,0,0.08); border-radius: 0.4rem; }

[b-i4a782t7kh] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-i4a782t7kh] th, [b-i4a782t7kh] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid #eee; vertical-align: middle; }
[b-i4a782t7kh] th { color: #6b7280; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: #fafafa; }

.role-chip[b-i4a782t7kh] {
    font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; background: rgba(0,0,0,0.07); color: #374151;
}
.role-chip.on[b-i4a782t7kh] { background: var(--cedar-green-tint); color: var(--cedar-green, #2D5016); }
.role-chip.system[b-i4a782t7kh] { background: var(--cedar-green, #2D5016); color: #ffffff; }
.elsewhere[b-i4a782t7kh] { display: block; margin-top: 0.3rem; font-size: 0.78rem; color: #6b7280; }
/* /Components/Pages/Admin/AuditLog.razor.rz.scp.css */
.admin-form-page[b-cjiuj3448e] { background: var(--color-surface); }
.admin-content[b-cjiuj3448e] { max-width: 1400px; margin: 0 auto; }
.audit-page[b-cjiuj3448e] { padding: 2.5rem 1.5rem 5rem; }

.toolbar[b-cjiuj3448e] { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.search[b-cjiuj3448e] { flex: 1 1 260px; padding: 0.55rem 0.75rem; border: 1px solid var(--color-border); border-radius: 0.4rem; font-size: 0.9rem; }
.search:focus[b-cjiuj3448e] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12); }
.count[b-cjiuj3448e] { font-size: 0.85rem; color: var(--color-text-secondary); }
.filter[b-cjiuj3448e] { padding: 0.5rem 0.6rem; border: 1px solid var(--color-border); border-radius: 0.4rem; font-size: 0.9rem; background: var(--color-surface); color: var(--color-text); }
.toggle[b-cjiuj3448e] { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.85rem; color: var(--color-text); }
.older[b-cjiuj3448e] { display: flex; justify-content: center; margin-top: 1rem; }

.grid-wrap[b-cjiuj3448e] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-cjiuj3448e] table { width: 100%; border-collapse: collapse; font-size: 0.85rem; }
[b-cjiuj3448e] th, [b-cjiuj3448e] td { text-align: left; padding: 0.55rem 0.8rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-cjiuj3448e] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.when[b-cjiuj3448e] { display: block; white-space: nowrap; color: var(--color-text); }
.where[b-cjiuj3448e] { display: block; font-size: 0.78rem; color: var(--color-text-secondary); }
.who[b-cjiuj3448e] { display: block; color: var(--color-text); }
.reason[b-cjiuj3448e] { display: block; margin-top: 0.3rem; font-size: 0.8rem; color: var(--color-text-secondary); }
.summary[b-cjiuj3448e] { display: block; font-size: 0.8rem; color: var(--color-text-secondary); word-break: break-word; }

.outcome[b-cjiuj3448e] { display: inline-block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.15rem 0.55rem; border-radius: 999px; color: var(--status-ink); background: var(--status-neutral); }
.outcome-succeeded[b-cjiuj3448e] { background: var(--status-success); }
.outcome-refused[b-cjiuj3448e] { background: var(--status-warning); }
.outcome-failed[b-cjiuj3448e] { background: var(--status-danger); }

@media (max-width: 480px) {
    .audit-page[b-cjiuj3448e] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/BoardHub.razor.rz.scp.css */
.admin-form-page[b-b5bnveoe58] { background: var(--color-surface); }
.admin-content[b-b5bnveoe58] { max-width: 1200px; margin: 0 auto; }
.board-hub[b-b5bnveoe58] { padding: 2.5rem 1.5rem 5rem; }

.standing[b-b5bnveoe58] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 2rem; }
.standing-chip[b-b5bnveoe58] {
    font-size: 0.78rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.3rem 0.75rem; border-radius: 999px;
    background: var(--cedar-green-tint); color: var(--cedar-green);
}
.standing-chip-admin[b-b5bnveoe58] { background: var(--cedar-green); color: var(--color-surface); }
.standing-chip-officer[b-b5bnveoe58] { background: var(--wheat-gold); color: var(--on-gold); }
.standing-chip-none[b-b5bnveoe58] { background: var(--color-border); color: var(--color-text-secondary); }

.board-grid[b-b5bnveoe58] { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; }
.board-card[b-b5bnveoe58] {
    display: block; padding: 2rem; border: 1px solid var(--color-border); text-decoration: none;
    background: var(--color-surface); transition: border-color 0.2s ease;
}
.board-card:hover[b-b5bnveoe58], .board-card:focus-visible[b-b5bnveoe58] { border-color: var(--cedar-green); outline: none; }
.board-card-section[b-b5bnveoe58] {
    display: block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--cedar-green); margin-bottom: 0.75rem;
}
.board-card h2[b-b5bnveoe58] {
    font-family: var(--font-display); font-size: 1.15rem; font-weight: 700; margin: 0 0 0.5rem 0;
    color: var(--color-text);
}
.board-card p[b-b5bnveoe58] { margin: 0; color: var(--color-text-secondary); font-size: 0.9375rem; line-height: 1.6; }

.board-note[b-b5bnveoe58] { margin: 2rem 0 0 0; color: var(--color-text-secondary); font-size: 0.875rem; }

@media (max-width: 480px) {
    .board-hub[b-b5bnveoe58] { padding: 1.5rem 1rem 3rem; }
    .board-card[b-b5bnveoe58] { padding: 1.5rem; }
}
/* /Components/Pages/Admin/BoardRoles.razor.rz.scp.css */
.admin-form-page[b-d48bwxyrqf] { background: var(--color-surface); }
.admin-content[b-d48bwxyrqf] { max-width: 1300px; margin: 0 auto; }
.roles-page[b-d48bwxyrqf] { max-width: 1200px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.grant-form[b-d48bwxyrqf] { border: 1px solid var(--color-border); padding: 1.5rem; margin-bottom: 2rem; background: var(--color-surface); }
.grant-form-title[b-d48bwxyrqf] { font-family: var(--font-display); font-size: 1.1rem; font-weight: 700; margin: 0 0 1rem 0; color: var(--color-text); }
.grant-fields[b-d48bwxyrqf] { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.grant-field[b-d48bwxyrqf] { display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.875rem; color: var(--color-text-secondary); }
.grant-field-wide[b-d48bwxyrqf] { grid-column: 1 / -1; }
.grant-field select[b-d48bwxyrqf], .grant-field input[b-d48bwxyrqf] {
    padding: 0.55rem 0.75rem; border: 1px solid var(--color-border); border-radius: 0.4rem; font-size: 0.9rem;
    color: var(--color-text); background: var(--color-surface);
}
.grant-field select:focus[b-d48bwxyrqf], .grant-field input:focus[b-d48bwxyrqf] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12); }
.grant-check[b-d48bwxyrqf] { display: flex; gap: 0.6rem; align-items: flex-start; font-size: 0.875rem; color: var(--color-text-secondary); }
.grant-check input[b-d48bwxyrqf] { margin-top: 0.2rem; }
.grant-actions[b-d48bwxyrqf] { margin-top: 1rem; display: flex; justify-content: flex-end; }

.toolbar[b-d48bwxyrqf] { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.search[b-d48bwxyrqf] { flex: 1 1 260px; padding: 0.55rem 0.75rem; border: 1px solid var(--color-border); border-radius: 0.4rem; font-size: 0.9rem; }
.search:focus[b-d48bwxyrqf] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12); }
.show-history[b-d48bwxyrqf] { font-size: 0.85rem; color: var(--color-text-secondary); display: flex; gap: 0.4rem; align-items: center; }
.count[b-d48bwxyrqf] { font-size: 0.85rem; color: var(--color-text-secondary); }

.grid-wrap[b-d48bwxyrqf] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-d48bwxyrqf] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-d48bwxyrqf] th, [b-d48bwxyrqf] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-d48bwxyrqf] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.role-chip[b-d48bwxyrqf] {
    display: inline-block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; background: var(--cedar-green-tint); color: var(--cedar-green); margin-right: 0.3rem;
}
.role-chip-admin[b-d48bwxyrqf] { background: var(--cedar-green); color: var(--color-surface); }
.role-chip-officer[b-d48bwxyrqf] { background: var(--wheat-gold); color: var(--on-gold); }
.role-chip-emergency[b-d48bwxyrqf] { background: var(--status-warning); color: var(--status-ink); }
.role-title[b-d48bwxyrqf] { display: block; margin-top: 0.3rem; font-size: 0.8rem; color: var(--color-text-secondary); }
.when[b-d48bwxyrqf] { display: block; font-size: 0.78rem; color: var(--color-text-secondary); }

.status[b-d48bwxyrqf] { display: inline-block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.15rem 0.55rem; border-radius: 999px; color: var(--status-ink); background: var(--status-neutral); }
.status-active[b-d48bwxyrqf] { background: var(--status-success); }
.status-awaiting-co-approval[b-d48bwxyrqf] { background: var(--status-warning); }
.status-revoked[b-d48bwxyrqf] { background: var(--status-danger); }
.status-expired[b-d48bwxyrqf] { background: var(--status-neutral); }

@media (max-width: 480px) {
    .roles-page[b-d48bwxyrqf] { padding: 1.5rem 1rem 3rem; }
    .grant-form[b-d48bwxyrqf] { padding: 1rem; }
}
/* /Components/Pages/Admin/Branding.razor.rz.scp.css */
/* The branding admin (#7557). Every colour here is a token, never a literal, so the page
   that sets a club's palette is itself painted in that club's palette. */

.branding-fields[b-jrthopercs] {
    display: grid;
    /* min() keeps the floor from being wider than a phone; see CssResponsivenessTests. */
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1rem;
}

.branding-field[b-jrthopercs] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.branding-field-wide[b-jrthopercs] {
    grid-column: 1 / -1;
}

.branding-label[b-jrthopercs] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.branding-input[b-jrthopercs] {
    width: 100%;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.branding-input:focus-visible[b-jrthopercs] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.branding-textarea[b-jrthopercs] {
    min-height: 7rem;
    resize: vertical;
}

.branding-hint[b-jrthopercs] {
    margin: 0 0 1rem;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.branding-skins[b-jrthopercs] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.branding-skin[b-jrthopercs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.9rem;
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    cursor: pointer;
}

.branding-tokens[b-jrthopercs] {
    display: flex;
    flex-direction: column;
}

.branding-token[b-jrthopercs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 1rem;
    border-bottom: 1px solid var(--color-border);
}

.branding-token:last-child[b-jrthopercs] {
    border-bottom: none;
}

.branding-token-name[b-jrthopercs] {
    flex: 1 1 12rem;
    min-width: 0;
    font-family: monospace;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    overflow-wrap: anywhere;
}

.branding-token-swatch[b-jrthopercs] {
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.25rem;
    padding: 0;
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    background: var(--color-surface);
    cursor: pointer;
}

.branding-token-value[b-jrthopercs] {
    flex: 2 1 12rem;
    min-width: 0;
}

.branding-resource[b-jrthopercs] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.branding-resource .branding-input[b-jrthopercs] {
    flex: 1 1 12rem;
    min-width: 0;
}

/* A second hint inside a card that already has fields above it (#7839). */
.branding-hint-spaced[b-jrthopercs] {
    margin-top: 1.25rem;
}

/* One organization the navigation points at (#7839): its fields, then its Remove button. */
.branding-partner[b-jrthopercs] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
    padding-bottom: 1.25rem;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--color-border);
}

.branding-partner .branding-fields[b-jrthopercs] {
    width: 100%;
}
/* /Components/Pages/Admin/ClubContent.razor.rz.scp.css */
/* The club content editor (#8169). Every color is a token, so the editor is painted in the
   club's own palette; nothing here is wider than a phone. */

.content-fields[b-bd2b1jca8w] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

.content-field[b-bd2b1jca8w] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.content-label[b-bd2b1jca8w] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.content-hint[b-bd2b1jca8w] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.content-hint a[b-bd2b1jca8w],
.content-notice a[b-bd2b1jca8w] {
    color: var(--accent-text-small);
    text-decoration: underline;
}

.content-notice[b-bd2b1jca8w] {
    margin: 0;
    padding: 0.6rem 0.75rem;
    font-size: var(--font-size-sm);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--accent-text-small);
    border-radius: 0.375rem;
    overflow-wrap: anywhere;
}

.content-input[b-bd2b1jca8w] {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

textarea.content-input[b-bd2b1jca8w] {
    min-height: 6rem;
    resize: vertical;
}

textarea.content-textarea-tall[b-bd2b1jca8w] {
    min-height: 14rem;
}

.content-input:focus-visible[b-bd2b1jca8w],
.content-check input:focus-visible[b-bd2b1jca8w] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

/* The add-or-edit form, drawn in a question's place or above the list. */
.content-faq-form[b-bd2b1jca8w] {
    margin-bottom: 0.75rem;
}

.content-check[b-bd2b1jca8w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-base);
    color: var(--color-text);
    cursor: pointer;
}

.content-check input[b-bd2b1jca8w] {
    width: 1.25rem;
    height: 1.25rem;
}

.content-messages:not(:empty)[b-bd2b1jca8w] {
    margin-bottom: 1rem;
}

.content-actions[b-bd2b1jca8w] {
    margin-bottom: 1rem;
}

[b-bd2b1jca8w] .content-group {
    margin-bottom: 1.25rem;
}

.content-group-title[b-bd2b1jca8w] {
    margin: 0;
    padding: 0.75rem 1rem;
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border);
}

/* The organization's questions (#8175): the hint sits inside the flush card, under its title. */
.content-group-hint[b-bd2b1jca8w] {
    padding: 0.5rem 1rem 0.25rem;
}

.content-faqs[b-bd2b1jca8w] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.content-faq[b-bd2b1jca8w] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--color-border);
    min-width: 0;
}

.content-faq:last-child[b-bd2b1jca8w] {
    border-bottom: none;
}

.content-faq-text[b-bd2b1jca8w] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.content-faq-question[b-bd2b1jca8w] {
    font-weight: 600;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.content-faq-answer[b-bd2b1jca8w] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.content-faq-status[b-bd2b1jca8w] {
    align-self: flex-start;
    padding: 0.1rem 0.5rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    color: var(--color-text);
}

.content-faq-status.is-published[b-bd2b1jca8w] {
    border-style: solid;
}

.content-faq-status.is-draft[b-bd2b1jca8w] {
    border-style: dashed;
    color: var(--color-text-secondary);
}

.content-faq-draft .content-faq-question[b-bd2b1jca8w] {
    color: var(--color-text-secondary);
}

.content-faq-buttons[b-bd2b1jca8w],
.content-faq-confirm[b-bd2b1jca8w] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.content-faq-confirm span[b-bd2b1jca8w] {
    font-size: var(--font-size-sm);
    color: var(--color-text);
}
/* /Components/Pages/Admin/ClubDirectors.razor.rz.scp.css */
.admin-form-page[b-p4335u7srq] { background: #ffffff; }
.admin-content[b-p4335u7srq] { max-width: 1300px; margin: 0 auto; }

.directors-page[b-p4335u7srq] { max-width: 1000px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

/* The two lists' headings (owner ruling 2026-10-10): drawn while Tournament Directors are switched on, and,
   while they are off, over the list of whoever still holds the role. Never when the page is the Club
   Directors list alone. */
.section-heading[b-p4335u7srq] {
    margin: 0 0 0.75rem;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

/* The Tournament Directors section: a grant of its own, given and taken away in a block of its own. The
   same block holds the switched-off list (the holders and their Revoke, no picker). Its
   words wrap wherever they must on a narrow screen; that is set on the words, never on the block, because
   overflow-wrap is inherited and a table that inherits it breaks every name, address and button label into
   single letters instead of scrolling inside its wrap as the list below does. */
.td-section[b-p4335u7srq] {
    margin: 0 0 2.5rem;
    padding: 1rem 1rem 1.25rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: var(--river-pearl, #f5f5f0);
}

.td-note[b-p4335u7srq] {
    margin: 0 0 0.75rem;
    font-size: 0.9375rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.td-subheading[b-p4335u7srq] {
    margin: 1rem 0 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #374151;
    overflow-wrap: anywhere;
}

/* Who holds the grant: one row each, the name over the address and the Revoke beside them; on a phone the
   Revoke drops under them. Nothing here scrolls sideways. */
.td-holders[b-p4335u7srq] {
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 0.4rem;
    background: #ffffff;
}

.td-holder[b-p4335u7srq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    padding: 0.6rem 0.9rem;
    border-bottom: 1px solid #eee;
}

.td-holder:last-child[b-p4335u7srq] { border-bottom: 0; }

.td-holder-who[b-p4335u7srq] {
    display: flex;
    flex: 1 1 12rem;
    flex-direction: column;
    min-width: 0;
}

.td-holder-name[b-p4335u7srq] {
    font-size: 0.9rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.td-holder-email[b-p4335u7srq] {
    font-size: 0.85rem;
    color: #6b7280;
    overflow-wrap: anywhere;
}

/* The picker and its button: side by side where there is room, the label on a line of its own, and each
   on its own line on a phone. */
.td-grant[b-p4335u7srq] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-top: 1rem;
}

.td-grant label[b-p4335u7srq] {
    flex: 1 1 100%;
    font-size: 0.9rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.td-grant select[b-p4335u7srq] {
    flex: 1 1 16rem;
    min-width: 0;
    max-width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.4rem;
    background: #ffffff;
    font-size: 0.9rem;
}

.td-grant select:focus[b-p4335u7srq] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.toolbar[b-p4335u7srq] { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.search[b-p4335u7srq] {
    flex: 1 1 280px; padding: 0.55rem 0.75rem; border: 1px solid #d1d5db; border-radius: 0.4rem;
    font-size: 0.9rem;
}
.search:focus[b-p4335u7srq] { outline: none; border-color: var(--cedar-green, #2D5016); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb),0.12); }
.count[b-p4335u7srq] { font-size: 0.85rem; color: #6b7280; }

.grid-wrap[b-p4335u7srq] { overflow-x: auto; border: 1px solid rgba(0,0,0,0.08); border-radius: 0.4rem; }

[b-p4335u7srq] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-p4335u7srq] th, [b-p4335u7srq] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid #eee; }
[b-p4335u7srq] th { color: #6b7280; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: #fafafa; }

.role-chip[b-p4335u7srq] {
    font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; background: rgba(0,0,0,0.07); color: #374151;
}
.role-chip.on[b-p4335u7srq] { background: var(--cedar-green-tint); color: var(--cedar-green, #2D5016); }
/* /Components/Pages/Admin/CreateEvent.razor.rz.scp.css */
/* ============================================
   Admin Create Event - Editorial Design
   ============================================ */

.admin-form-page[b-88dsxrjtkg] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-88dsxrjtkg] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem;
}

.form-container[b-88dsxrjtkg] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2.5rem;
}

@media (max-width: 768px) {
    .form-container[b-88dsxrjtkg] {
        padding: 1.5rem;
    }
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .admin-content[b-88dsxrjtkg] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .admin-content[b-88dsxrjtkg] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/CreateGroupSession.razor.rz.scp.css */
/* ============================================
   Admin Create Group Session - Editorial Design
   ============================================ */

.admin-form-page[b-w0fjljrbs4] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-w0fjljrbs4] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem;
}

.form-container[b-w0fjljrbs4] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .admin-content[b-w0fjljrbs4] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .admin-content[b-w0fjljrbs4] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/EditBook.razor.rz.scp.css */
/* ============================================
   Admin Edit Book - Editorial Design
   ============================================ */

.edit-book-page[b-5ctz7r5xc0] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-5ctz7r5xc0] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Form Container - Editorial Style
   ============================================ */

.form-container[b-5ctz7r5xc0] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.form-section[b-5ctz7r5xc0] {
    padding: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.form-section:last-of-type[b-5ctz7r5xc0] {
    border-bottom: none;
    padding-bottom: 2rem;
}

.section-title[b-5ctz7r5xc0] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.form-row[b-5ctz7r5xc0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.form-row:last-child[b-5ctz7r5xc0] {
    margin-bottom: 0;
}

.form-group[b-5ctz7r5xc0] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group label[b-5ctz7r5xc0] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
}

.required[b-5ctz7r5xc0] {
    color: #dc2626;
}

[b-5ctz7r5xc0] .form-control,
[b-5ctz7r5xc0] input.form-control,
[b-5ctz7r5xc0] select.form-control,
[b-5ctz7r5xc0] textarea.form-control {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    width: 100%;
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-5ctz7r5xc0] .form-control:focus,
[b-5ctz7r5xc0] input.form-control:focus,
[b-5ctz7r5xc0] select.form-control:focus,
[b-5ctz7r5xc0] textarea.form-control:focus {
    outline: none;
    border-color: var(--cedar-green);
}

[b-5ctz7r5xc0] textarea.form-control {
    resize: vertical;
    font-family: inherit;
    min-height: 100px;
}

[b-5ctz7r5xc0] select.form-control {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236B7280' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 12px;
    padding-right: 2.5rem;
}

/* Input with Button */
.input-with-button[b-5ctz7r5xc0] {
    display: flex;
    gap: 0.5rem;
}

.input-with-button .form-control[b-5ctz7r5xc0] {
    flex: 1;
}

/* Hide scan button on screens larger than 820px */
[b-5ctz7r5xc0] .btn-scan-mobile-only {
    display: none;
}

@media (max-width: 820px) {
    [b-5ctz7r5xc0] .btn-scan-mobile-only {
        display: block;
    }
}

/* Checkout Alert Section */
.checkout-section[b-5ctz7r5xc0] {
    background: rgba(var(--wheat-gold-rgb), 0.1);
    border-left: 4px solid var(--wheat-gold);
}

.checkout-alert[b-5ctz7r5xc0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    padding: 1rem;
    background: rgba(var(--wheat-gold-rgb), 0.05);
    border: 1px solid rgba(var(--wheat-gold-rgb), 0.3);
}

.checkout-info p[b-5ctz7r5xc0] {
    margin: 0.5rem 0;
    color: #78350f;
}

.checkout-info strong[b-5ctz7r5xc0] {
    color: #92400e;
}

.overdue-warning[b-5ctz7r5xc0] {
    color: #dc2626;
    font-size: 1.125rem;
    margin-top: 1rem;
}

/* Checkbox Group */
.checkbox-group label[b-5ctz7r5xc0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding: 0.75rem;
    background: rgba(var(--cedar-green-rgb), 0.03);
    border: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.checkbox-group label:hover[b-5ctz7r5xc0] {
    background: rgba(var(--cedar-green-rgb), 0.05);
}

[b-5ctz7r5xc0] .checkbox-group input[type="checkbox"],
.checkbox-group input[type="checkbox"][b-5ctz7r5xc0] {
    width: 1.25rem;
    height: 1.25rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

/* Image Preview */
.image-preview[b-5ctz7r5xc0] {
    margin-top: 0.75rem;
    padding: 1rem;
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: center;
}

.image-preview img[b-5ctz7r5xc0] {
    max-width: 200px;
    max-height: 300px;
    object-fit: contain;
}

/* Validation */
[b-5ctz7r5xc0] .validation-message,
[b-5ctz7r5xc0] .invalid {
    color: #dc2626;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

[b-5ctz7r5xc0] .invalid input,
[b-5ctz7r5xc0] .invalid select,
[b-5ctz7r5xc0] .invalid textarea,
[b-5ctz7r5xc0] input.invalid,
[b-5ctz7r5xc0] select.invalid,
[b-5ctz7r5xc0] textarea.invalid {
    border-color: #dc2626;
}

/* Form Actions */
.form-actions[b-5ctz7r5xc0] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem 2rem;
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .admin-content[b-5ctz7r5xc0] {
        padding: 2rem;
    }

    .form-section[b-5ctz7r5xc0] {
        padding: 1.5rem;
    }

    .form-row[b-5ctz7r5xc0] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .input-with-button[b-5ctz7r5xc0] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .checkout-alert[b-5ctz7r5xc0] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        padding: 0.875rem;
    }

    .form-actions[b-5ctz7r5xc0] {
        flex-direction: column;
        gap: 0.75rem;
        padding: 1rem;
    }
}

@media (max-width: 480px) {

    .admin-content[b-5ctz7r5xc0] {
        padding: 1.5rem;
    }

    .form-section[b-5ctz7r5xc0] {
        padding: 1rem;
    }
}
/* /Components/Pages/Admin/EditEvent.razor.rz.scp.css */
/* ============================================
   Admin Edit Event - Editorial Design
   ============================================ */

.admin-form-page[b-lod64nnpaf] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-lod64nnpaf] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem;
}

.form-container[b-lod64nnpaf] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2.5rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .admin-content[b-lod64nnpaf] {
        padding: 2rem;
    }

    .form-container[b-lod64nnpaf] {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .admin-content[b-lod64nnpaf] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/EditGroupSession.razor.rz.scp.css */
/* ============================================
   Admin Edit Group Session - Editorial Design
   ============================================ */

.admin-form-page[b-1vat7n726d] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-1vat7n726d] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem;
}

.form-container[b-1vat7n726d] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .admin-content[b-1vat7n726d] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .admin-content[b-1vat7n726d] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/Email.razor.rz.scp.css */
/* ============================================
   Admin Email - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.admin-email-page[b-twbi6t8wej] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-twbi6t8wej] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem;
}

.email-form-container[b-twbi6t8wej] {
    background: #ffffff;
}

/* ============================================
   Form Sections
   ============================================ */

.form-section[b-twbi6t8wej] {
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.form-section:last-of-type[b-twbi6t8wej] {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.form-section h2[b-twbi6t8wej] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.form-group[b-twbi6t8wej] {
    margin-bottom: 1.5rem;
}

.form-group:last-child[b-twbi6t8wej] {
    margin-bottom: 0;
}

.form-group label[b-twbi6t8wej] {
    display: block;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.required[b-twbi6t8wej] {
    color: #dc2626;
}

.search-input[b-twbi6t8wej],
.filter-select[b-twbi6t8wej] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    font-family: var(--font-sans);
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-input:focus[b-twbi6t8wej],
.filter-select:focus[b-twbi6t8wej] {
    outline: none;
    border-color: var(--cedar-green);
}

.char-count[b-twbi6t8wej] {
    display: block;
    text-align: right;
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.25rem;
}

.help-text[b-twbi6t8wej] {
    display: block;
    font-size: 0.8125rem;
    color: #6b7280;
    margin-top: 0.5rem;
}

/* ============================================
   Selection Mode Toggle
   ============================================ */

.selection-mode-toggle[b-twbi6t8wej] {
    display: flex;
    gap: 2rem;
}

.radio-label[b-twbi6t8wej] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 400;
    color: #374151;
    font-size: 0.9375rem;
}

.radio-label input[type="radio"][b-twbi6t8wej] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

/* ============================================
   Checkbox Grid
   ============================================ */

.checkbox-grid[b-twbi6t8wej] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.75rem;
}

.checkbox-label[b-twbi6t8wej] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 400;
    color: #374151;
    font-size: 0.9375rem;
}

.checkbox-label input[type="checkbox"][b-twbi6t8wej] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

.checkbox-label.disabled[b-twbi6t8wej] {
    opacity: 0.5;
    cursor: not-allowed;
}

.checkbox-label.disabled input[type="checkbox"][b-twbi6t8wej] {
    cursor: not-allowed;
}

.member-count[b-twbi6t8wej] {
    font-size: 0.8125rem;
    color: #9ca3af;
    font-weight: 400;
}

/* ============================================
   Member Selection Grid
   ============================================ */

.member-selection-header[b-twbi6t8wej] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    background: rgba(var(--cedar-green-rgb), 0.05);
    border: 1px solid rgba(var(--cedar-green-rgb), 0.2);
}

.selection-count[b-twbi6t8wej] {
    font-size: 0.9375rem;
    color: #374151;
}

.selection-count strong[b-twbi6t8wej] {
    color: var(--cedar-green);
    font-size: 1.125rem;
}

.selection-actions[b-twbi6t8wej] {
    display: flex;
    gap: 1rem;
}

.text-button[b-twbi6t8wej] {
    background: none;
    border: none;
    color: var(--cedar-green);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    text-decoration: underline;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.text-button:hover[b-twbi6t8wej] {
    color: var(--wheat-gold);
}

.member-grid-container[b-twbi6t8wej] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    margin-bottom: 1rem;
}

.loading-indicator[b-twbi6t8wej] {
    padding: 2rem;
    text-align: center;
    color: #6b7280;
    font-size: 0.9375rem;
}

/* QuickGrid Styling */
[b-twbi6t8wej] .member-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

[b-twbi6t8wej] .member-grid thead {
    background: rgba(0, 0, 0, 0.02);
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
}

[b-twbi6t8wej] .member-grid th {
    padding: 0.75rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #374151;
}

[b-twbi6t8wej] .member-grid th:first-child {
    width: 50px;
    text-align: center;
}

[b-twbi6t8wej] .member-grid tbody tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    transition: background 0.2s ease;
}

[b-twbi6t8wej] .member-grid tbody tr:hover {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

/* Hide empty rows when filtered */
[b-twbi6t8wej] .member-grid tbody tr:has(td:empty) {
    display: none;
}

[b-twbi6t8wej] .member-grid tbody tr:not(:has(*)) {
    display: none;
}

[b-twbi6t8wej] .member-grid td {
    padding: 0.75rem 1rem;
    vertical-align: middle;
}

[b-twbi6t8wej] .member-grid td:first-child {
    text-align: center;
}

.grid-checkbox[b-twbi6t8wej] {
    display: flex;
    justify-content: center;
    cursor: pointer;
}

.grid-checkbox input[type="checkbox"][b-twbi6t8wej] {
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

.grid-checkbox.disabled[b-twbi6t8wej] {
    opacity: 0.4;
    cursor: not-allowed;
}

.grid-checkbox.disabled input[type="checkbox"][b-twbi6t8wej] {
    cursor: not-allowed;
}

.member-name[b-twbi6t8wej] {
    font-weight: 500;
    color: #111827;
}

/* Membership Badges */
.membership-badge[b-twbi6t8wej] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 0;
}

.membership-badge.community[b-twbi6t8wej] {
    background: #f3f4f6;
    color: #6b7280;
}

.membership-badge.basic[b-twbi6t8wej] {
    background: #dbeafe;
    color: #1e40af;
}

.membership-badge.standard[b-twbi6t8wej] {
    background: #d1fae5;
    color: #065f46;
}

.membership-badge.premium[b-twbi6t8wej] {
    background: #fef3c7;
    color: #92400e;
}

.membership-badge.champion[b-twbi6t8wej] {
    background: #fce7f3;
    color: #9d174d;
}

.membership-badge.family[b-twbi6t8wej] {
    background: #e0e7ff;
    color: #3730a3;
}

.membership-badge.affiliate[b-twbi6t8wej] {
    background: #f3e8ff;
    color: #6b21a8;
}

.membership-badge.sponsor[b-twbi6t8wej] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

/* Status Badges */
.status-badge[b-twbi6t8wej] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 500;
}

.status-badge.active[b-twbi6t8wej] {
    color: #059669;
}

.status-badge.opted-out[b-twbi6t8wej] {
    color: #d97706;
}

.status-badge.unsubscribed[b-twbi6t8wej] {
    color: #dc2626;
}

.status-badge.no-email[b-twbi6t8wej] {
    color: #9ca3af;
}

.status-badge i[b-twbi6t8wej] {
    font-size: 0.6875rem;
}

/* Paginator Styling */
[b-twbi6t8wej] nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

[b-twbi6t8wej] nav button {
    padding: 0.5rem 0.75rem;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

[b-twbi6t8wej] nav button:hover:not(:disabled) {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-color: var(--cedar-green);
}

[b-twbi6t8wej] nav button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

[b-twbi6t8wej] nav span {
    font-size: 0.875rem;
    color: #6b7280;
}

/* ============================================
   Recipient Preview
   ============================================ */

.recipient-preview[b-twbi6t8wej] {
    margin-top: 1rem;
    padding: 1rem 1.5rem;
    background: rgba(var(--cedar-green-rgb), 0.05);
    border: 1px solid rgba(var(--cedar-green-rgb), 0.2);
}

.preview-stat[b-twbi6t8wej] {
    font-size: 1.125rem;
    color: var(--cedar-green);
    margin-bottom: 0.75rem;
}

.preview-stat strong[b-twbi6t8wej] {
    font-size: 1.5rem;
}

.preview-exclusions[b-twbi6t8wej] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.75rem;
}

.preview-exclusions span[b-twbi6t8wej] {
    display: block;
}

.preview-breakdown[b-twbi6t8wej] {
    font-size: 0.875rem;
    color: #374151;
}

.preview-breakdown ul[b-twbi6t8wej] {
    margin: 0.5rem 0 0 1.5rem;
    padding: 0;
}

.preview-breakdown li[b-twbi6t8wej] {
    margin-bottom: 0.25rem;
}

/* ============================================
   Quill Editor
   ============================================ */

.quill-editor[b-twbi6t8wej] {
    min-height: 300px;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

[b-twbi6t8wej] .ql-toolbar {
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.02);
}

[b-twbi6t8wej] .ql-container {
    border: none;
    font-size: 1rem;
    font-family: var(--font-sans);
}

[b-twbi6t8wej] .ql-editor {
    min-height: 250px;
    padding: 1rem;
}

[b-twbi6t8wej] .ql-editor.ql-blank::before {
    color: #9ca3af;
    font-style: normal;
}

/* ============================================
   Form Actions
   ============================================ */

.form-actions[b-twbi6t8wej] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* ============================================
   Modal
   ============================================ */

.modal-overlay[b-twbi6t8wej] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
    padding: 1rem;
}

.modal[b-twbi6t8wej] {
    background: #ffffff;
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    overflow-y: auto;
}

.modal-header[b-twbi6t8wej] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.modal-header h3[b-twbi6t8wej] {
    margin: 0;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.modal-close[b-twbi6t8wej] {
    background: none;
    border: none;
    font-size: 1.25rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0.5rem;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-close:hover[b-twbi6t8wej] {
    color: #000000;
}

.modal-body[b-twbi6t8wej] {
    padding: 1.5rem;
}

.modal-body p[b-twbi6t8wej] {
    margin: 0 0 1rem 0;
    color: #374151;
    font-size: 0.9375rem;
}

.email-preview[b-twbi6t8wej] {
    background: rgba(0, 0, 0, 0.02);
    padding: 1rem;
    margin-top: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.email-preview p[b-twbi6t8wej] {
    margin: 0.5rem 0;
    font-size: 0.875rem;
}

.modal-footer[b-twbi6t8wej] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .admin-content[b-twbi6t8wej] {
        padding: 2rem;
    }

    .checkbox-grid[b-twbi6t8wej] {
        grid-template-columns: 1fr 1fr;
    }

    .form-actions[b-twbi6t8wej] {
        flex-direction: column;
    }

    .form-actions :deep(.btn)[b-twbi6t8wej] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 480px) {

    .admin-content[b-twbi6t8wej] {
        padding: 1.5rem;
    }

    .checkbox-grid[b-twbi6t8wej] {
        grid-template-columns: 1fr;
    }

    .modal[b-twbi6t8wej] {
        margin: 0.5rem;
    }

    .modal-footer[b-twbi6t8wej] {
        flex-direction: column;
    }

    .modal-footer :deep(.btn)[b-twbi6t8wej] {
        width: 100%;
        justify-content: center;
    }
}

/* ============================================
   Failed Emails Panel
   ============================================ */

.failed-emails-panel[b-twbi6t8wej] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-left: 4px solid #dc2626;
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.failed-emails-panel h4[b-twbi6t8wej] {
    color: #dc2626;
    margin: 0 0 1rem 0;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.failed-emails-list[b-twbi6t8wej] {
    max-height: 300px;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.failed-email-item[b-twbi6t8wej] {
    display: grid;
    grid-template-columns: 1fr 1fr 2fr;
    gap: 1rem;
    padding: 0.75rem;
    background: #ffffff;
    border: 1px solid #fecaca;
    border-radius: 0.25rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}

.failed-name[b-twbi6t8wej] {
    font-weight: 600;
    color: #111827;
}

.failed-address[b-twbi6t8wej] {
    color: #6b7280;
}

.failed-error[b-twbi6t8wej] {
    color: #dc2626;
    font-family: monospace;
    font-size: 0.8rem;
}

.dismiss-btn[b-twbi6t8wej] {
    color: #6b7280;
    font-size: 0.875rem;
}

.dismiss-btn:hover[b-twbi6t8wej] {
    color: #111827;
}

/* ============================================
   Sent Emails History
   ============================================ */

.sent-history[b-twbi6t8wej] {
    margin-top: 3rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding-top: 2rem;
}

.sent-history h2[b-twbi6t8wej] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sent-history h2 i[b-twbi6t8wej] {
    color: var(--cedar-green);
}

.refresh-btn[b-twbi6t8wej] {
    margin-left: auto;
    font-size: 0.875rem;
    color: #6b7280;
}

.refresh-btn:hover[b-twbi6t8wej] {
    color: var(--cedar-green);
}

.sent-emails-list[b-twbi6t8wej] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sent-email-item[b-twbi6t8wej] {
    background: #f9fafb;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
}

.sent-email-header[b-twbi6t8wej] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
}

.sent-subject[b-twbi6t8wej] {
    font-weight: 600;
    color: #111827;
    font-size: 1rem;
}

.sent-date[b-twbi6t8wej] {
    font-size: 0.8rem;
    color: #6b7280;
    white-space: nowrap;
}

.sent-email-meta[b-twbi6t8wej] {
    display: flex;
    gap: 1.5rem;
    font-size: 0.8rem;
    color: #6b7280;
    margin-bottom: 0.75rem;
}

.sent-stats[b-twbi6t8wej] {
    display: flex;
    gap: 0.75rem;
}

.text-success[b-twbi6t8wej] {
    color: #10b981;
}

.text-danger[b-twbi6t8wej] {
    color: #dc2626;
}

.sent-category[b-twbi6t8wej] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green);
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
}

.sent-email-actions[b-twbi6t8wej] {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding-top: 0.75rem;
    margin-top: 0.5rem;
}

.sent-email-actions .text-button[b-twbi6t8wej] {
    font-size: 0.8rem;
    color: var(--cedar-green);
}

.sent-email-actions .text-button:hover[b-twbi6t8wej] {
    color: #1a3a0d;
}

.sent-email-actions .text-button i[b-twbi6t8wej] {
    margin-right: 0.25rem;
}

/* ============================================
   Sponsor Toggle
   ============================================ */

.sponsor-section[b-twbi6t8wej] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.sponsor-toggle[b-twbi6t8wej] {
    font-size: 0.9375rem;
}

.sponsor-count[b-twbi6t8wej] {
    font-size: 0.8125rem;
    color: #9ca3af;
    font-weight: 400;
}

.no-sponsors-message[b-twbi6t8wej] {
    font-size: 0.875rem;
    color: #6b7280;
    padding: 0.75rem 1rem;
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.no-sponsors-message i[b-twbi6t8wej] {
    color: #9ca3af;
    margin-right: 0.25rem;
}

/* Sponsor preview in recipient preview */
.preview-sponsors[b-twbi6t8wej] {
    display: inline-block;
    margin-left: 0.5rem;
    color: var(--wheat-gold);
    font-weight: 600;
    font-size: 1rem;
}

/* Sponsor tag in sent email history */
.sponsor-tag[b-twbi6t8wej] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
    padding: 0.125rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Attachments */
[b-twbi6t8wej] input[type="file"] {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    color: #4b5563;
    cursor: pointer;
    padding: 0.5rem 0;
}

[b-twbi6t8wej] input[type="file"]::file-selector-button {
    margin-right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    border: 1px solid var(--cedar-green);
    background-color: var(--cedar-green);
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

[b-twbi6t8wej] input[type="file"]::file-selector-button:hover {
    background-color: #1e3a0e;
}

.attachment-list[b-twbi6t8wej] {
    list-style: none;
    margin: 0.75rem 0 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.attachment-item[b-twbi6t8wej] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background-color: #f3f4f5;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.attachment-item i[b-twbi6t8wej] {
    color: var(--cedar-green);
    font-size: 1rem;
}

.attachment-name[b-twbi6t8wej] {
    flex: 1;
    /* A flex item's min-width is auto, so the ellipsis below never truncates without this -
       the box grows to the whole file name and takes the row with it. */
    min-width: 0;
    color: #111827;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.attachment-size[b-twbi6t8wej] {
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

.attachment-item .remove-btn[b-twbi6t8wej] {
    color: #b91c1c;
}

.attachment-item .remove-btn:hover[b-twbi6t8wej] {
    color: #7f1d1d;
}
/* /Components/Pages/Admin/EmailUnsubscribes.razor.rz.scp.css */
/* The organization's unsubscribed members (#8173). Every color is a token, so each club's
   administrator sees their own club's palette; nothing has a fixed width, so the form stacks and
   the grid scrolls inside its frame at 344px with no page-wide scroll. */
.admin-form-page[b-084csd2al8] { background: var(--color-surface); }
.admin-content[b-084csd2al8] { max-width: 1100px; margin: 0 auto; }
.unsubscribed-page[b-084csd2al8] { padding: 2.5rem 1.5rem 5rem; display: grid; gap: 1.5rem; min-width: 0; }

.hint[b-084csd2al8] { margin: 0 0 1rem 0; max-width: 70ch; font-size: 0.9375rem; line-height: 1.6; }

.record-form[b-084csd2al8] { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.5rem; max-width: 32rem; min-width: 0; }
.field-label[b-084csd2al8] { font-size: 0.85rem; font-weight: 600; color: var(--color-text); }
.field[b-084csd2al8] {
    width: 100%; min-width: 0; padding: 0.55rem 0.75rem; border: 1px solid var(--color-border); border-radius: 0.4rem;
    font-size: 0.95rem; background: var(--color-surface); color: var(--color-text);
}
.field:focus[b-084csd2al8] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12); }
.record-actions[b-084csd2al8] { margin-top: 0.75rem; display: flex; flex-wrap: wrap; gap: 0.75rem; }

.count[b-084csd2al8] { font-size: 0.85rem; color: var(--color-text-secondary); margin: 0; }

.grid-wrap[b-084csd2al8] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-084csd2al8] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-084csd2al8] th, [b-084csd2al8] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-084csd2al8] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.who[b-084csd2al8] { display: block; color: var(--color-text); }
.where[b-084csd2al8] { display: block; font-size: 0.8rem; color: var(--color-text-secondary); overflow-wrap: anywhere; }
.when[b-084csd2al8] { display: block; white-space: nowrap; color: var(--color-text); }

@media (max-width: 480px) {
    .unsubscribed-page[b-084csd2al8] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/EmergencyAccess.razor.rz.scp.css */
.admin-form-page[b-mie0ksoc3r] { background: var(--color-surface); }
.admin-content[b-mie0ksoc3r] { max-width: 1300px; margin: 0 auto; }
.emergency-page[b-mie0ksoc3r] { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.count[b-mie0ksoc3r] { font-size: 0.85rem; color: var(--color-text-secondary); margin: 0 0 1rem 0; }

.grid-wrap[b-mie0ksoc3r] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-mie0ksoc3r] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-mie0ksoc3r] th, [b-mie0ksoc3r] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-mie0ksoc3r] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.role-chip[b-mie0ksoc3r] {
    display: inline-block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; background: var(--status-warning); color: var(--status-ink); margin-right: 0.3rem;
}
.when[b-mie0ksoc3r] { display: block; font-size: 0.78rem; color: var(--color-text-secondary); }

@media (max-width: 480px) {
    .emergency-page[b-mie0ksoc3r] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/EnrichBooks.razor.rz.scp.css */
.admin-page[b-km8wqwjc49] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.enrichment-controls[b-km8wqwjc49] {
    background: white;
    border-radius: 0.5rem;
    padding: 2rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 2rem;
}

.control-group[b-km8wqwjc49] {
    margin-bottom: 1.5rem;
}

.control-group label[b-km8wqwjc49] {
    display: block;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
}

.control-group small[b-km8wqwjc49] {
    display: block;
    color: #6b7280;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

.form-input[b-km8wqwjc49] {
    width: 100%;
    max-width: 300px;
    padding: 0.625rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 1rem;
}

.form-input:focus[b-km8wqwjc49] {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

.control-group input[type="checkbox"][b-km8wqwjc49] {
    width: auto;
    margin-right: 0.5rem;
}

.btn-primary[b-km8wqwjc49] {
    background: #1e3a8a;
    color: white;
    padding: 0.875rem 2rem;
    border: none;
    border-radius: 0.375rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-primary:hover:not(:disabled)[b-km8wqwjc49] {
    background: #1e40af;
}

.btn-primary:disabled[b-km8wqwjc49] {
    opacity: 0.6;
    cursor: not-allowed;
}

.enrichment-results[b-km8wqwjc49] {
    background: white;
    border-radius: 0.5rem;
    padding: 2rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 2rem;
}

.enrichment-results h2[b-km8wqwjc49] {
    font-size: 1.75rem;
    color: #111827;
    margin-bottom: 1.5rem;
}

.result-stats[b-km8wqwjc49] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.stat-card[b-km8wqwjc49] {
    background: #f9fafb;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
}

.stat-card.success[b-km8wqwjc49] {
    border-color: #10b981;
    background: #ecfdf5;
}

.stat-card.warning[b-km8wqwjc49] {
    border-color: #f59e0b;
    background: #fffbeb;
}

.stat-card.error[b-km8wqwjc49] {
    border-color: #ef4444;
    background: #fef2f2;
}

.stat-label[b-km8wqwjc49] {
    font-size: 0.875rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.stat-value[b-km8wqwjc49] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #111827;
}

.errors-section[b-km8wqwjc49] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.375rem;
    padding: 1.5rem;
}

.errors-section h3[b-km8wqwjc49] {
    color: #991b1b;
    margin-bottom: 1rem;
}

.errors-section ul[b-km8wqwjc49] {
    list-style: disc;
    padding-left: 1.5rem;
    color: #7f1d1d;
}

.errors-section li[b-km8wqwjc49] {
    margin-bottom: 0.5rem;
}

.progress-indicator[b-km8wqwjc49] {
    text-align: center;
    padding: 2rem;
}

.statistics-panel[b-km8wqwjc49] {
    background: white;
    border-radius: 0.5rem;
    padding: 2rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    margin-bottom: 2rem;
}

.statistics-panel h2[b-km8wqwjc49] {
    font-size: 1.75rem;
    color: #111827;
    margin-bottom: 1.5rem;
}

.stat-grid[b-km8wqwjc49] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

.stat-item[b-km8wqwjc49] {
    background: #f9fafb;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1.25rem;
    text-align: center;
}

.stat-item.highlight[b-km8wqwjc49] {
    background: #ecfdf5;
    border-color: #10b981;
}

.stat-item.warn[b-km8wqwjc49] {
    background: #fffbeb;
    border-color: #f59e0b;
}

.stat-label[b-km8wqwjc49] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.5rem;
    font-weight: 600;
}

.stat-number[b-km8wqwjc49] {
    font-size: 2rem;
    font-weight: 700;
    color: #111827;
}

.stat-percent[b-km8wqwjc49] {
    font-size: 0.875rem;
    color: #10b981;
    font-weight: 600;
    margin-top: 0.25rem;
}

.sample-books[b-km8wqwjc49] {
    margin-top: 2rem;
}

.sample-books h3[b-km8wqwjc49] {
    font-size: 1.25rem;
    color: #111827;
    margin-bottom: 1rem;
}

.books-table[b-km8wqwjc49] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.books-table thead[b-km8wqwjc49] {
    background: #f3f4f6;
    border-bottom: 2px solid #e5e7eb;
}

.books-table th[b-km8wqwjc49] {
    padding: 0.75rem;
    text-align: left;
    font-weight: 600;
    color: #374151;
}

.books-table td[b-km8wqwjc49] {
    padding: 0.75rem;
    border-bottom: 1px solid #e5e7eb;
}

.books-table tbody tr:hover[b-km8wqwjc49] {
    background: #f9fafb;
}

.missing-count[b-km8wqwjc49] {
    font-weight: 600;
    color: #f59e0b;
}

.books-table small[b-km8wqwjc49] {
    display: block;
    color: #6b7280;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

.loading-stats[b-km8wqwjc49] {
    text-align: center;
    padding: 2rem;
}

.btn-secondary[b-km8wqwjc49] {
    background: #6b7280;
    color: white;
    padding: 0.875rem 2rem;
    border: none;
    border-radius: 0.375rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-secondary:hover[b-km8wqwjc49] {
    background: #4b5563;
}

@media (max-width: 768px) {
    .admin-page[b-km8wqwjc49] {
        padding: 1rem 0.5rem;
    }

    .enrichment-controls[b-km8wqwjc49] {
        padding: 1.5rem;
    }

    .result-stats[b-km8wqwjc49] {
        grid-template-columns: 1fr 1fr;
    }

    .stat-value[b-km8wqwjc49] {
        font-size: 2rem;
    }
}
/* /Components/Pages/Admin/EnvironmentCheck.razor.rz.scp.css */
/* ============================================
   Environment Check - admin diagnostics (#7567)
   ============================================
   The page used to be ~120 lines of inline style with a 1200px inline width and
   its own white cards; it is now the page shell's hero plus ContentCards, and this
   file only styles the key/value rows and the variable dump inside them. Tokens
   only, so a club's palette reaches the page like everywhere else.
   ============================================ */

.admin-form-page[b-lwuutyytn9] {
    background: var(--color-surface);
}

.admin-content[b-lwuutyytn9] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 2.5rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
}

.env-list[b-lwuutyytn9] {
    margin: 0;
    min-width: 0;
}

.env-row[b-lwuutyytn9] {
    display: grid;
    grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
    gap: 0.5rem 1rem;
    align-items: baseline;
    padding: 0.6rem 0;
    border-bottom: 1px solid var(--color-border);
    min-width: 0;
}

.env-row:last-child[b-lwuutyytn9] {
    border-bottom: none;
}

.env-row dt[b-lwuutyytn9] {
    font-weight: 600;
    color: var(--color-dark);
    overflow-wrap: anywhere;
}

.env-row dd[b-lwuutyytn9] {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* The values and the dump sit on the page ground (the parchment on the editorial skin), where
   the card's inherited gray measured 3.56:1 (#8258). They name the muted-text token themselves. */
.env-value[b-lwuutyytn9] {
    color: var(--color-text-secondary);
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
    font-size: 0.9375rem;
    background: var(--color-background);
    padding: 0.2rem 0.5rem;
}

.env-flag[b-lwuutyytn9] {
    font-weight: 700;
}

.env-flag.is-on[b-lwuutyytn9] {
    color: var(--color-success);
}

.env-flag.is-off[b-lwuutyytn9] {
    color: var(--color-error);
}

.env-heading[b-lwuutyytn9] {
    font-family: var(--font-display);
    font-size: 1rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 1.5rem 0 0.5rem 0;
}

.env-dump[b-lwuutyytn9] {
    color: var(--color-text-secondary);
    margin: 0;
    padding: 1rem;
    background: var(--color-background);
    font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
    font-size: 0.8125rem;
    line-height: 1.5;
    /* The dump is one long line per variable. ScrollRegion owns the horizontal
       scrolling, so this must NOT wrap - wrapping would make a 3000-line block. */
    white-space: pre;
}

/* The dump can be hundreds of variables; cap it and let it scroll vertically inside
   the card rather than pushing the guidance card off the bottom of the page. */
[b-lwuutyytn9] .scroll-region-viewport {
    max-height: 26rem;
    overflow-y: auto;
}

@media (max-width: 768px) {
    .admin-content[b-lwuutyytn9] {
        padding: 2rem 1rem;
    }

    .env-row[b-lwuutyytn9] {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.25rem;
    }
}
/* /Components/Pages/Admin/EventRegistrations.razor.rz.scp.css */
.admin-form-page[b-2jzvtfc42b] {
    background: #ffffff;
}

.stat-sub[b-2jzvtfc42b] { font-size: 0.7rem; color: #6b7280; margin-top: 0.15rem; }

.section-select[b-2jzvtfc42b] { padding: 0.2rem 0.3rem; font-size: 0.85rem; max-width: 130px; }
.playup-chk[b-2jzvtfc42b] { font-size: 0.72rem; color: #6b7280; margin-left: 0.35rem; white-space: nowrap; }

.reexport-toggle[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    color: #6b7280;
    cursor: pointer;
}

.possible-families[b-2jzvtfc42b] {
    margin-bottom: 1.25rem;
    padding: 1rem 1.25rem;
    background: #fdf6e3;
    border-left: 4px solid var(--wheat-gold, #D4AF37);
}
.pf-title[b-2jzvtfc42b] { font-weight: 600; color: #374151; margin-bottom: 0.6rem; }
.pf-title i[b-2jzvtfc42b] { color: var(--tobacco-barn-red, #8B4513); margin-right: 0.3rem; }
.pf-row[b-2jzvtfc42b] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.35rem 0;
    flex-wrap: wrap;
}
.pf-names[b-2jzvtfc42b] { color: #4b5563; font-size: 0.9rem; }

.current-teams[b-2jzvtfc42b] {
    margin-bottom: 1.25rem;
    padding: 1rem 1.25rem;
    background: var(--cedar-green-tint);
    border-left: 4px solid var(--cedar-green, #2D5016);
}
.current-teams .pf-title i[b-2jzvtfc42b] { color: var(--cedar-green, #2D5016); }

.live-refresh[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 1rem;
    padding: 0.55rem 1rem;
    border: none;
    background: var(--cedar-green, #2D5016);
    color: #fff;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    border-radius: 3px;
}
.live-refresh:hover[b-2jzvtfc42b] { background: #25420f; }

.possible-family[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--tobacco-barn-red); /* Tobacco Barn Red */
    cursor: help;
}

.retry-btn[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid var(--cedar-green, #2D5016);
    background: #fff;
    color: var(--cedar-green, #2D5016);
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.retry-btn:hover:not(:disabled)[b-2jzvtfc42b] { background: var(--river-pearl, #F5F5F0); }
.retry-btn:disabled[b-2jzvtfc42b] { opacity: 0.5; cursor: default; }

.retry-status[b-2jzvtfc42b] {
    margin: 1rem 0 0;
    padding: 0.75rem 1rem;
    background: var(--cedar-green-tint);
    border-left: 4px solid var(--cedar-green, #2D5016);
    color: var(--cedar-green, #2D5016);
}

/* Declined-payment flag on a registration row */
.pay-declined[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.2rem;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--tobacco-barn-red); /* Tobacco Barn Red */
    cursor: help;
}

.admin-content[b-2jzvtfc42b] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 3rem 2rem;
}

.stats-row[b-2jzvtfc42b] {
    display: flex;
    gap: 2rem;
    margin-bottom: 2rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.stat[b-2jzvtfc42b] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.stat-label[b-2jzvtfc42b] {
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
    white-space: nowrap;
}

.stat-value[b-2jzvtfc42b] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 800;
    color: #111827;
}

.stat-action[b-2jzvtfc42b] { margin-left: auto; align-self: center; }

.grid-wrap[b-2jzvtfc42b] {
    overflow-x: auto;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

[b-2jzvtfc42b] .admin-grid {
    width: 100%;
    font-size: 0.9375rem;
}

[b-2jzvtfc42b] .admin-grid th {
    font-family: var(--font-display);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    background: rgba(var(--cedar-green-rgb), 0.04);
    color: #111827;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 2px solid var(--cedar-green, #2D5016);
}

[b-2jzvtfc42b] .admin-grid td {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    color: #374151;
}

[b-2jzvtfc42b] .admin-grid tr:hover td {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.active-yes[b-2jzvtfc42b] {
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
}

.active-no[b-2jzvtfc42b] {
    color: #dc2626;
    font-weight: 600;
}

@media (max-width: 768px) {
    .admin-content[b-2jzvtfc42b] { padding: 2rem 1rem; }
}

/* Prize breakdown panel */
.prize-breakdown[b-2jzvtfc42b] {
    margin: 1rem 0;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: var(--river-pearl, #f5f5f0);
}

.prize-table[b-2jzvtfc42b] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.5rem;
    font-size: 0.9rem;
}

.prize-table th[b-2jzvtfc42b],
.prize-table td[b-2jzvtfc42b] {
    text-align: left;
    padding: 0.35rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.prize-table th:last-child[b-2jzvtfc42b],
.prize-table td:last-child[b-2jzvtfc42b] {
    text-align: right;
}

.prize-table .prize-buffer td[b-2jzvtfc42b] {
    border-top: 2px solid rgba(0, 0, 0, 0.15);
    border-bottom: none;
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
}

.prize-table .prize-buffer i[b-2jzvtfc42b] {
    margin-right: 0.3rem;
    color: var(--cedar-green, #2D5016);
}

.byes-input[b-2jzvtfc42b] {
    width: 5rem;
    padding: 0.25rem 0.4rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 0.85rem;
}
.byes-input:focus[b-2jzvtfc42b] { outline: none; border-color: var(--wilson-blue, #4A6FA5); }

/* The cancelled-rows toggle (#7588). The label wraps its own checkbox and had no rule, so the
   box and its text sat on the text baseline with no gap. */
.show-cancelled[b-2jzvtfc42b] {
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-bottom: var(--spacing-md);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    cursor: pointer;
}

/* #8296: a registrant on a TCA-required event with no TCA member ID on file. */
[b-2jzvtfc42b] .tca-missing {
    color: var(--color-text-secondary);
    font-style: italic;
}
/* /Components/Pages/Admin/Events.razor.rz.scp.css */
/* ============================================
   Admin Events - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.recurring-badge[b-eg4jjoh7xr] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-left: 0.5rem;
    padding: 0.1rem 0.45rem;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.08);
    border-radius: 3px;
    cursor: help;
    white-space: nowrap;
}
.recurring-badge.instance[b-eg4jjoh7xr] { color: #6b7280; background: rgba(0, 0, 0, 0.05); }

.admin-events-page[b-eg4jjoh7xr] {
    background: #ffffff;
}

/* Cancellation / refund result banner */
.status-banner[b-eg4jjoh7xr] {
    margin: 0 0 1.5rem 0;
    padding: 1rem 1.25rem;
    background: var(--cedar-green-tint);
    border: 1px solid var(--cedar-green);
    border-left: 4px solid var(--cedar-green);
    color: var(--cedar-green);
    font-size: 0.95rem;
    line-height: 1.5;
}

/* ============================================
   Action Bar
   ============================================ */

.action-bar[b-eg4jjoh7xr] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.action-bar-content[b-eg4jjoh7xr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.stats-info[b-eg4jjoh7xr] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-eg4jjoh7xr] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-eg4jjoh7xr] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

/* Upcoming / Past view toggle */
.events-view-toggle[b-eg4jjoh7xr] {
    display: inline-flex;
    border: 1px solid var(--cedar-green, #2D5016);
    border-radius: 0;
    overflow: hidden;
    flex: 0 0 auto;
}

.view-tab[b-eg4jjoh7xr] {
    border: none;
    background: #ffffff;
    color: var(--cedar-green, #2D5016);
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 1.1rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.view-tab + .view-tab[b-eg4jjoh7xr] {
    border-left: 1px solid var(--cedar-green, #2D5016);
}

.view-tab.active[b-eg4jjoh7xr] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
}

.view-tab:hover:not(.active)[b-eg4jjoh7xr] {
    background: var(--limestone-cream, #E8DCC4);
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-eg4jjoh7xr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Events Table - Editorial Style
   ============================================ */

.events-table-container[b-eg4jjoh7xr] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.events-table[b-eg4jjoh7xr] {
    width: 100%;
    border-collapse: collapse;
}

.events-table thead[b-eg4jjoh7xr] {
    border-bottom: 2px solid #000000;
}

.events-table th[b-eg4jjoh7xr] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.events-table tbody tr[b-eg4jjoh7xr] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.events-table tbody tr:hover[b-eg4jjoh7xr] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.events-table td[b-eg4jjoh7xr] {
    padding: 1.25rem 1rem;
    color: #374151;
    font-size: 0.9375rem;
}

.event-title-cell[b-eg4jjoh7xr] {
    font-weight: 600;
    color: #000000;
}

/* ============================================
   Badges - Editorial Style
   ============================================ */

.type-badge[b-eg4jjoh7xr] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.status-badge[b-eg4jjoh7xr] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.published[b-eg4jjoh7xr] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.draft[b-eg4jjoh7xr] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

/* ============================================
   Actions Cell
   ============================================ */

.actions-cell[b-eg4jjoh7xr] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.5rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .events-table-container[b-eg4jjoh7xr] {
        overflow-x: auto;
    }

    .events-table[b-eg4jjoh7xr] {
        min-width: 900px;
    }
}

@media (max-width: 768px) {
    .action-bar-content[b-eg4jjoh7xr] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        gap: 1rem;
    }

    .stats-info[b-eg4jjoh7xr] {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .admin-content[b-eg4jjoh7xr] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .action-bar-content[b-eg4jjoh7xr] {
        padding: 1rem 1.5rem;
    }

    .admin-content[b-eg4jjoh7xr] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/EventSubmissions.razor.rz.scp.css */
.admin-form-page[b-8pfbxug7bz] { background: #ffffff; }
.admin-content[b-8pfbxug7bz] { max-width: 1300px; margin: 0 auto; }

.subs-page[b-8pfbxug7bz] { max-width: 900px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.toolbar[b-8pfbxug7bz] { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 1.5rem; }
.show-toggle[b-8pfbxug7bz] { display: inline-flex; align-items: center; gap: 0.5rem; color: #374151; font-size: 0.9rem; }

.sub-card[b-8pfbxug7bz] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-left: 4px solid #9ca3af;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    background: #fff;
}
.sub-card.status-pending[b-8pfbxug7bz] { border-left-color: var(--wheat-gold, #D4AF37); }
.sub-card.status-approved[b-8pfbxug7bz] { border-left-color: var(--cedar-green, #2D5016); background: var(--cedar-green-tint); }
.sub-card.status-rejected[b-8pfbxug7bz] { border-left-color: #9ca3af; opacity: 0.75; }

.sub-head[b-8pfbxug7bz] { margin-bottom: 0.75rem; }
.title[b-8pfbxug7bz] { font-weight: 700; font-size: 1.15rem; color: #111; margin-right: 0.75rem; }
.status-chip[b-8pfbxug7bz] {
    font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em;
    padding: 0.15rem 0.5rem; border-radius: 999px; background: rgba(0,0,0,0.08); color: #374151;
}
.meta[b-8pfbxug7bz] { font-size: 0.8rem; color: #6b7280; margin-top: 0.25rem; }

.detail-grid[b-8pfbxug7bz] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem 1.5rem; margin: 0.75rem 0; }
.detail-grid > div[b-8pfbxug7bz] { display: flex; flex-direction: column; }
.detail-grid .k[b-8pfbxug7bz] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: #6b7280; }
.detail-grid .v[b-8pfbxug7bz] { font-size: 0.9rem; color: #111; }

.desc[b-8pfbxug7bz] { font-size: 0.9rem; color: #374151; margin: 0.5rem 0; white-space: pre-wrap; }

.links[b-8pfbxug7bz] { display: flex; gap: 1.25rem; margin: 0.5rem 0; flex-wrap: wrap; }
.links a[b-8pfbxug7bz] { color: var(--cedar-green, #2D5016); font-weight: 600; font-size: 0.85rem; text-decoration: none; display: inline-flex; align-items: center; gap: 0.35rem; }
.links a:hover[b-8pfbxug7bz] { text-decoration: underline; }

.actions[b-8pfbxug7bz] { display: flex; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; }
.approved-note[b-8pfbxug7bz] { color: var(--cedar-green, #2D5016); font-weight: 600; margin: 0.5rem 0 0; }
.approved-note a[b-8pfbxug7bz] { color: var(--cedar-green, #2D5016); }

@media (max-width: 640px) {
    .detail-grid[b-8pfbxug7bz] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Admin/GroupSessionRegistrations.razor.rz.scp.css */
/* ============================================
   Admin Group Session Registrations
   ============================================ */

.admin-registrations-page[b-sc6o8nlkui] {
    background: #ffffff;
}

.admin-content[b-sc6o8nlkui] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Stats Bar
   ============================================ */

.stats-bar[b-sc6o8nlkui] {
    display: flex;
    gap: 2rem;
    padding: 1.5rem 0;
    margin-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.stat-item[b-sc6o8nlkui] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-sc6o8nlkui] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

/* ============================================
   Table
   ============================================ */

.registrations-table-container[b-sc6o8nlkui] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.registrations-table[b-sc6o8nlkui] {
    width: 100%;
    border-collapse: collapse;
}

.registrations-table thead[b-sc6o8nlkui] {
    border-bottom: 2px solid #000000;
}

.registrations-table th[b-sc6o8nlkui] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
}

.registrations-table tbody tr[b-sc6o8nlkui] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.registrations-table tbody tr:hover[b-sc6o8nlkui] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.registrations-table tbody tr.cancelled-row[b-sc6o8nlkui] {
    opacity: 0.5;
}

.registrations-table td[b-sc6o8nlkui] {
    padding: 1.25rem 1rem;
    color: #374151;
    font-size: 0.9375rem;
}

.name-cell[b-sc6o8nlkui] {
    font-weight: 600;
    color: #000000;
}

/* ============================================
   Badges
   ============================================ */

.member-badge[b-sc6o8nlkui] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.member-badge.paid[b-sc6o8nlkui] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.member-badge.community[b-sc6o8nlkui] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.status-badge[b-sc6o8nlkui] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.active[b-sc6o8nlkui] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.cancelled[b-sc6o8nlkui] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 1200px) {
    .registrations-table-container[b-sc6o8nlkui] {
        overflow-x: auto;
    }

    .registrations-table[b-sc6o8nlkui] {
        min-width: 800px;
    }
}

@media (max-width: 768px) {
    .admin-content[b-sc6o8nlkui] {
        padding: 2rem;
    }

    .stats-bar[b-sc6o8nlkui] {
        gap: 1rem;
        flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
    .admin-content[b-sc6o8nlkui] {
        padding: 1.5rem;
    }
}

/* ============================================
   Comp Panel (admin-issued $0 registrations)
   ============================================ */

.comp-panel[b-sc6o8nlkui] {
    margin-top: 3rem;
    padding: 2rem;
    border-top: 1px solid #e5e7eb;
    background: var(--river-pearl, #F5F5F0);
    border-radius: 12px;
}

.comp-panel h2[b-sc6o8nlkui] {
    margin: 0 0 0.5rem 0;
    font-size: 1.5rem;
    color: var(--cedar-green);
}

.comp-panel h3[b-sc6o8nlkui] {
    margin: 1.5rem 0 0.75rem 0;
    font-size: 1.125rem;
    color: var(--cedar-green);
}

.comp-help[b-sc6o8nlkui] {
    margin: 0 0 1.25rem 0;
    color: #4b5563;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.comp-form[b-sc6o8nlkui] {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 0.75rem;
    align-items: end;
    margin-bottom: 1.5rem;
}

.comp-field[b-sc6o8nlkui] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.comp-field label[b-sc6o8nlkui] {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--color-gray-dark, #374151);
}

.comp-form .form-input[b-sc6o8nlkui] {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    font-size: 0.9375rem;
}

.comp-form .form-input:focus-visible[b-sc6o8nlkui] {
    border-color: var(--cedar-green);
}

.comps-table[b-sc6o8nlkui] {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
}

.comps-table th[b-sc6o8nlkui],
.comps-table td[b-sc6o8nlkui] {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.9375rem;
}

.comps-table thead th[b-sc6o8nlkui] {
    background: var(--cedar-green);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.75rem;
    font-weight: 700;
}

.comps-table tbody tr:last-child td[b-sc6o8nlkui] {
    border-bottom: none;
}

.alert[b-sc6o8nlkui] {
    padding: 0.875rem 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.9375rem;
}

.alert-error[b-sc6o8nlkui] {
    background: #fee2e2;
    border: 1px solid #fca5a5;
    color: #991b1b;
}

.alert-success[b-sc6o8nlkui] {
    background: #ecfdf5;
    border: 1px solid #6ee7b7;
    color: #065f46;
}

@media (max-width: 768px) {
    .comp-form[b-sc6o8nlkui] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/GroupSessions.razor.rz.scp.css */
/* ============================================
   Admin Group Sessions - Editorial Design
   ============================================ */

.admin-group-sessions-page[b-7xwehbvk82] {
    background: #ffffff;
}

/* ============================================
   Action Bar
   ============================================ */

.action-bar[b-7xwehbvk82] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.action-bar-content[b-7xwehbvk82] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.stats-info[b-7xwehbvk82] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-7xwehbvk82] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-7xwehbvk82] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

/* ============================================
   Content
   ============================================ */

.admin-content[b-7xwehbvk82] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Table
   ============================================ */

.sessions-table-container[b-7xwehbvk82] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.sessions-table[b-7xwehbvk82] {
    width: 100%;
    border-collapse: collapse;
}

.sessions-table thead[b-7xwehbvk82] {
    border-bottom: 2px solid #000000;
}

.sessions-table th[b-7xwehbvk82] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.sessions-table tbody tr[b-7xwehbvk82] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.sessions-table tbody tr:hover[b-7xwehbvk82] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.sessions-table td[b-7xwehbvk82] {
    padding: 1.25rem 1rem;
    color: #374151;
    font-size: 0.9375rem;
}

.session-title-cell[b-7xwehbvk82] {
    font-weight: 600;
    color: #000000;
}

/* ============================================
   Badges
   ============================================ */

.format-badge[b-7xwehbvk82] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.format-badge.inperson[b-7xwehbvk82] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.format-badge.online[b-7xwehbvk82] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.status-badge[b-7xwehbvk82] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.published[b-7xwehbvk82] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.draft[b-7xwehbvk82] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.status-badge.full[b-7xwehbvk82] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.status-badge.completed[b-7xwehbvk82] {
    background: rgba(107, 114, 128, 0.15);
    color: #6b7280;
}

.status-badge.cancelled[b-7xwehbvk82] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.status-badge.inprogress[b-7xwehbvk82] {
    background: rgba(16, 185, 129, 0.15);
    color: #059669;
}

/* ============================================
   Actions
   ============================================ */

.actions-cell[b-7xwehbvk82] {
    display: flex;
    gap: 0.5rem;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 1200px) {
    .sessions-table-container[b-7xwehbvk82] {
        overflow-x: auto;
    }

    .sessions-table[b-7xwehbvk82] {
        min-width: 900px;
    }
}

@media (max-width: 768px) {
    .action-bar-content[b-7xwehbvk82] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        gap: 1rem;
    }

    .stats-info[b-7xwehbvk82] {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .admin-content[b-7xwehbvk82] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .action-bar-content[b-7xwehbvk82] {
        padding: 1rem 1.5rem;
    }

    .admin-content[b-7xwehbvk82] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/HomeBlocks.razor.rz.scp.css */
/* The home page composition editor (#7562). The hero, the section and the buttons come from
   the page shell, so this stylesheet only draws the ordered list of blocks. Every colour
   reaches through a token, so a club's own palette paints this screen too. */

.block-list[b-hllyn0mjgx] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.block-row[b-hllyn0mjgx] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #ffffff;
}

.block-off[b-hllyn0mjgx] {
    background: var(--cedar-green-tint);
    opacity: 0.75;
}

.block-order[b-hllyn0mjgx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
}

.order-button[b-hllyn0mjgx] {
    border: 1px solid rgba(0, 0, 0, 0.15);
    background: transparent;
    color: var(--cedar-green);
    padding: 0.25rem 0.5rem;
    cursor: pointer;
    line-height: 1;
}

.order-button:disabled[b-hllyn0mjgx] {
    opacity: 0.35;
    cursor: default;
}

.order-number[b-hllyn0mjgx] {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    font-size: 0.85rem;
    color: #6b7280;
}

.block-body[b-hllyn0mjgx] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.block-toggle[b-hllyn0mjgx] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    cursor: pointer;
}

.block-name[b-hllyn0mjgx] {
    font-family: var(--font-display);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--cedar-green);
}

.block-description[b-hllyn0mjgx] {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #6b7280;
}

.block-setting[b-hllyn0mjgx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    max-width: 34rem;
}

.setting-label[b-hllyn0mjgx] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: #9ca3af;
}

.setting-input[b-hllyn0mjgx] {
    width: 100%;
    padding: 0.5rem 0.65rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    font: inherit;
    color: inherit;
    background: #ffffff;
}

.setting-number[b-hllyn0mjgx] {
    max-width: 8rem;
}

.block-actions[b-hllyn0mjgx] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 2rem;
}

@media (max-width: 768px) {
    .block-row[b-hllyn0mjgx] {
        flex-direction: column;
    }

    .block-order[b-hllyn0mjgx] {
        flex-direction: row;
    }
}
/* /Components/Pages/Admin/Index.razor.rz.scp.css */
/* ============================================
   Admin Dashboard - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.admin-page[b-7c2dbubozd] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-7c2dbubozd] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

/* ============================================
   Admin Cards Grid - Flat Editorial Style
   ============================================ */

.admin-grid[b-7c2dbubozd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 2rem;
}

.admin-card[b-7c2dbubozd] {
    position: relative;
    background: transparent;
    padding: 2.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    text-decoration: none;
    display: block;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.admin-card:hover[b-7c2dbubozd] {
    border-color: var(--cedar-green);
    background: rgba(var(--cedar-green-rgb), 0.02);
}

.card-icon[b-7c2dbubozd] {
    margin-bottom: 1.5rem;
}

.card-icon i[b-7c2dbubozd] {
    font-size: 2.5rem;
    color: var(--cedar-green);
    opacity: 0.8;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.admin-card:hover .card-icon i[b-7c2dbubozd] {
    opacity: 1;
}

.admin-card h2[b-7c2dbubozd] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.admin-card:hover h2[b-7c2dbubozd] {
    color: var(--cedar-green);
}

.admin-card p[b-7c2dbubozd] {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.7;
    margin: 0;
}

.card-arrow[b-7c2dbubozd] {
    position: absolute;
    bottom: 2.5rem;
    right: 2.5rem;
    color: var(--cedar-green);
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.admin-card:hover .card-arrow[b-7c2dbubozd] {
    opacity: 1;
    transform: translateX(0);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .admin-content[b-7c2dbubozd] {
        padding: 4rem 2rem;
    }

    .admin-grid[b-7c2dbubozd] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .admin-card[b-7c2dbubozd] {
        padding: 2rem;
    }

    .card-arrow[b-7c2dbubozd] {
        bottom: 2rem;
        right: 2rem;
    }
}

@media (max-width: 480px) {

    .admin-content[b-7c2dbubozd] {
        padding: 3rem 1.5rem;
    }

    .admin-card[b-7c2dbubozd] {
        padding: 1.5rem;
    }

    .card-arrow[b-7c2dbubozd] {
        bottom: 1.5rem;
        right: 1.5rem;
    }
}
/* /Components/Pages/Admin/Kiosks.razor.rz.scp.css */
.admin-form-page[b-dvgckqxaxe] { background: #ffffff; }
.admin-content[b-dvgckqxaxe] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 3rem 2rem;
}

.section-title[b-dvgckqxaxe] {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin: 0 0 1rem;
}

.register-box[b-dvgckqxaxe] { margin-bottom: 2.5rem; }
.register-row[b-dvgckqxaxe] { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: stretch; }
.register-row .fld[b-dvgckqxaxe] {
    flex: 1 1 200px;
    padding: 0.6rem 0.75rem;
    border: 1px solid #d1d5db;
    font-size: 0.95rem;
    font-family: inherit;
}
.register-row .fld:focus[b-dvgckqxaxe] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

/* Per-tablet rename / reader row (what a club's administrator may change). Same field look
   as the register row, sitting under the tablet's card. */
.device-edit[b-dvgckqxaxe] { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: stretch; margin: -0.25rem 0 0.75rem; padding: 0.6rem 0.75rem; background: #fafafa; border: 1px solid rgba(0, 0, 0, 0.08); border-top: none; }
.device-edit .fld[b-dvgckqxaxe] {
    flex: 1 1 200px;
    padding: 0.6rem 0.75rem;
    border: 1px solid #d1d5db;
    font-size: 0.95rem;
    font-family: inherit;
}
.device-edit .fld:focus[b-dvgckqxaxe] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.qr[b-dvgckqxaxe] { margin: 0.75rem 0; }
.qr[b-dvgckqxaxe]  svg { display: block; width: 240px; max-width: 100%; height: auto; }
.device-qr[b-dvgckqxaxe] {
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-top: none;
    margin: -0.6rem 0 0.6rem;
}

.bind-callout[b-dvgckqxaxe] {
    margin-top: 1rem;
    padding: 1rem 1.25rem;
    background: var(--cedar-green-tint);
    border-left: 4px solid var(--cedar-green, #2D5016);
}
.bind-callout p[b-dvgckqxaxe] { margin: 0 0 0.4rem; color: #374151; }
.bind-callout code[b-dvgckqxaxe] { word-break: break-all; font-size: 0.85rem; color: var(--cedar-green, #2D5016); }


.device-card[b-dvgckqxaxe] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(0, 0, 0, 0.12);
    margin-bottom: 0.6rem;
    background: #fff;
}
.device-card.inactive[b-dvgckqxaxe] { opacity: 0.65; background: #fafafa; }

.device-main[b-dvgckqxaxe] { display: flex; flex-direction: column; gap: 0.2rem; min-width: 0; }
.device-name[b-dvgckqxaxe] { font-weight: 700; color: #111827; }
.device-meta[b-dvgckqxaxe] { font-size: 0.82rem; color: #6b7280; }
.device-bind[b-dvgckqxaxe] { font-size: 0.78rem; color: var(--wilson-blue, #4A6FA5); word-break: break-all; }

.device-actions[b-dvgckqxaxe] { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end; }
.state[b-dvgckqxaxe] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.15rem 0.5rem; }
.state.on[b-dvgckqxaxe] { color: var(--cedar-green, #2D5016); background: rgba(var(--cedar-green-rgb), 0.08); }
.state.off[b-dvgckqxaxe] { color: var(--tobacco-barn-red, #8B4513); background: rgba(var(--tobacco-barn-red-rgb), 0.08); }
.state.pending[b-dvgckqxaxe] { color: #8a6d00; background: rgba(var(--wheat-gold-rgb), 0.18); }

.list-head[b-dvgckqxaxe] { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

@media (max-width: 640px) {
    .device-card[b-dvgckqxaxe] { flex-direction: column; align-items: stretch; }
    .device-actions[b-dvgckqxaxe] { justify-content: flex-start; }
}
/* /Components/Pages/Admin/Ladder/AdminLadder.razor.rz.scp.css */
/* ===== Admin Ladder Page ===== */

.admin-ladder-page[b-wjwxn6dfj9] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
}

/* Tab Navigation */
.tab-nav[b-wjwxn6dfj9] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 1.5rem;
}

.tab[b-wjwxn6dfj9] {
    padding: 0.75rem 1.5rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s ease;
}

.tab:hover[b-wjwxn6dfj9] {
    color: #111827;
}

.tab.active[b-wjwxn6dfj9] {
    color: var(--cedar-green, #2D5016);
    border-bottom-color: var(--cedar-green, #2D5016);
}

/* Message */
.message[b-wjwxn6dfj9] {
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 4px;
}

.message.success[b-wjwxn6dfj9] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.2);
}

.message.error[b-wjwxn6dfj9] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Panel */
.panel[b-wjwxn6dfj9] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

.panel h2[b-wjwxn6dfj9] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1.25rem 0;
}

/* Admin Table */
.admin-table[b-wjwxn6dfj9] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.admin-table th[b-wjwxn6dfj9] {
    text-align: left;
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    border-bottom: 1px solid #e5e7eb;
}

.admin-table td[b-wjwxn6dfj9] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
    color: #374151;
}

.admin-table a[b-wjwxn6dfj9] {
    color: var(--cedar-green, #2D5016);
    text-decoration: none;
    font-weight: 600;
}

.admin-table a:hover[b-wjwxn6dfj9] {
    text-decoration: underline;
}

/* Badges */
.badge[b-wjwxn6dfj9] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.badge-active[b-wjwxn6dfj9] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
}

.badge-break[b-wjwxn6dfj9] {
    background: rgba(107, 114, 128, 0.15);
    color: #6b7280;
}

/* Form */
.form-grid[b-wjwxn6dfj9] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.form-group[b-wjwxn6dfj9] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group.full-width[b-wjwxn6dfj9] {
    grid-column: 1 / -1;
}

.form-group label[b-wjwxn6dfj9] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.checkbox-label[b-wjwxn6dfj9] {
    flex-direction: row !important;
    align-items: center;
    gap: 0.5rem !important;
    font-weight: 500 !important;
}

[b-wjwxn6dfj9] input[type="text"],
[b-wjwxn6dfj9] input[type="number"],
[b-wjwxn6dfj9] input[type="date"],
[b-wjwxn6dfj9] select,
[b-wjwxn6dfj9] textarea {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.9rem;
    transition: border-color 0.2s ease;
}

[b-wjwxn6dfj9] input:focus,
[b-wjwxn6dfj9] select:focus,
[b-wjwxn6dfj9] textarea:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 2px rgba(var(--cedar-green-rgb), 0.1);
}

[b-wjwxn6dfj9] input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
}

/* Buttons */
.btn-primary[b-wjwxn6dfj9] {
    padding: 0.6rem 1.5rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-primary:hover:not(:disabled)[b-wjwxn6dfj9] {
    background: var(--cedar-green-light);
}

.btn-primary:disabled[b-wjwxn6dfj9] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-small[b-wjwxn6dfj9] {
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.btn-danger[b-wjwxn6dfj9] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.btn-danger:hover:not(:disabled)[b-wjwxn6dfj9] {
    background: rgba(239, 68, 68, 0.2);
}

.btn-danger:disabled[b-wjwxn6dfj9] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Panel Header */
.panel-header[b-wjwxn6dfj9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.panel-header h2[b-wjwxn6dfj9] {
    margin: 0;
}

/* Season Status Badges */
.badge-draft[b-wjwxn6dfj9] {
    background: rgba(107, 114, 128, 0.15);
    color: #6b7280;
}

.badge-registration[b-wjwxn6dfj9] {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.badge-finalizing[b-wjwxn6dfj9] {
    background: rgba(245, 158, 11, 0.1);
    color: #d97706;
}

.badge-completed[b-wjwxn6dfj9] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
}

.badge-cancelled[b-wjwxn6dfj9] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.badge-stakes[b-wjwxn6dfj9] {
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #b8941e;
    margin-left: 0.4rem;
}

/* Season Form */
.create-season-form[b-wjwxn6dfj9] {
    background: #f9fafb;
    border: 1px solid rgba(0, 0, 0, 0.08);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.create-season-form h3[b-wjwxn6dfj9] {
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

/* Status Transition Button */
.btn-status[b-wjwxn6dfj9] {
    background: rgba(59, 130, 246, 0.1);
    color: #2563eb;
}

.btn-status:hover:not(:disabled)[b-wjwxn6dfj9] {
    background: rgba(59, 130, 246, 0.2);
}

.btn-finalize[b-wjwxn6dfj9] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
}

.btn-finalize:hover:not(:disabled)[b-wjwxn6dfj9] {
    background: rgba(34, 197, 94, 0.2);
}

.btn-link[b-wjwxn6dfj9] {
    background: none;
    color: var(--cedar-green, #2D5016);
    text-decoration: none;
    font-weight: 600;
}

.btn-link:hover[b-wjwxn6dfj9] {
    text-decoration: underline;
}

/* Table cells */
.date-cell[b-wjwxn6dfj9] {
    white-space: nowrap;
    font-size: 0.85rem;
}

.actions-cell[b-wjwxn6dfj9] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.muted[b-wjwxn6dfj9] {
    color: #9ca3af;
}

/* Disputed results banner */
.dispute-banner[b-wjwxn6dfj9] {
    border: 1px solid #f0c000;
    border-left: 4px solid var(--wheat-gold);
    background: #fffbeb;
    padding: 1rem 1.25rem;
    border-radius: 0.4rem;
    margin-bottom: 1.5rem;
}
.dispute-banner h2[b-wjwxn6dfj9] { margin: 0 0 0.25rem; font-size: 1.05rem; color: #92400e; }
.dispute-banner > p[b-wjwxn6dfj9] { margin: 0 0 0.75rem; font-size: 0.9rem; color: #6b7280; }
.dispute-row[b-wjwxn6dfj9] {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 0.6rem 0; border-top: 1px solid rgba(0,0,0,0.08); flex-wrap: wrap;
}
.dispute-reports[b-wjwxn6dfj9] { display: block; font-size: 0.8rem; color: #6b7280; margin-top: 0.15rem; }
.dispute-actions[b-wjwxn6dfj9] { display: flex; gap: 0.5rem; align-items: center; }
.dispute-actions select[b-wjwxn6dfj9] { padding: 0.4rem 0.6rem; border: 1px solid #d1d5db; border-radius: 0.35rem; }
.btn-resolve[b-wjwxn6dfj9] {
    padding: 0.45rem 0.9rem; border: none; border-radius: 0.35rem; cursor: pointer;
    background: var(--cedar-green, #2D5016); color: #fff; font-weight: 600;
}
.btn-resolve:disabled[b-wjwxn6dfj9] { opacity: 0.6; cursor: not-allowed; }
/* /Components/Pages/Admin/LibraryBooks.razor.rz.scp.css */
/* ============================================
   Admin Library Books - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.admin-books-page[b-mxwnqkb8l4] {
    background: #ffffff;
}

/* ============================================
   Action Bar
   ============================================ */

.action-bar[b-mxwnqkb8l4] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.action-bar-content[b-mxwnqkb8l4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.stats-info[b-mxwnqkb8l4] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-mxwnqkb8l4] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-mxwnqkb8l4] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

/* ============================================
   Filters Section
   ============================================ */

.filters-section[b-mxwnqkb8l4] {
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filters-content[b-mxwnqkb8l4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-group[b-mxwnqkb8l4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-mxwnqkb8l4] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
}

.search-input[b-mxwnqkb8l4],
.filter-select[b-mxwnqkb8l4] {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    font-family: var(--font-sans);
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-input[b-mxwnqkb8l4] {
    min-width: 280px;
}

.filter-select[b-mxwnqkb8l4] {
    min-width: 150px;
}

.search-input:focus[b-mxwnqkb8l4],
.filter-select:focus[b-mxwnqkb8l4] {
    outline: none;
    border-color: var(--cedar-green);
}

.clear-filters-btn[b-mxwnqkb8l4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.2);
    color: #6b7280;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.clear-filters-btn:hover[b-mxwnqkb8l4] {
    border-color: var(--cedar-green);
    color: var(--cedar-green);
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-mxwnqkb8l4] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Table - Editorial Style
   ============================================ */

.table-container[b-mxwnqkb8l4] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.books-table[b-mxwnqkb8l4] {
    width: 100%;
    border-collapse: collapse;
}

.books-table thead[b-mxwnqkb8l4] {
    border-bottom: 2px solid #000000;
}

.books-table th[b-mxwnqkb8l4] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.books-table tbody tr[b-mxwnqkb8l4] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.books-table tbody tr:hover[b-mxwnqkb8l4] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.books-table td[b-mxwnqkb8l4] {
    padding: 1rem;
    color: #374151;
    font-size: 0.9375rem;
    vertical-align: middle;
}

/* Book Cell */
.book-cell[b-mxwnqkb8l4] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.book-thumbnail[b-mxwnqkb8l4] {
    width: 40px;
    height: 60px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.book-info[b-mxwnqkb8l4] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.book-title[b-mxwnqkb8l4] {
    font-weight: 600;
    color: #000000;
    text-decoration: none;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.book-title:hover[b-mxwnqkb8l4] {
    color: var(--cedar-green);
}

.catalog-id[b-mxwnqkb8l4] {
    font-size: 0.75rem;
    color: #6b7280;
}

.isbn-cell[b-mxwnqkb8l4] {
    font-family: monospace;
    font-size: 0.75rem;
    color: #6b7280;
}

/* ============================================
   Badges - Editorial Style
   ============================================ */

.status-badge[b-mxwnqkb8l4] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.available[b-mxwnqkb8l4] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.checked-out[b-mxwnqkb8l4] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

/* ============================================
   Actions Cell
   ============================================ */

.actions-cell[b-mxwnqkb8l4] {
    display: flex;
    gap: 0.5rem;
    white-space: nowrap;
}

/* ============================================
   Results Info
   ============================================ */

.results-info[b-mxwnqkb8l4] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.875rem;
    color: #9ca3af;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .table-container[b-mxwnqkb8l4] {
        overflow-x: auto;
    }

    .books-table[b-mxwnqkb8l4] {
        min-width: 900px;
    }
}

@media (max-width: 768px) {
    .action-bar-content[b-mxwnqkb8l4] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        gap: 1rem;
    }

    .stats-info[b-mxwnqkb8l4] {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .filters-content[b-mxwnqkb8l4] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        align-items: stretch;
    }

    .filter-group[b-mxwnqkb8l4] {
        width: 100%;
    }

    .search-input[b-mxwnqkb8l4],
    .filter-select[b-mxwnqkb8l4] {
        width: 100%;
        min-width: auto;
    }

    .clear-filters-btn[b-mxwnqkb8l4] {
        width: 100%;
        justify-content: center;
    }

    .admin-content[b-mxwnqkb8l4] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .action-bar-content[b-mxwnqkb8l4] {
        padding: 1rem 1.5rem;
    }

    .filters-content[b-mxwnqkb8l4] {
        padding: 1rem 1.5rem;
    }

    .admin-content[b-mxwnqkb8l4] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/LibraryCheckouts.razor.rz.scp.css */
/* ============================================
   Admin Library Checkouts - Editorial Design
   ============================================ */

.admin-checkouts-page[b-corsfrmpeu] {
    background: #ffffff;
}

/* ============================================
   Action Bar
   ============================================ */

.action-bar[b-corsfrmpeu] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.action-bar-content[b-corsfrmpeu] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.stats-info[b-corsfrmpeu] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-corsfrmpeu] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-corsfrmpeu] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

.stat-item.overdue strong[b-corsfrmpeu] {
    color: #dc2626;
}

/* ============================================
   Filters Section
   ============================================ */

.filters-section[b-corsfrmpeu] {
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filters-content[b-corsfrmpeu] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-group[b-corsfrmpeu] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-corsfrmpeu] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
}

.search-input[b-corsfrmpeu],
.filter-select[b-corsfrmpeu] {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    font-family: var(--font-sans);
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-input[b-corsfrmpeu] {
    min-width: 280px;
}

.filter-select[b-corsfrmpeu] {
    min-width: 150px;
}

.search-input:focus[b-corsfrmpeu],
.filter-select:focus[b-corsfrmpeu] {
    outline: none;
    border-color: var(--cedar-green);
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-corsfrmpeu] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Table - Editorial Style
   ============================================ */

.table-container[b-corsfrmpeu] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.checkouts-table[b-corsfrmpeu] {
    width: 100%;
    border-collapse: collapse;
}

.checkouts-table thead[b-corsfrmpeu] {
    border-bottom: 2px solid #000000;
}

.checkouts-table th[b-corsfrmpeu] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.checkouts-table tbody tr[b-corsfrmpeu] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.checkouts-table tbody tr:hover[b-corsfrmpeu] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.checkouts-table tbody tr.overdue-row[b-corsfrmpeu] {
    background: rgba(220, 38, 38, 0.05);
}

.checkouts-table tbody tr.overdue-row:hover[b-corsfrmpeu] {
    background: rgba(220, 38, 38, 0.08);
}

.checkouts-table td[b-corsfrmpeu] {
    padding: 1rem;
    color: #374151;
    font-size: 0.9375rem;
    vertical-align: middle;
}

/* Book Cell */
.book-cell[b-corsfrmpeu] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.book-thumbnail[b-corsfrmpeu] {
    width: 40px;
    height: 60px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.book-info[b-corsfrmpeu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.book-title[b-corsfrmpeu] {
    font-weight: 600;
    color: #000000;
    text-decoration: none;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.book-title:hover[b-corsfrmpeu] {
    color: var(--cedar-green);
}

.book-author[b-corsfrmpeu] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* User Cell */
.user-cell[b-corsfrmpeu] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.user-name[b-corsfrmpeu] {
    font-weight: 600;
    color: #000000;
}

.user-email[b-corsfrmpeu] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Status Badges */
.status-badge[b-corsfrmpeu] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.active[b-corsfrmpeu] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.status-badge.overdue[b-corsfrmpeu] {
    background: rgba(220, 38, 38, 0.15);
    color: #dc2626;
}

.status-badge.returned[b-corsfrmpeu] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.overdue-text[b-corsfrmpeu] {
    color: #dc2626;
    font-weight: 600;
}

.overdue-badge[b-corsfrmpeu] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #dc2626;
    margin-top: 0.25rem;
}

/* Condition */
.condition[b-corsfrmpeu] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Actions */
.actions-cell[b-corsfrmpeu] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.btn-action[b-corsfrmpeu] {
    padding: 0.5rem 1rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    border: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-align: center;
}

.btn-return[b-corsfrmpeu] {
    background: var(--cedar-green);
    color: white;
}

.btn-return:hover[b-corsfrmpeu] {
    background: #234012;
}

.btn-reminder[b-corsfrmpeu] {
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.2);
    color: #6b7280;
}

.btn-reminder:hover[b-corsfrmpeu] {
    border-color: var(--cedar-green);
    color: var(--cedar-green);
}

.text-muted[b-corsfrmpeu] {
    color: #9ca3af;
    font-size: 0.875rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .table-container[b-corsfrmpeu] {
        overflow-x: auto;
    }

    .checkouts-table[b-corsfrmpeu] {
        min-width: 900px;
    }
}

@media (max-width: 768px) {
    .action-bar-content[b-corsfrmpeu] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        gap: 1rem;
    }

    .stats-info[b-corsfrmpeu] {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .filters-content[b-corsfrmpeu] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        align-items: stretch;
    }

    .filter-group[b-corsfrmpeu] {
        width: 100%;
    }

    .search-input[b-corsfrmpeu],
    .filter-select[b-corsfrmpeu] {
        width: 100%;
        min-width: auto;
    }

    .admin-content[b-corsfrmpeu] {
        padding: 2rem;
    }

    .actions-cell[b-corsfrmpeu] {
        flex-direction: row;
    }
}

@media (max-width: 480px) {
    .action-bar-content[b-corsfrmpeu] {
        padding: 1rem 1.5rem;
    }

    .filters-content[b-corsfrmpeu] {
        padding: 1rem 1.5rem;
    }

    .admin-content[b-corsfrmpeu] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/ManageCoaches.razor.rz.scp.css */
/* ============================================
   Admin Manage Coaches - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.manage-coaches-page[b-4896jpl0w1] {
    background: #ffffff;
}

/* ============================================
   Tab Section
   ============================================ */

.tab-section[b-4896jpl0w1] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.tab-container[b-4896jpl0w1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
}

.tab-nav[b-4896jpl0w1] {
    display: flex;
    gap: 0;
    border-bottom: none;
}

.tab-button[b-4896jpl0w1] {
    padding: 1.25rem 2rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border: none;
    background: transparent;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tab-button i[b-4896jpl0w1] {
    font-size: 1rem;
}

.tab-button:hover[b-4896jpl0w1] {
    color: var(--cedar-green);
}

.tab-button.active[b-4896jpl0w1] {
    color: var(--cedar-green);
    border-bottom-color: var(--cedar-green);
}

.tab-badge[b-4896jpl0w1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.5rem;
    height: 1.5rem;
    padding: 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    background: rgba(0, 0, 0, 0.1);
    color: #6b7280;
    border-radius: 0;
}

.tab-button.active .tab-badge[b-4896jpl0w1] {
    background: var(--cedar-green);
    color: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-4896jpl0w1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Loading State
   ============================================ */

.loading-container[b-4896jpl0w1] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
}

.loading-text[b-4896jpl0w1] {
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ============================================
   Application Cards - Editorial Style
   ============================================ */

.applications-container[b-4896jpl0w1] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.application-card[b-4896jpl0w1] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    background: #ffffff;
    transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.application-card:hover[b-4896jpl0w1] {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.application-content[b-4896jpl0w1] {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

@media (min-width: 1024px) {
    .application-content[b-4896jpl0w1] {
        flex-direction: row;
    }
}

/* Coach Info Section */
.coach-info-section[b-4896jpl0w1] {
    flex: 1;
}

.coach-header[b-4896jpl0w1] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.coach-avatar[b-4896jpl0w1] {
    width: 5rem;
    height: 5rem;
    border-radius: 0;
    object-fit: cover;
    border: 2px solid rgba(0, 0, 0, 0.1);
}

.coach-avatar-placeholder[b-4896jpl0w1] {
    width: 5rem;
    height: 5rem;
    border-radius: 0;
    background: rgba(var(--cedar-green-rgb), 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cedar-green);
    font-size: 1.5rem;
    font-weight: 700;
    border: 2px solid rgba(0, 0, 0, 0.1);
}

.coach-header-info[b-4896jpl0w1] {
    flex: 1;
}

.coach-name[b-4896jpl0w1] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.coach-experience[b-4896jpl0w1] {
    font-size: 0.875rem;
    color: #6b7280;
}

.coach-player-ids[b-4896jpl0w1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.5rem;
    font-family: monospace;
}

/* Coach Details */
.coach-detail-section[b-4896jpl0w1] {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.coach-detail-section:last-child[b-4896jpl0w1] {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.detail-label[b-4896jpl0w1] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.detail-content[b-4896jpl0w1] {
    font-size: 0.9375rem;
    color: #374151;
    line-height: 1.6;
}

.detail-content strong[b-4896jpl0w1] {
    font-weight: 600;
    color: #000000;
}

/* Status Badges - Editorial Style */
.status-badge[b-4896jpl0w1] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.success[b-4896jpl0w1] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.warning[b-4896jpl0w1] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

/* Actions Section */
.actions-section[b-4896jpl0w1] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

@media (min-width: 1024px) {
    .actions-section[b-4896jpl0w1] {
        width: 18rem;
        flex-shrink: 0;
    }
}

/* ============================================
   Coaches Table - Editorial Style
   ============================================ */

.coaches-table-container[b-4896jpl0w1] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.coaches-table[b-4896jpl0w1] {
    width: 100%;
    border-collapse: collapse;
}

.coaches-table thead[b-4896jpl0w1] {
    border-bottom: 2px solid #000000;
}

.coaches-table th[b-4896jpl0w1] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.coaches-table tbody tr[b-4896jpl0w1] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.coaches-table tbody tr:hover[b-4896jpl0w1] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.coaches-table td[b-4896jpl0w1] {
    padding: 1rem;
    color: #374151;
    font-size: 0.9375rem;
    vertical-align: middle;
}

/* Coach Cell */
.coach-cell[b-4896jpl0w1] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.coach-cell-avatar[b-4896jpl0w1] {
    width: 3rem;
    height: 3rem;
    border-radius: 0;
    object-fit: cover;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.coach-cell-avatar-placeholder[b-4896jpl0w1] {
    width: 3rem;
    height: 3rem;
    border-radius: 0;
    background: rgba(var(--cedar-green-rgb), 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cedar-green);
    font-weight: 700;
    font-size: 1rem;
}

.coach-cell-info[b-4896jpl0w1] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.coach-cell-name[b-4896jpl0w1] {
    font-weight: 600;
    color: #000000;
}

.coach-cell-id[b-4896jpl0w1] {
    font-size: 0.75rem;
    color: #6b7280;
    font-family: monospace;
}

.table-cell-text[b-4896jpl0w1] {
    font-size: 0.875rem;
    color: #374151;
    white-space: nowrap;
}

.table-cell-text-muted[b-4896jpl0w1] {
    color: #9ca3af;
}

.table-cell-rates > div[b-4896jpl0w1] {
    line-height: 1.5;
}

/* Table Badges - Editorial Style */
.table-badge[b-4896jpl0w1] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.table-badge.success[b-4896jpl0w1] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.table-badge.warning[b-4896jpl0w1] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.table-badge.accepting[b-4896jpl0w1] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.table-badge.not-accepting[b-4896jpl0w1] {
    background: rgba(0, 0, 0, 0.05);
    color: #6b7280;
}

/* Actions Cell */
.actions-cell[b-4896jpl0w1] {
    display: flex;
    gap: 0.5rem;
    white-space: nowrap;
}

/* ============================================
   Messages - Editorial Style
   ============================================ */

.message-container[b-4896jpl0w1] {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 50;
    padding: 1rem 1.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.message-container.success[b-4896jpl0w1] {
    background: var(--cedar-green);
    color: #ffffff;
}

.message-container.error[b-4896jpl0w1] {
    background: #dc2626;
    color: #ffffff;
}

.message-content[b-4896jpl0w1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.message-content.success[b-4896jpl0w1] {
    color: #ffffff;
}

.message-content.error[b-4896jpl0w1] {
    color: #ffffff;
}

/* ============================================
   Reject Dialog - Editorial Style
   ============================================ */

.dialog-overlay[b-4896jpl0w1] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
}

.dialog-content[b-4896jpl0w1] {
    background: #ffffff;
    padding: 2rem;
    max-width: 28rem;
    margin: 0 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.dialog-title[b-4896jpl0w1] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.dialog-message[b-4896jpl0w1] {
    color: #374151;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.dialog-actions[b-4896jpl0w1] {
    display: flex;
    gap: 1rem;
}

.dialog-actions > *[b-4896jpl0w1] {
    flex: 1;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .coaches-table-container[b-4896jpl0w1] {
        overflow-x: auto;
    }

    .coaches-table[b-4896jpl0w1] {
        min-width: 800px;
    }
}

@media (max-width: 768px) {
    .tab-container[b-4896jpl0w1] {
        padding: 0 2rem;
    }

    .tab-button[b-4896jpl0w1] {
        padding: 1rem 1.25rem;
        font-size: 0.75rem;
    }

    .tab-button i[b-4896jpl0w1] {
        display: none;
    }

    .admin-content[b-4896jpl0w1] {
        padding: 2rem;
    }

    .application-card[b-4896jpl0w1] {
        padding: 1.5rem;
    }

    .coach-header[b-4896jpl0w1] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .coach-player-ids[b-4896jpl0w1] {
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .tab-container[b-4896jpl0w1] {
        padding: 0 1.5rem;
    }

    .tab-button[b-4896jpl0w1] {
        padding: 0.75rem 1rem;
        flex: 1;
        justify-content: center;
    }

    .admin-content[b-4896jpl0w1] {
        padding: 1.5rem;
    }

    .application-card[b-4896jpl0w1] {
        padding: 1rem;
    }

    .actions-section[b-4896jpl0w1] {
        width: 100%;
    }
}

/* ============================================
   Certificates awaiting verification (#8043)
   ============================================ */

.reverify-panel[b-4896jpl0w1] {
    border: 1px solid rgba(var(--wheat-gold-rgb), 0.6);
    background: rgba(var(--wheat-gold-rgb), 0.12);
    padding: 1.25rem 1.5rem;
    margin-bottom: 2rem;
}

.reverify-title[b-4896jpl0w1] {
    font-family: var(--font-display);
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #92400e;
    margin: 0 0 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.reverify-intro[b-4896jpl0w1] {
    margin: 0 0 1rem;
    color: #374151;
}

.reverify-list[b-4896jpl0w1] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.reverify-item[b-4896jpl0w1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.reverify-name[b-4896jpl0w1] {
    font-weight: 600;
    overflow-wrap: anywhere;
}

.reverify-applicant[b-4896jpl0w1] {
    font-weight: 400;
    color: #374151;
}

.reverify-actions[b-4896jpl0w1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* A row whose file changed after the page listed it (#8043 review round 1): on its own line. */
.reverify-replaced[b-4896jpl0w1] {
    display: block;
    margin-top: 0.25rem;
    font-weight: 600;
    color: #92400e;
}
/* /Components/Pages/Admin/ManageMembers.razor.rz.scp.css */
/* ============================================
   Admin Manage Members Page
   ============================================ */

.admin-members-page[b-ez2m6hroup] {
    background: #ffffff;
    min-height: 100vh;
}

/* Stats */
.stats-section[b-ez2m6hroup] {
    padding: 2rem 4rem;
    background: var(--river-pearl);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.stats-grid[b-ez2m6hroup] {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

.stat-card[b-ez2m6hroup] {
    background: #ffffff;
    padding: 1.5rem;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.stat-value[b-ez2m6hroup] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.stat-label[b-ez2m6hroup] {
    font-size: 0.875rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.25rem;
}

/* Filters */
.filters-section[b-ez2m6hroup] {
    padding: 2rem 4rem;
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filters-row[b-ez2m6hroup] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
}

.filter-group[b-ez2m6hroup] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-ez2m6hroup] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #666;
}

.filter-group select[b-ez2m6hroup],
.filter-group input[b-ez2m6hroup] {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 0.95rem;
    background: #ffffff;
    min-width: 180px;
}

.filter-group select:focus[b-ez2m6hroup],
.filter-group input:focus[b-ez2m6hroup] {
    outline: none;
    border-color: var(--cedar-green);
}

.search-group[b-ez2m6hroup] {
    flex-grow: 1;
}

.search-group input[b-ez2m6hroup] {
    width: 100%;
}

/* Table */
.table-section[b-ez2m6hroup] {
    padding: 2rem 4rem;
    max-width: 1200px;
    margin: 0 auto;
}

.table-container[b-ez2m6hroup] {
    overflow-x: auto;
}

/* #8200: "Try again" under a refused or failed Unclaimed accounts load, said in place of the list. */
.unclaimed-retry[b-ez2m6hroup] {
    display: flex;
    justify-content: flex-start;
    margin-top: 1rem;
}

[b-ez2m6hroup] .members-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    /* The header row's ground and the ink its titles are drawn in: a pair, so no title is drawn in anything but the
       ink this ground was chosen for (#8145 owner ruling 5, review: the sponsors grid's pair, on this grid too). */
    --members-header-ground: #000000;
    --members-header-ink: #ffffff;
}

[b-ez2m6hroup] .members-table th {
    background: var(--members-header-ground);
    color: var(--members-header-ink);
    padding: 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-ez2m6hroup] .members-table td {
    padding: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    vertical-align: middle;
}

/* A sortable column's title is a button (QuickGrid's button.col-title), and a button takes nothing from its cell: the
   browser draws it in its own color and its own type. Member, Membership and Proximity were button black on the black
   header, on both skins, in the browser's 13.3 px control face and in mixed case - the bug the owner ruled on for
   /admin/sponsors (#8145 owner ruling 5, 2026-10-07), left on this grid until its review. Every title is drawn in the
   header's ink and set in the header cell's own face, size, case, spacing and alignment. The weight is left to
   QuickGrid's theme, which sets every title bold: the font shorthand would take the cell's weight instead, which the
   same theme sets to normal. */
[b-ez2m6hroup] .members-table th .col-title {
    color: var(--members-header-ink);
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    text-align: inherit;
}

/* A title may wrap at its spaces (#8504, WALK-1007-live b1). QuickGrid keeps every title on one line (white-space:
   nowrap on .col-title-text), which holds its column at the whole title's width. Once the titles were set in the
   header's uppercase display face (the rule above, 88b0da25), "HIDE FROM DIRECTORY" and "EXCLUDE FROM EMAILS" held
   about 230 px each over cells that need under 90 ("Hidden", "Excluded"), and on dev's members the five-column grid
   measured 1110 px in its 1057 px frame at 1440: "EXCLUDE FROM EMAILS" was clipped 15 px until the frame was scrolled.
   As on the sponsors grid (#8445), a title takes a second line when the frame is short. Measured in headless Chrome on
   the page as the server renders it, with an address as wide as dev's widest, at 1440: the grid's narrowest width went
   from 1093 to 902 px on the editorial skin and from 1011 to 914 px on the photo skin, of the 1057 px frame; with
   registration-age-floor's Birth date column, from 1239 and 1127 px to 1007 and 1014 px. */
[b-ez2m6hroup] .members-table .col-title-text {
    white-space: normal;
}

/* The sorted column's arrow, drawn in the header's ink. QuickGrid paints the arrow as a black picture (a background
   image), which no color reaches, so a sorted column's arrow was black on the black header. Here the arrow's own shape
   (QuickGrid's) is the mask and the ink is the paint; QuickGrid still flips it for an ascending sort. */
[b-ez2m6hroup] .members-table th.col-sort-asc .sort-indicator,
[b-ez2m6hroup] .members-table th.col-sort-desc .sort-indicator {
    background: var(--members-header-ink);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 2 3.25 L 12 20.75 L 22 3.25 L 12 10 z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 2 3.25 L 12 20.75 L 22 3.25 L 12 10 z'/%3E%3C/svg%3E") center / contain no-repeat;
}

[b-ez2m6hroup] .members-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.02);
}

.member-cell[b-ez2m6hroup] {
    display: flex;
    flex-direction: column;
}

.member-name[b-ez2m6hroup] {
    font-weight: 600;
    color: #000000;
}

.member-email[b-ez2m6hroup] {
    font-size: 0.875rem;
    color: #666;
}

/* #8296: the member's TCA member ID, under the email. */
.member-tca[b-ez2m6hroup] {
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
    overflow-wrap: anywhere;
}

/* An account nobody has claimed yet, listed on its own: for a data request (#8200) or the directory exclusion before the claim (#8177). */
.member-unclaimed[b-ez2m6hroup] {
    font-size: 0.8125rem;
    font-style: italic;
    color: var(--color-text-secondary);
}

/* A membership that ran out (#8145): the tier and the day, under the tier held now. */
.membership-lapsed[b-ez2m6hroup] {
    margin-top: 0.25rem;
    font-size: 0.8125rem;
    color: var(--color-text-secondary);
}

.membership-badge[b-ez2m6hroup] {
    display: inline-block;
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: rgba(var(--wilson-blue-rgb), 0.1);
    color: var(--wilson-blue);
}

/* Proximity (distance-from-club) */
.proximity-cell[b-ez2m6hroup] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    align-items: flex-start;
}

.proximity-badge[b-ez2m6hroup] {
    display: inline-flex;
    align-items: baseline;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.proximity-miles[b-ez2m6hroup] {
    font-size: 0.6875rem;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    opacity: 0.75;
}

.proximity-local[b-ez2m6hroup] {
    background: rgba(var(--cedar-green-rgb), 0.12);
    color: var(--wilson-green, #2d5016);
}

.proximity-regional[b-ez2m6hroup] {
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #8a6d1a;
}

.proximity-distant[b-ez2m6hroup] {
    background: rgba(180, 35, 35, 0.12);
    color: #b42323;
}

.proximity-unknown[b-ez2m6hroup] {
    background: rgba(120, 120, 120, 0.12);
    color: #6b7280;
}

.proximity-flag[b-ez2m6hroup] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #b42323;
}

/* Toggle */
.toggle[b-ez2m6hroup] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;
}

.toggle[b-ez2m6hroup]  input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
    accent-color: var(--cedar-green);
}

.toggle[b-ez2m6hroup]  input[type="checkbox"]:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.toggle-label[b-ez2m6hroup] {
    font-size: 0.875rem;
    color: #333;
}

/* #8200: the Data column's actions and the deletion confirmation panel. The two actions are
   plain buttons styled as quiet links, so the column stays as narrow as the toggles beside it;
   the panel sits under the table rather than over it, so it never fights the fixed message. */
.data-actions[b-ez2m6hroup] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.data-action[b-ez2m6hroup] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0;
    border: 0;
    background: transparent;
    color: var(--cedar-green);
    font: inherit;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

.data-action:hover:not(:disabled)[b-ez2m6hroup] {
    color: var(--cedar-green-dark);
}

.data-action:disabled[b-ez2m6hroup] {
    cursor: not-allowed;
    opacity: 0.5;
}

.data-action-danger[b-ez2m6hroup] {
    color: var(--color-error);
}

.data-action-danger:hover:not(:disabled)[b-ez2m6hroup] {
    color: var(--color-error);
    opacity: 0.85;
}

.delete-panel[b-ez2m6hroup] {
    max-width: 1200px;
    margin: 1.5rem auto 0;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--color-error);
    border-left-width: 4px;
    background: var(--color-surface);
    min-width: 0;
}

.delete-panel-title[b-ez2m6hroup] {
    margin: 0 0 0.5rem 0;
    font-family: var(--font-display);
    font-size: 1.125rem;
    color: var(--color-dark);
    overflow-wrap: break-word;
}

.delete-panel-text[b-ez2m6hroup] {
    margin: 0 0 1rem 0;
    max-width: 70ch;
    line-height: 1.6;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

.delete-panel-label[b-ez2m6hroup] {
    display: block;
    margin: 0 0 0.375rem 0;
    font-weight: 600;
    color: var(--color-dark);
}

.delete-panel-input[b-ez2m6hroup] {
    display: block;
    width: 100%;
    max-width: 24rem;
    min-width: 0;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    line-height: 1.4;
}

.delete-panel-input:focus[b-ez2m6hroup] {
    outline: 2px solid var(--color-error);
    outline-offset: 1px;
    border-color: var(--color-error);
}

.delete-panel-actions[b-ez2m6hroup] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    min-width: 0;
}

/* #8385: an administrator's birth date correction - the delete panel's shape, in the brand color. */
.correct-panel[b-ez2m6hroup] {
    max-width: 1200px;
    margin: 1.5rem auto 0;
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--cedar-green);
    border-left-width: 4px;
    background: var(--color-surface);
    min-width: 0;
}

.correct-panel-title[b-ez2m6hroup] {
    margin: 0 0 0.5rem 0;
    font-family: var(--font-display);
    font-size: 1.125rem;
    color: var(--color-dark);
    overflow-wrap: break-word;
}

.correct-panel-text[b-ez2m6hroup] {
    margin: 0 0 1rem 0;
    max-width: 70ch;
    line-height: 1.6;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

.correct-panel-label[b-ez2m6hroup] {
    display: block;
    margin: 1rem 0 0.375rem 0;
    font-weight: 600;
    color: var(--color-dark);
}

.correct-panel-input[b-ez2m6hroup] {
    display: block;
    width: 100%;
    max-width: 24rem;
    min-width: 0;
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
    line-height: 1.4;
}

.correct-panel-reason[b-ez2m6hroup] {
    max-width: 40rem;
    resize: vertical;
}

.correct-panel-input:focus[b-ez2m6hroup] {
    outline: 2px solid var(--cedar-green);
    outline-offset: 1px;
    border-color: var(--cedar-green);
}

.correct-panel-hint[b-ez2m6hroup] {
    display: block;
    margin-top: 0.375rem;
    max-width: 70ch;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

.correct-panel-explain[b-ez2m6hroup] {
    max-width: 70ch;
    margin-top: 1rem;
    overflow-wrap: break-word;
}

.correct-panel-explain p[b-ez2m6hroup] {
    margin: 0 0 0.5rem 0;
    padding-left: 0.75rem;
    border-left: 3px solid var(--wheat-gold);
    line-height: 1.6;
    color: var(--color-text);
}

.correct-panel-actions[b-ez2m6hroup] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1rem;
    min-width: 0;
}

/* Loading */

.loading-container[b-ez2m6hroup] {
    text-align: center;
    padding: 4rem;
}

.loading-text[b-ez2m6hroup] {
    color: #666;
}

/* Messages */
.message-container[b-ez2m6hroup] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
    /* A refusal now stays until the next action or until it is dismissed (#8361), so a long one is read
       on a phone too: never wider than the window, as the join pill is not. */
    max-width: calc(100vw - 4rem);
}

.message-content[b-ez2m6hroup] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    font-weight: 500;
}

.message-content.success[b-ez2m6hroup] {
    background: var(--cedar-green);
    color: #ffffff;
}

.message-content.error[b-ez2m6hroup] {
    background: #dc2626;
    color: #ffffff;
}

/* Puts a refusal away without acting again (#8361). */
.message-dismiss[b-ez2m6hroup] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    min-height: 2rem;
    margin-left: auto;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.6);
    background: transparent;
    color: #ffffff;
    font-size: 1rem;
    cursor: pointer;
}

.message-dismiss:hover[b-ez2m6hroup] {
    background: rgba(255, 255, 255, 0.15);
}

/* The site's focus ring is the secondary color, which does not read on the error red. */
.message-dismiss:focus-visible[b-ez2m6hroup] {
    outline: 2px solid #ffffff !important;
    outline-offset: 2px !important;
}

/* Responsive */
@media (max-width: 1024px) {
    .stats-grid[b-ez2m6hroup] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .stats-grid[b-ez2m6hroup] {
        grid-template-columns: 1fr 1fr;
    }

    .filters-row[b-ez2m6hroup] {
        flex-direction: column;
        gap: 1rem;
    }

    .filter-group[b-ez2m6hroup] {
        width: 100%;
    }

    .filter-group select[b-ez2m6hroup],
    .filter-group input[b-ez2m6hroup] {
        width: 100%;
    }
}
/* /Components/Pages/Admin/ManageSponsors.razor.rz.scp.css */
/* ============================================
   Admin Manage Sponsors Page
   ============================================ */

.admin-sponsors-page[b-rkdvorm2ne] {
    background: #ffffff;
    min-height: 100vh;
}

/* ============================================
   Stats Section
   ============================================ */

.stats-section[b-rkdvorm2ne] {
    padding: 2rem 4rem;
    background: var(--river-pearl);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.stats-grid[b-rkdvorm2ne] {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
}

.stat-card[b-rkdvorm2ne] {
    background: #ffffff;
    padding: 1.5rem;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.stat-value[b-rkdvorm2ne] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.stat-label[b-rkdvorm2ne] {
    font-size: 0.875rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.25rem;
    /* A label folds inside its tile (#8549). The phone rules below leave every word of "List Price of Active
       Sponsorships" room to stay whole; a word that still cannot fit breaks rather than widening the page. */
    overflow-wrap: break-word;
}

/* ============================================
   Filters Section
   ============================================ */

.filters-section[b-rkdvorm2ne] {
    padding: 2rem 4rem;
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filters-row[b-rkdvorm2ne] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
}

.filter-group[b-rkdvorm2ne] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-rkdvorm2ne] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #666;
}

.filter-group select[b-rkdvorm2ne],
.filter-group input[b-rkdvorm2ne] {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 0.95rem;
    background: #ffffff;
    min-width: 150px;
}

.filter-group select:focus[b-rkdvorm2ne],
.filter-group input:focus[b-rkdvorm2ne] {
    outline: none;
    border-color: var(--cedar-green);
}

.search-group[b-rkdvorm2ne] {
    flex-grow: 1;
}

.search-group input[b-rkdvorm2ne] {
    width: 100%;
}

/* ============================================
   Table Section
   ============================================ */

.table-section[b-rkdvorm2ne] {
    padding: 2rem 4rem;
    max-width: 1200px;
    margin: 0 auto;
}

.table-container[b-rkdvorm2ne] {
    overflow-x: auto;
}

/* The grid fits its frame at 1440 with all eight columns - "Sold At" and "Shown At" drawn - and keeps every contact
   address whole (#8445: WALK-1005f b3-8176, then WALK-1006b b1). A table is never narrower than its columns'
   narrowest widths, and at eight columns the other seven's titles alone took about 886 px of the 1057 px frame, so
   the Business column was squeezed to 171 px and every address broke mid-word. The titles now give way first: the
   cells' own padding spaces the columns, without QuickGrid's extra gap at the right of each one (--col-gap), a
   title's sides are half a rem, and a two-word title may wrap at its space (.col-title-text, below). The columns
   then leave Business room for an address on one line. */
[b-rkdvorm2ne] .sponsors-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    --col-gap: 0px;
    /* The header row's ground and the ink its titles are drawn in: a pair, so no title is drawn in anything but the
       ink this ground was chosen for (#8145 owner ruling 5). */
    --sponsors-header-ground: #000000;
    --sponsors-header-ink: #ffffff;
}

[b-rkdvorm2ne] .sponsors-table th {
    background: var(--sponsors-header-ground);
    color: var(--sponsors-header-ink);
    /* Half the side padding it had (#8445, WALK-1006b b1). With "Sold At" and "Shown At" both drawn the
       grid has eight columns, and seven of them are as wide as their HEADER, not their cells: the title
       text, the sort indicator, the title's own padding, QuickGrid's 1rem header gap (below) and 2rem of
       cell padding came to about 80 px of chrome a column, and the Business column got what was left -
       about 171 px at 1440, a name on three lines and every address broken mid-word. */
    padding: 1rem 0.5rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* QuickGrid's default theme pads every header's content 1rem on the right as a column gap; the cell
   padding above already separates the columns, so for this table that gap is only width the Business
   column cannot have (#8445, WALK-1006b b1). The theme's selector carries the attribute, so this one does too.
   The theme's gap is var(--col-gap), which .sponsors-table already sets to 0px, so this rule keeps the header's
   gap dropped on its own; measured with it and without, the grid's narrowest width at 1440 is the same. */
[b-rkdvorm2ne] .sponsors-table[theme] .col-header-content {
    padding-right: 0;
}

[b-rkdvorm2ne] .sponsors-table td {
    padding: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    vertical-align: middle;
}

/* A sortable column's title is a button (QuickGrid's button.col-title), and a button takes nothing from its cell: the
   browser draws it in its own color and its own type. Every title is drawn in the header's ink: Business, Tier, Status
   and End Date were button black on the black header, on both skins (#8145 owner ruling 5, 2026-10-07). Every title is
   also set in the header cell's own face, size, case, spacing and alignment (ruling 5 review): once they could be seen,
   those four read in the browser's 13.3 px control face, in mixed case, beside the uppercase display face of the
   others. The weight is left to QuickGrid's theme, which sets every title bold. The font shorthand would take the
   cell's weight instead, which the same theme sets to normal, and would turn all eight titles regular. Measured in
   headless Chrome on the page as the server renders it, at 1440 with all eight columns and an over-long address at
   the cap, the uppercase titles keep the grid in its 1057 px frame (#8445): its narrowest width went from 1025 to
   1037 px on the editorial skin, and from 1045 to 1036 px on the photo skin, whose display face is narrower. */
[b-rkdvorm2ne] .sponsors-table th .col-title {
    color: var(--sponsors-header-ink);
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
    text-align: inherit;
}

/* The sorted column's arrow, drawn in the header's ink (#8145 owner ruling 5, review). QuickGrid paints the arrow as a
   black picture (a background image), which no color reaches, so a sorted column's arrow was black on the black
   header. Here the arrow's own shape (QuickGrid's) is the mask and the ink is the paint; QuickGrid still flips it for
   an ascending sort. */
[b-rkdvorm2ne] .sponsors-table th.col-sort-asc .sort-indicator,
[b-rkdvorm2ne] .sponsors-table th.col-sort-desc .sort-indicator {
    background: var(--sponsors-header-ink);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 2 3.25 L 12 20.75 L 22 3.25 L 12 10 z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 2 3.25 L 12 20.75 L 22 3.25 L 12 10 z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* QuickGrid keeps a title on one line (white-space: nowrap), which holds its column at the whole title's width. */
[b-rkdvorm2ne] .sponsors-table .col-title-text {
    white-space: normal;
}

[b-rkdvorm2ne] .sponsors-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.02);
}

/* Business Cell */
.business-cell[b-rkdvorm2ne] {
    display: flex;
    align-items: center;
    gap: 1rem;
    /* A floor under the Business column (#8445, WALK-1006b b1): a business name and an ordinary contact
       address wrap at word boundaries, and only an over-long address breaks. Narrower than this the frame
       (.table-container) scrolls sideways rather than the column giving way. At 1440 the floor is slack:
       with the header chrome above trimmed, Business takes what the seven other columns leave. */
    min-width: 14rem;
}

.sponsor-logo[b-rkdvorm2ne] {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.logo-placeholder[b-rkdvorm2ne] {
    width: 48px;
    height: 48px;
    background: var(--river-pearl);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ccc;
}

.business-info[b-rkdvorm2ne] {
    display: flex;
    flex-direction: column;
}

.business-name[b-rkdvorm2ne] {
    font-weight: 600;
    color: #000000;
}

.business-contact[b-rkdvorm2ne] {
    font-size: 0.875rem;
    color: #666;
    /* Breaks only where it must (#8445, WALK-1006b b1): overflow-wrap: anywhere let the auto table layout count the
       address as one letter wide, so the Business column collapsed to 171 px and every address broke mid-word. Kept
       whole, an address holds its column open, up to this cap: one longer than that - and only one that long - breaks
       to fit, so it cannot widen the grid past its frame. The cap is sized for the wider face: the photo skin draws the
       address in Montserrat, where 18rem broke an ordinary 36-character address mid-word (#8445 b1 review). 22rem keeps
       a 43-character address whole on both skins, and with eight columns at 1440 the grid's narrowest width is 1030 px
       of the 1057 px frame with an over-long address at the cap. */
    overflow-wrap: break-word;
    max-width: 22rem;
}

/* Tier Badge */
.tier-badge[b-rkdvorm2ne] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tier-queen[b-rkdvorm2ne] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green);
}

.tier-rook[b-rkdvorm2ne] {
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #a88a2d;
}

.tier-knight[b-rkdvorm2ne] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    color: var(--wilson-blue);
}

.tier-pawn[b-rkdvorm2ne] {
    background: rgba(0, 0, 0, 0.05);
    color: #666;
}

/* Status Badge */
.status-badge[b-rkdvorm2ne] {
    display: inline-block;
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-active[b-rkdvorm2ne] {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.status-pending[b-rkdvorm2ne] {
    background: rgba(234, 179, 8, 0.1);
    color: #ca8a04;
}

.status-expired[b-rkdvorm2ne] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
}

.status-cancelled[b-rkdvorm2ne] {
    background: rgba(0, 0, 0, 0.05);
    color: #666;
}

.status-refunded[b-rkdvorm2ne] {
    background: rgba(168, 85, 247, 0.1);
    color: #9333ea;
}

/* Text Helpers */
.text-danger[b-rkdvorm2ne] {
    color: #dc2626;
}

/* An end date is held on one line (#8445's remainder, WALK-1007b-flagged P1a and b2). Left free to fold, every date on
   the photo skin read "Oct 1, / 2027" at 1440 with eight columns, and on the editorial skin too once the day has two
   digits ("May 31, / 2027"): the auto table layout gives the End Date column a share of the frame by how much it could
   grow, and that share was less than a whole date. The room for a one-line date comes from the grid's own text:
   the date and the two club columns beside it (Sold At, Shown At) are drawn at the contact address's size. Held on one
   line at the cells' full size, the widest dates ("May 31, 2027", "Dec 28, 2027") took the grid's narrowest width to
   1075 px on the photo skin and 1058 px on the editorial one, of the 1057 px frame, with an over-long address at the
   cap: the WALK-1005f b3-8176 overflow again. At the address's size it is 1044 and 1047 px (measured in headless
   Chrome on the rendered page, real fonts, eight columns at 1440). On a replica of the walk's eight sponsors on the
   photo skin every date is on one line, and the Business column is a little wider than before.
   Only a grid that draws a club column carries .with-club-columns (ManageSponsors.razor), and these rules reach no
   other (review finding 5). The live six-column grid (org-sponsors Disabled: no Sold At, no Shown At) fits its frame
   without them (WALK-1007b-live L13, L14, L25: 1057 = 1057) and is drawn as prod draws it: its End Date at the cells'
   own size beside the Amount, on one line at 1440 (the narrowest grid 841 px on the editorial skin and 832 px on the
   photo skin, with the widest dates and an over-long address), and free to fold inside the scrolling frame at 390. */
[b-rkdvorm2ne] .sponsors-table.with-club-columns .end-date {
    white-space: nowrap;
    font-size: 0.875rem;
}

[b-rkdvorm2ne] .sponsors-table.with-club-columns .sold-at,
[b-rkdvorm2ne] .sponsors-table.with-club-columns .shown-at {
    font-size: 0.875rem;
}

/* Action Buttons */
.action-buttons[b-rkdvorm2ne] {
    display: flex;
    gap: 0.5rem;
}

.action-btn[b-rkdvorm2ne] {
    width: 32px;
    height: 32px;
    border: none;
    background: var(--river-pearl);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.action-btn:hover[b-rkdvorm2ne] {
    background: #000000;
    color: #ffffff;
}

.action-btn.view:hover[b-rkdvorm2ne] {
    background: var(--wilson-blue);
}

.action-btn.cancel:hover[b-rkdvorm2ne] {
    background: #dc2626;
}

/* ============================================
   Loading State
   ============================================ */

.loading-container[b-rkdvorm2ne] {
    text-align: center;
    padding: 4rem;
}

.loading-text[b-rkdvorm2ne] {
    color: #666;
}

/* ============================================
   Messages
   ============================================ */

.message-container[b-rkdvorm2ne] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
}

.message-content[b-rkdvorm2ne] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    font-weight: 500;
}

.message-content.success[b-rkdvorm2ne] {
    background: var(--cedar-green);
    color: #ffffff;
}

.message-content.error[b-rkdvorm2ne] {
    background: #dc2626;
    color: #ffffff;
}

/* ============================================
   Dialog
   ============================================ */

.dialog-overlay[b-rkdvorm2ne] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
}

.dialog-content[b-rkdvorm2ne] {
    background: #ffffff;
    padding: 2rem;
    max-width: 500px;
    width: 90%;
}

.dialog-title[b-rkdvorm2ne] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem 0;
}

.dialog-message[b-rkdvorm2ne] {
    color: #666;
    line-height: 1.6;
    margin: 0 0 1.5rem 0;
}

.form-group[b-rkdvorm2ne] {
    margin-bottom: 1.5rem;
}

.form-group label[b-rkdvorm2ne] {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 0.5rem;
}

.form-group textarea[b-rkdvorm2ne] {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 0.95rem;
    resize: vertical;
}

.form-group textarea:focus[b-rkdvorm2ne] {
    outline: none;
    border-color: var(--cedar-green);
}

.dialog-actions[b-rkdvorm2ne] {
    display: flex;
    gap: 1rem;
}

.dialog-btn[b-rkdvorm2ne] {
    flex: 1;
    padding: 0.875rem 1.5rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.dialog-btn.secondary[b-rkdvorm2ne] {
    background: var(--river-pearl);
    color: #333;
}

.dialog-btn.secondary:hover[b-rkdvorm2ne] {
    background: #e5e5e0;
}

.dialog-btn.danger[b-rkdvorm2ne] {
    background: #dc2626;
    color: #ffffff;
}

.dialog-btn.danger:hover[b-rkdvorm2ne] {
    background: #b91c1c;
}

.dialog-btn:disabled[b-rkdvorm2ne] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1024px) {
    .stats-grid[b-rkdvorm2ne] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    /* Two tiles a row, each free to be narrower than its longest word (#8549, WALK-1010-wave3 a1). The tracks were
       "1fr 1fr", and a bare 1fr track is never narrower than its widest word: once #8183 renamed "Annual Revenue"
       to "List Price of Active Sponsorships", the second column was as wide as "SPONSORSHIPS" and its padding (153 px
       on the editorial skin, 174 px on the photo skin, whose Montserrat is wider), and the page ran to 362 px at 344
       on the editorial skin and to 398 px at 390 and 399 px at 344 on the photo skin. */
    .stats-grid[b-rkdvorm2ne] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filters-row[b-rkdvorm2ne] {
        flex-direction: column;
        gap: 1rem;
    }

    .filter-group[b-rkdvorm2ne] {
        width: 100%;
    }

    .filter-group select[b-rkdvorm2ne],
    .filter-group input[b-rkdvorm2ne] {
        width: 100%;
    }

    .action-buttons[b-rkdvorm2ne] {
        flex-direction: column;
    }
}

/* On a phone the tiles take the room the section's side padding had (#8549). Between the 4rem sides, the 1.5rem gap
   and a tile's own 1.5rem sides, a 344 px screen left a label 46 px, and "SPONSORSHIPS" is 103 px on the editorial
   skin and 124 px on the photo skin. With these, a label has 132 px at 344 and 155 px at 390, so the relabeled tile
   reads "List Price of / Active / Sponsorships" on whole words on both skins and the page is as wide as the screen
   (measured in headless Chrome, real fonts: 344 = 344 and 390 = 390 on both). From 521 px up the wider spacing above
   already leaves the word room. */
@media (max-width: 520px) {
    .stats-section[b-rkdvorm2ne] {
        padding: 1.5rem 1rem;
    }

    .stats-grid[b-rkdvorm2ne] {
        gap: 0.75rem;
    }

    .stat-card[b-rkdvorm2ne] {
        padding: 1rem 0.5rem;
    }
}
/* /Components/Pages/Admin/NameAndPhotoConsent.razor.rz.scp.css */
/* The publishers' name-and-photo check (#8178). Every color is a token; nothing is wider than the
   page, so it never scrolls sideways at 344px. */
.admin-form-page[b-8eerzgjsd5] { background: var(--color-surface); }
.admin-content[b-8eerzgjsd5] { max-width: 1300px; margin: 0 auto; }
.check-page[b-8eerzgjsd5] { max-width: 760px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.check-note[b-8eerzgjsd5] {
    font-size: 0.9rem; color: var(--color-text); background: var(--cedar-green-tint);
    border-left: 3px solid var(--cedar-green); border-radius: 0.25rem; padding: 0.6rem 0.9rem; margin: 0 0 1rem 0;
}

.toolbar[b-8eerzgjsd5] { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin: 0 0 1rem 0; }
.toolbar input[type="search"][b-8eerzgjsd5] { flex: 1 1 16rem; min-width: 0; }

.check-row[b-8eerzgjsd5] {
    display: flex; flex-direction: column; gap: 0.25rem;
    border: 1px solid var(--color-border); border-radius: 0.4rem; padding: 0.75rem 1rem;
    color: var(--color-text); overflow-wrap: anywhere;
}

@media (max-width: 480px) {
    .check-page[b-8eerzgjsd5] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/NccSchedule.razor.rz.scp.css */
.admin-form-page[b-qass06jwj9] { background: #ffffff; }
.admin-content[b-qass06jwj9] { max-width: 1300px; margin: 0 auto; }

.ncc-page[b-qass06jwj9] { max-width: 900px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.toolbar[b-qass06jwj9] { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 1.5rem; }
.show-toggle[b-qass06jwj9] { display: inline-flex; align-items: center; gap: 0.5rem; color: #374151; font-size: 0.9rem; }

.import-card[b-qass06jwj9] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-left: 4px solid #9ca3af;
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
    background: #fff;
}
.import-card.status-pendingreview[b-qass06jwj9] { border-left-color: var(--wheat-gold, #D4AF37); }
.import-card.status-applied[b-qass06jwj9] { border-left-color: var(--cedar-green, #2D5016); background: var(--cedar-green-tint); }
.import-card.status-rejected[b-qass06jwj9] { border-left-color: #9ca3af; opacity: 0.75; }
.import-card.status-failed[b-qass06jwj9] { border-left-color: #b42323; background: #fdf1f1; }

.import-head[b-qass06jwj9] { margin-bottom: 0.75rem; }
.week[b-qass06jwj9] { font-weight: 700; font-size: 1.15rem; color: #111; margin-right: 0.75rem; }
.status-chip[b-qass06jwj9] {
    font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em;
    padding: 0.15rem 0.5rem; border-radius: 999px; background: rgba(0,0,0,0.08); color: #374151;
}
.meta[b-qass06jwj9] { font-size: 0.8rem; color: #6b7280; margin-top: 0.25rem; }
.parse-error[b-qass06jwj9] { color: #b42323; font-size: 0.9rem; margin: 0.5rem 0; }

table.events[b-qass06jwj9] { width: 100%; border-collapse: collapse; margin: 0.75rem 0; }
table.events th[b-qass06jwj9], table.events td[b-qass06jwj9] {
    text-align: left; padding: 0.4rem 0.6rem; border-bottom: 1px solid #eee; font-size: 0.9rem;
}
table.events th[b-qass06jwj9] { color: #6b7280; text-transform: uppercase; font-size: 0.7rem; letter-spacing: 0.04em; }

.actions[b-qass06jwj9] { display: flex; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; }
.applied-note[b-qass06jwj9] { color: var(--cedar-green, #2D5016); font-weight: 600; margin: 0.5rem 0 0; }
.rejected-note[b-qass06jwj9] { color: #6b7280; font-weight: 600; margin: 0.5rem 0 0; }
/* /Components/Pages/Admin/News.razor.rz.scp.css */
/* ============================================
   Admin News - Editorial Design
   Flat, Integrated, Black Hero
   ============================================ */

.admin-news-page[b-w4dwrj7kxe] {
    background: #ffffff;
}

/* ============================================
   Action Bar
   ============================================ */

.action-bar[b-w4dwrj7kxe] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.action-bar-content[b-w4dwrj7kxe] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
}

.stats-info[b-w4dwrj7kxe] {
    display: flex;
    gap: 2rem;
}

.stat-item[b-w4dwrj7kxe] {
    font-size: 0.875rem;
    color: #6b7280;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.stat-item strong[b-w4dwrj7kxe] {
    color: var(--cedar-green);
    font-weight: 700;
    margin-right: 0.25rem;
}

/* ============================================
   Filters Section
   ============================================ */

.filters-section[b-w4dwrj7kxe] {
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filters-content[b-w4dwrj7kxe] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    gap: 1.5rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-group[b-w4dwrj7kxe] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.filter-group label[b-w4dwrj7kxe] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
}

.search-input[b-w4dwrj7kxe],
.filter-select[b-w4dwrj7kxe] {
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    font-family: var(--font-sans);
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-input[b-w4dwrj7kxe] {
    min-width: 280px;
}

.filter-select[b-w4dwrj7kxe] {
    min-width: 150px;
}

.search-input:focus[b-w4dwrj7kxe],
.filter-select:focus[b-w4dwrj7kxe] {
    outline: none;
    border-color: var(--cedar-green);
}

.clear-filters-btn[b-w4dwrj7kxe] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background: transparent;
    border: 1px solid rgba(0, 0, 0, 0.2);
    color: #6b7280;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.clear-filters-btn:hover[b-w4dwrj7kxe] {
    border-color: var(--cedar-green);
    color: var(--cedar-green);
}

/* ============================================
   Content Section
   ============================================ */

.admin-content[b-w4dwrj7kxe] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Table - Editorial Style
   ============================================ */

.table-container[b-w4dwrj7kxe] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.news-table[b-w4dwrj7kxe] {
    width: 100%;
    border-collapse: collapse;
}

.news-table thead[b-w4dwrj7kxe] {
    border-bottom: 2px solid #000000;
}

.news-table th[b-w4dwrj7kxe] {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
}

.news-table tbody tr[b-w4dwrj7kxe] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.news-table tbody tr:hover[b-w4dwrj7kxe] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.news-table tbody tr.removed-row[b-w4dwrj7kxe] {
    opacity: 0.5;
}

.news-table td[b-w4dwrj7kxe] {
    padding: 1rem;
    color: #374151;
    font-size: 0.9375rem;
    vertical-align: middle;
}

/* Article Cell */
.article-cell[b-w4dwrj7kxe] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    max-width: 400px;
}

.article-thumbnail[b-w4dwrj7kxe] {
    width: 60px;
    height: 60px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.article-info[b-w4dwrj7kxe] {
    min-width: 0;
}

.article-title[b-w4dwrj7kxe] {
    font-weight: 600;
    color: #000000;
    text-decoration: none;
    display: block;
    margin-bottom: 0.25rem;
    line-height: 1.4;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.article-title:hover[b-w4dwrj7kxe] {
    color: var(--cedar-green);
}

.article-summary[b-w4dwrj7kxe] {
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* ============================================
   Badges - Editorial Style
   ============================================ */

.source-badge[b-w4dwrj7kxe] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(0, 0, 0, 0.05);
    color: #6b7280;
}

.source-badge.source-chessbase[b-w4dwrj7kxe] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.source-badge.source-lichess[b-w4dwrj7kxe] {
    background: rgba(0, 0, 0, 0.1);
    color: #000000;
}

.source-badge.source-chesscom[b-w4dwrj7kxe] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.source-badge.source-uschess[b-w4dwrj7kxe] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.source-badge.source-fide[b-w4dwrj7kxe] {
    background: rgba(var(--tobacco-barn-red-rgb), 0.15);
    color: var(--tobacco-barn-red);
}

.priority-badge[b-w4dwrj7kxe] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    min-width: 24px;
}

.priority-badge.priority-critical[b-w4dwrj7kxe] {
    background: #ef4444;
    color: #ffffff;
}

.priority-badge.priority-high[b-w4dwrj7kxe] {
    background: rgba(234, 88, 12, 0.2);
    color: #ea580c;
}

.priority-badge.priority-medium[b-w4dwrj7kxe] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.priority-badge.priority-low[b-w4dwrj7kxe] {
    background: rgba(0, 0, 0, 0.05);
    color: #6b7280;
}

.status-badges[b-w4dwrj7kxe] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.status-badge[b-w4dwrj7kxe] {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    font-family: var(--font-display);
    font-size: 0.625rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.status-badge.approved[b-w4dwrj7kxe] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.status-badge.unapproved[b-w4dwrj7kxe] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    color: #92400e;
}

.status-badge.featured[b-w4dwrj7kxe] {
    background: var(--wheat-gold);
    color: #000000;
}

.status-badge.removed[b-w4dwrj7kxe] {
    background: rgba(239, 68, 68, 0.15);
    color: #dc2626;
}

/* ============================================
   Actions Cell
   ============================================ */

.actions-cell[b-w4dwrj7kxe] {
    display: flex;
    gap: 0.5rem;
    white-space: nowrap;
}

.removed-text[b-w4dwrj7kxe] {
    font-size: 0.8125rem;
    color: #9ca3af;
    font-style: italic;
}

.date-cell[b-w4dwrj7kxe] {
    white-space: nowrap;
}

/* ============================================
   Results Info
   ============================================ */

.results-info[b-w4dwrj7kxe] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.875rem;
    color: #9ca3af;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1200px) {
    .table-container[b-w4dwrj7kxe] {
        overflow-x: auto;
    }

    .news-table[b-w4dwrj7kxe] {
        min-width: 1000px;
    }
}

@media (max-width: 768px) {
    .action-bar-content[b-w4dwrj7kxe] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        gap: 1rem;
    }

    .stats-info[b-w4dwrj7kxe] {
        gap: 1rem;
        flex-wrap: wrap;
        justify-content: center;
    }

    .filters-content[b-w4dwrj7kxe] {
        flex-direction: column;
        padding: 1.5rem 2rem;
        align-items: stretch;
    }

    .filter-group[b-w4dwrj7kxe] {
        width: 100%;
    }

    .search-input[b-w4dwrj7kxe],
    .filter-select[b-w4dwrj7kxe] {
        width: 100%;
        min-width: auto;
    }

    .clear-filters-btn[b-w4dwrj7kxe] {
        width: 100%;
        justify-content: center;
    }

    .admin-content[b-w4dwrj7kxe] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .action-bar-content[b-w4dwrj7kxe] {
        padding: 1rem 1.5rem;
    }

    .filters-content[b-w4dwrj7kxe] {
        padding: 1rem 1.5rem;
    }

    .admin-content[b-w4dwrj7kxe] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Admin/OrganizationContentEditor.razor.rz.scp.css */
/* The organization's content page (#8174, #8175). Every color is a token, so the page is painted in the
   club's own palette, and nothing here is wider than a phone. The shapes follow the club content
   editor's (#8169), so the two editors read as one tool. */

.orgcontent-messages:not(:empty)[b-bbdxe3k5jn] {
    margin-bottom: 1rem;
}

.orgcontent-rule[b-bbdxe3k5jn],
.orgcontent-note[b-bbdxe3k5jn] {
    margin: 0 0 1rem;
    padding: 0.6rem 0.75rem;
    font-size: var(--font-size-sm);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--accent-text-small);
    border-radius: 0.375rem;
    overflow-wrap: anywhere;
}

.orgcontent-actions[b-bbdxe3k5jn] {
    margin-bottom: 1rem;
}

[b-bbdxe3k5jn] .orgcontent-group {
    margin-bottom: 1.25rem;
}

.orgcontent-group-title[b-bbdxe3k5jn] {
    margin: 0;
    padding: 0.75rem 1rem 0.25rem;
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--color-text);
}

.orgcontent-group-hint[b-bbdxe3k5jn] {
    margin: 0;
    padding: 0 1rem 0.75rem;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    border-bottom: 1px solid var(--color-border);
}

.orgcontent-links[b-bbdxe3k5jn] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.orgcontent-link[b-bbdxe3k5jn] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--color-border);
    min-width: 0;
}

.orgcontent-link:last-child[b-bbdxe3k5jn] {
    border-bottom: none;
}

.orgcontent-link-text[b-bbdxe3k5jn] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.orgcontent-link-name[b-bbdxe3k5jn] {
    font-weight: 600;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.orgcontent-link-hidden .orgcontent-link-name[b-bbdxe3k5jn] {
    color: var(--color-text-secondary);
}

.orgcontent-answer[b-bbdxe3k5jn] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.orgcontent-link-url[b-bbdxe3k5jn],
.orgcontent-link-note[b-bbdxe3k5jn] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    overflow-wrap: anywhere;
}

.orgcontent-status[b-bbdxe3k5jn] {
    align-self: flex-start;
    padding: 0.1rem 0.5rem;
    font-size: var(--font-size-sm);
    font-weight: 600;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    color: var(--color-text);
}

.orgcontent-status.is-shown[b-bbdxe3k5jn] {
    border-style: solid;
}

.orgcontent-status.is-hidden[b-bbdxe3k5jn],
.orgcontent-status.is-own-site[b-bbdxe3k5jn] {
    border-style: dashed;
    color: var(--color-text-secondary);
}

.orgcontent-buttons[b-bbdxe3k5jn],
.orgcontent-confirm[b-bbdxe3k5jn] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.orgcontent-confirm span[b-bbdxe3k5jn] {
    font-size: var(--font-size-sm);
    color: var(--color-text);
}

/* The add-or-edit form. */
.orgcontent-fields[b-bbdxe3k5jn] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

.orgcontent-field[b-bbdxe3k5jn] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.orgcontent-label[b-bbdxe3k5jn] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.orgcontent-hint[b-bbdxe3k5jn] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.orgcontent-input[b-bbdxe3k5jn] {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

textarea.orgcontent-input[b-bbdxe3k5jn] {
    min-height: 5rem;
    resize: vertical;
}

.orgcontent-input:focus-visible[b-bbdxe3k5jn],
.orgcontent-check input:focus-visible[b-bbdxe3k5jn] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.orgcontent-check[b-bbdxe3k5jn] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-base);
    color: var(--color-text);
    cursor: pointer;
}

.orgcontent-check input[b-bbdxe3k5jn] {
    width: 1.25rem;
    height: 1.25rem;
}
/* /Components/Pages/Admin/OrganizationFinanceReport.razor.rz.scp.css */
/* The organization's finance report (#8183). Every color is a token; each grid scrolls inside its own
   ScrollRegion, so the page never scrolls sideways at 344px. */
.admin-form-page[b-87ojl3ikjz] { background: var(--color-surface); }
.admin-content[b-87ojl3ikjz] { max-width: 1200px; margin: 0 auto; }
.report-page[b-87ojl3ikjz] { padding: 2.5rem 1.5rem 5rem; }

.period[b-87ojl3ikjz] { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem 1rem; margin: 0 0 1.5rem 0; }
.period-field[b-87ojl3ikjz] { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; }
.period-field label[b-87ojl3ikjz] { font-size: 0.8rem; font-weight: 600; color: var(--color-text-secondary); text-transform: uppercase; letter-spacing: 0.04em; }
.period-select[b-87ojl3ikjz] {
    padding: 0.5rem 0.6rem; border: 1px solid var(--color-border); border-radius: 0.4rem;
    font-size: 1rem; background: var(--color-surface); color: var(--color-text); max-width: 100%;
}
.period-select:focus[b-87ojl3ikjz] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12); }

.period-title[b-87ojl3ikjz] { font-size: 1.35rem; margin: 0 0 0.5rem 0; color: var(--color-text); overflow-wrap: anywhere; }
h2[b-87ojl3ikjz] { font-size: 1.15rem; margin: 2rem 0 0.5rem 0; color: var(--color-text); overflow-wrap: anywhere; }
.issues-title[b-87ojl3ikjz] { font-size: 1rem; margin: 1.5rem 0 0.5rem 0; color: var(--color-text); }

.report-note[b-87ojl3ikjz] { font-size: 0.9rem; color: var(--color-text-secondary); margin: 0 0 1rem 0; max-width: 60rem; }

.totals[b-87ojl3ikjz] { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(9rem, 100%), 1fr)); gap: 0.75rem; margin: 1rem 0 0 0; }
.total[b-87ojl3ikjz] { border: 1px solid var(--color-border); border-radius: 0.4rem; padding: 0.75rem 1rem; background: var(--color-surface); min-width: 0; }
.total dt[b-87ojl3ikjz] { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-secondary); }
.total dd[b-87ojl3ikjz] { margin: 0.25rem 0 0 0; font-size: 1.35rem; font-weight: 700; color: var(--color-text); overflow-wrap: anywhere; }
.total-net[b-87ojl3ikjz] { border-color: var(--cedar-green); background: var(--cedar-green-tint); }

[b-87ojl3ikjz] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-87ojl3ikjz] th, [b-87ojl3ikjz] td { text-align: left; padding: 0.55rem 0.8rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-87ojl3ikjz] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }
[b-87ojl3ikjz] td.col-justify-end, [b-87ojl3ikjz] th.col-justify-end { text-align: right; }
[b-87ojl3ikjz] tr.row-club-total td { font-weight: 700; }
[b-87ojl3ikjz] tr.row-organization td { background: var(--cedar-green-tint); }
[b-87ojl3ikjz] tr.row-organization-total td { font-weight: 700; background: var(--cedar-green-tint); border-top: 2px solid var(--cedar-green); }

.nowrap[b-87ojl3ikjz] { white-space: nowrap; }
.processor-id[b-87ojl3ikjz] { font-family: var(--font-mono, ui-monospace, monospace); font-size: 0.8rem; color: var(--color-text); word-break: break-all; }

.status[b-87ojl3ikjz] {
    display: inline-block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; color: var(--status-ink); background: var(--status-neutral); white-space: nowrap;
}
.status-completed[b-87ojl3ikjz] { background: var(--status-success); }
.status-refunded[b-87ojl3ikjz] { background: var(--status-warning); }
.status-pending[b-87ojl3ikjz] { background: var(--status-neutral); }
.status-failed[b-87ojl3ikjz], .status-cancelled[b-87ojl3ikjz] { background: var(--status-danger); }

.issues[b-87ojl3ikjz] { list-style: none; padding: 0; margin: 0 0 1rem 0; display: flex; flex-direction: column; gap: 0.6rem; }
.issue[b-87ojl3ikjz] {
    border-left: 3px solid var(--wheat-gold); background: var(--cedar-green-tint); border-radius: 0.25rem;
    padding: 0.6rem 0.9rem; color: var(--color-text); font-size: 0.9rem;
}
.issue-text[b-87ojl3ikjz] { display: block; }
.issue-references[b-87ojl3ikjz] { display: block; margin-top: 0.3rem; font-size: 0.8rem; color: var(--color-text-secondary); word-break: break-all; }

@media (max-width: 480px) {
    .report-page[b-87ojl3ikjz] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/OrganizationIdentity.razor.rz.scp.css */
/* The organization identity admin (#8146). Every color is a token, so the page wears the club's
   own palette like the branding and partners admins beside it. */

.organization-fields[b-izi0s7edik] {
    display: grid;
    /* min() keeps the floor from being wider than a phone; see CssResponsivenessTests. */
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1rem;
}

.organization-field[b-izi0s7edik] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.organization-field-wide[b-izi0s7edik] {
    grid-column: 1 / -1;
}

.organization-label[b-izi0s7edik] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.organization-input[b-izi0s7edik] {
    width: 100%;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.organization-input:focus-visible[b-izi0s7edik] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.organization-hint[b-izi0s7edik] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.organization-hint-spaced[b-izi0s7edik] {
    margin-top: 1.25rem;
}

/* What the footer will say, set off from the fields above it. The text is shown exactly as it
   will print: no text-transform, so a legal name in capitals previews in capitals. */
.organization-preview[b-izi0s7edik] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--color-border);
}

.organization-preview-text[b-izi0s7edik] {
    margin: 0;
    color: var(--color-text);
    line-height: 1.6;
}

.organization-preview-text[b-izi0s7edik]  a {
    color: var(--accent-text-small);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}
/* /Components/Pages/Admin/OrganizationMembershipReport.razor.rz.scp.css */
/* The organization's membership report (#8183). Every color is a token; each grid scrolls inside its own
   ScrollRegion, so the page never scrolls sideways at 344px. */
.admin-form-page[b-p0og004hz0] { background: var(--color-surface); }
.admin-content[b-p0og004hz0] { max-width: 1200px; margin: 0 auto; }
.report-page[b-p0og004hz0] { padding: 2.5rem 1.5rem 5rem; }

.as-of[b-p0og004hz0] { font-size: 1rem; font-weight: 600; color: var(--color-text); margin: 0 0 0.5rem 0; overflow-wrap: anywhere; }
h2[b-p0og004hz0] { font-size: 1.15rem; margin: 2rem 0 0.5rem 0; color: var(--color-text); overflow-wrap: anywhere; }
.report-note[b-p0og004hz0] { font-size: 0.9rem; color: var(--color-text-secondary); margin: 0 0 1rem 0; max-width: 60rem; }

[b-p0og004hz0] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-p0og004hz0] th, [b-p0og004hz0] td { text-align: left; padding: 0.55rem 0.8rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-p0og004hz0] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }
[b-p0og004hz0] td.col-justify-end, [b-p0og004hz0] th.col-justify-end { text-align: right; }
[b-p0og004hz0] tr.row-total td { font-weight: 700; background: var(--cedar-green-tint); border-top: 2px solid var(--cedar-green); }

@media (max-width: 480px) {
    .report-page[b-p0og004hz0] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/OrganizationRatingsBoard.razor.rz.scp.css */
/* The organization's ratings board switch (#8170, #8177). Every color is a token, so the page wears
   the club's own palette like the other admin pages. */

.ratings-switch-state[b-e024ae2ge3] {
    margin: 0 0 1rem;
    font-weight: 600;
    color: var(--color-text);
}
/* /Components/Pages/Admin/OrganizationSettingsAdmin.razor.rz.scp.css */
/* The organization settings admin (#8172). Every color is a token, so the page wears the club's own
   palette like the organization identity and branding admins beside it. */

.settings-group-title[b-90od77auut] {
    margin: 0 0 1rem;
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
    color: var(--color-text);
}

.settings-fields[b-90od77auut] {
    display: grid;
    /* min() keeps the floor from being wider than a phone; see CssResponsivenessTests. */
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1.25rem;
}

.settings-field[b-90od77auut] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.settings-label[b-90od77auut] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.settings-input[b-90od77auut] {
    width: 100%;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.settings-input:focus-visible[b-90od77auut] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.settings-hint[b-90od77auut] {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

/* What the clubs read right now, and from where: the line an administrator checks after a save. */
.settings-in-use[b-90od77auut] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.settings-save[b-90od77auut] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 1rem;
    max-width: 40rem;
}

.settings-override-row[b-90od77auut] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.settings-override-row .settings-input[b-90od77auut] {
    flex: 1 1 16rem;
    width: auto;
}

.settings-club-list[b-90od77auut] {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.settings-club[b-90od77auut] {
    margin: 0.15rem 0;
}

.settings-club-name[b-90od77auut] {
    font-weight: 600;
    color: var(--color-text);
}

/* A group's per-club fields, one under another: each has its own save and its list of clubs. */
.settings-overrides[b-90od77auut] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* A per-club save's sentence, drawn under its field's Save and, once said, scrolled into view (#8172 wave-2 walk b1), in
   a polite live region that is in the field from the page's first render (review findings 1 and 4). It keeps to the
   field's width at 344 px. Empty, the region is taken out of the flow, so it takes no place in the field - as a flex
   item it would add the field's gap under every Save - and it stays in the accessibility tree, as it must to be heard:
   display: none would take it out, and a region that appears with its text already in it is not announced
   (SuccessMessage.razor.css does the same). With a sentence it is an ordinary block again. */
.settings-override-message[b-90od77auut] {
    min-width: 0;
}

.settings-override-message:empty[b-90od77auut] {
    position: absolute;
}

/* Inside the field both cards keep the same quarter rem above and below (#8172 wave-2 walk review, finding 2): the
   refusal's card was 1rem above and below, the success's 0 and 1.5rem. Neither card takes focus (review round 2: its
   region says it, and focus goes back to the Save), so neither draws a focus ring of its own. */
.settings-override-message[b-90od77auut]  .error-message,
.settings-override-message[b-90od77auut]  .success-message {
    margin: 0.25rem 0;
}
/* /Components/Pages/Admin/OrganizationTournamentsAdmin.razor.rz.scp.css */
.admin-form-page[b-cue5d7uf5k] { background: var(--color-surface); }
.admin-content[b-cue5d7uf5k] { max-width: 1400px; margin: 0 auto; }
.tournaments-page[b-cue5d7uf5k] { padding: 2.5rem 1.5rem 5rem; }

.count[b-cue5d7uf5k] { margin: 0 0 1rem; font-size: 0.85rem; color: var(--color-text-secondary); }

.grid-wrap[b-cue5d7uf5k] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-cue5d7uf5k] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-cue5d7uf5k] th, [b-cue5d7uf5k] td { text-align: left; padding: 0.6rem 0.8rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-cue5d7uf5k] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.title[b-cue5d7uf5k] { display: block; font-weight: 600; color: var(--cedar-green); text-decoration: none; }
.title:hover[b-cue5d7uf5k], .title:focus-visible[b-cue5d7uf5k] { text-decoration: underline; }
.when[b-cue5d7uf5k] { display: block; font-size: 0.8rem; color: var(--color-text-secondary); white-space: nowrap; }
.host[b-cue5d7uf5k] { color: var(--color-text); }
.number[b-cue5d7uf5k] { color: var(--color-text); white-space: nowrap; }

.state[b-cue5d7uf5k] { display: inline-block; margin-top: 0.3rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.15rem 0.55rem; border-radius: 999px; color: var(--status-ink); background: var(--status-warning); }

.control[b-cue5d7uf5k] { display: inline-flex; align-items: center; gap: 0.4rem; color: var(--cedar-green); font-weight: 600; text-decoration: none; white-space: nowrap; }
.control:hover[b-cue5d7uf5k], .control:focus-visible[b-cue5d7uf5k] { text-decoration: underline; }
.control-none[b-cue5d7uf5k] { font-size: 0.8rem; color: var(--color-text-secondary); white-space: nowrap; }

@media (max-width: 480px) {
    .tournaments-page[b-cue5d7uf5k] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/Admin/PartnerBenefits.razor.rz.scp.css */
/* The organization's partners admin (#7827). Every colour is a token, so the page wears the
   club's own palette like the branding admin beside it. */

.partners-list[b-8qfkoowdaa] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.partners-fields[b-8qfkoowdaa] {
    display: grid;
    /* min() keeps the floor from being wider than a phone; see CssResponsivenessTests. */
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1rem;
}

.partners-field[b-8qfkoowdaa] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.partners-field-wide[b-8qfkoowdaa] {
    grid-column: 1 / -1;
}

.partners-label[b-8qfkoowdaa] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.partners-input[b-8qfkoowdaa] {
    width: 100%;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.partners-input:focus-visible[b-8qfkoowdaa] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.partners-textarea[b-8qfkoowdaa] {
    min-height: 7rem;
    resize: vertical;
}

.partners-hint[b-8qfkoowdaa] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.partners-logo[b-8qfkoowdaa] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--color-border);
}

.partners-logo-preview[b-8qfkoowdaa] {
    display: block;
    width: 140px;
    max-width: 100%;
    height: auto;
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.partners-logo-actions[b-8qfkoowdaa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.partners-logo-actions[b-8qfkoowdaa]  input[type="file"] {
    max-width: 100%;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.partners-actions[b-8qfkoowdaa] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.partners-confirm[b-8qfkoowdaa] {
    font-weight: 600;
    color: var(--color-text);
}

.partners-add[b-8qfkoowdaa] {
    margin-top: 1.5rem;
}
/* /Components/Pages/Admin/PaymentProcessorSettings.razor.rz.scp.css */
.page-container[b-d3kx4y73st] {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.card[b-d3kx4y73st] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    margin-bottom: 1.5rem;
}

.card h2[b-d3kx4y73st] {
    margin: 0 0 1rem 0;
    font-size: 1.25rem;
}

.status-row[b-d3kx4y73st] {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    margin-bottom: 1rem;
}

.status-label[b-d3kx4y73st] {
    color: #6b7280;
    font-weight: 600;
}

.status-value[b-d3kx4y73st] {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.status-stripe[b-d3kx4y73st] {
    color: var(--cedar-green, #2D5016);
}

.status-square[b-d3kx4y73st] {
    color: #d97706;
}

.meta[b-d3kx4y73st] {
    color: #4b5563;
    font-size: 0.95rem;
    line-height: 1.7;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding-top: 1rem;
}

.meta div[b-d3kx4y73st] {
    margin: 0.25rem 0;
}

.warn[b-d3kx4y73st] {
    background: #fef3c7;
    border-left: 3px solid #d97706;
    padding: 0.75rem 1rem;
    font-size: 0.9rem;
    color: #78350f;
    margin-bottom: 1.5rem;
    line-height: 1.5;
}

.form-group[b-d3kx4y73st] {
    margin-bottom: 1.5rem;
}

.form-group label[b-d3kx4y73st] {
    display: block;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.toggle[b-d3kx4y73st] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.radio[b-d3kx4y73st] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 400;
    cursor: pointer;
}

[b-d3kx4y73st] input[type="text"],
[b-d3kx4y73st] input[type="password"] {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.95rem;
}

[b-d3kx4y73st] input[type="text"]:focus,
[b-d3kx4y73st] input[type="password"]:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

[b-d3kx4y73st] .validation-message {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

.error[b-d3kx4y73st] {
    background: #fee2e2;
    color: #991b1b;
    padding: 0.75rem 1rem;
    border-left: 3px solid #dc2626;
    margin-bottom: 1rem;
}

.success[b-d3kx4y73st] {
    background: #dcfce7;
    color: #166534;
    padding: 0.75rem 1rem;
    border-left: 3px solid #16a34a;
    margin-bottom: 1rem;
}

.loading[b-d3kx4y73st] {
    text-align: center;
    color: #6b7280;
    padding: 2rem;
}

.hint[b-d3kx4y73st] {
    color: #4b5563;
    font-size: 0.95rem;
    line-height: 1.5;
    margin: 0 0 1.5rem 0;
}

.status-list[b-d3kx4y73st] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.4rem 1.5rem;
    margin: 0 0 1.5rem 0;
    font-size: 0.95rem;
}

.status-list dt[b-d3kx4y73st] {
    color: #6b7280;
    font-weight: 600;
}

.status-list dd[b-d3kx4y73st] {
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
}

.link-button[b-d3kx4y73st] {
    background: none;
    border: none;
    padding: 0;
    color: #b91c1c;
    font-size: 0.875rem;
    cursor: pointer;
    text-decoration: underline;
}

.link-button:disabled[b-d3kx4y73st] {
    color: #9ca3af;
    cursor: default;
}

.actions[b-d3kx4y73st] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.probe[b-d3kx4y73st] {
    margin-top: 1rem;
}

.webhook-help[b-d3kx4y73st] {
    margin-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding-top: 1rem;
    color: #4b5563;
    font-size: 0.9rem;
    line-height: 1.5;
}

.webhook-help code[b-d3kx4y73st] {
    display: block;
    overflow-x: auto;
    padding: 0.5rem 0.75rem;
    background: #f3f4f6;
    border-radius: 0.375rem;
    font-size: 0.85rem;
    margin: 0.5rem 0;
}

.reader-registration[b-d3kx4y73st] {
    margin-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    padding-top: 1rem;
}

.reader-registration h3[b-d3kx4y73st] {
    margin: 0 0 0.5rem 0;
    font-size: 1.05rem;
}

/* The retired Square option stays visible, so the console says why it cannot be chosen. */
.radio-retired[b-d3kx4y73st] {
    opacity: 0.6;
    cursor: not-allowed;
}
/* /Components/Pages/Admin/RatingsBoardSettings.razor.rz.scp.css */
/* The ratings board's off switches (#8170). Every color is a token, so the page wears the club's
   own palette like the other admin pages. */

.ratings-switch-state[b-7hnxr62wl6] {
    margin: 0 0 1rem;
    font-weight: 600;
    color: var(--color-text);
}

.ratings-switch-hint[b-7hnxr62wl6] {
    margin: 0;
    color: var(--color-text-secondary);
}
/* /Components/Pages/Admin/RecommendedReading.razor.rz.scp.css */
/* Admin: the club's recommended-reading list (#7574).
   Tokens only - every colour here is one a club can set, so the page takes each club's own
   skin rather than one club's palette. The page shell (PageHero, PageSection, ContentCard,
   Button, EmptyState) owns everything it already styles; these rules only cover the markup
   this page adds. */

.list-summary[b-48h8le1qgo] {
    margin: 0 0 var(--spacing-lg);
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
}

.inline-link[b-48h8le1qgo] {
    color: var(--color-text);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: var(--accent-rule);
    text-underline-offset: 0.15em;
}

.inline-link:hover[b-48h8le1qgo] {
    color: var(--cedar-green-light);
}

.section-heading[b-48h8le1qgo] {
    margin: var(--spacing-xl) 0 var(--spacing-md);
    font-family: var(--font-display);
    font-size: var(--font-size-xl);
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--color-text);
    border-bottom: 2px solid var(--accent-rule);
    padding-bottom: var(--spacing-xs);
}

.section-heading:first-of-type[b-48h8le1qgo] {
    margin-top: 0;
}

.recommendation-grid[b-48h8le1qgo] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: var(--spacing-lg);
}

.recommendation-body[b-48h8le1qgo] {
    display: flex;
    gap: var(--spacing-md);
    align-items: flex-start;
}

.recommendation-cover[b-48h8le1qgo] {
    flex: 0 0 auto;
    width: 4.5rem;
    height: auto;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-sm);
}

.recommendation-text[b-48h8le1qgo] {
    flex: 1 1 auto;
    min-width: 0;
}

.recommendation-blurb[b-48h8le1qgo] {
    margin: 0 0 var(--spacing-sm);
    font-size: var(--font-size-sm);
    line-height: 1.55;
    color: var(--color-text-secondary);
}

.recommendation-facts[b-48h8le1qgo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xs) var(--spacing-sm);
    margin: 0;
}

.fact[b-48h8le1qgo] {
    font-size: var(--font-size-xs);
    color: var(--color-gray);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding: 0.1rem 0.45rem;
}

.recommendation-actions[b-48h8le1qgo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

.recommendation-note[b-48h8le1qgo] {
    margin: var(--spacing-sm) 0 0;
    font-size: var(--font-size-xs);
    line-height: 1.5;
    color: var(--color-gray);
}

.confirm-prompt[b-48h8le1qgo] {
    border-left: 3px solid var(--color-error);
    padding-left: var(--spacing-sm);
}

.confirm-question[b-48h8le1qgo] {
    margin: 0 0 var(--spacing-sm);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.confirm-actions[b-48h8le1qgo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}

/* ---- The edit form ---- */

.edit-form[b-48h8le1qgo] {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--spacing-lg);
    box-shadow: var(--shadow-sm);
}

.form-row[b-48h8le1qgo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.form-field[b-48h8le1qgo] {
    flex: 1 1 12rem;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.form-field-wide[b-48h8le1qgo] {
    flex-basis: 100%;
}

.field-label[b-48h8le1qgo] {
    margin-bottom: var(--spacing-xs);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.field-input[b-48h8le1qgo],
.field-select[b-48h8le1qgo],
.field-textarea[b-48h8le1qgo] {
    width: 100%;
    padding: 0.5rem 0.65rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-white);
    border: 1px solid var(--color-gray-light);
    border-radius: var(--radius-sm);
}

.field-textarea[b-48h8le1qgo] {
    resize: vertical;
    line-height: 1.5;
}

.field-input:focus[b-48h8le1qgo],
.field-select:focus[b-48h8le1qgo],
.field-textarea:focus[b-48h8le1qgo] {
    outline: 2px solid var(--color-text);
    outline-offset: 1px;
}

.field-hint[b-48h8le1qgo] {
    margin: var(--spacing-xs) 0 0;
    font-size: var(--font-size-xs);
    line-height: 1.5;
    color: var(--color-gray);
}

.field-checkbox[b-48h8le1qgo] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
    cursor: pointer;
}

.form-actions[b-48h8le1qgo] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    margin-top: var(--spacing-lg);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-border);
}

@media (max-width: 640px) {
    .recommendation-body[b-48h8le1qgo] {
        flex-direction: column;
    }

    .recommendation-cover[b-48h8le1qgo] {
        width: 3.5rem;
    }

    .form-field[b-48h8le1qgo] {
        flex-basis: 100%;
    }
}
/* /Components/Pages/Admin/SponsorDetails.razor.rz.scp.css */
/* ============================================
   Admin Sponsor Details Page
   ============================================ */

.sponsor-details-page[b-p0dguslo8y] {
    background: #ffffff;
    min-height: 100vh;
}

/* ============================================
   Status Banner
   ============================================ */

.status-banner[b-p0dguslo8y] {
    padding: 1.5rem 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.status-banner.status-active[b-p0dguslo8y] {
    background: rgba(34, 197, 94, 0.1);
}

.status-banner.status-pending[b-p0dguslo8y] {
    background: rgba(234, 179, 8, 0.1);
}

.status-banner.status-expired[b-p0dguslo8y] {
    background: rgba(239, 68, 68, 0.1);
}

.status-banner.status-cancelled[b-p0dguslo8y] {
    background: rgba(0, 0, 0, 0.05);
}

/* #8163: a full refund sets the sponsor Refunded; the same tint ManageSponsors gives its badge. */
.status-banner.status-refunded[b-p0dguslo8y] {
    background: rgba(168, 85, 247, 0.1);
}

.status-info[b-p0dguslo8y] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.tier-badge[b-p0dguslo8y] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
}

.status-badge[b-p0dguslo8y] {
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: rgba(0, 0, 0, 0.1);
}

.date-info[b-p0dguslo8y] {
    font-size: 0.875rem;
    color: #666;
}

.date-info .separator[b-p0dguslo8y] {
    margin: 0 0.5rem;
}

.date-info .expired[b-p0dguslo8y] {
    color: #dc2626;
    font-weight: 600;
}

/* ============================================
   Content Grid
   ============================================ */

.details-content[b-p0dguslo8y] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem;
}

.details-grid[b-p0dguslo8y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
}

/* ============================================
   Detail Cards
   ============================================ */

.detail-card[b-p0dguslo8y] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    margin-bottom: 2rem;
}

.card-title[b-p0dguslo8y] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--wheat-gold);
}

/* Logo Section */
.logo-section[b-p0dguslo8y] {
    text-align: center;
}

.sponsor-logo[b-p0dguslo8y] {
    max-width: 200px;
    max-height: 200px;
    object-fit: contain;
    margin-bottom: 1.5rem;
}

.logo-placeholder[b-p0dguslo8y] {
    width: 200px;
    height: 200px;
    margin: 0 auto 1.5rem;
    background: var(--river-pearl);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #999;
    gap: 0.5rem;
}

.logo-placeholder i[b-p0dguslo8y] {
    font-size: 3rem;
}

.logo-actions[b-p0dguslo8y] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.file-input[b-p0dguslo8y] {
    display: none;
}

.upload-btn[b-p0dguslo8y] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    background: var(--cedar-green);
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.upload-btn:hover[b-p0dguslo8y] {
    background: #1e3a0f;
}

.upload-status[b-p0dguslo8y] {
    font-size: 0.875rem;
    color: var(--wheat-gold);
    font-style: italic;
}

/* Info Grid */
.info-grid[b-p0dguslo8y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.info-item[b-p0dguslo8y] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.info-item.full-width[b-p0dguslo8y] {
    grid-column: span 2;
}

.info-item label[b-p0dguslo8y] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #666;
}

.info-item span[b-p0dguslo8y],
.info-item a[b-p0dguslo8y] {
    font-size: 0.95rem;
    color: #333;
}

.info-item a[b-p0dguslo8y] {
    color: var(--cedar-green);
    text-decoration: none;
}

.info-item a:hover[b-p0dguslo8y] {
    text-decoration: underline;
}

/* The muted-text token (#8445, WALK-1005f b2-8176): #999 on the white card was 2.84:1 under "Where the Logo
   Is Shown" and on "Not provided"; the token reads at 4.5:1 or better on every light ground, in both skins. */
.text-muted[b-p0dguslo8y] {
    color: var(--color-text-secondary);
    font-style: italic;
}

.amount[b-p0dguslo8y] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.mono[b-p0dguslo8y] {
    font-family: monospace;
    font-size: 0.85rem;
}

/* ============================================
   Edit Form
   ============================================ */

.edit-form[b-p0dguslo8y] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* The fieldset that disables a form for a viewer its command does not admit (#8445): no box of its own,
   so the form looks as it did. */
.edit-fieldset[b-p0dguslo8y] {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.view-only-note[b-p0dguslo8y] {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    color: var(--color-text-secondary);
}

.form-group[b-p0dguslo8y] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group label[b-p0dguslo8y] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.form-row[b-p0dguslo8y] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

[b-p0dguslo8y] input[type="text"],
[b-p0dguslo8y] input[type="email"],
[b-p0dguslo8y] input[type="url"],
[b-p0dguslo8y] input[type="number"],
[b-p0dguslo8y] textarea {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 0.95rem;
    background: #ffffff;
}

[b-p0dguslo8y] input:focus,
[b-p0dguslo8y] textarea:focus {
    outline: none;
    border-color: var(--cedar-green);
}

/* Where the logo is shown (#8176): the same field shape as the inputs above. */
.form-group select[b-p0dguslo8y] {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.2);
    font-size: 0.95rem;
    background: #ffffff;
    color: #333;
}

.form-group select:focus[b-p0dguslo8y] {
    outline: none;
    border-color: var(--cedar-green);
}

[b-p0dguslo8y] textarea {
    resize: vertical;
    min-height: 80px;
}

.checkbox-group[b-p0dguslo8y] {
    display: flex;
    align-items: center;
}

.checkbox-label[b-p0dguslo8y] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    cursor: pointer;
}

[b-p0dguslo8y] input[type="checkbox"] {
    width: 1.25rem;
    height: 1.25rem;
    accent-color: var(--cedar-green);
}

.form-actions[b-p0dguslo8y] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.save-btn[b-p0dguslo8y] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 2rem;
    background: var(--cedar-green);
    color: #ffffff;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.save-btn:hover:not(:disabled)[b-p0dguslo8y] {
    background: #1e3a0f;
}

.save-btn:disabled[b-p0dguslo8y] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================
   Error Container
   ============================================ */

.error-container[b-p0dguslo8y] {
    text-align: center;
    padding: 4rem;
}

.error-icon[b-p0dguslo8y] {
    font-size: 4rem;
    color: #dc2626;
    margin-bottom: 1.5rem;
}

.error-container h2[b-p0dguslo8y] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
}

.error-container p[b-p0dguslo8y] {
    color: #666;
    margin: 0 0 2rem 0;
}

.back-button[b-p0dguslo8y] {
    display: inline-block;
    padding: 0.875rem 2rem;
    background: #000000;
    color: #ffffff;
    text-decoration: none;
    font-family: var(--font-display);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.back-button:hover[b-p0dguslo8y] {
    background: var(--cedar-green);
}

/* ============================================
   Loading State
   ============================================ */

.loading-container[b-p0dguslo8y] {
    text-align: center;
    padding: 4rem;
}

.loading-text[b-p0dguslo8y] {
    color: #666;
}

/* ============================================
   Messages
   ============================================ */

.message-container[b-p0dguslo8y] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
}

.message-content[b-p0dguslo8y] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    font-weight: 500;
}

.message-content.success[b-p0dguslo8y] {
    background: var(--cedar-green);
    color: #ffffff;
}

.message-content.error[b-p0dguslo8y] {
    background: #dc2626;
    color: #ffffff;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1024px) {
    .details-grid[b-p0dguslo8y] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {

    .status-banner[b-p0dguslo8y] {
        padding: 1.5rem 2rem;
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .form-row[b-p0dguslo8y] {
        grid-template-columns: 1fr;
    }

    .info-grid[b-p0dguslo8y] {
        grid-template-columns: 1fr;
    }

    .info-item.full-width[b-p0dguslo8y] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Admin/TerminalReaders.razor.rz.scp.css */
.admin-form-page[b-pq80zspw3u] { background: #ffffff; }

.admin-content[b-pq80zspw3u] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 3rem 2rem;
}

.toolbar[b-pq80zspw3u] { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 1.25rem; }

/* Where the kiosk default comes from (#8172): the organization's, or this club's own choice. */
.reader-source[b-pq80zspw3u] {
    margin: 0 0 1rem;
    font-size: 0.9rem;
    color: var(--color-text-secondary);
}


.reader-status[b-pq80zspw3u] {
    margin: 0 0 1rem;
    padding: 0.75rem 1rem;
    background: var(--cedar-green-tint);
    border-left: 4px solid var(--cedar-green, #2D5016);
    color: var(--cedar-green, #2D5016);
}

.reader-grid[b-pq80zspw3u] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}

.reader-card[b-pq80zspw3u] {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-left: 4px solid rgba(0, 0, 0, 0.12);
    padding: 1rem 1.25rem;
    background: #fff;
}
.reader-card.is-default[b-pq80zspw3u] { border-left-color: var(--wheat-gold, #D4AF37); background: #fffdf5; }

.reader-head[b-pq80zspw3u] { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.reader-name[b-pq80zspw3u] { font-weight: 700; color: #111827; }

.reader-badge[b-pq80zspw3u] { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.78rem; font-weight: 600; text-transform: capitalize; }
.reader-badge i[b-pq80zspw3u] { font-size: 0.6rem; }
.reader-badge.on[b-pq80zspw3u] { color: var(--cedar-green, #2D5016); }
.reader-badge.off[b-pq80zspw3u] { color: #9ca3af; }

.reader-meta[b-pq80zspw3u] { display: flex; justify-content: space-between; gap: 0.5rem; margin: 0.5rem 0 0.9rem; font-size: 0.8rem; color: #6b7280; }
.reader-id[b-pq80zspw3u] { font-family: monospace; }

.default-tag[b-pq80zspw3u] { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.82rem; font-weight: 700; color: var(--wheat-gold-dark, #8a6d1f); }

/* The action row at the foot of a reader card (#7588). It had no rule, so the kiosk-default
   tag and the button it alternates with sat on the text baseline instead of in a row. */
.reader-actions[b-pq80zspw3u] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
}
/* /Components/Pages/Admin/TitleVerifications.razor.rz.scp.css */
.admin-form-page[b-kthp9sdn4q] {
    background: #ffffff;
}

.admin-content[b-kthp9sdn4q] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 2.5rem 2rem;
}

.search-row[b-kthp9sdn4q] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    align-items: center;
}

[b-kthp9sdn4q] .search-input {
    flex: 1;
    max-width: 520px;
    padding: 0.75rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-size: 0.9375rem;
}

[b-kthp9sdn4q] .search-input:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.help-line[b-kthp9sdn4q] {
    color: var(--color-text-secondary);
    font-size: 0.875rem;
    margin: 0 0 1.5rem 0;
}

.verify-table[b-kthp9sdn4q] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9375rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.verify-table th[b-kthp9sdn4q] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 700;
    background: rgba(var(--cedar-green-rgb), 0.04);
    color: #111827;
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 2px solid var(--cedar-green, #2D5016);
}

.verify-table td[b-kthp9sdn4q] {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    vertical-align: top;
    color: #374151;
}

.player-name[b-kthp9sdn4q] {
    font-weight: 600;
    color: #111827;
}

.player-email[b-kthp9sdn4q] {
    font-size: 0.85rem;
    color: var(--color-text-secondary);
    margin-top: 0.125rem;
}

.verified-badge[b-kthp9sdn4q] {
    display: inline-block;
    padding: 0.2rem 0.55rem;
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.verified-when[b-kthp9sdn4q] {
    font-size: 0.75rem;
    color: var(--color-text-secondary);
    margin-top: 0.25rem;
}

.not-verified[b-kthp9sdn4q] {
    color: var(--color-text-secondary);
    font-style: italic;
    font-size: 0.85rem;
}

.actions-cell[b-kthp9sdn4q] {
    display: flex;
    gap: 0.375rem;
    align-items: center;
    flex-wrap: wrap;
}

[b-kthp9sdn4q] .title-select {
    padding: 0.375rem 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-size: 0.85rem;
    background: #fff;
}

.feedback[b-kthp9sdn4q] {
    margin-top: 1.25rem;
    padding: 0.75rem 1rem;
    background: rgba(var(--cedar-green-rgb), 0.08);
    border-left: 3px solid var(--cedar-green, #2D5016);
    color: #111827;
    font-size: 0.9375rem;
}

.feedback.error[b-kthp9sdn4q] {
    background: rgba(220, 38, 38, 0.08);
    border-left-color: #dc2626;
    color: #b91c1c;
}

@media (max-width: 768px) {
    .admin-content[b-kthp9sdn4q] { padding: 2rem 1rem; }
    .verify-table[b-kthp9sdn4q] { font-size: 0.85rem; }
    .verify-table td[b-kthp9sdn4q], .verify-table th[b-kthp9sdn4q] { padding: 0.5rem; }
    .actions-cell[b-kthp9sdn4q] { flex-direction: column; align-items: stretch; }
}
/* /Components/Pages/Admin/TournamentControl.razor.rz.scp.css */
/* ===== Admin page chrome (scoped per page, matching other admin pages) ===== */
.admin-form-page[b-vsiu361u1g] { background: #ffffff; }
.admin-content[b-vsiu361u1g] {
    max-width: 1300px;
    margin: 0 auto;
    padding: 3rem 2rem;
}
.section-title[b-vsiu361u1g] {
    font-family: var(--font-display, Georgia, serif);
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin: 0 0 1rem;
}

/* ===== Tournament control content ===== */
.tc-upload[b-vsiu361u1g] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.5rem;
    background: var(--river-pearl, #f5f5f0);
}

.tc-upload-label[b-vsiu361u1g] {
    display: block;
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
    margin-bottom: 0.75rem;
}

.tc-dryrun[b-vsiu361u1g] {
    display: block;
    margin-top: 0.9rem;
    font-size: 0.9rem;
    color: #555;
}

/* The mode as a Tournament Director reads it: a line, not the administrators' switch. */
.tc-dryrun-mode[b-vsiu361u1g] {
    margin-bottom: 0;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

[b-vsiu361u1g] input[type="file"] {
    display: block;
    font-size: 0.9rem;
    color: #555;
}

[b-vsiu361u1g] input[type="file"]::file-selector-button {
    margin-right: 1rem;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 4px;
    font-weight: 600;
    background-color: var(--cedar-green, #2D5016);
    color: #fff;
    cursor: pointer;
}

/* Round block */
.tc-round[b-vsiu361u1g] {
    margin-bottom: 2.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.tc-round-head[b-vsiu361u1g] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    flex-wrap: wrap;
}

.tc-round-title[b-vsiu361u1g] { margin: 0; font-size: 1.25rem; color: var(--cedar-green, #2D5016); }
.tc-progress[b-vsiu361u1g] { color: #666; font-size: 0.9rem; }
.tc-round-actions[b-vsiu361u1g] { margin-left: auto; display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* A Tournament Director's pairing mail that was not sent, because the club's saved mode changed under the open
   page: the shared error message and the reload, under the round's own buttons. */
.tc-held[b-vsiu361u1g] {
    padding: 0 1.25rem 1rem;
    overflow-wrap: anywhere;
}

.tc-board-wrap[b-vsiu361u1g] { overflow-x: auto; }
.tc-board[b-vsiu361u1g] { width: 100%; border-collapse: collapse; }
.tc-board th[b-vsiu361u1g] {
    text-align: left;
    padding: 0.6rem 1rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #888;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.tc-board td[b-vsiu361u1g] {
    padding: 0.55rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.tc-bd[b-vsiu361u1g] { color: #999; width: 3rem; }
.tc-actions[b-vsiu361u1g] { text-align: center; white-space: nowrap; width: 1%; }
.tc-win[b-vsiu361u1g] { font-weight: 700; color: var(--cedar-green, #2D5016); }
.tc-bye[b-vsiu361u1g] { color: #999; font-style: italic; }

/* Result toggle group: a white box (white wins), a draw, a black box (black wins) */
.tc-btn[b-vsiu361u1g] {
    width: 2.2rem;
    height: 2.2rem;
    margin: 0 0.2rem;
    border: 1px solid #bbb;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.95rem;
    font-weight: 600;
    vertical-align: middle;
    transition: all 0.15s ease;
}
.tc-btn.tc-w[b-vsiu361u1g] { background: #ffffff; }
.tc-btn.tc-d[b-vsiu361u1g] { background: #f0f0ea; color: #555; }
.tc-btn.tc-b[b-vsiu361u1g] { background: #1c1c1c; border-color: #1c1c1c; }
.tc-btn:hover[b-vsiu361u1g] { border-color: var(--wilson-blue, #4A6FA5); }
.tc-btn.on[b-vsiu361u1g] {
    outline: 3px solid var(--wheat-gold, #D4AF37);
    outline-offset: 1px;
    border-color: var(--wheat-gold, #D4AF37);
}

/* Locked (result recorded) — read-only until Edit is pressed */
.tc-btn.locked[b-vsiu361u1g],
.tc-btn:disabled[b-vsiu361u1g] {
    cursor: default;
    opacity: 1;
}
.tc-btn.locked:hover[b-vsiu361u1g] { border-color: var(--wheat-gold, #D4AF37); }

.tc-edit[b-vsiu361u1g] {
    margin-left: 0.5rem;
    padding: 0.35rem 0.7rem;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    color: var(--wilson-blue, #4A6FA5);
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    vertical-align: middle;
}
.tc-edit:hover[b-vsiu361u1g] { border-color: var(--wilson-blue, #4A6FA5); }
.tc-edit i[b-vsiu361u1g] { margin-right: 0.3rem; }

.tc-toggle[b-vsiu361u1g] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}
.tc-toggle i[b-vsiu361u1g] { color: var(--cedar-green, #2D5016); font-size: 0.85rem; width: 0.9rem; }

.tc-kiosk-link[b-vsiu361u1g] { margin-top: 0.9rem; display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.tc-kiosk-url[b-vsiu361u1g] { font-size: 0.85rem; color: #666; }
.tc-kiosk-url code[b-vsiu361u1g] { background: rgba(0,0,0,0.06); padding: 0.1rem 0.35rem; border-radius: 3px; }

/* Add-bye control under each round's board table */
.tc-addbye[b-vsiu361u1g] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.75rem 0 0.25rem;
    flex-wrap: wrap;
}
.tc-addbye label[b-vsiu361u1g] { font-weight: 600; color: #374151; }
.tc-addbye select[b-vsiu361u1g] { min-height: 38px; border: 1px solid #d1d5db; border-radius: 0; padding: 0 0.6rem; }
/* /Components/Pages/Admin/WebhookTest.razor.rz.scp.css */
.admin-form-page[b-fl58yd519v] { background: #ffffff; }
.admin-content[b-fl58yd519v] { max-width: 1300px; margin: 0 auto; }

.webhook-test-page[b-fl58yd519v] {
    max-width: 760px;
    margin: 0 auto;
    padding: 3rem 1.5rem 5rem;
}

.note[b-fl58yd519v] {
    display: flex;
    gap: 0.75rem;
    background: #f5f7fb;
    border-left: 4px solid var(--wilson-blue, #4A6FA5);
    padding: 1rem 1.25rem;
    margin-bottom: 2rem;
    color: #374151;
    line-height: 1.6;
    font-size: 0.95rem;
}
.note code[b-fl58yd519v] {
    background: rgba(0, 0, 0, 0.06);
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    font-size: 0.85em;
}

.field[b-fl58yd519v] { margin-bottom: 1rem; }
.field label[b-fl58yd519v] {
    display: block;
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
    margin-bottom: 0.4rem;
}
.field .opt[b-fl58yd519v] { font-weight: 400; color: #9ca3af; }
.field .hint[b-fl58yd519v] { margin: 0.35rem 0 0; font-size: 0.85rem; color: #9ca3af; }

.fld[b-fl58yd519v] {
    width: 100%;
    padding: 0.65rem 0.8rem;
    border: 1px solid #d1d5db;
    font-size: 0.95rem;
    font-family: inherit;
    box-sizing: border-box;
}
.fld:focus[b-fl58yd519v] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.scenario-buttons[b-fl58yd519v] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 1.5rem 0;
}

.result[b-fl58yd519v] {
    margin-top: 1.5rem;
    padding: 1.25rem;
    border-left: 4px solid #9ca3af;
    background: #f6f6f4;
}
.result.ok[b-fl58yd519v] { background: var(--cedar-green-tint); border-left-color: var(--cedar-green, #2D5016); }
.result.fail[b-fl58yd519v] { background: #fdf1f1; border-left-color: #b42323; }
.result.dark[b-fl58yd519v] { background: #f3f4f6; border-left-color: #6b7280; }

.result-status[b-fl58yd519v] { margin: 0 0 1rem; font-weight: 600; color: #374151; }
.result-status i[b-fl58yd519v] { margin-right: 0.4rem; }

.result-meta[b-fl58yd519v] {
    margin: 0 0 1rem;
    display: grid;
    gap: 0.35rem;
}
.result-meta > div[b-fl58yd519v] { display: flex; gap: 0.5rem; }
.result-meta dt[b-fl58yd519v] {
    flex: 0 0 160px;
    color: #6b7280;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.result-meta dd[b-fl58yd519v] { margin: 0; color: #374151; word-break: break-all; }

.payload-label[b-fl58yd519v] { margin: 0 0 0.4rem; font-weight: 600; color: #374151; }
.payload[b-fl58yd519v] {
    margin: 0;
    padding: 1rem;
    background: #1e1e1e;
    color: #e6e6e6;
    font-size: 0.8rem;
    line-height: 1.5;
    overflow-x: auto;
    border-radius: 4px;
}
/* /Components/Pages/Admin/YouthConsent.razor.rz.scp.css */
/* The Safeguarding section's youth consent overview (#8177). Every color is a token; the grid
   scrolls inside its frame, so the page never scrolls sideways at 344px. */
.admin-form-page[b-fiw07zvl9t] { background: var(--color-surface); }
.admin-content[b-fiw07zvl9t] { max-width: 1300px; margin: 0 auto; }
.consent-page[b-fiw07zvl9t] { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.toolbar[b-fiw07zvl9t] { display: flex; flex-wrap: wrap; gap: 0.75rem 1.25rem; align-items: center; margin: 0 0 1rem 0; }
.toolbar input[type="search"][b-fiw07zvl9t] { flex: 1 1 16rem; min-width: 0; }
.toolbar-check[b-fiw07zvl9t] { display: flex; align-items: center; gap: 0.5rem; }

/* The member search (#consent-search), drawn as the account pages draw their fields: .form-input is each page's
   own, and this page had none, so on the editorial skin it was the browser's default box, its text under 16 px
   (#8443, WALK-1005f b8-consent). The photo skin styles the class on every page, after this, and still does. */
.form-input[b-fiw07zvl9t] {
    width: 100%;
    padding: 0.875rem 1.125rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: 8px;
    font-size: var(--font-size-base);
    font-family: var(--font-sans);
    transition: all var(--transition-base);
    background: var(--color-white);
    color: var(--color-text);
}
.form-input[b-fiw07zvl9t]::placeholder { color: var(--color-gray); }
.form-input:hover[b-fiw07zvl9t] { border-color: var(--color-gray); }
.form-input:focus[b-fiw07zvl9t] { outline: none; border-color: var(--cedar-green); box-shadow: 0 0 0 4px rgba(var(--cedar-green-rgb), 0.08); }
.toolbar-check input[b-fiw07zvl9t] { accent-color: var(--cedar-green); }

.count[b-fiw07zvl9t] { font-size: 0.85rem; color: var(--color-text-secondary); margin: 0 0 1rem 0; }
.consent-note[b-fiw07zvl9t] {
    font-size: 0.9rem; color: var(--color-text); background: var(--cedar-green-tint);
    border-left: 3px solid var(--cedar-green); border-radius: 0.25rem; padding: 0.6rem 0.9rem; margin: 0 0 1rem 0;
}
/* A link in a note is told from its sentence by more than color (#8443, WALK-1005f b3-consent: axe
   link-in-text-block, "Manage Members" and "Unclaimed accounts" at 1.8:1 against the note's own words). */
.consent-note a[b-fiw07zvl9t] { text-decoration: underline; }

.grid-wrap[b-fiw07zvl9t] { overflow-x: auto; border: 1px solid var(--color-border); border-radius: 0.4rem; }
[b-fiw07zvl9t] table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
[b-fiw07zvl9t] th, [b-fiw07zvl9t] td { text-align: left; padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--color-border); vertical-align: top; }
[b-fiw07zvl9t] th { color: var(--color-text-secondary); text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; background: var(--cedar-green-tint); }

.age-chip[b-fiw07zvl9t] {
    display: inline-block; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem; border-radius: 999px; background: var(--status-warning); color: var(--status-ink);
}
.when[b-fiw07zvl9t] { display: block; font-size: 0.78rem; color: var(--color-text-secondary); }

@media (max-width: 480px) {
    .consent-page[b-fiw07zvl9t] { padding: 1.5rem 1rem 3rem; }
}
/* /Components/Pages/ApplyToBeCoach.razor.rz.scp.css */
/* ============================================
   Apply to Be Coach Page - Editorial Design
   ============================================ */

.apply-coach-page[b-ayadqw2pt5] {
    background: #ffffff;
}

/* ============================================
   Loading State
   ============================================ */

.loading-container[b-ayadqw2pt5] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 400px;
    color: #6b7280;
    gap: 1rem;
}

.loading-spinner[b-ayadqw2pt5] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-ayadqw2pt5 1s linear infinite;
}

@keyframes spin-b-ayadqw2pt5 {
    to { transform: rotate(360deg); }
}

/* ============================================
   Existing Profile Notice
   ============================================ */

.existing-profile-notice[b-ayadqw2pt5] {
    max-width: 600px;
    margin: 4rem auto;
    padding: 3rem;
    text-align: center;
    background: var(--limestone-cream, #E8DCC4);
    border-radius: 0.75rem;
}

.notice-icon[b-ayadqw2pt5] {
    font-size: 3rem;
    color: var(--wilson-blue, #4A6FA5);
    margin-bottom: 1.5rem;
}

.notice-title[b-ayadqw2pt5] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.notice-message[b-ayadqw2pt5] {
    color: #6b7280;
    margin: 0 0 2rem 0;
    font-size: 1.125rem;
}

/* ============================================
   Content Section
   ============================================ */

.content-section[b-ayadqw2pt5] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

.form-card[b-ayadqw2pt5] {
    max-width: 800px;
    margin: 0 auto;
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 3rem;
}

/* ============================================
   Requirements Section
   ============================================ */

.requirements-section[b-ayadqw2pt5] {
    background: var(--limestone-cream, #E8DCC4);
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.requirements-title[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin: 0 0 1rem 0;
}

.requirements-title i[b-ayadqw2pt5] {
    font-size: 1.25rem;
}

.requirements-list[b-ayadqw2pt5] {
    margin: 0;
    padding-left: 1.5rem;
    color: #374151;
    line-height: 1.8;
}

.requirements-list li[b-ayadqw2pt5] {
    margin-bottom: 0.5rem;
}

.requirements-list li:last-child[b-ayadqw2pt5] {
    margin-bottom: 0;
}

/* ============================================
   Form Groups
   ============================================ */

.form-group[b-ayadqw2pt5] {
    margin-bottom: 1.5rem;
}

.form-label[b-ayadqw2pt5] {
    display: block;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.5rem;
    font-size: 0.9375rem;
}

.required[b-ayadqw2pt5] {
    color: #ef4444;
}

.field-hint[b-ayadqw2pt5] {
    display: block;
    font-size: 0.8125rem;
    color: #6b7280;
    margin-top: 0.375rem;
}

/* ============================================
   Blazor Input Styling with ::deep
   ============================================ */

[b-ayadqw2pt5] textarea {
    width: 100%;
    padding: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.9375rem;
    line-height: 1.6;
    font-family: inherit;
    resize: vertical;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

[b-ayadqw2pt5] textarea:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

[b-ayadqw2pt5] textarea::placeholder {
    color: #9ca3af;
}

[b-ayadqw2pt5] input[type="number"] {
    width: 100%;
    padding: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.9375rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

[b-ayadqw2pt5] input[type="number"]:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

[b-ayadqw2pt5] input[type="text"] {
    width: 100%;
    padding: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.9375rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

[b-ayadqw2pt5] input[type="text"]:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

[b-ayadqw2pt5] input[type="text"]::placeholder {
    color: #9ca3af;
}

[b-ayadqw2pt5] input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--cedar-green, #2D5016);
    cursor: pointer;
}

[b-ayadqw2pt5] input[type="file"] {
    display: block;
    width: 100%;
    font-size: 0.9375rem;
    color: #6b7280;
    cursor: pointer;
    padding: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    transition: border-color 0.2s ease;
}

[b-ayadqw2pt5] input[type="file"]:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
}

[b-ayadqw2pt5] input[type="file"]::file-selector-button {
    margin-right: 1rem;
    padding: 0.625rem 1.25rem;
    border-radius: 0.375rem;
    border: none;
    font-size: 0.875rem;
    font-weight: 600;
    background-color: var(--cedar-green, #2D5016);
    color: white;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

[b-ayadqw2pt5] input[type="file"]::file-selector-button:hover {
    background-color: #1e3a0f;
}

[b-ayadqw2pt5] .validation-message {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 0.375rem;
    display: block;
}

[b-ayadqw2pt5] .validation-summary {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

[b-ayadqw2pt5] .validation-summary ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

[b-ayadqw2pt5] .validation-summary li {
    color: #ef4444;
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

[b-ayadqw2pt5] .invalid {
    border-color: #ef4444 !important;
}

[b-ayadqw2pt5] .invalid:focus {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1) !important;
}

/* ============================================
   Pricing Sections
   ============================================ */

.pricing-section[b-ayadqw2pt5] {
    background: var(--limestone-cream, #E8DCC4);
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.pricing-title[b-ayadqw2pt5] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin: 0 0 1rem 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.pricing-section .form-group[b-ayadqw2pt5] {
    margin-bottom: 0.75rem;
}

.package-summary[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: white;
    border-radius: 0.375rem;
    color: var(--cedar-green, #2D5016);
    font-size: 0.875rem;
    font-weight: 600;
}

.package-summary i[b-ayadqw2pt5] {
    color: var(--wheat-gold, #D4AF37);
}

/* ============================================
   Checkbox Styling
   ============================================ */

.checkbox-group[b-ayadqw2pt5] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.checkbox-item[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.checkbox-text[b-ayadqw2pt5] {
    font-size: 0.9375rem;
    color: #374151;
    cursor: pointer;
}

/* ============================================
   Form Row (Grid Layout)
   ============================================ */

.form-row[b-ayadqw2pt5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

/* ============================================
   Currency Input
   ============================================ */

.currency-input[b-ayadqw2pt5] {
    position: relative;
}

.currency-symbol[b-ayadqw2pt5] {
    position: absolute;
    left: 0.875rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-weight: 500;
}

.currency-input[b-ayadqw2pt5]  input[type="number"] {
    padding-left: 2rem;
}

/* ============================================
   Upload Section
   ============================================ */

.upload-section[b-ayadqw2pt5] {
    padding: 1.25rem;
    border: 2px dashed #d1d5db;
    border-radius: 0.75rem;
    background-color: #fafafa;
}

.upload-hint[b-ayadqw2pt5] {
    font-size: 0.875rem;
    color: #6b7280;
    margin: 0 0 1rem 0;
    line-height: 1.6;
}

.upload-success[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: #d1fae5;
    border-radius: 0.375rem;
    color: #065f46;
    font-size: 0.875rem;
    font-weight: 500;
}

.upload-success i[b-ayadqw2pt5] {
    color: #10b981;
}

.upload-progress[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: #fef3c7;
    border-radius: 0.375rem;
    color: #92400e;
    font-size: 0.875rem;
}

.upload-error[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: #fee2e2;
    border-radius: 0.375rem;
    color: #dc2626;
    font-size: 0.875rem;
}

.validation-error[b-ayadqw2pt5] {
    margin-top: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: #fee2e2;
    border-radius: 0.375rem;
    color: #dc2626;
    font-size: 0.875rem;
}

/* ============================================
   Alert Messages
   ============================================ */

.alert-success[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background-color: #d1fae5;
    border: 1px solid #a7f3d0;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    color: #065f46;
    font-size: 0.9375rem;
}

.alert-success i[b-ayadqw2pt5] {
    font-size: 1.25rem;
    color: #10b981;
}

.alert-error[b-ayadqw2pt5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background-color: #fee2e2;
    border: 1px solid #fecaca;
    border-radius: 0.5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
    color: #dc2626;
    font-size: 0.9375rem;
}

.alert-error i[b-ayadqw2pt5] {
    font-size: 1.25rem;
}

/* ============================================
   Form Actions
   ============================================ */

.form-actions[b-ayadqw2pt5] {
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e7eb;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .content-section[b-ayadqw2pt5] {
        padding: 2rem 1rem;
    }

    .form-card[b-ayadqw2pt5] {
        padding: 1.5rem;
    }

    .requirements-section[b-ayadqw2pt5] {
        padding: 1.25rem;
    }

    .form-row[b-ayadqw2pt5] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .form-actions[b-ayadqw2pt5] {
        flex-direction: column;
    }

    .existing-profile-notice[b-ayadqw2pt5] {
        margin: 2rem 1rem;
        padding: 2rem;
    }
}
/* /Components/Pages/BookDetails.razor.rz.scp.css */
.book-details-page[b-c85kaxc3xs] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

/* Coming Soon Banner (Inline) */
.coming-soon-banner-inline[b-c85kaxc3xs] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #f59e0b;
    border-radius: 12px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1rem;
}

.coming-soon-banner-inline i[b-c85kaxc3xs] {
    font-size: 2rem;
    color: #d97706;
    flex-shrink: 0;
}

.coming-soon-banner-inline strong[b-c85kaxc3xs] {
    font-size: 1rem;
    color: #92400e;
    display: block;
    margin-bottom: 0.25rem;
}

.coming-soon-banner-inline p[b-c85kaxc3xs] {
    margin: 0;
    color: #78350f;
    font-size: 0.875rem;
    line-height: 1.5;
}

.loading[b-c85kaxc3xs] {
    text-align: center;
    padding: 4rem 1rem;
}

.book-details-content[b-c85kaxc3xs] {
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 3rem;
    background: white;
    border-radius: 0.5rem;
    padding: 2.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.book-cover-section[b-c85kaxc3xs] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.book-cover-large[b-c85kaxc3xs] {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.book-cover-placeholder[b-c85kaxc3xs] {
    width: 100%;
    aspect-ratio: 2/3;
    background: #f3f4f6;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

.book-cover-placeholder i[b-c85kaxc3xs] {
    font-size: 4rem;
    margin-bottom: 1rem;
}

.book-cover-placeholder p[b-c85kaxc3xs] {
    font-size: 0.875rem;
    font-weight: 500;
    margin: 0;
}

.book-info-section[b-c85kaxc3xs] {
    min-width: 0;
}

.book-title[b-c85kaxc3xs] {
    font-size: 2.25rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 0.5rem;
    line-height: 1.2;
}

.book-author[b-c85kaxc3xs] {
    font-size: 1.5rem;
    color: #6b7280;
    margin-bottom: 2rem;
}

.book-metadata[b-c85kaxc3xs] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: #f9fafb;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
}

.metadata-item[b-c85kaxc3xs] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.metadata-item .label[b-c85kaxc3xs] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.metadata-item .value[b-c85kaxc3xs] {
    font-size: 1rem;
    color: #111827;
    font-weight: 500;
}

.book-description[b-c85kaxc3xs] {
    margin-bottom: 2rem;
}

.book-description h2[b-c85kaxc3xs] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 1rem;
}

.description-content[b-c85kaxc3xs] {
    font-size: 1rem;
    line-height: 1.75;
    color: #374151;
    background: #f9fafb;
    padding: 1.5rem;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
}

.book-actions[b-c85kaxc3xs] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-external[b-c85kaxc3xs] {
    background: #1e3a8a;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 0.375rem;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.2s;
}

.btn-external:hover[b-c85kaxc3xs] {
    background: #1e40af;
}

.btn-checkout[b-c85kaxc3xs] {
    background: var(--wilson-blue);
    color: white;
    padding: 0.875rem 1.75rem;
    border: none;
    border-radius: 0.5rem;
    font-size: 1.0625rem;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 6px -1px rgba(0, 61, 165, 0.2), 0 2px 4px -1px rgba(0, 61, 165, 0.1);
}

.btn-checkout:hover:not(:disabled)[b-c85kaxc3xs] {
    background: #0052a3;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 61, 165, 0.3), 0 4px 6px -2px rgba(0, 61, 165, 0.1);
}

.btn-checkout:disabled[b-c85kaxc3xs] {
    background: #9ca3af;
    cursor: not-allowed;
    opacity: 0.6;
}

@media (max-width: 1024px) {
    .book-details-content[b-c85kaxc3xs] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .book-cover-section[b-c85kaxc3xs] {
        max-width: 350px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .book-details-page[b-c85kaxc3xs] {
        padding: 1rem 0.5rem;
    }

    .book-details-content[b-c85kaxc3xs] {
        padding: 1.5rem;
    }

    .book-title[b-c85kaxc3xs] {
        font-size: 1.75rem;
    }

    .book-author[b-c85kaxc3xs] {
        font-size: 1.25rem;
    }

    .book-metadata[b-c85kaxc3xs] {
        grid-template-columns: 1fr;
    }
}

/* ============================================
   Library checkout panel (#7588)
   ============================================
   The whole panel - the status line, the dates, the two warnings and the sign-in prompt -
   rendered with no rule of any kind: the stylesheet stopped at .btn-checkout while the markup
   went on for another hundred lines. It is the non-production branch of the page, so it is
   what a club officer sees while the checkout feature is being walked, and it came out as
   default-flow HTML. Colour reaches this block only through tokens. */

.checkout-section[b-c85kaxc3xs] {
    margin-top: var(--spacing-xl);
    padding-top: var(--spacing-xl);
    border-top: 1px solid var(--color-border);
}

.checkout-info[b-c85kaxc3xs],
.checkout-available[b-c85kaxc3xs] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    background: var(--color-gray-lightest);
}

/* A book that is out is the state a visitor most needs to read at a glance. */
.checkout-info.overdue[b-c85kaxc3xs] {
    border-color: var(--color-error);
}

.checkout-status[b-c85kaxc3xs],
.available-status[b-c85kaxc3xs] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
}

.checkout-status i[b-c85kaxc3xs],
.available-status i[b-c85kaxc3xs] {
    color: var(--color-text-secondary);
}

.available-status i[b-c85kaxc3xs] {
    color: var(--color-success);
}

.status-text[b-c85kaxc3xs] {
    font-family: var(--font-display);
    font-size: var(--font-size-lg);
}

.checkout-details[b-c85kaxc3xs] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}

.detail-item[b-c85kaxc3xs] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
}

.overdue-badge[b-c85kaxc3xs],
.due-soon-badge[b-c85kaxc3xs] {
    display: inline-block;
    margin-left: var(--spacing-sm);
    padding: 0.125rem var(--spacing-sm);
    border-radius: var(--radius-full);
    font-size: var(--font-size-xs);
    font-weight: 600;
}

.overdue-badge[b-c85kaxc3xs] {
    background: var(--color-error);
    color: var(--color-white);
}

.due-soon-badge[b-c85kaxc3xs] {
    background: var(--color-warning);
    color: var(--color-dark);
}

.return-info[b-c85kaxc3xs],
.checkout-limit-warning[b-c85kaxc3xs],
.email-verification-warning[b-c85kaxc3xs],
.login-required[b-c85kaxc3xs] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-sm);
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    line-height: 1.6;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
}

/* The two blocking states read as warnings, the two informational ones do not. */
.checkout-limit-warning[b-c85kaxc3xs],
.email-verification-warning[b-c85kaxc3xs] {
    border-color: var(--color-warning);
}

.verify-link[b-c85kaxc3xs],
.login-required a[b-c85kaxc3xs] {
    color: var(--color-text);
    font-weight: 600;
    text-decoration: underline;
}

.status-message[b-c85kaxc3xs] {
    padding: var(--spacing-md);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    border: 1px solid var(--color-border);
}

.status-message.success[b-c85kaxc3xs] {
    border-color: var(--color-success);
}

.status-message.error[b-c85kaxc3xs] {
    border-color: var(--color-error);
}
/* /Components/Pages/ClubTournaments.razor.rz.scp.css */
/* A club's tournaments page (#8181): one grid of link cards per section. One column on a phone, as many
   280px columns as fit on a wider screen. The cards are the shared ContentCard, a child component, so
   what this page adds inside them is reached with ::deep. */

.tournaments-page[b-3nn0myqcif] {
    background: var(--color-surface);
}

.tournament-grid[b-3nn0myqcif] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
    gap: 1.25rem;
}

.tournament-grid[b-3nn0myqcif]  .host-line {
    margin: 0 0 0.35rem;
    font-weight: 600;
    color: var(--color-text);
}

.tournament-grid[b-3nn0myqcif]  .where-line {
    margin: 0 0 0.35rem;
    font-size: 0.9rem;
    color: var(--color-text-secondary);
    overflow-wrap: anywhere;
}

.tournament-grid[b-3nn0myqcif]  .where-line i {
    margin-right: 0.35rem;
    color: var(--cedar-green);
}

.tournament-grid[b-3nn0myqcif]  .winner-line {
    margin: 0.5rem 0 0;
    font-weight: 600;
    color: var(--color-text);
    overflow-wrap: anywhere;
}

.tournament-grid[b-3nn0myqcif]  .progress {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    color: var(--status-ink);
    background: var(--status-neutral);
    white-space: nowrap;
}

.tournament-grid[b-3nn0myqcif]  .progress-upcoming {
    background: var(--status-success);
}

.tournament-grid[b-3nn0myqcif]  .progress-inprogress {
    background: var(--status-warning);
}
/* /Components/Pages/CoachDetails.razor.rz.scp.css */
.coach-details-page[b-i8hwxds205] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

/* Loading State */
.loading-container[b-i8hwxds205] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
    color: #6b7280;
}

/* Not Found State */
.not-found-container[b-i8hwxds205] {
    text-align: center;
    padding: 3rem 0;
}

.not-found-icon[b-i8hwxds205] {
    font-size: 4rem;
    margin-bottom: 1rem;
}

.not-found-title[b-i8hwxds205] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    margin-bottom: 0.5rem;
}

.not-found-message[b-i8hwxds205] {
    color: #6b7280;
    margin-bottom: 1.5rem;
}

.not-found-link[b-i8hwxds205] {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: var(--cedar-green);
    color: white;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: background 0.2s ease;
}

.not-found-link:hover[b-i8hwxds205] {
    background: var(--wilson-blue);
}

/* Back Button */
.back-button[b-i8hwxds205] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green);
    font-weight: 500;
    background: none;
    border: none;
    cursor: pointer;
    margin-bottom: 1.5rem;
    transition: color 0.2s ease;
}

.back-button:hover[b-i8hwxds205] {
    color: var(--wilson-blue);
}

/* Layout Grid */
.detail-grid[b-i8hwxds205] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

@media (min-width: 1024px) {
    .detail-grid[b-i8hwxds205] {
        grid-template-columns: 2fr 1fr;
    }
}

/* Main Content Column */
.main-content[b-i8hwxds205] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

/* Profile Header Card */
.profile-header-card[b-i8hwxds205] {
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

.profile-header-content[b-i8hwxds205] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 768px) {
    .profile-header-content[b-i8hwxds205] {
        flex-direction: row;
    }
}

.coach-avatar-large[b-i8hwxds205] {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #e5e7eb;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .coach-avatar-large[b-i8hwxds205] {
        margin: 0;
    }
}

.coach-avatar-placeholder-large[b-i8hwxds205] {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    background: #dbeafe;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cedar-green);
    font-size: 2.5rem;
    font-weight: 700;
    border: 4px solid #e5e7eb;
    margin: 0 auto;
}

@media (min-width: 768px) {
    .coach-avatar-placeholder-large[b-i8hwxds205] {
        margin: 0;
    }
}

.profile-header-info[b-i8hwxds205] {
    flex: 1;
    text-align: center;
}

@media (min-width: 768px) {
    .profile-header-info[b-i8hwxds205] {
        text-align: left;
    }
}

.coach-name-large[b-i8hwxds205] {
    font-size: 1.875rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem 0;
}

.coach-rating-large[b-i8hwxds205] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    justify-content: center;
}

@media (min-width: 768px) {
    .coach-rating-large[b-i8hwxds205] {
        justify-content: flex-start;
    }
}

.coach-rating-stars-large[b-i8hwxds205] {
    display: flex;
    font-size: 1.25rem;
}

.coach-rating-stars-large .rating-star-filled[b-i8hwxds205] {
    color: #fbbf24;
}

.coach-rating-stars-large .rating-star-empty[b-i8hwxds205] {
    color: #d1d5db;
}

.coach-rating-value[b-i8hwxds205] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

.coach-rating-review-count[b-i8hwxds205] {
    color: #6b7280;
}

.profile-badges[b-i8hwxds205] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
    justify-content: center;
}

@media (min-width: 768px) {
    .profile-badges[b-i8hwxds205] {
        justify-content: flex-start;
    }
}

.badge[b-i8hwxds205] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 0.375rem;
}

.badge.safesport-verified[b-i8hwxds205] {
    background: #d1fae5;
    color: #065f46;
}

.badge.accepting-students[b-i8hwxds205] {
    background: #dbeafe;
    color: var(--cedar-green);
}

.badge.not-accepting-students[b-i8hwxds205] {
    background: #f3f4f6;
    color: #6b7280;
}

.badge.experience[b-i8hwxds205] {
    background: #f3f4f6;
    color: #374151;
}

.player-ids-container[b-i8hwxds205] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.875rem;
    color: #6b7280;
    justify-content: center;
}

@media (min-width: 768px) {
    .player-ids-container[b-i8hwxds205] {
        justify-content: flex-start;
    }
}

.player-id-link[b-i8hwxds205] {
    color: var(--cedar-green);
    text-decoration: none;
    transition: color 0.2s ease;
}

.player-id-link:hover[b-i8hwxds205] {
    color: var(--wilson-blue);
}

/* Content Cards */
.content-card[b-i8hwxds205] {
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

.content-card-title[b-i8hwxds205] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.content-card-text[b-i8hwxds205] {
    color: #374151;
    white-space: pre-wrap;
    line-height: 1.6;
}

/* Availability Schedule */
.availability-list[b-i8hwxds205] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.availability-item[b-i8hwxds205] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f3f4f6;
}

.availability-item:last-child[b-i8hwxds205] {
    border-bottom: none;
}

.availability-day[b-i8hwxds205] {
    font-weight: 500;
    color: #111827;
}

.availability-time[b-i8hwxds205] {
    color: #6b7280;
}

.availability-note[b-i8hwxds205] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-top: 1rem;
}

/* Available Time Slots */
.time-slots-container[b-i8hwxds205] {
    margin-top: 1rem;
}

.time-slots-loading[b-i8hwxds205] {
    text-align: center;
    padding: 2rem;
    color: #6b7280;
}

.time-slots-info[b-i8hwxds205] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 1rem;
}

.time-slots-by-date[b-i8hwxds205] {
    margin-bottom: 1.5rem;
}

.time-slots-by-date:last-child[b-i8hwxds205] {
    margin-bottom: 0;
}

.time-slots-date-header[b-i8hwxds205] {
    font-weight: 600;
    color: #111827;
    margin-bottom: 0.75rem;
}

.time-slots-date-badge[b-i8hwxds205] {
    margin-left: 0.5rem;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--cedar-green);
}

.time-slots-grid[b-i8hwxds205] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
}

@media (min-width: 640px) {
    .time-slots-grid[b-i8hwxds205] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .time-slots-grid[b-i8hwxds205] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.time-slot-button[b-i8hwxds205] {
    padding: 0.75rem;
    font-size: 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    background: white;
    cursor: pointer;
    text-align: center;
    transition: all 0.2s ease;
}

.time-slot-button:hover[b-i8hwxds205] {
    background: #dbeafe;
    border-color: var(--wilson-blue);
}

.time-slots-more[b-i8hwxds205] {
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 0.5rem;
}

.selected-slot-container[b-i8hwxds205] {
    margin-top: 1.5rem;
    padding: 1rem;
    background: #dbeafe;
    border: 1px solid #93c5fd;
    border-radius: 0.5rem;
}

.selected-slot-header[b-i8hwxds205] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.selected-slot-info .slot-label[b-i8hwxds205] {
    font-weight: 600;
    color: #111827;
}

.selected-slot-info .slot-time[b-i8hwxds205] {
    font-size: 1.125rem;
    color: var(--cedar-green);
}

.book-time-button[b-i8hwxds205] {
    padding: 0.5rem 1.5rem;
    background: var(--cedar-green);
    color: white;
    border-radius: 0.5rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    transition: background 0.2s ease;
}

.book-time-button:hover[b-i8hwxds205] {
    background: var(--wilson-blue);
}

/* Reviews Section */
.reviews-container[b-i8hwxds205] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.review-item[b-i8hwxds205] {
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 1rem;
}

.review-item:last-child[b-i8hwxds205] {
    border-bottom: none;
    padding-bottom: 0;
}

.review-header[b-i8hwxds205] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.review-author[b-i8hwxds205] {
    font-weight: 600;
    color: #111827;
}

.review-rating[b-i8hwxds205] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.25rem;
}

.review-rating .rating-star-filled[b-i8hwxds205] {
    color: #fbbf24;
}

.review-rating .rating-star-empty[b-i8hwxds205] {
    color: #d1d5db;
}

.review-date[b-i8hwxds205] {
    font-size: 0.875rem;
    color: #6b7280;
}

.review-text[b-i8hwxds205] {
    color: #374151;
    margin-top: 0.5rem;
    line-height: 1.6;
}

/* Sidebar */
.sidebar[b-i8hwxds205] {
    position: static;
}

@media (min-width: 1024px) {
    .sidebar[b-i8hwxds205] {
        position: sticky;
        top: 1.5rem;
    }
}

.sidebar-card[b-i8hwxds205] {
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
}

.sidebar-title[b-i8hwxds205] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.rates-container[b-i8hwxds205] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.rate-box[b-i8hwxds205] {
    padding: 1rem;
    background: #f9fafb;
    border-radius: 0.5rem;
}

.rate-label[b-i8hwxds205] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

.rate-amount[b-i8hwxds205] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
}

.rate-weekly[b-i8hwxds205] {
    font-size: 1.125rem;
    font-weight: 400;
    color: #6b7280;
}

.request-session-button[b-i8hwxds205] {
    width: 100%;
    padding: 0.75rem 1.5rem;
    background: var(--cedar-green);
    color: white;
    border-radius: 0.5rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    display: block;
    margin-bottom: 0.75rem;
    transition: background 0.2s ease;
}

.request-session-button:hover[b-i8hwxds205] {
    background: var(--wilson-blue);
}

.contact-coach-button[b-i8hwxds205] {
    width: 100%;
    padding: 0.75rem 1.5rem;
    border: 2px solid var(--cedar-green);
    color: var(--cedar-green);
    background: white;
    border-radius: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    display: block;
    transition: background 0.2s ease;
}

.contact-coach-button:hover[b-i8hwxds205] {
    background: #dbeafe;
}

.not-accepting-box[b-i8hwxds205] {
    padding: 1rem;
    background: #f9fafb;
    border-radius: 0.5rem;
    text-align: center;
}

.not-accepting-text[b-i8hwxds205] {
    color: #6b7280;
    font-weight: 500;
}

.member-since[b-i8hwxds205] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e5e7eb;
    font-size: 0.75rem;
    color: #6b7280;
    text-align: center;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .coach-details-page[b-i8hwxds205] {
        padding: 1rem;
    }

    .back-button[b-i8hwxds205] {
        margin-bottom: 1rem;
    }

    .detail-grid[b-i8hwxds205] {
        gap: 1.5rem;
    }
}
/* /Components/Pages/Coaches.razor.rz.scp.css */
/* ============================================
   Coaches Page - Editorial Design
   ============================================ */

.coaches-page[b-isuff4wr8t] {
    background: #ffffff;
}

/* ============================================
   Loading State
   ============================================ */

.loading-container[b-isuff4wr8t] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 400px;
    color: #6b7280;
    gap: 1rem;
}

.loading-spinner[b-isuff4wr8t] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-isuff4wr8t 1s linear infinite;
}

@keyframes spin-b-isuff4wr8t {
    to { transform: rotate(360deg); }
}

/* ============================================
   Filter Section
   ============================================ */

.filter-section[b-isuff4wr8t] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    background: var(--limestone-cream, #E8DCC4);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filter-controls[b-isuff4wr8t] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: center;
}

.filter-checkbox-group[b-isuff4wr8t] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.filter-checkbox-group input[type="checkbox"][b-isuff4wr8t] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--cedar-green, #2D5016);
    cursor: pointer;
}

.filter-checkbox-group label[b-isuff4wr8t] {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #374151;
    cursor: pointer;
}

.clear-filters-btn[b-isuff4wr8t] {
    margin-left: auto;
    font-size: 0.875rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
    background: none;
    border: none;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.2s ease;
}

.clear-filters-btn:hover[b-isuff4wr8t] {
    color: var(--wilson-blue, #4A6FA5);
}

.filter-results-count[b-isuff4wr8t] {
    margin-top: 1rem;
    font-size: 0.875rem;
    color: #6b7280;
}

/* ============================================
   Coaches Grid
   ============================================ */

.coaches-grid[b-isuff4wr8t] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: 3rem 2rem;
}

@media (min-width: 768px) {
    .coaches-grid[b-isuff4wr8t] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .coaches-grid[b-isuff4wr8t] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* ============================================
   Coach Card
   ============================================ */

.coach-card[b-isuff4wr8t] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    overflow: hidden;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.coach-card:hover[b-isuff4wr8t] {
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.coach-card-content[b-isuff4wr8t] {
    padding: 1.5rem;
}

.coach-header[b-isuff4wr8t] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.coach-avatar[b-isuff4wr8t] {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--limestone-cream, #E8DCC4);
}

.coach-avatar-placeholder[b-isuff4wr8t] {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    background: var(--cedar-green, #2D5016);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    font-weight: 700;
    border: 3px solid var(--limestone-cream, #E8DCC4);
}

.coach-info[b-isuff4wr8t] {
    flex: 1;
    min-width: 0;
}

.coach-name[b-isuff4wr8t] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.coach-rating[b-isuff4wr8t] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-bottom: 0.5rem;
}

.coach-rating-stars[b-isuff4wr8t] {
    display: flex;
    gap: 0.125rem;
}

.coach-rating-stars .star-filled[b-isuff4wr8t] {
    color: var(--wheat-gold, #D4AF37);
}

.coach-rating-stars .star-empty[b-isuff4wr8t] {
    color: #d1d5db;
}

.coach-rating-count[b-isuff4wr8t] {
    font-size: 0.875rem;
    color: #6b7280;
}

.coach-experience[b-isuff4wr8t] {
    font-size: 0.875rem;
    color: #6b7280;
}

/* ============================================
   Coach Badges
   ============================================ */

.coach-badge[b-isuff4wr8t] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 9999px;
    margin-bottom: 1rem;
}

.coach-badge.safesport[b-isuff4wr8t] {
    background: #d1fae5;
    color: #065f46;
}

.coach-badge i[b-isuff4wr8t] {
    font-size: 0.875rem;
}

/* ============================================
   Coach Specialties
   ============================================ */

.coach-specialties[b-isuff4wr8t] {
    font-size: 0.875rem;
    color: #6b7280;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.5;
    margin-bottom: 1rem;
}

/* ============================================
   Rates Section
   ============================================ */

.coach-rates[b-isuff4wr8t] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding: 0.75rem;
    background: var(--limestone-cream, #E8DCC4);
    border-radius: 0.375rem;
}

.coach-rate-item[b-isuff4wr8t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.875rem;
}

.coach-rate-label[b-isuff4wr8t] {
    color: #6b7280;
}

.coach-rate-price[b-isuff4wr8t] {
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
}

/* ============================================
   Status Badge
   ============================================ */

.coach-status-badge[b-isuff4wr8t] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 9999px;
    margin-bottom: 1rem;
}

.coach-status-badge .status-dot[b-isuff4wr8t] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.coach-status-badge.accepting[b-isuff4wr8t] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
}

.coach-status-badge.accepting .status-dot[b-isuff4wr8t] {
    background: var(--cedar-green, #2D5016);
}

.coach-status-badge.not-accepting[b-isuff4wr8t] {
    background: #f3f4f6;
    color: #6b7280;
}

.coach-status-badge.not-accepting .status-dot[b-isuff4wr8t] {
    background: #9ca3af;
}

/* ============================================
   Player IDs
   ============================================ */

.coach-player-ids[b-isuff4wr8t] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 1rem;
    font-size: 0.75rem;
    color: #6b7280;
}

/* ============================================
   Call to Action Section
   ============================================ */

.cta-section[b-isuff4wr8t] {
    max-width: 800px;
    margin: 0 auto;
    padding: 4rem 2rem;
    text-align: center;
}

.cta-title[b-isuff4wr8t] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem 0;
}

.cta-text[b-isuff4wr8t] {
    color: #6b7280;
    margin: 0 0 2rem 0;
    font-size: 1.125rem;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .filter-section[b-isuff4wr8t] {
        padding: 1.5rem 1rem;
    }

    .filter-controls[b-isuff4wr8t] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .clear-filters-btn[b-isuff4wr8t] {
        margin-left: 0;
    }

    .coaches-grid[b-isuff4wr8t] {
        padding: 2rem 1rem;
    }

    .coach-header[b-isuff4wr8t] {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .coach-info[b-isuff4wr8t] {
        text-align: center;
    }

    .coach-rating[b-isuff4wr8t] {
        justify-content: center;
    }

    .cta-section[b-isuff4wr8t] {
        padding: 3rem 1.5rem;
    }
}
/* /Components/Pages/Coach/CoachProfile.razor.rz.scp.css */
/* CoachProfile.razor.css - Scoped styles for Coach Profile page */

/* ===== Page Container ===== */
.coach-profile-page[b-n0l8r9bk4v] {
    max-width: 80rem;
    margin: 0 auto;
    padding: 2rem 1rem;
}

@media (max-width: 767px) {
    .coach-profile-page[b-n0l8r9bk4v] {
        padding: 1rem 0.5rem;
    }
}

/* ===== Loading State ===== */
.loading-container[b-n0l8r9bk4v] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
}

.loading-text[b-n0l8r9bk4v] {
    color: #4b5563;
    font-size: 1rem;
}

/* ===== No Profile Alert ===== */
.no-profile-alert[b-n0l8r9bk4v] {
    background-color: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 0.5rem;
    padding: 1.5rem;
    text-align: center;
}

.alert-icon[b-n0l8r9bk4v] {
    font-size: 2.25rem;
    line-height: 2.5rem;
    margin-bottom: 0.75rem;
}

.alert-title[b-n0l8r9bk4v] {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 0.5rem;
}

.alert-message[b-n0l8r9bk4v] {
    color: #374151;
    margin-bottom: 1rem;
}

.alert-button[b-n0l8r9bk4v] {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background-color: #1e3a8a;
    color: #ffffff;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.alert-button:hover[b-n0l8r9bk4v] {
    background-color: #1e40af;
}

/* ===== Stats Grid ===== */
.stats-grid[b-n0l8r9bk4v] {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

@media (min-width: 768px) {
    .stats-grid[b-n0l8r9bk4v] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.stat-card[b-n0l8r9bk4v] {
    background-color: #ffffff;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
}

.stat-label[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #4b5563;
    margin-bottom: 0.25rem;
}

.stat-value[b-n0l8r9bk4v] {
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
    color: #111827;
}

.stat-empty[b-n0l8r9bk4v] {
    color: #9ca3af;
}

.stat-status[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
}

.status-accepting[b-n0l8r9bk4v] {
    color: #16a34a;
}

.status-not-accepting[b-n0l8r9bk4v] {
    color: #4b5563;
}

.status-verified[b-n0l8r9bk4v] {
    color: #16a34a;
}

.status-pending[b-n0l8r9bk4v] {
    color: #ea580c;
}

/* ===== Tab Navigation ===== */
.tab-container[b-n0l8r9bk4v] {
    background-color: #ffffff;
    border-radius: 0.5rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    margin-bottom: 2rem;
}

.tab-nav-border[b-n0l8r9bk4v] {
    border-bottom: 1px solid #e5e7eb;
}

.tab-nav[b-n0l8r9bk4v] {
    display: flex;
    margin-bottom: -1px;
}

.tab-button[b-n0l8r9bk4v] {
    padding: 1rem 1.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    color: #4b5563;
    border-bottom: 2px solid transparent;
    transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1);
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
    cursor: pointer;
}

.tab-button:hover[b-n0l8r9bk4v] {
    color: #111827;
}

.tab-button.active[b-n0l8r9bk4v] {
    color: #1e3a8a;
    border-bottom-color: #1e3a8a;
}

@media (max-width: 767px) {
    .tab-button[b-n0l8r9bk4v] {
        padding: 1rem;
        font-size: 0.75rem;
    }
}

.tab-content[b-n0l8r9bk4v] {
    padding: 1.5rem;
}

/* ===== Form Elements ===== */
.form-group[b-n0l8r9bk4v] {
    margin-bottom: 1.5rem;
}

.form-label[b-n0l8r9bk4v] {
    display: block;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.5rem;
}

.required[b-n0l8r9bk4v] {
    color: #ef4444;
}

.field-hint[b-n0l8r9bk4v] {
    display: block;
    font-size: 0.8125rem;
    color: #6b7280;
    margin-top: 0.375rem;
}

/* Blazor Input Component Styling with ::deep */
[b-n0l8r9bk4v] textarea,
[b-n0l8r9bk4v] input[type="text"],
[b-n0l8r9bk4v] input[type="number"] {
    width: 100%;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    transition: all 0.2s ease;
}

[b-n0l8r9bk4v] textarea {
    line-height: 1.5;
    font-family: inherit;
}

[b-n0l8r9bk4v] textarea:focus,
[b-n0l8r9bk4v] input[type="text"]:focus,
[b-n0l8r9bk4v] input[type="number"]:focus {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-n0l8r9bk4v] input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    color: #1e3a8a;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    cursor: pointer;
}

[b-n0l8r9bk4v] input[type="checkbox"]:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-n0l8r9bk4v] input[type="file"] {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    color: #6b7280;
    cursor: pointer;
}

[b-n0l8r9bk4v] input[type="file"]::file-selector-button {
    margin-right: 1rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    border: none;
    font-size: 0.875rem;
    font-weight: 600;
    background-color: #1e3a8a;
    color: white;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

[b-n0l8r9bk4v] input[type="file"]::file-selector-button:hover {
    background-color: #1e40af;
}

[b-n0l8r9bk4v] .validation-message {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

[b-n0l8r9bk4v] .invalid {
    border-color: #ef4444;
}

[b-n0l8r9bk4v] .invalid:focus {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

/* ===== Session Types & Rates ===== */
.session-types-grid[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.session-type-row[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.checkbox-label[b-n0l8r9bk4v] {
    color: #374151;
    font-size: 0.875rem;
}

.rate-input-wrapper[b-n0l8r9bk4v] {
    flex: 1 1 0%;
    max-width: 20rem;
}

.currency-input-wrapper[b-n0l8r9bk4v] {
    position: relative;
}

.currency-symbol[b-n0l8r9bk4v] {
    position: absolute;
    left: 0.75rem;
    top: 0.5rem;
    color: #6b7280;
    font-size: 0.875rem;
}

.currency-input-wrapper[b-n0l8r9bk4v]  input[type="number"] {
    padding-left: 2rem;
}

.rate-label[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #4b5563;
}

/* ===== Checkbox Group ===== */
.checkbox-group[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ===== Pricing Sections ===== */
.pricing-section[b-n0l8r9bk4v] {
    background: var(--limestone-cream, #E8DCC4);
    border-radius: 0.5rem;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.pricing-title[b-n0l8r9bk4v] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid rgba(var(--cedar-green-rgb), 0.2);
}

.pricing-grid[b-n0l8r9bk4v] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

@media (max-width: 640px) {
    .pricing-grid[b-n0l8r9bk4v] {
        grid-template-columns: 1fr;
    }
}

.pricing-item[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.pricing-item .form-label[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #374151;
    font-weight: 500;
}

.package-summary[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.75rem;
    background: white;
    border-radius: 0.375rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
}

.package-summary i[b-n0l8r9bk4v] {
    color: var(--wheat-gold, #D4AF37);
}

/* ===== File Upload Section ===== */
.file-upload-section[b-n0l8r9bk4v] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
    background-color: #f9fafb;
}

.file-hint[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #4b5563;
    margin-bottom: 0.75rem;
}

.file-status[b-n0l8r9bk4v] {
    margin-top: 0.5rem;
    font-size: 0.875rem;
}

.file-uploading[b-n0l8r9bk4v] {
    color: #2563eb;
}

.file-selected[b-n0l8r9bk4v] {
    color: #16a34a;
}

.file-success[b-n0l8r9bk4v] {
    color: #16a34a;
}

.file-error[b-n0l8r9bk4v] {
    color: #dc2626;
}

.status-spinner[b-n0l8r9bk4v] {
    display: inline-block;
    margin-right: 0.5rem;
    animation: spin-b-n0l8r9bk4v 1s linear infinite;
}

@keyframes spin-b-n0l8r9bk4v {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.file-current[b-n0l8r9bk4v] {
    margin-top: 0.5rem;
}

.file-link[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #1e3a8a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.file-link:hover[b-n0l8r9bk4v] {
    color: #1e40af;
}

.file-date[b-n0l8r9bk4v] {
    font-size: 0.75rem;
    color: #6b7280;
    margin-left: 0.5rem;
}

/* ===== Alert Messages ===== */
.alert-error[b-n0l8r9bk4v] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.5rem;
    color: #b91c1c;
}

.alert-success[b-n0l8r9bk4v] {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.5rem;
    color: #15803d;
}

/* ===== Button Container ===== */
.button-container[b-n0l8r9bk4v] {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

/* ===== Profile View Section ===== */
.profile-view-section[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section-header[b-n0l8r9bk4v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-title[b-n0l8r9bk4v] {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: #111827;
}

.profile-details[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.detail-item[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
}

.detail-label[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    color: #4b5563;
    margin-bottom: 0.25rem;
}

.detail-value[b-n0l8r9bk4v] {
    color: #111827;
    white-space: pre-wrap;
}

.detail-rates[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.rate-item[b-n0l8r9bk4v] {
    color: #111827;
}

.certificate-status[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.certificate-verified[b-n0l8r9bk4v] {
    color: #16a34a;
    font-weight: 500;
}

.certificate-pending[b-n0l8r9bk4v] {
    color: #ea580c;
    font-weight: 500;
}

.certificate-link[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #1e3a8a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.certificate-link:hover[b-n0l8r9bk4v] {
    color: #1e40af;
}

.section-footer[b-n0l8r9bk4v] {
    padding-top: 1.5rem;
    border-top: 1px solid #e5e7eb;
}

.public-profile-link[b-n0l8r9bk4v] {
    color: #1e3a8a;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.2s ease;
}

.public-profile-link:hover[b-n0l8r9bk4v] {
    color: #1e40af;
}

/* ===== Availability Section ===== */
.availability-section[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.calendar-integration-card[b-n0l8r9bk4v] {
    background: linear-gradient(to right, #eff6ff, #eef2ff);
    border: 1px solid #bfdbfe;
    border-radius: 0.5rem;
    padding: 1.5rem;
}

.calendar-content[b-n0l8r9bk4v] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.calendar-details[b-n0l8r9bk4v] {
    flex: 1 1 0%;
}

.calendar-header[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.calendar-icon[b-n0l8r9bk4v] {
    font-size: 1.5rem;
    color: #2563eb;
}

.calendar-title[b-n0l8r9bk4v] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #111827;
}

.calendar-description[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #4b5563;
    margin-bottom: 1rem;
}

.connection-status[b-n0l8r9bk4v] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
}

.connection-status.connected[b-n0l8r9bk4v] {
    color: #15803d;
    background-color: #f0fdf4;
}

.connection-status.disconnected[b-n0l8r9bk4v] {
    color: #4b5563;
    background-color: #f3f4f6;
}

.connection-badge[b-n0l8r9bk4v] {
    font-weight: 500;
}

.button-wrapper[b-n0l8r9bk4v] {
    margin-top: 0.75rem;
}

.calendar-message[b-n0l8r9bk4v] {
    margin-top: 1rem;
    padding: 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
}

.calendar-message.error-message[b-n0l8r9bk4v] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

.calendar-message.success-message[b-n0l8r9bk4v] {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #15803d;
}

.availability-header[b-n0l8r9bk4v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.availability-title[b-n0l8r9bk4v] {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: #111827;
}

.availability-grid[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.availability-slot[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background-color: #f9fafb;
    border-radius: 0.5rem;
}

.slot-day[b-n0l8r9bk4v] {
    font-weight: 500;
    color: #111827;
}

.slot-time[b-n0l8r9bk4v] {
    color: #4b5563;
}

/* ===== Reviews Section ===== */
.reviews-section[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.reviews-title[b-n0l8r9bk4v] {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: #111827;
}

.reviews-list[b-n0l8r9bk4v] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.review-card[b-n0l8r9bk4v] {
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 1rem;
}

.review-card:last-child[b-n0l8r9bk4v] {
    border-bottom: none;
}

.review-header[b-n0l8r9bk4v] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.reviewer-info[b-n0l8r9bk4v] {
    flex: 1;
}

.reviewer-name[b-n0l8r9bk4v] {
    font-weight: 600;
    color: #111827;
}

.review-rating[b-n0l8r9bk4v] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-top: 0.25rem;
}

.star-filled[b-n0l8r9bk4v] {
    color: #fbbf24;
}

.star-empty[b-n0l8r9bk4v] {
    color: #d1d5db;
}

.review-date[b-n0l8r9bk4v] {
    font-size: 0.875rem;
    color: #6b7280;
}

.review-text[b-n0l8r9bk4v] {
    color: #374151;
    margin-top: 0.5rem;
}

/* The weekly price in parentheses after a session rate (#7588). It had no rule, so it read at
   the same weight as the rate it qualifies. */
.weekly-rate[b-n0l8r9bk4v] {
    margin-left: var(--spacing-xs);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}
/* /Components/Pages/Coach/RequestSession.razor.rz.scp.css */
/* ============================================
   Request Session Page - Editorial Design
   ============================================ */

.request-session-page[b-gdnn3z7cf5] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.content-section[b-gdnn3z7cf5] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

.loading-container[b-gdnn3z7cf5] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 300px;
}

.loading-text[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 1rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* ============================================
   Success State
   ============================================ */

.success-state[b-gdnn3z7cf5] {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.success-icon[b-gdnn3z7cf5] {
    font-size: 4rem;
    margin-bottom: 2rem;
}

.success-icon[b-gdnn3z7cf5] {
    color: var(--cedar-green);
}

.success-state h3[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.success-state p[b-gdnn3z7cf5] {
    color: #6b7280;
    margin: 0 0 2rem 0;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.success-actions[b-gdnn3z7cf5] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-primary[b-gdnn3z7cf5],
.btn-secondary[b-gdnn3z7cf5] {
    display: inline-block;
    padding: 0.875rem 2rem;
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary[b-gdnn3z7cf5] {
    background: var(--cedar-green);
    color: white;
}

.btn-primary:hover[b-gdnn3z7cf5] {
    background: #234012;
}

.btn-secondary[b-gdnn3z7cf5] {
    background: transparent;
    color: #374151;
    border: 1px solid rgba(0, 0, 0, 0.2);
}

.btn-secondary:hover[b-gdnn3z7cf5] {
    border-color: var(--cedar-green);
    color: var(--cedar-green);
}

/* ============================================
   Form Layout
   ============================================ */

.form-layout[b-gdnn3z7cf5] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 3rem;
}

/* ============================================
   Coach Sidebar
   ============================================ */

.coach-sidebar[b-gdnn3z7cf5] {
    position: sticky;
    top: 2rem;
    height: fit-content;
}

.coach-card[b-gdnn3z7cf5] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    text-align: center;
}

.coach-photo[b-gdnn3z7cf5] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 1.5rem;
    border: 3px solid var(--wheat-gold);
}

.coach-photo-placeholder[b-gdnn3z7cf5] {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0 auto 1.5rem;
    border: 3px solid var(--wheat-gold);
}

.coach-name[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
}

.coach-rating[b-gdnn3z7cf5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin-bottom: 1.5rem;
}

.star-filled[b-gdnn3z7cf5] {
    color: var(--wheat-gold);
}

.star-empty[b-gdnn3z7cf5] {
    color: #d1d5db;
}

.rating-value[b-gdnn3z7cf5] {
    margin-left: 0.5rem;
    font-weight: 600;
    color: #374151;
}

.rates-section[b-gdnn3z7cf5] {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.rates-section h4[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 1rem 0;
}

.rate-item[b-gdnn3z7cf5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
}

.rate-label[b-gdnn3z7cf5] {
    font-size: 0.875rem;
    color: #6b7280;
}

.rate-value[b-gdnn3z7cf5] {
    font-weight: 700;
    color: var(--cedar-green);
}

.verification-badge[b-gdnn3z7cf5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green);
    font-size: 0.875rem;
    font-weight: 600;
}

.verification-badge i[b-gdnn3z7cf5] {
    color: var(--cedar-green);
}

/* ============================================
   Form Container
   ============================================ */

.form-container[b-gdnn3z7cf5] {
    background: white;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.form-section[b-gdnn3z7cf5] {
    padding: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.form-section:last-of-type[b-gdnn3z7cf5] {
    border-bottom: none;
}

.section-title[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.form-row[b-gdnn3z7cf5] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.form-group[b-gdnn3z7cf5] {
    margin-bottom: 1.5rem;
}

.form-group:last-child[b-gdnn3z7cf5] {
    margin-bottom: 0;
}

.form-group label[b-gdnn3z7cf5] {
    display: block;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.required[b-gdnn3z7cf5] {
    color: #dc2626;
}

[b-gdnn3z7cf5] .form-control,
[b-gdnn3z7cf5] input.form-control,
[b-gdnn3z7cf5] select.form-control,
[b-gdnn3z7cf5] textarea.form-control {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    font-size: 0.9375rem;
    font-family: inherit;
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-gdnn3z7cf5] .form-control:focus,
[b-gdnn3z7cf5] input.form-control:focus,
[b-gdnn3z7cf5] select.form-control:focus,
[b-gdnn3z7cf5] textarea.form-control:focus {
    outline: none;
    border-color: var(--cedar-green);
}

[b-gdnn3z7cf5] textarea.form-control {
    resize: vertical;
    min-height: 100px;
}

[b-gdnn3z7cf5] select.form-control {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236B7280' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 12px;
    padding-right: 2.5rem;
}

.help-text[b-gdnn3z7cf5] {
    display: block;
    font-size: 0.75rem;
    color: #9ca3af;
    margin-top: 0.5rem;
}

/* Validation */
[b-gdnn3z7cf5] .validation-message {
    color: #dc2626;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

/* Price Estimate */
.price-estimate[b-gdnn3z7cf5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    background: rgba(var(--cedar-green-rgb), 0.05);
    border: 1px solid rgba(var(--cedar-green-rgb), 0.2);
    margin-top: 1.5rem;
}

.price-label[b-gdnn3z7cf5] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.price-value[b-gdnn3z7cf5] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
}

/* Error Message */
.error-message[b-gdnn3z7cf5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2rem;
    background: rgba(220, 38, 38, 0.05);
    border-left: 4px solid #dc2626;
    color: #dc2626;
}

.error-message i[b-gdnn3z7cf5] {
    font-size: 1.25rem;
}

/* Form Actions */
.form-actions[b-gdnn3z7cf5] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.5rem 2rem;
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.btn-cancel[b-gdnn3z7cf5] {
    padding: 0.875rem 2rem;
    background: transparent;
    color: #6b7280;
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border: 1px solid rgba(0, 0, 0, 0.2);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-cancel:hover[b-gdnn3z7cf5] {
    border-color: #374151;
    color: #374151;
}

.btn-submit[b-gdnn3z7cf5] {
    padding: 0.875rem 2rem;
    background: var(--cedar-green);
    color: white;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    border: none;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-submit:hover:not(:disabled)[b-gdnn3z7cf5] {
    background: #234012;
}

.btn-submit:disabled[b-gdnn3z7cf5] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1024px) {
    .form-layout[b-gdnn3z7cf5] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .coach-sidebar[b-gdnn3z7cf5] {
        position: static;
    }

    .coach-card[b-gdnn3z7cf5] {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        text-align: left;
        align-items: center;
    }

    .coach-photo[b-gdnn3z7cf5],
    .coach-photo-placeholder[b-gdnn3z7cf5] {
        width: 80px;
        height: 80px;
        font-size: 1.75rem;
        margin: 0;
    }

    .coach-name[b-gdnn3z7cf5] {
        margin: 0;
    }

    .coach-rating[b-gdnn3z7cf5] {
        margin: 0;
    }

    .rates-section[b-gdnn3z7cf5] {
        width: 100%;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        padding-top: 1rem;
        margin: 0;
    }

    .verification-badge[b-gdnn3z7cf5] {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .content-section[b-gdnn3z7cf5] {
        padding: 2rem;
    }

    .form-row[b-gdnn3z7cf5] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .form-section[b-gdnn3z7cf5] {
        padding: 1.5rem;
    }

    .form-actions[b-gdnn3z7cf5] {
        flex-direction: column;
        padding: 1rem 1.5rem;
    }

    .btn-cancel[b-gdnn3z7cf5],
    .btn-submit[b-gdnn3z7cf5] {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .content-section[b-gdnn3z7cf5] {
        padding: 1.5rem;
    }

    .coach-card[b-gdnn3z7cf5] {
        padding: 1.5rem;
    }

    .success-actions[b-gdnn3z7cf5] {
        flex-direction: column;
    }

    .btn-primary[b-gdnn3z7cf5],
    .btn-secondary[b-gdnn3z7cf5] {
        width: 100%;
        text-align: center;
    }
}
/* /Components/Pages/Contact.razor.rz.scp.css */
/* ============================================
   Contact Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.contact-page[b-aq7wkzfbj5] {
    background: #ffffff;
}

.contact-grid[b-aq7wkzfbj5] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    max-width: 1200px;
    margin: 8rem auto;
    padding: 0 4rem 8rem 4rem;
}

/* ============================================
   Contact Information Section
   ============================================ */

.contact-info-section h2[b-aq7wkzfbj5] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cedar-green);
    margin: 0 0 2rem 0;
    letter-spacing: -0.02em;
}

.contact-intro[b-aq7wkzfbj5] {
    font-size: 1.0625rem;
    color: #6b7280;
    margin-bottom: 3rem;
    line-height: 1.8;
}

.contact-methods[b-aq7wkzfbj5] {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.contact-method[b-aq7wkzfbj5] {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
}

.contact-icon[b-aq7wkzfbj5] {
    width: 48px;
    height: 48px;
    background: var(--cedar-green);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-icon i[b-aq7wkzfbj5] {
    font-size: 1.5rem;
    color: white;
}

.contact-details h3[b-aq7wkzfbj5] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #000000;
    margin: 0 0 0.75rem 0;
    letter-spacing: 0;
}

.contact-link[b-aq7wkzfbj5] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    font-size: 1.0625rem;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-link:hover[b-aq7wkzfbj5] {
    color: var(--cedar-green-dark);
}

.contact-text[b-aq7wkzfbj5] {
    color: #6b7280;
    line-height: 1.8;
    margin: 0;
    font-size: 1.0625rem;
}

.directions-link[b-aq7wkzfbj5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    margin-top: 0.75rem;
    font-size: 0.9375rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.directions-link:hover[b-aq7wkzfbj5] {
    color: var(--cedar-green-dark);
    gap: 0.75rem;
}

/* ============================================
   Contact Form Section
   ============================================ */

.contact-form-section h2[b-aq7wkzfbj5] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cedar-green);
    margin: 0 0 3rem 0;
    letter-spacing: -0.02em;
}

.form-group[b-aq7wkzfbj5] {
    margin-bottom: 2rem;
}

.form-label[b-aq7wkzfbj5] {
    display: block;
    font-weight: 600;
    color: #000000;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-family: var(--font-display);
}

.required[b-aq7wkzfbj5] {
    color: var(--tobacco-barn-red);
}

/* Form input styling with ::deep to target Blazor components */
[b-aq7wkzfbj5] .form-control,
.form-control[b-aq7wkzfbj5] {
    width: 100%;
    padding: 1rem 1.25rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-sans);
    background-color: transparent;
}

[b-aq7wkzfbj5] .form-control:focus,
.form-control:focus[b-aq7wkzfbj5] {
    outline: none;
    border-bottom-color: var(--cedar-green);
}

[b-aq7wkzfbj5] .form-control::placeholder,
.form-control[b-aq7wkzfbj5]::placeholder {
    color: #9ca3af;
    opacity: 1;
}

[b-aq7wkzfbj5] textarea.form-control,
textarea.form-control[b-aq7wkzfbj5] {
    resize: vertical;
    min-height: 150px;
    line-height: 1.7;
    padding-top: 0.75rem;
}

.btn-submit[b-aq7wkzfbj5] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    width: 100%;
    justify-content: center;
    background: var(--cedar-green);
    color: white;
    border: 2px solid var(--cedar-green);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-top: 1rem;
}

.btn-submit:hover[b-aq7wkzfbj5] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

.btn-submit i[b-aq7wkzfbj5] {
    font-size: 1.125rem;
}

/* ============================================
   Success Message
   ============================================ */

.success-message[b-aq7wkzfbj5] {
    text-align: center;
    padding: 4rem 2rem;
}

.success-message i[b-aq7wkzfbj5] {
    font-size: 4rem;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.success-message h3[b-aq7wkzfbj5] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #000000;
    margin: 0 0 1rem 0;
    letter-spacing: -0.02em;
}

.success-message p[b-aq7wkzfbj5] {
    font-size: 1.0625rem;
    color: #6b7280;
    line-height: 1.8;
    margin: 0;
    max-width: 600px;
    margin: 0 auto;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1024px) {
    .contact-grid[b-aq7wkzfbj5] {
        gap: 4rem;
    }
}

@media (max-width: 768px) {

    .contact-grid[b-aq7wkzfbj5] {
        grid-template-columns: 1fr;
        gap: 4rem;
        margin: 4rem auto 0;
        padding: 0 2rem;
    }

    .contact-info-section h2[b-aq7wkzfbj5],
    .contact-form-section h2[b-aq7wkzfbj5] {
        font-size: 1.75rem;
    }

    .contact-intro[b-aq7wkzfbj5] {
        font-size: 1rem;
    }

    .contact-methods[b-aq7wkzfbj5] {
        gap: 2.5rem;
    }

    .contact-method[b-aq7wkzfbj5] {
        gap: 1.25rem;
    }

    .contact-icon[b-aq7wkzfbj5] {
        width: 40px;
        height: 40px;
    }

    .contact-icon i[b-aq7wkzfbj5] {
        font-size: 1.25rem;
    }

    .contact-details h3[b-aq7wkzfbj5] {
        font-size: 1rem;
    }

    .success-message[b-aq7wkzfbj5] {
        padding: 3rem 1.5rem;
    }

    .success-message i[b-aq7wkzfbj5] {
        font-size: 3rem;
    }

    .success-message h3[b-aq7wkzfbj5] {
        font-size: 1.5rem;
    }
}
/* /Components/Pages/Error.razor.rz.scp.css */
/* The framework error page (#7588). Both headings wear .text-danger, a class carried over
   from the Blazor template's own app.css, which this project replaced - so the only thing
   telling a visitor this page reports a failure was the word "Error". Two admin pages define
   .text-danger in their own scoped stylesheets, which cannot reach here. */
.text-danger[b-oqakmf7kdp] {
    color: var(--color-error);
}
/* /Components/Pages/EventDetails.razor.rz.scp.css */
.event-details-page[b-bed8esas8q] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 var(--spacing-lg);
}

.btn-back[b-bed8esas8q] {
    padding: var(--spacing-sm) var(--spacing-lg);
    background-color: var(--color-white);
    color: var(--wilson-blue);
    border: 2px solid var(--wilson-blue);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--transition-base);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: var(--spacing-xs);
}

.btn-back:hover[b-bed8esas8q] {
    background-color: var(--wilson-blue);
    color: var(--color-white);
    transform: translateX(-4px);
}

.event-content[b-bed8esas8q] {
    background: var(--color-white);
    border: 2px solid var(--color-gray-lighter);
    border-radius: var(--radius-xl);
    padding: var(--spacing-2xl);
    box-shadow: var(--shadow-md);
}

.event-meta[b-bed8esas8q] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--spacing-lg);
    margin-bottom: var(--spacing-2xl);
    padding: var(--spacing-xl);
    background: linear-gradient(135deg, var(--color-gray-lightest) 0%, var(--color-white) 100%);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-gray-lighter);
}

.meta-item[b-bed8esas8q] {
    display: flex;
    gap: var(--spacing-md);
    align-items: flex-start;
}

.meta-icon[b-bed8esas8q] {
    font-size: var(--font-size-2xl);
    flex-shrink: 0;
}

.meta-label[b-bed8esas8q] {
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-gray);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.meta-value[b-bed8esas8q] {
    font-size: var(--font-size-lg);
    font-weight: 700;
    color: var(--cedar-green);
    margin-top: var(--spacing-xs);
}

.meta-value.free[b-bed8esas8q] {
    color: var(--color-green);
}

.time-control-category[b-bed8esas8q] {
    display: inline-block;
    margin-left: var(--spacing-sm);
    padding: var(--spacing-xs) var(--spacing-sm);
    background-color: var(--color-purple);
    color: var(--color-white);
    border-radius: var(--radius-md);
    font-size: var(--font-size-xs);
    font-weight: 600;
}

.event-section[b-bed8esas8q] {
    margin-bottom: var(--spacing-2xl);
}

.registrants-table-wrap[b-bed8esas8q] { overflow-x: auto; }
.registrants-table-wrap[b-bed8esas8q]  .registrants-grid { width: 100%; font-size: 0.95rem; }
.registrants-table-wrap[b-bed8esas8q]  .registrants-grid th,
.registrants-table-wrap[b-bed8esas8q]  .registrants-grid td { padding: 0.5rem 0.75rem; }
.registrants-table-wrap[b-bed8esas8q]  .registrants-grid thead th {
    color: var(--cedar-green, #2D5016);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: 0.78rem;
}
.registrants-table-wrap[b-bed8esas8q]  .rating-col { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

.event-section h2[b-bed8esas8q] {
    font-size: var(--font-size-2xl);
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0 0 var(--spacing-md) 0;
    padding-bottom: var(--spacing-sm);
    border-bottom: 3px solid var(--wilson-blue);
}

.event-description[b-bed8esas8q],
.event-notes[b-bed8esas8q] {
    color: var(--color-gray-dark);
    line-height: 1.75;
    white-space: pre-wrap;
    font-size: var(--font-size-base);
}

.recurrence-info[b-bed8esas8q] {
    padding: var(--spacing-lg);
    background: linear-gradient(135deg, #fef3c7 0%, #fef9e7 100%);
    border-left: 4px solid var(--color-gold);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.recurrence-info p[b-bed8esas8q] {
    margin: 0;
    color: #78350f;
    font-weight: 500;
}

.event-actions[b-bed8esas8q] {
    margin-top: var(--spacing-2xl);
    padding-top: var(--spacing-2xl);
    border-top: 2px solid var(--color-gray-lighter);
}

.btn-register[b-bed8esas8q] {
    display: inline-block;
    padding: var(--spacing-md) var(--spacing-2xl);
    background-color: var(--wilson-blue);
    color: var(--color-white);
    text-decoration: none;
    border-radius: var(--radius-lg);
    font-weight: 700;
    font-size: var(--font-size-lg);
    transition: all var(--transition-base);
    box-shadow: var(--shadow-md);
}

.btn-register:hover[b-bed8esas8q] {
    background-color: var(--wilson-blue);
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* Admin preview of a deleted or unpublished event (#8188): only a club administrator sees it. */
.admin-preview[b-bed8esas8q] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin: 1.5rem 0 0;
    padding: 0.875rem 1rem;
    background: #fffbeb;
    border: 1px solid #f59e0b;
    border-radius: 0.5rem;
    color: #78350f;
}

.admin-preview i[b-bed8esas8q] {
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.admin-preview p[b-bed8esas8q] {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

/* The way to this tournament's Tournament Control, for a viewer who may run it (owner rulings 2026-10-08 and 2026-10-10). */
.run-tournament[b-bed8esas8q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    align-items: center;
    justify-content: space-between;
    margin: 1.5rem 0 0;
    padding: 0.875rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: var(--river-pearl, #f5f5f0);
}

.run-tournament p[b-bed8esas8q] {
    flex: 1 1 16rem;
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.not-found[b-bed8esas8q] {
    text-align: center;
    padding: 4rem 2rem;
}

.not-found h2[b-bed8esas8q] {
    font-size: 1.875rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.not-found p[b-bed8esas8q] {
    color: #6b7280;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {

    .event-meta[b-bed8esas8q] {
        grid-template-columns: 1fr;
    }
}

/* ============================================
   Registration Panel
   ============================================ */

.registration-panel[b-bed8esas8q] {
    margin-top: 2rem;
    padding: 1.75rem 2rem;
    background: rgba(var(--cedar-green-rgb), 0.03);
    border-left: 4px solid var(--cedar-green, #2D5016);
}

.registration-panel h2[b-bed8esas8q] {
    margin-top: 0;
    margin-bottom: 1.25rem;
}

.reg-loading[b-bed8esas8q] {
    color: #6b7280;
    font-style: italic;
    margin: 0;
}

.reg-status[b-bed8esas8q] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    background: rgba(var(--cedar-green-rgb), 0.08);
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.reg-status-ok i[b-bed8esas8q] {
    color: var(--cedar-green, #2D5016);
    font-size: 1.5rem;
    flex-shrink: 0;
}

.reg-status p[b-bed8esas8q] {
    margin: 0.25rem 0 0 0;
    color: #4b5563;
    font-size: 0.9375rem;
}

.reg-checklist[b-bed8esas8q] {
    list-style: none;
    margin: 0 0 1.5rem 0;
    padding: 0;
}

.reg-checklist-item[b-bed8esas8q] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.reg-checklist-item:last-child[b-bed8esas8q] {
    border-bottom: none;
}

.reg-check-icon[b-bed8esas8q] {
    flex-shrink: 0;
    width: 22px;
    font-size: 1.125rem;
    line-height: 1.5;
}

.reg-checklist-item.satisfied .reg-check-icon[b-bed8esas8q] {
    color: var(--cedar-green, #2D5016);
}

.reg-checklist-item.unsatisfied .reg-check-icon[b-bed8esas8q] {
    color: #d97706;
}

.reg-check-content[b-bed8esas8q] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.reg-check-msg[b-bed8esas8q] {
    color: #111827;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.reg-checklist-item.satisfied .reg-check-msg[b-bed8esas8q] {
    color: #4b5563;
}

.reg-check-ctas[b-bed8esas8q] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    padding-top: 0.125rem;
}

.reg-check-cta[b-bed8esas8q] {
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cedar-green, #2D5016);
    text-decoration: none;
    display: inline-block;
}

.reg-check-cta:hover[b-bed8esas8q] {
    text-decoration: underline;
}

.reg-check-cta i[b-bed8esas8q] {
    font-size: 0.75em;
    margin-left: 0.25rem;
}

.reg-check-cta-secondary[b-bed8esas8q] {
    color: var(--wilson-blue, #4A6FA5);
    position: relative;
    padding-left: 1rem;
}

.reg-check-cta-secondary[b-bed8esas8q]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 0.875rem;
    background-color: rgba(0, 0, 0, 0.15);
}

.reg-action-block[b-bed8esas8q] {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.reg-section-label[b-bed8esas8q] {
    font-family: var(--font-display);
    font-weight: 600;
    color: #111827;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

[b-bed8esas8q] .reg-section-select {
    width: 100%;
    max-width: 420px;
    padding: 0.75rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-size: 0.9375rem;
    background: #ffffff;
}

[b-bed8esas8q] .reg-section-select:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.reg-rating-hint[b-bed8esas8q] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
}

.reg-error[b-bed8esas8q] {
    padding: 0.75rem 1rem;
    background: rgba(220, 38, 38, 0.08);
    border-left: 3px solid #dc2626;
    color: #b91c1c;
    font-size: 0.9375rem;
}

/* Members-only window banner */
.reg-members-window[b-bed8esas8q] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    background: rgba(var(--wheat-gold-rgb), 0.12);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
}

.reg-members-window i[b-bed8esas8q] {
    color: var(--wheat-gold, #D4AF37);
    font-size: 1.25rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.reg-members-window strong[b-bed8esas8q] {
    color: #8a6b11;
    display: block;
    font-family: var(--font-display);
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.05em;
}

.reg-members-window p[b-bed8esas8q] {
    margin: 0.25rem 0 0 0;
    color: #4b5563;
    font-size: 0.9375rem;
    line-height: 1.55;
}

/* Discount applied */
.reg-discount[b-bed8esas8q] {
    display: flex;
    gap: 0.625rem;
    align-items: center;
    padding: 0.75rem 1rem;
    background: rgba(var(--cedar-green-rgb), 0.08);
    border-left: 3px solid var(--cedar-green, #2D5016);
    color: #374151;
    font-size: 0.9375rem;
}

.reg-discount i[b-bed8esas8q] {
    color: var(--cedar-green, #2D5016);
}

.reg-strike[b-bed8esas8q] {
    text-decoration: line-through;
    color: #9ca3af;
    margin: 0 0.25rem;
}

/* Upsell for community members */
.reg-upsell[b-bed8esas8q] {
    display: flex;
    gap: 0.625rem;
    align-items: center;
    padding: 0.75rem 1rem;
    background: rgba(var(--wilson-blue-rgb), 0.08);
    border-left: 3px solid var(--wilson-blue, #4A6FA5);
    color: #374151;
    font-size: 0.9375rem;
}

.reg-upsell i[b-bed8esas8q] {
    color: var(--wheat-gold, #D4AF37);
}

.reg-upsell a[b-bed8esas8q] {
    color: var(--wilson-blue, #4A6FA5);
    font-weight: 600;
}

/* Titled-player free entry banner */
.reg-titled-banner[b-bed8esas8q] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    margin-bottom: 1.25rem;
    background: linear-gradient(90deg, rgba(184, 133, 54, 0.12), rgba(var(--wheat-gold-rgb), 0.08));
    border-left: 3px solid var(--wheat-gold, #D4AF37);
}

.reg-titled-banner i[b-bed8esas8q] {
    color: var(--wheat-gold, #D4AF37);
    font-size: 1.5rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.reg-titled-banner strong[b-bed8esas8q] {
    color: #8a6b11;
    display: block;
    font-family: var(--font-display);
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.05em;
}

.reg-titled-banner p[b-bed8esas8q] {
    margin: 0.25rem 0 0 0;
    color: #4b5563;
    font-size: 0.9375rem;
    line-height: 1.55;
}

/* ============================================
   Event flyer display
   ============================================ */

.event-flyer-section img.event-flyer-image[b-bed8esas8q] {
    max-width: 100%;
    max-height: 640px;
    display: block;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
}

.event-flyer-image-link[b-bed8esas8q] {
    display: inline-block;
}

.event-flyer-pdf[b-bed8esas8q] {
    display: inline-flex;
    align-items: center;
    gap: 0.875rem;
    padding: 1rem 1.5rem;
    background: #fff;
    border: 1px solid #d1d5db;
    text-decoration: none;
    color: #111827;
    font-weight: 600;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.event-flyer-pdf:hover[b-bed8esas8q] {
    border-color: var(--cedar-green, #2D5016);
    color: var(--cedar-green, #2D5016);
}

.event-flyer-pdf i:first-child[b-bed8esas8q] {
    font-size: 1.75rem;
    color: #dc2626;
}

.event-flyer-pdf i:last-child[b-bed8esas8q] {
    font-size: 0.8em;
    color: #6b7280;
    margin-left: 0.5rem;
}

/* ===== No-cash safety banner ===== */
.reg-cash-banner[b-bed8esas8q] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    margin: 0 0 1.25rem;
    padding: 1rem 1.25rem;
    background: #fdf6e3;
    border: 1px solid #e6d28a;
    border-left: 4px solid var(--wheat-gold, #D4AF37);
}
.reg-cash-banner > i[b-bed8esas8q] { color: var(--cedar-green, #2D5016); font-size: 1.3rem; margin-top: 0.15rem; }
.reg-cash-banner p[b-bed8esas8q] { margin: 0 0 0.5rem; color: #4b5563; font-size: 0.95rem; line-height: 1.5; }
.reg-cash-banner p:last-child[b-bed8esas8q] { margin-bottom: 0; }

/* ===== Guest (no-account) registration ===== */
.reg-guest[b-bed8esas8q] { margin-top: 0.5rem; }
.reg-guest-title[b-bed8esas8q] {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    text-transform: uppercase; letter-spacing: 0.01em;
    color: var(--cedar-green, #2D5016); margin: 0 0 0.25rem;
}
.reg-guest-blurb[b-bed8esas8q] { color: #4b5563; margin: 0 0 1rem; font-size: 0.95rem; }

.reg-guest-grid[b-bed8esas8q] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.reg-field[b-bed8esas8q] { display: flex; flex-direction: column; }
.reg-field-wide[b-bed8esas8q] { grid-column: 1 / -1; }
.reg-field label[b-bed8esas8q] { font-weight: 600; margin-bottom: 0.35rem; color: var(--cedar-green, #2D5016); }
.reg-field .opt[b-bed8esas8q] { font-weight: 400; color: var(--color-text-secondary); font-size: 0.85rem; } /* #9ca3af read 2.42:1 (#8394, WALK-1004b c5-8363) */
.reg-field .req[b-bed8esas8q] { font-weight: 400; color: var(--tobacco-barn-red, #8B4513); font-size: 0.85rem; }
.reg-field input[b-bed8esas8q],
.reg-field select[b-bed8esas8q] {
    min-height: 46px; padding: 0 0.75rem; font-size: 1rem;
    border: 1px solid #d1d5db; border-radius: 0; width: 100%;
}
.reg-field input:focus[b-bed8esas8q],
.reg-field select:focus[b-bed8esas8q] {
    outline: none; border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.uscf-row[b-bed8esas8q] { display: flex; gap: 0.5rem; align-items: stretch; }
.uscf-row .uscf-id[b-bed8esas8q] { flex: 0 0 110px; }
.uscf-row .uscf-term[b-bed8esas8q] { flex: 1 1 auto; }
.reg-uscf-find[b-bed8esas8q] {
    flex: 0 0 auto; min-height: 46px; padding: 0 1rem; border: none; cursor: pointer;
    background: var(--cedar-green, #2D5016); color: #fff; font-weight: 600;
}
.reg-uscf-find:disabled[b-bed8esas8q] { opacity: 0.5; cursor: default; }
.uscf-hint[b-bed8esas8q] { margin-top: 0.4rem; color: var(--tobacco-barn-red, #8B4513); font-size: 0.9rem; }
.uscf-results[b-bed8esas8q] { list-style: none; margin: 0.5rem 0 0; padding: 0; border: 1px solid #e5e7eb; }
.uscf-results li + li[b-bed8esas8q] { border-top: 1px solid #e5e7eb; }
.uscf-results button[b-bed8esas8q] {
    width: 100%; text-align: left; background: var(--river-pearl, #F5F5F0); border: none;
    padding: 0.7rem 0.85rem; cursor: pointer; display: flex; flex-direction: column; gap: 0.1rem;
}
.uscf-results button:hover[b-bed8esas8q] { background: var(--limestone-cream, #E8DCC4); }
.uscf-name[b-bed8esas8q] { font-weight: 700; color: var(--cedar-green, #2D5016); }
/* The same muted line as the kiosk's (#8289), on the same token. */
.uscf-meta[b-bed8esas8q] { color: var(--color-text-secondary); font-size: 0.85rem; }

/* The shared Button renders in its own scope — reach it with ::deep. */
.reg-guest[b-bed8esas8q]  .btn { margin-top: 1.25rem; }

.reg-guest-alt[b-bed8esas8q] { margin-top: 1rem; font-size: 0.9rem; color: #4b5563; }
/* A link in the line is underlined, not told from its sentence by color alone: the link blue against the line's
   gray was 1.47:1 (#8397, WALK-1004b b4-8363: axe link-in-text-block on the guest refusal's "sign in"). */
.reg-guest-alt a[b-bed8esas8q] { color: var(--wilson-blue, #4A6FA5); text-decoration: underline; }

@media (max-width: 560px) {
    .reg-guest-grid[b-bed8esas8q] { grid-template-columns: 1fr; }
}

/* Wall chart (combined standings + prize-category leaders) */
.wallchart[b-bed8esas8q] { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.wallchart th[b-bed8esas8q], .wallchart td[b-bed8esas8q] {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    text-align: left;
}
.wallchart th[b-bed8esas8q] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #888;
}
.wc-rank[b-bed8esas8q] { width: 2.5rem; color: #999; }
.wc-rtg[b-bed8esas8q] { color: #666; }
.wc-num[b-bed8esas8q] { text-align: right; }
.wc-total[b-bed8esas8q], .wc-total-h[b-bed8esas8q] { font-weight: 700; }
.wc-total[b-bed8esas8q] { color: var(--cedar-green, #2D5016); }

/* Wall-chart header with export buttons */
.wc-head[b-bed8esas8q] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}
.wc-exports[b-bed8esas8q] { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* Wall-chart tabs (Current Standings / Cross Tables) */
.wc-tabs[b-bed8esas8q] {
    display: inline-flex;
    border: 1px solid var(--cedar-green, #2D5016);
    margin-bottom: 1.25rem;
}
.wc-tab[b-bed8esas8q] {
    border: none;
    background: #ffffff;
    color: var(--cedar-green, #2D5016);
    font-family: var(--font-display, inherit);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 1.1rem;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}
.wc-tab + .wc-tab[b-bed8esas8q] { border-left: 1px solid var(--cedar-green, #2D5016); }
.wc-tab.active[b-bed8esas8q] { background: var(--cedar-green, #2D5016); color: #ffffff; }
.wc-tab:hover:not(.active)[b-bed8esas8q] { background: var(--limestone-cream, #E8DCC4); }

/* Cross table */
.wc-ct-title[b-bed8esas8q] {
    font-size: 1.05rem;
    margin: 1.25rem 0 0.5rem;
    color: var(--cedar-green, #2D5016);
}
.crosstable .wc-cell[b-bed8esas8q] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    border-left: 3px solid transparent;
}
.crosstable .wc-cell-white[b-bed8esas8q] { border-left-color: #d9d2bf; }       /* played white */
.crosstable .wc-cell-black[b-bed8esas8q] { border-left-color: #2b2b2b; }       /* played black */
.wc-ct-legend[b-bed8esas8q] {
    margin-top: 0.75rem;
    font-size: 0.8rem;
    color: #666;
}
.legend-swatch[b-bed8esas8q] {
    border-left: 3px solid transparent;
    padding-left: 0.3rem;
}
.wc-prize[b-bed8esas8q] {
    display: inline-block;
    margin: 0.1rem 0.25rem 0.1rem 0;
    padding: 0.15rem 0.55rem;
    background: var(--wheat-gold, #D4AF37);
    color: #2a2200;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}

/* External-organization listing (Club Director submission) */
.external-listing .external-note[b-bed8esas8q] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    background: #f3f6ef;
    border-left: 3px solid var(--cedar-green, #2D5016);
    padding: 0.85rem 1rem;
    border-radius: 0.35rem;
    color: #374151;
    font-size: 0.92rem;
    margin: 0 0 1rem;
}
.external-listing .external-note i[b-bed8esas8q] { color: var(--cedar-green, #2D5016); margin-top: 0.15rem; }
.external-info[b-bed8esas8q] {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
    display: grid;
    gap: 0.4rem;
}
.external-info li[b-bed8esas8q] {
    font-size: 0.92rem;
    color: #374151;
    padding-left: 1.1rem;
    position: relative;
}
.external-info li[b-bed8esas8q]::before {
    content: '\2022';
    color: var(--wheat-gold, #D4AF37);
    position: absolute;
    left: 0;
    font-weight: 700;
}


/* The help line under a form control, and the note a drop-in event shows in place of a
   registration form (#7588). Both rendered with no rule anywhere in the project, so the help
   text came out at body size in body colour and read as a claim rather than a footnote.
   The section form shared this sentence under a second class name, reg-section-help, which is
   now field-help too - one sentence, one rule. */
.field-help[b-bed8esas8q] {
    display: block;
    margin-top: var(--spacing-xs);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    line-height: 1.5;
}

/* A link inside help text is underlined, so it is told apart from the sentence by more than
   color (WCAG 1.4.1; #8296 walk B1: the TCA "Join at tnchess.us" link read at 1.36-1.47:1). */
.field-help a[b-bed8esas8q] {
    text-decoration: underline;
}

.reg-dropin[b-bed8esas8q] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--font-size-sm);
    line-height: 1.6;
}

/* #8296: the TCA member ID beside the register button, and the guest form's field. */
.reg-tca[b-bed8esas8q] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.reg-tca .req[b-bed8esas8q] {
    font-family: var(--font-body, inherit);
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    color: var(--tobacco-barn-red);
}

.reg-tca-id[b-bed8esas8q] {
    min-height: 46px;
    padding: 0 0.75rem;
    font-size: 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0;
    width: 100%;
    max-width: 22rem;
    box-sizing: border-box;
}

.reg-tca-id:focus[b-bed8esas8q] {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

.reg-tca .field-help[b-bed8esas8q],
.reg-field .field-help[b-bed8esas8q] {
    color: var(--color-text-secondary);
    font-size: 0.875rem;
    line-height: 1.5;
}

.reg-tca-on-file[b-bed8esas8q] {
    margin: 0;
    color: #374151;
    font-size: 0.9375rem;
    overflow-wrap: anywhere;
}

/* ===== #8383: a family's primary registers a member of their family ===== */
.reg-family[b-bed8esas8q] {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    min-width: 0;
}
.reg-family .reg-guest-blurb a[b-bed8esas8q] { color: var(--wilson-blue, #4A6FA5); }
.reg-family .reg-error[b-bed8esas8q] { margin-top: 1rem; }
/* The shared Button renders in its own scope — reach it with ::deep. */
.reg-family[b-bed8esas8q]  .btn { margin-top: 1.25rem; }
.reg-family-done[b-bed8esas8q] {
    margin: 1rem 0 0;
    padding: 0.75rem 1rem;
    border-left: 3px solid var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.08);
    color: #1f2937;
    overflow-wrap: break-word;
}
/* /Components/Pages/EventRegistrationConfirm.razor.rz.scp.css */
.confirm-page[b-byevhk5po6] {
    min-height: 60vh;
    background: #ffffff;
    padding: 4rem 2rem;
}

.confirm-container[b-byevhk5po6] {
    max-width: 560px;
    margin: 0 auto;
}

.confirm-card[b-byevhk5po6] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    padding: 3rem 2.5rem;
    text-align: center;
    position: relative;
}

.accent-line[b-byevhk5po6] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--cedar-green, #2D5016) 0%, var(--wheat-gold, #D4AF37) 100%);
}

.confirm-icon[b-byevhk5po6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    margin: 0 auto 1.5rem auto;
    font-size: 2.25rem;
}

.confirm-icon-processing[b-byevhk5po6] {
    background: rgba(var(--wilson-blue-rgb), 0.08);
    color: var(--wilson-blue, #4A6FA5);
}

.confirm-icon-success[b-byevhk5po6] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
}

.confirm-icon-error[b-byevhk5po6] {
    background: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}

.confirm-card h1[b-byevhk5po6] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
    letter-spacing: -0.01em;
}

.confirm-sub[b-byevhk5po6] {
    color: #6b7280;
    line-height: 1.6;
    margin: 0 0 2rem 0;
    font-size: 1rem;
}

.confirm-actions[b-byevhk5po6] {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-primary[b-byevhk5po6],
.btn-secondary[b-byevhk5po6] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    padding: 0.75rem 1.75rem;
    border: 2px solid;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary[b-byevhk5po6] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border-color: var(--cedar-green, #2D5016);
}

.btn-primary:hover[b-byevhk5po6] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

.btn-secondary[b-byevhk5po6] {
    background: transparent;
    color: #111827;
    border-color: #d1d5db;
}

.btn-secondary:hover[b-byevhk5po6] {
    border-color: #111827;
}
/* /Components/Pages/Events.razor.rz.scp.css */
/* ============================================
   Events Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.events-page[b-jq3m6rzro5] {
    background: #ffffff;
}

/* ============================================
   Content Container
   ============================================ */

.view-toggle-container[b-jq3m6rzro5],
.events-container[b-jq3m6rzro5],
.filter-section[b-jq3m6rzro5],
.events-empty[b-jq3m6rzro5],
.events-grid[b-jq3m6rzro5] {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 4rem;
    padding-right: 4rem;
}

/* ============================================
   Events Grid - List Layout
   ============================================ */

.events-grid[b-jq3m6rzro5] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.view-toggle-container[b-jq3m6rzro5] {
    margin-top: 8rem;
}

/* ============================================
   Filters - Editorial Style
   ============================================ */

.filters[b-jq3m6rzro5] {
    max-width: 1200px;
    margin: 0 auto 3rem auto;
    padding: 0 4rem;
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.filter-group[b-jq3m6rzro5] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.filter-group label[b-jq3m6rzro5] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    white-space: nowrap;
}

.filter-select[b-jq3m6rzro5] {
    padding: 0.625rem 2rem 0.625rem 1rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    background: transparent;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    min-width: 140px;
}

.filter-select:hover[b-jq3m6rzro5] {
    border-bottom-color: rgba(0, 0, 0, 0.3);
}

.filter-select:focus[b-jq3m6rzro5] {
    outline: none;
    border-bottom-color: var(--cedar-green);
}

/* Style for Blazor InputSelect if used */
[b-jq3m6rzro5] select {
    padding: 0.625rem 2rem 0.625rem 1rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    background: transparent;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    min-width: 140px;
}

[b-jq3m6rzro5] select:hover {
    border-bottom-color: rgba(0, 0, 0, 0.3);
}

[b-jq3m6rzro5] select:focus {
    outline: none;
    border-bottom-color: var(--cedar-green);
}

/* ============================================
   View Toggle - Minimal Tabs
   ============================================ */

.view-toggle-container[b-jq3m6rzro5] {
    display: flex;
    justify-content: center;
    margin-bottom: 4rem;
}

.view-toggle[b-jq3m6rzro5] {
    display: inline-flex;
    gap: 0;
}

.toggle-btn[b-jq3m6rzro5] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
}

.toggle-btn:hover:not(.active)[b-jq3m6rzro5] {
    color: #000000;
    border-bottom-color: rgba(0, 0, 0, 0.2);
}

.toggle-btn.active[b-jq3m6rzro5] {
    color: #000000;
    border-bottom-color: #000000;
}

.toggle-btn i[b-jq3m6rzro5] {
    font-size: 1em;
}

/* ============================================
   Events Container - List Layout
   ============================================ */

.events-container[b-jq3m6rzro5] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ============================================
   Event Item - Editorial Style
   ============================================ */

.event-item[b-jq3m6rzro5] {
    padding: 3rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.event-item:last-child[b-jq3m6rzro5] {
    border-bottom: none;
}

/* ============================================
   Calendar View Container Wrapper
   ============================================ */

.calendar-wrapper[b-jq3m6rzro5] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
}

.calendar-header[b-jq3m6rzro5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.calendar-title[b-jq3m6rzro5] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    letter-spacing: 0;
}

.calendar-nav[b-jq3m6rzro5] {
    display: flex;
    gap: 1rem;
}

.nav-btn[b-jq3m6rzro5] {
    padding: 0.75rem 1.5rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    color: #6b7280;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
}

.nav-btn:hover[b-jq3m6rzro5] {
    border-bottom-color: var(--cedar-green);
    color: var(--cedar-green);
}

/* ============================================
   List View
   ============================================ */

.list-view[b-jq3m6rzro5] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ============================================
   Filter Section - Minimal
   ============================================ */

.filter-section[b-jq3m6rzro5] {
    padding: 2rem 0;
    margin-bottom: 3rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.filter-title[b-jq3m6rzro5] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-options[b-jq3m6rzro5] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.filter-btn[b-jq3m6rzro5] {
    padding: 0.75rem 1.5rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    color: #6b7280;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-btn:hover[b-jq3m6rzro5] {
    border-bottom-color: var(--cedar-green);
    color: var(--cedar-green);
}

.filter-btn.active[b-jq3m6rzro5] {
    color: var(--cedar-green);
    border-bottom-color: var(--cedar-green);
}

/* ============================================
   No Events Message
   ============================================ */

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {

    .view-toggle-container[b-jq3m6rzro5],
    .events-container[b-jq3m6rzro5],
    .filter-section[b-jq3m6rzro5],
    .events-empty[b-jq3m6rzro5],
    .calendar-wrapper[b-jq3m6rzro5],
    .events-grid[b-jq3m6rzro5],
    .filters[b-jq3m6rzro5] {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .view-toggle-container[b-jq3m6rzro5] {
        margin-top: 4rem;
    }

    .filters[b-jq3m6rzro5] {
        flex-direction: column;
        align-items: stretch;
        gap: 1.5rem;
    }

    .filter-group[b-jq3m6rzro5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .filter-select[b-jq3m6rzro5],
    [b-jq3m6rzro5] select {
        width: 100%;
        min-width: unset;
    }

    .view-toggle[b-jq3m6rzro5] {
        width: 100%;
    }

    /* Two equal halves of the row. At 344px "CALENDAR VIEW" with its old side padding needed
       more than half the width and the row ran 28px past the screen (#8149): the halves may
       shrink and their label may wrap, so the row is never wider than the page. */
    .toggle-btn[b-jq3m6rzro5] {
        flex: 1 1 0;
        min-width: 0;
        justify-content: center;
        text-align: center;
        white-space: normal;
        gap: 0.5rem;
        padding: 0.875rem 0.5rem;
        font-size: 0.875rem;
    }

    .event-item[b-jq3m6rzro5] {
        padding: 2rem 0;
    }

    .calendar-container[b-jq3m6rzro5] {
        padding-bottom: 3rem;
    }

    .calendar-header[b-jq3m6rzro5] {
        flex-direction: column;
        gap: 1.5rem;
        align-items: flex-start;
    }

    .calendar-nav[b-jq3m6rzro5] {
        width: 100%;
        justify-content: space-between;
    }

    .filter-section[b-jq3m6rzro5] {
        padding: 1.5rem 0;
        margin-bottom: 2rem;
    }

    .filter-options[b-jq3m6rzro5] {
        flex-direction: column;
    }

    .filter-btn[b-jq3m6rzro5] {
        width: 100%;
        text-align: center;
    }
}
/* /Components/Pages/Faq.razor.rz.scp.css */
.faq-page[b-yfoimjhsee] {
    max-width: var(--container-lg);
    margin: 0 auto;
    padding: var(--spacing-2xl) var(--spacing-lg);
}

.faq-intro[b-yfoimjhsee] {
    text-align: center;
    margin-bottom: var(--spacing-2xl);
    font-size: var(--font-size-lg);
    color: var(--color-gray-dark);
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.faq-intro a[b-yfoimjhsee] {
    color: var(--wilson-blue);
    text-decoration: none;
    font-weight: 600;
}

.faq-intro a:hover[b-yfoimjhsee] {
    text-decoration: underline;
}

.faq-category[b-yfoimjhsee] {
    margin-bottom: var(--spacing-3xl);
}

.category-title[b-yfoimjhsee] {
    font-family: var(--font-display);
    font-size: var(--font-size-3xl);
    color: var(--cedar-green);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: var(--spacing-xl);
    padding-bottom: var(--spacing-md);
    border-bottom: 3px solid var(--wilson-blue);
}

.faq-list[b-yfoimjhsee] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.faq-item[b-yfoimjhsee] {
    background: #ffffff;
    border: 2px solid var(--color-gray-light);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    transition: all 0.3s ease;
}

.faq-item:hover[b-yfoimjhsee] {
    border-color: var(--wilson-blue);
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.1);
}

.faq-question[b-yfoimjhsee] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.2s ease;
    font-size: var(--font-size-lg);
    font-weight: 600;
    color: var(--cedar-green);
}

.faq-question:hover[b-yfoimjhsee] {
    background-color: var(--color-gray-lightest);
}

.question-icon[b-yfoimjhsee] {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--wilson-blue) 0%, var(--cedar-green) 100%);
    color: #ffffff;
    border-radius: 50%;
    font-size: var(--font-size-xl);
    font-weight: bold;
    line-height: 1;
}

.question-text[b-yfoimjhsee] {
    flex: 1;
}

.faq-answer[b-yfoimjhsee] {
    padding: 0 var(--spacing-lg) var(--spacing-lg) var(--spacing-lg);
    color: var(--color-gray-dark);
    line-height: 1.8;
    font-size: var(--font-size-base);
    animation: fadeIn-b-yfoimjhsee 0.3s ease;
}

@keyframes fadeIn-b-yfoimjhsee {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.faq-contact[b-yfoimjhsee] {
    margin-top: var(--spacing-4xl);
    padding: var(--spacing-3xl) 0;
    border-top: 2px solid var(--color-gray-light);
}

.contact-box[b-yfoimjhsee] {
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
}

.contact-box h3[b-yfoimjhsee] {
    font-family: var(--font-display);
    font-size: var(--font-size-3xl);
    color: var(--cedar-green);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: var(--spacing-md);
}

.contact-box p[b-yfoimjhsee] {
    font-size: var(--font-size-lg);
    color: var(--color-gray-dark);
    margin-bottom: var(--spacing-xl);
}

.contact-methods[b-yfoimjhsee] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.contact-button[b-yfoimjhsee] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background: linear-gradient(135deg, var(--wilson-blue) 0%, var(--cedar-green) 100%);
    color: #ffffff;
    text-decoration: none;
    border-radius: var(--border-radius-lg);
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 102, 204, 0.2);
}

.contact-button:hover[b-yfoimjhsee] {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 102, 204, 0.3);
}

.contact-button i[b-yfoimjhsee] {
    font-size: var(--font-size-xl);
}

@media (max-width: 768px) {
    .faq-page[b-yfoimjhsee] {
        padding: var(--spacing-xl) var(--spacing-md);
    }

    .category-title[b-yfoimjhsee] {
        font-size: var(--font-size-2xl);
    }

    .faq-question[b-yfoimjhsee] {
        font-size: var(--font-size-base);
        padding: var(--spacing-md);
    }

    .question-icon[b-yfoimjhsee] {
        width: 28px;
        height: 28px;
        font-size: var(--font-size-lg);
    }

    .contact-box h3[b-yfoimjhsee] {
        font-size: var(--font-size-2xl);
    }
}
/* /Components/Pages/GroupSessions/GroupSessionConfirm.razor.rz.scp.css */
/* ============================================
   Group Session Payment Confirm Page
   ============================================ */

.confirm-container[b-7fckdq5tr2] {
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4rem 2rem;
    background: #ffffff;
}

/* ============================================
   Processing State
   ============================================ */

.processing-state[b-7fckdq5tr2] {
    text-align: center;
    max-width: 500px;
}

.processing-state .spinner[b-7fckdq5tr2] {
    font-size: 3rem;
    color: var(--cedar-green);
    margin-bottom: 2rem;
}

.processing-state h1[b-7fckdq5tr2] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem 0;
}

.processing-state p[b-7fckdq5tr2] {
    font-size: 1rem;
    color: #6b7280;
    margin: 0 0 0.5rem 0;
}

.processing-state .note[b-7fckdq5tr2] {
    font-size: 0.875rem;
    color: #9ca3af;
    font-style: italic;
}

/* ============================================
   Error State
   ============================================ */

.error-state[b-7fckdq5tr2] {
    text-align: center;
    max-width: 500px;
}

.error-state > i[b-7fckdq5tr2] {
    font-size: 3rem;
    color: #dc2626;
    margin-bottom: 1.5rem;
}

.error-state h1[b-7fckdq5tr2] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem 0;
}

.error-state .error-message[b-7fckdq5tr2] {
    font-size: 1rem;
    color: #dc2626;
    margin: 0 0 2rem 0;
}

.error-actions[b-7fckdq5tr2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
}

/* ============================================
   Success State
   ============================================ */

.success-state[b-7fckdq5tr2] {
    text-align: center;
    max-width: 500px;
}

.success-state > i[b-7fckdq5tr2] {
    font-size: 3rem;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.success-state h1[b-7fckdq5tr2] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem 0;
}

.success-state p[b-7fckdq5tr2] {
    font-size: 1rem;
    color: #374151;
    margin: 0 0 2rem 0;
    line-height: 1.6;
}

.success-state strong[b-7fckdq5tr2] {
    color: #000000;
}

.success-actions[b-7fckdq5tr2] {
    display: flex;
    gap: 1rem;
    justify-content: center;
}

/* ============================================
   Buttons
   ============================================ */

.btn[b-7fckdq5tr2] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 2rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-primary[b-7fckdq5tr2] {
    background: var(--cedar-green);
    color: #ffffff;
    border: none;
}

.btn-primary:hover[b-7fckdq5tr2] {
    background: #1a3a0d;
    transform: translateY(-1px);
}

.btn-secondary[b-7fckdq5tr2] {
    background: transparent;
    color: #6b7280;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

.btn-secondary:hover[b-7fckdq5tr2] {
    border-color: rgba(0, 0, 0, 0.3);
    color: #374151;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 480px) {
    .confirm-container[b-7fckdq5tr2] {
        padding: 2rem 1.5rem;
    }

    .error-actions[b-7fckdq5tr2],
    .success-actions[b-7fckdq5tr2] {
        flex-direction: column;
    }
}
/* /Components/Pages/GroupSessions/GroupSessionDetail.razor.rz.scp.css */
/* ============================================
   Group Session Detail - Editorial Design
   ============================================ */

.session-detail-page[b-xpn7jpugl2] {
    background: #ffffff;
}

.back-link[b-xpn7jpugl2] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.back-link:hover[b-xpn7jpugl2] {
    color: var(--wheat-gold);
}

.back-link i[b-xpn7jpugl2] {
    font-size: 0.75rem;
}

.hero-meta[b-xpn7jpugl2] {
    display: flex;
    gap: 0.5rem;
}

.format-tag[b-xpn7jpugl2] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.format-tag.inperson[b-xpn7jpugl2] {
    background: rgba(var(--cedar-green-rgb), 0.3);
    color: #a3d977;
}

.format-tag.online[b-xpn7jpugl2] {
    background: rgba(var(--wilson-blue-rgb), 0.3);
    color: #93b5e0;
}

.skill-tag[b-xpn7jpugl2] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(var(--wheat-gold-rgb), 0.3);
    color: var(--wheat-gold);
}

/* ============================================
   Content Layout
   ============================================ */

.page-content[b-xpn7jpugl2] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

.detail-layout[b-xpn7jpugl2] {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 4rem;
}

.detail-main[b-xpn7jpugl2] {
    min-width: 0;
}

.detail-section[b-xpn7jpugl2] {
    margin-bottom: 3rem;
}

.section-title[b-xpn7jpugl2] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #000000;
    margin: 0 0 1rem 0;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #000000;
}

.description[b-xpn7jpugl2] {
    font-size: 1.0625rem;
    line-height: 1.8;
    color: #374151;
    margin: 0;
    white-space: pre-line;
}

/* ============================================
   Sidebar Info Card
   ============================================ */

.info-card[b-xpn7jpugl2] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    position: sticky;
    top: 2rem;
}

.info-title[b-xpn7jpugl2] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #000000;
    margin: 0 0 1.5rem 0;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #000000;
}

.info-items[b-xpn7jpugl2] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.info-item[b-xpn7jpugl2] {
    display: flex;
    gap: 0.75rem;
}

.info-item i[b-xpn7jpugl2] {
    color: var(--cedar-green);
    width: 1rem;
    text-align: center;
    margin-top: 0.125rem;
}

.info-item div[b-xpn7jpugl2] {
    display: flex;
    flex-direction: column;
}

.info-label[b-xpn7jpugl2] {
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
}

.info-value[b-xpn7jpugl2] {
    font-size: 0.9375rem;
    color: #000000;
    font-weight: 500;
}

/* ============================================
   Pricing
   ============================================ */

.pricing-section[b-xpn7jpugl2] {
    padding: 1.25rem 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    margin-bottom: 1.5rem;
}

.price-row[b-xpn7jpugl2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.375rem 0;
    font-size: 0.9375rem;
    color: #374151;
}

.price-value[b-xpn7jpugl2] {
    font-weight: 700;
    color: #000000;
}

.price-value.free[b-xpn7jpugl2] {
    color: var(--cedar-green);
}

/* ============================================
   Registration
   ============================================ */

.registration-section[b-xpn7jpugl2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.btn-register[b-xpn7jpugl2] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 1rem;
    background: var(--cedar-green);
    color: #ffffff;
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-register:hover:not(:disabled)[b-xpn7jpugl2] {
    background: #1a3a0d;
    transform: translateY(-1px);
}

.btn-register:disabled[b-xpn7jpugl2] {
    opacity: 0.6;
    cursor: not-allowed;
}

.register-note[b-xpn7jpugl2] {
    font-size: 0.8125rem;
    color: #6b7280;
    text-align: center;
    margin: 0;
}

.register-note a[b-xpn7jpugl2] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
}

.register-note a:hover[b-xpn7jpugl2] {
    text-decoration: underline;
}

.status-message[b-xpn7jpugl2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    font-size: 0.9375rem;
    font-weight: 500;
}

.status-message.registered[b-xpn7jpugl2] {
    background: rgba(var(--cedar-green-rgb), 0.08);
    color: var(--cedar-green);
}

.status-message.full[b-xpn7jpugl2] {
    background: rgba(107, 114, 128, 0.08);
    color: #6b7280;
}

.status-message.cancelled[b-xpn7jpugl2] {
    background: rgba(239, 68, 68, 0.08);
    color: #dc2626;
}

.error-message[b-xpn7jpugl2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: rgba(239, 68, 68, 0.05);
    border: 1px solid rgba(239, 68, 68, 0.2);
    color: #dc2626;
    font-size: 0.875rem;
}

.success-message[b-xpn7jpugl2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem;
    background: rgba(var(--cedar-green-rgb), 0.05);
    border: 1px solid rgba(var(--cedar-green-rgb), 0.2);
    color: var(--cedar-green);
    font-size: 0.875rem;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 1024px) {
    .detail-layout[b-xpn7jpugl2] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .info-card[b-xpn7jpugl2] {
        position: static;
    }
}

@media (max-width: 768px) {
    .page-content[b-xpn7jpugl2] {
        padding: 2rem;
    }
}

@media (max-width: 480px) {
    .page-content[b-xpn7jpugl2] {
        padding: 1.5rem;
    }

    .info-card[b-xpn7jpugl2] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/GroupSessions/GroupSessions.razor.rz.scp.css */
/* ============================================
   Group Sessions Public Listing - Editorial
   ============================================ */

.group-sessions-page[b-eb1llo0wij] {
    background: #ffffff;
}

/* ============================================
   Content
   ============================================ */

.page-content[b-eb1llo0wij] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Sessions Grid
   ============================================ */

.sessions-grid[b-eb1llo0wij] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(380px, 100%), 1fr));
    gap: 2rem;
}

.session-card[b-eb1llo0wij] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.session-card:hover[b-eb1llo0wij] {
    border-color: var(--cedar-green);
}

.session-header[b-eb1llo0wij] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.format-tag[b-eb1llo0wij] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.format-tag.inperson[b-eb1llo0wij] {
    background: rgba(var(--cedar-green-rgb), 0.15);
    color: var(--cedar-green);
}

.format-tag.online[b-eb1llo0wij] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.skill-tag[b-eb1llo0wij] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #92400e;
}

.session-title[b-eb1llo0wij] {
    font-family: var(--font-display);
    font-size: 1.375rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.25rem 0;
    line-height: 1.2;
}

.session-details[b-eb1llo0wij] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    margin-bottom: 1.5rem;
    flex: 1;
}

.detail-item[b-eb1llo0wij] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.9375rem;
    color: #374151;
}

.detail-item i[b-eb1llo0wij] {
    color: var(--cedar-green);
    width: 1rem;
    text-align: center;
    margin-top: 0.125rem;
}

.session-footer[b-eb1llo0wij] {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.capacity-info[b-eb1llo0wij] {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
}

.capacity-count[b-eb1llo0wij] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    color: var(--cedar-green);
}

.capacity-label[b-eb1llo0wij] {
    font-size: 0.8125rem;
    color: #6b7280;
}

.pricing-info[b-eb1llo0wij] {
    display: flex;
    gap: 1rem;
    font-size: 0.8125rem;
}

.price-free[b-eb1llo0wij] {
    color: var(--cedar-green);
    font-weight: 600;
}

.price-community[b-eb1llo0wij] {
    color: #6b7280;
}

.full-badge[b-eb1llo0wij] {
    display: inline-block;
    padding: 0.5rem 1rem;
    background: rgba(107, 114, 128, 0.1);
    color: #6b7280;
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-align: center;
}

.register-link[b-eb1llo0wij] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green);
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: gap 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.register-link:hover[b-eb1llo0wij] {
    gap: 0.75rem;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .page-content[b-eb1llo0wij] {
        padding: 2rem;
    }

    .sessions-grid[b-eb1llo0wij] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .page-content[b-eb1llo0wij] {
        padding: 1.5rem;
    }

    .session-card[b-eb1llo0wij] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Kiosk/KioskResults.razor.rz.scp.css */
.kr-tabs[b-4f4tdl1ht1] { display: flex; gap: 0.5rem; }
.kr-tab[b-4f4tdl1ht1] {
    padding: 0.6rem 1.4rem;
    border: 2px solid rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    background: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    cursor: pointer;
}
.kr-tab.on[b-4f4tdl1ht1] {
    background: var(--cedar-green, #2D5016);
    border-color: var(--cedar-green, #2D5016);
    color: #fff;
}

.kr-progress[b-4f4tdl1ht1] {
    margin: 0.5rem 0 1rem;
    color: #666;
    font-weight: 600;
}

.kr-boards[b-4f4tdl1ht1] { display: flex; flex-direction: column; gap: 0.6rem; }

.kr-board[b-4f4tdl1ht1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.9rem;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 10px;
    background: #fff;
}

.kr-bd[b-4f4tdl1ht1] {
    flex: 0 0 2.2rem;
    text-align: center;
    font-weight: 700;
    color: #999;
}

.kr-name[b-4f4tdl1ht1] {
    flex: 1 1 0;
    font-size: 1.15rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.kr-white[b-4f4tdl1ht1] { text-align: right; }
.kr-black[b-4f4tdl1ht1] { text-align: left; }
.kr-name.won[b-4f4tdl1ht1] { font-weight: 800; color: var(--cedar-green, #2D5016); }
.kr-rtg[b-4f4tdl1ht1] { color: #9ca3af; font-size: 0.9rem; font-weight: 400; }

.kr-actions[b-4f4tdl1ht1] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* Big touch result buttons */
.kr-btn[b-4f4tdl1ht1] {
    min-width: 5.5rem;
    min-height: 3.4rem;
    padding: 0 0.9rem;
    border: 2px solid #bbb;
    border-radius: 10px;
    font-size: 1.05rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.05s ease;
}
.kr-btn:active[b-4f4tdl1ht1] { transform: scale(0.96); }
.kr-btn.kr-w[b-4f4tdl1ht1] { background: #ffffff; color: #111; }
.kr-btn.kr-d[b-4f4tdl1ht1] { background: #f0f0ea; color: #555; min-width: 3.6rem; font-size: 1.3rem; }
.kr-btn.kr-b[b-4f4tdl1ht1] { background: #1c1c1c; color: #fff; border-color: #1c1c1c; }

.kr-chosen[b-4f4tdl1ht1] {
    min-width: 7rem;
    min-height: 3.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 1.05rem;
    font-weight: 800;
    border: 2px solid var(--wheat-gold, #D4AF37);
}
.kr-chosen.kr-w[b-4f4tdl1ht1] { background: #fff; color: #111; }
.kr-chosen.kr-d[b-4f4tdl1ht1] { background: #f0f0ea; color: #555; }
.kr-chosen.kr-b[b-4f4tdl1ht1] { background: #1c1c1c; color: #fff; }

.kr-edit[b-4f4tdl1ht1] {
    min-width: 3.2rem;
    min-height: 3.4rem;
    border: 2px solid #ccc;
    border-radius: 10px;
    background: #fff;
    color: var(--wilson-blue, #4A6FA5);
    font-size: 1rem;
    cursor: pointer;
}

.kr-bye[b-4f4tdl1ht1] {
    min-height: 3.4rem;
    display: inline-flex;
    align-items: center;
    color: #999;
    font-style: italic;
    font-weight: 600;
}
/* /Components/Pages/Ladder/JoinLadder.razor.rz.scp.css */
/* ===== Join Ladder Page ===== */

.join-page[b-qzkn5ij6na] {
    background: #ffffff;
    min-height: 100vh;
}

/* Loading */
.loading-state[b-qzkn5ij6na] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem;
    gap: 1rem;
    color: #6b7280;
}

.loading-spinner[b-qzkn5ij6na] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-qzkn5ij6na 0.8s linear infinite;
}

@keyframes spin-b-qzkn5ij6na {
    to { transform: rotate(360deg); }
}

/* Already Joined */
.already-joined[b-qzkn5ij6na] {
    text-align: center;
    padding: 4rem 2rem;
    max-width: 600px;
    margin: 0 auto;
}

.already-joined h2[b-qzkn5ij6na] {
    font-size: 1.5rem;
    color: #374151;
    margin: 0 0 0.75rem;
}

.already-joined p[b-qzkn5ij6na] {
    color: #6b7280;
    font-size: 1rem;
    margin: 0 0 2rem;
}

.already-joined-actions[b-qzkn5ij6na] {
    display: flex;
    gap: 1rem;
    justify-content: center;
}

.btn-primary[b-qzkn5ij6na] {
    display: inline-block;
    padding: 0.6rem 1.5rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.btn-primary:hover[b-qzkn5ij6na] {
    background: var(--cedar-green-light);
}

.btn-secondary[b-qzkn5ij6na] {
    display: inline-block;
    padding: 0.6rem 1.5rem;
    background: none;
    color: var(--cedar-green, #2D5016);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    border: 1px solid var(--cedar-green, #2D5016);
    border-radius: 4px;
    transition: all 0.2s ease;
}

.btn-secondary:hover[b-qzkn5ij6na] {
    background: rgba(var(--cedar-green-rgb), 0.05);
}

/* Content */
.join-content[b-qzkn5ij6na] {
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

/* Message */
.message[b-qzkn5ij6na] {
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 4px;
}

.message.success[b-qzkn5ij6na] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.2);
}

.message.error[b-qzkn5ij6na] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Form Panel */
.join-form-panel[b-qzkn5ij6na] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
}

.join-form-panel h2[b-qzkn5ij6na] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem;
}

.form-intro[b-qzkn5ij6na] {
    color: #6b7280;
    font-size: 0.9rem;
    margin: 0 0 1.5rem;
    line-height: 1.5;
}

.form-grid[b-qzkn5ij6na] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.form-group[b-qzkn5ij6na] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.form-group label[b-qzkn5ij6na] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #374151;
}

.form-group input[type="text"][b-qzkn5ij6na],
.form-group input[type="number"][b-qzkn5ij6na] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.9rem;
    transition: border-color 0.2s ease;
}

.form-group input:focus[b-qzkn5ij6na] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 2px rgba(var(--cedar-green-rgb), 0.1);
}

.checkbox-group[b-qzkn5ij6na] {
    justify-content: flex-end;
}

.checkbox-label[b-qzkn5ij6na] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #374151;
    cursor: pointer;
}

.checkbox-label input[type="checkbox"][b-qzkn5ij6na] {
    width: 1rem;
    height: 1rem;
}

/* Info Box */
.info-box[b-qzkn5ij6na] {
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.08);
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.info-box h3[b-qzkn5ij6na] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.75rem;
}

.info-box ul[b-qzkn5ij6na] {
    margin: 0;
    padding: 0 0 0 1.25rem;
}

.info-box li[b-qzkn5ij6na] {
    font-size: 0.85rem;
    color: #6b7280;
    line-height: 1.6;
}

/* Join Button */
.btn-join[b-qzkn5ij6na] {
    display: block;
    width: 100%;
    padding: 0.75rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-join:hover:not(:disabled)[b-qzkn5ij6na] {
    background: var(--cedar-green-light);
}

.btn-join:disabled[b-qzkn5ij6na] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Responsive */
@media (max-width: 768px) {

    .join-content[b-qzkn5ij6na] {
        padding: 1.5rem;
    }

    .join-form-panel[b-qzkn5ij6na] {
        padding: 1.25rem;
    }

    .form-grid[b-qzkn5ij6na] {
        grid-template-columns: 1fr;
    }

    .already-joined-actions[b-qzkn5ij6na] {
        flex-direction: column;
        align-items: center;
    }
}
/* /Components/Pages/Ladder/LadderPlayerDetail.razor.rz.scp.css */
/* ===== Ladder Player Detail Page ===== */

.player-detail-page[b-qf5816rt57] {
    background: #ffffff;
    min-height: 100vh;
}

.hero-stats[b-qf5816rt57] {
    display: flex;
    gap: 3rem;
    flex-wrap: wrap;
}

.hero-stat[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.hero-stat-label[b-qf5816rt57] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.5);
}

.hero-stat-value[b-qf5816rt57] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--wheat-gold, #D4AF37);
}

/* Loading / Error */
.loading-state[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem;
    gap: 1rem;
    color: #6b7280;
}

.loading-spinner[b-qf5816rt57] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-qf5816rt57 0.8s linear infinite;
}

@keyframes spin-b-qf5816rt57 {
    to { transform: rotate(360deg); }
}

.not-found[b-qf5816rt57] {
    text-align: center;
    padding: 4rem;
}

.not-found h2[b-qf5816rt57] {
    color: #374151;
}

.not-found a[b-qf5816rt57] {
    color: var(--cedar-green, #2D5016);
}

/* Content */
.player-content[b-qf5816rt57] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

/* Stats Grid */
.stats-grid[b-qf5816rt57] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 1px;
    background: rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.08);
    margin-bottom: 3rem;
}

.stat-card[b-qf5816rt57] {
    background: #ffffff;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.stat-title[b-qf5816rt57] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    font-weight: 600;
}

.stat-value[b-qf5816rt57] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    font-variant-numeric: tabular-nums;
}

.streak-highlight[b-qf5816rt57] {
    color: #f97316;
}

/* Games Section */
.section-title[b-qf5816rt57] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid #000000;
    padding-bottom: 0.75rem;
}

.games-list[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.game-card[b-qf5816rt57] {
    display: grid;
    grid-template-columns: 100px 1fr auto auto auto;
    align-items: center;
    gap: 1.5rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    border-left: 3px solid transparent;
}

.game-card.game-win[b-qf5816rt57] {
    border-left-color: #22c55e;
}

.game-card.game-loss[b-qf5816rt57] {
    border-left-color: #ef4444;
}

.game-card.game-draw[b-qf5816rt57] {
    border-left-color: #6b7280;
}

.game-date[b-qf5816rt57] {
    font-size: 0.8rem;
    color: #6b7280;
}

.game-players[b-qf5816rt57] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
}

.game-players .is-player[b-qf5816rt57] {
    font-weight: 700;
    color: #111827;
}

.game-vs[b-qf5816rt57] {
    color: #9ca3af;
    font-size: 0.75rem;
}

.game-result[b-qf5816rt57] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #374151;
}

.game-details[b-qf5816rt57] {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.position-change[b-qf5816rt57],
.time-control[b-qf5816rt57],
.game-source[b-qf5816rt57] {
    font-size: 0.7rem;
    padding: 0.15rem 0.4rem;
    border-radius: 2px;
    background: rgba(0, 0, 0, 0.05);
    color: #6b7280;
    font-weight: 500;
}

.game-ratings[b-qf5816rt57] {
    font-size: 0.8rem;
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

.rating-change[b-qf5816rt57] {
    font-weight: 600;
}

/* Responsive */
@media (max-width: 768px) {

    .hero-stats[b-qf5816rt57] {
        gap: 1.5rem;
    }

    .player-content[b-qf5816rt57] {
        padding: 1.5rem;
    }

    .stats-grid[b-qf5816rt57] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .game-card[b-qf5816rt57] {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        padding: 1rem;
    }

    .season-entries[b-qf5816rt57] {
        grid-template-columns: 1fr;
    }
}

/* ===== Season History ===== */
.seasons-section[b-qf5816rt57] {
    margin-bottom: 2rem;
}

.season-entries[b-qf5816rt57] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
}

.season-entry-card[b-qf5816rt57] {
    display: block;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.25rem;
    text-decoration: none;
    color: inherit;
    transition: all 0.2s ease;
}

.season-entry-card:hover[b-qf5816rt57] {
    border-color: rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.season-entry-header[b-qf5816rt57] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.season-entry-name[b-qf5816rt57] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #111827;
}

.season-entry-status[b-qf5816rt57] {
    padding: 0.15rem 0.5rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.status-active[b-qf5816rt57] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
}

.status-completed[b-qf5816rt57] {
    background: rgba(107, 114, 128, 0.1);
    color: #6b7280;
}

.status-registration[b-qf5816rt57] {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.season-entry-stats[b-qf5816rt57] {
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.season-stat[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.season-stat-label[b-qf5816rt57] {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
}

.season-stat-value[b-qf5816rt57] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #374151;
}

.perf-positive[b-qf5816rt57] {
    color: #15803d;
}

.perf-negative[b-qf5816rt57] {
    color: #dc2626;
}

.prize-value[b-qf5816rt57] {
    color: var(--wheat-gold, #D4AF37);
}

/* ===== Badges Section ===== */
.badges-section[b-qf5816rt57] {
    margin-bottom: 2rem;
}

.badges-grid[b-qf5816rt57] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.badge-card[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 0.75rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fafafa;
    min-width: 90px;
    transition: all 0.2s ease;
    cursor: default;
}

.badge-card:hover[b-qf5816rt57] {
    border-color: var(--wheat-gold, #D4AF37);
    background: rgba(var(--wheat-gold-rgb), 0.04);
}

.badge-icon[b-qf5816rt57] {
    font-size: 1.5rem;
    line-height: 1;
}

.badge-name[b-qf5816rt57] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #374151;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.badge-date[b-qf5816rt57] {
    font-size: 0.6rem;
    color: #9ca3af;
}

/* ===== Head-to-Head Section ===== */
.h2h-section[b-qf5816rt57] {
    margin-bottom: 2rem;
}

.h2h-selector[b-qf5816rt57] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.h2h-label[b-qf5816rt57] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
}

.h2h-select[b-qf5816rt57] {
    padding: 0.4rem 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    background: #ffffff;
    font-size: 0.85rem;
    color: #374151;
    min-width: 200px;
}

.h2h-select:focus[b-qf5816rt57] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
}

.h2h-summary[b-qf5816rt57] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    padding: 1.25rem;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
}

.h2h-player[b-qf5816rt57] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.h2h-player-name[b-qf5816rt57] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #111827;
}

.h2h-player-wins[b-qf5816rt57] {
    font-size: 2rem;
    font-weight: 800;
    color: var(--cedar-green, #2D5016);
    font-variant-numeric: tabular-nums;
}

.h2h-center[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    color: #6b7280;
    font-size: 0.8rem;
    min-width: 80px;
}

.h2h-draws[b-qf5816rt57] {
    font-weight: 600;
}

.h2h-total[b-qf5816rt57] {
    font-size: 0.7rem;
}

.h2h-games[b-qf5816rt57] {
    display: flex;
    flex-direction: column;
}

.h2h-game-row[b-qf5816rt57] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
    border-left: 3px solid transparent;
    font-size: 0.85rem;
}

.h2h-game-row.game-win[b-qf5816rt57] {
    border-left-color: #22c55e;
}

.h2h-game-row.game-loss[b-qf5816rt57] {
    border-left-color: #ef4444;
}

.h2h-game-row.game-draw[b-qf5816rt57] {
    border-left-color: #6b7280;
}

.h2h-game-date[b-qf5816rt57] {
    color: #6b7280;
    font-size: 0.8rem;
}

.h2h-game-result[b-qf5816rt57] {
    font-weight: 600;
    color: #374151;
}
/* /Components/Pages/Ladder/LadderRules.razor.rz.scp.css */
/* ===== Ladder Rules & FAQ Page ===== */

.rules-page[b-j1f30fu2pq] {
    background: #ffffff;
    min-height: 100vh;
}

/* Content */
.rules-content[b-j1f30fu2pq] {
    max-width: 900px;
    margin: 0 auto;
    padding: 3rem 4rem 4rem;
}

/* Quick Reference Box */
.quick-ref[b-j1f30fu2pq] {
    border: 2px solid #000000;
    padding: 2rem;
    margin-bottom: 3rem;
}

.quick-ref-title[b-j1f30fu2pq] {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #111827;
    margin: 0 0 1.25rem 0;
}

.ref-grid[b-j1f30fu2pq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.ref-item[b-j1f30fu2pq] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.ref-label[b-j1f30fu2pq] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
}

.ref-value[b-j1f30fu2pq] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
}

/* Rule Sections */
.rules-sections[b-j1f30fu2pq] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.rule-section[b-j1f30fu2pq] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    padding-bottom: 2.5rem;
}

.rule-section:last-child[b-j1f30fu2pq] {
    border-bottom: none;
    padding-bottom: 0;
}

.section-title[b-j1f30fu2pq] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
    padding-left: 0.75rem;
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.rule-body[b-j1f30fu2pq] {
    color: #374151;
    font-size: 0.95rem;
    line-height: 1.7;
}

.rule-body p[b-j1f30fu2pq] {
    margin: 0 0 1rem 0;
}

.rule-body p:last-child[b-j1f30fu2pq] {
    margin-bottom: 0;
}

.rule-body ul[b-j1f30fu2pq] {
    margin: 0 0 1rem 0;
    padding-left: 1.5rem;
}

.rule-body li[b-j1f30fu2pq] {
    margin-bottom: 0.5rem;
}

.rule-body li:last-child[b-j1f30fu2pq] {
    margin-bottom: 0;
}

.rule-body strong[b-j1f30fu2pq] {
    color: #111827;
}

.rule-body h3[b-j1f30fu2pq] {
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
    margin: 1.5rem 0 0.75rem 0;
}

.rule-body sup[b-j1f30fu2pq] {
    font-size: 0.65em;
}

/* FAQ */
.faq-list[b-j1f30fu2pq] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.faq-item[b-j1f30fu2pq] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.faq-item:last-child[b-j1f30fu2pq] {
    border-bottom: none;
}

.faq-question[b-j1f30fu2pq] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
    padding: 1rem 0;
    background: none;
    border: none;
    text-align: left;
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
    cursor: pointer;
    transition: color 0.2s ease;
}

.faq-question:hover[b-j1f30fu2pq] {
    color: var(--cedar-green, #2D5016);
}

.question-icon[b-j1f30fu2pq] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
}

.faq-answer[b-j1f30fu2pq] {
    padding: 0 0 1rem 2.5rem;
    color: #6b7280;
    font-size: 0.9rem;
    line-height: 1.6;
}

/* Responsive */
@media (max-width: 768px) {

    .rules-content[b-j1f30fu2pq] {
        padding: 2rem 1.5rem;
    }

    .quick-ref[b-j1f30fu2pq] {
        padding: 1.25rem;
    }

    .ref-grid[b-j1f30fu2pq] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/Ladder/LadderSeasons.razor.rz.scp.css */
/* ===== Ladder Seasons Page ===== */

.seasons-page[b-hbu97z2wxu] {
    background: #ffffff;
    min-height: 100vh;
}

/* Loading State */
.loading-state[b-hbu97z2wxu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6b7280;
}

.loading-spinner[b-hbu97z2wxu] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-hbu97z2wxu 0.8s linear infinite;
}

@keyframes spin-b-hbu97z2wxu {
    to { transform: rotate(360deg); }
}

/* Content */
.seasons-content[b-hbu97z2wxu] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

/* Message Bar */
.message-bar[b-hbu97z2wxu] {
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    font-weight: 500;
}

.message-bar.success[b-hbu97z2wxu] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.2);
}

.message-bar.error[b-hbu97z2wxu] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Season Selector */
.season-selector[b-hbu97z2wxu] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.season-pill[b-hbu97z2wxu] {
    padding: 0.5rem 1rem;
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

.season-pill:hover[b-hbu97z2wxu] {
    background: #e5e7eb;
    color: #374151;
}

.season-pill.active[b-hbu97z2wxu] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border-color: var(--cedar-green, #2D5016);
}

.season-pill.active .pill-status[b-hbu97z2wxu] {
    color: rgba(255, 255, 255, 0.7);
}

.pill-status[b-hbu97z2wxu] {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #9ca3af;
}

.pill-active .pill-status[b-hbu97z2wxu] { color: #22c55e; }
.pill-registration .pill-status[b-hbu97z2wxu] { color: #3b82f6; }
.pill-completed .pill-status[b-hbu97z2wxu] { color: #9ca3af; }

/* Season Info Card */
.season-info-card[b-hbu97z2wxu] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    margin-bottom: 2rem;
}

.season-header[b-hbu97z2wxu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1.5rem;
}

.season-name[b-hbu97z2wxu] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.5rem 0;
}

.season-description[b-hbu97z2wxu] {
    color: #6b7280;
    font-size: 0.95rem;
    margin: 0;
    max-width: 700px;
}

.season-status-badge[b-hbu97z2wxu] {
    padding: 0.3rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 3px;
    white-space: nowrap;
}

.status-draft[b-hbu97z2wxu] { background: rgba(107, 114, 128, 0.15); color: #6b7280; }
.status-registration[b-hbu97z2wxu] { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }
.status-active[b-hbu97z2wxu] { background: rgba(34, 197, 94, 0.1); color: #15803d; }
.status-finalizing[b-hbu97z2wxu] { background: rgba(245, 158, 11, 0.1); color: #d97706; }
.status-completed[b-hbu97z2wxu] { background: rgba(107, 114, 128, 0.1); color: #6b7280; }
.status-cancelled[b-hbu97z2wxu] { background: rgba(239, 68, 68, 0.1); color: #dc2626; }

/* Season Meta */
.season-meta[b-hbu97z2wxu] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
}

.meta-item[b-hbu97z2wxu] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.meta-label[b-hbu97z2wxu] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
}

.meta-value[b-hbu97z2wxu] {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
}

.meta-value.prize[b-hbu97z2wxu] {
    color: var(--wheat-gold, #D4AF37);
    font-size: 1.1rem;
}

/* Registration CTA */
.registration-cta[b-hbu97z2wxu] {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.registration-cta h3[b-hbu97z2wxu] {
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.registration-cta a[b-hbu97z2wxu] {
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
}

.track-selector[b-hbu97z2wxu] {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.track-btn[b-hbu97z2wxu] {
    flex: 1;
    padding: 1rem;
    background: #f9fafb;
    border: 2px solid #e5e7eb;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
}

.track-btn:hover[b-hbu97z2wxu] {
    border-color: #d1d5db;
}

.track-btn.active[b-hbu97z2wxu] {
    border-color: var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.track-name[b-hbu97z2wxu] {
    display: block;
    font-weight: 700;
    font-size: 0.95rem;
    color: #111827;
    margin-bottom: 0.25rem;
}

.track-desc[b-hbu97z2wxu] {
    display: block;
    font-size: 0.8rem;
    color: #6b7280;
}

.btn-register[b-hbu97z2wxu] {
    padding: 0.6rem 2rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-register:hover:not(:disabled)[b-hbu97z2wxu] {
    background: var(--cedar-green-light);
    transform: translateY(-1px);
}

.btn-register:disabled[b-hbu97z2wxu] {
    opacity: 0.5;
    cursor: not-allowed;
}

.registered-badge[b-hbu97z2wxu] {
    margin-top: 1.5rem;
    padding: 0.75rem 1rem;
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.2);
    color: #15803d;
    font-weight: 600;
    font-size: 0.9rem;
}

.registered-badge i[b-hbu97z2wxu] {
    margin-right: 0.3rem;
}

/* Standings Section */
.standings-section[b-hbu97z2wxu] {
    margin-top: 2rem;
}

.standings-header[b-hbu97z2wxu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.standings-header h2[b-hbu97z2wxu] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
}

/* Track Filter */
.track-filter[b-hbu97z2wxu] {
    display: flex;
    gap: 0;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

.filter-btn[b-hbu97z2wxu] {
    padding: 0.35rem 0.75rem;
    background: #ffffff;
    border: none;
    border-right: 1px solid #e5e7eb;
    font-size: 0.8rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.15s ease;
}

.filter-btn:last-child[b-hbu97z2wxu] {
    border-right: none;
}

.filter-btn:hover[b-hbu97z2wxu] {
    background: #f9fafb;
}

.filter-btn.active[b-hbu97z2wxu] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
}

/* Standings Table */
.standings-table-container[b-hbu97z2wxu] {
    overflow-x: auto;
}

.standings-table[b-hbu97z2wxu] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.standings-table thead[b-hbu97z2wxu] {
    border-bottom: 2px solid #000000;
}

.standings-table th[b-hbu97z2wxu] {
    padding: 0.6rem 0.75rem;
    text-align: left;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    font-weight: 600;
}

.standings-table tbody tr[b-hbu97z2wxu] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.standings-table tbody tr:hover[b-hbu97z2wxu] {
    background: rgba(0, 0, 0, 0.02);
}

.standings-table tbody tr.my-row[b-hbu97z2wxu] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.standings-table td[b-hbu97z2wxu] {
    padding: 0.6rem 0.75rem;
    vertical-align: middle;
    color: #374151;
}

/* Rank Badge */
.rank-badge[b-hbu97z2wxu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.85rem;
    color: #374151;
    background: #f3f4f6;
}

.rank-gold[b-hbu97z2wxu] {
    background: linear-gradient(135deg, #fbbf24, var(--wheat-gold));
    color: #000000;
}

.rank-silver[b-hbu97z2wxu] {
    background: linear-gradient(135deg, #d1d5db, #9ca3af);
    color: #000000;
}

.rank-bronze[b-hbu97z2wxu] {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #ffffff;
}

.player-name[b-hbu97z2wxu] {
    font-weight: 600;
    color: #111827;
}

/* Track Badge */
.track-badge[b-hbu97z2wxu] {
    display: inline-block;
    padding: 0.1rem 0.4rem;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.track-stakes[b-hbu97z2wxu] {
    background: rgba(var(--wheat-gold-rgb), 0.15);
    color: #b8941e;
}

.track-free[b-hbu97z2wxu] {
    background: rgba(107, 114, 128, 0.1);
    color: #6b7280;
}

/* Performance Score */
.perf-score[b-hbu97z2wxu] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.perf-positive[b-hbu97z2wxu] {
    color: #15803d;
}

.perf-negative[b-hbu97z2wxu] {
    color: #dc2626;
}

/* Prize Amount */
.prize-amount[b-hbu97z2wxu] {
    font-weight: 700;
    color: var(--wheat-gold, #D4AF37);
}

.prize-paid[b-hbu97z2wxu] {
    color: #22c55e;
    margin-left: 0.3rem;
    font-size: 0.8rem;
}

.no-prize[b-hbu97z2wxu] {
    color: #d1d5db;
}

/* Standings Note */
.standings-note[b-hbu97z2wxu] {
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    background: #f9fafb;
    border: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 0.8rem;
    color: #6b7280;
    line-height: 1.5;
}

.standings-note i[b-hbu97z2wxu] {
    color: #3b82f6;
    margin-right: 0.3rem;
}

/* Responsive */
@media (max-width: 768px) {

    .seasons-content[b-hbu97z2wxu] {
        padding: 1.5rem;
    }

    .season-info-card[b-hbu97z2wxu] {
        padding: 1.25rem;
    }

    .season-header[b-hbu97z2wxu] {
        flex-direction: column;
        gap: 0.75rem;
    }

    .season-meta[b-hbu97z2wxu] {
        gap: 1rem;
    }

    .track-selector[b-hbu97z2wxu] {
        flex-direction: column;
    }

    .standings-table th[b-hbu97z2wxu],
    .standings-table td[b-hbu97z2wxu] {
        padding: 0.5rem;
    }

    .col-expected[b-hbu97z2wxu],
    .col-actual[b-hbu97z2wxu] {
        display: none;
    }

    .standings-header[b-hbu97z2wxu] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
}
/* /Components/Pages/Ladder/LadderStandings.razor.rz.scp.css */
/* ===== Ladder Standings Page ===== */

.ladder-page[b-s5sofhskm1] {
    background: #ffffff;
    min-height: 100vh;
}

.hero-links[b-s5sofhskm1] {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
}

.hero-link[b-s5sofhskm1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all 0.2s ease;
}

.hero-link:hover[b-s5sofhskm1] {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

/* Loading State */
.loading-state[b-s5sofhskm1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4rem;
    gap: 1rem;
    color: #6b7280;
}

.loading-spinner[b-s5sofhskm1] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-s5sofhskm1 0.8s linear infinite;
}

@keyframes spin-b-s5sofhskm1 {
    to { transform: rotate(360deg); }
}

/* My Status Bar */
.my-status-bar[b-s5sofhskm1] {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    border-bottom: 2px solid var(--wheat-gold, #D4AF37);
}

.my-status-content[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem 4rem;
    display: flex;
    align-items: center;
    gap: 2.5rem;
    flex-wrap: wrap;
}

.my-status-position[b-s5sofhskm1],
.my-status-rating[b-s5sofhskm1],
.my-status-record[b-s5sofhskm1],
.my-status-streak[b-s5sofhskm1] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.position-label[b-s5sofhskm1],
.rating-label[b-s5sofhskm1],
.record-label[b-s5sofhskm1],
.streak-label[b-s5sofhskm1] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(255, 255, 255, 0.5);
}

.position-number[b-s5sofhskm1] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--wheat-gold, #D4AF37);
}

.rating-value[b-s5sofhskm1],
.record-value[b-s5sofhskm1] {
    font-size: 1.2rem;
    font-weight: 600;
    color: #ffffff;
}

.streak-value[b-s5sofhskm1] {
    font-size: 1.2rem;
    font-weight: 600;
    color: #22c55e;
}

.streak-fire[b-s5sofhskm1] {
    color: #f97316;
}

.challenges-badge[b-s5sofhskm1] {
    display: inline-block;
    padding: 0.4rem 1rem;
    background: rgba(239, 68, 68, 0.2);
    border: 1px solid rgba(239, 68, 68, 0.5);
    border-radius: 4px;
    color: #fca5a5;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
}

.challenges-badge:hover[b-s5sofhskm1] {
    background: rgba(239, 68, 68, 0.3);
    color: #ffffff;
}

/* Join Banner */
.join-banner[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1.5rem 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    background: #f8f9fa;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.join-banner p[b-s5sofhskm1] {
    margin: 0;
    color: #6b7280;
    font-size: 1rem;
}

.join-btn[b-s5sofhskm1] {
    display: inline-block;
    padding: 0.5rem 1.5rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.join-btn:hover[b-s5sofhskm1] {
    background: var(--cedar-green-light);
    transform: translateY(-1px);
}

/* Challenges Closed Banner */
.challenges-closed-banner[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff8e6;
    border-bottom: 1px solid rgba(var(--wheat-gold-rgb), 0.4);
}

.challenges-closed-banner p[b-s5sofhskm1] {
    margin: 0;
    color: #8a6d1b;
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
}

/* The hidden-from-members notice (#8199): the closed banner's shape in a neutral gray, since it states a fact, not a warning. */
.hidden-banner[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    border-bottom: 1px solid rgba(107, 114, 128, 0.4);
}

.hidden-banner p[b-s5sofhskm1] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
}

/* Links inside help text are underlined, not told apart by color alone (#8296 walk B1). */
.hidden-banner a[b-s5sofhskm1] {
    color: inherit;
    text-decoration: underline;
}

/* Standings Table */
.ladder-content[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

.standings-table-container[b-s5sofhskm1] {
    overflow-x: auto;
}

.standings-table[b-s5sofhskm1] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.standings-table thead[b-s5sofhskm1] {
    border-bottom: 2px solid #000000;
}

.standings-table th[b-s5sofhskm1] {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    font-weight: 600;
}

.standings-table tbody tr[b-s5sofhskm1] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.standings-table tbody tr:hover[b-s5sofhskm1] {
    background: rgba(0, 0, 0, 0.02);
}

.standings-table tbody tr.my-row[b-s5sofhskm1] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.standings-table tbody tr.on-break[b-s5sofhskm1] {
    opacity: 0.6;
}

.standings-table td[b-s5sofhskm1] {
    padding: 0.75rem 1rem;
    vertical-align: middle;
}

/* Position Badge */
.position-badge[b-s5sofhskm1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 0.9rem;
    color: #374151;
    background: #f3f4f6;
}

.position-gold[b-s5sofhskm1] {
    background: linear-gradient(135deg, #fbbf24, var(--wheat-gold));
    color: #000000;
}

.position-silver[b-s5sofhskm1] {
    background: linear-gradient(135deg, #d1d5db, #9ca3af);
    color: #000000;
}

.position-bronze[b-s5sofhskm1] {
    background: linear-gradient(135deg, #d97706, #b45309);
    color: #ffffff;
}

/* Player Info */
.player-info[b-s5sofhskm1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.player-name[b-s5sofhskm1] {
    font-weight: 600;
    color: #111827;
}

.break-badge[b-s5sofhskm1],
.challenge-badge[b-s5sofhskm1],
.hidden-badge[b-s5sofhskm1] {
    display: inline-block;
    padding: 0.15rem 0.4rem;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.break-badge[b-s5sofhskm1] {
    background: rgba(107, 114, 128, 0.15);
    color: #6b7280;
}

/* The administrator's hidden-from-members marker (#8199): muted ink on the token (#8258), outlined so it reads apart from the break badge. */
.hidden-badge[b-s5sofhskm1] {
    background: transparent;
    color: var(--color-text-secondary);
    border: 1px dashed currentColor;
}

.challenge-badge[b-s5sofhskm1] {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

/* Record */
.record[b-s5sofhskm1] {
    font-variant-numeric: tabular-nums;
    color: #374151;
}

/* Streaks */
.streak[b-s5sofhskm1] {
    font-weight: 600;
    color: #22c55e;
}

.streak-warm[b-s5sofhskm1] {
    color: #f97316;
}

.streak-hot[b-s5sofhskm1] {
    color: #ef4444;
    font-weight: 700;
}

.streak-none[b-s5sofhskm1] {
    color: #d1d5db;
}

/* Challenge Button */
.challenge-btn[b-s5sofhskm1] {
    padding: 0.35rem 0.8rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.challenge-btn:hover:not(:disabled)[b-s5sofhskm1] {
    background: var(--cedar-green-light);
    transform: translateY(-1px);
}

.challenge-btn:disabled[b-s5sofhskm1] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pending-label[b-s5sofhskm1] {
    font-size: 0.8rem;
    color: #3b82f6;
    font-weight: 600;
}

/* Message Bar */
.message-bar[b-s5sofhskm1] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0.75rem 4rem;
    font-size: 0.9rem;
    font-weight: 500;
}

.message-bar.success[b-s5sofhskm1] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border-top: 1px solid rgba(34, 197, 94, 0.2);
}

.message-bar.error[b-s5sofhskm1] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border-top: 1px solid rgba(239, 68, 68, 0.2);
}

/* Responsive */
@media (max-width: 768px) {
    .my-status-content[b-s5sofhskm1] {
        padding: 1rem 1.5rem;
        gap: 1.5rem;
    }

    .ladder-content[b-s5sofhskm1] {
        padding: 1.5rem;
    }

    .join-banner[b-s5sofhskm1] {
        padding: 1rem 1.5rem;
        flex-direction: column;
        gap: 0.75rem;
    }

    .standings-table th[b-s5sofhskm1],
    .standings-table td[b-s5sofhskm1] {
        padding: 0.5rem;
    }

    .col-uscf[b-s5sofhskm1],
    .col-last-active[b-s5sofhskm1] {
        display: none;
    }

    .message-bar[b-s5sofhskm1] {
        padding: 0.75rem 1.5rem;
    }

    .ladder-extras[b-s5sofhskm1] {
        grid-template-columns: 1fr;
    }

    .records-grid[b-s5sofhskm1] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ===== Activity Feed + Club Records ===== */
.ladder-extras[b-s5sofhskm1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

.extras-title[b-s5sofhskm1] {
    font-size: 1rem;
    font-weight: 700;
    color: #111827;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 1rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #000000;
}

/* Activity Feed */
.activity-section[b-s5sofhskm1] {
    min-width: 0;
}

.activity-feed[b-s5sofhskm1] {
    display: flex;
    flex-direction: column;
}

.activity-item[b-s5sofhskm1] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.6rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.activity-icon[b-s5sofhskm1] {
    font-size: 1rem;
    flex-shrink: 0;
    width: 1.5rem;
    text-align: center;
}

.activity-body[b-s5sofhskm1] {
    flex: 1;
    min-width: 0;
}

.activity-desc[b-s5sofhskm1] {
    font-size: 0.85rem;
    color: #374151;
    display: block;
}

.activity-badge-tag[b-s5sofhskm1] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.1rem 0.4rem;
    background: rgba(var(--wheat-gold-rgb), 0.12);
    color: var(--wheat-gold, #D4AF37);
    border-radius: 2px;
    margin-top: 0.2rem;
}

.activity-time[b-s5sofhskm1] {
    font-size: 0.7rem;
    color: #9ca3af;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Club Records */
.records-section[b-s5sofhskm1] {
    min-width: 0;
}

.records-grid[b-s5sofhskm1] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.record-card[b-s5sofhskm1] {
    background: #ffffff;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    cursor: pointer;
    transition: background 0.15s ease;
}

.record-card:hover[b-s5sofhskm1] {
    background: #fafafa;
}

.record-label[b-s5sofhskm1] {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #9ca3af;
    font-weight: 600;
}

.record-value[b-s5sofhskm1] {
    font-size: 1rem;
    font-weight: 800;
    color: #111827;
    font-variant-numeric: tabular-nums;
}

.record-holder[b-s5sofhskm1] {
    font-size: 0.75rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
}
/* /Components/Pages/Ladder/MyChallenges.razor.rz.scp.css */
/* ===== My Challenges Page ===== */

.challenges-page[b-7no6et8hwj] {
    background: #ffffff;
    min-height: 100vh;
}

/* Loading / Not On Ladder */
.loading-state[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem;
    gap: 1rem;
    color: #6b7280;
}

.loading-spinner[b-7no6et8hwj] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-7no6et8hwj 0.8s linear infinite;
}

@keyframes spin-b-7no6et8hwj {
    to { transform: rotate(360deg); }
}

.not-on-ladder[b-7no6et8hwj] {
    text-align: center;
    padding: 4rem;
}

.not-on-ladder h2[b-7no6et8hwj] {
    font-size: 1.5rem;
    color: #374151;
    margin: 0 0 0.5rem;
}

.not-on-ladder p[b-7no6et8hwj] {
    color: #6b7280;
    margin: 0 0 1.5rem;
}

.join-link[b-7no6et8hwj] {
    display: inline-block;
    padding: 0.6rem 1.5rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    border-radius: 4px;
}

.join-link:hover[b-7no6et8hwj] {
    background: var(--cedar-green-light);
}

/* Content */
.challenges-content[b-7no6et8hwj] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

/* Message */
.message[b-7no6et8hwj] {
    padding: 0.75rem 1rem;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 4px;
}

.message.success[b-7no6et8hwj] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.2);
}

.message.error[b-7no6et8hwj] {
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: 1px solid rgba(239, 68, 68, 0.2);
}

/* Section */
.challenge-section[b-7no6et8hwj] {
    margin-bottom: 2.5rem;
}

.section-title[b-7no6et8hwj] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 2px solid #000000;
    padding-bottom: 0.5rem;
}

/* Challenge Cards */
.challenge-cards[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.challenge-card[b-7no6et8hwj] {
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 1.25rem;
    border-left: 4px solid transparent;
}

.challenge-card.received[b-7no6et8hwj] {
    border-left-color: #f97316;
}

.challenge-card.active[b-7no6et8hwj] {
    border-left-color: var(--cedar-green, #2D5016);
}

.challenge-card.issued[b-7no6et8hwj] {
    border-left-color: #3b82f6;
}

.challenge-header[b-7no6et8hwj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.challenge-from[b-7no6et8hwj] {
    font-size: 1rem;
    color: #111827;
}

.challenge-status[b-7no6et8hwj] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.status-pending[b-7no6et8hwj] {
    background: rgba(249, 115, 22, 0.1);
    color: #ea580c;
}

.status-active[b-7no6et8hwj] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
}

/* Challenge Details Grid */
.challenge-details[b-7no6et8hwj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.detail-row[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.detail-row.full[b-7no6et8hwj] {
    grid-column: 1 / -1;
}

.detail-label[b-7no6et8hwj] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #6b7280;
    font-weight: 600;
}

.detail-value[b-7no6et8hwj] {
    font-size: 0.9rem;
    color: #374151;
    font-weight: 500;
}

.detail-value.deadline[b-7no6et8hwj] {
    color: #dc2626;
    font-weight: 600;
}

/* Actions */
.challenge-actions[b-7no6et8hwj] {
    display: flex;
    gap: 0.75rem;
}

.btn-accept[b-7no6et8hwj] {
    padding: 0.5rem 1.25rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-accept:hover:not(:disabled)[b-7no6et8hwj] {
    background: var(--cedar-green-light);
}

.btn-decline[b-7no6et8hwj] {
    padding: 0.5rem 1.25rem;
    background: rgba(239, 68, 68, 0.1);
    color: #dc2626;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-decline:hover:not(:disabled)[b-7no6et8hwj] {
    background: rgba(239, 68, 68, 0.2);
}

.btn-report[b-7no6et8hwj] {
    padding: 0.5rem 1.25rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-report:hover:not(:disabled)[b-7no6et8hwj] {
    background: var(--cedar-green-light);
}

.decline-note[b-7no6et8hwj] {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
}

/* Result Form */
.result-form[b-7no6et8hwj] {
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding-top: 1rem;
    margin-top: 0.5rem;
}

.result-form h3[b-7no6et8hwj] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 1rem 0;
}

.form-grid[b-7no6et8hwj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.form-group[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.form-group.full-width[b-7no6et8hwj] {
    grid-column: 1 / -1;
}

.form-group label[b-7no6et8hwj] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-group select[b-7no6et8hwj],
.form-group input[type="text"][b-7no6et8hwj],
.form-group input[type="date"][b-7no6et8hwj],
.form-group textarea[b-7no6et8hwj] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.9rem;
    transition: border-color 0.2s ease;
}

.form-group select:focus[b-7no6et8hwj],
.form-group input:focus[b-7no6et8hwj],
.form-group textarea:focus[b-7no6et8hwj] {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 2px rgba(var(--cedar-green-rgb), 0.1);
}

.form-actions[b-7no6et8hwj] {
    display: flex;
    gap: 0.75rem;
}

.btn-submit[b-7no6et8hwj] {
    padding: 0.5rem 1.25rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-submit:hover:not(:disabled)[b-7no6et8hwj] {
    background: var(--cedar-green-light);
}

.btn-submit:disabled[b-7no6et8hwj],
.btn-accept:disabled[b-7no6et8hwj],
.btn-decline:disabled[b-7no6et8hwj],
.btn-report:disabled[b-7no6et8hwj] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-cancel[b-7no6et8hwj] {
    padding: 0.5rem 1.25rem;
    background: none;
    color: #6b7280;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-cancel:hover[b-7no6et8hwj] {
    border-color: #9ca3af;
    color: #374151;
}

/* Challengeable Players List */
.challengeable-list[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
}

.challengeable-row[b-7no6et8hwj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.challengeable-row:last-child[b-7no6et8hwj] {
    border-bottom: none;
}

.challengeable-info[b-7no6et8hwj] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.challengeable-position[b-7no6et8hwj] {
    font-weight: 700;
    color: #6b7280;
    font-size: 0.9rem;
    min-width: 30px;
}

.challengeable-name[b-7no6et8hwj] {
    font-weight: 600;
    color: #111827;
    font-size: 0.9rem;
}

.challengeable-rating[b-7no6et8hwj] {
    font-size: 0.85rem;
    color: #374151;
    font-variant-numeric: tabular-nums;
}

.challengeable-record[b-7no6et8hwj] {
    font-size: 0.8rem;
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

.btn-challenge[b-7no6et8hwj] {
    padding: 0.35rem 0.8rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: none;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-challenge:hover:not(:disabled)[b-7no6et8hwj] {
    background: var(--cedar-green-light);
}

.btn-challenge:disabled[b-7no6et8hwj] {
    opacity: 0.5;
    cursor: not-allowed;
}

.cooldown-label[b-7no6et8hwj] {
    font-size: 0.8rem;
    color: #9ca3af;
    font-weight: 500;
}

/* Recent Games */
.recent-games[b-7no6et8hwj] {
    display: flex;
    flex-direction: column;
}

.game-row[b-7no6et8hwj] {
    display: grid;
    grid-template-columns: 80px 1fr auto auto;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    border-left: 3px solid transparent;
}

.game-row.game-win[b-7no6et8hwj] {
    border-left-color: #22c55e;
}

.game-row.game-loss[b-7no6et8hwj] {
    border-left-color: #ef4444;
}

.game-row.game-draw[b-7no6et8hwj] {
    border-left-color: #6b7280;
}

.game-date[b-7no6et8hwj] {
    font-size: 0.8rem;
    color: #6b7280;
}

.game-opponent[b-7no6et8hwj] {
    font-size: 0.9rem;
    color: #374151;
}

.game-result-text[b-7no6et8hwj] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
}

.game-rating-change[b-7no6et8hwj] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

/* Responsive */
@media (max-width: 768px) {
    .challenges-content[b-7no6et8hwj] {
        padding: 1.5rem;
    }

    .challenge-details[b-7no6et8hwj] {
        grid-template-columns: 1fr 1fr;
    }

    .form-grid[b-7no6et8hwj] {
        grid-template-columns: 1fr;
    }

    .challengeable-info[b-7no6et8hwj] {
        gap: 0.5rem;
    }

    .challengeable-record[b-7no6et8hwj] {
        display: none;
    }

    .game-row[b-7no6et8hwj] {
        grid-template-columns: 1fr auto auto;
    }

    .game-date[b-7no6et8hwj] {
        display: none;
    }
}
/* /Components/Pages/Library.razor.rz.scp.css */
.library-page[b-86b1vn19ho] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

/* Coming Soon Banner */
.coming-soon-banner[b-86b1vn19ho] {
    max-width: 1400px;
    margin: 0 auto 2rem;
    padding: 0 1rem;
}

.coming-soon-content[b-86b1vn19ho] {
    background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
    border: 2px solid #f59e0b;
    border-radius: 12px;
    padding: 1.5rem 2rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    box-shadow: 0 4px 6px -1px rgba(245, 158, 11, 0.1);
}

.coming-soon-content i[b-86b1vn19ho] {
    font-size: 2.5rem;
    color: #d97706;
    flex-shrink: 0;
}

.coming-soon-content strong[b-86b1vn19ho] {
    font-size: 1.125rem;
    color: #92400e;
    display: block;
    margin-bottom: 0.25rem;
}

.coming-soon-content p[b-86b1vn19ho] {
    margin: 0;
    color: #78350f;
    font-size: 0.875rem;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .coming-soon-content[b-86b1vn19ho] {
        flex-direction: column;
        text-align: center;
        padding: 1rem 1.5rem;
    }

    .coming-soon-content i[b-86b1vn19ho] {
        font-size: 2rem;
    }
}

/* Category Key Section */
.category-key-section[b-86b1vn19ho] {
    background: rgba(0, 102, 204, 0.05);
    border: 1px solid rgba(0, 102, 204, 0.15);
    border-radius: 12px;
    margin-bottom: var(--spacing-xl);
    overflow: hidden;
}

.category-key-toggle[b-86b1vn19ho] {
    width: 100%;
    padding: var(--spacing-md) var(--spacing-lg);
    background: transparent;
    border: none;
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    cursor: pointer;
    font-size: var(--font-size-base);
    font-weight: 600;
    color: var(--cedar-green);
    transition: background 0.2s ease;
}

.category-key-toggle:hover[b-86b1vn19ho] {
    background: rgba(0, 102, 204, 0.08);
}

.category-key-toggle i.fa-chevron-down[b-86b1vn19ho] {
    margin-left: auto;
    transition: transform 0.15s ease;
}

.category-key-toggle i.fa-chevron-down.expanded[b-86b1vn19ho] {
    transform: rotate(180deg);
}

.category-key-content[b-86b1vn19ho] {
    padding: var(--spacing-lg);
    padding-top: 0;
    animation: slideDown-b-86b1vn19ho 0.15s ease-out;
}

@keyframes slideDown-b-86b1vn19ho {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.category-key-grid[b-86b1vn19ho] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-sm);
}

.category-key-item[b-86b1vn19ho] {
    padding: var(--spacing-xs) var(--spacing-sm);
    font-size: var(--font-size-sm);
    color: var(--color-gray-dark);
}

.category-key-item strong[b-86b1vn19ho] {
    color: var(--wilson-blue);
    font-family: monospace;
    margin-right: var(--spacing-xs);
}

.library-header[b-86b1vn19ho] {
    text-align: center;
    margin-bottom: 3rem;
}

.library-header h1[b-86b1vn19ho] {
    font-size: 2.5rem;
    color: #111827;
    margin-bottom: 0.5rem;
}

.library-description[b-86b1vn19ho] {
    font-size: 1.125rem;
    color: #6b7280;
    max-width: 600px;
    margin: 0 auto;
}

.library-grid-container[b-86b1vn19ho] {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

/* Grid Controls */
.grid-controls[b-86b1vn19ho] {
    padding: 1.5rem;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
}

.search-box[b-86b1vn19ho] {
    margin-bottom: 1rem;
}

.search-input[b-86b1vn19ho] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 1rem;
    transition: border-color 0.2s;
}

.search-input:focus[b-86b1vn19ho] {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

.filter-controls[b-86b1vn19ho] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.filter-select[b-86b1vn19ho] {
    flex: 1;
    min-width: 180px;
    padding: 0.625rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    cursor: pointer;
    transition: border-color 0.2s;
}

.filter-select:focus[b-86b1vn19ho] {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

/* QuickGrid Styling */
[b-86b1vn19ho] .library-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

[b-86b1vn19ho] .library-grid thead {
    background: #f3f4f6;
    border-bottom: 2px solid #e5e7eb;
}

[b-86b1vn19ho] .library-grid th {
    padding: 0.75rem 1rem;
    text-align: left;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
}

[b-86b1vn19ho] .library-grid th[aria-sort] {
    cursor: pointer;
    user-select: none;
}

[b-86b1vn19ho] .library-grid th[aria-sort]:hover {
    background: #e5e7eb;
}

[b-86b1vn19ho] .library-grid td {
    padding: 1rem;
    border-bottom: 1px solid #e5e7eb;
    color: #111827;
}

[b-86b1vn19ho] .library-grid tbody tr:hover {
    background: #f9fafb;
}

/* Hide empty rows when filtered */
[b-86b1vn19ho] .library-grid tbody tr:has(td:empty) {
    display: none;
}

[b-86b1vn19ho] .library-grid tbody tr:not(:has(*)) {
    display: none;
}

/* Book Thumbnails */
.book-thumbnail[b-86b1vn19ho] {
    width: 50px;
    height: 75px;
    object-fit: cover;
    border-radius: 0.25rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.book-thumbnail-placeholder[b-86b1vn19ho] {
    width: 50px;
    height: 75px;
    background: #f3f4f6;
    border: 1px dashed #d1d5db;
    border-radius: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
    font-size: 1.25rem;
}

/* Status Badge */
.status-badge[b-86b1vn19ho] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-badge.available[b-86b1vn19ho] {
    background: #d1fae5;
    color: #065f46;
}

.status-badge.checked-out[b-86b1vn19ho] {
    background: #fee2e2;
    color: #991b1b;
}

/* Action Button */
.btn-expand[b-86b1vn19ho] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    color: #6b7280;
    text-decoration: none;
    border-radius: 0.375rem;
    transition: all 0.2s;
}

.btn-expand svg[b-86b1vn19ho] {
    width: 1.25rem;
    height: 1.25rem;
}

.btn-expand:hover[b-86b1vn19ho] {
    background: #f3f4f6;
    color: #1e3a8a;
}

/* Pagination */
.pagination-container[b-86b1vn19ho] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

.results-info[b-86b1vn19ho] {
    font-size: 0.875rem;
    color: #6b7280;
}

[b-86b1vn19ho] .paginator {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

[b-86b1vn19ho] .paginator button {
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    background: white;
    color: #111827;
    border-radius: 0.375rem;
    font-size: 1.125rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s;
    min-width: 2.75rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Add Font Awesome icons for pagination buttons */
[b-86b1vn19ho] .paginator button.go-first::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f100"; /* fa-angle-double-left */
}

[b-86b1vn19ho] .paginator button.go-previous::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f104"; /* fa-angle-left */
}

[b-86b1vn19ho] .paginator button.go-next::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f105"; /* fa-angle-right */
    display: inline-block;
    transform: rotate(180deg);
}

[b-86b1vn19ho] .paginator button.go-last::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    content: "\f101"; /* fa-angle-double-right */
    display: inline-block;
    transform: rotate(180deg);
}

[b-86b1vn19ho] .paginator button:hover:not(:disabled) {
    background: #1e3a8a;
    color: white;
    border-color: #1e3a8a;
}

[b-86b1vn19ho] .paginator button:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    background: #f9fafb;
}

[b-86b1vn19ho] .paginator .current-page {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    color: #374151;
    font-weight: 500;
}

/* Responsive Design */
@media (max-width: 768px) {
    .library-page[b-86b1vn19ho] {
        padding: 1.5rem 0.75rem;
    }

    .library-header h1[b-86b1vn19ho] {
        font-size: 2rem;
    }

    .library-description[b-86b1vn19ho] {
        font-size: 1rem;
    }

    .grid-controls[b-86b1vn19ho] {
        padding: 1rem;
    }

    .filter-controls[b-86b1vn19ho] {
        flex-direction: column;
    }

    .filter-select[b-86b1vn19ho] {
        width: 100%;
    }

    .pagination-container[b-86b1vn19ho] {
        flex-direction: column;
        gap: 1rem;
    }

    [b-86b1vn19ho] .library-grid {
        font-size: 0.75rem;
        display: block;
        overflow-x: auto;
    }

    [b-86b1vn19ho] .library-grid th,
    [b-86b1vn19ho] .library-grid td {
        padding: 0.5rem 0.375rem;
        font-size: 0.75rem;
    }

    .btn-expand[b-86b1vn19ho] {
        width: 1.75rem;
        height: 1.75rem;
    }

    .btn-expand svg[b-86b1vn19ho] {
        width: 1rem;
        height: 1rem;
    }

    .status-badge[b-86b1vn19ho] {
        font-size: 0.7rem;
        padding: 0.2rem 0.6rem;
    }

    [b-86b1vn19ho] .paginator button {
        min-width: 2.5rem;
        height: 2.25rem;
        font-size: 1rem;
    }

    .results-info[b-86b1vn19ho] {
        text-align: center;
    }
}

@media (max-width: 480px) {
    .library-page[b-86b1vn19ho] {
        padding: 1rem 0.5rem;
    }

    .library-header h1[b-86b1vn19ho] {
        font-size: 1.5rem;
    }

    .library-description[b-86b1vn19ho] {
        font-size: 0.875rem;
    }

    .search-input[b-86b1vn19ho] {
        font-size: 0.875rem;
        padding: 0.625rem 0.875rem;
    }

    [b-86b1vn19ho] .library-grid th,
    [b-86b1vn19ho] .library-grid td {
        padding: 0.375rem 0.25rem;
        font-size: 0.7rem;
    }

    [b-86b1vn19ho] .paginator {
        gap: 0.375rem;
    }

    [b-86b1vn19ho] .paginator button {
        min-width: 2.25rem;
        height: 2rem;
        font-size: 0.875rem;
    }
}
/* /Components/Pages/Library/Recommended.razor.rz.scp.css */
/* ============================================
   Recommended Books Page Styles
   ============================================ */

.page-container[b-h12tbczfxq] {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--spacing-2xl) var(--spacing-lg);
}

/* Loading State */
.loading-state[b-h12tbczfxq] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--spacing-3xl) var(--spacing-lg);
    gap: var(--spacing-lg);
}

.spinner[b-h12tbczfxq] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(0, 102, 204, 0.1);
    border-top-color: var(--wilson-blue);
    border-radius: 50%;
    animation: spin-b-h12tbczfxq 1s linear infinite;
}

@keyframes spin-b-h12tbczfxq {
    to { transform: rotate(360deg); }
}

.loading-state p[b-h12tbczfxq] {
    font-size: var(--font-size-lg);
    color: var(--color-gray);
}

/* Library Legend */
.library-legend[b-h12tbczfxq] {
    display: flex;
    justify-content: center;
    margin-bottom: var(--spacing-2xl);
    padding: var(--spacing-md);
    background: rgba(0, 102, 204, 0.05);
    border-radius: 12px;
    border-left: 4px solid var(--wilson-blue);
}

.legend-item[b-h12tbczfxq] {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-gray-dark);
}

/* ::deep - rendered by the ClubLogo child component. */
[b-h12tbczfxq] .legend-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}

/* Skill Level Sections */
.skill-level-section[b-h12tbczfxq] {
    margin-bottom: var(--spacing-3xl);
}

.section-header[b-h12tbczfxq] {
    margin-bottom: var(--spacing-xl);
    padding-bottom: var(--spacing-md);
    border-bottom: 2px solid rgba(0, 102, 204, 0.2);
}

.section-title[b-h12tbczfxq] {
    font-family: var(--font-display);
    font-size: var(--font-size-2xl);
    color: var(--cedar-green);
    margin: 0 0 var(--spacing-sm);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
}

.section-title i[b-h12tbczfxq] {
    color: var(--wilson-blue);
    font-size: var(--font-size-xl);
}

.section-description[b-h12tbczfxq] {
    font-size: var(--font-size-base);
    color: var(--color-gray);
    margin: 0;
    line-height: 1.6;
}

/* Books Grid */
.books-grid[b-h12tbczfxq] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-xl);
}

.book-card[b-h12tbczfxq] {
    background: white;
    border-radius: 12px;
    padding: var(--spacing-lg);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 102, 204, 0.1);
    transition: all 0.3s ease;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
}

.book-card:hover[b-h12tbczfxq] {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 102, 204, 0.15);
    border-color: var(--wilson-blue);
}

.book-cover-link[b-h12tbczfxq] {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    transition: transform 0.2s ease;
    height: 280px;
    width: 100%;
}

.book-cover-link:hover[b-h12tbczfxq] {
    transform: scale(1.05);
}

.book-cover[b-h12tbczfxq] {
    width: auto;
    height: 280px;
    max-width: 200px;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.book-info[b-h12tbczfxq] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
    flex: 1;
}

.book-title[b-h12tbczfxq] {
    font-size: var(--font-size-base);
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    flex-wrap: wrap;
}

.book-title-link[b-h12tbczfxq] {
    color: var(--cedar-green);
    text-decoration: none;
    transition: color 0.2s ease;
}

.book-title-link:hover[b-h12tbczfxq] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

[b-h12tbczfxq] .library-badge {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
}

.book-author[b-h12tbczfxq] {
    font-size: var(--font-size-sm);
    color: var(--wilson-blue);
    font-weight: 600;
    margin: 0;
    font-style: italic;
}

.book-description[b-h12tbczfxq] {
    font-size: var(--font-size-sm);
    color: var(--color-gray-dark);
    margin: 0;
    line-height: 1.6;
}

/* Page Footer */
.page-footer[b-h12tbczfxq] {
    margin-top: var(--spacing-3xl);
    padding-top: var(--spacing-xl);
    border-top: 2px solid rgba(0, 102, 204, 0.2);
}

.footer-note[b-h12tbczfxq] {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    background: rgba(190, 140, 14, 0.08);
    border-radius: 12px;
    border-left: 4px solid var(--color-gold);
    font-size: var(--font-size-base);
    color: var(--color-gray-dark);
    margin: 0;
    line-height: 1.6;
}

.footer-note i[b-h12tbczfxq] {
    color: var(--color-gold);
    flex-shrink: 0;
    margin-top: 2px;
}

.inline-link[b-h12tbczfxq] {
    color: var(--wilson-blue);
    text-decoration: none;
    font-weight: 600;
    transition: all 0.2s ease;
    border-bottom: 2px solid transparent;
}

.inline-link:hover[b-h12tbczfxq] {
    color: var(--wilson-blue);
    border-bottom-color: var(--wilson-blue);
}

[data-theme="dark"] .library-legend[b-h12tbczfxq] {
    background: rgba(59, 130, 246, 0.1);
    border-left-color: #60a5fa;
}

[data-theme="dark"] .legend-item[b-h12tbczfxq] {
    color: #e2e8f0;
}

[data-theme="dark"] .section-header[b-h12tbczfxq] {
    border-bottom-color: rgba(59, 130, 246, 0.3);
}

[data-theme="dark"] .section-title i[b-h12tbczfxq] {
    color: #60a5fa;
}

[data-theme="dark"] .book-card[b-h12tbczfxq] {
    background: rgba(30, 41, 59, 0.6);
    border-color: rgba(59, 130, 246, 0.2);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .book-card:hover[b-h12tbczfxq] {
    box-shadow: 0 8px 24px rgba(59, 130, 246, 0.2);
    border-color: #60a5fa;
}

[data-theme="dark"] .book-title[b-h12tbczfxq] {
    color: #f8fafc;
}

[data-theme="dark"] .book-author[b-h12tbczfxq] {
    color: #60a5fa;
}

[data-theme="dark"] .book-description[b-h12tbczfxq] {
    color: #cbd5e1;
}

[data-theme="dark"] .page-footer[b-h12tbczfxq] {
    border-top-color: rgba(59, 130, 246, 0.3);
}

[data-theme="dark"] .footer-note[b-h12tbczfxq] {
    background: rgba(251, 191, 36, 0.1);
    border-left-color: #fbbf24;
    color: #e2e8f0;
}

[data-theme="dark"] .footer-note i[b-h12tbczfxq] {
    color: #fbbf24;
}

[data-theme="dark"] .inline-link[b-h12tbczfxq] {
    color: #60a5fa;
}

[data-theme="dark"] .inline-link:hover[b-h12tbczfxq] {
    color: #93c5fd;
    border-bottom-color: #93c5fd;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 968px) {
    .page-container[b-h12tbczfxq] {
        padding: var(--spacing-xl) var(--spacing-md);
    }

    .section-title[b-h12tbczfxq] {
        font-size: var(--font-size-xl);
    }

    .books-grid[b-h12tbczfxq] {
        grid-template-columns: 1fr;
        gap: var(--spacing-lg);
    }

    .book-card[b-h12tbczfxq] {
        padding: var(--spacing-lg);
    }
}

@media (max-width: 640px) {
    .page-container[b-h12tbczfxq] {
        padding: var(--spacing-lg) var(--spacing-sm);
    }

    .section-title[b-h12tbczfxq] {
        font-size: var(--font-size-lg);
        flex-direction: column;
        align-items: flex-start;
        gap: var(--spacing-sm);
    }

    .library-legend[b-h12tbczfxq] {
        padding: var(--spacing-sm);
    }

    .legend-item[b-h12tbczfxq] {
        font-size: var(--font-size-xs);
    }

    .book-title[b-h12tbczfxq] {
        font-size: var(--font-size-base);
    }

    .book-description[b-h12tbczfxq] {
        font-size: var(--font-size-sm);
    }

    .footer-note[b-h12tbczfxq] {
        flex-direction: column;
        gap: var(--spacing-sm);
        padding: var(--spacing-md);
        font-size: var(--font-size-sm);
    }
}
/* /Components/Pages/MembershipPages/Cancel.razor.rz.scp.css */
/* ============================================
   Cancel Membership Page
   ============================================ */

.cancel-page[b-dmwjsc2x1k] {
    min-height: 100vh;
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);
    padding: 4rem 2rem;
}

.cancel-container[b-dmwjsc2x1k] {
    max-width: 700px;
    margin: 0 auto;
}

/* ============================================
   Loading, Error & No Subscription States
   ============================================ */

.loading-state[b-dmwjsc2x1k],
.error-state[b-dmwjsc2x1k],
.no-subscription[b-dmwjsc2x1k],
.success-state[b-dmwjsc2x1k] {
    background: white;
    border-radius: 1rem;
    padding: 4rem 2rem;
    text-align: center;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.loading-state .spinner[b-dmwjsc2x1k] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-dmwjsc2x1k 0.8s linear infinite;
    margin: 0 auto 1.5rem;
}

@keyframes spin-b-dmwjsc2x1k {
    to { transform: rotate(360deg); }
}

.error-state i[b-dmwjsc2x1k],
.no-subscription i[b-dmwjsc2x1k],
.success-state i[b-dmwjsc2x1k] {
    font-size: 4rem;
    margin-bottom: 1.5rem;
}

.error-state i[b-dmwjsc2x1k] { color: #dc2626; }
.no-subscription i[b-dmwjsc2x1k] { color: var(--wilson-blue, #4A6FA5); }
.success-state i[b-dmwjsc2x1k] { color: #10b981; }

.error-state h2[b-dmwjsc2x1k],
.no-subscription h2[b-dmwjsc2x1k],
.success-state h2[b-dmwjsc2x1k] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    color: #111827;
    margin: 0 0 1rem 0;
    text-transform: uppercase;
}

.error-state p[b-dmwjsc2x1k],
.no-subscription p[b-dmwjsc2x1k],
.success-state p[b-dmwjsc2x1k],
.loading-state p[b-dmwjsc2x1k] {
    color: #6b7280;
    margin: 0 0 2rem 0;
    font-size: 1rem;
}

.btn-back[b-dmwjsc2x1k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.875rem 2rem;
    background: var(--cedar-green, #2D5016);
    color: white;
    text-decoration: none;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.2s;
}

.btn-back:hover[b-dmwjsc2x1k] {
    background: #1a3a0d;
    transform: translateY(-2px);
}

/* ============================================
   Cancel Content
   ============================================ */

.cancel-content[b-dmwjsc2x1k] {
    background: white;
    border-radius: 1rem;
    padding: 2.5rem;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.cancel-header[b-dmwjsc2x1k] {
    text-align: center;
    margin-bottom: 2.5rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.cancel-header i[b-dmwjsc2x1k] {
    font-size: 3rem;
    color: #dc2626;
    margin-bottom: 1rem;
    display: block;
}

.cancel-header h1[b-dmwjsc2x1k] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    color: #111827;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
}

.cancel-header p[b-dmwjsc2x1k] {
    color: #6b7280;
    margin: 0;
    font-size: 1rem;
}

/* ============================================
   Current Plan Section
   ============================================ */

.current-plan[b-dmwjsc2x1k] {
    margin-bottom: 2rem;
}

.current-plan h3[b-dmwjsc2x1k],
.cancellation-reason h3[b-dmwjsc2x1k],
.cancellation-options h3[b-dmwjsc2x1k],
.keep-benefits h3[b-dmwjsc2x1k] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    color: #111827;
    margin: 0 0 1rem 0;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.plan-details[b-dmwjsc2x1k] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1.5rem;
    background: rgba(0, 0, 0, 0.02);
    border-radius: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.tier-badge[b-dmwjsc2x1k] {
    display: inline-block;
    padding: 0.375rem 1rem;
    border-radius: 50px;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.badge-champion[b-dmwjsc2x1k] {
    background: var(--wheat-gold, #D4AF37);
    color: #000000;
}

.badge-premium[b-dmwjsc2x1k] {
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
}

.badge-standard[b-dmwjsc2x1k] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue, #4A6FA5);
}

.badge-basic[b-dmwjsc2x1k] {
    background: rgba(0, 0, 0, 0.08);
    color: #666666;
}

.badge-family[b-dmwjsc2x1k] {
    background: rgba(var(--tobacco-barn-red-rgb), 0.15);
    color: var(--tobacco-barn-red);
}

.badge-community[b-dmwjsc2x1k] {
    background: rgba(0, 0, 0, 0.05);
    color: #9ca3af;
}

.plan-info[b-dmwjsc2x1k] {
    flex: 1;
}

.plan-info p[b-dmwjsc2x1k] {
    margin: 0 0 0.5rem 0;
    color: #374151;
    font-size: 0.9375rem;
}

.plan-info p:last-child[b-dmwjsc2x1k] {
    margin-bottom: 0;
}

/* ============================================
   Cancellation Reason
   ============================================ */

.cancellation-reason[b-dmwjsc2x1k] {
    margin-bottom: 2rem;
}

[b-dmwjsc2x1k] .form-select {
    width: 100%;
    padding: 0.875rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
    font-size: 1rem;
    color: #374151;
    background: white;
    cursor: pointer;
    transition: border-color 0.2s;
}

[b-dmwjsc2x1k] .form-select:focus {
    outline: none;
    border-color: var(--wilson-blue, #4A6FA5);
}

[b-dmwjsc2x1k] .form-textarea,
.form-textarea[b-dmwjsc2x1k] {
    width: 100%;
    padding: 0.875rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.5rem;
    font-size: 1rem;
    color: #374151;
    font-family: inherit;
    resize: vertical;
    margin-top: 1rem;
    transition: border-color 0.2s;
}

[b-dmwjsc2x1k] .form-textarea:focus,
.form-textarea:focus[b-dmwjsc2x1k] {
    outline: none;
    border-color: var(--wilson-blue, #4A6FA5);
}

/* ============================================
   Cancellation Options
   ============================================ */

.cancellation-options[b-dmwjsc2x1k] {
    margin-bottom: 2rem;
}

/* The membership does not renew automatically: it ends on its own (#8061). */
.term-note[b-dmwjsc2x1k] {
    margin: 0 0 1rem 0;
    color: #374151;
    font-size: 0.9375rem;
    line-height: 1.5;
}

.option-cards[b-dmwjsc2x1k] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.option-card[b-dmwjsc2x1k] {
    position: relative;
    display: block;
    padding: 1.5rem;
    background: white;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.75rem;
    cursor: pointer;
    transition: all 0.2s;
}

.option-card:hover[b-dmwjsc2x1k] {
    border-color: var(--wilson-blue, #4A6FA5);
}

.option-card.selected[b-dmwjsc2x1k] {
    border-color: var(--wilson-blue, #4A6FA5);
    background: rgba(var(--wilson-blue-rgb), 0.03);
}

.option-card input[type="radio"][b-dmwjsc2x1k] {
    position: absolute;
    opacity: 0;
}

.option-content[b-dmwjsc2x1k] {
    text-align: center;
}

.option-content i[b-dmwjsc2x1k] {
    font-size: 2rem;
    color: var(--wilson-blue, #4A6FA5);
    margin-bottom: 0.75rem;
    display: block;
}

.option-content strong[b-dmwjsc2x1k] {
    display: block;
    font-size: 1rem;
    color: #111827;
    margin-bottom: 0.5rem;
}

.option-content p[b-dmwjsc2x1k] {
    margin: 0;
    font-size: 0.875rem;
    color: #6b7280;
    line-height: 1.4;
}

.recommended[b-dmwjsc2x1k] {
    display: inline-block;
    margin-top: 0.75rem;
    padding: 0.25rem 0.75rem;
    background: var(--status-success);
    color: var(--status-ink);
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 50px;
}

/* ============================================
   Benefits List
   ============================================ */

.keep-benefits[b-dmwjsc2x1k] {
    margin-bottom: 2.5rem;
    padding: 1.5rem;
    background: #fef2f2;
    border-radius: 0.75rem;
    border: 1px solid #fecaca;
}

.keep-benefits h3[b-dmwjsc2x1k] {
    color: var(--status-danger);
}

.benefits-list[b-dmwjsc2x1k] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.benefits-list li[b-dmwjsc2x1k] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
    color: #374151;
    font-size: 0.9375rem;
}

.benefits-list li i[b-dmwjsc2x1k] {
    color: #dc2626;
    font-size: 0.875rem;
}

/* ============================================
   Action Buttons
   ============================================ */

.action-buttons[b-dmwjsc2x1k] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.btn-keep[b-dmwjsc2x1k] {
    padding: 1rem 2rem;
    background: var(--cedar-green, #2D5016);
    color: white;
    text-decoration: none;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.2s;
}

.btn-keep:hover[b-dmwjsc2x1k] {
    background: #1a3a0d;
    transform: translateY(-2px);
}

.btn-cancel[b-dmwjsc2x1k] {
    padding: 1rem 2rem;
    background: transparent;
    color: #dc2626;
    border: 2px solid #dc2626;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel:hover:not(:disabled)[b-dmwjsc2x1k] {
    background: #dc2626;
    color: white;
}

.btn-cancel:disabled[b-dmwjsc2x1k] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 640px) {
    .cancel-page[b-dmwjsc2x1k] {
        padding: 2rem 1rem;
    }

    .cancel-content[b-dmwjsc2x1k] {
        padding: 1.5rem;
    }

    .plan-details[b-dmwjsc2x1k] {
        flex-direction: column;
        gap: 1rem;
    }

    .option-cards[b-dmwjsc2x1k] {
        grid-template-columns: 1fr;
    }

    .action-buttons[b-dmwjsc2x1k] {
        flex-direction: column-reverse;
    }

    .btn-keep[b-dmwjsc2x1k],
    .btn-cancel[b-dmwjsc2x1k] {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}
/* /Components/Pages/MembershipPages/Checkout.razor.rz.scp.css */
.checkout-container[b-voyxu5u1ki] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.checkout-grid[b-voyxu5u1ki] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 2rem;
    align-items: start;
}

/* Order Summary */
.order-summary[b-voyxu5u1ki] {
    background: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 2rem;
}

.order-summary h2[b-voyxu5u1ki] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.summary-item[b-voyxu5u1ki] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 0;
    border-bottom: 1px solid var(--limestone-cream);
}

.summary-item:last-child[b-voyxu5u1ki] {
    border-bottom: none;
}

.summary-item .tier-name[b-voyxu5u1ki] {
    font-weight: 700;
    color: var(--cedar-green);
}

.summary-item .tier-name.highlight[b-voyxu5u1ki] {
    color: var(--wheat-gold);
}

.summary-item.current-tier[b-voyxu5u1ki] {
    opacity: 0.7;
}

.summary-item.current-tier .tier-name[b-voyxu5u1ki] {
    text-decoration: line-through;
    color: #666;
}

/* Upgrade Badge */
.upgrade-summary-badge[b-voyxu5u1ki] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    background: linear-gradient(135deg, var(--wheat-gold) 0%, #F5D678 100%);
    color: var(--cedar-green);
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.upgrade-summary-badge i[b-voyxu5u1ki] {
    font-size: 1.125rem;
}

.summary-divider[b-voyxu5u1ki] {
    border-top: 2px solid var(--cedar-green);
    margin: 1rem 0;
}

.summary-item.total[b-voyxu5u1ki] {
    font-size: 1.25rem;
    font-weight: 700;
    padding-top: 1.5rem;
}

.summary-item.total .amount[b-voyxu5u1ki] {
    font-size: 2rem;
    color: var(--cedar-green);
}

.benefits-recap[b-voyxu5u1ki] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
}

.benefits-recap h3[b-voyxu5u1ki] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.benefits-recap ul[b-voyxu5u1ki] {
    list-style: none;
    padding: 0;
}

.benefits-recap li[b-voyxu5u1ki] {
    padding: 0.5rem 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #666;
}

.benefits-recap li i[b-voyxu5u1ki] {
    color: var(--cedar-green);
    margin-top: 0.25rem;
}

/* Payment Section */
.payment-section[b-voyxu5u1ki] {
    background: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.payment-section h2[b-voyxu5u1ki] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.error-message[b-voyxu5u1ki] {
    background: #fee;
    border: 2px solid #e44;
    color: #c33;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.error-message i[b-voyxu5u1ki] {
    font-size: 1.25rem;
}

.success-message[b-voyxu5u1ki] {
    background: #efe;
    border: 2px solid #4e4;
    color: #3c3;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.success-message i[b-voyxu5u1ki] {
    font-size: 1.25rem;
}

.payment-form[b-voyxu5u1ki] {
    margin-bottom: 2rem;
}

.payment-info-box[b-voyxu5u1ki] {
    background: var(--river-pearl);
    border: 1px solid var(--limestone-cream);
    border-radius: 0.5rem;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.payment-info-box p[b-voyxu5u1ki] {
    margin: 0;
    color: #666;
    font-size: 0.95rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.payment-info-box p:first-child[b-voyxu5u1ki] {
    margin-bottom: 0.75rem;
}

.payment-info-box p i[b-voyxu5u1ki] {
    color: var(--cedar-green);
    margin-top: 0.125rem;
}

#card-container[b-voyxu5u1ki] {
    min-height: 120px;
    padding: 1rem;
    background: var(--river-pearl);
    border: 2px solid var(--limestone-cream);
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
}

.payment-btn[b-voyxu5u1ki] {
    width: 100%;
    padding: 1rem 2rem;
    font-size: 1.25rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.payment-btn:hover:not(:disabled)[b-voyxu5u1ki] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.payment-btn:disabled[b-voyxu5u1ki] {
    opacity: 0.6;
    cursor: not-allowed;
}

.payment-btn i[b-voyxu5u1ki] {
    margin-right: 0.5rem;
}

.secure-badge[b-voyxu5u1ki] {
    text-align: center;
    margin-top: 1rem;
    color: #666;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.secure-badge i[b-voyxu5u1ki] {
    color: var(--cedar-green);
}

.payment-info[b-voyxu5u1ki] {
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
}

.payment-info p[b-voyxu5u1ki] {
    margin-bottom: 0.5rem;
}

.payment-info a[b-voyxu5u1ki] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.payment-info a:hover[b-voyxu5u1ki] {
    color: var(--cedar-green);
}

/* Processing Overlay */
.processing-overlay[b-voyxu5u1ki] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.processing-spinner[b-voyxu5u1ki] {
    background: white;
    padding: 3rem;
    border-radius: 1rem;
    text-align: center;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.processing-spinner i[b-voyxu5u1ki] {
    font-size: 3rem;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.processing-spinner p[b-voyxu5u1ki] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cedar-green);
}

/* Responsive Design */
@media (max-width: 992px) {
    .checkout-grid[b-voyxu5u1ki] {
        grid-template-columns: 1fr;
    }

    .order-summary[b-voyxu5u1ki] {
        position: static;
    }
}

@media (max-width: 768px) {

    .payment-btn[b-voyxu5u1ki] {
        font-size: 1.125rem;
    }
}

/* No-auto-renewal reassurance under the order total */
.checkout-no-autorenew[b-voyxu5u1ki] {
    margin-top: 1rem;
    padding: 0.875rem 1rem;
    background: rgba(var(--wheat-gold-rgb), 0.10);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    color: #4b5563;
    font-size: 0.875rem;
    line-height: 1.5;
    display: flex;
    gap: 0.625rem;
    align-items: flex-start;
}

.checkout-no-autorenew i[b-voyxu5u1ki] {
    color: var(--wheat-gold, #D4AF37);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.checkout-no-autorenew strong[b-voyxu5u1ki] {
    color: #111827;
}
/* /Components/Pages/MembershipPages/Confirm.razor.rz.scp.css */
.confirm-container[b-nw6v831rpr] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background: linear-gradient(135deg, var(--river-pearl) 0%, var(--limestone-cream) 100%);
}

/* Processing State */
.processing-state[b-nw6v831rpr] {
    text-align: center;
    max-width: 500px;
    background: white;
    padding: 4rem 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.spinner[b-nw6v831rpr] {
    font-size: 4rem;
    color: var(--cedar-green);
    margin-bottom: 2rem;
    animation: pulse-b-nw6v831rpr 2s ease-in-out infinite;
}

@keyframes pulse-b-nw6v831rpr {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.7;
        transform: scale(1.1);
    }
}

.processing-state h1[b-nw6v831rpr] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.processing-state p[b-nw6v831rpr] {
    font-size: 1.125rem;
    color: #666;
    margin-bottom: 0.5rem;
}

.processing-state .note[b-nw6v831rpr] {
    font-size: 0.875rem;
    color: #999;
    font-style: italic;
    margin-top: 1.5rem;
}

/* Error State */
.error-state[b-nw6v831rpr] {
    text-align: center;
    max-width: 600px;
    background: white;
    padding: 4rem 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.error-state i[b-nw6v831rpr] {
    font-size: 4rem;
    color: #ef4444;
    margin-bottom: 1.5rem;
}

.error-state h1[b-nw6v831rpr] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.error-message[b-nw6v831rpr] {
    font-size: 1.125rem;
    color: #666;
    margin-bottom: 2rem;
    padding: 1rem;
    background: #fee;
    border: 1px solid #fcc;
    border-radius: 0.5rem;
}

.error-actions[b-nw6v831rpr] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 2rem;
}

/* Buttons */
.btn[b-nw6v831rpr] {
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-nw6v831rpr] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-primary:hover[b-nw6v831rpr] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--cedar-green-rgb), 0.3);
}

.btn-secondary[b-nw6v831rpr] {
    background: white;
    color: var(--cedar-green);
    border: 2px solid var(--cedar-green);
}

.btn-secondary:hover[b-nw6v831rpr] {
    background: var(--river-pearl);
    transform: translateY(-2px);
}

/* Responsive Design */
@media (max-width: 768px) {
    .processing-state[b-nw6v831rpr],
    .error-state[b-nw6v831rpr] {
        padding: 3rem 2rem;
    }

    .processing-state h1[b-nw6v831rpr],
    .error-state h1[b-nw6v831rpr] {
        font-size: 1.5rem;
    }

    .error-actions[b-nw6v831rpr] {
        flex-direction: column;
    }

    .btn[b-nw6v831rpr] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/MembershipPages/Membership.razor.rz.scp.css */
/* ============================================
   Membership Page - Editorial Design
   Matches Home/About flat design pattern
   ============================================ */

.membership-page[b-pqdhwpadto] {
    background: #ffffff;
}

/* ============================================
   Hero Section - Black, Bold Typography
   ============================================ */

.hero[b-pqdhwpadto] {
    min-height: 60vh;
    display: flex;
    align-items: center;
    padding: 8rem 4rem;
    background: #000000;
    position: relative;
    overflow: hidden;
}

.dot[b-pqdhwpadto] {
    margin: 0 1rem;
    opacity: 0.3;
}

.hero-actions[b-pqdhwpadto] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.action-link[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 1rem 2rem;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.action-link.primary[b-pqdhwpadto] {
    background: var(--wheat-gold);
    color: #000000;
}

.action-link.primary:hover[b-pqdhwpadto] {
    background: #ffffff;
    transform: translateY(-2px);
}

.action-link:not(.primary)[b-pqdhwpadto] {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}

.action-link:not(.primary):hover[b-pqdhwpadto] {
    border-color: var(--wheat-gold);
    color: var(--wheat-gold);
}

/* ============================================
   Status & Notice Banners
   ============================================ */

.status-banner[b-pqdhwpadto] {
    background: linear-gradient(135deg, var(--wheat-gold) 0%, #C49F27 100%);
    padding: 2rem 4rem;
}

.status-content[b-pqdhwpadto] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.status-icon[b-pqdhwpadto] {
    font-size: 2rem;
    color: #000000;
}

.status-text strong[b-pqdhwpadto] {
    display: block;
    font-size: 1.125rem;
    color: #000000;
    margin-bottom: 0.25rem;
}

.status-text p[b-pqdhwpadto] {
    margin: 0;
    color: rgba(0, 0, 0, 0.7);
    font-size: 0.95rem;
}

/* How this member's renewal is priced, or who renews for them (#7683): a second line under the tier. */
.status-text .family-renewal[b-pqdhwpadto] {
    margin-top: 0.5rem;
    color: #000000;
    font-weight: 600;
}

.notice-banner[b-pqdhwpadto] {
    background: var(--river-pearl);
    padding: 1.5rem 4rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.notice-content[b-pqdhwpadto] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 0.95rem;
    color: #666;
}

.notice-content i[b-pqdhwpadto] {
    color: var(--wheat-gold);
    font-size: 1.25rem;
}

/* ============================================
   Tiers Section - Editorial Layout
   ============================================ */

.tiers-section[b-pqdhwpadto] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.section-header[b-pqdhwpadto] {
    margin-bottom: 4rem;
}

.section-header h2[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.tiers-grid[b-pqdhwpadto] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(400px, 100%), 1fr));
    gap: 3rem;
}

.tiers-grid.upgrade-mode[b-pqdhwpadto] {
    max-width: 500px;
}

.tier-block[b-pqdhwpadto] {
    padding: 3rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    position: relative;
    transition: all 0.3s ease;
}

.tier-block:hover[b-pqdhwpadto] {
    border-color: rgba(0, 0, 0, 0.2);
}

.tier-block.featured[b-pqdhwpadto] {
    border-color: var(--wheat-gold);
    border-width: 2px;
}

.featured-badge[b-pqdhwpadto] {
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    background: var(--wheat-gold);
    color: #000000;
    padding: 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.tier-block.featured[b-pqdhwpadto] {
    padding-top: 5rem;
}

/* The tier's eyebrow ("01", "UPGRADE", "CURRENT") is small text on the white tier card: it
   takes the muted-text token, which reads at 4.5:1 on every light ground (#8289). The 30% black
   it replaces measured 2.09:1. */
.tier-number[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    text-transform: uppercase;
}

.tier-header[b-pqdhwpadto] {
    margin-bottom: 1.5rem;
}

.tier-icon[b-pqdhwpadto] {
    font-size: 2rem;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.tier-header h3[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
}

.tier-price[b-pqdhwpadto] {
    font-family: var(--font-display);
}

.tier-price .amount[b-pqdhwpadto] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
}

.tier-price .period[b-pqdhwpadto] {
    font-size: 1rem;
    color: #666;
}

.tier-tagline[b-pqdhwpadto] {
    font-size: 1rem;
    color: #666;
    margin-bottom: 2rem;
    font-style: italic;
}

.tier-benefits[b-pqdhwpadto] {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
}

.tier-benefits li[b-pqdhwpadto] {
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.95rem;
    line-height: 1.5;
}

.tier-benefits li:last-child[b-pqdhwpadto] {
    border-bottom: none;
}

.tier-benefits li i[b-pqdhwpadto] {
    color: var(--cedar-green);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.tier-action[b-pqdhwpadto] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #000000;
    text-decoration: none;
    padding: 1rem 0;
    border-bottom: 2px solid #000000;
    transition: all 0.3s ease;
}

.tier-action:hover[b-pqdhwpadto] {
    color: var(--cedar-green);
    border-color: var(--cedar-green);
}

.tier-action.upgrade[b-pqdhwpadto] {
    background: var(--wheat-gold);
    color: #000000;
    padding: 1rem 2rem;
    border: none;
    width: 100%;
    justify-content: center;
}

.tier-action.upgrade:hover[b-pqdhwpadto] {
    background: #C49F27;
    transform: translateY(-2px);
}

.tier-action.current[b-pqdhwpadto] {
    background: var(--cedar-green);
    color: #ffffff;
    padding: 1rem 2rem;
    border: none;
    width: 100%;
    justify-content: center;
    cursor: default;
}

/* ============================================
   Active Member Styles
   ============================================ */

.status-banner.active-member[b-pqdhwpadto] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, #1e3a0f 100%);
}

.status-banner.active-member .status-icon[b-pqdhwpadto] {
    color: var(--wheat-gold);
}

.status-banner.active-member .status-text strong[b-pqdhwpadto] {
    color: #ffffff;
}

.status-banner.active-member .status-text p[b-pqdhwpadto] {
    color: rgba(255, 255, 255, 0.8);
}

.status-action[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 0.75rem 1.5rem;
    background: var(--wheat-gold);
    color: #000000;
    text-decoration: none;
    transition: all 0.3s ease;
    margin-left: auto;
}

.status-action:hover[b-pqdhwpadto] {
    background: #ffffff;
    transform: translateY(-2px);
}

.current-plan-badge[b-pqdhwpadto] {
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    background: var(--cedar-green);
    color: #ffffff;
    padding: 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.tier-block.current-plan[b-pqdhwpadto] {
    border-color: var(--cedar-green);
    border-width: 2px;
    padding-top: 5rem;
}

.tiers-grid.current-plan-mode[b-pqdhwpadto] {
    max-width: 500px;
}

/* ============================================
   Partner Benefit - one block per partner in the organization's
   settings (#7827); none configured, no block
   ============================================ */

.partner-benefit[b-pqdhwpadto] {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    max-width: 960px;
    margin: 3.5rem auto 0;
    padding: 2.5rem 3rem;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-left: 4px solid var(--wheat-gold);
    border-radius: 4px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
}

.partner-benefit-media[b-pqdhwpadto] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.partner-logo[b-pqdhwpadto] {
    width: 140px;
    height: auto;
    display: block;
}

.partner-benefit-content[b-pqdhwpadto] {
    flex: 1 1 auto;
}

.partner-eyebrow[b-pqdhwpadto] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--wheat-gold);
    margin-bottom: 0.5rem;
}

.partner-benefit-content h3[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    margin: 0 0 0.75rem;
    color: #111111;
}

.partner-benefit-content p[b-pqdhwpadto] {
    margin: 0;
    line-height: 1.7;
    color: #444444;
}

.partner-link[b-pqdhwpadto] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1rem;
    font-weight: 600;
    color: var(--cedar-green);
    text-decoration: none;
}

.partner-link:hover[b-pqdhwpadto],
.partner-link:focus-visible[b-pqdhwpadto] {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .partner-benefit[b-pqdhwpadto] {
        flex-direction: column;
        text-align: center;
        gap: 1.5rem;
        padding: 2rem 1.5rem;
    }
}

/* ============================================
   Comparison Section
   ============================================ */

.comparison-section[b-pqdhwpadto] {
    background: var(--river-pearl);
    padding: 6rem 4rem;
}

.comparison-section .section-header[b-pqdhwpadto] {
    max-width: 1200px;
    margin: 0 auto 4rem;
}

.comparison-table-wrap[b-pqdhwpadto] {
    max-width: 800px;
    margin: 0 auto;
    overflow-x: auto;
}

.comparison-table[b-pqdhwpadto] {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
}

.comparison-table th[b-pqdhwpadto],
.comparison-table td[b-pqdhwpadto] {
    padding: 1.25rem 1.5rem;
    text-align: left;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.comparison-table thead[b-pqdhwpadto] {
    background: #000000;
    color: #ffffff;
}

.comparison-table th[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.comparison-table th.highlight[b-pqdhwpadto] {
    background: var(--cedar-green);
}

.comparison-table th.current[b-pqdhwpadto] {
    opacity: 0.7;
}

.comparison-table td[b-pqdhwpadto] {
    font-size: 0.95rem;
    color: #333;
}

.comparison-table td.highlight[b-pqdhwpadto] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    font-weight: 500;
}

.comparison-table td.current[b-pqdhwpadto] {
    color: #999;
}

.comparison-table td i[b-pqdhwpadto] {
    color: var(--cedar-green);
}

/* ============================================
   FAQ Section
   ============================================ */

.faq-section[b-pqdhwpadto] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.faq-grid[b-pqdhwpadto] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

.faq-item[b-pqdhwpadto] {
    padding: 2rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.faq-item h3[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: #000000;
    margin: 0 0 1rem 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.faq-item h3 i[b-pqdhwpadto] {
    color: var(--wheat-gold);
    margin-top: 0.1rem;
}

.faq-item p[b-pqdhwpadto] {
    margin: 0;
    color: #666;
    line-height: 1.6;
}

/* ============================================
   CTA Section
   ============================================ */

.cta-section[b-pqdhwpadto] {
    background: #000000;
    padding: 6rem 4rem;
    text-align: center;
}

.cta-content[b-pqdhwpadto] {
    max-width: 600px;
    margin: 0 auto;
}

.cta-content h2[b-pqdhwpadto] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 1rem 0;
}

.cta-content h2 .gold[b-pqdhwpadto] {
    /* The cta band is dark (its h2 is white), so this is the on-dark accent. */
    color: var(--accent-text-on-dark);
}

.cta-content > p[b-pqdhwpadto] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.125rem;
    margin: 0 0 2rem 0;
}

.cta-actions[b-pqdhwpadto] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .hero[b-pqdhwpadto] {
        padding: 6rem 2rem;
        min-height: 50vh;
    }

    .hero-actions[b-pqdhwpadto] {
        flex-direction: column;
    }

    .action-link[b-pqdhwpadto] {
        width: 100%;
        justify-content: center;
    }

    .status-banner[b-pqdhwpadto],
    .notice-banner[b-pqdhwpadto] {
        padding: 1.5rem 2rem;
    }

    .status-content[b-pqdhwpadto] {
        flex-direction: column;
        text-align: center;
    }

    .status-action[b-pqdhwpadto] {
        margin-left: 0;
        margin-top: 1rem;
    }

    .tiers-section[b-pqdhwpadto],
    .comparison-section[b-pqdhwpadto],
    .faq-section[b-pqdhwpadto],
    .cta-section[b-pqdhwpadto] {
        padding: 4rem 2rem;
    }

    .tiers-grid[b-pqdhwpadto] {
        grid-template-columns: 1fr;
    }

    .tier-block[b-pqdhwpadto] {
        padding: 2rem;
    }

    .section-header h2[b-pqdhwpadto] {
        font-size: 2rem;
    }

    .cta-content h2[b-pqdhwpadto] {
        font-size: 2rem;
    }

    .cta-actions[b-pqdhwpadto] {
        flex-direction: column;
    }
}

/* Reassurance callout on Basic tier — no auto-renewal */
.tier-no-autorenew[b-pqdhwpadto] {
    margin-top: 1rem;
    padding: 0.75rem 0.875rem;
    background: rgba(var(--wheat-gold-rgb), 0.10);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    color: #4b5563;
    font-size: 0.85rem;
    line-height: 1.5;
    display: flex;
    gap: 0.625rem;
    align-items: flex-start;
}

.tier-no-autorenew i[b-pqdhwpadto] {
    color: var(--wheat-gold, #D4AF37);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.tier-no-autorenew strong[b-pqdhwpadto] {
    color: #111827;
}
/* /Components/Pages/MembershipPages/Success.razor.rz.scp.css */
.success-container[b-hc5ytcqo2u] {
    max-width: 800px;
    margin: 0 auto;
    padding: 3rem 1rem;
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.success-card[b-hc5ytcqo2u] {
    background: white;
    padding: 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
    text-align: center;
    /* A flex item never narrower than its content by default: one unbreakable line inside made
       the card 596px wide on a 390px phone (#8149). It takes the screen's width instead, and a
       long word (an email address) breaks rather than widening the page. */
    min-width: 0;
    overflow-wrap: break-word;
}

.success-icon[b-hc5ytcqo2u] {
    font-size: 5rem;
    color: #22c55e;
    margin-bottom: 2rem;
    animation: scaleIn-b-hc5ytcqo2u 0.5s ease;
}

.success-icon.upgrade[b-hc5ytcqo2u],
.success-icon.renewal[b-hc5ytcqo2u] {
    color: var(--wheat-gold);
}

@keyframes scaleIn-b-hc5ytcqo2u {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

.success-card h1[b-hc5ytcqo2u] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.success-message[b-hc5ytcqo2u] {
    font-size: 1.25rem;
    color: #666;
    margin-bottom: 3rem;
    line-height: 1.6;
}

.success-details[b-hc5ytcqo2u] {
    background: var(--river-pearl);
    padding: 2rem;
    border-radius: 0.75rem;
    margin-bottom: 3rem;
    text-align: left;
}

.detail-item[b-hc5ytcqo2u] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--limestone-cream);
}

.detail-item:last-child[b-hc5ytcqo2u] {
    border-bottom: none;
    padding-bottom: 0;
}

.detail-item i[b-hc5ytcqo2u] {
    font-size: 1.5rem;
    color: var(--cedar-green);
    margin-top: 0.25rem;
}

.detail-item strong[b-hc5ytcqo2u] {
    display: block;
    font-size: 1.125rem;
    color: var(--cedar-green);
    margin-bottom: 0.25rem;
}

.detail-item p[b-hc5ytcqo2u] {
    color: #666;
    font-size: 0.95rem;
    margin: 0;
}

/* Family Member Callout */
.family-member-callout[b-hc5ytcqo2u] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    padding: 2rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    box-shadow: 0 4px 12px rgba(var(--cedar-green-rgb), 0.2);
    animation: slideIn-b-hc5ytcqo2u 0.5s ease;
}

@keyframes slideIn-b-hc5ytcqo2u {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.callout-icon[b-hc5ytcqo2u] {
    font-size: 3rem;
    flex-shrink: 0;
}

.callout-content[b-hc5ytcqo2u] {
    flex: 1;
}

.callout-content h3[b-hc5ytcqo2u] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: white;
}

.callout-content p[b-hc5ytcqo2u] {
    margin-bottom: 1rem;
    opacity: 0.95;
    line-height: 1.6;
}

.btn-primary-outline[b-hc5ytcqo2u] {
    background: white;
    color: var(--cedar-green);
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.btn-primary-outline:hover[b-hc5ytcqo2u] {
    background: var(--river-pearl);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.next-steps[b-hc5ytcqo2u] {
    text-align: left;
    margin-bottom: 3rem;
}

.next-steps h2[b-hc5ytcqo2u] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    text-align: center;
}

.next-steps ul[b-hc5ytcqo2u],
.next-steps ol[b-hc5ytcqo2u] {
    list-style: none;
    padding: 0;
}

.next-steps li[b-hc5ytcqo2u] {
    padding: 1rem;
    margin-bottom: 0.75rem;
    background: white;
    border: 2px solid var(--limestone-cream);
    border-radius: 0.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    font-size: 1rem;
    line-height: 1.6;
    transition: all 0.3s ease;
}

.next-steps li:hover[b-hc5ytcqo2u] {
    border-color: var(--cedar-green);
    background: var(--river-pearl);
}

/* The step's words are ONE flex item beside the icon (#8149). Loose, each text run and each
   <strong> was an item of its own, laid side by side, and the row could not wrap between them. */
.next-steps .step-text[b-hc5ytcqo2u] {
    flex: 1;
    min-width: 0;
}

.next-steps li i[b-hc5ytcqo2u] {
    color: var(--wilson-blue);
    font-size: 1.25rem;
    margin-top: 0.125rem;
}

.next-steps a[b-hc5ytcqo2u] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.next-steps a:hover[b-hc5ytcqo2u] {
    color: var(--cedar-green);
}

.action-buttons[b-hc5ytcqo2u] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 3rem;
}

.btn[b-hc5ytcqo2u] {
    padding: 1rem 2rem;
    font-size: 1.125rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-hc5ytcqo2u] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-primary:hover[b-hc5ytcqo2u] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
}

.btn-secondary[b-hc5ytcqo2u] {
    background: var(--wheat-gold);
    color: var(--on-gold);
}

.btn-secondary:hover[b-hc5ytcqo2u] {
    background: #C49F27;
    transform: translateY(-2px);
}

.btn-tertiary[b-hc5ytcqo2u] {
    background: white;
    color: var(--cedar-green);
    border: 2px solid var(--cedar-green);
}

.btn-tertiary:hover[b-hc5ytcqo2u] {
    background: var(--river-pearl);
    transform: translateY(-2px);
}

.help-section[b-hc5ytcqo2u] {
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
    color: #666;
    font-size: 0.95rem;
}

.help-section a[b-hc5ytcqo2u] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.help-section a:hover[b-hc5ytcqo2u] {
    color: var(--cedar-green);
}

/* Responsive Design */
@media (max-width: 768px) {
    .success-card[b-hc5ytcqo2u] {
        padding: 2rem 1.5rem;
    }

    .success-card h1[b-hc5ytcqo2u] {
        font-size: 2rem;
    }

    .success-message[b-hc5ytcqo2u] {
        font-size: 1.125rem;
    }

    .family-member-callout[b-hc5ytcqo2u] {
        flex-direction: column;
        text-align: center;
        padding: 1.5rem;
    }

    .callout-content h3[b-hc5ytcqo2u] {
        font-size: 1.25rem;
    }

    .btn-primary-outline[b-hc5ytcqo2u] {
        width: 100%;
        justify-content: center;
    }

    .action-buttons[b-hc5ytcqo2u] {
        flex-direction: column;
    }

    .btn[b-hc5ytcqo2u] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/Members/Directory.razor.rz.scp.css */
/* ============================================
   Member Directory
   Editorial Design - Matches News/Membership
   ============================================ */

.directory-page[b-mvsm8qvahr] {
    background: #ffffff;
}

/* ============================================
   Search Section
   ============================================ */

.search-section[b-mvsm8qvahr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem 4rem 2rem;
}

.search-container[b-mvsm8qvahr] {
    position: relative;
    max-width: 600px;
}

.search-input[b-mvsm8qvahr] {
    width: 100%;
    padding: 1rem 3rem 1rem 1.5rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    font-size: 1rem;
    font-family: var(--font-sans);
    background: transparent;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.search-input:focus[b-mvsm8qvahr] {
    outline: none;
    border-bottom-color: var(--cedar-green);
}

.search-input[b-mvsm8qvahr]::placeholder {
    color: #9ca3af;
}

.clear-search[b-mvsm8qvahr] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: var(--color-text-secondary);
    cursor: pointer;
    padding: 0.5rem;
    transition: color 0.2s;
}

.clear-search:hover[b-mvsm8qvahr] {
    color: var(--cedar-green);
}

/* ============================================
   Content Section
   ============================================ */

.content-section[b-mvsm8qvahr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 4rem 6rem;
}

/* ============================================
   Loading, Error & No Results
   ============================================ */

.loading-state[b-mvsm8qvahr],
.error-state[b-mvsm8qvahr] {
    text-align: center;
    padding: 6rem 2rem;
    color: var(--color-text-secondary);
}

.loading-state .spinner[b-mvsm8qvahr] {
    width: 3rem;
    height: 3rem;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--cedar-green);
    border-radius: 50%;
    animation: spin-b-mvsm8qvahr 0.8s linear infinite;
    margin: 0 auto 1.5rem;
}

@keyframes spin-b-mvsm8qvahr {
    to { transform: rotate(360deg); }
}

.loading-state p[b-mvsm8qvahr],
.error-state p[b-mvsm8qvahr] {
    margin: 0;
    font-size: 1rem;
}

.error-state[b-mvsm8qvahr] {
    color: var(--tobacco-barn-red);
}

.error-state i[b-mvsm8qvahr] {
    font-size: 3rem;
    margin-bottom: 1rem;
    display: block;
}

/* ============================================
   Members Grid
   ============================================ */

.members-grid[b-mvsm8qvahr] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 2rem;
}

/* ============================================
   Member Card - Flat Editorial Style
   ============================================ */

.member-card[b-mvsm8qvahr] {
    background: transparent;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-align: left;
    width: 100%;
}

.member-card:hover[b-mvsm8qvahr] {
    border-color: var(--cedar-green);
    background: rgba(var(--cedar-green-rgb), 0.02);
}

.member-card-header[b-mvsm8qvahr] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.member-photo[b-mvsm8qvahr] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(0, 0, 0, 0.1);
    flex-shrink: 0;
}

.member-photo-placeholder[b-mvsm8qvahr] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-secondary);
    font-size: 1.5rem;
    flex-shrink: 0;
}

.member-info[b-mvsm8qvahr] {
    flex: 1;
    min-width: 0;
}

.member-name[b-mvsm8qvahr] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.01em;
}

/* ============================================
   Membership Badges - Tiers
   ============================================ */

.member-badge[b-mvsm8qvahr] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

.badge-champion[b-mvsm8qvahr] {
    background: var(--wheat-gold);
    color: #000000;
}

.badge-premium[b-mvsm8qvahr] {
    background: var(--cedar-green);
    color: #ffffff;
}

.badge-standard[b-mvsm8qvahr] {
    background: rgba(var(--wilson-blue-rgb), 0.15);
    color: var(--wilson-blue);
}

.badge-basic[b-mvsm8qvahr] {
    background: rgba(0, 0, 0, 0.08);
    color: #666666;
}

.badge-family[b-mvsm8qvahr] {
    background: rgba(var(--tobacco-barn-red-rgb), 0.15);
    color: var(--tobacco-barn-red);
}

.badge-community[b-mvsm8qvahr] {
    background: rgba(0, 0, 0, 0.05);
    color: var(--color-text-secondary);
}

.badge-affiliate[b-mvsm8qvahr] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    color: var(--wilson-blue);
}

.badge-sponsor[b-mvsm8qvahr] {
    background: linear-gradient(135deg, var(--wheat-gold), #C49F27);
    color: #000000;
}

/* ============================================
   Member Card Content
   ============================================ */

.member-bio[b-mvsm8qvahr] {
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
    margin: 0 0 1rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.member-footer[b-mvsm8qvahr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    font-size: 0.8125rem;
}

.member-since[b-mvsm8qvahr] {
    color: var(--color-text-secondary);
}

.chess-profiles[b-mvsm8qvahr] {
    display: flex;
    gap: 0.5rem;
    color: var(--cedar-green);
}

.chess-profiles i[b-mvsm8qvahr] {
    opacity: 0.7;
    transition: opacity 0.2s;
}

.member-card:hover .chess-profiles i[b-mvsm8qvahr] {
    opacity: 1;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {
    .search-section[b-mvsm8qvahr] {
        padding: 3rem 2rem 1.5rem;
    }

    .content-section[b-mvsm8qvahr] {
        padding: 1.5rem 2rem 4rem;
    }

    .members-grid[b-mvsm8qvahr] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .member-card[b-mvsm8qvahr] {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    .search-section[b-mvsm8qvahr] {
        padding: 2rem 1.5rem 1rem;
    }

    .content-section[b-mvsm8qvahr] {
        padding: 1rem 1.5rem 3rem;
    }

    .member-card[b-mvsm8qvahr] {
        padding: 1.25rem;
    }

    .member-photo[b-mvsm8qvahr],
    .member-photo-placeholder[b-mvsm8qvahr] {
        width: 56px;
        height: 56px;
    }

    .member-name[b-mvsm8qvahr] {
        font-size: 1.125rem;
    }
}
/* /Components/Pages/Members/Leaderboard.razor.rz.scp.css */
/* ============================================
   Leaderboard Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.leaderboard-page[b-6vr5scdm3o] {
    background: #ffffff;
}

/* ============================================
   Loading & Error States
   ============================================ */

.loading-state[b-6vr5scdm3o],
.error-state[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
    text-align: center;
    color: var(--color-text-secondary);
}

.error-state[b-6vr5scdm3o] {
    color: var(--tobacco-barn-red);
}

/* ============================================
   Board view (#8170): this club / all clubs
   ============================================ */

.board-view-container[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 6rem auto 0;
    padding: 0 4rem;
    display: flex;
    justify-content: center;
}

.board-view-toggle[b-6vr5scdm3o] {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
}

.board-view-btn[b-6vr5scdm3o] {
    padding: 0.75rem 1.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 1px solid var(--color-text-secondary);
    border-radius: 999px;
    background: transparent;
    color: var(--color-text-secondary);
    cursor: pointer;
    font-family: var(--font-display);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.board-view-btn:hover:not(.active)[b-6vr5scdm3o] {
    color: #000000;
    border-color: #000000;
}

.board-view-btn.active[b-6vr5scdm3o] {
    color: #ffffff;
    background: #000000;
    border-color: #000000;
}

.board-view-pool[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 1.5rem auto 0;
    padding: 0 4rem;
    text-align: center;
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
}

/* The member's home club, under the name on the all-clubs view. */
.member-club[b-6vr5scdm3o] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--color-text-secondary);
}

/* ============================================
   Platform Toggle - Minimal Tabs
   ============================================ */

.platform-toggle-container[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
    display: flex;
    justify-content: center;
    margin-top: 8rem;
    margin-bottom: 4rem;
}

/* Under the board picker's pool line the tabs sit close to it (#8316, WALK-312-board b3): their own 8rem
   (4rem on a phone) was set for a page whose tabs come first under the hero, and stacked on the picker's
   6rem it floated the picker about 128 px above the board it chooses for. Two classes outrank the tabs'
   own margin, so this holds at every width. */
.board-view-pool ~ .platform-toggle-container[b-6vr5scdm3o] {
    margin-top: 2rem;
}

.platform-toggle[b-6vr5scdm3o] {
    display: inline-flex;
    gap: 0;
}

.toggle-btn[b-6vr5scdm3o] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
}

.toggle-btn:hover:not(.active)[b-6vr5scdm3o] {
    color: #000000;
    border-bottom-color: rgba(0, 0, 0, 0.2);
}

.toggle-btn.active[b-6vr5scdm3o] {
    color: #000000;
    border-bottom-color: #000000;
}

.platform-icon[b-6vr5scdm3o] {
    height: 20px;
    width: auto;
}

.lichess-icon[b-6vr5scdm3o] {
    filter: invert(0.4);
}

.toggle-btn.active .lichess-icon[b-6vr5scdm3o] {
    filter: invert(0);
}

/* ============================================
   Leaderboard Content
   ============================================ */

.leaderboard-content[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
}

/* ============================================
   QuickGrid Styling - Editorial
   ============================================ */

[b-6vr5scdm3o] .leaderboard-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9375rem;
}

[b-6vr5scdm3o] .leaderboard-grid thead {
    border-bottom: 2px solid #000000;
}

[b-6vr5scdm3o] .leaderboard-grid th {
    padding: 1.25rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    background: transparent;
    cursor: pointer;
    user-select: none;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-6vr5scdm3o] .leaderboard-grid th:hover {
    color: var(--cedar-green);
}

[b-6vr5scdm3o] .leaderboard-grid tbody tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-6vr5scdm3o] .leaderboard-grid tbody tr:hover {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

/* Hide empty rows when filtered */
[b-6vr5scdm3o] .leaderboard-grid tbody tr:has(td:empty) {
    display: none;
}

[b-6vr5scdm3o] .leaderboard-grid tbody tr:not(:has(*)) {
    display: none;
}

[b-6vr5scdm3o] .leaderboard-grid td {
    padding: 1.25rem 1rem;
    color: #374151;
    font-weight: 500;
}

/* Rank Column */
.rank-cell[b-6vr5scdm3o] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--cedar-green);
    cursor: pointer;
}

/* Member Info */
.member-info[b-6vr5scdm3o] {
    display: flex;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
}

.member-photo[b-6vr5scdm3o] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(0, 0, 0, 0.1);
}

.member-photo-placeholder[b-6vr5scdm3o] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(var(--cedar-green-rgb), 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--cedar-green);
    font-size: 1.25rem;
}

.member-name[b-6vr5scdm3o] {
    font-weight: 600;
    color: #000000;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.member-info:hover .member-name[b-6vr5scdm3o] {
    color: var(--cedar-green);
}

/* Username Link */
.username-link[b-6vr5scdm3o] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.username-link:hover[b-6vr5scdm3o] {
    color: var(--cedar-green-dark);
}

.username-link i[b-6vr5scdm3o] {
    font-size: 0.75rem;
    opacity: 0.7;
}

.username-empty[b-6vr5scdm3o] {
    color: var(--color-text-secondary);
    cursor: pointer;
}

/* Rating Cells */
.rating-cell[b-6vr5scdm3o] {
    font-family: var(--font-display);
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    text-align: center;
}

/* ============================================
   Pagination - Minimal
   ============================================ */

.pagination-container[b-6vr5scdm3o] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.results-info[b-6vr5scdm3o] {
    font-size: 0.875rem;
    color: var(--color-text-secondary);
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Paginator Override */
[b-6vr5scdm3o] nav {
    display: flex;
    gap: 0.5rem;
}

[b-6vr5scdm3o] nav button {
    padding: 0.75rem 1.25rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
}

[b-6vr5scdm3o] nav button:hover:not(:disabled) {
    border-bottom-color: var(--cedar-green);
    color: var(--cedar-green);
}

[b-6vr5scdm3o] nav button:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* ============================================
   Footer Note
   ============================================ */

.leaderboard-footer[b-6vr5scdm3o] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
    text-align: center;
}

.footer-note[b-6vr5scdm3o] {
    font-size: 0.9375rem;
    color: var(--color-text-secondary);
    margin: 0;
    line-height: 1.8;
}

.footer-note a[b-6vr5scdm3o] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.footer-note a:hover[b-6vr5scdm3o] {
    color: var(--cedar-green-dark);
    text-decoration: underline;
}

/* ============================================
   USCF Toggle Button
   ============================================ */

.platform-icon-uscf[b-6vr5scdm3o] {
    font-size: 1.125rem;
    color: inherit;
}

/* USCF Ratings - Provisional Badge */
.provisional-rating[b-6vr5scdm3o] {
    color: #f59e0b;
}

.provisional-badge[b-6vr5scdm3o] {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 700;
    background: #fef3c7;
    color: #d97706;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    margin-left: 0.375rem;
    text-transform: uppercase;
    vertical-align: middle;
}

/* USCF Membership Status */
.membership-status-active[b-6vr5scdm3o] {
    color: #059669;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.membership-status-expired[b-6vr5scdm3o] {
    color: #dc2626;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.membership-status-active i[b-6vr5scdm3o],
.membership-status-expired i[b-6vr5scdm3o] {
    font-size: 0.875rem;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .board-view-container[b-6vr5scdm3o] {
        margin-top: 3rem;
        padding: 0 1rem;
    }

    .board-view-pool[b-6vr5scdm3o] {
        padding: 0 1rem;
    }

    .board-view-btn[b-6vr5scdm3o] {
        padding: 0.75rem 1.25rem;
    }

    .platform-toggle-container[b-6vr5scdm3o] {
        margin-top: 4rem;
        padding: 0 2rem;
    }

    .platform-toggle[b-6vr5scdm3o] {
        width: 100%;
    }

    .toggle-btn[b-6vr5scdm3o] {
        flex: 1;
        justify-content: center;
        padding: 0.875rem 1.5rem;
        font-size: 0.875rem;
    }

    .leaderboard-content[b-6vr5scdm3o] {
        padding: 0 2rem;
        overflow-x: auto;
    }

    [b-6vr5scdm3o] .leaderboard-grid {
        font-size: 0.875rem;
        min-width: 600px;
    }

    [b-6vr5scdm3o] .leaderboard-grid th,
    [b-6vr5scdm3o] .leaderboard-grid td {
        padding: 1rem 0.75rem;
    }

    .member-photo[b-6vr5scdm3o],
    .member-photo-placeholder[b-6vr5scdm3o] {
        width: 36px;
        height: 36px;
    }

    .member-photo-placeholder i[b-6vr5scdm3o] {
        font-size: 1rem;
    }

    .pagination-container[b-6vr5scdm3o] {
        flex-direction: column;
        gap: 1.5rem;
        margin-top: 3rem;
    }

    .results-info[b-6vr5scdm3o] {
        text-align: center;
    }

    .leaderboard-footer[b-6vr5scdm3o] {
        padding: 3rem 2rem;
    }

    .loading-state[b-6vr5scdm3o],
    .error-state[b-6vr5scdm3o] {
        padding: 4rem 2rem;
    }
}
/* /Components/Pages/News.razor.rz.scp.css */
/* ============================================
   News Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.news-page[b-1iw01rue11] {
    background: #ffffff;
}







/* ============================================
   Filters - Minimal
   ============================================ */

/* The 8rem top gap was the page's stand-in for a hero margin; the shell's section
   supplies the spacing now, so the filters sit where the eye expects them. */
.news-filters[b-1iw01rue11] {
    display: flex;
    gap: 1.5rem;
    margin: 0 0 2.5rem 0;
    flex-wrap: wrap;
    min-width: 0;
}

.filter-select[b-1iw01rue11] {
    padding: 0.75rem 1.5rem;
    padding-right: 3rem;
    border: none;
    border-bottom: 2px solid rgba(0, 0, 0, 0.1);
    font-size: 0.875rem;
    font-weight: 600;
    color: #000000;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    appearance: none;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.filter-select:hover[b-1iw01rue11] {
    border-bottom-color: var(--cedar-green);
}

.filter-select:focus[b-1iw01rue11] {
    outline: none;
    border-bottom-color: var(--cedar-green);
}

/* ============================================
   Loading & Error States
   ============================================ */

.loading-state[b-1iw01rue11],
.error-state[b-1iw01rue11] {
    text-align: center;
    padding: 6rem 0;
    color: #6b7280;
}

.error-state[b-1iw01rue11] {
    color: var(--tobacco-barn-red);
}

/* ============================================
   News Grid - Minimal List Layout
   ============================================ */

.news-grid[b-1iw01rue11] {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 4rem;
}

/* ============================================
   News Article - Editorial Style
   ============================================ */

.news-card[b-1iw01rue11] {
    padding: 3rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.news-card:last-child[b-1iw01rue11] {
    border-bottom: none;
}

.news-card:hover .news-title a[b-1iw01rue11] {
    color: var(--cedar-green);
}

.news-image img[b-1iw01rue11] {
    width: 100%;
    max-width: 400px;
    height: 200px;
    object-fit: cover;
    display: block;
    margin-bottom: 2rem;
}

.news-content[b-1iw01rue11] {
    display: flex;
    flex-direction: column;
}

.news-meta[b-1iw01rue11] {
    display: flex;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.news-category[b-1iw01rue11] {
    display: inline-block;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--cedar-green);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-family: var(--font-display);
}

.news-date[b-1iw01rue11] {
    font-size: 0.875rem;
    color: #9ca3af;
    display: flex;
    align-items: center;
}

.news-title[b-1iw01rue11] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.news-title a[b-1iw01rue11] {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.news-summary[b-1iw01rue11] {
    color: #6b7280;
    line-height: 1.8;
    margin-bottom: 1.5rem;
    font-size: 1.0625rem;
    max-width: 800px;
}

.read-more[b-1iw01rue11] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-family: var(--font-display);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.read-more:hover[b-1iw01rue11] {
    color: var(--cedar-green-dark);
    gap: 0.75rem;
}

/* ============================================
   Pagination - Minimal
   ============================================ */

.pagination[b-1iw01rue11] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 4rem;
    padding-top: 4rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.pagination-btn[b-1iw01rue11] {
    padding: 0.75rem 1.25rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: var(--font-display);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-size: 0.875rem;
}

.pagination-btn:hover:not(:disabled)[b-1iw01rue11] {
    border-bottom-color: var(--cedar-green);
    color: var(--cedar-green);
}

.pagination-btn.active[b-1iw01rue11] {
    color: #000000;
    border-bottom-color: #000000;
}

.pagination-btn:disabled[b-1iw01rue11] {
    opacity: 0.3;
    cursor: not-allowed;
}

/* ============================================
   Single Article View
   ============================================ */

.article-detail[b-1iw01rue11] {
    max-width: 900px;
    margin: 0 auto;
}

.article-header[b-1iw01rue11] {
    margin-bottom: 3rem;
    padding-bottom: 3rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.article-title[b-1iw01rue11] {
    font-family: var(--font-display);
    font-size: 3rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.article-meta[b-1iw01rue11] {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    color: #9ca3af;
    font-size: 0.9375rem;
}

.article-featured-image[b-1iw01rue11] {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    margin-bottom: 3rem;
}

.article-body[b-1iw01rue11] {
    font-size: 1.125rem;
    line-height: 1.8;
    color: #374151;
}

.article-body h2[b-1iw01rue11] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: #000000;
    margin: 3rem 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.article-body h3[b-1iw01rue11] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 2rem 0 1rem 0;
    text-transform: uppercase;
    letter-spacing: 0;
}

.article-body p[b-1iw01rue11] {
    margin-bottom: 1.5rem;
}

.article-body a[b-1iw01rue11] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
}

.article-body a:hover[b-1iw01rue11] {
    color: var(--cedar-green-dark);
    text-decoration: underline;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {

    .news-filters[b-1iw01rue11] {
        flex-direction: column;
        gap: 1rem;
        margin: 0 0 2rem 0;
    }

    .filter-select[b-1iw01rue11] {
        width: 100%;
    }

    .news-card[b-1iw01rue11] {
        padding: 2rem 0;
    }

    .news-title[b-1iw01rue11] {
        font-size: 1.5rem;
    }

    .article-title[b-1iw01rue11] {
        font-size: 2rem;
    }

    .pagination[b-1iw01rue11] {
        flex-wrap: wrap;
        margin-top: 3rem;
        padding-top: 3rem;
    }

    .pagination-btn[b-1iw01rue11] {
        padding: 0.625rem 1rem;
        font-size: 0.75rem;
    }
}

/* ============================================
   The parts the card gained after the stylesheet was written (#7588)
   ============================================
   News.razor.css addressed a markup vocabulary the page stopped rendering: every rule said
   .news-article-*, every element said .news-*, so the whole card list came out as default-flow
   HTML - and .news-title, left over from the hero the page had before it composed PageHero,
   was blowing the card headings up to 4rem. The rules above are renamed onto what the page
   actually renders; these four names never had a rule at all. */

.news-source[b-1iw01rue11] {
    font-family: var(--font-display);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-secondary);
}

.news-footer[b-1iw01rue11] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--spacing-md);
}

/* Breaking news is the one card that announces itself before it is read. */
.breaking-badge[b-1iw01rue11] {
    display: inline-block;
    margin-bottom: var(--spacing-md);
    padding: var(--spacing-xs) var(--spacing-sm);
    font-family: var(--font-display);
    font-size: var(--font-size-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--color-error);
}

.spinner[b-1iw01rue11] {
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 auto var(--spacing-md);
    border: 3px solid var(--color-border);
    border-top-color: var(--color-text);
    border-radius: var(--radius-full);
    animation: news-spin-b-1iw01rue11 0.9s linear infinite;
}

@keyframes news-spin-b-1iw01rue11 {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .spinner[b-1iw01rue11] {
        animation: none;
    }
}
/* /Components/Pages/NewsArchive.razor.rz.scp.css */
/* ===== News Archive Page ===== */

.archive-page[b-qb00t9p8fa] {
    background: #ffffff;
    min-height: 100vh;
}

/* Content */
.archive-content[b-qb00t9p8fa] {
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem 4rem 4rem;
}

/* Filter Tabs */
.filter-tabs[b-qb00t9p8fa] {
    display: flex;
    gap: 0;
    margin-bottom: 2rem;
    border-bottom: 2px solid #000000;
}

.filter-tab[b-qb00t9p8fa] {
    padding: 0.6rem 1.25rem;
    border: none;
    background: transparent;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-secondary);
    cursor: pointer;
    transition: all 0.15s ease;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}

.filter-tab:hover[b-qb00t9p8fa] {
    color: #111827;
}

.filter-tab.active[b-qb00t9p8fa] {
    color: #111827;
    border-bottom-color: var(--cedar-green, #2D5016);
}

/* Loading */
.loading-state[b-qb00t9p8fa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4rem;
    gap: 1rem;
    color: var(--color-text-secondary);
}

.loading-spinner[b-qb00t9p8fa] {
    width: 40px;
    height: 40px;
    border: 3px solid #e5e7eb;
    border-top-color: var(--cedar-green, #2D5016);
    border-radius: 50%;
    animation: spin-b-qb00t9p8fa 0.8s linear infinite;
}

@keyframes spin-b-qb00t9p8fa {
    to { transform: rotate(360deg); }
}

/* Archive List */
.archive-list[b-qb00t9p8fa] {
    display: flex;
    flex-direction: column;
}

.archive-item[b-qb00t9p8fa] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    cursor: pointer;
    transition: background 0.15s ease;
}

.archive-item:hover[b-qb00t9p8fa] {
    background: rgba(0, 0, 0, 0.01);
}

.archive-item.expanded[b-qb00t9p8fa] {
    background: rgba(0, 0, 0, 0.02);
}

.archive-item-header[b-qb00t9p8fa] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding: 1.25rem 0.5rem;
    position: relative;
}

.archive-item-meta[b-qb00t9p8fa] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.archive-category[b-qb00t9p8fa] {
    padding: 0.1rem 0.5rem;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 2px;
}

.category-news[b-qb00t9p8fa] {
    background: rgba(var(--cedar-green-rgb), 0.1);
    color: var(--cedar-green, #2D5016);
}

.category-event[b-qb00t9p8fa] {
    background: rgba(var(--wheat-gold-rgb), 0.12);
    color: #b8941e;
}

.archive-hide-btn[b-qb00t9p8fa] {
    margin-left: auto;
    padding: 0.15rem 0.5rem;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #dc2626;
    background: none;
    border: 1px solid #dc2626;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.archive-hide-btn:hover[b-qb00t9p8fa] {
    background: #dc2626;
    color: #ffffff;
}

.archive-date[b-qb00t9p8fa] {
    font-size: 0.75rem;
    color: var(--color-text-secondary);
}

.archive-item-title[b-qb00t9p8fa] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #111827;
    margin: 0;
    padding-right: 2rem;
}

.archive-expand-icon[b-qb00t9p8fa] {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--color-text-secondary);
    font-size: 0.8rem;
}

/* Expanded Content */
.archive-item-body[b-qb00t9p8fa] {
    padding: 0 0.5rem 1.5rem;
    font-size: 0.9rem;
    line-height: 1.7;
    color: #374151;
    border-left: 3px solid var(--cedar-green, #2D5016);
    margin-left: 0.5rem;
    padding-left: 1rem;
}

/* The body is a club email rendered through SanitizedHtml: markup from a MarkupString
   carries no scope attribute, so these rules reach it through ::deep. An email image as
   wide as the flyer it was must still fit a 344px phone. */
.archive-item-body[b-qb00t9p8fa]  img {
    max-width: 100%;
    height: auto;
}

.archive-item-body[b-qb00t9p8fa]  a {
    color: var(--cedar-green, #2D5016);
}

.archive-item-body[b-qb00t9p8fa]  table {
    max-width: 100%;
}

/* Responsive */
@media (max-width: 768px) {
    .archive-content[b-qb00t9p8fa] {
        padding: 1.5rem;
    }

    .filter-tabs[b-qb00t9p8fa] {
        overflow-x: auto;
    }
}
/* /Components/Pages/Notation.razor.rz.scp.css */
/* ============================================
   Notation guide - what the page shell has no opinion on (#7577)
   ============================================
   The page's layout is <PageSection> / <ContentCard> / <ScrollRegion>, so the rhythm,
   the measure, the section headings, the card chrome and the responsive grid all come
   from the shell and each club's skin repaints them. This file used to carry a whole
   second design system - its own container, its own bordered sections, its own heading
   scale - painted in black-on-white literals, and it had drifted: forty class names in
   the markup had no rule here at all, and seven rules styled classes the markup had
   stopped rendering.

   What is left is only what a guide ABOUT notation needs and the shell does not supply:
   a symbol/meaning list, a comparison table, an exercise disclosure, inline code, and how
   a row of diagrams sits in the page. Every colour here is a token, so both skins answer
   for themselves - nothing on this page is one club's black by construction any more.
   ============================================ */

/* Running prose. It sets no colour on purpose: the editorial skin's body ink is black and
   the photo skin's is its navy, and both reach here by inheritance. */
.guide-text[b-9c4v7bn2ki] {
    max-width: 70ch;
    margin: 0 0 1.25rem 0;
    line-height: 1.8;
}

/* A heading INSIDE a section body. The section's own title is the shell's; this is the
   step below it, for the two or three parts a long section breaks into. */
.guide-subtitle[b-9c4v7bn2ki] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 2.5rem 0 1rem 0;
}

.guide-subtitle:first-child[b-9c4v7bn2ki] {
    margin-top: 0;
}

/* ============================================
   The symbol/meaning list
   ============================================
   Nine blocks on this page are the same shape: a piece of notation and what it means.
   One <dl> serves all of them, so a reader learns the shape once. The key column is
   max-content so "1/2-1/2" and "+" each take exactly what they need, and the value
   column is minmax(0, 1fr) so it shrinks on a phone instead of widening the page.
   ============================================ */

.notation-list[b-9c4v7bn2ki] {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 0.65rem 1.5rem;
    align-items: baseline;
    margin: 0;
    min-width: 0;
}

.notation-list dt[b-9c4v7bn2ki] {
    font-family: 'Courier New', 'Cascadia Mono', monospace;
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--color-dark);
    /* A move never breaks across lines: "Nxe5" split after the x is not a move any more.
       The key track is max-content, so the column is exactly as wide as the widest one. */
    white-space: nowrap;
}

.notation-list dd[b-9c4v7bn2ki] {
    margin: 0;
    min-width: 0;
}

/* The figurine beside a piece's letter. Decorative - the row already says "King". */
.piece-glyph[b-9c4v7bn2ki] {
    font-size: 1.5rem;
    line-height: 1;
    color: var(--color-dark);
}

/* ============================================
   Inline code
   ============================================
   Every move, square and symbol quoted in running text. The palest brand step is the
   site's wash under dark text, so the chip is cream on the editorial skin and pale
   blue-grey on the photo skin without this file naming either colour.
   ============================================ */

code[b-9c4v7bn2ki] {
    font-family: 'Courier New', 'Cascadia Mono', monospace;
    font-size: 0.9375em;
    background: var(--cedar-green-tint);
    border: 1px solid var(--color-border);
    padding: 0.1em 0.4em;
    /* Same rule as the list keys: a quoted move is one unbreakable token. */
    white-space: nowrap;
}

/* ============================================
   The algebraic/classical comparison table
   ============================================
   A real table, because it is real tabular data. It carries no min-width, so it reflows
   to a phone rather than needing a scroller.
   ============================================ */

.guide-table[b-9c4v7bn2ki] {
    width: 100%;
    border-collapse: collapse;
    min-width: 0;
}

.guide-table th[b-9c4v7bn2ki] {
    padding: 0.75rem 0.85rem;
    text-align: left;
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-surface);
    background: var(--color-dark);
}

.guide-table td[b-9c4v7bn2ki] {
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid var(--color-border);
    vertical-align: top;
}

/* ============================================
   The practice exercises
   ============================================ */

.exercise-answer[b-9c4v7bn2ki] {
    margin-top: 1rem;
    border-top: 1px solid var(--color-border);
    padding-top: 0.85rem;
}

.exercise-answer summary[b-9c4v7bn2ki] {
    cursor: pointer;
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-dark);
}

.exercise-answer p[b-9c4v7bn2ki] {
    margin: 0.85rem 0 0 0;
}

/* ============================================
   The PGN block
   ============================================
   A game score is fixed-width text: it cannot wrap and stay readable, so it sits in a
   <ScrollRegion> and the <pre> keeps its own measure inside that scroller.
   ============================================ */

.pgn-example[b-9c4v7bn2ki] {
    margin: 0 0 1rem 0;
    min-width: 0;
}

.pgn-code[b-9c4v7bn2ki] {
    margin: 0;
    padding: 1.25rem 1.5rem;
    background: var(--cedar-green-tint);
    border-left: 4px solid var(--accent-rule);
    font-family: 'Courier New', 'Cascadia Mono', monospace;
    font-size: 0.9rem;
    line-height: 1.6;
}

/* ============================================
   Diagrams (#7542)
   ============================================
   The boards themselves are <StaticBoard> and own everything inside their own square;
   what lives here is only how a row of them sits in the page. The grid floors use
   min(Npx, 100%) so a 390px phone drops to one column instead of scrolling sideways.
   ============================================ */

.chessboard-demo[b-9c4v7bn2ki] {
    display: flex;
    justify-content: center;
    margin: 2rem 0 0 0;
    min-width: 0;
}

.diagrams-grid[b-9c4v7bn2ki] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 2.5rem;
    justify-items: center;
    margin: 1.5rem 0 0 0;
}

.diagram-container[b-9c4v7bn2ki] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
    /* A board is at most 22rem, and this box holds it above two columns of notation.
       The cap is what makes the two columns sit SIDE BY SIDE on both skins: without
       it the box takes whatever width its grid track happens to give it, which is not
       the same number on the editorial and the photo skin. */
    max-width: 34rem;
    min-width: 0;
}

/* The Scholar's Mate board's two notation systems, side by side under it. */
.notation-comparison[b-9c4v7bn2ki] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
    gap: 1.5rem;
    width: 100%;
}

.notation-variant[b-9c4v7bn2ki] {
    font-family: 'Courier New', 'Cascadia Mono', monospace;
    font-size: 0.9375rem;
    line-height: 1.9;
    border-left: 3px solid var(--accent-rule);
    padding-left: 1rem;
    min-width: 0;
}

@media (max-width: 768px) {
    .guide-subtitle[b-9c4v7bn2ki] {
        font-size: 1.125rem;
        margin-top: 2rem;
    }

    .notation-list[b-9c4v7bn2ki] {
        gap: 0.5rem 1rem;
    }

    .guide-table th[b-9c4v7bn2ki],
    .guide-table td[b-9c4v7bn2ki] {
        padding: 0.6rem 0.5rem;
    }
}
/* /Components/Pages/OAuth/GoogleCalendarCallback.razor.rz.scp.css */
.container[b-qduk4l0067] {
    max-width: 600px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.callback-container[b-qduk4l0067] {
    background: white;
    border-radius: 1rem;
    padding: 3rem 2rem;
    text-align: center;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.processing[b-qduk4l0067],
.success[b-qduk4l0067],
.error[b-qduk4l0067] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.spinner[b-qduk4l0067] {
    width: 64px;
    height: 64px;
    border: 6px solid #f3f4f6;
    border-top-color: #1e3a8a;
    border-radius: 50%;
    animation: spin-b-qduk4l0067 1s linear infinite;
}

@keyframes spin-b-qduk4l0067 {
    to {
        transform: rotate(360deg);
    }
}

.success i[b-qduk4l0067],
.error i[b-qduk4l0067] {
    font-size: 4rem;
}

.success i[b-qduk4l0067] {
    color: #10b981;
}

.error i[b-qduk4l0067] {
    color: #ef4444;
}

h2[b-qduk4l0067] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0;
}

p[b-qduk4l0067] {
    font-size: 1rem;
    color: #6b7280;
    margin: 0;
}

.btn-return[b-qduk4l0067] {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
    color: white;
    text-decoration: none;
    border-radius: 0.5rem;
    font-weight: 600;
    transition: all 0.2s ease;
}

.btn-return:hover[b-qduk4l0067] {
    background: linear-gradient(135deg, #1e40af 0%, #2563eb 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);
}

@media (max-width: 640px) {
    .callback-container[b-qduk4l0067] {
        padding: 2rem 1rem;
    }

    h2[b-qduk4l0067] {
        font-size: 1.5rem;
    }

    .spinner[b-qduk4l0067] {
        width: 48px;
        height: 48px;
    }

    .success i[b-qduk4l0067],
    .error i[b-qduk4l0067] {
        font-size: 3rem;
    }
}
/* /Components/Pages/OrganizationHome.razor.rz.scp.css */
/* The organization host's home (#8184): the board hub's cards, tokens only. */

.organization-grid[b-pc5jeqfllg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
}

.organization-card[b-pc5jeqfllg] {
    display: block;
    padding: 2rem;
    border: 1px solid var(--color-border);
    text-decoration: none;
    background: var(--color-surface);
    transition: border-color 0.2s ease;
}

.organization-card:hover[b-pc5jeqfllg],
.organization-card:focus-visible[b-pc5jeqfllg] {
    border-color: var(--cedar-green);
    outline: none;
}

.organization-card-section[b-pc5jeqfllg] {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--cedar-green);
    margin-bottom: 0.75rem;
}

.organization-card h2[b-pc5jeqfllg] {
    font-family: var(--font-display);
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    color: var(--color-text);
}

.organization-card p[b-pc5jeqfllg] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: 0.9375rem;
    line-height: 1.6;
}

@media (max-width: 480px) {
    .organization-card[b-pc5jeqfllg] {
        padding: 1.5rem;
    }
}
/* /Components/Pages/Privacy.razor.rz.scp.css */
/* ============================================
   Privacy Policy Page - Editorial Design
   ============================================ */

.privacy-page[b-vk790zzkak] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.content-section[b-vk790zzkak] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem 2rem;
}

.content-container[b-vk790zzkak] {
    background: white;
}

.last-updated[b-vk790zzkak] {
    font-size: 0.875rem;
    color: #6b7280;
    font-style: italic;
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.policy-content[b-vk790zzkak] {
    color: #374151;
}

.policy-section[b-vk790zzkak] {
    margin-bottom: 3rem;
}

.policy-section:last-of-type[b-vk790zzkak] {
    margin-bottom: 2rem;
}

.policy-section h2[b-vk790zzkak] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    padding-top: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.policy-section h3[b-vk790zzkak] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--cedar-green);
    margin: 2rem 0 1rem 0;
}

.policy-section p[b-vk790zzkak] {
    color: #374151;
    line-height: 1.8;
    margin-bottom: 1rem;
    font-size: 1rem;
}

.policy-section ul[b-vk790zzkak] {
    margin: 1rem 0 1.5rem 1.5rem;
    padding-left: 0.5rem;
}

.policy-section li[b-vk790zzkak] {
    color: #374151;
    line-height: 1.8;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.policy-section li[b-vk790zzkak]::marker {
    color: var(--cedar-green);
}

.policy-section a[b-vk790zzkak] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.policy-section a:hover[b-vk790zzkak] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.contact-info[b-vk790zzkak] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 4px solid var(--cedar-green);
    padding: 1.5rem 2rem;
    margin: 1.5rem 0;
}

.contact-info p[b-vk790zzkak] {
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.contact-info p:last-child[b-vk790zzkak] {
    margin-bottom: 0;
}

.contact-info strong[b-vk790zzkak] {
    color: var(--cedar-green);
    font-weight: 700;
}

.policy-footer[b-vk790zzkak] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    text-align: center;
}

.policy-footer p[b-vk790zzkak] {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.6;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .content-section[b-vk790zzkak] {
        padding: 2rem 1.5rem;
    }

    .policy-section h2[b-vk790zzkak] {
        font-size: 1.25rem;
    }

    .policy-section h3[b-vk790zzkak] {
        font-size: 1rem;
    }

    .contact-info[b-vk790zzkak] {
        padding: 1rem 1.5rem;
    }
}

@media (max-width: 480px) {

    .content-section[b-vk790zzkak] {
        padding: 1.5rem 1rem;
    }

    .policy-section h2[b-vk790zzkak] {
        font-size: 1.125rem;
    }
}
/* /Components/Pages/Ratings.razor.rz.scp.css */
/* ============================================
   Ratings guide - what the page shell has no opinion on (#7583)
   ============================================
   The page's layout is <PageSection> / <ContentCard>, so the rhythm, the measure, the
   section headings, the card chrome and the responsive grid all come from the shell and
   each club's skin repaints them. This file used to carry a second design system - its own
   container, its own bordered sections, its own heading scale, its own card and table
   chrome - painted in black, white and cedar-green literals, and it had drifted badly:
   51 of the 71 class names the markup rendered had no rule anywhere, and two rules here
   styled markup the page had stopped rendering.

   What is left is only what a guide ABOUT ratings needs and the shell does not supply: one
   label/value list, which is the shape nine blocks on this page share, and the
   classifications table. Every colour is a token, so both skins answer for themselves -
   nothing on this page is one club's green by construction any more.
   ============================================ */

/* Running prose. It sets no colour on purpose: the editorial skin's body ink and the photo
   skin's navy both reach here by inheritance. Inside a card the card's own body colour
   inherits instead, which is what keeps a card's text a step quieter than the page's. */
.ratings-text[b-11498c7fhz] {
    max-width: 70ch;
    margin: 0 0 1.25rem 0;
    line-height: 1.8;
}

.ratings-text:last-child[b-11498c7fhz] {
    margin-bottom: 0;
}

/* A heading INSIDE a section body - the step below the section's own title, for the two
   halves the titles section breaks into (open titles, women's titles). */
.ratings-subtitle[b-11498c7fhz] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 2.5rem 0 1rem 0;
}

.ratings-subtitle:first-child[b-11498c7fhz] {
    margin-top: 0;
}

/* ============================================
   The label/value list
   ============================================
   Nine blocks on this page are the same shape: a named fact and its value. The four rating
   systems' details, the eight titles' requirements, the norm requirements and the four
   comparison bands were four different hand-rolled shapes before (.system-details /
   .detail-item, .title-requirements / .requirement-item, .norm-list, .rating-comparison /
   .rating-item), and only one of the four had any rule at all. One <dl> serves all 17 of them.

   It answers to the width of the CARD it is in, not the width of the window, which is the
   whole reason this is a container query and not a media query. Measured in Chrome at 1280:
   the shell's card grid puts three cards across the section, so a card's content box is about
   253px - and a media query keyed to "desktop" would have given a 1280px reader the same
   two-column list it gives a 390px phone, with "Varies based on first tournament performance"
   wrapping one word per line in a 110px column. Stacked is therefore the DEFAULT, and the two
   columns are the exception a card earns by being wide enough to hold them.
   ============================================ */

.rating-facts[b-11498c7fhz] {
    container-type: inline-size;
    margin: 0 0 1.25rem 0;
    min-width: 0;
}

.rating-facts:last-child[b-11498c7fhz] {
    margin-bottom: 0;
}

/* One fact: its label and its value. A <div> around a dt/dd pair is valid inside a <dl> and
   is what lets the pair lay itself out without the other rows' content affecting it. */
.rating-fact[b-11498c7fhz] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.1rem;
    padding: 0.3rem 0;
    min-width: 0;
}

/* 26rem is 416px: a 9.5rem label plus a 1.25rem gutter still leaves the value more than
   250px, which is where a sentence stops reading as a ragged column. Below that the label
   sits on its own line above the value and the value gets the whole card. */
@container (min-width: 26rem) {
    .rating-fact[b-11498c7fhz] {
        grid-template-columns: 9.5rem minmax(0, 1fr);
        gap: 0 1.25rem;
        align-items: baseline;
    }
}

.rating-fact dt[b-11498c7fhz] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-dark);
    min-width: 0;
}

.rating-fact dd[b-11498c7fhz] {
    margin: 0;
    min-width: 0;
}

/* ============================================
   The USCF classifications table
   ============================================
   A real table, because it is real tabular data - the old markup was a <table> forced to
   display: block with grid rows, which is how it came to need a 640px single-column rule of
   its own. It carries no min-width, so it reflows to a phone rather than needing a scroller.
   ============================================ */

.ratings-table[b-11498c7fhz] {
    width: 100%;
    border-collapse: collapse;
    min-width: 0;
}

.ratings-table th[scope="col"][b-11498c7fhz] {
    padding: 0.75rem 0.85rem;
    text-align: left;
    font-family: var(--font-display);
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-surface);
    background: var(--color-dark);
}

.ratings-table th[scope="row"][b-11498c7fhz] {
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid var(--color-border);
    text-align: left;
    vertical-align: top;
    font-weight: 700;
    color: var(--color-dark);
}

.ratings-table td[b-11498c7fhz] {
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid var(--color-border);
    vertical-align: top;
}

/* The rating range is the first <td> of a row - the class name beside it is the row's own
   <th>. A range is one token: "1400-1599" broken after the hyphen is two wrong numbers, and
   that is what a 375px phone did to it inside the photo skin's roomier card. */
.ratings-table td:first-of-type[b-11498c7fhz] {
    white-space: nowrap;
}

@media (max-width: 768px) {
    .ratings-subtitle[b-11498c7fhz] {
        font-size: 1.125rem;
        margin-top: 2rem;
    }

    /* The table keeps its three real columns on a phone rather than being flattened into
       blocks: display: block on table parts drops the table's semantics in Chrome and Safari,
       and a reference table a screen reader cannot navigate is a worse trade than a narrow
       description column. What it gets instead is a tighter measure. */
    .ratings-table[b-11498c7fhz] {
        font-size: 0.9375rem;
    }

    .ratings-table th[scope="col"][b-11498c7fhz],
    .ratings-table th[scope="row"][b-11498c7fhz],
    .ratings-table td[b-11498c7fhz] {
        padding: 0.55rem 0.4rem;
    }

    .ratings-table th[scope="col"][b-11498c7fhz] {
        font-size: 0.6875rem;
        letter-spacing: 0.04em;
    }
}
/* /Components/Pages/SponsorshipPages/OurSponsors.razor.rz.scp.css */
/* ============================================
   Our Sponsors Page - Editorial Design
   ============================================ */

.sponsors-page[b-swx25x3j9w] {
    background: #ffffff;
}

/* ============================================
   Loading Section
   ============================================ */

.loading-section[b-swx25x3j9w] {
    padding: 6rem 4rem;
    text-align: center;
}

.loading-content[b-swx25x3j9w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    color: #666;
}

.loading-content i[b-swx25x3j9w] {
    font-size: 2rem;
    color: var(--cedar-green);
}

/* ============================================
   Empty State - the room the shared EmptyState sits in
   ============================================
   The component owns the card; this section only keeps the page's vertical rhythm
   and stops it running the full width of a wide screen.
   ============================================ */

.empty-section[b-swx25x3j9w] {
    padding: 6rem 4rem;
    max-width: 700px;
    margin: 0 auto;
}

/* ============================================
   Tier Sections
   ============================================ */

.tier-section[b-swx25x3j9w] {
    padding: 4rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.tier-section:last-of-type[b-swx25x3j9w] {
    border-bottom: none;
}

.tier-header[b-swx25x3j9w] {
    text-align: center;
    margin-bottom: 3rem;
}

.tier-piece[b-swx25x3j9w] {
    font-size: 3rem;
    display: block;
    margin-bottom: 1rem;
    line-height: 1;
}

.queen-section .tier-piece[b-swx25x3j9w] { color: var(--cedar-green); }
.rook-section .tier-piece[b-swx25x3j9w] { color: var(--wheat-gold); }
.knight-section .tier-piece[b-swx25x3j9w] { color: var(--wilson-blue); }
.pawn-section .tier-piece[b-swx25x3j9w] { color: #666; }

.tier-header h2[b-swx25x3j9w] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tier-subtitle[b-swx25x3j9w] {
    font-size: 1rem;
    color: #666;
    margin: 0;
}

/* ============================================
   Sponsors Grid
   ============================================ */

.sponsors-grid[b-swx25x3j9w] {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    gap: 2rem;
}

.queen-grid[b-swx25x3j9w] {
    grid-template-columns: repeat(auto-fit, minmax(min(350px, 100%), 1fr));
}

.rook-grid[b-swx25x3j9w] {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.knight-grid[b-swx25x3j9w] {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.pawn-grid[b-swx25x3j9w] {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/* ============================================
   Sponsor Cards
   ============================================ */

.sponsor-card[b-swx25x3j9w] {
    text-align: center;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.sponsor-card:hover[b-swx25x3j9w] {
    border-color: rgba(0, 0, 0, 0.2);
    transform: translateY(-4px);
}

.queen-card[b-swx25x3j9w] {
    padding: 3rem;
}

.sponsor-logo-link[b-swx25x3j9w] {
    display: block;
    margin-bottom: 1.5rem;
}

.sponsor-logo[b-swx25x3j9w] {
    max-width: 100%;
    max-height: 120px;
    object-fit: contain;
}

.queen-card .sponsor-logo[b-swx25x3j9w] {
    max-height: 150px;
}

.rook-card .sponsor-logo[b-swx25x3j9w] {
    max-height: 120px;
}

.knight-card .sponsor-logo[b-swx25x3j9w] {
    max-height: 100px;
}

.pawn-card .sponsor-logo[b-swx25x3j9w] {
    max-height: 80px;
}

.sponsor-placeholder[b-swx25x3j9w] {
    width: 120px;
    height: 120px;
    margin: 0 auto 1.5rem;
    background: var(--river-pearl);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sponsor-placeholder i[b-swx25x3j9w] {
    font-size: 3rem;
    color: #ccc;
}

.queen-card .sponsor-placeholder[b-swx25x3j9w] {
    width: 150px;
    height: 150px;
}

.sponsor-name[b-swx25x3j9w] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
}

.queen-card .sponsor-name[b-swx25x3j9w] {
    font-size: 1.5rem;
}

.pawn-card .sponsor-name[b-swx25x3j9w] {
    font-size: 1rem;
    margin-bottom: 0;
}

.sponsor-description[b-swx25x3j9w] {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.5;
    margin: 0 0 1rem 0;
}

.sponsor-link[b-swx25x3j9w] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--cedar-green);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.sponsor-link:hover[b-swx25x3j9w] {
    color: var(--wheat-gold);
}

/* ============================================
   CTA Section
   ============================================ */

.cta-section[b-swx25x3j9w] {
    background: #000000;
    padding: 6rem 4rem;
    text-align: center;
}

.cta-content[b-swx25x3j9w] {
    max-width: 600px;
    margin: 0 auto;
}

.cta-content h2[b-swx25x3j9w] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 1rem 0;
    text-transform: uppercase;
}

.cta-content h2 .gold[b-swx25x3j9w] {
    /* The cta band is dark (its h2 is white), so this is the on-dark accent. */
    color: var(--accent-text-on-dark);
}

.cta-content > p[b-swx25x3j9w] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.125rem;
    margin: 0 0 2rem 0;
}

.cta-button[b-swx25x3j9w] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 1rem 2rem;
    background: var(--wheat-gold);
    color: #000000;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.cta-button:hover[b-swx25x3j9w] {
    background: #ffffff;
    transform: translateY(-2px);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .tier-section[b-swx25x3j9w] {
        padding: 3rem 2rem;
    }

    .tier-piece[b-swx25x3j9w] {
        font-size: 2.5rem;
    }

    .tier-header h2[b-swx25x3j9w] {
        font-size: 1.5rem;
    }

    .sponsors-grid[b-swx25x3j9w] {
        grid-template-columns: 1fr;
    }

    .sponsor-card[b-swx25x3j9w] {
        padding: 1.5rem;
    }

    .queen-card[b-swx25x3j9w] {
        padding: 2rem;
    }

    .cta-section[b-swx25x3j9w] {
        padding: 4rem 2rem;
    }

    .cta-content h2[b-swx25x3j9w] {
        font-size: 2rem;
    }

    .empty-section[b-swx25x3j9w] {
        padding: 4rem 2rem;
    }
}
/* /Components/Pages/SponsorshipPages/SponsorCheckout.razor.rz.scp.css */
.checkout-container[b-jah9ctzp2l] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.checkout-grid[b-jah9ctzp2l] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 2rem;
    align-items: start;
}

/* Order Summary */
.order-summary[b-jah9ctzp2l] {
    background: white;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 2rem;
}

.order-summary h2[b-jah9ctzp2l] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

/* Tier Selector */
.tier-selector[b-jah9ctzp2l] {
    margin-bottom: 1.5rem;
}

.tier-selector label[b-jah9ctzp2l] {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #666;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tier-options[b-jah9ctzp2l] {
    display: grid;
    gap: 0.5rem;
}

.tier-option[b-jah9ctzp2l] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--river-pearl);
    border: 2px solid transparent;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.tier-option:hover[b-jah9ctzp2l] {
    border-color: var(--limestone-cream);
    background: white;
}

.tier-option.selected[b-jah9ctzp2l] {
    border-color: var(--cedar-green);
    background: white;
}

.tier-piece[b-jah9ctzp2l] {
    font-size: 1.5rem;
}

.tier-name[b-jah9ctzp2l] {
    flex: 1;
    font-weight: 600;
    color: var(--cedar-green);
}

.tier-price[b-jah9ctzp2l] {
    font-weight: 700;
    color: var(--wheat-gold);
}

.summary-item[b-jah9ctzp2l] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 0;
    border-bottom: 1px solid var(--limestone-cream);
}

.summary-item:last-child[b-jah9ctzp2l] {
    border-bottom: none;
}

.summary-divider[b-jah9ctzp2l] {
    border-top: 2px solid var(--cedar-green);
    margin: 1rem 0;
}

.summary-item.total[b-jah9ctzp2l] {
    font-size: 1.25rem;
    font-weight: 700;
    padding-top: 1.5rem;
}

.summary-item.total .amount[b-jah9ctzp2l] {
    font-size: 2rem;
    color: var(--cedar-green);
}

.benefits-recap[b-jah9ctzp2l] {
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
}

.benefits-recap h3[b-jah9ctzp2l] {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.benefits-recap ul[b-jah9ctzp2l] {
    list-style: none;
    padding: 0;
}

.benefits-recap li[b-jah9ctzp2l] {
    padding: 0.5rem 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.95rem;
    color: #666;
}

.benefits-recap li i[b-jah9ctzp2l] {
    color: var(--cedar-green);
    margin-top: 0.25rem;
}

/* Info Section */
.info-section[b-jah9ctzp2l] {
    background: white;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.info-section h2[b-jah9ctzp2l] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.error-message[b-jah9ctzp2l] {
    background: #fee;
    border: 2px solid #e44;
    color: #c33;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.error-message i[b-jah9ctzp2l] {
    font-size: 1.25rem;
}

/* Sponsor Form */
[b-jah9ctzp2l] .sponsor-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form-group[b-jah9ctzp2l] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group label[b-jah9ctzp2l] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #333;
}

.form-row[b-jah9ctzp2l] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

/* Blazor InputText, InputTextArea component styling */
.form-group[b-jah9ctzp2l]  input,
[b-jah9ctzp2l] .sponsor-form input {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid var(--limestone-cream);
    border-radius: 0;
    font-size: 1rem;
    transition: all 0.3s ease;
    font-family: inherit;
    background: #ffffff;
    color: #333;
    box-sizing: border-box;
}

.form-group[b-jah9ctzp2l]  input:focus,
[b-jah9ctzp2l] .sponsor-form input:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

.form-group[b-jah9ctzp2l]  input::placeholder,
[b-jah9ctzp2l] .sponsor-form input::placeholder {
    color: #999;
}

.form-group[b-jah9ctzp2l]  input.invalid,
[b-jah9ctzp2l] .sponsor-form input.invalid {
    border-color: #ef4444;
}

.form-group[b-jah9ctzp2l]  textarea,
[b-jah9ctzp2l] .sponsor-form textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid var(--limestone-cream);
    border-radius: 0;
    font-size: 1rem;
    font-family: inherit;
    resize: vertical;
    transition: all 0.3s ease;
    background: #ffffff;
    color: #333;
    box-sizing: border-box;
}

.form-group[b-jah9ctzp2l]  textarea:focus,
[b-jah9ctzp2l] .sponsor-form textarea:focus {
    outline: none;
    border-color: var(--cedar-green);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.1);
}

.form-group[b-jah9ctzp2l]  textarea::placeholder,
[b-jah9ctzp2l] .sponsor-form textarea::placeholder {
    color: #999;
}

.form-group[b-jah9ctzp2l]  textarea.invalid,
[b-jah9ctzp2l] .sponsor-form textarea.invalid {
    border-color: #ef4444;
}

.form-group[b-jah9ctzp2l]  .validation-message,
[b-jah9ctzp2l] .sponsor-form .validation-message {
    color: #ef4444;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

.payment-info-box[b-jah9ctzp2l] {
    background: var(--river-pearl);
    border: 1px solid var(--limestone-cream);
    border-radius: 0.5rem;
    padding: 1.25rem;
    margin-top: 0.5rem;
}

.payment-info-box p[b-jah9ctzp2l] {
    margin: 0;
    color: #666;
    font-size: 0.95rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.payment-info-box p:first-child[b-jah9ctzp2l] {
    margin-bottom: 0.75rem;
}

.payment-info-box p i[b-jah9ctzp2l] {
    color: var(--cedar-green);
    margin-top: 0.125rem;
}

.payment-btn[b-jah9ctzp2l] {
    width: 100%;
    padding: 1rem 2rem;
    font-size: 1.25rem;
    font-weight: 700;
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    border: none;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 1rem;
}

.payment-btn:hover:not(:disabled)[b-jah9ctzp2l] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.payment-btn:disabled[b-jah9ctzp2l] {
    opacity: 0.6;
    cursor: not-allowed;
}

.payment-btn i[b-jah9ctzp2l] {
    margin-right: 0.5rem;
}

.secure-badge[b-jah9ctzp2l] {
    text-align: center;
    margin-top: 1rem;
    color: #666;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.secure-badge i[b-jah9ctzp2l] {
    color: var(--cedar-green);
}

.payment-info[b-jah9ctzp2l] {
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-top: 1.5rem;
}

.payment-info p[b-jah9ctzp2l] {
    margin-bottom: 0.5rem;
}

.payment-info a[b-jah9ctzp2l] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.payment-info a:hover[b-jah9ctzp2l] {
    color: var(--cedar-green);
}

/* Processing Overlay */
.processing-overlay[b-jah9ctzp2l] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.processing-spinner[b-jah9ctzp2l] {
    background: white;
    padding: 3rem;
    border-radius: 1rem;
    text-align: center;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.processing-spinner i[b-jah9ctzp2l] {
    font-size: 3rem;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.processing-spinner p[b-jah9ctzp2l] {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cedar-green);
}

/* Responsive Design */
@media (max-width: 992px) {
    .checkout-grid[b-jah9ctzp2l] {
        grid-template-columns: 1fr;
    }

    .order-summary[b-jah9ctzp2l] {
        position: static;
    }
}

@media (max-width: 768px) {

    .form-row[b-jah9ctzp2l] {
        grid-template-columns: 1fr;
    }

    .payment-btn[b-jah9ctzp2l] {
        font-size: 1.125rem;
    }
}

.checkout-no-autorenew[b-jah9ctzp2l] {
    margin-top: 1rem;
    padding: 0.875rem 1rem;
    background: rgba(var(--wheat-gold-rgb), 0.10);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    color: #4b5563;
    font-size: 0.875rem;
    line-height: 1.5;
    display: flex;
    gap: 0.625rem;
    align-items: flex-start;
}

.checkout-no-autorenew i[b-jah9ctzp2l] {
    color: var(--wheat-gold, #D4AF37);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.checkout-no-autorenew strong[b-jah9ctzp2l] {
    color: #111827;
}
/* /Components/Pages/SponsorshipPages/SponsorConfirm.razor.rz.scp.css */
.confirm-container[b-083fh7bijw] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background: linear-gradient(135deg, var(--river-pearl) 0%, var(--limestone-cream) 100%);
}

/* Processing State */
.processing-state[b-083fh7bijw] {
    text-align: center;
    max-width: 500px;
    background: white;
    padding: 4rem 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.spinner[b-083fh7bijw] {
    font-size: 4rem;
    color: var(--cedar-green);
    margin-bottom: 2rem;
    animation: pulse-b-083fh7bijw 2s ease-in-out infinite;
}

@keyframes pulse-b-083fh7bijw {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.7;
        transform: scale(1.1);
    }
}

.processing-state h1[b-083fh7bijw] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.processing-state p[b-083fh7bijw] {
    font-size: 1.125rem;
    color: #666;
    margin-bottom: 0.5rem;
}

.processing-state .note[b-083fh7bijw] {
    font-size: 0.875rem;
    color: #999;
    font-style: italic;
    margin-top: 1.5rem;
}

/* Error State */
.error-state[b-083fh7bijw] {
    text-align: center;
    max-width: 600px;
    background: white;
    padding: 4rem 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.error-state > i[b-083fh7bijw] {
    font-size: 4rem;
    color: #ef4444;
    margin-bottom: 1.5rem;
    display: block;
}

.error-state h1[b-083fh7bijw] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.error-message[b-083fh7bijw] {
    font-size: 1.125rem;
    color: #666;
    margin-bottom: 2rem;
    padding: 1rem;
    background: #fee;
    border: 1px solid #fcc;
    border-radius: 0.5rem;
}

.error-actions[b-083fh7bijw] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 2rem;
}

/* Payment received: the session is paid and the club is applying it */
.received-state[b-083fh7bijw] {
    text-align: center;
    max-width: 600px;
    background: white;
    padding: 4rem 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.received-state > i[b-083fh7bijw] {
    font-size: 4rem;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    display: block;
}

.received-state h1[b-083fh7bijw] {
    font-size: 2rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.received-message[b-083fh7bijw] {
    font-size: 1.125rem;
    color: #333;
    margin-bottom: 1rem;
}

.received-note[b-083fh7bijw] {
    font-size: 1rem;
    color: #555;
    margin-bottom: 1rem;
}

/* Buttons */
.btn[b-083fh7bijw] {
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-083fh7bijw] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-primary:hover[b-083fh7bijw] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--cedar-green-rgb), 0.3);
}

.btn-secondary[b-083fh7bijw] {
    background: white;
    color: var(--cedar-green);
    border: 2px solid var(--cedar-green);
}

.btn-secondary:hover[b-083fh7bijw] {
    background: var(--river-pearl);
    transform: translateY(-2px);
}

/* Responsive Design */
@media (max-width: 768px) {
    .processing-state[b-083fh7bijw],
    .error-state[b-083fh7bijw],
    .received-state[b-083fh7bijw] {
        padding: 3rem 2rem;
    }

    .processing-state h1[b-083fh7bijw],
    .error-state h1[b-083fh7bijw],
    .received-state h1[b-083fh7bijw] {
        font-size: 1.5rem;
    }

    .error-actions[b-083fh7bijw] {
        flex-direction: column;
    }

    .btn[b-083fh7bijw] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/SponsorshipPages/Sponsorship.razor.rz.scp.css */
/* ============================================
   Sponsorship Page - Editorial Design
   Matches Membership page flat design pattern
   ============================================ */

.sponsorship-page[b-ad8hlbesrr] {
    background: #ffffff;
}

/* ============================================
   Hero Section - Black, Bold Typography
   ============================================ */

.hero[b-ad8hlbesrr] {
    min-height: 60vh;
    display: flex;
    align-items: center;
    padding: 8rem 4rem;
    background: #000000;
    position: relative;
    overflow: hidden;
}

.dot[b-ad8hlbesrr] {
    margin: 0 1rem;
    opacity: 0.3;
}

.hero-actions[b-ad8hlbesrr] {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.action-link[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 1rem 2rem;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.action-link.primary[b-ad8hlbesrr] {
    background: var(--wheat-gold);
    color: #000000;
}

.action-link.primary:hover[b-ad8hlbesrr] {
    background: #ffffff;
    transform: translateY(-2px);
}

.action-link:not(.primary)[b-ad8hlbesrr] {
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #ffffff;
}

.action-link:not(.primary):hover[b-ad8hlbesrr] {
    border-color: var(--wheat-gold);
    color: var(--wheat-gold);
}

/* ============================================
   Vision Section
   ============================================ */

.vision-section[b-ad8hlbesrr] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.vision-content[b-ad8hlbesrr] {
    text-align: left;
}

.vision-text h2[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.vision-text h2 .gold[b-ad8hlbesrr] {
    color: var(--accent-text);
}

.vision-lead[b-ad8hlbesrr] {
    font-size: 1.25rem;
    line-height: 1.7;
    color: #333;
    margin: 0 0 3rem 0;
}

.vision-goals[b-ad8hlbesrr] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.goal-item[b-ad8hlbesrr] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.goal-item i[b-ad8hlbesrr] {
    font-size: 1.5rem;
    color: var(--cedar-green);
    margin-top: 0.25rem;
}

.goal-item strong[b-ad8hlbesrr] {
    display: block;
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    color: #000000;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.goal-item p[b-ad8hlbesrr] {
    margin: 0;
    font-size: 0.95rem;
    color: #666;
    line-height: 1.5;
}

.vision-closing[b-ad8hlbesrr] {
    font-size: 1.125rem;
    line-height: 1.7;
    color: #333;
    margin: 0;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* ============================================
   Value Proposition Section
   ============================================ */

.value-section[b-ad8hlbesrr] {
    background: var(--river-pearl);
    padding: 5rem 4rem;
}

.value-grid[b-ad8hlbesrr] {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 3rem;
}

.value-item[b-ad8hlbesrr] {
    text-align: center;
    padding: 2rem;
}

.value-icon[b-ad8hlbesrr] {
    font-size: 2.5rem;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
}

.value-item h3[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.75rem 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.value-item p[b-ad8hlbesrr] {
    margin: 0;
    color: #666;
    line-height: 1.6;
}

/* ============================================
   Tiers Section
   ============================================ */

.tiers-section[b-ad8hlbesrr] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.section-header[b-ad8hlbesrr] {
    text-align: center;
    margin-bottom: 4rem;
}

.section-header h2[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.section-subtitle[b-ad8hlbesrr] {
    font-size: 1.125rem;
    color: #666;
    margin: 0;
}

.tiers-grid[b-ad8hlbesrr] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem;
}

.tier-block[b-ad8hlbesrr] {
    padding: 3rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    position: relative;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.tier-block:hover[b-ad8hlbesrr] {
    border-color: rgba(0, 0, 0, 0.2);
}

.tier-block.featured[b-ad8hlbesrr] {
    border-color: var(--wheat-gold);
    border-width: 2px;
}

.featured-badge[b-ad8hlbesrr] {
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    background: var(--wheat-gold);
    color: #000000;
    padding: 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.tier-block.featured[b-ad8hlbesrr] {
    padding-top: 5rem;
}

/* The tier's eyebrow ("01", "UPGRADE", "CURRENT") is small text on the white tier card: it
   takes the muted-text token, which reads at 4.5:1 on every light ground (#8289). The 30% black
   it replaces measured 2.09:1. */
.tier-number[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    color: var(--color-text-secondary);
    margin-bottom: 2rem;
    text-transform: uppercase;
}

.tier-header[b-ad8hlbesrr] {
    margin-bottom: 1.5rem;
}

.tier-icon[b-ad8hlbesrr] {
    font-size: 2rem;
    margin-bottom: 1rem;
}

.tier-pawn .tier-icon[b-ad8hlbesrr] { color: #666; }
.tier-knight .tier-icon[b-ad8hlbesrr] { color: var(--wilson-blue); }
.tier-rook .tier-icon[b-ad8hlbesrr] { color: var(--wheat-gold); }
.tier-queen .tier-icon[b-ad8hlbesrr] { color: var(--cedar-green); }

.tier-header h3[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 0.5rem 0;
}

.tier-price[b-ad8hlbesrr] {
    font-family: var(--font-display);
}

.tier-price .amount[b-ad8hlbesrr] {
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
}

.tier-price .period[b-ad8hlbesrr] {
    font-size: 1rem;
    color: #666;
}

.tier-tagline[b-ad8hlbesrr] {
    font-size: 1rem;
    color: #666;
    margin-bottom: 2rem;
    font-style: italic;
}

.tier-benefits[b-ad8hlbesrr] {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
    flex-grow: 1;
}

.tier-benefits li[b-ad8hlbesrr] {
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.95rem;
    line-height: 1.5;
}

.tier-benefits li:last-child[b-ad8hlbesrr] {
    border-bottom: none;
}

.tier-benefits li i[b-ad8hlbesrr] {
    color: var(--cedar-green);
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.tier-benefits li em[b-ad8hlbesrr] {
    color: #999;
    font-style: italic;
}

.tier-action[b-ad8hlbesrr] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #000000;
    text-decoration: none;
    padding: 1rem 0;
    border-bottom: 2px solid #000000;
    transition: all 0.3s ease;
    margin-top: auto;
}

.tier-action:hover[b-ad8hlbesrr] {
    color: var(--cedar-green);
    border-color: var(--cedar-green);
}

.tier-block.featured .tier-action[b-ad8hlbesrr] {
    color: var(--cedar-green);
    border-color: var(--cedar-green);
}

.tier-block.featured .tier-action:hover[b-ad8hlbesrr] {
    color: var(--wheat-gold);
    border-color: var(--wheat-gold);
}

/* ============================================
   Comparison Section
   ============================================ */

.comparison-section[b-ad8hlbesrr] {
    background: var(--river-pearl);
    padding: 6rem 4rem;
}

.comparison-section .section-header[b-ad8hlbesrr] {
    max-width: 1200px;
    margin: 0 auto 4rem;
}

.comparison-table-wrap[b-ad8hlbesrr] {
    max-width: 1000px;
    margin: 0 auto;
    overflow-x: auto;
}

.comparison-table[b-ad8hlbesrr] {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
}

.comparison-table th[b-ad8hlbesrr],
.comparison-table td[b-ad8hlbesrr] {
    padding: 1.25rem 1.5rem;
    text-align: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.comparison-table th:first-child[b-ad8hlbesrr],
.comparison-table td:first-child[b-ad8hlbesrr] {
    text-align: left;
}

.comparison-table thead[b-ad8hlbesrr] {
    background: #000000;
    color: #ffffff;
}

.comparison-table th[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.comparison-table th.highlight[b-ad8hlbesrr] {
    background: var(--cedar-green);
}

.comparison-table td[b-ad8hlbesrr] {
    font-size: 0.95rem;
    color: #333;
}

.comparison-table td.highlight[b-ad8hlbesrr] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    font-weight: 500;
}

.comparison-table td i[b-ad8hlbesrr] {
    color: var(--cedar-green);
}

/* ============================================
   Tournament Naming Section
   ============================================ */

.naming-section[b-ad8hlbesrr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.naming-content[b-ad8hlbesrr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

.naming-text h2[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.naming-text > p[b-ad8hlbesrr] {
    font-size: 1.125rem;
    color: #666;
    line-height: 1.6;
    margin: 0 0 2rem 0;
}

.naming-benefits[b-ad8hlbesrr] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.naming-benefits li[b-ad8hlbesrr] {
    padding: 0.75rem 0;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    font-size: 1rem;
    color: #333;
}

.naming-benefits li i[b-ad8hlbesrr] {
    color: var(--wheat-gold);
    font-size: 1.25rem;
    margin-top: 0.1rem;
}

.naming-visual[b-ad8hlbesrr] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.trophy-display[b-ad8hlbesrr] {
    background: linear-gradient(135deg, var(--wheat-gold) 0%, #C49F27 100%);
    padding: 4rem;
    text-align: center;
    position: relative;
}

.trophy-display i[b-ad8hlbesrr] {
    font-size: 5rem;
    color: #000000;
    display: block;
    margin-bottom: 1.5rem;
}

.trophy-text[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    line-height: 1.3;
}

/* ============================================
   FAQ Section
   ============================================ */

.faq-section[b-ad8hlbesrr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 4rem;
}

.faq-grid[b-ad8hlbesrr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
}

.faq-item[b-ad8hlbesrr] {
    padding: 2rem 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.faq-item h3[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: #000000;
    margin: 0 0 1rem 0;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.faq-item h3 i[b-ad8hlbesrr] {
    color: var(--wheat-gold);
    margin-top: 0.1rem;
}

.faq-item p[b-ad8hlbesrr] {
    margin: 0;
    color: #666;
    line-height: 1.6;
}

/* ============================================
   CTA Section
   ============================================ */

.cta-section[b-ad8hlbesrr] {
    background: #000000;
    padding: 6rem 4rem;
    text-align: center;
}

.cta-content[b-ad8hlbesrr] {
    max-width: 600px;
    margin: 0 auto;
}

.cta-content h2[b-ad8hlbesrr] {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 1rem 0;
}

.cta-content h2 .gold[b-ad8hlbesrr] {
    /* The cta band is dark (its h2 is white), so this is the on-dark accent. */
    color: var(--accent-text-on-dark);
}

.cta-content > p[b-ad8hlbesrr] {
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.125rem;
    margin: 0 0 2rem 0;
}

.cta-actions[b-ad8hlbesrr] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 1400px) {
    .tiers-grid[b-ad8hlbesrr] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .hero[b-ad8hlbesrr] {
        padding: 6rem 2rem;
        min-height: 50vh;
    }

    .hero-actions[b-ad8hlbesrr] {
        flex-direction: column;
    }

    .action-link[b-ad8hlbesrr] {
        width: 100%;
        justify-content: center;
    }

    .vision-section[b-ad8hlbesrr] {
        padding: 4rem 2rem;
    }

    .vision-text h2[b-ad8hlbesrr] {
        font-size: 2rem;
    }

    .vision-lead[b-ad8hlbesrr] {
        font-size: 1.125rem;
    }

    .vision-goals[b-ad8hlbesrr] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .goal-item[b-ad8hlbesrr] {
        padding: 1.25rem;
    }

    .value-section[b-ad8hlbesrr] {
        padding: 4rem 2rem;
    }

    .value-grid[b-ad8hlbesrr] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .tiers-section[b-ad8hlbesrr],
    .comparison-section[b-ad8hlbesrr],
    .naming-section[b-ad8hlbesrr],
    .faq-section[b-ad8hlbesrr],
    .cta-section[b-ad8hlbesrr] {
        padding: 4rem 2rem;
    }

    .tiers-grid[b-ad8hlbesrr] {
        grid-template-columns: 1fr;
    }

    .tier-block[b-ad8hlbesrr] {
        padding: 2rem;
    }

    .section-header h2[b-ad8hlbesrr] {
        font-size: 2rem;
    }

    .naming-content[b-ad8hlbesrr] {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    .naming-text h2[b-ad8hlbesrr] {
        font-size: 2rem;
    }

    .trophy-display[b-ad8hlbesrr] {
        padding: 3rem 2rem;
    }

    .trophy-display i[b-ad8hlbesrr] {
        font-size: 4rem;
    }

    .trophy-text[b-ad8hlbesrr] {
        font-size: 1.25rem;
    }

    .faq-grid[b-ad8hlbesrr] {
        grid-template-columns: 1fr;
    }

    .cta-content h2[b-ad8hlbesrr] {
        font-size: 2rem;
    }

    .cta-actions[b-ad8hlbesrr] {
        flex-direction: column;
    }
}

.section-no-autorenew[b-ad8hlbesrr] {
    margin: 1rem auto 0 auto;
    max-width: 720px;
    padding: 0.75rem 1rem;
    background: rgba(var(--wheat-gold-rgb), 0.10);
    border-left: 3px solid var(--wheat-gold, #D4AF37);
    color: #4b5563;
    font-size: 0.9375rem;
    line-height: 1.55;
    text-align: left;
}

.section-no-autorenew i[b-ad8hlbesrr] {
    color: var(--wheat-gold, #D4AF37);
    margin-right: 0.5rem;
}

.section-no-autorenew strong[b-ad8hlbesrr] {
    color: #111827;
}
/* /Components/Pages/SponsorshipPages/SponsorSuccess.razor.rz.scp.css */
.success-container[b-j1cvvkfjpu] {
    max-width: 800px;
    margin: 0 auto;
    padding: 3rem 1rem;
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.success-card[b-j1cvvkfjpu] {
    background: white;
    padding: 3rem;
    border-radius: 1rem;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
    text-align: center;
}

.success-icon[b-j1cvvkfjpu] {
    font-size: 5rem;
    color: #22c55e;
    margin-bottom: 2rem;
    animation: scaleIn-b-j1cvvkfjpu 0.5s ease;
}

@keyframes scaleIn-b-j1cvvkfjpu {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

.success-card h1[b-j1cvvkfjpu] {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1rem;
}

.success-message[b-j1cvvkfjpu] {
    font-size: 1.25rem;
    color: #666;
    margin-bottom: 3rem;
    line-height: 1.6;
}

/* The tier named in the thank-you line is running text on the white card, so it takes the
   small-text accent, which every skin sets to read at 4.5:1 on its light grounds (#8289). The
   display gold measured 2.1:1 there, and the photo skin's gold 1.66:1. */
.success-message strong[b-j1cvvkfjpu] {
    color: var(--accent-text-small);
}

.success-details[b-j1cvvkfjpu] {
    background: var(--river-pearl);
    padding: 2rem;
    border-radius: 0.75rem;
    margin-bottom: 3rem;
    text-align: left;
}

.detail-item[b-j1cvvkfjpu] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid var(--limestone-cream);
}

.detail-item:last-child[b-j1cvvkfjpu] {
    border-bottom: none;
    padding-bottom: 0;
}

.detail-item i[b-j1cvvkfjpu] {
    font-size: 1.5rem;
    color: var(--cedar-green);
    margin-top: 0.25rem;
}

.detail-item strong[b-j1cvvkfjpu] {
    display: block;
    font-size: 1.125rem;
    color: var(--cedar-green);
    margin-bottom: 0.25rem;
}

.detail-item p[b-j1cvvkfjpu] {
    color: #666;
    font-size: 0.95rem;
    margin: 0;
}

/* Logo Upload Section */
.logo-upload-section[b-j1cvvkfjpu] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
    padding: 2rem;
    border-radius: 1rem;
    margin-bottom: 3rem;
    text-align: center;
}

.logo-upload-section h2[b-j1cvvkfjpu] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    color: white;
}

.logo-upload-section > p[b-j1cvvkfjpu] {
    opacity: 0.9;
    margin-bottom: 1.5rem;
    font-size: 0.95rem;
}

.upload-message[b-j1cvvkfjpu] {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-weight: 500;
}

.upload-message.success[b-j1cvvkfjpu] {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}

.upload-message.error[b-j1cvvkfjpu] {
    background: rgba(239, 68, 68, 0.2);
    color: #fca5a5;
}

.upload-controls[b-j1cvvkfjpu] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

.file-input[b-j1cvvkfjpu] {
    display: none;
}

/* Use ::deep to penetrate Blazor's component isolation for InputFile */
[b-j1cvvkfjpu] input[type="file"] {
    display: none;
}

.upload-btn[b-j1cvvkfjpu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 2rem;
    background: white;
    color: var(--cedar-green);
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.upload-btn:hover[b-j1cvvkfjpu] {
    background: var(--river-pearl);
    transform: translateY(-2px);
}

.logo-preview[b-j1cvvkfjpu] {
    margin-top: 1.5rem;
    padding: 1rem;
    background: white;
    border-radius: 0.5rem;
    display: inline-block;
}

.logo-preview img[b-j1cvvkfjpu] {
    max-width: 200px;
    max-height: 200px;
    object-fit: contain;
}

.upload-note[b-j1cvvkfjpu] {
    margin-top: 1rem;
    font-size: 0.875rem;
    opacity: 0.7;
}

/* Benefits Section */
.benefits-section[b-j1cvvkfjpu] {
    margin-bottom: 3rem;
    text-align: left;
}

.benefits-section h2[b-j1cvvkfjpu] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    text-align: center;
}

.benefits-list[b-j1cvvkfjpu] {
    list-style: none;
    padding: 0;
    display: grid;
    gap: 0.75rem;
}

.benefits-list li[b-j1cvvkfjpu] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: var(--river-pearl);
    border-radius: 0.5rem;
}

.benefits-list li i[b-j1cvvkfjpu] {
    color: #22c55e;
    font-size: 1rem;
    margin-top: 0.125rem;
}

.benefits-list li span[b-j1cvvkfjpu] {
    color: #333;
}

/* Next Steps */
.next-steps[b-j1cvvkfjpu] {
    text-align: left;
    margin-bottom: 3rem;
}

.next-steps h2[b-j1cvvkfjpu] {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin-bottom: 1.5rem;
    text-align: center;
}

.next-steps ol[b-j1cvvkfjpu] {
    list-style: none;
    padding: 0;
    counter-reset: step-counter;
}

.next-steps li[b-j1cvvkfjpu] {
    padding: 1rem;
    margin-bottom: 0.75rem;
    background: white;
    border: 2px solid var(--limestone-cream);
    border-radius: 0.5rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    font-size: 1rem;
    line-height: 1.6;
    transition: all 0.3s ease;
}

.next-steps li:hover[b-j1cvvkfjpu] {
    border-color: var(--cedar-green);
    background: var(--river-pearl);
}

.next-steps li i[b-j1cvvkfjpu] {
    color: var(--wilson-blue);
    font-size: 1.25rem;
    margin-top: 0.125rem;
}

.next-steps a[b-j1cvvkfjpu] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.next-steps a:hover[b-j1cvvkfjpu] {
    color: var(--cedar-green);
}

/* Action Buttons */
.action-buttons[b-j1cvvkfjpu] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 3rem;
}

.btn[b-j1cvvkfjpu] {
    padding: 1rem 2rem;
    font-size: 1.125rem;
    font-weight: 700;
    border-radius: 0.5rem;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-primary[b-j1cvvkfjpu] {
    background: linear-gradient(135deg, var(--cedar-green) 0%, var(--wilson-blue) 100%);
    color: white;
}

.btn-primary:hover[b-j1cvvkfjpu] {
    background: linear-gradient(135deg, var(--cedar-green-dark) 0%, var(--wilson-blue-dark) 100%);
    transform: translateY(-2px);
}

.btn-secondary[b-j1cvvkfjpu] {
    background: var(--wheat-gold);
    color: var(--on-gold);
}

.btn-secondary:hover[b-j1cvvkfjpu] {
    background: #C49F27;
    transform: translateY(-2px);
}

.btn-tertiary[b-j1cvvkfjpu] {
    background: white;
    color: var(--cedar-green);
    border: 2px solid var(--cedar-green);
}

.btn-tertiary:hover[b-j1cvvkfjpu] {
    background: var(--river-pearl);
    transform: translateY(-2px);
}

/* Help Section */
.help-section[b-j1cvvkfjpu] {
    padding-top: 2rem;
    border-top: 2px solid var(--limestone-cream);
    color: #666;
    font-size: 0.95rem;
}

.help-section a[b-j1cvvkfjpu] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.help-section a:hover[b-j1cvvkfjpu] {
    color: var(--cedar-green);
}

/* Responsive Design */
@media (max-width: 768px) {
    .success-card[b-j1cvvkfjpu] {
        padding: 2rem 1.5rem;
    }

    .success-card h1[b-j1cvvkfjpu] {
        font-size: 2rem;
    }

    .success-message[b-j1cvvkfjpu] {
        font-size: 1.125rem;
    }

    .logo-upload-section[b-j1cvvkfjpu] {
        padding: 1.5rem;
    }

    .action-buttons[b-j1cvvkfjpu] {
        flex-direction: column;
    }

    .btn[b-j1cvvkfjpu] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Pages/SubmitTournament.razor.rz.scp.css */


/* ===== Page container ===== */
.submit-page[b-0skxndwn1q] { max-width: 1000px; margin: 0 auto; padding: 2.5rem 1.5rem 5rem; }

.form-grid[b-0skxndwn1q] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem 1.5rem;
}
.full-width[b-0skxndwn1q] { grid-column: 1 / -1; }

.form-section-header[b-0skxndwn1q] { border-bottom: 2px solid var(--cedar-green, #2D5016); padding-bottom: 0.4rem; margin-top: 1rem; }
.form-section-header h3[b-0skxndwn1q] {
    margin: 0; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em;
    color: var(--cedar-green, #2D5016); font-size: 1.05rem;
}
.section-note[b-0skxndwn1q] { margin: 0.35rem 0 0; font-size: 0.85rem; color: #6b7280; }

.form-group[b-0skxndwn1q] { display: flex; flex-direction: column; gap: 0.35rem; }
.form-group label[b-0skxndwn1q] { font-weight: 600; font-size: 0.85rem; color: #374151; }
.hint[b-0skxndwn1q] { font-size: 0.8rem; color: #6b7280; font-weight: 400; }

/* Inputs — ::deep covers both Blazor Input* components and raw inputs/selects */
[b-0skxndwn1q] input[type="text"],
[b-0skxndwn1q] input[type="time"],
[b-0skxndwn1q] input[type="date"],
[b-0skxndwn1q] input[type="number"],
[b-0skxndwn1q] select,
[b-0skxndwn1q] textarea {
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.4rem;
    font-size: 0.9rem;
    font-family: inherit;
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
[b-0skxndwn1q] input:focus,
[b-0skxndwn1q] select:focus,
[b-0skxndwn1q] textarea:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}
[b-0skxndwn1q] textarea { resize: vertical; }
[b-0skxndwn1q] .validation-message { color: #b42323; font-size: 0.8rem; }

.inline-check[b-0skxndwn1q] { flex-direction: row; align-items: center; gap: 0.5rem; font-weight: 500; }
.inline-check[b-0skxndwn1q]  input[type="checkbox"] { width: auto; }

.checkbox-row[b-0skxndwn1q] { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.checkbox-row label[b-0skxndwn1q] { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 500; }
.checkbox-row input[b-0skxndwn1q] { width: auto; }

.chips[b-0skxndwn1q] { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.chip[b-0skxndwn1q] {
    display: inline-flex; align-items: center; gap: 0.35rem;
    padding: 0.3rem 0.6rem; border: 1px solid #d1d5db; border-radius: 999px;
    font-size: 0.8rem; font-weight: 600; cursor: pointer; background: #fff;
}
.chip.on[b-0skxndwn1q] { border-color: var(--cedar-green, #2D5016); background: var(--cedar-green-tint); color: var(--cedar-green, #2D5016); }
.chip input[b-0skxndwn1q] { width: auto; }

.section-row[b-0skxndwn1q] {
    display: grid;
    grid-template-columns: 2fr 1.5fr 0.8fr 0.8fr auto;
    gap: 0.75rem;
    align-items: end;
    padding: 0.75rem;
    border: 1px solid rgba(0,0,0,0.08);
    border-radius: 0.4rem;
    margin-bottom: 0.75rem;
}
.form-group.narrow[b-0skxndwn1q] { min-width: 0; }
.remove-btn[b-0skxndwn1q] {
    border: none; background: #fbeaea; color: #b42323; cursor: pointer;
    width: 2.1rem; height: 2.1rem; border-radius: 0.4rem; font-size: 0.9rem;
}
.remove-btn:hover[b-0skxndwn1q] { background: #f6d5d5; }

.flyer-current[b-0skxndwn1q] { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.4rem; font-size: 0.9rem; }
.flyer-current a[b-0skxndwn1q] { color: var(--cedar-green, #2D5016); font-weight: 600; }

.form-actions[b-0skxndwn1q] { margin-top: 1.5rem; }

.success-card[b-0skxndwn1q] {
    text-align: center; max-width: 560px; margin: 2rem auto; padding: 2.5rem 2rem;
    border: 1px solid rgba(0,0,0,0.08); border-left: 4px solid var(--cedar-green, #2D5016);
    background: var(--cedar-green-tint);
}
.success-card i[b-0skxndwn1q] { font-size: 2.5rem; color: var(--cedar-green, #2D5016); }
.success-card h2[b-0skxndwn1q] { margin: 0.75rem 0 0.5rem; color: #111; }
.success-card p[b-0skxndwn1q] { color: #374151; margin: 0 0 1.5rem; }
.success-actions[b-0skxndwn1q] { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

@media (max-width: 760px) {
    .form-grid[b-0skxndwn1q] { grid-template-columns: 1fr; }
    .section-row[b-0skxndwn1q] { grid-template-columns: 1fr 1fr; }
}
/* /Components/Pages/Terms.razor.rz.scp.css */
/* ============================================
   Terms of Service Page - Editorial Design
   ============================================ */

.terms-page[b-zvqq9aqvi3] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.content-section[b-zvqq9aqvi3] {
    max-width: 900px;
    margin: 0 auto;
    padding: 4rem 2rem;
}

.content-container[b-zvqq9aqvi3] {
    background: white;
}

.last-updated[b-zvqq9aqvi3] {
    font-size: 0.875rem;
    color: #6b7280;
    font-style: italic;
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.policy-content[b-zvqq9aqvi3] {
    color: #374151;
}

.policy-section[b-zvqq9aqvi3] {
    margin-bottom: 3rem;
}

.policy-section:last-of-type[b-zvqq9aqvi3] {
    margin-bottom: 2rem;
}

.policy-section h2[b-zvqq9aqvi3] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1.5rem 0;
    padding-top: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.policy-section h3[b-zvqq9aqvi3] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--cedar-green);
    margin: 2rem 0 1rem 0;
}

.policy-section p[b-zvqq9aqvi3] {
    color: #374151;
    line-height: 1.8;
    margin-bottom: 1rem;
    font-size: 1rem;
}

.policy-section ul[b-zvqq9aqvi3] {
    margin: 1rem 0 1.5rem 1.5rem;
    padding-left: 0.5rem;
}

.policy-section li[b-zvqq9aqvi3] {
    color: #374151;
    line-height: 1.8;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.policy-section li[b-zvqq9aqvi3]::marker {
    color: var(--cedar-green);
}

.policy-section a[b-zvqq9aqvi3] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.policy-section a:hover[b-zvqq9aqvi3] {
    color: var(--wilson-blue);
    text-decoration: underline;
}

.contact-info[b-zvqq9aqvi3] {
    background: rgba(var(--cedar-green-rgb), 0.05);
    border-left: 4px solid var(--cedar-green);
    padding: 1.5rem 2rem;
    margin: 1.5rem 0;
}

.contact-info p[b-zvqq9aqvi3] {
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.contact-info p:last-child[b-zvqq9aqvi3] {
    margin-bottom: 0;
}

.contact-info strong[b-zvqq9aqvi3] {
    color: var(--cedar-green);
    font-weight: 700;
}

.policy-footer[b-zvqq9aqvi3] {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    text-align: center;
}

.policy-footer p[b-zvqq9aqvi3] {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.6;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 768px) {

    .content-section[b-zvqq9aqvi3] {
        padding: 2rem 1.5rem;
    }

    .policy-section h2[b-zvqq9aqvi3] {
        font-size: 1.25rem;
    }

    .policy-section h3[b-zvqq9aqvi3] {
        font-size: 1rem;
    }

    .contact-info[b-zvqq9aqvi3] {
        padding: 1rem 1.5rem;
    }
}

@media (max-width: 480px) {

    .content-section[b-zvqq9aqvi3] {
        padding: 1.5rem 1rem;
    }

    .policy-section h2[b-zvqq9aqvi3] {
        font-size: 1.125rem;
    }
}
/* /Components/Pages/Uscf/Lookup.razor.rz.scp.css */
/* ============================================
   USCF Lookup Page - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

.uscf-lookup-page[b-cf1aqskuf0] {
    background: #ffffff;
}

/* ============================================
   Content Section
   ============================================ */

.lookup-content[b-cf1aqskuf0] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem;
}

/* ============================================
   Search Section
   ============================================ */

.search-section[b-cf1aqskuf0] {
    margin-bottom: 4rem;
}

.search-box[b-cf1aqskuf0] {
    display: flex;
    gap: 1rem;
    max-width: 700px;
    margin: 0 auto;
}

.search-input-wrapper[b-cf1aqskuf0] {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
}

.search-icon[b-cf1aqskuf0] {
    position: absolute;
    left: 1.25rem;
    color: #6b7280;
    font-size: 1rem;
}

.search-input[b-cf1aqskuf0] {
    width: 100%;
    padding: 1rem 3rem 1rem 3.25rem;
    font-size: 1rem;
    border: 2px solid rgba(0, 0, 0, 0.1);
    border-radius: 0;
    background: #ffffff;
    color: #000000;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: inherit;
}

.search-input:focus[b-cf1aqskuf0] {
    outline: none;
    border-color: #000000;
}

.search-input[b-cf1aqskuf0]::placeholder {
    color: #9ca3af;
}

.clear-btn[b-cf1aqskuf0] {
    position: absolute;
    right: 0.75rem;
    background: none;
    border: none;
    color: #6b7280;
    cursor: pointer;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.clear-btn:hover[b-cf1aqskuf0] {
    color: #000000;
}

.search-btn[b-cf1aqskuf0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2rem;
    background: #000000;
    color: #ffffff;
    border: none;
    border-radius: 0;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
    font-family: var(--font-display);
}

.search-btn:hover:not(:disabled)[b-cf1aqskuf0] {
    background: var(--cedar-green);
}

.search-btn:disabled[b-cf1aqskuf0] {
    opacity: 0.4;
    cursor: not-allowed;
}

.search-hint[b-cf1aqskuf0] {
    text-align: center;
    color: #6b7280;
    font-size: 0.875rem;
    margin-top: 1rem;
}

.search-hint i[b-cf1aqskuf0] {
    margin-right: 0.5rem;
    color: var(--cedar-green);
}

/* ============================================
   Error Message
   ============================================ */

.error-message[b-cf1aqskuf0] {
    background: rgba(220, 38, 38, 0.05);
    border-left: 4px solid #dc2626;
    color: #dc2626;
    padding: 1rem 1.5rem;
    margin-bottom: 2rem;
    font-weight: 500;
}

.error-message i[b-cf1aqskuf0] {
    margin-right: 0.75rem;
}

/* ============================================
   Results Header
   ============================================ */

.results-header[b-cf1aqskuf0] {
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #000000;
}

.results-header h3[b-cf1aqskuf0] {
    color: #000000;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.results-header h3 i[b-cf1aqskuf0] {
    color: var(--cedar-green);
}

.more-indicator[b-cf1aqskuf0] {
    color: #6b7280;
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: normal;
}

/* ============================================
   Results Grid
   ============================================ */

.results-grid[b-cf1aqskuf0] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(380px, 100%), 1fr));
    gap: 2rem;
}

/* ============================================
   Member Card
   ============================================ */

.member-card[b-cf1aqskuf0] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    padding: 2rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.member-card:hover[b-cf1aqskuf0] {
    border-color: rgba(0, 0, 0, 0.2);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.member-card.expired[b-cf1aqskuf0] {
    border-left: 4px solid #dc2626;
}

.member-card.active[b-cf1aqskuf0] {
    border-left: 4px solid #059669;
}

.member-header[b-cf1aqskuf0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.member-name-section[b-cf1aqskuf0] {
    flex: 1;
}

.member-name[b-cf1aqskuf0] {
    color: #000000;
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.member-id[b-cf1aqskuf0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.875rem;
}

.id-label[b-cf1aqskuf0] {
    color: #6b7280;
}

.id-value[b-cf1aqskuf0] {
    color: var(--cedar-green);
    font-weight: 600;
    font-family: monospace;
}

.copy-btn[b-cf1aqskuf0] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 0.25rem;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.copy-btn:hover[b-cf1aqskuf0] {
    color: var(--cedar-green);
}

.membership-status[b-cf1aqskuf0] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-active[b-cf1aqskuf0] {
    background: rgba(5, 150, 105, 0.1);
    color: #059669;
}

.status-expired[b-cf1aqskuf0] {
    background: rgba(220, 38, 38, 0.1);
    color: #dc2626;
}

/* ============================================
   Member Details
   ============================================ */

.member-details[b-cf1aqskuf0] {
    margin-bottom: 1.5rem;
}

.detail-row[b-cf1aqskuf0] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    font-size: 0.9375rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.detail-row:last-child[b-cf1aqskuf0] {
    border-bottom: none;
}

.detail-label[b-cf1aqskuf0] {
    color: #6b7280;
}

.detail-value[b-cf1aqskuf0] {
    color: #000000;
    font-weight: 500;
}

.expiring-soon[b-cf1aqskuf0] {
    color: #d97706;
}

.days-left[b-cf1aqskuf0] {
    color: #9ca3af;
    font-size: 0.75rem;
    margin-left: 0.25rem;
}

/* ============================================
   Ratings Section
   ============================================ */

.ratings-section[b-cf1aqskuf0] {
    background: rgba(var(--cedar-green-rgb), 0.03);
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.ratings-title[b-cf1aqskuf0] {
    color: var(--cedar-green);
    font-family: var(--font-display);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 1rem;
    font-weight: 700;
}

.ratings-grid[b-cf1aqskuf0] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.rating-item[b-cf1aqskuf0] {
    text-align: center;
}

.rating-label[b-cf1aqskuf0] {
    display: block;
    color: #6b7280;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.375rem;
}

.rating-value[b-cf1aqskuf0] {
    display: block;
    color: #000000;
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
}

.rating-value.provisional[b-cf1aqskuf0] {
    color: #d97706;
}

.games-played[b-cf1aqskuf0] {
    display: block;
    color: #9ca3af;
    font-size: 0.6875rem;
    margin-top: 0.25rem;
}

/* ============================================
   FIDE Section
   ============================================ */

.fide-section[b-cf1aqskuf0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.875rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.fide-label[b-cf1aqskuf0] {
    color: #6b7280;
}

.fide-link[b-cf1aqskuf0] {
    color: var(--cedar-green);
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.fide-link:hover[b-cf1aqskuf0] {
    color: var(--cedar-green-dark);
    text-decoration: underline;
}

.fide-link i[b-cf1aqskuf0] {
    font-size: 0.625rem;
    opacity: 0.7;
}

/* ============================================
   Initial State
   ============================================ */

.initial-state[b-cf1aqskuf0] {
    text-align: center;
    padding: 6rem 4rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.initial-icon[b-cf1aqskuf0] {
    font-size: 5rem;
    color: var(--wheat-gold);
    margin-bottom: 2rem;
}

.initial-state h3[b-cf1aqskuf0] {
    font-family: var(--font-display);
    font-size: 2rem;
    font-weight: 700;
    color: #000000;
    margin: 0 0 1rem;
    text-transform: uppercase;
    letter-spacing: -0.02em;
}

.initial-state > p[b-cf1aqskuf0] {
    color: #6b7280;
    font-size: 1.0625rem;
    margin: 0 0 3rem;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.use-cases[b-cf1aqskuf0] {
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
}

.use-case[b-cf1aqskuf0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #374151;
    font-size: 0.9375rem;
}

.use-case i[b-cf1aqskuf0] {
    color: var(--cedar-green);
    font-size: 1rem;
}

/* ============================================
   Toast Notification
   ============================================ */

.toast-notification[b-cf1aqskuf0] {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    background: #000000;
    color: #ffffff;
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-weight: 600;
    font-size: 0.875rem;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2);
    animation: slideUp-b-cf1aqskuf0 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
}

.toast-notification i[b-cf1aqskuf0] {
    color: var(--wheat-gold);
}

@keyframes slideUp-b-cf1aqskuf0 {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(1rem);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {

    .lookup-content[b-cf1aqskuf0] {
        padding: 2rem;
    }

    .search-box[b-cf1aqskuf0] {
        flex-direction: column;
    }

    .search-btn[b-cf1aqskuf0] {
        justify-content: center;
    }

    .results-grid[b-cf1aqskuf0] {
        grid-template-columns: 1fr;
    }

    .member-card[b-cf1aqskuf0] {
        padding: 1.5rem;
    }

    .ratings-grid[b-cf1aqskuf0] {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .rating-item[b-cf1aqskuf0] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: left;
        padding: 0.5rem 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    }

    .rating-item:last-child[b-cf1aqskuf0] {
        border-bottom: none;
    }

    .rating-label[b-cf1aqskuf0] {
        margin-bottom: 0;
    }

    .rating-value[b-cf1aqskuf0] {
        font-size: 1.25rem;
    }

    .games-played[b-cf1aqskuf0] {
        display: none;
    }

    .use-cases[b-cf1aqskuf0] {
        flex-direction: column;
        gap: 1.5rem;
    }

    .initial-state[b-cf1aqskuf0] {
        padding: 4rem 2rem;
    }
}
/* /Components/Shared/BarcodeScanner.razor.rz.scp.css */
.barcode-scanner-modal[b-6gcty6mz0t] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
    padding: 1rem;
    transition: opacity 0.2s, visibility 0.2s;
}

.barcode-scanner-modal.hidden[b-6gcty6mz0t] {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.barcode-scanner-modal.visible[b-6gcty6mz0t] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.scanner-container[b-6gcty6mz0t] {
    background: white;
    border-radius: 0.75rem;
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.scanner-header[b-6gcty6mz0t] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 2px solid #e5e7eb;
    background: #f9fafb;
}

.scanner-header h3[b-6gcty6mz0t] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
}

.btn-close[b-6gcty6mz0t] {
    background: none;
    border: none;
    font-size: 2rem;
    line-height: 1;
    cursor: pointer;
    color: #6b7280;
    padding: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-close:hover[b-6gcty6mz0t] {
    color: #111827;
}

.scanner-body[b-6gcty6mz0t] {
    flex: 1;
    padding: 1.5rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

/* Instructions */
.scanner-instructions[b-6gcty6mz0t] {
    text-align: center;
    max-width: 400px;
}

.scanner-instructions .icon[b-6gcty6mz0t] {
    font-size: 4rem;
    margin-bottom: 1rem;
}

.scanner-instructions p[b-6gcty6mz0t] {
    font-size: 1rem;
    color: #374151;
    margin: 0.5rem 0;
}

.scanner-instructions .hint[b-6gcty6mz0t] {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 2rem;
}

/* Desktop Message */
.desktop-message[b-6gcty6mz0t] {
    max-width: 500px;
}

.desktop-message h3[b-6gcty6mz0t] {
    font-size: 1.5rem;
    font-weight: 600;
    color: #111827;
    margin: 1rem 0;
}

.desktop-tips[b-6gcty6mz0t] {
    background: #f9fafb;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1rem 1.5rem;
    text-align: left;
    margin-top: 1.5rem;
}

.desktop-tips strong[b-6gcty6mz0t] {
    display: block;
    color: #374151;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
}

.desktop-tips ul[b-6gcty6mz0t] {
    margin: 0;
    padding-left: 1.5rem;
    color: #6b7280;
}

.desktop-tips li[b-6gcty6mz0t] {
    margin: 0.5rem 0;
    font-size: 0.875rem;
}

.btn-start-scan[b-6gcty6mz0t] {
    background: var(--wilson-blue);
    color: white;
    padding: 1rem 2rem;
    border: none;
    border-radius: 0.5rem;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-start-scan:hover[b-6gcty6mz0t] {
    background: #0052a3;
    transform: translateY(-2px);
}

/* Video Container */
.video-container[b-6gcty6mz0t] {
    position: relative;
    width: 100%;
    max-width: 500px;
    background: #000;
    border-radius: 0.5rem;
    overflow: hidden;
}

#barcode-video[b-6gcty6mz0t] {
    width: 100%;
    height: auto;
    display: block;
}

.scanner-overlay[b-6gcty6mz0t] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.scanner-frame[b-6gcty6mz0t] {
    width: 80%;
    height: 40%;
    border: 3px solid #10b981;
    border-radius: 0.5rem;
    box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5);
}

.scanner-status[b-6gcty6mz0t] {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Scanner Actions */
.scanner-actions[b-6gcty6mz0t] {
    display: flex;
    gap: 1rem;
    margin-top: 1rem;
    width: 100%;
    max-width: 500px;
}

.btn-stop[b-6gcty6mz0t],
.btn-switch[b-6gcty6mz0t] {
    flex: 1;
    padding: 0.75rem 1rem;
    border: none;
    border-radius: 0.375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-stop[b-6gcty6mz0t] {
    background: #dc2626;
    color: white;
}

.btn-stop:hover[b-6gcty6mz0t] {
    background: #b91c1c;
}

.btn-switch[b-6gcty6mz0t] {
    background: #6b7280;
    color: white;
}

.btn-switch:hover:not(:disabled)[b-6gcty6mz0t] {
    background: #4b5563;
}

.btn-switch:disabled[b-6gcty6mz0t] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Permission Notice */
.permission-notice[b-6gcty6mz0t] {
    background: #fef3c7;
    border: 2px solid #fbbf24;
    border-radius: 0.5rem;
    padding: 1rem;
    margin: 1.5rem 0;
}

.permission-text[b-6gcty6mz0t] {
    font-weight: 600;
    color: #92400e;
    margin: 0 0 0.5rem 0;
    font-size: 1rem;
}

.permission-hint[b-6gcty6mz0t] {
    font-size: 0.875rem;
    color: #b45309;
    margin: 0;
}

/* Error Message */
.scanner-error[b-6gcty6mz0t] {
    background: #fef2f2;
    border: 2px solid #fecaca;
    border-radius: 0.5rem;
    padding: 1rem;
    margin-top: 1rem;
    color: #991b1b;
    width: 100%;
    max-width: 500px;
}

.scanner-error strong[b-6gcty6mz0t] {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 1rem;
}

.error-instructions[b-6gcty6mz0t] {
    background: white;
    border-radius: 0.375rem;
    padding: 1rem;
    margin: 1rem 0;
    text-align: left;
}

.error-instructions p[b-6gcty6mz0t] {
    font-weight: 600;
    color: #991b1b;
    margin: 0 0 0.75rem 0;
    font-size: 0.875rem;
}

.error-instructions ol[b-6gcty6mz0t] {
    margin: 0;
    padding-left: 1.5rem;
    color: #dc2626;
}

.error-instructions li[b-6gcty6mz0t] {
    margin: 0.5rem 0;
    font-size: 0.8125rem;
    line-height: 1.4;
}

.error-hint[b-6gcty6mz0t] {
    font-size: 0.875rem;
    color: #dc2626;
    margin: 0.5rem 0;
}

.btn-retry[b-6gcty6mz0t] {
    background: var(--wilson-blue);
    color: white;
    padding: 0.75rem 1.5rem;
    border: none;
    border-radius: 0.375rem;
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    margin-top: 1rem;
    transition: all 0.2s;
}

.btn-retry:hover[b-6gcty6mz0t] {
    background: #0052a3;
}

/* Result */
.scanner-result[b-6gcty6mz0t] {
    text-align: center;
    width: 100%;
    max-width: 400px;
}

.success-icon[b-6gcty6mz0t] {
    width: 80px;
    height: 80px;
    background: #10b981;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    margin: 0 auto 1rem;
}

.scanner-result h4[b-6gcty6mz0t] {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 1rem 0;
}

.result-code[b-6gcty6mz0t] {
    background: #f9fafb;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    padding: 1rem;
    font-family: monospace;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--wilson-blue);
    margin-bottom: 1.5rem;
}

.result-actions[b-6gcty6mz0t] {
    display: flex;
    gap: 1rem;
}

.btn-use[b-6gcty6mz0t],
.btn-scan-again[b-6gcty6mz0t] {
    flex: 1;
    padding: 0.875rem 1rem;
    border: none;
    border-radius: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-use[b-6gcty6mz0t] {
    background: var(--wilson-blue);
    color: white;
}

.btn-use:hover[b-6gcty6mz0t] {
    background: #0052a3;
}

.btn-scan-again[b-6gcty6mz0t] {
    background: white;
    border: 2px solid #e5e7eb;
    color: #374151;
}

.btn-scan-again:hover[b-6gcty6mz0t] {
    border-color: #9ca3af;
}

/* Footer */
.scanner-footer[b-6gcty6mz0t] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    border-top: 2px solid #e5e7eb;
    background: #f9fafb;
}

.btn-cancel[b-6gcty6mz0t],
.btn-manual[b-6gcty6mz0t] {
    flex: 1;
    padding: 0.875rem 1rem;
    border-radius: 0.5rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel[b-6gcty6mz0t] {
    background: white;
    border: 2px solid #e5e7eb;
    color: #6b7280;
}

.btn-cancel:hover[b-6gcty6mz0t] {
    border-color: #9ca3af;
    color: #374151;
}

.btn-manual[b-6gcty6mz0t] {
    background: var(--wilson-blue);
    color: white;
    border: none;
}

.btn-manual:hover[b-6gcty6mz0t] {
    background: #0052a3;
}

/* Responsive */
@media (max-width: 640px) {
    .scanner-container[b-6gcty6mz0t] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .scanner-actions[b-6gcty6mz0t],
    .result-actions[b-6gcty6mz0t],
    .scanner-footer[b-6gcty6mz0t] {
        flex-direction: column;
    }

    .btn-stop[b-6gcty6mz0t],
    .btn-switch[b-6gcty6mz0t],
    .btn-use[b-6gcty6mz0t],
    .btn-scan-again[b-6gcty6mz0t],
    .btn-cancel[b-6gcty6mz0t],
    .btn-manual[b-6gcty6mz0t] {
        width: 100%;
    }
}
/* /Components/Shared/BrandImageField.razor.rz.scp.css */
/* One piece of club artwork on the branding page (#7839). Every colour is a token, so the
   page that sets a club's palette is itself painted in that club's palette. */

.brand-image-field[b-vk8ydzxhqk] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.brand-image-label[b-vk8ydzxhqk] {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.brand-image-url[b-vk8ydzxhqk] {
    width: 100%;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
}

.brand-image-url:focus-visible[b-vk8ydzxhqk] {
    outline: 2px solid var(--accent-text-small);
    outline-offset: 1px;
}

.brand-image-actions[b-vk8ydzxhqk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

.brand-image-upload[b-vk8ydzxhqk] {
    flex: 1 1 14rem;
    min-width: 0;
}

/* InputFile renders its own <input>, which this component's scope attribute never reaches. */
.brand-image-upload[b-vk8ydzxhqk]  input[type="file"] {
    max-width: 100%;
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.brand-image-status[b-vk8ydzxhqk] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.brand-image-error[b-vk8ydzxhqk] {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-error);
}

.brand-image-preview[b-vk8ydzxhqk] {
    display: block;
    max-width: min(100%, 24rem);
    max-height: 12rem;
    width: auto;
    height: auto;
    object-fit: contain;
    border: 1px solid var(--color-border);
    border-radius: 0.375rem;
    background: var(--color-surface);
}
/* /Components/Shared/BreakingNewsBanner.razor.rz.scp.css */
/* ============================================
   Breaking News Banner
   Minimal Black/White with Cedar Green Accents
   ============================================ */

.news-banner[b-vd6cfebl7z] {
    color: #ffffff;
    display: flex;
    align-items: center;
    padding: 1rem 2rem;
    position: sticky;
    top: 0;
    overflow: hidden;
    gap: 1.5rem;
    width: 100%;
    min-width: 100%;
    align-self: start;
    box-sizing: border-box;
    max-width: 100%;
    z-index: 999;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-bottom: 2px solid;
}

/* The bottom rule was a hand-picked darker step of each background - one club's brown and
   blue - so it stayed that club's under any other club's banner color. A black wash
   is the same darker step of whatever background the club actually set. */

/* Breaking News Styling - Tobacco Barn Red (Brand Color) */
.news-banner.breaking[b-vd6cfebl7z] {
    background: var(--tobacco-barn-red);
    border-bottom-color: rgba(0, 0, 0, 0.25);
}

/* Latest News Styling - Wilson Blue (Brand Color) */
.news-banner.latest[b-vd6cfebl7z] {
    background: var(--wilson-blue);
    border-bottom-color: rgba(0, 0, 0, 0.25);
}

.news-label[b-vd6cfebl7z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    white-space: nowrap;
    flex-shrink: 0;
}

.news-icon[b-vd6cfebl7z] {
    font-size: 1rem;
}

/* Only pulse for breaking news */
.news-banner.breaking .news-icon[b-vd6cfebl7z] {
    animation: pulse-b-vd6cfebl7z 2s ease-in-out infinite;
}

@keyframes pulse-b-vd6cfebl7z {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.news-text[b-vd6cfebl7z] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    letter-spacing: 0.12em;
}

.news-content[b-vd6cfebl7z] {
    flex: 1;
    overflow: hidden;
    position: relative;
    min-height: 1.5rem;
    /* A flex item's min-width is AUTO, so "overflow: hidden" alone does not let this box
       shrink below the nowrap ticker inside it - it grew to the ticker's width and took the
       document with it (measured: /notation innerWidth 655 at a 390px viewport, #7561
       round 2). min-width: 0 is what makes the clip actually clip. */
    min-width: 0;
}

.news-ticker[b-vd6cfebl7z] {
    display: flex;
    gap: 3rem;
    white-space: nowrap;
}

.ticker-scroll[b-vd6cfebl7z] {
    animation: ticker-b-vd6cfebl7z 30s linear infinite;
}

.ticker-static[b-vd6cfebl7z] {
    animation: none;
    justify-content: flex-start;
}

@keyframes ticker-b-vd6cfebl7z {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

.ticker-scroll:hover[b-vd6cfebl7z] {
    animation-play-state: paused;
}

.news-item[b-vd6cfebl7z] {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    color: #ffffff;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 400;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.news-item:hover[b-vd6cfebl7z] {
    opacity: 0.7;
}

.news-separator[b-vd6cfebl7z] {
    font-size: 0.75rem;
    opacity: 0.5;
}

.news-blurb[b-vd6cfebl7z] {
    font-weight: 400;
    white-space: nowrap;
    line-height: 1.4;
}

.news-view-all[b-vd6cfebl7z] {
    color: #ffffff;
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    padding: 0.75rem 1.5rem;
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    flex-shrink: 0;
}

.news-view-all:hover[b-vd6cfebl7z] {
    border-color: #ffffff;
    background: rgba(255, 255, 255, 0.1);
}

/* Responsive */
@media (max-width: 768px) {
    .news-banner[b-vd6cfebl7z] {
        padding: 0.75rem 1rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .news-label[b-vd6cfebl7z] {
        font-size: 0.75rem;
    }

    .news-text[b-vd6cfebl7z] {
        font-size: 1rem;
    }

    .news-content[b-vd6cfebl7z] {
        width: 100%;
    }

    .news-item[b-vd6cfebl7z] {
        font-size: 0.875rem;
    }

    .news-view-all[b-vd6cfebl7z] {
        width: 100%;
        text-align: center;
    }

    .ticker-scroll[b-vd6cfebl7z] {
        animation-duration: 20s;
    }
}
/* /Components/Shared/Button.razor.rz.scp.css */
/* Base Button Styles - Modern, glassmorphic design */
.btn[b-ljfhmxej3k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-xs);
    padding: 0.625rem 1.25rem;
    border-radius: 50px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    border: none;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.01em;
    line-height: 1.5;
}

/* Shine effect on hover */
.btn[b-ljfhmxej3k]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,0.2), rgba(255,255,255,0));
    opacity: 0;
    transition: opacity 0.3s;
}

.btn:hover:not(:disabled)[b-ljfhmxej3k]::before {
    opacity: 1;
}

.btn:active:not(:disabled)[b-ljfhmxej3k] {
    transform: scale(0.98);
}

/* Icon spacing */
.btn i[b-ljfhmxej3k] {
    font-size: 1em;
}

/* ========== COLOR VARIANTS ========== */

/* Primary - blue gradient */
.btn-primary[b-ljfhmxej3k] {
    background: linear-gradient(135deg, var(--wilson-blue), var(--wilson-blue));
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(0, 102, 204, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-primary:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(0, 102, 204, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Secondary - Outlined with backdrop blur */
.btn-secondary[b-ljfhmxej3k] {
    background: var(--color-surface);
    color: var(--wilson-blue);
    border: 1.5px solid rgba(0, 102, 204, 0.3);
    backdrop-filter: blur(10px);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.btn-secondary:hover:not(:disabled)[b-ljfhmxej3k] {
    background: rgba(0, 102, 204, 0.05);
    border-color: var(--wilson-blue);
    transform: translateY(-1px);
    box-shadow:
        0 4px 12px rgba(0, 102, 204, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

/* Success - Green */
.btn-success[b-ljfhmxej3k] {
    background: linear-gradient(135deg, #10b981, #34d399);
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(16, 185, 129, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-success:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(16, 185, 129, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Danger - Red */
.btn-danger[b-ljfhmxej3k] {
    background: linear-gradient(135deg, #ef4444, #f87171);
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(239, 68, 68, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-danger:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(239, 68, 68, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Warning - Gold/Orange */
.btn-warning[b-ljfhmxej3k] {
    background: linear-gradient(135deg, var(--color-gold), #fbbf24);
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(245, 158, 11, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-warning:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(245, 158, 11, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Info - Light Blue */
.btn-info[b-ljfhmxej3k] {
    background: linear-gradient(135deg, #3b82f6, #60a5fa);
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(59, 130, 246, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-info:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(59, 130, 246, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Light - Light gray background */
.btn-light[b-ljfhmxej3k] {
    background: var(--color-gray-lightest);
    color: var(--color-gray-dark);
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.btn-light:hover:not(:disabled)[b-ljfhmxej3k] {
    background: var(--color-surface);
    border-color: rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

/* Dark - Navy gradient */
.btn-dark[b-ljfhmxej3k] {
    background: linear-gradient(135deg, var(--cedar-green), #1e293b);
    color: #ffffff;
    box-shadow:
        0 2px 12px rgba(14, 39, 80, 0.25),
        0 1px 3px rgba(0, 0, 0, 0.1);
}

.btn-dark:hover:not(:disabled)[b-ljfhmxej3k] {
    transform: translateY(-1px);
    box-shadow:
        0 4px 20px rgba(14, 39, 80, 0.35),
        0 2px 6px rgba(0, 0, 0, 0.15);
}

/* ========== SIZE VARIANTS ========== */

.btn-small[b-ljfhmxej3k] {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    border-radius: 40px;
}

.btn-medium[b-ljfhmxej3k] {
    padding: 0.625rem 1.25rem;
    font-size: var(--font-size-sm);
    border-radius: 50px;
}

.btn-large[b-ljfhmxej3k] {
    padding: 0.875rem 1.75rem;
    font-size: 1rem;
    border-radius: 60px;
}

/* ========== STATE MODIFIERS ========== */

.btn:disabled[b-ljfhmxej3k] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none !important;
}

.btn-full-width[b-ljfhmxej3k] {
    width: 100%;
}

/* ========== DARK MODE ========== */

[data-theme="dark"] .btn-primary[b-ljfhmxej3k] {
    background: linear-gradient(135deg, #3b82f6, #60a5fa);
    box-shadow:
        0 2px 12px rgba(59, 130, 246, 0.3),
        0 1px 3px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .btn-primary:hover:not(:disabled)[b-ljfhmxej3k] {
    box-shadow:
        0 4px 20px rgba(59, 130, 246, 0.45),
        0 2px 6px rgba(0, 0, 0, 0.25);
}

[data-theme="dark"] .btn-secondary[b-ljfhmxej3k] {
    background: rgba(30, 41, 59, 0.6);
    border-color: rgba(96, 165, 250, 0.4);
    color: #60a5fa;
    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(96, 165, 250, 0.1);
}

[data-theme="dark"] .btn-secondary:hover:not(:disabled)[b-ljfhmxej3k] {
    background: rgba(59, 130, 246, 0.15);
    border-color: #60a5fa;
    box-shadow:
        0 4px 12px rgba(59, 130, 246, 0.25),
        inset 0 1px 0 rgba(96, 165, 250, 0.2);
}

[data-theme="dark"] .btn-light[b-ljfhmxej3k] {
    background: rgba(51, 65, 85, 0.8);
    color: #e2e8f0;
    border-color: rgba(148, 163, 184, 0.3);
}

[data-theme="dark"] .btn-light:hover:not(:disabled)[b-ljfhmxej3k] {
    background: rgba(71, 85, 105, 0.9);
    border-color: rgba(148, 163, 184, 0.5);
}

/* ========== RESPONSIVE ========== */

@media (max-width: 768px) {
    .btn[b-ljfhmxej3k] {
        padding: 0.625rem 1.125rem;
        font-size: 0.875rem;
    }

    .btn-small[b-ljfhmxej3k] {
        padding: 0.5rem 0.875rem;
        font-size: 0.75rem;
    }

    .btn-large[b-ljfhmxej3k] {
        padding: 0.75rem 1.5rem;
        font-size: 0.9375rem;
    }
}
/* /Components/Shared/CalendarView.razor.rz.scp.css */
/* ============================================
   Calendar View - Editorial Design
   Flat, Integrated, No Cards
   ============================================ */

/* Calendar Container */
.calendar-container[b-5arpucm9yz] {
    width: 100%;
    background: transparent;
    touch-action: pan-y;
    padding-bottom: 4rem;
}

/* Calendar Header */
.calendar-header[b-5arpucm9yz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    gap: 1rem;
}

.calendar-month[b-5arpucm9yz] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: #000000;
    margin: 0;
    flex: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0;
}

.btn-nav[b-5arpucm9yz] {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    width: auto;
    height: auto;
    padding: 0.75rem 1rem;
    cursor: pointer;
    color: #6b7280;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-nav:hover[b-5arpucm9yz] {
    color: var(--cedar-green);
    border-bottom-color: var(--cedar-green);
}

.btn-today[b-5arpucm9yz] {
    background: transparent;
    color: #6b7280;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.75rem 1.5rem;
    cursor: pointer;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-today:hover[b-5arpucm9yz] {
    color: var(--cedar-green);
    border-bottom-color: var(--cedar-green);
}

/* Calendar Grid */
.calendar-grid[b-5arpucm9yz] {
    display: grid;
    /* minmax(0, 1fr) — not the default 1fr (== minmax(auto, 1fr)) — so a nowrap
       event pill can't force its column past an equal 1/7 share and overrun the
       page. Content clips inside the cell instead. */
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.calendar-day-header[b-5arpucm9yz] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.75rem;
    color: #000000;
    text-align: center;
    padding: 1rem 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    background: rgba(0, 0, 0, 0.02);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

/* Calendar Day Cells */
.calendar-day[b-5arpucm9yz] {
    min-height: 120px;
    min-width: 0; /* allow the grid cell to shrink so nowrap pills clip, not overrun */
    background: #ffffff;
    padding: 0.75rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
}

.calendar-day:nth-child(7n)[b-5arpucm9yz] {
    border-right: none;
}

.calendar-day:hover[b-5arpucm9yz] {
    background: rgba(var(--cedar-green-rgb), 0.03);
}

.calendar-day.other-month[b-5arpucm9yz] {
    background: #fafafa;
}

.calendar-day.other-month .day-number[b-5arpucm9yz] {
    color: #9ca3af;
}

.calendar-day.today[b-5arpucm9yz] {
    background: rgba(var(--cedar-green-rgb), 0.05);
}

.calendar-day.has-events[b-5arpucm9yz] {
    background: #ffffff;
}

.day-number[b-5arpucm9yz] {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 0.875rem;
    color: #000000;
    margin-bottom: 0.5rem;
}

.calendar-day.today .day-number[b-5arpucm9yz] {
    background: var(--cedar-green);
    color: white;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
}

.calendar-day.other-month .day-number[b-5arpucm9yz] {
    color: #d1d5db;
}

/* Day Events */
.day-events[b-5arpucm9yz] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    /* A flex item's min-width is auto: without this the cell grows to its longest event
       title instead of clipping it, and a seven-column month widens past its scroller. */
    min-width: 0;
    overflow: hidden;
}

.event-pill[b-5arpucm9yz] {
    background: var(--cedar-green);
    color: white;
    padding: 4px 8px;
    font-size: 0.6875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    gap: 4px;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
    border-left: 3px solid rgba(0, 0, 0, 0.2);
}

.event-pill:hover[b-5arpucm9yz] {
    transform: translateX(2px);
}

/* Full opacity (#8192): the old 0.9 faded the time toward the pill color and dropped it
   below 4.5:1 on the lighter organization colors (Memphis read 4.48:1). The smaller size
   alone sets it apart from the title. */
.event-time[b-5arpucm9yz] {
    font-size: 0.625rem;
}

.event-title[b-5arpucm9yz] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Event Type Colors */
.event-weekly[b-5arpucm9yz] {
    background: var(--cedar-green);
    border-left-color: var(--cedar-green-dark);
}

.event-tournament[b-5arpucm9yz] {
    background: var(--wheat-gold);
    border-left-color: #a88b2a;
    color: #000000;
}

.event-blitz[b-5arpucm9yz] {
    background: #dc2626;
    border-left-color: #991b1b;
}

.event-class[b-5arpucm9yz] {
    background: var(--wilson-blue);
    border-left-color: #3a5a8a;
}

.event-lecture[b-5arpucm9yz] {
    background: #7c3aed;
    border-left-color: #5b21b6;
}

.event-simul[b-5arpucm9yz] {
    background: #db2777;
    border-left-color: #9d174d;
}

.event-social[b-5arpucm9yz] {
    background: #f59e0b;
    border-left-color: #b45309;
    color: #000000;
}

.event-other[b-5arpucm9yz] {
    background: #6b7280;
    border-left-color: #4b5563;
}

/* Organization colors — override the event-type color for events another organization
   hosts, so a visiting club's event is never mistaken for the host club's own. The host
   club keeps its event-type colors (no org class emitted). Every background carries white
   small text at 4.5:1 or better, with and without the .event-org chip (#8192). */
.event-pill.org-ncc[b-5arpucm9yz] { background: #4f46e5; border-left-color: #3730a3; color: #ffffff; }
.event-pill.org-mcc[b-5arpucm9yz] { background: #0f766e; border-left-color: #134e4a; color: #ffffff; }
.event-pill.org-memphis[b-5arpucm9yz] { background: #c2410c; border-left-color: #7c2d12; color: #ffffff; }
.event-pill.org-muletown[b-5arpucm9yz] { background: #0e7490; border-left-color: #164e63; color: #ffffff; }
.event-pill.org-mcm[b-5arpucm9yz] { background: #7c3aed; border-left-color: #5b21b6; color: #ffffff; }
.event-pill.org-cumberland[b-5arpucm9yz] { background: #92400e; border-left-color: #78350f; color: #ffffff; }
.event-pill.org-other[b-5arpucm9yz] { background: #475569; border-left-color: #334155; color: #ffffff; }

/* Short org tag on the pill (e.g. "NCC") for events another organization hosts. */
.event-org[b-5arpucm9yz] {
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    padding: 0 3px;
    border-radius: 2px;
    /* A DARKENING chip (#8192): the old white 25% wash lifted every organization color
       toward white and dropped the tag text to 2.4-3.8:1. Black 20% only raises the
       contrast of the white text over any pill color. */
    background: rgba(0, 0, 0, 0.2);
    flex-shrink: 0;
}

.event-more[b-5arpucm9yz] {
    color: var(--cedar-green);
    font-family: var(--font-display);
    font-size: 0.625rem;
    font-weight: 700;
    cursor: pointer;
    padding: 2px 4px;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.event-more:hover[b-5arpucm9yz] {
    color: var(--cedar-green-dark);
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .calendar-header[b-5arpucm9yz] {
        margin-bottom: 2rem;
        padding-bottom: 1.5rem;
        gap: 0.5rem;
    }

    .calendar-month[b-5arpucm9yz] {
        font-size: 1.125rem;
    }

    .btn-nav[b-5arpucm9yz] {
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
    }

    .btn-today[b-5arpucm9yz] {
        padding: 0.5rem 1rem;
        font-size: 0.75rem;
    }

    /* Below 768px a seven-column month cannot shrink and stay readable, so it keeps a
       600px floor and the <ScrollRegion> around it does the scrolling. The region is what
       makes this legal: the min-width lives INSIDE a box that scrolls, never inside a
       parent that only grows. Paired with CssResponsivenessTests. */
    .calendar-grid[b-5arpucm9yz] {
        min-width: 600px;
    }

    .calendar-day-header[b-5arpucm9yz] {
        font-size: 0.625rem;
        padding: 0.75rem 0.25rem;
    }

    .calendar-day[b-5arpucm9yz] {
        min-height: 80px;
        padding: 0.5rem;
    }

    .day-number[b-5arpucm9yz] {
        font-size: 0.75rem;
    }

    .calendar-day.today .day-number[b-5arpucm9yz] {
        width: 24px;
        height: 24px;
        font-size: 0.65rem;
    }

    .event-pill[b-5arpucm9yz] {
        padding: 3px 6px;
        font-size: 0.6rem;
    }

    .event-time[b-5arpucm9yz] {
        display: none;
    }
}

@media (max-width: 480px) {
    .calendar-header[b-5arpucm9yz] {
        flex-wrap: wrap;
        justify-content: center;
    }

    .calendar-month[b-5arpucm9yz] {
        width: 100%;
        margin-bottom: 0.5rem;
        font-size: 1rem;
    }

    .btn-nav[b-5arpucm9yz] {
        padding: 0.5rem;
    }

    .btn-today[b-5arpucm9yz] {
        padding: 0.5rem 0.75rem;
    }

    .calendar-day[b-5arpucm9yz] {
        min-height: 60px;
        padding: 0.25rem;
    }

    .day-number[b-5arpucm9yz] {
        font-size: 0.65rem;
        margin-bottom: 0.25rem;
    }

    .calendar-day.today .day-number[b-5arpucm9yz] {
        width: 20px;
        height: 20px;
        font-size: 0.6rem;
    }

    .day-events[b-5arpucm9yz] {
        gap: 2px;
    }

    .event-pill[b-5arpucm9yz] {
        padding: 2px 4px;
        font-size: 0.55rem;
        border-left-width: 2px;
    }

    .event-more[b-5arpucm9yz] {
        font-size: 0.55rem;
    }
}

/* The sister club and the parent organization. */
.event-pill.org-sister[b-5arpucm9yz] { background: #0369a1; border-left-color: #0c4a6e; color: #ffffff; }
.event-pill.org-parent[b-5arpucm9yz] { background: #1c2b59; border-left-color: #121d3d; color: #ffffff; }
/* /Components/Shared/ChessTitleBadge.razor.rz.scp.css */
.chess-title-badge[b-14cxy1hy66] {
    display: inline-block;
    background-color: var(--wheat-gold, #D4AF37);
    color: #000000;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    line-height: 1.2;
    vertical-align: middle;
    margin-right: 0.35rem;
    letter-spacing: 0.02em;
    cursor: default;
    white-space: nowrap;
}
/* /Components/Shared/ClubSocialBlock.razor.rz.scp.css */
/* The club's social row, which lives with the component that renders it (#7588).
   These rules were in MainLayout.razor.css under ::deep, so a visitor on the photo skin -
   where PhotoLayout renders the same block - got the markup with no rule at all: an
   unspaced column of 32px logos instead of a row of buttons. A component's own stylesheet
   reaches its own markup under EVERY layout, which is what a ::deep from one layout cannot.
   Both footers stand on a dark ground, so the white steps below read on either skin. */

.social-links[b-1nsj6gre1x] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
    margin-top: var(--spacing-lg);
}

.social-link[b-1nsj6gre1x] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 0;
    border: 2px solid rgba(255, 255, 255, 0.2);
    transition: all var(--transition-slow, 0.3s cubic-bezier(0.4, 0, 0.2, 1));
    font-size: var(--font-size-2xl);
    color: rgba(255, 255, 255, 0.7);
}

.social-logo[b-1nsj6gre1x] {
    width: 32px;
    height: 32px;
    object-fit: contain;
    transition: all var(--transition-slow, 0.3s cubic-bezier(0.4, 0, 0.2, 1));
}

.social-link:hover[b-1nsj6gre1x] {
    border-color: var(--cedar-green);
    transform: translateY(-2px);
}

/* A platform's own logo carries its identity, so the frame comes off and the artwork stands
   on the footer's ground on its own. */
.social-link.instagram[b-1nsj6gre1x],
.social-link.facebook[b-1nsj6gre1x],
.social-link.threads[b-1nsj6gre1x],
.social-link.twitter[b-1nsj6gre1x],
.social-link.linkedin[b-1nsj6gre1x],
.social-link.youtube[b-1nsj6gre1x],
.social-link.chesscom[b-1nsj6gre1x],
.social-link.lichess[b-1nsj6gre1x] {
    background: transparent;
    border: none;
}

.social-link.instagram:hover[b-1nsj6gre1x],
.social-link.facebook:hover[b-1nsj6gre1x],
.social-link.threads:hover[b-1nsj6gre1x],
.social-link.twitter:hover[b-1nsj6gre1x],
.social-link.linkedin:hover[b-1nsj6gre1x],
.social-link.youtube:hover[b-1nsj6gre1x],
.social-link.chesscom:hover[b-1nsj6gre1x],
.social-link.lichess:hover[b-1nsj6gre1x] {
    border: none;
    transform: translateY(-2px);
}

.social-link.instagram:hover .social-logo[b-1nsj6gre1x],
.social-link.facebook:hover .social-logo[b-1nsj6gre1x],
.social-link.threads:hover .social-logo[b-1nsj6gre1x],
.social-link.twitter:hover .social-logo[b-1nsj6gre1x],
.social-link.linkedin:hover .social-logo[b-1nsj6gre1x],
.social-link.youtube:hover .social-logo[b-1nsj6gre1x],
.social-link.chesscom:hover .social-logo[b-1nsj6gre1x],
.social-link.lichess:hover .social-logo[b-1nsj6gre1x] {
    opacity: 0.8;
}
/* /Components/Shared/ClubWordmark.razor.rz.scp.css */
.club-wordmark[b-9ujlbw2kxs] {
    text-transform: uppercase;
}
/* /Components/Shared/ComingSoonBanner.razor.rz.scp.css */
.coming-soon-banner[b-iuzmmn2iar] {
    background: var(--cedar-green);
    padding: 3rem 2rem;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    position: relative;
    overflow: hidden;
}

.coming-soon-banner[b-iuzmmn2iar]::before {
    display: none;
}

.banner-content[b-iuzmmn2iar] {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 3rem;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
    z-index: 1;
}

.banner-icon[b-iuzmmn2iar] {
    display: none;
}

.banner-text[b-iuzmmn2iar] {
    flex: 1;
    min-width: 320px;
    color: white;
}

.banner-title[b-iuzmmn2iar] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: -0.01em;
}

.banner-message[b-iuzmmn2iar] {
    font-size: 1rem;
    margin: 0;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 400;
}

.banner-countdown[b-iuzmmn2iar] {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(0, 0, 0, 0.2);
    padding: 2rem 3rem;
    border-radius: 0;
    backdrop-filter: none;
    border: 2px solid rgba(255, 255, 255, 0.2);
    position: relative;
}

.banner-countdown[b-iuzmmn2iar]::before {
    display: none;
}

.countdown-label[b-iuzmmn2iar] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.6);
    margin-bottom: 1rem;
    font-weight: 600;
}

.countdown-number[b-iuzmmn2iar] {
    font-family: var(--font-display);
    font-size: 3.5rem;
    font-weight: 700;
    color: #ffffff;
    line-height: 1;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .coming-soon-banner[b-iuzmmn2iar] {
        padding: 2rem 1.25rem;
        margin: 1.5rem 0;
    }

    .banner-content[b-iuzmmn2iar] {
        flex-direction: column;
        gap: 2rem;
        text-align: center;
    }

    .banner-icon[b-iuzmmn2iar] {
        font-size: 3rem;
    }

    .banner-title[b-iuzmmn2iar] {
        font-size: 1.75rem;
    }

    .banner-message[b-iuzmmn2iar] {
        font-size: 1rem;
    }

    .countdown-number[b-iuzmmn2iar] {
        font-size: 3.5rem;
    }

    .banner-countdown[b-iuzmmn2iar] {
        width: 100%;
        max-width: 240px;
        padding: 1.75rem 2rem;
    }
}

@media (max-width: 480px) {
    .coming-soon-banner[b-iuzmmn2iar] {
        padding: 1.5rem 1rem;
    }

    .banner-title[b-iuzmmn2iar] {
        font-size: 1.5rem;
    }

    .banner-message[b-iuzmmn2iar] {
        font-size: 0.9375rem;
    }

    .countdown-number[b-iuzmmn2iar] {
        font-size: 3rem;
    }

    .banner-countdown[b-iuzmmn2iar] {
        padding: 1.5rem 1.75rem;
    }
}
/* /Components/Shared/ComingSoonPillBanner.razor.rz.scp.css */
/* ============================================
   Coming Soon Half Pill Banner
   Minimal Design with Cedar Green
   ============================================ */

.coming-soon-pill-banner[b-oud9gcjedp] {
    position: absolute;
    top: 2rem;
    left: 0;
    z-index: 10;
    animation: slideInFromLeft-b-oud9gcjedp 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideInFromLeft-b-oud9gcjedp {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

.pill-content[b-oud9gcjedp] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 2.5rem 1rem 1.5rem;
    background: var(--cedar-green);
    color: #ffffff;
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-top-right-radius: 999px;
    border-bottom-right-radius: 999px;
    box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.15);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.coming-soon-pill-banner:hover .pill-content[b-oud9gcjedp] {
    transform: translateX(1rem);
    box-shadow: 6px 6px 20px rgba(0, 0, 0, 0.2);
}

.pill-icon[b-oud9gcjedp] {
    font-size: 1.25rem;
    line-height: 1;
    animation: bounce-b-oud9gcjedp 2s ease-in-out infinite;
}

@keyframes bounce-b-oud9gcjedp {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
}

.pill-text[b-oud9gcjedp] {
    white-space: nowrap;
    line-height: 1;
}

/* Mobile Responsive */
@media (max-width: 968px) {
    .coming-soon-pill-banner[b-oud9gcjedp] {
        top: 1.5rem;
        left: 0;
    }

    .pill-content[b-oud9gcjedp] {
        font-size: 0.6875rem;
        padding: 0.75rem 2rem 0.75rem 1rem;
        gap: 0.5rem;
    }

    .pill-icon[b-oud9gcjedp] {
        font-size: 1rem;
    }
}

@media (max-width: 640px) {
    .pill-content[b-oud9gcjedp] {
        font-size: 0.625rem;
        padding: 0.625rem 1.5rem 0.625rem 0.875rem;
    }

    .pill-text[b-oud9gcjedp] {
        letter-spacing: 0.08em;
    }
}
/* /Components/Shared/ContentCard.razor.rz.scp.css */
/* ============================================
   ContentCard - the ONE card (#7561)
   ============================================
   The editorial skin keeps the site's square, hairline-bordered card. The photo
   skin rounds and raises it from wwwroot/skins/photo/skin.css. Nothing here
   sets a width or a min-width, so a card always fits its column.
   ============================================ */

.content-card[b-82c08xbymk] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    max-width: 100%;
    padding: 1.75rem;
    background: var(--color-surface, #ffffff);
    border: 1px solid var(--color-border, #e5e7eb);
    color: inherit;
    text-decoration: none;
    transition: border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);
}

.content-card-flush[b-82c08xbymk] {
    padding: 0;
}

.content-card-link:hover[b-82c08xbymk],
.content-card-link:focus-visible[b-82c08xbymk] {
    border-color: var(--accent-rule);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.content-card-header[b-82c08xbymk] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    min-width: 0;
}

.content-card-icon[b-82c08xbymk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    flex: 0 0 auto;
    background: var(--color-background, #f5f5f0);
    color: var(--color-dark);
    font-size: 1.125rem;
}

.content-card-heading[b-82c08xbymk] {
    flex: 1 1 auto;
    min-width: 0;
}

.content-card-title[b-82c08xbymk] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 0;
    overflow-wrap: break-word;
}

.content-card-subtitle[b-82c08xbymk] {
    margin: 0.35rem 0 0 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.content-card-meta[b-82c08xbymk] {
    flex: 0 0 auto;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
}

.content-card-body[b-82c08xbymk] {
    min-width: 0;
    line-height: 1.7;
    color: var(--color-text-secondary);
}

.content-card-body[b-82c08xbymk]  p:last-child {
    margin-bottom: 0;
}

.content-card-body[b-82c08xbymk]  img {
    max-width: 100%;
    height: auto;
}

.content-card-footer[b-82c08xbymk] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-top: auto;
    padding-top: 0.5rem;
    min-width: 0;
}

.content-card-arrow[b-82c08xbymk] {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    color: var(--accent-text);
    opacity: 0;
    transition: opacity var(--transition-base), transform var(--transition-base);
}

.content-card-link:hover .content-card-arrow[b-82c08xbymk],
.content-card-link:focus-visible .content-card-arrow[b-82c08xbymk] {
    opacity: 1;
    transform: translateX(3px);
}

@media (max-width: 768px) {
    .content-card[b-82c08xbymk] {
        padding: 1.25rem;
    }

    .content-card-arrow[b-82c08xbymk] {
        opacity: 1;
        top: 1.1rem;
        right: 1.1rem;
    }
}
/* /Components/Shared/EmptyState.razor.rz.scp.css */
/* ============================================
   EmptyState - the ONE "nothing here yet" (#7567)
   ============================================
   Tokens only: a club's palette reaches this through var(), so the photo skin and
   the editorial skin get the same layout in their own colours. Nothing here sets a
   width, so an empty state always fits the column it is dropped into.
   ============================================ */

.empty-state[b-7pl2r75hx2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-width: 0;
    max-width: 100%;
    padding: 3rem 1.5rem;
    text-align: center;
    background: var(--color-surface, #ffffff);
    border: 1px dashed var(--color-border, #e5e7eb);
}

.empty-state-icon[b-7pl2r75hx2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    flex: 0 0 auto;
    background: var(--color-background, #f9fafb);
    color: var(--accent-text);
    font-size: 1.5rem;
}

.empty-state-title[b-7pl2r75hx2] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 0;
    overflow-wrap: break-word;
}

.empty-state-message[b-7pl2r75hx2] {
    margin: 0;
    max-width: 44ch;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--color-text-secondary);
    overflow-wrap: break-word;
}

/* A sentence carried by Description is authored in the PAGE, so its link lands outside this
   component's scope: ::deep is what reaches it. The colour is the club's primary token, which
   is what the page stylesheets painted before #7570 folded them into this component. */
.empty-state-message[b-7pl2r75hx2]  a {
    color: var(--cedar-green);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.empty-state-message[b-7pl2r75hx2]  a:hover {
    color: var(--cedar-green-dark);
}

.empty-state-action[b-7pl2r75hx2] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.5rem;
    min-width: 0;
}

@media (max-width: 768px) {
    .empty-state[b-7pl2r75hx2] {
        padding: 2rem 1rem;
    }
}
/* /Components/Shared/ErrorMessage.razor.rz.scp.css */
.error-message[b-3sj93sqj29] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.5rem;
    padding: 1rem;
    display: flex;
    gap: 1rem;
    margin: 1rem 0;
}

.error-icon[b-3sj93sqj29] {
    font-size: 1.5rem;
    flex-shrink: 0;
}

.error-content[b-3sj93sqj29] {
    flex: 1;
}

.error-title[b-3sj93sqj29] {
    font-weight: 600;
    color: #991b1b;
    margin: 0 0 0.25rem 0;
}

.error-text[b-3sj93sqj29] {
    color: #7f1d1d;
    margin: 0;
    font-size: 0.875rem;
}
/* /Components/Shared/EventCard.razor.rz.scp.css */
/* ============================================
   Event Item - Minimal List Style
   ============================================ */

.event-card[b-0du5mxo4jz] {
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding: 3rem 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.event-card:hover[b-0du5mxo4jz] {
    border-bottom-color: rgba(0, 0, 0, 0.2);
}

.event-header[b-0du5mxo4jz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    gap: 2rem;
}

.event-badges[b-0du5mxo4jz] {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.event-type[b-0du5mxo4jz] {
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.4);
    padding: 0;
    background: transparent;
}

.event-type.tournament[b-0du5mxo4jz],
.event-type.weeklyclub[b-0du5mxo4jz],
.event-type.monthlyblitz[b-0du5mxo4jz] {
    color: rgba(0, 0, 0, 0.4);
    background: transparent;
}

.time-control-badge[b-0du5mxo4jz] {
    font-size: 0.6875rem;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.3);
}

/* Organization badge — colors match the calendar pills so another organization's
   event reads consistently across the calendar and the list. Every background carries
   white small text at 4.5:1 or better (#8192, pinned by OrganizationTagContrastTests). */
.org-badge[b-0du5mxo4jz] {
    font-family: var(--font-display);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffffff;
    padding: 2px 8px;
    border-radius: 3px;
    white-space: nowrap;
}
.org-badge.org-ncc[b-0du5mxo4jz] { background: #4f46e5; }
.org-badge.org-mcc[b-0du5mxo4jz] { background: #0f766e; }
.org-badge.org-memphis[b-0du5mxo4jz] { background: #c2410c; }
.org-badge.org-muletown[b-0du5mxo4jz] { background: #0e7490; }
.org-badge.org-mcm[b-0du5mxo4jz] { background: #7c3aed; }
.org-badge.org-cumberland[b-0du5mxo4jz] { background: #92400e; }
.org-badge.org-other[b-0du5mxo4jz] { background: #475569; }

.event-fee[b-0du5mxo4jz] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    color: #000000;
    white-space: nowrap;
}

.event-fee.free[b-0du5mxo4jz] {
    color: rgba(0, 0, 0, 0.5);
}

.event-title[b-0du5mxo4jz] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--cedar-green);
    margin: 0 0 1.5rem 0;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: -0.01em;
}

.event-details[b-0du5mxo4jz] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.event-detail[b-0du5mxo4jz] {
    display: flex;
    align-items: center;
    gap: 1rem;
    font-size: 0.875rem;
    color: #6b7280;
}

/* Another club's weekly night (#8155): the host club's name, in the detail color, set apart by weight. */
.event-host[b-0du5mxo4jz] {
    font-weight: 600;
}

.detail-icon[b-0du5mxo4jz] {
    display: none;
}

.event-description[b-0du5mxo4jz] {
    color: #6b7280;
    font-size: 0.9375rem;
    line-height: 1.8;
    margin-bottom: 2rem;
}

.event-actions[b-0du5mxo4jz] {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.btn[b-0du5mxo4jz] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.875rem 2rem;
    border: 2px solid;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-block;
}

.btn-primary[b-0du5mxo4jz] {
    background: var(--cedar-green);
    color: #ffffff;
    border-color: var(--cedar-green);
}

.btn-primary:hover[b-0du5mxo4jz] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

.btn-secondary[b-0du5mxo4jz] {
    background: transparent;
    color: var(--cedar-green);
    border-color: var(--cedar-green);
}

.btn-secondary:hover[b-0du5mxo4jz] {
    background: var(--cedar-green);
    color: #ffffff;
}

/* Responsive */
@media (max-width: 768px) {
    .event-card[b-0du5mxo4jz] {
        padding: 2rem 0;
    }

    .event-header[b-0du5mxo4jz] {
        flex-direction: column;
        gap: 1rem;
    }

    .event-title[b-0du5mxo4jz] {
        font-size: 1.25rem;
    }

    .event-actions[b-0du5mxo4jz] {
        flex-direction: column;
        align-items: stretch;
    }

    .btn[b-0du5mxo4jz] {
        text-align: center;
    }
}

/* The sister club and the parent organization. */
.org-badge.org-sister[b-0du5mxo4jz] { background: #0369a1; }
.org-badge.org-parent[b-0du5mxo4jz] { background: #1c2b59; }
/* /Components/Shared/EventDetailModal.razor.rz.scp.css */
/* Modal Overlay */
.modal-overlay[b-3t5c86k68e] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
    padding: var(--spacing-lg, 1.5rem);
    animation: fadeIn-b-3t5c86k68e 0.2s ease;
}

@keyframes fadeIn-b-3t5c86k68e {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal Content */
.modal-content[b-3t5c86k68e] {
    background: white;
    border-radius: 16px;
    max-width: 700px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp-b-3t5c86k68e 0.3s ease;
}

@keyframes slideUp-b-3t5c86k68e {
    from {
        transform: translateY(50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Modal Header */
.modal-header[b-3t5c86k68e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--spacing-xl, 2rem);
    border-bottom: 2px solid #f3f4f6;
    background: linear-gradient(135deg, rgba(var(--wilson-blue-rgb), 0.05), rgba(var(--wilson-blue-rgb), 0.05));
}

.modal-title[b-3t5c86k68e] {
    font-size: var(--font-size-2xl, 1.875rem);
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin: 0;
    flex: 1;
    padding-right: var(--spacing-lg, 1.5rem);
}

.modal-close[b-3t5c86k68e] {
    background: rgba(0, 0, 0, 0.05);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    color: var(--color-gray-dark, #374151);
    font-size: var(--font-size-xl, 1.5rem);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.modal-close:hover[b-3t5c86k68e] {
    background: #dc2626;
    color: white;
    transform: rotate(90deg);
}

/* Modal Body */
.modal-body[b-3t5c86k68e] {
    padding: var(--spacing-xl, 2rem);
}

.event-detail-grid[b-3t5c86k68e] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--spacing-lg, 1.5rem);
    margin-bottom: var(--spacing-xl, 2rem);
}

.detail-item[b-3t5c86k68e] {
    display: flex;
    gap: var(--spacing-md, 1rem);
    align-items: flex-start;
}

.detail-icon[b-3t5c86k68e] {
    width: 40px;
    height: 40px;
    background: linear-gradient(135deg, rgba(var(--wilson-blue-rgb), 0.1), rgba(var(--wilson-blue-rgb), 0.1));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--wilson-blue, #4A6FA5);
    font-size: var(--font-size-lg, 1.125rem);
    flex-shrink: 0;
}

.detail-content[b-3t5c86k68e] {
    flex: 1;
}

.detail-label[b-3t5c86k68e] {
    font-size: var(--font-size-xs, 0.75rem);
    font-weight: 700;
    color: var(--color-gray, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
}

.detail-value[b-3t5c86k68e] {
    font-size: var(--font-size-base, 1rem);
    font-weight: 600;
    color: var(--cedar-green, #2D5016);
}

.detail-value.free[b-3t5c86k68e] {
    color: var(--color-green, #70a130);
    font-weight: 700;
}

/* Event Type Badge */
.event-type-badge[b-3t5c86k68e] {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: var(--font-size-sm, 0.875rem);
    font-weight: 700;
    color: white;
}

.type-weekly[b-3t5c86k68e] {
    background: linear-gradient(135deg, var(--wilson-blue), var(--wilson-blue));
}

.type-tournament[b-3t5c86k68e] {
    background: linear-gradient(135deg, #be8c0e, #d4a520);
}

.type-blitz[b-3t5c86k68e] {
    background: linear-gradient(135deg, #dc2626, #ef4444);
}

.type-class[b-3t5c86k68e] {
    background: linear-gradient(135deg, #70a130, #84b745);
}

.type-lecture[b-3t5c86k68e] {
    background: linear-gradient(135deg, #91268f, #a742a5);
}

.type-simul[b-3t5c86k68e] {
    background: linear-gradient(135deg, #d0146f, #e62e8a);
}

.type-social[b-3t5c86k68e] {
    background: linear-gradient(135deg, #f59e0b, #fbbf24);
}

.type-other[b-3t5c86k68e] {
    background: linear-gradient(135deg, #6b7280, #9ca3af);
}

/* Description and Notes */
.event-description[b-3t5c86k68e],
.event-notes[b-3t5c86k68e] {
    margin-bottom: var(--spacing-lg, 1.5rem);
}

.event-description h3[b-3t5c86k68e],
.event-notes h3[b-3t5c86k68e] {
    font-size: var(--font-size-lg, 1.125rem);
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin-bottom: var(--spacing-sm, 0.5rem);
}

.event-description p[b-3t5c86k68e],
.event-notes p[b-3t5c86k68e] {
    font-size: var(--font-size-base, 1rem);
    color: var(--color-gray-dark, #374151);
    line-height: 1.6;
    margin: 0;
    white-space: pre-wrap;
}

/* Modal Footer */
.modal-footer[b-3t5c86k68e] {
    padding: var(--spacing-xl, 2rem);
    border-top: 2px solid #f3f4f6;
    display: flex;
    gap: var(--spacing-md, 1rem);
    justify-content: flex-end;
}

.btn-register[b-3t5c86k68e] {
    background: var(--wilson-blue, #4A6FA5);
    color: white;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: var(--font-size-base, 1rem);
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
}

.btn-register:hover[b-3t5c86k68e] {
    background: var(--cedar-green, #2D5016);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(var(--wilson-blue-rgb), 0.4);
}

.btn-close-modal[b-3t5c86k68e] {
    background: #f3f4f6;
    color: var(--color-gray-dark, #374151);
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: var(--font-size-base, 1rem);
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-close-modal:hover[b-3t5c86k68e] {
    background: #e5e7eb;
}

/* Responsive */
@media (max-width: 768px) {
    .modal-overlay[b-3t5c86k68e] {
        padding: 0;
    }

    .modal-content[b-3t5c86k68e] {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
    }

    .modal-header[b-3t5c86k68e] {
        padding: var(--spacing-lg, 1.5rem);
    }

    .modal-title[b-3t5c86k68e] {
        font-size: var(--font-size-xl, 1.5rem);
    }

    .modal-body[b-3t5c86k68e] {
        padding: var(--spacing-lg, 1.5rem);
    }

    .event-detail-grid[b-3t5c86k68e] {
        grid-template-columns: 1fr;
        gap: var(--spacing-md, 1rem);
    }

    .modal-footer[b-3t5c86k68e] {
        padding: var(--spacing-lg, 1.5rem);
        flex-direction: column-reverse;
    }

    .btn-register[b-3t5c86k68e],
    .btn-close-modal[b-3t5c86k68e] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Shared/EventForm.razor.rz.scp.css */
/* ============================================
   Event Form - Scoped styles
   Uses ::deep to reach into Blazor input components
   (InputText, InputSelect, InputDate, InputNumber, InputTextArea).
   ============================================ */

.form-grid[b-k6wq413cq4] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.form-group[b-k6wq413cq4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group.full-width[b-k6wq413cq4] {
    grid-column: 1 / -1;
}

.form-group.checkbox-group[b-k6wq413cq4] {
    grid-column: 1 / -1;
}

.form-group.checkbox-group label[b-k6wq413cq4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    cursor: pointer;
    color: #111827;
}

.form-group label[b-k6wq413cq4] {
    font-family: var(--font-display);
    font-weight: 600;
    color: #111827;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Required field indicator */
.form-group label[b-k6wq413cq4]::after {
    content: '';
}

/* ============================================
   Unified form control styling
   Uses ::deep so styles reach Blazor-rendered inputs (InputText,
   InputSelect, InputDate, InputNumber, InputTextArea) whose rendered
   elements don't carry this component's scope attribute.
   Native inputs (e.g. <input type="time">) are matched by the same
   type selectors and also by the .form-control rule below.
   ============================================ */

[b-k6wq413cq4] input,
[b-k6wq413cq4] select,
[b-k6wq413cq4] textarea {
    width: 100%;
    padding: 0.75rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-size: 0.9375rem;
    font-family: inherit;
    line-height: 1.4;
    background: #ffffff;
    color: #111827;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

[b-k6wq413cq4] input:focus-visible,
[b-k6wq413cq4] select:focus-visible,
[b-k6wq413cq4] textarea:focus-visible {
    outline: 2px solid var(--cedar-green, #2D5016);
    outline-offset: 2px;
    border-color: var(--cedar-green, #2D5016);
}

[b-k6wq413cq4] input:focus:not(:focus-visible),
[b-k6wq413cq4] select:focus:not(:focus-visible),
[b-k6wq413cq4] textarea:focus:not(:focus-visible) {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

/* Size overrides when the input is scoped to this component (native inputs in markup) */
[b-k6wq413cq4] .form-control {
    width: 100%;
    padding: 0.75rem 0.875rem;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-size: 0.9375rem;
    font-family: inherit;
    line-height: 1.4;
    background: #ffffff;
    color: #111827;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
}

[b-k6wq413cq4] .form-control:focus {
    outline: none;
    border-color: var(--cedar-green, #2D5016);
    box-shadow: 0 0 0 3px rgba(var(--cedar-green-rgb), 0.12);
}

[b-k6wq413cq4] textarea {
    min-height: 6rem;
    resize: vertical;
}

[b-k6wq413cq4] input::placeholder,
[b-k6wq413cq4] textarea::placeholder {
    color: #9ca3af;
}

[b-k6wq413cq4] input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    padding: 0;
    accent-color: var(--cedar-green, #2D5016);
    cursor: pointer;
    border: 1px solid #d1d5db;
}

[b-k6wq413cq4] input:disabled,
[b-k6wq413cq4] select:disabled,
[b-k6wq413cq4] textarea:disabled {
    background: #f3f4f6;
    cursor: not-allowed;
    opacity: 0.6;
}

/* ============================================
   Form actions
   ============================================ */

.form-actions[b-k6wq413cq4] {
    display: flex;
    gap: 1rem;
    padding-top: 1.5rem;
    margin-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.btn-submit[b-k6wq413cq4] {
    padding: 0.875rem 2rem;
    background: var(--cedar-green, #2D5016);
    color: #ffffff;
    border: 2px solid var(--cedar-green, #2D5016);
    border-radius: 2px;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-submit:hover:not(:disabled)[b-k6wq413cq4] {
    background: var(--cedar-green-dark);
    border-color: var(--cedar-green-dark);
}

.btn-submit:disabled[b-k6wq413cq4] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel[b-k6wq413cq4] {
    padding: 0.875rem 2rem;
    background: transparent;
    color: #374151;
    border: 2px solid #d1d5db;
    border-radius: 2px;
    font-family: var(--font-display);
    font-weight: 600;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.btn-cancel:hover[b-k6wq413cq4] {
    border-color: #111827;
    color: #111827;
}

/* ============================================
   Validation
   ============================================ */

[b-k6wq413cq4] .validation-message {
    color: #dc2626;
    font-size: 0.8125rem;
    margin-top: 0.125rem;
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
}

[b-k6wq413cq4] .validation-message::before {
    content: "⚠";
    font-size: 1rem;
    line-height: 1;
    flex-shrink: 0;
}

[b-k6wq413cq4] .invalid {
    border-color: #dc2626;
}

[b-k6wq413cq4] .invalid:focus {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}

/* ============================================
   Section headers / help text
   ============================================ */

.form-section-header[b-k6wq413cq4] {
    grid-column: 1 / -1;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 2px solid var(--cedar-green, #2D5016);
}

.form-section-header h3[b-k6wq413cq4] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--cedar-green, #2D5016);
    margin: 0 0 0.375rem 0;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.help-text[b-k6wq413cq4] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
    line-height: 1.5;
}

.field-help[b-k6wq413cq4] {
    font-size: 0.75rem;
    color: #6b7280;
    font-style: italic;
    margin-top: 0.125rem;
}

/* ============================================
   Time control preview badge
   ============================================ */

.time-control-preview[b-k6wq413cq4] {
    padding: 1rem 1.25rem;
    background: rgba(var(--cedar-green-rgb), 0.06);
    border-left: 4px solid var(--cedar-green, #2D5016);
    font-size: 0.9375rem;
    color: #111827;
}

.time-control-preview strong[b-k6wq413cq4] {
    color: var(--cedar-green, #2D5016);
}

.category-badge[b-k6wq413cq4] {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.25rem 0.75rem;
    background: var(--wheat-gold, #D4AF37);
    color: #111827;
    font-family: var(--font-display);
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .form-grid[b-k6wq413cq4] {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .form-actions[b-k6wq413cq4] {
        flex-direction: column;
    }

    .btn-submit[b-k6wq413cq4],
    .btn-cancel[b-k6wq413cq4] {
        width: 100%;
    }
}

/* ============================================
   Event flyer upload + preview
   ============================================ */

.flyer-preview[b-k6wq413cq4] {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 0.75rem;
    padding: 0.875rem 1rem;
    background: rgba(var(--cedar-green-rgb), 0.04);
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.flyer-thumb[b-k6wq413cq4] {
    max-width: 200px;
    max-height: 200px;
    object-fit: contain;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fff;
}

.flyer-link[b-k6wq413cq4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--cedar-green, #2D5016);
    font-weight: 600;
    text-decoration: none;
    padding: 0.75rem 1rem;
    background: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 2px;
}

.flyer-link i[b-k6wq413cq4] {
    font-size: 1.5rem;
    color: #dc2626;
}

.flyer-remove[b-k6wq413cq4] {
    margin-left: auto;
    padding: 0.5rem 0.875rem;
    background: transparent;
    color: #b91c1c;
    border: 1px solid #d1d5db;
    border-radius: 2px;
    font-family: var(--font-display);
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
}

.flyer-remove:hover[b-k6wq413cq4] {
    background: rgba(220, 38, 38, 0.08);
    border-color: #dc2626;
}

.field-help.error[b-k6wq413cq4] {
    color: #b91c1c;
    font-weight: 500;
}

/* ============================================
   Multi-category time control checkboxes
   ============================================ */

.tc-categories[b-k6wq413cq4] {
    display: flex;
    gap: 1.25rem;
    flex-wrap: wrap;
    padding: 0.875rem 1rem;
    background: rgba(var(--cedar-green-rgb), 0.04);
    border-left: 3px solid var(--cedar-green, #2D5016);
}

.tc-category-toggle[b-k6wq413cq4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    font-weight: 600;
    color: #111827;
    user-select: none;
}

.tc-category-toggle input[type="checkbox"][b-k6wq413cq4] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--cedar-green, #2D5016);
    cursor: pointer;
}

.tc-fieldset-header[b-k6wq413cq4] {
    margin-top: 1.25rem !important;
    padding-top: 1rem !important;
    border-top: 1px dashed rgba(0, 0, 0, 0.1) !important;
}

.tc-fieldset-header h4[b-k6wq413cq4] {
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cedar-green, #2D5016);
    margin: 0;
}

.time-control-row[b-k6wq413cq4] {
    display: block;
    margin-bottom: 0.25rem;
}

/* Per-event free-entry title selector */
.title-eligibility[b-k6wq413cq4] {
    margin-top: 0.6rem;
    padding: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: var(--river-pearl, #F5F5F0);
}

.title-chips[b-k6wq413cq4] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.title-chip[b-k6wq413cq4] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.6rem;
    border: 1px solid #d1d5db;
    background: #ffffff;
    font-weight: 600;
    cursor: pointer;
    user-select: none;
}

.title-chip input[b-k6wq413cq4] { cursor: pointer; }

/* Accepted payment types */
.payment-types[b-k6wq413cq4] { display: flex; gap: 1.25rem; flex-wrap: wrap; margin-top: 0.25rem; }
.payment-types label[b-k6wq413cq4] { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 500; cursor: pointer; }

/* Prize breakdown total */
.prize-total[b-k6wq413cq4] {
    padding: 0.5rem 0.75rem;
    border-left: 3px solid var(--cedar-green, #2D5016);
    background: rgba(var(--cedar-green-rgb), 0.06);
}

.prize-total.over[b-k6wq413cq4] {
    border-left-color: #c0392b;
    background: rgba(192, 57, 43, 0.08);
    color: #c0392b;
}

/* A repeated tournament section or prize row, and its two buttons (#7588). The block and both
   buttons rendered with no rule at all, so Section 1 and Section 2 ran together with no edge
   between them and Remove came out as a raw browser button. */
.tournament-section[b-k6wq413cq4] {
    padding: var(--spacing-lg);
    margin-bottom: var(--spacing-lg);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-gray-lightest);
}

.tournament-section .section-header[b-k6wq413cq4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}

.btn-add-section[b-k6wq413cq4],
.btn-remove-section[b-k6wq413cq4] {
    padding: var(--spacing-xs) var(--spacing-md);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-surface);
    color: var(--color-text);
    font-family: var(--font-display);
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    transition: border-color var(--transition-fast), color var(--transition-fast);
}

.btn-add-section:hover[b-k6wq413cq4] {
    border-color: var(--color-text);
}

.btn-remove-section[b-k6wq413cq4] {
    color: var(--color-error);
}

.btn-remove-section:hover[b-k6wq413cq4] {
    border-color: var(--color-error);
}
/* /Components/Shared/GroupSessionForm.razor.rz.scp.css */
.form-grid[b-1cdzabstob] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.form-group[b-1cdzabstob] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.form-group.full-width[b-1cdzabstob] {
    grid-column: 1 / -1;
}

.form-group label[b-1cdzabstob] {
    font-weight: 500;
    color: #374151;
    font-size: 0.875rem;
}

.form-control[b-1cdzabstob] {
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
}

.form-control:focus[b-1cdzabstob] {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

.help-text[b-1cdzabstob] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
}

.input-with-action[b-1cdzabstob] {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}

.input-with-action .form-control[b-1cdzabstob] {
    flex: 1;
}

.btn-autofill[b-1cdzabstob] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.625rem 0.75rem;
    background-color: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
}

.btn-autofill:hover[b-1cdzabstob] {
    background-color: #e5e7eb;
    border-color: #9ca3af;
}

.checkbox-label[b-1cdzabstob] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    padding-top: 1.5rem;
}

.checkbox-label span[b-1cdzabstob] {
    font-size: 0.875rem;
    color: #374151;
    text-transform: none;
    letter-spacing: normal;
    font-weight: normal;
}

[b-1cdzabstob] input[type="text"] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    transition: all 0.2s ease;
}

[b-1cdzabstob] input[type="text"]:focus {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] input[type="text"]::placeholder {
    color: #9ca3af;
}

[b-1cdzabstob] input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    color: #1e3a8a;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    cursor: pointer;
}

[b-1cdzabstob] input[type="checkbox"]:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] textarea {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    font-family: inherit;
    line-height: 1.5;
    transition: all 0.2s ease;
}

[b-1cdzabstob] textarea:focus {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] textarea::placeholder {
    color: #9ca3af;
}

[b-1cdzabstob] input[type="number"] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    transition: all 0.2s ease;
}

[b-1cdzabstob] input[type="number"]:focus {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] input[type="date"] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    transition: all 0.2s ease;
}

[b-1cdzabstob] input[type="date"]:focus {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] select {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background: white;
    transition: all 0.2s ease;
}

[b-1cdzabstob] select:focus-visible {
    outline: 2px solid #1e3a8a;
    outline-offset: 2px;
    border-color: #1e3a8a;
}

[b-1cdzabstob] select:focus:not(:focus-visible) {
    outline: none;
    border-color: #1e3a8a;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.1);
}

[b-1cdzabstob] .validation-message {
    color: #dc2626;
    font-size: 0.75rem;
    margin-top: 0.25rem;
    display: flex;
    align-items: flex-start;
    gap: 0.375rem;
}

[b-1cdzabstob] .validation-message::before {
    content: "⚠";
    font-size: 1rem;
    line-height: 1;
    flex-shrink: 0;
}

/* ============================================
   Form Error
   ============================================ */

.form-error[b-1cdzabstob] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    margin-top: 1rem;
    background: rgba(239, 68, 68, 0.05);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: 0.375rem;
    color: #dc2626;
    font-size: 0.875rem;
}

/* ============================================
   Form Actions
   ============================================ */

.form-actions[b-1cdzabstob] {
    display: flex;
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e5e7eb;
}

.btn-submit[b-1cdzabstob] {
    padding: 0.75rem 2rem;
    background-color: #1e3a8a;
    color: white;
    border: none;
    border-radius: 0.375rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s;
}

.btn-submit:hover:not(:disabled)[b-1cdzabstob] {
    background-color: #1e40af;
}

.btn-submit:disabled[b-1cdzabstob] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-cancel[b-1cdzabstob] {
    padding: 0.75rem 2rem;
    background-color: white;
    color: #374151;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-cancel:hover[b-1cdzabstob] {
    background-color: #f3f4f6;
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .form-grid[b-1cdzabstob] {
        grid-template-columns: 1fr;
    }

    .form-group.full-width[b-1cdzabstob] {
        grid-column: 1;
    }

    .form-actions[b-1cdzabstob] {
        flex-direction: column;
    }

    .btn-submit[b-1cdzabstob],
    .btn-cancel[b-1cdzabstob] {
        width: 100%;
    }
}
/* /Components/Shared/JoinCTA.razor.rz.scp.css */
/* Sticky CTA Container.
   slideInBounce was replaced with a gentle fadeIn — the bounce animation
   (translate + scale) was visibly replaying whenever the wrapper element
   was added/removed from the DOM during initial auth-state cascade,
   reading as a "flashing" CTA. fadeIn has no transform, so even if the
   element ever does remount the visual effect is imperceptible. */
.join-cta-sticky[b-dnjxyflztx] {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    /* The LOWEST fixed layer on the site (#8042): above the page, under every dialog, toast,
       banner and menu. At 1000 it tied the events page's detail dialog and, coming later in the
       document, painted over that dialog's "View Details & Register" and "Close" buttons at
       phone widths, where no amount of scrolling could uncover them. The page itself keeps
       clear of it through --join-cta-clearance (app.css). */
    z-index: 40;
    /* A fixed element is sized against the initial containing block, which mobile browsers
       widen when a page overflows horizontally - that is how this CTA ended up clipped at
       the screen edges on a phone (#7561, owner review 2026-09-10). Capping it against the
       viewport keeps it whole even on a page that is still too wide. */
    max-width: calc(100vw - 4rem);
    animation: fadeIn-b-dnjxyflztx 0.35s ease-out;
}

@keyframes fadeIn-b-dnjxyflztx {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* CTA Button - the club's own brand tokens */
.join-cta-button[b-dnjxyflztx] {
    display: flex;
    align-items: center;
    max-width: 100%;
    min-width: 0;
    gap: 1rem;
    padding: 1.25rem 2rem;
    background: linear-gradient(135deg,
                var(--cedar-green) 0%,
                var(--wilson-blue) 50%,
                var(--wheat-gold) 100%);
    color: white;
    text-decoration: none;
    border-radius: 60px;
    box-shadow: 0 10px 35px rgba(var(--cedar-green-rgb), 0.5),
                0 6px 20px rgba(var(--wilson-blue-rgb), 0.4),
                0 2px 8px rgba(var(--wheat-gold-rgb), 0.3),
                inset 0 1px 2px rgba(255, 255, 255, 0.3);
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    position: relative;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, 0.3);
}

/* Animated background shine effect */
.join-cta-button[b-dnjxyflztx]::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
        transparent,
        rgba(255, 255, 255, 0.3),
        transparent);
    transition: left 0.5s ease;
}

.join-cta-button:hover[b-dnjxyflztx]::before {
    left: 100%;
}

.join-cta-button:hover[b-dnjxyflztx] {
    animation-play-state: paused;
    transform: translateY(-4px) scale(1.05);
    box-shadow: 0 15px 45px rgba(var(--cedar-green-rgb), 0.6),
                0 8px 25px rgba(var(--wilson-blue-rgb), 0.5),
                0 4px 12px rgba(var(--wheat-gold-rgb), 0.4),
                inset 0 1px 2px rgba(255, 255, 255, 0.4);
}

.join-cta-button:active[b-dnjxyflztx] {
    transform: translateY(-2px) scale(1.02);
}

/* Icon */
.join-cta-icon[b-dnjxyflztx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    flex-shrink: 0;
    backdrop-filter: blur(10px);
}

.join-cta-icon i[b-dnjxyflztx] {
    font-size: 1.5rem;
    color: white;
}

/* Text Content */
.join-cta-text-content[b-dnjxyflztx] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    gap: 0.125rem;
}

/* The label must never be the thing that makes the pill too wide. */
.join-cta-label[b-dnjxyflztx],
.join-cta-sublabel[b-dnjxyflztx] {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.join-cta-label[b-dnjxyflztx] {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1;
    letter-spacing: 0.05em;
}

.join-cta-sublabel[b-dnjxyflztx] {
    font-size: 0.875rem;
    font-weight: 500;
    opacity: 0.95;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

/* Pulsing animation to draw attention */
@keyframes pulse-b-dnjxyflztx {
    0%, 100% {
        box-shadow: 0 10px 35px rgba(var(--cedar-green-rgb), 0.5),
                    0 6px 20px rgba(var(--wilson-blue-rgb), 0.4),
                    0 2px 8px rgba(var(--wheat-gold-rgb), 0.3),
                    inset 0 1px 2px rgba(255, 255, 255, 0.3);
    }
    50% {
        box-shadow: 0 12px 40px rgba(var(--cedar-green-rgb), 0.6),
                    0 8px 25px rgba(var(--wilson-blue-rgb), 0.5),
                    0 3px 10px rgba(var(--wheat-gold-rgb), 0.4),
                    inset 0 1px 2px rgba(255, 255, 255, 0.3);
    }
}

.join-cta-button[b-dnjxyflztx] {
    animation: pulse-b-dnjxyflztx 3s ease-in-out 2s infinite;
}

/* Upgrade Button Variant */
.join-cta-button.upgrade-button[b-dnjxyflztx] {
    background: linear-gradient(135deg,
                var(--wheat-gold) 0%,
                var(--cedar-green) 50%,
                var(--wilson-blue) 100%);
    box-shadow: 0 10px 35px rgba(var(--wheat-gold-rgb), 0.5),
                0 6px 20px rgba(var(--cedar-green-rgb), 0.4),
                0 2px 8px rgba(var(--wilson-blue-rgb), 0.3),
                inset 0 1px 2px rgba(255, 255, 255, 0.3);
}

.join-cta-button.upgrade-button:hover[b-dnjxyflztx] {
    box-shadow: 0 15px 45px rgba(var(--wheat-gold-rgb), 0.6),
                0 8px 25px rgba(var(--cedar-green-rgb), 0.5),
                0 4px 12px rgba(var(--wilson-blue-rgb), 0.4),
                inset 0 1px 2px rgba(255, 255, 255, 0.4);
}

/* Responsive Design */
@media (max-width: 768px) {
    .join-cta-sticky[b-dnjxyflztx] {
        bottom: 1.5rem;
        right: 1.5rem;
        left: 1.5rem;
        max-width: calc(100vw - 3rem);
    }

    .join-cta-button[b-dnjxyflztx] {
        width: 100%;
        justify-content: center;
        padding: 1rem 1.5rem;
    }

    .join-cta-icon[b-dnjxyflztx] {
        width: 40px;
        height: 40px;
    }

    .join-cta-icon i[b-dnjxyflztx] {
        font-size: 1.25rem;
    }

    .join-cta-label[b-dnjxyflztx] {
        font-size: 1.25rem;
    }

    .join-cta-sublabel[b-dnjxyflztx] {
        font-size: 0.75rem;
    }
}

@media (max-width: 480px) {
    .join-cta-sticky[b-dnjxyflztx] {
        bottom: 1rem;
        right: 1rem;
        left: 1rem;
        max-width: calc(100vw - 2rem);
    }

    .join-cta-button[b-dnjxyflztx] {
        padding: 0.875rem 1.25rem;
        gap: 0.75rem;
    }

    .join-cta-icon[b-dnjxyflztx] {
        width: 36px;
        height: 36px;
    }

    .join-cta-icon i[b-dnjxyflztx] {
        font-size: 1.125rem;
    }

    .join-cta-label[b-dnjxyflztx] {
        font-size: 1.125rem;
    }

    .join-cta-sublabel[b-dnjxyflztx] {
        font-size: 0.7rem;
    }
}
/* /Components/Shared/LoadingSpinner.razor.rz.scp.css */
.loading-spinner[b-4wbyiir8hk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem;
}

.spinner[b-4wbyiir8hk] {
    border: 4px solid #f3f4f6;
    border-top: 4px solid #1e3a8a;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin-b-4wbyiir8hk 1s linear infinite;
}

@keyframes spin-b-4wbyiir8hk {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-message[b-4wbyiir8hk] {
    margin-top: 1rem;
    color: #6b7280;
    font-size: 0.875rem;
}
/* /Components/Shared/MemberProfileModal.razor.rz.scp.css */
/* Modal Overlay */
.modal-overlay[b-roz1ocqypm] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
    padding: var(--spacing-md, 1rem);
    animation: fadeIn-b-roz1ocqypm 0.2s ease-out;
}

@keyframes fadeIn-b-roz1ocqypm {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Modal Content */
.modal-content[b-roz1ocqypm] {
    background: white;
    border-radius: 1rem;
    max-width: 600px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
    animation: slideUp-b-roz1ocqypm 0.3s ease-out;
    position: relative;
}

@keyframes slideUp-b-roz1ocqypm {
    from {
        transform: translateY(20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-close[b-roz1ocqypm] {
    position: absolute;
    top: var(--spacing-md, 1rem);
    right: var(--spacing-md, 1rem);
    background: rgba(0, 0, 0, 0.1);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.2s;
    z-index: 1;
}

.modal-close:hover[b-roz1ocqypm] {
    background: rgba(0, 0, 0, 0.2);
}

.modal-close i[b-roz1ocqypm] {
    font-size: 1.25rem;
    color: #374151;
}

/* Modal Header */
.modal-header[b-roz1ocqypm] {
    display: flex;
    align-items: center;
    gap: var(--spacing-lg, 1.5rem);
    padding: var(--spacing-xl, 2rem);
    border-bottom: 1px solid #e5e7eb;
}

.modal-photo[b-roz1ocqypm] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #e5e7eb;
}

.modal-photo-placeholder[b-roz1ocqypm] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(var(--wilson-blue-rgb), 0.1), rgba(var(--wilson-blue-rgb), 0.2));
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--wilson-blue, #4A6FA5);
    font-size: 2rem;
}

.modal-header-info[b-roz1ocqypm] {
    flex: 1;
}

.modal-name[b-roz1ocqypm] {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    font-size: var(--font-size-2xl, 2rem);
    color: var(--color-gray-dark, #374151);
    margin: 0 0 var(--spacing-xs, 0.5rem) 0;
}

.member-badge[b-roz1ocqypm] {
    display: inline-block;
    padding: 0.25rem 0.75rem;
    border-radius: 50px;
    font-size: var(--font-size-xs, 0.75rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.badge-member[b-roz1ocqypm] {
    background: rgba(107, 114, 128, 0.1);
    color: #6b7280;
}

.badge-bronze[b-roz1ocqypm] {
    background: rgba(205, 127, 50, 0.15);
    color: #cd7f32;
}

.badge-silver[b-roz1ocqypm] {
    background: rgba(192, 192, 192, 0.3);
    color: #757575;
}

.badge-gold[b-roz1ocqypm] {
    background: rgba(255, 215, 0, 0.2);
    color: #b8860b;
}

.badge-platinum[b-roz1ocqypm] {
    background: rgba(229, 228, 226, 0.4);
    color: #4a5568;
}

.badge-affiliate[b-roz1ocqypm],
.badge-sponsor[b-roz1ocqypm] {
    background: rgba(var(--wilson-blue-rgb), 0.1);
    color: var(--wilson-blue, #4A6FA5);
}

/* Modal Body */
.modal-body[b-roz1ocqypm] {
    padding: var(--spacing-xl, 2rem);
}

.profile-section[b-roz1ocqypm] {
    margin-bottom: var(--spacing-xl, 2rem);
}

.profile-section:last-child[b-roz1ocqypm] {
    margin-bottom: 0;
}

.profile-section-title[b-roz1ocqypm] {
    font-family: var(--font-display, 'Bebas Neue', sans-serif);
    font-size: var(--font-size-lg, 1.25rem);
    color: var(--color-gray-dark, #374151);
    margin: 0 0 var(--spacing-md, 1rem) 0;
    padding-bottom: var(--spacing-sm, 0.5rem);
    border-bottom: 2px solid var(--wilson-blue, #4A6FA5);
}

.profile-bio[b-roz1ocqypm] {
    color: var(--color-gray-dark, #374151);
    line-height: 1.6;
    margin: 0;
}

.profile-info-grid[b-roz1ocqypm] {
    display: grid;
    gap: var(--spacing-md, 1rem);
}

.profile-info-item[b-roz1ocqypm] {
    display: flex;
    justify-content: space-between;
    padding: var(--spacing-sm, 0.75rem);
    background: rgba(var(--wilson-blue-rgb), 0.03);
    border-radius: 0.5rem;
}

.profile-label[b-roz1ocqypm] {
    font-weight: 600;
    color: var(--color-gray, #6b7280);
}

.profile-value[b-roz1ocqypm] {
    color: var(--color-gray-dark, #374151);
}

/* Chess Links */
.chess-links[b-roz1ocqypm] {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm, 0.75rem);
}

.chess-link[b-roz1ocqypm] {
    display: flex;
    align-items: center;
    gap: var(--spacing-md, 1rem);
    padding: var(--spacing-md, 1rem);
    background: white;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    color: var(--color-gray-dark, #374151);
    text-decoration: none;
    transition: all 0.2s;
}

.chess-link:hover[b-roz1ocqypm] {
    border-color: var(--wilson-blue, #4A6FA5);
    background: rgba(var(--wilson-blue-rgb), 0.03);
}

.chess-link i:first-child[b-roz1ocqypm] {
    color: var(--wilson-blue, #4A6FA5);
    font-size: 1.25rem;
}

.chess-link span[b-roz1ocqypm] {
    flex: 1;
    font-weight: 500;
}

.chess-link i.fa-external-link-alt[b-roz1ocqypm] {
    font-size: 0.75rem;
    opacity: 0.5;
}

/* Responsive Design */
@media (max-width: 768px) {
    .modal-content[b-roz1ocqypm] {
        max-height: 95vh;
        margin: var(--spacing-sm, 0.5rem);
    }

    .modal-header[b-roz1ocqypm] {
        flex-direction: column;
        text-align: center;
        padding: var(--spacing-lg, 1.5rem);
    }

    .modal-name[b-roz1ocqypm] {
        font-size: var(--font-size-xl, 1.5rem);
    }

    .modal-body[b-roz1ocqypm] {
        padding: var(--spacing-lg, 1.5rem);
    }

    .chess-link[b-roz1ocqypm] {
        padding: var(--spacing-sm, 0.75rem);
    }

    .chess-link span[b-roz1ocqypm] {
        font-size: var(--font-size-sm, 0.875rem);
    }
}

/* Scrollbar for Modal */
.modal-content[b-roz1ocqypm]::-webkit-scrollbar {
    width: 8px;
}

.modal-content[b-roz1ocqypm]::-webkit-scrollbar-track {
    background: #f3f4f6;
}

.modal-content[b-roz1ocqypm]::-webkit-scrollbar-thumb {
    background: rgba(var(--wilson-blue-rgb), 0.3);
    border-radius: 4px;
}

.modal-content[b-roz1ocqypm]::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--wilson-blue-rgb), 0.5);
}
/* /Components/Shared/MemorialBanner.razor.rz.scp.css */
/* ============================================
   Memorial Banner
   ============================================ */

.memorial-banner[b-a9cgl67vom] {
    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
    border-bottom: 2px solid rgba(255, 255, 255, 0.1);
    padding: var(--spacing-md) var(--spacing-lg);
    width: 100%;
}

.memorial-content[b-a9cgl67vom] {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);
}

.memorial-photo[b-a9cgl67vom] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, 0.3);
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.memorial-icon[b-a9cgl67vom] {
    font-size: 2rem;
    color: rgba(255, 255, 255, 0.6);
    flex-shrink: 0;
}

.memorial-text[b-a9cgl67vom] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.memorial-message[b-a9cgl67vom] {
    font-size: var(--font-size-base);
    color: rgba(255, 255, 255, 0.95);
    margin: 0;
    line-height: 1.5;
}

.memorial-message strong[b-a9cgl67vom] {
    color: #ffffff;
    font-weight: 600;
}

.memorial-subtitle[b-a9cgl67vom] {
    font-size: var(--font-size-sm);
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
    font-style: italic;
    line-height: 1.4;
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 968px) {
    .memorial-banner[b-a9cgl67vom] {
        padding: var(--spacing-sm) var(--spacing-md);
    }

    .memorial-photo[b-a9cgl67vom] {
        width: 40px;
        height: 40px;
    }

    .memorial-icon[b-a9cgl67vom] {
        font-size: 1.5rem;
    }

    .memorial-message[b-a9cgl67vom] {
        font-size: var(--font-size-sm);
    }

    .memorial-subtitle[b-a9cgl67vom] {
        font-size: var(--font-size-xs);
    }
}

@media (max-width: 640px) {
    .memorial-content[b-a9cgl67vom] {
        gap: var(--spacing-sm);
    }

    .memorial-photo[b-a9cgl67vom] {
        width: 36px;
        height: 36px;
    }

    .memorial-icon[b-a9cgl67vom] {
        font-size: 1.25rem;
    }

    .memorial-text[b-a9cgl67vom] {
        gap: 0.125rem;
    }
}
/* /Components/Shared/MobileMenu.razor.rz.scp.css */
/* ============================================
   Mobile Menu
   Minimal Black/White with Cedar Green Accents
   ============================================ */

/* Mobile Menu Overlay */
.mobile-menu-overlay[b-6p53ag6cvx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    z-index: 1050;
    animation: fadeIn-b-6p53ag6cvx 0.3s ease-out;
}

@keyframes fadeIn-b-6p53ag6cvx {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Mobile Menu Container */
.mobile-menu[b-6p53ag6cvx] {
    position: fixed;
    top: 70px;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: calc(100vh - 70px);
    background: #000000;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.5);
    z-index: 1051;
    overflow-y: auto;
    animation: slideIn-b-6p53ag6cvx 0.3s ease-out;
    touch-action: pan-y;
}

@keyframes slideIn-b-6p53ag6cvx {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}

/* Mobile Menu Content */
.mobile-menu-content[b-6p53ag6cvx] {
    padding: 1rem 0;
}

.mobile-nav-link[b-6p53ag6cvx] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    background: transparent;
    width: 100%;
    text-align: left;
    cursor: pointer;
    border-left: 2px solid transparent;
}

.mobile-nav-link i:not(.mobile-toggle-icon)[b-6p53ag6cvx] {
    width: 20px;
    text-align: center;
    display: none; /* Hide icons for minimal look */
}

.mobile-nav-link:hover[b-6p53ag6cvx] {
    color: #ffffff;
    border-left-color: var(--cedar-green);
    padding-left: 1.75rem;
}

.mobile-nav-link-admin[b-6p53ag6cvx] {
    background: rgba(var(--wheat-gold-rgb), 0.1);
    color: var(--wheat-gold);
    border: 2px solid var(--wheat-gold);
    border-radius: 0;
    margin: 0.5rem 1rem;
    padding: 0.875rem 1.5rem;
}

.mobile-nav-link-admin:hover[b-6p53ag6cvx] {
    background: rgba(var(--wheat-gold-rgb), 0.2);
    border-color: var(--wheat-gold);
}

.mobile-nav-link-highlight[b-6p53ag6cvx] {
    background: var(--cedar-green);
    color: #ffffff;
    margin: 0 1rem;
    border-radius: 0;
}

.mobile-nav-link-highlight:hover[b-6p53ag6cvx] {
    background: var(--cedar-green-dark);
    border-left-color: transparent;
}

/* Mobile Dropdown */
.mobile-dropdown[b-6p53ag6cvx] {
    display: flex;
    flex-direction: column;
}

.mobile-dropdown-toggle[b-6p53ag6cvx] {
    justify-content: space-between;
}

.mobile-dropdown-toggle span[b-6p53ag6cvx] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.mobile-toggle-icon[b-6p53ag6cvx] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.4);
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-right: 0.5rem;
}

.mobile-dropdown-toggle:hover .mobile-toggle-icon[b-6p53ag6cvx] {
    color: var(--wheat-gold);
}

.mobile-dropdown-menu[b-6p53ag6cvx] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: rgba(255, 255, 255, 0.02);
}

.mobile-dropdown-menu.expanded[b-6p53ag6cvx] {
    max-height: 3000px;
}

.mobile-dropdown-item[b-6p53ag6cvx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    padding-left: 3rem;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: none;
    letter-spacing: 0.03em;
}

.mobile-dropdown-item:hover[b-6p53ag6cvx] {
    color: #ffffff;
    padding-left: 3.25rem;
}

.mobile-icon[b-6p53ag6cvx] {
    width: 16px;
    height: 16px;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.6;
}

.mobile-icon-lichess[b-6p53ag6cvx] {
    opacity: 0.6;
}

.mobile-dropdown-item:hover .mobile-icon[b-6p53ag6cvx],
.mobile-dropdown-item:hover .mobile-icon-lichess[b-6p53ag6cvx] {
    opacity: 1;
}

/* Mobile Divider */
.mobile-divider[b-6p53ag6cvx] {
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    margin: 1rem 1.5rem;
}

/* Mobile Section Label */
.mobile-section-label[b-6p53ag6cvx] {
    padding: 0.75rem 1.5rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.1em;
}

/* Mobile Dropdown Sections */
.mobile-dropdown-section-header[b-6p53ag6cvx] {
    padding: 0.75rem 1.5rem;
    padding-left: 2.5rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: color 0.3s ease;
}

.mobile-dropdown-section-header:hover[b-6p53ag6cvx] {
    color: rgba(255, 255, 255, 0.6);
}

.mobile-accordion-icon[b-6p53ag6cvx] {
    font-size: 0.625rem;
    color: rgba(255, 255, 255, 0.4);
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-dropdown-section-header:hover .mobile-accordion-icon[b-6p53ag6cvx] {
    color: var(--wheat-gold);
}

.mobile-dropdown-accordion-content[b-6p53ag6cvx] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-dropdown-accordion-content.expanded[b-6p53ag6cvx] {
    max-height: 3000px;
}

.mobile-dropdown-sub-divider[b-6p53ag6cvx] {
    height: 1px;
    background: rgba(255, 255, 255, 0.05);
    margin: 0.5rem 2.5rem;
}

/* Brand Items */
.mobile-dropdown-item-brand[b-6p53ag6cvx] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    padding-left: 2.5rem;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-dropdown-item-brand:hover[b-6p53ag6cvx] {
    background: rgba(var(--cedar-green-rgb), 0.1);
}

.mobile-brand-logo[b-6p53ag6cvx] {
    height: 20px;
    width: auto;
    object-fit: contain;
    /* No filter - preserve brand logo colors */
    opacity: 0.7;
    transition: all 0.3s ease;
}

.mobile-dropdown-item-brand:hover .mobile-brand-logo[b-6p53ag6cvx] {
    opacity: 1;
}

.mobile-brand-text[b-6p53ag6cvx] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.5);
}

.mobile-brand-lichess[b-6p53ag6cvx] {
    font-family: 'Noto Sans', sans-serif;
    text-transform: lowercase;
}

/* Organization Links */
.mobile-nav-link-org[b-6p53ag6cvx] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.5rem;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-left: 2px solid transparent;
}

.mobile-nav-link-org:hover[b-6p53ag6cvx] {
    border-left-color: var(--cedar-green);
}

.mobile-org-logo[b-6p53ag6cvx] {
    height: 24px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    /* No filter - preserve affiliate logo colors in full */
    transition: all 0.3s ease;
}

.mobile-nav-link-org:hover .mobile-org-logo[b-6p53ag6cvx] {
    opacity: 0.8;
}

/* Organizations named in text (the parent organization, the sister club) rather than by a logo. */
.mobile-nav-link-org-text[b-6p53ag6cvx] {
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.95rem;
}

.mobile-org-crest[b-6p53ag6cvx] {
    height: 36px;
    width: 36px;
    border-radius: 50%;
    object-fit: cover;
}

/* A sister club with no artwork yet is named instead of pictured. */
.mobile-org-name[b-6p53ag6cvx] {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}

/* The drawer's half of the same relationship (#7588): Announcements is a sub-item of News and
   rendered flush with it, with no rule anywhere in the project defining this class. */
.mobile-sub-link[b-6p53ag6cvx] {
    padding-left: var(--spacing-2xl);
    font-size: var(--font-size-sm);
}
/* /Components/Shared/Navigation.razor.rz.scp.css */
/* ============================================
   Modern Minimal Navigation
   ============================================ */

.navigation-wrapper[b-ldbhkw39zx] {
    display: contents;
}

/* ============================================
   Sidebar - Minimal, Bold Typography
   ============================================ */

.sidebar-nav[b-ldbhkw39zx] {
    position: fixed;
    top: 0;
    left: 0;
    width: 240px;
    height: 100vh;
    background: #000000;
    border-right: 2px solid #000000;
    color: #ffffff;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1001;
    display: flex;
    flex-direction: column;
}

/* ============================================
   Sidebar Header - Minimal Branding
   ============================================ */

.sidebar-header[b-ldbhkw39zx] {
    padding: 3rem 2rem 2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    flex-shrink: 0;
}

.sidebar-brand[b-ldbhkw39zx] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.5rem;
    text-decoration: none;
    transition: opacity 0.3s ease;
}

.sidebar-brand:hover[b-ldbhkw39zx] {
    opacity: 0.7;
}

/* ::deep - the <img> is rendered by the ClubLogo child component and carries no scope attribute. */
[b-ldbhkw39zx] .sidebar-logo {
    width: 90px;
    height: 90px;
    object-fit: contain;
    /* No filter - preserve logo design for dark background */
}

.sidebar-title[b-ldbhkw39zx] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    text-align: left;
    color: #ffffff;
}

.sidebar-title[b-ldbhkw39zx]  .brand-accent {
    color: var(--wheat-gold);
}

/* ============================================
   Sidebar Links - Minimal Typography
   ============================================ */

.sidebar-links[b-ldbhkw39zx] {
    flex: 1;
    padding: 2rem 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.sidebar-link[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 1rem 2rem;
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-family: var(--font-display);
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 0;
    margin: 0;
    background: transparent;
    border: none;
    border-left: 2px solid transparent;
    width: 100%;
    text-align: left;
    cursor: pointer;
    position: relative;
}


.sidebar-link:hover[b-ldbhkw39zx] {
    color: #ffffff;
    border-left-color: #ffffff;
    padding-left: 2.25rem;
}

/* Admin Link - Distinguished */
.sidebar-link-admin[b-ldbhkw39zx] {
    background: #ffffff;
    color: #000000;
    margin: 0.5rem 2rem;
    font-weight: 700;
    border-left: none;
}

.sidebar-link-admin:hover[b-ldbhkw39zx] {
    background: rgba(255, 255, 255, 0.9);
    padding-left: 2rem;
}

/* Highlighted Join Button */
.sidebar-link-highlight[b-ldbhkw39zx] {
    background: #ffffff;
    color: #000000 !important;
    font-weight: 700;
    margin: 0.5rem 2rem;
    border-left: none;
}

.sidebar-link-highlight:hover[b-ldbhkw39zx] {
    background: rgba(255, 255, 255, 0.9);
    padding-left: 2rem;
}

/* ============================================
   Dividers & Sections - Minimal
   ============================================ */

.sidebar-divider[b-ldbhkw39zx] {
    height: 1px;
    background: rgba(255, 255, 255, 0.1);
    margin: 1.5rem 2rem;
}

.sidebar-section-label[b-ldbhkw39zx] {
    padding: 1.5rem 2rem 0.75rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

/* ============================================
   Organization Links - Minimal
   ============================================ */

.sidebar-link-org[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 2rem;
    text-transform: none;
    border-left: none;
}

.sidebar-org-logo[b-ldbhkw39zx] {
    height: 24px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    transition: all 0.3s ease;
    /* No filter - preserve affiliate logo colors in full */
}

.sidebar-link-org:hover .sidebar-org-logo[b-ldbhkw39zx] {
    opacity: 0.8;
}

/* ============================================
   Dropdown Menus - Minimal Hierarchy
   ============================================ */

.sidebar-dropdown[b-ldbhkw39zx] {
    display: flex;
    flex-direction: column;
}

.sidebar-dropdown-toggle[b-ldbhkw39zx] {
    justify-content: space-between;
}

.sidebar-link-content[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    gap: 0;
}

.dropdown-toggle-icon[b-ldbhkw39zx] {
    font-size: 0.625rem;
    color: rgba(255, 255, 255, 0.4);
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    margin-right: 0.5rem;
}

.sidebar-dropdown-toggle:hover .dropdown-toggle-icon[b-ldbhkw39zx] {
    color: var(--wheat-gold);
}

.sidebar-dropdown-menu[b-ldbhkw39zx] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background: rgba(255, 255, 255, 0.02);
}

.sidebar-dropdown-menu.expanded[b-ldbhkw39zx] {
    max-height: 3000px;
}

.sidebar-dropdown-item[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 2rem;
    padding-left: 3rem;
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
    font-size: 0.75rem;
    font-weight: 500;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: none;
    letter-spacing: 0.03em;
}

.sidebar-dropdown-item i[b-ldbhkw39zx] {
    display: inline-block;
    width: auto;
    font-size: 0.75rem;
}

.sidebar-dropdown-item:hover[b-ldbhkw39zx] {
    color: #ffffff;
    padding-left: 3.25rem;
}

/* Dropdown Section Headers */
.sidebar-dropdown-section-header[b-ldbhkw39zx] {
    padding: 0.625rem 1.5rem;
    padding-left: 2.5rem;
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 800;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: left;
}

.sidebar-dropdown-divider[b-ldbhkw39zx] {
    height: 1px;
    background: rgba(0, 0, 0, 0.06);
    margin: 0.5rem 1.5rem;
}

/* Dropdown Icons */
.dropdown-icon[b-ldbhkw39zx] {
    width: 16px;
    height: 16px;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.6;
}

.dropdown-icon-lichess[b-ldbhkw39zx] {
    opacity: 0.6;
}

.sidebar-dropdown-item:hover .dropdown-icon[b-ldbhkw39zx],
.sidebar-dropdown-item:hover .dropdown-icon-lichess[b-ldbhkw39zx] {
    opacity: 1;
}

/* Brand Items in Dropdowns */
.sidebar-dropdown-item-brand[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1.5rem;
    padding-left: 2.5rem;
    text-decoration: none;
    transition: all 0.2s ease;
}

.sidebar-dropdown-item-brand:hover[b-ldbhkw39zx] {
    background: rgba(var(--cedar-green-rgb), 0.04);
}

.dropdown-brand-logo[b-ldbhkw39zx] {
    height: 20px;
    width: auto;
    object-fit: contain;
    /* No filter - preserve brand logo colors */
    opacity: 0.7;
    transition: all 0.2s ease;
}

.dropdown-brand-logo-lichess[b-ldbhkw39zx] {
    height: 18px;
}

.sidebar-dropdown-item-brand:hover .dropdown-brand-logo[b-ldbhkw39zx] {
    opacity: 1;
}

.dropdown-brand-text[b-ldbhkw39zx] {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #4b5563;
}

.dropdown-brand-lichess[b-ldbhkw39zx] {
    font-family: 'Noto Sans', sans-serif;
    text-transform: lowercase;
}

.sidebar-dropdown-item-brand:hover .dropdown-brand-text[b-ldbhkw39zx] {
    color: var(--cedar-green);
}

/* Accordion for Nested Dropdowns */
.sidebar-dropdown-accordion-header[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.5rem;
    padding-left: 2.5rem;
    cursor: pointer;
    transition: background 0.2s;
    user-select: none;
}

.sidebar-dropdown-accordion-header:hover[b-ldbhkw39zx] {
    background: rgba(var(--cedar-green-rgb), 0.02);
}

.sidebar-dropdown-accordion-header .sidebar-dropdown-section-header[b-ldbhkw39zx] {
    padding: 0;
    margin: 0;
}

.accordion-toggle-icon[b-ldbhkw39zx] {
    font-size: 0.5rem;
    color: rgba(255, 255, 255, 0.4);
    transition: color 0.2s ease;
    margin-right: 0.5rem;
}

.sidebar-dropdown-accordion-header:hover .accordion-toggle-icon[b-ldbhkw39zx] {
    color: var(--wheat-gold);
}

.sidebar-dropdown-accordion-content[b-ldbhkw39zx] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.sidebar-dropdown-accordion-content.expanded[b-ldbhkw39zx] {
    max-height: 2000px;
    transition: max-height 0.2s ease-in;
}

/* ============================================
   Mobile Header - Strong Identity
   ============================================ */

.mobile-header[b-ldbhkw39zx] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* The 1.5rem side padding below is added OUTSIDE left/right without this, so the bar
       measured 408px on a 390px phone and Chrome widened the layout viewport to match - the
       whole page then scrolled sideways, on both skins (measured on dev and locally,
       #7561 round 2). A fixed bar must be capped against the viewport it is
       fixed to; this is the ONE place that cap lives now. */
    box-sizing: border-box;
    max-width: 100vw;
    height: 70px;
    /* The ground and the ink below come from ONE pair of tokens (#8123, app.css). A skin that
       wants a different header sets both tokens, never this background on its own - painting
       the ground alone is how the photo skin hid the menu button in its own brand color. */
    background: var(--mobile-header-ground);
    border-bottom: 2px solid rgba(var(--cedar-green-rgb), 0.1);
    box-shadow: 0 2px 12px rgba(var(--cedar-green-rgb), 0.08);
    z-index: 1002;
    padding: 0 1.5rem;
    align-items: center;
    justify-content: space-between;
}

.mobile-header-brand[b-ldbhkw39zx] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    text-decoration: none;
}

[b-ldbhkw39zx] .mobile-header-logo {
    width: 64px;
    height: 64px;
    object-fit: contain;
}

.mobile-header-title[b-ldbhkw39zx] {
    font-family: var(--font-display);
    font-size: 1.125rem;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--mobile-header-ink);
}

/* Mobile Menu Toggle - Bold Hamburger */
.mobile-menu-toggle[b-ldbhkw39zx] {
    display: none;
    flex-direction: column;
    gap: 6px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0.75rem;
}

.hamburger-line[b-ldbhkw39zx] {
    width: 28px;
    height: 3px;
    background-color: var(--mobile-header-ink);
    border-radius: 2px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-menu-container[b-ldbhkw39zx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
}

/* ============================================
   Scrollbar - Minimal
   ============================================ */

.sidebar-nav[b-ldbhkw39zx]::-webkit-scrollbar {
    width: 4px;
}

.sidebar-nav[b-ldbhkw39zx]::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-nav[b-ldbhkw39zx]::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
}

.sidebar-nav[b-ldbhkw39zx]::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4);
}

/* ============================================
   Responsive Design
   ============================================ */

@media (max-width: 968px) {
    .sidebar-nav[b-ldbhkw39zx] {
        display: none;
    }

    .mobile-header[b-ldbhkw39zx] {
        display: flex;
    }

    .mobile-menu-toggle[b-ldbhkw39zx] {
        display: flex;
    }
}

/* Organizations named in text (the parent organization, the sister club) rather than by a logo. */
.sidebar-link-org-text[b-ldbhkw39zx] {
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}

.sidebar-link-org-text:hover[b-ldbhkw39zx] {
    color: #ffffff;
}

/* The parent organization's crest beside its name (owner ruling, 2026-09-10). */
.sidebar-org-crest[b-ldbhkw39zx] {
    height: 36px;
    width: 36px;
    border-radius: 50%;
    object-fit: cover;
}

/* A sister club with no artwork yet is named instead of pictured. */
.sidebar-org-name[b-ldbhkw39zx] {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
    letter-spacing: 0.02em;
}

/* A sub-item of the entry above it - Announcements sits under News (#7588). It rendered with
   no rule at all, so it read as a peer of News rather than a child of it. The indent is what
   carries the relationship; the hover step keeps the same 0.25rem nudge as .sidebar-link. */
.sidebar-sub-link[b-ldbhkw39zx] {
    padding-left: var(--spacing-2xl);
    font-size: var(--font-size-xs);
}

.sidebar-sub-link:hover[b-ldbhkw39zx] {
    padding-left: calc(var(--spacing-2xl) + 0.25rem);
}
/* /Components/Shared/NextUpBanner.razor.rz.scp.css */
/* ============================================
   Next Up CTA Banner
   Urgency-driven call-to-action bar
   ============================================ */

.next-up-banner[b-oyb2j2skig] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.6rem 2rem;
    color: #ffffff;
    box-sizing: border-box;
    width: 100%;
    transition: background 0.4s ease;
}

/* Urgency backgrounds */
.next-up-banner.urgency-normal[b-oyb2j2skig] {
    background: var(--cedar-green, #2D5016);
}

.next-up-banner.urgency-soon[b-oyb2j2skig] {
    background: #4a3a10;
}

.next-up-banner.urgency-today[b-oyb2j2skig] {
    background: var(--tobacco-barn-red, #8B4513);
}

.next-up-banner.urgency-high[b-oyb2j2skig] {
    background: #9b1c1c;
    animation: urgency-pulse-b-oyb2j2skig 3s ease-in-out infinite;
}

@keyframes urgency-pulse-b-oyb2j2skig {
    0%, 100% { background: #9b1c1c; }
    50% { background: #b52525; }
}

/* Left side — info */
.next-up-left[b-oyb2j2skig] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    overflow: hidden;
}

.next-up-tag[b-oyb2j2skig] {
    font-family: var(--font-display);
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.2);
    padding: 0.2rem 0.5rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.next-up-type[b-oyb2j2skig] {
    font-size: 0.8125rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.85;
    white-space: nowrap;
    flex-shrink: 0;
}

.next-up-title[b-oyb2j2skig] {
    font-size: 0.9375rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.next-up-dot[b-oyb2j2skig] {
    opacity: 0.5;
    flex-shrink: 0;
}

.next-up-location[b-oyb2j2skig] {
    font-size: 0.8125rem;
    opacity: 0.75;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Right side — urgency + CTA */
.next-up-right[b-oyb2j2skig] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-shrink: 0;
}

/* Spots badge */
.next-up-spots[b-oyb2j2skig] {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    white-space: nowrap;
    padding: 0.15rem 0.5rem;
}

.next-up-spots.spots-open[b-oyb2j2skig] {
    background: rgba(255, 255, 255, 0.15);
}

.next-up-spots.spots-low[b-oyb2j2skig] {
    background: rgba(255, 215, 0, 0.25);
    color: #ffd700;
}

.next-up-spots.spots-full[b-oyb2j2skig] {
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.6;
}

/* Countdown */
.next-up-countdown[b-oyb2j2skig] {
    font-family: var(--font-display);
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    white-space: nowrap;
}

.urgency-high .next-up-countdown[b-oyb2j2skig] {
    animation: countdown-blink-b-oyb2j2skig 2s ease-in-out infinite;
}

@keyframes countdown-blink-b-oyb2j2skig {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* CTA button */
.next-up-cta[b-oyb2j2skig] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green, #2D5016);
    background: #ffffff;
    padding: 0.45rem 1.25rem;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.next-up-cta:hover[b-oyb2j2skig] {
    background: var(--wheat-gold, #D4AF37);
    color: #000000;
    transform: translateY(-1px);
}

.next-up-cta i[b-oyb2j2skig] {
    font-size: 0.65em;
    transition: transform 0.2s ease;
}

.next-up-cta:hover i[b-oyb2j2skig] {
    transform: translateX(3px);
}

/* Urgency-specific CTA colors */
.urgency-soon .next-up-cta[b-oyb2j2skig] {
    color: #4a3a10;
}

.urgency-today .next-up-cta[b-oyb2j2skig] {
    color: var(--tobacco-barn-red, #8B4513);
}

.urgency-high .next-up-cta[b-oyb2j2skig] {
    color: #9b1c1c;
}

/* Responsive */
@media (max-width: 768px) {
    .next-up-banner[b-oyb2j2skig] {
        padding: 0.5rem 1rem;
        flex-wrap: wrap;
        gap: 0.4rem 0.75rem;
    }

    .next-up-left[b-oyb2j2skig] {
        flex: 1;
    }

    .next-up-location[b-oyb2j2skig] {
        display: none;
    }

    .next-up-dot[b-oyb2j2skig] {
        display: none;
    }

    .next-up-right[b-oyb2j2skig] {
        width: 100%;
        justify-content: flex-end;
    }

    .next-up-cta[b-oyb2j2skig] {
        flex-grow: 1;
        justify-content: center;
    }
}
/* /Components/Shared/PageHero.razor.rz.scp.css */
/* ============================================
   PageHero - the ONE page header (#7561)
   ============================================
   Owns every rule the 71 hand-rolled page heroes used to repeat. A page that
   moves onto <PageHero> DELETES its .page-hero / .admin-hero / .*-title /
   .*-subtitle / .hero-eyebrow / .hero-badge rules; they live here now.

   Mobile rule of the shell: the hero is FULL BLEED on a phone. It never keeps
   the sidebar-era side margins and it never sets a width, a min-width or a
   negative margin, so it cannot push the page wider than the viewport.
   ============================================ */

.page-hero[b-7c5qwnnxya],
.admin-hero[b-7c5qwnnxya] {
    position: relative;
    background: #000000;
    color: #ffffff;
    padding: 6rem 4rem;
    overflow: hidden;
    min-height: 30vh;
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-compact[b-7c5qwnnxya] {
    padding: 4rem 4rem;
    min-height: 0;
}

.hero-tall[b-7c5qwnnxya] {
    padding: 8rem 4rem;
    min-height: 40vh;
}

/* The watermark. One glyph for the whole site (black knight, U+265E), written as a CSS
   escape so no source file needs a non-ASCII byte. `overflow: hidden` on the hero is what
   keeps it from widening the page. */
.page-hero[b-7c5qwnnxya]::before,
.admin-hero[b-7c5qwnnxya]::before {
    content: "\265E";
    position: absolute;
    top: 50%;
    right: -5%;
    transform: translateY(-50%) rotate(15deg);
    font-size: 350px;
    color: rgba(255, 255, 255, 0.08);
    font-weight: 300;
    line-height: 1;
    user-select: none;
    pointer-events: none;
}

.hero-tall[b-7c5qwnnxya]::before {
    font-size: 500px;
}

.hero-no-glyph[b-7c5qwnnxya]::before {
    content: none;
}

.page-hero-content[b-7c5qwnnxya],
.admin-hero-content[b-7c5qwnnxya] {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    text-align: left;
    z-index: 1;
    min-width: 0;
}

.hero-center .page-hero-content[b-7c5qwnnxya],
.hero-center .admin-hero-content[b-7c5qwnnxya] {
    text-align: center;
    max-width: 900px;
}

/* ---- Eyebrow (the "back to X" line) ---- */

.hero-eyebrow[b-7c5qwnnxya] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.hero-eyebrow .back-link[b-7c5qwnnxya],
.back-link[b-7c5qwnnxya] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    transition: color var(--transition-fast);
}

.hero-eyebrow .back-link:hover[b-7c5qwnnxya],
.back-link:hover[b-7c5qwnnxya] {
    color: var(--accent-text-on-dark);
}

/* ---- Badge ---- */

.hero-badge[b-7c5qwnnxya] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 1.25rem;
    color: var(--accent-text-on-dark);
}

.hero-center .hero-badge[b-7c5qwnnxya] {
    /* An inline-flex box centres with the text only if it is not a flex item. */
    margin-left: auto;
    margin-right: auto;
}

/* ---- Title and subtitle ---- */

.page-title[b-7c5qwnnxya],
.admin-title[b-7c5qwnnxya] {
    font-family: var(--font-display);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 700;
    margin: 0 0 1rem 0;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    overflow-wrap: break-word;
}

.hero-tall .page-title[b-7c5qwnnxya],
.hero-tall .admin-title[b-7c5qwnnxya] {
    font-size: clamp(2.5rem, 6vw, 4rem);
}

.page-title .gold[b-7c5qwnnxya],
.admin-title .gold[b-7c5qwnnxya] {
    color: var(--accent-text-on-dark);
}

.page-title .white[b-7c5qwnnxya],
.admin-title .white[b-7c5qwnnxya] {
    color: #ffffff;
}

.page-subtitle[b-7c5qwnnxya],
.admin-subtitle[b-7c5qwnnxya] {
    font-size: 1.125rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    max-width: 800px;
}

.hero-center .page-subtitle[b-7c5qwnnxya],
.hero-center .admin-subtitle[b-7c5qwnnxya] {
    margin-left: auto;
    margin-right: auto;
}

.hero-extra[b-7c5qwnnxya] {
    margin-top: 1.75rem;
}

/* Whatever a page puts under the subtitle - stats, links, buttons - lays out as a wrapping
   row that can shrink. minmax(0, ...) is the shell's promise: no child forces the page wide. */
.hero-extra[b-7c5qwnnxya]  .hero-links,
.hero-extra[b-7c5qwnnxya]  .hero-actions,
.hero-extra[b-7c5qwnnxya]  .hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    min-width: 0;
}

.hero-extra[b-7c5qwnnxya]  a {
    color: #ffffff;
}

/* ---- Mobile: full bleed, one step down the type scale ---- */

@media (max-width: 768px) {
    .page-hero[b-7c5qwnnxya],
    .admin-hero[b-7c5qwnnxya] {
        padding: 3.5rem 1.25rem;
        min-height: 0;
    }

    .hero-compact[b-7c5qwnnxya] {
        padding: 2.5rem 1.25rem;
    }

    .hero-tall[b-7c5qwnnxya] {
        padding: 4.5rem 1.25rem;
        min-height: 0;
    }

    .page-hero[b-7c5qwnnxya]::before,
    .admin-hero[b-7c5qwnnxya]::before,
    .hero-tall[b-7c5qwnnxya]::before {
        font-size: 200px;
        right: -12%;
    }

    .page-title[b-7c5qwnnxya],
    .admin-title[b-7c5qwnnxya],
    .hero-tall .page-title[b-7c5qwnnxya],
    .hero-tall .admin-title[b-7c5qwnnxya] {
        font-size: clamp(1.75rem, 9vw, 2.5rem);
    }

    .page-subtitle[b-7c5qwnnxya],
    .admin-subtitle[b-7c5qwnnxya] {
        font-size: 1rem;
    }

    .hero-extra[b-7c5qwnnxya] {
        margin-top: 1.25rem;
    }
}
/* /Components/Shared/PageSection.razor.rz.scp.css */
/* ============================================
   PageSection - the ONE section rhythm (#7561)
   ============================================
   Spacing, measure and heading scale for everything below the hero. A page that
   moves onto <PageSection> deletes its own container/padding/max-width rules.

   Mobile rule of the shell: side padding shrinks, the measure is `100%` and every
   inner grid uses minmax(0, 1fr), so a wide child shrinks instead of widening the
   page. Anything that genuinely cannot shrink goes in a <ScrollRegion>.
   ============================================ */

.page-section[b-ixudcige0m] {
    width: 100%;
    max-width: 100%;
    padding: 4rem 2rem;
    background: var(--color-surface, #ffffff);
}

.page-section-tinted[b-ixudcige0m] {
    background: var(--color-background, #f5f5f0);
}

.page-section + .page-section[b-ixudcige0m] {
    padding-top: 0;
}

.page-section-tinted + .page-section-tinted[b-ixudcige0m] {
    padding-top: 4rem;
}

.page-section-inner[b-ixudcige0m] {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    min-width: 0;
}

.section-narrow[b-ixudcige0m] {
    max-width: 800px;
}

.section-wide[b-ixudcige0m] {
    max-width: 1400px;
}

.section-full[b-ixudcige0m] {
    max-width: none;
}

/* ---- Header ---- */

.section-header[b-ixudcige0m] {
    margin-bottom: 2.5rem;
    min-width: 0;
}

.section-eyebrow[b-ixudcige0m] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    /* 12px running text: the small-text step, which is the only accent token with a 4.5:1
       floor against white. See app.css. */
    color: var(--accent-text-small);
    margin: 0 0 0.5rem 0;
}

.section-title[b-ixudcige0m] {
    font-family: var(--font-display);
    font-size: clamp(1.5rem, 3.5vw, 2.25rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.01em;
    text-transform: uppercase;
    color: var(--color-dark);
    margin: 0;
    overflow-wrap: break-word;
}

.section-subtitle[b-ixudcige0m] {
    font-size: 1.0625rem;
    line-height: 1.7;
    color: var(--color-text-secondary);
    margin: 0.75rem 0 0 0;
    max-width: 70ch;
}

.section-actions[b-ixudcige0m] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
    min-width: 0;
}

.section-body[b-ixudcige0m] {
    min-width: 0;
}

/* Any grid a page drops into a section shrinks rather than overflowing. `minmax(0, 1fr)` is
   the whole difference between a grid that fits a 390px phone and one that does not. */
.section-body[b-ixudcige0m]  .grid,
.section-body[b-ixudcige0m]  .card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
    gap: 1.5rem;
    min-width: 0;
}

.section-body[b-ixudcige0m]  img {
    max-width: 100%;
    height: auto;
}

.section-body[b-ixudcige0m]  pre {
    overflow-x: auto;
    max-width: 100%;
}

@media (max-width: 768px) {
    .page-section[b-ixudcige0m] {
        padding: 2.5rem 1.25rem;
    }

    .page-section-tinted + .page-section-tinted[b-ixudcige0m] {
        padding-top: 2.5rem;
    }

    .section-header[b-ixudcige0m] {
        margin-bottom: 1.75rem;
    }

    .section-subtitle[b-ixudcige0m] {
        font-size: 1rem;
    }
}
/* /Components/Shared/ScrollRegion.razor.rz.scp.css */
/* ============================================
   ScrollRegion - the ONE horizontal scroller (#7561)
   ============================================
   The contract: the OUTER box is never wider than its column (max-width: 100%),
   and the INNER box is the only thing that scrolls. That pairing is what a
   `min-width: 600px` calendar needs and what it never had - before this the
   calendar's min-width lived inside a parent that could not scroll, so the whole
   page grew instead.

   The lint test (CssResponsivenessTests) allows a `min-width` above 320px only
   inside a file that also has an `overflow-x: auto` rule - i.e. only where a
   region like this one is doing the scrolling.
   ============================================ */

.scroll-region[b-u08dgrfzrr] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.scroll-region-viewport[b-u08dgrfzrr] {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
}

.scroll-region-viewport:focus-visible[b-u08dgrfzrr] {
    outline: 2px solid var(--wilson-blue);
    outline-offset: 2px;
}

.scroll-region-hint[b-u08dgrfzrr] {
    display: none;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0 0 0;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
}

/* The affordance only means something where a finger is doing the scrolling. */
@media (max-width: 768px) {
    .scroll-region-hint[b-u08dgrfzrr] {
        display: flex;
    }
}
/* /Components/Shared/StaticBoard.razor.rz.scp.css */
/* ============================================
   StaticBoard - a chess diagram with no JavaScript (#7542)
   ============================================
   The board is a square grid that takes the width it is given and never more, so
   it fits a 390px phone and a desktop column with the same rules: eight
   minmax(0, 1fr) tracks inside a max-width box with aspect-ratio 1.

   The glyphs scale with the BOARD rather than with the viewport - the grid is a
   container and the pieces are sized in cqi - so a diagram in a narrow column and
   a diagram at full width both keep the same piece-to-square proportion. The rem
   value before each cqi one is the fallback a browser without container queries
   keeps.

   The two square colours are custom properties on this component, which is the
   seam a club reskins through: photo/skin.css sets them to its own pair. The
   ink is deliberately NOT a brand token - a diagram's two piece colours are white
   and black in every club in the world.
   ============================================ */

.static-board[b-mreswwe134] {
    /* The editorial default: cream and sage, the board a club gets until its skin
       says otherwise. Both are chosen so the dark INK below clears 4.5:1 on either
       square (6.4:1 on the sage, 14.7:1 on the cream), because the file letters and
       rank numbers are small running text. */
    --board-light-square: #f0e6d2;
    --board-dark-square: #8aa06f;
    --board-white-piece: #ffffff;
    --board-ink: #17181a;

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    min-width: 0;
    max-width: 100%;
}

.board-squares[b-mreswwe134] {
    display: grid;
    /* Eight tracks that may shrink. repeat(8, 1fr) is minmax(auto, 1fr) and would
       grow to its content, which is the rule CssResponsivenessTests fails a file for. */
    grid-template-columns: repeat(8, minmax(0, 1fr));
    width: 100%;
    max-width: 22rem;
    aspect-ratio: 1 / 1;
    border: 2px solid var(--board-ink);
    /* The piece size is a proportion of THIS box, not of the window. */
    container-type: inline-size;
}

.board-square[b-mreswwe134] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.board-square.is-light[b-mreswwe134] {
    background: var(--board-light-square);
}

.board-square.is-dark[b-mreswwe134] {
    background: var(--board-dark-square);
}

.board-piece[b-mreswwe134] {
    /* The faces that actually carry U+265A-U+265F, newest first, ending at a generic
       family. All of them are already on the device: a diagram must not need a font
       from the network any more than it needs a piece image from one. */
    font-family: 'Segoe UI Symbol', 'Noto Sans Symbols 2', 'DejaVu Sans', 'Apple Symbols', 'Arial Unicode MS', serif;
    line-height: 1;
    font-size: 1.6rem;
    font-size: 9cqi;
    user-select: none;
}

/* The solid glyph painted light with a dark edge, which is how a white piece reads
   on a light square AND on a dark one. Four shadows are a one-pixel outline. */
.board-piece.is-white[b-mreswwe134] {
    color: var(--board-white-piece);
    text-shadow:
        1px 0 0 var(--board-ink),
        -1px 0 0 var(--board-ink),
        0 1px 0 var(--board-ink),
        0 -1px 0 var(--board-ink);
}

.board-piece.is-black[b-mreswwe134] {
    color: var(--board-ink);
    text-shadow:
        1px 0 0 var(--board-white-piece),
        -1px 0 0 var(--board-white-piece),
        0 1px 0 var(--board-white-piece),
        0 -1px 0 var(--board-white-piece);
}

/* The square's own name, written in the square - the board as a teaching grid. */
.square-name[b-mreswwe134] {
    font-family: var(--font-sans);
    font-size: 0.625rem;
    font-size: 3cqi;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--board-ink);
}

/* The edge coordinates, in the corner of the a-file and the first rank. */
.square-rank[b-mreswwe134],
.square-file[b-mreswwe134] {
    position: absolute;
    font-family: var(--font-sans);
    font-size: 0.5rem;
    font-size: 2.4cqi;
    font-weight: 700;
    line-height: 1;
    color: var(--board-ink);
}

.square-rank[b-mreswwe134] {
    top: 0.15rem;
    left: 0.2rem;
}

.square-file[b-mreswwe134] {
    right: 0.2rem;
    bottom: 0.15rem;
}

.board-caption[b-mreswwe134] {
    margin: 0;
    max-width: 22rem;
    text-align: center;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: var(--color-text-secondary);
}

.board-caption[b-mreswwe134]  code {
    font-family: 'Courier New', monospace;
    font-weight: 700;
    color: var(--cedar-green-light);
}
/* /Components/Shared/StepUpPrompt.razor.rz.scp.css */
/* The step-up prompt (#8165): a dialog over whatever page refused the action. */

.dialog-overlay[b-ldblbkt8nz] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-dialog);
    padding: 1rem;
}

.step-up-dialog[b-ldblbkt8nz] {
    background: var(--color-surface);
    color: var(--color-text);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    width: 100%;
    max-width: 26rem;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.step-up-title[b-ldblbkt8nz] {
    font-size: var(--font-size-xl);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow-wrap: anywhere;
}

.step-up-copy[b-ldblbkt8nz] {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--font-size-base);
    overflow-wrap: anywhere;
}

.step-up-label[b-ldblbkt8nz] {
    display: block;
    font-weight: 600;
    font-size: var(--font-size-sm);
    margin-bottom: 0.5rem;
}

[b-ldblbkt8nz] .step-up-input {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1.5px solid var(--color-gray-light);
    border-radius: var(--radius-md);
    font-size: var(--font-size-lg);
    letter-spacing: 0.15em;
    font-family: var(--font-sans);
    background: var(--color-surface);
    color: var(--color-text);
    box-sizing: border-box;
}

[b-ldblbkt8nz] .step-up-input:focus {
    outline: 2px solid var(--cedar-green);
    outline-offset: 1px;
}

.step-up-error[b-ldblbkt8nz] {
    margin: 0.5rem 0 0;
    color: var(--color-error);
    font-size: var(--font-size-sm);
}

.step-up-actions[b-ldblbkt8nz] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

.step-up-primary[b-ldblbkt8nz],
.step-up-secondary[b-ldblbkt8nz] {
    flex: 1 1 10rem;
    min-width: 0;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-md);
    font-size: var(--font-size-base);
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border: 1.5px solid var(--cedar-green);
}

.step-up-primary[b-ldblbkt8nz] {
    background: var(--cedar-green);
    color: var(--color-white);
}

.step-up-secondary[b-ldblbkt8nz] {
    background: var(--color-surface);
    color: var(--cedar-green);
}

.step-up-primary:disabled[b-ldblbkt8nz],
.step-up-secondary:disabled[b-ldblbkt8nz] {
    opacity: 0.6;
    cursor: not-allowed;
}

.step-up-link[b-ldblbkt8nz] {
    background: none;
    border: none;
    padding: 0;
    color: var(--cedar-green);
    text-decoration: underline;
    cursor: pointer;
    font-size: var(--font-size-sm);
    align-self: flex-start;
}

.step-up-link:disabled[b-ldblbkt8nz] {
    opacity: 0.6;
    cursor: not-allowed;
}
/* /Components/Shared/SuccessMessage.razor.rz.scp.css */
/* An announced message's live region (#8444, #8443 review 2) is in the page before its message is. Empty, it is taken
   out of the flow, so it takes no place in the layout - in a grid it would be a row of its own, with a gap - and it
   stays in the accessibility tree, as it must to be heard: display: none would take it out, and a region that
   appears with its text already in it is not announced. With a message it is an ordinary block again. */
.success-region:empty[b-68cz38e8bo] {
    position: absolute;
}

.success-message[b-68cz38e8bo] {
    background: #d1fae5;
    border-left: 4px solid #10b981;
    border-radius: 0.375rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.success-icon[b-68cz38e8bo] {
    background: #10b981;
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    flex-shrink: 0;
}

.success-content[b-68cz38e8bo] {
    flex: 1;
}

.success-title[b-68cz38e8bo] {
    font-weight: 600;
    color: #065f46;
    margin: 0 0 0.25rem 0;
}

.success-text[b-68cz38e8bo] {
    color: #047857;
    margin: 0;
    font-size: 0.875rem;
}
/* /Components/Shared/TcaRequirementNotice.razor.rz.scp.css */
/* #8296: the TCA-required notice on an event page. Brand colors come from the skin's tokens. */
.tca-notice[b-s7mu45afqr] {
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    padding: 1rem 1.25rem;
    margin: 0 0 1.5rem 0;
    background: rgba(var(--wilson-blue-rgb), 0.06);
    border-left: 3px solid var(--wilson-blue);
}

.tca-notice i[b-s7mu45afqr] {
    color: var(--wilson-blue);
    font-size: 1.375rem;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.tca-notice strong[b-s7mu45afqr] {
    display: block;
    color: var(--wilson-blue);
    font-family: var(--font-display);
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 0.05em;
    overflow-wrap: anywhere;
}

.tca-notice p[b-s7mu45afqr] {
    margin: 0.25rem 0 0 0;
    color: #374151;
    font-size: 0.9375rem;
    line-height: 1.55;
}

.tca-notice a[b-s7mu45afqr] {
    color: var(--wilson-blue);
    font-weight: 600;
    text-decoration: underline;
    overflow-wrap: anywhere;
}

/* /Components/Shared/ThemeToggle.razor.rz.scp.css */
.theme-toggle-container[b-tkvx9vptoc] {
    display: flex;
    align-items: center;
}

.theme-switch[b-tkvx9vptoc] {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 32px;
    cursor: pointer;
}

.theme-switch input[b-tkvx9vptoc] {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider[b-tkvx9vptoc] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.2);
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 34px;
    transition: all var(--transition-base);
    backdrop-filter: blur(10px);
}

.slider[b-tkvx9vptoc]::before {
    content: "";
    position: absolute;
    height: 24px;
    width: 24px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    border-radius: 50%;
    transition: all var(--transition-base);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.slider-icon[b-tkvx9vptoc] {
    position: absolute;
    top: 50%;
    font-size: 14px;
    line-height: 1;
    transition: all var(--transition-base);
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

input:not(:checked) + .slider .slider-icon[b-tkvx9vptoc] {
    left: 6px;
    transform: translateY(-50%);
}

input:checked + .slider .slider-icon[b-tkvx9vptoc] {
    right: 6px;
    left: auto;
    transform: translateY(-50%);
}

input:checked + .slider[b-tkvx9vptoc] {
    background-color: rgba(59, 130, 246, 0.3);
    border-color: rgba(59, 130, 246, 0.5);
}

input:checked + .slider[b-tkvx9vptoc]::before {
    transform: translateX(28px);
    background-color: #3b82f6;
}

.theme-switch:hover .slider[b-tkvx9vptoc] {
    background-color: rgba(255, 255, 255, 0.3);
}

input:checked + .slider:hover[b-tkvx9vptoc] {
    background-color: rgba(59, 130, 246, 0.4);
}

.theme-switch:active .slider[b-tkvx9vptoc]::before {
    width: 28px;
}
/* /Components/Shared/TodaysEventAlert.razor.rz.scp.css */
/* ============================================
   Today's Event Alert - Editorial Style
   ============================================ */

.todays-event-alert[b-xx4hn6tz5x] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 4rem;
}

.alert-container[b-xx4hn6tz5x] {
    background: var(--cedar-green);
    padding: 3rem 4rem;
    border: none;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
}

.alert-header[b-xx4hn6tz5x] {
    display: flex;
    align-items: baseline;
    gap: 2rem;
}

.alert-badge[b-xx4hn6tz5x] {
    font-family: var(--font-display);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.6);
    padding: 0;
    background: transparent;
    border: none;
}

.alert-title[b-xx4hn6tz5x] {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: -0.01em;
}

.alert-events[b-xx4hn6tz5x] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.alert-event-item[b-xx4hn6tz5x] {
    display: flex;
    align-items: baseline;
    gap: 1rem;
    color: rgba(255, 255, 255, 0.9);
}

.alert-event-item strong[b-xx4hn6tz5x] {
    font-weight: 700;
    color: #ffffff;
}

.alert-event-item span[b-xx4hn6tz5x] {
    font-size: 0.875rem;
    color: rgba(255, 255, 255, 0.7);
}

.alert-link[b-xx4hn6tz5x] {
    font-family: var(--font-display);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--cedar-green);
    background: #ffffff;
    padding: 1rem 2rem;
    border: 2px solid #ffffff;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.alert-link:hover[b-xx4hn6tz5x] {
    background: transparent;
    color: #ffffff;
    border-color: #ffffff;
}

/* Responsive */
@media (max-width: 768px) {
    .alert-container[b-xx4hn6tz5x] {
        flex-direction: column;
        align-items: stretch;
        padding: 2rem 1.5rem;
    }

    .alert-header[b-xx4hn6tz5x] {
        flex-direction: column;
        gap: 1rem;
    }

    .alert-link[b-xx4hn6tz5x] {
        text-align: center;
    }
}
/* /Components/Shared/TopBarNavigation.razor.rz.scp.css */
/* ============================================
   Top Bar Navigation - the photo skin's nav (#7560)
   Structure only; #7561 sets the look.
   ============================================ */

.topbar[b-6t6t9mmdsx] {
    background: var(--color-dark);
    color: #ffffff;
    width: 100%;
    border-bottom: 3px solid var(--wheat-gold);
}

.topbar-inner[b-6t6t9mmdsx] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 2rem;
    height: 76px;
    display: flex;
    align-items: center;
    gap: 2rem;
}

.topbar-brand[b-6t6t9mmdsx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: #ffffff;
    flex-shrink: 0;
}

.topbar-brand[b-6t6t9mmdsx]  .topbar-logo {
    height: 48px;
    width: auto;
}

.topbar-title[b-6t6t9mmdsx] {
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.topbar-title[b-6t6t9mmdsx]  .topbar-accent {
    color: var(--wheat-gold);
}

.topbar-links[b-6t6t9mmdsx] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex: 1;
}

.topbar-link[b-6t6t9mmdsx] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.55rem 0.85rem;
    border-radius: var(--radius-md);
    color: rgba(255, 255, 255, 0.88);
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    background: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--transition-fast), color var(--transition-fast);
}

.topbar-link:hover[b-6t6t9mmdsx],
.topbar-link:focus-visible[b-6t6t9mmdsx],
.topbar-dropdown-toggle[aria-expanded="true"][b-6t6t9mmdsx] {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.topbar-chevron[b-6t6t9mmdsx] {
    font-size: 0.65rem;
    opacity: 0.7;
}

.topbar-dropdown[b-6t6t9mmdsx] {
    position: relative;
}

.topbar-menu[b-6t6t9mmdsx] {
    display: none;
    position: absolute;
    top: calc(100% + 0.5rem);
    left: 0;
    min-width: 220px;
    padding: 0.5rem;
    background: #ffffff;
    color: var(--color-text);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xl);
    z-index: 1100;
}

.topbar-menu.open[b-6t6t9mmdsx] {
    display: block;
}

.topbar-dropdown-right .topbar-menu[b-6t6t9mmdsx] {
    left: auto;
    right: 0;
}

.topbar-menu-wide[b-6t6t9mmdsx] {
    display: none;
    grid-template-columns: repeat(5, minmax(160px, 1fr));
    gap: 1.25rem;
    min-width: 0;
    width: max-content;
    max-width: min(1100px, calc(100vw - 4rem));
    padding: 1.25rem 1.5rem;
}

.topbar-menu-wide.open[b-6t6t9mmdsx] {
    display: grid;
}

.topbar-menu-column[b-6t6t9mmdsx] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.topbar-menu-heading[b-6t6t9mmdsx] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-text-secondary);
    padding: 0.5rem 0.65rem 0.25rem;
}

.topbar-menu-item[b-6t6t9mmdsx] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.65rem;
    border-radius: var(--radius-sm);
    color: var(--color-text);
    font-size: 0.92rem;
    text-decoration: none;
    white-space: nowrap;
}

.topbar-menu-item:hover[b-6t6t9mmdsx],
.topbar-menu-item:focus-visible[b-6t6t9mmdsx] {
    background: var(--color-gray-lightest);
}

.topbar-menu-item i[b-6t6t9mmdsx] {
    width: 1.1rem;
    text-align: center;
    color: var(--color-text-secondary);
}

.topbar-menu-button[b-6t6t9mmdsx] {
    width: 100%;
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
}

.topbar-account[b-6t6t9mmdsx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
}

.topbar-join[b-6t6t9mmdsx] {
    display: inline-flex;
    align-items: center;
    padding: 0.6rem 1.25rem;
    border-radius: var(--radius-full);
    background: var(--wheat-gold);
    color: var(--color-dark);
    font-family: var(--font-sans);
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: filter var(--transition-fast);
}

.topbar-join:hover[b-6t6t9mmdsx],
.topbar-join:focus-visible[b-6t6t9mmdsx] {
    filter: brightness(1.08);
}

/* ---- Mobile header: identical geometry to the editorial one, so MobileMenu (fixed at 70px) fits. ---- */

.mobile-header[b-6t6t9mmdsx] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 70px;
    background: var(--color-dark);
    color: #ffffff;
    border-bottom: 3px solid var(--wheat-gold);
    z-index: 1002;
    padding: 0 1rem;
    align-items: center;
    justify-content: space-between;
}

.mobile-header-brand[b-6t6t9mmdsx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
    color: #ffffff;
    min-width: 0;
}

.mobile-header-brand[b-6t6t9mmdsx]  .mobile-header-logo {
    height: 44px;
    width: auto;
}

.mobile-header-title[b-6t6t9mmdsx] {
    font-family: var(--font-display);
    font-size: 1.05rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mobile-menu-toggle[b-6t6t9mmdsx] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 8px;
    background: none;
    border: none;
    cursor: pointer;
}

.hamburger-line[b-6t6t9mmdsx] {
    display: block;
    height: 2px;
    width: 100%;
    background: #ffffff;
    border-radius: 2px;
}

.mobile-menu-container[b-6t6t9mmdsx] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1050;
}

@media (max-width: 968px) {
    .topbar[b-6t6t9mmdsx] {
        display: none;
    }

    .mobile-header[b-6t6t9mmdsx] {
        display: flex;
    }
}
/* /Components/Shared/TwoFactorRequirementBanner.razor.rz.scp.css */
/* The administrator's two-factor requirement notice (#8165): one line in the banner stack. */

.two-factor-requirement-banner[b-d16fhj2t7o] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    background: var(--wheat-gold);
    color: var(--cedar-green);
    border-bottom: 2px solid rgba(0, 0, 0, 0.15);
    font-size: var(--font-size-sm);
    line-height: 1.5;
}

.two-factor-requirement-banner.in-force[b-d16fhj2t7o] {
    background: var(--tobacco-barn-red);
    color: var(--color-white);
}

.two-factor-requirement-text[b-d16fhj2t7o] {
    flex: 1 1 16rem;
    min-width: 0;
    overflow-wrap: anywhere;
}

.two-factor-requirement-link[b-d16fhj2t7o] {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
    white-space: nowrap;
}
