/* Muusico Bootstrap 5 migration layer */

html { font-size: 100%; }
body { font-size: 15px; }

/* Bootstrap 3 compatibility for legacy Muusico templates. */
.pull-left, .float-start { float: left !important; }
.pull-right, .float-end { float: right !important; }
.img-responsive { display: block; height: auto; max-width: 100%; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }

/* Keep legacy template spacing while using the Bootstrap 5 grid. */
.row { --bs-gutter-x: 30px; }

/* Modern responsive navigation */
.nav-top .navbar { border-radius: 0; }
.nav-top .navbar-brand img { max-height: 58px; width: auto; }
.nav-top .navbar-nav .nav-link { font-weight: 600; padding: .65rem .8rem; }
.nav-top .navbar-nav .dropdown-menu { border: 0; box-shadow: 0 .5rem 1rem rgba(0,0,0,.12); }
.nav-top .navbar-toggler { border: 0; box-shadow: none !important; }

.social-icons ul { list-style: none; padding-left: 0; }
.social-icons a { font-size: 15px; }

/* Search popover */
.header-search { position: relative; }
#mini-search-wrapper { display: none; position: absolute; right: 0; top: calc(100% + 8px); width: min(360px, 90vw); z-index: 1050; }
#mini-search-wrapper:before { content: ''; position: absolute; right: 18px; top: -8px; width: 16px; height: 16px; background: #fff; border-left: 1px solid #dee2e6; border-top: 1px solid #dee2e6; transform: rotate(45deg); }

/* Responsive typography/readability for lyrics */
.single-lyrics .lyrics-content, .lyrics-content { line-height: 1.9; }

@media (max-width: 991.98px) {
    .nav-top .navbar-nav { padding-top: .75rem; }
    .nav-top .navbar-nav .nav-link { padding-left: 0; padding-right: 0; }
    .header-search { display: inline-block; }
    .social-icons ul { justify-content: flex-start; }
    .lyric-alphabet { float: none !important; overflow-x: auto; white-space: nowrap; }
    .submit-lyric { float: none !important; margin-top: .75rem; }
}

@media (max-width: 575.98px) {
    .nav-top .navbar-brand img { max-height: 46px; }
    #mini-search-wrapper { right: -10px; }
}

/* Bootstrap 5 forms look better with the existing Muusico forms. */
input[type="text"], input[type="email"], input[type="search"], input[type="url"], input[type="password"], select, textarea {
    border-radius: .375rem;
}

/* Prevent old theme list rules from breaking Bootstrap nav lists. */
.navbar-nav, .navbar-nav ul, .social-icons ul { margin-bottom: 0; }
.navbar-nav li, .social-icons li { list-style: none; }

/* Legacy menu elements that remain in older templates. */
.slicknav_menu, #mobile-header { display: none !important; }