/* ============================================================
   NZT THEME MANTENEDORES
   Ruta: css/themes/nzt-theme.mantenedores.css
   Version: 20260711_006_CLEAN

   Objetivo:
   - Unificar colores de mantenedores en theme claro/oscuro.
   - Mantener compatibilidad con CSS existentes.
   - No tocar lógica, HTML ni JS.
   - Centralizar identidad visual NZT.
   - Unificar todos los selects mediante controls.js.
   ============================================================ */

/* ============================================================
   01. TOKENS OFICIALES
   ============================================================ */

:root {
    color-scheme: light;

    --nztm-bg: #f4f7fb;
    --nztm-bg-soft: #edf3f7;
    --nztm-bg-page: linear-gradient(180deg, #fbfdff 0%, #f6f9fc 48%, #edf3f7 100%);

    --nztm-surface: #ffffff;
    --nztm-surface-soft: #f8fbff;
    --nztm-surface-strong: #eef5fa;

    --nztm-text: #162232;
    --nztm-text-strong: #0f1724;
    --nztm-muted: #6f7d8c;
    --nztm-muted-2: #98a3af;
    --nztm-placeholder: rgba(111, 125, 140, 0.66);

    --nztm-border: rgba(22, 34, 50, 0.08);
    --nztm-border-soft: rgba(22, 34, 50, 0.055);
    --nztm-border-strong: rgba(22, 34, 50, 0.12);

    --nztm-cyan-light: #8fe8ff;
    --nztm-cyan: #47d8f5;
    --nztm-cyan-strong: #22cde8;
    --nztm-teal: #2eb7c9;
    --nztm-teal-strong: #168ca0;
    --nztm-blue: #259cff;
    --nztm-blue-strong: #2972ff;
    --nztm-violet: #6c6bf5;

    --nztm-cyan-soft: rgba(71, 216, 245, 0.12);
    --nztm-blue-soft: rgba(37, 156, 255, 0.11);
    --nztm-violet-soft: rgba(108, 107, 245, 0.10);

    --nztm-coral: #ff6b6b;
    --nztm-coral-soft: rgba(255, 107, 107, 0.12);
    --nztm-green: #22c55e;
    --nztm-green-soft: rgba(34, 197, 94, 0.11);
    --nztm-yellow: #f59e0b;
    --nztm-yellow-soft: rgba(245, 158, 11, 0.13);
    --nztm-red: #ef4444;
    --nztm-red-soft: rgba(239, 68, 68, 0.11);

    --nztm-gradient-main: linear-gradient(135deg, #67e7f8 0%, #31c7de 36%, #259cff 72%, #6c6bf5 100%);
    --nztm-gradient-coral: linear-gradient(135deg, #ff8a7a 0%, #ff6b6b 44%, #ef4444 100%);
    --nztm-gradient-soft:
        radial-gradient(circle at 0% 0%, rgba(71, 216, 245, 0.10), transparent 38%),
        radial-gradient(circle at 100% 0%, rgba(108, 107, 245, 0.08), transparent 34%),
        #ffffff;

    --nztm-shadow-card: 0 18px 44px rgba(28, 46, 64, 0.10);
    --nztm-shadow-soft: 0 12px 28px rgba(28, 46, 64, 0.08);
    --nztm-shadow-button: 0 10px 22px rgba(28, 46, 64, 0.07);
    --nztm-focus-ring: 0 0 0 4px rgba(71, 216, 245, 0.14);

    --nztm-radius-xl: 28px;
    --nztm-radius-lg: 22px;
    --nztm-radius-md: 16px;
    --nztm-radius-pill: 999px;
}

html.nztm-dark,
body.nztm-dark {
    color-scheme: dark;

    --nztm-bg: #052b3b;
    --nztm-bg-soft: #031d2a;
    --nztm-bg-page: linear-gradient(180deg, #052b3b 0%, #052b3b 46%, #031d2a 100%);

    --nztm-surface: #092f42;
    --nztm-surface-soft: #061f2d;
    --nztm-surface-strong: #0b3a4f;

    --nztm-text: #f4fbff;
    --nztm-text-strong: #ffffff;
    --nztm-muted: rgba(244, 251, 255, 0.66);
    --nztm-muted-2: rgba(244, 251, 255, 0.48);
    --nztm-placeholder: rgba(244, 251, 255, 0.38);

    --nztm-border: rgba(255, 255, 255, 0.08);
    --nztm-border-soft: rgba(255, 255, 255, 0.055);
    --nztm-border-strong: rgba(255, 255, 255, 0.12);

    --nztm-cyan-soft: rgba(143, 232, 255, 0.10);
    --nztm-blue-soft: rgba(37, 156, 255, 0.10);
    --nztm-violet-soft: rgba(108, 107, 245, 0.11);

    --nztm-gradient-main: linear-gradient(135deg, #8fe8ff 0%, #47d8f5 34%, #259cff 72%, #6c6bf5 100%);
    --nztm-gradient-soft:
        radial-gradient(circle at 0% 0%, rgba(143, 232, 255, 0.08), transparent 36%),
        radial-gradient(circle at 100% 0%, rgba(108, 107, 245, 0.09), transparent 34%),
        #092f42;

    --nztm-shadow-card: 0 22px 55px rgba(0, 0, 0, 0.24);
    --nztm-shadow-soft: 0 14px 32px rgba(0, 0, 0, 0.18);
    --nztm-shadow-button: 0 10px 22px rgba(0, 0, 0, 0.14);
    --nztm-focus-ring: 0 0 0 4px rgba(143, 232, 255, 0.12);
}

/* ============================================================
   02. BASE GENERAL
   ============================================================ */

html,
body {
    min-height: 100%;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    background:
        radial-gradient(circle at 14% 0%, rgba(71, 216, 245, 0.09), transparent 30%),
        radial-gradient(circle at 92% 8%, rgba(108, 107, 245, 0.07), transparent 28%),
        var(--nztm-bg-page) !important;
    color: var(--nztm-text) !important;
}

html.nztm-dark,
html.nztm-dark body,
body.nztm-dark {
    background:
        radial-gradient(circle at 14% 0%, rgba(71, 216, 245, 0.13), transparent 30%),
        radial-gradient(circle at 92% 8%, rgba(108, 107, 245, 0.11), transparent 28%),
        var(--nztm-bg-page) !important;
    color: var(--nztm-text) !important;
}

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

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

button,
input,
select,
textarea {
    font: inherit;
}

.nzt-page,
.nzt-page-shell,
.nzt-main,
.nzt-content {
    color: var(--nztm-text) !important;
}

/* ============================================================
   03. HERO / CABECERAS
   ============================================================ */

.nzt-hero,
.nzt-ingresos-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--nztm-border) !important;
    background: var(--nztm-gradient-soft) !important;
    box-shadow: var(--nztm-shadow-card) !important;
}

.nzt-hero::before,
.nzt-ingresos-hero::before {
    content: "";
    position: absolute;
    inset: -80px -110px auto auto;
    width: 240px;
    height: 240px;
    border-radius: var(--nztm-radius-pill);
    pointer-events: none;
    background: radial-gradient(circle, rgba(71, 216, 245, 0.10), transparent 66%);
}

html.nztm-dark .nzt-hero::before,
html.nztm-dark .nzt-ingresos-hero::before,
body.nztm-dark .nzt-hero::before,
body.nztm-dark .nzt-ingresos-hero::before {
    background: radial-gradient(circle, rgba(143, 232, 255, 0.10), transparent 66%);
}

.nzt-kicker,
.nzt-eyebrow,
.nzt-panel-kicker {
    color: var(--nztm-teal) !important;
    font-weight: 900 !important;
    letter-spacing: 0.12em;
}

html.nztm-dark .nzt-kicker,
html.nztm-dark .nzt-eyebrow,
html.nztm-dark .nzt-panel-kicker,
body.nztm-dark .nzt-kicker,
body.nztm-dark .nzt-eyebrow,
body.nztm-dark .nzt-panel-kicker {
    color: var(--nztm-cyan-light) !important;
}

.nzt-hero h1,
.nzt-ingresos-hero h1,
.nzt-card-header h2,
.nzt-panel-header h2 {
    color: var(--nztm-text-strong) !important;
    text-shadow: none !important;
}

.nzt-hero p,
.nzt-ingresos-hero p:not(.nzt-eyebrow),
.nzt-card-header p,
.nzt-panel-header p {
    color: var(--nztm-muted) !important;
}

/* ============================================================
   04. CARDS / PANELS / SUMMARY
   ============================================================ */

.nzt-card,
.nzt-panel,
.nzt-summary-card {
    border: 1px solid var(--nztm-border) !important;
    background: var(--nztm-gradient-soft) !important;
    box-shadow: var(--nztm-shadow-card) !important;
}

.nzt-card-header,
.nzt-panel-header {
    border-bottom: 1px solid var(--nztm-border) !important;
}

.nzt-summary-card span {
    color: var(--nztm-muted) !important;
}

.nzt-summary-card strong,
.nzt-money,
.nzt-income-name,
.nzt-gasto-nombre {
    color: var(--nztm-text-strong) !important;
}

.nzt-summary-grid .nzt-summary-card:first-child {
    border-color: rgba(71, 216, 245, 0.34) !important;
    background:
        radial-gradient(circle at 88% 0%, rgba(255, 255, 255, 0.18), transparent 30%),
        var(--nztm-gradient-main) !important;
    box-shadow:
        0 18px 42px rgba(37, 156, 255, 0.18),
        0 7px 18px rgba(71, 216, 245, 0.12) !important;
}

.nzt-summary-grid .nzt-summary-card:first-child span,
.nzt-summary-grid .nzt-summary-card:first-child strong {
    color: #ffffff !important;
}

html.nztm-dark .nzt-summary-grid .nzt-summary-card:first-child span,
html.nztm-dark .nzt-summary-grid .nzt-summary-card:first-child strong,
body.nztm-dark .nzt-summary-grid .nzt-summary-card:first-child span,
body.nztm-dark .nzt-summary-grid .nzt-summary-card:first-child strong {
    color: #03131b !important;
}

/* ============================================================
   05. FORMULARIOS NATIVOS
   ============================================================ */

.nzt-field label,
label,
.form-label {
    color: var(--nztm-muted) !important;
}

.nzt-field input,
.nzt-field textarea,
input.nzt-input,
textarea.nzt-textarea,
.nzt-input {
    border: 1px solid var(--nztm-border-strong) !important;
    background: var(--nztm-surface) !important;
    color: var(--nztm-text) !important;
    box-shadow:
        0 8px 18px rgba(28, 46, 64, 0.035),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    outline: none !important;
}

html.nztm-dark .nzt-field input,
html.nztm-dark .nzt-field textarea,
html.nztm-dark input.nzt-input,
html.nztm-dark textarea.nzt-textarea,
html.nztm-dark .nzt-input,
body.nztm-dark .nzt-field input,
body.nztm-dark .nzt-field textarea,
body.nztm-dark input.nzt-input,
body.nztm-dark textarea.nzt-textarea,
body.nztm-dark .nzt-input {
    box-shadow:
        0 8px 18px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.nzt-field input::placeholder,
.nzt-field textarea::placeholder,
input.nzt-input::placeholder,
textarea.nzt-textarea::placeholder {
    color: var(--nztm-placeholder) !important;
}

.nzt-field input:focus,
.nzt-field textarea:focus,
input.nzt-input:focus,
textarea.nzt-textarea:focus,
.nzt-input:focus {
    border-color: rgba(71, 216, 245, 0.70) !important;
    box-shadow: var(--nztm-focus-ring), var(--nztm-shadow-button) !important;
}

/* Select nativo: respaldo visual si controls.js no carga */
.nzt-field select,
select.nzt-select,
select.form-select,
select[data-nzt-searchable],
select.nzt-control {
    min-height: 46px !important;
    border: 1px solid var(--nztm-border-strong) !important;
    border-radius: 15px !important;
    padding: 0 15px !important;
    background: var(--nztm-surface) !important;
    color: var(--nztm-text) !important;
    font-weight: 780 !important;
    outline: none !important;
    box-shadow:
        0 8px 18px rgba(28, 46, 64, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.nzt-field select:focus,
select.nzt-select:focus,
select.form-select:focus,
select[data-nzt-searchable]:focus,
select.nzt-control:focus {
    border-color: rgba(71, 216, 245, 0.70) !important;
    box-shadow: var(--nztm-focus-ring), var(--nztm-shadow-button) !important;
}

html.nztm-dark input[type="date"],
body.nztm-dark input[type="date"] {
    color-scheme: dark !important;
}

html:not(.nztm-dark) input[type="date"],
body:not(.nztm-dark) input[type="date"] {
    color-scheme: light !important;
}

/* Switches */
.nzt-switch-row,
.nzt-switch-line {
    color: var(--nztm-muted) !important;
}

.nzt-switch-row strong,
.nzt-switch-line strong {
    color: var(--nztm-text-strong) !important;
}

.nzt-switch-row span,
.nzt-switch-line span {
    border-color: var(--nztm-border-strong) !important;
    background: var(--nztm-surface-strong) !important;
}

.nzt-switch-row span::after,
.nzt-switch-line span::after {
    background: var(--nztm-surface) !important;
    box-shadow: var(--nztm-shadow-button);
}

.nzt-switch-row input:checked + span,
.nzt-switch-line input:checked + span {
    border-color: rgba(71, 216, 245, 0.70) !important;
    background: var(--nztm-cyan-soft) !important;
}

.nzt-switch-row input:checked + span::after,
.nzt-switch-line input:checked + span::after {
    background: var(--nztm-cyan) !important;
}

/* ============================================================
   06. CUSTOM SELECT GLOBAL / CONTROLS.JS
   ============================================================ */

.nzt-custom-select {
    position: relative !important;
    width: 100% !important;
}

.nzt-custom-select > select {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    pointer-events: none !important;
    z-index: -1 !important;
}

.nzt-custom-select-trigger {
    width: 100% !important;
    min-height: 46px !important;
    border-radius: 15px !important;
    border: 1px solid var(--nztm-border-strong) !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 0 15px !important;
    text-align: left !important;
    cursor: pointer !important;
    color: var(--nztm-text) !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(71, 216, 245, 0.07), transparent 34%),
        linear-gradient(180deg, var(--nztm-surface) 0%, var(--nztm-surface-soft) 100%) !important;
    box-shadow:
        0 8px 18px rgba(28, 46, 64, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    font: inherit !important;
    transition:
        border-color 0.16s ease,
        box-shadow 0.16s ease,
        background 0.16s ease,
        transform 0.16s ease,
        color 0.16s ease !important;
}

.nzt-custom-select-trigger:hover {
    border-color: rgba(71, 216, 245, 0.48) !important;
    color: var(--nztm-teal-strong) !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(71, 216, 245, 0.10), transparent 34%),
        linear-gradient(180deg, var(--nztm-surface) 0%, var(--nztm-surface-soft) 100%) !important;
}

.nzt-custom-select.is-open .nzt-custom-select-trigger,
.nzt-custom-select-trigger:focus-visible {
    outline: none !important;
    border-color: rgba(71, 216, 245, 0.74) !important;
    box-shadow: var(--nztm-focus-ring), var(--nztm-shadow-button) !important;
}

.nzt-custom-select-value {
    min-width: 0 !important;
    display: block !important;
    overflow: hidden !important;
    color: inherit !important;
    font-size: 0.92rem !important;
    line-height: 1.1 !important;
    font-weight: 780 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

.nzt-custom-select-arrow {
    color: var(--nztm-teal-strong) !important;
    font-size: 0.90rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    transition: transform 0.16s ease !important;
}

.nzt-custom-select.is-open .nzt-custom-select-arrow {
    transform: rotate(180deg) !important;
}

.nzt-custom-select-menu {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: calc(100% + 8px) !important;
    z-index: 999 !important;
    max-height: 292px !important;
    overflow-y: auto !important;
    display: none !important;
    padding: 8px !important;
    border-radius: 17px !important;
    border: 1px solid var(--nztm-border) !important;
    background: color-mix(in srgb, var(--nztm-surface) 98%, transparent) !important;
    box-shadow:
        0 18px 44px rgba(28, 46, 64, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
}

.nzt-custom-select.is-open .nzt-custom-select-menu {
    display: block !important;
}

.nzt-custom-select.is-open-up .nzt-custom-select-menu {
    top: auto !important;
    bottom: calc(100% + 8px) !important;
}

.nzt-custom-select-options {
    display: grid !important;
    gap: 3px !important;
}

.nzt-custom-select-option,
.nzt-custom-select-empty {
    min-height: 38px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 9px 10px !important;
    color: var(--nztm-text) !important;
    font-size: 0.86rem !important;
    line-height: 1.15 !important;
    font-weight: 720 !important;
}

.nzt-custom-select-option {
    cursor: pointer !important;
}

.nzt-custom-select-option:hover {
    background: var(--nztm-cyan-soft) !important;
    color: var(--nztm-teal-strong) !important;
}

.nzt-custom-select-option.is-selected {
    background: var(--nztm-cyan-soft) !important;
    color: var(--nztm-teal-strong) !important;
    font-weight: 880 !important;
}

.nzt-custom-select-option.is-disabled {
    opacity: 0.42 !important;
    cursor: not-allowed !important;
}

.nzt-custom-select-check {
    margin-left: auto !important;
    color: var(--nztm-teal-strong) !important;
    font-weight: 950 !important;
}

.nzt-custom-select-empty {
    justify-content: center !important;
    color: var(--nztm-muted) !important;
}

.nzt-custom-select-search-wrap {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    padding-bottom: 8px !important;
    background: inherit !important;
}

.nzt-custom-select-search {
    width: 100% !important;
    min-height: 40px !important;
    border-radius: 12px !important;
    border: 1px solid var(--nztm-border-strong) !important;
    padding: 0 12px !important;
    color: var(--nztm-text) !important;
    background: var(--nztm-surface) !important;
    font-size: 0.84rem !important;
    font-weight: 720 !important;
}

.nzt-custom-select-search:focus {
    outline: none !important;
    border-color: rgba(71, 216, 245, 0.70) !important;
    box-shadow: 0 0 0 3px rgba(71, 216, 245, 0.12) !important;
}

.nzt-custom-select.is-disabled {
    opacity: 0.58 !important;
}

.nzt-custom-select.is-disabled .nzt-custom-select-trigger {
    cursor: not-allowed !important;
}

html.nztm-dark .nzt-custom-select-trigger,
body.nztm-dark .nzt-custom-select-trigger {
    background:
        radial-gradient(circle at 0% 0%, rgba(143, 232, 255, 0.08), transparent 34%),
        linear-gradient(180deg, #082c40 0%, #061f2d 100%) !important;
    box-shadow:
        0 8px 18px rgba(0, 0, 0, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

html.nztm-dark .nzt-custom-select-trigger:hover,
body.nztm-dark .nzt-custom-select-trigger:hover {
    color: var(--nztm-cyan-light) !important;
    background:
        radial-gradient(circle at 0% 0%, rgba(143, 232, 255, 0.10), transparent 34%),
        linear-gradient(180deg, #0a354b 0%, #062536 100%) !important;
}

html.nztm-dark .nzt-custom-select.is-open .nzt-custom-select-trigger,
html.nztm-dark .nzt-custom-select-trigger:focus-visible,
body.nztm-dark .nzt-custom-select.is-open .nzt-custom-select-trigger,
body.nztm-dark .nzt-custom-select-trigger:focus-visible {
    border-color: rgba(143, 232, 255, 0.64) !important;
    box-shadow: var(--nztm-focus-ring), var(--nztm-shadow-button) !important;
}

html.nztm-dark .nzt-custom-select-arrow,
body.nztm-dark .nzt-custom-select-arrow,
html.nztm-dark .nzt-custom-select-check,
body.nztm-dark .nzt-custom-select-check {
    color: var(--nztm-cyan-light) !important;
}

html.nztm-dark .nzt-custom-select-menu,
body.nztm-dark .nzt-custom-select-menu {
    border-color: rgba(143, 232, 255, 0.14) !important;
    background: rgba(6, 31, 45, 0.98) !important;
    box-shadow:
        0 18px 44px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

html.nztm-dark .nzt-custom-select-option:hover,
body.nztm-dark .nzt-custom-select-option:hover,
html.nztm-dark .nzt-custom-select-option.is-selected,
body.nztm-dark .nzt-custom-select-option.is-selected {
    color: var(--nztm-cyan-light) !important;
}

/* ============================================================
   07. BOTONES
   ============================================================ */

.nzt-btn,
.nzt-soft-button,
.nzt-primary-action,
.nzt-save-button,
.nzt-page-button,
.nzt-tab,
.nzt-gastos-tuto-trigger,
.nzt-ingresos-tuto-trigger {
    transition:
        transform 0.16s ease,
        box-shadow 0.16s ease,
        border-color 0.16s ease,
        background 0.16s ease,
        color 0.16s ease,
        filter 0.16s ease;
}

.nzt-btn,
.nzt-soft-button {
    border: 1px solid var(--nztm-border-strong) !important;
    background: var(--nztm-surface) !important;
    color: var(--nztm-text) !important;
    box-shadow: var(--nztm-shadow-button) !important;
}

.nzt-btn:hover,
.nzt-soft-button:hover {
    border-color: rgba(71, 216, 245, 0.45) !important;
    color: var(--nztm-teal) !important;
    background: var(--nztm-surface-soft) !important;
    transform: translateY(-1px);
}

html.nztm-dark .nzt-btn:hover,
html.nztm-dark .nzt-soft-button:hover,
body.nztm-dark .nzt-btn:hover,
body.nztm-dark .nzt-soft-button:hover {
    color: var(--nztm-cyan-light) !important;
    background: var(--nztm-cyan-soft) !important;
}

.nzt-btn:active,
.nzt-soft-button:active,
.nzt-primary-action:active,
.nzt-save-button:active,
.nzt-page-button:active,
.nzt-tab:active {
    transform: translateY(1px) scale(0.98);
}

.nzt-btn-primary,
.nzt-save-button,
.nzt-primary-action,
.nzt-btn-success {
    border-color: rgba(71, 216, 245, 0.46) !important;
    background: var(--nztm-gradient-main) !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    box-shadow:
        0 14px 30px rgba(37, 156, 255, 0.20),
        0 7px 16px rgba(71, 216, 245, 0.14) !important;
}

html.nztm-dark .nzt-btn-primary,
html.nztm-dark .nzt-save-button,
html.nztm-dark .nzt-primary-action,
html.nztm-dark .nzt-btn-success,
body.nztm-dark .nzt-btn-primary,
body.nztm-dark .nzt-save-button,
body.nztm-dark .nzt-primary-action,
body.nztm-dark .nzt-btn-success {
    color: #03131b !important;
}

.nzt-btn-primary:hover,
.nzt-save-button:hover,
.nzt-primary-action:hover,
.nzt-btn-success:hover {
    color: #ffffff !important;
    filter: brightness(1.04) saturate(1.04);
}

html.nztm-dark .nzt-btn-primary:hover,
html.nztm-dark .nzt-save-button:hover,
html.nztm-dark .nzt-primary-action:hover,
html.nztm-dark .nzt-btn-success:hover,
body.nztm-dark .nzt-btn-primary:hover,
body.nztm-dark .nzt-save-button:hover,
body.nztm-dark .nzt-primary-action:hover,
body.nztm-dark .nzt-btn-success:hover {
    color: #03131b !important;
}

.nzt-btn-gasto,
.nzt-btn-expense,
.nzt-expense-action,
[data-nzt-action="gasto"] {
    border-color: rgba(255, 107, 107, 0.42) !important;
    background: var(--nztm-gradient-coral) !important;
    color: #ffffff !important;
    box-shadow:
        0 14px 30px rgba(239, 68, 68, 0.16),
        0 7px 16px rgba(255, 107, 107, 0.12) !important;
}

.nzt-btn-pdf {
    border: 1px solid rgba(71, 216, 245, 0.48) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 252, 255, 0.86)) !important;
    color: var(--nztm-teal-strong) !important;
    font-weight: 850 !important;
    box-shadow:
        0 10px 22px rgba(28, 46, 64, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.90) !important;
}

.nzt-btn-pdf:hover,
.nzt-btn-pdf:active,
.nzt-btn-pdf:focus-visible {
    border-color: rgba(71, 216, 245, 0.72) !important;
    background:
        linear-gradient(135deg, rgba(71, 216, 245, 0.16), rgba(37, 156, 255, 0.10)) !important;
    color: #0f8094 !important;
    box-shadow:
        0 0 0 4px rgba(71, 216, 245, 0.10),
        0 12px 24px rgba(28, 46, 64, 0.08) !important;
}

html.nztm-dark .nzt-btn-pdf,
body.nztm-dark .nzt-btn-pdf {
    border-color: rgba(143, 232, 255, 0.34) !important;
    background:
        linear-gradient(180deg, rgba(143, 232, 255, 0.08), rgba(255, 255, 255, 0.035)) !important;
    color: var(--nztm-cyan-light) !important;
    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

html.nztm-dark .nzt-btn-pdf:hover,
html.nztm-dark .nzt-btn-pdf:active,
body.nztm-dark .nzt-btn-pdf:hover,
body.nztm-dark .nzt-btn-pdf:active {
    border-color: rgba(143, 232, 255, 0.54) !important;
    background: rgba(143, 232, 255, 0.10) !important;
    color: var(--nztm-cyan-light) !important;
    box-shadow:
        0 0 0 4px rgba(143, 232, 255, 0.08),
        0 12px 24px rgba(0, 0, 0, 0.18) !important;
}

.nzt-btn-danger,
.nzt-delete-button,
button[data-nzt-danger="true"] {
    color: #ffffff !important;
    border-color: rgba(239, 68, 68, 0.45) !important;
    background: linear-gradient(135deg, #ef4444, #b91c1c) !important;
    box-shadow: 0 12px 26px rgba(239, 68, 68, 0.18) !important;
}

button[id*="buscar" i],
button[id*="filtrar" i],
button[id*="aplicar" i],
a[id*="buscar" i],
a[id*="filtrar" i],
a[id*="aplicar" i],
button[class*="buscar" i],
button[class*="filtrar" i],
button[class*="aplicar" i],
a[class*="buscar" i],
a[class*="filtrar" i],
a[class*="aplicar" i] {
    border-color: rgba(71, 216, 245, 0.48) !important;
}

button[id*="buscar" i]:hover,
button[id*="buscar" i]:active,
button[id*="filtrar" i]:hover,
button[id*="filtrar" i]:active,
button[id*="aplicar" i]:hover,
button[id*="aplicar" i]:active,
a[id*="buscar" i]:hover,
a[id*="filtrar" i]:hover,
a[id*="aplicar" i]:hover,
button[class*="buscar" i]:hover,
button[class*="filtrar" i]:hover,
button[class*="aplicar" i]:hover,
a[class*="buscar" i]:hover,
a[class*="filtrar" i]:hover,
a[class*="aplicar" i]:hover {
    border-color: rgba(71, 216, 245, 0.72) !important;
    background:
        linear-gradient(135deg, rgba(71, 216, 245, 0.16), rgba(37, 156, 255, 0.10)) !important;
    color: #0f8094 !important;
    box-shadow:
        0 0 0 4px rgba(71, 216, 245, 0.10),
        0 12px 24px rgba(28, 46, 64, 0.08) !important;
}

/* Tutorial */
.nzt-gastos-tuto-trigger,
.nzt-ingresos-tuto-trigger,
.nzt-ad-gastos-tuto-trigger,
button.nzt-gastos-tuto-trigger,
button.nzt-ingresos-tuto-trigger,
button.nzt-ad-gastos-tuto-trigger {
    min-height: 42px !important;
    border-radius: var(--nztm-radius-pill) !important;
    border: 1px solid rgba(71, 216, 245, 0.44) !important;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.82), transparent 38%),
        rgba(71, 216, 245, 0.15) !important;
    color: #075e6d !important;
    font-weight: 950 !important;
    text-shadow: none !important;
    box-shadow:
        0 10px 22px rgba(28, 46, 64, 0.075),
        0 0 0 4px rgba(71, 216, 245, 0.065),
        inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

.nzt-gastos-tuto-trigger i,
.nzt-ingresos-tuto-trigger i,
.nzt-ad-gastos-tuto-trigger i,
button.nzt-gastos-tuto-trigger i,
button.nzt-ingresos-tuto-trigger i,
button.nzt-ad-gastos-tuto-trigger i {
    color: #075e6d !important;
    opacity: 1 !important;
}

.nzt-gastos-tuto-trigger span,
.nzt-ingresos-tuto-trigger span,
.nzt-ad-gastos-tuto-trigger span,
button.nzt-gastos-tuto-trigger span,
button.nzt-ingresos-tuto-trigger span,
button.nzt-ad-gastos-tuto-trigger span {
    color: #075e6d !important;
    opacity: 1 !important;
    font-weight: 950 !important;
}

.nzt-gastos-tuto-trigger:hover,
.nzt-ingresos-tuto-trigger:hover,
.nzt-ad-gastos-tuto-trigger:hover,
.nzt-gastos-tuto-trigger:active,
.nzt-ingresos-tuto-trigger:active,
.nzt-ad-gastos-tuto-trigger:active,
button.nzt-gastos-tuto-trigger:hover,
button.nzt-ingresos-tuto-trigger:hover,
button.nzt-ad-gastos-tuto-trigger:hover,
button.nzt-gastos-tuto-trigger:active,
button.nzt-ingresos-tuto-trigger:active,
button.nzt-ad-gastos-tuto-trigger:active {
    border-color: rgba(71, 216, 245, 0.68) !important;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.88), transparent 38%),
        rgba(71, 216, 245, 0.22) !important;
    color: #034f5d !important;
    transform: translateY(-1px);
}

.nzt-gastos-tuto-trigger:hover i,
.nzt-ingresos-tuto-trigger:hover i,
.nzt-ad-gastos-tuto-trigger:hover i,
.nzt-gastos-tuto-trigger:active i,
.nzt-ingresos-tuto-trigger:active i,
.nzt-ad-gastos-tuto-trigger:active i,
.nzt-gastos-tuto-trigger:hover span,
.nzt-ingresos-tuto-trigger:hover span,
.nzt-ad-gastos-tuto-trigger:hover span,
.nzt-gastos-tuto-trigger:active span,
.nzt-ingresos-tuto-trigger:active span,
.nzt-ad-gastos-tuto-trigger:active span,
button.nzt-gastos-tuto-trigger:hover i,
button.nzt-ingresos-tuto-trigger:hover i,
button.nzt-ad-gastos-tuto-trigger:hover i,
button.nzt-gastos-tuto-trigger:active i,
button.nzt-ingresos-tuto-trigger:active i,
button.nzt-ad-gastos-tuto-trigger:active i,
button.nzt-gastos-tuto-trigger:hover span,
button.nzt-ingresos-tuto-trigger:hover span,
button.nzt-ad-gastos-tuto-trigger:hover span,
button.nzt-gastos-tuto-trigger:active span,
button.nzt-ingresos-tuto-trigger:active span,
button.nzt-ad-gastos-tuto-trigger:active span {
    color: #034f5d !important;
}

/* Tutorial dark */
html.nztm-dark .nzt-gastos-tuto-trigger,
html.nztm-dark .nzt-ingresos-tuto-trigger,
html.nztm-dark .nzt-ad-gastos-tuto-trigger,
body.nztm-dark .nzt-gastos-tuto-trigger,
body.nztm-dark .nzt-ingresos-tuto-trigger,
body.nztm-dark .nzt-ad-gastos-tuto-trigger {
    border-color: rgba(143, 232, 255, 0.28) !important;
    background:
        radial-gradient(circle at 30% 20%, rgba(143, 232, 255, 0.18), transparent 38%),
        rgba(143, 232, 255, 0.09) !important;
    color: var(--nztm-cyan-light) !important;
    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.16),
        0 0 0 4px rgba(143, 232, 255, 0.045),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
}

html.nztm-dark .nzt-gastos-tuto-trigger i,
html.nztm-dark .nzt-ingresos-tuto-trigger i,
html.nztm-dark .nzt-ad-gastos-tuto-trigger i,
html.nztm-dark .nzt-gastos-tuto-trigger span,
html.nztm-dark .nzt-ingresos-tuto-trigger span,
html.nztm-dark .nzt-ad-gastos-tuto-trigger span,
body.nztm-dark .nzt-gastos-tuto-trigger i,
body.nztm-dark .nzt-ingresos-tuto-trigger i,
body.nztm-dark .nzt-ad-gastos-tuto-trigger i,
body.nztm-dark .nzt-gastos-tuto-trigger span,
body.nztm-dark .nzt-ingresos-tuto-trigger span,
body.nztm-dark .nzt-ad-gastos-tuto-trigger span {
    color: var(--nztm-cyan-light) !important;
    opacity: 1 !important;
}

html.nztm-dark .nzt-gastos-tuto-trigger:hover,
html.nztm-dark .nzt-ingresos-tuto-trigger:hover,
html.nztm-dark .nzt-ad-gastos-tuto-trigger:hover,
html.nztm-dark .nzt-gastos-tuto-trigger:active,
html.nztm-dark .nzt-ingresos-tuto-trigger:active,
html.nztm-dark .nzt-ad-gastos-tuto-trigger:active,
body.nztm-dark .nzt-gastos-tuto-trigger:hover,
body.nztm-dark .nzt-ingresos-tuto-trigger:hover,
body.nztm-dark .nzt-ad-gastos-tuto-trigger:hover,
body.nztm-dark .nzt-gastos-tuto-trigger:active,
body.nztm-dark .nzt-ingresos-tuto-trigger:active,
body.nztm-dark .nzt-ad-gastos-tuto-trigger:active {
    border-color: rgba(143, 232, 255, 0.48) !important;
    background:
        radial-gradient(circle at 30% 20%, rgba(143, 232, 255, 0.22), transparent 38%),
        rgba(143, 232, 255, 0.13) !important;
    color: #bff6ff !important;
}

/* ============================================================
   08. TABS / BADGES / PILLS
   ============================================================ */

.nzt-tab {
    border: 1px solid var(--nztm-border-strong) !important;
    background: var(--nztm-surface) !important;
    color: var(--nztm-muted) !important;
    box-shadow: 0 8px 18px rgba(28, 46, 64, 0.045);
}

.nzt-tab i {
    color: var(--nztm-teal) !important;
}

html.nztm-dark .nzt-tab i,
body.nztm-dark .nzt-tab i {
    color: var(--nztm-cyan-light) !important;
}

.nzt-tab.active {
    border-color: rgba(71, 216, 245, 0.48) !important;
    background: var(--nztm-cyan-soft) !important;
    color: var(--nztm-text-strong) !important;
    box-shadow: var(--nztm-focus-ring) !important;
}

.nzt-badge,
.nzt-list-badge,
.nzt-pill,
.nzt-badge-fijo,
.nzt-badge-variable {
    border: 1px solid var(--nztm-border) !important;
    background: var(--nztm-surface-strong) !important;
    color: var(--nztm-muted) !important;
}

.nzt-pill-debito,
.nzt-badge-transferencia {
    border-color: rgba(71, 216, 245, 0.24) !important;
    background: var(--nztm-cyan-soft) !important;
    color: var(--nztm-teal-strong) !important;
}

html.nztm-dark .nzt-pill-debito,
html.nztm-dark .nzt-badge-transferencia,
body.nztm-dark .nzt-pill-debito,
body.nztm-dark .nzt-badge-transferencia {
    color: var(--nztm-cyan-light) !important;
}

.nzt-pill-efectivo,
.nzt-badge-efectivo,
.nzt-pill-success,
.nzt-badge-success {
    border-color: rgba(34, 197, 94, 0.24) !important;
    background: var(--nztm-green-soft) !important;
    color: #15803d !important;
}

html.nztm-dark .nzt-pill-efectivo,
html.nztm-dark .nzt-badge-efectivo,
html.nztm-dark .nzt-pill-success,
html.nztm-dark .nzt-badge-success,
body.nztm-dark .nzt-pill-efectivo,
body.nztm-dark .nzt-badge-efectivo,
body.nztm-dark .nzt-pill-success,
body.nztm-dark .nzt-badge-success {
    color: #bbf7d0 !important;
}

.nzt-pill-tarjeta,
.nzt-badge-gifcard,
.nzt-pill-card {
    border-color: rgba(108, 107, 245, 0.24) !important;
    background: var(--nztm-violet-soft) !important;
    color: #4f46e5 !important;
}

html.nztm-dark .nzt-pill-tarjeta,
html.nztm-dark .nzt-badge-gifcard,
html.nztm-dark .nzt-pill-card,
body.nztm-dark .nzt-pill-tarjeta,
body.nztm-dark .nzt-badge-gifcard,
body.nztm-dark .nzt-pill-card {
    color: #c4b5fd !important;
}

.nzt-pill-warning,
.nzt-badge-warning {
    border-color: rgba(245, 158, 11, 0.25) !important;
    background: var(--nztm-yellow-soft) !important;
    color: #a16207 !important;
}

html.nztm-dark .nzt-pill-warning,
html.nztm-dark .nzt-badge-warning,
body.nztm-dark .nzt-pill-warning,
body.nztm-dark .nzt-badge-warning {
    color: #fde68a !important;
}

.nzt-pill-danger,
.nzt-badge-danger {
    border-color: rgba(239, 68, 68, 0.25) !important;
    background: var(--nztm-red-soft) !important;
    color: #b91c1c !important;
}

html.nztm-dark .nzt-pill-danger,
html.nztm-dark .nzt-badge-danger,
body.nztm-dark .nzt-pill-danger,
body.nztm-dark .nzt-badge-danger {
    color: #fecdd3 !important;
}

/* ============================================================
   09. TABLAS
   ============================================================ */

.nzt-table-wrap,
.nzt-table-shell {
    border-color: var(--nztm-border) !important;
    background: var(--nztm-surface) !important;
    box-shadow: var(--nztm-shadow-soft) !important;
}

.nzt-table {
    color: var(--nztm-text) !important;
}

.nzt-table thead th,
.nzt-table th {
    background: var(--nztm-surface-strong) !important;
    color: var(--nztm-muted) !important;
    border-bottom: 1px solid var(--nztm-border) !important;
}

.nzt-table tbody td,
.nzt-table td {
    background: var(--nztm-surface) !important;
    color: var(--nztm-text) !important;
    border-bottom: 1px solid var(--nztm-border-soft) !important;
}

.nzt-table tbody tr:nth-child(even) td {
    background: var(--nztm-surface-soft) !important;
}

html.nztm-dark .nzt-table tbody tr:nth-child(even) td,
body.nztm-dark .nzt-table tbody tr:nth-child(even) td {
    background: var(--nztm-surface-strong) !important;
}

.nzt-table tbody tr:hover td {
    background: rgba(71, 216, 245, 0.045) !important;
}

html.nztm-dark .nzt-table tbody tr:hover td,
body.nztm-dark .nzt-table tbody tr:hover td {
    background: rgba(143, 232, 255, 0.06) !important;
}

/* ============================================================
   10. PAGINADORES / EMPTY STATES
   ============================================================ */

.nzt-pagination,
.nzt-paginator {
    border-top-color: var(--nztm-border) !important;
    color: var(--nztm-muted) !important;
}

.nzt-page-button {
    border-color: var(--nztm-border-strong) !important;
    background: var(--nztm-surface) !important;
    color: var(--nztm-text) !important;
}

.nzt-page-button:hover {
    border-color: rgba(71, 216, 245, 0.45) !important;
    color: var(--nztm-teal) !important;
}

html.nztm-dark .nzt-page-button:hover,
body.nztm-dark .nzt-page-button:hover {
    color: var(--nztm-cyan-light) !important;
}

.nzt-page-button.active {
    border-color: rgba(71, 216, 245, 0.45) !important;
    background: var(--nztm-gradient-main) !important;
    color: #ffffff !important;
}

html.nztm-dark .nzt-page-button.active,
body.nztm-dark .nzt-page-button.active {
    color: #03131b !important;
}

.nzt-empty,
.nzt-empty-state {
    color: var(--nztm-muted) !important;
}

.nzt-empty i,
.nzt-empty-state i {
    color: var(--nztm-teal) !important;
}

html.nztm-dark .nzt-empty i,
html.nztm-dark .nzt-empty-state i,
body.nztm-dark .nzt-empty i,
body.nztm-dark .nzt-empty-state i {
    color: var(--nztm-cyan-light) !important;
}

/* ============================================================
   11. MENSAJES / VALIDACIONES
   ============================================================ */

.nzt-error-bloque,
.nzt-error,
.validation-error {
    border-color: rgba(239, 68, 68, 0.25) !important;
    background: var(--nztm-red-soft) !important;
    color: #b91c1c !important;
}

html.nztm-dark .nzt-error-bloque,
html.nztm-dark .nzt-error,
html.nztm-dark .validation-error,
body.nztm-dark .nzt-error-bloque,
body.nztm-dark .nzt-error,
body.nztm-dark .validation-error {
    color: #fecdd3 !important;
}

.nzt-success,
.nzt-save-success,
.save-feedback-success {
    border-color: rgba(34, 197, 94, 0.24) !important;
    background: var(--nztm-green-soft) !important;
    color: #15803d !important;
}

html.nztm-dark .nzt-success,
html.nztm-dark .nzt-save-success,
html.nztm-dark .save-feedback-success,
body.nztm-dark .nzt-success,
body.nztm-dark .nzt-save-success,
body.nztm-dark .save-feedback-success {
    color: #bbf7d0 !important;
}

/* ============================================================
   12. MOBILE TABLE CARDS
   ============================================================ */

@media (max-width: 760px) {
    .nzt-table tbody tr {
        border-color: var(--nztm-border) !important;
        background: var(--nztm-surface) !important;
        box-shadow: var(--nztm-shadow-soft) !important;
    }

    .nzt-table td::before {
        color: var(--nztm-muted) !important;
    }
}

/* ============================================================
   13. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}