/* stylelint-disable selector-class-pattern, no-descending-specificity,
declaration-block-single-line-max-declarations -- Plugin-scoped BEM styles. */
.mda-donation-counter,
.mda-donation-form-wrap {
    --mda-green: #2ecc40;
    --mda-green-dark: #1ea530;
    --mda-cream: #faf7ef;
    --mda-cream-2: #f2f7ef;
    --mda-ink: #151a17;
    --mda-muted: #6e766f;
    --mda-line: rgba(21, 26, 23, 0.12);

    box-sizing: border-box;
    color: var(--mda-ink);
    font-family: Inter, sans-serif;
}

.mda-donation-counter *,
.mda-donation-form-wrap * { box-sizing: border-box; }

.mda-donation-counter {
    overflow: hidden;
    padding: clamp(28px, 5vw, 56px);
    border: 1px solid rgba(46, 204, 64, 0.22);
    border-radius: 36px;
    background: radial-gradient(circle at 90% 0, rgba(46, 204, 64, 0.18), transparent 35%), var(--mda-cream);
    box-shadow: 0 22px 70px rgba(21, 26, 23, 0.08);
}

.mda-donation-counter__eyebrow {
    margin: 0 0 12px;
    color: var(--mda-green-dark);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.mda-donation-counter__main { display: flex; align-items: baseline; gap: 14px; }
.mda-donation-counter__main strong { font-family: Manrope, Inter, sans-serif; font-size: clamp(4rem, 12vw, 8rem); line-height: 0.95; letter-spacing: -0.07em; }
.mda-donation-counter__main span { color: var(--mda-green-dark); font-size: clamp(1.3rem, 3vw, 2.2rem); font-weight: 800; }
.mda-donation-counter__amount { margin: 12px 0 22px; color: var(--mda-muted); font-size: 1.05rem; }
.mda-donation-counter__bar { height: 12px; overflow: hidden; border-radius: 999px; background: rgba(21, 26, 23, 0.09); }
.mda-donation-counter__bar span { display: block; height: 100%; border-radius: inherit; background: var(--mda-green); transition: width 0.5s ease; }
.mda-donation-counter__note { margin: 14px 0 0; color: var(--mda-muted); font-size: 0.88rem; }

.mda-donation-form {
    display: grid;
    gap: 24px;
    padding: clamp(24px, 5vw, 48px);
    border: 1px solid var(--mda-line);
    border-radius: 36px;
    background: #fff;
    box-shadow: 0 22px 70px rgba(21, 26, 23, 0.08);
}

.mda-donation-form__section { margin: 0; padding: 0; border: 0; }
.mda-donation-form__section legend { width: 100%; margin: 0 0 14px; font-family: Manrope, Inter, sans-serif; font-size: 1.25rem; font-weight: 800; }
.mda-donation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.mda-donation-field { display: grid; gap: 7px; margin-top: 14px; color: var(--mda-ink); font-size: 0.9rem; font-weight: 700; }
.mda-donation-field[hidden] { display: none; }

.mda-donation-field input,
.mda-donation-field textarea { width: 100%; min-height: 52px; padding: 12px 15px; border: 1px solid var(--mda-line); border-radius: 14px; background: var(--mda-cream); color: var(--mda-ink); font: inherit; font-weight: 500; }
.mda-donation-field textarea { min-height: 90px; resize: vertical; }

.mda-donation-field input:focus,
.mda-donation-field textarea:focus { outline: 3px solid rgba(46, 204, 64, 0.2); border-color: var(--mda-green-dark); }

.mda-donation-amounts,
.mda-donation-type { display: flex; flex-wrap: wrap; gap: 10px; }

.mda-donation-amounts label,
.mda-donation-type label { position: relative; cursor: pointer; }

.mda-donation-amounts input,
.mda-donation-type input { position: absolute; opacity: 0; }

.mda-donation-amounts span,
.mda-donation-type span { display: block; padding: 11px 18px; border: 1px solid var(--mda-line); border-radius: 999px; background: var(--mda-cream); font-weight: 800; transition: 0.2s ease; }

.mda-donation-amounts input:checked + span,
.mda-donation-type input:checked + span { border-color: var(--mda-green); background: var(--mda-green); color: #fff; }

.mda-donation-amounts input:focus-visible + span,
.mda-donation-type input:focus-visible + span { outline: 3px solid rgba(46, 204, 64, 0.25); }
.mda-donation-company { padding: 20px; border-radius: 20px; background: var(--mda-cream-2); }
.mda-donation-consent { display: flex; align-items: flex-start; gap: 10px; color: var(--mda-muted); font-size: 0.88rem; }
.mda-donation-consent input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--mda-green-dark); }
.mda-donation-consent a { color: var(--mda-green-dark); text-decoration: underline; }
.mda-donation-submit { min-height: 58px; padding: 15px 28px; border: 0; border-radius: 999px; background: var(--mda-green); box-shadow: 0 16px 38px rgba(46, 204, 64, 0.22); color: #fff; cursor: pointer; font: 900 1rem Inter, sans-serif; transition: 0.2s ease; }
.mda-donation-submit:hover { transform: translateY(-2px); background: var(--mda-green-dark); }
.mda-donation-submit:disabled { opacity: 0.55; cursor: not-allowed; transform: none; }
.mda-donation-alert { margin-bottom: 18px; padding: 15px 18px; border-radius: 14px; font-weight: 700; }
.mda-donation-alert--success { background: #e9f9eb; color: #146f21; }
.mda-donation-alert--info { background: #f2f7ef; color: var(--mda-ink); }
.mda-donation-alert--error { background: #fff0f0; color: #9b1c1c; }
.mda-donation-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.mda-donation-config-note { margin: 0; color: #9b1c1c; font-size: 0.86rem; text-align: center; }

@media (max-width: 640px) {
    .mda-donation-grid { grid-template-columns: 1fr; gap: 0; }
    .mda-donation-counter__main { align-items: flex-start; flex-direction: column; gap: 2px; }
}
