/* ============================================================
   Soft4All Free — Support / PayPal layout R23
   One clear desktop composition, compact 2x3 amount matrix.
   ============================================================ */
.s4-support-pay{
  width:min(1240px,calc(100% - 30px));
  margin:18px auto 34px;
}
.s4-support-top-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  align-items:stretch;
  grid-template-rows:minmax(0,1fr);
}
.s4-support-hero,
.s4-donation-card{
  min-width:0;
  height:100%;
  min-height:0;
  align-self:stretch;
  box-sizing:border-box;
  border:1px solid rgba(147,180,216,.16);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(15,29,46,.94),rgba(8,16,27,.92));
  box-shadow:0 18px 46px rgba(0,0,0,.18);
}
.s4-support-hero{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:var(--s4-pad);
}
.s4-support-hero .eyebrow{
  margin:0 0 6px;
  color:#72dfff;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.s4-support-hero h1{
  margin:0 0 8px;
  font-size:clamp(2rem,3.5vw,3.2rem);
  line-height:1.02;
}
.s4-support-hero p{
  margin:0;
  max-width:680px;
  color:#a5b8ca;
  line-height:1.52;
}
.s4-support-chips{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:16px;
}
.s4-support-chip{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:7px 9px;
  text-align:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  color:#bdcddd;
  font-size:.75rem;
  font-weight:800;
}
.s4-pay-card{box-sizing:border-box}
.s4-donation-card{padding:var(--s4-pad)}
.s4-donation-card h2{margin:0 0 5px;font-size:1.22rem}
.s4-donation-card>.s4-pay-muted{margin:0;color:#8ea4b9;line-height:1.45;font-size:.87rem}
.s4-amounts{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:repeat(3,minmax(44px,auto));
  gap:8px;
  margin:13px 0 0;
}
.s4-amount,
.s4-amount-cell{
  min-width:0;
  min-height:44px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:11px;
  background:rgba(255,255,255,.03);
}
.s4-amount{
  padding:8px 10px;
  color:#e7f1fb;
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
.s4-amount:hover,
.s4-amount.is-selected{
  border-color:#3995ff;
  background:rgba(47,140,255,.16);
  box-shadow:inset 0 0 0 1px rgba(47,140,255,.12);
}
.s4-custom-cell{
  display:grid;
  grid-template-columns:auto minmax(88px,1fr);
  align-items:center;
  gap:8px;
  padding:5px 7px 5px 10px;
}
.s4-custom-cell label{
  margin:0;
  color:#9eb1c3;
  font-size:.78rem;
  font-weight:800;
  line-height:1.2;
}
.s4-custom-cell input{
  width:100%;
  min-width:0;
  height:32px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:8px;
  background:#09131f;
  color:#eef6ff;
  font:inherit;
}
.s4-selected-cell{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0;
  padding:7px 10px;
}
.s4-selected-cell span{color:#8fa4b8;font-size:.75rem}
.s4-selected-cell strong{color:#eef6ff;font-size:.95rem}
.s4-pay-error{grid-column:1/-1;margin:7px 0 0;color:#ffb9b9;font-size:.78rem}
.s4-paypal-primary{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:46px;
  margin-top:10px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:11px;
  background:linear-gradient(135deg,#0878ff 0%,#3556f3 54%,#7a40e8 100%);
  color:#fff;
  text-decoration:none;
  font-weight:900;
  box-shadow:0 8px 22px rgba(31,105,245,.18);
}
.s4-paypal-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.s4-paypal-primary.is-disabled,.s4-paypal-primary[aria-disabled="true"]{opacity:.48;pointer-events:none}
.s4-payment-hint{
  margin:6px 0 0;
  color:#8ba0b5;
  font-size:.74rem;
  line-height:1.4;
  text-align:center;
}
.s4-paypal-inline{
  display:grid;
  grid-template-columns:minmax(0,1fr) 104px;
  grid-template-areas:"title qr" "copy qr";
  gap:2px 12px;
  align-items:center;
  margin-top:10px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:11px;
  background:rgba(0,0,0,.12);
}
.s4-paypal-inline h3{grid-area:title;margin:0 0 3px;font-size:.92rem}
.s4-paypal-inline .s4-pay-muted{grid-area:copy;margin:0;color:#8ea4b9;font-size:.76rem;line-height:1.4}
.s4-paypal-inline .s4-paypal-qr{
  grid-area:qr;
  width:96px;
  height:96px;
  max-width:96px;
  margin:0;
  padding:6px;
  border-radius:10px;
  background:#fff;
}
.s4-future-payments{
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid rgba(255,255,255,.06);
  color:#7e93a7;
  font-size:.72rem;
  line-height:1.4;
}
.s4-security-note{
  margin-top:8px;
  padding:8px 10px;
  border:1px solid rgba(72,212,148,.15);
  border-radius:9px;
  background:rgba(72,212,148,.045);
  color:#9fcdb8;
  font-size:.73rem;
  line-height:1.4;
}

.s4-support-hero .s4-support-body-secondary{margin-top:10px;color:#91a7ba;font-size:.9rem;line-height:1.5}
.s4-support-hero .s4-support-callout{margin-top:auto;padding-top:14px;color:#d8e8f6;font-size:.9rem;font-weight:800;line-height:1.45}
.s4-payment-methods-title{margin:10px 0 6px;color:#9eb1c3;font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.s4-payment-methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.s4-payment-method{min-width:0;min-height:50px;display:flex;flex-direction:column;justify-content:center;padding:8px 9px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.025)}
.s4-payment-method strong{color:#e8f3fd;font-size:.78rem}
.s4-payment-method span{margin-top:2px;color:#8096aa;font-size:.66rem;line-height:1.25}
.s4-payment-method.is-active{border-color:rgba(43,148,255,.25);background:rgba(43,148,255,.07)}

.s4-method-title,.s4-methods,.s4-pay-submit,.s4-provider-note{display:none!important}
@media(max-width:980px){
  .s4-support-top-grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:auto}
  .s4-support-hero{padding:var(--s4-pad)}
}
@media(max-width:620px){
  .s4-support-pay{width:calc(100% - 16px);margin-top:10px}
  .s4-support-chips{grid-template-columns:1fr}
  .s4-donation-card{padding:var(--s4-pad)}
  .s4-amounts{gap:7px}
  .s4-custom-cell{grid-template-columns:1fr;gap:4px;align-content:center}
  .s4-custom-cell input{height:30px}
  .s4-selected-cell{flex-direction:column;align-items:flex-start;justify-content:center;gap:2px}
  .s4-payment-methods{grid-template-columns:1fr}
  .s4-paypal-inline{grid-template-columns:1fr 86px}
  .s4-paypal-inline .s4-paypal-qr{width:80px;height:80px;max-width:80px}
}


/* R42.4 — PayPal + Ko-fi public provider actions */
.s4-provider-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
}
.s4-provider-actions .s4-paypal-primary{margin-top:0}
.s4-kofi-primary{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:46px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.26);
  border-radius:11px;
  background:linear-gradient(135deg,#ff6b67 0%,#ff5e5b 55%,#e84f60 100%);
  color:#fff;
  text-decoration:none;
  font-weight:900;
  box-shadow:0 8px 22px rgba(232,79,96,.16);
}
.s4-kofi-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.s4-payment-methods{grid-template-columns:repeat(4,minmax(0,1fr))}
.s4-payment-method-kofi{border-color:rgba(255,94,91,.28);background:rgba(255,94,91,.07)}
@media(max-width:820px){
  .s4-payment-methods{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .s4-provider-actions{grid-template-columns:1fr}
  .s4-payment-methods{grid-template-columns:1fr}
}


/* R42.4.2 — stacked provider cards with clear QR separation */
.s4-provider-stack{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin-top:12px;
}
.s4-provider-card{
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  background:rgba(255,255,255,.035);
  box-shadow:0 14px 34px rgba(0,0,0,.16);
  padding:16px;
}
.s4-provider-card h3{
  margin:0 0 8px;
}
.s4-provider-copy{
  margin:0 0 12px;
  color:rgba(255,255,255,.84);
}
.s4-provider-card-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  gap:14px;
  align-items:center;
}
.s4-provider-actions-single{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.s4-provider-button-note,
.s4-provider-qr-note{
  margin:0;
  color:rgba(255,255,255,.88);
  line-height:1.35;
  font-size:.93rem;
}
.s4-provider-qr-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
.s4-provider-qr{
  width:148px;
  height:148px;
  display:block;
  border-radius:10px;
  background:#fff;
  padding:8px;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}
.s4-provider-paypal{
  border-color:rgba(0,112,186,.26);
  background:linear-gradient(180deg,rgba(0,112,186,.09) 0%,rgba(255,255,255,.03) 100%);
}
.s4-provider-kofi{
  border-color:rgba(255,94,91,.26);
  background:linear-gradient(180deg,rgba(255,94,91,.09) 0%,rgba(255,255,255,.03) 100%);
}
.s4-provider-card .s4-paypal-primary,
.s4-provider-card .s4-kofi-primary{
  margin-top:0;
  width:100%;
}
@media(max-width:760px){
  .s4-provider-card-main{
    grid-template-columns:1fr;
  }
  .s4-provider-qr{
    width:140px;
    height:140px;
  }
}


/* R45.1 — Support layout: intro row + Ko-fi left / PayPal right */
.s4-support-layout-r45{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
}
.s4-support-hero-wide{
  width:100%;
  height:auto;
}
.s4-support-hero-wide p{
  max-width:none;
}
.s4-support-body-secondary{
  margin-top:12px!important;
}
.s4-support-providers-r45{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  align-items:stretch;
}
.s4-provider-card-r45{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:18px;
  border:1px solid rgba(147,180,216,.16);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(15,29,46,.94),rgba(8,16,27,.92));
  box-shadow:0 18px 46px rgba(0,0,0,.18);
}
.s4-provider-kofi-r45{
  border-color:rgba(255,94,91,.28);
  background:
    linear-gradient(145deg,rgba(38,24,33,.94),rgba(12,17,28,.94));
}
.s4-provider-paypal-r45{
  border-color:rgba(55,145,255,.26);
  background:
    linear-gradient(145deg,rgba(16,31,52,.96),rgba(8,16,27,.94));
}
.s4-provider-head-r45{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:10px;
  align-items:start;
  margin-bottom:14px;
}
.s4-provider-order-r45{
  display:flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  background:rgba(255,255,255,.05);
  color:#9eb1c3;
  font-size:.72rem;
  font-weight:900;
}
.s4-provider-head-r45 h2{
  margin:0 0 5px;
  font-size:1.35rem;
}
.s4-provider-head-r45 p{
  margin:0;
  color:#9eb1c3;
  line-height:1.45;
  font-size:.88rem;
}
.s4-paypal-amount-r45{
  margin-bottom:14px;
}
.s4-paypal-amount-r45 .s4-amounts{
  margin-top:0;
}
.s4-provider-body-r45{
  display:grid;
  grid-template-columns:minmax(0,1fr) 184px;
  gap:14px;
  align-items:center;
  margin-top:auto;
}
.s4-provider-body-r45 .s4-paypal-primary,
.s4-provider-body-r45 .s4-kofi-primary{
  margin:0;
  width:100%;
  min-height:50px;
}
.s4-provider-qr-wrap-r45{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:14px;
  background:rgba(255,255,255,.055);
}
.s4-provider-qr-r45{
  display:block;
  width:148px;
  height:148px;
  padding:8px;
  border-radius:10px;
  background:#fff;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
}
.s4-provider-qr-note-r45{
  margin:0;
  color:#aabccd;
  text-align:center;
  line-height:1.35;
  font-size:.78rem;
}
@media(max-width:900px){
  .s4-support-providers-r45{
    grid-template-columns:1fr;
  }
}
@media(max-width:620px){
  .s4-provider-card-r45{
    padding:14px;
  }
  .s4-provider-body-r45{
    grid-template-columns:1fr;
  }
  .s4-provider-qr-r45{
    width:140px;
    height:140px;
  }
}
