:root{
    /*fonts*/
    font-size: 14px;
    --font-body-family: 'Quicksand', sans-serif;
    --font-title-family: 'Quicksand', sans-serif;

    /*NO USAR + DE 3 TIPOS, DEBEN SER LAS MISMAS QUE LAS CARGADAS CON GOOGLE*/
    --font-bold: 600;
    --font-regular: 400;
    --font-light: 300;
    --body-txt-default-color: #403f3f;
    --highlight-color: #d1b346;
    
     /* primary */
    --primary-color: #000000;
    --primary-contrast: #fff;
    --primary-border: #000000;
    
    /* primary -hover */
    --primary-hover-color: #000000c7;
    --primary-hover-contrast: #fff;
    --primary-hover-border: #000000c7;
    
    /* secondary */
    --secondary-color: #d1b346;
    --secondary-contrast:  #fff;
    --secondary-border: #d1b346;
    
    /* secondary hover */
    --secondary-hover-color: #d1b346c7;
    --secondary-hover-contrast: #fff;
    --secondary-hover-border: #d1b346c7;
    
    /* danger */
    --danger-color: #818182;
    --danger-contrast: #ffffff;
    
    /* danger hover */
    --danger-hover-color:#818182c7;
    --danger-hover-contrast: #fff;
    
    /* success */
    --success-color: #96eb83;
    --success-contrast: rgba(0,0,0,0.8);
    
    /* success hover */
    --success-hover-color:#77bf67;
    --success-hover-contrast: rgba(0,0,0,0.8);
    
    /* elements */
    --element-bg: #d5e9f466;
    --collection-brand-color: #B2B2B2;
    --collection-brand-bg: transparent;
    
     /* Border radius */
    --default-border-radius: .25rem;
    --product-collection-border-radius: .5rem;
    
    /* botones */
    --btn-border:1px solid;
    --btn-border-radius: var(--default-border-radius);
    
    
   /* migas de pan*/
    --breadcrumb-bg-color: #fafafa;
   
   /* forms */
    --input-bg-color: #fff;
    --input-border-color: #ced4da;
    --input-txt-color: var(--body-txt-default-color);
   
    /*Cabecera color en home sobre el slider */
    --header-bg-home: linear-gradient(to bottom, rgb(250 246 240) 0, rgb(232 227 220 / 44%) 100%, rgba(0, 0, 0, 0) 100%);
    --cart-items-bg: rgb(214 187 90);
    --cart-items-color: white;
    --cart-items-border: 3px solid white;
    
    
    /* logo cabecera */
    --logo-width:200px;
    --logo-height:80px;
    
    /* cabecera header en otras pagina y position fixed */
    --header-bg: rgb(250 246 240);
    --header-txt-color: white;
    
    /* cabecera menÃº */
    --header-navbar-bg-color: transparent;
    --header-navbar-mobile-bg-color: #ffffff;
    
    /* iconos */
    --icon-header-bg: #ffffff73;
    --icon-header-color: #000000;
    /*hover */
    --icon-header-hover-bg: #f2f2f2;
    --icon-header-hover-color: rgb(0 0 0);
    
    
    
    /* lv1 */
    --lv1-txt-color: #000000;
    --lv1-bg-color: transparent;
    --lv1-size: 16px;
    
    /* lv1 hover */
    --lv1-hover-txt-color: #000000ba;
    
    /* lv2 */
    --lv2-txt-color: #1D1D1C;
    --lv2-bg-color: transparent;
    --lv2-size: .85rem;
    
    /* lv2 hover */
    --lv2-hover-txt-color: #000000ba;
    --lv2-hover-bg-color: transparent;
    
    /* lv3 */
    --lv3-txt-color: #1d1d1b;
    --lv3-bg-color: transparent;
    --lv3-size: .85rem;
    
    /* lv3 hover */
    --lv3-hover-txt-color: #000000ba;
    --lv3-hover-bg-color: transparent;
    --dropdown-menu-border-radius: 1rem;
    --menu-title-size: var(--lv3-size);
    --menu-title-weight: var(--font-bold);
    --menu-title-color: #545454;
    
    
    /*Home title*/
    --title-weight: var(--font-bold);
    --title-transform: capitalize;
    
    /* home titles */
    --home-title-size: 2rem;
    --home-title-color: #505050;
    --home-title-decoration-color: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgb(209 179 70) 50%, rgba(255, 255, 255, 1) 100%);
    
    /* product */
    --prod-title-weight:var(--font-regular);
    --prod-title-size: 2rem;
    
    
    /* descuentos */
    --discount-bg-color: #d1b346;
    --discount-txt-color: white;
    
    /* footer */
    --footer-bg-top-color: #d9bb61;
    --footer-bg-color: #faf6f0;
    --footer-txt-color: white;
    --footer-link-txt-color: #000000;
    --footer-link-hover-txt-color: #000000c7;
    
    /* facebook */
    --chat-facebook-bg-color: #1877f2;
    --chat-facebook-txt-color: white;
    
    /* facebook hover */
    --chat-facebook-hover-bg-color: rgb(23,113,230);
    --chat-facebook-hover-txt-color: white;
    
    /* whatsapp */
    --chat-whatsapp-bg-color:#25D366;
    --chat-whatsapp-txt-color: white;
    
    /* whatsapp hover */
    --chat-whatsapp-hover-bg-color:#25D366;
    --chat-whatsapp-hover-txt-color:white;
    
    /* banners */
    --banner-hover-bg-color:rgba(0,0,0,0.6);
    --banner-hover-txt-color: #fff;
    --product-border-radius: 10px;
    
    /* alert */
    --alert-bg:#666;
    --alert-color:white;

    /********************************************************************
    Modal Suscripción
    *********************************************************************/ 
    /* Variables para el título del modal de suscripción */
    --suscripcion-titulo-font-size: 1.8rem;
    --suscripcion-titulo-font-weight: var(--font-bold);
    --suscripcion-titulo-background: linear-gradient(45deg, #d4b24c, #d4b24c94);
    --suscripcion-titulo-margin-bottom: 15px;

    /* Variables para el texto del modal de suscripción */
    --suscripcion-texto-font-size: 1.1rem;
    --suscripcion-texto-line-height: 1.6;
    --suscripcion-texto-color: var(--body-txt-default-color);

    /* Variables para el botón de suscripción */
    --suscripcion-boton-padding: 12px 30px;
    --suscripcion-boton-margin: 15px auto;
    --suscripcion-boton-font-weight: bold;
    --suscripcion-boton-border-radius: 25px;
    --suscripcion-boton-background: linear-gradient(45deg, #d4b24c, #d4b24c94);
    --suscripcion-boton-border: none;
    --suscripcion-boton-color: white;
    --suscripcion-boton-text-transform: uppercase;
    --suscripcion-boton-letter-spacing: 1px;
    --suscripcion-boton-transition: transform 0.2s ease, box-shadow 0.2s ease;

    /********************************************************************
    Pop up última compra
    *********************************************************************/
    --popup-bg-color: rgba(0, 0, 0, 0.7);
    --popup-text-color: white;
    --popup-text-price-color: white;
    --popup-font-family: var(--font-body-family);
    --popup-message-size: 14px;
    --popup-product-name-size: 14px;
    --popup-time-size: 12px;
    --popup-price-size: 14px;
}
/* toda slider */
.slick-slider{
    --slider-btn-color: black;
    --slider-btn-color-active: black;
    --slider-dots-width:.5rem;
    --slider-dots-height:.5rem;
    --slider-dots-bg: var(--secondary-color);
    --slider-dots-bg-active: var(--secondary-contrast);
    --slider-dots-op:1;
    --slider-dots-border-size: 4px;
    --slider-dots-border-color-active: var(--primary-color);
    --slider-arrow-color: var(--primary-color);
    --slider-arrow-hover-color: var(--primary-contrast);
    --slider-arrow-hover-bg: var(--primary-color);
    --slider-arrow-border-radius: .25rem;
}
/* toda coleccion NO slider */
.bs-collection{
    --gap: 1rem;
    --cols-xl:4;            /* columnas sin slider >1200 */
    --cols-lg:3;            /* columnas sin slider >992 */
    --cols-md:3;            /* columnas sin slider >768 */
    --cols-sm:2;            /* columnas sin slider >576 */
    --cols:2;
}



