@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap');

/* Global Styles */
body{ background-color: transparent !important;font-family: 'Noto Sans', sans-serif;color: #333 !important}
#root .btn-primary{background: #b52720}
#root .btn-primary:hover{background: #bc3d36;border-color: transparent}
#root .btn-secondary{background: #4d6885}
#root .btn-secondary:hover{background: #667d96;border-color: transparent}

/* Navigation Styles */
#root .nav-pills .nav-link{border-radius: 0}
#root .nav-bar .designer-steps .nav-item .nav-link{color: #002750;border-color: transparent;background-color: transparent;font-weight: 700;text-transform: uppercase;font-size: 14px;}
#root .nav-bar .designer-steps .nav-item .nav-link span{display: none;}
#root .nav-bar .designer-steps .nav-item .nav-link.active{background-color: transparent;color: #b52720}
#root .nav-bar .designer-steps .nav-item .nav-link:hover:not(.active){color: #1a3d62}
#root .nav-bar .designer-steps .nav-item .nav-link:hover:not(.active)::after{opacity: 0}

/* Card Styles */
#root .card{background-color: #eef0f4;border-color: transparent;}
#root .card .card-header{background-color: #293241;color: #FFF;font-weight: 700;font-size: 25px;border-bottom: none;padding: 1rem}
#root .control-cards-option.list-group-item{color: #002750}
#root .control-cards-option.list-group-item:hover{border-color: #b52720}
#root .control-cards-option.list-group-item.active:not(.templateCard){border-color: #b52720;background-color: rgba(145,31,26,.2);color: #b52720}
#root .control-cards-option.list-group-item.templateCard.active{border-color: #b52720;background-color: transparent}


/* Dimension Styles */
#root .dimension-outage-direction-button-clickable{background: #b52720 !important}
#root .dimension-outage-direction-button-clickable:hover{background: #bc3d36 !important}

/* Footer Styles */
#root .info-footer a:hover{color: #b52720 !important}
#root {padding-top: 0 !important;}
.container {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1800px !important;
}

.nav-bar {
    background: #efefef !important;
    margin-top: 0 !important;
    border: 1px solid #CCC;
    border-radius: 4px;
}

.nav-link a {
    color: #333 !important;
    font-weight: 800 !important;
}