/**
 * GiveWP Custom Styles
 *
 * @package Nor
 * @since 1.0.0
 */

/* Form Wrapper */
.give-form-wrap {
    font-family: var(--nor-font-primary);
}

/* Donation Amounts */
.give-donation-amount {
    border-color: var(--nor-color-border) !important;
    transition: all var(--nor-transition-fast);
}

.give-donation-amount:hover,
.give-donation-amount.give-default-level {
    border-color: var(--nor-color-primary) !important;
    background-color: var(--nor-color-primary-light) !important;
}

.give-donation-amount.give-default-level .give-text-input {
    color: var(--nor-color-secondary);
}

/* Submit Button */
.give-btn,
.give-submit {
    font-family: var(--nor-font-primary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    background-color: var(--nor-color-primary) !important;
    color: var(--nor-color-secondary) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: var(--nor-spacing-md) var(--nor-spacing-xl) !important;
    transition: all var(--nor-transition-fast);
}

.give-btn:hover,
.give-submit:hover {
    background-color: var(--nor-color-primary-dark) !important;
    color: var(--nor-color-white) !important;
}

/* Form Fields */
.give-form input[type="text"],
.give-form input[type="email"],
.give-form select,
.give-form textarea {
    border: 1px solid var(--nor-color-border);
    border-radius: var(--nor-border-radius);
    padding: var(--nor-spacing-md);
    font-family: var(--nor-font-primary);
}

.give-form input:focus,
.give-form select:focus,
.give-form textarea:focus {
    border-color: var(--nor-color-primary);
    outline: none;
}

/* Goal Progress */
.give-goal-progress {
    background-color: var(--nor-color-light);
    border-radius: var(--nor-border-radius-lg);
    padding: var(--nor-spacing-lg);
    margin-bottom: var(--nor-spacing-xl);
}

.give-progress-bar {
    height: 12px;
    background-color: var(--nor-color-border);
    border-radius: var(--nor-border-radius-full);
    overflow: hidden;
}

.give-progress-bar > span {
    background: linear-gradient(90deg, var(--nor-color-primary), var(--nor-color-primary-dark));
    border-radius: var(--nor-border-radius-full);
}

.give-goal-text {
    margin-top: var(--nor-spacing-md);
    font-size: var(--nor-font-size-sm);
    color: var(--nor-color-text-light);
}

/* Donation Grid */
.give-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: var(--nor-spacing-xl);
}

.give-card {
    background-color: var(--nor-color-white);
    border-radius: var(--nor-border-radius-lg);
    box-shadow: var(--nor-shadow);
    overflow: hidden;
    transition: transform var(--nor-transition-base), box-shadow var(--nor-transition-base);
}

.give-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--nor-shadow-lg);
}

.give-card__media img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.give-card__body {
    padding: var(--nor-spacing-lg);
}

.give-card__title {
    font-size: var(--nor-font-size-xl);
    margin-bottom: var(--nor-spacing-md);
}

.give-card__title a {
    color: var(--nor-color-secondary);
}

.give-card__title a:hover {
    color: var(--nor-color-primary);
}

/* Donation Totals Widget */
.donation-totals-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--nor-spacing-md);
    text-align: center;
}

.donation-stat {
    padding: var(--nor-spacing-md);
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: var(--nor-border-radius);
}

.donation-stat .stat-number {
    display: block;
    font-size: var(--nor-font-size-2xl);
    font-weight: 700;
    color: var(--nor-color-primary);
}

.donation-stat .stat-label {
    display: block;
    font-size: var(--nor-font-size-sm);
    opacity: 0.8;
}

/* Nor Donation Progress (Custom) */
.nor-donation-progress {
    margin-bottom: var(--nor-spacing-lg);
}

.nor-donation-progress .progress-bar-wrap {
    height: 10px;
    background-color: var(--nor-color-border);
    border-radius: var(--nor-border-radius-full);
    overflow: hidden;
}

.nor-donation-progress .progress-bar {
    height: 100%;
    background: linear-gradient(90deg, var(--nor-color-primary), var(--nor-color-primary-dark));
    border-radius: var(--nor-border-radius-full);
    transition: width 1s ease;
}

.nor-donation-progress .progress-stats {
    display: flex;
    justify-content: space-between;
    margin-top: var(--nor-spacing-sm);
    font-size: var(--nor-font-size-sm);
}

.nor-donation-progress .raised {
    font-weight: 700;
    color: var(--nor-color-primary-dark);
}

.nor-donation-progress .goal {
    color: var(--nor-color-text-muted);
}

/* Modal Styles */
.give-modal {
    font-family: var(--nor-font-primary);
}

.give-modal .mfp-content {
    max-width: 600px;
}

.give-modal .mfp-close {
    color: var(--nor-color-secondary);
}

/* Receipt */
.give-receipt {
    background-color: var(--nor-color-light);
    border-radius: var(--nor-border-radius-lg);
    padding: var(--nor-spacing-xl);
}

.give-receipt th {
    text-align: left;
    padding: var(--nor-spacing-sm) 0;
    border-bottom: 1px solid var(--nor-color-border);
}

.give-receipt td {
    padding: var(--nor-spacing-sm) 0;
    border-bottom: 1px solid var(--nor-color-border);
}

/* Responsive */
@media (max-width: 768px) {
    .donation-totals-grid {
        grid-template-columns: 1fr;
    }

    .give-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Donate Page Overrides
   ========================================================================== */

.page-donate .give-form-wrap,
.page-donate .give-embed-form,
.page-donate .give-viewing-form-in-iframe {
    max-width: 100%;
    margin: 0 !important;
}

#give-form-2069-wrap,
.give-form-wrap.give-embed-form,
.give-form-wrap.give-viewing-form-in-iframe,
.page-donate #give-form-2069-wrap,
.page-donate [id^="give-form-"][id$="-wrap"],
div.give-form-wrap {
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.page-donate iframe {
    display: block;
    width: 100%;
    min-height: 500px;
}

.page-donate .give-embed-form,
.page-donate .give-form-wrap {
    overflow: visible !important;
    width: 100% !important;
}

.page-donate .donate-content,
.page-donate .sacrament-content {
    flex: 1;
    min-width: 0;
    width: 100%;
}

.page-donate .entry-content {
    width: 100%;
}

.page-donate .entry-content > * {
    width: 100%;
}

.page-donate .give-btn,
.page-donate .give-submit,
.page-donate button[type="submit"] {
    background-color: var(--nor-color-primary) !important;
    color: var(--nor-color-secondary) !important;
    border-radius: 0 !important;
    font-family: var(--nor-font-primary) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    padding: 15px 30px !important;
    transition: all 0.3s ease !important;
}

.page-donate .give-btn:hover,
.page-donate .give-submit:hover,
.page-donate button[type="submit"]:hover {
    background-color: var(--nor-color-secondary) !important;
    color: var(--nor-color-primary) !important;
}

/* Donation amount buttons */
.page-donate .give-donation-levels-wrap .give-donation-level-btn,
.page-donate .give-donation-amount {
    border: 2px solid var(--nor-color-border) !important;
    border-radius: 0 !important;
    font-family: var(--nor-font-primary) !important;
    transition: all 0.2s ease !important;
}

.page-donate .give-donation-levels-wrap .give-donation-level-btn:hover,
.page-donate .give-donation-levels-wrap .give-donation-level-btn.give-default-level,
.page-donate .give-donation-amount:hover,
.page-donate .give-donation-amount.give-default-level {
    border-color: var(--nor-color-primary) !important;
    background-color: var(--nor-color-primary) !important;
    color: var(--nor-color-secondary) !important;
}

/* Form inputs */
.page-donate .give-form input[type="text"],
.page-donate .give-form input[type="email"],
.page-donate .give-form input[type="tel"],
.page-donate .give-form input[type="number"],
.page-donate .give-form select,
.page-donate .give-form textarea {
    border: 1px solid var(--nor-color-border) !important;
    border-radius: 0 !important;
    padding: 12px 15px !important;
    font-family: var(--nor-font-primary) !important;
    font-size: var(--nor-font-size-base) !important;
}

.page-donate .give-form input:focus,
.page-donate .give-form select:focus,
.page-donate .give-form textarea:focus {
    border-color: var(--nor-color-primary) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(255, 198, 75, 0.2) !important;
}

/* Form labels */
.page-donate .give-form label {
    font-family: var(--nor-font-primary) !important;
    font-weight: 500 !important;
    color: var(--nor-color-secondary) !important;
}

/* Headings in form */
.page-donate .give-form h2,
.page-donate .give-form h3,
.page-donate .give-form h4,
.page-donate .give-form .give-section-title {
    font-family: var(--nor-font-primary) !important;
    color: var(--nor-color-secondary) !important;
}

/* GiveWP 3.x Visual Form Builder overrides */
.page-donate [data-givewp-form],
.page-donate .givewp-form {
    font-family: var(--nor-font-primary) !important;
}

.page-donate [data-givewp-form] button,
.page-donate .givewp-form button {
    border-radius: 0 !important;
    font-family: var(--nor-font-primary) !important;
}

/* Progress bar */
.page-donate .give-progress-bar,
.page-donate .give-goal-progress .give-progress-bar {
    border-radius: 0 !important;
    background-color: var(--nor-color-border) !important;
}

.page-donate .give-progress-bar span {
    background: var(--nor-color-primary) !important;
    border-radius: 0 !important;
}

/* Gateway selection */
.page-donate .give-gateway-option label {
    border-radius: 0 !important;
}

.page-donate .give-gateway-option input:checked + label {
    border-color: var(--nor-color-primary) !important;
}

/* Error messages */
.page-donate .give-form .give-error {
    border-left: 4px solid #dc3545 !important;
    border-radius: 0 !important;
}

/* Success message */
.page-donate .give-form .give-success {
    border-left: 4px solid var(--nor-color-primary) !important;
    border-radius: 0 !important;
}