/* Destino de abonos: selección, datos y revisión dentro de una ventana estable. */
.aula-partner-funds-dialog:has(.payout-form) {
  width: min(720px, calc(100vw - 32px));
  max-width: none;
  height: min(700px, calc(100dvh - 32px));
  max-height: none;
  padding: 0;
  border: 1px solid #e0e7ef;
  border-radius: 22px;
  background: #fff;
  color: #182c45;
  font: 400 14px/1.5 var(--font-ui);
  overflow: hidden;
  box-shadow: 0 24px 80px rgb(18 35 58 / 22%);
}
.aula-partner-funds-dialog:has(.payout-form)::backdrop { background: rgb(18 35 58 / 48%); backdrop-filter: blur(5px); }
.aula-partner-funds-dialog:has(.payout-form) > [data-aula-partner-funds-dialog-content] { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100%; min-height: 0; }
.aula-partner-funds-dialog:has(.payout-form) .aula-partner-dialog-close { top: 18px; right: 20px; width: 40px; height: 40px; border: 1px solid #e0e7ef; border-radius: 12px; background: #fff; color: #53677f; }
.aula-partner-funds-dialog .payout-dialog-head { padding: 24px 72px 20px 28px; background: #fff; border-bottom: 1px solid #e0e7ef; }
.payout-dialog-head > span { color: #245dac; font: 650 10px/1.5 var(--font-ui); letter-spacing: .07em; }
.payout-dialog-head h2 { margin: 5px 0 0; color: #182c45; font: 700 26px/1.2 var(--font-ui); letter-spacing: -.025em; }
.payout-dialog-head p { margin: 8px 0 0; color: #586b82; font: 400 13px/1.5 var(--font-ui); }
.aula-partner-dialog-form.payout-form { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; min-height: 0; margin: 0; padding: 0; }
.payout-form [hidden] { display: none !important; }
.payout-progress { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 16px 28px; list-style: none; border-bottom: 1px solid #edf1f6; }
.payout-progress button { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 40px; padding: 5px 8px; border: 0; border-radius: 10px; color: #586b82; background: transparent; font: 550 13px/1.5 var(--font-ui); text-align: left; cursor: pointer; }
.payout-progress button > span { display: grid; place-items: center; flex: 0 0 26px; height: 26px; border: 1px solid #dce5ef; border-radius: 50%; color: #586b82; font-size: 11px; }
.payout-progress button[aria-current="step"] { color: #245dac; background: #eef4ff; }
.payout-progress button[aria-current="step"] > span { border-color: #245dac; background: #245dac; color: #fff; }
.payout-progress button:disabled { opacity: 1; color: #6c7b8f; cursor: default; }
.payout-step-body { min-height: 0; padding: 20px 28px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #cbd7e5 transparent; }
.payout-step-body > section { animation: payout-step-in .18s ease-out; }
.payout-step-body h3 { margin: 0; color: #182c45; font: 650 19px/1.3 var(--font-ui); letter-spacing: -.015em; outline: none; }
.payout-step-intro { margin: 5px 0 18px; color: #586b82; font: 400 13px/1.5 var(--font-ui); }
.payout-method-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; min-width: 0; margin: 0; padding: 0; border: 0; }
.payout-method-option { --method-color: #245dac; --method-soft: #eef4ff; position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; padding: 22px 18px 20px; border: 1px solid #dce5ef; border-radius: 16px; background: #fff; cursor: pointer; transition: border-color .15s, background-color .15s; }
.payout-method-option[data-payout-option="yape"] { --method-color: #6938a6; --method-soft: #f7f2ff; }
.payout-method-option[data-payout-option="plin"] { --method-color: #10766b; --method-soft: #eefaf7; }
.payout-method-option:hover { border-color: var(--method-color); }
.payout-method-option:has(input:checked) { border-color: var(--method-color); box-shadow: inset 0 0 0 1px var(--method-color); background: var(--method-soft); }
.payout-method-option input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; opacity: 0; }
.payout-method-option:focus-within { outline: 3px solid #76a9e5; outline-offset: 3px; }
.payout-option-icon { display: grid; place-items: center; width: 44px; height: 44px; margin-bottom: 12px; border-radius: 12px; background: var(--method-soft, #eef4ff); color: var(--method-color, #245dac); }
.payout-option-icon svg, .payout-selected-method svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.payout-method-option strong { max-width: 100%; overflow-wrap: anywhere; color: #182c45; font: 650 16px/1.3 var(--font-ui); }
.payout-method-option small { max-width: 100%; overflow-wrap: anywhere; color: #586b82; font: 400 12px/1.4 var(--font-ui); }
.payout-option-check { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid #dce5ef; border-radius: 50%; background: #fff; color: transparent; font-size: 12px; }
.payout-method-option:has(input:checked) .payout-option-check { border-color: var(--method-color); color: #fff; background: var(--method-color); }
.payout-current { display: grid; gap: 4px; margin-top: 22px; padding: 16px 18px; border: 1px solid #e0e7ef; border-radius: 12px; background: #f8fafd; }
.payout-current > span { color: #586b82; font: 500 11px/1.5 var(--font-ui); }
.payout-current strong { color: #253d59; font: 600 13px/1.5 var(--font-ui); overflow-wrap: anywhere; }
.payout-current small { color: #586b82; font: 400 12px/1.5 var(--font-ui); }
.payout-currency-note { display: flex; align-items: center; gap: 8px; margin: 16px 0 0; color: #586b82; font-size: 12px; }
.payout-currency-note span { padding: 2px 7px; border: 1px solid #e0e7ef; border-radius: 5px; font-size: 10px; color: #53677f; }
.payout-step-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.payout-selected-method { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 7px; background: #eef4ff; color: #245dac; font: 550 11px/1.5 var(--font-ui); white-space: nowrap; }
.payout-selected-method svg { width: 16px; height: 16px; }
.payout-form[data-payout-method="yape"] { --method-color: #6938a6; --method-soft: #f7f2ff; }
.payout-form[data-payout-method="plin"] { --method-color: #10766b; --method-soft: #eefaf7; }
.payout-form .aula-partner-form-grid { gap: 10px 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.payout-form [data-payout-panel="details"] .payout-step-intro { margin-bottom: 8px; }
.payout-form .is-wide { grid-column: 1 / -1; }
.payout-form .aula-partner-form-field { gap: 5px; }
.payout-form .aula-partner-form-field > span { color: #344c68; font: 550 12px/1.5 var(--font-ui); }
.payout-form .aula-partner-form-field > span small { color: #586b82; font-size: 10px; font-weight: 400; }
.payout-form .aula-partner-form-field :is(input, select) { width: 100%; min-height: 44px; margin: 0; padding: 10px 12px; border: 1px solid #d1dce9; border-radius: 9px; background: #fff; color: #182c45; font: 400 14px/1.5 var(--font-ui); }
.payout-form .aula-partner-form-field input::placeholder { color: #6c7b8f; opacity: 1; }
.payout-form .aula-partner-form-field :is(input, select):focus { border-color: #245dac; outline: 0; box-shadow: 0 0 0 3px #eef4ff; }
.payout-form .aula-partner-form-field input[aria-invalid="true"] { border-color: #b74450; }
.payout-field-hint { margin: -5px 0 0; color: #586b82; font: 400 11px/1.45 var(--font-ui); }
.payout-form [data-payout-document-hint] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.payout-form [data-payout-destination-title] { display: none; }
.payout-fields-title { margin: 2px 0 0; padding-top: 12px; border-top: 1px solid #edf1f6; color: #253d59; font: 600 12px/1.5 var(--font-ui); }
.payout-form [data-payout-panel="review"] .payout-step-intro { margin-bottom: 8px; }
.payout-review-card { padding: 16px; border: 1px solid #dce5ef; border-radius: 16px; background: #f8fafd; }
.payout-review-method { display: flex; align-items: center; gap: 12px; }
.payout-review-method .payout-option-icon { flex: 0 0 44px; margin: 0; }
.payout-review-method small { display: block; color: #586b82; font: 400 11px/1.5 var(--font-ui); }
.payout-review-method strong { color: #182c45; font: 650 16px/1.4 var(--font-ui); }
.payout-review-number { margin: 14px 0 3px; color: #182c45; font: 650 23px/1.3 var(--font-ui); letter-spacing: .02em; }
.payout-review-destination { margin: 0; color: #586b82; font: 400 12px/1.5 var(--font-ui); overflow-wrap: anywhere; }
.payout-review-card dl { display: grid; gap: 9px; margin: 16px 0 0; padding-top: 12px; border-top: 1px solid #e0e7ef; }
.payout-review-card dl > div { display: flex; justify-content: space-between; gap: 14px; }
.payout-review-card dt { color: #586b82; font: 400 12px/1.5 var(--font-ui); }
.payout-review-card dd { margin: 0; color: #253d59; font: 550 12px/1.5 var(--font-ui); text-align: right; overflow-wrap: anywhere; }
.payout-review-note { margin: 12px 0 0; color: #586b82; font: 400 12px/1.6 var(--font-ui); }
.payout-edit-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 0; border: 0; background: transparent; color: #245dac; font: 550 12px/1.5 var(--font-ui); cursor: pointer; }
.payout-form .aula-partner-dialog-message { margin: 0; padding: 10px 28px; font: 400 12px/1.5 var(--font-ui); }
.payout-form .aula-partner-dialog-message:empty { display: none; }
.payout-form .aula-partner-dialog-message.error { background: #fff4f5; color: #9d303d; }
.payout-form .aula-partner-dialog-actions { display: flex; align-items: center; flex-wrap: nowrap; gap: 10px; margin: 0; padding: 16px 28px; position: static; border-top: 1px solid #e0e7ef; background: #fff; }
.payout-form .aula-partner-dialog-actions button { min-height: 44px; padding: 10px 16px; border: 1px solid #dce5ef; border-radius: 10px; background: #fff; color: #53677f; font: 550 13px/1.5 var(--font-ui); cursor: pointer; white-space: nowrap; }
.payout-form .aula-partner-dialog-actions .payout-back { border-color: transparent; }
.payout-form .aula-partner-dialog-actions button.primary { margin-left: auto; border-color: #245dac; background: #245dac; color: #fff; font-weight: 600; }
.payout-form .aula-partner-dialog-actions button.primary:hover { background: #1d5095; }
.payout-form .aula-partner-dialog-actions button:disabled { cursor: wait; opacity: .65; }
.payout-form :is(button, a):focus-visible { outline: 3px solid #76a9e5; outline-offset: 3px; }
@keyframes payout-step-in { from { opacity: .5; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 600px) {
  .aula-partner-funds-dialog:has(.payout-form) { width: calc(100vw - 24px); height: min(700px, calc(100dvh - 24px)); border-radius: 18px; }
  .aula-partner-funds-dialog .payout-dialog-head { padding: 20px 62px 18px 20px; }
  .payout-dialog-head h2 { font-size: 22px; }
  .payout-progress { gap: 4px; padding: 12px 16px; }
  .payout-progress button { gap: 6px; padding-inline: 4px; font-size: 12px; }
  .payout-step-body { padding: 18px 20px; }
  .payout-step-body h3 { font-size: 18px; }
  .payout-method-options { gap: 8px; }
  .payout-method-option { padding: 18px 10px 16px; border-radius: 12px; }
  .payout-option-icon { width: 36px; height: 36px; margin-bottom: 10px; border-radius: 10px; }
  .payout-method-option strong { font-size: 14px; }
  .payout-method-option small { font-size: 11px; }
  .payout-option-check { width: 16px; height: 16px; top: 8px; right: 8px; font-size: 10px; }
  .payout-current { padding: 14px; margin-top: 18px; }
  .payout-step-title { align-items: start; flex-direction: column; gap: 8px; }
  .payout-selected-method { display: none; }
  .payout-form .aula-partner-form-grid { gap: 12px 10px; }
  .payout-form .aula-partner-form-field :is(input, select) { font-size: 16px; padding-inline: 10px; }
  .payout-form .aula-partner-form-field > span small { display: none; }
  .payout-review-card { padding: 18px; }
  .payout-review-number { font-size: 21px; }
  .payout-form .aula-partner-dialog-message { padding-inline: 20px; }
  .payout-form .aula-partner-dialog-actions { padding: 14px 16px; gap: 6px; }
  .payout-form .aula-partner-dialog-actions button { padding: 10px 9px; font-size: 12px; }
  .payout-form .aula-partner-dialog-actions button.primary { white-space: normal; }
}
@media (max-height: 550px) {
  .aula-partner-funds-dialog .payout-dialog-head { padding-block: 14px; }
  .payout-dialog-head p { display: none; }
  .payout-progress { padding-block: 8px; }
  .payout-step-body { padding-block: 16px; }
}
@media (max-width: 380px) {
  .payout-progress button { flex-direction: column; gap: 4px; text-align: center; overflow-wrap: anywhere; }
  .payout-dialog-head h2, .payout-step-body h3 { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .payout-step-body > section { animation: none; }
  .payout-method-option { transition: none; }
}