/*
    Copyright (c) 2001 Envision Technology Partners, Inc. All rights reserved.
*/

#skiptocontent a {
    padding: 6px;
    position: absolute;
    top: -40px;
    left: 0;
    color: #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
    background: #FFFFFF;
    -webkit-transition: top 1s ease-out;
    transition: top 1s ease-out;
    z-index: 1000000;
}

#skiptocontent a:focus {
    position: absolute;
    left: 0;
    top: 0;
    outline-color: transparent;
    -webkit-transition: top .1s ease-in;
    transition: top .1s ease-in;
}

@media (prefers-reduced-motion: reduce) {
    #skiptocontent a {
        transition-duration: 0.001ms !important;
    }
}

.navbar {
    min-height: 2.75rem !important;
    max-height: 2.75rem !important;
}

.navbar-dark .navbar-nav .nav-link {
    color: white !important;
}

.navbar-dark, .navbar[data-bs-theme=dark] {
    --bs-navbar-toggler-icon-bg: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAzMCAzMCc+PHBhdGggc3Ryb2tlPSdyZ2JhKDI1NSwgMjU1LCAyNTUsIDAuNTUpJyBzdHJva2UtbGluZWNhcD0ncm91bmQnIHN0cm9rZS1taXRlcmxpbWl0PScxMCcgc3Ryb2tlLXdpZHRoPScyJyBkPSdNNCA3aDIyTTQgMTVoMjJNNCAyM2gyMicvPjwvc3ZnPg==");
}

.bg-dark {
    background-color: var(--iz-top-nav-color) !important;
}

/*
    The provider clinic name text was just a bit higher than the rest of the row so this will push it down a bit. 
    Need to see if there is a better way to do this with built-in classes.
*/
#topNavProviderInfo {
    margin-top: 7px;
}

li[role='menuitem']:not(:last-of-type) > a, li[role='menuitem']:not(:last-of-type) > button {
    border-bottom: 1px solid var(--bs-gray-300);
}

li[role='menuitem']:last-of-type > a, li[role='menuitem']:last-of-type > a {
    border-bottom: none;
    padding-bottom: 0;
}

/*`sm` applies to x-small devices (portrait phones, less than 576px)*/
@media (min-width: 575.98px) {
     .top-truncate-px {
         max-width: 125px;
     }
 }

/*`md` applies to small devices (landscape phones, less than 768px)*/
@media (min-width: 767.98px) {
     .top-truncate-px {
         max-width: 125px;
     }
 }

/*`lg` applies to medium devices (tablets, less than 992px)*/
@media (min-width: 991.98px) {
     .top-truncate-px {
         max-width: 325px;
     }
 }

/*`xl` applies to large devices (desktops, less than 1200px)*/
@media (min-width: 1199.98px) {
     .top-truncate-px {
         max-width: 525px;
     }
 }

/*`xxl` applies to x-large devices (large desktops, less than 1400px)*/
@media (min-width: 1399.98px) {
     .top-truncate-px {
         max-width: 550px;
     }
 }