/* ============================================================
   NZT MOBILE HOME CLEAN
   Ruta sugerida: css/mobile/nzt.mobile.home.clean.css
   Version: 20260711_001

   Objetivo:
   - Reemplazar css/mobile/nzt.mobile.home.css contaminado por parches.
   - Mantener Home móvil banco NZT funcionando.
   - No tocar lógica, API ni JS.
   ============================================================ */

/* ============================================================
   01. TOKENS / BASE
   ============================================================ */

:root {
    --bank-bg: #f4f7fb;
    --bank-bg-soft: #edf3f7;
    --bank-text: #162232;
    --bank-muted: #8e99a8;
    --bank-line: rgba(22, 34, 50, 0.08);
    --bank-card: #ffffff;

    --bank-dark-bg: #052b3b;
    --bank-dark-bg-2: #031d2a;
    --bank-dark-card: #092f42;
    --bank-dark-card-2: #061f2d;

    --bank-cyan-light: #8fe8ff;
    --bank-cyan: #47d8f5;
    --bank-cyan-strong: #22cde8;
    --bank-teal: #2eb7c9;
    --bank-teal-dark: #189bad;
    --bank-blue: #259cff;
    --bank-violet: #6c6bf5;
    --bank-coral: #ff7a6b;

    --bank-safe-bottom: env(safe-area-inset-bottom);
    --bank-radius-xl: 26px;
    --bank-radius-lg: 22px;
    --bank-radius-md: 18px;

    --bank-gradient-main:
        radial-gradient(circle at 18% 0%, rgba(255, 255, 255, 0.16), transparent 28%),
        radial-gradient(circle at 100% 100%, rgba(108, 107, 245, 0.55), transparent 38%),
        linear-gradient(135deg, #46d9e8 0%, #2aaef0 52%, #6670ea 100%);

    --bank-gradient-plus:
        radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.40), transparent 24%),
        radial-gradient(circle at 72% 84%, rgba(108, 107, 245, 0.64), transparent 34%),
        linear-gradient(145deg, #7ff0ff 0%, #28cfe7 30%, #258fff 64%, #6d67f6 100%);

    --bank-shadow-card: 0 16px 38px rgba(28, 46, 64, 0.10);
    --bank-shadow-dark: 0 18px 42px rgba(0, 0, 0, 0.20);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    overflow-x: hidden;
}

html {
    background: var(--bank-bg);
}

body.nzt-bank-home {
    min-height: 100vh;
    margin: 0;
    color: var(--bank-text);
    background:
        radial-gradient(circle at 16% 0%, rgba(71, 216, 245, 0.10), transparent 30%),
        radial-gradient(circle at 92% 16%, rgba(108, 107, 245, 0.07), transparent 28%),
        linear-gradient(180deg, #fbfdff 0%, #f6f9fc 46%, #edf3f7 100%);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

body.nzt-bank-home::before {
    display: none;
}

button,
a,
input,
select {
    -webkit-tap-highlight-color: transparent;
}

button {
    font: inherit;
}

body.nzt-menu-open,
body.nzt-mobile-actions-open {
    overflow: hidden;
}

.nzt-bank-hidden-trigger {
    display: none !important;
}

/* ============================================================
   02. APP SHELL
   ============================================================ */

.nzt-bank-app {
    position: relative;
    width: min(100vw, 430px);
    max-width: 100vw;
    min-height: 100vh;
    margin: 0 auto;
    padding: 18px 18px calc(118px + var(--bank-safe-bottom));
    overflow-x: hidden;
}

/* ============================================================
   03. HEADER / GREETING
   ============================================================ */

.nzt-bank-header {
    position: relative;
    z-index: 2;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.nzt-bank-logo {
    position: relative;
    display: inline-block;
    color: var(--bank-teal-dark);
    font-size: 1.96rem;
    line-height: 1;
    font-weight: 650;
    letter-spacing: -0.075em;
    text-shadow: 0 10px 24px rgba(24, 155, 173, 0.10);
}

.nzt-bank-logo::after {
    content: "";
    position: absolute;
    left: 1px;
    bottom: -8px;
    width: 34px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--bank-cyan), var(--bank-blue), var(--bank-violet));
}

.nzt-bank-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.nzt-bank-icon-btn {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border: 1px solid rgba(22, 34, 50, 0.055);
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    color: #234153;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.86), transparent 38%),
        rgba(255, 255, 255, 0.74);
    box-shadow:
        0 12px 24px rgba(28, 46, 64, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition:
        transform 0.16s ease,
        background 0.16s ease,
        color 0.16s ease,
        box-shadow 0.16s ease;
}

.nzt-bank-icon-btn i {
    font-size: 1.02rem;
    line-height: 1;
}

.nzt-bank-icon-btn:active {
    transform: scale(0.92);
}

.nzt-bank-theme-btn {
    color: var(--bank-teal-dark);
    border-color: rgba(71, 216, 245, 0.18);
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.88), transparent 38%),
        rgba(71, 216, 245, 0.12);
}

.nzt-bank-profile {
    width: 46px;
    height: 46px;
    min-width: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    cursor: pointer;
}

.nzt-bank-profile-photo {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    object-fit: cover !important;
    border: 2px solid rgba(255, 255, 255, 0.82) !important;
    background: rgba(71, 216, 245, 0.10) !important;
    box-shadow:
        0 12px 24px rgba(28, 46, 64, 0.14),
        0 0 0 1px rgba(71, 216, 245, 0.16),
        0 0 18px rgba(71, 216, 245, 0.12) !important;
}

.nzt-bank-profile-photo::before,
.nzt-bank-profile-photo em {
    display: none !important;
}

.nzt-bank-profile-photo img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: inherit !important;
}

.nzt-bank-profile-photo span {
    color: var(--bank-teal-dark) !important;
    font-size: 0.78rem !important;
    font-weight: 850 !important;
}

.nzt-bank-profile strong {
    display: none !important;
}

.nzt-bank-greeting {
    position: relative;
    z-index: 2;
    margin: 0 0 22px;
}

.nzt-bank-greeting h1 {
    margin: 0;
    color: #182230;
    font-size: 1.56rem;
    line-height: 1.05;
    font-weight: 920;
    letter-spacing: -0.055em;
    white-space: nowrap;
}

.nzt-bank-greeting h1 span {
    display: inline-block;
    max-width: 210px;
    vertical-align: bottom;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-bank-greeting h1 em {
    font-style: normal;
}

.nzt-bank-greeting p {
    margin: 6px 0 0;
    color: #8f9aa7;
    font-size: 0.84rem;
    line-height: 1.1;
    font-weight: 650;
}

/* ============================================================
   04. FINANCE CARDS
   ============================================================ */

.nzt-bank-finance-stack {
    display: grid;
    gap: 14px;
    margin: 0 0 14px;
}

.nzt-bank-main-balance-card {
    position: relative;
    min-height: 104px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 17px 18px 18px;
    border-radius: 20px;
    overflow: hidden;
    color: #ffffff;
    background: var(--bank-gradient-main);
    box-shadow:
        0 16px 34px rgba(37, 156, 255, 0.18),
        0 8px 18px rgba(71, 216, 245, 0.10);
}

.nzt-bank-main-balance-card::before,
.nzt-bank-main-balance-card::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    pointer-events: none;
}

.nzt-bank-main-balance-card::before {
    right: -42px;
    top: -34px;
    width: 170px;
    height: 170px;
}

.nzt-bank-main-balance-card::after {
    right: 42px;
    bottom: -96px;
    width: 210px;
    height: 210px;
}

.nzt-bank-main-balance-card > div,
.nzt-bank-main-balance-card button {
    position: relative;
    z-index: 1;
}

.nzt-bank-main-balance-card span {
    display: block;
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.78rem;
    font-weight: 720;
    line-height: 1;
}

.nzt-bank-main-balance-card strong {
    display: block;
    color: #ffffff;
    font-size: clamp(1.72rem, 7vw, 2rem);
    line-height: 1;
    font-weight: 860;
    letter-spacing: -0.06em;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
}

.nzt-bank-main-balance-card button {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, 0.88);
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.24), transparent 34%),
        rgba(255, 255, 255, 0.14);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.18),
        0 10px 24px rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.nzt-bank-main-balance-card button:active {
    transform: scale(0.94);
}

.nzt-bank-expense-card {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(72, 216, 230, 0.10);
    background: linear-gradient(180deg, #08273a 0%, #071f31 100%);
    box-shadow:
        0 14px 30px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.nzt-bank-expense-row {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.nzt-bank-expense-row:last-child {
    border-bottom: 0;
}

.nzt-bank-expense-left {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.nzt-bank-expense-left > span:last-child {
    min-width: 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.83rem;
    font-weight: 650;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-bank-expense-row strong {
    color: #ffffff;
    font-size: 0.90rem;
    font-weight: 820;
    line-height: 1;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.nzt-bank-summary-icon {
    position: relative;
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(143, 232, 255, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 8px 18px rgba(0, 0, 0, 0.10);
}

.nzt-bank-summary-icon::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(71, 216, 245, 0.16), rgba(37, 156, 255, 0.08));
    pointer-events: none;
}

.nzt-bank-summary-icon i {
    position: relative;
    z-index: 1;
    font-size: 1.06rem;
    line-height: 1;
}

.nzt-bank-summary-icon-debito {
    color: #5cecff;
    background: rgba(92, 236, 255, 0.10);
}

.nzt-bank-summary-icon-debito i {
    color: #5cecff;
    text-shadow: 0 0 10px rgba(92, 236, 255, 0.40);
}

.nzt-bank-summary-icon-credito {
    color: #8fb2ff;
    background: rgba(108, 107, 245, 0.12);
}

.nzt-bank-summary-icon-credito i {
    color: #8fb2ff;
    text-shadow: 0 0 10px rgba(143, 178, 255, 0.42);
}

/* ============================================================
   05. SMART BUDGET
   ============================================================ */

.nzt-bank-smart-budget-card {
    position: relative;
    overflow: hidden;
    padding: 16px 16px 15px;
    border-radius: 20px;
    border: 1px solid rgba(36, 218, 230, 0.52);
    background: linear-gradient(180deg, rgba(7, 32, 48, 0.96) 0%, rgba(7, 32, 48, 0.98) 100%);
    box-shadow:
        0 14px 32px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.nzt-bank-smart-budget-card::before {
    content: "";
    position: absolute;
    right: -50px;
    top: -58px;
    width: 150px;
    height: 150px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(71, 216, 245, 0.11), transparent 70%);
    pointer-events: none;
}

.nzt-bank-smart-kicker,
.nzt-bank-smart-budget-card > strong,
.nzt-bank-smart-budget-card > p,
.nzt-bank-smart-meta {
    position: relative;
    z-index: 1;
}

.nzt-bank-smart-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #51dff1;
    font-size: 0.68rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.nzt-bank-smart-kicker i {
    font-size: 0.75rem;
}

.nzt-bank-smart-budget-card > strong {
    display: block;
    margin-top: 12px;
    color: #ffffff;
    font-size: 1.52rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: -0.055em;
    font-variant-numeric: tabular-nums;
}

.nzt-bank-smart-budget-card > p#nztBankPresupuestoMensaje {
    margin: 12px 0 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.80rem;
    line-height: 1.35;
    font-weight: 520;
}

.nzt-bank-smart-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.nzt-bank-smart-status {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1;
    border: 1px solid rgba(46, 203, 115, 0.42);
    color: #77efb1;
    background: rgba(20, 128, 61, 0.16);
}

.nzt-bank-smart-status.critico,
.nzt-bank-smart-status.riesgo {
    border-color: rgba(251, 113, 133, 0.35);
    color: #ffb3c2;
    background: rgba(190, 24, 93, 0.14);
}

.nzt-bank-smart-status.atento {
    border-color: rgba(250, 204, 21, 0.32);
    color: #ffe38a;
    background: rgba(161, 98, 7, 0.16);
}

.nzt-bank-smart-status.sano,
.nzt-bank-smart-status.solido,
.nzt-bank-smart-status.tranquilo {
    border-color: rgba(46, 203, 115, 0.42);
    color: #77efb1;
    background: rgba(20, 128, 61, 0.16);
}

.nzt-bank-smart-meta small {
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.73rem;
    font-weight: 500;
    line-height: 1.2;
}

.nzt-bank-smart-advice {
    margin-top: 10px;
    color: rgba(255, 255, 255, 0.52);
    font-size: 0.72rem;
    line-height: 1.32;
    font-weight: 500;
}

/* ============================================================
   06. OCR CARD
   ============================================================ */

.nzt-bank-ocr-card {
    position: relative;
    margin: 0 0 18px;
    padding: 16px;
    border-radius: 20px;
    border: 1px solid rgba(36, 218, 230, 0.12);
    background:
        radial-gradient(circle at 100% 0%, rgba(143, 232, 255, 0.10), transparent 34%),
        radial-gradient(circle at 0% 100%, rgba(108, 107, 245, 0.07), transparent 32%),
        #092f42;
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
    overflow: hidden;
}

.nzt-bank-ocr-card::before {
    content: "";
    position: absolute;
    right: -48px;
    top: -58px;
    width: 150px;
    height: 150px;
    border-radius: 999px;
    background: radial-gradient(circle, rgba(71, 216, 245, 0.12), transparent 68%);
    pointer-events: none;
}

.nzt-bank-ocr-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 38px;
}

.nzt-bank-ocr-head span {
    display: block;
    color: #8fe8ff;
    font-size: 0.70rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.nzt-bank-ocr-head > i {
    width: 42px;
    height: 42px;
    border-radius: 17px;
    display: grid;
    place-items: center;
    color: #a9a6ff;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.18), transparent 36%),
        rgba(108, 107, 245, 0.16);
    box-shadow: 0 10px 22px rgba(108, 107, 245, 0.10);
}

.nzt-bank-ocr-box {
    position: relative;
    z-index: 1;
    min-height: 88px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 14px 14px;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.075);
    background:
        radial-gradient(circle at 100% 0%, rgba(143, 232, 255, 0.06), transparent 40%),
        rgba(255, 255, 255, 0.035);
    box-shadow:
        0 12px 26px rgba(0, 0, 0, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.nzt-bank-ocr-copy {
    min-width: 0;
}

.nzt-bank-ocr-copy strong {
    display: block;
    color: #ffffff;
    font-size: 0.96rem;
    line-height: 1.16;
    font-weight: 880;
    letter-spacing: -0.02em;
}

.nzt-bank-ocr-copy span {
    display: block;
    margin-top: 6px;
    color: rgba(244, 251, 255, 0.56);
    font-size: 0.78rem;
    line-height: 1.22;
    font-weight: 650;
}

.nzt-bank-ocr-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.nzt-bank-ocr-actions button {
    position: relative;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 20px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #ffffff;
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.35), transparent 28%),
        linear-gradient(145deg, #67e7f8, #25a9ff);
    box-shadow:
        0 12px 24px rgba(37, 156, 255, 0.20),
        inset 0 -7px 12px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    transition:
        transform 0.16s ease,
        filter 0.16s ease,
        box-shadow 0.16s ease;
}

.nzt-bank-ocr-actions button:nth-child(2) {
    background:
        radial-gradient(circle at 30% 22%, rgba(255, 255, 255, 0.35), transparent 28%),
        linear-gradient(145deg, #8fe8ff, #47d8f5 36%, #6d67f6);
}

.nzt-bank-ocr-actions button i {
    position: relative;
    z-index: 1;
    font-size: 1.28rem;
}

.nzt-bank-ocr-actions button:active,
.nzt-bank-ocr-actions button.is-pressing {
    transform: translateY(2px) scale(0.94);
    filter: brightness(1.08) saturate(1.05);
}

.nzt-bank-ocr-card .nzt-boleta-chat-status {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 1 !important;
    width: 100% !important;
    min-height: 48px;
    transform: none !important;
    margin-top: 12px;
    display: none;
    grid-template-columns: 34px 1fr;
    align-items: center;
    gap: 10px;
    padding: 12px 13px;
    border-radius: 18px;
    border: 1px solid rgba(143, 232, 255, 0.16);
    color: #f4fbff;
    background:
        radial-gradient(circle at 0% 0%, rgba(143, 232, 255, 0.08), transparent 42%),
        #061f2d;
    box-shadow: none;
    font-size: 0.82rem;
    line-height: 1.26;
    font-weight: 700;
}

.nzt-bank-ocr-card #nztBoletaEstadoHome:not(:empty):not([hidden]) {
    display: grid !important;
}

.nzt-bank-ocr-card .nzt-boleta-chat-status i {
    color: #8fe8ff;
    font-size: 1.15rem;
}

/* ============================================================
   07. BOTTOM NAV
   ============================================================ */

.nzt-bank-bottom-nav {
    position: fixed;
    left: 50%;
    bottom: calc(10px + var(--bank-safe-bottom));
    z-index: 80;
    width: min(calc(100vw - 28px), 392px);
    max-width: calc(100vw - 28px);
    min-height: 66px;
    transform: translateX(-50%);
    display: grid;
    grid-template-columns: 1fr 1fr 62px 1fr 1fr;
    align-items: center;
    gap: 2px;
    padding: 7px 8px;
    border-radius: 27px;
    border: 1px solid rgba(21, 32, 46, 0.05);
    background: rgba(255, 255, 255, 0.95);
    box-shadow:
        0 18px 42px rgba(28, 46, 64, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.nzt-bank-bottom-nav a,
.nzt-bank-bottom-nav button {
    position: relative;
    min-width: 0;
    min-height: 48px;
    border: 0;
    border-radius: 19px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 4px;
    padding: 5px 4px;
    color: #8d98a5;
    text-decoration: none;
    background: transparent;
    font-size: 0.66rem;
    line-height: 1;
    font-weight: 760;
    overflow: hidden;
    transition:
        transform 0.16s ease,
        background 0.16s ease,
        color 0.16s ease,
        box-shadow 0.16s ease,
        filter 0.16s ease;
}

.nzt-bank-bottom-nav a::before,
.nzt-bank-bottom-nav button::before {
    content: "";
    position: absolute;
    inset: 7px;
    border-radius: 17px;
    opacity: 0;
    pointer-events: none;
    background: radial-gradient(circle at 50% 50%, rgba(71, 216, 245, 0.28), transparent 68%);
    transform: scale(0.82);
    transition:
        opacity 0.16s ease,
        transform 0.16s ease;
}

.nzt-bank-bottom-nav a i,
.nzt-bank-bottom-nav a span,
.nzt-bank-bottom-nav button i,
.nzt-bank-bottom-nav button span {
    position: relative;
    z-index: 1;
}

.nzt-bank-bottom-nav i {
    font-size: 1.04rem;
}

.nzt-bank-bottom-nav a.active {
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.09);
}

.nzt-bank-bottom-nav a.is-pressing,
.nzt-bank-bottom-nav button.is-pressing {
    transform: translateY(2px) scale(0.96);
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.13);
    box-shadow: inset 0 0 0 1px rgba(71, 216, 245, 0.14);
}

.nzt-bank-bottom-nav a.is-pressing::before,
.nzt-bank-bottom-nav button.is-pressing::before {
    opacity: 1;
    transform: scale(1);
}

.nzt-bank-plus {
    position: relative;
    width: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    justify-self: center;
    margin-top: -18px;
    border-radius: 22px !important;
    color: #ffffff !important;
    border: 3px solid rgba(255, 255, 255, 0.96) !important;
    overflow: visible !important;
    isolation: isolate;
    background: var(--bank-gradient-plus) !important;
    box-shadow:
        0 16px 28px rgba(37, 156, 255, 0.24),
        0 7px 16px rgba(71, 216, 245, 0.14),
        0 0 0 8px rgba(71, 216, 245, 0.045),
        inset 0 -9px 14px rgba(0, 0, 0, 0.08) !important;
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        filter 0.16s ease;
}

.nzt-bank-plus::before {
    content: "";
    position: absolute;
    inset: -8px;
    z-index: -2;
    border-radius: inherit;
    opacity: 0.68;
    background:
        radial-gradient(circle, rgba(71, 216, 245, 0.20) 0%, rgba(43, 143, 255, 0.10) 44%, rgba(108, 107, 245, 0) 72%);
    pointer-events: none;
}

.nzt-bank-plus::after {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: inherit;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.00) 48%);
    pointer-events: none;
}

.nzt-bank-plus i {
    position: relative;
    z-index: 1;
    font-size: 1.42rem;
    font-weight: 700;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.10);
}

.nzt-bank-plus.is-pressing {
    transform: translateY(3px) scale(0.94) !important;
}

/* ============================================================
   08. ACTION SHEET
   ============================================================ */

.nzt-mobile-action-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100;
    background: rgba(21, 32, 46, 0.34);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}

.nzt-mobile-action-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
}

.nzt-mobile-action-sheet {
    position: fixed;
    left: 50%;
    bottom: 0;
    z-index: 110;
    width: min(100vw, 430px);
    max-width: 100vw;
    max-height: calc(100dvh - 40px);
    overflow-y: auto;
    transform: translateX(-50%) translateY(104%);
    transition: transform 0.26s ease;
    padding: 10px 18px calc(22px + var(--bank-safe-bottom));
    border-radius: 28px 28px 0 0;
    background: #ffffff;
    box-shadow:
        0 -24px 58px rgba(28, 46, 64, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

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

.nzt-mobile-action-handle {
    width: 44px;
    height: 5px;
    border-radius: 999px;
    margin: 2px auto 16px;
    background: #d8e1e8;
}

.nzt-mobile-action-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}

.nzt-mobile-action-head span {
    display: block;
    color: #8f9aa7;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.10em;
}

.nzt-mobile-action-head h3 {
    margin: 6px 0 0;
    color: #172231;
    font-size: 1.24rem;
    line-height: 1;
    font-weight: 850;
    letter-spacing: -0.04em;
}

.nzt-mobile-action-head button {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #6b7786;
    background: #f1f5f8;
}

.nzt-mobile-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.nzt-mobile-action-item {
    position: relative;
    min-height: 110px;
    border: 1px solid rgba(21, 32, 46, 0.07);
    border-radius: 22px;
    display: grid;
    align-content: start;
    gap: 7px;
    padding: 14px;
    color: #172231;
    text-align: left;
    text-decoration: none;
    background: #fbfdff;
    box-shadow: 0 8px 18px rgba(28, 46, 64, 0.04);
    overflow: hidden;
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        filter 0.16s ease;
}

.nzt-mobile-action-item::after {
    content: "";
    position: absolute;
    inset: -60px -60px auto auto;
    width: 118px;
    height: 118px;
    border-radius: 999px;
    background: rgba(71, 216, 245, 0.07);
    pointer-events: none;
}

.nzt-mobile-action-item:active {
    transform: translateY(2px) scale(0.98);
    filter: brightness(1.01);
}

.nzt-mobile-action-item i,
.nzt-mobile-action-item strong,
.nzt-mobile-action-item span {
    position: relative;
    z-index: 1;
}

.nzt-mobile-action-item i {
    width: 38px;
    height: 38px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
    font-size: 1.15rem;
}

.nzt-mobile-action-item-gasto i {
    color: #ff9a8f;
    background: rgba(255, 122, 107, 0.14);
}

.nzt-mobile-action-item strong {
    color: #172231;
    font-size: 0.88rem;
    line-height: 1.10;
    font-weight: 850;
}

.nzt-mobile-action-item span {
    color: #8f9aa7;
    font-size: 0.72rem;
    line-height: 1.2;
    font-weight: 600;
}

/* ============================================================
   09. SIDE MENU
   ============================================================ */

.nzt-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 120;
    opacity: 0;
    pointer-events: none;
    background: rgba(21, 32, 46, 0.38);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    transition: opacity 0.22s ease;
}

.nzt-menu-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
}

.nzt-side-menu {
    position: fixed;
    top: 10px;
    left: 10px;
    bottom: 10px;
    z-index: 130;
    width: min(86vw, 350px);
    max-width: calc(100vw - 20px);
    display: grid;
    grid-template-rows: auto 1fr auto;
    border-radius: 28px;
    border: 1px solid rgba(21, 32, 46, 0.08);
    background: #ffffff;
    box-shadow: 24px 0 70px rgba(28, 46, 64, 0.22);
    overflow: hidden;
    transform: translateX(calc(-100% - 20px));
    opacity: 0;
    visibility: hidden;
    transition:
        transform 0.26s ease,
        opacity 0.22s ease,
        visibility 0.22s ease;
}

.nzt-side-menu.is-open {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
}

.nzt-menu-head {
    min-height: 92px;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid rgba(21, 32, 46, 0.06);
}

.nzt-menu-user {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.nzt-menu-photo {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
    font-weight: 850;
}

.nzt-menu-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nzt-menu-user strong {
    display: block;
    max-width: 184px;
    color: #172231;
    font-size: 0.98rem;
    line-height: 1.05;
    font-weight: 850;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-menu-user small {
    display: block;
    margin-top: 5px;
    color: #8f9aa7;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 650;
}

.nzt-menu-head button {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    display: grid;
    place-items: center;
    padding: 0;
    color: #6b7786;
    background: #f1f5f8;
}

.nzt-menu-body {
    overflow-y: auto;
    padding: 15px 14px 18px;
}

.nzt-menu-section {
    display: grid;
    gap: 7px;
    margin-bottom: 20px;
}

.nzt-menu-section > span {
    padding: 0 7px 3px;
    color: #a0aab6;
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.nzt-menu-section a {
    min-height: 48px;
    border-radius: 17px;
    display: grid;
    grid-template-columns: 34px 1fr;
    align-items: center;
    gap: 10px;
    padding: 8px 11px;
    color: #425064;
    text-decoration: none;
    background: transparent;
}

.nzt-menu-section a i {
    width: 34px;
    height: 32px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
}

.nzt-menu-section a strong,
.nzt-menu-section a span {
    min-width: 0;
    font-size: 0.88rem;
    line-height: 1.12;
    font-weight: 760;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-menu-section a.active {
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
}

.nzt-menu-foot {
    padding: 14px;
    border-top: 1px solid rgba(21, 32, 46, 0.06);
}

.nzt-menu-foot button {
    width: 100%;
    min-height: 46px;
    border: 0;
    border-radius: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: #b91c1c;
    background: rgba(239, 68, 68, 0.08);
    font-size: 0.88rem;
    font-weight: 850;
}

/* ============================================================
   10. HISTORIALES GENERADOS POR JS LEGACY
   ============================================================ */

.nzt-historial-backdrop {
    position: fixed;
    inset: 0;
    z-index: 150;
    display: grid;
    place-items: center;
    padding: 14px;
    background: rgba(21, 32, 46, 0.38);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
}

.nzt-historial-panel {
    width: min(100%, 410px);
    max-height: calc(100dvh - 28px);
    display: grid;
    grid-template-rows: auto 1fr auto;
    border-radius: 28px;
    border: 1px solid rgba(21, 32, 46, 0.08);
    background: #ffffff;
    box-shadow: 0 22px 60px rgba(28, 46, 64, 0.22);
    overflow: hidden;
}

.nzt-historial-head {
    padding: 18px;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid rgba(21, 32, 46, 0.06);
}

.nzt-historial-head span {
    color: var(--bank-teal-dark);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.nzt-historial-head h3 {
    margin: 5px 0 0;
    color: #172231;
    font-size: 1.26rem;
    line-height: 1;
    font-weight: 850;
}

.nzt-historial-head p {
    margin: 7px 0 0;
    color: #8f9aa7;
    font-size: 0.76rem;
}

.nzt-historial-head button {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 999px;
    display: grid;
    place-items: center;
    color: #6b7786;
    background: #f1f5f8;
}

.nzt-historial-body {
    min-height: 260px;
    overflow-y: auto;
    padding: 12px;
    display: grid;
    align-content: start;
    gap: 9px;
}

.nzt-historial-item {
    min-height: 72px;
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 11px;
    border-radius: 18px;
    border: 1px solid rgba(21, 32, 46, 0.055);
    background: #fbfdff;
}

.nzt-historial-icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
}

.nzt-historial-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.nzt-historial-copy strong {
    color: #172231;
    font-size: 0.86rem;
    line-height: 1.12;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-historial-copy span {
    color: #8f9aa7;
    font-size: 0.72rem;
    line-height: 1.24;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nzt-historial-right {
    min-width: 84px;
    display: grid;
    gap: 4px;
    text-align: right;
}

.nzt-historial-right strong {
    color: #172231;
    font-size: 0.84rem;
    font-weight: 850;
    white-space: nowrap;
}

.nzt-historial-right span {
    color: #8f9aa7;
    font-size: 0.66rem;
    font-weight: 700;
    text-transform: uppercase;
}

.nzt-historial-footer {
    min-height: 64px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid rgba(21, 32, 46, 0.06);
}

.nzt-historial-footer button,
.nzt-boleta-ver-btn {
    min-height: 36px;
    border: 0;
    border-radius: 999px;
    padding: 0 13px;
    color: var(--bank-teal-dark);
    background: rgba(71, 216, 245, 0.14);
    font-size: 0.72rem;
    font-weight: 800;
}

.nzt-historial-footer button:disabled {
    opacity: 0.38;
}

.nzt-historial-page {
    color: #8f9aa7;
    font-size: 0.72rem;
    font-weight: 750;
    text-align: center;
    white-space: nowrap;
}

.nzt-historial-empty {
    min-height: 230px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    padding: 24px;
    color: #8f9aa7;
    text-align: center;
}

.nzt-historial-empty i {
    color: var(--bank-teal-dark);
    font-size: 1.9rem;
}

.nzt-historial-empty strong {
    color: #172231;
    font-size: 0.96rem;
}

/* ============================================================
   11. DARK THEME
   ============================================================ */

body.nzt-bank-home.nzt-bank-dark {
    color: #f4fbff;
    background:
        radial-gradient(circle at 20% 0%, rgba(71, 216, 245, 0.13), transparent 32%),
        radial-gradient(circle at 92% 20%, rgba(108, 107, 245, 0.11), transparent 30%),
        linear-gradient(180deg, var(--bank-dark-bg) 0%, var(--bank-dark-bg) 48%, var(--bank-dark-bg-2) 100%);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-logo {
    color: #b7f4ff;
    text-shadow:
        0 0 18px rgba(71, 216, 245, 0.20),
        0 10px 24px rgba(0, 0, 0, 0.16);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-logo::after {
    box-shadow: 0 0 16px rgba(71, 216, 245, 0.34);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-icon-btn {
    color: rgba(244, 251, 255, 0.86);
    border-color: rgba(255, 255, 255, 0.075);
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.10), transparent 36%),
        rgba(255, 255, 255, 0.065);
    box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-theme-btn {
    color: var(--bank-cyan-light);
    border-color: rgba(143, 232, 255, 0.14);
    background:
        radial-gradient(circle at 30% 20%, rgba(143, 232, 255, 0.16), transparent 36%),
        rgba(143, 232, 255, 0.08);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-profile-photo {
    border-color: rgba(143, 232, 255, 0.26) !important;
    background: rgba(143, 232, 255, 0.10) !important;
    box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.22),
        0 0 0 1px rgba(143, 232, 255, 0.12),
        0 0 18px rgba(71, 216, 245, 0.12) !important;
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-profile-photo span {
    color: var(--bank-cyan-light) !important;
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-greeting h1 {
    color: #f8fdff;
    text-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-greeting h1 span {
    color: #ffffff;
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-greeting p {
    color: rgba(244, 251, 255, 0.66);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav {
    border-color: rgba(255, 255, 255, 0.08);
    background: rgba(9, 47, 66, 0.88);
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav a,
body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav button {
    color: rgba(244, 251, 255, 0.58);
}

body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav a.active,
body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav a.is-pressing,
body.nzt-bank-home.nzt-bank-dark .nzt-bank-bottom-nav button.is-pressing {
    color: var(--bank-cyan-light);
    background: rgba(143, 232, 255, 0.10);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-backdrop,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-backdrop {
    background: rgba(1, 15, 24, 0.58);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-sheet,
body.nzt-bank-home.nzt-bank-dark .nzt-side-menu,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-panel {
    border-color: rgba(255, 255, 255, 0.08);
    background: var(--bank-dark-card);
    box-shadow: 0 -22px 55px rgba(0, 0, 0, 0.32);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-handle {
    background: rgba(244, 251, 255, 0.24);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-head span,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-head span,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-section > span {
    color: rgba(143, 232, 255, 0.80);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-head h3,
body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-item strong,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-user strong,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-head h3,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-copy strong,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-right strong,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-empty strong {
    color: #f4fbff;
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-head button,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-head button,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-head button {
    color: #f4fbff;
    background: rgba(255, 255, 255, 0.08);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-item,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-item {
    border-color: rgba(255, 255, 255, 0.08);
    color: #f4fbff;
    background: #0b3a4f;
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-item i,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-section a i,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-icon,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-photo {
    color: var(--bank-cyan-light);
    background: rgba(143, 232, 255, 0.10);
}

body.nzt-bank-home.nzt-bank-dark .nzt-mobile-action-item span,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-user small,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-head p,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-copy span,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-right span,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-empty,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-page {
    color: rgba(244, 251, 255, 0.54);
}

body.nzt-bank-home.nzt-bank-dark .nzt-menu-head,
body.nzt-bank-home.nzt-bank-dark .nzt-menu-foot,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-head,
body.nzt-bank-home.nzt-bank-dark .nzt-historial-footer {
    border-color: rgba(255, 255, 255, 0.08);
}

body.nzt-bank-home.nzt-bank-dark .nzt-menu-section a {
    color: rgba(244, 251, 255, 0.74);
}

body.nzt-bank-home.nzt-bank-dark .nzt-menu-section a.active {
    color: var(--bank-cyan-light);
    background: rgba(143, 232, 255, 0.10);
}

body.nzt-bank-home.nzt-bank-dark .nzt-menu-foot button {
    color: #fecdd3;
    background: rgba(239, 68, 68, 0.10);
}

body.nzt-bank-home.nzt-bank-dark .nzt-historial-footer button,
body.nzt-bank-home.nzt-bank-dark .nzt-boleta-ver-btn {
    color: var(--bank-cyan-light);
    background: rgba(143, 232, 255, 0.10);
}

/* ============================================================
   12. LIGHT THEME OVERRIDES
   ============================================================ */

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-expense-card {
    border-color: rgba(22, 34, 50, 0.06);
    background: #ffffff;
    box-shadow:
        0 14px 32px rgba(28, 46, 64, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.90);
}

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-expense-row {
    border-bottom-color: rgba(22, 34, 50, 0.07);
}

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-expense-left > span:last-child {
    color: #4d5a6c;
}

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-expense-row strong {
    color: #172231;
}

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-summary-icon-debito i {
    color: #0ebfd4;
}

body.nzt-bank-home:not(.nzt-bank-dark) .nzt-bank-summary-icon-credito i {
    color: #4f7dff;
}

/* La card de presupuesto se mantiene oscura en ambos themes por identidad visual. */

/* ============================================================
   13. RESPONSIVE
   ============================================================ */

@media (max-width: 520px) {
    .nzt-bank-app {
        padding: 14px 16px calc(112px + var(--bank-safe-bottom));
    }

    .nzt-bank-header {
        min-height: 46px;
        margin-bottom: 12px;
    }

    .nzt-bank-logo {
        font-size: 1.82rem;
    }

    .nzt-bank-header-actions {
        gap: 7px;
    }

    .nzt-bank-icon-btn {
        width: 36px;
        height: 36px;
        min-width: 36px;
        border-radius: 15px;
    }

    .nzt-bank-profile,
    .nzt-bank-profile-photo {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
    }

    .nzt-bank-greeting {
        margin-bottom: 18px;
    }

    .nzt-bank-greeting h1 {
        font-size: 1.48rem;
    }

    .nzt-bank-main-balance-card {
        min-height: 98px;
    }

    .nzt-bank-ocr-head {
        margin-bottom: 32px;
    }
}

@media (max-width: 390px) {
    .nzt-bank-app {
        padding-left: 14px;
        padding-right: 14px;
        padding-bottom: calc(108px + var(--bank-safe-bottom));
    }

    .nzt-bank-logo {
        font-size: 1.66rem;
    }

    .nzt-bank-header-actions {
        gap: 6px;
    }

    .nzt-bank-icon-btn {
        width: 33px;
        height: 33px;
        min-width: 33px;
        border-radius: 14px;
    }

    .nzt-bank-profile,
    .nzt-bank-profile-photo {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
    }

    .nzt-bank-greeting h1 {
        font-size: 1.38rem;
    }

    .nzt-bank-finance-stack {
        gap: 12px;
    }

    .nzt-bank-main-balance-card,
    .nzt-bank-expense-card,
    .nzt-bank-smart-budget-card,
    .nzt-bank-ocr-card {
        border-radius: 18px;
    }

    .nzt-bank-main-balance-card {
        min-height: 94px;
        padding: 16px;
    }

    .nzt-bank-main-balance-card strong {
        font-size: 1.58rem;
    }

    .nzt-bank-expense-row {
        padding: 12px 14px;
        gap: 10px;
    }

    .nzt-bank-expense-left {
        gap: 9px;
    }

    .nzt-bank-expense-left > span:last-child {
        font-size: 0.76rem;
    }

    .nzt-bank-expense-row strong {
        font-size: 0.78rem;
    }

    .nzt-bank-smart-budget-card {
        padding: 15px;
    }

    .nzt-bank-ocr-card {
        padding: 14px;
    }

    .nzt-bank-ocr-box {
        grid-template-columns: 1fr;
    }

    .nzt-bank-ocr-actions {
        justify-content: flex-start;
    }

    .nzt-bank-bottom-nav {
        min-height: 62px;
        width: calc(100vw - 22px);
        max-width: calc(100vw - 22px);
        grid-template-columns: 1fr 1fr 58px 1fr 1fr;
    }

    .nzt-bank-plus {
        width: 54px !important;
        height: 54px !important;
        min-height: 54px !important;
        margin-top: -16px;
    }

    .nzt-bank-plus i {
        font-size: 1.34rem;
    }

    .nzt-mobile-action-grid {
        grid-template-columns: 1fr;
    }

    .nzt-historial-item {
        grid-template-columns: 40px 1fr;
    }

    .nzt-historial-right {
        grid-column: 2 / 3;
        min-width: 0;
        display: flex;
        justify-content: space-between;
        gap: 10px;
        text-align: left;
    }
}