/* ==========================================================================
   SUMINISTROS LABORALES — Retoques sobre default-bootstrap (PS 1.6)  v13
   El resto del tema queda como estaba:
     1. Menú principal: barra de una línea, subrayado verde y desplegable
     2. Buscador: botón verde
     3. Ficha de producto: títulos de sección (h3) con acento verde
     4. Ficha de producto: tabla de características en filas blanco/gris
     5. Menú: sección marcada también en fichas y subcategorías
     6. Portada: pestañas y título de marcas con el estilo del menú
     7. Sin el botón de vista rápida (ojo) en las miniaturas
     8. Menú en móvil con el mismo estilo
   No cambia tipografías. Para deshacer: quitar el <link> de header.tpl.
   Ubicación: themes/default-bootstrap/css/sl-refresh.css
   ========================================================================== */

/* ---------- 1. Menú principal ----------------------------------------
   Barra blanca de una sola línea: los apartados se reparten el ancho
   disponible y el tamaño de letra baja por tramos, así no salta a dos
   líneas. Subrayado verde al pasar el ratón y en la sección activa.
   En móvil (<768 px) se mantiene el menú desplegable del tema.        */
@media (min-width: 768px) {
  .sf-menu {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: stretch;
    background: #fff !important;
    border-top: 1px solid #e6e9ec !important;
    border-bottom: 1px solid #e6e9ec !important;
    margin: 0;
  }
  .sf-menu:before, .sf-menu:after { display: none !important; }   /* clearfix del tema */
  .sf-menu > li {
    float: none !important;
    flex: 1 1 auto;
    border: 0 !important;
    text-align: center;
  }
  .sf-menu > li > a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    white-space: nowrap;
    border: 0 !important;
    background: transparent !important;
    color: #333 !important;
    font-size: 15px !important;
    line-height: 20px !important;
    letter-spacing: .06em;
    padding: 15px 12px !important;
    transition: color .15s;
  }
  /* separadores finos entre apartados */
  .sf-menu > li + li > a:before {
    content: "";
    position: absolute; left: 0; top: 50%;
    height: 16px; margin-top: -8px;
    border-left: 1px solid #e6e9ec;
  }
  /* subrayado verde */
  .sf-menu > li > a:after {
    content: "";
    position: absolute;
    left: 12px; right: 12px; bottom: -1px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: #41b854;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .2s ease;
  }
  .sf-menu > li > a:hover,
  .sf-menu > li.sfHover > a,
  .sf-menu > li.sfHoverForce > a { color: #2f9a42 !important; }
  .sf-menu > li > a:hover:after,
  .sf-menu > li.sfHover > a:after,
  .sf-menu > li.sfHoverForce > a:after { transform: scaleX(1); }

  /* desplegable */
  .sf-menu > li > ul {
    top: 100% !important;
    margin-top: 1px;
    padding: 22px 26px 24px !important;
    border-top: 3px solid #41b854;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 18px 36px rgba(0,0,0,.12);
    column-count: 4;
    column-gap: 24px;
    text-align: left !important;           /* no heredar el centrado de la barra */
  }
  .sf-menu > li > ul > li,
  .sf-menu > li > ul > li:hover {
    border: 0 !important;
    margin: 0 !important;
    height: auto !important;               /* el tema fijaba 48 px */
    background: transparent !important;    /* el tema ponía fondo negro al pasar el ratón */
    /* lista en columnas: los nombres de dos líneas no descuadran nada */
    float: none !important;
    display: block !important;
    width: auto !important;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
  }
  .sf-menu > li > ul > li > a {
    display: block !important;
    width: 100%;
    text-align: left !important;
    text-transform: none !important;
    font-size: 14px !important;
    font-weight: 600;
    color: #333 !important;
    background: transparent !important;
    padding: 8px 12px 8px 22px !important;
    position: relative;
    text-decoration: none;
    transition: color .15s;
  }
  .sf-menu > li > ul > li > a:before {        /* viñeta verde */
    content: "";
    position: absolute; left: 8px; top: 15px;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #41b854;
    opacity: .45;
    transition: opacity .15s, transform .15s;
  }
  /* al pasar el ratón: texto verde subrayado y viñeta más marcada.
     Funciona igual con nombres de una o de dos líneas. */
  .sf-menu > li > ul > li > a:hover,
  .sf-menu > li > ul > li:hover > a {
    color: #2f9a42 !important;
    text-decoration: underline;
    text-decoration-color: #41b854;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
  }
  .sf-menu > li > ul > li > a:hover:before,
  .sf-menu > li > ul > li:hover > a:before {
    opacity: 1;
    transform: scale(1.35);
  }
}
/* pantallas medianas: letra algo menor para que quepan los 8 apartados */
@media (min-width: 992px) and (max-width: 1199px) {
  .sf-menu > li > a { font-size: 14px !important; padding: 14px 8px !important; letter-spacing: .04em; }
  .sf-menu > li > a:after { left: 8px; right: 8px; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .sf-menu > li > a { font-size: 12px !important; padding: 13px 4px !important; letter-spacing: .02em; }
  .sf-menu > li > a:after { left: 4px; right: 4px; }
  .sf-menu > li > ul { column-count: 3; }
}

/* ---------- 2. Buscador: botón verde ----------------------------------- */
#search_block_top .btn.button-search {
  background: #41b854;
  color: #fff;
  border-radius: 0 4px 4px 0;           /* esquinas derechas ligeramente redondeadas */
  transition: background .15s;
}
#search_block_top .btn.button-search:hover {
  background: #2f9a42;
  color: #fff;
}

/* ---------- 3. Ficha de producto: títulos de sección ------------------
   Línea gris fina a todo el ancho con un tramo verde bajo el arranque
   del título (mismo verde que el filete del h1 del producto).          */
.page-product-box { margin-top: 26px; }
.page-product-box h3.page-product-heading,
h3.page-product-heading {
  position: relative;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #dde3e8 !important;
  border-radius: 0;
  color: #17212b;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 10px 0 10px !important;
}
.page-product-box h3.page-product-heading:after,
h3.page-product-heading:after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 64px; height: 3px;
  border-radius: 2px;
  background: #1c8c56;
}

/* "Otros productos de la misma categoría": ya fuera de la ficha, va con
   el estilo de barra de la portada (pestañas / Nuestras marcas).
   Su CSS propio lo ponía en blanco sobre azul con !important.          */
.page-product-box h3.productscategory_h3 {
  background: #fff !important;
  color: #2f9a42 !important;
  border: 0 !important;
  border-top: 1px solid #e6e9ec !important;
  border-bottom: 1px solid #e6e9ec !important;
  margin: 34px 0 20px !important;
  padding: 15px 20px !important;
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 600;
  letter-spacing: .06em;
  /* subrayado verde bajo el texto, apoyado en la línea inferior */
  text-decoration: underline;
  text-decoration-color: #41b854;
  text-decoration-thickness: 3px;
  text-underline-offset: 18px;
}
.page-product-box h3.productscategory_h3:after { display: none; }   /* sin el tramo de los h3 */

/* ---------- 4. Ficha de producto: características en filas alternas ---- */
.page-product-box table.table-data-sheet {
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e3e8ec;
  border-radius: 10px;
  overflow: hidden;
}
.page-product-box table.table-data-sheet tr td { border-color: #e3e8ec; }
.page-product-box table.table-data-sheet tr.odd,
.page-product-box table.table-data-sheet tr.odd td { background: #fff; }
.page-product-box table.table-data-sheet tr.even,
.page-product-box table.table-data-sheet tr.even td { background: #f5f7f8; }

/* ---------- 5. Menú: marcar la sección también en fichas y subcategorías --
   PrestaShop pone en <body> la clase category-<id> de la categoría por
   defecto del producto (o de la categoría que se está viendo). Cada grupo
   relaciona esas categorías con su entrada del menú.
   Si creas una categoría nueva, añade su  body.category-<id>  al grupo de
   su sección (en las dos reglas: la del texto y la del subrayado).        */
/* Vestuario */
body.category-12 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-32 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-61 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-120 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-59 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-79 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-26 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-83 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-48 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-22 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-13 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-80 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-19 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-31 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-23 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-82 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-28 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-52 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-24 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-14 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-20 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-21 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-25 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-27 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-30 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-93 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-29 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-92 .sf-menu > li > a[href*="/vestuario-12/"],
body.category-118 .sf-menu > li > a[href*="/vestuario-12/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-12 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-32 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-61 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-120 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-59 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-79 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-26 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-83 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-48 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-22 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-13 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-80 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-19 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-31 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-23 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-82 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-28 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-52 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-24 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-14 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-20 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-21 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-25 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-27 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-30 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-93 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-29 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-92 .sf-menu > li > a[href*="/vestuario-12/"]:after,
body.category-118 .sf-menu > li > a[href*="/vestuario-12/"]:after { transform: scaleX(1); }
/* Calzado */
body.category-15 .sf-menu > li > a[href*="/calzado-15/"],
body.category-62 .sf-menu > li > a[href*="/calzado-15/"],
body.category-34 .sf-menu > li > a[href*="/calzado-15/"],
body.category-56 .sf-menu > li > a[href*="/calzado-15/"],
body.category-50 .sf-menu > li > a[href*="/calzado-15/"],
body.category-57 .sf-menu > li > a[href*="/calzado-15/"],
body.category-36 .sf-menu > li > a[href*="/calzado-15/"],
body.category-60 .sf-menu > li > a[href*="/calzado-15/"],
body.category-33 .sf-menu > li > a[href*="/calzado-15/"],
body.category-35 .sf-menu > li > a[href*="/calzado-15/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-15 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-62 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-34 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-56 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-50 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-57 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-36 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-60 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-33 .sf-menu > li > a[href*="/calzado-15/"]:after,
body.category-35 .sf-menu > li > a[href*="/calzado-15/"]:after { transform: scaleX(1); }
/* Cabeza */
body.category-16 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-37 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-43 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-44 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-40 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-63 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-42 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-51 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-38 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-39 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-41 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-94 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-100 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-103 .sf-menu > li > a[href*="/cabeza-16/"],
body.category-122 .sf-menu > li > a[href*="/cabeza-16/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-16 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-37 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-43 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-44 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-40 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-63 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-42 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-51 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-38 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-39 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-41 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-94 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-100 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-103 .sf-menu > li > a[href*="/cabeza-16/"]:after,
body.category-122 .sf-menu > li > a[href*="/cabeza-16/"]:after { transform: scaleX(1); }
/* Auditivo */
body.category-18 .sf-menu > li > a[href*="/auditivo-18/"],
body.category-46 .sf-menu > li > a[href*="/auditivo-18/"],
body.category-47 .sf-menu > li > a[href*="/auditivo-18/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-18 .sf-menu > li > a[href*="/auditivo-18/"]:after,
body.category-46 .sf-menu > li > a[href*="/auditivo-18/"]:after,
body.category-47 .sf-menu > li > a[href*="/auditivo-18/"]:after { transform: scaleX(1); }
/* Manos */
body.category-17 .sf-menu > li > a[href*="/manos-17/"],
body.category-84 .sf-menu > li > a[href*="/manos-17/"],
body.category-45 .sf-menu > li > a[href*="/manos-17/"],
body.category-55 .sf-menu > li > a[href*="/manos-17/"],
body.category-49 .sf-menu > li > a[href*="/manos-17/"],
body.category-116 .sf-menu > li > a[href*="/manos-17/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-17 .sf-menu > li > a[href*="/manos-17/"]:after,
body.category-84 .sf-menu > li > a[href*="/manos-17/"]:after,
body.category-45 .sf-menu > li > a[href*="/manos-17/"]:after,
body.category-55 .sf-menu > li > a[href*="/manos-17/"]:after,
body.category-49 .sf-menu > li > a[href*="/manos-17/"]:after,
body.category-116 .sf-menu > li > a[href*="/manos-17/"]:after { transform: scaleX(1); }
/* Proteccion */
body.category-64 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-67 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-87 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-65 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-73 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-66 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-68 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-89 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-71 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-72 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-75 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-74 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-86 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-70 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-69 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-85 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-90 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-91 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-95 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-96 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-97 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-98 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-99 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-102 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-114 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-117 .sf-menu > li > a[href*="/proteccion-64/"],
body.category-121 .sf-menu > li > a[href*="/proteccion-64/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-64 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-67 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-87 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-65 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-73 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-66 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-68 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-89 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-71 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-72 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-75 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-74 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-86 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-70 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-69 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-85 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-90 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-91 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-95 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-96 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-97 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-98 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-99 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-102 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-114 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-117 .sf-menu > li > a[href*="/proteccion-64/"]:after,
body.category-121 .sf-menu > li > a[href*="/proteccion-64/"]:after { transform: scaleX(1); }
/* Seguridad */
body.category-76 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-105 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-106 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-107 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-108 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-109 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-112 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-113 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-115 .sf-menu > li > a[href*="/seguridad-76/"],
body.category-119 .sf-menu > li > a[href*="/seguridad-76/"] {
  background: transparent !important;
  color: #2f9a42 !important;
}
body.category-76 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-105 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-106 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-107 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-108 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-109 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-112 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-113 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-115 .sf-menu > li > a[href*="/seguridad-76/"]:after,
body.category-119 .sf-menu > li > a[href*="/seguridad-76/"]:after { transform: scaleX(1); }

/* ---------- 6. Portada: pestañas y "Nuestras marcas" ---------------------
   Mismo lenguaje que el menú principal: barra blanca con líneas finas,
   mayúsculas espaciadas y subrayado verde en la pestaña activa.         */
#home-page-tabs {
  display: flex;
  flex-wrap: wrap;
  margin: 30px 0 22px !important;
  padding: 0 !important;
  background: #fff;
  border: 0;
  border-top: 1px solid #e6e9ec;
  border-bottom: 1px solid #e6e9ec;
}
#home-page-tabs:before, #home-page-tabs:after { display: none !important; }   /* clearfix */
#home-page-tabs > li {
  float: none;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
#home-page-tabs > li > a {
  position: relative;
  display: block;
  margin: 0 !important;
  padding: 15px 20px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #333 !important;
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  transition: color .15s;
}
#home-page-tabs > li + li > a:before {          /* separador fino */
  content: "";
  position: absolute; left: 0; top: 50%;
  height: 16px; margin-top: -8px;
  border-left: 1px solid #e6e9ec;
}
#home-page-tabs > li > a:after {                /* subrayado verde */
  content: "";
  position: absolute;
  left: 20px; right: 20px; bottom: -1px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: #41b854;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
#home-page-tabs > li > a:hover,
#home-page-tabs > li.active > a { color: #2f9a42 !important; }
#home-page-tabs > li > a:hover:after,
#home-page-tabs > li.active > a:after { transform: scaleX(1); }

/* título "Nuestras marcas" con el mismo estilo */
#mancarousel_block .title_block {
  position: relative;
  margin: 30px 0 18px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-top: 1px solid #e6e9ec !important;
  border-bottom: 1px solid #e6e9ec !important;
  display: block;
  width: 100%;
}
#mancarousel_block .title_block a {
  position: relative;
  display: inline-block;
  padding: 15px 20px !important;
  background: transparent !important;
  color: #2f9a42 !important;
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
}
#mancarousel_block .title_block a:after {
  content: "";
  position: absolute;
  left: 20px; right: 20px; bottom: -1px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: #41b854;
}

/* flechas del carrusel dentro de la barra del título */
#mancarousel_block #mancarousel_prev,
#mancarousel_block #mancarousel_next { top: -60px !important; }
#mancarousel_block #mancarousel_prev:hover,
#mancarousel_block #mancarousel_next:hover { color: #2f9a42 !important; }

/* móvil: las pestañas van una debajo de otra */
@media (max-width: 767px) {
  #home-page-tabs { display: block; }
  #home-page-tabs > li { float: none; width: 100%; }
  #home-page-tabs > li + li > a:before { display: none; }
  #home-page-tabs > li + li { border-top: 1px solid #e6e9ec !important; }
  #home-page-tabs > li > a:after { left: 0; right: auto; top: 0; bottom: 0; width: 3px; height: auto; border-radius: 0; transform: scaleY(0); }
  #home-page-tabs > li.active > a:after { transform: scaleY(1); }
}

/* ---------- 7. Quitar la "vista rápida" (el ojo sobre la imagen) ----------
   Afecta a portada, categorías y productos relacionados.                   */
.quick-view-wrapper-mobile,
.quick-view-mobile,
.product-image-container .quick-view,
a.quick-view { display: none !important; }

/* ---------- 8. Menú en móvil (<768 px) -----------------------------------
   Mismo lenguaje que en escritorio: blanco, líneas finas, mayúsculas
   espaciadas y verde para lo activo. Subcategorías en lista simple.       */
@media (max-width: 767px) {
  #block_top_menu { padding-top: 0; }
  #block_top_menu .cat-title {
    background: #fff !important;
    color: #333 !important;
    border-top: 1px solid #e6e9ec;
    border-bottom: 1px solid #e6e9ec !important;
    font-size: 15px !important;
    line-height: 20px !important;
    letter-spacing: .06em;
    padding: 14px 16px !important;
  }
  #block_top_menu .cat-title:hover { background: #fff !important; color: #2f9a42 !important; }
  #block_top_menu .cat-title:after {
    top: 13px !important; right: 16px !important;
    font-size: 18px !important;
    color: #41b854;
  }

  .sf-menu { border: 0 !important; background: #fff !important; }
  .sf-menu > li { border: 0 !important; border-bottom: 1px solid #eef1f3 !important; }
  .sf-menu > li > a {
    background: transparent !important;
    border: 0 !important;
    color: #333 !important;
    font-size: 15px !important;
    line-height: 20px !important;
    letter-spacing: .06em;
    padding: 14px 52px 14px 16px !important;
  }
  .sf-menu > li > a:hover,
  .sf-menu > li.sfHover > a,
  .sf-menu > li.sfHoverForce > a { color: #2f9a42 !important; background: transparent !important; }
  /* botón +/− de cada apartado */
  .sf-menu > li > span {
    top: 9px !important; right: 10px !important;
    width: 32px !important; height: 32px !important;
    text-align: center; line-height: 32px;
  }
  .sf-menu > li > span:after { font-size: 18px !important; color: #41b854; }

  /* subcategorías */
  .sf-menu > li > ul {
    background: #f8fafb !important;
    box-shadow: none !important;
    border: 0 !important;
    border-top: 1px solid #eef1f3 !important;
    padding: 6px 0 10px !important;
  }
  .sf-menu > li > ul > li,
  .sf-menu > li > ul > li:hover {
    float: none !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  .sf-menu > li > ul > li > a {
    position: relative;
    display: block !important;
    text-align: left !important;
    text-transform: none !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600;
    color: #333 !important;
    background: transparent !important;
    padding: 9px 16px 9px 34px !important;
    margin: 0 !important;
  }
  .sf-menu > li > ul > li > a:before {        /* viñeta verde */
    content: "";
    position: absolute; left: 18px; top: 16px;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #41b854;
    opacity: .5;
  }
  .sf-menu > li > ul > li > a:hover,
  .sf-menu > li > ul > li:hover > a { color: #2f9a42 !important; }
  .sf-menu > li > ul > li > a:hover:before,
  .sf-menu > li > ul > li:hover > a:before { opacity: 1; }
}