/* WP EasyCart Admin — Settings › Payments ( 6.0.7, the Payments and Taxes plan ): the card processor in use, Another gateway's list,
   the Free plan's fee, Live or test, Flex-Fees, For some stores, Every gateway and Before you go live. The rest of the page is setup-v2.css. */

/* 6.0.7 ( Matt's review ): the card processor in use, across the row, first: whether payments are live or in test mode ( a banner, amber
   in test mode ), the Live / Test switch where both have an account, and Settings. The card's is-live / is-test class picks the banner's
   line, so the switch shows the new mode at once. */
.ecsu-pay-ways .ecsu-way-name { display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; min-width:0; }
.ecsu-pay-ways .ecsu-way.is-current { gap:10px; padding:14px 16px; }
.ecsu-pay-ways .ecsu-way.is-current .ecsu-way-title { font-size:15px; }
.ecsu-pay-ways .ecsu-way.is-current.is-test { border-color:#f59e0b; box-shadow:inset 0 0 0 1px #f59e0b; background:#fffdf5; }
.ecsu-way-mode { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; padding:10px 12px; border:1px solid var(--ecv2-g200); border-radius:8px; background:var(--ecv2-g50, #f9fafb); font-size:13px; line-height:1.45; color:var(--ecv2-g700); }
.ecsu-way-mode-text { flex:1 1 220px; min-width:0; }
.ecsu-way-mode-line { display:block; }
.ecsu-way-mode-line b { display:inline-flex; align-items:center; gap:6px; margin-right:4px; font-size:14px; color:var(--ecv2-g900); }
.ecsu-way-mode-line b::before { content:""; flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:currentColor; }
.ecsu-way.is-live .ecsu-way-mode { background:#dcfce7; border-color:#86efac; color:#14532d; }
.ecsu-way.is-live .ecsu-way-mode-line b { color:#14532d; }
.ecsu-way.is-test .ecsu-way-mode { background:#fef3c7; border-color:#fbbf24; color:#78350f; }
.ecsu-way.is-test .ecsu-way-mode-line b { color:#78350f; }
.ecsu-way.is-live .ecsu-way-mode-line[data-mode="test"], .ecsu-way.is-test .ecsu-way-mode-line[data-mode="live"] { display:none; }
.ecsu-way-mode.is-todo { background:#e0e7ff; border-color:#a5b4fc; color:#312e81; }
.ecsu-way-mode.is-todo .ecsu-way-mode-line b { color:#312e81; }
.ecsu-way-mode.is-warn { background:#fee2e2; border-color:#fca5a5; color:#7f1d1d; }
.ecsu-way-mode.is-warn .ecsu-way-mode-line b { color:#7f1d1d; }
.ecsu-way-seg { display:inline-flex; flex:0 0 auto; max-width:100%; border:1px solid var(--ecv2-g300); border-radius:8px; background:#fff; overflow:hidden; }
.ecsu-way-seg-btn { min-height:34px; min-width:64px; padding:0 14px; border:0; background:transparent; color:var(--ecv2-g700); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.ecsu-way-seg-btn + .ecsu-way-seg-btn { border-left:1px solid var(--ecv2-g300); }
.ecsu-way-seg-btn:hover { background:var(--ecv2-g50, #f9fafb); color:var(--ecv2-g900); }
.ecsu-way-seg-btn.is-on[data-value="live"] { background:#15803d; color:#fff; }
.ecsu-way-seg-btn.is-on[data-value="test"] { background:#b45309; color:#fff; }
.ecsu-way-seg-btn.is-on { cursor:default; }
.ecsu-way-seg-btn:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:-3px; }
.ecsu-way-seg-btn[aria-busy="true"] { cursor:progress; }
.ecsu-pay-ways .ecsu-way-foot .ecsu-link { font-size:13px; }
/* 6.0.7 ( Matt: PayPal at the top with Stripe and Square, each easy to connect or to try with a test account ): the ways share each
   row's width ( Stripe, Square and PayPal side by side, two side by side when one is in use above ), the card in use and Another
   gateway across the row; on a narrow screen one under the other. The test account is a text link after Connect. */
.ecsu-ways.ecsu-pay-ways { display:flex; flex-wrap:wrap; align-items:stretch; }
.ecsu-pay-ways > .ecsu-way { flex:1 1 180px; }
.ecsu-pay-ways > .ecsu-way.is-wide { flex-basis:100%; }
.ecsu-pay-ways .ecsu-way-foot a.ecsu-link { font-weight:400; text-decoration:underline; text-underline-offset:2px; }
/* 6.0.7 ( Matt's review ): with a card processor in use, Change payment gateway opens the others in a panel under its card. */
.ecsu-pay-change { display:flex; flex-direction:column; gap:10px; padding:12px; border:1px dashed var(--ecv2-g300); border-radius:var(--ecv2-r, 10px); background:var(--ecv2-g50, #f9fafb); }
.ecsu-pay-change[hidden] { display:none; }
.ecsu-pay-change-head { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.ecsu-pay-change-head b { font-size:14px; color:var(--ecv2-g900); }
.ecsu-pay-change-head b:focus { outline:none; }
.ecsu-pay-change-head b:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:2px; }
.ecsu-pay-change-head span { flex:1 1 260px; min-width:0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }
.ecsu-pay-change .ecsu-way { background:#fff; }
.ecsu-pay-ways .ecsu-way-foot .ecsu-pay-change-btn { margin-left:auto; }
.ecsu-pay-change-btn[aria-expanded="true"] { background:var(--ecv2-g100, #f3f4f6); }

/* Another gateway: Use / Change to another gateway shows the list in the card, nothing chosen until the store picks one. */
.ecsu-gw-reveal[hidden] { display:none !important; }
.ecsu-gw-pick { display:flex; flex-direction:column; gap:8px; padding-top:12px; border-top:1px dashed var(--ecv2-g200); }
.ecsu-gw-pick[hidden] { display:none; }
.ecsu-gw-pick-label { font-size:13px; font-weight:600; color:var(--ecv2-g900); }
.ecsu-gw-pick .ecsu-combo { flex:1 1 240px; max-width:360px; }
.ecsu-gw-pick .ecsu-gw-open:disabled { opacity:.5; cursor:not-allowed; }
.ecsu-gw-pick-note { margin:0; font-size:12px; line-height:1.45; color:var(--ecv2-g600); }
.ecsu-pay-ways .ecsu-pay-testers { font-size:12.5px; }

/* D7: the Free plan's fee, under the card processors */
.ecsu-pay-fee { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:12px 14px; border:1px solid var(--ecv2-g200); border-radius:var(--ecv2-r, 10px); background:var(--ecv2-g50, #f9fafb); }
.ecsu-pay-fee p { flex:1 1 360px; min-width:0; margin:0; font-size:13px; line-height:1.5; color:var(--ecv2-g700); }
.ecsu-pay-fee p b { display:block; color:var(--ecv2-g900); }

/* D6: Live or test */
.ecsu-pay-modes { margin:0; padding:0; list-style:none; border:1px solid var(--ecv2-g200); border-radius:var(--ecv2-r, 10px); }
.ecsu-pay-mode { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; padding:12px 14px; }
.ecsu-pay-mode + .ecsu-pay-mode { border-top:1px solid var(--ecv2-g200); }
.ecsu-pay-mode.is-test { background:#fffbeb; }
.ecsu-pay-mode-main { flex:1 1 280px; min-width:0; display:flex; flex-direction:column; gap:2px; font-size:13px; color:var(--ecv2-g600); }
.ecsu-pay-mode-main b { font-size:14px; color:var(--ecv2-g900); }
.ecsu-pay-testers { margin:0; font-size:13px; color:var(--ecv2-g700); }
.ecsu-pay-testers a { color:var(--ecsu-accent); font-weight:600; }

/* D7: Flex-Fees */
.ecsu-card-head.ecsu-card-head-row { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:10px 16px; }
.ecsu-card-head.ecsu-card-head-row > div { flex:1 1 360px; min-width:0; }
.ecsu-pay-fees { margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px; }
.ecsu-pay-fees li { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; padding:8px 12px; border:1px solid var(--ecv2-g200); border-radius:8px; font-size:13px; }
.ecsu-pay-fee-amount { font-weight:700; font-variant-numeric:tabular-nums; color:var(--ecv2-g900); }

/* For some stores */
.ecsu-pay-some { border:1px solid var(--ecv2-g200); border-radius:var(--ecv2-r, 10px); }
.ecsu-pay-some summary { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 12px; min-height:44px; padding:6px 14px; cursor:pointer; font-size:14px; color:var(--ecv2-g900); }
.ecsu-pay-some summary:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:2px; border-radius:var(--ecv2-r, 10px); }
.ecsu-pay-some-body { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:0 14px 12px; }
.ecsu-pay-some-body p { flex:1 1 360px; min-width:0; margin:0; font-size:13px; line-height:1.5; color:var(--ecv2-g600); }

/* D5: Every gateway */
.ecsu-dialog.ecsu-pay-catalog { width:min(920px, calc(100vw - 32px)); }

/* D8: Before you go live, under the preview */
.ecsu-pay-golive { margin-top:14px; padding-top:12px; border-top:1px solid var(--ecv2-g200); }
.ecsu-pay-golive h3 { margin:0 0 8px; font-size:13px; font-weight:700; color:var(--ecv2-g900); }
.ecsu-pay-golive ul { margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px; }
.ecsu-pay-golive li { display:flex; align-items:flex-start; gap:8px; font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }
.ecsu-pay-golive-mark { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:50%; font-size:11px; font-weight:700; background:var(--ecv2-g100); color:var(--ecv2-g600); }
.ecsu-pay-golive li.is-ok .ecsu-pay-golive-mark { background:#dcfce7; color:#166534; }