/*!
 * BildPress — Bootstrap 4 -> 5.3.8 upgrade compatibility layer
 * ---------------------------------------------------------------
 * The theme's vendored bootstrap.min.css / bootstrap.rtl.min.css /
 * bootstrap.bundle.min.js are genuine Bootstrap 5.3.8 builds. Bootstrap 5
 * renamed or removed several Bootstrap 4 utility classes. All PHP markup in
 * the bildpress theme and the bdevs-element / bdevs-toolkit plugins has
 * already been updated to use the real Bootstrap 5.3.8 class names.
 *
 * This file is a safety net only, for the exact legacy class names that
 * were found in use (no-gutters, embed-responsive, sr-only, text-left,
 * text-right). It re-creates their original Bootstrap 4 behaviour so that
 * any occurrence outside static template files — e.g. Elementor content
 * already saved in the database, ACF field values, or WooCommerce product
 * text — keeps rendering correctly instead of silently losing its styling
 * now that bootstrap.min.css no longer defines these selectors.
 *
 * Breakpoints below match Bootstrap 5.3.8 exactly (sm/md/lg/xl/xxl:
 * 576/768/992/1200/1400px) so behaviour stays identical to a real
 * Bootstrap 5.3.8 utility class at every device width — mobile, tablet,
 * and desktop.
 *
 * No rules are included here for Bootstrap 4 classes that were never found
 * anywhere in these three codebases (e.g. custom-control, custom-select,
 * badge-*, jumbotron, card-deck, form-row, dropdown-menu-right/left,
 * thead-light/dark, font-weight-*) — there is nothing in this project for
 * them to fix, so they are intentionally left out.
 */

/* -------------------------------------------------------------------- */
/* .no-gutters -> removed in Bootstrap 5, replaced by the .g-0 utility.  */
/* Reproduces Bootstrap 4's original rule verbatim.                      */
/* -------------------------------------------------------------------- */
.no-gutters {
	margin-right: 0;
	margin-left: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
	padding-right: 0;
	padding-left: 0;
}

/* -------------------------------------------------------------------- */
/* .embed-responsive -> removed in Bootstrap 5, replaced by .ratio.     */
/* Reproduces Bootstrap 4's original aspect-ratio component.             */
/* -------------------------------------------------------------------- */
.embed-responsive {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	overflow: hidden;
}
.embed-responsive::before {
	display: block;
	content: "";
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.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%; }

/* -------------------------------------------------------------------- */
/* .sr-only -> renamed to .visually-hidden in Bootstrap 5.               */
/* Reproduces Bootstrap 4's original rule verbatim.                      */
/* -------------------------------------------------------------------- */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.sr-only-focusable:not(:focus) {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* -------------------------------------------------------------------- */
/* .text-left / .text-right -> renamed to .text-start / .text-end.       */
/* Included with the same responsive infixes Bootstrap 4 shipped, at the */
/* real Bootstrap 5.3.8 breakpoints, for mobile/tablet/desktop parity.   */
/* -------------------------------------------------------------------- */
.text-left  { text-align: left !important; }
.text-right { text-align: right !important; }

@media (min-width: 576px) {
	.text-sm-left  { text-align: left !important; }
	.text-sm-right { text-align: right !important; }
}
@media (min-width: 768px) {
	.text-md-left  { text-align: left !important; }
	.text-md-right { text-align: right !important; }
}
@media (min-width: 992px) {
	.text-lg-left  { text-align: left !important; }
	.text-lg-right { text-align: right !important; }
}
@media (min-width: 1200px) {
	.text-xl-left  { text-align: left !important; }
	.text-xl-right { text-align: right !important; }
}
@media (min-width: 1400px) {
	.text-xxl-left  { text-align: left !important; }
	.text-xxl-right { text-align: right !important; }
}