/* Add and Cotizar use the company's Theme Builder colors. No disponible remains template-specific. */
html body .addCart,
html body .carousel-add-action,
html body .featured__item a.abtn,
html body .presentation_list_p .presentation-actions .addCart,
html body .presentation_list_p .btt_abt .addCart,
html body .presentation_list_p .featured__filter.item_card_presentation .presentation-action-primary .addCart,
html body .presentation_list_p .featured__filter.item_card_presentation .presentation-actions .addCart,
html body .presentation_list_p > .featured__filter.item_card_presentation .presentation-actions .addCart,
html body .presentation_list_p .featured__filter.item_card_presentation .featured__item__pic__hover.btt_abt .addCart,
html body .presentation_list_p .item_card_presentation .featured__item__pic__hover .addCart,
html body .featured__filter.item_card_presentation .featured__item__pic__hover.btt_abt .addCart,
html body .nested-products .item_card_presentation .featured__item__pic__hover.btt_abt .addCart,
html body .product__details__text .product-add-action.addCart,
html body .featured__filter .btns-w-pres .carousel-add-action,
html body .promotion__slider .btns-w-pres .carousel-add-action,
html body .categories__slider .btns-w-pres .carousel-add-action,
html body .detail_card_relation .btns-w-pres .carousel-add-action,
html body .partner__items_res .featured__item__pic__hover .addCart,
html body .detail_card_relation .addCart {
    background: var(--mdi-action-add-bg, var(--primary)) !important;
    border: 2px solid var(--mdi-action-add-border, var(--primary)) !important;
    color: var(--mdi-action-add-text, var(--white)) !important;
}

html body .addCart i,
html body .addCart span,
html body .carousel-add-action i,
html body .carousel-add-action span,
html body .featured__item a.abtn i,
html body .featured__item a.abtn span,
html body .car_prod_details,
html body .presentation-actions .addCart i,
html body .presentation-actions .addCart span,
html body .presentation_list_p .featured__filter.item_card_presentation .presentation-actions .addCart span,
html body .featured__filter.item_card_presentation .featured__item__pic__hover.btt_abt .addCart i,
html body .nested-products .item_card_presentation .featured__item__pic__hover.btt_abt .addCart i,
html body .partner__items_res .addCart i,
html body .promotion__slider .carousel-add-action i,
html body .categories__slider .carousel-add-action i,
html body .detail_card_relation .addCart i {
    color: var(--mdi-action-add-text, var(--white)) !important;
}

html body .addQuote,
html body .quote-outline-action,
html body .carousel-quote-action,
html body .presentation-actions .carousel-quote-action,
html body .presentation-action-quote .carousel-quote-action,
html body .presentation_list_p > .featured__filter.item_card_presentation .presentation-action-quote .carousel-quote-action,
html body .presentation_list_p > .featured__filter.item_card_presentation .presentation-actions .carousel-quote-action,
html body .featured__filter.item_card_presentation .featured__item__pic__hover.btt_abt .addQuote,
html body .nested-products .item_card_presentation .featured__item__pic__hover.btt_abt .addQuote,
html body .featured__filter .btns-w-pres .carousel-quote-action,
html body .promotion__slider .btns-w-pres .carousel-quote-action,
html body .categories__slider .btns-w-pres .carousel-quote-action,
html body .detail_card_relation .btns-w-pres .carousel-quote-action,
html body .featured__item__pic__hover .addQuote {
    background: var(--mdi-action-quote-bg, var(--white)) !important;
    border: 2px solid var(--mdi-action-quote-border, var(--primary)) !important;
    color: var(--mdi-action-quote-text, var(--primary)) !important;
}

html body .addQuote i,
html body .addQuote span,
html body .quote-outline-action i,
html body .quote-outline-action span,
html body .carousel-quote-action i,
html body .carousel-quote-action span,
html body .product__details__text .primary-btn.btn_conact.quote-outline-action,
html body .product__details__text .quote-action-list .btn_shop_car {
    color: var(--mdi-action-quote-text, var(--primary)) !important;
}

/* Shared centering for the "No disponible" button and the discount badge in every template. */
html body .btn_fake {
    align-items: center !important;
    justify-content: center !important;
    display: flex;
    text-align: center !important;
}

html body .btn_fake > span,
html body .btn_fake > i {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    height: 100% !important;
    justify-content: center !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    width: 100% !important;
}

html body .botton_prom {
    align-items: center !important;
    display: inline-flex !important;
    justify-content: center !important;
    line-height: 1 !important;
    padding: 0 !important;
    text-align: center !important;
    vertical-align: middle;
    white-space: nowrap;
}

html body .featured__item__pic > .botton_prom {
    left: 10px;
    position: absolute;
    right: auto;
    top: 10px;
    z-index: 10;
}

/* Product card favorite (all templates): circle with the Theme Builder add color, darker on hover.
   --mdi-action-add-bg-hover is computed server-side (and by the Theme Builder preview);
   color-mix is the fallback when only the template's --primary is available. */
html body .addFvoriteHover {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

html body .addFvoriteHover > .faHeart {
    align-items: center !important;
    background: var(--mdi-action-add-bg, var(--primary)) !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    color: var(--mdi-action-add-text, var(--white, #ffffff)) !important;
    display: inline-flex !important;
    font-size: 16px !important;
    height: 36px !important;
    justify-content: center !important;
    line-height: 1 !important;
    padding: 0 !important;
    transition: background-color .2s ease;
    width: 36px !important;
}

html body .addFvoriteHover:hover > .faHeart,
html body .addFvoriteHover > .faHeart:hover {
    background: var(--mdi-action-add-bg-hover, color-mix(in srgb, var(--mdi-action-add-bg, var(--primary)) 80%, #000000)) !important;
    color: var(--mdi-action-add-text, var(--white, #ffffff)) !important;
}