:root {
    --moody-50: #f1f7fc;
    --moody-100: #e6eff9;
    --moody-200: #d1e0f4;
    --moody-300: #b5cbec;
    --moody-400: #96b0e3;
    --moody-500: #7d94d7;
    --moody-600: #6a7ccb;
    --moody-700: #5262b0;
    --moody-800: #45538e;
    --moody-900: #3d4872;
    --moody-950: #242942;
    --text-900: #111827;

    /* Sistema global de tablas (ajustar aquí) */
    --table-font-size: 0.86rem;
    --table-header-bg: var(--moody-300);
    --table-header-border: var(--moody-200);
    --table-row-border: #d4dbe6;
    --table-cell-bg: #ffffff;
    --table-th-py: 0.4rem;
    --table-th-px: 0.5rem;
    --table-td-py: 0.3rem;
    --table-td-px: 0.5rem;
    --table-sm-th-py: 0.38rem;
    --table-sm-th-px: 0.48rem;
    --table-sm-td-py: 0.28rem;
    --table-sm-td-px: 0.48rem;
    --table-line-height: 1.1;

    /* Sistema global de acciones en tablas (ajustar aquí) */
    --table-action-gap: 0.3rem;
    --table-action-radius: 8px;
    --table-action-min-w: 1.6rem;
    --table-action-h: 1.55rem;
    --table-action-py: 0.08rem;
    --table-action-px: 0.26rem;
    --table-action-icon-size: 0.72rem;
}

body {
    background: #f7f7f7;
}

.navbar {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.navbar-logo {
    height: 34px;
    width: auto;
    display: block;
}

.navbar-logo-fallback {
    display: none;
}

.auth-logo {
    max-height: none;
    max-width: none;
    height: auto;
    width: auto;
}

.sidebar-logo {
    max-width: 85%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.sidebar-brand-fallback {
    display: none;
    color: var(--moody-900);
}

.sidebar {
    height: calc(100vh - 56px);
    background: #ffffff;
    border-right: 1px solid #e5e7eb;
    overflow-y: auto;
    overflow-x: hidden;
}

.sidebar a {
    display: block;
    padding: 12px 20px;
    color: #333;
    text-decoration: none;
}

.sidebar a:hover {
    background: #f1f5f9;
    border-left: 4px solid #4f46e5;
}

.sidebar .nav-link.active {
    background: #f1f5f9;
    border-left: 4px solid #4f46e5;
    color: #111827;
    font-weight: 600;
}

.sidebar .nav-link i {
    margin-right: 8px;
}

.sidebar-heading {
    color: #6b7280;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
}

.sidebar .collapse .nav-link {
    padding-left: 32px;
    font-size: 0.95rem;
}

main {
    min-height: calc(100vh - 56px);
}

main > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom,
main > .d-flex.justify-content-between.align-items-center.mb-4,
main > .d-flex.justify-content-between.align-items-center.mt-4.mb-2,
main .container > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom:first-child,
main .container > .d-flex.justify-content-between.align-items-center.mb-4:first-child,
main .container > .d-flex.justify-content-between.align-items-center.mt-4.mb-2:first-child,
main .container-fluid > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom:first-child,
main .container-fluid > .d-flex.justify-content-between.align-items-center.mb-4:first-child,
main .container-fluid > .d-flex.justify-content-between.align-items-center.mt-4.mb-2:first-child {
    background: #ffffff;
    border: none !important;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    padding: 1rem 1.25rem;
    margin-bottom: 1rem !important;
}

main > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom h1,
main > .d-flex.justify-content-between.align-items-center.mb-4 h2,
main > .d-flex.justify-content-between.align-items-center.mt-4.mb-2 h2,
main .container > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom:first-child h1,
main .container > .d-flex.justify-content-between.align-items-center.mb-4:first-child h2,
main .container > .d-flex.justify-content-between.align-items-center.mt-4.mb-2:first-child h2,
main .container-fluid > .d-flex.justify-content-between.flex-wrap.flex-md-nowrap.align-items-center.pt-3.pb-2.mb-3.border-bottom:first-child h1,
main .container-fluid > .d-flex.justify-content-between.align-items-center.mb-4:first-child h2,
main .container-fluid > .d-flex.justify-content-between.align-items-center.mt-4.mb-2:first-child h2 {
    margin-bottom: 0;
}

.card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.card-header {
    border-bottom: 1px solid #e5e7eb;
    background-color: #ffffff !important;
    border-radius: 12px 12px 0 0 !important;
}

.alert {
    border: none;
    border-radius: 10px;
}

.table {
    background: var(--table-cell-bg);
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--table-font-size);
}

.table thead th {
    background-color: var(--table-header-bg);
    border-bottom: 1px solid var(--table-header-border);
    color: var(--text-900);
    font-weight: 700;
    padding: var(--table-th-py) var(--table-th-px);
    line-height: var(--table-line-height);
    vertical-align: middle;
}

.table tbody td,
.table tbody th {
    border-bottom: 1px solid var(--table-row-border);
    color: #111827;
    padding: var(--table-td-py) var(--table-td-px);
    line-height: var(--table-line-height);
    vertical-align: middle;
    background-color: var(--table-cell-bg) !important;
}

.table tbody tr:last-child td {
    border-bottom: 1px solid var(--table-row-border);
}

.table.table-sm thead th,
.table.table-sm > :not(caption) > * > th {
    padding: var(--table-sm-th-py) var(--table-sm-th-px) !important;
    line-height: var(--table-line-height);
}

.table.table-sm tbody td,
.table.table-sm tbody th,
.table.table-sm > :not(caption) > * > td {
    padding: var(--table-sm-td-py) var(--table-sm-td-px) !important;
    line-height: var(--table-line-height);
}

.table thead.table-dark th,
.table thead.table-light th {
    background-color: var(--table-header-bg) !important;
    color: var(--text-900) !important;
    border-bottom: 1px solid var(--table-header-border) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: var(--table-cell-bg);
    background-color: var(--table-cell-bg) !important;
}

.table-hover > tbody > tr:hover > * {
    --bs-table-accent-bg: var(--table-cell-bg);
    background-color: var(--table-cell-bg) !important;
}

table.dataTable tbody tr,
table.dataTable tbody tr > td,
table.dataTable tbody tr > th,
table.dataTable.display > tbody > tr.odd > *,
table.dataTable.display > tbody > tr.even > *,
table.dataTable.stripe > tbody > tr.odd > *,
table.dataTable.stripe > tbody > tr.even > *,
table.dataTable.hover > tbody > tr:hover > * {
    background-color: var(--table-cell-bg) !important;
}

.badge {
    font-size: 0.72rem;
    font-weight: 600;
    padding: 0.28rem 0.5rem;
    border-radius: 999px;
}

.badge.bg-success {
    background-color: var(--moody-700) !important;
}

.badge.bg-danger {
    background-color: var(--moody-800) !important;
}

.badge.bg-secondary {
    background-color: var(--moody-500) !important;
    color: #ffffff !important;
}

.badge.bg-primary {
    background-color: var(--moody-600) !important;
}

.btn {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.btn-sm {
    padding: 0.45rem 0.9rem;
}

.table td .btn-group .btn,
.table td .btn-group-sm .btn,
.table td a.btn.btn-sm[title],
.table td button.btn.btn-sm[title] {
    min-width: var(--table-action-min-w);
    height: var(--table-action-h);
    padding: var(--table-action-py) var(--table-action-px) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.table td .btn-group,
.table td .btn-group-sm {
    display: inline-flex;
    align-items: center;
    gap: var(--table-action-gap);
}

.table td .btn-group > .btn,
.table td .btn-group-sm > .btn,
.table td .btn-group > form > .btn,
.table td .btn-group-sm > form > .btn {
    border-radius: var(--table-action-radius) !important;
}

.table td .btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.table td .btn-group-sm > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: var(--table-action-radius) !important;
    border-bottom-right-radius: var(--table-action-radius) !important;
}

.table td .btn-group > .btn:not(:first-child),
.table td .btn-group-sm > .btn:not(:first-child) {
    border-top-left-radius: var(--table-action-radius) !important;
    border-bottom-left-radius: var(--table-action-radius) !important;
}

.table td .btn-group .btn i,
.table td .btn-group-sm .btn i,
.table td a.btn.btn-sm[title] i,
.table td button.btn.btn-sm[title] i {
    font-size: var(--table-action-icon-size);
    line-height: 1;
    margin: 0 !important;
}

.btn-primary {
    background-color: var(--moody-700);
    border-color: var(--moody-700);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--moody-800) !important;
    border-color: var(--moody-800) !important;
}

.btn-primary:focus {
    box-shadow: 0 0 0 0.2rem rgba(82, 98, 176, 0.25);
}

.btn-secondary {
    background-color: var(--moody-200);
    border-color: var(--moody-200);
    color: var(--moody-900);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background-color: var(--moody-300) !important;
    border-color: var(--moody-300) !important;
    color: var(--moody-950) !important;
}

.btn-success {
    background-color: var(--moody-600);
    border-color: var(--moody-600);
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background-color: var(--moody-700) !important;
    border-color: var(--moody-700) !important;
}

.btn-danger {
    background-color: var(--moody-800);
    border-color: var(--moody-800);
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background-color: var(--moody-900) !important;
    border-color: var(--moody-900) !important;
}

.btn-warning {
    background-color: var(--moody-500);
    border-color: var(--moody-500);
    color: #ffffff;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
    background-color: var(--moody-600) !important;
    border-color: var(--moody-600) !important;
    color: #ffffff !important;
}

.btn-info {
    background-color: var(--moody-400);
    border-color: var(--moody-400);
    color: var(--moody-950);
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active {
    background-color: var(--moody-500) !important;
    border-color: var(--moody-500) !important;
    color: #ffffff !important;
}

.btn-light {
    background-color: #ffffff;
    border-color: var(--moody-200);
    color: var(--moody-800);
}

.btn-light:hover,
.btn-light:focus,
.btn-light:active {
    background-color: var(--moody-50) !important;
    border-color: var(--moody-300) !important;
    color: var(--moody-900) !important;
}

.btn-outline-secondary {
    color: var(--moody-800);
    border-color: var(--moody-300);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
    color: var(--moody-950) !important;
    background-color: var(--moody-100) !important;
    border-color: var(--moody-400) !important;
}

.btn-outline-success {
    color: var(--moody-700);
    border-color: var(--moody-600);
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active {
    color: #ffffff !important;
    background-color: var(--moody-700) !important;
    border-color: var(--moody-700) !important;
}

.btn-outline-danger {
    color: var(--moody-800);
    border-color: var(--moody-700);
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger:active {
    color: #ffffff !important;
    background-color: var(--moody-800) !important;
    border-color: var(--moody-800) !important;
}

.btn-outline-warning {
    color: var(--moody-700);
    border-color: var(--moody-500);
}

.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active {
    color: #ffffff !important;
    background-color: var(--moody-600) !important;
    border-color: var(--moody-600) !important;
}

.btn-outline-info {
    color: var(--moody-700);
    border-color: var(--moody-400);
}

.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active {
    color: #ffffff !important;
    background-color: var(--moody-600) !important;
    border-color: var(--moody-600) !important;
}

@media (max-width: 767.98px) {
    .sidebar {
        height: auto;
        min-height: 0;
    }
}