.payment-picker {
  --picker-bg: var(--surface, #fff);
  --picker-surface: var(--surface-subtle, #f7f8fb);
  --picker-surface-strong: var(--surface-raised, #eef2f8);
  --picker-line: var(--border, #e2e7ef);
  --picker-text: var(--text, #121a2a);
  --picker-muted: var(--text-2, #667085);
  --picker-subtle: var(--text-3, #98a2b3);
  --picker-accent: var(--primary, #3861fb);
  --picker-accent-soft: color-mix(in srgb, var(--picker-accent) 13%, var(--picker-bg));
  --picker-danger: var(--negative, #df3344);
  position: relative;
  color: var(--picker-text);
  background: var(--picker-bg);
  font-family: inherit;
  padding: 22px !important;
}
.payment-picker__duration { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.payment-picker__duration button { display: grid; gap: 3px; min-height: 62px; padding: 9px 12px; border: 1px solid var(--picker-line); border-radius: 12px; background: var(--picker-surface); color: var(--picker-text); font: inherit; cursor: pointer; }
.payment-picker__duration button b { font-size: 13px; }
.payment-picker__duration button[aria-pressed="true"] { border-color: var(--picker-accent); background: var(--picker-accent-soft); }
.payment-picker__duration button:focus-visible { outline: 3px solid var(--picker-accent); outline-offset: 2px; }
.payment-picker::before { content: ""; display: block; width: 38px; height: 4px; margin: -12px auto 16px; border-radius: 999px; background: var(--border-strong, #d7dbe4); }
.payment-picker__close { position: absolute !important; z-index: 2; top: 18px !important; left: 18px !important; width: 42px !important; height: 42px !important; display: grid !important; place-items: center; padding: 0 !important; border: 1px solid var(--picker-line) !important; border-radius: 14px !important; background: var(--picker-bg) !important; color: var(--picker-text) !important; }
.payment-picker__close svg { display: block; width: 20px !important; height: 20px !important; }
.payment-picker__header { min-height: 54px; padding: 2px 58px 0 !important; display: grid !important; grid-template-columns: 1fr !important; place-items: center; margin: 0 0 18px !important; text-align: center !important; direction: rtl !important; }
.payment-picker__header > span { grid-column: 1 !important; display: grid; gap: 2px; text-align: center; }
.payment-picker__header h2 { margin: 0 !important; color: var(--picker-text) !important; font-size: 21px !important; line-height: 1.5 !important; }
.payment-picker__header p,.payment-picker__header small { margin: 0 !important; color: var(--picker-muted) !important; font-size: 11px !important; line-height: 1.7 !important; }
.payment-picker__summary { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1px !important; margin: 0 0 14px !important; overflow: hidden; border: 1px solid var(--picker-line); border-radius: 15px !important; background: var(--picker-line) !important; }
.payment-picker__summary > span { min-width: 0; padding: 13px 15px !important; display: grid !important; gap: 4px !important; background: var(--picker-surface) !important; text-align: right; }
.payment-picker__summary small { color: var(--picker-muted) !important; font-size: 10px !important; line-height: 1.5; }
.payment-picker__summary b { color: var(--picker-text); font-size: 14px !important; line-height: 1.5; }
.payment-picker__methods { display: grid !important; gap: 10px !important; margin: 0 !important; border: 0 !important; }
.payment-picker__method { box-sizing: border-box; width: 100% !important; min-height: 78px !important; padding: 10px 12px !important; display: grid !important; grid-template-columns: 46px minmax(0, 1fr) minmax(78px, auto) 18px !important; grid-template-areas: "icon copy price arrow" !important; align-items: center !important; gap: 10px !important; border: 1px solid var(--picker-line) !important; border-radius: 15px !important; background: var(--picker-surface) !important; color: var(--picker-text) !important; text-align: right !important; direction: rtl !important; overflow: hidden; cursor: pointer; transition: border-color .16s ease, background-color .16s ease, transform .16s ease; }
.payment-picker__method:hover:not(:disabled):not(.unavailable) { border-color: color-mix(in srgb, var(--picker-accent) 42%, var(--picker-line)) !important; background: color-mix(in srgb, var(--picker-accent) 4%, var(--picker-bg)) !important; }
.payment-picker__method[aria-pressed="true"] { border-color: var(--picker-accent) !important; background: color-mix(in srgb, var(--picker-accent) 9%, var(--picker-bg)) !important; }
.payment-picker__method[aria-pressed="true"] .payment-picker__arrow { color: var(--picker-accent) !important; }
.payment-picker__method:active:not(:disabled):not(.unavailable) { transform: scale(.99); }
.payment-picker__icon { grid-area: icon !important; width: 46px !important; height: 46px !important; display: grid !important; place-items: center; border-radius: 14px !important; background: var(--picker-accent-soft) !important; color: var(--picker-accent) !important; font-style: normal; }
.payment-picker__icon svg { display: block; width: 22px !important; height: 22px !important; max-width: none !important; }
.payment-picker__copy { grid-area: copy !important; min-width: 0; display: grid !important; gap: 3px !important; direction: rtl; }
.payment-picker__copy b { display: flex !important; align-items: center; flex-wrap: wrap; gap: 6px !important; color: var(--picker-text); font-size: 14px !important; line-height: 1.5 !important; }
.payment-picker__copy small { display: block !important; margin: 0 !important; color: var(--picker-muted) !important; font-size: 10px !important; font-weight: 400 !important; line-height: 1.65 !important; }
.payment-picker__copy em { padding: 3px 7px !important; border-radius: 7px !important; background: var(--picker-danger) !important; color: #fff !important; font-size: 9px !important; font-style: normal !important; font-weight: 800 !important; line-height: 1.35 !important; }
.payment-picker__price { grid-area: price !important; min-width: 0; display: grid !important; justify-items: start !important; gap: 2px !important; color: var(--picker-text) !important; font-size: 13px !important; font-weight: 800 !important; font-variant-numeric: tabular-nums; white-space: nowrap; direction: ltr !important; }
.payment-picker__price del { color: var(--picker-subtle) !important; font-size: 9px !important; font-weight: 400 !important; }
.payment-picker__arrow { grid-area: arrow !important; width: 18px !important; height: 18px !important; display: grid !important; place-items: center; color: var(--picker-subtle) !important; }
.payment-picker__arrow svg { display: block !important; width: 18px !important; height: 18px !important; max-width: none !important; }
.payment-picker__method.unavailable,.payment-picker__method:disabled { opacity: .52 !important; cursor: not-allowed; }
.payment-picker__submit { width: 100%; min-height: 52px; margin-top: 16px; border: 0; border-radius: 14px; background: var(--picker-accent); color: #fff; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.payment-picker__submit:disabled { opacity: .45; cursor: not-allowed; }
.payment-picker__coupon { margin-top: 14px; color: var(--picker-text); }
.payment-picker__coupon label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 750; }
.payment-picker__coupon > div { display: flex; gap: 8px; }
.payment-picker__coupon input { min-width: 0; flex: 1; padding: 10px 12px; border: 1px solid var(--picker-line); border-radius: 10px; background: var(--picker-bg); color: var(--picker-text); font: inherit; text-transform: uppercase; }
.payment-picker__coupon button { padding: 10px 13px; border: 1px solid var(--picker-accent); border-radius: 10px; background: var(--picker-accent-soft); color: var(--picker-accent); font: inherit; font-weight: 750; cursor: pointer; }
.payment-picker__coupon small { display: block; min-height: 20px; margin-top: 5px; color: var(--picker-muted); font-size: 11px; }
.payment-picker__coupon :focus-visible { outline: 2px solid var(--picker-accent); outline-offset: 2px; }
.payment-picker__coupon[hidden] { display: none; }
.payment-picker__terms { box-sizing: border-box; margin: 9px 0 0 !important; padding: 0 4px !important; border: 0 !important; background: transparent !important; color: var(--picker-muted) !important; font-size: 11px !important; line-height: 1.8 !important; text-align: center !important; }
.payment-picker__terms a,.payment-picker__terms button { color: var(--picker-accent) !important; font-weight: 800 !important; text-underline-offset: 3px; }
.payment-picker__note,.payment-picker__account { margin: 12px 0 0 !important; color: var(--picker-muted) !important; font-size: 10px !important; line-height: 1.85 !important; text-align: center !important; }
.payment-picker__account { padding-top: 9px !important; border-top: 1px solid var(--picker-line) !important; }
.payment-picker__method:focus-visible,.payment-picker__close:focus-visible,.payment-picker__submit:focus-visible,.payment-picker__terms a:focus-visible,.payment-picker__terms button:focus-visible { outline: 3px solid color-mix(in srgb, var(--picker-accent) 34%, transparent) !important; outline-offset: 2px !important; }
.payment-method-layer[data-plan="PRO_MAX"] .payment-picker { --picker-accent: #9a7a32; --picker-accent-soft: #f7f0df; }
[data-theme="dark"] .payment-picker { --picker-accent-soft: color-mix(in srgb, var(--picker-accent) 16%, var(--picker-bg)); }
[data-theme="dark"] .payment-method-layer[data-plan="PRO_MAX"] .payment-picker { --picker-accent: #ccb474; --picker-accent-soft: #29251c; }
[data-theme="dark"] .payment-picker__submit:not(:disabled) { color: #10151d; }
[data-theme="dark"] .payment-picker__submit:disabled { opacity: 1; background: var(--picker-surface-strong); color: var(--picker-subtle); }
@media (max-width: 480px) { .payment-picker { padding: 22px 16px calc(20px + env(safe-area-inset-bottom)) !important; } .payment-picker__header { padding-inline: 48px !important; } .payment-picker__header h2 { font-size: 19px !important; } .payment-picker__close { left: 16px !important; width: 40px !important; height: 40px !important; } .payment-picker__method { min-height: 76px !important; grid-template-columns: 42px minmax(0, 1fr) minmax(68px, auto) 16px !important; gap: 8px !important; padding-inline: 10px !important; } .payment-picker__icon { width: 42px !important; height: 42px !important; } .payment-picker__copy b { font-size: 13px !important; } .payment-picker__price { font-size: 12px !important; } }
@media (prefers-reduced-motion: reduce) { .payment-picker__method { transition: none; } }
