/**
 * BBBSRI Donation Scheduler - Form Styles
 * Builds on top of theme styles. Form sits on a white background.
 * Uses !important to prevent theme overrides.
 */

/* ========================================
   Form Field Inputs
   ======================================== */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="number"],
.gform_wrapper select,
.gform_wrapper textarea {
    border: 1px solid var(--theme-color-bd_color, #97999b) !important;
    background-color: #fff !important;
    color: var(--theme-color-text_dark, #101010) !important;
}

.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper input[type="password"]:focus,
.gform_wrapper input[type="number"]:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
    border-color: var(--theme-color-text_link, #00fc87) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px var(--theme-color-text_link_02, rgba(0, 252, 135, 0.2)) !important;
}

.gform_wrapper input[readonly] {
    background-color: #f5f5f5 !important;
    color: var(--theme-color-text_light, #97999b) !important;
}

/* Labels */
.gform_wrapper .gfield_label {
    color: var(--theme-color-text_dark, #101010) !important;
    font-weight: 600 !important;
}

.gform_wrapper .gfield_description {
    color: var(--theme-color-text_light, #97999b) !important;
    font-size: 0.875rem !important;
}

.gform_wrapper .gfield_required {
    color: #dc3545 !important;
}

/* Radio & Checkbox labels */
.gform_wrapper .gfield_radio .gchoice label,
.gform_wrapper .gfield_checkbox .gchoice label {
    color: var(--theme-color-text_dark, #101010) !important;
}

.gform_wrapper .gfield_radio input[type="radio"],
.gform_wrapper .gfield_checkbox input[type="checkbox"] {
    accent-color: var(--theme-color-text_link, #00fc87) !important;
}

/* Donation type radio cards */
.bbbsri-donation-type .gfield_radio .gchoice {
    padding: 0.75rem !important;
    border: 1px solid var(--theme-color-bd_color, #97999b) !important;
    margin-bottom: 0.5rem !important;
    transition: border-color 0.2s !important;
}

.bbbsri-donation-type .gfield_radio .gchoice:hover {
    border-color: var(--theme-color-text_link, #00fc87) !important;
}

/* ========================================
   Navigation Buttons
   ======================================== */
.gform_page_footer .gform_next_button,
.gform_page_footer .gform_button {
    background-color: var(--theme-color-text_link, #00fc87) !important;
    color: var(--theme-color-inverse_link, #000) !important;
    border: none !important;
    cursor: pointer !important;
    transition: opacity 0.2s !important;
}

.gform_page_footer .gform_next_button:hover,
.gform_page_footer .gform_button:hover {
    opacity: 0.85 !important;
}

.gform_page_footer .gform_previous_button {
    background-color: transparent !important;
    color: var(--theme-color-text_dark, #101010) !important;
    border: 1px solid var(--theme-color-bd_color, #97999b) !important;
    cursor: pointer !important;
    transition: border-color 0.2s, color 0.2s !important;
}

.gform_page_footer .gform_previous_button:hover {
    border-color: var(--theme-color-text_link, #00fc87) !important;
    color: var(--theme-color-text_link, #00fc87) !important;
}

/* ========================================
   Validation Errors
   ======================================== */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea {
    border-color: #dc3545 !important;
}

.gform_wrapper .validation_message {
    color: #dc3545 !important;
    font-size: 0.875rem !important;
}

.gform_wrapper .gform_validation_errors {
    border: 1px solid #dc3545 !important;
    background-color: rgba(220, 53, 69, 0.08) !important;
    color: var(--theme-color-text_dark, #101010) !important;
}

/* ========================================
   Date List Table
   ======================================== */
.bbbsri-date-list {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 1rem 0 !important;
}

.bbbsri-date-list thead th {
    background-color: #f5f5f5 !important;
    padding: 0.75rem 1rem !important;
    text-align: left !important;
    font-family: var(--theme-font-h5_font-family, inherit) !important;
    font-weight: var(--theme-font-h5_font-weight, 600) !important;
    text-transform: var(--theme-font-h5_text-transform, uppercase) !important;
    letter-spacing: var(--theme-font-h5_letter-spacing, 0.58px) !important;
    font-size: 0.9rem !important;
    color: var(--theme-color-text_dark, #101010) !important;
    border-bottom: 2px solid var(--theme-color-bd_color, #97999b) !important;
}

.bbbsri-date-list tbody td {
    padding: 0.75rem 1rem !important;
    vertical-align: middle !important;
    color: var(--theme-color-text_dark, #101010) !important;
    border-bottom: 1px solid #eee !important;
}

.bbbsri-date-list tbody tr:hover {
    background-color: #f9f9f9 !important;
}

.bbbsri-date-list tbody tr.bbbsri-selected {
    background-color: rgba(0, 252, 135, 0.06) !important;
    border-left: 3px solid var(--theme-color-text_link, #00fc87) !important;
}

.bbbsri-date-list .city-name {
    font-weight: 500 !important;
}

/* Availability badges */
.bbbsri-open {
    color: var(--theme-color-text_link, #00fc87) !important;
    font-weight: 600 !important;
}

.bbbsri-filled {
    color: #dc3545 !important;
    font-weight: 600 !important;
}

/* Schedule buttons */
.bbbsri-schedule-btn {
    background-color: var(--theme-color-text_link, #00fc87) !important;
    color: var(--theme-color-inverse_link, #000) !important;
    border: none !important;
    padding: 0.5rem 1.25rem !important;
    cursor: pointer !important;
    font-family: var(--theme-font-button_font-family, inherit) !important;
    font-size: var(--theme-font-button_font-size, 0.85rem) !important;
    font-weight: var(--theme-font-button_font-weight, 600) !important;
    text-transform: var(--theme-font-button_text-transform, uppercase) !important;
    letter-spacing: var(--theme-font-button_letter-spacing, 0) !important;
    transition: opacity 0.2s !important;
}

.bbbsri-schedule-btn:hover {
    opacity: 0.85 !important;
}

.bbbsri-schedule-btn.bbbsri-active {
    opacity: 0.75 !important;
}

.bbbsri-disabled {
    background-color: #eee !important;
    color: var(--theme-color-text_light, #97999b) !important;
    border: none !important;
    padding: 0.5rem 1.25rem !important;
    cursor: not-allowed !important;
    font-family: var(--theme-font-button_font-family, inherit) !important;
    font-size: var(--theme-font-button_font-size, 0.85rem) !important;
    text-transform: var(--theme-font-button_text-transform, uppercase) !important;
}

.bbbsri-loading {
    color: var(--theme-color-text_light, #97999b) !important;
    font-style: italic !important;
}

#bbbsri-dates-container {
    margin: 1rem 0 !important;
}

/* ========================================
   Review Page (Page 4)
   ======================================== */
#bbbsri-review-container {
    max-width: 700px !important;
}

.bbbsri-review-section {
    margin-bottom: 1.5rem !important;
    padding-bottom: 1.5rem !important;
    border-bottom: 1px solid #eee !important;
}

.bbbsri-review-section:last-child {
    border-bottom: none !important;
}

.bbbsri-review-section h2 {
    font-family: var(--theme-font-h5_font-family, inherit) !important;
    font-weight: var(--theme-font-h5_font-weight, 400) !important;
    text-transform: var(--theme-font-h5_text-transform, uppercase) !important;
    letter-spacing: var(--theme-font-h5_letter-spacing, 0.58px) !important;
    font-size: 1.25rem !important;
    color: var(--theme-color-text_dark, #101010) !important;
    margin-bottom: 0.75rem !important;
    margin-top: 0 !important;
}

.bbbsri-review-row {
    display: flex !important;
    gap: 2rem !important;
    margin-bottom: 0.5rem !important;
}

.bbbsri-review-field {
    flex: 1 !important;
}

.bbbsri-review-field label {
    display: block !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    color: var(--theme-color-text_light, #97999b) !important;
    margin-bottom: 0.25rem !important;
}

.bbbsri-review-field p {
    margin: 0 !important;
    font-size: 1rem !important;
    color: var(--theme-color-text_dark, #101010) !important;
}

/* ========================================
   Confirmation
   ======================================== */
.gform_confirmation_message {
    padding: 2rem !important;
    background-color: rgba(0, 252, 135, 0.06) !important;
    border: 1px solid var(--theme-color-text_link, #00fc87) !important;
}

.gform_confirmation_message h2 {
    color: var(--theme-color-text_link, #00fc87) !important;
    margin-top: 0 !important;
}

/* ========================================
   Responsive
   ======================================== */
@media (max-width: 768px) {
    .bbbsri-date-list thead {
        display: none !important;
    }

    .bbbsri-date-list tbody tr {
        display: block !important;
        margin-bottom: 1rem !important;
        border: 1px solid #eee !important;
        padding: 0.75rem !important;
    }

    .bbbsri-date-list tbody td {
        display: block !important;
        padding: 0.25rem 0 !important;
        border-bottom: none !important;
    }

    .bbbsri-review-row {
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
}