.elementor-10 .elementor-element.elementor-element-b37e62f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:190px;--padding-right:190px;}.elementor-10 .elementor-element.elementor-element-b37e62f:not(.elementor-motion-effects-element-type-background), .elementor-10 .elementor-element.elementor-element-b37e62f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-10 .elementor-element.elementor-element-b37e62f > .elementor-shape-top svg, .elementor-10 .elementor-element.elementor-element-b37e62f > .e-con-inner > .elementor-shape-top svg{height:0px;}.elementor-10 .elementor-element.elementor-element-b37e62f > .elementor-shape-bottom svg, .elementor-10 .elementor-element.elementor-element-b37e62f > .e-con-inner > .elementor-shape-bottom svg{height:37px;}.elementor-10 .elementor-element.elementor-element-8823582{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-10 .elementor-element.elementor-element-a5947d9{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-10 .elementor-element.elementor-element-719c412{text-align:center;}.elementor-10 .elementor-element.elementor-element-719c412 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:48px;font-weight:700;font-style:italic;color:var( --e-global-color-accent );}.elementor-10 .elementor-element.elementor-element-37c9d570{--display:flex;--margin-top:30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:190px;--padding-right:190px;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}:root{--page-title-display:none;}@media(max-width:767px){.elementor-10 .elementor-element.elementor-element-b37e62f{--padding-top:50px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}.elementor-10 .elementor-element.elementor-element-719c412 .elementor-heading-title{font-size:32px;}.elementor-10 .elementor-element.elementor-element-37c9d570{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}}/* Start custom CSS *//* =========================================================
   MEJORA UI/UX - PÁGINA "MI CUENTA" WOOCOMMERCE
   ========================================================= */

/* 1. Estructura principal: Columnas en PC, apilado en móviles */
@media (min-width: 768px) {
    .woocommerce-account .woocommerce {
        display: flex;
        gap: 40px;
        align-items: flex-start;
    }

    /* Menú lateral izquierdo */
    .woocommerce-account .woocommerce-MyAccount-navigation {
        flex: 0 0 250px;
        width: 250px;
    }

    /* Área de contenido derecho */
    .woocommerce-account .woocommerce-MyAccount-content {
        flex: 1;
        width: 100%;
    }
}

/* 2. Diseño del Menú Lateral (Bordes y sombra) */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid #EAEAEA; /* Gris para el borde exterior */
    border-radius: 8px;
    background-color: #FFFFFF; /* Fondo Blanco */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    margin: 0;
    border-bottom: 1px solid #EAEAEA; /* Gris para la línea divisoria */
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none;
}

/* 3. Diseño de los Enlaces del Menú */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 16px 20px;
    color: #000000 !important; /* Texto Negro estándar */
    text-decoration: none !important;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.3s ease;
}

/* Efecto Hover (al pasar el ratón) */
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background-color: #EAEAEA; /* Fondo Gris tenue */
    color: #20AEE5 !important; /* Texto pasa a Azul Claro */
    padding-left: 25px; /* Pequeño desplazamiento a la derecha */
}

/* Estado Activo (Pestaña actual seleccionada) */
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
    background-color: #00448D; /* Fondo Azul Oscuro */
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    color: #FFFFFF !important; /* Texto Blanco sobre fondo oscuro */
}

/* 4. Diseño del Área de Contenido (Textos e interior) */
.woocommerce-account .woocommerce-MyAccount-content {
    background: #FFFFFF; /* Fondo Blanco */
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #EAEAEA; /* Borde Gris */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    color: #000000; /* Texto Negro para máxima legibilidad (Adiós al gris transparente) */
    line-height: 1.6;
    font-family: 'Montserrat', sans-serif;
}

/* Enlaces dentro del texto del cuadro */
.woocommerce-account .woocommerce-MyAccount-content a {
    color: #20AEE5; /* Azul claro para los enlaces (Ej: "Cerrar sesión" o "pedidos recientes") */
    font-weight: 600;
    text-decoration: none;
}

/* Hover de los enlaces dentro del texto */
.woocommerce-account .woocommerce-MyAccount-content a:hover {
    color: #00448D; /* Cambia a Azul Oscuro al pasar el ratón */
    text-decoration: underline;
}

/* Títulos y textos destacados internos */
.woocommerce-account .woocommerce-MyAccount-content h1,
.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account .woocommerce-MyAccount-content h3,
.woocommerce-account .woocommerce-MyAccount-content strong {
    color: #00448D; /* Títulos y negritas en Azul Oscuro corporativo */
}

/* 5. Ajustes para Teléfonos Móviles */
@media (max-width: 767px) {
    .woocommerce-account .woocommerce-MyAccount-navigation {
        margin-bottom: 30px;
    }
}

/* =========================================================
   MEJORA UI/UX - FORMULARIOS ACCEDER Y REGISTRARSE
   ========================================================= */

/* 1. Contenedor principal y Títulos ("Acceder" y "Registrarse") */
#customer_login {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 20px;
}

#customer_login .u-column1,
#customer_login .u-column2 {
    flex: 1;
    min-width: 300px; /* Para que baje en pantallas móviles */
    background: #FFFFFF; /* Fondo Blanco */
    padding: 35px;
    border-radius: 8px;
    border: 1px solid #EAEAEA; /* Borde Gris */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
}

#customer_login h2 {
    color: #00448D !important; /* Título en Azul Oscuro */
    font-size: 24px;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 25px;
    text-transform: none;
    font-style: normal !important; /* Quita posibles cursivas feas del tema */
}

/* 2. Textos, Labels y Párrafos */
#customer_login label,
#customer_login p {
    color: #000000 !important; /* Forzamos color Negro para solucionar el gris claro invisible */
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.6;
}

/* Asteriscos de campos obligatorios */
#customer_login .required {
    color: #00448D !important; /* Asterisco azul oscuro */
    text-decoration: none;
}

/* 3. Campos de Texto (Inputs) */
#customer_login input[type="text"],
#customer_login input[type="password"],
#customer_login input[type="email"] {
    width: 100%;
    padding: 12px 15px;
    background-color: #FFFFFF !important;
    border: 1px solid #EAEAEA !important;
    border-radius: 6px !important;
    color: #000000 !important;
    font-family: 'Montserrat', sans-serif;
    transition: all 0.3s ease;
    box-shadow: none !important;
}

/* Efecto al interactuar con los campos (Focus) */
#customer_login input[type="text"]:focus,
#customer_login input[type="password"]:focus,
#customer_login input[type="email"]:focus {
    border-color: #20AEE5 !important; /* Borde Azul Claro al seleccionar */
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(32, 174, 229, 0.15) !important;
}

/* 4. Diseño de Botones ("Acceso" y "Registrarse") */
#customer_login button.button {
    background-color: #00448D !important; /* Botón en Azul Oscuro */
    color: #FFFFFF !important;
    border: none !important;
    padding: 14px 25px !important;
    border-radius: 6px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all 0.3s ease !important;
    width: 100%; /* Botón de ancho completo */
    margin-top: 15px;
    text-transform: uppercase;
}

/* Efecto Hover en Botones */
#customer_login button.button:hover {
    background-color: #20AEE5 !important; /* Pasa a Azul Claro al pasar el ratón */
    box-shadow: 0 4px 12px rgba(32, 174, 229, 0.3);
}

/* 5. Enlaces inferiores ("¿Olvidaste la contraseña?", "Política de privacidad") */
#customer_login .lost_password a {
    color: #00448D !important; 
    font-family: 'Montserrat', sans-serif;
    font-weight: 500;
    text-decoration: none;
    display: inline-block;
    margin-top: 15px;
    transition: color 0.3s ease;
}

#customer_login .lost_password a:hover,
.woocommerce-privacy-policy-text a:hover {
    color: #20AEE5 !important;
    text-decoration: underline;
}

.woocommerce-privacy-policy-text {
    color: #000000 !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    margin-top: 15px;
}

.woocommerce-privacy-policy-text a {
    color: #00448D !important;
    font-weight: 600;
}

/* 6. Checkbox "Recuérdame" */
#customer_login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 15px;
    font-weight: 500;
}

#customer_login .woocommerce-form-login__rememberme input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}/* End custom CSS */