@media screen {
    .siteBody {
        display: flex;
    }
}

@media print {
    .modal-backdrop {
        display: none;
    }

    .no-print {
        display: none;
    }
}

.netColor {
    color: var(--purple);
}

.opacity-0 {
    opacity: 0;
}

.opacity-1 {
    opacity: 0.2;
}

.opacity-2 {
    opacity: 0.4;
}

.opacity-3 {
    opacity: 0.6;
}

.opacity-4 {
    opacity: 0.8;
}

.opacity-5 {
    opacity: 1;
}

.border-left-6 {
    border-left-width: 6px !important;
    border-left-style: solid !important;
}

.btn-orange {
    background-color: #ec9400;
    color: white !important;
    border: 1px solid #ec9400 !important;
}

    .btn-orange:hover {
        border: 1px solid #d08404 !important;
    }

.register-container {
    margin: 4em 20% auto 20%;
}

@keyframes colorTransition1 {
    0% {
        background-color: #00b638;
    }

    50% {
        background-color: #008927;
    }

    100% {
        background-color: #00b638;
    }
}

@keyframes colorTransition2 {
    0% {
        background-color: #008927;
    }

    50% {
        background-color: #006d1a;
    }

    100% {
        background-color: #008927;
    }
}

@keyframes colorTransition3 {
    0% {
        background-color: #00b638;
    }

    50% {
        background-color: #5ebf79;
    }

    100% {
        background-color: #00b638;
    }
}

@keyframes colorTransition4 {
    0% {
        background-color: #008927;
    }

    50% {
        background-color: #00b638;
    }

    100% {
        background-color: #008927;
    }
}

.layout-v2-container {
    animation: colorTransition1 4s linear infinite, colorTransition2 4s linear infinite, colorTransition3 4s linear infinite, colorTransition4 4s linear infinite;
    z-index: -1;
}

.layout-v2-container-bottom {
    background: url('/wwwroot/images/svg/wave.svg');
    position: fixed;
    bottom: -0.1rem;
    transform: rotateY(180deg);
    pointer-events: none;
    width: 1920px;
    height: 184px;
    z-index: -1;
}

.dropdown-menu > a.dropdown-item:hover {
    background-color: #ced4da;
    background-image: none;
}

.navbar-nav .postadd {
    border-left: solid 1px #ddd;
}

.navbar-nav .oc-btn {
    margin: auto 0.2em;
}

.navbar-nav .dropdown-menu.show {
    padding: 0 !important;
}

.navbar-nav .user span {
    line-height: 1;
}

.navbar-nav .top-icons {
    font-size: 1.3em !important;
    margin-bottom: -0.25rem !important;
}

.navbar-nav .ocdropdown {
    display: block !important;
}

.card-header .nav-tabs .nav-link.active {
    background-color: #fff !important;
}


h5.card-title {
    margin-bottom: 0;
}

.btn.btn-square {
    border-radius: 0;
}



table.align-middle td, table.align-middle th, thead.align-middle th, tbody.align-middle td, tfoot.align-middle td, tr.align-middle td, tr.align-middle th {
    vertical-align: middle;
}

.btn-xs {
    padding: 0 .25rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
}

line-height-sm {
    line-height: .85rem;
}

table.line-height-sm td {
    line-height: .85rem;
}

table.line-height-sm th {
    line-height: .85rem;
}

.modal-xxl {
    max-width: 97vw;
}

.left-border-thin {
    border-left: thin solid black !important;
}

.context-menu-root {
    z-index: 100000000 !important;
}

.ui-autocomplete {
    z-index: 100000000 !important;
}

.navbar-brand img {
    height: 3.5rem;
}

body {
    font-size: 90% !important;
}

.autocomplete-suggestions {
    border: 1px solid #999;
    background: #FFF;
    overflow: auto;
}

.autocomplete-suggestion {
    padding: 2px 5px;
    white-space: normal;
    overflow: hidden;
}

.autocomplete-selected {
    background: #F0F0F0;
}

.autocomplete-suggestions strong {
    font-weight: normal;
    color: #3399FF;
}

.autocomplete-group {
    padding: 2px 5px;
    font-weight: bold;
    color: lightgrey;
}

    .autocomplete-group strong {
        display: block;
        border-bottom: 1px solid #000;
    }


#propose-detail .quantity input {
    min-width: 45px;
    max-width: 75px;
    display: inline-block;
}

#propose-detail .quantity span {
    white-space: nowrap;
}

div.alert-warning svg {
    padding-bottom: 3px;
    height: 19px;
    margin-right: 15px;
}

.cart-detail i {
    color: #60B544;
    font-size: 160px;
}

.cart-detail {
    text-align: center;
}

.best-vpl, .best-price, .best-deadline {
    cursor: pointer;
}

.best-vpl {
    color: #5bb65b;
}

.best-price {
    color: #f9a731;
}

.best-deadline {
    color: #2B2BFF;
}

.best-highlight {
    font-size: 1em;
}

.fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    background: white;
    padding: 20px;
    overflow-y: auto;
}

.btn-fullscreen {
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 1000;
    opacity: 40%;
    transition: opacity 1s;
}

    .btn-fullscreen:hover {
        opacity: 100%;
    }

.text-del {
    text-decoration: line-through;
}

.menu-badge {
    position: absolute !important;
    padding: 0.10em 0.25em;
    top: 9px !important;
    left: 6px;
}

    .menu-badge.more-ninety-nine {
        left: -5px !important;
    }

    .menu-badge.badge-group {
        left: 24px !important;
    }
        .menu-badge.badge-group.more-ninety-nine {
            left: 14px !important;
        }

.unseen {
    border-left-width: 6px !important;
    border-left-style: solid !important;
}

.datasheet-proposal-items > tbody > tr > th,
.datasheet-proposal-items > tbody > tr > td {
    padding: 0.1rem;
}

.input-upload {
    position: absolute;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    z-index: 4;
    max-width: 100%;
}

.input-upload-chat {
    position: absolute;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    z-index: 4;
    width: 3.125rem;
    height: 100%;
}

.hide, .hidden {
    display: none;
}

.pulse-button-primary {
    box-shadow: 0 0 0 0 rgba(204,229,255, 0.7);
}

.pulse-button-secondary {
    box-shadow: 0 0 0 0 rgba(226,227,229, 0.7);
}

.pulse-button-success {
    box-shadow: 0 0 0 0 rgba(212,237,218, 0.7);
}

.pulse-button-danger {
    box-shadow: 0 0 0 0 rgba(248,215,218, 0.7);
}

.pulse-button-warning {
    box-shadow: 0 0 0 0 rgba(255,243,205, 0.7);
}

.pulse-button-info {
    box-shadow: 0 0 0 0 rgba(209,236,241, 0.7);
}

.pulse-button-light {
    box-shadow: 0 0 0 0 rgba(254,254,254, 0.7);
}

.pulse-button-dark {
    box-shadow: 0 0 0 0 rgba(214,216,217, 0.7);
}

.pulse-button {
    -webkit-animation: pulse 1.5s infinite cubic-bezier(0.66, 0, 0, 1);
    -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
    -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
    animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}

    .pulse-button:hover {
        -webkit-animation: none;
        -moz-animation: none;
        -ms-animation: none;
        animation: none;
    }

@-webkit-keyframes pulse {
    to {
        box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
    }
}

@-moz-keyframes pulse {
    to {
        box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
    }
}

@-ms-keyframes pulse {
    to {
        box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
    }
}

@keyframes pulse {
    to {
        box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);
    }
}

:root {
    --active-color-create: rgba(0,109,204, 1);
    --active-border-color-create: #006dcc;
}

.btn.btn-secondary.col-6.active {
    background-color: var(--active-color-create) !important;
    border-color: var(--active-border-color-create) !important;
}

.btn.btn-secondary.active {
    background-color: var(--active-color-create) !important;
    border-color: var(--active-border-color-create) !important;
}

.btn.btn-secondary.label.active {
    background-color: var(--active-color-create) !important;
    border-color: var(--active-border-color-create) !important;
}

input:disabled {
    background-color: #e9ecef;
    opacity: 1;
}

.comparison-text-warning {
    color: #9B7503 !important;
}

.d-products::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    margin-right: 5px;
    content: "\f468";
}

.d-products:hover::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    margin-right: 5px;
    content: "\f06e";
}

/* Headers */

.header-rfq {
    /* Verde #b7e1cd */
    /*background: linear-gradient(45deg, rgba(183,225,205,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(183,225,205,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(183,225,205,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-rfq::before {
        content: '\f07a';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-offer {
}

    .header-offer::before {
        content: '\f15c';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfi {
    /* Laranja #fccdb2 */
    /*background: linear-gradient(45deg, rgba(252,205,178,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(252,205,178,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(252,205,178,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-rfi::before {
        content: '\f328';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfp {
}

    .header-rfp::before {
        content: '\f0ae';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfc {
    /* Lilás #cdb7e1 */
    /*background: linear-gradient(45deg, rgba(205,183,225,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(205,183,225,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(205,183,225,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-rfc::before {
        content: '\f46d';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-agreement {
    /* Azul #b7cde1 */
    /*background: linear-gradient(45deg, rgba(183,205,225,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(183,205,225,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(183,205,225,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-agreement::before {
        content: '\f2b5';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rff {
    /* Amarelo #fce8b2 */
    /*background: linear-gradient(45deg, rgba(252,232,178,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(252,232,178,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(252,232,178,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-rff::before {
        content: '\f4de';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfm {
    /* Vermelho #f4c7c3 */
    /*background: linear-gradient(45deg, rgba(244,199,195,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(244,199,195,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(244,199,195,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-rfm::before {
        content: '\f807';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-marketplace {
}

    .header-marketplace::before {
        content: '\f54e';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-order {
    /* Ciano #b2e8fc */
    /*background: linear-gradient(45deg, rgba(178,232,252,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(45deg, rgba(178,232,252,1) 0%, rgba(255,255,255,1) 100%);
    background: -moz-linear-gradient(45deg, rgba(178,232,252,1) 0%, rgba(255,255,255,1) 100%);*/
}

    .header-order::before {
        content: '\f15c';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfs {
}

    .header-rfs::before {
        content: '\f0ad';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.header-rfq-offer {
}

    .header-rfq-offer::before {
        content: '\f571';
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 15px;
        float: left;
        margin-right: 5px;
    }

.clickable {
    cursor: pointer;
}

    .clickable > span {
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        padding-right: 2px;
        color: #0172F0;
    }

        .clickable > span.down::before {
            content: "\f162"; /*Z-A*/
        }

    .clickable:hover > span.down::before {
        content: "\f886" !important; /*Z-A*/
    }

    .clickable > span.down-disabled::before {
        content: "\f162"; /*Z-A*/
    }

    .clickable > span.down-disabled {
        opacity: 0.4;
        color: #999;
    }

    .clickable:hover > span.down-disabled {
        opacity: 1 !important;
        color: #0172F0 !important;
    }

    .clickable > span.down-alt::before {
        content: "\f886"; /*A-Z*/
    }

.ft-clickable {
    cursor: pointer;
}

    .ft-clickable > span {
        padding-right: 2px;
        color: #0172F0;
    }

        .ft-clickable > span.down-disabled {
            opacity: 0.4;
            color: #999;
        }

    .ft-clickable:hover > span.down-disabled {
        opacity: 1 !important;
        color: #0172F0 !important;
    }

@keyframes beatfade {
    0%, 50%, 100% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }
}

.i-beat-fade {
    animation: beatfade 3s infinite;
}

@media (min-width: 1200px) {
    .modal-xlg {
        width: 90%;
        max-width: inherit;
    }
}

.div-rating-star {
    width: 46px;
    height: 46px;
}

.rating-star {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #ffc107;
    width: 1em; /* Ajuste para corresponder ao tamanho da estrela */
    height: 1em; /* Ajuste para corresponder ao tamanho da estrela */
}

    .rating-star:before {
        content: "\f005";
        font-family: "Font Awesome 5 Free";
        font-weight: 400;
        position: absolute;
        font-size: inherit;
    }

.star-number {
    position: absolute;
    font-size: 0.25em; /* Ajuste o tamanho do número conforme necessário */
    color: black; /* Cor do número */
    z-index: 1;
}

.ContractsContainer {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.ContractBox {
    border: 1px solid #ced4da;
    border-radius: 25px;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    margin-bottom: 0.2rem;
    padding: 0.5rem;
}

.contract-body {
    border: 1px solid black;
}

.OrdersContainer {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.OrderBox {
    border: 1px solid #ced4da;
    border-radius: 25px;
    margin-left: 0.2rem;
    margin-right: 0.2rem;
    margin-bottom: 0.2rem;
    padding: 0.5rem;
}

.breakspaces {
    white-space: pre-wrap;
}

.a-shadow {
    text-shadow: 1px 1px 2px gray, -1px -1px 2px gray, 1px -1px 2px gray, -1px 1px 2px gray;
}

.gradient-supplier-transporter {
    background: linear-gradient(90deg, #28a745, #007bff);
    background-clip: text;
    color: transparent;
}
/*TODO: remover*/
.sortable-placeholder {
    background-color: #f0f0f0;
    border: 1px dashed #ddd;
}

.DropTarget {
    border: 1px solid darkcyan;
    border-radius: 0.25rem;
}

.ScopesTree {
    min-height: 2px;
}

.toggle-link {
    position: absolute;
    width: 20px;
    margin-left: -27px;
    text-align: center;
    margin-top: 0.25rem;
    color: black;
    line-height: 2;
}

    .toggle-link:hover {
        color: black;
    }

    .toggle-link::after {
        content: "\f0fe";
        font-family: "Font Awesome 5 Free";
        font-weight: 400;
    }

    .toggle-link:not(.collapsed)::after {
        content: "\f146";
        font-family: "Font Awesome 5 Free";
        font-weight: 400;
    }

.main-tree li {
    border: none;
    padding-right: 0px;
}

    .main-tree li:hover {
        background-color: rgba(0, 0, 0, 0.02);
    }

    .main-tree li > div:hover {
        background-color: rgba(0, 0, 0, 0.04);
    }

.solution-name:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #e6d8be;
    content: "\f70e";
    padding-right: 0.25rem;
    text-decoration: none !important;
}

ol > li.sequential::before {
    content: '';
    position: absolute;
    width: 2px;
    height: calc(100% + 10px); /* Altura da linha */
    background-color: #ccc;
    left: calc(1.75rem + 4px); /* Ajuste para alinhar com o ícone */
    top: 2px;
    z-index: 1;
}

ol > li.sequential.last::before {
    height: 10px; /* Impede que a linha continue abaixo da última tarefa */
}

ol > li.parallel > div.scopehead > div:first-child > div::before {
    content: '';
    position: relative;
    width: 14px; /* Comprimento da linha */
    height: 2px; /* Espessura da linha */
    background-color: #ccc; /* Cor da linha */
    left: -8px; /* Inicia da esquerda */
    top: -3px; /* Centraliza na altura do ícone */
    transform: translateY(-50%);
    display: inline-block;
}

ol > li > div.scopehead > div:first-child > div {
    width: 2px;
}

#DragHandler {
    /*padding-left: 0.5rem;*/
    z-index: 2;
    position: relative;
}

#ScopeList {
    margin-left: 5px;
}
/*TODO: Até aqui*/

.badge-invited {
    color: #fff;
    background-color: #7707ff;
}

/* Tema Dark */
pre.json.dark {
    background: #222;
    color: #fff;
}

pre.json-dark .string {
    color: #6abf69;
}

pre.json-dark .number {
    color: #f78c6c;
}

pre.json-dark .boolean {
    color: #82aaff;
}

pre.json-dark .null {
    color: #ff5370;
}

pre.json-dark .key {
    color: #ffcb6b;
}

/* Tema Light */
pre.text {
    background: #f5f5f5;
    color: #222;
    padding: 1em;
    border-radius: 6px;
}

pre.json {
    background: #f5f5f5;
    color: #222;
    padding: 1em;
    border-radius: 6px;
}

    pre.json .string {
        color: #388e3c;
    }

    pre.json .number {
        color: #d84315;
    }

    pre.json .boolean {
        color: #1565c0;
    }

    pre.json .null {
        color: #ad1457;
    }

    pre.json .key {
        color: #b8860b;
    }

ins {
    background: #d4fcbc;
    color: #1a3a1a;
    text-decoration: none;
    border-radius: 2px;
    padding: 0 2px;
    font-style: normal;
}

del {
    background: #ffe6e6;
    color: #a33;
    text-decoration: line-through;
    border-radius: 2px;
    padding: 0 2px;
    font-style: normal;
}


/* Estilos do TopNavBar extraídos do _TopNavBar.cshtml */

.card-position {
    display: none;
    width: 300px;
    right: 1.1em;
    z-index: 20;
    position: fixed;
}

.img-size {
    height: 64px;
    width: 64px;
    justify-content: center;
}

.icon-size {
    align-self: center;
    font-size: 36px;
}

/* Responsivo para telas até 992px */
@media screen and (max-width: 992px) {
    .card-position {
        display: none;
        width: 300px;
        z-index: 20;
        right: initial;
        position: relative;
    }
}

}

/* Import RFI Respondents */

.wizard-step {
    display: block;
}

    .wizard-step.d-none {
        display: none;
    }

.rfi-row-selectable {
    cursor: pointer;
    transition: background 0.2s;
}

.rfi-row-selected {
    color: #004085;
    background-color: #cce5ff;
}

.rfi-row-selectable:hover:not(.rfi-row-selected) {
    background: #f1f5fa;
}

.divContainer {
    background-color: white;
    flex-grow: 1;
    overflow-y: auto;
    padding: 1em;
}

#footBadges div {
    flex-grow: 1;
}

.errorDiv:hover {
    background-color: #e2e3e5;
    border-color: #d6d8db;
}

.body-pushed {
    transition: width 0.3s ease; /* Transição suave */
}

    .body-pushed.pushed {
        width: 80vw; /* Empurra o conteúdo quando a sidebar está aberta */
    }

@media screen and (max-width: 992px) {
    .divContainer {
        background-color: white;
        flex-grow: 1;
        overflow-y: initial;
        padding: 1em;
    }
}


.mega-grid {
    display: inline-block;
    column-count: 2;
    /*grid-template-columns: repeat(3, max-content);*/
    grid-gap: 20px;
    padding: 9px;
}

.one-column {
    column-count: 1 !important;
}

@media (max-width: 767px) {
    .mega-grid {
        /*grid-template-columns: 1fr;*/
        column-count: 1;
    }
}

.mega-col {
    width: max-content;
    break-inside: avoid;
}

    .mega-col h6 {
        font-weight: bold;
    }

    .mega-col > .dropdown-item {
        position: relative;
    }

.dropdown:hover > .dropdown-menu {
    display: block;
}

.submenu-icon {
    width: 18px;
    text-align: center;
    margin-right: 6px;
}

.emoji-indicator {
    position: absolute;
    left: 0;
}