/************  BASE (как у тебя было)  ************/
.cca-checkout-wrapper{max-width:840px;margin:0 auto;background:#fff;padding:24px;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.cca-checkout-wrapper h2{margin:0 0 14px 0}
.cca-checkout-wrapper label{display:block;margin-top:12px;font-weight:600}
.cca-checkout-wrapper input,.cca-checkout-wrapper select,.cca-checkout-wrapper textarea{width:100%;padding:10px;border:1px solid #e5e7eb;border-radius:10px;margin-top:6px}
.cca-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cca-btn{background:#2E4892;color:#fff;border:0;border-radius:10px;padding:12px 18px;margin-top:18px;cursor:pointer}
.cca-gateways{list-style:none;margin:0;padding:0}
.cca-gateways li{margin:.5rem 0}

#cca-totals{background:#f7f8fb;border:1px solid #e9edf5;border-radius:12px;padding:12px;margin:8px 0 16px}
#cca-totals .row{display:flex;justify-content:space-between;align-items:center;margin:6px 0}
#cca-totals .total{font-size:18px;font-weight:700}

.cca-orders{display:grid;gap:14px}
.cca-order-card{border:1px solid #e5e7eb;border-radius:12px;padding:12px}
.cca-order-head{font-weight:700;margin-bottom:8px}
.cca-order-line{font-size:14px;opacity:.95}
.cca-order-total{margin-top:10px;font-weight:700}
.cca-order-foot .button{background:#2E4892;color:#fff;border-radius:8px;padding:6px 12px;border:none;text-decoration:none}

/* Popup */
.cca-modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;z-index:99999}
.cca-modal__box{background:#fff;border-radius:14px;padding:22px 20px;max-width:460px;width:92%;box-shadow:0 12px 36px rgba(0,0,0,.18);text-align:center}
.cca-modal__title{font-size:20px;font-weight:700;margin-bottom:8px}
.cca-modal__text{font-size:14px;opacity:.9}
.cca-check{display:flex;align-items:center;gap:8px;margin:6px 0;font-size:15px;cursor:pointer}
.cca-check input[type="checkbox"]{width:18px;height:18px;accent-color:#2e7d32}

/************  PAYMENTS • красивые radio-карточки  ************/

/* сетка с карточками */
.cca-payments{margin-top:18px}
.cca-payments h3{margin:0 0 10px;font-size:18px;font-weight:800}
.cca-gateways{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){ .cca-gateways{grid-template-columns:1fr} }

/* прячем «сырой» radio, оставляя доступность */
.cca-gateways input[type="radio"]{
  position:absolute; inset:0; opacity:0; pointer-events:none;
}

/* карточка */
.cca-gateways li{margin:0}
.cca-gateways label{
  display:flex; align-items:center; gap:12px;
  min-height:64px;
  padding:14px 16px;
  border:1.5px solid #e5e7eb;
  border-radius:14px;
  background:#fff;
  box-shadow:0 6px 16px rgba(2,6,23,.06);
  cursor:pointer; user-select:none;
  position:relative;
  transition:border-color .2s, box-shadow .2s, transform .12s, background .2s, color .2s;
}

/* кастомный кружок (radio) слева */
.cca-gateways label::before{
  content:""; flex:0 0 22px; height:22px; width:22px;
  border-radius:50%; background:#fff;
  border:2px solid #9aa7b7;
  box-shadow:inset 0 0 0 6px transparent;
  transition:all .2s;
}

/* иконка справа (по способу оплаты) */
.cca-gateways label::after{
  content:"";
  position:absolute; right:14px; top:50%; transform:translateY(-50%);
  width:24px; height:24px; opacity:.9;
}
.cca-gateways label:has(input[value*="cod"])::after{ content:"💵"; font-size:20px; width:auto; height:auto }
.cca-gateways label:has(input[value*="idram"])::after{ content:"⚡"; font-size:20px; width:auto; height:auto }

/* hover/focus */
.cca-gateways label:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(2,6,23,.10) }
.cca-gateways label:has(input:focus-visible){
  outline:3px solid #93c5fd; outline-offset:2px;
}

/* выбранная карточка */
.cca-gateways label:has(input:checked){
  border-color:#1f6fff;
  background:linear-gradient(0deg,#f7fbff,#fff);
  box-shadow:0 12px 28px rgba(31,111,255,.18), 0 0 0 1px rgba(31,111,255,.04) inset;
}
.cca-gateways label:has(input:checked)::before{
  border-color:#1f6fff;
  box-shadow:inset 0 0 0 6px #1f6fff;
}

/* подписи/текст внутри карточки */
.cca-gateways label{color:#0f172a; font-weight:800}
.cca-gateways label small{
  display:block; font-weight:600; color:#64748b; margin-top:2px;
}

/* «кнопка оформить» — чуть крупнее и шире */
.cca-btn{
  width:100%; min-height:48px;
  border-radius:12px;
  font-weight:800; letter-spacing:.01em;
  box-shadow:0 14px 30px rgba(46,72,146,.22);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.cca-btn:hover{ transform:translateY(-1px); filter:saturate(1.05); box-shadow:0 16px 34px rgba(46,72,146,.26) }
