:root {
    color-scheme: light;
    font-family: Inter, Segoe UI, Arial, sans-serif;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: #f5f7fb;
    color: #1e2430;
}

.topbar {
    background: #111827;
    color: #fff;
    padding: 1rem 0;
}

.container {
    width: min(1000px, 92%);
    margin: 0 auto;
}

.topbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.topbar nav {
    display: flex;
    gap: 1rem;
}

.topbar a {
    color: #e5e7eb;
    text-decoration: none;
}

.topbar a:hover {
    color: #fff;
}

main.container {
    padding: 1.5rem 0 2rem;
}

.card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1.25rem;
}

.form {
    display: grid;
    gap: 0.75rem;
    max-width: 420px;
}

.form input {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 8px;
}

.form button {
    margin-top: 0.5rem;
    border: 0;
    border-radius: 8px;
    padding: 0.7rem 1rem;
    background: #1f2937;
    color: #fff;
    cursor: not-allowed;
    opacity: 0.7;
}


.app-header {
    background-color: #110057;
} 

.app-sidebar { 
    /* background-color: #336be4; */
     /* Aplicaremos degradado a la barra lateral */
    background: linear-gradient(180deg, #110057 0%, #09002c 100%);
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
  transition: color 0.2s ease!important;
  background-color: #060020!important;
  color: #F5F5F5!important;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-title {
  color: #eaf2ff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here) .menu-title, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-title {
  color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon .svg-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i {
    color: #dbeafe !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link:hover .menu-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link:hover .menu-icon .svg-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link:hover .menu-icon i, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon .svg-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon i {
    color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-arrow:after {
    color: #dbeafe !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link:hover .menu-arrow:after,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-arrow:after {
    color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .app-sidebar-logo {
    border-bottom: 1px dashed #5a78ff;
}

/* Tabulator aligned to Metronic table styles */
.tabulator {
    --pos25-tabulator-border: var(--bs-table-border-color, var(--bs-border-color));
    --pos25-tabulator-head-color: var(--bs-gray-700);
    --pos25-tabulator-row-striped: var(--bs-table-striped-bg, rgba(var(--bs-gray-100-rgb), 0.75));
    --pos25-tabulator-row-hover: var(--bs-table-hover-bg, var(--bs-gray-100));
    --pos25-tabulator-row-selected: var(--bs-table-active-bg, var(--bs-gray-100));

    background: var(--bs-table-bg, transparent);
    border: 0;
    border-radius: 0.475rem;
    box-shadow: none;
    color: var(--bs-table-color, var(--bs-body-color));
    font-family: inherit;
    font-size: 1rem;
    overflow: visible;
}

.tabulator .tabulator-tableholder {
    background: transparent;
    overflow: auto !important;
}

.tabulator .tabulator-header {
    background: transparent;
    border-bottom: 1px solid var(--pos25-tabulator-border);
    color: var(--pos25-tabulator-head-color);
}

.tabulator .tabulator-header .tabulator-col {
    background: transparent;
    border-right: 0;
    color: var(--pos25-tabulator-head-color);
    font-weight: 600;
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-content {
    padding: 0.75rem;
}

.tabulator .tabulator-header .tabulator-col .tabulator-col-sorter {
    right: 0.5rem;
}

.tabulator .tabulator-row {
    background: transparent;
    border-bottom: 1px solid var(--pos25-tabulator-border);
    color: inherit;
    overflow: visible;
}

.tabulator .tabulator-row:nth-child(odd) {
    background: var(--pos25-tabulator-row-striped);
}

.tabulator .tabulator-row:hover {
    background: var(--pos25-tabulator-row-hover);
}

.tabulator .tabulator-row.tabulator-selected {
    background: var(--pos25-tabulator-row-selected);
}

.tabulator .tabulator-row .tabulator-cell {
    border-right: 0;
    color: inherit;
    overflow: visible;
    padding: 0.75rem;
    white-space: normal;
    word-break: break-word;
}

.tabulator .tabulator-row .tabulator-cell.tabulator-editing {
    padding: 0;
}

.tabulator .tabulator-footer {
    background: transparent;
    border-top: 1px solid var(--pos25-tabulator-border);
    color: inherit;
    padding: 0.75rem;
}

.tabulator .tabulator-footer .tabulator-footer-contents {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: space-between;
    padding: 0;
}

.tabulator .tabulator-footer .tabulator-pages {
    margin: 0;
}

.tabulator .tabulator-footer .tabulator-page {
    background: var(--bs-body-bg);
    border: 1px solid var(--pos25-tabulator-border);
    border-radius: 0.475rem;
    color: var(--bs-gray-700);
    margin: 0 0.15rem;
    min-width: 2rem;
    padding: 0.35rem 0.65rem;
}

.tabulator .tabulator-footer .tabulator-page.active {
    background: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
}

.tabulator .tabulator-footer .tabulator-page:disabled {
    color: var(--bs-gray-400);
    opacity: 1;
}

@media (hover:hover) and (pointer:fine) {
    .tabulator .tabulator-footer .tabulator-page:not(:disabled):hover {
        background: var(--pos25-tabulator-row-hover);
        color: var(--bs-gray-800);
    }
}

.tabulator .dropdown-menu {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.475rem;
    box-shadow: none;
    z-index: 1080;
}

.tabulator .badge-success {
    background: var(--bs-success);
    border-radius: 0.475rem;
    color: #fff;
    font-size: 0.875rem;
    padding: 0.25em 0.75em;
}

.tabulator .badge-danger {
    background: var(--bs-danger);
    border-radius: 0.475rem;
    color: #fff;
    font-size: 0.875rem;
    padding: 0.25em 0.75em;
}

.tabulator .fa {
    font-size: 1rem;
    vertical-align: middle;
}

#TablaGeneralArticulos .tabulator-cell > div {
    width: 100%;
}