/**
 * Bootstrap 3 → 5 Compatibility Shim
 * Maps leftover BS3 classes/patterns to BS5 equivalents.
 * Include this AFTER bootstrap.min.css
 */

/* === .label class (BS3 used .label for badges) === */
.label {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.375rem;
}

/* === BS3 .divider in dropdown menus === */
.dropdown-menu .divider,
li.divider {
    height: 0;
    margin: 0.5rem 0;
    overflow: hidden;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
}

/* === .close button (BS3 style) === */
button.close,
.close {
    float: right;
    font-size: 1.3125rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.5;
    padding: 0;
    background-color: transparent;
    border: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}
.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    opacity: 0.75;
}

/* === .fade.in → .fade.show (BS5 uses .show instead of .in) === */
.fade.in {
    opacity: 1;
}

/* === .collapse.in → .collapse.show === */
.collapse.in {
    display: block;
}

/* === .modal.in === */
.modal.in {
    display: block;
}

/* === BS3 .panel (catch any remaining panel references) === */
.panel {
    margin-bottom: 1rem;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

/* === .panel-group accordion spacing === */
.panel-group .card {
    margin-bottom: 0;
    border-radius: 0.375rem;
}
.panel-group .card + .card {
    margin-top: 5px;
}

/* === BS3 Glyphicons fallback (map to FA6 where possible) === */
/* Already using FA6, no glyphicons needed */

/* === .caret (BS5 uses CSS for dropdown arrows but .caret may still be in HTML) === */
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
.dropup .caret {
    border-top: 0;
    border-bottom: 4px dashed;
}

/* === .help-block → .form-text === */
.help-block {
    display: block;
    margin-top: 0.25rem;
    color: #6c757d;
    font-size: 0.875em;
}

/* === .control-label === */
.control-label {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

/* === .form-group spacing (removed in BS5) === */
.form-group {
    margin-bottom: 1rem;
}

/* === .has-error / .has-success / .has-warning (BS3 validation) === */
.has-error .form-control {
    border-color: #dc3545;
}
.has-error .control-label,
.has-error .help-block {
    color: #dc3545;
}
.has-success .form-control {
    border-color: #198754;
}
.has-success .control-label,
.has-success .help-block {
    color: #198754;
}
.has-warning .form-control {
    border-color: #ffc107;
}
.has-warning .control-label,
.has-warning .help-block {
    color: #664d03;
}

/* === .radio / .checkbox (BS3 form helpers) === */
.radio,
.checkbox {
    position: relative;
    display: block;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.radio label,
.checkbox label {
    min-height: 1.25rem;
    padding-left: 1.25rem;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer;
}

/* === .btn-group-justified (removed in BS5) === */
.btn-group-justified {
    display: flex;
    width: 100%;
}
.btn-group-justified > .btn,
.btn-group-justified > .btn-group {
    flex: 1;
}

/* === .list-inline > li needs .list-inline-item in BS5 === */
.list-inline > li {
    display: inline-block;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

/* === .page-header (removed in BS5) === */
.page-header {
    padding-bottom: 0.5rem;
    margin: 2.5rem 0 1.25rem;
    border-bottom: 1px solid #dee2e6;
}

/* === .navbar-form (removed in BS5) === */
.navbar-form {
    padding: 0.5rem 1rem;
    margin-right: -1rem;
    margin-left: -1rem;
}

/* === BS3 .text-hide (removed in BS5) === */
.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

/* === .affix (removed in BS5, use position: sticky) === */
.affix {
    position: sticky;
    top: 0;
    z-index: 1020;
}

/* === BS5 Carousel uses .carousel-item not .item === */
.carousel-inner > .item {
    position: relative;
    display: none;
    transition: transform 0.6s ease-in-out;
}
.carousel-inner > .item.active,
.carousel-inner > .item.next,
.carousel-inner > .item.prev {
    display: block;
}

/* === .thumbnail → .card === */
.thumbnail {
    display: block;
    padding: 4px;
    margin-bottom: 1.25rem;
    line-height: 1.4286;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    transition: border 0.2s ease-in-out;
}

/* === .badge (BS3 used .badge with pill shape) === */
/* BS5 .badge exists but doesn't round by default */
.badge {
    border-radius: 0.375rem;
}

/* === .media object (removed in BS5, use flexbox) === */
.media {
    display: flex;
    align-items: flex-start;
}
.media-body {
    flex: 1;
}
.media-object {
    display: block;
}
.media-heading {
    margin: 0 0 5px;
}

/* === .embed-responsive (BS5 uses ratio) === */
.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;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
.embed-responsive-16by9::before {
    padding-top: 56.25%;
}
.embed-responsive-4by3::before {
    padding-top: 75%;
}

/* === Spacing: BS3 used margin on elements, BS5 removed some defaults === */
h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 1.25rem;
    margin-bottom: 0.625rem;
}
h4, .h4, h5, .h5, h6, .h6 {
    margin-top: 0.625rem;
    margin-bottom: 0.625rem;
}

/* === BS3 text-left / text-right (BS5 uses text-start / text-end) === */
.text-left  { text-align: left !important; }
.text-right { text-align: right !important; }

/* === BS3 .btn-close inner content cleanup === */
.btn-close > * { display: none; }

/* === BS3 .carousel-control compat (left/right anchors) === */
a.carousel-control {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    padding: 0;
    color: #fff;
    text-align: center;
    background: none;
    border: 0;
    opacity: .5;
    transition: opacity .15s ease;
    text-decoration: none;
    z-index: 1;
}
a.carousel-control:hover { opacity: .9; }
a.carousel-control.left  { left: 0; }
a.carousel-control.right { right: 0; }

/* === BS3 glyphicon (minimal fallback) === */
.glyphicon { font-family: inherit; }
.glyphicon-ok::before  { content: "\2713"; }
.glyphicon-remove::before { content: "\2715"; }
.glyphicon-chevron-left::before  { content: "\2039"; font-size: 1.5em; }
.glyphicon-chevron-right::before { content: "\203A"; font-size: 1.5em; }

/* === Top header nav alignment (BS5 .nav flex conflicts with BS3 float layout) === */
.top-header ul.list-inline.nav {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
}
.top-header ul.list-inline.nav > li {
    float: none;
}