/* =========================================
   MAPA RESPONSIVE
   ========================================= */

.map-responsive {
  overflow: hidden;
  padding-bottom: 40%;
  position: relative;
  height: 0;
}

.map-responsive iframe {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}


/* =========================================
   VARIABLES GENERALES ANISA
   ========================================= */

:root {
  --anisa-green: #57872e;
  --anisa-green-dark: #294f26;
  --anisa-text: #202020;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

body {
  font-family: "DM Sans", Arial, sans-serif;
  color: var(--anisa-text);
}


/* =========================================
   HERO PRINCIPAL
   ========================================= */

.anisa-hero {
  position: relative !important;

  width: 100vw !important;
  max-width: 100vw !important;

  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;

  min-height: 700px;

  display: flex;
  align-items: center;

  overflow: hidden;

  background-image: url("https://anisainsumos.com/wp-content/uploads/2026/08/anisa-hero-fondo.webp");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}


/* =========================================
   DEGRADADO
   ========================================= */

.anisa-hero-overlay {
  position: absolute;
  inset: 0;

  background: linear-gradient(
    90deg,
    rgba(255,255,255,.99) 0%,
    rgba(255,255,255,.97) 27%,
    rgba(255,255,255,.82) 43%,
    rgba(255,255,255,.20) 62%,
    rgba(255,255,255,0) 76%
  );

  pointer-events: none;
}


/* =========================================
   CONTENIDO
   ========================================= */

.anisa-hero-content {
  position: relative;
  z-index: 2;

  width: 100%;
  max-width: none;

  margin: 0;

  padding-top: 55px;
  padding-right: 40px;
  padding-bottom: 55px;
  padding-left: clamp(45px, 7vw, 120px);
}


/* =========================================
   INTRO
   ========================================= */

.anisa-intro {
  margin: 0 0 10px;

  font-family: "DM Sans", Arial, sans-serif;

  font-size: clamp(17px, 1.3vw, 21px);
  font-weight: 400;
  font-style: normal;
  line-height: 1.35;

  color: var(--anisa-text);
}


/* =========================================
   TITULO PRINCIPAL
   ========================================= */

.anisa-title {
  max-width: 690px;

  margin: 0;

  font-family: "Libre Baskerville", Georgia, serif !important;

  font-size: clamp(38px, 3.7vw, 62px);

  font-weight: 700 !important;
  font-style: normal !important;

  line-height: 1.08;

  letter-spacing: -0.03em;

  color: var(--anisa-green-dark);
}

.anisa-hero h1 {
  font-style: normal !important;
}


/* =========================================
   EN ECUADOR
   ========================================= */

.anisa-title span {
  display: block;

  width: fit-content;

  margin-top: 10px;

  font-family: "Parisienne", cursive !important;

  font-size: 1.02em;

  font-weight: 400 !important;
  font-style: normal !important;

  line-height: 1;

  letter-spacing: 0;

  color: var(--anisa-green);
}

.anisa-title span::after {
  content: "";

  display: block;

  width: 72%;
  height: 2px;

  margin: 5px auto 0;

  background: var(--anisa-green);

  border-radius: 50%;

  transform: rotate(-1deg);
}


/* =========================================
   BENEFICIOS
   ========================================= */

.anisa-benefits {
  display: grid;

  grid-template-columns: repeat(3, 1fr);

  width: 100%;
  max-width: 610px;

  margin-top: 26px;
}


.anisa-benefit {
  display: flex;

  flex-direction: column;

  align-items: center;
  justify-content: center;

  min-width: 0;
  min-height: 105px;

  padding: 0 14px;

  text-align: center;
}


.anisa-benefit + .anisa-benefit {
  border-left: 1px solid rgba(41,79,38,.18);
}


/* =========================================
   ICONOS
   ========================================= */

.anisa-icon {
  display: flex;

  align-items: center;
  justify-content: center;

  width: 52px;
  height: 52px;

  margin-bottom: 8px;

  border: 2px solid var(--anisa-green);

  border-radius: 50%;

  font-size: 22px;

  color: var(--anisa-green);
}


.anisa-benefit strong {
  font-family: "DM Sans", Arial, sans-serif;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.35;
}


/* =========================================
   DESCRIPCION
   ========================================= */

.anisa-description {
  max-width: 570px;

  margin: 22px 0 0;

  padding-top: 22px;

  border-top: 1px solid rgba(41,79,38,.16);

  font-family: "DM Sans", Arial, sans-serif;

  font-size: clamp(16px, 1.15vw, 18px);

  font-weight: 400;

  line-height: 1.6;

  color: var(--anisa-text);
}


/* =========================================
   BOTON
   ========================================= */

.anisa-button {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  min-width: 220px;

  margin-top: 22px;

  padding: 14px 30px;

  background: var(--anisa-green);

  color: #ffffff;

  border-radius: 7px;

  text-decoration: none;

  text-transform: uppercase;

  font-family: "DM Sans", Arial, sans-serif;

  font-size: 16px;

  font-weight: 600;

  letter-spacing: .05em;

  transition:
    background-color .25s ease,
    transform .25s ease,
    box-shadow .25s ease;
}


.anisa-button:hover,
.anisa-button:focus-visible {
  background: var(--anisa-green-dark);

  transform: translateY(-2px);

  box-shadow: 0 10px 25px rgba(41,79,38,.20);
}


.anisa-button:focus-visible {
  outline: 3px solid rgba(87,135,46,.30);

  outline-offset: 4px;
}


/* =========================================
   WORDPRESS
   ========================================= */

.wp-block-html:has(.anisa-hero) {
  width: 100% !important;

  max-width: none !important;

  margin-left: 0 !important;
  margin-right: 0 !important;

  padding-left: 0 !important;
  padding-right: 0 !important;
}


.entry-content,
.site-content,
.content-area {
  overflow: visible !important;
}


/* =========================================
   TABLET
   ========================================= */

@media (max-width: 900px) {

  .anisa-hero {
    min-height: 820px;

    align-items: flex-end;

    background-position: 68% top;
  }


  .anisa-hero-overlay {
    background: linear-gradient(
      180deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.10) 28%,
      rgba(255,255,255,.88) 48%,
      rgba(255,255,255,.98) 62%,
      #ffffff 100%
    );
  }


  .anisa-hero-content {
    width: 100%;

    max-width: none;

    margin: 0;

    padding-top: 290px;
    padding-right: 35px;
    padding-bottom: 45px;
    padding-left: 35px;
  }


  .anisa-title {
    max-width: 100%;

    font-size: clamp(38px, 6vw, 54px);
  }


  .anisa-benefits {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    width: 100%;
    max-width: 620px;

    margin-top: 24px;
  }


  .anisa-benefit {
    flex-direction: column;

    align-items: center;
    justify-content: center;

    min-height: 100px;

    padding: 0 10px;

    text-align: center;
  }


  .anisa-benefit + .anisa-benefit {
    border-left: 1px solid rgba(41,79,38,.15);
    border-top: 0;
  }


  .anisa-icon {
    width: 46px;
    height: 46px;

    margin-bottom: 7px;

    font-size: 19px;
  }


  .anisa-benefit strong {
    font-size: 13px;
    line-height: 1.3;
  }

}


/* =========================================
   CELULAR
   ========================================= */

@media (max-width: 600px) {

  .anisa-hero {
    min-height: 910px;

    background-position: 71% top;
  }


  .anisa-hero-content {
    width: 100%;

    max-width: none;

    margin: 0;

    padding-top: 280px;
    padding-right: 18px;
    padding-bottom: 35px;
    padding-left: 18px;
  }


  .anisa-intro {
    font-size: 15px;
  }


  .anisa-title {
    max-width: 100%;

    font-size: clamp(30px, 8.5vw, 40px);

    line-height: 1.08;
  }


  .anisa-title span {
    margin-top: 8px;
  }


  /*
   IMPORTANTE:
   Se mantienen siempre los tres
   beneficios en una sola fila
   */

  .anisa-benefits {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    width: 100%;
    max-width: 100%;

    margin-top: 22px;
  }


  .anisa-benefit {
    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: flex-start;

    min-width: 0;
    min-height: 100px;

    padding: 0 5px;

    gap: 0;

    text-align: center;
  }


  .anisa-benefit + .anisa-benefit {
    border-left: 1px solid rgba(41,79,38,.15);
    border-top: 0;
  }


  .anisa-icon {
    flex: none;

    width: 40px;
    height: 40px;

    margin: 0 0 7px;

    font-size: 17px;
  }


  .anisa-benefit strong {
    font-size: 10.5px;

    line-height: 1.25;

    font-weight: 500;
  }


  .anisa-description {
    max-width: 100%;

    margin-top: 18px;

    padding-top: 20px;

    font-size: 15px;
  }


  .anisa-button {
    width: 100%;

    margin-top: 20px;
  }

}
/* ========================================= Paleta Anisa */
:root {
    --anisa-bosque: #28572A;
    --anisa-medio: #578D2D;
    --anisa-salvia: #DCE7D2;
    --anisa-salvia-claro: #E4ECD9;
    --anisa-crema: #FAF8F3;
    --anisa-carbon: #292929;
}

/* =========================================
   WOOCOMMERCE - BOTÓN SELECCIONAR OPCIONES
   ========================================= */

.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .button {
    background-color: #578D2D !important;
    color: #FAF8F3 !important;

    border: none !important;
    border-radius: 4px;

    padding: 9px 13px;

    font-weight: 600;
    text-decoration: none !important;

    transition:
        background-color 0.25s ease,
        color 0.25s ease;
}


/* Hover */

.woocommerce ul.products li.product a.button:hover,
.woocommerce ul.products li.product .button:hover {
    background-color: #28572A !important;
    color: #FAF8F3 !important;
}


/* Focus para accesibilidad */

.woocommerce ul.products li.product a.button:focus-visible,
.woocommerce ul.products li.product .button:focus-visible {
    background-color: #28572A !important;
    color: #FAF8F3 !important;

    outline: 2px solid #28572A;
    outline-offset: 2px;
}
/* BOTÓN AÑADIR AL CARRITO - FICHA DE PRODUCTO */
.single-product .single_add_to_cart_button,
.woocommerce div.product form.cart .button {
  background-color: #578D2D !important;
  color: #FAF8F3 !important;
  border: none !important;
}

/* HOVER */
.single-product .single_add_to_cart_button:hover,
.woocommerce div.product form.cart .button:hover {
  background-color: #28572A !important;
  color: #FAF8F3 !important;
}
/* CANTIDAD */
.single-product .quantity input.qty,
.woocommerce div.product form.cart .quantity input.qty {
  background-color: #FAF8F3 !important;
  color: #292929 !important;
  border: 1px solid #578D2D !important;
}

/* BOTONES + Y - / FLECHAS DE CANTIDAD */
.single-product .quantity button,
.single-product .quantity .plus,
.single-product .quantity .minus {
  background-color: #578D2D !important;
  color: #FAF8F3 !important;
  border-color: #578D2D !important;
}

.single-product .quantity button:hover,
.single-product .quantity .plus:hover,
.single-product .quantity .minus:hover {
  background-color: #28572A !important;
  color: #FAF8F3 !important;
}

/* SELECTOR DE VARIACIONES */
.single-product select {
  border: 1px solid #578D2D !important;
  color: #292929 !important;
  background-color: #FAF8F3 !important;
}
/* SELECTOR DE VOLUMEN */
.single-product select,
.woocommerce div.product form.cart select {
  background-color: #FAF8F3 !important;
  color: #292929 !important;
  border: 1px solid #578D2D !important;
  border-radius: 4px !important;
}

/* OPCIONES DEL SELECTOR */
.single-product select option,
.woocommerce div.product form.cart select option {
  background-color: #DCE7D2 !important;
  color: #28572A !important;
}

/* CUANDO EL SELECTOR TIENE FOCO */
.single-product select:focus,
.woocommerce div.product form.cart select:focus {
  border-color: #28572A !important;
  outline: 2px solid rgba(40, 87, 42, 0.18) !important;
}
/* CANTIDAD - CAMPO */
.single-product .quantity input.qty,
.woocommerce div.product form.cart .quantity input.qty {
  background-color: #FAF8F3 !important;
  color: #292929 !important;
  border: 1px solid #578D2D !important;
  border-radius: 4px !important;

  text-align: center;
  box-shadow: none !important;
}
/* =========================================
   WOOCOMMERCE - ENLACE "VER CARRITO"
   ========================================= */

.woocommerce a.added_to_cart,
.woocommerce-page a.added_to_cart {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  background-color: #DCE7D2 !important;
  color: #28572A !important;

  border: 1px solid #578D2D !important;
  border-radius: 4px;

  padding: 8px 14px !important;

  font-weight: 600 !important;
  text-decoration: none !important;

  opacity: 1 !important;

  transition:
    background-color 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease;
}


/* Hover */
.woocommerce a.added_to_cart:hover,
.woocommerce-page a.added_to_cart:hover {
  background-color: #578D2D !important;
  color: #FAF8F3 !important;
  border-color: #578D2D !important;
}


/* Accesibilidad / teclado */
.woocommerce a.added_to_cart:focus-visible,
.woocommerce-page a.added_to_cart:focus-visible {
  background-color: #28572A !important;
  color: #FAF8F3 !important;

  outline: 2px solid #28572A;
  outline-offset: 2px;
}
/* =========================================================
   PALETA ANISA INSUMOS
   ========================================================= */

:root {
  --anisa-bosque: #28572A;
  --anisa-medio: #578D2D;
  --anisa-salvia: #DCE7D2;
  --anisa-salvia-claro: #E4ECD9;
  --anisa-crema: #FAF8F3;
  --anisa-carbon: #292929;
}


/* =========================================================
   FONDO GENERAL Y TEXTO
   ========================================================= */

body,
.site,
.site-content,
.content-area,
.woocommerce-page {
  background-color: var(--anisa-crema) !important;
  color: var(--anisa-carbon) !important;
}


/* =========================================================
   NAVEGACIÓN PRINCIPAL
   ========================================================= */

.main-navigation a,
.site-header a,
.primary-navigation a,
.menu a {
  color: var(--anisa-bosque) !important;
}


/* MENÚ ACTIVO / HOVER */

.main-navigation a:hover,
.primary-navigation a:hover,
.menu a:hover,
.current-menu-item > a,
.current-menu-ancestor > a {
  color: var(--anisa-bosque) !important;
}


/* =========================================================
   MENÚ DESPLEGABLE
   ========================================================= */

.main-navigation ul ul,
.primary-navigation ul ul,
.menu .sub-menu,
.sub-menu {
  background-color: var(--anisa-salvia) !important;

  border: none !important;
  box-shadow: 0 8px 20px rgba(40, 87, 42, 0.12) !important;
}


/* OPCIONES DEL MENÚ */

.main-navigation ul ul li,
.primary-navigation ul ul li,
.menu .sub-menu li {
  background-color: var(--anisa-salvia) !important;
}


/* TEXTO DEL DESPLEGABLE */

.main-navigation ul ul a,
.primary-navigation ul ul a,
.menu .sub-menu a {
  color: var(--anisa-bosque) !important;

  background-color: var(--anisa-salvia) !important;

  border-bottom: 1px solid rgba(40, 87, 42, 0.12) !important;
}


/* HOVER DEL DESPLEGABLE */

.main-navigation ul ul a:hover,
.primary-navigation ul ul a:hover,
.menu .sub-menu a:hover,
.main-navigation ul ul li:hover > a,
.menu .sub-menu li:hover > a {
  background-color: var(--anisa-salvia-claro) !important;

  color: var(--anisa-bosque) !important;
}


/* SUBMENÚ DE SEGUNDO NIVEL */

.main-navigation ul ul ul,
.primary-navigation ul ul ul,
.menu .sub-menu .sub-menu {
  background-color: var(--anisa-salvia-claro) !important;
}


.main-navigation ul ul ul a,
.primary-navigation ul ul ul a,
.menu .sub-menu .sub-menu a {
  background-color: var(--anisa-salvia-claro) !important;

  color: var(--anisa-bosque) !important;
}


/* =========================================================
   TÍTULOS IMPORTANTES
   ========================================================= */

h1,
h2,
h3,
h4,
h5,
h6,
.woocommerce-loop-category__title,
.woocommerce-loop-product__title,
.product_title {
  color: var(--anisa-bosque) !important;
}


/* =========================================================
   ENLACES DE PRODUCTOS / CATEGORÍAS
   ========================================================= */

.woocommerce ul.products li.product a,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
  color: var(--anisa-bosque) !important;
}


/* =========================================================
   TEXTO CORRIENTE
   ========================================================= */

.woocommerce ul.products li.product,
.woocommerce ul.products li.product p,
.woocommerce div.product p,
.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--anisa-carbon) !important;
}


/* =========================================================
   BOTONES GENERALES WOOCOMMERCE
   ========================================================= */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce div.product form.cart .button,
.single_add_to_cart_button {
  background-color: var(--anisa-medio) !important;

  color: var(--anisa-crema) !important;

  border: none !important;

  text-decoration: none !important;
}


/* HOVER BOTONES */

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce div.product form.cart .button:hover,
.single_add_to_cart_button:hover {
  background-color: var(--anisa-bosque) !important;

  color: var(--anisa-crema) !important;
}


/* =========================================================
   "VER CARRITO"
   ========================================================= */

.woocommerce a.added_to_cart,
.woocommerce-page a.added_to_cart {
  background-color: var(--anisa-salvia) !important;

  color: var(--anisa-bosque) !important;

  border: 1px solid var(--anisa-medio) !important;

  padding: 8px 14px !important;

  text-decoration: none !important;

  opacity: 1 !important;
}


.woocommerce a.added_to_cart:hover,
.woocommerce-page a.added_to_cart:hover {
  background-color: var(--anisa-medio) !important;

  color: var(--anisa-crema) !important;
}


/* =========================================================
   SELECTORES
   ========================================================= */

.woocommerce select,
.single-product select,
.woocommerce-ordering select {
  background-color: var(--anisa-crema) !important;

  color: var(--anisa-carbon) !important;

  border: 1px solid var(--anisa-medio) !important;
}


.woocommerce select option,
.single-product select option {
  background-color: var(--anisa-salvia) !important;

  color: var(--anisa-bosque) !important;
}


/* =========================================================
   CANTIDAD
   ========================================================= */

.woocommerce .quantity input.qty,
.single-product .quantity input.qty {
  background-color: var(--anisa-crema) !important;

  color: var(--anisa-carbon) !important;

  border: 1px solid var(--anisa-medio) !important;

  box-shadow: none !important;
}


/* QUITAR FLECHAS AZULES NATIVAS */

.woocommerce .quantity input.qty::-webkit-inner-spin-button,
.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.single-product .quantity input.qty::-webkit-inner-spin-button,
.single-product .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none !important;

  margin: 0 !important;
}


.woocommerce .quantity input.qty,
.single-product .quantity input.qty {
  appearance: textfield !important;
  -moz-appearance: textfield !important;
}


/* =========================================================
   PRECIOS
   ========================================================= */

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--anisa-bosque) !important;

  font-weight: 600;
}


/* =========================================================
   BREADCRUMBS
   ========================================================= */

.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-breadcrumb a {
  color: var(--anisa-bosque) !important;
}


/* =========================================================
   PESTAÑAS DE PRODUCTO
   ========================================================= */

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--anisa-bosque) !important;
}


.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--anisa-bosque) !important;

  border-bottom: 2px solid var(--anisa-medio) !important;
}
/* TARJETA */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: #FAF8F3 !important;
}

/* CONTENIDO INTERNO */
.woocommerce ul.products li.product .product-inner,
.woocommerce ul.products li.product .product-content,
.woocommerce ul.products li.product .product-details,
.woocommerce ul.products li.product .product-info,
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  background: #FAF8F3 !important;
}

/* TÍTULO */
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: #28572A !important;
}

/* DESCRIPCIÓN */
.woocommerce ul.products li.product p,
.woocommerce ul.products li.product .excerpt,
.woocommerce ul.products li.product .description {
  color: #292929 !important;
}

/* PRECIO */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price span {
  color: #28572A !important;
  background: #FAF8F3 !important;
}

/* BOTÓN PRINCIPAL */
.woocommerce ul.products li.product a.button {
  background: #578D2D !important;
  color: #FAF8F3 !important;
}

/* BOTÓN VER CARRITO */
.woocommerce ul.products li.product a.added_to_cart {
  background: #DCE7D2 !important;
  color: #28572A !important;
}
/* =========================================================
   HOMEPAGE - FORZAR COLOR DE BOTONES AZULES
   ========================================================= */

/* Botones/enlaces dentro del contenido principal del home */
.home .entry-content a,
.home .site-main a {
  transition:
    background-color .25s ease,
    color .25s ease,
    border-color .25s ease;
}

/* Botones que ya tienen aspecto de CTA */
.home .entry-content a[class*="button"],
.home .entry-content a[class*="btn"],
.home .site-main a[class*="button"],
.home .site-main a[class*="btn"],
.home .stk-button,
.home .stk-block-button__link,
.home .stk-button__inner-text,
.home .wp-block-button__link {
  background-color: #578D2D !important;
  color: #FAF8F3 !important;
  border-color: #578D2D !important;
  box-shadow: none !important;
}

/* Hover */
.home .entry-content a[class*="button"]:hover,
.home .entry-content a[class*="btn"]:hover,
.home .site-main a[class*="button"]:hover,
.home .site-main a[class*="btn"]:hover,
.home .stk-button:hover,
.home .stk-block-button__link:hover,
.home .wp-block-button__link:hover {
  background-color: #28572A !important;
  color: #FAF8F3 !important;
  border-color: #28572A !important;
}
/* =========================================
   BANNER CATEGORÍAS WOOCOMMERCE - ANISA
   ========================================= */

[data-prefix="woo_categories"] .hero-section[data-type="type-2"] {
    background-image: url("https://anisainsumos.com/wp-content/uploads/2026/08/back-pages.png") !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    background-color: #FAF8F3 !important;

    --min-height: 349px;
}
[data-prefix="woo_categories"] .entry-header .page-title {
    color: #28572A !important;
    --theme-heading-color: #28572A !important;
}
/* =========================================
   CANTIDAD - QUITAR FLECHAS AZULES NATIVAS
   ========================================= */

.woocommerce .quantity input.qty,
.single-product .quantity input.qty {
  background-color: #FAF8F3 !important;
  color: #292929 !important;
  border: 1px solid #578D2D !important;
  box-shadow: none !important;
  text-align: center;
}

/* Chrome / Edge / Safari */
.woocommerce .quantity input.qty::-webkit-inner-spin-button,
.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.single-product .quantity input.qty::-webkit-inner-spin-button,
.single-product .quantity input.qty::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
  appearance: none !important;
  margin: 0 !important;
}

/* Firefox */
.woocommerce .quantity input.qty,
.single-product .quantity input.qty {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}