/* Dodatkowe komponenty formularza darowizny i panelu redakcyjnego. */
.form-error {
  display: block;
  margin-top: .4rem;
  color: #970032;
  font-weight: 740;
}

#custom-amount[aria-invalid="true"] {
  border-color: #9b153b;
  box-shadow: 0 0 0 .18rem rgba(155, 21, 59, .15);
}

.donation-summary[data-invalid] {
  border-color: #9b153b;
  background: #fde8ee;
  color: #6f0d2a;
}

.payment-methods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}

.payment-choice { position: relative; }

.payment-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.payment-choice label {
  display: grid;
  grid-template-columns: 3.35rem minmax(0, 1fr);
  align-items: center;
  min-height: 5.5rem;
  gap: 1rem;
  padding: .9rem 1rem;
  border: 2px solid var(--control-border, #697177);
  border-radius: var(--radius-sm, .5rem);
  background: var(--white, #fff);
  cursor: pointer;
  line-height: 1.25;
}

.payment-choice label strong { min-width: 0; font-size: 1rem; line-height: 1.25; overflow-wrap: anywhere; }
.payment-choice__mark { display: grid; place-items: center; width: 3.35rem; aspect-ratio: 1; border-radius: 50%; background: var(--navy-deep, #0b2742); color: var(--white, #fff); }
.payment-choice__mark svg { width: 1.8rem; height: 1.8rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.payment-choice__mark svg circle { fill: currentColor; stroke: none; }

.payment-choice input:checked + label {
  border-color: var(--raspberry-dark, #970032);
  background: var(--raspberry-soft, #fde6ee);
  color: var(--ink, #171b1f);
}

.payment-choice input:checked + label .payment-choice__mark { background: var(--raspberry-dark, #970032); }

.payment-choice input:focus-visible + label {
  outline: .2rem solid var(--focus, #101820);
  outline-offset: .22rem;
  box-shadow: 0 0 0 .4rem var(--focus-outer, #fff);
}

.payment-choice input:disabled + label { cursor: not-allowed; opacity: .48; background: var(--paper, #f7f7f5); }

.donation-checkout {
  padding-block: clamp(2.75rem, 5vw, 5.5rem);
  background:
    radial-gradient(circle at 8% 8%, rgba(243, 212, 90, .28), transparent 24rem),
    var(--paper, #f7f7f5);
}

.donation-checkout__grid {
  grid-template-columns: minmax(17rem, .78fr) minmax(34rem, 1.22fr);
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}

.donation-checkout__copy { position: sticky; top: 8.5rem; color: var(--ink, #171b1f); }
.donation-checkout__copy h1 { max-width: 9ch; margin-bottom: 1.25rem; color: var(--ink, #171b1f); line-height: .98; }
.donation-checkout__copy .breadcrumbs,
.donation-checkout__copy .breadcrumbs a { color: var(--ink-soft, #4a5056); }
.donation-checkout__copy .content-kicker { color: var(--raspberry-dark, #970032); }
.donation-checkout__copy .content-lead,
.donation-checkout__copy .checkout-benefits { color: var(--ink-soft, #4a5056); }
.checkout-benefits { display: grid; gap: .65rem; margin: var(--space-6, 2rem) 0 0; padding: 0; list-style: none; }
.checkout-benefits li { display: grid; grid-template-columns: 1.35rem minmax(0, 1fr); gap: .65rem; }
.checkout-benefits li::before { color: var(--raspberry-dark, #970032); content: "✓"; font-weight: 800; }
.donation-panel--checkout { padding: clamp(1.25rem, 3vw, 2.5rem); box-shadow: .8rem .8rem 0 var(--raspberry-dark, #970032); }
.method-availability { margin: .8rem 0 0; padding: .75rem .9rem; border-left: .25rem solid var(--navy, #153b60); background: var(--sky, #dceef6); font-size: .9rem; }
.online-payment-details { display: grid; gap: var(--space-4, 1rem); margin-block: var(--space-5, 1.5rem); }
.checkout-email { display: grid; gap: .45rem; }
.checkout-email label { font-weight: 760; }
.checkout-email input { width: 100%; min-height: 3.5rem; padding: .7rem .85rem; border: 2px solid var(--ink, #171b1f); border-radius: var(--radius-sm, .5rem); font: inherit; }
.checkout-email input:focus-visible { outline: .2rem solid var(--focus, #101820); outline-offset: .2rem; box-shadow: 0 0 0 .4rem var(--focus-outer, #fff); }
.checkout-email small { color: var(--ink-soft, #4a5056); }
.operator-slot { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr); gap: .9rem; align-items: start; padding: 1rem; border: 1px solid #a9c7b8; background: #edf7f1; }
.operator-slot__shield { display: grid; place-items: center; width: 2.6rem; aspect-ratio: 1; border-radius: 50%; background: var(--green, #255c46); color: var(--white, #fff); font-weight: 800; }
.operator-slot p { display: grid; gap: .2rem; margin: 0; }
.operator-slot small { color: var(--ink-soft, #4a5056); line-height: 1.45; }
.bank-payment-details { margin-block: var(--space-5, 1.5rem); padding: clamp(1rem, 3vw, 1.6rem); border: 2px solid var(--navy-deep, #0b2742); background: var(--sky, #dceef6); }
.bank-payment-details h2 { margin: .25rem 0 .75rem; font-size: clamp(1.45rem, 3vw, 2rem); }
.bank-payment-details .account-number { margin: 0; font-family: var(--font-human, Georgia, serif); font-size: clamp(1.35rem, 3.3vw, 2.4rem); font-weight: 700; letter-spacing: .03em; line-height: 1.25; overflow-wrap: anywhere; }
.donation-panel--checkout .donation-summary { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1fr) minmax(0, .8fr); align-items: center; }
.donation-summary__method { justify-self: end; padding: .4rem .65rem; border-radius: 999px; background: var(--raspberry-soft, #fde6ee); color: var(--raspberry-dark, #970032); font-size: .9rem; font-weight: 780; text-align: center; overflow-wrap: anywhere; }
.payment-status { border-left-color: var(--raspberry-dark, #970032); background: var(--raspberry-soft, #fde6ee); }
.payment-status:focus-visible { outline: .2rem solid var(--focus, #101820); outline-offset: .2rem; }

@media (max-width: 1050px) {
  .donation-checkout { padding-block: 2.25rem 4rem; }
  .donation-checkout__grid { grid-template-columns: 1fr; }
  .donation-checkout__copy { position: static; }
  .donation-checkout__copy h1 { max-width: 14ch; }
}

@media (max-width: 620px) {
  .donation-checkout { padding-block: 1.35rem 2.75rem; }
  .donation-checkout__grid { gap: 1.35rem; }
  .donation-checkout__copy h1 { max-width: none; margin-bottom: .8rem; font-size: min(11vw, 3rem); line-height: 1; }
  .donation-checkout__copy .content-lead { margin-bottom: 0; font-size: 1rem; line-height: 1.55; }
  .donation-checkout__copy .breadcrumbs { margin-bottom: 1rem; }
  .payment-methods { grid-template-columns: 1fr; }
  .payment-choice label { min-height: 4.6rem; }
  .donation-panel--checkout .donation-summary { grid-template-columns: 1fr; gap: .5rem; }
  .donation-summary__method { justify-self: start; }
  .donation-panel--checkout { padding: 1rem; box-shadow: none; }
}

.placeholder-account {
  display: block;
  margin-block: .6rem;
  padding: .65rem .75rem;
  border: 1px dashed var(--control-border, #697177);
  background: var(--paper, #f7f7f5);
  font-weight: 740;
  letter-spacing: .08em;
  overflow-wrap: anywhere;
}

/* Panel redakcyjny */
body[data-page="panel-demo"] { background: var(--paper, #f7f7f5); }

.cms-hero {
  padding-block: clamp(3.5rem, 7vw, 6.5rem);
  background:
    radial-gradient(circle at 86% 15%, rgba(243, 212, 90, .23), transparent 24rem),
    var(--navy-deep, #0b2742);
  color: var(--white, #fff);
}

.cms-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(17rem, .7fr);
  align-items: end;
  gap: clamp(2rem, 6vw, 6rem);
}

.cms-hero h1 {
  max-width: 11ch;
  margin-bottom: var(--space-5, 1.5rem);
  font-family: var(--font-human, Georgia, serif);
  font-size: clamp(3rem, 6vw, 6.2rem);
}

.cms-hero__lead {
  max-width: 43rem;
  margin-bottom: 0;
  font-size: clamp(1.08rem, 1rem + .35vw, 1.35rem);
}

.cms-hero__proof {
  padding: 1.4rem;
  border: 1px solid rgba(255, 255, 255, .34);
  border-radius: var(--radius-md, .875rem);
  background: rgba(255, 255, 255, .08);
}

.cms-hero__proof strong { display: block; margin-bottom: .55rem; font-size: 1.1rem; }
.cms-hero__proof ul { margin: 0; padding-left: 1.15rem; }

.workflow-strip {
  padding-block: var(--space-7, 3rem);
  border-bottom: 1px solid var(--line, #d9dcde);
  background: var(--white, #fff);
}

.workflow-strip ol {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: workflow;
}

.workflow-strip li {
  position: relative;
  min-width: 0;
  padding-left: 2.8rem;
  counter-increment: workflow;
}

.workflow-strip li::before {
  content: counter(workflow, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: -.15rem;
  color: var(--raspberry, #e4004b);
  font-size: 1.1rem;
  font-weight: 820;
}

.workflow-strip strong { display: block; }
.workflow-strip span { color: var(--ink-soft, #4a5056); font-size: .9rem; }

.cms-stage { padding-block: clamp(3.5rem, 7vw, 7rem); }

.cms-stage__intro {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(18rem, 1.2fr);
  gap: 2rem;
  margin-bottom: var(--space-7, 3rem);
}

.cms-stage__intro h2 { margin: 0; font-family: var(--font-human, Georgia, serif); }
.cms-stage__intro p { max-width: 48rem; margin: 0; align-self: end; }

.cms-shell {
  display: grid;
  grid-template-columns: 15.5rem minmax(0, 1fr);
  min-height: 47rem;
  overflow: hidden;
  border: 2px solid var(--ink, #171b1f);
  border-radius: var(--radius-md, .875rem);
  background: var(--white, #fff);
  box-shadow: 1rem 1rem 0 rgba(228, 0, 75, .16);
}

.cms-sidebar {
  padding: 1.4rem 1rem;
  background: var(--navy-deep, #0b2742);
  color: var(--white, #fff);
}

.cms-sidebar__brand {
  display: flex;
  align-items: center;
  gap: .7rem;
  margin-bottom: 2rem;
  padding: 0 .55rem;
  font-weight: 800;
}

.cms-sidebar__brand span:first-child {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border-radius: 50%;
  background: var(--raspberry, #e4004b);
}

.cms-sidebar nav { display: grid; gap: .3rem; }
.cms-sidebar a {
  display: flex;
  min-height: 2.75rem;
  align-items: center;
  gap: .7rem;
  padding: .55rem .7rem;
  border-radius: .45rem;
  text-decoration: none;
}
.cms-sidebar a[aria-current="page"] { background: rgba(255, 255, 255, .14); font-weight: 760; }
.cms-sidebar a:not([aria-current="page"]) { color: rgba(255, 255, 255, .78); }

.cms-workspace { min-width: 0; }

.cms-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.5rem;
  padding: .8rem clamp(1rem, 3vw, 2.25rem);
  border-bottom: 1px solid var(--line, #d9dcde);
}

.cms-toolbar p { margin: 0; }
.cms-toolbar small { display: block; color: var(--ink-soft, #4a5056); }
.cms-status-pill {
  padding: .35rem .65rem;
  border-radius: 999px;
  background: var(--raspberry-soft, #fde6ee);
  color: var(--raspberry-dark, #970032);
  font-size: .78rem;
  font-weight: 780;
}

.cms-editor {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr);
  gap: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(1.25rem, 3vw, 2.5rem);
}

.cms-fields { min-width: 0; }
.cms-fields h2 { margin-bottom: 1.5rem; font-size: clamp(1.8rem, 2.8vw, 2.6rem); }

.cms-field { margin-bottom: 1.15rem; }
.cms-field label,
.cms-field legend { display: block; margin-bottom: .38rem; font-weight: 760; }
.cms-field small { display: block; margin-top: .35rem; color: var(--ink-soft, #4a5056); }
.cms-field input,
.cms-field select,
.cms-field textarea {
  width: 100%;
  min-height: 3rem;
  padding: .7rem .8rem;
  border: 2px solid var(--control-border, #697177);
  border-radius: var(--radius-sm, .5rem);
  background: var(--white, #fff);
  color: var(--ink, #171b1f);
}
.cms-field textarea { min-height: 8rem; resize: vertical; }
.cms-field input[aria-invalid="true"],
.cms-field textarea[aria-invalid="true"] { border-color: #9b153b; }

.cms-fieldset { margin: 0 0 1.15rem; padding: 1rem; border: 1px solid var(--line, #d9dcde); border-radius: var(--radius-sm, .5rem); }

.cms-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.4rem;
}

.cms-actions .button-ghost {
  border-color: var(--ink, #171b1f);
  background: var(--white, #fff);
  color: var(--ink, #171b1f);
}
.cms-actions .button-ghost:hover { background: var(--paper, #f7f7f5); }

.cms-action-status {
  min-height: 3.2rem;
  margin: 1rem 0 0;
  padding: .75rem .85rem;
  border-left: .3rem solid var(--navy, #153b60);
  background: var(--sky, #dceef6);
}
.cms-action-status[data-state="success"] { border-color: var(--green, #255c46); background: #e6f3ec; }
.cms-action-status[data-state="error"] { border-color: #9b153b; background: #fde8ee; }

.cms-sidepanel {
  display: grid;
  align-content: start;
  gap: 1rem;
  min-width: 0;
}

.cms-card {
  padding: 1.05rem;
  border: 1px solid var(--line, #d9dcde);
  border-radius: var(--radius-sm, .5rem);
  background: var(--paper, #f7f7f5);
}
.cms-card h3 { margin-bottom: .75rem; font-size: 1.15rem; }

.quality-list { display: grid; gap: .55rem; margin: 0; padding: 0; list-style: none; }
.quality-list li { display: grid; grid-template-columns: 1.3rem minmax(0, 1fr); gap: .45rem; }
.quality-list li::before { content: "○"; color: var(--ink-soft, #4a5056); font-weight: 850; }
.quality-list li[data-state="pass"]::before { content: "✓"; color: var(--green, #255c46); }
.quality-list li[data-state="fail"]::before { content: "!"; color: #9b153b; }

.cms-preview {
  overflow: hidden;
  border: 1px solid var(--line, #d9dcde);
  border-radius: var(--radius-sm, .5rem);
  background: var(--white, #fff);
}

.cms-preview__image {
  display: grid;
  min-height: 8rem;
  place-items: center;
  padding: 1rem;
  background: linear-gradient(135deg, var(--navy, #153b60), var(--raspberry-dark, #970032));
  color: var(--white, #fff);
  text-align: center;
}
.cms-preview__image span { max-width: 15rem; font-size: .82rem; }
.cms-preview__body { padding: 1rem; }
.cms-preview__meta { display: block; margin-bottom: .35rem; color: var(--raspberry-dark, #970032); font-size: .75rem; font-weight: 780; text-transform: uppercase; }
.cms-preview h3 { margin-bottom: .5rem; overflow-wrap: anywhere; }
.cms-preview p { margin: 0; color: var(--ink-soft, #4a5056); font-size: .9rem; }

.cms-note-section { padding-block: 0 clamp(4rem, 8vw, 7rem); }
.cms-note-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.cms-note-grid article { padding: 1.4rem; border-top: .32rem solid var(--raspberry, #e4004b); background: var(--white, #fff); }
.cms-note-grid h2 { font-size: 1.25rem; }
.cms-note-grid p { margin-bottom: 0; }

@media (max-width: 980px) {
  .cms-shell { grid-template-columns: 1fr; }
  .cms-sidebar { padding: .8rem 1rem; }
  .cms-sidebar__brand { margin-bottom: .75rem; }
  .cms-sidebar nav { display: flex; overflow-x: auto; padding-bottom: .3rem; }
  .cms-sidebar a { flex: 0 0 auto; }
  .cms-editor { grid-template-columns: 1fr; }
  .cms-sidepanel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cms-preview { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .cms-hero__grid,
  .cms-stage__intro { grid-template-columns: 1fr; }
  .workflow-strip ol { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.5rem; }
  .cms-sidepanel,
  .cms-note-grid { grid-template-columns: 1fr; }
  .payment-methods { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .workflow-strip ol { grid-template-columns: 1fr; }
  .cms-toolbar { align-items: flex-start; }
  .cms-status-pill { text-align: center; }
  .cms-actions .button { width: 100%; }
}

@media (prefers-contrast: more) {
  .cms-card, .cms-preview, .cms-fieldset { border-color: var(--control-border, #40464b); }
}

@media (forced-colors: active) {
  .payment-choice label,
  .cms-shell,
  .cms-card,
  .cms-preview { border: 2px solid CanvasText; }
  .payment-choice input:checked + label { outline: 3px solid Highlight; }
}

@media (prefers-reduced-motion: reduce) {
  .cms-shell * { animation: none !important; transition: none !important; }
}

@media print {
  .cms-sidebar,
  .cms-actions { display: none !important; }
  .cms-shell { display: block; border: 0; box-shadow: none; }
}
