/* Bootstrap 5 / bootstrap_package 14+15 migration fixes */

/* bp14+ hardcodes --mainnavigation-link-font-size: 1rem as a CSS custom property.
   theme.css keeps the legacy html{font-size:10px} root hack, so 1rem = 10px.
   Compensate here (1.6rem = 16px, matching the v11 rendering). */
.navbar-mainnavigation {
    --mainnavigation-link-font-size: 1.6rem;
}
.navbar-mainnavigation .dropdown-menu {
    --bs-dropdown-font-size: 1.6rem;
    font-size: 1.6rem;
}

/* BS5 opens dropdowns on click only (button.nav-link-toggle). Restore the
   v11 hover behavior on desktop, but only for items that have a submenu. */
@media (min-width: 992px) {
    .navbar-mainnavigation .nav-item:has(.nav-link-toggle):hover > .dropdown-menu {
        display: block;
        margin-top: 0;
    }
}

/* Dropdown link colors: v11 reference is #333 text with #e9e9e9 hover background;
   bp15 renders links transparent-on-hover with rgba(0,0,0,.65) text,
   font-weight 300 and cramped 2px/5px padding (v11: 400, 6px 10px). */
.navbar-mainnavigation .dropdown-menu a {
    color: #333;
    font-weight: 400;
    padding: 6px 10px;
}
.navbar-mainnavigation .dropdown-menu a:hover,
.navbar-mainnavigation .dropdown-menu a:focus {
    color: #333;
    background-color: #e9e9e9;
}

/* Logo/brand sizing: the legacy rules in the DB headerData blob target
   .navbar-header-main, which no longer exists in bp15 markup — without them the
   brand box collapses (33px) and the logo overflows. Rebuilt v11 reference:
   brand 110px high, logo 497px wide on desktop, 40px high on mobile. */
@media (min-width: 992px) {
    /* bp15 adds 2.4rem vertical padding to the navbar; v11 header is exactly
       110px brand height with no extra padding (header total 111px). */
    .bp-page-header.navbar-mainnavigation {
        padding-top: 0;
        padding-bottom: 0;
    }

    /* v11 alignment: nav vertically centered in the 110px header (v13 sticks
       to the top), no flex gaps between items, 10px link padding (bp15: 8px).
       bp15 forces the collapse to display:block with height:110px, so flex
       it with !important; v11 sits the nav roughly centered in the gap
       between logo and container edge. */
    /* extra specificity: the legacy BS3 inline blob in sys_template headerData
       carries `.navbar-collapse.collapse{display:block!important}` and is
       rendered after the stylesheets. */
    .bp-page-header.navbar-mainnavigation .navbar-collapse.collapse {
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
    .navbar-mainnavigation .navbar-nav {
        gap: 0;
        align-items: center;
    }
    .navbar-mainnavigation .navbar-nav .nav-link-main {
        padding-left: 10px;
        padding-right: 10px;
    }
    .navbar-mainnavigation .navbar-brand.navbar-brand-image {
        height: 110px;
        display: flex;
        align-items: center;
        flex: 0 0 auto;
    }
    .navbar-mainnavigation .navbar-brand.navbar-brand-image img {
        width: 497px;
        max-width: none;
        max-height: none;
        height: auto;
        position: static;
        transform: none;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    .navbar-mainnavigation .navbar-brand.navbar-brand-image img {
        width: 400px;
    }
}
@media (max-width: 991px) {
    .navbar-mainnavigation .navbar-brand.navbar-brand-image img {
        max-height: 40px;
        width: auto;
    }
}

/* powermail 13 changed the field partial: the label now sits INSIDE the single
   col-sm-8 wrapper (stacked, 2/3 width). v11 rendered form-horizontal: label as
   col-sm-4 beside a col-sm-8 field. Rebuild that two-column layout with grid. */
@media (min-width: 768px) {
    .powermail_form .powermail_fieldwrap.row > .col-sm-8 {
        display: grid;
        grid-template-columns: 33.3333% minmax(0, 1fr);
        column-gap: 15px;
        align-items: center;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .powermail_form .powermail_fieldwrap.row > .col-sm-8 > * {
        grid-column: 2;
    }
    .powermail_form .powermail_fieldwrap.row > .col-sm-8 > label.col-form-label {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        text-align: right;
        margin: 0;
    }
}

/* btn-primary: white on orange like v11/BS4. BS5 color-contrast() picks black
   because white vs #ff7300 is ratio 2.94 (< min-contrast-ratio 3). */
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-color: #fff;
    --bs-btn-disabled-color: #fff;
}

/* Form inputs: BS 5.3 border derivation yields #959595; v11 reference is #ced4da. */
.powermail_form .form-control,
.powermail_form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.powermail_form select,
.powermail_form textarea {
    border-color: #ced4da;
}