/*
 ----------editar 
 .cdv .grid   
 
 
 */   
    
    
    .logo-wrap{
        width: 40%;
        margin: 0 auto;
    }
    .img-logo{
       
        width: 100%;
    }
    /*---------------------------------------*/

    .field{
      height:38px;
      border:1px solid var(--input-border);
      border-radius:7px;
      background-color: rgba(0, 0, 0, 0);
      display:flex;
      align-items:center;
      gap:8px;
      padding:0 10px;
      transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease, transform .18s ease;
      border: solid 1px var(--txt);
    }

    .field:focus-within{
      border-color: var(--vinho-2);
      box-shadow:
        0 0 0 3px var(--vinho-focus),
        0 6px 14px rgba(122, 15, 43, .08);
      /*background:#fff;*/
      transform: translateY(-1px);
    }

    .field .icon{
      width:16px;
      height:16px;
      flex:0 0 16px;
      color:#7e8aa0;
      display:flex;
      align-items:center;
      justify-content:center;
      transition: color .18s ease;
    }

    .field:focus-within .icon{ color: var(--vinho-2); }

    .field .icon svg{
      width:16px;
      height:16px;
      display:block;
    
    }

    .field input{
      width:100%;
      border:0;
      outline:0;
      background:transparent;
      color:var(--txt);
      font-size:13px;
    }

    .field input::placeholder{ color:var(--txt); }

    .help{
      /*display:flex;
      align-items:flex-start;
      gap:7px;
      font-size:10.8px;
      line-height:1.25;
      color:#4f5c74;
      margin-top:1px;*/
      min-height: 20px;
      font-size: 13px;
      padding: 0 10px 10px 10px;
      color: var(--vinho);
      
    }

  
/*--------------------botoes-----------------------------*/
    .btn{
      margin-top:3px;
      width:100%;
      height:41px;
      border:1px solid var(--vinho-borda);
      border-radius:8px;
      cursor:pointer;
      background: linear-gradient(180deg, var(--vinho-2), var(--vinho));
      color:var(--branco);
      font-weight:700;
      font-size:15px;
      box-shadow:0 10px 18px rgba(122,15,43,.20);
      transition:.2s ease;
    }

    .btn:hover{
      background: linear-gradient(180deg, var(--vinho-3), var(--vinho-2));
      transform:translateY(-1px);
      box-shadow:0 12px 22px rgba(122,15,43,.25);
    }

    .btn:focus-visible{
      outline: none;
      box-shadow:
        0 0 0 4px var(--vinho-focus-strong),
        0 12px 22px rgba(122,15,43,.25);
    }
/*-------------------unica escolha-------------------------*/

    .btn-unica_escolha{
      margin:5px 0;
      width:100%;
      height:41px;
      border:1px solid var(--vinho-borda);
      border-radius:8px;
      cursor:pointer;
      background: rgba(0, 0, 0, 0);
      color:var(--vinho);
      font-weight:700;
      font-size:15px;
      transition:.2s ease;
    }

    .btn-unica_escolha:hover{
      background: linear-gradient(180deg, var(--vinho-3), var(--vinho-2));
      transform:translateY(-1px);
      box-shadow:0 12px 22px rgba(122,15,43,.25);
      color: var(--branco);
    }

    .btn-unica_escolha:focus-visible{
      outline: none;
      box-shadow:
        0 0 0 4px var(--vinho-focus-strong),
        0 12px 22px rgba(122,15,43,.25);
    }




/*----------------------botões lado a lado-----------------*/
  .btn-row{
    display:flex;
    gap:12px;
    width:100%;
    margin-top:40px;
  }

   .btn-sair{
                    /* um do lado do outro ocupando metade */
    height:41px;
    border:1px solid var(--txt-soft);
    border-radius:8px;
    cursor:pointer;

    background: rgba(0,0,0,0);
    color: var(--txt-soft);
    font-weight:700;
    font-size:13px;

    box-shadow:0 10px 18px rgba(0,0,0,.10);
    transition:.2s ease;
    margin: 0 20%;
    width: calc(100% - 40%);

  }

  .btn-white{
    flex:1;                 /* um do lado do outro ocupando metade */
    height:41px;
    border:1px solid var(--txt-soft);
    border-radius:8px;
    cursor:pointer;

    background: rgba(0,0,0,0);
    color: var(--txt-soft);
    font-weight:700;
    font-size:13px;

    box-shadow:0 10px 18px rgba(0,0,0,.10);
    transition:.2s ease;
  }

  .btn-sair:hover,
  .btn-white:hover{
    /*background: linear-gradient(180deg, #ffffff, #ededed);*/
    transform:translateY(-1px);
    box-shadow:0 12px 22px rgba(0,0,0,.14);
    border:1px solid var(--vinho);
    color: var(--vinho);
  }
  .btn-sair:focus-visible,
  .btn-white:focus-visible{
    outline:none;
    box-shadow:
      0 0 0 4px var(--vinho-focus-strong),
      0 12px 22px rgba(0,0,0,.14);
  }

  /* mobile: se a tela ficar muito estreita, empilha */
  @media (max-width:420px){
   
  }

  /*---------------------*/


    /*.divider{
      height:1px;
      background:rgba(20,35,70,.08);
      margin:14px -16px;
    }*/

    .section-title{
      text-align:center;
      color:#5f6e84;
      font-size:12.5px;
      margin-bottom:10px;
    }

    .channels{
      display:flex;
      justify-content:center;
      gap:8px;
      flex-wrap:wrap;
      margin-bottom:14px;
    }

    .channel{
      width:34px;
      height:34px;
      border-radius:6px;
      border:2px solid var(--vinho);
      /*background:rgba(255,255,255,.8);*/
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--vinho);
      text-decoration:none;
      transition:.2s ease;
    }

    .channel:hover{
      /*background:#fff;*/
      transform:translateY(-1px);
      box-shadow:0 6px 14px rgba(0,0,0,.08);
      border-color: var(--vinho-2);
      color: var(--vinho-2);
    }

    .channel:focus-visible{
      outline: none;
      border-color: var(--vinho-2);
      box-shadow: 0 0 0 4px var(--vinho-focus);
      background:#fff;
    }

    .channel svg{
      width:18px;
      height:18px;
      display:block;
    }

    .support{
      text-align:center;
      font-size:11.5px;
      line-height:1.35;
      color:#4a5870;
      margin-bottom:6px;
    }

    .support strong{ color:#223251; }

    .support a{
      color: var(--vinho-2);
      text-decoration:none;
      font-weight: 500;
    }

    .support a:hover{ text-decoration:underline; }

    .support a:focus-visible{
      outline:none;
      border-radius:4px;
      box-shadow: 0 0 0 3px var(--vinho-focus);
    }

    .foot{
      text-align:center;
      font-size:10px;
      color:#7a8598;
      margin-top:8px;
      line-height:1.3;
    }

    .foot a{
      color:#74819a;
      text-decoration:underline;
    }

    .foot a:focus-visible{
      outline:none;
      border-radius:4px;
      box-shadow: 0 0 0 3px var(--vinho-focus);
    }

    /*------------novas inserções---------*/
    .txt-pergunta{
        font-size: 18px;
        margin: 10px 0 5px 0;
        text-align: center;
        color: var(--txt);
    }
    .txt-pergunta2{
        font-size: 13px;
        margin: 10px 0;
        text-align: center;
        color: var(--txt-soft);
    }
    .txt-pergunta3{
        font-size: 16px;
        margin: 10px 0;
        text-align: center;
        color: var(--txt-soft);
    }
    .txt-form{
        font-size: 16px;
        margin: 10px 0;
        text-align: center;
        color: var(--vinho);
    }
    /*-----------*/
    .espaco-top{
        margin-top: 60px;
    }
    .espaco-final{
        padding-bottom: 40px;
    }

    /*--------------------dados usuario logado-------*/
    /*----------------------caixa dividas-----------------*/
  .caixa-divida{
    border: solid 1px #CCC;
    border-radius: 10px;
    padding: 3px 0;
    margin: 20px 0;
    background-color: var(--branco);
    box-shadow: 0 10px 18px rgba(0,0,0,.10);
  }
  .caixa-dados{
    border-bottom: solid 1px #CCC;
    padding-bottom: 10px;
  }
 

  .caixa-linha{
 
    padding: 5px 0;
    font-size: 13px;
   
  }
  .coluna-esq{

    width: calc(50% - 30px);
    float: left;
   margin-left: 20px;
   margin-right: 10px;
  
  }
  .coluna-dir{
    float: right;
    margin-right: 20px;
    margin-left: 10px;
    
  }
  .txt-alinha-esq{
    text-align: right;
  }


  .rodape{
    clear: both;
  }


    /* ------------------------RESPONSIVO: ocupa a tela toda, sem bordas e sem espaço externo ----------*/
    @media (max-width: 600px){
  
      .divider{
        margin:12px -14px;
      }

      .btn{ height:42px; font-size:14px; }
      .support{ font-size:11px; }
      .section-title{ font-size:12px; }
    }

    @media (max-width: 360px){
      .field{ height:36px; }
      .field input{ font-size:12px; }
      .channel{ width:32px; height:32px; }
      .channel svg{ width:16px; height:16px; }
    }

















/*///////////////////////////////////lista divida//////////////////////////////*/


  /* Tudo aqui é isolado pela classe .cdv (não altera seu site fora do bloco) */

  .cdv{
    --vinho:#7a0f2b;
    --vinho-2:#a2143b;
    --vinho-3:#5f0c22;

    --ok:#16a34a;
    --warn:#f59e0b;
    --text:#1f2937;
    --muted:#6b7280;
    --laranja:#ca502b;

    --bg:#f6f7f9;
    --surface:#ffffff;
    --border:#e5e7eb;
    --border2:#eef2f7;
    --shadow: 0 1px 2px rgba(0,0,0,.06), 0 8px 24px rgba(0,0,0,.06);
    --radius: 18px;

    --shadow-discreto:0 1px 2px rgba(0,0,0,.05);

    /*font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;*/
    color: var(--text);
    width:100%;
   
  }
 .cdv { margin-bottom: 100px;}
  .cdv *{ box-sizing:border-box;}

  .cdv .wrap
  
  {
    width:100%;
    padding: 18px 50px;
    display:flex;
    justify-content:center;
    align-items:flex-start;
    /*background: var(--bg);
    border-radius: 16px;*/ /* opcional: fica bonito sem mexer no site */
  }

  .cdv .container{
    width:min(1080px, 100%);
    display:flex;
    flex-direction:column;
    gap:14px;
  }

 
  
  /* Grid centralizado */
  .cdv .grid{
   /* display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px;*/

    /*display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 2fr));
    gap: 14px;*/


    justify-content:center;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr); /* 33,33% */


    


  }


.grid-total{
  justify-content:center;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(1, 1fr); /* 33,33% */
}


@media (max-width: 1500px) {
  .cdv .grid {
   
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 1200px) {
  .cdv .grid {
   
    grid-template-columns: repeat(1, 1fr);
  }
}
@media (max-width: 1000px) {
  .cdv .grid {
    
    grid-template-columns: repeat(2, 1fr); /* 33,33% */
  }
}
@media (max-width: 800px) {
  .cdv .grid {
   
    grid-template-columns: repeat(1, 1fr); /* 33,33% */
  }
}
@media (max-width: 489px) {
  .cdv .wrap{
    padding: 18px 20px;}
  }
  /* CARD: flex-col e rodapé colado no final */
  .cdv .card{
    min-width: 150px;
    max-width: 100%;
    flex: 1 1 320px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    padding: 14px 14px 12px;
    position:relative;
    overflow:hidden;
    transition: .18s ease;

    display:flex;
    flex-direction:column;
    min-height: 260px; /* pode remover se não quiser altura mínima */
  }
  .cdv .card:hover{
    box-shadow: 0 2px 8px rgba(0,0,0,.08), 0 16px 40px rgba(0,0,0,.06);
    transform: translateY(-1px);
  }

  /* barra lateral de status */
 .cdv .card::before{
    content:"";
    position:absolute;
    top:0;left:0;bottom:0;
    width:6px;
    background: var(--vinho);
  }
 .cdv .card.is-ok::before{ background: var(--ok); }
 .cdv .card.termo::before{ background: var(--text); }
  .cdv .card.is-warn::before{ background: var(--warn); }
  .cdv .card.is-danger::before{ background: var(--vinho); }
  .cdv .card.is-laranja::before{ background: var(--laranja); }

 .row-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding-left:6px;
  }

  .cdv .bank{
    /*font-weight:900;*/
    font-size:15.5px;
    line-height:1.2;
  }

.bank-negociar{
  color:var(--vinho);
}
.bank-laranja{
  color:var(--laranja);
}
.cdv .bank-prioridade{
  color:var(--warn);
}
.cdv .bank-ok{
  color:var(--ok);
}




  .cdv .contract{
    margin-top:4px;
    font-size:12.5px;
    color:var(--muted);
    display:flex;
    gap:6px;
    align-items:center;
    flex-wrap:wrap;
  }
  .cdv .contract b{ color:#111827; font-weight:800; }

   .badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    border-radius: 999px;
    padding: 7px 10px;
    /*font-weight:900;*/
    font-size:12px;
    white-space:nowrap;
    border: 1px solid rgba(0,0,0,.08);
    background: #f9fafb;
    color:#111827;
  }
   .badge svg{ width:16px;height:16px; }

  .cdv .is-ok .badge{
    border-color: rgba(22,163,74,.25);
    background: rgba(22,163,74,.10);
    color: #14532d;
  }
  .cdv .is-ok .badge svg{ color: var(--ok); }

  .cdv .is-warn .badge{
    border-color: rgba(245,158,11,.28);
    background: rgba(245,158,11,.12);
    color: #7c2d12;
  }
  .cdv .is-warn .badge svg{ color: var(--warn); }

  .cdv .is-danger .badge{
    border-color: rgba(122,15,43,.25);
    background: rgba(122,15,43,.10);
    color: var(--vinho-3);
  }

  .cdv .is-laranja .badge{
    border-color: var(--laranja);
    color: var(--laranja);
  }

  .cdv .is-danger .badge svg{ color: var(--vinho); }
  .cdv .is-laranja .badge svg{ color: var(--laranja); }

  .card-body{
    padding-left:6px;
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:10px;
  }

  .cdv .msg{
    color: #374151;
    font-size:13.5px;
    line-height:1.35;
    margin:15px 0;
  }

  .cdv .meta{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:12px;
    flex-wrap:wrap;
    margin:0;
  }

  .cdv .parcel{
    font-size:13px;
    color: var(--muted);
    display:flex;
    gap:10px;
    align-items:center;
    flex-wrap:wrap;
  }
  .cdv .parcel .k{ color:#111827; font-weight:900; }

  .cdv .money{
    /*font-weight:1000;*/
    font-size:20px;
    letter-spacing:.2px;
    display:flex;
    align-items:center;
    gap:8px;
    color: var(--vinho);
  }
  .cdv .is-ok .money{ color: var(--ok); }
  .cdv .termo .money{ color: var(--text); }
  .cdv .is-warn .money{ color: #b45309; }
  .cdv .is-danger .money{ color: var(--vinho); }
  .cdv .is-laranja .money{ color: var(--laranja); }
  .cdv .money svg{ width:18px;height:18px;color: currentColor; }

  .cdv .divider{
    height:1px;
    background: var(--border2);
    margin: 12px 0 10px;
  }

  /* ESSA É A CHAVE: rodapé colado no final do painel */

.card-body{
  flex: 1 1 auto;            /* faz o corpo ocupar o espaço e empurra tudo pra baixo */
}

.cdv .divider{
  margin-top: auto;          /* garante que ele vá pro final quando sobrar espaço */
  margin-bottom: 10px;       /* distância do divider pro rodapé */
}

 .row-bottom{
      padding-left:6px;
      gap:10px;
  }
  .row-bottom2{
      gap:10px;
  }
   .row-bottom,
  .row-bottom2,
  .row-bottom3
  {
    margin-top:auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
  }

  .link-bnt,
  .cdv .link{
    display:flex;
    align-items:center;
    gap:8px;
    color:#374151;
    /*font-weight:800;*/
    text-decoration:none;
    font-size:13px;
    padding:8px 10px;
    border-radius: 999px;
    transition:.15s ease;
    cursor: pointer;
    border: none;
  }
  .link-bnt:hover,
  .cdv .link:hover{ background:#f3f4f6; }
  .link-bnt svg,
  .cdv .link svg{ width:18px;height:18px;color:#6b7280; }

  .btn_div{
    display:inline-flex;
    align-items:center;
    gap:9px;
    border-radius: 999px;
    padding: 10px 12px;
    /*font-weight:900;*/
    font-size:13px;
    cursor:pointer;
    text-decoration:none;
    white-space:nowrap;
    border: 1px solid rgba(0,0,0,.10);
    background: #111827;
    color:#fff;
    transition:.15s ease;
  }


  .btn_div:hover{ transform: translateY(-1px); box-shadow: 0 10px 18px rgba(0,0,0,.10); }
  .btn_div svg{ width:18px;height:18px;color:#fff; }

  

  .cdv .is-danger .btn_div{
    background: linear-gradient(180deg, var(--vinho-2), var(--vinho));
    border-color: rgba(122,15,43,.35);
  }
  .cdv .is-laranja .btn_div{
    border-color: var(--laranja);
    background-color: var(--laranja);
  }
  .cdv .is-warn .btn_div{
    background: linear-gradient(180deg, #fbbf24, var(--warn));
    border-color: rgba(245,158,11,.35);
    color:#111827;
  }
  .cdv .is-warn .btn_div svg{ color:#111827; }
  .cdv .is-ok .btn_div{
    background: linear-gradient(180deg, #22c55e, var(--ok));
    border-color: rgba(22,163,74,.35);
  }
   .cdv .termo .btn_div{
    background-color: var(--text);
  }

  @media (max-width: 720px){
    .cdv .topbar{ padding: 12px; border-radius: 20px; }
    .cdv .search{ min-width: 100%; }
    .cdv .card{ padding: 13px 13px 11px; min-height: 0; }
    .cdv .money{ font-size: 19px; }
    .cdv .divider{
      margin-top: 15px;
    }
  }



















  /*/////////////////////////painel boleto//////////////////////*/

.painel-conteudo{
  width: 900px;
  margin: 30px auto;
  border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
  border: solid 1px rgba(0,0,0,.08);
  background-color: #FFF;
}


.painel-neg-acordos{
  width: 900px;
  margin: 30px auto;
}







.painel-conteudo::after{
  height: 100%;
  width: 40px;
  background-color: #5f0c22;
}




.espaco-interno{
  padding: 20px;
}
.espaco-interno-filtro{
  padding: 10px 20px;
}


.barra-rodape-invisivel{
 
    position: fixed;
    bottom: 0;
    background-color: #244a27;
}

.barra-rodape{
  
    min-height: 70px;

    background-color: #FFF;
    width:900px;
 
    border-top: 1px solid rgba(0,0,0,.05);
   
}

.fundo-top-fecha{
  background-color: rgba(0,0,0,.08);
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 7000;
  position: fixed;
}
#fundo-top-fecha-oculta{
  display: none;
}
#fundo-top-fecha-mostra{
  display: none;
}

.barra-top-invisivel{
    position: fixed;
    top: 10px;
    z-index: 8000;
}

.barra-top{
  border: 1px solid rgba(0,0,0,.05);
    min-height: 60px;
    background-color: #FFF;
    width:900px;
    border-radius: 20px;
    box-shadow: var(--shadow-discreto);
}



.rodape-baixar{
  display: none;
}
.btn-baixar{
  
}

 @media (max-width: 1360px){
  .painel-neg-acordos,
 .painel-conteudo{
    width: auto;
    margin: 30px 30px;
   
  }
  .barra-top,
  .barra-rodape{
    width:auto;
  }
  .barra-top-invisivel,
  .barra-rodape-invisivel{
 
    left: 380px;
    right: 30px;
  }

  


}

 @media (max-width: 1000px){
  #fundo-top-fecha-mostra{
    display: block;
  }
  #barra_painel_filtro-coulta{
    display: none;
  }

  .barra-top-invisivel,
   .barra-rodape-invisivel{
      left: 0;
      right: 0;
    }
    .barra-top-invisivel{
      top: 0;
    }

    .barra-top{
      border-radius: 0;
      border: none;
      border-bottom: 1px solid rgba(0,0,0,.05);
    }

    .rodape-baixar{
      display: block;
    }
    .btn-baixar{
      display: none;
    }


 }
 @media (max-width: 500px){
  .painel-neg-acordos,
 .painel-conteudo{
    margin: 30px 20px;
  }

 
  
}


/*-------------------------dentro conteudo boleto-------------------------------*/

.painel_boleto{
  padding-top: 1px;
}


.txt-neg-acordo{
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 20px;
  text-align: center;
}
.pergunta-txt-neg{
  font-size: 14px;
  color: var(--vinho);
  text-align: center;
  margin-bottom: 15px;
  margin-top: 7px;
}

.verde-valor{
  color: #14532d;
}

.vinho-bac{
  background: var(--vinho);
}


 .contract{
   color: var(--text);
   margin-top: 3px;
   font-size: 14px;
  }
.parcela-dados{
  font-size: 14px;
}
.parcela-dados2{
  color: var(--vinho);
  padding-top: 20px;
  font-size: 18px;
}





.meta2{
  text-align: center;
}
.txt-valor{
  text-align: left;
  font-size: 34px;
}
.txt-valor-nego{
  text-align: left;
  font-size: 14px;
}
.bank-nego{
  font-size: 14px;;
}
.contract-nego{
  font-size: 13px;
}

.div_qr{
  padding: 40px 20px 0 20px;
}

.div_barra{
  padding: 70px 20px 0 20px;
}

.txt-codigo{
  font-size: 13px;
  padding: 7px;
  color: var(--text);
 /* border: solid 1px var(--text);*/
  margin: 7px auto;
  border-radius: 7px;
  overflow: auto;
  
  
  width: calc(100% - 40px);

 

  word-break: break-word;      /* compatibilidade */
  overflow-wrap: break-word;   /* padrão atual */
  word-wrap: break-word;       /* legado */
}


 @media (max-width: 500px){
  

  .txt-valor{
    text-align: center;
  }
 
  
}












/*-------------------------------opções de parcela-----------------------*/

/* FILTRO */
.btn-flutuante{
  position: fixed;
  right: 20px;
  top: 5px;
  z-index: 2000;
  display: none;
}


.menu-espaco_topo-nego{
  margin-top: 200px;
}
.separa_filtro{
  margin-top: 15px;
}

  .neg-limpar-rodape{
    display: none;
  }

.neg-input input:focus {
  border: 2px solid var(--vinho);
  outline: none;
}
.neg-input svg{
  color: #5f0c22;
}

.neg-input .txt-inpu-flut{
    position: absolute;
    background-color: #FFF;
    margin-top: -8px;
    font-size: 13px;
    padding: 0 7px;
    margin-left: 10px;
    color: var(--text);
}


/*input::placeholder {
    color: var(--vinho);
}*/

.neg-filtro{
position:fixed;
top:0;
left:0;
width:100%;
background:#fff;
border-bottom:1px solid var(--neg-border);
box-shadow:0 2px 6px rgba(0,0,0,0.05);
z-index:999;
}

.neg-filtro-wrap{
max-width:1000px;
margin:auto;
padding:15px;
display:flex;
gap:10px;
flex-wrap:wrap;
align-items:center;
}

.neg-input{
flex:1;
min-width:10px;
position:relative;
}

.neg-input input{
width:100%;
height:40px;
padding:3px 5px 5px 40px;
border:1px solid var(--neg-border);
border-radius:8px;
}

.borda-meio{
  border-left: solid 1px #CCC;
  border-right: solid 1px #CCC;
}

.neg-input svg{
position:absolute;
left:10px;
top:10px;
width:18px;
height:18px;
color:#888;
}

.neg-btn{
height:40px;
padding:0 16px;
border-radius:8px;
border:none;
cursor:pointer;
font-weight:bold;
}

.corpo-neg{
  
}
.lista-opcoes-acordo{
  padding: 15px;
  border-radius: 7px;
  box-shadow: 0 1px 2px rgba(0,0,0,.05);
  border: solid 1px rgba(0,0,0,.08);
  background-color: #FFF;
  min-height: 10px;
  margin: 5px 0;
  transition: 0.5s;
  cursor: pointer;
}


.lista-opcoes-acordo:hover{
  box-shadow: var(--shadow);
  background-color: var(--neg-border);
  border: solid 1px var(--vinho);
}
.cinza-claro{
  color: #6b7280;
}

.top-margin{
  margin-top: 5px;
}

.corpo-neg{
  padding: 0 20px;
}


.ico-acordos{
  height: 30px;
  width: 30px;
  color: #CCC;
}


 @media (max-width: 1000px){
 
  .btn-flutuante{
    display: flex;
  }
  
  .menu-espaco_topo-nego{
    margin-top: 70px;
  }
  .corpo-neg{
  padding: 0;
  }
}
 @media (max-width: 600px){
  .corpo-neg{
  padding: 0;
}

 /* .neg-limpar-top{
    display: none;
  }*/

  .neg-limpar-rodape{
    display: flex;
  }

}

 @media (max-width: 450px){
  .neg-input{
    flex:none;
    min-width:10px;
    width: 100%;
    position:relative;
  }
  .borda-meio{
    border: none;
  }
  .neg-input input{
    border: solid 1px #CCC;
    border-radius: 10px;
  }



}
/*
  crie um painel flutuante onde eu possa adicionar conteudo 
  que ajuste ao tamnho da altura da tela
  fique sempre no centro
  tenha um botão com x fixo do lado direito
  e um rodape com botão aceitar fixo do lado direito
  no centro fique o conteudo como texto
   o painel deve conter bordas arredondadas
   layout inspirado no google


*/

.fontG{
  font-size: 18px;
}
.peinel-espaco-interno{
  width: 400px;
  margin: 0 auto;
}
.painel-titulo-alinha{
  margin: 0 auto;
  text-align: center;
  font-size: 18px;
  color: #111827;
}

/* fundo escuro */
.painel-fundo_oculto{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 9000;
}
/*alinha painel*/
.overlay{
    position:fixed;
    top: 20px;
    width: 600px;
    z-index:9000;
  
    margin: 0 auto;
    left: 0;
    right: 0;
}

/* painel */
.painel{
    max-height:calc(100dvh - 40px);
    min-height: 300px;
    background:#fff;
    border-radius:14px;
    box-shadow:0 10px 30px rgba(0,0,0,0.2);

    display:flex;
    flex-direction:column;
    overflow:hidden;
}

/* topo */
.painel-topo{
    display:flex;
    justify-content:flex-end;
}

/* botão fechar */
.btn-fechar{
    border:none;
    background:none;
    font-size:20px;
    cursor:pointer;
}

/* conteudo */
.painel-conteudo-exr{

    padding:20px;
    overflow:auto;
    flex:1;
    color:#333;
    line-height:1.5;
}

/* rodape */
.painel-rodape{
    padding:12px 16px;
    border-top:1px solid #eee;
    display:flex;
    justify-content:flex-end;
}

/* botão aceitar */
.btn-aceitar{
    background:#1a73e8;
    border:none;
    color:#fff;
    padding:10px 20px;
    border-radius:8px;
    cursor:pointer;
    font-size:14px;
}

.btn-aceitar:hover{
    background:#1557b0;
}



 @media (max-width: 640px){


  .overlay{

    width: calc(100% - 40px);

  }
 }

 @media (max-width: 500px){
  .peinel-espaco-interno{
    width: auto;
  }
}
/*//////////////////////lista conteudo/////////////////////*/
.txt-titulo-mais-info{
   color: var(--vinho);
   padding: 3px;
}
.txt-titulo-mais-info div{
  font-size: 14px;
  float: left;
  margin-left: 5px;

}
.txt-titulo-mais-info svg{
  float: left;
  height: 15px;
  width: 15px;
}



.alinhamento-barra-bottom{
  padding: 0 15px;
}




.it-menu-ativado,
.it-menu{
  border-top: solid 2px transparent;
  text-align: center;
  color: #999;
  padding: 7px;
  width: calc(33.33333% - 14px);
  cursor: pointer;
  transition: 0.5s;
}
/*
.it-menu:hover{
  border-top: solid 2px #FFF;
  color: #FFF;
  background-color: var(--vinho);
  border-radius: 20px 20px 0 0;
}*/
.it-menu:hover,
#it-menu-ativado:hover,
#it-menu-ativado{
  border-top: solid 2px var(--vinho);
  color: var(--vinho);

}
.alinhamento-barra-bottom:hover #it-menu-ativado{
  color: #999;
  border-top: solid 2px transparent;
}

.it-menu svg{
  height: 30px;
  width: 30px;
  margin: 0 auto;
}
.txt-it-menu{
  font-size: 12px;
}

.alinha_btn-info{
  text-align: right;
  padding: 7px 15px;
  position: absolute;
  right: 0;
  bottom: 65px;
}

/*---------conteudo-----*/
.txt_ti-conteudo2,
.txt_ti-conteudo{
 font-size: 16px;
 color: var(--text);
 margin-bottom: 15px;

}
.txt_ti-conteudo2{
   border-top: solid 1px #CCC;
 padding-top: 10px;
}
.espaco-top-txt{
  margin-top: 30px;
}
.cor-vinho{
  color: #3b0000;
}
.txt_conteudo{
  font-size: 16px;
  margin-left: 10px;
}
.btn-negociar-titulos-espaco{
  height: 50px;
}

#iten-selecionado{
  background-color: rgba(172, 60, 60, 0.459);
  border: solid 1px rgba(172, 60, 60, 0.925);
}

.barra-operacoes{
  padding: 10px;
  border-bottom: solid 1px rgba(0,0,0,.05);
}
.barra-operacoes-termo{
  padding: 10px;
  border-bottom: solid 1px rgba(0,0,0,.05);
}

.opr-item{
  float: left;
 width: calc(50% - 30px);
 padding:0 10px;
 margin: 0 15px;
 text-align: center;
  color: #333;
  cursor: pointer;
}
.opr-item:hover{
  color: #3b0000;
}


.opr-item svg{
  height: 20px;
  width: 20px;
}
.divisoria{
  border-top: solid 1px #CCC;
}



/*------------login ---------------*/
.fotografia {
  display: flex;
  justify-content: flex-start; /* alinha à esquerda */
  align-items: center; /* centraliza na vertical */
  gap: 10px; /* espaço entre os itens (opcional) */
  padding: 10px 15px 10px 10px;
 border-bottom: solid 1px #CCC;
 cursor: pointer;
 transition:0.5s;
}
.google-btn{
   display: flex;
  justify-content: center; /* centraliza horizontal */
  align-items: center;     /* centraliza vertical */
  gap: 10px;               /* espaço entre os dois */
  padding: 10px 15px 10px 10px;
  border-bottom: solid 1px #CCC;
  transition:0.5s;
}

.google-btn:hover{
  color:#6a0d25;
  border-radius: 7px;
  box-shadow: rgba(122, 15, 43, 0.082);
  background-color: rgba(255,255,255,.5);
}
.fotografia img{
  height: 50px;
  width: 50px;
  border-radius: 150px;
}

.fotografia p{
  font-size: 16px;
  color: #24324a;
  word-break: break-all;
}
.fotografia p span{
  font-size: 14px;
  color: #5f6f87;
 
}