/*
 * RETIROS — HOJA MAESTRA DE DISEÑO
 *
 * Este es el único archivo para modificar colores, tipografías, tamaños,
 * espacios, bordes y distribución visual de la página de Retiros.
 * Cada sección está identificada por el nombre que se ve en la pantalla.
 *
 * INDICE:
 * 1. Página y contenedor principal
 * 2. Módulos de saldos: Saldo, en Tránsito, por Retirar y en Proceso
 * 3. Módulo Consolidado
 * 4. Módulo Solicitar Retiro
 * 5. Modal de Cuenta Bancaria
 * 6. Solicitudes de Retiro y Administración
 * 7. Historial de Retiros
 */

/* ================================================================
   PANEL MAESTRO DE DISEÑO
   Busca primero el módulo y después el elemento que quieres cambiar.
   ================================================================ */

.wuallet-withdrawals-page,
.wuallet-withdrawal-history-page {
    --retiros-celeste: #3eaefc;
    --retiros-verde: #19cc2b;
    --retiros-naranja: #ff7900;
    --retiros-azul: #3b5de5;
    --retiros-azul-marino: #00143e;
    --retiros-fondo: #f1f5f9;
    --retiros-blanco: #ffffff;
    --retiros-borde: #d3d3d3;
    --retiros-texto-secundario: #667085;
    /* ============================================================
       MÓDULOS
       Primero se busca el módulo; dentro están sus elementos y,
       juntos, los valores de móvil, tablet y escritorio.
       ============================================================ */

    /* ------ MÓDULO DE SALDOS ------ */

        /* ------ Títulos de los cuatro cuadrantes ------ */

            --titulo-saldos-movil: 14px;
            --titulo-saldos-tablet: 20px;
            --titulo-saldos-desktop: 24px;

        /* ------ Montos de los cuatro cuadrantes ------ */

            --monto-saldos-movil: 18px;
            --monto-saldos-tablet: 28px;
            --monto-saldos-desktop: 32px;

        /* ------ Montos largos: 4 cifras o más ------ */

            --monto-saldos-largo-movil: 16px;
            --monto-saldos-largo-tablet: 24px;
            --monto-saldos-largo-desktop: 30px;

        /* ------ Colores de títulos ------ */

            --color-titulo-saldo: #00143e;
            --color-titulo-en-transito: #00143e;
            --color-titulo-por-retirar: #00143e;
            --color-titulo-en-proceso: #00143e;

        /* ------ Colores de montos ------ */

            --color-monto-saldo: #3eaefc;
            --color-monto-en-transito: #ff7900;
            --color-monto-por-retirar: #19cc2b;
            --color-monto-en-proceso: #3b5de5;

    /* ------ MÓDULO DE CONSOLIDADO ------ */

        /* ------ Título ------ */

            --titulo-consolidado-movil: 14px;
            --titulo-consolidado-tablet: 20px;
            --titulo-consolidado-desktop: 24px;

        /* ------ Descripción y leyenda ------ */

            --descripcion-consolidado-movil: 10px;
            --descripcion-consolidado-tablet: 12px;
            --descripcion-consolidado-desktop: 14px;

        /* ------ Colores ------ */

            --color-titulo-consolidado: #00143e;
            --color-consolidado-por-retirar: #19cc2b;
            --color-consolidado-en-transito: #ff7900;
            --color-consolidado-en-proceso: #3b5de5;

    /* ------ MÓDULO SOLICITAR RETIRO ------ */

        /* ------ Título ------ */

            --titulo-solicitar-retiro-movil: 18px;
            --titulo-solicitar-retiro-tablet: 20px;
            --titulo-solicitar-retiro-desktop: 24px;

        /* ------ Descripción ------ */

            --descripcion-solicitar-retiro-movil: 0.8em;
            --descripcion-solicitar-retiro-tablet: 0.85em;
            --descripcion-solicitar-retiro-desktop: 0.90em;

        /* ------ Monto de retiro ------ */

            --monto-solicitar-retiro-movil: 36px;
            --monto-solicitar-retiro-tablet: 36px;
            --monto-solicitar-retiro-desktop: 36px;

        /* ------ Colores ------ */

            --color-titulo-solicitar-retiro: #00143e;
            --color-descripcion-solicitar-retiro: #00143e;
            --color-monto-solicitar-retiro: #3eaefc;

    /* ------ MÓDULO CUENTA BANCARIA ------ */

        /* ------ Título ------ */

            --titulo-cuenta-bancaria-movil: 20px;
            --titulo-cuenta-bancaria-tablet: 20px;
            --titulo-cuenta-bancaria-desktop: 20px;

        /* ------ Descripción ------ */

            --descripcion-cuenta-bancaria-movil: 14px;
            --descripcion-cuenta-bancaria-tablet: 14px;
            --descripcion-cuenta-bancaria-desktop: 14px;

        /* ------ Colores ------ */

            --color-titulo-cuenta-bancaria: #00143e;
            --color-descripcion-cuenta-bancaria: #00143e;

    /* ------ MÓDULO SOLICITUDES DE RETIRO ------ */

        /* ------ Título ------ */

            --titulo-solicitudes-movil: 1.5em;
            --titulo-solicitudes-tablet: 1.5em;
            --titulo-solicitudes-desktop: 1.5em;

        /* ------ Descripción ------ */

            --descripcion-solicitudes-movil: 1em;
            --descripcion-solicitudes-tablet: 1em;
            --descripcion-solicitudes-desktop: 1em;

        /* ------ Montos ------ */

            --monto-solicitudes-movil: calc(1em + 2px);
            --monto-solicitudes-tablet: calc(1em + 2px);
            --monto-solicitudes-desktop: calc(1em + 2px);

    /* ------ MÓDULO HISTORIAL DE RETIROS ------ */

        /* ------ Título ------ */

            --titulo-historial-movil: 1.5em;
            --titulo-historial-tablet: 1.5em;
            --titulo-historial-desktop: 1.5em;

        /* ------ Descripción ------ */

            --descripcion-historial-movil: 1em;
            --descripcion-historial-tablet: 1em;
            --descripcion-historial-desktop: 1em;

        /* ------ Montos ------ */

            --monto-historial-movil: calc(1em + 2px);
            --monto-historial-tablet: calc(1em + 2px);
            --monto-historial-desktop: calc(1em + 2px);

    /* ------ MÓDULO FONDOS EN CUSTODIA ------ */

        /* ------ Título ------ */

            --titulo-custodia-movil: 1.75em;
            --titulo-custodia-tablet: 1.75em;
            --titulo-custodia-desktop: 1.75em;

        /* ------ Descripción y montos ------ */

            --descripcion-custodia-movil: 14px;
            --descripcion-custodia-tablet: 14px;
            --descripcion-custodia-desktop: 14px;
            --monto-custodia-movil: 14px;
            --monto-custodia-tablet: 14px;
            --monto-custodia-desktop: 14px;

    /* ------ MÓDULO ADMINISTRACIÓN ------ */

        /* ------ Título ------ */

            --titulo-administracion-movil: 1.5em;
            --titulo-administracion-tablet: 1.5em;
            --titulo-administracion-desktop: 1.5em;

        /* ------ Descripción y montos ------ */

            --descripcion-administracion-movil: 1em;
            --descripcion-administracion-tablet: 1em;
            --descripcion-administracion-desktop: 1em;
            --monto-administracion-movil: calc(1em + 2px);
            --monto-administracion-tablet: calc(1em + 2px);
            --monto-administracion-desktop: calc(1em + 2px);
}

/* ================================================================
   1. PAGINA Y CONTENEDOR PRINCIPAL
   Fondo, ancho máximo, título, tarjetas y paneles compartidos.
   ================================================================ */

.wuallet-withdrawals-page {
    margin: -65px 0 -25px;
    padding: 20px;
    background: var(--retiros-fondo);
    min-height: 70vh;
    box-sizing: border-box;
    color: var(--retiros-azul-marino);
}

.wuallet-withdrawals-inner {
    max-width: 1220px;
    margin: auto;
}

.wuallet-withdrawals-inner h2 {
    font-size: 22px;
    margin: 0 0 16px;
}

/* Distribución general de los módulos superiores */

.ww-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.ww-balance-column {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
}

/* Tarjetas y paneles */

.ww-card,
.ww-panel {
    background: #fff;
    border: 1px solid var(--retiros-borde);
    border-radius: 8px;
    padding: 18px;
    box-sizing: border-box;
    min-width: 0;
}

.ww-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ============================================================
           2. MODULOS DE SALDOS
           Aquí se manejan los títulos y montos de los cuatro módulos.
           Los valores editables están en la MATRIZ al inicio del archivo.
           ============================================================ */

/* Módulo Saldo: título y monto independientes */

.ww-card strong {
    display: block;
    margin-top: 6px;
}

/* Colores independientes del módulo Saldo */

.modulo-saldo .titulo-saldo {
    color: var(--color-titulo-saldo);
}

.modulo-saldo .monto-saldo {
    color: var(--color-monto-saldo);
}

/* Colores independientes del módulo en Tránsito */

.modulo-en-transito .titulo-en-transito {
    color: var(--color-titulo-en-transito);
}

.modulo-en-transito .monto-en-transito {
    color: var(--color-monto-en-transito);
}

/* Colores independientes del módulo por Retirar */

.modulo-por-retirar .titulo-por-retirar {
    color: var(--color-titulo-por-retirar);
}

.modulo-por-retirar .monto-por-retirar {
    color: var(--color-monto-por-retirar);
}

/* Colores independientes del módulo en Proceso */

.modulo-en-proceso .titulo-en-proceso {
    color: var(--color-titulo-en-proceso);
}

.modulo-en-proceso .monto-en-proceso {
    color: var(--color-monto-en-proceso);
}

/* ============================================================
           3. MODULO CONSOLIDADO
           Título, gráfica circular, porcentajes y leyenda de colores.
           ============================================================ */

/* Altura compartida con Solicitar Retiro */

.ww-composition-panel,
.ww-request-panel {
    height: 100%;
}

.ww-composition-panel h3,
.ww-request-panel h3 {
    margin-top: 0;
}

.ww-composition-panel h3 {
    color: var(--color-titulo-consolidado);
}

/* Gráfica y leyenda */

.ww-donut {
    width: min(150px, 78%);
    aspect-ratio: 1;
    border-radius: 50%;
    margin: 12px auto;
    display: grid;
    place-items: center;
}

.ww-donut:after {
    content: "";
    width: 60%;
    aspect-ratio: 1;
    background: #fff;
    border-radius: 50%;
}

.ww-legend {
    display: grid;
    gap: 7px;
    font-size: var(--descripcion-consolidado-desktop);
}

.ww-dot {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    display: inline-block;
    margin-right: 7px;
}

/* ============================================================
           4. MODULO SOLICITAR RETIRO
           Formulario, textos, monto, botones y espacios internos.
           ============================================================ */

/* Campos generales del formulario */

.ww-form label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    margin: 12px 0 5px;
}

.ww-form input,
.ww-form textarea,
.ww-form select {
    width: 100%;
    padding: 10px;
    border: 1px solid #c9cdd3;
    border-radius: 8px;
    box-sizing: border-box;
}

/* Botones */

.ww-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--retiros-azul-marino);
    color: #fff;
    border: 0;
    border-radius: 10px;
    padding: 10px 18px;
    text-decoration: none;
    cursor: pointer;
    margin-top: 12px;
}

.ww-bank-button {
    gap: 7px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 999px;
}

.ww-button.secondary {
    background: var(--retiros-celeste);
}

.ww-button.danger {
    background: #b42318;
}

/* Tablas */

.ww-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.ww-table th,
.ww-table td {
    padding: 11px 8px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    vertical-align: top;
}

.ww-table th:last-child,
.ww-table td:last-child {
    text-align: right;
}

.ww-section {
    margin-top: 14px;
}

/* Mensajes y textos auxiliares */

.ww-notice {
    background: #edf7ff;
    border: 1px solid #9bc8e8;
    border-radius: 8px;
    padding: 11px 14px;
    margin-bottom: 14px;
}

.ww-status {
    font-weight: 600;
}

.ww-account-summary {
    font-size: 14px;
    line-height: 1.6;
}

.ww-muted {
    color: var(--retiros-texto-secundario);
    font-size: 13px;
}

/* Títulos de listas */

.ww-list-title {
    margin: 5px 0 20px 5px;
    font-size: 1.5em;
    font-weight: 400;
}

.ww-list-title span {
    color: var(--retiros-azul-marino);
}

.ww-list-title strong {
    color: var(--retiros-celeste);
    font-weight: 600;
}

/* ============================================================
           6. SOLICITUDES DE RETIRO Y ADMINISTRACION
           Lista, estados, fechas, montos y acciones administrativas.
           ============================================================ */

.ww-request-list {
    table-layout: fixed;
    max-width: 100%;
}

.ww-request-list th:first-child,
.ww-request-list td:first-child {
    width: 90%;
    font-size: 1em;
    line-height: 1.25em;
}

.ww-request-list th:last-child,
.ww-request-list td:last-child {
    width: 10%;
    white-space: nowrap;
    text-align: right;
}

.ww-request-list td:last-child {
    font-size: calc(1em + 2px);
    font-weight: 600;
}

.ww-request-primary {
    display: block;
    font-weight: 600;
}

.ww-request-secondary {
    display: block;
    color: #159df5;
    margin-top: 5px;
}

.ww-request-status {
    display: inline-flex;
    align-items: center;
    width: max-content;
    margin-top: 7px;
    padding: 5px 11px;
    border-radius: 999px;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
}

.ww-request-date {
    display: block;
    color: gray;
    font-size: .85em;
    margin-top: 7px;
}

.ww-request-aside .ww-request-status {
    margin-left: auto;
}

.ww-request-status-spacer {
    display: block;
    height: calc(1.25em + 5px);
}

.ww-cancel-form {
    margin-top: 7px;
}

.ww-cancel-link {
    appearance: none;
    padding: 0;
    border: 0;
    background: transparent;
    color: #d92d20;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

.ww-cancel-link:hover {
    color: #b42318;
}

/* Acciones administrativas */

.ww-admin-actions {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(150px, 220px) auto;
    gap: 8px;
    align-items: end;
    margin-top: 10px;
}

.ww-admin-actions select,
.ww-admin-actions input {
    width: 100%;
    padding: 8px;
    border: 1px solid #c9cdd3;
    border-radius: 6px;
    box-sizing: border-box;
}

.ww-admin-actions .ww-button {
    margin-top: 0;
}

.ww-admin-reference[hidden] {
    display: none;
}

@media (max-width: 1100px) {
    .ww-overview {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ww-request-panel {
        grid-column: 1 / -1;
    }

}

@media (max-width: 600px) {
    .wuallet-withdrawals-page {
        margin: -40px 0 -25px;
        padding: 15px;
    }

    .ww-overview {
        gap: 8px;
    }

    .ww-balance-column {
        gap: 8px;
    }

    .ww-card,
    .ww-composition-panel {
        padding: 10px;
    }

    .ww-card span {
        line-height: 1.25;
    }

    .ww-composition-panel h3 {
        font-size: 14px;
        margin-bottom: 8px;
    }

    .ww-donut {
        width: min(92px, 84%);
        margin: 8px auto;
    }

    .ww-legend {
        gap: 4px;
        font-size: 10px;
    }

    .ww-dot {
        width: 7px;
        height: 7px;
        margin-right: 4px;
    }

    .ww-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    .ww-request-list {
        display: table;
        white-space: normal;
    }

    .ww-admin-actions {
        grid-template-columns: 1fr;
    }

    .ww-request-list th,
    .ww-request-list td {
        padding-left: 6px;
        padding-right: 6px;
    }

}

/* MODULOS DE SALDOS — tamaños en MÓVIL (hasta 600 px) */

@media(max-width:600px) {
    .ww-overview {
        grid-template-columns:minmax(0,28fr) minmax(0,28fr) minmax(0,44fr);
        gap:14px
    }

    .ww-balance-column {
        gap:14px
    }

    .ww-composition-panel h3 {
        font-size:14px;
        font-weight:500;
        line-height:1.25
    }

    .ww-card span {
        overflow-wrap:anywhere
    }

    .ww-card strong {
        white-space:nowrap;
        font-variant-numeric:tabular-nums
    }

    .ww-donut {
        width:min(120px,78%)
    }

    .ww-legend {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:7px 10px;
        max-width:180px;
        margin:0 auto;
        justify-content:center
    }

    .ww-legend div {
        display:flex;
        align-items:center;
        min-width:0;
        line-height:1.2
    }

    .ww-section {
        margin-top:14px
    }

}

.ww-page-title {
    background:#fff;
    border:1px solid var(--retiros-borde);
    border-radius:10px;
    padding:12px;
    text-align:center;
    margin-bottom:14px
}

.wuallet-withdrawals-inner .ww-page-title h2 {
    margin:0;
    font-size:1.1em;
    font-weight:600;
    color:var(--retiros-azul-marino)
}

.ww-panel h3 {
    font-size:1.75em;
    font-weight:400;
    line-height:1.5;
    margin:0 0 16px;
    color:var(--retiros-azul-marino)
}

.ww-request-panel h3 {
    margin-bottom:8px;
    padding-bottom:8px;
    border-bottom:1px solid #d1d5db
}

.ww-request-panel p {
    margin:0 0 8px
}

.ww-request-panel .ww-bank-button {
    margin-top:0
}

.ww-request-panel .ww-form .ww-bank-button {
    margin-top:8px
}

svg.ww-donut {
    display:block;
    border-radius:0;
    overflow:visible
}

.ww-donut-track {
    fill:none;
    stroke:#d7dee7;
    stroke-width:28
}

.ww-donut-segment {
    fill:none;
    stroke-width:28;
    stroke-linecap:butt
}

.segmento-por-retirar {
    stroke:var(--color-consolidado-por-retirar)
}

.segmento-en-transito {
    stroke:var(--color-consolidado-en-transito)
}

.segmento-en-proceso {
    stroke:var(--color-consolidado-en-proceso)
}

.color-por-retirar {
    background:var(--color-consolidado-por-retirar)
}

.color-en-transito {
    background:var(--color-consolidado-en-transito)
}

.color-en-proceso {
    background:var(--color-consolidado-en-proceso)
}

.ww-donut-label {
    fill:#fff;
    font-size:9px;
    font-weight:700;
    text-anchor:middle;
    dominant-baseline:middle;
    pointer-events:none
}

@media(max-width:600px) {
    .ww-composition-panel h3 {
        font-size:var(--titulo-consolidado-movil);
        font-weight:600;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-request-panel h3 {
        font-size:15px;
        font-weight:600;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-legend {
        font-size:var(--descripcion-consolidado-movil)
    }

    .ww-card span {
        font-weight:600;
        line-height:1.25;
        letter-spacing:0
    }

    /* Títulos independientes en móvil */

    .modulo-saldo .titulo-saldo {
        font-size:var(--titulo-saldos-movil)
    }

    .modulo-en-transito .titulo-en-transito {
        font-size:var(--titulo-saldos-movil)
    }

    .modulo-por-retirar .titulo-por-retirar {
        font-size:var(--titulo-saldos-movil)
    }

    .modulo-en-proceso .titulo-en-proceso {
        font-size:var(--titulo-saldos-movil)
    }

    .ww-card strong {
        letter-spacing:0;
        font-variant-numeric:normal
    }

    /* Montos normales independientes en móvil */

    .modulo-saldo .monto-saldo {
        font-size:var(--monto-saldos-movil)
    }

    .modulo-en-transito .monto-en-transito {
        font-size:var(--monto-saldos-movil)
    }

    .modulo-por-retirar .monto-por-retirar {
        font-size:var(--monto-saldos-movil)
    }

    .modulo-en-proceso .monto-en-proceso {
        font-size:var(--monto-saldos-movil)
    }

    /* Montos largos independientes en móvil */

    .modulo-saldo .monto-saldo.ww-amount-wide {
        font-size:var(--monto-saldos-largo-movil)
    }

    .modulo-en-transito .monto-en-transito.ww-amount-wide {
        font-size:var(--monto-saldos-largo-movil)
    }

    .modulo-por-retirar .monto-por-retirar.ww-amount-wide {
        font-size:var(--monto-saldos-largo-movil)
    }

    .modulo-en-proceso .monto-en-proceso.ww-amount-wide {
        font-size:var(--monto-saldos-largo-movil)
    }

}

/* MODULOS DE SALDOS — tamaños en TABLET (601 a 1100 px) */

@media(min-width:601px) and (max-width:1100px) {
    .ww-overview {
        grid-template-columns:minmax(0,28fr) minmax(0,28fr) minmax(0,44fr);
        gap:14px
    }

    .ww-balance-column {
        gap:14px
    }

    .ww-card,
    .ww-composition-panel {
        padding:10px
    }

    .ww-composition-panel h3 {
        font-size:var(--titulo-consolidado-tablet);
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-request-panel h3 {
        font-size:22px;
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-card span {
        overflow-wrap:anywhere;
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    /* Títulos independientes en tablet */

    .modulo-saldo .titulo-saldo {
        font-size:var(--titulo-saldos-tablet)
    }

    .modulo-en-transito .titulo-en-transito {
        font-size:var(--titulo-saldos-tablet)
    }

    .modulo-por-retirar .titulo-por-retirar {
        font-size:var(--titulo-saldos-tablet)
    }

    .modulo-en-proceso .titulo-en-proceso {
        font-size:var(--titulo-saldos-tablet)
    }

    .ww-card strong {
        white-space:nowrap;
        letter-spacing:0;
        font-variant-numeric:normal
    }

    /* Montos normales independientes en tablet */

    .modulo-saldo .monto-saldo {
        font-size:var(--monto-saldos-tablet)
    }

    .modulo-en-transito .monto-en-transito {
        font-size:var(--monto-saldos-tablet)
    }

    .modulo-por-retirar .monto-por-retirar {
        font-size:var(--monto-saldos-tablet)
    }

    .modulo-en-proceso .monto-en-proceso {
        font-size:var(--monto-saldos-tablet)
    }

    /* Montos largos independientes en tablet */

    .modulo-saldo .monto-saldo.ww-amount-wide {
        font-size:var(--monto-saldos-largo-tablet)
    }

    .modulo-en-transito .monto-en-transito.ww-amount-wide {
        font-size:var(--monto-saldos-largo-tablet)
    }

    .modulo-por-retirar .monto-por-retirar.ww-amount-wide {
        font-size:var(--monto-saldos-largo-tablet)
    }

    .modulo-en-proceso .monto-en-proceso.ww-amount-wide {
        font-size:var(--monto-saldos-largo-tablet)
    }

    .ww-composition-panel {
        display:grid;
        grid-template-columns:minmax(0,3fr) minmax(0,2fr);
        grid-template-rows:auto minmax(0,1fr);
        column-gap:10px;
        align-items:center
    }

    .ww-composition-panel h3 {
        grid-column:1/-1;
        margin-bottom:0
    }

    .ww-composition-panel .ww-donut {
        grid-column:1;
        width:min(145px,90%);
        margin:8px auto
    }

    .ww-composition-panel .ww-legend {
        grid-column:2;
        align-content:center
    }

    .ww-legend {
        grid-template-columns:minmax(0,1fr);
        gap:7px;
        max-width:180px;
        margin:0 auto;
        justify-content:center;
        font-size:var(--descripcion-consolidado-tablet)
    }

    .ww-legend div {
        display:flex;
        align-items:center;
        min-width:0;
        line-height:1.2
    }

    .ww-dot {
        width:7px;
        height:7px;
        margin-right:4px
    }

    .ww-section {
        margin-top:14px
    }

}

/* MODULOS DE SALDOS — tamaños en ESCRITORIO (desde 1101 px) */

@media(min-width:1101px) {
    .ww-overview {
        grid-template-columns:minmax(0,15fr) minmax(0,15fr) minmax(0,30fr) minmax(0,30fr)
    }

    .ww-composition-panel h3 {
        font-size:var(--titulo-consolidado-desktop);
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-request-panel h3 {
        font-size:44px;
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    .ww-legend {
        font-size:var(--descripcion-consolidado-desktop)
    }

    .ww-card span {
        font-weight:500;
        line-height:1.25;
        letter-spacing:0
    }

    /* Títulos independientes en escritorio */

    .modulo-saldo .titulo-saldo {
        font-size:var(--titulo-saldos-desktop)
    }

    .modulo-en-transito .titulo-en-transito {
        font-size:var(--titulo-saldos-desktop)
    }

    .modulo-por-retirar .titulo-por-retirar {
        font-size:var(--titulo-saldos-desktop)
    }

    .modulo-en-proceso .titulo-en-proceso {
        font-size:var(--titulo-saldos-desktop)
    }

    .ww-card strong {
        white-space:nowrap;
        letter-spacing:0;
        font-variant-numeric:normal
    }

    /* Montos normales independientes en escritorio */

    .modulo-saldo .monto-saldo {
        font-size:var(--monto-saldos-desktop)
    }

    .modulo-en-transito .monto-en-transito {
        font-size:var(--monto-saldos-desktop)
    }

    .modulo-por-retirar .monto-por-retirar {
        font-size:var(--monto-saldos-desktop)
    }

    .modulo-en-proceso .monto-en-proceso {
        font-size:var(--monto-saldos-desktop)
    }

    /* Montos largos independientes en escritorio */

    .modulo-saldo .monto-saldo.ww-amount-wide {
        font-size:var(--monto-saldos-largo-desktop)
    }

    .modulo-en-transito .monto-en-transito.ww-amount-wide {
        font-size:var(--monto-saldos-largo-desktop)
    }

    .modulo-por-retirar .monto-por-retirar.ww-amount-wide {
        font-size:var(--monto-saldos-largo-desktop)
    }

    .modulo-en-proceso .monto-en-proceso.ww-amount-wide {
        font-size:var(--monto-saldos-largo-desktop)
    }

    .ww-composition-panel {
        display:grid;
        grid-template-columns:minmax(0,3fr) minmax(0,2fr);
        grid-template-rows:auto minmax(0,1fr);
        column-gap:18px;
        align-items:center
    }

    .ww-composition-panel h3 {
        grid-column:1/-1;
        margin-bottom:0
    }

    .ww-composition-panel .ww-donut {
        grid-column:1;
        width:min(175px,90%);
        margin:12px auto
    }

    .ww-composition-panel .ww-legend {
        grid-column:2;
        align-content:center
    }

}

/* Solicitar Retiro: distribución de cuenta y monto */

.ww-request-fields {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.ww-request-amount {
    text-align: center;
}

.ww-request-amount label {
    margin-top: 0;
}

/* Solicitar Retiro: número grande del monto */

.ww-withdrawal-amount-input {
    position: relative;
    display: flex;
    align-items: center;
    width: min(180px, 100%);
    margin: 0 auto;
}

.ww-withdrawal-amount-input:before {
    content: "$";
    position: absolute;
    left: 8px;
    color: var(--retiros-celeste);
    font-size: 20px;
    font-weight: 400;
    z-index: 1;
    pointer-events: none;
}

.ww-form .ww-withdrawal-amount-input input {
    width: 100%;
    padding: 6px 22px;
    color: var(--retiros-celeste);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    outline-offset: 3px;
    font-size: 36px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    font-variant-numeric: tabular-nums;
    -moz-appearance: textfield;
    appearance: textfield;
}

.ww-form .ww-withdrawal-amount-input input::-webkit-outer-spin-button,
.ww-form .ww-withdrawal-amount-input input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.ww-label-light {
    font-weight: 400;
}

/* Cambiar cuenta bancaria */

.ww-change-bank-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 5px 0 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #159df5;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.ww-change-bank-button:hover {
    text-decoration: underline;
}

/* ============================================================
           5. MODAL DE CUENTA BANCARIA
           Fondo, ventana, título, botón de cerrar y vista móvil.
           ============================================================ */

.ww-bank-modal[hidden] {
    display: none;
}

.ww-bank-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(255, 255, 255, .85);
    box-sizing: border-box;
}

.ww-bank-modal-dialog {
    position: relative;
    width: min(460px, 100%);
    max-height: calc(100vh - 40px);
    overflow: auto;
    background: #fff;
    border: 1px solid var(--retiros-borde);
    border-radius: 8px;
    box-shadow: 0 18px 48px rgba(15, 38, 74, .2);
    padding: 24px;
}

.ww-bank-modal-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--retiros-azul-marino);
    margin: 0 36px 18px 0;
}

.ww-bank-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--retiros-azul-marino);
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
}

.ww-bank-modal-open {
    overflow: hidden;
}

@media (max-width: 600px) {
    .ww-bank-modal {
        padding: 14px;
        align-items: flex-start;
        overflow-y: auto;
    }

    .ww-bank-modal-dialog {
        max-height: none;
        margin: auto 0;
        padding: 20px;
    }

}

/* Nota y estado de la solicitud */

.ww-request-note {
    display: block;
    color: var(--retiros-azul-marino);
    margin-top: 5px;
    font-size: .92em;
    white-space: pre-line;
}

.ww-request-status {
    font-size: 11px;
    font-weight: 400;
}

/* Enlaces del historial */

.ww-history-link {
    padding: 14px 8px 2px;
}

.ww-history-link a {
    color: #159df5;
    text-decoration: none;
}

.ww-history-link a:hover {
    text-decoration: underline;
}

/* ================================================================
   HISTORIAL DE RETIROS — página /historial-retiros/
   ================================================================ */

.wuallet-withdrawal-history-page {
    margin:-65px 0 -25px;
    padding:20px;
    background:var(--retiros-fondo);
    min-height:70vh;
    box-sizing:border-box;
    color:var(--retiros-azul-marino)
}

.wuallet-withdrawal-history-inner {
    max-width:1220px;
    margin:auto
}

.wuallet-withdrawal-history-page .ww-panel {
    background:#fff;
    border:1px solid var(--retiros-borde);
    border-radius:8px;
    padding:18px;
    box-sizing:border-box;
    min-width:0
}

.wuallet-withdrawal-history-page .ww-list-title {
    margin:5px 0 20px 5px;
    font-size:1.5em;
    font-weight:400
}

.wuallet-withdrawal-history-page .ww-list-title span {
    color:var(--retiros-azul-marino)
}

.wuallet-withdrawal-history-page .ww-list-title strong {
    color:var(--retiros-celeste);
    font-weight:600
}

.wuallet-withdrawal-history-page .ww-table {
    width:100%;
    border-collapse:collapse;
    font-size:14px
}

.wuallet-withdrawal-history-page .ww-table th,
.wuallet-withdrawal-history-page .ww-table td {
    padding:11px 8px;
    border-bottom:1px solid #ddd;
    text-align:left;
    vertical-align:top
}

.wuallet-withdrawal-history-page .ww-request-list {
    table-layout:fixed;
    max-width:100%
}

.wuallet-withdrawal-history-page .ww-request-list th:first-child,
.wuallet-withdrawal-history-page .ww-request-list td:first-child {
    width:90%;
    font-size:1em;
    line-height:1.25em
}

.wuallet-withdrawal-history-page .ww-request-list th:last-child,
.wuallet-withdrawal-history-page .ww-request-list td:last-child {
    width:10%;
    white-space:nowrap;
    text-align:right
}

.wuallet-withdrawal-history-page .ww-request-list td:last-child {
    font-size:calc(1em + 2px);
    font-weight:600
}

.wuallet-withdrawal-history-page .ww-request-primary {
    display:block;
    font-weight:600
}

.wuallet-withdrawal-history-page .ww-request-secondary {
    display:block;
    color:#159df5;
    margin-top:5px
}

.wuallet-withdrawal-history-page .ww-request-note {
    display:block;
    color:var(--retiros-azul-marino);
    margin-top:5px;
    font-size:.92em;
    white-space:pre-line
}

.wuallet-withdrawal-history-page .ww-request-status {
    display:inline-flex;
    align-items:center;
    width:max-content;
    margin-top:7px;
    padding:5px 11px;
    border-radius:999px;
    color:#fff;
    font-size:11px;
    font-weight:400;
    line-height:1
}

.wuallet-withdrawal-history-page .ww-request-date {
    display:block;
    color:gray;
    font-size:.85em;
    margin-top:7px
}

.wuallet-withdrawal-history-page .ww-cancel-form {
    margin-top:7px
}

.wuallet-withdrawal-history-page .ww-cancel-link {
    appearance:none;
    padding:0;
    border:0;
    background:transparent;
    color:#d92d20;
    font:inherit;
    font-size:13px;
    font-weight:600;
    text-decoration:underline;
    cursor:pointer
}

.wuallet-withdrawal-history-page .ww-history-link {
    padding:14px 8px 2px
}

.wuallet-withdrawal-history-page .ww-history-link a {
    color:#159df5;
    text-decoration:none
}

.wuallet-withdrawal-history-page .ww-history-link a:hover {
    text-decoration:underline
}

@media(max-width:600px) {
    .wuallet-withdrawal-history-page {
        margin:-40px 0 -25px;
        padding:15px
    }

    .wuallet-withdrawal-history-page .ww-request-list th:first-child,
    .wuallet-withdrawal-history-page .ww-request-list td:first-child {
        width:82%
    }

    .wuallet-withdrawal-history-page .ww-request-list th:last-child,
    .wuallet-withdrawal-history-page .ww-request-list td:last-child {
        width:18%
    }

    .wuallet-withdrawal-history-page .ww-table th,
    .wuallet-withdrawal-history-page .ww-table td {
        padding-left:6px;
        padding-right:6px
    }

}

/* ================================================================
   APLICACIÓN DEL PANEL MAESTRO POR MÓDULO
   Estas reglas conectan los controles superiores con cada sección.
   ================================================================ */

/* ------ Módulo Solicitar Retiro ------ */

.modulo-solicitar-retiro .titulo-solicitar-retiro {
    color: var(--color-titulo-solicitar-retiro);
}

.modulo-solicitar-retiro p,
.modulo-solicitar-retiro .ww-account-summary,
.modulo-solicitar-retiro .ww-form label {
    color: var(--color-descripcion-solicitar-retiro);
}

.modulo-solicitar-retiro .ww-withdrawal-amount-input,
.modulo-solicitar-retiro .ww-withdrawal-amount-input input {
    color: var(--color-monto-solicitar-retiro);
}

/* ------ Módulo Cuenta Bancaria ------ */

.modal-cuenta-bancaria .ww-bank-modal-title {
    color: var(--color-titulo-cuenta-bancaria);
}

.modal-cuenta-bancaria .ww-form {
    color: var(--color-descripcion-cuenta-bancaria);
}

/* ------ Valores de escritorio ------ */

.modulo-solicitar-retiro .titulo-solicitar-retiro {
    font-size: var(--titulo-solicitar-retiro-desktop);
}

.modulo-solicitar-retiro p,
.modulo-solicitar-retiro .ww-account-summary {
    font-size: var(--descripcion-solicitar-retiro-desktop);
}

.modulo-solicitar-retiro .ww-withdrawal-amount-input input {
    font-size: var(--monto-solicitar-retiro-desktop);
}

.modal-cuenta-bancaria .ww-bank-modal-title {
    font-size: var(--titulo-cuenta-bancaria-desktop);
}

.modal-cuenta-bancaria .ww-form {
    font-size: var(--descripcion-cuenta-bancaria-desktop);
}

.modulo-solicitudes-retiro .ww-list-title {
    font-size: var(--titulo-solicitudes-desktop);
}

.modulo-solicitudes-retiro .ww-request-list td:first-child {
    font-size: var(--descripcion-solicitudes-desktop);
}

.modulo-solicitudes-retiro .ww-request-list td:last-child {
    font-size: var(--monto-solicitudes-desktop);
}

.wuallet-withdrawal-history-page .ww-list-title {
    font-size: var(--titulo-historial-desktop);
}

.wuallet-withdrawal-history-page .ww-request-list td:first-child {
    font-size: var(--descripcion-historial-desktop);
}

.wuallet-withdrawal-history-page .ww-request-list td:last-child {
    font-size: var(--monto-historial-desktop);
}

.modulo-fondos-custodia h3 {
    font-size: var(--titulo-custodia-desktop);
}

.modulo-fondos-custodia .ww-table {
    font-size: var(--descripcion-custodia-desktop);
}

.modulo-fondos-custodia .ww-table td:last-child {
    font-size: var(--monto-custodia-desktop);
}

.modulo-administracion-retiros .ww-list-title {
    font-size: var(--titulo-administracion-desktop);
}

.modulo-administracion-retiros .ww-request-list td:first-child {
    font-size: var(--descripcion-administracion-desktop);
}

.modulo-administracion-retiros .ww-request-list td:last-child {
    font-size: var(--monto-administracion-desktop);
}

/* ------ Valores de tablet ------ */

@media (min-width: 601px) and (max-width: 1100px) {
    .modulo-solicitar-retiro .titulo-solicitar-retiro {
        font-size: var(--titulo-solicitar-retiro-tablet);
    }

    .modulo-solicitar-retiro p,
    .modulo-solicitar-retiro .ww-account-summary {
        font-size: var(--descripcion-solicitar-retiro-tablet);
    }

    .modulo-solicitar-retiro .ww-withdrawal-amount-input input {
        font-size: var(--monto-solicitar-retiro-tablet);
    }

    .modal-cuenta-bancaria .ww-bank-modal-title {
        font-size: var(--titulo-cuenta-bancaria-tablet);
    }

    .modal-cuenta-bancaria .ww-form {
        font-size: var(--descripcion-cuenta-bancaria-tablet);
    }

    .modulo-solicitudes-retiro .ww-list-title {
        font-size: var(--titulo-solicitudes-tablet);
    }

    .modulo-solicitudes-retiro .ww-request-list td:first-child {
        font-size: var(--descripcion-solicitudes-tablet);
    }

    .modulo-solicitudes-retiro .ww-request-list td:last-child {
        font-size: var(--monto-solicitudes-tablet);
    }

    .wuallet-withdrawal-history-page .ww-list-title {
        font-size: var(--titulo-historial-tablet);
    }

    .wuallet-withdrawal-history-page .ww-request-list td:first-child {
        font-size: var(--descripcion-historial-tablet);
    }

    .wuallet-withdrawal-history-page .ww-request-list td:last-child {
        font-size: var(--monto-historial-tablet);
    }

    .modulo-fondos-custodia h3 {
        font-size: var(--titulo-custodia-tablet);
    }

    .modulo-fondos-custodia .ww-table {
        font-size: var(--descripcion-custodia-tablet);
    }

    .modulo-fondos-custodia .ww-table td:last-child {
        font-size: var(--monto-custodia-tablet);
    }

    .modulo-administracion-retiros .ww-list-title {
        font-size: var(--titulo-administracion-tablet);
    }

    .modulo-administracion-retiros .ww-request-list td:first-child {
        font-size: var(--descripcion-administracion-tablet);
    }

    .modulo-administracion-retiros .ww-request-list td:last-child {
        font-size: var(--monto-administracion-tablet);
    }

}

/* ------ Valores de móvil ------ */

@media (max-width: 600px) {
    .modulo-solicitar-retiro .titulo-solicitar-retiro {
        font-size: var(--titulo-solicitar-retiro-movil);
    }

    .modulo-solicitar-retiro p,
    .modulo-solicitar-retiro .ww-account-summary {
        font-size: var(--descripcion-solicitar-retiro-movil);
    }

    .modulo-solicitar-retiro .ww-withdrawal-amount-input input {
        font-size: var(--monto-solicitar-retiro-movil);
    }

    .modal-cuenta-bancaria .ww-bank-modal-title {
        font-size: var(--titulo-cuenta-bancaria-movil);
    }

    .modal-cuenta-bancaria .ww-form {
        font-size: var(--descripcion-cuenta-bancaria-movil);
    }

    .modulo-solicitudes-retiro .ww-list-title {
        font-size: var(--titulo-solicitudes-movil);
    }

    .modulo-solicitudes-retiro .ww-request-list td:first-child {
        font-size: var(--descripcion-solicitudes-movil);
    }

    .modulo-solicitudes-retiro .ww-request-list td:last-child {
        font-size: var(--monto-solicitudes-movil);
    }

    .wuallet-withdrawal-history-page .ww-list-title {
        font-size: var(--titulo-historial-movil);
    }

    .wuallet-withdrawal-history-page .ww-request-list td:first-child {
        font-size: var(--descripcion-historial-movil);
    }

    .wuallet-withdrawal-history-page .ww-request-list td:last-child {
        font-size: var(--monto-historial-movil);
    }

    .modulo-fondos-custodia h3 {
        font-size: var(--titulo-custodia-movil);
    }

    .modulo-fondos-custodia .ww-table {
        font-size: var(--descripcion-custodia-movil);
    }

    .modulo-fondos-custodia .ww-table td:last-child {
        font-size: var(--monto-custodia-movil);
    }

    .modulo-administracion-retiros .ww-list-title {
        font-size: var(--titulo-administracion-movil);
    }

    .modulo-administracion-retiros .ww-request-list td:first-child {
        font-size: var(--descripcion-administracion-movil);
    }

    .modulo-administracion-retiros .ww-request-list td:last-child {
        font-size: var(--monto-administracion-movil);
    }

}
