/* ==========================================================================
   ChurSys — Capa de compatibilidad Bootstrap 4 -> Bootstrap 5
   --------------------------------------------------------------------------
   El proyecto tiene ~220 plantillas escritas con clases y atributos de
   Bootstrap 4 (y de AdminLTE 3). En vez de reescribirlas todas, este archivo
   traduce las clases ELIMINADAS o RENOMBRADAS por Bootstrap 5, de modo que
   el marcado antiguo siga funcionando sobre ArchitectUI.

   IMPORTANTE: aquí solo van EQUIVALENCIAS (1:1). Nada de estilo visual.
   La apariencia la pone ArchitectUI + chursys-architectui.css (capa fina).

   Orden de carga:
     architectui/assets/styles/main.css
     architectui/assets/styles/vendors.css
     bs4-compat.css            <-- este archivo
     chursys-architectui.css   <-- capa fina de marca
   ========================================================================== */

/* ==========================================================================
   1. Utilidades de Bootstrap 4 eliminadas en Bootstrap 5
   ========================================================================== */

/* --- Escala de espaciado lateral de Bootstrap 4 (.ml-* / .mr-* / .pl-* / .pr-*) --- */
  .ml-5 { margin-left: 3rem !important; }
  .ml-4 { margin-left: 1.5rem !important; }
  .ml-0 { margin-left: 0 !important; }
  .ml-3 { margin-left: 1rem !important; }
  .ml-2 { margin-left: 0.5rem !important; }
  .ml-1 { margin-left: 0.25rem !important; }
  .mr-5 { margin-right: 3rem !important; }
  .mr-4 { margin-right: 1.5rem !important; }
  .mr-0 { margin-right: 0 !important; }
  .mr-3 { margin-right: 1rem !important; }
  .mr-2 { margin-right: 0.5rem !important; }
  .mr-1 { margin-right: 0.25rem !important; }
  .pl-5 { padding-left: 3rem !important; }
  .pl-4 { padding-left: 1.5rem !important; }
  .pl-0 { padding-left: 0 !important; }
  .pl-3 { padding-left: 1rem !important; }
  .pl-2 { padding-left: 0.5rem !important; }
  .pl-1 { padding-left: 0.25rem !important; }
  .pr-5 { padding-right: 3rem !important; }
  .pr-4 { padding-right: 1.5rem !important; }
  .pr-0 { padding-right: 0 !important; }
  .pr-3 { padding-right: 1rem !important; }
  .pr-2 { padding-right: 0.5rem !important; }
  .pr-1 { padding-right: 0.25rem !important; }
@media (min-width: 576px) {
  .ml-sm-5 { margin-left: 3rem !important; }
  .ml-sm-4 { margin-left: 1.5rem !important; }
  .ml-sm-0 { margin-left: 0 !important; }
  .ml-sm-3 { margin-left: 1rem !important; }
  .ml-sm-2 { margin-left: 0.5rem !important; }
  .ml-sm-1 { margin-left: 0.25rem !important; }
  .mr-sm-5 { margin-right: 3rem !important; }
  .mr-sm-4 { margin-right: 1.5rem !important; }
  .mr-sm-0 { margin-right: 0 !important; }
  .mr-sm-3 { margin-right: 1rem !important; }
  .mr-sm-2 { margin-right: 0.5rem !important; }
  .mr-sm-1 { margin-right: 0.25rem !important; }
  .pl-sm-5 { padding-left: 3rem !important; }
  .pl-sm-4 { padding-left: 1.5rem !important; }
  .pl-sm-0 { padding-left: 0 !important; }
  .pl-sm-3 { padding-left: 1rem !important; }
  .pl-sm-2 { padding-left: 0.5rem !important; }
  .pl-sm-1 { padding-left: 0.25rem !important; }
  .pr-sm-5 { padding-right: 3rem !important; }
  .pr-sm-4 { padding-right: 1.5rem !important; }
  .pr-sm-0 { padding-right: 0 !important; }
  .pr-sm-3 { padding-right: 1rem !important; }
  .pr-sm-2 { padding-right: 0.5rem !important; }
  .pr-sm-1 { padding-right: 0.25rem !important; }
}
@media (min-width: 768px) {
  .ml-md-5 { margin-left: 3rem !important; }
  .ml-md-4 { margin-left: 1.5rem !important; }
  .ml-md-0 { margin-left: 0 !important; }
  .ml-md-3 { margin-left: 1rem !important; }
  .ml-md-2 { margin-left: 0.5rem !important; }
  .ml-md-1 { margin-left: 0.25rem !important; }
  .mr-md-5 { margin-right: 3rem !important; }
  .mr-md-4 { margin-right: 1.5rem !important; }
  .mr-md-0 { margin-right: 0 !important; }
  .mr-md-3 { margin-right: 1rem !important; }
  .mr-md-2 { margin-right: 0.5rem !important; }
  .mr-md-1 { margin-right: 0.25rem !important; }
  .pl-md-5 { padding-left: 3rem !important; }
  .pl-md-4 { padding-left: 1.5rem !important; }
  .pl-md-0 { padding-left: 0 !important; }
  .pl-md-3 { padding-left: 1rem !important; }
  .pl-md-2 { padding-left: 0.5rem !important; }
  .pl-md-1 { padding-left: 0.25rem !important; }
  .pr-md-5 { padding-right: 3rem !important; }
  .pr-md-4 { padding-right: 1.5rem !important; }
  .pr-md-0 { padding-right: 0 !important; }
  .pr-md-3 { padding-right: 1rem !important; }
  .pr-md-2 { padding-right: 0.5rem !important; }
  .pr-md-1 { padding-right: 0.25rem !important; }
}
@media (min-width: 992px) {
  .ml-lg-5 { margin-left: 3rem !important; }
  .ml-lg-4 { margin-left: 1.5rem !important; }
  .ml-lg-0 { margin-left: 0 !important; }
  .ml-lg-3 { margin-left: 1rem !important; }
  .ml-lg-2 { margin-left: 0.5rem !important; }
  .ml-lg-1 { margin-left: 0.25rem !important; }
  .mr-lg-5 { margin-right: 3rem !important; }
  .mr-lg-4 { margin-right: 1.5rem !important; }
  .mr-lg-0 { margin-right: 0 !important; }
  .mr-lg-3 { margin-right: 1rem !important; }
  .mr-lg-2 { margin-right: 0.5rem !important; }
  .mr-lg-1 { margin-right: 0.25rem !important; }
  .pl-lg-5 { padding-left: 3rem !important; }
  .pl-lg-4 { padding-left: 1.5rem !important; }
  .pl-lg-0 { padding-left: 0 !important; }
  .pl-lg-3 { padding-left: 1rem !important; }
  .pl-lg-2 { padding-left: 0.5rem !important; }
  .pl-lg-1 { padding-left: 0.25rem !important; }
  .pr-lg-5 { padding-right: 3rem !important; }
  .pr-lg-4 { padding-right: 1.5rem !important; }
  .pr-lg-0 { padding-right: 0 !important; }
  .pr-lg-3 { padding-right: 1rem !important; }
  .pr-lg-2 { padding-right: 0.5rem !important; }
  .pr-lg-1 { padding-right: 0.25rem !important; }
}
@media (min-width: 1200px) {
  .ml-xl-5 { margin-left: 3rem !important; }
  .ml-xl-4 { margin-left: 1.5rem !important; }
  .ml-xl-0 { margin-left: 0 !important; }
  .ml-xl-3 { margin-left: 1rem !important; }
  .ml-xl-2 { margin-left: 0.5rem !important; }
  .ml-xl-1 { margin-left: 0.25rem !important; }
  .mr-xl-5 { margin-right: 3rem !important; }
  .mr-xl-4 { margin-right: 1.5rem !important; }
  .mr-xl-0 { margin-right: 0 !important; }
  .mr-xl-3 { margin-right: 1rem !important; }
  .mr-xl-2 { margin-right: 0.5rem !important; }
  .mr-xl-1 { margin-right: 0.25rem !important; }
  .pl-xl-5 { padding-left: 3rem !important; }
  .pl-xl-4 { padding-left: 1.5rem !important; }
  .pl-xl-0 { padding-left: 0 !important; }
  .pl-xl-3 { padding-left: 1rem !important; }
  .pl-xl-2 { padding-left: 0.5rem !important; }
  .pl-xl-1 { padding-left: 0.25rem !important; }
  .pr-xl-5 { padding-right: 3rem !important; }
  .pr-xl-4 { padding-right: 1.5rem !important; }
  .pr-xl-0 { padding-right: 0 !important; }
  .pr-xl-3 { padding-right: 1rem !important; }
  .pr-xl-2 { padding-right: 0.5rem !important; }
  .pr-xl-1 { padding-right: 0.25rem !important; }
}

/* --- Márgenes negativos de Bootstrap 4 (.ml-n* / .mr-n* / .mx-n* / .mt-n* / .mb-n*) --- */
.ml-n2 { margin-left: -0.5rem !important; }
.mr-n2 { margin-right: -0.5rem !important; }
.mt-n2 { margin-top: -0.5rem !important; }
.mb-n2 { margin-bottom: -0.5rem !important; }
.mx-n2 { margin-right: -0.5rem !important; margin-left: -0.5rem !important; }
.my-n2 { margin-top: -0.5rem !important; margin-bottom: -0.5rem !important; }
.ml-n4 { margin-left: -1.5rem !important; }
.mr-n4 { margin-right: -1.5rem !important; }
.mt-n4 { margin-top: -1.5rem !important; }
.mb-n4 { margin-bottom: -1.5rem !important; }
.mx-n4 { margin-right: -1.5rem !important; margin-left: -1.5rem !important; }
.my-n4 { margin-top: -1.5rem !important; margin-bottom: -1.5rem !important; }
.ml-n5 { margin-left: -3rem !important; }
.mr-n5 { margin-right: -3rem !important; }
.mt-n5 { margin-top: -3rem !important; }
.mb-n5 { margin-bottom: -3rem !important; }
.mx-n5 { margin-right: -3rem !important; margin-left: -3rem !important; }
.my-n5 { margin-top: -3rem !important; margin-bottom: -3rem !important; }
.ml-n1 { margin-left: -0.25rem !important; }
.mr-n1 { margin-right: -0.25rem !important; }
.mt-n1 { margin-top: -0.25rem !important; }
.mb-n1 { margin-bottom: -0.25rem !important; }
.mx-n1 { margin-right: -0.25rem !important; margin-left: -0.25rem !important; }
.my-n1 { margin-top: -0.25rem !important; margin-bottom: -0.25rem !important; }
.ml-n3 { margin-left: -1rem !important; }
.mr-n3 { margin-right: -1rem !important; }
.mt-n3 { margin-top: -1rem !important; }
.mb-n3 { margin-bottom: -1rem !important; }
.mx-n3 { margin-right: -1rem !important; margin-left: -1rem !important; }
.my-n3 { margin-top: -1rem !important; margin-bottom: -1rem !important; }

/* --- Flotantes --- */
.float-left { float: left !important; }
.float-right { float: right !important; }
.float-none { float: none !important; }

/* --- Márgenes automáticos --- */
.ml-auto { margin-left: auto !important; }
.mr-auto { margin-right: auto !important; }

/* --- Flotantes responsivos --- */
@media (min-width: 576px) {
  .float-sm-left { float: left !important; }
  .float-sm-right { float: right !important; }
}
@media (min-width: 768px) {
  .float-md-left { float: left !important; }
  .float-md-right { float: right !important; }
}
@media (min-width: 992px) {
  .float-lg-left { float: left !important; }
  .float-lg-right { float: right !important; }
}
@media (min-width: 1200px) {
  .float-xl-left { float: left !important; }
  .float-xl-right { float: right !important; }
}

/* --- Visibilidad heredada (Bootstrap 4 alpha) --- */
@media (min-width: 768px) {
  .hidden-md-up { display: none !important; }
}

/* --- Colores de texto heredados --- */
.text-gray { color: #6c757d !important; }
.uppercase { text-transform: uppercase !important; }

/* --- Tamaños de texto de AdminLTE 3 --- */
.text-xs { font-size: .7rem !important; }
.text-sm { font-size: .85rem !important; }
.text-md { font-size: 1rem !important; }
.text-lg { font-size: 1.15rem !important; }
.text-xl { font-size: 1.35rem !important; }

/* --- Alineación de texto --- */
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }

/* --- Bordes por lado --- */
.border-left { border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; }
.border-right { border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; }
.border-left-0 { border-left: 0 !important; }
.border-right-0 { border-right: 0 !important; }
.border-top-0 { border-top: 0 !important; }
.border-bottom-0 { border-bottom: 0 !important; }

/* --- Radios por lado --- */
.rounded-left { border-top-left-radius: var(--bs-border-radius) !important; border-bottom-left-radius: var(--bs-border-radius) !important; }
.rounded-right { border-top-right-radius: var(--bs-border-radius) !important; border-bottom-right-radius: var(--bs-border-radius) !important; }

/* --- Tipografía --- */
.font-weight-bold      { font-weight: 700 !important; }
.font-weight-bolder    { font-weight: 800 !important; }
.font-weight-semibold  { font-weight: 600 !important; }
.font-weight-medium    { font-weight: 500 !important; }
.font-weight-normal    { font-weight: 400 !important; }
.font-weight-light     { font-weight: 300 !important; }
.font-weight-lighter   { font-weight: 200 !important; }
.font-italic           { font-style: italic !important; }
.text-monospace        { font-family: var(--bs-font-monospace) !important; }
.text-nowrap           { white-space: nowrap !important; }
.text-wrap             { white-space: normal !important; }
.text-truncate         { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* BS5 ya no incluye .sr-only: .visually-hidden es el reemplazo */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
}

/* --- Visibilidad --- */
.invisible { visibility: hidden !important; }
.visible   { visibility: visible !important; }

/* ==========================================================================
   2. Colores contextuales que Bootstrap 5 renombró (badge-*)
   ========================================================================== */

.badge-primary   { background-color: var(--bs-primary) !important;   color: #fff !important; }
.badge-secondary { background-color: var(--bs-secondary) !important; color: #fff !important; }
.badge-success   { background-color: var(--bs-success) !important;   color: #fff !important; }
.badge-info      { background-color: var(--bs-info) !important;      color: #000 !important; }
.badge-warning   { background-color: var(--bs-warning) !important;   color: #000 !important; }
.badge-danger    { background-color: var(--bs-danger) !important;    color: #fff !important; }
.badge-light     { background-color: var(--bs-light) !important;     color: #000 !important; }
.badge-dark      { background-color: var(--bs-dark) !important;      color: #fff !important; }
.badge-white     { background-color: #fff !important;                color: #000 !important; }
.badge-pill      { border-radius: var(--bs-border-radius-pill) !important; }

/* Botón "default" de AdminLTE 3 -> secondary de Bootstrap 5 */
.btn-default {
  --bs-btn-color: var(--bs-body-color);
  --bs-btn-bg: var(--bs-body-bg);
  --bs-btn-border-color: var(--bs-border-color);
  --bs-btn-hover-color: var(--bs-body-color);
  --bs-btn-hover-bg: var(--bs-tertiary-bg);
  --bs-btn-hover-border-color: var(--bs-border-color);
  --bs-btn-active-color: var(--bs-body-color);
  --bs-btn-active-bg: var(--bs-tertiary-bg);
  --bs-btn-active-border-color: var(--bs-border-color);
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border: var(--bs-border-width) solid var(--bs-btn-border-color);
}

/* ==========================================================================
   3. Formularios: estructura de Bootstrap 4
   ========================================================================== */

.form-group { margin-bottom: 1rem; }
.form-group > label { display: inline-block; margin-bottom: .5rem; }
.form-row { display: flex; flex-wrap: wrap; margin-right: -5px; margin-left: -5px; }
.form-row > .col,
.form-row > [class*="col-"] { padding-right: 5px; padding-left: 5px; }
.form-inline { display: flex; flex-flow: row wrap; align-items: center; }
.form-inline .form-group { display: flex; flex: 0 0 auto; flex-flow: row wrap; align-items: center; margin-bottom: 0; }
.form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; }

/* .custom-select (Bootstrap 4) -> .form-select (Bootstrap 5) */
.custom-select {
  display: block;
  width: 100%;
  padding: .375rem 2.25rem .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  background-image: var(--bs-form-select-bg-img);
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  appearance: none;
}
.custom-select-sm { padding-top: .25rem; padding-bottom: .25rem; padding-left: .5rem; font-size: .875rem; }
.custom-select-lg { padding-top: .5rem; padding-bottom: .5rem; padding-left: 1rem; font-size: 1.25rem; }

/* input-group-prepend / append (Bootstrap 4) -> hijos directos (Bootstrap 5) */
.input-group > .input-group-prepend,
.input-group > .input-group-append {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
}
.input-group > .input-group-prepend > *,
.input-group > .input-group-append > * { border-radius: 0 !important; }

.input-group > :first-child:not(.dropdown-menu),
.input-group > .input-group-prepend:first-child > :first-child,
.input-group > .input-group-append:first-child > :first-child {
  border-top-left-radius: var(--bs-border-radius) !important;
  border-bottom-left-radius: var(--bs-border-radius) !important;
}
.input-group > :last-child:not(.dropdown-menu),
.input-group > .input-group-append:last-child > :last-child,
.input-group > .input-group-prepend:last-child > :last-child {
  border-top-right-radius: var(--bs-border-radius) !important;
  border-bottom-right-radius: var(--bs-border-radius) !important;
}
.input-group-append > .btn + .btn,
.input-group-prepend > .btn + .btn { margin-left: calc(var(--bs-border-width) * -1); }

/* ==========================================================================
   4. Checks, radios y switches de Bootstrap 4 (.custom-control)
   ========================================================================== */

.custom-control {
  position: relative;
  display: block;
  min-height: 1.5rem;
  padding-left: 1.5rem;
}
.custom-control-inline { display: inline-flex; margin-right: 1rem; }

.custom-control-input {
  position: absolute;
  z-index: -1;
  width: 1rem;
  height: 1.25rem;
  opacity: 0;
}
.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .25);
}
.custom-control-input:disabled ~ .custom-control-label { color: var(--bs-secondary-color); }
.custom-control-input:disabled ~ .custom-control-label::before { background-color: var(--bs-secondary-bg); }

.custom-control-label {
  position: relative;
  margin-bottom: 0;
  vertical-align: top;
  cursor: pointer;
}
.custom-control-label::before {
  position: absolute;
  top: .25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: var(--bs-body-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
}
.custom-control-label::after {
  position: absolute;
  top: .25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background: no-repeat 50% / 50% 50%;
}
.custom-checkbox .custom-control-label::before { border-radius: .25rem; }
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3 6-6'/%3e%3c/svg%3e");
}
.custom-radio .custom-control-label::before { border-radius: 50%; }
.custom-radio .custom-control-input:checked ~ .custom-control-label::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}
.custom-switch { padding-left: 2.25rem; }
.custom-switch .custom-control-label::before {
  left: -2.25rem;
  width: 1.75rem;
  pointer-events: all;
  border-radius: .5rem;
}
.custom-switch .custom-control-label::after {
  top: calc(.25rem + 2px);
  left: calc(-2.25rem + 2px);
  width: calc(1rem - 4px);
  height: calc(1rem - 4px);
  background-color: var(--bs-secondary-color);
  border-radius: .5rem;
  transition: transform .15s ease-in-out, background-color .15s ease-in-out;
}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
  background-color: var(--bs-body-bg);
  transform: translateX(.75rem);
}

/* File input de Bootstrap 4 */
.custom-file { position: relative; display: inline-block; width: 100%; height: calc(1.5em + .75rem + 2px); margin-bottom: 0; }
.custom-file-input { position: relative; z-index: 2; width: 100%; height: inherit; margin: 0; opacity: 0; }
.custom-file-label {
  position: absolute;
  top: 0; right: 0; left: 0; z-index: 1;
  height: inherit;
  padding: .375rem .75rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  background-color: var(--bs-body-bg);
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
}

/* ==========================================================================
   5. Componentes de Bootstrap 4 eliminados en Bootstrap 5
   ========================================================================== */

/* .btn-block */
.btn-block { display: block; width: 100%; }
.btn-block + .btn-block { margin-top: .5rem; }

/* .close (modal / alert) -> .btn-close */
.close {
  float: right;
  padding: 0;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
  background: transparent;
  border: 0;
}
.close:hover { opacity: .75; text-decoration: none; }
.close:not(:disabled):not(.disabled) { cursor: pointer; }
button.close { appearance: none; }

.alert { position: relative; }
.alert-dismissible { padding-right: 3rem; }
.alert-dismissible > .close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  padding: .7rem .95rem;
  color: inherit;
  opacity: .55;
  line-height: 1;
  text-shadow: none;
}
.alert-dismissible > .close:hover { opacity: 1; }

/* .media (objeto multimedia) */
.media { display: flex; align-items: flex-start; }
.media-body { flex: 1; }
.media > * + * { margin-left: 1rem; }

/* .jumbotron */
.jumbotron {
  padding: 2rem 1rem;
  margin-bottom: 2rem;
  background-color: var(--bs-tertiary-bg);
  border-radius: var(--bs-border-radius-lg);
}

/* .embed-responsive -> .ratio */
.embed-responsive { position: relative; display: block; width: 100%; padding: 0; overflow: hidden; }
.embed-responsive::before { display: block; content: ""; }
.embed-responsive-21by9::before { padding-top: 42.857143%; }
.embed-responsive-16by9::before { padding-top: 56.25%; }
.embed-responsive-4by3::before   { padding-top: 75%; }
.embed-responsive-1by1::before   { padding-top: 100%; }
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 100%; height: 100%;
  border: 0;
}

/* Rejillas eliminadas: no-gutters / card-deck */
.no-gutters { margin-right: 0; margin-left: 0; }
.no-gutters > .col,
.no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; }

.card-deck { display: flex; flex-flow: row wrap; margin-right: -.75rem; margin-left: -.75rem; }
.card-deck .card { flex: 1 0 0%; margin-right: .75rem; margin-bottom: 0; margin-left: .75rem; }

/* Alineación de menús desplegables */
.dropdown-menu-right { right: 0; left: auto; }
.dropdown-menu-left  { right: auto; left: 0; }

/* ==========================================================================
   6. Restos de AdminLTE 3 usados por las plantillas actuales
   ========================================================================== */

/* .img-circle (AdminLTE 3) */
.img-circle { border-radius: 50% !important; }

/* .elevation-N (AdminLTE 3) */
.elevation-0 { box-shadow: none !important; }
.elevation-1 { box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24) !important; }
.elevation-2 { box-shadow: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(0, 0, 0, .23) !important; }
.elevation-3 { box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23) !important; }
.elevation-4 { box-shadow: 0 14px 28px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .22) !important; }

/* Título de tarjeta usado por el dashboard (AdminLTE 3 .card-header-title) */
.card-header-title { margin: 0; font-size: 1rem; font-weight: 600; }

/* .small-box con el marcado antiguo de AdminLTE 3 (.icon > i en vez de svg) */
.small-box .icon {
  position: absolute;
  top: 15px;
  right: 15px;
  z-index: 0;
  height: 70px;
  font-size: 70px;
  line-height: 1;
  color: rgba(0, 0, 0, .15);
  transition: transform .3s linear;
}
.small-box:hover .icon { transform: scale(1.1); }

/* Botón compacto de acciones en tablas (AdminLTE 3 .btn-xs) */
.btn-xs {
  --bs-btn-padding-y: .15rem;
  --bs-btn-padding-x: .45rem;
  --bs-btn-font-size: .72rem;
  --bs-btn-border-radius: .3rem;
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-size: var(--bs-btn-font-size);
  line-height: 1.4;
  border-radius: var(--bs-btn-border-radius);
}

/* ==========================================================================
   7. Integraciones de terceros: ajustes mínimos para Bootstrap 5
   ========================================================================== */

div.dataTables_wrapper div.dataTables_length select { display: inline-block; width: auto; }
div.dataTables_wrapper div.dataTables_filter { text-align: right; }
div.dataTables_wrapper div.dataTables_filter input { display: inline-block; width: auto; margin-left: .5em; }
div.dataTables_wrapper div.dataTables_info { padding-top: .85em; white-space: nowrap; }
div.dataTables_wrapper div.dataTables_paginate { margin: 0; white-space: nowrap; text-align: right; }
div.dataTables_wrapper div.dataTables_paginate ul.pagination { margin: 2px 0; white-space: nowrap; justify-content: flex-end; }
div.dataTables_wrapper div.dataTables_processing { position: absolute; top: 50%; left: 50%; margin-left: -100px; margin-top: -26px; }

/* Select2 (tema bootstrap4) */
.select2-container--bootstrap4 .select2-selection--single { height: calc(1.5em + .75rem + 2px); }
.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered { line-height: calc(1.5em + .75rem); }
.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow { height: calc(1.5em + .75rem); }
.select2-container { max-width: 100%; }
.select2-container--bootstrap4.select2-container--focus .select2-selection,
.select2-container--bootstrap4.select2-container--open .select2-selection { border-color: var(--bs-primary); }
.select2-dropdown { z-index: 1060; }

/* tempus-dominus (widget de fecha BS4) */
.bootstrap-datetimepicker-widget.dropdown-menu { padding: .5rem; }
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
  background-color: var(--bs-primary);
  color: #fff;
}

/* ==========================================================================
   8. Utilidades de las plantillas antiguas (AdminLTE 3 / Velzon)
   ========================================================================== */

/* Encabezados de tabla */
.thead-light th { background-color: #f1f4f6; color: #495057; }
.thead-dark th { background-color: #343a40; color: #fff; }

/* Colores suaves */
.bg-soft-primary { background-color: rgba(63, 106, 216, .12) !important; color: #2a4fa8 !important; }
.bg-soft-success { background-color: rgba(58, 196, 125, .16) !important; color: #1d7a4d !important; }
.bg-soft-warning { background-color: rgba(247, 185, 36, .18) !important; color: #8a6400 !important; }
.bg-soft-danger  { background-color: rgba(217, 37, 80, .14) !important; color: #a1123a !important; }
.bg-soft-info    { background-color: rgba(22, 170, 255, .14) !important; color: #0b6fa8 !important; }

.badge-soft-primary { background-color: rgba(63, 106, 216, .14); color: #2a4fa8; }
.badge-soft-success { background-color: rgba(58, 196, 125, .18); color: #1d7a4d; }
.badge-soft-warning { background-color: rgba(247, 185, 36, .2); color: #8a6400; }
.badge-soft-danger  { background-color: rgba(217, 37, 80, .16); color: #a1123a; }
.badge-soft-info    { background-color: rgba(22, 170, 255, .16); color: #0b6fa8; }

.btn-soft-primary { background-color: rgba(63, 106, 216, .12); color: #2a4fa8; border-color: transparent; }
.btn-soft-success { background-color: rgba(58, 196, 125, .16); color: #1d7a4d; border-color: transparent; }
.btn-soft-warning { background-color: rgba(247, 185, 36, .2); color: #8a6400; border-color: transparent; }
.btn-soft-danger  { background-color: rgba(217, 37, 80, .14); color: #a1123a; border-color: transparent; }
.btn-soft-info    { background-color: rgba(22, 170, 255, .14); color: #0b6fa8; border-color: transparent; }

.border-dashed { border-style: dashed !important; }

/* Iconos de menú en enlaces sueltos */
.nav-icon { margin-right: .35rem; }

/* Contenedor de notificaciones toastr */
.toasts-top-right {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 1080;
  width: 100%;
  max-width: 360px;
}

/* Página de error 404/500 */
.error-page {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2rem;
  padding: 2rem;
  background: #fff;
  border-radius: var(--ch-radius);
  box-shadow: 0 .46875rem 2.1875rem rgba(4, 9, 20, .05);
}

.error-page .headline {
  margin: 0;
  font-size: 5rem;
  font-weight: 700;
  line-height: 1;
}

.error-page .error-content h3 {
  margin-top: 0;
  font-size: 1.25rem;
}

/* Cabecera tipo Velzon usada en algunas vistas del ERP */
.page-title-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: 1rem;
}

.page-title-box h4 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
}

.nav-tabs-custom > .nav-tabs {
  margin-bottom: 1rem;
  border-bottom: 1px solid #dee2e6;
}

/* ==========================================================================
   9. Impresión
   ========================================================================== */

@media print {
  .main-header, .app-header,
  .main-sidebar, .app-sidebar,
  .main-footer, .app-footer,
  .no-print { display: none !important; }
}