/*
Theme Name: flatsome-new-child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE. ***************/

/* Botón "¿Eres profesional? Regístrate aquí" bajo el login */
.ux-b2b-register{
  text-align:center;
  margin-top:15px;
}
.ux-b2b-register a.button{
  display:inline-block;
  padding:0.6em 1.2em;
  font-size:14px;
  font-weight:600;
  color:#557f5f;
  border:2px solid #557f5f;
  border-radius:4px;
  text-transform:uppercase;
  letter-spacing:0.5px;
  background-color:transparent;
  transition:all .3s ease;
}
.ux-b2b-register a.button:hover{
  background-color:#557f5f;
  color:#fff;
}

/* Garantizar que el menú lateral de "My Account" sea clicable */
.woocommerce-account .woocommerce-MyAccount-navigation{
  position:relative;
  z-index:10;
  pointer-events:auto;
}
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .entry-content > *{
  position:relative;
  z-index:1;
}

/* (Opcional) estilos del banner de registro si usas el UX Block propuesto */
.hero-registro .hero-registro__inner{
  text-align:center;
  max-width:860px;
  margin:0 auto;
  padding:40px 20px;
}
.hero-registro__title{
  margin:0 0 10px;
  font-size:40px;
  line-height:1.1;
  letter-spacing:1.5px;
  text-transform:uppercase;
  font-weight:700;
}
.hero-registro__subtitle{
  margin:0 0 22px;
  font-size:17px;
  opacity:.95;
}

/* Responsive */
@media only screen and (max-width:48em){
  .ux-b2b-register a.button{
    width:100%;
    font-size:16px;
    padding:0.8em;
  }
  .hero-registro__title{ font-size:30px; }
  .hero-registro__subtitle{ font-size:16px; }
}

/* =========================================================
   PRODUCTO: OCULTAR NAV NATIVA + NAV PERSONALIZADA (SEGURA)
   ========================================================= */

/* Oculta SOLO la navegación nativa del producto (no el header) */
.single-product .product-nav,
.single-product .product-next-prev,
.single-product .product-next-prev-thumbs,
.single-product .product-page-nav{
  display:none !important;
}

/* ---- NAV personalizada (clases usadas en functions.php) ---- */
:root{ --ts-brand:#557f5f; } /* color de marca para la nav */

.ts-catalog-prev-next{
  display:flex;
  align-items:center;
  gap:12px;
  margin:12px 0 20px;
}

/* Botón píldora con texto pequeño */
.ts-nav{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;              /* píldora */
  border:1.5px solid var(--ts-brand);
  color:var(--ts-brand);
  background:transparent;
  text-decoration:none;
  transition:all .2s ease-in-out;
  font-size:12.5px;
  line-height:1.2;
}
.ts-nav:hover{
  background:var(--ts-brand);
  color:#fff;
  transform:translateY(-1px);
}

/* Flecha en mini-círculo */
.ts-nav__arrow{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:1.5px solid currentColor;
  font-size:13px;
  line-height:1;
}

/* Bloque de textos */
.ts-nav__text{ display:flex; flex-direction:column; line-height:1.15; }
.ts-nav__label{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
  opacity:.8;
  margin-bottom:2px;
}
.ts-nav__title{
  font-size:12.5px;
  font-weight:700;
  line-height:1.2;
}

/* En el botón "siguiente" la flecha va a la derecha */
.ts-nav--next{ flex-direction:row-reverse; }

/* Responsive */
@media (max-width:600px){
  .ts-nav{ padding:8px 10px; gap:8px; }
  .ts-nav__title{ font-size:12px; }
  .ts-nav__arrow{ width:20px; height:20px; font-size:12px; }
}

/* ---- Opcional: versión solo iconos (sin títulos) ---- */
/*
.ts-nav__text{ display:none; }
.ts-nav{ padding:8px; }
.ts-nav__arrow{ width:36px; height:36px; font-size:16px; border-width:2px; }
*/