

/* CARDS do controle de busca de produtos da tela de cadastro de usuário */
/* As duas colunas em grid de cards fixos 120x120 */
#equip_search_results,
#equip_selected {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 120px));
  gap: 12px;
  align-content: start;
}

/* Aparência unificada dos cards (busca e selecionados) */
.equip-card,
.equip-chip {
  width: 120px;
  height: 120px;
  box-sizing: border-box;
  border: 1px solid #e3e8ef;
  border-radius: 10px;
  background: #fff;
  position: relative;
  padding: 8px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}

/* Estado de "drop" da área da direita */
#equip_selected.dropping {
  background: #f8fafc;
  border: 2px dashed #cbd5e1;
  border-radius: 10px;
}

/* ---------- CARDS DA BUSCA (esquerda) ---------- */

/* Título (marca + nome lado a lado, uma linha) */
.equip-card .equip-meta {
  order: 1;
  font-size: 12px;           /* menor */
  line-height: 1.2;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.equip-card .equip-brand,
.equip-card .equip-name {
  display: inline;
}
.equip-card .equip-brand::after { content: " "; } /* espaço entre marca e nome */

/* Imagem embaixo, ocupando o resto */
.equip-card .equip-photo {
  order: 2;
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f8fafc;
  border-radius: 6px;
  overflow: hidden;
}
.equip-card .equip-photo img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  -webkit-user-drag: none;
  user-drag: none;
}

/* Cursor amigável para drag */
.equip-card { cursor: grab; }
.equip-card:active { cursor: grabbing; }

/* ---------- CARDS SELECIONADOS (direita) ---------- */

/* Reaproveita visual dos cards; ajusta estrutura atual do .equip-chip */
.equip-chip { /* já herdou base dos cards */
  align-items: stretch;
  padding: 8px 8px 8px 8px;
}

/* Texto (marca + nome) primeiro, uma linha */
.equip-chip .txt {
  order: 1;
  font-size: 12px;           /* menor */
  line-height: 1.2;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.equip-chip .txt b { margin-right: 4px; }

/* Imagem embaixo ocupando o espaço restante */
.equip-chip > img {
  order: 2;
  width: 100%;
  height: 70px;              /* semelhante à esquerda */
  object-fit: contain;
  background: #f8fafc;
  border-radius: 6px;
}

/* Botão remover no canto superior direito */
.equip-chip .equip-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 22px;
  height: 22px;
  border: 1px solid #e2e8f0;
  border-radius: 50%;
  background: #fff;
  color: #64748b;
  line-height: 20px;
  text-align: center;
  cursor: pointer;
  padding: 0;
}
.equip-chip .equip-remove:hover {
  background: #fee2e2;
  color: #ef4444;
  border-color: #fecaca;
}


/* Ajustes do campo de busca rápida do cabeçalho baseados na resolucao da tela */
.dm-search-result-item {
    padding: 8px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
    display: flex;
    align-items: center;
}
.dm-search-result-item:hover {
    background-color: #f8f8f8;
}
#dm_search_product{

}

.dm-search-results-box{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    z-index:1000;
    background:white;
    border:1px solid #ccc;
    max-height:300px;
    overflow-y:auto;
}
.dm-compare-product-img{
    width:85px;
    height:85px;
    float: left;
    margin-right:10px;
    border: solid 1px #ccc;
}

.dm_quick_search_box{
    position:relative;
}
.dm-quick-search{
    position:relative !important;
    z-index:9999 !important;
    background-color:#fff !important;
    border:solid 1px #c0c0c0 !important;
    margin: 0px !important;
    width:100% !important;
}
.dm-quick-search-results-box{
    display:none;
    position:absolute;
    z-index: 9999;
    max-height:300px;
    overflow-y:auto;
}
#subheader{
    background-color:#e2dbcf;
    margin-top:54px;
}
#profile_banner{
    background-color:#e2dbcf;
    margin-bottom: -110px !important;
}
#profile_banner div{
     margin-top: -40px !important;
     max-width:1300px;
     margin:0 auto;
     height:300px;
}
@media only screen and (max-width: 992px){
    #profile_banner{
        margin-top:-35px;
    }
}

@media only screen and (max-width: 500px){
    .dm_quick_search_box{
        left:0px !important;
        width:100% !important;
        text-align:center;
        top:0px !important;
    }
    .dm-quick-search{
        margin-left:-10px !important;
        top: 7px !important;
        width: 85% !important;
    }
    .dm-quick-search-results-box{
        width:400px;
        margin-top:58px;
        left:20%;
    }
}
@media only screen and (min-width: 501px) and (max-width: 575px){
    .dm_quick_search_box{
        width:540px !important;
        left:50% !important;
        margin-left: -270px;
        text-align:center;
        top:0px !important;
    }
    .dm-quick-search{
        margin-left:-10px !important;
        top: 7px !important;
        width: 85% !important;
    }
    .dm-quick-search-results-box{
        width:84% !important;
        left:50% !important;
        margin-top:58px;
        margin-left: -42%;
    }
}
@media only screen and (min-width: 576px) and (max-width: 767px){
    .dm_quick_search_box{
        width:540px !important;
        left:50% !important;
        margin-left: -270px;
        text-align:center;
        top:0px !important;
    }
    .dm-quick-search{
        margin-left:-10px !important;
        top: 7px !important;
        width: 85% !important;
    }
    .dm-quick-search-results-box{
        width:84% !important;
        left:50% !important;
        margin-top:58px;
        margin-left: -42%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 979px){
    .dm_quick_search_box{
        width:540px !important;
        left:50% !important;
        margin-left: -270px;
        top:-100px !important;
    }
    .dm-quick-search{
        margin-left:100px !important;
        width: 60% !important;
    }
    .dm-quick-search-results-box{
        width:84% !important;
        left:50% !important;
        margin-top:-20px;
        margin-left: -42%;
    }
}
@media only screen and (min-width: 980px) and (max-width: 992px){
    .dm_quick_search_box{
        width:95% !important;
        left:50% !important;
        margin-left: -49%;
        top:-100px !important;
    }
    .dm-quick-search{
        margin-left:200px !important;
        width: 50% !important;
    }
    .dm-quick-search-results-box{
        width:96% !important;
        left:50% !important;
        margin-top:-20px;
        margin-left: -49%;
    }
    .dm-quick-search-result-item {
        margin-left:200px !important;
        width: 50% !important;
    }
}
@media only screen and (min-width: 993px) and (max-width: 1199px){
    .dm_quick_search_box{
        width:95% !important;
        left:50% !important;
        margin-left: -49%;
        top:-5px !important;
    }
    .dm-quick-search{
        margin-left:200px !important;
        width: 22% !important;
    }
    .dm-quick-search-results-box{
        width:95% !important;
        left:50% !important;
        margin-left: -49%;
        margin-top:65px;
    }
    .dm-quick-search-result-item {
        margin-left:200px !important;
        width: 40% !important;
    }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px){
    .dm_quick_search_box{
        width:1140px !important;
        left:50% !important;
        margin-left: -570px;
        top:-5px !important;
    }
    .dm-quick-search{
        margin-left:200px !important;
        width: 25% !important;
    }
    .dm-quick-search-results-box{
        width:1140px !important;
        left:50% !important;
        margin-left: -570px;
        margin-top:65px;
    }
    .dm-quick-search-result-item {
        margin-left:200px !important;
        width: 40% !important;
    }
}
@media only screen and (min-width: 1400px){
    .dm_quick_search_box{
        width:1320px !important;
        left:50% !important;
        margin-left: -660px;
        top:-5px !important;
    }
    .dm-quick-search{
        margin-left:200px !important;
        width: 30% !important;
    }
    .dm-quick-search-results-box{
        width:1320px !important;
        left:50% !important;
        margin-left: -660px;
        margin-top:65px;
    }
    .dm-quick-search-result-item {
        margin-left:200px !important;
        width: 40% !important;
    }
}
@media only screen and (min-width: 1090px){
    .dm_quick_search_box{
        top:25px !important;
    }
}

.dm-quick-search-result-item {
    padding: 8px;
    border: 1px solid #eee;
    cursor: pointer;
    display: flex;
    align-items: center;
    background:white;
    border-top:0;
    margin-bottom:0 !important;
}
.dm-quick-search-text {
    display: flex;
    flex-direction: column;
}
.dm-quick-search-result-item:hover {
    background-color: #f8f8f8;
}
#dm_quick-search_product{

}



@media only screen and (max-width: 575px){
    .dm-quick-search-results-box{
        width:360px;
        top:90px;
        left:0;
    }
}

.dm-quick-search-product-img{
    height:40px;
    margin-right:10px;
    border:solid 1px #c0c0c0;
}


/* ====== GALERIA JUSTIFICADA (corrigida) ====== */
/* área da galeria com 1px de padding */
/* container da galeria: 1px de padding total */
.post-gallery{
  position: relative;
  padding: 1px;                  /* pedido: 1px ao redor */
  background: #ccc;              /* opcional */
  box-sizing: content-box;       /* largura = conteúdo (padding não reduz o layout interno) */
  line-height: 0;                /* evita espaços de linha acidentais */
}

/* ANULA gutters/neg-margins da .row do Bootstrap quando ela também é .post-gallery */
.post-gallery.row{
  --bs-gutter-x: 0 !important;
  --bs-gutter-y: 0 !important;
  margin: 0 !important;          /* remove margins negativas do .row */
}
.post-gallery.row > *{
  padding: 0 !important;         /* se sobrar algum filho residual */
  margin: 0 !important;
}

/* itens posicionados */
.post-gallery > a{
  position: absolute;
  display: block;
  overflow: hidden;
  border: 0;
  border-radius: 0;              /* sem cantos arredondados */
}

/* imagem preenche o bloco */
.post-gallery > a > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;             /* corta sem distorcer */
}

/* oculta o rótulo "Galeria de imagens (n)" do editor */
.post-gallery[data-label]::before{ display: none !important; }



.brand-description-box {
    text-align: left;
    padding: 18px !important;

    /* Aqui vem a rolagem */
    max-height: 420px; /* ajuste a altura máxima que deseja */
    overflow-y: auto;  /* cria a barra de rolagem vertical */
    overflow-x: hidden; /* evita barra horizontal */
    border-radius: 5px; /* opcional, deixa cantos arredondados */
}

/* Estilizando a barra de rolagem no Webkit (Chrome, Edge, Safari) */
.brand-description-box::-webkit-scrollbar {
    width: 8px;
}

.brand-description-box::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 8px;
}

.brand-description-box::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 8px;
}

.brand-description-box::-webkit-scrollbar-thumb:hover {
    background: #555;
}






.fixed-header {
  position: fixed;
  top: 0;
  left: 0;
  background: #f9f6f2;
  z-index: 9999;
  display: none; /* só aparece quando ativado */
  pointer-events: none; /* evita clicar no cabeçalho duplicado */
  border-bottom: 2px solid #ccc;
  border-top: solid 1px #c0c0c0;
}


.fixed-header th {
  background: #f9f6f2;
  text-align: center;
}


#spec-tec-table th{
    background-color: #eeeae8;
}
#spec-tec-table tr{
    background-color: #fff;
}


.category-toggle .chevron { transition: transform .2s ease; display:inline-block; }
.category-toggle[aria-expanded="false"] .chevron { transform: rotate(-90deg); }
.w-40 { width: 40%; } /* ajuda a alinhar nome/valor */

#banner_home{
    padding-right:50px;
    margin-top:50px;
}
#banner_home img{
    width:100%;
    border: solid 2px black;
    margin-left:25px;"
}
