/*
 * Registration form card, styled after the Contact Us form (cu2) and the
 * Speak-A-Thon form. Wrap a form in .bf-card and it restyles the Bootstrap
 * markup inside (labels, .form-control, .form-select, .form-check, alerts),
 * so field ids and each page's validation script stay untouched.
 */
.bf-card {
    --maroon: #b73b53;
    --maroon-deep: #7a2236;
    --ink: #3b211b;
    --ink-soft: #6b5048;
    --rule: rgba(59, 33, 27, .14);
    background: #fff;
    border-radius: 18px;
    padding: 36px 32px;
    box-shadow: 0 18px 40px rgba(59, 33, 27, .1);
    border: 1px solid var(--rule);
    text-align: left;
    color: var(--ink);
}
@media (max-width: 575px) { .bf-card { padding: 28px 20px; } }

.bf-title { font-family: "Platypi", Georgia, serif; font-size: 25px; font-weight: 700; color: var(--maroon-deep); margin: 0 0 4px; }
.bf-sub { font-size: 14px; color: var(--ink-soft); margin: 0 0 20px; }
.bf-sub strong { color: var(--ink); }
.bf-card .req, .bf-card label .text-danger { color: var(--maroon) !important; }

.bf-section {
    font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--maroon); margin: 26px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--rule);
}

/* Labels */
.bf-card label,
.bf-card .form-label {
    display: block; font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 6px;
}
.bf-card .form-check-label { display: inline; font-weight: 500; margin-bottom: 0; }
/* A bare label right after a radio/checkbox stays on the same line as it */
.bf-card input[type="radio"] + label,
.bf-card input[type="checkbox"] + label {
    display: inline-block; vertical-align: middle; font-weight: 500; margin: 0 18px 0 6px;
}
.bf-card input[type="radio"],
.bf-card input[type="checkbox"] { vertical-align: middle; }

/* Text inputs, selects, textareas, file pickers */
.bf-card .form-control,
.bf-card .form-select,
.bf-card select,
.bf-card textarea,
.bf-card input[type="text"],
.bf-card input[type="email"],
.bf-card input[type="tel"],
.bf-card input[type="url"],
.bf-card input[type="number"],
.bf-card input[type="date"],
.bf-card input[type="file"] {
    font: inherit; font-size: 15.5px; line-height: 1.4; color: var(--ink);
    background-color: #fbfaf9; border: 1.5px solid var(--rule); border-radius: 10px;
    padding: 12px 14px; width: 100%; height: auto; box-shadow: none;
    transition: border-color .15s, background-color .15s, box-shadow .15s;
}
.bf-card .form-select,
.bf-card select { padding-right: 36px; }
.bf-card input[type="file"] { padding: 9px 12px; font-size: 14px; }
.bf-card textarea { resize: vertical; min-height: 96px; }
.bf-card input::placeholder,
.bf-card textarea::placeholder { color: #a8968f; }
.bf-card .form-control:focus,
.bf-card .form-select:focus,
.bf-card select:focus,
.bf-card textarea:focus,
.bf-card input:focus {
    outline: none; border-color: var(--maroon); background-color: #fff; box-shadow: 0 0 0 3px rgba(183, 59, 83, .15);
}

/* Radios and checkboxes */
.bf-card .form-check { display: flex; gap: 10px; align-items: flex-start; padding-left: 0; margin-bottom: 8px; min-height: 0; }
.bf-card .form-check-inline { display: inline-flex; margin-right: 18px; }
.bf-card .form-check .form-check-input { float: none; margin: 2px 0 0; }
.bf-card input[type="checkbox"],
.bf-card input[type="radio"] {
    width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--maroon); cursor: pointer;
}
.bf-card .form-check-input:checked { background-color: var(--maroon); border-color: var(--maroon); }
.bf-card .form-check-input:focus { box-shadow: 0 0 0 3px rgba(183, 59, 83, .15); border-color: var(--maroon); }

/* Bordered groups (declarations, consent) */
.bf-card .border.rounded,
.bf-box {
    background: #fbfaf9; border: 1.5px solid var(--rule) !important; border-radius: 12px !important; padding: 16px 18px !important;
}

/* Messages */
.bf-card .error-message,
.bf-card span.text-danger,
.bf-card div.text-danger,
.bf-card p.text-danger { display: block; font-size: 13px; color: #b42318 !important; margin-top: 5px; }
/* ...but the required-field star inside a label stays inline */
.bf-card label .text-danger { display: inline; font-size: inherit; margin: 0; color: var(--maroon) !important; }
.bf-card .alert-danger { background: #fdecec; border: 1px solid #f5c2c0; color: #8a1c1c; border-radius: 10px; padding: 12px 14px; font-size: 14px; margin-bottom: 18px; }
.bf-card .alert-warning { background: #fff6e5; border: 1px solid #f1d39a; color: #6b4a12; border-radius: 10px; padding: 12px 14px; font-size: 14px; }
.bf-card .alert-success { border-radius: 10px; font-size: 14px; }
.bf-card .form-text,
.bf-card small.text-muted,
.bf-card span.text-muted { font-size: 12.5px; color: var(--ink-soft) !important; }

/* Submit */
.bf-submit {
    display: block; width: 100%; border: 0; border-radius: 12px; background: #b73b53; color: #fff;
    font-family: "Platypi", Georgia, serif; font-size: 19px; font-weight: 600;
    padding: 15px 20px; margin-top: 8px; cursor: pointer; transition: background .15s;
}
.bf-submit:hover, .bf-submit:focus { background: #7a2236; color: #fff; }
.bf-submit:disabled { opacity: .7; cursor: wait; }

/* Closed-registration overlay sits over the card's rounded corners */
.bf-card .form-overlay { border-radius: 12px; }