/* Tía Vicenta v433 · modal sabores y botones seguro */

/* Botón "Agregar" para productos con modal pero sin sabores */
html body .product.compact-product .card-control-slot > .card-add-main[data-add],
html body .product .card-control-slot > .card-add-main[data-add]{
  width:100%!important;
  min-width:0!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 14px!important;
  border-radius:15px!important;
  border:1px solid transparent!important;
  background:linear-gradient(180deg,var(--tv-orange),var(--tv-orange-2))!important;
  color:#211100!important;
  box-shadow:0 9px 18px color-mix(in srgb,var(--tv-orange) 26%, transparent)!important;
  font-size:14px!important;
  font-weight:1000!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Modal más alto y ordenado para que los gustos no queden cortados */
html body .modal{
  width:min(940px,calc(100vw - 22px))!important;
  max-height:min(94dvh,960px)!important;
}

html body .modal-card{
  max-height:min(94dvh,960px)!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
}

html body .modal-head{
  padding:16px 18px!important;
}

html body .modal-product{
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:14px!important;
}

html body .modal-img{
  width:88px!important;
  height:88px!important;
  border-radius:22px!important;
}

html body .modal-body{
  padding:16px 18px 22px!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  gap:14px!important;
}

html body .modal-foot{
  padding:14px 18px 16px!important;
}

html body .option-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}

html body .option{
  min-height:68px!important;
  padding:14px 14px!important;
  border-radius:18px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
  white-space:normal!important;
}

html body .option span:first-child{
  min-width:0!important;
  overflow-wrap:anywhere!important;
  line-height:1.18!important;
}

html body .option .check{
  flex:0 0 auto!important;
  margin-left:auto!important;
}

html body .choice{
  padding:14px 16px!important;
  border-radius:22px!important;
}

html body .note-area{
  min-height:105px!important;
}

@media (max-width:760px){
  html body .modal{
    width:min(100vw - 14px,940px)!important;
    max-height:95dvh!important;
  }

  html body .modal-product{
    grid-template-columns:64px minmax(0,1fr)!important;
    gap:10px!important;
  }

  html body .modal-img{
    width:64px!important;
    height:64px!important;
    border-radius:18px!important;
  }

  html body .modal h3{
    font-size:clamp(22px,7vw,34px)!important;
  }

  html body .option-grid{
    grid-template-columns:1fr!important;
  }

  html body .modal-actions{
    width:100%!important;
  }

  html body .modal-actions .btn{
    flex:1 1 0!important;
  }
}