/*-----------------------
 Estilos para os cards de opção de pizza no modal de escolha de tipo (inteira ou meia a meia) 
 -----------------------*/


    .pizza-option-card {
      transition: all 0.3s ease;
      border-radius: 10px;
      min-width: 0;
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 139px !important;
      min-height: 139px;
      box-sizing: border-box;
    }

    .pizza-option-card .card-body {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
      min-height: 0;
    }

    .pizza-option-card strong {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 2.5em;
      line-height: 1.25;
    }

    .pizza-option-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }

    .pizza-icon {
      display: grid;
      grid-auto-flow: column;
      grid-auto-columns: minmax(0, 1fr);
      justify-content: center;
      align-items: center;
      gap: 4px;
      width: min(100%, 118px);
      margin: 0 auto 8px;
      line-height: 1;
    }

    .pizza-icon span {
      display: block;
      min-width: 0;
      font-size: 34px;
      line-height: 1;
    }

    .pizza-icon--count-3 span {
      font-size: 30px;
    }

    .pizza-icon--count-4 span {
      font-size: 26px;
    }

    .flavor-section-card {
      border: 1px solid rgba(0, 0, 0, 0.08);
      border-radius: 12px;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(250, 250, 250, 0.95) 100%);
      padding: 10px;
    }

    .flavor-section-title {
      font-size: 0.95rem;
      font-weight: 700;
      margin-bottom: 0.35rem;
      color: #2b2b2b;
    }

    .flavor-chip {
      display: inline-block;
      border-radius: 999px;
      padding: 0.2rem 0.6rem;
      font-size: 0.76rem;
      font-weight: 600;
      background: rgba(0, 0, 0, 0.06);
      color: #333;
      margin-bottom: 0.35rem;
    }

    .pizza-total-preview {
      min-width: 140px;
      border: 1px solid rgba(0, 0, 0, 0.1);
      border-radius: 8px;
      padding: 0.45rem 0.65rem;
      background: #fff;
      text-align: right;
    }

    .pizza-total-preview span {
      display: block;
      font-size: 0.72rem;
      color: #6c757d;
      line-height: 1;
    }

    .pizza-total-preview strong {
      display: block;
      font-size: 1.05rem;
      line-height: 1.2;
    }

    .pizza-flavor-extra-list {
      max-height: 180px;
      overflow-y: auto;
    }

    /* ajustes para telas menores, garantindo que os cards de opção de pizza 
    fiquem legíveis e bem espaçados em dispositivos móveis */

    @media (max-width: 576px) {
      .pizza-icon {
        width: min(100%, 96px);
        margin-bottom: 5px;
      }

      .pizza-icon span {
        font-size: 24px;
      }

      .pizza-icon--count-3 span,
      .pizza-icon--count-4 span {
        font-size: 22px;
      }

      .pizza-option-card .card-body {
        /* reduz o padding para caber melhor em telas pequenas */
        padding: 0.75rem !important;
      }

      .pizza-option-card {
        height: 118px !important;
        min-height: 118px;
      }

      .pizza-option-card strong {
        /* reduz o tamanho do título para caber melhor em telas pequenas */
        font-size: 0.9rem;
      }

      .pizza-option-card .small {
        /* reduz o tamanho do subtítulo para caber melhor em telas pequenas */
        font-size: 0.7rem;
      }

      .pizza-total-preview {
        min-width: 112px;
        padding: 0.4rem 0.55rem;
      }

      .pizza-total-preview strong {
        font-size: 0.95rem;
      }

      .pizza-flavor-extra-list {
        max-height: 150px;
      }
    }

    /*-------------------
 fim dos estilos para os cards de opção de pizza no modal de escolha de tipo (inteira ou meia a meia) 
-------------------*/

    /*************************************** NÃO MEXER -
 ajustes para o destaque carousel, garantindo que as imagens não sejam arrastáveis
  e que o scroll seja suave e centralizado, além de garantir que os cards tenham uma estrutura flexível 
  para manter o botão no final do card mesmo com conteúdos de tamanhos variados 
  ************************************************/


    /* Destaque carousel adjustments */
    /* prevene arrastar a imagem separadamente do contêiner */
    #cardContainer img {
      -webkit-user-drag: none;
      user-drag: none;
    }

    /* evita seleção de texto durante arraste */
    #cardContainer,
    #cardContainer * {
      user-select: none;
      -webkit-user-select: none;
      -ms-user-select: none;
    }

    /* forçar centralização de cada card ao soltar o scroll
       e permitir que a primeira/média fique no meio */
    #cardContainer {
      scroll-snap-type: x mandatory;
    }

    #cardContainer .card {
      /* cada card deve se alinhar ao centro do contêiner quando o scroll parar */
      scroll-snap-align: center;
    }

    /* garante que o corpo do card seja uma coluna flex e o botão fique no final */
    #cardContainer .card-body {
      display: flex;
      flex-direction: column;
    }

    #cardContainer .card-body>div {
      margin-top: auto;
      /* empurra o último bloco (botão) para baixo */
    }

    @media (max-width: 768px) {

      /* deixar o card maior para caber um por vez e facilitar centralização */
      #cardContainer .card {
        min-width: 80vw !important;
      }
    }



    /* Fim dos ajustes para o destaque carousel */


    /* Estilos para as miniaturas dos produtos e destaque, 
garantindo que as imagens sejam cortadas para caber no 
espaço disponível e tenham bordas arredondadas para um visual mais moderno */
    .produto-thumb {
      width: 100px;
      height: 100px;
      object-fit: cover;
      border-radius: 8px;
      flex-shrink: 0;
    }

    .destaque-card {
      min-width: 400px;
    }

    .destaque-thumb {
      width: 100%;
      height: 200px;
      object-fit: cover;
      border-radius: 8px;
    }

    .cart-modal .modal-footer {
      display: flex;
      flex-wrap: wrap;
      gap: 0.5rem;
    }

    .cart-modal .modal-footer>* {
      margin: 0 !important;
    }

    .cart-modal .carrinho-tabela-area {
      width: 100%;
      overflow-x: visible;
    }

    .cart-modal .carrinho-tabela {
      table-layout: fixed;
      width: 100%;
    }

    .cart-modal .carrinho-produto-celula {
      min-width: 260px;
      white-space: normal;
    }

    .cart-modal .carrinho-produto-nome {
      font-weight: 500;
      line-height: 1.25;
      overflow-wrap: anywhere;
    }

    .cart-modal .carrinho-produto-nome:not(:first-child) {
      margin-top: 0.35rem;
    }

    .cart-modal .carrinho-produto-detalhe {
      margin-top: 0.1rem;
      padding-left: 1rem;
      line-height: 1.3;
      overflow-wrap: anywhere;
    }

    .cart-modal .carrinho-item-mobile .btn-sm {
      --bs-btn-padding-y: 0.15rem;
      --bs-btn-padding-x: 0.45rem;
      --bs-btn-font-size: 0.8rem;
    }

    .cart-modal .carrinho-total-geral {
      margin-top: 1rem;
      padding-top: 0.75rem;
      border-top: 1px solid #dee2e6;
    }

    .floating-action-btn {
      position: fixed !important;
      right: 20px;
      z-index: 1000;
      width: 60px;
      height: 60px;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .floating-action-btn img {
      height: 30px;
      width: 30px;
      object-fit: contain;
    }

    .fab-cart {
      bottom: 20px;
    }

    .fab-pedidos {
      bottom: 92px;
    }

    .fab-zap {
      bottom: 164px;
    }

    .half-pizza-modal.modal-fullscreen-sm-down .modal-body {
      overflow-y: auto;
    }

    body.modal-open {
      overflow: hidden;
      padding-right: 0 !important;
    }

    @media (max-width: 576px) {

      .cart-modal .modal-dialog {
        max-width: calc(100vw - 24px);
        margin-left: auto;
        margin-right: auto;
      }

      .cart-modal .modal-body {
        padding: 0.75rem 0.85rem;
        overflow-x: hidden;
      }

      .cart-modal .carrinho-produto-nome {
        font-size: 0.86rem;
        line-height: 1.18;
      }

      .cart-modal .carrinho-produto-detalhe {
        padding-left: 0.55rem;
        font-size: 0.72rem;
        line-height: 1.18;
      }

      .cart-modal .carrinho-lista-mobile {
        margin-top: -0.25rem;
      }

      .cart-modal .carrinho-item-mobile {
        border-color: #e9ecef;
      }

      .cart-modal .carrinho-total-geral {
        font-size: 1rem;
        margin-top: 0.75rem;
      }

      .cart-modal .modal-footer .btn {
        width: 100%;
      }

      .floating-action-btn {
        right: 12px;
        width: 52px;
        height: 52px;
      }

      .floating-action-btn img {
        height: 26px;
        width: 26px;
      }

      .fab-cart {
        bottom: 12px;
      }

      .fab-pedidos {
        bottom: 74px;
      }

      .fab-zap {
        bottom: 136px;
      }
    }

    @media (max-height: 700px) {
      .floating-action-btn {
        width: 48px;
        height: 48px;
        right: 10px;
      }

      .floating-action-btn img {
        height: 24px;
        width: 24px;
      }

      .fab-cart {
        bottom: 10px;
      }

      .fab-pedidos {
        bottom: 66px;
      }

      .fab-zap {
        bottom: 122px;
      }
    }