/**
 * ELBIN — «Оплата частинами»: шторка умов (installments.js), логотипи банків,
 * рядок у кошику (шторка + /cart/), розділ на /payment-delivery/ (installments.php).
 * Блок на картці товару — single.css, чекаут — checkout-refresh.css.
 */

/* ── Логотипи банків ─────────────────────────────────────────────────── */
.elbin-rp-logos { display: inline-flex; gap: 4px; }
.elbin-rp-logo { width: 22px; height: 22px; flex: none; border-radius: 6px; object-fit: cover; background: #fff; border: 1px solid #E1E8E9; box-sizing: border-box; }
.elbin-rp-logo--text { width: auto; padding: 0 6px; display: inline-flex; align-items: center; font: 700 10px/1 var(--elbin-r2-font-ui); color: #2A3A3E; white-space: nowrap; }

/* ── Шторка «Оплата частинами» (#elbin-rp-drawer, installments.js) ──────
 * Каркас, анімація й положення — спільні з кошиком/обраним/акаунтом (.elbin-cartdrawer*
 * у cart-drawer.css): на телефоні знизу над нижнім меню, на десктопі збоку.
 * Тут — лише вміст, у темній гамі кошика v3. Висота — за вмістом, як у кошика. */
#elbin-rp-drawer .elbin-cartdrawer__head {
	background: #0D0D0D;
	border-bottom-color: rgba(255, 255, 255, 0.09);
	padding: 16px 16px 14px;
}
#elbin-rp-drawer .elbin-cartdrawer__title { font-size: 20px; }
#elbin-rp-drawer .elbin-cartdrawer__panel:focus { outline: none; }
@media (max-width: 999.98px) {
	#elbin-rp-drawer .elbin-cartdrawer__panel { height: auto; max-height: calc(100% - 12px); }
}

.elbin-rp-sheet {
	flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
	padding: 4px 16px 8px; color: #C4C7CC; font-family: var(--elbin-r2-font-ui);
}
.elbin-rp-sheet__lbl { margin: 14px 0 8px; font: 700 13px/1 var(--elbin-r2-font-ui); color: #8E9197; }
.elbin-rp-sheet__banks { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; }
.elbin-rp-bank {
	display: grid; justify-items: center; align-content: start; gap: 5px; min-height: 96px; margin: 0; padding: 10px 6px;
	border: 1.5px solid rgba(255, 255, 255, 0.12); border-radius: 12px; background: #1A1A1A; color: #8E9197;
	font: 500 12px/1.2 var(--elbin-r2-font-ui); text-align: center; box-shadow: none; cursor: pointer;
	transition: border-color .15s ease, background .15s ease;
}
.elbin-rp-bank img, .elbin-rp-bank .elbin-rp-logo { width: 32px; height: 32px; border-radius: 8px; object-fit: cover; border: 1px solid rgba(255, 255, 255, 0.15); background: #fff; }
.elbin-rp-bank b { font: 700 13px/1.2 var(--elbin-r2-font-ui); color: #F4F4F5; }
.elbin-rp-bank.is-on { border-color: var(--elbin-r2-accent, #1AD0CA); background: rgba(26, 208, 202, 0.10); }
.elbin-rp-sheet__terms { display: flex; gap: 8px; }
.elbin-rp-sheet__terms button {
	flex: 1; height: 44px; margin: 0; padding: 0; border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 10px;
	background: #1A1A1A; color: #F4F4F5; font: 700 15px/1 var(--elbin-r2-font-mono); box-shadow: none; cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.elbin-rp-sheet__terms button[aria-checked="true"] { border-color: var(--elbin-r2-accent, #1AD0CA); background: var(--elbin-r2-accent, #1AD0CA); color: #063D2E; }
.elbin-rp-sheet__res { margin-top: 14px; padding: 14px 16px; border: 1px solid rgba(26, 208, 202, 0.32); border-radius: 14px; background: rgba(26, 208, 202, 0.08); }
.elbin-rp-sheet__res small { display: block; font-size: 12.5px; line-height: 1.4; color: #C4C7CC; }
.elbin-rp-sheet__res strong { display: block; margin: 4px 0; font: 800 26px/1.1 var(--elbin-r2-font-mono); color: #F4F4F5; }
.elbin-rp-sheet__steps { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; counter-reset: rp; }
.elbin-rp-sheet__steps li { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.45; color: #C4C7CC; }
.elbin-rp-sheet__steps li::before { counter-increment: rp; content: counter(rp); flex: none; width: 22px; height: 22px; border-radius: 50%; background: rgba(26, 208, 202, 0.16); color: var(--elbin-r2-accent, #1AD0CA); display: grid; place-items: center; font: 700 12px/1 var(--elbin-r2-font-ui); }
.elbin-rp-sheet__legal { margin-top: 14px; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 12px; background: #1A1A1A; font-size: 13px; line-height: 1.5; color: #C4C7CC; }
.elbin-rp-sheet__legal summary { padding: 12px 14px; font-weight: 700; color: #F4F4F5; cursor: pointer; }
.elbin-rp-sheet__legal p { margin: 0 14px 10px; }
.elbin-rp-sheet__muted { margin: 14px 0 6px; padding: 12px 14px; border-radius: 12px; background: #1A1A1A; font-size: 14px; color: #F4F4F5; }
.elbin-rp-sheet__foot { flex-shrink: 0; display: grid; gap: 10px; padding: 10px 16px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(255, 255, 255, 0.09); }
.elbin-rp-sheet__go {
	width: 100%; min-height: 52px; margin: 0; border: 0; border-radius: 10px;
	background: var(--elbin-r2-accent, #1AD0CA); color: var(--elbin-r2-ink-on-accent, #063D2E);
	font: 700 16px/1 var(--elbin-r2-font-ui); box-shadow: none; cursor: pointer;
}
.elbin-rp-sheet__go:hover { background: var(--elbin-r2-accent-hover, #16B8B2); }
.elbin-rp-sheet__go:disabled { opacity: .7; cursor: progress; }
.elbin-rp-sheet__go[hidden] { display: none; }
.elbin-rp-sheet__more { text-align: center; font: 600 13px/1 var(--elbin-r2-font-ui); color: #C4C7CC; text-decoration: underline; text-underline-offset: 2px; }
.elbin-rp-sheet__more:hover { color: var(--elbin-r2-accent, #1AD0CA); }
#elbin-rp-drawer button:focus-visible, #elbin-rp-drawer a:focus-visible { outline: 2px solid var(--elbin-r2-accent, #1AD0CA); outline-offset: 2px; }

/* ── Рядок «Можна частинами» у кошику (шторка й /cart/ — обидва на темному) ── */
.elbin-rp-line {
	display: flex; align-items: center; gap: 8px; width: 100%; margin: 0; padding: 10px 12px; box-sizing: border-box;
	border: 0; border-radius: 10px; background: rgba(26, 208, 202, .12); color: #E8F7F6;
	font: 500 13.5px/1.3 var(--elbin-r2-font-ui); text-align: left; box-shadow: none; cursor: pointer;
}
.elbin-rp-line > span { flex: 1; }
.elbin-rp-line b { font-family: var(--elbin-r2-font-mono); font-weight: 800; color: #fff; white-space: nowrap; }
.elbin-rp-line svg { flex: none; color: var(--elbin-r2-accent, #1AD0CA); }
.elbin-rp-line:hover { background: rgba(26, 208, 202, .2); }
.elbin-rp-line[hidden] { display: none; }
.elbin-rp-line:focus-visible { outline: 2px solid var(--elbin-r2-accent, #1AD0CA); outline-offset: 2px; }

/* ── Розділ «Оплата частинами» на «Доставка та оплата» ───────────────── */
.elbin-rp-terms { margin: 0 0 1em; }
.elbin-rp-terms__bank { margin: 8px 0; border: 1px solid #E1E8E9; border-radius: 12px; background: #fff; }
.elbin-rp-terms__bank summary { display: flex; align-items: center; gap: 10px; padding: 12px 14px; font-weight: 700; cursor: pointer; }
.elbin-rp-terms__bank summary .elbin-rp-logo { width: 24px; height: 24px; }
.elbin-rp-terms__bank p { margin: 0 14px 12px; font-size: 14px; line-height: 1.55; }
.elbin-rp-terms__note { font-size: 13px; color: #4E6064; }