/* =========================================================
   Обгортка блоку реквізитів
   ========================================================= */
.spr-payouts-wrapper {
    margin: 0 auto 20px;
    padding: 10px;
    background: #f8f9fc;
    border: 1px solid #d6dbe3;
    border-radius: 4px;
    max-width: 980px;
}

.spr-payouts-wrapper h3 {
    margin: 0 0 8px;
    font-size: 18px;
    font-weight: 600;
    color: #2b587a;
}

.spr-payouts-wrapper > p {
    margin: 0 0 12px;
    font-size: 13px;
    color: #555;
}

/* =========================================================
   Intro / інформаційні блоки
   ========================================================= */
.spr-payouts-intro {
    margin: 0 0 14px;
    padding: 10px 12px 12px;
    background: #FAEBD7;
    border: 1px dashed #F9BEC0;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.5;
}

.spr-payouts-stage-summary {
    margin: 0 0 8px;
    color: #404b5a;
}

.spr-individual-info p {
    margin: 10px 0 0 !important;
    font-size: 14px;
    color: #555;
}

.spr-individual-next-steps {
    margin-top: 0;
    padding: 10px 14px;

    border-left: 3px solid #f5a623;
    background: #fff8e5;
    border-radius: 3px;

    font-size: 13px;
    line-height: 1.6;
}

/* =========================================================
   Toggle-лінки
   ========================================================= */
.spr-payouts-more-toggle-wrap,
.spr-tax-toggle-wrap {
    margin: 6px 0 8px;
    text-align: right;
}

.spr-payouts-more-toggle,
.spr-tax-toggle {
    font-size: 13px;
    cursor: pointer;
    color: #2b587a;
    text-decoration: none;
    border-bottom: 1px dashed currentColor;
    padding-bottom: 1px;
}

.spr-payouts-more-toggle:hover,
.spr-tax-toggle:hover {
    opacity: 0.85;
}

.spr-payouts-more-toggle.is-open,
.spr-tax-toggle.is-open {
    font-weight: 600;
}

/* =========================================================
   Розгорнуті блоки
   ========================================================= */
.spr-payouts-more {
    margin-top: 10px;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #d6dbe3;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.5;
}

.spr-payouts-info {
    margin: 10px 0 15px;
    padding: 10px 12px;
    background: #fff8e6;
    border: 1px solid #f0d8a8;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.5;
}

.spr-payouts-info h4 {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #8a6d3b;
}

.spr-payouts-info h5 {
    margin: 8px 0 4px;
    font-size: 13px;
    font-weight: 600;
}

.spr-payouts-info ul {
    margin: 0 0 4px 18px;
    padding: 0;
}

/* =========================================================
   Таблиця форми (СТАБІЛЬНА, БЕЗ HOVER)
   ========================================================= */
.spr-payouts-form .form-table {
    width: 100%;
    border-collapse: collapse;
    background: transparent;
}

.spr-payouts-form .form-table th,
.spr-payouts-form .form-table td {
    padding: 6px 10px;
    border: 0;
}

/* Заголовки */
.spr-payouts-form .form-table th {
    width: 38%;
    background: #eef1f6;
    font-weight: 600;
    color: #333;
    text-align: left;
    vertical-align: middle;
}

/* Значення */
.spr-payouts-form .form-table td {
    background: #ffffff;
}

/* Чітке чергування кольорів */
.spr-payouts-form .form-table tr:nth-child(even) td {
    background: #f7f9fc;
}
.spr-payouts-form .form-table tr:nth-child(odd) td {
    background: #ffffff;
}

/* =========================================================
   FIX: Заборонити зміну кольору рядків таблиці при hover
   (перебиває стилі теми/WP-Recall)
   ========================================================= */
.spr-payouts-form .form-table tr:nth-child(odd) td {
    background-color: #ffffff !important;
}
.spr-payouts-form .form-table tr:nth-child(even) td {
    background-color: #f7f9fc !important;
}
.spr-payouts-form .form-table tr:hover td {
    background-color: inherit !important;
}
.spr-payouts-form .form-table tr:hover th {
    background-color: #eef1f6 !important;
}

/* =========================================================
   Інпути
   ========================================================= */
.spr-payouts-form input[type="text"],
.spr-payouts-form input[type="email"],
.spr-payouts-form input[type="tel"],
.spr-payouts-form .regular-text {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* =========================================================
   Опис / дрібний текст
   ========================================================= */
.spr-payouts-form .description {
    margin-top: 5px !important;
    font-size: 14px;
    color: #777;
}

/* =========================================================
   ФОП / фізична особа (службові блоки)
   ========================================================= */
.spr-individual-info th,
.spr-individual-info td {
    background: transparent;
    padding-top: 8px;
    padding-bottom: 12px;
}

.spr-individual-info .rcl-notice {
    margin: 0 0 8px;
    padding: 10px 12px;
    border-radius: 4px;
    background: #f9bec0;
    display: flex;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.5;
}

.spr-individual-info .rcl-notice__text {
    color: #5a3135;
}

/* =========================================================
   Кнопка
   ========================================================= */
.spr-payouts-wrapper .button-primary {
    background: #e26266;
    font-size: 13px;
    padding: 10px 16px;
}

.spr-payouts-wrapper .button-primary:hover,
.spr-payouts-wrapper .button-primary:focus {
    background: #c74c51;
    border-color: #c74c51;
}

/* =========================================================
   Заголовки секцій
   ========================================================= */
.spr-section-title {
    padding: 10px 12px;
    background: #f6f7f9;
    border-top: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
    color: #2b587a;
}

.spr-row-ipay-title th {
    background: transparent !important;
    padding: 0 !important;
}

/* =========================================================
   Лінки (оферта/інструкції)
   ========================================================= */
.spr-offer-link {
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

/* =========================================================
   iPay block (єдиний актуальний блок, без дублів)
   ========================================================= */
.spr-ipay-frame{
	background:#fff;
	border:1px solid #e3e7ee;
	border-radius:8px;
	padding:14px 14px 12px;
	box-shadow:0 1px 0 rgba(0,0,0,.03);
}

.spr-ipay-commission-note{
	background:#fff7e6;
	border:1px solid #ffe1b3;
	border-radius:7px;
	padding:10px 12px;
	line-height:1.45;
	font-size:13px;
	color:#6b4a00;
	margin:0 0 12px 0;
}

.spr-ipay-commission-note strong{
	font-weight:700;
}

.spr-ipay-commission-note span{
	display:block;
	margin-top:2px;
	color:#7a5a16;
}

.spr-ipay-meta{
	margin:0 0 10px 0;
}

.spr-ipay-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	padding:8px 0;
	border-top:1px dashed #e8edf5;
}

.spr-ipay-row:first-child{
	border-top:0;
	padding-top:0;
}

.spr-ipay-label{
	font-size:13px;
	color:#425466;
	font-weight:600;
}

.spr-ipay-value{
	font-size:13px;
	color:#111827;
	text-align:right;
}

.spr-ipay-code{
	padding:3px 8px;
	border-radius:999px;
	background:#f3f6fb;
	border:1px solid #e3eaf6;
	font-size:12px;
}

/* Badge */
.spr-ipay-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:4px 10px;
	border-radius:999px;
	font-size:12px;
	font-weight:700;
	border:1px solid transparent;
	line-height:1.2;
	white-space:nowrap;
}

/* Status colors */
.spr-ipay-status--active,
.spr-ipay-status--active_smch{
	background:#ecfdf3;
	color:#11643a;
	border-color:#bdeccf;
}

.spr-ipay-status--pending{
	background:#eef6ff;
	color:#1f4b99;
	border-color:#cfe2ff;
}

.spr-ipay-status--no_smch{
	background:#f6f7fb;
	color:#4b5563;
	border-color:#e6e9f2;
}

.spr-ipay-status--blocked{
	background:#fff1f2;
	color:#9f1239;
	border-color:#fecdd3;
}

.spr-ipay-desc{
	margin:8px 0 0 0;
	font-size:12px;
	color:#6b7280;
	line-height:1.5;
}

/* Мобільний: щоб не “ламало” рядки */
@media (max-width: 520px){
	.spr-ipay-row{
		flex-direction:column;
		align-items:flex-start;
	}
	.spr-ipay-value{
		text-align:left;
	}
}

/* =========================================================
   Info boxes під перемикачем типу продавця
   ========================================================= */
.spr-info-box--fop{
	margin-top: 10px;
	padding: 10px 14px;
	border-left: 3px solid #4caf50; /* зелений */
	background: #eef9f0;
	border-radius: 3px;
	font-size: 13px;
	line-height: 1.6;
}

.spr-info-box--individual{
margin-top: 10px;
    padding: 10px 14px;
    border-left: 3px solid #4caf50;
    background: #eef9f0;
    border-radius: 3px;
    font-size: 13px;
    line-height: 1.6;
}

/* =========================================================
   Адаптив
   ========================================================= */
@media screen and (max-width: 640px) {
    .spr-payouts-form .form-table th,
    .spr-payouts-form .form-table td {
        display: block;
        width: 100%;
    }

    .spr-payouts-form .form-table th {
        padding-bottom: 0;
    }

    .spr-payouts-form .form-table td {
        padding-top: 4px;
    }

    .spr-tax-toggle-wrap,
    .spr-payouts-more-toggle-wrap {
        text-align: left;
    }
}


.spr-payouts-form .form-table tr:hover td,
.spr-payouts-form .form-table tr:hover th {
    background-color: inherit !important;
}

.spr-payouts-form .form-table tr:nth-child(odd):hover td {
    background-color: #ffffff !important;
}
.spr-payouts-form .form-table tr:nth-child(even):hover td {
    background-color: #f7f9fc !important;
}

.spr-payouts-form .form-table tr:hover th {
    background-color: #eef1f6 !important;
}






/* =========================================================
   Contact dropdown (Фіз.особи) — 1 кнопка + гарне меню
   Додавай у seller-payouts.css
   ========================================================= */

/* =========================================================
   Contact dropdown — кнопки Telegram / Viber (final polish)
   ДОДАТИ НИЖЧЕ попередніх стилів
   ========================================================= */

/* =========================================================
   Contact dropdown — FINAL (зі стрілочкою)
   ДОДАТИ НИЖЧЕ ВСІХ попередніх стилів
   ========================================================= */

/* Меню — центр */
.spr-contact-author-menu{
	text-align: center;
}

/* ❗ Стрілочку НЕ ЧІПАЄМО
   (:before / :after залишаються з попереднього коду) */

/* Кнопки Telegram / Viber */
.spr-contact-author-item{
	display: flex;
	align-items: center;
	justify-content: center;

	gap: 10px;
	margin: 6px 0;

	padding: 12px 14px;

	border-radius: 999px; /* повністю заокруглені */
	border: 1px solid #e3e7ee;

	background: #ffffff;
	color: #2b587a;

	font-weight: 600;
	font-size: 14px;

	text-decoration: none !important;
	transition: all .15s ease;
	text-align: left;
}

/* Hover */
.spr-contact-author-item:hover{
	background: #f4f6f8;
	border-color: #d0d6df;
}

/* Кольорові кружечки */
.spr-contact-author-item:before{
	width: 14px;
	height: 14px;
	flex: 0 0 14px;
	border-radius: 50%;
}

/* Telegram */
.spr-contact-author-item--tg:before{
	background: #2aabee;
}

/* Viber */
.spr-contact-author-item--vb:before{
	background: #7360f2;
}

/* Прибираємо underline від теми */
.spr-contact-author-menu a,
.spr-contact-author-menu a:hover{
	text-decoration: none !important;
}


/* =========================================================
   Contact dropdown (Фіз.особи) — меню Telegram/Viber
   ========================================================= */

.spr-contact-author-dd{
	position: relative;
	display: inline-block;
}

.spr-contact-author-menu{
	position: absolute;
	z-index: 9999;
	top: calc(100% + 6px);
	left: 0;
	min-width: 160px;
	padding: 0 6px;
	background: #fff;
	border: 1px solid #d6dbe3;
	border-radius: 6px;
	box-shadow: 0 6px 18px rgba(0,0,0,.08);
	display: none;
}

.spr-contact-author-menu[data-open="1"]{
	display: block;
}

.spr-contact-author-item{
	display: block;
	padding: 8px 10px;
	border-radius: 4px;
	text-decoration: none;
	font-size: 14px;
	line-height: 1.2;
}

.spr-contact-author-item:hover{
	background: #f1f3f5;
}

/* Зменшення іконок Telegram / Viber у дропдауні */
.spr-contact-author-item img.telegram-icon,
.spr-contact-author-item img.viber-icon{
	width: 17px;
	height: 17px;
	vertical-align: middle;
	margin: 0;
}


/* Flash-повідомлення (success/error) */
.spr-payouts-flash {
    margin-bottom: 10px;
}


/* щоб tooltip не обрізався контейнерами таблиці */
.spr-payouts-form .form-table th,
.spr-payouts-form .form-table td{
	overflow: visible !important;
}

/* Tooltip */
.spr-payouts-form .spr-tip{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:16px;
	height:16px;
	margin:0  0  4px 6px;
	position:relative;
	cursor:help;
	opacity:0.50;
	vertical-align:middle;
}
.spr-payouts-form .spr-tip:hover,
.spr-payouts-form .spr-tip:focus{
	opacity:1;
	outline:none;
}
.spr-payouts-form .spr-tip i{
	font-size:14px;
	line-height:1;
}

/* ✅ відкриваємо ПРАВОРУЧ від значка, щоб не "різало" зліва */
.spr-payouts-form .spr-tip__bubble{
	display:none;
	position:absolute;
	left:100%;
	top:50%;
	transform:translateY(-50%);
	margin-left:10px;

	min-width:220px;
	max-width:340px;
	padding:8px 10px;

	background:#6E7F80;
	color:#fff;
	border-radius:6px;
	font-size:12px;
	line-height:1.4;
	z-index:99999;
	box-shadow:0 6px 18px rgba(0,0,0,.22);
	white-space:normal;
}

/* стрілка зліва у "бульбашки" */
.spr-payouts-form .spr-tip__bubble:before{
	content:"";
	position:absolute;
	left:-6px;
	top:50%;
	transform:translateY(-50%);
	border-top:6px solid transparent;
	border-bottom:6px solid transparent;
	border-right:6px solid #111;
}

.spr-payouts-form .spr-tip:hover .spr-tip__bubble,
.spr-payouts-form .spr-tip:focus .spr-tip__bubble{
	display:block;
}

/* На малих екранах зручніше вниз */
@media (max-width: 520px){
	.spr-payouts-form .spr-tip__bubble{
		left:50%;
		top:100%;
		transform:translateX(-50%);
		margin-left:0;
		margin-top:8px;
	}
	.spr-payouts-form .spr-tip__bubble:before{
		left:50%;
		top:-6px;
		transform:translateX(-50%);
		border-left:6px solid transparent;
		border-right:6px solid transparent;
		border-bottom:6px solid #111;
		border-top:none;
		border-right:none;
	}
}

/* =========================================================
   Логотипи платіжних систем у блоках автоматичних виплат
   ========================================================= */
.spr-payment-logo-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 8px;
	min-height: 50px;
}

.spr-payment-logo {
	display: block;
	width: 150px;
	max-width: 100%;
	height: auto;
	max-height: 50px;
	object-fit: contain;
}

@media screen and (max-width: 640px) {
	.spr-payment-logo-wrap {
		justify-content: flex-start;
	}
}
