/* ### ############# ### */
/* ### STICKY FOOTER ### */
/* ### ############# ### */
body > #wrapper {
        min-height: 100vh !important;
        flex-direction: column !important;
        display: flex !important;
}

main {
        flex-grow: 1;
}

/* ### ############ ### */
/* ### HEADER LOGIN ### */
/* ### ############ ### */
.admin-bar header#header {
        top: 32px;
}

/* ### ########### ### */
/* ### MAIN LAYOUT ### */
/* ### ########### ### */
#main {
        position: relative;
        margin-top: 0;
        overflow: hidden;
}

#main > .img-banner {
        height: 525px;
        width: 100%;
        object-fit: cover;
        background: rgba(0, 0, 0, .2);
}

.container {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        max-width: 1320px;
}

.page-content {
        margin: 80px auto;
}

.main-col {
        width: 100%;
        padding: 0 80px;
}

.wrapper {
        position: relative;
        width: 100%;
}

.wrapper-inner {
        position: relative;
        max-width: 1320px;
        min-height: 480px;
        margin: auto;
        padding: 80px 0;
}

/* Cover */
.page-cover {
        position: relative;
        width: 100%;
        height: 65vh;
}

.page-cover img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
}

.page-cover::after {
        position: absolute;
        content: "";
        bottom: 0;
        left: 0;
        height: 40%;
        width: 100%;
        background: linear-gradient(180deg, #00000000, #06160E99);
}

.page-cover .wrapper-inner {
        height: 100%;
}

.page-cover .page-title {
        z-index: 1;
        position: absolute;
        bottom: 32px;
        max-width: 75%;
        left: 0;
}
/* Trail numerics (template part) */
.trail-numerics {
        display: flex;
        gap: 48px;
        white-space: nowrap;
}
.trail-numerics p {
        margin-bottom: 0;
}
.trail-numerics .trail-numerics-item-value {
        font-size: 16px;
}

/* Blocks layout */
.blocks-wrapper .blocks-column {
        display: flex;
        flex-direction: column;
        gap: 20px;
}
.blocks-wrapper .blocks-column:first-of-type {
        padding-left: 0;
}
.blocks-wrapper .blocks-column:last-of-type {
        padding-right: 0;
}
.blocks-wrapper .block {
        border-radius: 16px;
        background-color: #FFF;
        /*overflow: hidden;*/
        z-index: 1;
}
.blocks-wrapper .block.block-search {
        background-color: var(--main-color);
        color: #fff;
}
.blocks-wrapper .block-inner {
        padding: 24px;
}
.blocks-wrapper .block-inner.block-header {
        padding: 16px 24px;
}
.blocks-wrapper .block-inner .block-header {
        display: flex;
        align-items: center;
        gap: 16px;
}
.blocks-wrapper .block-inner .block-header span {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 32px;
        width: 32px;
        padding: 5px;
        border-radius: 50%;
}
.blocks-wrapper .block-inner .block-header svg path {
        stroke: #fff;
}
.blocks-wrapper .blocks-column-results .blocks-column-results-inner {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 28px 24px;
}
.block .button-default {
        border-radius: 8px;
}
.block .button-default:before{
        border-radius: 8px;
}

/* Fotter block column recherche */
.blocks-column-results-header,
.blocks-column-results-footer {
        display: flex;
        justify-content: space-between;
}
.blocks-column-results-footer {
        background: var(--main-color);
        color: #fff;
        padding: 16px 24px;
        margin-top: 8px;
        border-radius: 8px;
}
.blocks-column-results-header .facetwp-facet,
.blocks-column-results-footer .facetwp-facet {
        margin-bottom: 0;
        font-size: 14px;
}
.blocks-column-results .facetwp-facet-nombre_resultats_total {
        font-weight: 800;
        font-size: 18px;
        color: var(--main-color);
}
.block-search .facetwp-facet .facetwp-icon {
        background: #fff;
        padding-left: 4px;
        opacity: 1;
}
.block-search .facetwp-facet .facetwp-icon:before {
        opacity: .5;
}
/* Carte point d'intérêt */
.interest-point-card{
        position: relative;
}
.interest-point-img,
.interest-point-img.with-svg{
        height: 164px;
        transition: .2s;
}
.interest-point-img img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        border-radius: 8px;
        transition: .2s;
}
.interest-point-img.with-svg {
        display: flex;
        align-items: center;
        justify-content: center;
        background: #fff;
        border-radius: 8px;
}
.interest-point-img.with-svg svg {
        width: 124px;
}
.interest-point-img.with-svg svg * {
        fill: var(--main-color);
}
.interest-point-data .title {
        font-size: 16px;
        font-weight: 700;
        line-height: 1;
        transition: .2s;
}
.interest-point-data {
        margin-top: 12px;
}
.interest-point-data .sentiers-types {
        display: flex;
        gap: 4px;
        margin-top: 8px;
        line-height: 1;
        font-size: 12px;
}
.interest-point-data .sentiers-types .separator {
        font-size: 14px;
}
.interest-point-data .sentiers-types .types a {
        font-weight: 500;
}
.interest-point-card:hover .interest-point-img {
        filter: brightness(.8);
}
.interest-point-card:hover .interest-point-img.with-svg{
        filter: brightness(.9);
}
.interest-point-card:hover .interest-point-data .title {
        color: var(--main-color);
}

/* ### FACETWP STYLES ### */
.block-search .facetwp-input-wrap {
        display: block;
}
.block-search .facetwp-facet input.facetwp-search,
.block-search .facetwp-facet select.facetwp-dropdown {
        width: 100%;
        padding: 8px 12px;
        border-radius: 8px;
        border: none;
        color: #777;
}
.block-search .facetwp-facet input.facetwp-search:focus,
.block-search .facetwp-facet select.facetwp-dropdown:focus {
        outline: 2px solid #215140;
}
.block-search .facetwp-facet .facetwp-icon {
        right: 4px;
}
.block-search .facetwp-facet {
        margin-bottom: 16px;
}
.block-search .facetwp-filters .facetwp-facet:last-of-type {
        margin-bottom: 8px;
}
.block-search .fs-wrap {
        width: 100%;
}
.block-search .fs-label-wrap {
        padding: 5px 12px;
        border-radius: 8px;
}
.block-search .fs-label-wrap .fs-label {
        padding: 6px 0;
        color: #777;
}
.block-search .facetwp-type-fselect .fs-option .fs-option-label {
        color: #777;
}
.block-search .fs-arrow {
        right: 10px;
        border-top: 5px solid #777;
}
.block-search .fs-dropdown {
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
}
.block-search .fs-dropdown .fs-options {
        padding: 6px 2px;
}
.block-search .fs-wrap.multiple .fs-option.selected .fs-checkbox i{
        background-color: var(--main-color);
}

.facetwp-pager {
        display: flex;
        align-items: center;
}
.facetwp-pager .facetwp-page.active {
        color: #fff;
}
.facetwp-pager .facetwp-page {
        color: #c5c5c5;
        margin-right: 8px;
        line-height: 1;
}
.facetwp-pager .facetwp-page:last-of-type {
        margin-right: 0;
}
.facetwp-pager .facetwp-page.prev,
.facetwp-pager .facetwp-page.next {
        color: var(--main-color);
        background: #fff;
        border-radius: 4px;
        padding: 4px 8px 6px 8px;
        line-height: 1;
}

/* ### Button ### */
.button-default{
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 12px 24px;
        background: var(--main-color);
        font-weight: 700;
        font-size: 14px;
        color: #fff;
        border: 0;
        border-radius: 24px;
        transition: color .3s ease, background .3s ease;
        box-sizing: border-box;
        overflow: hidden;
}
.trail-card:hover .button-default,
.hero-alert:hover .button-default,
.button-default:hover {
        color: var(--main-color);
        background: #fff;
}
.button-default-svg:hover svg path{
        stroke: var(--main-color);
}
.button-default:active {
        top: 2px;
}
.button-default.button-small {
        padding: 4px 8px;
        font-size: 10px;
}
.button-default-reverse{
        background-color: #fff;
        color: var(--main-color);
}
.button-default-reverse:hover{
        color: #fff;
        background: var(--main-color);
}
.button-default-reverse.button-default-svg:hover svg path{
        stroke: #fff;
}

.button-default-svg{
        padding: 12px 24px 12px 20px;
}
.button-default-svg.button-default-round{
        padding: 10px 8px 10px 12px;
}
.button-default-svg svg{
        width: 24px;
        height: 24px;
        position: relative;
        top: 1px;
}
.button-default-svg svg *{
        stroke-width: 2px;
        transition: stroke .2s;
}
.button-default.button-default-svg svg *{
        stroke: var(--light-text-color);
}
.button-default-reverse.button-default-svg svg *{
        stroke: var(--main-color);
}

/* button with background */
.button.button-fill-width{
        position: relative;
        display: flex;
        gap: 16px;
        align-items: center;
        color: var(--light-text-color);
        overflow: hidden;
        padding: 8px 14px;
        border-radius: 8px;
        margin-bottom: 12px;
}
.button.button-fill-width:active{
        top: 2px;
}
.button.button-fill-width:last-of-type {
        margin-bottom: 0;
}

.button.button-fill-width img {
        position: absolute;
        height: 100%;
        width: 100%;
        left: 0;
        object-fit: cover;
        filter: blur(0.6px);
        opacity: 0.3;
}
.button.button-fill-width svg {
        height: 30px;
        width: auto;
        z-index: 1;
}
.button.button-fill-width svg * {
        stroke: var(--light-text-color);
}
.button.button-fill-width p {
        font-family: 'Noto';
        font-size: 14px;
        font-weight: 700;
        z-index: 1;
}