/* ============================================================
   EL JAIBO UNDERGROUND — Overrides de Bootstrap 5
   Ajustes puntuales a componentes nativos del framework que no
   quedan cubiertos por las variables de design-system.css.
   ============================================================ */

/* ---------- CONTENEDOR ---------- */
.container, .container-fluid, .container-lg, .container-xl {
  padding-inline: var(--space-sm);
}

/* ---------- ALERTAS ---------- */
.alert {
  border-radius: var(--radius-md);
  border-width: 1px;
  font-size: var(--fs-small);
  padding: var(--space-sm) var(--space-md);
}
.alert-warning {
  background: rgba(242,194,0,.1);
  border-color: rgba(242,194,0,.35);
  color: var(--jaibo-yellow);
}
.alert-danger {
  background: rgba(193,39,45,.12);
  border-color: rgba(193,39,45,.4);
  color: #F09A9D;
}
.alert-success {
  background: rgba(62,142,90,.12);
  border-color: rgba(62,142,90,.4);
  color: #7FD3A0;
}
.alert-info {
  background: var(--jaibo-surface);
  border-color: var(--jaibo-border-str);
  color: var(--jaibo-concrete);
}

/* ---------- MODALES ---------- */
.modal-content {
  background: var(--jaibo-surface);
  border: 1px solid var(--jaibo-border-str);
  border-radius: var(--radius-lg);
}
.modal-header, .modal-footer { border-color: var(--jaibo-border); }
.modal-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  letter-spacing: var(--ls-display);
}
.btn-close { filter: invert(1) grayscale(1); opacity: .7; }
.btn-close:hover { opacity: 1; }

/* ---------- OFFCANVAS ---------- */
.offcanvas {
  background: var(--jaibo-black);
  border-left: 1px solid var(--jaibo-border);
}
.offcanvas-header { border-bottom: 1px solid var(--jaibo-border); }
.offcanvas-title {
  font-family: var(--font-display);
  text-transform: uppercase;
}

/* ---------- BREADCRUMB ---------- */
.breadcrumb {
  font-family: var(--font-ui);
  font-size: var(--fs-small);
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: var(--space-md);
}
.breadcrumb-item + .breadcrumb-item::before { color: var(--jaibo-concrete); }
.breadcrumb-item a { color: var(--jaibo-concrete); }
.breadcrumb-item a:hover { color: var(--jaibo-yellow); }
.breadcrumb-item.active { color: var(--jaibo-white); }

/* ---------- TABLAS ---------- */
.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--jaibo-white);
  --bs-table-border-color: var(--jaibo-border);
  --bs-table-striped-bg: rgba(255,255,255,.03);
  --bs-table-striped-color: var(--jaibo-white);
  --bs-table-hover-bg: rgba(255,255,255,.05);
  --bs-table-hover-color: var(--jaibo-white);
}
.table > thead {
  font-family: var(--font-ui);
  font-size: var(--fs-small);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--jaibo-concrete);
}

/* ---------- BADGES NATIVOS ---------- */
.badge {
  font-family: var(--font-ui);
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
}

/* ---------- FORM CHECK ---------- */
.form-check-input {
  background-color: var(--jaibo-surface);
  border-color: var(--jaibo-border-str);
}
.form-check-input:checked {
  background-color: var(--jaibo-yellow);
  border-color: var(--jaibo-yellow);
}
.form-check-input:focus { box-shadow: none; border-color: var(--jaibo-yellow); }
.form-check-label { color: var(--jaibo-concrete); font-size: var(--fs-small); }

/* ---------- TOOLTIP ---------- */
.tooltip-inner {
  background: var(--jaibo-surface-2);
  color: var(--jaibo-white);
  font-family: var(--font-ui);
  font-size: var(--fs-micro);
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: var(--radius-sm);
}

/* ---------- DROPDOWN GENERICO ---------- */
.dropdown-menu {
  background: var(--jaibo-surface);
  border-color: var(--jaibo-border);
}
.dropdown-divider { border-color: var(--jaibo-border); }

/* ---------- CORRECCION: BS5 pone overflow hidden en el body
   al abrir modales, lo que rompe el scroll-padding del ancla. ---------- */
body.modal-open { padding-right: 0 !important; }