// ============================================================================
// Capa de compatibilidad: utilidades de Bootstrap 4 re-nombradas/eliminadas en Bootstrap 5
// ============================================================================

// --- Espaciado ml/mr/pl/pr (BS5 las renombró a ms/me/ps/pe) ---
// Generado a partir del mapa $spacers y $grid-breakpoints de Bootstrap 5.
@each $size, $value in $spacers {
    .ml-#{$size} { margin-left: $value !important; }
    .mr-#{$size} { margin-right: $value !important; }
    .pl-#{$size} { padding-left: $value !important; }
    .pr-#{$size} { padding-right: $value !important; }
}

.ml-auto { margin-left: auto !important; }
.mr-auto { margin-right: auto !important; }

@each $breakpoint in map-keys($grid-breakpoints) {
    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

    @include media-breakpoint-up($breakpoint) {
        @each $size, $value in $spacers {
            .ml#{$infix}-#{$size} { margin-left: $value !important; }
            .mr#{$infix}-#{$size} { margin-right: $value !important; }
            .pl#{$infix}-#{$size} { padding-left: $value !important; }
            .pr#{$infix}-#{$size} { padding-right: $value !important; }
        }
        .ml#{$infix}-auto { margin-left: auto !important; }
        .mr#{$infix}-auto { margin-right: auto !important; }
    }
}

// --- sr-only / sr-only-focusable (BS5 → visually-hidden / -focusable) ---
.sr-only { @extend .visually-hidden; }
.sr-only-focusable { @extend .visually-hidden-focusable; }

// --- font-weight-* (BS5 → fw-*) ---
.font-weight-bold { font-weight: $font-weight-bold !important; }
.font-weight-bolder { font-weight: $font-weight-bolder !important; }
.font-weight-normal { font-weight: $font-weight-normal !important; }
.font-weight-light { font-weight: $font-weight-light !important; }
.font-weight-lighter { font-weight: $font-weight-lighter !important; }
.font-weight-medium { font-weight: $font-weight-medium !important; }
.font-weight-semibold { font-weight: $font-weight-semibold !important; }
.font-italic { font-style: italic !important; }
.text-monospace { font-family: $font-family-monospace !important; }

// --- no-gutters (BS5 utiliza g-0 en la fila) ---
.no-gutters {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
    & > .col,
    & > [class*="col-"] {
        padding-right: 0;
        padding-left: 0;
    }
}