/* These styles are shared between all comobile themes */
/* PATH ??? NOT WORKING */

/* Change color variables*/
:root {
    --pf-c-button--m-primary--Color: #009fe3 !important;
    --pf-v5-c-masthead--BackgroundColor: #37738e !important;
    --surface-card: #1f2d40;
    --surface-card-active: #304562;
    --surface-card-hover: #273850;
    --main-background: #17212f;
    --pf-v5-c-toolbar--BackgroundColor: red !important;
}

.pf-v5-c-masthead {
    background: linear-gradient(165deg, #384f7b 0%, #3c6b91 50%, #6fc8d0 100%);
    --pf-v5-c-masthead--BackgroundColor: #37738e;
}

.pf-v5-c-masthead .pf-v5-c-toolbar {
    background-color: transparent;
}

.pf-v5-c-toolbar__item > a, .pf-v5-c-toolbar__item > button {
    color: var(--pf-v5-global--Color--light-100) !important;
}

.pf-v5-c-page__sidebar-body {
    background-color: var(--surface-card);
}

.pf-v5-c-nav__link.pf-m-current, .pf-v5-c-nav__link.pf-m-current:hover, .pf-v5-c-nav__item.pf-m-current:not(.pf-m-expanded) .pf-v5-c-nav__link {
    background-color: var(--surface-card-active);
}

.pf-v5-c-page__main-section, .pf-v5-c-page__main-breadcrumb,
.pf-v5-c-page__main-section.pf-m-light{
    // background-color: var(--main-background) !important;
}

.pf-v5-c-nav__link:hover, .pf-v5-c-nav__link.pf-m-hover {
    background-color: var(--surface-card-hover);
}

/* Font definitions for theme */
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Roboto-Regular.ttf?v=713ca4dbff1fb505d66a6f7f8b440940") format("truetype");
}

@font-face {
    font-family: "RobotoLight";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Roboto-Light.ttf?v=713ca4dbff1fb505d66a6f7f8b440940") format("truetype");
}

@font-face {
    font-family: "RobotoMedium";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Roboto-Medium.ttf?v=713ca4dbff1fb505d66a6f7f8b440940") format("truetype");
}

@font-face {
    font-family: "RobotoBold";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Roboto-Bold.ttf?v=713ca4dbff1fb505d66a6f7f8b440940") format("truetype");
}

@font-face {
    font-family: "RobotoBlack";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Roboto-Black.ttf?v=713ca4dbff1fb505d66a6f7f8b440940") format("truetype");
}

@font-face {
    font-family: "EurostileBold";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Eurostile-Bold.otf?v=713ca4dbff1fb505d66a6f7f8b440940") format("opentype");
}

html {
    height: 100%;
}

body {
    background-image: linear-gradient(165deg, #75e8f3 0%, #69BAFD 50%, #4A84FB 100%);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    font-family: Roboto;
}

body.comobile-ent {
    background-image: linear-gradient(165deg, #f3b875 0%, #dd8a50 50%, #fb4a4a 100%);
}

body.comobile-test {
    background-image: linear-gradient(165deg, #c6e1ba 0%, #8fcd8b 50%, #7cab73 100%);
}

body.comobile-demo {
    background-image: linear-gradient(165deg, #f9db89 0%, #FFC72C 50%, #c99c22 100%);
}

.row {
    position: relative;
    z-index: 1;
}

#backgroundGridSvgWrapper {
    position: fixed;
    pointer-events: none;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    overflow: hidden;
}

#backgroundGridSvgWrapper > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    margin-top: 40vh;
}

@media (max-width: 767px) {
    #backgroundGridSvgWrapper > img {
        margin-top: 270px;
    }
}

.hidden {
    display: none !important;
}

.w-full {
    width: 100%;
}

.h-auto {
    height: auto;
}

.pf-v5-c-button {
    height: 36px;
}

.pf-v5-c-masthead__toggle {
    > button#nav-toggle {
        display: flex;
        align-items: center;
    }
}

.pf-v5-c-masthead__content .pf-v5-c-button.pf-m-link.pf-m-inline {
    display: flex;
    align-items: center;
}