@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css");

:root {
        scroll-behavior: auto;
}

body {
        font-family:Ubuntu;
        opacity:0;
        color:var(--default-text-color);
}
body.unselectable {
        user-select:none;
}
img, iframe, video {
        max-width:100%;
}
img {
        height:auto;
}
hr {
        color: var(--current-page-color);
        opacity: 1;
}
a {
        color:var(--current-page-color);
        border:none;
        transition:all .2s;
}
a:hover {
        color:var(--main-color);
}
a.underlined {
        color:inherit;
        position:relative;
        border-bottom:solid 2px var(--current-page-color);
}
a.underlined:hover {
        color:var(--current-page-color);
}
.page.type-page:not(.search-page-wrapper) #page-content a {
        border-color:var(--annuaire-color);
}
.page.type-page:not(.search-page-wrapper) #page-content a:hover {
        color:var(--annuaire-color);
}

/*
 * Titrages & textes
 */
h1 {
        font-family:Faro;
        font-weight:800;
        font-size:3.1rem;
        line-height:1.1;
}
h2 {
        font-family:Faro;
        font-weight:800;
        font-size:2.4rem;
}
h3 {
        text-transform:uppercase;
        font-family:Faro;
        font-weight:normal;
        font-size:1.4rem;
        margin-bottom:0;
        line-height: 1.15;
}
h4 {
        text-transform:uppercase;
        font-family:Faro;
        font-weight:300;
        font-size:1.05rem;
}
h5 {
        font-family:Ubuntu;
        font-weight:bold;
        font-size:1em;
}
p:last-child {
        margin-bottom:0;
}


/*
 * Images
 */
.wp-caption {
        max-width: 100% !important;
        padding: 0 !important;
        margin-bottom: 1em !important;
        text-align:left !important;
}
figcaption {
        font-family: 'Faro';
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 15px;
        background: var(--current-page-color);
        color: var(--current-page-color-inverse);
}
.wp-caption img {
        max-width:100% !important;
}

/*
 * Authoring
 */
blockquote {
        /* background: var(--light-bg-color); */
        padding: 10px;
        padding-left: 65px;
        font-family: 'Faro';
        position: relative;
        overflow: hidden;
        color: #989898;
        font-size: 1.2em;
}
blockquote p {
        font-style:italic;
}
blockquote:before {
        position: absolute;
        content: '«';
        margin-right: 5px;
        font-size: 3em;
        top: 18px;
        left: 20px;
        line-height: 0;
        font-family: 'Faro';
        font-weight: 900;
        opacity: .35;
}
blockquote:after {
        content:'';
        position:absolute;
        width: 100%; 
        height: 100%;
        top: 0; 
        left: 0;
        clip-path: polygon(100% 0, 100% calc(100% - 15px), calc(100% - 15px) 100%, 0 100%, 0 0);
        z-index: -1;
        background-color: var(--light-bg-color);
}

/*
 * Tableaux
 */
table.table-infos {
        width: 100%;
        font-size: .9em;
}
table.table-infos th, table.table-infos td {
        padding: 5px 20px 2px 20px;
        border-bottom: solid 1px #fff;
}
table.table-infos th {
        background: var(--current-page-color);
        color: #fff;
        font-family: 'Faro';
        text-transform: uppercase;
        font-weight: normal;
}
table.table-infos td {
        background: #00acc32e;
}

/*
 * Formulaires
 */
.form-control {
        line-height:1;
        font-size: 1em;
        border-radius:3px;
}
.form-control:focus {
        border-color:initial;
        box-shadow:none;
}
select:focus-visible {
    outline: none;
}
select.selected-value {
        font-weight:bold;
}
.facetwp-filters .fs-wrap.multiple .fs-option.selected {
        font-weight:bold;
}
.facetwp-filters .fs-wrap.multiple .fs-option.selected .fs-checkbox i {
        border: solid 1px #aeaeae;
        background-color: transparent;
}
.facetwp-filters .fs-wrap.multiple .fs-option.selected .fs-checkbox i:after {
        content: '';
        position: absolute;
        background-color: var(--current-page-color);
        top: 1px;
        left: 1px;
        right: 1px;
        bottom: 1px;
}
.facetwp-filters input,
.facetwp-filters select,
.facetwp-filters .fs-label-wrap {
        height:28px;
        padding:5px;
        border-radius: 3px;
        font-family:Faro;
        border-color:#000;
}
.facetwp-filters input {
        padding-left:10px;
}
.facetwp-filters .fs-label-wrap {
        padding:5px;
}
.facetwp-filters .fs-label-wrap .fs-label {
        padding:0;
}
.facetwp-filters .fs-label-wrap .fs-label .fs-selected-item {
        display: inline-block;
        padding: 3px 4px 2px 4px;
        background: var(--current-page-color);
        border-radius: 3px;
        font-weight: bold;
        margin-right: 5px;
}
.facetwp-filters .fs-label-wrap .fs-label .fs-selected-item.placeholder-item {
        background:transparent;
        font-weight:normal;
}


/*
* Facet
*/
.facetwp-toggle{
        font-weight: bold;
}
.facetwp-toggle:hover{
        color: var(--current-page-color);
}

/*
* Facet Hiérarchique
*/
.facetwp-type-hierarchy .facetwp-link{
        padding-left: 13px;
        position: relative;
}

.facetwp-type-hierarchy .facetwp-link:after{
        content: '';
        position: absolute;
        top: 5px;
        left: 0;
        height: 10px;
        width: 10px;
        border-top: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid rgba(0,0,0,0);
        border-left: 7px solid var(--current-page-color);
        transform: rotate(90deg);
}

.facetwp-type-hierarchy .facetwp-link.closed:after,
.facetwp-type-hierarchy .facetwp-link.checked + .facetwp-depth  > .facetwp-link:after {
        border-left: 7px solid #fff;
        transform: rotate(0deg);
}

.facetwp-type-hierarchy .facetwp-link.active,
.facetwp-type-hierarchy .facetwp-link.checked{
        padding-left: 15px;
        text-decoration: underline;
}


/*
 * Bootstrap
 */
.btn {
        font-family:Faro;
        font-weight:bold;
}
.btn-primary, .wp-block-button .wp-block-button__link,
.btn-primary:hover, .wp-block-button .wp-block-button__link:hover {
        background:var(--current-page-color);
        border-color:var(--current-page-color);
        color:var(--current-page-color-inverse);
}
.btn-primary:hover, .wp-block-button .wp-block-button__link:hover {
        box-shadow: inset 0px 0px 400px 110px rgba(0, 0, 0, .1);
}
body.admin-bar .edit-link a {
    color: #000!important;
}

/*
 * Formats de texte
 */
.chapeau {
        font-size:1.1em;
        /*color:#777;*/
        margin-bottom:2em;
        position:relative;
}

/*
 * Utilitaires
 */
.relative {
        position:relative;
}
.full-size-link {
        position:absolute;
        top:0;
        left:0;
        right:0;
        bottom:0;
}


/*
 * Couleurs
 */
:root {
        --default-text-color: #272525;
        --main-color: #0d1629;
        --main-color-inverse: #fff;
        --light-bg-color: #e9e9e9;
        --annuaire-color: #00acc3;
        --annuaire-color-inverse: #fff;
        --dashboard-color: #00acc3;
        --dashboard-color-inverse: #fff;
        --profil-color: #00acc3;
        --profil-color-inverse: #fff;
        --annonces-color: #f8de5d;
        --annonces-color-inverse: var(--main-color);
        --agenda-color: #f96165;
        --agenda-color-inverse: #fff;
        --blog-color: #ffc162;
        --blog-color-inverse: #000;
        --materiel-color: #71915b;
        --materiel-color-inverse: #fff;
        --outils-color: #87e0cc;
        --outils-color-inverse: var(--main-color);
}
.page-blog {
        --current-page-color: var(--blog-color);
        --current-page-color-inverse: var(--blog-color-inverse);
}
.page-annuaire {
        --current-page-color: var(--annuaire-color);
        --current-page-color-inverse: var(--annuaire-color-inverse);
}
.page-annonces {
        --current-page-color: var(--annonces-color);
        --current-page-color-inverse: var(--annonces-color-inverse);
}
.page-agenda {
        --current-page-color: var(--agenda-color);
        --current-page-color-inverse: var(--agenda-color-inverse);
}
.page-materiel {
        --current-page-color: var(--materiel-color);
        --current-page-color-inverse: var(--materiel-color-inverse);
}
.page-outils {
        --current-page-color: var(--outils-color);
        --current-page-color-inverse: var(--outils-color-inverse);
}

.text-colored {
        color:var(--current-page-color);
}
.background-colored {
        background-color:var(--current-page-color);
}
.border-colored {
        border-color:var(--current-page-color);
}





/*
 * Utilitaires
 */
a.full-size-link {
        position:absolute;
        top:0;
        left:0;
        right:0;
        bottom:0;
        z-index:2;
}
.ccn-btn {
        display:inline-block;
        border-radius:4px;
        padding:0px 10px 0px 10px;
        font-family:Faro;
        font-weight:bold;
        border: solid 2px var(--current-page-color);
        background:transparent;
        position:relative;
        transition:all .2s;
        margin-right:10px;
        color: var(--current-page-color);
}
.ccn-btn.has-icon {
        padding-right:28px;
}
.ccn-btn:hover {
        background:var(--current-page-color);
        color:var(--current-page-color-inverse);
}
.ccn-btn a,
.ccn-btn a.underlined {
        color:inherit;
        border-bottom:none;
}
.ccn-btn.ccn-btn-reverse {
        background: var(--current-page-color);
        color: var(--current-page-color-inverse);
}
.ccn-btn.ccn-btn-reverse:hover {
        background: transparent;
        color: var(--current-page-color);
}
#bandeau-entete .ccn-btn path {
        fill: #fff;
}
#bandeau-entete .ccn-btn {
        border-color: #fff;
        color: #fff;
}
.ccn-btn .ccn-btn-icn {
        position:absolute;
        right:5px;
        top:-3px;
}
.ccn-btn .ccn-btn-icn svg {
        width:16px;
}
.ccn-btn .ccn-btn-icn svg path {
        fill:var(--current-page-color);
        transition:fill .2s;
}
.ccn-btn .ccn-btn-icn svg line {
        stroke:var(--current-page-color);
        transition:stroke .2s;
}
.ccn-btn:hover .ccn-btn-icn svg path {
        fill:var(--current-page-color-inverse);
}
.ccn-btn:hover .ccn-btn-icn svg line {
        stroke:var(--current-page-color-inverse);
}
.ccn-btn.ccn-btn-no-icn {
        padding: 0 10px 0 10px;
}
.ccn-btn.ccn-btn-reverse .ccn-btn-icn svg path{
        fill: var(--current-page-color-inverse);
}
.ccn-btn.ccn-btn-reverse .ccn-btn-icn svg line {
        stroke:var(--current-page-color-inverse);
}
.ccn-btn.ccn-btn-reverse:hover .ccn-btn-icn svg path{
        fill: var(--current-page-color);
}
.ccn-btn.ccn-btn-reverse:hover .ccn-btn-icn svg line {
        stroke: var(--current-page-color);
}
.ccn-btn.ccn-btn-left {
        padding-left: 28px;
        padding-right: 10px;
}
.ccn-btn.ccn-btn-left .ccn-btn-icn {
        right: initial;
        left: 5px;
}
.ccn-btn-alt {
        /* background:var(--current-page-color); */
        color: var(--current-page-color-inverse);
        padding:3px 15px 3px 10px;
        margin-right:20px;
        position:relative;
        border-radius:4px;
        border-top-right-radius:0;
        border-bottom-right-radius:0;
        font-weight:bold;
        text-transform:uppercase;
        font-family:Faro;
        font-size:.9em;
        overflow: hidden;
        z-index: 2;
}
.ccn-btn-alt > *{
        position: relative;
        z-index: 2;
}
.ccn-btn-alt:after {
        content:'';
        position:absolute;
        width: 100%; 
        height: 100%;
        top: 0; 
        left: 0;
        clip-path: polygon(100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 0);
        z-index: -1;
        background-color: var(--current-page-color);
        border-radius: 3px;
}
.ccn-btn-alt .ccn-btn-alt-corner {
        display: none;
        /* position:absolute;
        top: 0;
        left:100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: start; */
}
.ccn-btn-alt .ccn-btn-alt-corner svg {
        /* width:13px;
        height:100%;
        display: none; */

}
/* .ccn-btn-alt .ccn-btn-alt-corner path {
        fill:var(--current-page-color);
} */


/*
 * Loaders
 */
.loader-overlay {
        position:absolute;
        top:0;
        left:0;
        bottom:0;
        right:0;
        z-index:99; /* laisse passer le fixed menu */
        background:rgba(255, 255, 255, .85);
}
.loader-overlay .loader {
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%, -50%);
        display: inline-block;
        width: 80px;
        height: 80px;
}
.loader-overlay .loader:after {
        content: " ";
        display: block;
        width: 64px;
        height: 64px;
        margin: 8px;
        border-radius: 50%;
        border: 6px solid var(--main-color);
        border-color: var(--main-color) transparent var(--main-color) transparent;
        animation: loader-animation 1.2s linear infinite;
}
@keyframes loader-animation {
        0% {
              transform: rotate(0deg);
        }
        100% {
                transform: rotate(360deg);
        }
}

/*
* Modal
*/
.modal-content {
        border-radius: 0;
        border: 0;
}

/*
* Modal facet mobile
*/

.modal-filter.modal .modal-body {
        padding: 0;
}

.modal-filter.modal .modal-footer{
        height: 100%;
        border: 0;
        padding: 5px;
        padding-top: 0;
}

.modal-filter.modal .search-block{
        padding: 20px 30px;
        position: relative;
}

.modal-filter.modal .search-block:after{
        content: '';
        position: absolute;
        top: 100%;
        left: 0;
        background-color: rgba(0, 0, 0, .2);
        height: 1px;
        width: 100%;
}

.modal-body .search-block:last-child:after,
.modal-filter.modal .facetwp-facet > .search-block:last-of-type:after{
        display: none;
}

.modal-filter.modal .search-block h4{
        font-size: 20px;
}

.modal-filter.modal .btn-apply-filter {
        background: var(--main-color);
        border: 0;
        width: 100%;
        color: #fff;
        border-radius: 3px;
        text-transform: uppercase;
        font-size: 14px;
        padding: 10px 10px;
}

.modal-filter.modal .search-block > .facetwp-checkbox:last-of-type{
        margin-bottom: 0;
}

/*
* Btn modale facet mobile
*/
.search-page .search-col .btn-mobile-facet-filter {
        display: none;
        width: 100%;
        padding: 9px;
        text-transform: uppercase;
        margin-top: 10px;
        margin-bottom: 10px;
        font-size: 14px;
        background: var(--current-page-color);
        color: var(--current-page-color-inverse);
}

.search-page .search-col .btn-mobile-facet-filter i {
        margin-right: 5px;
}