/* GiraMesa Delivery APP UI 2N — modal mais quadrado + Informações */

/* Cabeçalho: sem seta. Minha Conta continua somente no ícone de perfil do topo. */
body.gm-app-ui-v2n #botaoInstalar{display:none!important}
body.gm-app-ui-v2n .topo-acoes .gm2n-header-back{display:none!important}

/* Overlay */
body.gm-app-ui-v2n #modalProduto{
  position:fixed!important;inset:0!important;z-index:9800!important;
  display:grid!important;place-items:center!important;
  padding:12px!important;
  background:rgba(24,17,35,.72)!important;
  backdrop-filter:blur(10px)!important;-webkit-backdrop-filter:blur(10px)!important;
}
body.gm-app-ui-v2n #modalProduto[hidden]{display:none!important}

/* Modal: mais largo/compacto e com altura controlada. O conteúdo rola por dentro. */
body.gm-app-ui-v2n #folhaProduto{
  position:relative!important;
  width:min(720px,calc(100vw - 24px))!important;
  height:auto!important;
  max-height:min(88dvh,720px)!important;
  margin:0!important;
  display:flex!important;flex-direction:column!important;
  overflow:hidden!important;
  border:0!important;border-radius:30px!important;
  background:#fff!important;color:#221934!important;
  box-shadow:0 34px 90px rgba(12,8,20,.42)!important;
}

/* X no topo esquerdo — sem seta de voltar. */
body.gm-app-ui-v2n #folhaProduto .cabecalho-modal{
  position:absolute!important;z-index:30!important;
  top:16px!important;left:16px!important;right:auto!important;
  width:auto!important;height:auto!important;padding:0!important;margin:0!important;
  border:0!important;background:transparent!important;pointer-events:none!important;
}
body.gm-app-ui-v2n #folhaProduto .cabecalho-modal>div{display:none!important}
body.gm-app-ui-v2n #folhaProduto .fechar-modal{
  pointer-events:auto!important;
  width:48px!important;height:48px!important;min-width:48px!important;
  display:grid!important;place-items:center!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:16px!important;
  background:#C7D630!important;color:#221934!important;
  box-shadow:0 10px 25px rgba(34,25,52,.18)!important;font-size:0!important;
}
body.gm-app-ui-v2n #folhaProduto .fechar-modal::before,
body.gm-app-ui-v2n #folhaProduto .fechar-modal::after{content:none!important;display:none!important}
body.gm-app-ui-v2n #folhaProduto .fechar-modal svg{
  display:block!important;width:22px!important;height:22px!important;
  fill:none!important;stroke:#221934!important;stroke-width:2.2!important;
  stroke-linecap:round!important;stroke-linejoin:round!important;
}

/* A rolagem fica somente no corpo; rodapé não cobre preço/opções. */
body.gm-app-ui-v2n #folhaProduto .corpo-modal{
  flex:1 1 auto!important;min-height:0!important;
  display:block!important;padding:0!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  background:#fff!important;overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
}

/* Imagem mais baixa para o modal ficar visualmente mais quadrado. */
body.gm-app-ui-v2n #folhaProduto .imagem-produto-modal{
  display:block!important;width:100%!important;
  height:clamp(170px,25dvh,210px)!important;min-height:170px!important;max-height:210px!important;
  margin:0!important;padding:0!important;
  object-fit:cover!important;object-position:center!important;
  border:0!important;border-radius:0!important;background:#ECE8EE!important;
}
body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal{
  position:relative!important;z-index:2!important;
  margin-top:-22px!important;padding:24px 26px 14px!important;
  border-radius:28px 28px 0 0!important;background:#fff!important;
  box-shadow:0 -8px 26px rgba(34,25,52,.05)!important;
}
body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal>h3{
  margin:0 0 5px!important;color:#221934!important;
  font-size:28px!important;line-height:1.05!important;font-weight:950!important;letter-spacing:-.035em!important;
}
body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal>p{
  margin:0 0 12px!important;color:#8D8594!important;font-size:13px!important;line-height:1.4!important;font-weight:550!important;
}
body.gm-app-ui-v2n #folhaProduto .preco-modal{
  margin:0 0 14px!important;color:#221934!important;font-size:28px!important;font-weight:950!important;letter-spacing:-.025em!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes{
  margin:0!important;padding:14px 0!important;border-top:1px solid #EDE8EF!important;background:transparent!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes header{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 9px!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes h4{
  margin:0!important;color:#221934!important;font-size:17px!important;line-height:1.2!important;font-weight:900!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes header small{display:none!important}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes label,
body.gm-app-ui-v2n #folhaProduto .opcao-produto{
  width:100%!important;min-height:54px!important;
  display:flex!important;align-items:center!important;gap:12px!important;
  margin:0 0 8px!important;padding:9px 14px!important;
  border:1px solid #E5DFE8!important;border-radius:16px!important;
  background:#F8F6F4!important;color:#221934!important;box-shadow:none!important;cursor:pointer!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes label:has(input:checked),
body.gm-app-ui-v2n #folhaProduto .opcao-produto:has(input:checked){
  border-color:#B7CC00!important;background:#F8FBDD!important;box-shadow:0 0 0 1px rgba(183,204,0,.12)!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes input[type="checkbox"],
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes input[type="radio"]{
  appearance:none!important;-webkit-appearance:none!important;
  width:24px!important;height:24px!important;min-width:24px!important;
  margin:0!important;border:2px solid #9B93A4!important;border-radius:50%!important;background:#fff!important;
  box-shadow:none!important;position:relative!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes input[type="checkbox"]:checked,
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes input[type="radio"]:checked{
  border-color:#B7CC00!important;background:#C7D630!important;
}
body.gm-app-ui-v2n #folhaProduto .grupo-opcoes input:checked::after{
  content:''!important;position:absolute!important;inset:5px!important;border-radius:50%!important;background:#221934!important;
}
body.gm-app-ui-v2n #folhaProduto .opcao-produto-texto{
  min-width:0!important;flex:1!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;
}
body.gm-app-ui-v2n #folhaProduto .opcao-produto-texto strong{
  color:#221934!important;font-size:14px!important;font-weight:850!important;
}
body.gm-app-ui-v2n #folhaProduto .opcao-produto-texto b{
  margin-left:auto!important;color:#94A900!important;font-size:13px!important;font-weight:900!important;white-space:nowrap!important;
}
body.gm-app-ui-v2n #folhaProduto .observacao-item{
  width:100%!important;min-height:68px!important;margin:8px 0 0!important;padding:12px 14px!important;
  border:1px solid #E3DDE6!important;border-radius:16px!important;background:#FBFAFC!important;
  color:#221934!important;-webkit-text-fill-color:#221934!important;font-size:13px!important;line-height:1.4!important;resize:vertical!important;
}

/* Rodapé faz parte do fluxo do modal. Assim nunca encobre preço, Sabor ou informações. */
body.gm-app-ui-v2n #folhaProduto .rodape-modal{
  position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;z-index:20!important;
  flex:0 0 auto!important;
  padding:10px 16px max(10px,env(safe-area-inset-bottom))!important;
  border-top:1px solid #ECE7EE!important;background:#fff!important;
  box-shadow:0 -7px 20px rgba(34,25,52,.04)!important;
}
body.gm-app-ui-v2n #folhaProduto .rodape-adicionar{
  display:grid!important;grid-template-columns:150px minmax(0,1fr)!important;gap:12px!important;align-items:center!important;
}
body.gm-app-ui-v2n #folhaProduto .quantidade-modal{
  width:150px!important;height:54px!important;display:grid!important;grid-template-columns:48px 54px 48px!important;align-items:center!important;
  overflow:hidden!important;border:1px solid #E4DEE7!important;border-radius:16px!important;background:#F8F6F4!important;
}
body.gm-app-ui-v2n #folhaProduto .quantidade-modal button{
  width:48px!important;height:54px!important;display:grid!important;place-items:center!important;
  padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:#221934!important;
}
body.gm-app-ui-v2n #folhaProduto .quantidade-modal button svg{width:20px!important;height:20px!important;stroke:#221934!important}
body.gm-app-ui-v2n #folhaProduto .quantidade-modal b{
  width:54px!important;height:54px!important;display:grid!important;place-items:center!important;
  margin:0!important;padding:0!important;background:#fff!important;color:#221934!important;font-size:18px!important;font-weight:900!important;
}
body.gm-app-ui-v2n #folhaProduto .botao-confirmar-produto{
  width:100%!important;height:54px!important;min-width:0!important;padding:0 14px!important;
  border:0!important;border-radius:16px!important;background:#C7D630!important;color:#221934!important;
  font-size:clamp(13px,2.2vw,16px)!important;font-weight:950!important;white-space:nowrap!important;
  overflow:visible!important;text-overflow:clip!important;box-shadow:0 8px 20px rgba(199,214,48,.20)!important;
}

/* Navegação inferior: o item ao lado de Pedidos é Informações, nunca Conta. */
body.gm-app-ui-v2n .barra-inferior .item-nav[data-nav="info"],
body.gm-app-ui-v2n .barra-inferior .gm2n-info-restored{display:flex!important}
body.gm-app-ui-v2n .barra-inferior .item-nav[data-nav="info"] small,
body.gm-app-ui-v2n .barra-inferior .gm2n-info-restored small{
  font-size:11px!important;line-height:1.05!important;white-space:nowrap!important;
}

@media(max-width:520px){
  body.gm-app-ui-v2n #modalProduto{padding:8px!important}
  body.gm-app-ui-v2n #folhaProduto{
    width:calc(100vw - 16px)!important;
    max-height:86dvh!important;
    border-radius:26px!important;
  }
  body.gm-app-ui-v2n #folhaProduto .imagem-produto-modal{
    height:clamp(150px,20dvh,180px)!important;min-height:150px!important;max-height:180px!important;
  }
  body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal{
    margin-top:-18px!important;padding:21px 18px 12px!important;border-radius:24px 24px 0 0!important;
  }
  body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal>h3{font-size:24px!important}
  body.gm-app-ui-v2n #folhaProduto .detalhes-produto-modal>p{font-size:12.5px!important;margin-bottom:10px!important}
  body.gm-app-ui-v2n #folhaProduto .preco-modal{font-size:26px!important;margin-bottom:11px!important}
  body.gm-app-ui-v2n #folhaProduto .grupo-opcoes{padding:12px 0!important}
  body.gm-app-ui-v2n #folhaProduto .grupo-opcoes label,
  body.gm-app-ui-v2n #folhaProduto .opcao-produto{min-height:52px!important;padding:8px 12px!important}
  body.gm-app-ui-v2n #folhaProduto .rodape-modal{padding:9px 10px max(9px,env(safe-area-inset-bottom))!important}
  body.gm-app-ui-v2n #folhaProduto .rodape-adicionar{
    grid-template-columns:minmax(116px,35%) minmax(0,1fr)!important;gap:8px!important;
  }
  body.gm-app-ui-v2n #folhaProduto .quantidade-modal{
    width:100%!important;height:52px!important;grid-template-columns:1fr 1fr 1fr!important;
  }
  body.gm-app-ui-v2n #folhaProduto .quantidade-modal button,
  body.gm-app-ui-v2n #folhaProduto .quantidade-modal b{width:100%!important;height:52px!important}
  body.gm-app-ui-v2n #folhaProduto .botao-confirmar-produto{
    height:52px!important;padding:0 8px!important;font-size:clamp(12px,3.25vw,14px)!important;
  }
}

@media(max-width:350px){
  body.gm-app-ui-v2n #folhaProduto .rodape-adicionar{grid-template-columns:108px minmax(0,1fr)!important;gap:6px!important}
  body.gm-app-ui-v2n #folhaProduto .botao-confirmar-produto{font-size:12px!important;padding:0 5px!important}
}

/* Fechamento do design: rodapé nativo com quatro áreas e Conta somente no cabeçalho. */
body.gm-app-ui-v2n .barra-inferior{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}
body.gm-app-ui-v2n .barra-inferior .item-nav[data-nav="conta"],
body.gm-app-ui-v2n .barra-inferior .item-nav[data-route="/conta"],
body.gm-app-ui-v2n .barra-inferior .item-nav[data-gm2b-account]{
  display:none!important;
}
body.gm-app-ui-v2n .barra-inferior .item-nav[data-nav="info"]{
  display:flex!important;
}
body.gm-app-ui-v2n .barra-inferior .item-nav[data-nav="info"] small{
  font-size:11px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
