body.ce-kit-1{color:#2C2C2C;font-family:"Poppins", sans-serif;font-size:16px;}a, .elementor a{color:#82C495;font-family:"Inter", sans-serif;}a:hover, .elementor a:hover{color:#3E8050;}body.ce-kit-1 h1{font-family:"Inter", sans-serif;font-size:52px;font-weight:600;}body.ce-kit-1 h2{font-family:"Lexend", sans-serif;font-weight:500;}body.ce-kit-1 h3{font-family:"Lexend", sans-serif;font-weight:500;}body.ce-kit-1 h4{font-family:"Lexend", sans-serif;font-weight:500;}body.ce-kit-1 h5{font-family:"Lexend", sans-serif;font-weight:500;}body.ce-kit-1 h6{font-family:"Lexend", sans-serif;font-weight:500;}body.ce-kit-1 .ce-display-small{font-family:"Inter", sans-serif;font-size:16px;}body.ce-kit-1 .ce-display-medium{font-family:"Inter", sans-serif;font-size:24px;}body.ce-kit-1 .ce-display-large{font-family:"Inter", sans-serif;font-size:31px;}body.ce-kit-1 .ce-display-xl{font-family:"Inter", sans-serif;font-size:38px;line-height:1.4em;}body.ce-kit-1 .ce-display-xxl{font-family:"Inter", sans-serif;font-size:45px;}.elementor-button, a.elementor-button:not(#e){color:#FFFFFF;}.elementor-button{background-color:#3E8050;}.elementor-button:hover, .elementor-button:focus{background-color:#2A6038;}.elementor-button.elementor-size-sm{border-radius:999px 999px 999px 999px;}.elementor-button.elementor-size-md{font-size:16px;border-radius:999px 999px 999px 999px;}.elementor-button.elementor-size-lg{border-radius:999px 999px 999px 999px;}.elementor-button.elementor-size-xl{border-radius:999px 999px 999px 999px;}.elementor-button.elementor-size-xs{border-radius:999px 999px 999px 999px;}.elementor-button-primary .elementor-button, .elementor-button-primary a.elementor-button:not(#e){color:#FFFFFF;}.elementor-button-primary .elementor-button{background-color:#3E8050;}.elementor-button-primary .elementor-button:hover, .elementor-button-primary .elementor-button:focus, .elementor-button-primary a.elementor-button:not(#e):hover, .elementor-button-primary a.elementor-button:not(#e):focus{color:#FFFFFF;}.elementor-button-primary .elementor-button:hover, .elementor-button-primary .elementor-button:focus{background-color:#2A6038;}.elementor-button-primary .elementor-button.elementor-size-sm{border-radius:999px 999px 999px 999px;}.elementor-button-primary .elementor-button.elementor-size-md{border-radius:999px 999px 999px 999px;}.elementor-button-primary .elementor-button.elementor-size-lg{border-radius:999px 999px 999px 999px;}.elementor-button-primary .elementor-button.elementor-size-xl{border-radius:999px 999px 999px 999px;}.elementor-button-primary .elementor-button.elementor-size-xs{border-radius:999px 999px 999px 999px;}.elementor-button-secondary .elementor-button, .elementor-button-secondary a.elementor-button:not(#e){color:#3E8050;}.elementor-button-secondary .elementor-button{background-color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#3E8050;}.elementor-button-secondary .elementor-button:hover, .elementor-button-secondary .elementor-button:focus, .elementor-button-secondary a.elementor-button:not(#e):hover, .elementor-button-secondary a.elementor-button:not(#e):focus{color:#FFFFFF;}.elementor-button-secondary .elementor-button:hover, .elementor-button-secondary .elementor-button:focus{background-color:#3E8050;}.elementor-button-secondary .elementor-button.elementor-size-sm{border-radius:999px 999px 999px 999px;}.elementor-button-secondary .elementor-button.elementor-size-md{border-radius:999px 999px 999px 999px;}.elementor-button-secondary .elementor-button.elementor-size-lg{border-radius:999px 999px 999px 999px;}.elementor-button-secondary .elementor-button.elementor-size-xl{border-radius:999px 999px 999px 999px;}.elementor-button-secondary .elementor-button.elementor-size-xs{border-radius:999px 999px 999px 999px;}.btn:not(.btn-primary, .btn-secondary), a.btn:not(.btn-primary, .btn-secondary){color:#FFFFFF;}.btn:not(.btn-primary, .btn-secondary){background-color:#3E8050;border-radius:999px 999px 999px 999px;}.btn:not(.btn-primary, .btn-secondary):hover, .btn:not(.btn-primary, .btn-secondary):hover:active, .btn:not(.btn-primary, .btn-secondary):focus, a.btn:not(.btn-primary, .btn-secondary):hover, a.btn:not(.btn-primary, .btn-secondary):focus{color:#FFFFFF;}.btn:not(.btn-primary, .btn-secondary):hover, .btn:not(.btn-primary, .btn-secondary):hover:active, .btn:not(.btn-primary, .btn-secondary):focus{background-color:#2A6038;}.btn-primary{text-transform:none;background-color:#3E8050;padding:15px 30px 15px 30px;border-radius:999px 999px 999px 999px;}.btn-primary, a.btn-primary{color:#FFFFFF;}.btn-primary:hover, .btn-primary:hover:active, .btn-primary:focus, a.btn-primary:hover, a.btn-primary:focus{color:#FFFFFF;}.btn-primary:hover, .btn-primary:hover:active, .btn-primary:focus{background-color:#2A6038;}.btn-secondary{text-transform:none;background-color:#3E8050;border-radius:999px 999px 999px 999px;}.btn-secondary, a.btn-secondary{color:#FFFFFF;}.btn-secondary:hover, .btn-secondary:hover:active, .btn-secondary:focus, a.btn-secondary:hover, a.btn-secondary:focus{color:#FFFFFF;}.btn-secondary:hover, .btn-secondary:hover:active, .btn-secondary:focus{background-color:#2A6038;}.elementor-view-stacked .elementor-icon{background-color:#FFFFFF;}.elementor-view-framed .elementor-icon, .elementor-view-default .elementor-icon{color:#FFFFFF;}body.ce-kit-1 img{filter:brightness(100%) contrast(100%) saturate(100%) blur(0px) hue-rotate(0deg);}body.ce-kit-1 label{font-family:"DM Sans", sans-serif;font-weight:500;}body.ce-kit-1 .form-control, body.ce-kit-1 .elementor-field-textual{background-color:#F8F8F8;border-style:solid;border-width:0px 0px 0px 0px;border-radius:3px 3px 3px 3px;padding:17px 17px 17px 17px;}body.ce-kit-1 .form-control:focus, body.ce-kit-1 .elementor-field-textual:focus{background-color:#F8F8F8;box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.1) inset;outline-style:solid;border-style:solid;border-width:0px 0px 0px 0px;border-color:rgba(0, 0, 0, 0);}select.form-control:not([size]):not([multiple]){height:auto;}body.ce-kit-1 .container{width:1600px;max-width:100%;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1600px;}@media(max-width:1024px){body.ce-kit-1 .ce-display-xl{font-size:30px;}body.ce-kit-1 .ce-display-xxl{font-size:38px;}}/* Start custom CSS for page-settings */:root {
    --color-primary-50: #EDF2FF;
    --color-primary-100: #DFE5FF;
    --color-primary-200: #C5D0FF;
    --color-primary-300: #A2B0FF;
    --color-primary-400: #7D87FC;
    --color-primary-500: #5F5FF5;
    /* Brand color */
    --color-primary-600: #564AEB;
    --color-primary-700: #4233CF;
    --color-primary-800: #362CA7;
    --color-primary-900: #312B84;
    --color-primary-950: #1E194D;

    /* -------------------------------
        Neutral
    --------------------------------*/
    --color-neutral-50: #F8F8FA;
    --color-neutral-100: #F2F1F6;
    --color-neutral-200: #E7E6EE;
    --color-neutral-300: #CDCBDB;
    --color-neutral-400: #BBB8CD;
    --color-neutral-500: #A19AB8;
    --color-neutral-600: #8C82A5;
    --color-neutral-700: #7A7091;
    --color-neutral-800: #665D7A;
    --color-neutral-900: #554D65;
    --color-neutral-950: #373243;

    /* -------------------------------
        Success
    --------------------------------*/
    --color-success-400: #E6F9F0;
    --color-success-500: #64E1AC;
    --color-success-600: #17B072;
    --color-success-700: #0A6B48;
    --color-success-800: #073F2A;

    /* -------------------------------
        Warning
    --------------------------------*/
    --color-warning-400: #E8E5D3;
    --color-warning-500: #E6BD3B;
    --color-warning-600: #DC8807;
    --color-warning-700: #993E04;
    --color-warning-800: #5F1F08;

    /* -------------------------------
        Error
    --------------------------------*/
    --color-error-400: #D3C8C7;
    --color-error-500: #D27E80;
    --color-error-600: #C1222C;
    --color-error-700: #8F020D;
    --color-error-800: #5C090D;

    /* -------------------------------
        Shades
    --------------------------------*/
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-btn-secondary: #665D7A;
    
    /* -------------------------------
        Border Radius
    --------------------------------*/
      --radius-s: 4px;     /* Tags, contadores pequeños */
      --radius-m: 8px;     /* Botones, inputs */
      --radius-l: 16px;    /* Cards, modals, banners */
      --radius-full: 999px; /* Avatares, botones circulares */
    
    /* -------------------------------
        Border Width
    --------------------------------*/
  --border-width-1: 1px; /* Default para la mayoría */
  --border-width-2: 2px; /* Estado de focus */

    /* -------------------------------
        Border Colors
        (usa valores de la paleta)
    --------------------------------*/
    --color-border-default: var(--color-neutral-200);
    --color-border-subtle: var(--color-neutral-100);
    --color-border-interactive: var(--color-primary-600);
    --color-border-error: var(--color-error-500);
    --color-border-success: var(--color-success-500);

    /* -------------------------------
        Spacing System
    --------------------------------*/
  --space-xxs: 4px;   /* Icono con texto, elementos muy pequeños */
  --space-xs: 8px;    /* Texto con etiqueta, botones pequeños */
  --space-s: 12px;    /* Padding en botones grandes (L), componentes medios */
  --space-m: 16px;    /* Padding botones medianos (M), listas, cards */
  --space-l: 24px;    /* Padding botones grandes (L), grids de productos */
  --space-xl: 32px;   /* Secciones pequeñas */
  --space-xxl: 48px;  /* Secciones grandes */
  --space-xxxl: 64px; /* Hero, secciones principales */
}
body {
    background-color: var(--color-white) !important;
}


.show-in-column{
    display: flex;
    flex-direction: column;
}
.show-in-row{
    display: flex;
    flex-direction: row;
}
.border-card {
    border-radius: var(--radius-l);
    border: solid var(--border-width-1) var(--color-neutral-200);
}

.custom_card, #dataFormDatafast .wpwl-form-card {
    background-color: var(--color-neutral-50);
    border-radius: var(--radius-l);
    box-shadow: none;
}

.slider_button{
    background-color: var(--color-primary-100);
    border-radius: var(--radius-full);
    color: var(--color-primary-600);
    border: none;
    display: flex;
    justify-content: center;
    align-items: center;
}
.slider_button:hover {
    background-color: var(--color-primary-200);
    color: var(--color-primary-700);
    cursor:pointer;
}

/* -------------------------------
        Datafast
    --------------------------------*/

#dataFormDatafast .wpwl-form-card{
    border: 0px;
    padding: 34px 24px;
    margin: 0 0 24px 0;
    box-sizing: content-box;
    max-width: 100%;
}

#dataFormDatafast .wpwl-wrapper{
    width: 100%;
}


.custom-input, #dataFormDatafast .wpwl-control,
#dataFormDatafast select {
    border-radius: var(--radius-m);
    background: var(--color-white);
    border: 0px;
    appearance: none;
    height: 3rem;
    padding: 0 1rem;
    width: 100%;
}
#dataFormDatafast .wpwl-group{
    display: flex;
    flex-wrap: wrap;
}
#dataFormDatafast .wpwl-label-brand{
    min-width: 100%;
}
#dataFormDatafast .wpwl-label {
    width: 100%
}

#dataFormDatafast .wpwl-wrapper-submit{
    min-width: 100%;
    display: flex;
    flex-direction: column;
}
#dataFormDatafast .wpwl-group{
    margin-bottom: 25px;
}
#dataFormDatafast .wpwl-wrapper-brand{
    width: 64%;
    min-width: 50%;
}
#dataFormDatafast .wpwl-brand-card{
    width: 33.33%;
}
#dataFormDatafast .datafast-footer-logos {
    display: flex;
    gap: 10px;
    align-items: start;
    margin-top: 52px;
    flex-wrap: wrap;
    border-top: solid var(--border-width-1) var(--color-neutral-200);
    padding-top: 12px;
}

#dataFormDatafast .datafast-footer-logos .logo-box {
    width: 60px;
    min-width: 15%;
    max-height: 40px;
    display: flex;
    align-content: center;
    justify-content: center;
    margin: 2%;
}
#dataFormDatafast .datafast-footer-logos .logo-box img {
  max-width: 100%; max-height: 100%; object-fit: contain;
}

#dataFormDatafast .datafast-footer-logos .custom_card{
    min-width: 30%;
    min-height: 46px;
    background-color: var(--color-white);
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
}

#dataFormDatafast .datafast-footer-logos .images{
    display: flex;
    width: 100%;
    justify-content: space-between;
}
#dataFormDatafast div.images.show-in-row > div:nth-child(1){
    max-width: 30%;
}
#dataFormDatafast div.images.show-in-row > div:nth-child(2){
    width: 66%;
}

#dataFormDatafast div.images.show-in-row > div:nth-child(1) > div{
    width: 100%;
}

/* -------------------------------
        Checkout
    --------------------------------*/
body#checkout main{
    background: var(--color-neutral-50);
}
body#checkout #wrapper {
    margin-top: 5%;
    background: transparent;
}
body#checkout .cart-grid-right .card{
    border-radius: var(--radius-l);
}
/*Encabezado de cada seccion*/
body#checkout section.checkout-step .step-title{
    color: var(--color-primary-950);
}
body#checkout section.checkout-step span.step-number{
    background: var(--color-success-500);
    border: none;
}
/*Navs*/
body#checkout .nav-item .nav-link.active{
    color: var(--color-neutral-950);
}
body#checkout .nav-item .nav-link{
    color: var(--color-neutral-700);
    font-weight: 400;
}
/*Forms*/
body#checkout .checkout-step .form-group.row {
    display: flex;
    flex-direction: column;
}
body#checkout .checkout-step .form-group.row .form-control{
  background: var(--color-white);
  border-radius: var(--radius-m);
}

body#checkout .checkout-step .form-group.row .form-control:not(#field-password){
  margin: 6px 0 10px 0;
}
body#checkout .checkout-step .form-group.row .form-control-label{
    font-size: 16px;
    font-weight: 500;
    color: var(--color-primary-950);
}
body#checkout .checkout-step .form-group.row .form-control-comment{
    font-size: 12px;
    font-weight: 400;
    color: var(--color-neutral-700);
}

body#checkout .checkout-step .form-informations{
    color: var(--color-neutral-700);
}
body#checkout .checkout-step .form-group.row .custom-checkbox span{
    background: var(--color-white);
    border: none;
}
body#checkout .checkout-step .form-group.row .custom-checkbox label{
    font-size: 14px;
    font-weight: 400;
    padding-left: 28px;
}
body#checkout section.checkout-step form .form-footer{
    text-align: start;
}
body#checkout section.checkout-step form .form-footer .btn-primary{
    border-radius: var(--radius-full);
}

/*Lateral card Checkout*/
body#checkout #js-checkout-summary a, body#checkout #js-checkout-summary .block-promo .promo-name .cart-summary-line span,body#checkout #js-checkout-summary a:focus{
    color: var(--color-neutral-950);
    text-decoration: none;
}
body#checkout #js-checkout-summary a:hover, body#checkout #js-checkout-summary .block-promo .promo-name .cart-summary-line span:hover{
    color: var(--color-primary-600);
}

body#checkout section.checkout-step article.address-item.selected{
    border: var(--color-primary-600) 1px solid;
}
body#checkout section.checkout-step article.address-item{
    background: var(--color-white);
    border-radius: var(--radius-l);
}

/*--------------------------------
    LoginForm
--------------------------------*/
body#authentication {
    background: var(--color-white);
}
body#authentication #wrapper{
    background: transparent;
}
body#authentication #wrapper div#content{
    background: var(--color-neutral-50);
    color: var(--color-primary-950);    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: var(--radius-l);
    max-width: 450px;
    padding: var(--space-xl);
}
form#login-form{
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    margin-top: 24px;
    max-width: 450px
}
form#login-form .form-group.row {
    display: flex;
    flex-direction: column;
}
form#login-form .form-group.row .form-control{
  background: var(--color-white);
  border-radius: var(--radius-m);
  border: none;
}

form#login-form .custom_login_form_fields{
    display: flex;
    flex-direction: column;
    
}

form#login-form .form-group.row div{
    width: 100%;
}
form#login-form .form-group.row label{
    width: 100%;
    text-align: start;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-primary-950);
}
body#authentication h1.login-form-title{
    text-align: center;
    
}

form#login-form .btn.btn-primary{
    border-radius: var(--radius-full);
    width: 100%;
}
form#login-form footer.form-footer{
    width: 100%;
}
form#login-form .forgot-password,body#checkout section.checkout-step form#login-form .forgot-password{
    text-align: center;
    margin-bottom: 1rem;
    margin-left: 0px;
}
/*Eye ojo password*/
.form-group.row .password span{
    position: absolute;
    height: 100%;
    right: 10px;
    z-index: 3;
}

.form-group.row .password span .toggle-password {
  background: transparent;
  border: none;
  padding: 0 8px;
  cursor: pointer;
}

.form-group.row .password span .toggle-password svg {
  opacity: 0.6;
  transition: opacity 0.2s;
}

.form-group.row .password span .toggle-password:hover svg {
  opacity: 1;
}

/*Cart page*/
body#cart #wrapper{
    background: var(--color-white);
}
body#cart .card.cart-container .cart-overview .cart-item .product-line-grid{
    display: flex;
    align-items: center;
}
body#cart .card.cart-container .cart-overview .cart-item .product-description-quantity{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

body#cart .card.cart-container .cart-overview .cart-item.header-car-items .col-md-1{
    padding-left: 0px; 
}

body#cart .card.cart-container .cart-overview{
    border: var(--border-width-1) solid var(--color-neutral-200);
    border-radius: var(--radius-l);
}

body#cart .card.cart-container{
    background: transparent;
}
body#cart .card.cart-container .cart-overview hr.product-separator:last-child{
    display: none;
}

body#cart .card.cart-container .cart-overview .cart-item .product-line-grid .input-group{
    display: flex;
    border-radius: var(--radius-m);
    border: var(--border-width-1) solid var(--color-neutral-100);
}
body#cart .card.cart-container .cart-overview .cart-item .product-line-grid .input-group button.btn, body#cart .card.cart-container .cart-overview .cart-item .product-line-grid .input-group input.form-control{
    background: transparent;
    color: var(--color-neutral-800);
    border:none;
}

body#cart .card.cart-container .cart-overview .cart-item .product-line-grid .cart-line-product-actions .remove-from-cart i{
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    width: 36px;
    height: 36px;
    color: var(--color-primary-950);
    border: var(--border-width-1) solid var(--color-neutral-200);
}
body#cart .card.cart-container .cart-overview .cart-item .product-line-grid .discount.discount-percentage{
    border-radius: var(--radius-full);
}
body#cart .cart-grid-body .continue-shopping a.label{
    color:var(--color-primary-600);
}
/*Cart summary*/
body#cart .cart-grid-right .card.cart-summary{
    background: var(--color-neutral-50);
    padding: 54px 32px;
    border-radius: var(--radius-l);
}

body#cart .cart-grid-right .card.cart-summary .summary-title{
    color: var(--color-primary-950);
    font-size: 14px;
    font-weight: 500;
}

body#cart .cart-grid-right .card.cart-summary .btn.btn-primary{
    padding: var(--space-xs);
    border-radius: var(--radius-full);
}

@media(max-width:768px){
    body#cart .card.cart-container .cart-overview .cart-item.header-car-items{
        display: none;
    }
}

/*--------------------------------
    Megamenu wrap name
--------------------------------*/

#header .ce-user-menu .menu-item a.elementor-item.has-submenu span:before {
    content: "Hola, ";
}

#header #custom-user-name nav.ce-user-menu ul li.menu-item a span{
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
}


/*--------------------------------
    Blog
--------------------------------*/
body#ybc_blog_page #wrapper{
    background: var(--color-neutral-50);
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block{
    background: var(--color-white);
    box-shadow: none;
    border-radius: var(--radius-l);
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_rss.ybc_blog_ltr_mode{
    background: var(--color-primary-200);
    height: 75px;
    padding: 0px;
    display:flex;
    align-items: center;
    justify-content: center;
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_rss.ybc_blog_ltr_mode h4{
    color: var(--color-primary-600);
    margin:0px;
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_rss.ybc_blog_ltr_mode h4 a i{
    background: transparent;
    color: var(--color-primary-600);
    
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_rss.ybc_blog_ltr_mode h4 a{
    display: flex;
    align-items: center;
    color: var(--color-primary-600);
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_rss.ybc_blog_ltr_mode h4.title_blog.title_block{
    background: var(--color-primary-200);
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block.ybc_block_search form input{
    border-radius: var(--radius-l);
    color: var(--color-neutral-700);
}

body#ybc_blog_page #left-column .ybc_blog_sidebar .block a{
    border-radius: var(--radius-l);
}
body#ybc_blog_page #left-column .ybc_blog_sidebar .block a.read_more{
    border-radius: 0px;
}
body#ybc_blog_page #content-wrapper .ybc_blog_layout_list.ybc-blog-wrapper{
    background: transparent;
}

body#ybc_blog_page #content-wrapper .ybc_blog_layout_list.ybc-blog-wrapper .bybc-blog-slider #ybc_slider, body#ybc_blog_page #content-wrapper .ybc_blog_layout_list.ybc-blog-wrapper .bybc-blog-slider #ybc_slider img{
    border-radius: var(--radius-l);
}

body#ybc_blog_page #content-wrapper .ybc_blog_layout_list.ybc-blog-wrapper .bybc-blog-slider #ybc_slider .nivo-caption{
    border-radius: var(--radius-l);
    margin: var(--space-s);
    width: auto;
}

body#ybc_blog_page #content-wrapper .ybc-blog-list .post-wrapper .ybc_item_img img{
    border-radius: var(--radius-l);
}

/* ===================================================================
   ESTILOS PERSONALIZADOS PARA MODAL DE WISHLIST (LISTA DE DESEOS)
   =================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@600&display=swap');

.wishlist-modal .modal-title,
.modal-dialog .modal-header .modal-title,
h5.modal-title {
    font-family: 'Inter', sans-serif !important;
    font-size: 26px !important;
    font-weight: 600 !important;
    color: #1E194D !important;
    line-height: 1.3 !important;
    letter-spacing: -0.3px !important;
}

a.wishlist-add-to-new.text-primary,
a.wishlist-add-to-new.text-primary .material-icons {
    color: #6C5CE7 !important;
}

.wishlist-list-item {
    padding: 12px 16px !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
    background-color: transparent !important;
}

.wishlist-list .wishlist-list-item:hover,
ul.wishlist-list li.wishlist-list-item:hover {
    background-color: #EDF2FF !important;
}

.wishlist-list-item p,
.wishlist-list-item a {
    background-color: transparent !important;
}

.wishlist-modal .modal-content,
.modal-dialog.modal-dialog-centered .modal-content {
    border-radius: 16px !important;
    border: 1px solid #E7E6EE !important;
}

.wishlist-modal .modal-header,
.modal-dialog.modal-dialog-centered .modal-header {
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom: 1px solid #F8F8F !important;
}

.wishlist-modal .modal-body,
.modal-dialog.modal-dialog-centered .modal-body {
    border: none !important;
}

.wishlist-modal .modal-footer,
.modal-dialog.modal-dialog-centered .modal-footer {
    border-bottom-left-radius: 16px !important;
    border-bottom-right-radius: 16px !important;
    border-top: 1px solid #F8F8F !important;
}

.wishlist-create .modal-title,
.wishlist-modal .modal-title {
    font-family: 'Inter', sans-serif !important;
    font-size: 26px !important;
    font-weight: 600 !important;
    letter-spacing: -0.3px !important;
    color: #1E194D !important;
}

.wishlist-create input[type="text"],
.wishlist-create .form-control,
input[placeholder="Añadir nombre"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid #F2F1F6 !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    background-color: #FFFFFF !important;
    transition: border-color 0.2s ease !important;
}

.wishlist-create input[type="text"]:focus,
.wishlist-create .form-control:focus,
input[placeholder="Añadir nombre"]:focus {
    outline: none !important;
    border-color: #564AEB !important;
}

.wishlist-create .modal-footer {
    display: flex !important;
    gap: 12px !important;
    padding: 16px 24px !important;
    border-top: none !important;
}

.wishlist-create .modal-footer .modal-cancel,
.wishlist-create .modal-footer button[data-dismiss="modal"]:not(.close),


.wishlist-create .modal-footer .modal-cancel:hover,
.wishlist-create .modal-footer button[data-dismiss="modal"]:not(.close):hover,
.modal-footer button.modal-cancel.btn.btn-secondary:hover {
    background-color: rgba(86, 74, 235, 0.05) !important;
}

.wishlist-create .modal-footer .btn-primary,
.wishlist-create .modal-footer button[type="submit"],
.modal-footer button.btn.btn-primary {
    background-color: #564AEB !important;
    color: #FFFFFF !important;
    border: 1px solid #564AEB !important;
    border-radius: 50px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 24px !important;
    transition: all 0.2s ease !important;
}

.wishlist-create .modal-footer .btn-primary:hover,
.wishlist-create .modal-footer button[type="submit"]:hover,
.modal-footer button.btn.btn-primary:hover {
    background-color: #4839D6 !important;
    border-color: #4839D6 !important;
}

.wishlist-create .modal-content {
    border-radius: 16px !important;
    border: 1px solid #E7E6EE !important;
}

.wishlist-create label,
.wishlist-create .modal-body label {
    font-size: 14px !important;
    color: #1E194D !important;
    font-weight: 500 !important;
    margin-bottom: 8px !important;
}

/*
 * ESTILOS PARA LOS ENLACES DE LA PÁGINA "MI CUENTA"
 */

.page-my-account .links a.link-item,
.page-my-account .links a,
.page-my-account a.link-item,
a.link-item,
.links a.link-item {
    border-radius: 16px !important;
    padding: 20px 15px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    min-height: 150px !important;
    margin-bottom: 10px !important;
}

.page-my-account .links .link-item,
.page-my-account .links > * {
    border-radius: 16px !important;
    padding: 20px 15px !important;
    margin-bottom: 10px !important;
}

.page-my-account .links .link-item > *:first-child,
.links .link-item > *:first-child {
    background-color: #564AEB !important;
    color: white !important;
    fill: white !important;
    border-radius: 50% !important;
    background-image: none !important;
    width: 60px !important;
    height: 60px !important;
    min-width: 60px !important;
    min-height: 60px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 28px !important;
    line-height: 1 !important;
    margin-bottom: 20px !important;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0;
    flex-shrink: 0;
    flex-grow: 0;
    padding: 0 !important;
    text-align: center;
    position: relative;
    z-index: 1;
}

.page-my-account .links .link-item:hover > *:first-child,
.links .link-item:hover > *:first-child {
    background-color: #4233CF !important;
}

.page-my-account .links {
    overflow: visible !important;
}

.page-my-account .links .link-item > *:first-child svg,
.links .link-item > *:first-child svg {
    width: 28px !important;
    height: 28px !important;
    fill: white !important;
}

.page-my-account .links .link-item svg path,
.links .link-item svg path {
    fill: white !important;
}

.page-my-account .links .link-item span:not(.material-icons):not(:first-child),
.links .link-item span:not(.material-icons):not(:first-child),
.page-my-account .links .link-item .link-item,
.links a span {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    color: #554D65 !important;
    text-align: center !important;
    width: 100% !important;
    text-transform: none !important;
    line-height: 1.3 !important;
    margin-top: 0 !important;
}

.page-my-account .links a.link-item,
.links a.link-item {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    color: #554D65 !important;
    text-transform: none !important;
}

.page-header h1 {
    font-family: 'Inter', sans-serif !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #1E194D !important;
    line-height: 1.2 !important;
    margin-bottom: 24px !important;
    text-transform: none !important;
}

.page-header h1::first-letter {
    text-transform: none !important;
}

/* ===================================================================
   ESTILOS PARA TÍTULO "PRODUCTOS VISTOS"
   =================================================================== */

h4[class*="ets_crosssell_title"],
.ets_crosssell_list_blocks .ets_crosssell_title,
.block h4.ets_crosssell_title {
    font-family: 'Inter', sans-serif !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #1E194D !important;
    line-height: 1.2 !important;
    margin-bottom: 70px !important;
    margin-top: 24px !important;
    text-transform: none !important;
    position: relative !important;
    padding-top: 24px !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

@media screen and (max-width: 1024px) and (min-width: 769px) {
    h4[class*="ets_crosssell_title"],
    .ets_crosssell_list_blocks .ets_crosssell_title,
    .block h4.ets_crosssell_title {
        font-size: 32px !important;
    }
}

@media screen and (max-width: 768px) {
    h4[class*="ets_crosssell_title"],
    .ets_crosssell_list_blocks .ets_crosssell_title,
    .block h4.ets_crosssell_title {
        font-size: 28px !important;
        margin-bottom: 24px !important;
        padding-top: 20px !important;
    }
}

h4[class*="ets_crosssell_title"]::before,
.ets_crosssell_list_blocks .ets_crosssell_title::before,
.block h4.ets_crosssell_title::before {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: 1px !important;
    background: #E0E0E0 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

h4[class*="ets_crosssell_title"]::after,
.ets_crosssell_list_blocks .ets_crosssell_title::after,
.block h4.ets_crosssell_title::after {
    display: none !important;
}

/* ===================================================================
   OCULTAR SOLO TABS DE CATEGORÍAS
   =================================================================== */

ul.ets_cs_sub_categories.index {
    display: none !important;
}

.ets_crosssell_list_blocks > ul.ets_cs_sub_categories {
    display: none !important;
}

.tab_content.ets_crosssell_has_sub {
    display: block !important;
}

.featured-products.product_list {
    display: block !important;
}

/* ===================================================================
   GAP ENTRE CARDS Y MÁRGENES DEL MÓDULO EN MOBILE
   =================================================================== */

@media screen and (max-width: 768px) {
    .ets_crosssell_list_blocks,
    .block.ets_crosssell_list_blocks,
    #ets_crosssell_list_blocks {
        padding-left: 16px !important;
        padding-right: 16px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .ets_crosssell_list_blocks .ets_crosssell_title,
    h4[class*="ets_crosssell_title"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .ets_crosssell_list_blocks .tab_content,
    .ets_crosssell_list_blocks .slick-slider {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .slick-slider .slick-list,
    .ets_crosssell_list_blocks .slick-slider .slick-list,
    .tab_content .slick-slider .slick-list {
        margin-left: -4px !important;
        margin-right: -4px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .slick-slider .slick-track,
    .ets_crosssell_list_blocks .slick-slider .slick-track,
    .tab_content .slick-slider .slick-track {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .slick-slider .slick-slide,
    .ets_crosssell_list_blocks .slick-slider .slick-slide,
    .tab_content .slick-slider .slick-slide {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
    
    .slick-slider .slick-slide > div,
    .ets_crosssell_list_blocks .slick-slider .slick-slide > div,
    .tab_content .slick-slider .slick-slide > div {
        margin: 0 !important;
    }
    
    .product_list.grid {
        gap: 8px !important;
        grid-gap: 8px !important;
    }
}

/*--------------------------------
    Installments
--------------------------------*/
.installments-best-only {
    color: var(--color-primary-950);
    font-weight: 500;
    border-left: var(--border-width-2) solid var(--color-primary-500);
    background: var(--color-primary-50);
    padding: 0.75rem 0.5rem;
}

.installments-best-only h4{
    color: var(--color-primary-500);
    font-size: 0.875rem;
}

.installments-best-only span,.installments-best-only p{
    margin-bottom: 0px;
    font-size: 0.75rem;
}

#installments-container.installments-block {
    display: flex;
    flex-direction: column;
    padding: 1.2rem;
    margin: 1.5rem 0;
    background: var(--color-neutral-50);
    border-radius: var(--radius-l);
}

#installments-container .installments-body {
    display: flex;
    flex-direction: column;
}

#installments-container .installments-body__label {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 0.4rem;
    font-size: 0.95rem;
    font-weight: 500;
}
#installments-container .installments-body__label h5 {
    color: var(--color-neutral-700);
    font-weight: 600;
    font-size: 0.875rem;
}

#installments-container .installments-body__label p{
    color: var(--color-neutral-600);
    font-weight: 400;
    font-size: 0.75rem;
    
}

#installments-container .installments-body__select {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: var(--border-width-1) solid var(--color-neutral-200);
    border-radius: var(--radius-s);
    background: var(--color-white);
    font-size: 0.75rem;
}

#installments-container .see-more-installments {
    margin-top: 1.2rem;
}

#installments-container .see-more-installments a.installments-modal__trigger{
    color:var(--color-primary-800);
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.75rem;
}

#installments-container .see-more-installments a.installments-modal__trigger:hover {
    color: var(--color-primary-900);
}

.installments-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.installments-modal.is-open {
    display: flex;
}

.installments-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
}

.installments-modal__dialog {
    position: relative;
    background: #fff;
    padding: 1.5rem;
    border-radius: 6px;
    max-width: 520px;
    width: 90%;
    z-index: 1001;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
}

.installments-modal__close {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    border: none;
    background: transparent;
    font-size: 1.5rem;
    cursor: pointer;
}

.installments-modal__title {
    margin-top: 0;
    margin-bottom: 1rem;
    font-size: 1.2rem;
    font-weight: 600;
}

.installments-modal__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
}

.installments-modal__table th,
.installments-modal__table td {
    padding: 0.5rem;
    text-align: left;
    border-bottom: var(--border-width-1) solid var(--color-neutral-200);
}

.installments-modal__table th {
    background: var(--color-primary-100);
    font-weight: 600;
}

@media (max-width: 575px) {
    .installments-block {
        padding: 1rem;
    }
}

/* Ocultar flechas nativas SOLO dentro de tu wrapper personalizado */
.custom-carousel-wrapper .elementor-swiper-button,
.custom-carousel-wrapper .swiper-button-prev,
.custom-carousel-wrapper .swiper-button-next {
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}


h1#product-list-header {
  font-size: 32px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

@media (max-width: 768px) {
  h1#product-list-header {
    font-size: 28px !important;
  }
}




.modal-footer button.modal-cancel.btn.btn-secondary:hover {
    background-color: #2A6038 !important;
}


.modal-footer a.btn.btn-primary:hover {
    background-color: #2A6038 !important;
}


span.price {
  color: #3E8050 !important;
}

a.label {
  color: #82C495 !important;
}

h4[class*="ets_crosssell_title"],
.ets_crosssell_list_blocks .ets_crosssell_title,
.block h4.ets_crosssell_title {
  font-size: 32px !important;
  color: #2E3A2C !important;
  font-weight: 600 !important;
}

/* Mi cuenta — iconos color Farmagro */
.page-my-account .links .link-item > *:first-child,
.links .link-item > *:first-child {
    background-color: #3E8050 !important;
}

.page-my-account .links .link-item:hover > *:first-child,
.links .link-item:hover > *:first-child {
    background-color: #1C4A2A !important;
}



/* Checkout — contorno en inputs */
body#checkout .checkout-step .form-group.row .form-control {
    border: var(--border-width-1) solid var(--color-border-default) !important;
}

body#checkout .checkout-step .form-group.row .form-control:focus {
    border-color: var(--color-border-interactive) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(86, 74, 235, 0.10) !important;
}





/* Checkout — fix checkbox use_same_address */
body#checkout .form-group.row:has(#use_same_address) {
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    background: var(--color-neutral-50) !important;
    border: var(--border-width-1) solid var(--color-border-default) !important;
    border-radius: var(--radius-m) !important;
    padding: 12px 16px !important;
    margin-top: 8px !important;
}

body#checkout .form-group.row:has(#use_same_address) .col-md-9.col-md-offset-3 {
    margin-left: 0 !important;
    width: 100% !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: transparent !important;
    border: none !important;
}

body#checkout .form-group.row:has(#use_same_address) label {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--color-primary-950) !important;
    margin: 0 !important;
    padding-left: 0 !important;
}


body#checkout #use_same_address {
    accent-color: #3E8050 !important;
    width: 16px !important;
    height: 16px !important;
    cursor: pointer !important;
}


/* Checkout — botón Continuar hover/active */
body#checkout .form-footer .btn-primary.continue,
body#checkout .form-footer button.btn-primary {
    background-color: #3E8050 !important;
    border-color: #3E8050 !important;
}

body#checkout .form-footer .btn-primary.continue:hover,
body#checkout .form-footer button.btn-primary:hover {
    background-color: #2A6038 !important;
    border-color: #2A6038 !important;
}

body#checkout .form-footer .btn-primary.continue:active,
body#checkout .form-footer .btn-primary.continue:focus,
body#checkout .form-footer button.btn-primary:active,
body#checkout .form-footer button.btn-primary:focus {
    background-color: #1C4A2A !important;
    border-color: #1C4A2A !important;
    box-shadow: 0 0 0 3px rgba(62, 128, 80, 0.25) !important;
    outline: none !important;
}




body#checkout .checkout-step .form-group.row .custom-checkbox input[type="checkbox"] + span {
    border: 1px solid #979797 !important;
}



#checkout-guest-form .col-md-6.js-input-column,
#checkout-login-form .col-md-6.js-input-column {
    width: 100% !important;
    float: none !important;
}



a.wishlist-add-to-new.text-primary {
  color: #0F4D38 !important;
}
a.wishlist-add-to-new.text-primary:hover {
  color: #8CCB1F !important;
}

a.wishlist-add-to-new.text-primary {
  color: #0F4D38 !important;
}
a.wishlist-add-to-new.text-primary:hover {
  color: #8CCB1F !important;
}
a.wishlist-add-to-new.text-primary i.material-icons {
  color: #0F4D38 !important;
}
a.wishlist-add-to-new.text-primary:hover i.material-icons {
  color: #8CCB1F !important;
}



/* =========================================================
   COMERCIAL VACA · CREATIVE SLIDER
   Navegación personalizada
   Slider ID 3
   ========================================================= */


/* ---------------------------------------------------------
   RESET + BOTÓN
   --------------------------------------------------------- */

#layerslider_3 .ls-nav-prev,
#layerslider_3 .ls-nav-next {
    position: absolute !important;

    top: 50% !important;

    width: 46px !important;
    height: 46px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: #FFFFFF !important;
    background-image: none !important;
    background-position: initial !important;

    box-shadow: 0 5px 18px rgba(9, 19, 72, 0.14) !important;

    opacity: 1 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    transform: translateY(-50%) !important;

    z-index: 100 !important;

    box-sizing: border-box !important;

    overflow: visible !important;

    transition:
        background-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease !important;
}


/* ---------------------------------------------------------
   POSICIÓN LATERAL
   --------------------------------------------------------- */

#layerslider_3 .ls-nav-prev {
    left: 24px !important;
    right: auto !important;
}

#layerslider_3 .ls-nav-next {
    right: 24px !important;
    left: auto !important;
}


/* ---------------------------------------------------------
   ELIMINAR PSEUDO-ELEMENTOS DEL SKIN
   --------------------------------------------------------- */

#layerslider_3 .ls-nav-prev::after,
#layerslider_3 .ls-nav-next::after {
    content: none !important;
}


/* ---------------------------------------------------------
   NUESTRA FLECHA
   --------------------------------------------------------- */

#layerslider_3 .ls-nav-prev::before,
#layerslider_3 .ls-nav-next::before {
    content: "" !important;

    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    width: 9px !important;
    height: 9px !important;

    margin: 0 !important;

    border-top: 2px solid #1C39ED !important;
    border-right: 2px solid #1C39ED !important;
    border-bottom: 0 !important;
    border-left: 0 !important;

    background: transparent !important;

    box-sizing: border-box !important;

    transform-origin: center !important;

    pointer-events: none !important;
}


/* Izquierda */
#layerslider_3 .ls-nav-prev::before {
    transform:
        translate(-38%, -50%)
        rotate(-135deg) !important;
}


/* Derecha */
#layerslider_3 .ls-nav-next::before {
    transform:
        translate(-62%, -50%)
        rotate(45deg) !important;
}


/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

#layerslider_3 .ls-nav-prev:hover,
#layerslider_3 .ls-nav-next:hover {
    background: #1C39ED !important;

    box-shadow:
        0 7px 22px rgba(28, 57, 237, 0.22) !important;
}


/* Evitamos que el translateY se pierda en hover */
#layerslider_3 .ls-nav-prev:hover,
#layerslider_3 .ls-nav-next:hover {
    transform:
        translateY(-50%)
        scale(1.05) !important;
}


#layerslider_3 .ls-nav-prev:hover::before,
#layerslider_3 .ls-nav-next:hover::before {
    border-color: #FFFFFF !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    #layerslider_3 .ls-nav-prev,
    #layerslider_3 .ls-nav-next {
        width: 38px !important;
        height: 38px !important;
    }

    #layerslider_3 .ls-nav-prev {
        left: 12px !important;
    }

    #layerslider_3 .ls-nav-next {
        right: 12px !important;
    }

    #layerslider_3 .ls-nav-prev::before,
    #layerslider_3 .ls-nav-next::before {
        width: 8px !important;
        height: 8px !important;

        border-top-width: 2px !important;
        border-right-width: 2px !important;
    }
}





/* ==========================================================
   COMERCIAL VACA · CART PAGE
   PrestaShop
   ========================================================== */

body#cart {
    --cv-blue: #1C39ED;
    --cv-blue-hover: #1834D9;
    --cv-blue-dark: #0A1547;

    --cv-text: #151A22;
    --cv-text-secondary: #5D6470;
    --cv-muted: #8A94A6;

    --cv-bg-soft: #F7F8FC;
    --cv-bg-hover: #F2F4FF;

    --cv-border: #E1E5EE;
    --cv-border-strong: #D5DBE7;

    --cv-white: #FFFFFF;
}


/* ==========================================================
   1. PAGE
   ========================================================== */

body#cart,
body#cart #wrapper {
    background: #FFFFFF !important;
}

body#cart #wrapper {
    padding-top: 42px;
    padding-bottom: 64px;
}


/* ==========================================================
   2. TÍTULO
   ========================================================== */

body#cart .page-header h1,
body#cart .cart-grid-body > h1,
body#cart h1 {
    margin-bottom: 18px !important;

    font-family: "Poppins", Arial, sans-serif !important;
    font-size: 30px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.025em;

    color: var(--cv-text) !important;

    text-transform: none !important;
}


/* ==========================================================
   3. CONTENEDOR DEL CARRITO
   ========================================================== */

body#cart .card.cart-container {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body#cart
.card.cart-container
.cart-overview {

    overflow: hidden;

    background: #FFFFFF !important;

    border:
        1px solid var(--cv-border) !important;

    border-radius: 18px !important;

    box-shadow: none !important;
}


/* ==========================================================
   4. CABECERA DE TABLA
   ========================================================== */

body#cart
.card.cart-container
.cart-overview
.cart-item.header-car-items {

    color: var(--cv-text) !important;

    font-family: "Nunito", Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
}


/* ==========================================================
   5. FILAS DE PRODUCTO
   ========================================================== */

body#cart
.card.cart-container
.cart-overview
.cart-item
.product-line-grid {

    display: flex;
    align-items: center;

    min-height: 180px;

    padding-top: 20px;
    padding-bottom: 20px;
}


/* Separadores */
body#cart
.cart-overview
.product-separator {

    margin: 0 16px !important;

    border-top:
        1px solid var(--cv-border) !important;
}


/* ==========================================================
   6. IMAGEN DE PRODUCTO
   ========================================================== */

body#cart
.product-line-grid-left
.product-image {

    border-radius: 12px;

    background: #FFFFFF;
}

body#cart
.product-line-grid-left
.product-image img {

    max-width: 100%;

    object-fit: contain;
}


/* ==========================================================
   7. NOMBRE DE PRODUCTO
   ========================================================== */

/*
 * Sobrescribe el antiguo a.label verde
 */

body#cart
.product-line-info
a.label,

body#cart
.product-line-info
a,

body#cart
.cart-item
.product-line-grid
.product-line-info
a {

    color: var(--cv-text) !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;

    text-decoration: none !important;

    transition:
        color .18s ease !important;
}

body#cart
.product-line-info
a:hover {

    color: var(--cv-blue) !important;
}


/* ==========================================================
   8. PRECIO DEL PRODUCTO
   ========================================================== */

body#cart span.price,

body#cart
.product-price
.current-price,

body#cart
.product-line-info
.current-price {

    color: var(--cv-blue-dark) !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}


/* ==========================================================
   9. SELECTOR DE CANTIDAD
   ========================================================== */

body#cart
.card.cart-container
.cart-overview
.cart-item
.product-line-grid
.input-group {

    display: flex;

    overflow: hidden;

    min-height: 44px;

    background: #FFFFFF;

    border:
        1px solid var(--cv-border-strong) !important;

    border-radius: 10px !important;

    box-shadow: none !important;
}


body#cart
.card.cart-container
.cart-overview
.cart-item
.product-line-grid
.input-group
input.form-control,

body#cart
.card.cart-container
.cart-overview
.cart-item
.product-line-grid
.input-group
button.btn {

    background: transparent !important;

    border: 0 !important;

    color: var(--cv-text-secondary) !important;

    box-shadow: none !important;
}


/* Focus */
body#cart
.product-line-grid
.input-group:focus-within {

    border-color: var(--cv-blue) !important;

    box-shadow:
        0 0 0 3px rgba(28,57,237,.08) !important;
}


/* ==========================================================
   10. BOTÓN ELIMINAR
   ========================================================== */

body#cart
.cart-line-product-actions
.remove-from-cart {

    color: var(--cv-blue-dark) !important;
}


body#cart
.cart-line-product-actions
.remove-from-cart i {

    width: 36px !important;
    height: 36px !important;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid var(--cv-border) !important;

    border-radius: 50% !important;

    background: #FFFFFF !important;

    color: var(--cv-blue-dark) !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease !important;
}


body#cart
.cart-line-product-actions
.remove-from-cart:hover i {

    background: #EEF0FF !important;

    border-color: #C5D0FF !important;

    color: var(--cv-blue) !important;
}


/* ==========================================================
   11. CONTINUAR COMPRANDO
   ========================================================== */

body#cart
.cart-grid-body
.continue-shopping {

    margin-top: 14px;
}


body#cart
.cart-grid-body
.continue-shopping a,

body#cart
.cart-grid-body
.continue-shopping a.label {

    color: var(--cv-blue) !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;
}


body#cart
.cart-grid-body
.continue-shopping a:hover {

    color: var(--cv-blue-hover) !important;
}


/* ==========================================================
   12. SUMMARY CARD
   ========================================================== */

body#cart
.cart-grid-right
.card.cart-summary {

    padding: 32px !important;

    background: var(--cv-bg-soft) !important;

    border: 1px solid transparent !important;

    border-radius: 18px !important;

    box-shadow: none !important;
}


/* Título */
body#cart
.cart-grid-right
.card.cart-summary
.summary-title {

    margin-bottom: 20px;

    color: var(--cv-blue-dark) !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}


/* ==========================================================
   13. LÍNEAS DEL RESUMEN
   ========================================================== */

body#cart
.cart-summary
.cart-summary-line {

    color: var(--cv-text-secondary) !important;

    font-family: "Nunito", Arial, sans-serif;
    font-size: 14px;
}


body#cart
.cart-summary
.cart-summary-line
.value {

    color: var(--cv-text) !important;

    font-weight: 700 !important;
}


/* Separadores */
body#cart
.cart-summary
hr {

    border-color: var(--cv-border) !important;
}


/* ==========================================================
   14. TOTAL
   ========================================================== */

body#cart
.cart-summary
.cart-total {

    color: var(--cv-text) !important;
}


body#cart
.cart-summary
.cart-total
.label {

    color: var(--cv-text) !important;

    font-weight: 800 !important;
}


body#cart
.cart-summary
.cart-total
.value {

    color: var(--cv-blue-dark) !important;

    font-size: 18px !important;
    font-weight: 800 !important;
}


/* ==========================================================
   15. CÓDIGO PROMOCIONAL
   ========================================================== */

body#cart
.cart-summary
.block-promo
.promo-code-button,

body#cart
.cart-summary
.block-promo
a,

body#cart
.cart-summary
.block-promo
a.label {

    color: var(--cv-blue) !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;
}


body#cart
.cart-summary
.block-promo
a:hover {

    color: var(--cv-blue-hover) !important;
}


/* ==========================================================
   16. CTA FINALIZAR COMPRA
   ========================================================== */

body#cart
.cart-grid-right
.card.cart-summary
.btn-primary,

body#cart
.cart-summary
.checkout
.btn-primary {

    width: 100%;

    min-height: 46px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 22px !important;

    background: var(--cv-blue) !important;

    border:
        1px solid var(--cv-blue) !important;

    border-radius: 999px !important;

    color: #FFFFFF !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    box-shadow: none !important;

    text-transform: none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease !important;
}


body#cart
.cart-grid-right
.card.cart-summary
.btn-primary:hover,

body#cart
.cart-summary
.checkout
.btn-primary:hover {

    background: var(--cv-blue-hover) !important;

    border-color: var(--cv-blue-hover) !important;

    transform: translateY(-1px);

    box-shadow:
        0 7px 18px rgba(28,57,237,.16) !important;
}


body#cart
.cart-summary
.btn-primary:focus {

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28,57,237,.13) !important;
}


/* ==========================================================
   17. MOBILE
   ========================================================== */

@media (max-width: 768px) {

    body#cart #wrapper {
        padding-top: 24px;
        padding-bottom: 40px;
    }


    body#cart .page-header h1,
    body#cart .cart-grid-body > h1,
    body#cart h1 {

        font-size: 25px !important;
    }


    /* Ocultar cabecera de columnas */
    body#cart
    .cart-overview
    .cart-item.header-car-items {

        display: none !important;
    }


    body#cart
    .card.cart-container
    .cart-overview
    .cart-item
    .product-line-grid {

        min-height: 0;

        padding-top: 20px;
        padding-bottom: 20px;
    }


    body#cart
    .cart-grid-right
    .card.cart-summary {

        margin-top: 24px;

        padding: 24px 20px !important;

        border-radius: 16px !important;
    }


    body#cart
    .product-line-info
    a.label,

    body#cart
    .product-line-info
    a {

        font-size: 13px !important;
    }


    body#cart span.price {

        font-size: 17px !important;
    }

}







/* ==========================================================
   COMERCIAL VACA · LOGIN / AUTHENTICATION
   PrestaShop

   Colocar AL FINAL del CSS global
   ========================================================== */

body#authentication {
    --cv-blue: #1C39ED;
    --cv-blue-hover: #1834D9;
    --cv-blue-soft: #EEF0FF;

    --cv-navy: #0A1547;

    --cv-text: #151A22;
    --cv-text-secondary: #5D6470;
    --cv-muted: #8A94A6;

    --cv-border: #E1E5EE;
    --cv-border-strong: #D5DBE7;

    --cv-bg-soft: #F7F8FC;
    --cv-white: #FFFFFF;
}


/* ==========================================================
   1. PAGE
   ========================================================== */

body#authentication,
body#authentication main {
    background: #FFFFFF !important;
}


body#authentication #wrapper {
    background: #FFFFFF !important;

    padding-top: 28px !important;
    padding-bottom: 70px !important;
}


/* ==========================================================
   2. BREADCRUMB
   ========================================================== */

body#authentication nav.breadcrumb {
    margin-bottom: 34px !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 13px !important;

    color: var(--cv-muted) !important;
}


body#authentication nav.breadcrumb a {
    color: var(--cv-text-secondary) !important;

    text-decoration: none !important;
}


body#authentication nav.breadcrumb a:hover {
    color: var(--cv-blue) !important;
}


/* ==========================================================
   3. LOGIN CARD
   ========================================================== */

body#authentication
#wrapper
div#content {

    width: 100% !important;
    max-width: 460px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: stretch !important;
    justify-content: center !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding: 36px 38px 32px !important;

    background: #FFFFFF !important;

    border: 1px solid var(--cv-border) !important;
    border-radius: 20px !important;

    box-shadow:
        0 10px 35px rgba(10, 21, 71, 0.06) !important;

    color: var(--cv-text) !important;
}


/* ==========================================================
   4. TÍTULO
   ========================================================== */

body#authentication
h1.login-form-title {

    width: 100% !important;
    max-width: 360px !important;

    margin:
        0 auto 32px !important;

    padding: 0 !important;

    font-family: "Poppins", Arial, sans-serif !important;

    font-size: 27px !important;
    font-weight: 600 !important;
    line-height: 1.18 !important;
    letter-spacing: -0.025em !important;

    text-align: center !important;

    color: var(--cv-navy) !important;

    text-transform: none !important;
}


/* ==========================================================
   5. FORMULARIO
   ========================================================== */

body#authentication
form#login-form {

    width: 100% !important;
    max-width: none !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: stretch !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* ==========================================================
   6. GRUPOS DE CAMPOS
   ========================================================== */

body#authentication
form#login-form
.form-group.row {

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;

    margin:
        0 0 20px 0 !important;

    padding: 0 !important;
}


/* Neutralizar columnas Bootstrap */
body#authentication
form#login-form
.form-group.row > div {

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
}


/* ==========================================================
   7. LABELS
   ========================================================== */

body#authentication
form#login-form
.form-group.row label {

    display: block !important;

    width: 100% !important;

    margin:
        0 0 7px 0 !important;

    padding: 0 !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;

    text-align: left !important;

    color: #343B48 !important;
}


/* ==========================================================
   8. INPUTS
   ========================================================== */

body#authentication
form#login-form
.form-control {

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    height: 50px !important;

    margin: 0 !important;

    padding:
        0 15px !important;

    background: #FFFFFF !important;

    border:
        1px solid var(--cv-border-strong) !important;

    border-radius: 10px !important;

    color: var(--cv-text) !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 14px !important;
    font-weight: 400 !important;

    box-shadow: none !important;

    outline: none !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease !important;
}


/* Placeholder */
body#authentication
form#login-form
.form-control::placeholder {

    color: #A0A8B5 !important;

    opacity: 1 !important;
}


/* Focus */
body#authentication
form#login-form
.form-control:focus {

    border-color:
        var(--cv-blue) !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, 0.09) !important;

    outline: none !important;
}


/* ==========================================================
   9. PASSWORD
   ========================================================== */

body#authentication
form#login-form
.password {

    position: relative !important;

    width: 100% !important;
}


/* Espacio para el icono */
body#authentication
form#login-form
.password
.form-control {

    padding-right: 52px !important;
}


/* Contenedor del ojo */
body#authentication
form#login-form
.password
span {

    position: absolute !important;

    top: 0 !important;
    right: 7px !important;

    width: 40px !important;
    height: 50px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    z-index: 3 !important;
}


/* Botón del ojo */
body#authentication
form#login-form
.password
.toggle-password {

    width: 38px !important;
    height: 38px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;

    color: var(--cv-muted) !important;

    cursor: pointer !important;

    box-shadow: none !important;
}


/* Icono */
body#authentication
form#login-form
.password
.toggle-password svg {

    opacity: .7 !important;

    transition:
        opacity .18s ease,
        color .18s ease !important;
}


body#authentication
form#login-form
.password
.toggle-password:hover {

    color: var(--cv-blue) !important;
}


body#authentication
form#login-form
.password
.toggle-password:hover svg {

    opacity: 1 !important;
}


/* ==========================================================
   10. ¿OLVIDÓ SU CONTRASEÑA?
   CENTRADO
   ========================================================== */

body#authentication
form#login-form
.forgot-password {

    width: 100% !important;

    margin:
        2px 0 25px 0 !important;

    padding: 0 !important;

    text-align: center !important;
}


body#authentication
form#login-form
.forgot-password a,

body#authentication
form#login-form
.forgot-password a.label {

    display: inline-block !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    color: var(--cv-blue) !important;

    text-decoration: none !important;

    transition:
        color .18s ease !important;
}


body#authentication
form#login-form
.forgot-password a:hover {

    color: var(--cv-blue-hover) !important;

    text-decoration: underline !important;

    text-underline-offset: 3px !important;
}


/* ==========================================================
   11. FOOTER DEL FORM
   ========================================================== */

body#authentication
form#login-form
footer.form-footer {

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    text-align: center !important;
}


/* ==========================================================
   12. BOTÓN INICIAR SESIÓN
   ========================================================== */

body#authentication
form#login-form
.btn.btn-primary {

    width: 100% !important;

    min-height: 50px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;

    padding:
        11px 24px !important;

    background:
        var(--cv-blue) !important;

    border:
        1px solid var(--cv-blue) !important;

    border-radius:
        999px !important;

    color:
        #FFFFFF !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        15px !important;

    font-weight:
        800 !important;

    line-height:
        1.2 !important;

    text-align:
        center !important;

    text-transform:
        none !important;

    box-shadow:
        none !important;

    cursor:
        pointer !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease !important;
}


/* Hover */
body#authentication
form#login-form
.btn.btn-primary:hover {

    background:
        var(--cv-blue-hover) !important;

    border-color:
        var(--cv-blue-hover) !important;

    color:
        #FFFFFF !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 7px 18px rgba(28, 57, 237, 0.16) !important;
}


/* Focus */
body#authentication
form#login-form
.btn.btn-primary:focus {

    background:
        var(--cv-blue) !important;

    border-color:
        var(--cv-blue) !important;

    color:
        #FFFFFF !important;

    outline:
        none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .13) !important;
}


/* ==========================================================
   13. CREAR CUENTA
   ========================================================== */

body#authentication
.register-form,

body#authentication
.no-account {

    width: 100% !important;

    margin:
        14px 0 0 0 !important;

    padding:
        0 !important;

    text-align:
        center !important;

    color:
        var(--cv-text-secondary) !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;
}


body#authentication
.register-form a,

body#authentication
.no-account a,

body#authentication
.register-form a.label,

body#authentication
.no-account a.label {

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;

    color:
        var(--cv-blue) !important;

    text-decoration:
        none !important;

    transition:
        color .18s ease !important;
}


body#authentication
.register-form a:hover,

body#authentication
.no-account a:hover {

    color:
        var(--cv-blue-hover) !important;

    text-decoration:
        underline !important;

    text-underline-offset:
        3px !important;
}


/* ==========================================================
   14. ELIMINAR VERDES / VIOLETAS RESIDUALES
   SOLO EN ESTA PÁGINA
   ========================================================== */

body#authentication
#content
a.label,

body#authentication
#content
a.text-primary {

    color:
        var(--cv-blue) !important;
}


body#authentication
#content
a.label:hover,

body#authentication
#content
a.text-primary:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   15. MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body#authentication #wrapper {

        padding-top:
            18px !important;

        padding-bottom:
            40px !important;
    }


    body#authentication
    nav.breadcrumb {

        margin-bottom:
            22px !important;
    }


    body#authentication
    #wrapper
    div#content {

        width:
            100% !important;

        max-width:
            100% !important;

        padding:
            28px 22px 26px !important;

        border-radius:
            16px !important;

        box-shadow:
            none !important;
    }


    body#authentication
    h1.login-form-title {

        max-width:
            300px !important;

        margin-bottom:
            26px !important;

        font-size:
            23px !important;
    }


    body#authentication
    form#login-form
    .form-group.row {

        margin-bottom:
            18px !important;
    }


    body#authentication
    form#login-form
    .form-control {

        height:
            48px !important;
    }


    body#authentication
    form#login-form
    .password
    span {

        height:
            48px !important;
    }


    body#authentication
    form#login-form
    .forgot-password {

        margin-bottom:
            22px !important;
    }


    body#authentication
    form#login-form
    .btn.btn-primary {

        min-height:
            48px !important;
    }

}





/* ==========================================================
   COMERCIAL VACA · PASSWORD
   FIX INPUT + BUTTON OCULTOS
   ========================================================== */


/* Forzar visualización del área de campos */
body#password
form.forgotten-password
.form-fields {

    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
}


/* Fila completa */
body#password
form.forgotten-password
.center-email-fields {

    display: flex !important;
    flex-direction: column !important;

    align-items: stretch !important;

    width: 100% !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    visibility: visible !important;
    opacity: 1 !important;
}


/* Wrapper del input */
body#password
form.forgotten-password
.center-email-fields
.email,

body#password
form.forgotten-password
.center-email-fields
.col-md-5.email {

    display: block !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 50px !important;

    margin: 0 0 22px 0 !important;
    padding: 0 !important;

    float: none !important;

    position: relative !important;
}


/* Input */
body#password
form.forgotten-password
input#email {

    display: block !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    max-width: none !important;

    height: 50px !important;
    min-height: 50px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    background: #FFFFFF !important;

    border: 1px solid #D5DBE7 !important;
    border-radius: 10px !important;

    color: #151A22 !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;

    box-shadow: none !important;

    position: relative !important;
    z-index: 2 !important;
}


/* Focus */
body#password
form.forgotten-password
input#email:focus {

    border-color: #1C39ED !important;

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, 0.09) !important;
}


/* ==========================================================
   BOTÓN DESKTOP
   ========================================================== */

body#password
form.forgotten-password
#send-reset-link {

    display: flex !important;

    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;

    min-height: 50px !important;

    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 11px 24px !important;

    background: #1C39ED !important;

    border: 1px solid #1C39ED !important;
    border-radius: 999px !important;

    color: #FFFFFF !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 14px !important;
    font-weight: 800 !important;

    text-transform: none !important;

    box-shadow: none !important;
}


/* Hover */
body#password
form.forgotten-password
#send-reset-link:hover {

    background: #1834D9 !important;
    border-color: #1834D9 !important;
}


/* ==========================================================
   MOBILE
   PrestaShop tiene otro botón específico para mobile
   ========================================================== */

@media (min-width: 768px) {

    /* Evitar que aparezca también el botón mobile */
    body#password
    form.forgotten-password
    button.hidden-sm-up {

        display: none !important;
    }

}


@media (max-width: 767px) {

    /* Ocultamos el desktop */
    body#password
    form.forgotten-password
    #send-reset-link {

        display: none !important;
    }


    /* Mostramos el mobile */
    body#password
    form.forgotten-password
    button.hidden-sm-up {

        display: flex !important;

        visibility: visible !important;
        opacity: 1 !important;

        width: 100% !important;
        min-height: 48px !important;

        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 11px 20px !important;

        background: #1C39ED !important;

        border: 1px solid #1C39ED !important;
        border-radius: 999px !important;

        color: #FFFFFF !important;

        font-family: "Nunito", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 800 !important;

        text-transform: none !important;
    }

}





/* ==========================================================
   COMERCIAL VACA · PASSWORD
   FIX LABEL + BACK LINK
   ========================================================== */


/* ----------------------------------------------------------
   1. LABEL DEL EMAIL
   ---------------------------------------------------------- */

body#password
form.forgotten-password
.center-email-fields
.form-control-label,

body#password
form.forgotten-password
.center-email-fields
label {

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    flex: 0 0 100% !important;

    margin: 0 0 8px 0 !important;
    padding: 0 !important;

    float: none !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;

    color: #343B48 !important;

    text-align: left !important;

    white-space: nowrap !important;
}


/* Quitar comportamiento de columna Bootstrap */
body#password
form.forgotten-password
.center-email-fields
.col-md-3,

body#password
form.forgotten-password
.center-email-fields
.col-md-4 {

    width: 100% !important;
    max-width: 100% !important;

    flex: 0 0 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* ----------------------------------------------------------
   2. VOLVER A INICIO DE SESIÓN
   ---------------------------------------------------------- */

body#password #back-to-login,
body#password #back-to-login.label,
body#password a#back-to-login {

    display: flex !important;

    width: max-content !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 5px !important;

    margin: 20px auto 0 !important;

    padding: 0 !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    color: #1C39ED !important;

    background: transparent !important;

    text-decoration: none !important;

    transition: color .18s ease !important;
}


body#password #back-to-login:hover,
body#password a#back-to-login:hover {

    color: #1834D9 !important;

    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}


/* Flecha */
body#password
#back-to-login
.material-icons {

    color: currentColor !important;

    font-size: 17px !important;
}







/* ==========================================================
   COMERCIAL VACA · CUSTOMER FORM
   Información personal / Registro
   ========================================================== */

body#identity,
body#registration {
    --cv-blue: #1C39ED;
    --cv-blue-hover: #1834D9;
    --cv-blue-soft: #EEF0FF;

    --cv-navy: #0A1547;

    --cv-text: #151A22;
    --cv-text-secondary: #5D6470;
    --cv-muted: #8A94A6;

    --cv-border: #E1E5EE;
    --cv-border-strong: #D5DBE7;

    --cv-bg-soft: #F7F8FC;
    --cv-white: #FFFFFF;
}


/* ==========================================================
   1. PAGE
   ========================================================== */

body#identity,
body#identity main,
body#registration,
body#registration main {
    background: #FFFFFF !important;
}


body#identity #wrapper,
body#registration #wrapper {
    background: #FFFFFF !important;

    padding-top: 28px !important;
    padding-bottom: 70px !important;
}


/* ==========================================================
   2. PAGE HEADER
   ========================================================== */

body#identity .page-header,
body#registration .page-header {

    width: 100% !important;
    max-width: 820px !important;

    margin:
        0 auto 24px !important;
}


body#identity .page-header h1,
body#registration .page-header h1 {

    margin: 0 !important;

    font-family: "Poppins", Arial, sans-serif !important;

    font-size: 30px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.025em !important;

    color: var(--cv-navy) !important;

    text-transform: none !important;
}


/* ==========================================================
   3. CARD
   ========================================================== */

body#identity #content,
body#registration #content {

    width: 100% !important;
    max-width: 820px !important;

    margin:
        0 auto !important;

    padding:
        38px 40px 34px !important;

    background:
        #FFFFFF !important;

    border:
        1px solid var(--cv-border) !important;

    border-radius:
        20px !important;

    box-shadow:
        0 10px 35px rgba(10, 21, 71, 0.06) !important;
}


/* ==========================================================
   4. FORM
   ========================================================== */

body#identity #customer-form,
body#registration #customer-form {

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}


/*
 * Contenedor principal de campos.
 *
 * Desktop:
 * 2 columnas.
 */
body#identity #customer-form > div,
body#registration #customer-form > div {

    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    column-gap:
        20px !important;

    row-gap:
        22px !important;

    width:
        100% !important;
}


/* ==========================================================
   5. RESET DE LAS FILAS BOOTSTRAP
   ========================================================== */

body#identity
#customer-form
.form-group.row,

body#registration
#customer-form
.form-group.row {

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Label */
body#identity
#customer-form
.form-group.row
> .form-control-label,

body#registration
#customer-form
.form-group.row
> .form-control-label {

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    flex: none !important;

    margin:
        0 0 7px 0 !important;

    padding:
        0 !important;

    float:
        none !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;

    line-height:
        1.4 !important;

    text-align:
        left !important;

    color:
        #343B48 !important;
}


/* Columna del input */
body#identity
#customer-form
.form-group.row
> .js-input-column,

body#registration
#customer-form
.form-group.row
> .js-input-column {

    width: 100% !important;
    max-width: none !important;

    flex: none !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
}


/*
 * Eliminamos la tercera columna "Opcional".
 *
 * Los comentarios que están DENTRO de js-input-column,
 * como el ejemplo de fecha, se conservan.
 */
body#identity
#customer-form
.form-group.row
> .form-control-comment,

body#registration
#customer-form
.form-group.row
> .form-control-comment {

    display: none !important;
}


/* ==========================================================
   6. INPUTS
   ========================================================== */

body#identity
#customer-form
.form-control,

body#registration
#customer-form
.form-control {

    display: block !important;

    width: 100% !important;

    height: 50px !important;

    margin: 0 !important;

    padding:
        0 15px !important;

    background:
        #FFFFFF !important;

    border:
        1px solid var(--cv-border-strong) !important;

    border-radius:
        10px !important;

    color:
        var(--cv-text) !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        400 !important;

    box-shadow:
        none !important;

    outline:
        none !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease !important;
}


/* Focus */
body#identity
#customer-form
.form-control:focus,

body#registration
#customer-form
.form-control:focus {

    border-color:
        var(--cv-blue) !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .09) !important;

    outline:
        none !important;
}


/* Placeholder */
body#identity
#customer-form
.form-control::placeholder,

body#registration
#customer-form
.form-control::placeholder {

    color:
        #A0A8B5 !important;

    opacity:
        1 !important;
}


/* ==========================================================
   7. COMENTARIOS / AYUDAS
   ========================================================== */

body#identity
#customer-form
.js-input-column
.form-control-comment,

body#registration
#customer-form
.js-input-column
.form-control-comment {

    display:
        block !important;

    margin:
        6px 0 0 0 !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;

    line-height:
        1.45 !important;

    color:
        var(--cv-muted) !important;
}


/* ==========================================================
   8. NOMBRE + APELLIDO
   ========================================================== */

/*
 * Permanecen en 2 columnas.
 */
body#identity
#customer-form
.form-group.row:has(#field-firstname),

body#identity
#customer-form
.form-group.row:has(#field-lastname),

body#registration
#customer-form
.form-group.row:has(#field-firstname),

body#registration
#customer-form
.form-group.row:has(#field-lastname) {

    grid-column:
        auto !important;
}


/* ==========================================================
   9. EMAIL + PASSWORD
   ========================================================== */

body#identity
#customer-form
.form-group.row:has(#field-email),

body#registration
#customer-form
.form-group.row:has(#field-email) {

    grid-column:
        auto !important;
}


/*
 * PrestaShop envuelve el password en
 * .field-password-policy
 */
body#identity
#customer-form
.field-password-policy,

body#registration
#customer-form
.field-password-policy {

    grid-column:
        auto !important;

    width:
        100% !important;
}


/* Password row */
body#identity
#customer-form
.field-password-policy
.form-group.row,

body#registration
#customer-form
.field-password-policy
.form-group.row {

    width:
        100% !important;
}


/* ==========================================================
   10. PASSWORD INPUT GROUP
   ========================================================== */

body#identity
#customer-form
.input-group,

body#registration
#customer-form
.input-group {

    position:
        relative !important;

    display:
        flex !important;

    width:
        100% !important;

    min-height:
        50px !important;

    overflow:
        hidden !important;

    background:
        #FFFFFF !important;

    border:
        1px solid var(--cv-border-strong) !important;

    border-radius:
        10px !important;

    box-shadow:
        none !important;
}


/* Evitar doble borde */
body#identity
#customer-form
.input-group
.form-control,

body#registration
#customer-form
.input-group
.form-control {

    border:
        0 !important;

    border-radius:
        0 !important;

    box-shadow:
        none !important;
}


/* Focus alrededor del grupo */
body#identity
#customer-form
.input-group:focus-within,

body#registration
#customer-form
.input-group:focus-within {

    border-color:
        var(--cv-blue) !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .09) !important;
}


/* Botón show password */
body#identity
#customer-form
.input-group-btn
.btn,

body#registration
#customer-form
.input-group-btn
.btn {

    height:
        48px !important;

    padding:
        0 14px !important;

    background:
        transparent !important;

    border:
        0 !important;

    color:
        var(--cv-muted) !important;

    box-shadow:
        none !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        12px !important;
}


/* ==========================================================
   11. FECHA DE NACIMIENTO
   ========================================================== */

body#identity
#customer-form
.form-group.row:has(#field-birthday),

body#registration
#customer-form
.form-group.row:has(#field-birthday) {

    grid-column:
        1 / -1 !important;

    max-width:
        calc(50% - 10px) !important;
}


/* ==========================================================
   12. CHECKBOXES
   ========================================================== */

body#identity
#customer-form
.form-group.row:has(.custom-checkbox),

body#registration
#customer-form
.form-group.row:has(.custom-checkbox) {

    grid-column:
        1 / -1 !important;

    width:
        100% !important;

    padding:
        14px 16px !important;

    background:
        var(--cv-bg-soft) !important;

    border:
        1px solid var(--cv-border) !important;

    border-radius:
        10px !important;
}


/* Quitamos label vacío de Bootstrap */
body#identity
#customer-form
.form-group.row:has(.custom-checkbox)
> .form-control-label,

body#registration
#customer-form
.form-group.row:has(.custom-checkbox)
> .form-control-label {

    display:
        none !important;
}


/* Campo ocupa todo */
body#identity
#customer-form
.form-group.row:has(.custom-checkbox)
> .js-input-column,

body#registration
#customer-form
.form-group.row:has(.custom-checkbox)
> .js-input-column {

    width:
        100% !important;
}


/* Label del checkbox */
body#identity
#customer-form
.custom-checkbox
label,

body#registration
#customer-form
.custom-checkbox
label {

    display:
        flex !important;

    align-items:
        flex-start !important;

    gap:
        10px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        400 !important;

    line-height:
        1.5 !important;

    color:
        var(--cv-text-secondary) !important;

    cursor:
        pointer !important;
}


/* Caja visual */
body#identity
#customer-form
.custom-checkbox
label
> span,

body#registration
#customer-form
.custom-checkbox
label
> span {

    flex:
        0 0 18px !important;

    width:
        18px !important;

    height:
        18px !important;

    margin-top:
        1px !important;

    background:
        #FFFFFF !important;

    border:
        1px solid #BFC7D4 !important;

    border-radius:
        4px !important;

    box-shadow:
        none !important;
}


/* Checked */
body#identity
#customer-form
.custom-checkbox
input:checked + span,

body#registration
#customer-form
.custom-checkbox
input:checked + span {

    background:
        var(--cv-blue) !important;

    border-color:
        var(--cv-blue) !important;
}


/* Check icon */
body#identity
#customer-form
.custom-checkbox
.checkbox-checked,

body#registration
#customer-form
.custom-checkbox
.checkbox-checked {

    color:
        #FFFFFF !important;
}


/* Texto secundario dentro de checkbox */
body#identity
#customer-form
.custom-checkbox
em,

body#registration
#customer-form
.custom-checkbox
em {

    display:
        block !important;

    margin-top:
        4px !important;

    color:
        var(--cv-muted) !important;

    font-size:
        12px !important;

    line-height:
        1.5 !important;
}


/* ==========================================================
   13. FOOTER
   ========================================================== */

body#identity
#customer-form
footer.form-footer,

body#registration
#customer-form
footer.form-footer {

    width:
        100% !important;

    display:
        flex !important;

    justify-content:
        flex-end !important;

    margin:
        28px 0 0 0 !important;

    padding:
        26px 0 0 0 !important;

    border-top:
        1px solid var(--cv-border) !important;
}


/* ==========================================================
   14. BOTÓN GUARDAR
   ========================================================== */

body#identity
#customer-form
.form-control-submit,

body#registration
#customer-form
.form-control-submit {

    min-width:
        180px !important;

    min-height:
        48px !important;

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    padding:
        11px 24px !important;

    background:
        var(--cv-blue) !important;

    border:
        1px solid var(--cv-blue) !important;

    border-radius:
        999px !important;

    color:
        #FFFFFF !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        800 !important;

    text-transform:
        none !important;

    box-shadow:
        none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease !important;
}


body#identity
#customer-form
.form-control-submit:hover,

body#registration
#customer-form
.form-control-submit:hover {

    background:
        var(--cv-blue-hover) !important;

    border-color:
        var(--cv-blue-hover) !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 7px 18px rgba(28, 57, 237, .16) !important;
}


/* ==========================================================
   15. MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body#identity #wrapper,
    body#registration #wrapper {

        padding-top:
            18px !important;

        padding-bottom:
            40px !important;
    }


    body#identity #content,
    body#registration #content {

        max-width:
            100% !important;

        padding:
            26px 20px !important;

        border-radius:
            16px !important;

        box-shadow:
            none !important;
    }


    body#identity
    #customer-form
    > div,

    body#registration
    #customer-form
    > div {

        grid-template-columns:
            1fr !important;

        gap:
            18px !important;
    }


    body#identity
    #customer-form
    .form-group.row,

    body#registration
    #customer-form
    .form-group.row,

    body#identity
    #customer-form
    .field-password-policy,

    body#registration
    #customer-form
    .field-password-policy {

        grid-column:
            1 / -1 !important;

        max-width:
            none !important;
    }


    body#identity
    #customer-form
    .form-group.row:has(#field-birthday),

    body#registration
    #customer-form
    .form-group.row:has(#field-birthday) {

        max-width:
            100% !important;
    }


    body#identity
    #customer-form
    footer.form-footer,

    body#registration
    #customer-form
    footer.form-footer {

        padding-top:
            22px !important;
    }


    body#identity
    #customer-form
    .form-control-submit,

    body#registration
    #customer-form
    .form-control-submit {

        width:
            100% !important;
    }

}




/* ==========================================================
   COMERCIAL VACA · REGISTRO
   Enlace "¿Ya tiene una cuenta? ¡Inicie sesión!"
   ========================================================== */

body#registration
.register-form > p {
    color: #6B7280 !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;

    margin-bottom: 24px !important;
}


body#registration
.register-form > p a,
body#registration
.register-form > p a.label {

    color: #1C39ED !important;

    font-weight: 700 !important;

    text-decoration: none !important;

    transition: color .18s ease !important;
}


body#registration
.register-form > p a:hover,
body#registration
.register-form > p a.label:hover {

    color: #1834D9 !important;

    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}




/* ==========================================================
   COMERCIAL VACA · CHECKBOXES
   Título arriba + descripción debajo
   ========================================================== */

body#identity
#customer-form
.custom-checkbox
label,

body#registration
#customer-form
.custom-checkbox
label {

    display: grid !important;

    grid-template-columns:
        18px minmax(0, 1fr) !important;

    grid-template-rows:
        auto auto !important;

    column-gap:
        10px !important;

    row-gap:
        4px !important;

    align-items:
        start !important;

    width:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        500 !important;

    line-height:
        1.45 !important;

    color:
        #343B48 !important;
}


/* Checkbox */
body#identity
#customer-form
.custom-checkbox
label > span,

body#registration
#customer-form
.custom-checkbox
label > span {

    grid-column:
        1 !important;

    grid-row:
        1 / span 2 !important;

    width:
        18px !important;

    height:
        18px !important;

    margin:
        1px 0 0 0 !important;

    flex:
        none !important;
}


/* Descripción secundaria */
body#identity
#customer-form
.custom-checkbox
label em,

body#registration
#customer-form
.custom-checkbox
label em {

    grid-column:
        2 !important;

    grid-row:
        2 !important;

    display:
        block !important;

    width:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    font-size:
        12px !important;

    font-weight:
        400 !important;

    font-style:
        italic !important;

    line-height:
        1.5 !important;

    color:
        #8A94A6 !important;
}







/* ==========================================================
   COMERCIAL VACA · MI CUENTA
   PrestaShop
   ========================================================== */

body#my-account.page-my-account {
    --cv-blue: #1C39ED;
    --cv-blue-hover: #1834D9;
    --cv-blue-soft: #F0F3FF;

    --cv-navy: #0A1547;

    --cv-text: #202632;
    --cv-secondary: #5D6470;
    --cv-muted: #8A94A6;

    --cv-border: #E1E5EE;
    --cv-border-hover: #C8D1FF;

    --cv-bg: #F7F8FC;
    --cv-white: #FFFFFF;
}


/* ==========================================================
   1. PÁGINA
   ========================================================== */

body#my-account.page-my-account,
body#my-account.page-my-account main,
body#my-account.page-my-account #wrapper {
    background: var(--cv-bg) !important;
}

body#my-account.page-my-account #wrapper {
    padding-top: 26px !important;
    padding-bottom: 64px !important;
}


/* ==========================================================
   2. BREADCRUMB
   ========================================================== */

body#my-account.page-my-account nav.breadcrumb {
    margin-bottom: 18px !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 13px !important;

    color: var(--cv-muted) !important;
}

body#my-account.page-my-account nav.breadcrumb a {
    color: var(--cv-secondary) !important;
    text-decoration: none !important;
}

body#my-account.page-my-account nav.breadcrumb a:hover {
    color: var(--cv-blue) !important;
}


/* ==========================================================
   3. TÍTULO
   ========================================================== */

body#my-account.page-my-account .page-header {
    margin: 0 0 32px 0 !important;
}

body#my-account.page-my-account .page-header h1 {
    margin: 0 !important;

    font-family: "Poppins", Arial, sans-serif !important;

    font-size: 34px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.025em !important;

    color: var(--cv-navy) !important;

    text-transform: none !important;
}


/* ==========================================================
   4. RESET DEL ROW NATIVO
   ========================================================== */

body#my-account.page-my-account
#content > .row {
    margin: 0 !important;
}


/* ==========================================================
   5. GRID
   ========================================================== */

body#my-account.page-my-account
.links {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 18px !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;
}


/* ==========================================================
   6. FIX CLAVE
   Neutralizar col-lg-4 / col-md-6 de PrestaShop
   ========================================================== */

body#my-account.page-my-account
.links > a {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    flex: none !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;

    color: inherit !important;

    text-decoration: none !important;
}


/* Por si algún módulo añade wrappers */
body#my-account.page-my-account
.links > div {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
}


/* ==========================================================
   7. CARD REAL
   PrestaShop usa span.link-item
   ========================================================== */

body#my-account.page-my-account
.links > a > .link-item,

body#my-account.page-my-account
.links .link-item {
    position: relative !important;

    width: 100% !important;
    min-height: 148px !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 0 !important;

    margin: 0 !important;

    padding: 24px 20px !important;

    background: #FFFFFF !important;

    border: 1px solid var(--cv-border) !important;
    border-radius: 16px !important;

    box-shadow:
        0 3px 12px rgba(10, 21, 71, .025) !important;

    text-align: center !important;

    overflow: hidden !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease !important;
}


/* ==========================================================
   8. HOVER CARD
   ========================================================== */

body#my-account.page-my-account
.links > a:hover > .link-item {
    border-color: var(--cv-border-hover) !important;

    transform: translateY(-3px);

    box-shadow:
        0 10px 26px rgba(28, 57, 237, .09) !important;
}


/* ==========================================================
   9. ICONO
   El primer hijo real es <i class="material-icons">
   ========================================================== */

body#my-account.page-my-account
.links
.link-item
> i:first-child,

body#my-account.page-my-account
.links
.link-item
> .material-icons:first-child {
    width: 46px !important;
    height: 46px !important;

    min-width: 46px !important;
    min-height: 46px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 46px !important;

    margin: 0 0 15px 0 !important;
    padding: 0 !important;

    background: var(--cv-blue-soft) !important;
    background-image: none !important;

    border: 1px solid #D9DFFF !important;
    border-radius: 50% !important;

    color: var(--cv-blue) !important;

    font-size: 21px !important;
    line-height: 1 !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease,
        transform .18s ease !important;
}


/* Hover icon */
body#my-account.page-my-account
.links > a:hover
.link-item
> i:first-child,

body#my-account.page-my-account
.links > a:hover
.link-item
> .material-icons:first-child {
    background: var(--cv-blue) !important;

    border-color: var(--cv-blue) !important;

    color: #FFFFFF !important;

    transform: scale(1.04);
}


/* ==========================================================
   10. ICONOS DE MÓDULOS SVG
   ========================================================== */

body#my-account.page-my-account
.links
.link-item
svg {
    width: 21px !important;
    height: 21px !important;

    fill: currentColor !important;
    stroke: currentColor !important;
}

body#my-account.page-my-account
.links
.link-item
svg path {
    fill: currentColor !important;
}


/* ==========================================================
   11. TEXTO
   El texto puede venir directamente dentro del span
   ========================================================== */

body#my-account.page-my-account
.links
.link-item {
    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;

    color: var(--cv-text) !important;

    text-align: center !important;

    text-transform: none !important;
}


/* Si algún módulo envuelve el nombre en span */
body#my-account.page-my-account
.links
.link-item
span:not(.material-icons) {
    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    font: inherit !important;

    color: inherit !important;

    text-align: inherit !important;
}


/* Hover texto */
body#my-account.page-my-account
.links > a:hover
.link-item {
    color: var(--cv-blue) !important;
}


/* ==========================================================
   12. CERRAR SESIÓN
   En template nativo no tiene class logout
   ========================================================== */

body#my-account.page-my-account
.page-footer {
    margin-top: 34px !important;

    text-align: center !important;
}

body#my-account.page-my-account
.page-footer
.text-sm-center {
    text-align: center !important;
}

body#my-account.page-my-account
.page-footer
.text-sm-center > a {
    min-height: 42px !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    padding: 9px 22px !important;

    background: transparent !important;

    border: 1px solid #C7CEDA !important;
    border-radius: 999px !important;

    color: var(--cv-secondary) !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-decoration: none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease !important;
}

body#my-account.page-my-account
.page-footer
.text-sm-center > a:hover {
    background: var(--cv-blue-soft) !important;

    border-color: #C8D1FF !important;

    color: var(--cv-blue) !important;
}


/* ==========================================================
   13. TABLET
   ========================================================== */

@media (max-width: 1024px) {

    body#my-account.page-my-account
    .links {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 16px !important;
    }

}


/* ==========================================================
   14. MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body#my-account.page-my-account #wrapper {
        padding-top: 18px !important;
        padding-bottom: 40px !important;
    }


    body#my-account.page-my-account
    .page-header {
        margin-bottom: 22px !important;
    }


    body#my-account.page-my-account
    .page-header h1 {
        font-size: 27px !important;
    }


    body#my-account.page-my-account
    .links {
        grid-template-columns:
            1fr !important;

        gap: 10px !important;
    }


    body#my-account.page-my-account
    .links > a > .link-item,

    body#my-account.page-my-account
    .links .link-item {
        min-height: 80px !important;

        flex-direction: row !important;

        justify-content: flex-start !important;
        align-items: center !important;

        gap: 14px !important;

        padding: 15px 16px !important;

        text-align: left !important;
    }


    body#my-account.page-my-account
    .links
    .link-item
    > i:first-child,

    body#my-account.page-my-account
    .links
    .link-item
    > .material-icons:first-child {
        width: 42px !important;
        height: 42px !important;

        min-width: 42px !important;
        min-height: 42px !important;

        flex: 0 0 42px !important;

        margin: 0 !important;

        font-size: 20px !important;
    }


    body#my-account.page-my-account
    .links
    .link-item {
        font-size: 14px !important;

        text-align: left !important;
    }

}




/* ==========================================================
   COMERCIAL VACA · MI CUENTA
   FIX ACCESOS GENERADOS POR MÓDULOS
   ========================================================== */


/* ----------------------------------------------------------
   1. RESET DE LOS <li> QUE INSERTAN ALGUNOS MÓDULOS
   ---------------------------------------------------------- */

body#my-account.page-my-account
.links > li {

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    min-width: 0 !important;

    flex: none !important;

    float: none !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;

    border: 0 !important;

    box-sizing: border-box !important;
}


/* Neutralizar específicamente Bootstrap */
body#my-account.page-my-account
.links > li.col-lg-4,

body#my-account.page-my-account
.links > li.col-md-6,

body#my-account.page-my-account
.links > li.col-sm-6,

body#my-account.page-my-account
.links > li.col-xs-12 {

    width: 100% !important;
    max-width: none !important;

    flex: none !important;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;
}


/* ----------------------------------------------------------
   2. LINK DENTRO DEL LI
   ---------------------------------------------------------- */

body#my-account.page-my-account
.links > li > a {

    display: block !important;

    width: 100% !important;
    max-width: none !important;

    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color: inherit !important;

    text-decoration: none !important;

    box-sizing: border-box !important;
}


/* ----------------------------------------------------------
   3. CARD INTERNA
   ---------------------------------------------------------- */

body#my-account.page-my-account
.links > li > a > .link-item {

    width: 100% !important;
    max-width: none !important;

    min-height: 148px !important;
    height: 100% !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;

    padding: 24px 20px !important;

    background: #FFFFFF !important;

    border: 1px solid #E1E5EE !important;
    border-radius: 16px !important;

    color: #202632 !important;

    font-family: "Nunito", Arial, sans-serif !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;

    text-align: center !important;

    box-shadow:
        0 3px 12px rgba(10, 21, 71, .025) !important;

    box-sizing: border-box !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        color .18s ease !important;
}


/* ----------------------------------------------------------
   4. HOVER
   ---------------------------------------------------------- */

body#my-account.page-my-account
.links > li > a:hover > .link-item {

    border-color: #C8D1FF !important;

    color: #1C39ED !important;

    transform: translateY(-3px);

    box-shadow:
        0 10px 26px rgba(28, 57, 237, .09) !important;
}


/* ----------------------------------------------------------
   5. MOBILE
   ---------------------------------------------------------- */

@media (max-width: 767px) {

    body#my-account.page-my-account
    .links > li > a > .link-item {

        min-height: 80px !important;

        flex-direction: row !important;

        align-items: center !important;
        justify-content: flex-start !important;

        gap: 14px !important;

        padding: 15px 16px !important;

        text-align: left !important;
    }

}





/* ==========================================================
   COMERCIAL VACA · CHECKOUT
   BOTONES + LINKS + ESTADOS INTERACTIVOS
   ========================================================== */

body#checkout {
    --cv-blue: #1C39ED;
    --cv-blue-hover: #1834D9;
    --cv-blue-active: #142CC4;

    --cv-blue-soft: #EEF1FF;
    --cv-blue-border: #CBD3FF;

    --cv-navy: #0A1547;

    --cv-text: #202632;
    --cv-secondary: #5D6470;
    --cv-muted: #8A94A6;

    --cv-border: #DCE2EC;
    --cv-white: #FFFFFF;
}


/* ==========================================================
   1. LINKS GENERALES DEL CHECKOUT
   ========================================================== */

body#checkout
#checkout-personal-information-step a,

body#checkout
#checkout-addresses-step a,

body#checkout
#checkout-delivery-step a,

body#checkout
#checkout-payment-step a,

body#checkout
.checkout-step a {

    color: var(--cv-blue) !important;

    text-decoration: none !important;

    transition:
        color .18s ease !important;
}


body#checkout
.checkout-step a:hover {

    color: var(--cv-blue-hover) !important;

    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}


/* ==========================================================
   2. NAV / LOGIN / INVITADO
   ========================================================== */

body#checkout
.nav-item
.nav-link {

    color: var(--cv-secondary) !important;

    font-weight: 500 !important;

    transition:
        color .18s ease !important;
}


body#checkout
.nav-item
.nav-link:hover {

    color: var(--cv-blue) !important;
}


body#checkout
.nav-item
.nav-link.active {

    color: var(--cv-blue) !important;

    font-weight: 700 !important;
}


/* ==========================================================
   3. NÚMERO DE LOS PASOS
   ========================================================== */

body#checkout
section.checkout-step
.step-number {

    background:
        var(--cv-blue-soft) !important;

    border:
        1px solid var(--cv-blue-border) !important;

    color:
        var(--cv-blue) !important;

    box-shadow:
        none !important;
}


/* Paso activo */
body#checkout
section.checkout-step.-current
.step-number,

body#checkout
section.checkout-step.js-current-step
.step-number {

    background:
        var(--cv-blue) !important;

    border-color:
        var(--cv-blue) !important;

    color:
        #FFFFFF !important;
}


/* ==========================================================
   4. BOTONES PRIMARIOS
   Continuar, Guardar, Confirmar...
   ========================================================== */

body#checkout
.btn-primary,

body#checkout
button.btn-primary,

body#checkout
input.btn-primary,

body#checkout
.form-footer
.btn-primary,

body#checkout
.form-footer
.btn-primary.continue {

    min-height:
        46px !important;

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    padding:
        10px 24px !important;

    background:
        var(--cv-blue) !important;

    border:
        1px solid var(--cv-blue) !important;

    border-radius:
        999px !important;

    color:
        #FFFFFF !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        14px !important;

    font-weight:
        800 !important;

    line-height:
        1.2 !important;

    text-transform:
        none !important;

    box-shadow:
        none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;
}


/* Hover */
body#checkout
.btn-primary:hover,

body#checkout
button.btn-primary:hover,

body#checkout
input.btn-primary:hover,

body#checkout
.form-footer
.btn-primary:hover {

    background:
        var(--cv-blue-hover) !important;

    border-color:
        var(--cv-blue-hover) !important;

    color:
        #FFFFFF !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 7px 18px rgba(28, 57, 237, .16) !important;
}


/* Active */
body#checkout
.btn-primary:active,

body#checkout
button.btn-primary:active,

body#checkout
input.btn-primary:active {

    background:
        var(--cv-blue-active) !important;

    border-color:
        var(--cv-blue-active) !important;

    color:
        #FFFFFF !important;

    transform:
        translateY(0) !important;
}


/* Focus */
body#checkout
.btn-primary:focus,

body#checkout
button.btn-primary:focus,

body#checkout
input.btn-primary:focus {

    background:
        var(--cv-blue) !important;

    border-color:
        var(--cv-blue) !important;

    color:
        #FFFFFF !important;

    outline:
        none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .14) !important;
}


/* ==========================================================
   5. BOTONES SECUNDARIOS
   ========================================================== */

body#checkout
.btn-secondary {

    min-height:
        42px !important;

    display:
        inline-flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    padding:
        9px 20px !important;

    background:
        #FFFFFF !important;

    border:
        1px solid var(--cv-blue-border) !important;

    border-radius:
        999px !important;

    color:
        var(--cv-blue) !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-size:
        13px !important;

    font-weight:
        700 !important;

    text-transform:
        none !important;

    box-shadow:
        none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease !important;
}


body#checkout
.btn-secondary:hover {

    background:
        var(--cv-blue-soft) !important;

    border-color:
        var(--cv-blue) !important;

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   6. INPUT FOCUS
   Eliminar violeta heredado
   ========================================================== */

body#checkout
.checkout-step
.form-control:focus {

    border-color:
        var(--cv-blue) !important;

    outline:
        none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .09) !important;
}


/* ==========================================================
   7. CHECKBOXES
   ========================================================== */

body#checkout
input[type="checkbox"] {

    accent-color:
        var(--cv-blue) !important;
}


/* Checkbox visual de PrestaShop */
body#checkout
.custom-checkbox
input[type="checkbox"] + span {

    background:
        #FFFFFF !important;

    border:
        1px solid #BFC7D4 !important;
}


body#checkout
.custom-checkbox
input[type="checkbox"]:checked + span {

    background:
        var(--cv-blue) !important;

    border-color:
        var(--cv-blue) !important;
}


body#checkout
.custom-checkbox
input[type="checkbox"]:checked + span
.checkbox-checked {

    color:
        #FFFFFF !important;
}


/* Use same address */
body#checkout
#use_same_address {

    accent-color:
        var(--cv-blue) !important;
}


/* ==========================================================
   8. RADIOS
   Método de envío / pago
   ========================================================== */

body#checkout
input[type="radio"] {

    accent-color:
        var(--cv-blue) !important;
}


/* ==========================================================
   9. DIRECCIONES
   ========================================================== */

body#checkout
section.checkout-step
article.address-item {

    border:
        1px solid var(--cv-border) !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease !important;
}


/* Dirección seleccionada */
body#checkout
section.checkout-step
article.address-item.selected {

    border-color:
        var(--cv-blue) !important;

    box-shadow:
        0 0 0 2px rgba(28, 57, 237, .06) !important;
}


/* Editar / eliminar dirección */
body#checkout
.address-item
.address-footer a {

    color:
        var(--cv-blue) !important;

    font-weight:
        700 !important;
}


body#checkout
.address-item
.address-footer a:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   10. ENLACES DEL RESUMEN LATERAL
   Producto oscuro, hover azul
   ========================================================== */

body#checkout
#js-checkout-summary a {

    color:
        var(--cv-text) !important;

    text-decoration:
        none !important;
}


body#checkout
#js-checkout-summary a:hover {

    color:
        var(--cv-blue) !important;
}


/* ==========================================================
   11. PROMOCIONES / CUPONES
   ========================================================== */

body#checkout
.block-promo a,

body#checkout
.block-promo .promo-code-button,

body#checkout
#js-checkout-summary
.block-promo
.promo-name
.cart-summary-line span {

    color:
        var(--cv-blue) !important;

    font-weight:
        700 !important;

    text-decoration:
        none !important;
}


body#checkout
.block-promo a:hover,

body#checkout
.block-promo
.promo-code-button:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   12. LINKS DE TÉRMINOS / PRIVACIDAD
   ========================================================== */

body#checkout
.condition-label a,

body#checkout
.conditions-to-approve a,

body#checkout
.custom-checkbox a {

    color:
        var(--cv-blue) !important;

    font-weight:
        700 !important;

    text-decoration:
        underline !important;

    text-underline-offset:
        3px !important;
}


body#checkout
.condition-label a:hover,

body#checkout
.conditions-to-approve a:hover,

body#checkout
.custom-checkbox a:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   13. LINKS SECUNDARIOS
   Cambiar dirección, añadir dirección, editar...
   ========================================================== */

body#checkout
.add-address a,

body#checkout
.edit-address,

body#checkout
.delete-address,

body#checkout
.cancel-address {

    color:
        var(--cv-blue) !important;

    font-family:
        "Nunito",
        Arial,
        sans-serif !important;

    font-weight:
        700 !important;

    text-decoration:
        none !important;
}


body#checkout
.add-address a:hover,

body#checkout
.edit-address:hover,

body#checkout
.delete-address:hover,

body#checkout
.cancel-address:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   14. ENLACES DEL LOGIN DENTRO DEL CHECKOUT
   ========================================================== */

body#checkout
#login-form
.forgot-password a,

body#checkout
#checkout-login-form a,

body#checkout
#checkout-guest-form a {

    color:
        var(--cv-blue) !important;

    font-weight:
        700 !important;

    text-decoration:
        none !important;
}


body#checkout
#login-form
.forgot-password a:hover,

body#checkout
#checkout-login-form a:hover,

body#checkout
#checkout-guest-form a:hover {

    color:
        var(--cv-blue-hover) !important;
}


/* ==========================================================
   15. ICONOS DENTRO DE LINKS
   ========================================================== */

body#checkout
a
.material-icons {

    color:
        currentColor !important;
}


/* ==========================================================
   16. DISABLED
   ========================================================== */

body#checkout
.btn-primary:disabled,

body#checkout
.btn-primary.disabled,

body#checkout
button:disabled {

    background:
        #D9DDE7 !important;

    border-color:
        #D9DDE7 !important;

    color:
        #8A94A6 !important;

    opacity:
        1 !important;

    cursor:
        not-allowed !important;

    transform:
        none !important;

    box-shadow:
        none !important;
}


/* ==========================================================
   17. MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body#checkout
    .form-footer
    .btn-primary,

    body#checkout
    .form-footer
    button.btn-primary {

        width:
            100% !important;
    }

}




/* ==========================================================
   COMERCIAL VACA · CHECKOUT
   FIX DEFINITIVO BOTONES HOVER / ACTIVE / FOCUS
   ========================================================== */


/* NORMAL */
html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary,

html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary.continue,

html body#checkout
section.checkout-step
form
.form-footer
a.btn.btn-primary {

    background: #1C39ED !important;
    background-color: #1C39ED !important;

    border-color: #1C39ED !important;

    color: #FFFFFF !important;

    box-shadow: none !important;
}


/* HOVER */
html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary:hover,

html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary.continue:hover,

html body#checkout
section.checkout-step
form
.form-footer
a.btn.btn-primary:hover {

    background: #1834D9 !important;
    background-color: #1834D9 !important;

    border-color: #1834D9 !important;

    color: #FFFFFF !important;

    box-shadow:
        0 7px 18px rgba(28, 57, 237, 0.16) !important;

    transform: translateY(-1px) !important;
}


/* ACTIVE */
html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary:active,

html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary.continue:active,

html body#checkout
section.checkout-step
form
.form-footer
a.btn.btn-primary:active {

    background: #142CC4 !important;
    background-color: #142CC4 !important;

    border-color: #142CC4 !important;

    color: #FFFFFF !important;

    box-shadow: none !important;

    transform: translateY(0) !important;
}


/* FOCUS */
html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary:focus,

html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary.continue:focus,

html body#checkout
section.checkout-step
form
.form-footer
a.btn.btn-primary:focus {

    background: #1C39ED !important;
    background-color: #1C39ED !important;

    border-color: #1C39ED !important;

    color: #FFFFFF !important;

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, 0.14) !important;
}


/* FOCUS + HOVER */
html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary:focus:hover,

html body#checkout
section.checkout-step
form
.form-footer
button.btn.btn-primary.continue:focus:hover {

    background: #1834D9 !important;
    background-color: #1834D9 !important;

    border-color: #1834D9 !important;

    color: #FFFFFF !important;
}




/* ==========================================================
   COMERCIAL VACA · MODAL WISHLIST / LOGIN
   Botones
   ========================================================== */


/* ----------------------------------------------------------
   BOTÓN SECUNDARIO · CANCELAR
   ---------------------------------------------------------- */

.wishlist-modal .modal-footer .btn-secondary,
.wishlist-modal .modal-footer .modal-cancel,
.wishlist-login .modal-footer .btn-secondary,
.wishlist-login .modal-footer .modal-cancel {

    min-height: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 10px 22px !important;

    background: #FFFFFF !important;
    background-color: #FFFFFF !important;

    border: 1px solid #CBD3FF !important;
    border-radius: 999px !important;

    color: #1C39ED !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;

    text-transform: none !important;

    box-shadow: none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        color .18s ease !important;
}


.wishlist-modal .modal-footer .btn-secondary:hover,
.wishlist-modal .modal-footer .modal-cancel:hover,
.wishlist-login .modal-footer .btn-secondary:hover,
.wishlist-login .modal-footer .modal-cancel:hover {

    background: #EEF1FF !important;
    background-color: #EEF1FF !important;

    border-color: #1C39ED !important;

    color: #1834D9 !important;
}


/* ----------------------------------------------------------
   BOTÓN PRIMARIO · INICIAR SESIÓN
   ---------------------------------------------------------- */

.wishlist-modal .modal-footer .btn-primary,
.wishlist-login .modal-footer .btn-primary,
.wishlist-modal .modal-footer button[type="submit"],
.wishlist-login .modal-footer button[type="submit"] {

    min-height: 46px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 10px 24px !important;

    background: #1C39ED !important;
    background-color: #1C39ED !important;

    border: 1px solid #1C39ED !important;
    border-radius: 999px !important;

    color: #FFFFFF !important;

    font-family: "Nunito", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;

    text-transform: none !important;

    box-shadow: none !important;

    transition:
        background-color .18s ease,
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease !important;
}


.wishlist-modal .modal-footer .btn-primary:hover,
.wishlist-login .modal-footer .btn-primary:hover,
.wishlist-modal .modal-footer button[type="submit"]:hover,
.wishlist-login .modal-footer button[type="submit"]:hover {

    background: #1834D9 !important;
    background-color: #1834D9 !important;

    border-color: #1834D9 !important;

    color: #FFFFFF !important;

    transform: translateY(-1px);

    box-shadow:
        0 7px 18px rgba(28, 57, 237, .16) !important;
}


/* ----------------------------------------------------------
   FOCUS
   ---------------------------------------------------------- */

.wishlist-modal .modal-footer .btn-primary:focus,
.wishlist-login .modal-footer .btn-primary:focus,
.wishlist-modal .modal-footer .btn-secondary:focus,
.wishlist-login .modal-footer .btn-secondary:focus {

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .12) !important;
}



.modal-footer button.modal-cancel.btn.btn-secondary:hover {
    background-color: #2A6038 !important;
}

.modal-footer a.btn.btn-primary:hover {
    background-color: #2A6038 !important;
}


/* ==========================================================
   COMERCIAL VACA · WISHLIST LOGIN MODAL
   FIX EXACTO NORMAL / HOVER / FOCUS / ACTIVE
   ========================================================== */


/* ==========================================================
   CANCELAR · NORMAL
   ========================================================== */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> button.modal-cancel.btn.btn-secondary {

    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;

    border: 1px solid #CBD3FF !important;

    color: #1C39ED !important;

    border-radius: 999px !important;

    box-shadow: none !important;

    transform: none !important;
}


/* CANCELAR · HOVER */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> button.modal-cancel.btn.btn-secondary:hover {

    background: #EEF1FF !important;
    background-color: #EEF1FF !important;
    background-image: none !important;

    border-color: #1C39ED !important;

    color: #1834D9 !important;

    box-shadow: none !important;

    transform: none !important;

    filter: none !important;
}


/* CANCELAR · FOCUS */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> button.modal-cancel.btn.btn-secondary:focus {

    background: #FFFFFF !important;
    background-color: #FFFFFF !important;

    border-color: #1C39ED !important;

    color: #1C39ED !important;

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .12) !important;
}


/* CANCELAR · ACTIVE */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> button.modal-cancel.btn.btn-secondary:active {

    background: #E4E8FF !important;
    background-color: #E4E8FF !important;

    border-color: #1C39ED !important;

    color: #142CC4 !important;

    box-shadow: none !important;
}


/* ==========================================================
   INICIAR SESIÓN · NORMAL
   ========================================================== */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> a.btn.btn-primary {

    background: #1C39ED !important;
    background-color: #1C39ED !important;
    background-image: none !important;

    border: 1px solid #1C39ED !important;

    color: #FFFFFF !important;

    border-radius: 999px !important;

    box-shadow: none !important;

    text-decoration: none !important;

    filter: none !important;
}


/* INICIAR SESIÓN · HOVER */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> a.btn.btn-primary:hover {

    background: #1834D9 !important;
    background-color: #1834D9 !important;
    background-image: none !important;

    border-color: #1834D9 !important;

    color: #FFFFFF !important;

    transform: translateY(-1px) !important;

    box-shadow:
        0 7px 18px rgba(28, 57, 237, .16) !important;

    filter: none !important;

    text-decoration: none !important;
}


/* INICIAR SESIÓN · FOCUS */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> a.btn.btn-primary:focus {

    background: #1C39ED !important;
    background-color: #1C39ED !important;

    border-color: #1C39ED !important;

    color: #FFFFFF !important;

    outline: none !important;

    box-shadow:
        0 0 0 3px rgba(28, 57, 237, .13) !important;
}


/* INICIAR SESIÓN · ACTIVE */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> a.btn.btn-primary:active {

    background: #142CC4 !important;
    background-color: #142CC4 !important;

    border-color: #142CC4 !important;

    color: #FFFFFF !important;

    transform: translateY(0) !important;

    box-shadow: none !important;
}


/* ==========================================================
   COMBINACIONES QUE BOOTSTRAP PUEDE GENERAR
   ========================================================== */

body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> button.modal-cancel.btn.btn-secondary:hover:focus {

    background: #EEF1FF !important;
    background-color: #EEF1FF !important;

    border-color: #1C39ED !important;

    color: #1834D9 !important;
}


body
.wishlist-login
.wishlist-modal.modal
.modal-footer
> a.btn.btn-primary:hover:focus {

    background: #1834D9 !important;
    background-color: #1834D9 !important;

    border-color: #1834D9 !important;

    color: #FFFFFF !important;
}/* End custom CSS */