/* ---- Logo del menu deslizante ----
   El contenedor lleva la proporcion del video (16:9) y ambos van con
   object-fit:contain, asi que se ven ENTEROS: ni recorte ni salto de
   maquetacion al pasar de la imagen al video.
   El video NO puede ocultarse con display:none (asi no se reproduce): se deja
   con opacity 0 y se descubre en el evento 'playing'. Si el navegador no puede
   con el codec, se queda la imagen. Es adorno: no recibe clics. */
.icf-v2 .v2m__brand{position:relative;align-self:center;flex:0 0 auto;margin:0 auto 26px;line-height:0;pointer-events:none;perspective:900px;width:min(76vw,300px);aspect-ratio:16/9}
.icf-v2 .v2m__brand img,
.icf-v2 .v2m__brand video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.icf-v2 .v2m__brand video{opacity:0;transition:opacity .45s ease}
.icf-v2 .v2m--vid .v2m__brand video{opacity:1}
.icf-v2 .v2m--vid .v2m__brand img{opacity:0}
@media (min-width:768px){
  .icf-v2 .v2m{padding-right:clamp(340px,44vw,660px)}
  .icf-v2 .v2m__brand{position:absolute;top:50%;right:clamp(20px,4vw,64px);transform:translateY(-50%);margin:0;width:clamp(320px,38vw,580px);align-self:auto}
}
/* Balanceo suave de la imagen mientras no haya video reproduciendose. */
@media (prefers-reduced-motion:no-preference){
  .icf-v2 .v2m__brand img{animation:gocamisVaiven 7s ease-in-out infinite;transform-style:preserve-3d}
  .icf-v2 .v2m--vid .v2m__brand img{animation:none}
  @keyframes gocamisVaiven{0%,100%{transform:rotateY(-15deg)}50%{transform:rotateY(15deg)}}
}

/* Ajustes propios de gocamis sobre el skin v2. */

/* El skin trae su propio pie (.v2f): ocultamos el de Astra para que no salgan dos. */
body.icf-v2 #colophon.site-footer{display:none !important}

/* Doble barra de scroll en la ficha de producto.
   icf-product.css pone overflow-x:hidden en el body; cuando un eje es 'hidden'
   el navegador convierte el otro en 'auto', asi que el body scrollea por su
   cuenta ademas del documento. Con 'clip' se recorta igual en horizontal pero
   sin crear un contenedor de scroll propio. */
body.icf-body.single-product{overflow-x:clip}

/* ---- Barra de la tienda ----
   WooCommerce trae float:left en .woocommerce-result-count y float:right en
   .woocommerce-ordering. Los chips de categoria crean contexto de formato
   propio (tienen overflow), asi que se estrechaban para esquivar el float y
   acababan a la derecha, cortados. Quitando los floats vuelven a su sitio. */
.icf-v2 .v2shop__count,
.icf-v2 .woocommerce-result-count,
.icf-v2 .woocommerce-ordering{float:none !important}
.icf-v2 .v2shop__head::after{content:'';display:table;clear:both}
.icf-v2 .v2shop__chips{width:100%}

/* En movil: la fila de filtros y orden se reparte bien y el desplegable no se sale. */
@media (max-width:600px){
  .icf-v2 .v2shop__bar{flex-wrap:wrap;gap:10px}
  .icf-v2 .v2shop__bar .woocommerce-ordering{flex:1 1 190px;min-width:0}
  .icf-v2 .v2shop__bar select{width:100% !important;max-width:100%}
  .icf-v2 .v2shop__fbtn{flex:0 0 auto}
  .icf-v2 .v2shop__chips{justify-content:flex-start;padding-inline:0}
}

/* Chip de tipo seleccionado dentro de un equipo. */
.icf-v2 .v2shop__chips a.is-active{border-color:#0a0a0b !important;background:#0a0a0b !important;color:#fff !important}

/* El menu es flex en columna: sin align-self la imagen se estira a todo el
   ancho (align-items:stretch) y el logo sale deformado.
   Logo cromado en el menu deslizante. Solo aqui: a los 34 px de la cabecera
   el cromado se empasta y se lee peor que el logo plano. */
.icf-v2 .v2m__logo{height:74px;width:auto;align-self:center;flex:0 0 auto;display:block;margin:0 auto 28px;user-select:none}
@media (min-width:768px){.icf-v2 .v2m__logo{height:96px;margin-bottom:36px}}


/* El video del logo tiene fondo negro absoluto (0,0,0) y el menu venia en
   #0a0a0b: se notaba el recuadro. Se iguala el menu al negro del video. */
.icf-v2 .v2m{background:#000 !important}

/* Buscador dentro del menu deslizante. */
.icf-v2 .v2m__search{margin:0 0 24px;max-width:560px;width:100%}
.icf-v2 .v2m__search .dgwt-wcas-search-wrapp{max-width:100%}
.icf-v2 .v2m__search .dgwt-wcas-search-input{border-radius:12px !important;font-family:'Bricolage Grotesque',sans-serif !important;height:48px !important}
@media (min-width:768px){.icf-v2 .v2m__search{margin-bottom:30px}}
