/* Bootstrap 4 -> 5 CSS Compatibility Layer
 * Restores classes removed in Bootstrap 5 used by Box2 snippets.
 */

/* --- Spacing utilities (mr-*, ml-*, pr-*, pl-*) --- */
.mr-0  { margin-right: 0 !important; }
.mr-1  { margin-right: 0.25rem !important; }
.mr-2  { margin-right: 0.5rem !important; }
.mr-3  { margin-right: 1rem !important; }
.mr-4  { margin-right: 1.5rem !important; }
.mr-5  { margin-right: 3rem !important; }
.mr-auto { margin-right: auto !important; }

.ml-0  { margin-left: 0 !important; }
.ml-1  { margin-left: 0.25rem !important; }
.ml-2  { margin-left: 0.5rem !important; }
.ml-3  { margin-left: 1rem !important; }
.ml-4  { margin-left: 1.5rem !important; }
.ml-5  { margin-left: 3rem !important; }
.ml-auto { margin-left: auto !important; }

.pr-0  { padding-right: 0 !important; }
.pr-1  { padding-right: 0.25rem !important; }
.pr-2  { padding-right: 0.5rem !important; }
.pr-3  { padding-right: 1rem !important; }
.pr-4  { padding-right: 1.5rem !important; }
.pr-5  { padding-right: 3rem !important; }

.pl-0  { padding-left: 0 !important; }
.pl-1  { padding-left: 0.25rem !important; }
.pl-2  { padding-left: 0.5rem !important; }
.pl-3  { padding-left: 1rem !important; }
.pl-4  { padding-left: 1.5rem !important; }
.pl-5  { padding-left: 3rem !important; }

/* --- Text / Float alignment --- */
.text-right  { text-align: right !important; }
.text-left   { text-align: left  !important; }
.float-right { float: right !important; }
.float-left  { float: left  !important; }

/* --- Form (BS4 removed in BS5) --- */
.form-group  { margin-bottom: 1rem; }
.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; }

/* --- Badge color variants (bs4 convention) --- */
.badge-secondary { background-color: #6c757d; color: #fff; }
.badge-warning   { background-color: #ffc107; color: #212529; }
.badge-info      { background-color: #39afd1; color: #fff; }
.badge-light     { background-color: #f8f9fa; color: #212529; border: 1px solid #dee2e6; }

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

/* --- Close button (BS4 style) --- */
button.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    opacity: 0.5;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
}
button.close:hover { opacity: 0.75; }

/* --- Media object (BS4) --- */
.media       { display: flex; align-items: flex-start; }
.media-body  { flex: 1; min-width: 0; }

/* --- Card deck (BS4) --- */
.card-deck { display: flex; flex-flow: row wrap; margin-right: -15px; margin-left: -15px; }
.card-deck .card { flex: 1 0 0%; margin-right: 15px; margin-left: 15px; }

/* --- Sidebar dropdown: keep active module open (PHP sets .opened) --- */
.sidebar .nav-item.dropdown .dropdown-menu.opened { display: block; }
.sidebar .nav-item.dropdown.opened > .nav-link { color: rgba(255,255,255,.9) !important; }