:root {
    --cz-accordion-btn-icon-yellow: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23D29C37' viewBox='0 0 24 24'%3E%3Cpath d='M3.8 7.9c.4-.4 1.1-.4 1.5 0l6.7 6.7 6.7-6.7c.4-.4 1.1-.4 1.5 0s.4 1.1 0 1.5l-7.4 7.4c-.4.4-1.1.4-1.5 0L3.8 9.4c-.5-.3-.5-1 0-1.5'/%3E%3C/svg%3E");
}


body {
    font-family: "Inter", sans-serif !important;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
    font-family: "Quicksand", sans-serif !important;
}

h1, .h1 {
    font-size: 2.25rem !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: normal!important;
}

.h5, h5 {
    font-size: 1.25rem !important;
}

label {
    font-family: "Quicksand", sans-serif !important;
    color: #344026 !important;
}


.dbm-bg-green {
    background-color: #344026 !important;
}

.dbm-bg-green-light {
    background-color: #728c54 !important;
}

.dbm-green-light-color {
    color: #728c54 !important;
}

.dbm-bg-yellow {
    background-color: #d29c37 !important;
}

.dbm-bg-white-green {
    background-color: #f9fafa !important;
}

.dbm-bg-black-green {
    background-color: #151A0F;
}

.dbm-bg-black-home {
    background-color: #1B1F22 !important;
}

.dbm-bd-soft-white-green {
    background-color: #F8FAF7 !important;
}


.dbm-filter {
    border: 1px solid #C0C6B9 !important;
    background-color: #FFFFFF !important;
}

.dbm-filter.show,
.dbm-filter:focus {
    border: 1px solid #344026 !important;
}


.dbm-text-yellow {
    color: #d29c37 !important;
}

.dbm-text-green {
    color: #344026 !important;
}

.dbm-text-green-light {
    color: #728c54 !important;
}

.dbm-text-pastel-green {
    color: #C0C6B9 !important;
}

.dbm-text-black-green {
    color: #151A0F;
}

.dbm-text-dark {
    color: #1B1F22;
}

.dbm-link-green {
    color: #344026 !important;
}

.dbm-link-dark-green {
    color: #151A0F !important;
}

.dbm-link-dark-green:hover {
    color: #D6A549 !important;
}

.dbm-link-green:hover {
    color: #728C54 !important;
}

.dbm-link-yellow {
    color: #D6A549 !important;
}

.dbm-link-yellow:hover {
    color: #151A0F !important;
}

.dbm-button-yellow {
    color: #d29c37 !important;
    border: 2.5px solid #d29c37 !important;
    font-family: "Quicksand", sans-serif !important;
    text-decoration: none !important;
}

.dbm-button-yellow:hover {
    background-color: #d29c37 !important;
    color: #f8faf7 !important;
}

.dbm-button-pastel-green {
    color: #C0C6B9 !important;
    border: 2.5px solid #C0C6B9 !important;
    font-family: "Quicksand", sans-serif !important;
    text-decoration: none !important;
}

.dbm-button-pastel-green:hover {
    background-color: #C0C6B9 !important;
    color: #f8faf7 !important;
}

.dbm-button-green-light {
    color: #728c54 !important;
    border-color: #728c54 !important;
}

/* Product page buttons layout - desktop default */
.product-buttons-container {
    display: flex;
    gap: 1rem;
    width: 100%;
}

.product-buttons-container .buy-button button,
.product-buttons-container .explore-button a,
.product-buttons-container .explore-button button,
.product-buttons-container .wishlist-button button {
    border-radius: 8px;
    height: 48px;
}

.product-buttons-container .wishlist-button button {
    width: 48px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Product page mobile buttons layout */
@media (max-width: 767.98px) {
    .product-buttons-container {
        flex-direction: column;
        gap: 1rem;
    }

    /* Buy button styling */
    .product-buttons-container .buy-button {
        width: 100%;
    }

    .product-buttons-container .buy-button button {
        width: 100%;
        height: 56px;
        font-size: 18px;
    }

    /* Second row with explore and wishlist */
    .product-buttons-container .buttons-row {
        display: flex;
        gap: 1rem;
        width: 100%;
    }

    /* Explore button styling */
    .product-buttons-container .buttons-row .explore-button {
        flex: 1;
    }

    .product-buttons-container .buttons-row .explore-button a,
    .product-buttons-container .buttons-row .explore-button button {
        width: 100%;
        height: 56px;
        font-size: 18px;
        white-space: nowrap;
    }

    /* Wishlist button styling */
    .product-buttons-container .buttons-row .wishlist-button button {
        width: 56px;
        height: 56px;
    }
}


.navbar {
    box-shadow: 0px 2px 4px 0px rgba(27, 31, 34, 0.1) !important;
}

.navbar-nav > .nav-item > .nav-link.text-decoration-none::before {
    content: none !important;
    background-color: transparent !important;
}

.navbar-nav .nav-link {
    padding: 12px 24px !important;
    border-radius: 4px !important;
}

.navbar-nav .nav-link.active {
    background-color: #728c54 !important;
    color: #fff !important;
}

.navbar-nav .nav-link:hover {
    background-color: #728c54 !important;
    color: #fff !important;
}

.navbar-brand {
    top: 50% !important;
    border-radius: 50% !important;
    box-shadow: 0px 1px 3px 0px rgba(27, 31, 34, 0.3) !important;
}

.navbar-toggler {
    margin-left: auto !important;
}

.navbar-brand img {
    transition: transform 0.85s ease;
}

.navbar-brand img:hover {
    transform: rotate(360deg);
}



.dbm-footer {
    color: #ffffff !important;
}

.dbm-footer a {
    color: #ffffff !important;
}

.dbm-footer-top {
    position: relative !important;
    border-bottom: 1px dashed #d29c37 !important;
    box-shadow: 1px 0px 2px rgba(16, 34, 40, 0.3) !important;
}

.dbm-footer-top::before {
    content: "" !important;
    position: absolute !important;
    top: 10px !important;
    left: 0 !important;
    right: 0 !important;
    border-top: 1.3px dashed #728c54 !important;
}

.dbm-footer .accordion-button,
.dbm-footer .accordion-button:not(.collapsed) {
    color: #d29c37 !important;
}

.dbm-footer-top li a:hover {
    color: #d29c37 !important;
    text-decoration: underline !important;
}

.dbm-footer-bottom li a:hover {
    color: #344026 !important;
    text-decoration: underline !important;
}

.dbm-footer .accordion-button:after {
    background-image: var(--cz-accordion-btn-icon-yellow) !important;
}


.dbm-cart-counter {
    background-color: #D29C37 !important;
    color: #344026 !important;
}

.social-icons .circle {
    margin-right: 10px !important;
    width: 40px !important;
    height: 40px !important;
    border: 2px dotted #D29C37 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #D29C37 !important;
}

.social-icons .circle:hover, .social-icons .circle:hover > svg path {
    fill: #344026 !important;
    color: #344026 !important;
    background-color: #D29C37 !important;
}

.dbm-age-filters .rounded {
    background-color: #fff !important;
    color: #151A0F !important;
    border: 2px dashed #151A0F !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.dbm-age-filters .rounded:hover,
.dbm-age-filters .rounded.active {
    background-color: #D29C37 !important;
    border: 2px dashed #D29c37 !important;
    color: #fff !important;
}

.pagination .active, .active>.page-link, .page-link.active {
    background-color: #D29C37 !important;
    color: #fff !important;
    border: 1px solid #D29C37 !important;
    border-radius: 8px !important;
}

.pagination .page-item:not(.active, .arrow) .page-link {
    color: #C0C6B9 !important;
    background-color: #fff !important;
    border: 1.5px dashed #C0C6B9 !important;
    border-radius: 8px !important;
}

.pagination .page-item:hover:not(.active, .arrow) .page-link {
    color: #151A0F !important;
    border: 1.5px dashed #151A0F !important;
}

.dbm-border-dashed {
    border-style: dashed !important;
    border: 1px dashed #344026 !important;
    padding: 20px !important;
    border-radius: 6px !important;
}


/**
Blog styles
 */
.btn.dbm-arrow-blog {
    --cz-btn-size: 1.5rem !important;
    padding: 4px !important;
}

.btn.dbm-arrow-blog:hover {
    background-color: #728c54 !important;
    border-color: #728c54 !important;
    color: #fff !important;
}

.dbm-blog-header {
    display: flex;
    background-image: url(../img/blog/main-image-blog.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    height: 47vh;
}

/* Ocultar la imagen en dispositivos con un ancho máximo de 1024px (tablets y móviles) */
@media screen and (max-width: 1024px) {
    .dbm-blog-header {
        background-image: url(../img/blog/main-image-blog-mobile.png);
    }
}

/**
Blog mt
 */
.custom-blog-mt {

}


/* Tarjeta del post */
/* Efecto hover en la tarjeta */
.post-card {
    border: none;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease-in-out, background-color 0.3s ease-in-out;
    background-color: #f9fafa; /* Color base */
}

.post-card:hover {
    transform: translateY(-3px);
    background-color: #F2F5F0 !important; /* Asegura que se aplique */
}


.post-card:hover {
    transform: translateY(-3px);
    background-color: #F2F5F0;
}

/* Imagen del post */
.post-card .card-img-top {
    object-fit: cover;
    height: 200px; /* Ajusta según la proporción deseada */
}

/* Enlace del título */
.post-title-link {
    text-decoration: none;
    color: #212529;
}

.post-title-link:hover {
    text-decoration: underline;
}

/* Botones de categoría */
.post-category-btn {
    background-color: #344026;
    color: #F9FAFA;
    /* padding: 6px 12px;
    font-size: 14px;
    border-radius: 6px; */
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.post-category-btn:hover {
    background-color: #728C54; /* Color de hover solicitado */
    color: #F9FAFA;
}

/* Ajusta el margen superior de la sección de categorías para mayor separación */
.post-card .post-categories {
    margin-top: 3.5rem; /* Aumenta el espacio entre el contenido y las etiquetas */
}

/* Ajusta el padding vertical de los botones de categoría */
.post-category-btn {
    background-color: #344026;
    color: #F9FAFA;
    /* padding: 10px 16px; Se aumenta el padding */
    font-size: 14px;
    border-radius: 6px;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

/* Estilo al pasar el cursor */
.post-category-btn:hover {
    background-color: #728C54; /* Color de hover solicitado */
    color: #F9FAFA;
}

/* Estilos para el blog single */
.post-content blockquote {
    border-left: 4px solid #D29C37;
    padding-left: 1.5rem;
    margin: 2rem 0;
    font-style: italic;
    color: #344026;
    background-color: #F9FAFA;
    padding: 1.5rem;
    border-radius: 6px;
}

.post-content blockquote p {
    margin-bottom: 0;
    font-size: 1.1rem;
    line-height: 1.6;
}

/* Additional styles for blog single page */
.post-content {
    font-size: 1rem;
    line-height: 1.7;
    color: #333;
}

.post-content p {
    margin-bottom: 1.5rem;
}

.post-content .fw-bold {
    color: #344026;
}

/* Style for the share button */
.post-content + .d-flex .btn-primary {
    background-color: #344026;
    border-color: #344026;
    transition: background-color 0.3s ease;
}

.post-content + .d-flex .btn-primary:hover {
    background-color: #728C54;
    border-color: #728C54;
}

/* Recommended posts section */
section h2.h3.mb-5 {
    position: relative;
    display: inline-block;
    margin-bottom: 2rem !important;
    padding-bottom: 1rem;
}

section h2.h3.mb-5:after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 60px;
    height: 3px;
    background-color: #D29C37;
    border-radius: 2px;
}

/* En móviles, cambia a mt-5 */
@media screen and (max-width: 768px) {
    .custom-blog-mt {
        margin-top: 3rem;
    }
}

/**
End Blog
 */

.dbm-checkout-item {
    border: 1px solid #C0C6B9 !important;
}

.dbm-border-gold {
    width: 60px;
    height: 4px;
    background-color: #D4A157;
    border-radius: 2px;
}

.dbm-border-gold-auto {
    border-radius: 2px;
    border-bottom: 4px solid #D4A157 !important;
    width: fit-content !important;
}


.dbm-border-green {
    width: 60px;
    height: 4px;
    background-color: #C0C6B9;
    border-radius: 2px;
}

.dbm-border-green-auto {
    border-radius: 2px;
    border-bottom: 4px solid #C0C6B9 !important;
    width: fit-content !important;
}

.ratio {
    overflow: hidden !important;
  }

.hover-effect-target {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.hover-effect-target:hover {
    transform: scale(1.1) !important;
}

.dbm-catalog-product-link
{
    font-weight: bold !important;
}

.dbm-catalog-product-link:hover
{
    color: #728C54 !important;
}

.dbm-image-list {
    border: 1px dashed #728C54 !important;
}


.steps {
    --tblr-steps-color: #728C54;
    --tblr-steps-inactive-color: #dce1e7;
    --tblr-steps-dot-size: 2rem;
    --tblr-steps-border-width: 2px;
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
}

.step-item {
    position: relative;
    flex: 1 1 0;
    min-height: 1rem;
    margin-top: 0;
    color: inherit;
    text-align: center;
    cursor: default;
    padding-top: calc(var(--tblr-steps-dot-size));
}
a.step-item {
    cursor: pointer;
}
a.step-item:hover {
    color: inherit;
}

.step-item:after, .step-item:before {
    background: var(--tblr-steps-color);
}
.step-item:not(:last-child):after {
    position: absolute;
    left: 50%;
    width: 100%;
    content: "";
    transform: translateY(-50%);
}
.step-item:after {
    top: calc(var(--tblr-steps-dot-size) * 0.5);
    height: var(--tblr-steps-border-width);
}
.step-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    box-sizing: content-box;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100rem;
    transform: translateX(-50%);
    color: #ffffff;
    width: var(--tblr-steps-dot-size);
    height: var(--tblr-steps-dot-size);

    border: 2px solid #728C54 !important;
    background-color: #ffffff !important;
    color: #728C54 !important;
}
.step-item.active {
    font-weight: 600;
}
.step-item.active:after {
    background: var(--tblr-steps-inactive-color);
}
.step-item.active ~ .step-item {
    color: var(--tblr-disabled-color);
}
.step-item.active ~ .step-item:after, .step-item.active ~ .step-item:before {
    background: var(--tblr-steps-inactive-color);
}

.steps-counter {
    --tblr-steps-dot-size: 2rem;
    counter-reset: steps;
}
.steps-counter .step-item {
    counter-increment: steps;
}
.steps-counter .step-item:before {
    content: counter(steps);
}

.steps-vertical {
    --tblr-steps-dot-offset: 6px;
    flex-direction: column;
}
.steps-vertical.steps-counter {
    --tblr-steps-dot-offset: -4px;
}
.steps-vertical .step-item {
    text-align: left;
    padding-top: 0;
    padding-left: calc(var(--tblr-steps-dot-size) + 1rem);
    min-height: auto;
}
.steps-vertical .step-item:not(:first-child) {
    margin-top: 0rem;
}
.steps-vertical .step-item:before {
    top: var(--tblr-steps-dot-offset);
    left: 0;
    transform: translate(0, 0);
}
.steps-vertical .step-item:not(:last-child):after {
    position: absolute;
    content: "";
    transform: translateX(-50%);
    top: var(--tblr-steps-dot-offset);
    left: calc(var(--tblr-steps-dot-size) * 0.6);
    width: var(--tblr-steps-border-width);
    height: calc(100% + 1rem);
}

.step-item.inactive:before {
    border: 2px solid #C0C6B9 !important;
    background-color: #ffffff !important;
    color: #C0C6B9 !important;
}

.step-item.inactive:after {
    background: #ffffff !important;
    border: 1px dashed #C0C6B9 !important;
}

.steps-counter .step-item.done:before {
    content: "✓";
    font-size: 1.5rem;
    line-height: 1.5rem;
    color: #ffffff !important;
    background: #728C54 !important;
}

.text-bg-featured {
    background-color: #D29C37;
}

.text-bg-new {
    background-color: #344026;
}

.text-bg-discount {
    background-color: #728C54;
}

.dbm-category {
    border: 1px dashed #151A0F !important;
}

.dbm-category:hover {
    background-color: #728C54 !important;
    color: #fff !important;
    border-color: #fff !important;
}

.dbm-category:hover img {
    filter: brightness(0) invert(1);
}

/*CHANGES IN BOOTSTRAP*/
.bs-tooltip-top .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before {
    border-top-color: #344026;
}
.bs-tooltip-end .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before {
    border-right-color: #344026;
}
.bs-tooltip-bottom .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before {
    border-bottom-color: #344026;
}
.bs-tooltip-start .tooltip-arrow::before,
.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before {
    border-left-color: #344026;
}
.tooltip-inner {
    color: #F9FAFA;
    background-color: #344026;
}

#productGrid img {
    border: 2px dashed #E9ECEC !important;
    border-radius: 4px !important;
}

#productGrid img:hover {
    border: 2px dashed #728C54 !important;
}

.home-category {
    max-width: 20% !important;
}

@media (max-width: 767.98px) {
    .home-category {
        max-width: 100% !important;
    }
}

.dbm-alert-green {
    background-color: #C0C6B9 !important;
    border-color: #344026 !important;
}
