/**
 * checkout-theme.css - Boylston Chess Foundation brand colors applied to
 * the tournament registration/checkout form.
 *
 * Usage: add class="bcc-checkout" to the outer <div class="container py-4">
 * in Views/Registration/Register.cshtml (the element wrapping
 * CheckoutStepIndicator, StepPanel1/2/3, and the Order Summary card).
 * Everything here is scoped under that class so it only affects this
 * form, not the rest of the site.
 */

.bcc-checkout {
    --bcc-navy: #0a3d7a; /* slightly deepened from the raw #005DB8 for better contrast on white */
    --bcc-navy-dark: #072a56; /* hover/active state */
    --bcc-gold: #e8b93e; /* deepened from the raw shield gold (#FDE072) for text/border legibility */
    --bcc-gold-light: #fdf3d7; /* subtle gold backgrounds */
    --bcc-header-bg: #ebf0f7;
}

    /* ---- Step indicator tabs ---- */
    .bcc-checkout .nav-link.js-step-indicator.active {
        background-color: var(--bcc-navy) !important;
        border-color: var(--bcc-navy) !important;
        color: #fff !important;
    }

    .bcc-checkout .js-step-indicator .badge.bg-primary {
        background-color: var(--bcc-navy) !important;
    }

    .bcc-checkout .js-step-indicator.text-success,
    .bcc-checkout .js-step-indicator .badge.bg-success {
        /* completed steps: keep distinct from "active" navy, gold reads as
       "done" without competing with the green $ total */
        color: var(--bcc-gold) !important;
    }

    .bcc-checkout .js-step-indicator .badge.bg-success {
        background-color: var(--bcc-gold) !important;
        color: var(--bcc-navy) !important;
    }

    /* ---- Step panel headers, e.g. "Step 3: Review & Payment"
   (.card-header.bg-primary on StepPanel1/2/3) ---- */
    .bcc-checkout .card-header.bg-primary {
        background-color: var(--bcc-navy) !important;
    }

    /* ---- Order Summary card header (was solid black .bg-dark) ---- */
    .bcc-checkout .card-header.bg-dark {
        background-color: var(--bcc-navy) !important;
    }

    /* ---- Links / section badges ---- */
    .bcc-checkout a,
    .bcc-checkout .text-primary {
        color: var(--bcc-navy) !important;
    }

        .bcc-checkout a:hover {
            color: var(--bcc-navy-dark) !important;
        }

    /* Section badge on review cards, e.g. "250 Section" - navy reads as a
   brand accent here. Left step-tab .badge.bg-secondary (steps not yet
   visited) untouched on purpose: default gray is a useful "not active
   yet" signal distinct from the review card's informational badge. */
    .bcc-checkout #ReviewPlayersSummary .badge.bg-secondary,
    .bcc-checkout #ActivePlayerBadge {
        background-color: var(--bcc-navy) !important;
        color: #fff !important;
    }

    /* ---- Payment method selection: highlight the whole card, not just
   the checkbox/radio row, when selected ---- */
    .bcc-checkout .js-payment-toggle:checked {
        accent-color: var(--bcc-navy);
    }

    .bcc-checkout .payment-card:has(.js-payment-toggle:checked) {
        border-color: var(--bcc-navy) !important;
        background-color: var(--bcc-gold-light);
    }

    /* ---- Financial assistance banner (was Bootstrap's default .alert-info
   blue) ---- */
    .bcc-checkout .alert-info {
        background-color: var(--bcc-gold-light) !important;
        border: 1px solid var(--bcc-gold) !important;
        color: var(--bcc-navy);
    }

        .bcc-checkout .alert-info .alert-link,
        .bcc-checkout .js-trigger-assistance {
            color: var(--bcc-navy) !important;
        }

    /* ---- Total due: keep green, it's a strong enough "money" convention
   to preserve even off brand-palette ---- */
    .bcc-checkout #CartTotalAmount {
        color: #198754;
    }

    /* ---- Submit button: gold as the CTA accent, ties back to the crest ---- */
    .bcc-checkout #BtnSubmitRegistration {
        background-color: var(--bcc-gold) !important;
        border-color: var(--bcc-gold) !important;
        color: var(--bcc-navy) !important;
        font-weight: 700;
    }

        .bcc-checkout #BtnSubmitRegistration:hover:not(:disabled) {
            background-color: #d9a82c !important;
            border-color: #d9a82c !important;
        }

        .bcc-checkout #BtnSubmitRegistration:disabled {
            background-color: #e9dcae !important;
            border-color: #e9dcae !important;
            color: var(--bcc-navy) !important;
            opacity: 0.85;
        }

    /* ---- Review cards (step 3 player summary) ---- */
    .bcc-checkout #ReviewPlayersSummary .card {
        border-color: #dde3ec !important;
    }