/* ═══════════════════════════════════════════════════════════════════════════════════════════
   WALLET SHEET — Bottom Sheet Modal
   Adaptado para DARK y LIGHT mode
   Sigue la estructura de admin-dashboard.css
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

/* ─── Variables base (DARK MODE - por defecto) ─── */
:root,
html[data-theme="dark"] {
    --sheet-bg          : var(--card-bg, #1a1d2e);
    --sheet-border      : var(--border-color, rgba(255,255,255,.08));
    --sheet-radius      : 24px;
    --sheet-handle-bg   : rgba(255,255,255,.18);
    --sheet-overlay     : rgba(0,0,0,.65);
    --sheet-header-h    : 64px;
    --sheet-max-h       : 92dvh;
    --sheet-transition  : 0.38s cubic-bezier(0.32, 0.72, 0, 1);

    /* Colores acción */
    --sheet-deposit-color : #10b981;
    --sheet-deposit-glow  : rgba(16,185,129,.25);
    --sheet-withdraw-color: #f59e0b;
    --sheet-withdraw-glow : rgba(245,158,11,.25);
    
    /* Textos y fondos */
    --sheet-text-primary   : var(--text-primary, #f1f5f9);
    --sheet-text-muted     : var(--text-muted, rgba(255,255,255,.45));
    --sheet-text-secondary : rgba(255,255,255,.55);
    --sheet-text-dim       : rgba(255,255,255,.4);
    --sheet-text-faint     : rgba(255,255,255,.25);
    --sheet-text-placeholder: rgba(255,255,255,.2);
    
    /* Fondos y superficies */
    --sheet-surface        : rgba(255,255,255,.04);
    --sheet-surface-hover  : rgba(255,255,255,.08);
    --sheet-surface-active : rgba(255,255,255,.1);
    --sheet-surface-light  : rgba(255,255,255,.02);
    --sheet-surface-pill   : rgba(255,255,255,.05);
    
    /* Bordes */
    --sheet-border-light   : rgba(255,255,255,.04);
    --sheet-border-hover   : rgba(255,255,255,.2);
    
    /* Scrollbar */
    --sheet-scrollbar      : rgba(255,255,255,.1);
    
    /* Sombras */
    --sheet-shadow-top     : 0 -4px 32px rgba(0,0,0,.35);
    
    /* Botón cerrar */
    --sheet-close-bg       : rgba(255,255,255,.04);
    --sheet-close-hover-bg : rgba(255,255,255,.1);
    
    /* File upload */
    --sheet-file-border    : var(--sheet-border);
    --sheet-file-hover-bg  : rgba(99,102,241,.04);
    --sheet-file-hover-border: rgba(99,102,241,.35);
    --sheet-file-icon      : rgba(255,255,255,.2);
    --sheet-file-label     : rgba(255,255,255,.45);
    --sheet-file-hint      : rgba(255,255,255,.25);
    
    /* Info box */
    --sheet-info-border    : rgba(99,102,241,.15);
    --sheet-info-bg        : rgba(99,102,241,.05);
    --sheet-info-text      : rgba(255,255,255,.55);
    --sheet-info-strong    : rgba(255,255,255,.75);
    
    /* Warn box */
    --sheet-warn-border    : rgba(245,158,11,.15);
    --sheet-warn-bg        : rgba(245,158,11,.05);
    
    /* Method details */
    --sheet-method-border  : rgba(16,185,129,.15);
    --sheet-method-bg      : rgba(16,185,129,.04);
    
    /* Copy button */
    --sheet-copy-bg        : rgba(255,255,255,.04);
    --sheet-copy-color     : rgba(255,255,255,.4);
    --sheet-copy-hover-bg  : rgba(99,102,241,.15);
    --sheet-copy-hover-border: rgba(99,102,241,.3);
    --sheet-copy-hover-color: #a5b4fc;
    
    /* Form focus */
    --sheet-focus-border   : rgba(99,102,241,.5);
    --sheet-focus-bg       : rgba(99,102,241,.05);
    --sheet-focus-shadow   : 0 0 0 3px rgba(99,102,241,.12);
    
    /* Valid/Invalid */
    --sheet-valid-border   : rgba(16,185,129,.4);
    --sheet-valid-bg       : rgba(16,185,129,.04);
    --sheet-invalid-border : rgba(239,68,68,.4);
    --sheet-invalid-bg     : rgba(239,68,68,.04);
    
    /* Select options */
    --sheet-select-bg      : #433c67;
    --sheet-select-color   : #e2e8f0;
    --sheet-select-hover   : #6366f1;
    --sheet-select-hover-color: #ffffff;
    --sheet-select-placeholder: #94a3b8;

    /* Error box */
    --sheet-error-bg        : rgba(239,68,68,.08);
    --sheet-error-border    : rgba(239,68,68,.2);
    --sheet-error-color     : #fca5a5;

    /* Balance box */
    --sheet-balance-bg      : rgba(245,158,11,.06);
    --sheet-balance-border  : rgba(245,158,11,.15);
    --sheet-balance-label-color : rgba(255,255,255,.4);
    --sheet-balance-amount-color : #fcd34d;
    --sheet-balance-total-color : rgba(255,255,255,.55);
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   LIGHT MODE OVERRIDES
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
    --sheet-bg          : var(--card-bg, #ffffff);
    --sheet-border      : var(--border-color, rgba(0,0,0,.08));
    --sheet-handle-bg   : rgba(0,0,0,.15);
    --sheet-overlay     : rgba(0,0,0,.45);
    
    /* Textos y fondos */
    --sheet-text-primary   : var(--text-primary, #1e293b);
    --sheet-text-muted     : var(--text-muted, rgba(0,0,0,.45));
    --sheet-text-secondary : rgba(0,0,0,.6);
    --sheet-text-dim       : rgba(0,0,0,.5);
    --sheet-text-faint     : rgba(0,0,0,.35);
    --sheet-text-placeholder: rgba(0,0,0,.35);
    
    /* Fondos y superficies */
    --sheet-surface        : rgba(0,0,0,.04);
    --sheet-surface-hover  : rgba(0,0,0,.08);
    --sheet-surface-active : rgba(0,0,0,.1);
    --sheet-surface-light  : rgba(0,0,0,.02);
    --sheet-surface-pill   : rgba(0,0,0,.05);
    
    /* Bordes */
    --sheet-border-light   : rgba(0,0,0,.05);
    --sheet-border-hover   : rgba(0,0,0,.15);
    
    /* Scrollbar */
    --sheet-scrollbar      : rgba(0,0,0,.15);
    
    /* Sombras */
    --sheet-shadow-top     : 0 -4px 32px rgba(0,0,0,.12);
    
    /* Botón cerrar */
    --sheet-close-bg       : rgba(0,0,0,.04);
    --sheet-close-hover-bg : rgba(0,0,0,.08);
    
    /* File upload */
    --sheet-file-border    : rgba(0,0,0,.12);
    --sheet-file-hover-bg  : rgba(99,102,241,.06);
    --sheet-file-hover-border: rgba(99,102,241,.4);
    --sheet-file-icon      : rgba(0,0,0,.25);
    --sheet-file-label     : rgba(0,0,0,.55);
    --sheet-file-hint      : rgba(0,0,0,.4);
    
    /* Info box */
    --sheet-info-border    : rgba(99,102,241,.2);
    --sheet-info-bg        : rgba(99,102,241,.08);
    --sheet-info-text      : rgba(0,0,0,.6);
    --sheet-info-strong    : rgba(0,0,0,.8);
    
    /* Warn box */
    --sheet-warn-border    : rgba(245,158,11,.25);
    --sheet-warn-bg        : rgba(245,158,11,.08);
    
    /* Method details */
    --sheet-method-border  : rgba(16,185,129,.2);
    --sheet-method-bg      : rgba(16,185,129,.06);
    
    /* Copy button */
    --sheet-copy-bg        : rgba(0,0,0,.04);
    --sheet-copy-color     : rgba(0,0,0,.5);
    --sheet-copy-hover-bg  : rgba(99,102,241,.12);
    --sheet-copy-hover-border: rgba(99,102,241,.3);
    --sheet-copy-hover-color: #4f46e5;
    
    /* Form focus */
    --sheet-focus-border   : rgba(99,102,241,.6);
    --sheet-focus-bg       : rgba(99,102,241,.06);
    --sheet-focus-shadow   : 0 0 0 3px rgba(99,102,241,.15);
    
    /* Valid/Invalid */
    --sheet-valid-border   : rgba(16,185,129,.5);
    --sheet-valid-bg       : rgba(16,185,129,.06);
    --sheet-invalid-border : rgba(239,68,68,.5);
    --sheet-invalid-bg     : rgba(239,68,68,.06);
    
    /* Select options */
    --sheet-select-bg      : #ffffff;
    --sheet-select-color   : #1e293b;
    --sheet-select-hover   : #6366f1;
    --sheet-select-hover-color: #ffffff;
    --sheet-select-placeholder: #64748b;

    /* Error box */
    --sheet-error-bg        : rgba(239,68,68,.1);
    --sheet-error-border    : rgba(239,68,68,.25);
    --sheet-error-color     : #dc2626;

    /* Balance box */
    --sheet-balance-bg      : rgba(245,158,11,.08);
    --sheet-balance-border  : rgba(245,158,11,.2);
    --sheet-balance-label-color : rgba(0,0,0,.45);
    --sheet-balance-amount-color : #d97706;
    --sheet-balance-total-color : rgba(0,0,0,.6);
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   OVERLAY
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-overlay {
    position: fixed;
    inset: 0;
    background: var(--sheet-overlay);
    z-index: 1040;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--sheet-transition);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.sheet-overlay.is-open {
    opacity: 1;
    pointer-events: all;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SHEET CONTAINER
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.bottom-sheet {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1050;
    background: var(--sheet-bg);
    border-radius: var(--sheet-radius) var(--sheet-radius) 0 0;
    max-height: var(--sheet-max-h);
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform var(--sheet-transition);
    will-change: transform;
    box-shadow: var(--sheet-shadow-top), 0 -1px 0 var(--sheet-border);
}

.bottom-sheet.is-open {
    transform: translateY(0);
}

/* Snap points */
.bottom-sheet.snap-half {
    max-height: 55dvh;
}

.bottom-sheet.snap-full {
    max-height: 92dvh;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   HANDLE (barra de arrastre)
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-handle-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .75rem 0 .25rem;
    cursor: grab;
    user-select: none;
    flex-shrink: 0;
    touch-action: none;
}

.sheet-handle-wrap:active { cursor: grabbing; }

.sheet-handle {
    width: 40px;
    height: 4px;
    border-radius: 50px;
    background: var(--sheet-handle-bg);
    transition: background .2s, width .2s;
}

.sheet-handle-wrap:hover .sheet-handle,
.sheet-handle-wrap:active .sheet-handle {
    background: var(--sheet-surface-active);
    width: 52px;
}

html[data-theme="light"] .sheet-handle-wrap:hover .sheet-handle,
html[data-theme="light"] .sheet-handle-wrap:active .sheet-handle {
    background: rgba(0,0,0,.25);
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .5rem 1.25rem .75rem;
    flex-shrink: 0;
    border-bottom: 1px solid var(--sheet-border);
}

.sheet-header-left {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.sheet-header-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    flex-shrink: 0;
}

.sheet-header-icon.deposit {
    background: rgba(16,185,129,.12);
    color: var(--sheet-deposit-color);
    border: 1px solid rgba(16,185,129,.2);
}

html[data-theme="light"] .sheet-header-icon.deposit {
    background: rgba(16,185,129,.1);
    border-color: rgba(16,185,129,.25);
}

.sheet-header-icon.withdraw {
    background: rgba(245,158,11,.12);
    color: var(--sheet-withdraw-color);
    border: 1px solid rgba(245,158,11,.2);
}

html[data-theme="light"] .sheet-header-icon.withdraw {
    background: rgba(245,158,11,.1);
    border-color: rgba(245,158,11,.25);
}

.sheet-header-title {
    font-size: .92rem;
    font-weight: 800;
    color: var(--sheet-text-primary);
    line-height: 1.2;
}

.sheet-header-sub {
    font-size: .68rem;
    color: var(--sheet-text-muted);
    margin-top: .1rem;
}

.sheet-close-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--sheet-border);
    background: var(--sheet-close-bg);
    color: var(--sheet-text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    cursor: pointer;
    transition: all .2s;
    flex-shrink: 0;
}

.sheet-close-btn:hover {
    background: var(--sheet-close-hover-bg);
    color: var(--sheet-text-primary);
    border-color: var(--sheet-border-hover);
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SALDO PILL (dentro del header)
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-balance-pill {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .22rem .65rem;
    border-radius: 50px;
    font-size: .68rem;
    font-weight: 700;
    background: var(--sheet-surface-pill);
    border: 1px solid var(--sheet-border);
    color: var(--sheet-text-dim);
    white-space: nowrap;
}

.sheet-balance-pill i {
    font-size: .55rem;
    color: var(--sheet-deposit-color);
}

.sheet-balance-pill.withdraw i {
    color: var(--sheet-withdraw-color);
}

.sheet-balance-pill strong {
    color: var(--sheet-text-primary);
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   BODY (scrollable)
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1.1rem 1.25rem 2rem;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

/* Scrollbar delgado */
.sheet-body::-webkit-scrollbar { width: 3px; }
.sheet-body::-webkit-scrollbar-track { background: transparent; }
.sheet-body::-webkit-scrollbar-thumb {
    background: var(--sheet-scrollbar);
    border-radius: 50px;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   FORM ELEMENTS (heredan de wallet.css + overrides)
   ═══════════════════════════════════════════════════════════════════════════════════════════ */

/* Grid 2 columnas en pantallas >= 480px */
.sheet-form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .85rem;
    margin-bottom: .85rem;
}

@media (min-width: 480px) {
    .sheet-form-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.sheet-form-group {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.sheet-form-label {
    font-size: .72rem;
    font-weight: 700;
    color: var(--sheet-text-muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.sheet-form-label span {
    color: #ef4444;
    margin-left: .15rem;
}

.sheet-form-control {
    width: 100%;
    padding: .65rem .9rem;
    border-radius: 12px;
    border: 1px solid var(--sheet-border);
    background: var(--sheet-surface);
    color: var(--sheet-text-primary);
    font-size: .82rem;
    font-weight: 500;
    outline: none;
    transition: border-color .2s, background .2s, box-shadow .2s;
    -webkit-appearance: none;
    appearance: none;
}

.sheet-form-control::placeholder {
    color: var(--sheet-text-placeholder);
}

.sheet-form-control:focus {
    border-color: var(--sheet-focus-border);
    background: var(--sheet-focus-bg);
    box-shadow: var(--sheet-focus-shadow);
}

.sheet-form-control.is-valid {
    border-color: var(--sheet-valid-border);
    background: var(--sheet-valid-bg);
}

.sheet-form-control.is-invalid {
    border-color: var(--sheet-invalid-border);
    background: var(--sheet-invalid-bg);
}

select.sheet-form-control,
select.sheet-form-control.form-control,
select.form-control.sheet-form-control {
    background-image   : none !important;
    background-repeat  : no-repeat !important;
    background-position: unset !important;
    background-size    : unset !important;
    appearance         : none !important;
    -webkit-appearance : none !important;
    -moz-appearance    : none !important;
    padding-right      : .9rem !important;
}

html[data-theme="light"] select.sheet-form-control,
html[data-theme="light"] select.sheet-form-control.form-control,
html[data-theme="light"] select.form-control.sheet-form-control {
    background-image   : none !important;
    appearance         : none !important;
    -webkit-appearance : none !important;
    -moz-appearance    : none !important;
}

select.sheet-form-control option {
    background-color: var(--sheet-select-bg);
    color           : var(--sheet-select-color);
    font-weight     : 600;
    padding         : .4rem .6rem;
}

select.sheet-form-control option:checked,
select.sheet-form-control option:hover {
    background-color: var(--sheet-select-hover);
    color           : var(--sheet-select-hover-color);
}

select.sheet-form-control option[value=""] {
    color: var(--sheet-select-placeholder);
}

/* Hint / Error */
.sheet-form-hint {
    font-size: .65rem;
    color: var(--sheet-text-muted);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.sheet-form-hint i { font-size: .6rem; }

.sheet-form-error {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: .7rem;
    font-weight: 600;
    color: #ef4444;
}

.sheet-form-error i { font-size: .6rem; }

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   MÉTODO DE PAGO — Datos bancarios
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-method-details {
    border-radius: 14px;
    border: 1px solid var(--sheet-method-border);
    background: var(--sheet-method-bg);
    overflow: hidden;
    margin-bottom: .85rem;
    display: none;
}

.sheet-method-details.visible { display: block; }

.sheet-method-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .55rem .9rem;
    border-bottom: 1px solid var(--sheet-border-light);
}

.sheet-method-row:last-of-type { border-bottom: none; }

.sheet-method-key {
    font-size: .65rem;
    font-weight: 700;
    color: var(--sheet-text-dim);
    text-transform: uppercase;
    letter-spacing: .04em;
    min-width: 90px;
    flex-shrink: 0;
}

.sheet-method-val {
    font-size: .78rem;
    font-weight: 600;
    color: var(--sheet-text-primary);
    flex: 1;
    font-variant-numeric: tabular-nums;
}

.sheet-copy-btn {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    border: 1px solid var(--sheet-border);
    background: var(--sheet-copy-bg);
    color: var(--sheet-copy-color);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .65rem;
    cursor: pointer;
    transition: all .2s;
    flex-shrink: 0;
}

.sheet-copy-btn:hover {
    background: var(--sheet-copy-hover-bg);
    border-color: var(--sheet-copy-hover-border);
    color: var(--sheet-copy-hover-color);
}

.sheet-copy-all-btn {
    width: 100%;
    padding: .45rem .9rem;
    border: none;
    border-top: 1px solid var(--sheet-border-light);
    background: var(--sheet-surface-light);
    color: var(--sheet-copy-color);
    font-size: .65rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    transition: all .2s;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.sheet-copy-all-btn:hover {
    background: var(--sheet-copy-hover-bg);
    color: var(--sheet-copy-hover-color);
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   FILE UPLOAD
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-file-wrap {
    position: relative;
    border: 2px dashed var(--sheet-file-border);
    border-radius: 14px;
    padding: 1.1rem;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    background: var(--sheet-surface-light);
}

.sheet-file-wrap:hover {
    border-color: var(--sheet-file-hover-border);
    background: var(--sheet-file-hover-bg);
}

.sheet-file-wrap input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.sheet-file-icon {
    font-size: 1.4rem;
    color: var(--sheet-file-icon);
    margin-bottom: .4rem;
}

.sheet-file-label {
    font-size: .75rem;
    font-weight: 600;
    color: var(--sheet-file-label);
}

.sheet-file-hint {
    font-size: .62rem;
    color: var(--sheet-file-hint);
    margin-top: .2rem;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   INFO BOX
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-info-box {
    border-radius: 12px;
    border: 1px solid var(--sheet-info-border);
    background: var(--sheet-info-bg);
    padding: .75rem .9rem;
    margin-bottom: .85rem;
    font-size: .7rem;
    color: var(--sheet-info-text);
    line-height: 1.6;
}

.sheet-info-box.warn {
    border-color: var(--sheet-warn-border);
    background: var(--sheet-warn-bg);
}

.sheet-info-box ul {
    margin: .4rem 0 0;
    padding-left: 1.1rem;
}

.sheet-info-box li { margin-bottom: .2rem; }

.sheet-info-box strong { color: var(--sheet-info-strong); }

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SUBMIT BUTTON
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-submit-btn {
    width: 100%;
    padding: .85rem 1.5rem;
    border-radius: 14px;
    border: none;
    font-size: .85rem;
    font-weight: 800;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    transition: all .25s;
    letter-spacing: .02em;
    margin-top: .5rem;
}

.sheet-submit-btn.deposit {
    background: linear-gradient(135deg, #059669, #10b981);
    color: #fff;
    box-shadow: 0 4px 20px var(--sheet-deposit-glow);
}

.sheet-submit-btn.deposit:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 28px var(--sheet-deposit-glow);
}

.sheet-submit-btn.withdraw {
    background: linear-gradient(135deg, #d97706, #f59e0b);
    color: #fff;
    box-shadow: 0 4px 20px var(--sheet-withdraw-glow);
}

.sheet-submit-btn.withdraw:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 28px var(--sheet-withdraw-glow);
}

.sheet-submit-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
    transform: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   NUEVA CUENTA — sección colapsable
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-new-account {
    border-radius: 14px;
    border: 1px solid var(--sheet-border);
    background: var(--sheet-surface-light);
    overflow: hidden;
    margin-bottom: .85rem;
}

.sheet-new-account-header {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem .9rem;
    font-size: .75rem;
    font-weight: 700;
    color: var(--sheet-text-secondary);
    border-bottom: 1px solid var(--sheet-border);
    background: var(--sheet-surface-light);
}

.sheet-new-account-header i {
    color: var(--sheet-withdraw-color);
    font-size: .7rem;
}

.sheet-new-account-body {
    padding: .85rem .9rem;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   ANIMACIÓN DE ENTRADA DE CAMPOS
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
@keyframes sheet-field-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.sheet-body .sheet-form-group {
    animation: sheet-field-in .25s ease both;
}

.sheet-body .sheet-form-group:nth-child(1) { animation-delay: .04s; }
.sheet-body .sheet-form-group:nth-child(2) { animation-delay: .08s; }
.sheet-body .sheet-form-group:nth-child(3) { animation-delay: .12s; }
.sheet-body .sheet-form-group:nth-child(4) { animation-delay: .16s; }
.sheet-body .sheet-form-group:nth-child(5) { animation-delay: .20s; }

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SAFE AREA (iPhone notch / home indicator)
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-body {
    padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px));
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   RESPONSIVE — desktop: centrado como modal normal
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
@media (min-width: 768px) {
    .bottom-sheet {
        left: 50%;
        right: auto;
        width: 520px;
        transform: translateX(-50%) translateY(100%);
        border-radius: var(--sheet-radius);
    }

    .bottom-sheet.is-open {
        transform: translateX(-50%) translateY(0);
    }
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SHEET FOOTER — botón siempre visible
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-footer {
    flex-shrink: 0;
    padding: .75rem 1.25rem calc(.75rem + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--sheet-border);
    background: var(--sheet-bg);
}

/* Quitar el padding-bottom del body cuando hay footer */
.bottom-sheet .sheet-body {
    padding-bottom: .5rem; /* ya no necesita espacio para el botón */
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
   SHEET INFO COLLAPSE
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-info-collapse {
    border-radius: 12px;
    border: 1px solid var(--sheet-info-border);
    background: var(--sheet-info-bg);
    margin-bottom: .85rem;
    overflow: hidden;
}

.sheet-info-collapse.warn {
    border-color: var(--sheet-warn-border);
    background: var(--sheet-warn-bg);
}

/* Summary = cabecera clickeable */
.sheet-info-collapse summary {
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: .65rem .9rem;
    font-size: .72rem;
    font-weight: 700;
    color: var(--sheet-info-text);
    cursor: pointer;
    list-style: none;        /* quita el triángulo nativo */
    user-select: none;
    transition: color .2s, background .2s;
}

/* Quitar triángulo en webkit */
.sheet-info-collapse summary::-webkit-details-marker { display: none; }

.sheet-info-collapse summary:hover {
    color: var(--sheet-info-strong);
    background: var(--sheet-surface-light);
}

/* Icono izquierdo */
.sheet-info-collapse summary > .fa-info-circle {
    color: #818cf8;
    font-size: .68rem;
    flex-shrink: 0;
}

html[data-theme="light"] .sheet-info-collapse summary > .fa-info-circle {
    color: #6366f1;
}

.sheet-info-collapse.warn summary > .fa-exclamation-triangle {
    color: #fbbf24;
    font-size: .68rem;
    flex-shrink: 0;
}

/* Flecha derecha — empujar al final */
.sheet-info-arrow {
    margin-left: auto;
    font-size: .6rem;
    color: var(--sheet-text-faint);
    transition: transform .25s ease;
    flex-shrink: 0;
}

/* Rotar flecha cuando está abierto */
.sheet-info-collapse[open] .sheet-info-arrow {
    transform: rotate(180deg);
}

/* Contenido — lista */
.sheet-info-collapse ul {
    margin: 0;
    padding: 0 .9rem .75rem 1.9rem;
    font-size: .7rem;
    color: var(--sheet-info-text);
    line-height: 1.65;
    margin-top: .75rem;
}

.sheet-info-collapse ul li {
    margin-bottom: .2rem;
}

.sheet-info-collapse ul strong {
    color: var(--sheet-info-strong);
}

/* Animación suave al abrir */
.sheet-info-collapse[open] ul {
    animation: collapse-in .2s ease;
}

@keyframes collapse-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
  ERRORES BOX
  ═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-errors-box {
   background: var(--sheet-error-bg);
   border: 1px solid var(--sheet-error-border);
   border-radius: 12px;
   padding: .75rem .9rem;
   margin-bottom: .85rem;
   font-size: .72rem;
   color: var(--sheet-error-color);
}

.sheet-errors-box strong {
   display: flex;
   align-items: center;
   gap: .35rem;
   font-weight: 700;
}

.sheet-errors-box strong i {
   font-size: .7rem;
}

.sheet-errors-box ul {
   margin: .35rem 0 0;
   padding-left: 1.1rem;
}

.sheet-errors-box ul li {
   margin-bottom: .15rem;
}

/* ═══════════════════════════════════════════════════════════════════════════════════════════
  SALDO DISPONIBLE BOX
═══════════════════════════════════════════════════════════════════════════════════════════ */
.sheet-balance-box {
   background: var(--sheet-balance-bg);
   border: 1px solid var(--sheet-balance-border);
   border-radius: 14px;
   padding: .75rem .9rem;
   margin-bottom: .85rem;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: .5rem;
}

.sheet-balance-label {
   font-size: .62rem;
   font-weight: 700;
   color: var(--sheet-balance-label-color);
   text-transform: uppercase;
   letter-spacing: .04em;
}

.sheet-balance-amount {
   font-size: 1.15rem;
   font-weight: 900;
   color: var(--sheet-balance-amount-color);
   font-variant-numeric: tabular-nums;
}

.sheet-balance-secondary {
   text-align: right;
}

.sheet-balance-total {
   font-size: .85rem;
   font-weight: 700;
   color: var(--sheet-balance-total-color);
   font-variant-numeric: tabular-nums;
}