/* Cryptoway Payment — the button, the form and the payment panel on the site.
   Colours and fonts come from the theme; the plugin only lays things out. */

.cwbtn { box-sizing: border-box; max-width: 100%; margin: 0 0 1.5em; }
.cwbtn *, .cwbtn *::before, .cwbtn *::after { box-sizing: inherit; }
.cwbtn--align-center { text-align: center; }
.cwbtn--align-center .cwbtn__chips, .cwbtn--align-center .cwbtn__input-wrap { justify-content: center; }
.cwbtn--align-right { text-align: right; }

.cwbtn__form { margin: 0; }
.cwbtn__form p, .cwbtn__row { margin: 0 0 .9em; }
.cwbtn__row--submit { margin-top: 1.1em; }

.cwbtn__hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

.cwbtn__amount { border: 0; padding: 0; margin: 0 0 .9em; min-width: 0; }
.cwbtn__amount legend { padding: 0; }
.cwbtn__label { display: block; font-size: .9em; margin: 0 0 .35em; opacity: .85; }
.cwbtn__label--sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.cwbtn__chips { display: flex; flex-wrap: wrap; gap: .5em; margin: 0 0 .8em; }
.cwbtn__chip { position: relative; display: inline-block; cursor: pointer; }
.cwbtn__chip input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.cwbtn__chip span { display: inline-block; padding: .45em 1em; border: 1px solid currentColor; border-radius: 999px; line-height: 1.3; opacity: .75; transition: opacity .12s, background-color .12s; }
/* The chosen chip uses the theme's contrast/base colours (block themes define them); plain black on white otherwise. */
.cwbtn__chip input:checked + span { opacity: 1; background: var(--wp--preset--color--contrast, #1d1f1c); color: var(--wp--preset--color--base, #fff); border-color: var(--wp--preset--color--contrast, #1d1f1c); }
.cwbtn__chip input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 2px; }
.cwbtn__chip--custom span { border-style: dashed; }

.cwbtn__input-wrap { display: inline-flex; align-items: center; gap: .5em; max-width: 100%; }
.cwbtn__input { font: inherit; padding: .5em .75em; border: 1px solid rgba(128,128,128,.6); border-radius: 6px; background: transparent; color: inherit; max-width: 100%; }
.cwbtn__input[type="number"] { width: 9em; -moz-appearance: textfield; appearance: textfield; }
/* No spinner arrows: they draw as a white box inside dark inputs and are no help for a sum. */
.cwbtn__input[type="number"]::-webkit-inner-spin-button, .cwbtn__input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.cwbtn__input--text { width: 100%; max-width: 28em; display: block; }
.cwbtn__currency { font-weight: 600; opacity: .8; }
.cwbtn__hint { display: block; font-size: .85em; opacity: .7; margin-top: .3em; }
/* Coin picker: a native select (works without JavaScript); the script draws its own short list over it, with the coins' marks */
.cwbtn__select { font: inherit; padding: .5em .75em; border: 1px solid rgba(128,128,128,.6); border-radius: 6px; background: transparent; color: inherit; max-width: 100%; }
.cwbtn__select option { color: #111; background: #fff; }
.cwbtn__coinbox { position: relative; display: inline-block; max-width: 100%; min-width: min(16em, 100%); vertical-align: top; }
.cwbtn__coinbox--js .cwbtn__select { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.cwbtn__coin-toggle { position: relative; display: inline-flex; align-items: center; width: 100%; font: inherit; line-height: 1.2; text-align: start; padding-block: .45em; padding-inline: .55em 2.2em; border: 1px solid rgba(128,128,128,.6); border-radius: 6px; background: transparent; color: inherit; cursor: pointer; }
.cwbtn__coin-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.cwbtn__coin-caret { position: absolute; inset-inline-end: .9em; top: 50%; width: .5em; height: .5em; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-70%) rotate(45deg); opacity: .7; }
.cwbtn__coin-list { position: absolute; z-index: 30; inset-inline: 0; top: calc(100% + 4px); margin: 0; padding: .3em; list-style: none; max-height: 17em; overflow: auto; background: var(--wp--preset--color--base, #fff); color: var(--wp--preset--color--contrast, #1d1f1c); border: 1px solid rgba(128,128,128,.4); border-radius: 8px; box-shadow: 0 12px 32px rgba(0,0,0,.18); text-align: start; }
.cwbtn__coin-list[hidden] { display: none; }
.cwbtn__coin-option { display: flex; align-items: center; margin: 0; padding: .4em .6em; border-radius: 6px; cursor: pointer; }
.cwbtn__coin-option:hover, .cwbtn__coin-option[aria-selected="true"] { background: rgba(128,128,128,.16); }
.cwbtn__coin-row { display: inline-flex; align-items: center; gap: .55em; min-width: 0; }
.cwbtn__coin-icon { flex: none; width: 1.5em; height: 1.5em; border-radius: 50%; background: #8b95a3 center / 100% 100% no-repeat; }
.cwbtn__coin-icon--text { display: inline-flex; align-items: center; justify-content: center; font-size: .55em; font-weight: 700; color: #fff; width: 2.73em; height: 2.73em; letter-spacing: .02em; }
.cwbtn__coin-text { display: inline-flex; align-items: baseline; gap: .4em; white-space: nowrap; }
.cwbtn__coin-ticker { font-weight: 600; }
.cwbtn__coin-net { font-size: .8em; opacity: .7; }
.cwbtn__coin-icon--usdt { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%2326A17B'/><path fill='%23fff' d='M8.5 8.5h15v4h-5.3v2.3c3.7.2 6.3 1 6.3 1.9s-2.6 1.7-6.3 1.9v6.9h-4.4v-6.9c-3.7-.2-6.3-1-6.3-1.9s2.6-1.7 6.3-1.9v-2.3H8.5z'/></svg>"); }
.cwbtn__coin-icon--usdc { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%232775CA'/><path fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' d='M12.2 8.3a8.4 8.4 0 0 0 0 15.4M19.8 8.3a8.4 8.4 0 0 1 0 15.4'/><text x='16' y='20.6' font-family='Arial,Helvetica,sans-serif' font-size='13' font-weight='700' fill='%23fff' text-anchor='middle'>$</text></svg>"); }
.cwbtn__coin-icon--btc { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23F7931A'/><g transform='rotate(-12 16 16)'><text x='16.5' y='22.5' font-family='Arial,Helvetica,sans-serif' font-size='18' font-weight='700' fill='%23fff' text-anchor='middle'>B</text><path fill='%23fff' d='M14.2 6.5h1.5v3h-1.5zM16.8 6.5h1.5v3h-1.5zM14.2 22.5h1.5v3h-1.5zM16.8 22.5h1.5v3h-1.5z'/></g></svg>"); }
.cwbtn__coin-icon--eth { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23627EEA'/><path fill='%23fff' fill-opacity='.6' d='M16 5.5v7.8l6.6 2.9z'/><path fill='%23fff' d='M16 5.5L9.4 16.2l6.6-2.9z'/><path fill='%23fff' fill-opacity='.6' d='M16 21.5v5l6.6-9.2z'/><path fill='%23fff' d='M16 26.5v-5l-6.6-4.2z'/><path fill='%23fff' fill-opacity='.2' d='M16 20.2l6.6-4-6.6-2.9z'/><path fill='%23fff' fill-opacity='.6' d='M9.4 16.2l6.6 4v-6.9z'/></svg>"); }
.cwbtn__coin-icon--bnb { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23F3BA2F'/><path fill='%23fff' d='M16 7.2l5.4 5.4-2 2L16 11.2l-3.4 3.4-2-2zM7.2 16l2-2 2 2-2 2zM16 12.6L19.4 16 16 19.4 12.6 16zM20.8 16l2-2 2 2-2 2zM16 24.8l-5.4-5.4 2-2 3.4 3.4 3.4-3.4 2 2z'/></svg>"); }
.cwbtn__coin-icon--trx { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23EF0027'/><path fill='%23fff' fill-rule='evenodd' d='M7.3 7.8l16.9 3.3-7.9 14.4zm3.9 2.9l9.6 1.9-4.4 9.4z'/></svg>"); }
.cwbtn__coin-icon--ltc { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23345D9D'/><text x='16.5' y='23' font-family='Arial,Helvetica,sans-serif' font-size='19' font-weight='700' fill='%23fff' text-anchor='middle'>%C5%81</text></svg>"); }
.cwbtn__coin-icon--pol { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%238247E5'/><path fill='none' stroke='%23fff' stroke-width='2.2' stroke-linejoin='round' d='M10.5 12.4l5.5-3.2 5.5 3.2v6.4l-5.5 3.2-5.5-3.2z'/><path fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' d='M16 9.2v13.6'/></svg>"); }
.cwbtn__coin-icon--ton { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%230098EA'/><path fill='%23fff' d='M9.2 9h13.6c1.4 0 2.1 1.5 1.4 2.7L17.3 24a1.5 1.5 0 0 1-2.6 0L8 11.7C7.3 10.5 8 9 9.2 9z'/><path fill='%230098EA' d='M15.2 10.8h1.6v12.4h-1.6z'/></svg>"); }
.cwbtn__coin-icon--sol { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23101114'/><path fill='%2314F195' d='M11.2 10h12.3l-2.7 2.8H8.5z'/><path fill='%2366B0F0' d='M8.5 14.6h12.3l2.7 2.8H11.2z'/><path fill='%239945FF' d='M11.2 19.2h12.3l-2.7 2.8H8.5z'/></svg>"); }
.cwbtn__coin-icon--doge { background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%23C2A633'/><text x='17' y='22.5' font-family='Arial,Helvetica,sans-serif' font-size='17' font-weight='700' fill='%23fff' text-anchor='middle'>D</text><path stroke='%23fff' stroke-width='2.2' stroke-linecap='round' d='M9.5 16h6'/></svg>"); }

.cwbtn__button { cursor: pointer; font: inherit; line-height: 1.3; }
/* Looks set on the button itself (block sidebar or shortcode): colour, text colour, corners, width. */
.cwbtn--colored .cwbtn__button { background-color: var(--cwbtn-accent, var(--wp--preset--color--contrast, #1d1f1c)); color: var(--cwbtn-accent-text, #fff); border-color: var(--cwbtn-accent, var(--wp--preset--color--contrast, #1d1f1c)); }
.cwbtn--colored .cwbtn__button:hover, .cwbtn--colored .cwbtn__button:focus { background-color: var(--cwbtn-accent, var(--wp--preset--color--contrast, #1d1f1c)); color: var(--cwbtn-accent-text, #fff); filter: brightness(1.08); }
.cwbtn--colored .cwbtn__chip input:checked + span { background: var(--cwbtn-accent, var(--wp--preset--color--contrast, #1d1f1c)); color: var(--cwbtn-accent-text, #fff); border-color: var(--cwbtn-accent, var(--wp--preset--color--contrast, #1d1f1c)); }
.cwbtn--rounded .cwbtn__button, .cwbtn--rounded .cwbtn__input, .cwbtn--rounded .cwbtn__select, .cwbtn--rounded .cwbtn__coin-toggle { border-radius: var(--cwbtn-radius, 6px); }
.cwbtn--full .cwbtn__button { display: block; width: 100%; text-align: center; }
.cwbtn--full .cwbtn__input--text { max-width: none; }

/* Optional frame: the form as a card. Border and fill derive from the theme's text colour, so it
   works on light and dark themes alike; --cwbtn-frame-radius can be set by the theme's CSS. */
.cwbtn--framed { box-sizing: border-box; padding: 1.25em 1.5em; border: 1px solid color-mix(in srgb, currentColor 14%, transparent); border-radius: var(--cwbtn-frame-radius, 14px); background: color-mix(in srgb, currentColor 3%, transparent); }
.cwbtn--framed > .cwbtn__form, .cwbtn--framed > .cwbtn__panel { margin: 0; }

/* Cards (frame and skins) stay narrower than the page; the editor's wide/full alignment lifts that,
   and a centred block centres the card. */
.cwbtn--framed, .cwbtn--skin-dark, .cwbtn--skin-cryptoway { max-width: 30em; }
.aligncenter > .cwbtn--framed, .aligncenter > .cwbtn--skin-dark, .aligncenter > .cwbtn--skin-cryptoway { margin-left: auto; margin-right: auto; }
.alignwide > .cwbtn, .alignfull > .cwbtn { max-width: none; }

/* Skin "dark": a dark card with a violet-to-cyan button. */
.cwbtn--skin-dark { color: #f3f4f6; padding: clamp(1em, 5%, 1.5em); border-radius: 20px; background: #14161a; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.cwbtn--skin-dark > .cwbtn__form, .cwbtn--skin-dark > .cwbtn__panel { margin: 0; }
.cwbtn--skin-dark .cwbtn__label, .cwbtn--skin-dark .cwbtn__hint { color: #9aa3ad; opacity: 1; }
.cwbtn--skin-dark .cwbtn__chip span { background: #1f232a; border-color: #2c323b; color: #e5e7eb; opacity: 1; }
.cwbtn--skin-dark .cwbtn__chip input:checked + span { background: #7c3aed; border-color: #7c3aed; color: #fff; }
.cwbtn--skin-dark .cwbtn__input, .cwbtn--skin-dark .cwbtn__select, .cwbtn--skin-dark .cwbtn__coin-toggle { background: #1f232a; border-color: #2c323b; color: #fff; border-radius: 10px; }
.cwbtn--skin-dark .cwbtn__coin-list { background: #1f232a; color: #f3f4f6; border-color: #2c323b; }
.cwbtn--skin-dark .cwbtn__coin-option:hover, .cwbtn--skin-dark .cwbtn__coin-option[aria-selected="true"] { background: #7c3aed; color: #fff; }
.cwbtn--skin-dark .cwbtn__button { background: linear-gradient(135deg, #7c3aed, #0e7490); color: #fff; border: 0; border-radius: 999px; padding: .9em 1.8em; font-weight: 600; }
.cwbtn--skin-dark .cwbtn__button:hover, .cwbtn--skin-dark .cwbtn__button:focus { background: linear-gradient(135deg, #7c3aed, #0e7490); color: #fff; filter: brightness(1.1); }
.cwbtn--skin-dark .cwbtn__panel { border-color: #2c323b; }
.cwbtn--skin-dark .cwbtn__qr { background: #fff; padding: 8px; border-radius: 10px; }

/* Skin "cryptoway": black glass, the brand green (#14B95D -> #20EC7B) and the official mark on the
   button (the glyph as a data URI, drawn from the brand paths; the brand book forbids redrawing it). */
/* No overflow: hidden here — the open coin list hangs below the card (it was clipped, 2026-10-12); the glow stays inside on its own. */
.cwbtn--skin-cryptoway { position: relative; color: #F4F4F2; padding: clamp(1em, 5%, 1.5em); border-radius: 22px; background: radial-gradient(120% 90% at 0% 0%, #17201b 0%, #0E0E10 55%, #0b0b0d 100%); border: 1px solid rgba(32,236,123,.18); box-shadow: 0 30px 60px -20px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,255,255,.03), 0 0 80px -30px rgba(20,185,93,.55); }
.cwbtn--skin-cryptoway::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(55% 55% at 100% 0%, rgba(32,236,123,.22), transparent 70%); pointer-events: none; }
.cwbtn--skin-cryptoway > .cwbtn__form, .cwbtn--skin-cryptoway > .cwbtn__panel { position: relative; margin: 0; }
.cwbtn--skin-cryptoway .cwbtn__label { color: #9aa49d; font-size: .72em; letter-spacing: .14em; text-transform: uppercase; opacity: 1; }
.cwbtn--skin-cryptoway .cwbtn__chip span { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.12); color: #e8ebe8; opacity: 1; padding: .55em 1.15em; font-variant-numeric: tabular-nums; }
.cwbtn--skin-cryptoway .cwbtn__chip input:checked + span { background: linear-gradient(135deg, #14B95D, #20EC7B); border-color: transparent; color: #0E0E0E; font-weight: 600; box-shadow: 0 8px 24px -8px rgba(32,236,123,.7); }
.cwbtn--skin-cryptoway .cwbtn__input, .cwbtn--skin-cryptoway .cwbtn__select { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); color: #fff; border-radius: 12px; padding: .7em .9em; }
.cwbtn--skin-cryptoway .cwbtn__coin-toggle { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); color: #fff; border-radius: 12px; padding-block: .6em; padding-inline: .7em 2.2em; }
.cwbtn--skin-cryptoway .cwbtn__coin-list { background: #121715; color: #e8ebe8; border-color: rgba(32,236,123,.3); box-shadow: 0 16px 40px rgba(0,0,0,.5); }
.cwbtn--skin-cryptoway .cwbtn__coin-option:hover, .cwbtn--skin-cryptoway .cwbtn__coin-option[aria-selected="true"] { background: rgba(32,236,123,.18); }
.cwbtn--skin-cryptoway .cwbtn__input:focus, .cwbtn--skin-cryptoway .cwbtn__coin-toggle:focus-visible { outline: none; border-color: #20EC7B; box-shadow: 0 0 0 3px rgba(32,236,123,.2); }
.cwbtn--skin-cryptoway .cwbtn__currency { color: #20EC7B; }
.cwbtn--skin-cryptoway .cwbtn__hint { color: #8d968f; opacity: 1; }
.cwbtn--skin-cryptoway .cwbtn__button { display: flex; align-items: center; justify-content: center; gap: .6em; width: 100%; background: linear-gradient(135deg, #14B95D 0%, #20EC7B 100%); color: #0E0E0E; border: 0; border-radius: 16px; padding: 1em 1.6em; font-weight: 700; box-shadow: 0 14px 30px -10px rgba(32,236,123,.6), inset 0 1px 0 rgba(255,255,255,.35); transition: transform .15s, box-shadow .15s; }
.cwbtn--skin-cryptoway .cwbtn__button::before { content: ''; flex: none; width: 1.25em; height: 1.25em; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%20-7%2033%2033%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M15.5501%202.73408C15.6927%202.57664%2015.6812%202.33271%2015.5181%202.19658C14.1699%201.07135%2012.5327%200.341998%2010.789%200.0941397C8.91825%20-0.171792%207.0107%200.128744%205.3123%200.957C3.61391%201.78526%202.20254%203.10326%201.26016%204.74108C0.317782%206.37891%20-0.112403%208.26147%200.0250681%2010.1461C0.162539%2012.0306%200.861363%2013.8308%202.03144%2015.3146C3.20152%2016.7983%204.78922%2017.8975%206.58983%2018.4706C8.39044%2019.0436%2010.0103%2018.9524%2012.1338%2018.5295C13.3062%2018.2961%2017.133%2015.4109%2019.402%2013.5558C19.5507%2013.4342%2019.7655%2013.4403%2019.907%2013.5702L25.2258%2018.4516C25.4152%2018.6254%2025.7185%2018.5682%2025.8314%2018.3373L32.8137%204.06979C32.9628%203.76517%2032.6733%203.43071%2032.3505%203.53449L26.0307%205.56584C25.7025%205.67133%2025.6681%206.12197%2025.9764%206.27612L27.0951%206.8355C27.2858%206.93086%2027.3626%207.16314%2027.2663%207.35336L24.7641%2012.294C24.6458%2012.5275%2024.334%2012.5773%2024.1489%2012.3922L19.9058%208.14916C19.7663%208.00961%2019.5438%207.9983%2019.3908%208.12298L13.5834%2012.8561C13.5834%2012.8561%2011.9943%2014.2822%2010.9701%2014.5843C9.94591%2014.8864%208.8547%2014.8748%207.83717%2014.551C6.81964%2014.2272%205.92243%2013.606%205.26121%2012.7676C4.59999%2011.9291%204.20508%2010.9118%204.1274%209.84681C4.04971%208.78182%204.29281%207.71798%204.82535%206.79244C5.3579%205.8669%206.15547%205.12209%207.11524%204.65404C8.07501%204.18599%209.15297%204.01615%2010.2102%204.16643C11.1401%204.29862%2012.0164%204.67315%2012.7525%205.24937C12.9198%205.38032%2013.1622%205.36955%2013.3049%205.21212L15.5501%202.73408Z%22%20fill%3D%22%230E0E0E%22%2F%3E%3Cpath%20d%3D%22M11.5736%206.31167C11.7183%206.31167%2011.8507%206.39281%2011.9164%206.52168L14.1685%2010.9409C14.2508%2011.1023%2014.2093%2011.2992%2014.0689%2011.4137L13.0919%2012.2102L13.0718%2012.2271L13.0548%2012.2423C13.0535%2012.2434%2013.052%2012.2444%2013.0507%2012.2456C13.0486%2012.2475%2013.045%2012.2508%2013.0401%2012.2551C13.0303%2012.2638%2013.0151%2012.2775%2012.9948%2012.2952C12.9538%2012.3309%2012.8926%2012.3838%2012.8158%2012.4483C12.6615%2012.5777%2012.4461%2012.7525%2012.2031%2012.9349C12.0432%2013.0549%2011.8846%2013.1672%2011.7328%2013.2681C11.5471%2013.3917%2011.2992%2013.3177%2011.2001%2013.1179L8.09914%206.8673C7.97228%206.6116%208.1583%206.31167%208.44373%206.31167H11.5736Z%22%20fill%3D%22%230E0E0E%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; }
.cwbtn--skin-cryptoway .cwbtn__button:hover, .cwbtn--skin-cryptoway .cwbtn__button:focus { background: linear-gradient(135deg, #14B95D 0%, #20EC7B 100%); color: #0E0E0E; transform: translateY(-1px); box-shadow: 0 18px 36px -10px rgba(32,236,123,.75), inset 0 1px 0 rgba(255,255,255,.35); }
.cwbtn--skin-cryptoway .cwbtn__button--again::before { display: none; }
.cwbtn--skin-cryptoway .cwbtn__panel { border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.03); border-radius: 16px; }
.cwbtn--skin-cryptoway .cwbtn__qr { background: #fff; padding: 10px; border-radius: 12px; }
.cwbtn--skin-cryptoway .cwbtn__status--paid { color: #20EC7B; }
.cwbtn__button[disabled] { opacity: .6; cursor: progress; }
.cwbtn__button--again { margin-top: .5em; }

.cwbtn__error { color: #b32d2e; font-size: .9em; margin: .5em 0 0; }
.cwbtn__error[hidden] { display: none; }

/* The payment panel */
.cwbtn__panel { border: 1px solid rgba(128,128,128,.35); border-radius: 10px; padding: 1.1em 1.25em; margin: 0; text-align: start; }
.cwbtn__panel[hidden] { display: none; }
.cwbtn__status { margin: 0 0 .75em; font-weight: 600; white-space: pre-line; }
/* Focused by the script only so screen readers read the new state; it is not a control. */
.cwbtn__status:focus { outline: none; }
.cwbtn__status--paid { color: #1f8a5b; }
.cwbtn__status--expired, .cwbtn__status--cancelled, .cwbtn__status--failed { opacity: .8; }
.cwbtn__amount-line { margin: 0 0 .75em; }
.cwbtn__pay { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1em 1.25em; align-items: start; }
@media (max-width: 560px) { .cwbtn__pay { grid-template-columns: 1fr; } .cwbtn__qr { order: -1; } }
.cwbtn__qr { width: 160px; max-width: 100%; }
.cwbtn__qr svg { display: block; width: 100%; height: auto; background: #fff; border-radius: 6px; padding: 6px; }
.cwbtn__field { margin: 0 0 .75em; }
.cwbtn__field-label { display: block; font-size: .8em; opacity: .7; margin-bottom: .2em; }
.cwbtn__field-value { display: flex; align-items: center; gap: .5em; flex-wrap: wrap; }
.cwbtn__field-value code, .cwbtn__address code { font-size: .9em; word-break: break-all; background: rgba(128,128,128,.12); padding: .3em .5em; border-radius: 4px; }
.cwbtn__copy { font: inherit; font-size: .8em; padding: .3em .7em; border: 1px solid rgba(128,128,128,.6); border-radius: 999px; background: transparent; color: inherit; cursor: pointer; }
.cwbtn__copy:hover { background: rgba(128,128,128,.12); }
.cwbtn__timer { margin: .5em 0 0; font-size: .9em; opacity: .85; }
.cwbtn__panel .cwbtn__hint { margin-top: .75em; }
.cwbtn__link { font-weight: 600; }
.cwbtn__again { margin: .75em 0 0; }
.cwbtn__spinner { display: inline-block; width: .9em; height: .9em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: cwbtn-spin .8s linear infinite; vertical-align: -.15em; margin-inline-end: .4em; }
@keyframes cwbtn-spin { to { transform: rotate(360deg); } }

.cwbtn--setup { border: 1px dashed rgba(128,128,128,.6); border-radius: 8px; padding: .75em 1em; font-size: .9em; }
.cwbtn-duplicate { border-inline-start: 3px solid #b45309; background: #fff7ed; color: #7c2d12; padding: .5em .8em; margin: 0 0 .5em; font-size: .9em; }

/* In the editor the preview must not react. */
.cwbtn--editor .cwbtn__button { display: inline-block; }
.cwbtn--size-small .cwbtn__button { font-size: .85em; padding: .5em 1em; }
.cwbtn--size-large .cwbtn__button { font-size: 1.2em; padding: .9em 1.7em; }
.cwbtn--size-large .cwbtn__chip span { font-size: 1.1em; }

/* Paid content opened to the payer */
.cwbtn__content { margin-top: 1em; }
.cwbtn__content > :first-child { margin-top: 0; }
.cwbtn__hint--field { display: block; font-size: .85em; opacity: .75; margin: .3em 0 0; }

/* "Already paid?" under a paid-content button */
.cwbtn__recover { margin: .9em 0 0; font-size: .9em; }
.cwbtn__recover[hidden] { display: none; }
.cwbtn__recover-link { display: inline-block; cursor: pointer; text-decoration: underline; opacity: .8; list-style: none; }
.cwbtn__recover-link::-webkit-details-marker { display: none; }
.cwbtn__recover-link:hover { opacity: 1; }
.cwbtn__recover-form { margin: .6em 0 0; }
.cwbtn__recover-row { display: flex; flex-wrap: wrap; gap: .5em; align-items: center; }
.cwbtn__recover-row .cwbtn__input { flex: 1 1 12em; }
.cwbtn__button--recover { font-size: .9em; padding: .55em 1em; }
.cwbtn__recover-note { margin: .5em 0 0; }
.cwbtn__recover-note[hidden] { display: none; }
.cwbtn__recover-note--error { color: #b32d2e; }

/* The value inside the drawn coin list's button (the caret sits beside it). */
.cwbtn__coin-value { display: inline-flex; min-width: 0; }

/* Readable on the dark cards: errors, "paid" (WCAG AA against the card backgrounds). */
.cwbtn--skin-dark .cwbtn__error, .cwbtn--skin-dark .cwbtn__recover-note--error,
.cwbtn--skin-cryptoway .cwbtn__error, .cwbtn--skin-cryptoway .cwbtn__recover-note--error { color: #ff9b9b; }
.cwbtn--skin-dark .cwbtn__status--paid { color: #4ade80; }