/* 1. IMPORT BLOOMERANG'S BUILT-IN FORM STRUCTURE */
@import url('https://crm.bloomerang.co/Content/Css/HostedDonation.css');

/* 2. IMPORT GRAND CENTRAL ATELIER FONTS */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600&display=swap');

/* =========================================================
   3. GRAND CENTRAL ATELIER STYLE OVERRIDES 
   ========================================================= */

/* --- Hide the Secure Banner & Redundant Heading --- */
.secureBanner, 
a[href*="donate-securely-bloomerang"],
.b-form section h1,
section h1 {
    display: none !important;
}

/* --- Page Background (GCA Gold Wash) --- */
body {
    background-color: rgba(184, 150, 93, 0.15) !important;
    padding-top: 40px !important;
    padding-bottom: 60px !important;
}

/* Make the master layout wrapper transparent */
.container, .donation-page-container {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding-bottom: 40px !important;
}

/* --- The Form and Sidebar "Cards" --- */
.col-md-8 > div:first-child, 
.col-md-4 > div:first-child,
#bloomerangForm {
    background-color: #ffffff !important;
    padding: 40px !important;
    border-radius: 2px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.04) !important; 
    margin-bottom: 40px !important;
    border: 1px solid #eaeaea;
}

/* --- Fix the Logo Size & Spacing --- */
header img, .b-form header img {
    max-width: 260px !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto 40px auto !important;
}

/* --- Typography & Base Font --- */
body, #bloomerangForm, .bloomerang-form {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    color: #333333;
}

/* --- Refined Section Headings (Scoped to container) --- */
.donation-page-container h2, 
.donation-page-container h3, 
.donation-page-container .section-header, 
.donation-page-container .donation-title, 
.donation-page-container legend {
    font-family: 'Playfair Display', 'Georgia', serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    color: #444444 !important;
    border-bottom: 1px solid #eeeeee !important;
    padding-bottom: 12px !important;
    margin-bottom: 25px !important;
    margin-top: 35px !important;
}

/* Rename "Donation" to "Make Your Pledge" */
#bloomerangForm fieldset:first-of-type legend,
#bloomerangForm legend:first-of-type {
    font-size: 0 !important; 
}
#bloomerangForm fieldset:first-of-type legend::before,
#bloomerangForm legend:first-of-type::before {
    content: "Make Your Pledge";
    font-size: 18px !important;
}

/* First heading doesn't need huge top margin */
#bloomerangForm h2:first-of-type,
#bloomerangForm legend:first-of-type {
    margin-top: 0 !important;
}

/* Sidebar Questions Heading */
.col-md-4 h2, .donation-sidebar h2, .orgInfo h2 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* --- Form Field Spacing & Labels (Scoped to container) --- */
.donation-page-container .form-group {
    margin-bottom: 22px !important;
}

.donation-page-container label, 
.donation-page-container .control-label {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    color: #555555 !important;
    margin-bottom: 6px !important;
    display: block !important;
}

/* --- Inputs (Text, Email, Phone, Dropdowns) Scoped to container --- */
.donation-page-container .form-control, 
.donation-page-container input[type="text"], 
.donation-page-container input[type="email"], 
.donation-page-container input[type="tel"], 
.donation-page-container input[type="number"], 
.donation-page-container select, 
.donation-page-container textarea {
    box-shadow: none !important;
    border: 1px solid #cccccc !important;
    border-radius: 0 !important; 
    padding: 12px 15px !important;
    height: auto !important;
    font-size: 15px !important;
    background-color: #fcfcfc !important;
    transition: all 0.3s ease !important;
    width: 100% !important; 
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 10px !important;
}

.donation-page-container .form-control:focus,
.donation-page-container input:focus,
.donation-page-container select:focus {
    border-color: #333333 !important;
    background-color: #ffffff !important;
    outline: none !important;
}

/* --- Donation Amount Buttons (Scoped to container) --- */
.donation-page-container .btn-default, 
.donation-page-container .donation-level-btn, 
.donation-page-container .donation-level-container .btn {
    background-color: #ffffff !important;
    color: #333333 !important;
    border: 1px solid #cccccc !important;
    font-size: 16px !important;
    font-family: 'Playfair Display', 'Georgia', serif !important;
    border-radius: 0 !important;
    transition: all 0.2s ease !important;
    margin-bottom: 10px !important;
    padding: 12px 20px !important;
}

.donation-page-container .btn-default:hover, 
.donation-page-container .donation-level-btn:hover {
    border-color: #000000 !important;
    background-color: #f9f9f9 !important;
}

/* Selected Donation Amount */
.donation-page-container .btn-default.active, 
.donation-page-container .btn-default:active,
.donation-page-container .btn-default:focus,
.donation-page-container .donation-level-btn.active,
.donation-page-container .btn-default.selected {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
    box-shadow: none !important;
}

/* --- Submit/Donate Button (Scoped to container) --- */
.donation-page-container .btn-primary, 
.donation-page-container .btn-success, 
.donation-page-container button[type="submit"], 
.donation-page-container #submit-btn {
    background-color: #000000 !important;
    color: #ffffff !important;
    font-family: 'Playfair Display', 'Georgia', serif !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 15px !important;
    padding: 16px 30px !important;
    border: none !important;
    border-radius: 0 !important;
    transition: background-color 0.3s ease !important;
    white-space: normal !important;
    margin-top: 25px !important;
    margin-bottom: 10px !important;
    width: 100% !important;
}

.donation-page-container .btn-primary:hover, 
.donation-page-container .btn-success:hover, 
.donation-page-container button[type="submit"]:hover {
    background-color: #444444 !important;
}

/* --- Checkboxes and Radios (Scoped to container) --- */
.donation-page-container input[type="radio"], 
.donation-page-container input[type="checkbox"] {
    accent-color: #000000 !important;
    margin-right: 8px !important;
}

.donation-page-container .checkbox label, 
.donation-page-container .radio label {
    text-transform: none !important; 
    letter-spacing: normal !important;
    font-size: 14px !important;
}

/* --- Error States (Scoped to container) --- */
.donation-page-container .has-error .form-control {
    border-color: #8b0000 !important;
}
.donation-page-container .has-error .help-block, 
.donation-page-container .has-error .control-label {
    color: #8b0000 !important;
}