/* Toscana Projects: capa global sobre AdminLTE 3 / Bootstrap 4.
   Lleva el lenguaje visual del modal de Plantillas de costos (/proposal_cost_templates)
   a los componentes repetidos del software SIN tocar el marcado de cada modulo:
   marco de pagina, cards, tablas/DataTables, modales, formularios, Select2, tabs,
   badges, alertas, info-box y listas.
   Requiere los tokens de toscana-componentes.css. Cargar DESPUES de los CSS de plugins
   (DataTables, Select2, toastr) y ANTES de colors.css.php.
   Revertir: quitar el <link> en templates/head.php. */

/* ---------- 1. Marco de pagina ---------- */
.content-wrapper { background-color: var(--page); color: var(--ink); }
.content-header { padding: var(--space-5) var(--space-2) var(--space-3); }
.content-header h1,
.content-header .h1 { margin: 0; font-size: 24px; line-height: 32px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); }
.content-header .breadcrumb { margin: 0; padding: 0; background: transparent; font-size: 13px; }
.breadcrumb-item, .breadcrumb-item + .breadcrumb-item::before { color: var(--ink-muted); }
.breadcrumb-item.active { color: var(--ink); font-weight: 500; }
.content-wrapper hr { border-top-color: var(--border); }
.text-muted { color: var(--ink-muted) !important; }

/* ---------- 2. Cards ---------- */
.card { border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); background-color: var(--surface); margin-bottom: var(--space-4); }
.card > .card-header:first-child { border-radius: calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px) 0 0; }
.card > .card-footer:last-child { border-radius: 0 0 calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px); }
.card-header { padding: var(--space-3) var(--space-5); background-color: var(--surface); border-bottom: 1px solid var(--border); color: var(--ink); }
.card-header > .float-right,
.card-header > .card-tools { display: flex; align-items: center; gap: var(--space-2); min-height: 32px; }
.card-header .card-title { margin: 0; }
.card-title { display: inline-flex; align-items: center; gap: 10px; min-height: 32px; font-size: 16px; line-height: 22px; font-weight: 600; color: var(--ink); }
/* Icono inicial del titulo = "chip" como el encabezado del modal de costos */
.card-title > i:first-child:not([class*="text-"]),
.card-title > .fa:first-child:not([class*="text-"]), .card-title > .fas:first-child:not([class*="text-"]), .card-title > .far:first-child:not([class*="text-"]) {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 30px; height: 30px; border-radius: var(--radius-md);
  background: var(--surface-selected); color: var(--primary); font-size: 14px;
}
.card-body { padding: var(--space-5); }
.card-footer { padding: var(--space-3) var(--space-5); background-color: var(--surface); border-top: 1px solid var(--border); }
.card-header .btn-tool { color: var(--ink-muted); }
.card-header .btn-tool:hover { color: var(--ink); }

/* Variantes de marca (primary/secondary/info/default/dark): encabezado blanco, sin franja azul de AdminLTE */
.card-primary.card-outline, .card-secondary.card-outline, .card-info.card-outline,
.card-default.card-outline, .card-dark.card-outline { border-top: 1px solid var(--border); }
.card-primary:not(.card-outline) > .card-header, .card-secondary:not(.card-outline) > .card-header,
.card-info:not(.card-outline) > .card-header, .card-dark:not(.card-outline) > .card-header,
.card-default:not(.card-outline) > .card-header { background-color: var(--surface); color: var(--ink); border-bottom: 1px solid var(--border); }
.card-primary:not(.card-outline) > .card-header a:not(.btn):not(.tp-btn),
.card-secondary:not(.card-outline) > .card-header a:not(.btn):not(.tp-btn),
.card-info:not(.card-outline) > .card-header a:not(.btn):not(.tp-btn),
.card-dark:not(.card-outline) > .card-header a:not(.btn):not(.tp-btn) { color: var(--primary); }
.card-primary:not(.card-outline) > .card-header .btn-tool,
.card-secondary:not(.card-outline) > .card-header .btn-tool,
.card-info:not(.card-outline) > .card-header .btn-tool,
.card-dark:not(.card-outline) > .card-header .btn-tool { color: var(--ink-muted); }
/* Variantes de estado: se conservan, pero con los colores de la guia */
.card-success.card-outline { border-top: 3px solid var(--success); }
.card-warning.card-outline { border-top: 3px solid var(--warning-fill); }
.card-danger.card-outline  { border-top: 3px solid var(--danger); }

/* ---------- 3. Tablas y DataTables ---------- */
.content-wrapper .table, .modal .table { color: var(--ink); font-size: 14px; margin-bottom: 0; }
.content-wrapper .table th, .content-wrapper .table td,
.modal .table th, .modal .table td { padding: var(--space-3) var(--space-4); vertical-align: middle; border-top: 1px solid var(--border); }
.content-wrapper .table thead th, .modal .table thead th {
  background: var(--surface-muted); color: var(--ink-muted); border-bottom: 1px solid var(--border); border-top: 0;
  font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap;
}
.content-wrapper .table tfoot td, .content-wrapper .table tfoot th,
.modal .table tfoot td, .modal .table tfoot th { background: var(--surface-muted); border-top: 1px solid var(--border-field); font-weight: 600; }
/* table-bordered -> solo lineas horizontales, como tp-table */
.content-wrapper .table-bordered, .modal .table-bordered { border: 1px solid var(--border); border-radius: var(--radius-lg); border-collapse: separate; border-spacing: 0; overflow: hidden; }
.content-wrapper .table-bordered th, .content-wrapper .table-bordered td,
.modal .table-bordered th, .modal .table-bordered td { border-left: 0; border-right: 0; border-bottom: 0; }
.content-wrapper .table-bordered thead th, .modal .table-bordered thead th { border-bottom: 1px solid var(--border); }
.content-wrapper .table-bordered tbody tr:first-child td, .modal .table-bordered tbody tr:first-child td { border-top: 0; }
/* sin cebra; hover suave */
.content-wrapper .table-striped tbody tr:nth-of-type(odd), .modal .table-striped tbody tr:nth-of-type(odd) { background-color: transparent; }
.content-wrapper .table tbody tr:hover > td, .modal .table tbody tr:hover > td { background-color: var(--page); }
.content-wrapper .table-hover tbody tr:hover { color: var(--ink); background-color: transparent; }
table.dataTable { border-collapse: separate !important; margin-top: var(--space-3) !important; margin-bottom: var(--space-3) !important; }
table.dataTable td.dataTables_empty { padding: 28px var(--space-4); text-align: center; color: var(--ink-muted); font-size: 13px; }
table.dataTable thead .sorting::before, table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::before, table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::before, table.dataTable thead .sorting_desc::after { bottom: .9em; }
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control::before { background-color: var(--primary); box-shadow: none; border: 0; }
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control::before { background-color: var(--danger); }
/* Controles de DataTables */
div.dataTables_wrapper div.dataTables_filter label,
div.dataTables_wrapper div.dataTables_length label { font-size: 13px; font-weight: 500; color: var(--ink-muted); }
div.dataTables_wrapper div.dataTables_filter input { width: 50%; min-width: 220px; margin-left: var(--space-2); }
div.dataTables_wrapper div.dataTables_info { padding-top: var(--space-3); font-size: 13px; color: var(--ink-muted); }
div.dataTables_wrapper div.dataTables_paginate { padding-top: var(--space-2); }
.pagination { gap: 2px; }
.page-link { border: 1px solid transparent; border-radius: var(--radius-md) !important; min-width: 32px; height: 32px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; }
.page-link:hover { background: var(--surface-selected); border-color: transparent; }
.page-item.disabled .page-link { color: var(--ink-placeholder); background: transparent; border-color: transparent; }
.page-link:focus { box-shadow: none; outline: 2px solid var(--focus); outline-offset: 1px; }
.dt-buttons .btn { height: 32px; padding: 0 var(--space-3); font-size: 13px; font-weight: 500; background: var(--surface); border: 1px solid var(--border-field); color: var(--ink); }
.dt-buttons .btn:hover { background: var(--surface-muted); }
/* Acciones por fila de helper_create_table(): icono -> boton fantasma 30px (como "quitar item" del modal) */
.dataTable td span.label { padding: 0; background: transparent; }
.dataTable td span.label > a > i.icon.btn-primary {
  display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0;
  border: 0; border-radius: var(--radius-md); background: transparent; color: var(--ink-muted); font-size: 14px;
  transition: background-color .15s, color .15s;
}
.dataTable td span.label > a:hover > i.icon.btn-primary { background: var(--surface-selected); color: var(--primary); }
.dataTable td span.label > a:hover > i.icon.fa-trash,
.dataTable td span.label > a:hover > i.icon.fa-trash-alt,
.dataTable td span.label > a:hover > i.icon.fa-times { background: var(--danger-bg); color: var(--danger); }
.dataTable td span.label > a:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; border-radius: var(--radius-md); }

/* ---------- 4. Modales (mismo patron que el de Plantillas de costos) ---------- */
.modal-content { border: 0; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); overflow: hidden; color: var(--ink); background: var(--surface); }
.modal-header { align-items: center; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border); }
.modal-header:not([class*="bg-"]) { background: var(--surface); }
.modal-title { margin: 0; font-size: 18px; line-height: 24px; font-weight: 600; }
.modal-header:not([class*="bg-"]) .modal-title { color: var(--ink); }
.modal-header .close { margin: 0 0 0 auto; padding: 4px 8px; opacity: 1; text-shadow: none; font-size: 22px; font-weight: 400; }
.modal-header:not([class*="bg-"]) .close { color: var(--ink-muted); }
.modal-header:not([class*="bg-"]) .close:hover { color: var(--ink); }
.modal-body { padding: 20px var(--space-5) var(--space-5); }
.modal-footer { padding: var(--space-4) var(--space-5); border-top: 1px solid var(--border); gap: var(--space-2); }
.modal-footer > * { margin: 0; }
.modal-backdrop.show { opacity: .45; background-color: var(--brand-petroleo); }

/* ---------- 5. Formularios ---------- */
.content-wrapper label:not(.form-check-label):not(.custom-control-label):not(.btn):not(.switch):not(.tp-label),
.modal label:not(.form-check-label):not(.custom-control-label):not(.btn):not(.switch):not(.tp-label) { font-size: 13px; line-height: 18px; font-weight: 500; color: var(--ink-muted); margin-bottom: var(--space-1); }
.form-control, .custom-select { border: 1px solid var(--border-field); border-radius: var(--radius-md); color: var(--ink); background-color: var(--surface); font-size: 14px; }
.form-control::placeholder { color: var(--ink-placeholder); opacity: 1; }
.form-control:hover:not(:disabled):not([readonly]), .custom-select:hover { border-color: var(--primary); }
.form-control:focus, .custom-select:focus { border-color: var(--primary); box-shadow: none; outline: 2px solid var(--focus); outline-offset: 1px; color: var(--ink); background-color: var(--surface); }
.form-control:disabled, .form-control[readonly] { background-color: var(--surface-muted); border-color: var(--border); color: var(--ink-muted); }
.form-control.is-invalid, .was-validated .form-control:invalid { border-color: var(--danger); }
.form-control.is-valid, .was-validated .form-control:valid { border-color: var(--success); }
.invalid-feedback { color: var(--danger); font-size: 12px; }
.form-text, small.form-text { color: var(--ink-muted); font-size: 12px; }
.input-group-text { background: var(--surface-muted); border-color: var(--border-field); color: var(--ink-muted); font-size: 13px; }
.input-group > .input-group-prepend > .input-group-text { border-radius: var(--radius-md) 0 0 var(--radius-md); }
.input-group > .input-group-append > .input-group-text { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--primary); border-color: var(--primary); }
.custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--focus); }

/* Select2 (tema default y bootstrap4): alto/borde/radio/flecha ya los fuerza colors.css.php
   con !important (lee --control-h/--radius-md/--border-field), asi que aqui solo lo que
   colors.css.php no toca. */
.select2-container--default .select2-selection--single .select2-selection__rendered { padding-left: var(--space-3); color: var(--ink); font-size: 14px; }
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--ink-placeholder); }
.select2-container--default .select2-selection--multiple,
.select2-container--bootstrap4 .select2-selection--multiple { min-height: calc(2.25rem + 2px); border: 1px solid var(--border-field); border-radius: var(--radius-md); background: var(--surface); }
.select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--surface-selected); border: 0; border-radius: var(--radius-pill); color: var(--primary); font-size: 12px; font-weight: 500; padding: 2px 10px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove { color: var(--primary); }
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--bootstrap4.select2-container--focus .select2-selection { border-color: var(--primary); outline: 2px solid var(--focus); outline-offset: 1px; box-shadow: none; }
.select2-dropdown { border: 1px solid var(--border-field); border-radius: var(--radius-md); box-shadow: var(--shadow-md); overflow: hidden; }
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: var(--primary); color: var(--ink-inverse); }
.select2-container--default .select2-results__option[aria-selected="true"] { background-color: var(--surface-selected); color: var(--ink); }
.select2-container--default .select2-search--dropdown .select2-search__field { border: 1px solid var(--border-field); border-radius: var(--radius-md); }

/* ---------- 6. Tabs y pills ---------- */
.nav-tabs { border-bottom: 1px solid var(--border); gap: var(--space-1); }
.nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; border-radius: 0; margin-bottom: -1px; padding: 10px var(--space-4); color: var(--ink-muted); font-weight: 500; background: transparent; }
.nav-tabs .nav-link:hover { color: var(--ink); border-bottom-color: var(--border-field); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: var(--primary); background: transparent; border-bottom-color: var(--primary); }
.card-outline-tabs > .card-header a.active, .card-outline-tabs > .card-header a.active:hover { border-top: 0 !important; }
.card-primary.card-outline-tabs > .card-header a.active { border-top: 0; }
.nav-pills .nav-link { border-radius: var(--radius-md); color: var(--ink-muted); font-weight: 500; }
.nav-pills .nav-link:not(.active):hover { color: var(--ink); background: var(--surface-muted); }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { background-color: var(--primary); color: var(--ink-inverse); }

/* ---------- 7. Badges (tono suave como tp-badge; no toca contadores del navbar) ---------- */
.content-wrapper .badge, .modal .badge { display: inline-flex; align-items: center; gap: var(--space-1); padding: 4px 10px; border-radius: var(--radius-pill); font-size: 12px; font-weight: 500; line-height: 1.1; }
.content-wrapper .badge-primary, .modal .badge-primary,
.content-wrapper .badge-info, .modal .badge-info { background: var(--surface-selected); color: var(--primary); }
.content-wrapper .badge-secondary, .modal .badge-secondary,
.content-wrapper .badge-light, .modal .badge-light { background: var(--surface-muted); color: var(--ink-muted); }
.content-wrapper .badge-success, .modal .badge-success { background: var(--success-bg); color: var(--success); }
.content-wrapper .badge-warning, .modal .badge-warning { background: var(--warning-bg); color: var(--warning); }
.content-wrapper .badge-danger, .modal .badge-danger { background: var(--danger-bg); color: var(--danger); }
.content-wrapper .badge-dark, .modal .badge-dark { background: var(--brand-petroleo); color: #ffffff; }

/* ---------- 8. Alertas y callouts (tono suave como tp-alert) ---------- */
.content-wrapper .alert, .modal .alert { border: 1px solid transparent; border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); font-size: 14px; }
.content-wrapper .alert .close, .modal .alert .close { color: inherit; opacity: .7; text-shadow: none; }
.content-wrapper .alert a:not(.btn):not(.tp-btn), .modal .alert a:not(.btn):not(.tp-btn) { color: inherit; text-decoration: underline; }
.content-wrapper .alert-info, .modal .alert-info, .content-wrapper .alert-primary, .modal .alert-primary { background: var(--surface-selected); color: var(--ink); }
.content-wrapper .alert-success, .modal .alert-success { background: var(--success-bg); color: var(--success); }
.content-wrapper .alert-warning, .modal .alert-warning { background: var(--warning-bg); color: var(--warning); }
.content-wrapper .alert-danger, .modal .alert-danger { background: var(--danger-bg); color: var(--danger); }
.callout { border-radius: var(--radius-md); box-shadow: none; border: 1px solid var(--border); border-left: 4px solid var(--border-field); background: var(--surface); padding: var(--space-3) var(--space-4); }
.callout.callout-info { border-left-color: var(--primary); }
.callout.callout-success { border-left-color: var(--success); }
.callout.callout-warning { border-left-color: var(--warning-fill); }
.callout.callout-danger { border-left-color: var(--danger); }
.callout a { color: var(--primary); text-decoration: none; }

/* ---------- 9. Indicadores AdminLTE (info-box) -> aspecto tp-stat ---------- */
.info-box { border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: none; padding: var(--space-3); min-height: 0; background: var(--surface); }
.info-box .info-box-icon { width: 44px; height: 44px; align-self: center; border-radius: var(--radius-md); font-size: 18px; }
.info-box .info-box-text { font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); }
.info-box .info-box-number { font-size: 22px; line-height: 28px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }

/* ---------- 10. Listas ---------- */
.list-group-item { border-color: var(--border); color: var(--ink); }
.list-group-item.active { background-color: var(--surface-selected); border-color: var(--border); color: var(--primary); font-weight: 500; }
.list-group-item-action:hover { background-color: var(--page); }
.list-group:not(.list-group-flush) { border-radius: var(--radius-lg); }

@media (max-width: 767px) {
  .content-header { padding: var(--space-4) var(--space-1) var(--space-2); }
  .card-header, .card-body, .card-footer { padding-left: var(--space-4); padding-right: var(--space-4); }
  div.dataTables_wrapper div.dataTables_filter input { width: 100%; margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) { .dataTable td span.label > a > i.icon.btn-primary { transition: none; } }

/* =====================================================================
   MENÚ LATERAL (AdminLTE 3 .main-sidebar), 28 sep 2026
   No fija colores de texto ni fondo: los siguen mandando SIDEBAR_COLOR
   (.env) y el color por empresa de header.php. Hover, abierto y activo
   se calculan desde currentColor, así funcionan en menú claro u oscuro.
   Respeta sidebar-mini + sidebar-collapse. Revertir: borrar este bloque.
   ===================================================================== */
.main-sidebar {
  --sb-radius: 8px;
  --sb-line: rgba(26, 52, 61, .10);
}
.main-sidebar,
.main-sidebar.elevation-4 {
  box-shadow: 1px 0 0 var(--sb-line), 6px 0 18px rgba(26, 52, 61, .05) !important;
}

/* Marca */
.main-sidebar .brand-link {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .8rem 1rem;
  border-bottom: 1px solid color-mix(in srgb, currentColor 12%, transparent) !important;
}
.main-sidebar .brand-link .brand-image {
  float: none;
  flex-shrink: 0;
  margin: 0 !important;
  max-height: 30px;
  opacity: 1 !important;
  box-shadow: none !important;
}
.main-sidebar .brand-link .brand-text {
  font-weight: 600 !important;
  font-size: .95rem;
  letter-spacing: .01em;
}

/* Contenedor */
.main-sidebar .sidebar { padding-top: .5rem; padding-bottom: 1rem; }
.main-sidebar .nav-sidebar > .nav-item { margin-bottom: 2px; }
.main-sidebar .nav-sidebar .nav-header {
  padding: 1rem .8rem .35rem;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  opacity: .6;
}

/* Enlaces */
.main-sidebar .nav-sidebar .nav-link {
  position: relative;
  padding: .55rem .75rem;
  border-radius: var(--sb-radius);
  font-weight: 500;
  background-color: transparent;
  transition: background-color .15s ease, color .15s ease;
}
.main-sidebar .nav-sidebar .nav-link p { margin: 0; }
.main-sidebar .nav-sidebar .nav-link > .nav-icon {
  width: 1.5rem;
  margin-right: .55rem;
  text-align: center;
  opacity: .75;
  transition: opacity .15s ease;
}
.main-sidebar .nav-sidebar .nav-link > p > .right {
  opacity: .55;
  transition: transform .2s ease, opacity .15s ease;
}
.main-sidebar .nav-sidebar .nav-link:hover,
.main-sidebar .nav-sidebar .nav-link:focus {
  background-color: color-mix(in srgb, currentColor 7%, transparent) !important;
}
.main-sidebar .nav-sidebar .nav-link:hover > .nav-icon,
.main-sidebar .nav-sidebar .nav-link:hover > p > .right { opacity: 1; }
.main-sidebar .nav-sidebar .nav-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -2px;
}

/* Grupo abierto */
.main-sidebar .nav-sidebar .nav-item.menu-open > .nav-link,
.main-sidebar .nav-sidebar .nav-item.menu-is-opening > .nav-link {
  background-color: color-mix(in srgb, currentColor 5%, transparent) !important;
}
.main-sidebar .nav-sidebar .nav-item.menu-open > .nav-link > .nav-icon,
.main-sidebar .nav-sidebar .nav-item.menu-open > .nav-link > p > .right { opacity: 1; }

/* Activo (lo marca el script de templates/menu.php) */
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active {
  background-color: color-mix(in srgb, currentColor 12%, transparent) !important;
  font-weight: 600;
  box-shadow: none !important;
}
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active > .nav-icon { opacity: 1; }
.main-sidebar .nav-sidebar > .nav-item > .nav-link.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: .45rem;
  bottom: .45rem;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: currentColor;
}

/* Submenús */
.main-sidebar .nav-sidebar .nav-treeview {
  margin: .2rem 0 .4rem 1.45rem;
  padding-left: .45rem;
  border-left: 1px solid color-mix(in srgb, currentColor 14%, transparent);
  background: transparent;
}
.main-sidebar .nav-sidebar .nav-treeview > .nav-item { margin-bottom: 1px; }
.main-sidebar .nav-sidebar .nav-treeview .nav-link {
  width: auto; /* AdminLTE fija un ancho que se sale por la sangría */
  padding: .42rem .7rem;
  font-weight: 400;
}
.main-sidebar .nav-sidebar .nav-treeview .nav-link > .nav-icon {
  width: 1.1rem;
  margin-right: .45rem;
  font-size: .8rem;
}
.main-sidebar .nav-sidebar .nav-treeview .nav-icon.fa-circle,
.main-sidebar .nav-sidebar .nav-treeview .nav-icon.fa-dot-circle {
  font-size: .42rem;
  vertical-align: middle;
  opacity: .55;
}
.main-sidebar .nav-sidebar .nav-treeview .nav-link.active {
  background-color: color-mix(in srgb, currentColor 9%, transparent) !important;
  font-weight: 600;
  box-shadow: none !important;
}

/* Colapsado */
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-sidebar .nav-treeview {
  margin-left: 0;
  padding-left: 0;
  border-left: 0;
}
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .nav-sidebar .nav-link > .nav-icon { margin-right: 0; }
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .brand-link { padding-left: 1.35rem; }