input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {

    -webkit-box-shadow: 0 0 0px 1000px #343a40 inset !important;

    -webkit-text-fill-color: #fff !important;

    border: 1px solid #495057 !important;

    transition: background-color 5000s ease-in-out 0s;

}

css
/* =========================
   GLEZSYSTEM UI
========================= */

body{

    color:#fff;

    font-family:
    'Segoe UI',
    sans-serif;

}

/* =========================
   PANEL GENERAL
========================= */

.content-wrapper{

    background:#05050a !important;

    position:relative;

    overflow:hidden;

}

/* GLOW SUAVE */

.content-wrapper::before{

    content:"";

    position:absolute;

    top:-250px;

    left:50%;

    transform:translateX(-50%);

    width:900px;

    height:500px;

    background:
    radial-gradient(
        circle,
        rgba(124,58,237,.18) 0%,
        rgba(124,58,237,.08) 35%,
        transparent 70%
    );

    pointer-events:none;

    z-index:0;

}

/* CONTENIDO ENCIMA */

.content-wrapper > *{

    position:relative;

    z-index:1;

}


/* =========================
   SIDEBAR
========================= */

.main-sidebar{

    background:
    linear-gradient(
        180deg,
        #12071f,
        #0b0b0f
    ) !important;

    border-right:
    1px solid #7c3aed;

    box-shadow:
    0 0 20px rgba(124,58,237,.4);

}

/* =========================
   NAVBAR
========================= */

.main-header{

    background:#111827 !important;

    border:none;

    box-shadow:
    0 0 15px rgba(124,58,237,.3);

}

/* =========================
   LOGO
========================= */

.brand-link{

    border-bottom:
    1px solid #7c3aed;

}

/* =========================
   MENÚ
========================= */

.nav-sidebar .nav-link{

    border-radius:10px;

    margin:4px 8px;

    transition:.2s;

}

.nav-sidebar .nav-link:hover{

    background:
    rgba(124,58,237,.2);

    box-shadow:
    0 0 12px rgba(124,58,237,.5);

    transform:
    translateX(3px);

}

.nav-sidebar .nav-link.active{

    background:
    linear-gradient(
        90deg,
        #7c3aed,
        #dc2626
    );

    box-shadow:
    0 0 15px rgba(124,58,237,.6);

}

/* =========================
   CARDS SOLO PANEL
========================= */

.content-wrapper .card{

    background:#111827 !important;

    border:
    1px solid rgba(124,58,237,.3);

    border-radius:18px;

    box-shadow:
    0 0 25px rgba(124,58,237,.15);

}

/* =========================
   SMALL BOXES
========================= */

.small-box{

    border-radius:18px;

    overflow:hidden;

    border:
    1px solid rgba(255,255,255,.08);

    box-shadow:
    0 0 20px rgba(124,58,237,.25);

    transition:.2s;

}

.small-box:hover{

    transform:
    translateY(-6px)
    scale(1.01);

    box-shadow:
    0 0 25px rgba(124,58,237,.5);

}

.small-box .icon{

    color:
    rgba(255,255,255,.15);

}

/* =========================
   BOTONES
========================= */

.btn{

    border-radius:12px;

    font-weight:bold;

    transition:.2s;

}

.btn:hover{

    transform:
    translateY(-2px);

    box-shadow:
    0 0 12px rgba(124,58,237,.5);

}

/* =========================
   TABLAS
========================= */

.table{

    color:#fff;

}

.table thead{

    background:#1f2937;

}

.table-hover tbody tr:hover{

    background:
    rgba(124,58,237,.1);

}

/* =========================
   INPUTS
========================= */

.form-control{

    background:#0f172a;

    border:
    1px solid #374151;

    color:#fff;

    border-radius:10px;

}

.form-control:focus{

    background:#111827;

    border-color:#7c3aed;

    box-shadow:
    0 0 10px rgba(124,58,237,.5);

    color:#fff;

}

/* =========================
   AUTOFILL
========================= */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {

    -webkit-box-shadow:
    0 0 0px 1000px #0f172a inset !important;

    -webkit-text-fill-color:
    #fff !important;

    border:
    1px solid #7c3aed !important;

    transition:
    background-color 5000s ease-in-out 0s;

}

/* =========================
   ALERTAS
========================= */

.alert{

    border:none;

    border-radius:12px;

    font-weight:600;

    box-shadow:
    0 0 15px rgba(255,255,255,.15);

}

/* =========================
   DROPDOWN
========================= */

.dropdown-menu{

    background:#111827;

    border:
    1px solid #7c3aed;

    border-radius:12px;

}

.dropdown-item{

    color:#fff;

}

.dropdown-item:hover{

    background:
    rgba(124,58,237,.2);

    color:#fff;

}

/* =========================
   TITULOS
========================= */

h1,h2,h3,h4{

    font-weight:700;

    letter-spacing:.5px;

}

/* =========================
   SCROLLBAR CYBERPUNK
========================= */

::-webkit-scrollbar{

    width:12px;

}

::-webkit-scrollbar-track{

    background:#05050a;

}

::-webkit-scrollbar-thumb{

    background:
    linear-gradient(
        180deg,
        #7c3aed,
        #dc2626
    );

    border-radius:20px;

    border:2px solid #05050a;

    box-shadow:
    0 0 10px rgba(124,58,237,.7);

}

::-webkit-scrollbar-thumb:hover{

    background:
    linear-gradient(
        180deg,
        #9333ea,
        #ef4444
    );

}

/* =========================
   LOGIN PREMIUM
========================= */

.login-page{
    display:flex !important;
    justify-content:center;
    align-items:center;
    min-height:100vh;

    background:
    radial-gradient(at 20% 20%, rgba(124,58,237,.18) 0px, transparent 40%),
    radial-gradient(at 80% 0%, rgba(59,130,246,.12) 0px, transparent 40%),
    radial-gradient(at 80% 80%, rgba(236,72,153,.08) 0px, transparent 40%),
    #05050a !important;
}
.login-logo{

    margin-bottom:20px;

}

.login-box{

    width:400px;
    color:#d1d5db !important;

}

/* CARD LOGIN */

.login-page .card{

    
    background:#111827 !important;


    backdrop-filter:
    blur(12px);

    border:
    1px solid rgba(124,58,237,.4);

    border-radius:18px;

    box-shadow:
    0 0 30px rgba(124,58,237,.25);

}

/* TITULO LOGIN */

.login-logo a{

    color:#fff !important;
   

    font-weight:800;

    text-shadow:
    0 0 15px rgba(124,58,237,.7);

}

/* INPUTS LOGIN */

.login-card-body .form-control{

    background:#0f172a !important;

    border:
    1px solid #374151;

    color:#fff !important;

}

/* BOTON LOGIN */

.login-card-body .btn-primary{

    background:
    linear-gradient(
        90deg,
        #7c3aed,
        #dc2626
    );

    border:none;

    font-weight:700;

    box-shadow:
    0 0 15px rgba(124,58,237,.5);

}

/* =========================
   TEMA MORADO
========================= */

.tema-morado{

    --main:#8b5cf6;

    --main-soft:
    rgba(139,92,246,.22);

    --sidebar1:#14071f;

    --sidebar2:#07070c;

    --card:#161122;

    --navbar:#130f1d;

    --border:#8b5cf6;

}

/* =========================
   TEMA VERDE
========================= */

.tema-verde{

    --main:#10b981;
    --main-soft:rgba(16,185,129,.18);

    --sidebar1:#03110b;
    --sidebar2:#05050a;

    --card:#07140f;

    --navbar:#07140f;

    --border:#10b981;

}

/* =========================
   TEMA ROSA
========================= */

.tema-rosa{

    --main:#ec4899;
    --main-soft:rgba(236,72,153,.18);

    --sidebar1:#180514;
    --sidebar2:#05050a;

    --card:#1a0b16;

    --navbar:#1a0b16;

    --border:#ec4899;

}

/* =========================
   TEMA AZUL
========================= */

.tema-azul{

    --main:#3b82f6;
    --main-soft:rgba(59,130,246,.18);

    --sidebar1:#071120;
    --sidebar2:#05050a;

    --card:#0b1420;

    --navbar:#0b1420;

    --border:#3b82f6;

}

/* =========================
   SIDEBAR
========================= */

.main-sidebar{

    background:
    linear-gradient(
        180deg,
        var(--sidebar1),
        var(--sidebar2)
    ) !important;

    border-right:
    1px solid var(--border);

    box-shadow:
    0 0 20px var(--main-soft);

}

/* =========================
   NAVBAR
========================= */

.main-header{

    background:
    var(--navbar) !important;

    box-shadow:
    0 0 15px var(--main-soft);

}

/* =========================
   CARDS
========================= */

.card{

    background:
    var(--card) !important;

    border:
    1px solid var(--main-soft);

    box-shadow:
    0 0 20px var(--main-soft);

}

/* =========================
   BOTONES
========================= */

.btn-primary{

    background:
    var(--main) !important;

    border:none !important;

    box-shadow:
    0 0 12px var(--main-soft);

}

/* =========================
   LINKS ACTIVOS
========================= */

.nav-sidebar .nav-link.active{

    background:
    var(--main) !important;

    box-shadow:
    0 0 15px var(--main-soft);

}

/* =========================
   HOVER MENU
========================= */

.nav-sidebar .nav-link:hover{

    background:
    var(--main-soft);

}

/* =========================
   DROPDOWN
========================= */

.dropdown-menu{

    border:
    1px solid var(--border);

}

/* =========================
   GLOW PANEL
========================= */

.content-wrapper::before{

    background:
    radial-gradient(
        circle,
        var(--main-soft) 0%,
        transparent 70%
    );

}


.card-finanzas{

    background: linear-gradient(
        135deg,
        #7c3aed,
        #3b0764
    ) !important;

    border: 1px solid #a855f7;

    box-shadow:
        0 0 20px rgba(168,85,247,.4);

    border-radius: 15px;

}

.ganancia-total{

    font-size: 3rem;

    font-weight: bold;

    color: #fff;

    text-shadow:
        0 0 10px #c084fc,
        0 0 20px #a855f7;

}

.ganancia-label{

    color:#d8b4fe;

    font-size:1.1rem;

    letter-spacing:1px;

}.table-finanzas{

    color:#fff;

}

.table-finanzas thead{

    background:#7c3aed;

}

.table-finanzas tbody tr{

    transition:.3s;

}

.table-finanzas tbody tr:hover{

    background:
    rgba(124,58,237,.15);

}

.badge-ingreso{

    background:#16a34a;

    color:#fff;

    padding:8px 12px;

    font-size:.9rem;

    border-radius:20px;

    box-shadow:
        0 0 10px rgba(22,163,74,.5);

}

.select2-search__field{

    color:#fff !important;

}

.select2-search__field::placeholder{

    color:#9ca3af !important;

    opacity:1;

}