/* Bout Approvals page — single column, show-grouped, mobile-first. */

.ba-shell {
    max-width: 680px;
    margin: 0 auto;
    padding: 8px 0 64px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ba-eyebrow {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 700;
}

.ba-title {
    font-size: var(--xal-font-2xl, 24px);
    font-weight: 900;
    margin: 2px 0 4px;
}

.ba-lede {
    margin: 0;
    color: var(--xal-text-muted);
    font-size: var(--xal-font-sm);
    font-weight: 600;
}

/* Show group + clear divider header (sticky so the coach never loses context) */
.ba-show {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 18px;
}

.ba-show__header {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--xal-bg-page);
    border-bottom: 2px solid var(--xal-gold-border);
    padding: 12px 0 10px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.ba-show__name {
    font-size: var(--xal-font-xl);
    font-weight: 900;
    line-height: 1.1;
}

.ba-show__meta {
    font-size: var(--xal-font-sm);
    font-weight: 600;
    color: var(--xal-text-muted);
    margin-top: 3px;
}

.ba-show__actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Bout-weight medallion (scheduled/contracted bout weight) */
.ba-weight {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--xal-gold-muted);
    border: 1px solid var(--xal-gold-border);
    border-radius: var(--xal-radius-sm);
    min-width: 54px;
    padding: 5px 8px;
    flex-shrink: 0;
}

.ba-weight__value {
    font-size: var(--xal-font-lg);
    font-weight: 900;
    color: var(--xal-gold);
    line-height: 1;
}

.ba-weight__label {
    font-size: var(--xal-t-kpi-label-size);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--xal-gold);
    opacity: .75;
    margin-top: 2px;
}

/* Coach's own fighter — gold border only (no fill) */
.ba-mine {
    border: 1px solid var(--xal-gold-border);
    border-radius: var(--xal-radius-sm);
    padding: 8px 8px 10px;
}

.ba-mine-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    padding: 2px 7px;
    border-radius: var(--xal-radius-pill);
    background: var(--xal-gold);
    color: #000;
    font-size: var(--xal-font-xs);
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

/* Denying card accent */
.ba-card--denying {
    border-color: var(--xal-status-unmatched-border);
}

.ba-card--decided {
    opacity: .9;
}

.ba-card__header--flat {
    border-bottom: none;
}

/* Compact decision row */
.ba-decision {
    display: flex;
    gap: 8px;
    padding: 10px 14px 12px;
    border-top: 1px solid var(--xal-border);
}

.ba-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px;
    border-radius: var(--xal-radius-sm);
    border: 1px solid var(--xal-border-card);
    background: var(--xal-bg-hover);
    color: var(--xal-text-secondary);
    font-family: var(--xal-font-family);
    font-size: var(--xal-font-base);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    cursor: pointer;
}

.ba-btn--accept-active {
    background: var(--xal-gold);
    color: #000;
    border-color: var(--xal-gold);
}

.ba-btn--deny-active {
    background: var(--xal-status-unmatched-bg);
    color: var(--xal-status-unmatched);
    border-color: var(--xal-status-unmatched-border);
}

/* Denial reason reveal */
.ba-reason {
    padding: 12px 14px;
    border-top: 1px solid var(--xal-border);
}

.ba-reason__label {
    font-size: var(--xal-font-sm);
    font-weight: 700;
    color: var(--xal-text-secondary);
    margin-bottom: 8px;
    display: block;
}

.ba-reason__chips {
    gap: 6px;
}

.ba-reason__note {
    margin-top: 10px;
}

.ba-flag {
    color: var(--xal-red-bright);
    font-weight: 800;
}

/* Anchor offset so #bout-{id} deep-links land below the sticky show header */
.xal-bout-card {
    scroll-margin-top: 88px;
}

/* Applied by scrollInterop.scrollToBout when a ?bout= deep link lands: a brief gold ring so
   the coach sees which card the email/SMS link meant. The class is removed after ~2.5s. */
.xal-bout-card--linked {
    animation: xal-bout-linked-pulse 2.5s ease-out;
}

@keyframes xal-bout-linked-pulse {
    0%, 60% { box-shadow: 0 0 0 2px var(--xal-gold); }
    100% { box-shadow: 0 0 0 2px transparent; }
}

@media (prefers-reduced-motion: reduce) {
    .xal-bout-card--linked {
        animation: none;
        box-shadow: 0 0 0 2px var(--xal-gold);
    }
}

/* The compact matched-card header carries an action cluster (Tale of the Tape / Withdraw) —
   let it wrap instead of overlapping the title on narrow viewports. */
.xal-bout-card__header {
    flex-wrap: wrap;
}