/* HPM - PrestaShop 9.0 / Bootstrap 5 / Hummingbird compatible */
.page-hpm .container{width:100%!important;max-width:100%!important}

/* Header */
.hpm-header{height:371px;border-radius:20px;overflow:hidden}
.hpm-header .container{height:100%;backdrop-filter:brightness(.5);color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:20px!important;overflow:hidden}
.hpm-header .container h1,.hpm-header .container h2{font-size:3rem;font-weight:400;color:white}
.hpm-header .container .lead,.hpm-header .container .lead p{font-size:1.5rem;color:white}
.hpm-header .container .btn{margin-right:unset!important}

/* Card buttons */
.hpm-block-subcategories{background-color:#fbf4eb;}
.hpm-cardbtn-subcats{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;}
.hpm-cardbtn-wrapper{display:flex;justify-content:center;margin-bottom:10px}
.hpm-cardbtn{display:flex;flex-direction:column;justify-content:center;width:190px;height:100px;padding:0 16px;border:.5px solid #CEC9C9;border-radius:10px;background-color:#fff;text-decoration:none;color:inherit;transition:border-color .2s ease;flex-grow:1;text-align:center}
.hpm-cardbtn:hover{border-color:#4E4E4E;text-decoration:none}
.hpm-cardbtn-title{color:#7a4b2e;display:block;font-size:18px;font-weight:600}
.hpm-reas-pictos {max-height: 45px;}


/* Cards group */
.hpm-cards-group{margin-top:20px;margin-bottom:20px}
.hpm-card{position:relative;width:100%;height:100%;min-height:300px;background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:20px;overflow:hidden}
.hpm-card__overlay{position:absolute;left:0;right:0;bottom:0;padding:20px;height:100%;background:linear-gradient(to right,rgba(0,0,0,.7),rgba(0,0,0,0));display:flex;flex-direction:column;justify-content:flex-end}
.hpm-card__subtitle{font-size:14px;color:#fff;opacity:.9;margin-bottom:4px}
.hpm-card__title{font-size:22px;color:#fff;margin-bottom:.5rem}
.hpm-cg-size-1 .hpm-one{width:100%}

/* Split 2 layout */
.hpm-split-2{position:relative;display:flex;flex-wrap:wrap;gap:16px}
.hpm-split-2 .hpm-col{width:100%}
@media (min-width:768px){
.hpm-split-2 .hpm-col{width:calc(50% - 8px)}
.hpm-split-2 .hpm-col--left,.hpm-split-2 .hpm-col--right{flex:1 1 calc(50% - 8px)}
}

/* Grid 3 layout */
.hpm-cards-group--grid-3{display:block}
.hpm-cg-left,.hpm-cg-right{width:100%}
@media (min-width:768px){
.hpm-cards-group--grid-3{display:flex;align-items:stretch;gap:16px}
.hpm-cg-left,.hpm-cg-right{width:calc(50% - 8px)}
.hpm-cg-right{display:flex;flex-direction:column;gap:16px}
.hpm-cg-right .hpm-card{flex:1 1 0}
}

/* Square card */
.hpm-card--square{position:relative}
.hpm-card--square:before{content:"";display:block;padding-top:100%}
.hpm-card--square>.hpm-card__overlay{position:absolute;left:0;right:0;bottom:0}
@supports (aspect-ratio:1 / 1){.hpm-card--square{aspect-ratio:1/1}.hpm-card--square:before{display:none;padding-top:0}}

/* Flex wrap */
.hpm-mb-16{margin-bottom:16px}
.hpm-flex-wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch}
.hpm-flex-item{flex:1 1 100%}
@media (min-width:768px){.hpm-flex-item{flex:1 1 calc(50% - 8px)}}

/* Cards grid */
.cards-grid{display:flex;flex-wrap:wrap;margin:-10px}
.card-wrap{padding:10px;box-sizing:border-box;flex:0 0 100%}
@media (min-width:768px){.card-wrap{flex:0 0 50%}}
@media (min-width:992px){
.cards-grid.cards-2 .card-wrap{flex:0 0 50%}
.cards-grid.cards-3 .card-wrap{flex:0 0 33.3333%}
.cards-grid.cards-4 .card-wrap{flex:0 0 25%}
}

/* Product card */
.card-prod{display:flex;flex-direction:column;border-radius:12px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.08);overflow:hidden;height:100%}
.card-prod .image-wrapper{position:relative;overflow:hidden}
.card-prod img{display:block;width:100%;height:auto}
.card-prod .label-tag{position:absolute;top:14px;right:14px;background:#6e3d2d;color:#fff;border-radius:999px;padding:6px 12px;font-size:11px;font-weight:600}
.card-prod .body{display:flex;flex-direction:column;flex-grow:1;padding:16px}
.card-prod .title{font-size:18px;line-height:1.25;margin:0 0 8px;color:#222}
.card-prod .footer{display:flex;align-items:center;padding:0 16px 16px 16px;justify-content:space-between}
.card-prod .footer.left-btn{justify-content:flex-start}
.card-prod .footer a{margin-right:unset!important}

/* Breadcrumb - Bootstrap 5 */
.page-hpm nav.breadcrumb{background:transparent;padding:0;margin:0}
.page-hpm .breadcrumb{list-style:none;display:flex;flex-wrap:wrap;padding:0;margin:0;background:transparent}
.page-hpm .breadcrumb-item+.breadcrumb-item{padding-left:.5rem}
.page-hpm .breadcrumb-item+.breadcrumb-item::before{content:">";padding-right:.5rem;color:#6c757d}

/* Sections */
.hpm-section--article{background-color:#fff}

/* Buttons */
.secondary-btn{color:#6C2E1B !important ;background-color:#FFFFFF !important ;margin-right:auto;border-radius:10px!important;padding:.5rem 1rem;text-decoration:none;display:inline-block}
.secondary-btn:hover{color:#FFFFFF!important;background-color:#6C2E1B!important;text-decoration:none}
a.btn{text-wrap:auto}
.hpm-result-item{cursor:pointer}

/* Responsive */
@media (max-width:767.98px){
.hpm-header{height:276px}
.hpm-cg-left,.hpm-cg-right div.hpm-card:first-child{margin-bottom:16px}
.hpm-card--square{aspect-ratio:unset}
.hpm-flex-wrap--reversed{flex-direction:column-reverse}
}
@media (min-width:768px){.hpm-flex-wrap--reversed{flex-direction:row-reverse}}
@media (max-width:491px){
.hpm-cardbtn small{font-size:10px}
.hpm-cardbtn span{font-size:12px}
.hpm-cardbtn{width:85px;height:60px}
.hpm-cardbtn-wrapper{margin-bottom:0}
.hpm-cardbtn-subcats{padding-left:0!important;padding-right:0!important}
}

@media (min-width:1700px){
    [class^="hpm-"].m-3, [class*=" hpm-"].m-3 { margin: 3rem 20rem !important; }
    [class^="hpm-"].p-3, [class*=" hpm-"].p-3 { padding: 3rem 20rem !important; }
}

@media (min-width: 1400px) {
    .hpm-container div, .hpm-header, .hpm-cardbtn-subcats, .hpm-block-subcategories .displayCustomBanners4  {
        max-width: 1320px !important;
        margin: auto;
    }
}


.hpm-cardbtn-subcats {padding-top: 2rem;}

