@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
body{background:#050b08;color:#d8ffe4}.topbar{background:#07120d;border-bottom:1px solid #1f5132;padding:16px 22px}.title-green{color:#20e070;font-weight:700}.card-dark-green,.card-box{background:#0b1610;border:1px solid #1f5132;border-radius:14px;box-shadow:0 0 18px rgba(32,224,112,.08)}.card-box{padding:18px;min-height:100px}.card-box span{display:block;color:#9eddb6;font-size:13px;margin-bottom:8px}.card-box strong{color:#20e070;font-size:28px}.table{--bs-table-bg:#0b1610;--bs-table-color:#d8ffe4;--bs-table-border-color:#1f5132;--bs-table-hover-bg:#102318;--bs-table-hover-color:#fff}.btn-green{background:#20e070;border-color:#20e070;color:#031007;font-weight:600}.btn-green:hover{background:#17b85a;border-color:#17b85a;color:#fff}.btn-outline-green{border-color:#20e070;color:#20e070}.btn-outline-green:hover{background:#20e070;color:#031007}.form-control,.form-select{background-color:#0b1610;border-color:#1f5132;color:#d8ffe4}.form-control:focus,.form-select:focus{background-color:#0b1610;border-color:#20e070;color:#fff;box-shadow:0 0 0 .18rem rgba(32,224,112,.20)}a{color:#20e070}.badge-green{background:#20e070;color:#031007}.nav-buttons a{margin-left:4px;margin-bottom:4px}


/* FORZAR PLACEHOLDER Y TEXTO TOMSELECT */
html body .ts-control,
html body .ts-control input,
html body .ts-control .item,
html body .ts-control .placeholder{
    color:#ffffff !important;
    opacity:1 !important;
}

html body .ts-control input::placeholder,
html body input::placeholder,
html body textarea::placeholder{
    color:#9effc4 !important;
    opacity:1 !important;
}

/* CORREGIR TEXTO GRIS TOMSELECT */
html body .ts-wrapper .ts-control input,
html body .ts-wrapper.single .ts-control input,
html body .ts-wrapper.multi .ts-control input{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    opacity:1 !important;
}

html body .ts-wrapper .ts-control input::placeholder{
    color:#b6ffd1 !important;
    -webkit-text-fill-color:#b6ffd1 !important;
    opacity:1 !important;
}

html body .ts-wrapper .ts-control > input{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

html body .ts-wrapper .ts-control .item{
    color:#ffffff !important;
}

html body .ts-wrapper .ts-control{
    color:#ffffff !important;
}

/* TITULOS Y LABELS SUPERIORES */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .title-green,
html body .card-title,
html body .card-header,
html body legend{
    color:#20e070 !important;
    opacity:1 !important;
    font-weight:700 !important;
}


/* COLOR GLOBAL LABELS */

label{
    color:#20e070 !important;
    font-weight:600 !important;
}

.form-label{
    color:#20e070 !important;
    font-weight:600 !important;
}

/* Tema profesional 2026 */
:root{--app-bg:#0f1720;--app-surface:#17212b;--app-raised:#1d2935;--app-soft:#22303d;--app-border:#2d3d4b;--app-text:#e7edf2;--app-muted:#94a5b3;--app-accent:#38b2ac;--app-accent-hover:#4cc7c1;--app-accent-soft:rgba(56,178,172,.13);--app-danger:#e56b73;--app-warning:#e5b567;--app-info:#69a7dc;--app-shadow:0 10px 30px rgba(0,0,0,.16)}
html{color-scheme:dark}
body{min-height:100vh;margin:0;background:var(--app-bg)!important;color:var(--app-text)!important;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:260px;pointer-events:none;background:radial-gradient(circle at 18% 0,rgba(56,178,172,.07),transparent 46%);z-index:-1}
.topbar{position:sticky;top:0;z-index:1030;padding:14px 22px!important;background:rgba(23,33,43,.96)!important;border-bottom:1px solid var(--app-border)!important;box-shadow:0 4px 18px rgba(0,0,0,.12);backdrop-filter:blur(12px)}
html body h1,html body h2,html body h3,html body h4,html body h5,html body h6,html body .title-green,html body .card-title,html body .card-header,html body legend{color:var(--app-text)!important;font-weight:650!important;letter-spacing:-.02em}
.topbar .title-green{color:#f4f8fa!important;font-size:1.15rem}.text-secondary,.text-muted,.small-muted{color:var(--app-muted)!important}
.card,.card-dark-green,.card-box,.modal-content,.list-group-item{background:var(--app-surface)!important;color:var(--app-text)!important;border:1px solid var(--app-border)!important;border-radius:12px!important;box-shadow:var(--app-shadow)!important}
.card-box{padding:19px!important;min-height:112px;transition:border-color .18s ease,transform .18s ease,background .18s ease}.card-box:hover{transform:translateY(-2px)!important;background:var(--app-raised)!important;border-color:#3a5060!important;box-shadow:var(--app-shadow)!important}
.card-box span{display:block;margin-bottom:8px;color:var(--app-muted)!important;font-size:.78rem;font-weight:600;letter-spacing:.025em;text-transform:uppercase}.card-box strong,.card-dark-green strong{color:var(--app-text)!important;font-size:clamp(1.35rem,2vw,1.9rem)!important;font-weight:700;letter-spacing:-.035em}
.card-clientes{border-top:3px solid var(--app-accent)!important}.card-servicios,.card-stock{border-top:3px solid var(--app-info)!important}.card-vencen{border-top:3px solid var(--app-warning)!important}.card-vencidos{border-top:3px solid var(--app-danger)!important}.card-sobre{border-top:3px solid #a68ad4!important}
label,.form-label{color:#cbd5dc!important;font-size:.83rem;font-weight:600!important}.form-control,.form-select,textarea,.ts-control{min-height:42px;background:#111a23!important;border:1px solid var(--app-border)!important;border-radius:9px!important;color:var(--app-text)!important}.form-control:focus,.form-select:focus,textarea:focus,.ts-wrapper.focus .ts-control{background:#111a23!important;border-color:var(--app-accent)!important;color:#fff!important;box-shadow:0 0 0 .2rem var(--app-accent-soft)!important}
html body input::placeholder,html body textarea::placeholder,html body .ts-control input::placeholder{color:#718391!important;-webkit-text-fill-color:#718391!important;opacity:1!important}
.table{--bs-table-bg:transparent;--bs-table-color:var(--app-text);--bs-table-border-color:var(--app-border);--bs-table-hover-bg:rgba(255,255,255,.025);--bs-table-hover-color:#fff;margin-bottom:0}.table thead th{padding-top:13px;padding-bottom:13px;color:var(--app-muted)!important;font-size:.75rem;font-weight:650;letter-spacing:.035em;text-transform:uppercase;border-bottom-width:1px}.table td{padding-top:12px;padding-bottom:12px;vertical-align:middle}.table-responsive{border-radius:12px}
.btn{border-radius:8px;font-weight:600;box-shadow:none!important;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}.btn:hover{transform:translateY(-1px)}.btn-green,.btn-success{background:var(--app-accent)!important;border-color:var(--app-accent)!important;color:#071b1a!important}.btn-green:hover,.btn-success:hover{background:var(--app-accent-hover)!important;border-color:var(--app-accent-hover)!important}.btn-outline-green{background:transparent!important;border-color:var(--app-accent)!important;color:#72d1cc!important}.btn-outline-green:hover{background:var(--app-accent-soft)!important}
.nav-buttons .btn,.topbar>div .btn,.topbar .dropdown>.btn{background:transparent!important;border-color:transparent!important;color:#aebdc8!important;padding:.48rem .68rem}.nav-buttons .btn:hover,.topbar>div .btn:hover,.topbar .dropdown>.btn:hover,.nav-buttons .dropdown.show>.btn{background:var(--app-soft)!important;color:#fff!important}.dropdown-menu{padding:7px;background:#18232d!important;border:1px solid var(--app-border)!important;border-radius:10px;box-shadow:0 16px 36px rgba(0,0,0,.3)}.dropdown-item{padding:8px 10px;border-radius:7px;color:#cbd5dc!important}.dropdown-item:hover,.dropdown-item:focus{background:var(--app-soft)!important;color:#fff!important}
.badge-green,.badge.bg-success{background:var(--app-accent)!important;color:#071b1a!important}.badge.bg-danger{background:var(--app-danger)!important}.badge.bg-warning{background:var(--app-warning)!important;color:#241a08!important}.date-box{padding:8px 12px!important;background:#111a23;border:1px solid var(--app-border)!important;border-radius:8px!important;color:var(--app-muted)!important;font-size:.8rem;font-weight:500!important}.card-download{background:transparent!important;border:0!important;color:#72d1cc!important;padding:7px 0!important;font-weight:600!important}.card-download:hover{color:#a0e4e0!important}a{color:#72d1cc}a:hover{color:#a0e4e0}.alert{border-radius:10px;border-width:1px}
@media(max-width:991.98px){.topbar{position:relative;padding:13px 15px!important}.nav-buttons{margin-top:10px;gap:3px!important}.container-fluid.p-4{padding:18px 14px!important}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Submenus compactos y visualmente separados del menu principal */
.topbar .dropdown-menu,
.nav-buttons .dropdown-menu {
    min-width: 148px !important;
    padding: 4px !important;
    margin-top: 6px !important;
    background: #122936 !important;
    border: 1px solid #285064 !important;
    border-radius: 9px;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .34);
}

.topbar .dropdown-item,
.nav-buttons .dropdown-item {
    min-height: 0;
    padding: 5px 8px !important;
    border-radius: 6px;
    color: #b9d0dc !important;
    font-size: .72rem !important;
    font-weight: 500;
    line-height: 1.15 !important;
}

.topbar .dropdown-item:hover,
.topbar .dropdown-item:focus,
.nav-buttons .dropdown-item:hover,
.nav-buttons .dropdown-item:focus {
    background: rgba(56, 178, 172, .18) !important;
    color: #7ee0da !important;
}

.topbar .dropdown-item + .dropdown-item,
.nav-buttons .dropdown-item + .dropdown-item {
    margin-top: 2px;
}

/* Evolution API y Envio FAST fueron retirados de Lions SaaS. */
#btnEnviarEvolution,
[id^="btnEvolution"],
#whatsappInstance,
[id^="whatsappInstance"],
#resultadoWhatsapp,
[id^="resultadoWhatsapp"] {
    display: none !important;
}

/* Tema violeta con navegacion lateral */
:root {
    --violet-bg: #09071a;
    --violet-sidebar: #100e25;
    --violet-surface: #1b1740;
    --violet-surface-2: #23194f;
    --violet-border: #392d72;
    --violet-primary: #9b3dff;
    --violet-pink: #cf4cff;
    --violet-text: #f4f1ff;
    --violet-muted: #9e99bf;
    --violet-green: #31e6a1;
}

html body {
    background-color: var(--violet-bg) !important;
    background-image:
        radial-gradient(circle at 12% 18%, rgba(164, 70, 255, .65) 0 1px, transparent 2px),
        radial-gradient(circle at 74% 12%, rgba(201, 86, 255, .48) 0 1px, transparent 2px),
        radial-gradient(circle at 42% 67%, rgba(120, 78, 255, .45) 0 1px, transparent 2px),
        radial-gradient(circle at 89% 76%, rgba(201, 86, 255, .5) 0 1px, transparent 2px),
        linear-gradient(135deg, #0d0920 0%, #070615 55%, #0a071b 100%) !important;
    background-size: 310px 270px, 430px 360px, 520px 410px, 620px 480px, auto !important;
    color: var(--violet-text) !important;
}

body::before { display: none !important; }

.topbar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: 225px !important;
    height: 100vh !important;
    padding: 24px 14px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    overflow-y: auto !important;
    background: rgba(16, 14, 37, .97) !important;
    border: 0 !important;
    border-right: 1px solid #29244c !important;
    box-shadow: 10px 0 35px rgba(0, 0, 0, .18) !important;
    backdrop-filter: blur(14px);
}

.topbar > h3,
.topbar > div:first-child h3,
.topbar .title-green {
    padding: 0 10px 22px !important;
    color: var(--violet-pink) !important;
    font-size: 1.05rem !important;
    font-weight: 750 !important;
}

.topbar > div,
.topbar .nav-buttons {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 5px !important;
}

.topbar .nav-buttons { margin: 0 !important; }
.topbar .date-box { order: -1; margin: 0 0 12px !important; text-align: center; }

.topbar .btn,
.topbar > div .btn,
.topbar .dropdown > .btn {
    width: 100% !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 9px 11px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    color: #aaa5c7 !important;
    font-size: .78rem !important;
    text-align: left !important;
}

.topbar .btn:hover,
.topbar .dropdown.show > .btn {
    background: linear-gradient(90deg, rgba(112, 49, 210, .32), rgba(76, 37, 145, .2)) !important;
    border-color: #432b78 !important;
    color: #fff !important;
}

.topbar .dropdown { width: 100% !important; position: relative !important; }
.topbar .dropdown-toggle::after { margin-left: auto !important; }
.topbar .dropdown-menu,
.topbar .tenant-submenu {
    left: calc(100% + 8px) !important;
    top: 0 !important;
    min-width: 165px !important;
    padding: 6px !important;
    background: #1b153b !important;
    border: 1px solid #493482 !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.45) !important;
}

.topbar .dropdown-item,
.topbar .tenant-submenu .tenant-submenu-item {
    padding: 8px 10px !important;
    color: #d6cef5 !important;
    font-size: .75rem !important;
}

.topbar .dropdown-item:hover,
.topbar .tenant-submenu .tenant-submenu-item:hover {
    background: rgba(155, 61, 255, .3) !important;
    color: #fff !important;
}

body > .container-fluid,
body > .container,
body > main.container-fluid {
    width: calc(100% - 225px) !important;
    max-width: none !important;
    margin-left: 225px !important;
    padding: 28px 30px !important;
}

.card,
.card-dark-green,
.card-box,
.modal-content,
.list-group-item {
    background: linear-gradient(145deg, rgba(34, 27, 76, .96), rgba(24, 20, 56, .97)) !important;
    border: 1px solid var(--violet-border) !important;
    color: var(--violet-text) !important;
    border-radius: 13px !important;
    box-shadow: 0 16px 38px rgba(0, 0, 0, .16) !important;
}

.card-box:hover {
    background: linear-gradient(145deg, #2a1d60, #21194c) !important;
    border-color: #6241aa !important;
}

html body h1, html body h2, html body h3, html body h4,
html body h5, html body h6, html body .title-green,
html body .card-title, html body .card-header {
    color: var(--violet-text) !important;
}

.card-box span,.text-secondary,.text-muted,.small-muted { color: var(--violet-muted) !important; }
.card-box strong,.card-dark-green strong { color: #fff !important; }
.card-clientes { border-top-color: var(--violet-primary) !important; }
.card-servicios,.card-stock { border-top-color: #6f63ff !important; }
.card-vencen { border-top-color: #ffc94a !important; }
.card-vencidos { border-top-color: #ff5d78 !important; }
.card-sobre { border-top-color: var(--violet-pink) !important; }

.form-control,.form-select,textarea,.ts-control {
    background: #110e29 !important;
    border-color: #3b3267 !important;
    color: var(--violet-text) !important;
}
.form-control:focus,.form-select:focus,textarea:focus,.ts-wrapper.focus .ts-control {
    border-color: var(--violet-primary) !important;
    box-shadow: 0 0 0 .2rem rgba(155,61,255,.18) !important;
}

.btn-green,.btn-success {
    background: linear-gradient(135deg, #9639f3, #b146f5) !important;
    border-color: #aa4bfa !important;
    color: #fff !important;
}
.btn-green:hover,.btn-success:hover { background: linear-gradient(135deg,#a94bff,#c65cff) !important; }
.btn-outline-green { border-color: #8c48d8 !important; color: #d3a5ff !important; }
.badge-green,.badge.bg-success { background: rgba(49,230,161,.16) !important; color: var(--violet-green) !important; }
a { color: #c86aff; } a:hover { color: #e1a4ff; }
.table { --bs-table-color:#e8e2ff;--bs-table-border-color:#342c5c;--bs-table-hover-bg:rgba(155,61,255,.08); }
.table thead th { color:#a8a0ca !important; }

@media (max-width: 900px) {
    .topbar { position: relative !important; width: 100% !important; height: auto !important; max-height: none !important; }
    .topbar > div,.topbar .nav-buttons { flex-direction: row !important; flex-wrap: wrap !important; }
    .topbar .btn,.topbar > div .btn,.topbar .dropdown > .btn { width: auto !important; }
    .topbar .dropdown { width: auto !important; }
    .topbar .dropdown-menu,.topbar .tenant-submenu { left: 0 !important; top: 100% !important; }
    body > .container-fluid,body > .container,body > main.container-fluid { width:100% !important;margin-left:0 !important;padding:18px 14px !important; }
}

/* Prioridad sobre los colores configurables heredados. */
html body .topbar { background: rgba(16,14,37,.97) !important; border-right-color:#29244c !important; }
html body .card-dark-green,
html body .card,
html body .card-box { background:linear-gradient(145deg,rgba(34,27,76,.96),rgba(24,20,56,.97)) !important;border-color:var(--violet-border) !important; }
html body .form-control,
html body .form-select,
html body textarea { background:#110e29 !important;border-color:#3b3267 !important;color:var(--violet-text) !important; }

/* Navegacion horizontal superior, conservando el tema violeta. */
html body .topbar {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 72px !important;
    padding: 13px 20px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    background: rgba(16,14,37,.96) !important;
    border: 0 !important;
    border-bottom: 1px solid #302858 !important;
    box-shadow: 0 8px 28px rgba(0,0,0,.22) !important;
}

@media (min-width:901px) {
    html body .topbar {
        display: grid !important;
        grid-template-columns: minmax(130px,1fr) auto minmax(130px,1fr) !important;
    }

    html body .topbar > h3,
    html body .topbar > div:first-child {
        grid-column: 1;
        justify-self: start;
    }

    html body .topbar > .nav-buttons,
    html body .topbar > div:last-child {
        grid-column: 2;
        justify-self: center;
        justify-content: center !important;
    }
}

html body .topbar > h3,
html body .topbar > div:first-child h3,
html body .topbar .title-green {
    width: auto !important;
    margin: 0 18px 0 0 !important;
    padding: 0 !important;
    color: var(--violet-pink) !important;
    white-space: nowrap;
}

html body .topbar > div,
html body .topbar .nav-buttons {
    width: auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
}

html body .topbar .date-box {
    order: initial !important;
    margin: 0 8px 0 0 !important;
}

html body .topbar .btn,
html body .topbar > div .btn,
html body .topbar .dropdown > .btn {
    width: auto !important;
    min-height: 36px !important;
    padding: 7px 9px !important;
    justify-content: center !important;
    white-space: nowrap;
}

html body .topbar .dropdown { width: auto !important; }
html body .topbar .dropdown-menu,
html body .topbar .tenant-submenu {
    left: 0 !important;
    top: calc(100% + 6px) !important;
}

html body > .container-fluid,
html body > .container,
html body > main.container-fluid {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    padding: 26px 28px !important;
}

@media (max-width:900px) {
    html body .topbar { align-items:flex-start !important;padding:13px 14px !important; }
    html body .topbar > h3,html body .topbar > div:first-child { width:100% !important;margin-bottom:8px !important; }
    html body .topbar > div,html body .topbar .nav-buttons { justify-content:flex-start !important; }
    html body > .container-fluid,html body > .container,html body > main.container-fluid { padding:18px 14px !important; }
}