
@font-face {
    font-family: "Montserrat";
    src: url("../fonts/Montserrat/Montserrat-VariableFont_wght.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "DynaPuff";
    src: url("../fonts/DynaPuff/DynaPuff-VariableFont_wdth\,wght.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

.page-my-account #content .links {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Fuerza 3 columnas */
}

.page-my-account #content .links a {
    max-width: 500%;     /* Ocupa su columna completa */
    height: 120px;        /* Ajusta según quieras */
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    
}


.page-my-account #content .links a {
    width: 90% !important;    
}

.page-my-account #content .links > a {
    margin: 10px; /* en lugar de 20px o más */
}


.page-my-account #content .links a span.link-item{
    background-color: #8AC2BF !important;
    border-radius: 12px;
    color: #f5f5f5;
    font-family: 'DynaPuff';
    font-weight: bold;
    box-shadow: 6px 6px 0 #4EA39F;  
}

.page-my-account #content .links a i {
    color: #f5f5f5 !important;
    font-weight: bold;
}

.page-my-account #content .links a i:hover{
    color: #621F72;
    font-weight: bold;
}

 #main .page-footer{
    display: none;
 }

 #main .page-content{
    background-color: #D7B1E3 !important;
 }

 body.page-my-account footer {
    display: block !important;
  
}

body.page-my-account .page-footer {
    display: flex !important;
    justify-content: center;
    align-items: center;
}

body.page-my-account footer .text-sm-center {
    background-color: #4EA39F;
    color: #f5f5f5;
    width: 20%;
    border-radius: 20px;
    font-family: 'DynaPuff';
    font-weight: 600;
}

body.page-my-account footer .text-sm-center a{
    color: #f5f5f5;
}


.wishlist-footer-links {
    display: none;
}

#main .page-header{
    color: #621F72 !important;
    font-family: 'Montserrat';
    font-weight: bold;
}

.container ol li a{
    color: #621F72 !important;
    font-weight: bold;
    font-family: 'Montserrat';
 }

 .container ol li span{
    color: #621F72 !important;
    font-weight: bold;
    font-family: 'Montserrat';
 }

/*Formulario de Registro*/

 .page-content.page-cms ul, p{
  display: none !important;
}

/* Centrar el formulario de registro */
#content .register-form {
  max-width: 650px !important;   /* el ancho que quieras */
  width: 100% !important;        /* que pueda reducir en móviles */
  margin-left: auto !important;  /* centra horizontalmente */
  margin-right: auto !important; /* centra horizontalmente */
  float: none !important;        /* por si el tema lo flota */
}

/* Si el contenedor usa flex y empuja a la derecha, fuerzo el centrado */
#content .page-content {
  display: block !important;         /* o flex con centrado, elige una de estas dos líneas */
  /* display: flex; justify-content: center; */
}


/* (Opcional) si algún padre tiene text-align:right, no afecte al bloque */
#content .register-form { text-align: left; }

.js-customer-form input{
  font-family: 'Monstserrat';
  font-weight:500;
}

.js-customer-form label[for="field-id_gender"] {
  display: none !important;
}

.js-customer-form label[for="field-id_gender"] + div {
  display: none !important;
}

form .form-control-label {
    color: #621F72 !important;
    font-weight: bold;
    font-family: 'Montserrat';
    letter-spacing: .2px;
}

.form-control-comment{
    color: #621F72 !important;
    font-weight: bold;
    font-family: 'Montserrat';
}

.js-customer-form #field-birthday ~ .form-control-comment{
  display: none !important;
}

.js-customer-form label[for="field-birthday"] ~ .form-control-comment {
  display: none !important;
}

.js-customer-form .btn{
  border-radius:  20px 20px 20px 20px; ;
  background-color: #6f3a8c !important;
}

.js-customer-form .progress{
  border-radius: 20px !important;
}

.js-customer-form .progress-bar{
  border-radius: 20px;
  background-color: #4EA39F !important;
}

.form-control {
    border-radius: 20px;
    width: 100%;
}

/* Forzar todos los labels del formulario a alinearse verticalmente */
/* Aplica a todos los labels de customer-form */
.js-customer-form .form-control-label {
  display: flex;
  align-items: center;      /* centra verticalmente */
  justify-content: flex-end;/* sigue alineado a la derecha */
  height: 100%;             /* ocupa toda la altura de la fila */
  margin: 0;
  white-space: nowrap;      /* evita salto de línea */
}


/* Sobrescribir el cambio de texto que hiciste con ::after */
.js-customer-form label[for="field-email"] {
  font-size: 0; /* oculta texto original */
}
.js-customer-form label[for="field-email"]::after {
  content: "Correo Electrónico";
  font-size: 1rem;
  font-weight: bold;
  font-family: 'Montserrat';
  color: #6f3a8c;
}

/* Igual para Fecha de nacimiento */
.js-customer-form label[for="field-birthday"] {
  font-size: 0;
}
.js-customer-form label[for="field-birthday"]::after {
  content: "Fecha de nacimiento";
  font-size: 1rem;
  color: #6f3a8c;
  font-weight: bold;
  font-family: 'Montserrat';
}

.custom-checkbox label {
  color: #6f3a8c !important;
  font-weight: bold;
  font-family: 'Montserrat';
}

.custom-checkbox .psgdpr {
  color: #6f3a8c !important;
  font-weight: bold;
  font-family: 'Montserrat';
}

/*Logearte*/

.login-form .form-group .js-input-column .js-parent-focus .input-group-btn .btn{
  border-radius:  0px 20px 20px 0px;
  background-color: #6f3a8c !important; 
}

.login-form #submit-login{
  border-radius: 20px 20px 20px 20px;
  background-color: #6f3a8c !important;
}

.login-form .forgot-password a{
  color: #6f3a8c;
}

.no-account a{
  color: #6f3a8c !important;
}

#send-reset-link{
  content: "Confirmar";
  font-size: 1rem;
  flex-shrink: 0;
  background-color: #6f3a8c;
  font-weight: bold;
  font-family: 'Montserrat';
  border-radius: 20px 20px 20px 20px;
}

.page-addresses .address {
  background-color: #8AC2BF !important;
  border-radius: 20px;
  box-shadow: 6px 6px 0 #4EA39F; 
  color: #f5f5f5 !important;
  font-weight: bold;
  font-family: 'Montserrat';
}

.page-addresses .address .address-footer a{
  color: #f5f5f5 !important;
  font-weight: bold;
  font-family: 'Montserrat';
}

/* Formulario de Pago */
/* =======================================================
   HEADER REDUCIDO SOLO EN EL CHECKOUT
======================================================= */

/* Ocultar todo lo innecesario en el header del checkout */
body#checkout #header .header-nav,
body#checkout #header .menu,
body#checkout #header .search-box,
body#checkout #header .right-nav,
body#checkout #_desktop_cart,
body#checkout #_desktop_user_info,
body#checkout #_desktop_language_selector {
  display: none !important;
}

/* Ajustar el contenedor superior */
body#checkout #header .header-top {
  background-color: #ffffff !important;
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 2px solid #e1c3f0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  padding: 0 !important;
  position: relative;
  z-index: 10;
}

/* =======================================================
   MOSTRAR SOLO EL LOGO EN CHECKOUT
======================================================= */

/* === LOGO SIEMPRE VISIBLE EN CHECKOUT === */
body#checkout img[src*="logo"] {
  display: block !important;
  margin: 0 auto !important;
  opacity: 1 !important;
  width: 90px !important;
  height: auto !important;
  visibility: visible !important;
  position: relative !important;
  z-index: 1000 !important;
}

/* Asegura que el contenedor no oculte el logo */
body#checkout #header,
body#checkout #header .header-top,
body#checkout [id*="logo"],
body#checkout [class*="logo"] {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  height: 100px !important;
  background-color: #fff !important;
  border-bottom: 2px solid #e1c3f0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

/* =======================================================
   FONDO Y ESPACIADOS
======================================================= */

body#checkout {
  background-color: #d7b1e3 !important;
}

/* Evitar separación innecesaria debajo del header */
body#checkout main {
  margin-top: 40px !important;
}

/* =======================================================
   FOOTER BIEN POSICIONADO
======================================================= */

body#checkout footer,
body#checkout #footer,
body#checkout .footer-container {
  position: static !important;
  margin-top: 50px;
  background-color: #ffffff;
  border-top: 3px solid #cda8e3;
  padding: 40px 0;
  text-align: center;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
}

/* Centrar el logo en el footer */
body#checkout footer img,
body#checkout .footer-container img {
  max-width: 120px;
  height: auto;
  opacity: 0.95;
  transition: opacity 0.3s ease;
}

body#checkout footer img:hover {
  opacity: 1;
}

/* Colores de textos y enlaces */
body#checkout footer p,
body#checkout footer a {
  color: #621F72;
  font-family: 'Montserrat', sans-serif;
  font-weight: bold;
  text-decoration: none;
}

body#checkout footer a:hover {
  color: #8a3dbd;
  text-decoration: underline;
}
