@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;600;700;900&display=swap');
*{
	padding:0;margin:0;	box-sizing:border-box;	-webkit-box-sizing:border-box;	-ms-box-sizing:border-box;	-moz-box-sizing:border-box;	}
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
body{
	font-family: 'Inter', sans-serif;	font-size:1rem;	background: #fff;	height:100%;}
::-webkit-scrollbar{width:5px; height:7px}
::-webkit-scrollbar-thumb { background: #454648;border-radius:5px}
::-webkit-scrollbar-track { background:#cacaca}

:focus{outline:none;transition: opacity .4s;}
:focus::placeholder{opacity:0;transition: opacity .4s;}

a{text-decoration:none}

.base-topo .barra{
  background-color: #ffffff;
  padding:.6rem;
  border-bottom: 1px solid #e9edf3;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.04);
}
.base-topo .barra .conteudo {
  display:flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}
.base-topo .barra .submenu
{
  justify-content: space-between;
  align-items: center;
  gap:10px;
  display:none
}

.base-topo .barra .contatos
{
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
  display: flex !important;
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
  visibility: visible !important;
  opacity: 1 !important;
}

.base-topo .barra .contatos li
{
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.base-topo .barra .contatos li a
{
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #0f172a;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  transition: color 0.2s ease;
}

.base-topo .barra .contatos li a:hover
{
  color: #3aa6ea;
  opacity: 0.85;
}

.base-topo .barra .contatos li a svg
{
  flex-shrink: 0;
}

/* Garantir que contatos apareçam sempre */
@media (min-width: 768px) {
  .base-topo .barra .contatos {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

.base-topo .barra .submenu li
{
  display: block;
}

.base-topo .barra .submenu a
{
  color: #0f172a;
  font-weight: 600;
}

.base-topo .barra .submenu a:hover
{
  color: #3aa6ea;
  opacity: 0.85;
}

/*contatos*/
.base-topo .barra .submenu{
  display: none;
  position: absolute;
  right: 0;
  background: #000;
  top: 3.5rem;
  border-radius: 8px;
  left: 10px;
  z-index: 1;
  width: 95%;
}
.base-topo .barra .submenu li {
  display: grid;gap:10px
}
.base-topo .barra .submenu li a {
  color:#fff;    padding: 0.5rem;transition:all .4s
}
.base-topo .barra .submenu li a:hover {
  transition:all .4s;opacity:.5
}
.base-topo .barra .submenu li a svg path{
  stroke:#fff;
}

/**/
.conteudo{max-width:100%;width:1033px;margin:0 auto}

/*areaTopo*/
.areaTopo{ padding: 1.5em 1rem;}
.areaTopo .logo {width: auto; min-width: 144px; display: flex; align-items: center;}
.areaTopo .logo .img-fluido{width: 100%; max-width: 200px; height: auto;}
.areaTopo .logo .logo-text {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    text-decoration: none;
    white-space: nowrap;
}
.areaTopo .conteudo{ display: grid;    flex-wrap: wrap;gap: 10px;}
.areaTopo .mobCarrinho{ position:absolute;right:10px;    top: 7.8rem}
.areaTopo .grupoSearch{width:83%}
.areaTopo .grupoSearch form{
  display:flex;background: #F1EEEE;
  border-radius: 50px;
  overflow: hidden;
}
.areaTopo .grupoSearch form input{
  width:100%;padding:.8rem 1rem;border:0;background:none;
}
.areaTopo .grupoSearch form .btn{
  border:0;background:none;    display: grid;
}
.areaTopo .grupoSearch form .btn:hover{
  box-shadow:none;opacity:.6
}
.areaTopo .itemCesta{
  background: #1C1C1C;border-radius: 8px;
  width:100%;
  padding:1rem;
  display: none
}
.areaTopo .itemCesta li{margin: 1rem 0;display:block}
.areaTopo .itemCesta .itemCliente a{
  background: #F1EEEE;
  display: flex;
  border-radius: 50px;
  align-items: center;
  gap: 10px;
  color: #000;
  padding-right: 1rem;
  transition:all .4s
}
.areaTopo .itemCesta .itemCliente:hover{opacity:.8;  transition:all .4s}
.areaTopo .itemCarrinho{
  position:relative
}
.areaTopo .itemCarrinho .item1{
  display: flex;gap:8px;color:#fff;align-items: center;
}
.areaTopo .itemCarrinho .item1 svg path{
  stroke:#fff
}
.areaTopo .itemCarrinho .item1 span{
  width:20px;
  height:20px;
  background:#FF7E46;
  color:#fff;
  display:grid;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  left: -7px;
}
.areaTopo .itemCarrinho.sub ul{
  color: #fff;
}
.itemCarrinho.sub{display:none!important}
.areaTopo .itemCarrinho.sub ul li{  color: #fff;border-bottom:solid 1px #ddd}
.areaTopo .itemCarrinho.sub ul li .list{display: grid; grid-template-columns: 70px 1fr;gap:20px;    align-items: center;}
.areaTopo .itemCarrinho.sub ul li .list .thumb{width:100%}
.areaTopo .itemCarrinho.sub ul li .list .thumb img{width:100%}
.areaTopo .itemCarrinho.sub ul li .list span{display:block;color:#fff;margin-bottom:6px}
.areaTopo .itemCarrinho.sub ul li .list strong{display:block;color:#fff;}
.areaTopo .itemCarrinho.sub ul li .list strike{display:block;color:#f87b7b;}
.areaTopo .itemCarrinho.sub ul li .list .ativar{position: absolute;  width: 20px;  right: 9px;  top: 9px;}
.areaTopo .itemCarrinho.sub ul li.total{border:0; padding:0 1rem}
.areaTopo .itemCarrinho.sub ul li.total .d-flex{margin-bottom: 8px;}
.areaTopo .itemCarrinho.sub ul li .semproduto{color:#8d8b8b;display:block;padding:.6rem 1rem}

/*menutopo*/
.base-menu-topo{background:#F1EEEE;padding: 1rem 0;  position: relative;height: 48px;}
.base-menu-topo .conteudo{  overflow:hidden;  display: flex; gap: 10px;}
.carousel {
  display: inline-flex;
  width: 100%;
  transition: transform 0.5s;
  gap: 1rem;
}

.carousel-item {
  flex: 0 0 auto;
  min-width: 100px;
  margin-right: 0px;
  color:#000;
  font-weight: 600;
  transition: opacity 0.5s;
  font-size: .9rem;
}

.carousel-item:hover {transition: opacity 0.5s; opacity:.4}
.carousel-prev,
.carousel-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  color: #000;
  text-decoration: none;
  padding: 16px;
  z-index: 1;
}
.carousel-ante {
    left: 2px;
    position: absolute;
    width: 30px;
    height: 30px;
    background: url(../img/seta-circular-left.svg) no-repeat center;
    top: 10px;
    
}
.carousel-prox {
    right: 0px;
    position: absolute;
    width: 30px;
    height: 30px;
    background: url(../img/seta-circular-right.svg) no-repeat center;
    top: 10px;
}


/*base-banner*/
.base-banner{
  width:100%;
  position: relative;
  height:100%;
}
.base-banner .lSSlideOuter .lSPager.lSpg {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
}
.base-banner .lSSlideOuter .lSPager.lSpg > li a{width:12px;height:12px;background-color: inherit;border:solid 1px #000}
.base-banner .lSSlideOuter .lSPager.lSpg > li.active a{background-color: #000}
.base-banner .lSSlideOuter .lSPager.lSpg > li a:hover{background-color: #000}

.basecentral{
  margin-top:1rem
}
.titulo{
  font-weight:700;
  font-size:1.4rem;
  color:#000;
  display:block;
  margin-bottom: 4px;
  padding: 0 1rem ;
}
/* Categorias Home - Estilos antigos mantidos para compatibilidade, mas sobrescritos pelo novo layout */
.categoriasHome{position: relative;margin-bottom:1rem}
.categoriasHome .conteudo{overflow:hidden;position:relative}
.categoriasHome .carousel{display:flex; gap:10px;padding: .8rem;}
.categoriasHome .carousel .carousel-item{flex: 0 0 100%;width:100%;background:#424242;border-radius:8px;padding:.8rem}
.categoriasHome .carousel .carousel-item .col-4{width:33%}
.categoriasHome .carousel .carousel-item .col-4 .thumb{background: #fff;border-radius:5px;}
.categoriasHome .carousel .carousel-item .col-8{width:58%}
.categoriasHome .carousel .carousel-item .col-8 h4{color:#fff;font-size:1.2rem;margin-bottom:10px}
.categoriasHome .carousel .carousel-item .col-8 small{font-weight:300;color:#B7B7B7;}
.categoriasHome .carousel .carousel-item .col-8 .btn-amarelo{position: absolute;right:-10px;bottom:10px}

/* Novo layout de categorias - sobrescreve estilos antigos */
.home-section--categories .categoriasHome {
    display: none; /* Esconde o carousel antigo se ainda estiver no HTML */
}
/**/
.destaques .caixa{
  text-align: center;
  background: #F1F1F1;
  border-radius:8px;
  padding: 1rem;
  position: relative;
}
.destaques .caixa .opcoes{
  position: absolute;z-index:0;right:1rem;top:1rem
}
.destaques .caixa .opcoes{  display:grid;gap:8px}
.destaques .caixa .opcoes li{  display:block;}
.destaques .caixa .opcoes li svg{ width:25px}
.destaques .caixa .opcoes li a{ display:block}
.ativado svg path{ fill: #ff8d8d;stroke: #ee7e7e;}
.destaques .caixa h4{  font-size: 1.3rem;  margin-bottom: 1rem;}
.destaques {  padding:0 1rem}
.destaques .titulo{  padding-left:0}
.destaques .col-6.alt{ display:none}
.destaques .col-6.alt .caixa{ padding:.8rem}
.destaques .col-6.alt .opcoes li svg {  width: 17px;}

.precoAnt{font-size:.95rem;display:block;text-align: center;    color: #929292;}

.elementos{
  display: flex;gap: 5px;justify-content: center;
}
.elementos .ico{
  display: inline-block;
  width:24px;
  height: 24px;
}
.elementos .ico.star{
  background:url(../img/star-vazado.svg) no-repeat center;
  background-size:contain
}
.elementos .ico.star.ativado{
  background:url(../img/star-cheio.svg) no-repeat center;
  background-size:contain
}
.elementos .preco{
  background: #FFC635;border-radius:4px;padding:3px 1.2rem; display: flex; align-items: center;
  gap: 5px;
}
.elementos .preco strong{ font-size: 1.7rem;  font-weight: 900;}
.elementos .preco small{ font-size: 1rem; font-weight: 600;}

.categorias h4{font-weight:400;text-align: center; margin-top:10px}
.categorias .preco{display: grid;gap:4px;justify-content: center;align-items: center;padding-bottom: 10px;padding-top: 10px}
.categorias .preco strong{font-size: 1.37rem;font-weight:900}
.categorias .preco small{font-size: 1rem;font-weight:400}

.base-home{
	width: 100%;
    height: calc(100vh - 320px);
}
.gap{gap:10px}
.rodape{
  background:#373737;color: #fff;margin-top:3rem;padding: 2rem 1rem;
}
.rodape .thumb{ width:150px;filter: invert(100%)}
.rodape .col-4 p{line-height: 1.1rem;font-size:.8rem;color:#d1d1d1}
.rodape .social{display: flex;gap:10px; justify-content: center;margin-top:1rem}
.rodape .social li,.rodape .endereco li
{display: block;}
.rodape .endereco{display: grid;align-items: center;gap:4px}

.migalha{display:none}
.migalha.titulo{display:block;    align-items: center;gap:10px}
.migalha .seta {
  width: 16px;
  height: 13px;
  display: inline-block;
  background: url(../img/seta.svg) no-repeat center;
  background-size: contain;
  margin-left: 10px;
}

.image-container {
  position: relative;
  display: inline-block;
}
.zoomed-image {
  display: block;
  position: absolute;
  /* width: 100%; */
  height: 440px;
  /* border: 1px solid black; */  
  z-index: 9999;
  right: 0;
  left: 113px;
  overflow: hidden;
}
.zoomed-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform-origin: top left;
}

.detalhes .areaProd{
  display: grid;
  grid-template-columns: 70px 1fr;
  gap: 10px;
  padding-left: 10px;
  position: relative;
}
.detalhes .areaProd.umProd{
  display: grid;
  grid-template-columns:inherit;
  padding-left: 0px;
}
.detalhes .areaProd.umProd .thumbProd.thprod{
	height:auto;border-radius:8px
}
.detalhes .areaProd.umProd .thumbProd.thprod img{
	max-width:100%
}

.detalhes .areaProd .minThumb{
   gap: 10px;
  max-height: 327px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
.detalhes .areaProd .minThumb .thumb{
  min-height: 71px;margin-bottom: 5px;padding:8px;background: #F1F1F1;text-align: center;
}
.detalhes .areaProd .minThumb .thumb:last-child{ margin-bottom: 0;}
.detalhes .thumbProd{
  background:#F1F1F1;border-radius:5px;text-align: center;height:calc(100vh - 323px)
}
.detalhes .caixa{
  border-radius: 8px;
  padding:0 1rem;
  /*border:solid 1px #909090*/
}
.detalhes .caixa h4{ 
      margin-bottom: 1rem;
    font-size: 40px;
    font-weight: 300;
	line-height: 2.5rem;
}
.detalhes .caixa .preco{
  display: flex;
  gap:5px;
  align-items: center;
  font-size: 1.2rem;    color: #d86464;
}
.detalhes .caixa .preco strong{
  font-size: 2.5rem;
    font-weight: 600;
    color: #565656;
}

.detalhes .caixa .preco small{
  font-size: 1.2rem;font-weight: 400;
}
.detalhes .caixa span{color:#787878}

.CorTam{height:42px;display: flex; gap: 10px;align-items: center; overflow-x: auto;  -webkit-overflow-scrolling: touch;  -ms-overflow-style: -ms-autohiding-scrollbar;}
.CorTam .item{border:solid 1px #c7c7c7;border-radius:4px;padding:10px;color:#424242;font-size: .9rem;}
.CorTam input[type=radio]:checked + label{background: orange;  color: #fff; border-color: #ff5900;}
.CorTam input[type=radio]{display: none;}

.detalhes .botoes{display: flex;gap:10px; margin-top: 1rem;}
.detalhes .botoes .btn{font-size: 1.2rem;}

.descricao{
  border:solid 1px #c7c7c7;border-radius: 10px;padding:1rem;margin-bottom:1.4rem
}
.descricao p{line-height: 1.2rem; font-size: .79rem;  color: #424242;}
.descricao .tabela{  width:100%}
.descricao .tabela th,
.descricao .tabela td{background:#F2F2F2; font-size:.8rem;text-align: left;padding:.5rem .6rem}
.descricao .tabela td{ background:#F2F2F2;}
.descricao .tabela tr:nth-of-type(2n+0) td{ background:#FAFAFA;}
.descricao .tabela tr:nth-of-type(2n+0) th{ background:#FAFAFA;}

.recomendacoes{margin-top:2rem}
.recomendacoes 
.lSAction > .lSNext {
  background-position: -25px 0;
  right: 8px;
  background: #fff url(../img/seta-right.svg) no-repeat center;
  border: solid 1px #444;
    width: 54px;
    height: 54px;
    display: grid;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background-size: 20%;
}
.recomendacoes 
.lSAction > .lSPrev {
  background-position: 0 0;
    left: 8px;
    background: #fff url(../img/seta-left.svg) no-repeat center;
    border: solid 1px #444;
    width: 54px;
    height: 54px;
    display: grid;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background-size: 20%;
}

/*meu carrinho*/
.caixa-itens{  display: grid; gap:10px;border:solid 1px #c7c7c7;border-radius:10px;    margin-bottom: 1rem;}
.caixa-itens .iten strong{ display:block}
 .caixa-itens .iten{
    display:block;text-align: center;padding: 0.6rem;
    border-bottom: solid 1px #c7c7c7;
  }
 .caixa-itens .iten:last-child{ border-bottom: 0  }
 .caixa-itens .iten .thumb img{
    height: 75px;
  }
 .caixa-itens .iten svg{
    height: 27px;width:27px
  }
  .caixa-itens .iten small{
  line-height: .9rem;
    display: block;
    color: #c7c7c7;
  }
  .caixa-itens .iten .thumb{
    min-height: 86px;
    display: grid;
    align-items: center;
    width: 56px;
    margin: 0 auto;
  }

.cont{position: relative; width: 180px;margin:0 auto}
.cont input{width:100%;
  padding: 8px;border:solid 1px #AEAEAE;border-radius: 5px;text-align: center;   
}
.cont .plusButton{
  position: absolute;right: 0;top: 0;padding:.3rem .8rem;background:none;border:0;font-weight: 400; font-size: 1.3rem; color:#ff5900
}
.cont .minusButton{
  position: absolute;left: 0;top: 0;padding:.3rem .8rem;background:none;border:0;font-weight: 400; font-size: 1.3rem; color:#ff5900
}
.customNumberInput::-webkit-inner-spin-button,
.customNumberInput::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

.caixa-total{
  background: #F1F1F1;border-radius:8px;padding:1rem
}
.caixa-total span{
  display: block; font-size: 1rem;color:#666666
}
.caixa-total .titulo{font-size:1.3rem}
.caixa-total .itens{display: flex;justify-content: space-between;padding:1rem 0;border-bottom:solid 1px #B7B7B7}
.caixa-total .itens.totais{padding:1rem;border:0}

.caixa-cupom{
  display: block;padding:1rem; border:solid 1px #c7c7c7;border-radius: 10px;
}
.caixa-cupom .titulo{font-size: .87rem;}
.caixa-cupom .group{display:flex;align-items: center;}
.caixa-cupom .group .form-campo{border-radius:8px 0 0 8px; padding: 0.65rem 10px;}
.caixa-cupom .group .btn{border-radius:0 8px 8px 0}
.caixa-cupom .lstFrete{  margin:1rem 0;   border-radius: 8px;overflow:hidden}
.caixa-cupom .lstFrete li{background: #f5f5f5;  display:flex;justify-content: space-between;padding:.7rem 1rem}
.caixa-cupom .lstFrete li:nth-of-type(2n+2){ background: #e4e4e4;}
.caixa-cupom .lstFrete li span small{ display:block;color:#454648}

.checkout .caixa{
  border: solid 1px #c7c7c7;background: #fff;padding: 1rem;border-radius:10px
}
.checkout .caixa .titulo{
  font-size:1rem
}
.checkout .caixa.alt{
  border: solid 1px #c7c7c7;background: #F4F4F4;
}
.checkout .total{
 display:block;
 background: linear-gradient(0deg, #98FE16, transparent 40%);
 background: -webkit-linear-gradient(0deg, #98FE16, transparent 40%);
 background: -moz-linear-gradient(0deg, #98FE16, transparent 40%);
 background: -ms-linear-gradient(0deg, #98FE16, transparent 40%);
 padding: 10px;;padding: 10px;
}
.checkout .total small,
.checkout .total strong
{
 display:block;
}
.checkout .total strong{font-size:1.2rem;}
.checkout .caixa.end{display:grid}
.checkout.endereco .caixa.end svg{width:80px;fill:#fe5858}
.checkout.endereco .caixa.end .cx-end{display:flex;align-items: center;gap:10px;border: solid 1px #dcdcdc;background: #fff; border-radius: 5px; box-shadow: 0 4px 4px 0 #c7c7c72b;  padding: 0.8rem 1rem;}
.checkout.endereco .caixa.end .opcoes .titulo{margin-top:1.5rem}
.checkout.endereco .caixa.end .opcoes .opCheck li{display:block;line-height: 1.3rem;padding: 7px 0;position: relative;}
.checkout.endereco .caixa.end .opcoes .opCheck li label{display:grid;gap:5px;align-items: center;grid-template-columns: 26px 1fr;}
.checkout.endereco .caixa.end .opcoes .opCheck li input[type=radio] + label:before{border-radius: 50px;
    content: "●";
    border: 2.6px #ffa635 solid;
    width: 20px;
    height: 20px;
    display: flex;
    font-size: 1.2rem;
    align-items: center;
    justify-content: center;
    color: #ffa635;}
.checkout.endereco .caixa.end .opcoes .opCheck li input[type=radio]:checked + label:before{position:relative; border-radius:50px;content: ""; border: 2.6px #ffa635 solid; width: 20px;  height: 20px;
  display: grid;  align-items: center;  justify-content: center;  line-height: 0px;  font-size: 1.5rem;  /* align-items: center; */  color: #f18d0f;  padding: 0px;}
  /*.checkout.endereco .caixa.end .opcoes .opCheck li input[type=radio]:checked + label:after{content: "●"; position: absolute; font-size: 1.5rem; top: 8px; left: 3px; color: #ffa635;}*/
  .checkout.endereco .caixa.end .opcoes .opCheck li input[type=radio]{display: none;}

.confirmar .cx-end {
  display: flex;
  align-items: center;
  gap: 10px;
  border: solid 1px #dcdcdc;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 4px 4px 0 #c7c7c72b;
  padding: 0.8rem 1rem;
}
.confirmar .cx-end p span{
  display:block;padding: .6rem 0;font-size: .9rem;
}
.confirmar .cx-end.total .tabela {  width: 100%;}
.confirmar .cx-end.total .tabela th, .confirmar .cx-end.total .tabela td {
  background: #F2F2F2;
  font-size: .8rem;
  text-align: left;
  padding: 0.5rem 0.6rem;
}
.confirmar .cx-end.total .tabela td { background: #fff;}
.confirmar .cx-end.total .tabela tr:nth-of-type(2n+0) td {  background: #f9f9f9;}

.checkout.cliente .caixa.end .cx-end {  
  border: 0;
  background:none;
  border-radius: 0;
  box-shadow: none;
}
.fimcompra{display:flex; align-items:center;gap:10px}



.gallery {
  display: flex;
  justify-content: center;
  margin-bottom: 0px;
  background:#ebebeb;
  position:relative;
  overflow:hidden;
  &.main-image img {
      position: absolute;
      top: 0;
      left: 0;
      transform-origin: top left;
      transition: transform 0.1s;
      width: 100%;
      height: 100%;
      object-fit: contain;
    }
}

.image {
  position: relative;
  display: none;
}
.image img{width:100%}

.zoom {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 200%;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  background-color: #fff;
}

.thumbnails {
  text-align: center;max-height: 348px;
  overflow-y: auto;
}

.thumbnails a {
  margin: 3px 5px;
  padding: 5px;
  display: inline-block;
  background: #ebebeb;
}

.thumbnails a img {
  max-width: 100%;
  height: auto;
}

.cadastros{padding: 2rem;}
.cadastros .btn.btn-vermelho {
  font-size: 1.4rem;
}

/*areaPagamento*/
.areaPagamento{
  display:grid;gap:10px;padding: 1rem;align-items: flex-start;
}
.formaspagamento{display:grid;gap:2px;}
.formaspagamento .itens{ display: grid;  align-items: center; gap: 5px;  grid-template-columns: 44px 1fr;  padding: 0.7rem;  background: #efefef;  border-radius: 5px;  color: #797979;}
.formaspagamento .itens svg{display: block;margin:0 auto;opacity: .6;}
.formaspagamento .itens.ativo{background:#fff;color:#000;font-weight:600;box-shadow: 4px 0 0 0 inset orange;color: #fd8602;}
.formaspagamento .itens.ativo svg{opacity:1;}


.baseCartao {display:none;   padding: 14px;  width: 100%;    position: relative; height:242px;  margin-top: 2rem;}
.baseCartao .frente{z-index:1}
.baseCartao .costa{transform: rotateY(-180deg)}
.baseCartao .frente,
.baseCartao .costa
{
	-webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform-style: preserve-3d;
    transition: all .4s linear;
    width: 322px;
    height: 200px;
	max-height: 100%;
    position: absolute;
    top: 0;
    left: 73%;
    overflow: hidden;
    border-radius: 10px;
    background: #ddd;
	margin: 0 auto;
    background: linear-gradient(30deg, #3c0909, #ff9000);
    border-radius: 11px;
	padding:30px 23px;
	box-shadow: 0 0 18px 0 #0000006e;
	perspective:1000px;
  margin-left:-50%
}
.baseCartao .frente{  
  filter: sepia(100%) saturate(0.5) grayscale(7);
}

.baseCartao .frente.concluido{
  filter:inherit;transition: all .4s;
}
.baseCartao .vira{transform: rotateY(180deg);}
.baseCartao .desvira{transform: rotateY(0deg);}
/*
	.baseCartao:hover .frente{transform: rotateY(180deg);}
	.baseCartao:hover .costa{transform: rotateY(0deg);}
*/
.baseCartao input:checked ~ .frente{transform: rotateY(180deg);}
.baseCartao input:checked ~ .costa{transform: rotateY(0deg);}

 .respostaCartao span,#numCart
 {opacity: .8;  transition: opacity .4s linear;font-size: 1.1rem;color:#fafdff}
 .respostaCartao .imgBandeira{
	width: 60px;
    height: 37px;
    position: absolute;
    right: 25px;
    top: 15px;
    background: #fff;
    border-radius: 3px;
    padding: 3px;
    display: flex;	
}
 .respostaCartao .imgChip{
	min-width: 60px;
    height: 60px;
	position:absolute;
	left:25px;
	top:32px;
	background:url(../img/imgChip.png) no-repeat center;
	background-size:contain;
	border-radius:10px;
	opacity: .8;
}
 .respostaCartao .numeroCartao {	margin-top:4.5rem;}
 .respostaCartao .nomeCartao {margin-top:1rem;display:flex;align-items: center;}
 .respostaCartao .nomeCartao span {font-size: .8rem;text-transform:uppercase}
 .respostaCartao .nomeCartao .nome{    width: 283px; padding-right: 13px;}
 .respostaCartao .nomeCartao .dataCartao{display:flex}
 .respostaCartao .nomeCartao .dataCartao small{display:block}

 .respostaCartao .cvvCartao{margin-top: 2rem;   background: #fff;    position: absolute;    top: 4rem;   left: 20px;   height: 33px;    width: 98px;  display: flex;  color: #000;   align-items: center;   justify-content: center;}
 .respostaCartao .barraCartao{display:block;width:100%;height:49px;background:linear-gradient(70deg, black, #5f3c18 70%, black); background:-moz-linear-gradient(70deg, black, #5f3c18 70%, black);position:absolute;left:0;right:0}

 .respostaCartao .cvvCartao span{color:#000}

.opcoesPix{display:grid;padding: 2rem 4px;gap: 17px;}
.opcoesPix small{color:#787878}
.opcoesPix .cx{ box-shadow: 0 0 15px 0 #0000001f;  padding: 22px;  display: grid;  align-items: center;  gap: 12px;  grid-template-columns: 4.8rem 1fr;border-radius: 5px;}
.opcoesPix .cx strong{display:block;padding-bottom: 7px;}
.opcoesPix .cx svg{width:70px;height:70px}

.pagarPix{background:#fff;overflow: initial!important;}
.pagarPix .area{padding:2rem;display:flex;align-items:center}


.opcoesPix.alt{padding:2rem 4px;}
.opcoesPix.alt .cx{padding:14px 22px;}

.opcoesPix .bancos{ padding: 1rem 0;  display: grid;  grid-template-columns: 124px 1fr;  gap: 10px; align-items: center;}
.opcoesPix .bancos span{line-height: 1.2rem;font-size:.8rem;color:#787878}

.msgText{font-size:.87rem;padding-top:.3rem}

.obrigado{
  display: grid;
  justify-content: center;
    align-items: center;
    text-align: center;
}
.obrigado h1{font-size:3rem}
.obrigado img{margin:0 auto;display:block}
.obrigado p{margin-bottom:1rem;padding:1rem;color: #444; line-height: 1.4rem;}
.obrigado i.fa-check-circle {
    font-size: 8rem;
    margin-bottom: 1rem;
}

.lstcheck{display: grid;gap: 1rem;margin-top:2rem}
.lstcheck li{display: block;padding: 0 1rem;position: relative;}
.lstcheck li span{display: flex;position:relative;gap:10px;align-items: center;}
.lstcheck li span::before{
  content:"";
  width:23px;
  height: 23px;
  background: url(../img/nocheck.svg) no-repeat;
  background-size: contain;
  display: block;  
}
.lstcheck li.checado span::before{
  content:"";
  width:23px;
  height: 23px;
  background: url(../img/check.svg) no-repeat;
  background-size: contain;
  display: block;  
}

.acompanhamento .itempedidos{
  margin: 2rem 0;background-color: #F4F4F4;border:solid 1px #c7c7c7
}

.acompanhamento .itempedidos .itens{
  display:flex;align-items: center;gap:10px;padding:1rem;border-bottom: solid 1px #c7c7c7;
}
.acompanhamento .itempedidos .itens strong,
.acompanhamento .itempedidos .itens span
{
  display:block
}

.acompanhamento .itempedidos .itens span{font-size:.8rem}

.acompanhamento .dadosPedidos{font-size:.8rem}
.acompanhamento .dadosPedidos strong{display:flex;gap:10px;font-size:1rem;margin-bottom: 1rem; align-items: center;}
.acompanhamento .dadosPedidos .itens{  border:solid 1px #c7c7c7;border-radius: 8px;padding:1rem 2rem;margin-bottom: 1rem;}
.acompanhamento .dadosPedidos .itens small{font-size: .8rem;}
.acompanhamento .dadosPedidos .itens .totais{display:flex; justify-content: space-between;}
.acompanhamento .caixa-itens .iten.tb{display:none}
.acompanhamento .base-itens .iten.total{ border:solid 1px #c7c7c7;border-radius: 8px;    display: grid; justify-content: end; padding: 1rem;}

/*busca*/

.Busca{display: grid;display: -ms-flexbox;  display: flex;  -ms-flex-wrap: wrap;  flex-wrap: wrap;}
.Busca .AreaEsq
{-ms-flex-preferred-size: 0;  flex-basis: 0;  -ms-flex-positive: 1;  flex-grow: 1;  max-width: 100%;}
.Busca .AreaEsq .filter{display: flex;align-items: center;gap:15px;margin-bottom:10px}
.Busca .AreaEsq .filter .btn{margin-top:1rem}
.Busca .resulFilter{
    position: fixed;
    right: 0;
    bottom: 0;
    top:0;
    background: #fff;
    width: 170px;
    z-index: 1;
    box-shadow: 0 0 8px 0 #00000057;
    display: none;
}
.tarja{
	display:block;
	background: #dddddd63;
    padding: 0.6rem 0.8rem;
    margin-bottom: 0.9rem;
	    color: #9b9b9b;
}
.msg.msgtopo{border-radius:0;padding:1rem 10px;display:grid;align-items:center;justify-content:center;margin-bottom:0;background: #ee7642;  color: #fff;}
.msg.msgtopo span{display:block;text-align:center;font-size: .96rem;}
.msg.msgtopo a.sair{top:6px}

.cat_filter{ padding: 1rem;}
.cat_filter h3{ position: relative;font-size: 1.1rem;padding: 10px 0;cursor:pointer}
 .ui-icon-triangle-1-e{
  position: absolute;
  right: 0;
  width: 15px;
  height: 15px;
  background: url(../img/seta-down.svg) no-repeat center;
  background-size: contain;
  display: inline-block;
  top: 30%;
 }
 .ui-icon-triangle-1-s{
  position: absolute;
  right: 0;
  width: 15px;
  height: 15px;
  background: url(../img/seta-up.svg) no-repeat center;
  background-size: contain;
  display: inline-block;
  top: 30%;
 }

 .fil_Categorias h3{display: block;margin-left:10px;position: relative;color:#000;font-weight: 600;}
 .fil_Categorias a{color:#000}
 .fil_Categorias .cx {margin-left: 10px;}
 .fil_Categorias .cx a{display:block; padding: 7px;}
 .Busca .resulFilter .filtrar{
 width: 40px;
    height: 40px;
    display: grid;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 100px;
    position: absolute;
    left: -29px;
    top: 2px;
    border: solid 2px #626262;
 }

 .Busca .checks label span{display: block;}
 .Busca .checks label {display: flex; gap:7px;align-items: center;line-height: 2rem;}
 .Busca .checks label input[type=checkbox]::before{content: "";  border: solid 1.8px #000;  width: 15px;  display: block;  height: 15px;  background: #fff;  border-radius: 2px;}
 .Busca .checks label input[type=checkbox]:checked::before{content: "✓";  border: solid 1.8px #000;  width: 15px;  display: block;  height: 15px;  background: #fff;  border-radius: 2px;  line-height: 12px;  font-size: .76rem;  font-weight: bolder;  color: #fff;  background: #000;}
 .Busca .checks.radio input[type=radio]:checked[type=radio] {box-shadow: inset 0 0 0 5px #1e1e1e;width:15px; height: 15px;background:#fff;border-width:0}
 .Busca .checks.radio input[type=radio] { border: solid 3px #000; width: 15px; height: 15px;background:#fff}
 
 .Busca .ico5{  content: url(../img/ico-star05.svg); }
 .Busca .ico4{  content: url(../img/ico-star04.svg); }
 .Busca .ico3{  content: url(../img/ico-star03.svg); }
 .Busca .ico2{  content: url(../img/ico-star02.svg); }
 .Busca .ico1{  content: url(../img/ico-star01.svg); }