/* ============================================================
   Bootstrap 5 Compatibility Overrides
   This file bridges BS3-era custom CSS with Bootstrap 5.
   Load AFTER bootstrap.min.css and BEFORE site.css
   ============================================================ */

/* --- Navbar toggler: hide on desktop (custom cssmenu handles navigation) --- */
.navbar .navbar-toggler {
    display: none;
}
@media screen and (max-width: 1000px) {
    .navbar .navbar-toggler {
        display: block;
    }
}

/* --- Prevent BS5 from overriding the custom cssmenu nav --- */
#cssmenu ul {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}
#cssmenu a {
    text-decoration: none;
}
#cssmenu a:hover {
    text-decoration: none;
}

/* --- BS5 .row uses flexbox; restore compatibility with float-based layouts --- */
/* Admin sidebar layout fix */
.admin-sidebar {
    float: left;
    width: 220px;
    min-height: 300px;
    border: 1px solid #ddd;
    background-color: rgba(30, 30, 30, 0.9);
    padding: 15px;
    margin-right: 25px;
    list-style-type: none;
}
.admin-sidebar .nav-sidebar {
    list-style-type: none;
    padding-left: 0;
}
.admin-sidebar .nav-sidebar li {
    list-style-type: none;
    padding: 5px 0;
}
.admin-main {
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.85);
    border: 1px solid #444;
    padding: 20px 30px;
    min-height: 300px;
}

/* --- container-fluid: reinforce dark semi-transparent background --- */
.container-fluid {
    background: rgba(15, 15, 15, 0.75) !important;
    padding: 48px;
}

/* --- BS5 table class compatibility (table-condensed -> table-sm) --- */
.table-condensed > thead > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > th,
.table-condensed > tfoot > tr > td {
    padding: 5px;
}

/* --- BS5 table-bordered: restore visible borders --- */
.table-bordered,
.table-bordered th,
.table-bordered td {
    border: 1px solid #ddd !important;
}

/* --- BS5 resets link underlines; restore custom link colors --- */
a {
    text-decoration: none;
}
a:link {
    color: rgb(224, 182, 90);
}
a:visited {
    color: rgb(42, 168, 211);
}
a:hover {
    color: rgb(224, 182, 90);
    text-decoration: none;
}
a:active {
    color: rgb(252, 217, 142);
}

/* --- BS5 changes .btn-default (doesn't exist); map to outline style --- */
.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}
.btn-default:hover {
    background-color: #e6e6e6;
    border-color: #adadad;
}

/* --- BS5 .close class removed; provide fallback --- */
.close {
    float: right;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .5;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}
.close:hover {
    opacity: .75;
}

/* --- BS5 changes .navbar-fixed-top; restore sticky top behavior --- */
.navbar-fixed-top {
    position: relative;
    top: 0;
    z-index: 1030;
    width: 100%;
}

/* --- Prevent BS5 reboot from overriding body text color --- */
body {
    color: rgb(226, 226, 226);
}

/* --- Fix BS5 .row negative margins breaking admin float layout --- */
.admin-row {
    display: flex;
    flex-wrap: nowrap;
    margin-top: 25px;
    gap: 25px;
}
@media screen and (max-width: 768px) {
    .admin-row {
        flex-wrap: wrap;
    }
    .admin-sidebar {
        float: none;
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }
}

/* --- BS5 removes panel classes; provide basic panel styling --- */
.panel {
    margin-bottom: 20px;
    background-color: #222;
    border: 1px solid #444;
    border-radius: 4px;
}
.panel-body {
    padding: 15px;
}

/* --- Fix BS5 overriding h1/h2/h3 margins and colors --- */
h1, h2, h3 {
    font-family: "double-pica-sc", Garamond, "Baskerville Old Face", "Times New Roman", serif;
    font-weight: normal;
    color: rgb(252, 217, 142);
}
h2 {
    color: inherit;
}

/* --- Ensure nav-sidebar links are styled correctly in admin --- */
.nav-sidebar a {
    color: rgb(224, 182, 90);
}
.nav-sidebar a:hover {
    color: rgb(252, 217, 142);
}

/* --- Prevent horizontal overflow --- */
/* Note: overflow-x on html breaks position:sticky, so it's on body instead.
   The header (sticky) is a direct child of body and sticks to the viewport. */

/* --- BS5 .row negative margins can cause horizontal scroll --- */
.row {
    --bs-gutter-x: 1.5rem;
    margin-left: 0;
    margin-right: 0;
}
.row > * {
    max-width: 100%;
}

/* --- Responsive images by default (BS5 doesn't do this globally) --- */
img {
    max-width: 100%;
    height: auto;
}

/* --- Responsive iframes / embeds --- */
iframe {
    max-width: 100%;
}

/* --- Twitch embed container --- */
.twitch-video {
    max-width: 100%;
    overflow: hidden;
    margin: 10px 0;
}
.twitch-video iframe {
    max-width: 100% !important;
}

/* --- Featured info sections: prevent overflow --- */
.featured-info {
    overflow: hidden;
    word-wrap: break-word;
}

/* --- Featured info 3-column layout fix for BS5 --- */
#featured-info-wrapper {
    overflow: hidden;
    width: 100%;
}

/* --- Footer row fix --- */
footer.row {
    margin-left: 0;
    margin-right: 0;
}
footer.row p {
    max-width: none;
}

/* --- Mobile: reduce container padding so content has more room --- */
@media screen and (max-width: 600px) {
    .container-fluid {
        padding: 15px !important;
    }
    body {
        padding: 0 2% 2% 2%;
    }
    h1 {
        font-size: 1.8em;
    }
}

/* --- Tablet adjustments --- */
@media screen and (min-width: 601px) and (max-width: 1000px) {
    .container-fluid {
        padding: 25px !important;
    }
    body {
        padding: 0 4% 4% 4%;
    }
}