@font-face {
    font-family: "Montserrat";
    src: url("/sites/atmo-occitanie/files/fonts/Montserrat-Regular.woff2");
}

@font-face {
    font-family: "Montserrat";
    src: url("/sites/atmo-occitanie/files/fonts/Montserrat-Bold.woff2");
    font-weight: bold;
}

:root {
    
    /* DATAGONE */
    --box-shadow-l : 0 0 24px rgba(48, 155, 189, 0.25) !important;
    
    --p-primary-color : #213b50 !important;
    --p-primary-hover-color  : #213b50 !important;
    --color-primary : #213b50;
    --color-secondary : #00D3AF;
    --color-secondary-ligth :#aae3d3;
    --color-disabled : #E3E3E3;
    --font-disabled : #656A6E;
    --color-text : #656A6E;
    --font-family : Montserrat;

    
    /* Couleurs des familles de phyto1 */
    --color-phy-phytos: var(--color-primary);
    --color-phy-herb: #a8c812;
    --color-phy-fong: #00a6a9;
    --color-phy-insec: #e48908;
    --color-phy-endo: #a85497; 
    --color-site-grande-culture: #EE7272;
    --color-site-viticulture: #55145D ;
    --color-site-arboriculture: #88A02C ;
    --color-site-fourrage: #DCEAAF ;
    --color-site-polycultures: #917CB7 ;
    --color-site-fond_urbain: #AFC5E9 ;
    
    --color-emi-transport: #ADC9D1;
    --color-emi-resid: #C17B37;
    --color-emi-indus: #8E6355;
    --color-emi-agri: #BFC253;
    --color-emi-combustible: var(--color-primary);
    --color-emi-NOX: #9f5998;
    --color-emi-GES: #759ED1;
    --color-emi-PM2: #D8BE9E;
    --color-emi-PM10: #BDA196;
    
    /* AGIR */
    --color-agir-routes_toutes: var(--color-primary);
    --color-agir-route80: #c7dcff;
    --color-agir-route110: #0080ff;
    --color-agir-route130: #001e7d;
  
  
}
 
.dataviz[data-nid="410"] .p-component:disabled {
     display: none;
 }
 
.js-layout-builder-block.contextual-region {
  & .contextual {
    & .trigger {
      display: block !important;
    }
  }
}

.icon-voronoi {
    --icon-size: 35px;
}

/* ADMIN dataviz */
.nav.nav--toolbar.theme-primary {
    margin-left : 0;
    
    .nav-item[data-tool="export"],
    .nav-item[data-tool="ticket"] {
        display: none;
    }
}


.icon {
  &::before {
    background: currentColor;
  }
}

.dataviz-container {
    width: 75%; 
}
.dataviz-sidebar {
    padding: 0px 0 0 24px;
    width: 25%;
    background: white;
}


.field-body {
  & a:not(.btn) {
    text-decoration: none;
  }
}

/* LIST PAGE SELECTION */
.list--page-selection {
    .item-header {
        padding: 1px 20px;
    }
    & .icon.icon--emi_secteur_transport {
        &::before {
            mask-image :  var(--icon-emi_secteur_transport);
            background: currentColor;
        }
    }
}


.webform-submission-form {
    font-family: var(--font-family);
    
    label,
    legend,
    .form-group-title {
        font-family: inherit;        
    }
}

/* MODELE DE DATAVIZ */
.dataviz.category--dataviz-sidebar-bottom {
    .dataviz-sidebar-container {
        display: flex;
        flex-direction: column;
        
        .dataviz-container,
        .dataviz-sidebar {
            width: 100%;
        }
    }
}


/* STYLE PAGE EDITO PESTICIDES */
.section-edito .block--dataviz {
    box-shadow : unset;
}
.section-edito.layout--twocol {
    align-items: center;
}

.page--node.category--edito {
    .block--dataviz {
        padding-top: 0;
        
        .dataviz-header {
            padding-top: 0;
        }
    }
    
    h2 {
       margin-top : 25px;
       font-size: 1.5em;
    }
    
    .background-primary {
        h2 {
            color: white;
            margin-top: 5px;
        }
        .dataviz-header .title--dataviz {
            color: white;
        }
        .dataviz .source {
            fill: white
        }
    }
    .layout.background-primary {
        background: var(--color-primary);
        color: white;
        
        h1 {
            color: white;
        }
        .layout__region--content {
            background: var(--color-primary);
        }
        ul:not([class]) li::before {
            background-color: white;
        }
        .block.block--dataviz {
            background : none;
        }
    }
}


/*_________________________________________________________________*/
.dataviz .dataviz-footer {
    .message {
        width: 100%;
    }
    .messages__content {
        text-align: center;
        background: #ff9966;
        color: var(--color-primary);
        border-radius: 5px;
        padding: 10px;
    }
}

/* Dataviz Action */
.dataviz .dataviz-actions {
    width: unset;
    position: relative;
    bottom: unset;
    left: unset;
    display: flex;
    
    button.btn {
        min-height: unset;
        background: none;
    }
    .btn {
        padding : 0 0;
    }
    .icon:not(.icon--datagone):before {
        background-color: var(--color-secondary);
    }
}

button.dataviz-action {
    span:not(.icon) {
        visibility: hidden;
        width: 70px;
        background-color: var(--color-primary);
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        margin-top: 80px;
        line-height: 1;
        font-family: var(--font-family);
        font-size: .85em;
        text-transform: initial;
    }
    
    &:hover {
        span:not(.icon)  {
            visibility: visible;
        }
        .icon:before {
            background-color: var(--color-primary);
        }
    }
}
.btn.is-active {
    background: none;
    
    .icon:before {
        background-color: var(--color-primary);
    }
}
.dataviz-action.dataviz-action--link {
    display: none;
}


.sitemap-item .btn + .btn,
.field-body .btn + .btn {
  margin-left: 5px
}


.dataviz.category--menu {
    .dataviz-sidebar-toggle-buttons {
        display: none;
    }
}
.dataviz.category--search-menu {
    .dataviz-sidebar-toggle-buttons {
        display: none;
    }
    .dataviz-content {
        background: var(--color-primary);
    }
}

.ui-button {
    font-family: var(--font-family);
    background : var(--color-secondary);
    color : white;
    padding: 5px 15px;
    font-size : 1em;
    border : none;
    font-weight: bold;
    
    &:hover {
        color: var(--color-primary);
        background : var(--color-secondary);
        border : none;
        font-weight: bold;
    }
}

/* DATAVIZ */
.epci.selected {
    fill: var(--color-secondary);
}
.heatmap--tooltip {
    background: #ffffff;
}
.block.block--dataviz {
    padding: 5px 24px;
    margin-bottom: 10px;
    width: 100%;
    background: white;
}

.dataviz .dataviz-intro {
    max-width: 400px;
    margin-top: 55px;
    margin-right: 112px;
    font-size: 1.2em; 
    transform: none;
    
    button.dataviz-intro-close {
        background-color: white;
        
        .icon--z_close {
            color : var(--color-secondary);
            font-size: 1.7em;
        }
        .icon--z_close:hover {
            color : var(--color-primary);
        }
    }
}



/* loader */
.loader-container {
    width: 100%;
    background-color: rgba(255,255,255,0.7);
    position: absolute;
    top: 0px;
    left : 0px;
    display : none;
}
.loader-background {
    position: absolute;
    left: calc(50% - 75px);
    top : calc(50% - 75px);
    border-radius: 5px;
    width: 150px;
    background: white;
    text-align: center;
}
.loader {
    margin: 5px;
    border: 3px solid #f3f3f3;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border-top: 3px solid var(--color-primary);
    margin-left: calc(50% - 20px);
    animation: spin 0.5s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* PAGE */
.node--page.node--1 {
    h2 {
        margin-bottom: 7px;
        font-size: 1em;
    }
    .list--page-selection {
        & .item-wrapper {
            background: white;
        }
        & .item-title {
            font-size: 0.9em;
            text-transform: none;
        }
        & .item-content {
            padding: 50px 0 0;
        }
        & .item-header {
            min-height: 50px;
            padding : 1px 5px;
            background: white;
        }
        & a {
            &:hover, &:focus {
                & .item-header {
                    background: none;
                    border : none;
                }
            }
        }
        & a:not(.btn) {
            text-decoration: none;
        }
        & .item-footer {
            &::after {
                background: none;
            }
        }
    }
}
.page--node .builder-row {
    margin-top: 0;
    margin-bottom: 0;    
}

/**
 * AFFICHAGE DU TITRE DU SOUS THEME
 * le titre est définit dans l'interface "menu", il est lié au sous-thème, au territoire et à l'année
 * si média > 768px : le titre s'affiche dans le content-before
 * si media < 768 : le titre s'affiche dans la balise theme-title sous la side bar
 */

/* la balise theme-title est ajoutée à la mise en page de chacun des sous-thème */
.theme-title {
    font-family: var(--font-family);
    color : var(--color-primary);
    font-weight: bold;
    font-size : 1.5em;
    margin-bottom: 30px;
    text-align: center;
}

@media screen and (min-width: 768px) {
    .page--node .content-before {
        margin-bottom: 5px;
        padding-top: 5px;
        .row {
            justify-content: unset;
        }
        .content-titles {
            padding: 0 0 0 105px;

            .is-sidebar-toggle-open & {
                padding-left: 350px;
            }
            .content-title {
                font-size : 1.5em;
            }
        }
        .nav.nav--toolbar {
            display: none;
        }
    }
    .theme-title {
        display: none;
    }
    .menu-tile {
        display: none;
    }
}
@media screen and (max-width: 768px) {
    .page--node .content-before  {
        padding-top : unset;
        margin-bottom : 0;
        
        .content-titles {
            display: none;
        }
    }
}

/* MENU DE L'INTERFACE */
.dataviz.category--menu {
    z-index : 50;
    position: inherit;
    
    .title {
        font-family: var(--font-family);
        font-weight: bold;
        line-height: 1.1;
        color : var(--color-primary);
        text-transform: uppercase;
        
        .sub-title {
            text-transform: initial;
            font-style: italic;
            font-size: 0.8em;
        }
    }
    .menu-secteur,
    .menu-annee {
        color : var(--color-secondary);
        background: #F2F2F2;
        font-weight: bold;
    }
    .typeahead__filter-button {
        background: #F2F2F2;
        color : var(--color-secondary);
    }
    .lib-search-epci {
        color : var(--color-secondary);
        font-style: italic;
        cursor : pointer;
    }
    .dataviz-sidebar {
        display: none;
    }
    .btn.icon {
        line-height: 1;
        padding: 0;
        background: none;
        display: inline-block;
        
        &:before {
            background-color: var(--color-secondary);
        }
        &:hover:before {
            background-color: var(--color-primary);
        }
    }
}

.dataviz.category--menu .disabled {
    cursor:  not-allowed;
    pointer-events: none;
    
    .lib-search-epci,
    .menu-secteur,
    .title,
    .typeahead__container button,
    .typeahead__filter button::after,
    .typeahead__cancel-button {
        color : var(--color-disabled);
    }
}
.dataviz.category--menu .lib-search-epci:hover {
    color : var(--color-primary);
}

/* Page de comparaison des dataviz */

.node--397 {
    .source,
    /*.comparaison-column.left .dataviz .dataviz-form,*/
    .js-dataviz-render_menu_geosites[type-compare="annee"],
    .js-dataviz-render_menu_annee[type-compare="geosite"] {
        display: none;
    }    
    .js-dataviz-render_menu_geosites[type-compare="geosite"],
    .js-dataviz-render_menu_geosite[type-compare="annee_geosite"],
    .js-dataviz-render_menu_annee[type-compare="annee"],
    .js-dataviz-render_menu_annee[type-compare="annee_geosite"] {
        display: block;
    }
}


/*__________________________________________________________________________________________________ 

/* DATAVIZ 
__________________________________________________________________________________________________ */
/*.dataviz {
    background: white;
}*/

.dataviz-footer,
.dataviz .dataviz-body {
    display: flex;
}

.dataviz.is-intro-open .dataviz-form {
  height: unset;
  opacity: 1;
  visibility: visible;
}

/* Mouse scroll sous la carte */
.dataviz .mouse-scroll {
    position: absolute;
    top: 80%;
    left: 50%;
    
    .item-mouse {
        position: relative;
        width: 20px;
        height: 30px;
        border: 2px solid var(--color-primary);
        border-radius: 14px;
    }
    .item-wheel {
        position: relative;
        display: block;
        margin: 5px auto;
        width: 4px;
        height: 4px;
        background: var(--color-primary);
        border: 2px solid var(--color-primary);
        border-radius: 8px;
        animation: mouse-wheel 1.4s linear infinite;
    }
    .item-arrow {
        display: block;
        margin: 1px 0 3px 2px;
        width: 10px;
        height: 10px;
        transform: rotate(45deg);
        transform-origin: bottom;
        border-bottom: 2px solid var(--color-primary);
        border-right: 2px solid var(--color-primary);
        animation: mouse-scroll 1.4s infinite;
        animation-direction: alternate;
        animation-delay: alternate;
    }
}

/* source */
.dataviz .source {
    font-style: italic;
    fill: var(--color-text);
    font-size: 0.8em;
}
.dataviz .leaflet-control-attribution {
    font-style: italic;
    color: white;
    background: var(--color-primary);
    height: 20px;
    padding-top: 3px;
    font-size: 1.1em;
}


.dataviz .dataviz-header {
    
    .dataviz-actions {
        .btn {
            & .icon {
            --icon-size: 30px;
            }
        }
    }

    .subtitle--dataviz {
        margin-bottom: 2px;
        display: block;
        .replace--text {
            background: var(--color-primary);
            color : white;
            padding: 2px 8px;
            font-weight: normal;
            border-radius: 4px;
            font-size: 0.8em;
        }
    }
    .replace--text.icon--pesticides_polycultures {
        color : var(--color-site-polycultures);
    }
    .replace--text.icon--pesticides_viticultures {
        color : var(--color-site-viticulture);
    }
    .replace--text.icon--pesticides_viticulture {
        color : var(--color-site-viticulture);
    }
   .replace--text.icon--pesticides_grandes_cultures {
        color : var(--color-site-grande-culture);
    }
    .replace--text.icon--pesticides_arboricultures {
        color : var(--color-site-arboriculture);
    }
    .replace--text.icon--pesticides_fourrages {
        color : var(--color-site-fourrage);
    }
    .replace--text.icon--pesticides_fond_urbain {
        color : var(--color-site-fond_urbain);
    }
    .replace--text.icon--none {
            display : none;
    }
    
    .title--dataviz {
        margin: 0;
        .icon {
            height: 25px;
            width: 25px;
            cursor: pointer;
            &:after {
                position: absolute;
                z-index: 1;
                margin-left: 15px;
                font-size: 15px;
                padding: 10px;
                border-radius: 5px;
                color: white;
                font-family: var(--font-family);
                font-weight: bold;
                display: none;
            }
        }
        .icon::before {
            mask-size : 25px
        }
        .icon--pesticides_grandes_cultures {
            &:after {
                content : "Grandes Cultures";
                background: var(--color-site-grande-culture);
            }
        }
        .icon--pesticides_viticultures {
            &:after {
                content : "Viticultures";
                background: var(--color-site-viticulture);
            }        
        }
        .icon--pesticides_fourrages {
            &:after {
                content : "Fourrages";
                background:  var(--color-site-fourrage);
            }        
        }
        .icon--pesticides_fond_urbain {
            &:after {
                content : "Fond urbain";
                background:  var(--color-site-fond_urbain);
            }        
        }
        .icon--pesticides_polycultures {
            &:after {
                content : "Polycultures";
                background: var(--color-site-polycultures);
            }
        }
        .icon--pesticides_arboricultures {
            &:after {
                content : "Arboricultures";
                background: var(--color-site-arboriculture);
            }        
        }
        .icon--pesticides_fongicides {
            &:after {
                content : "Fongicides";
                background:  var(--color-phy-fong);
            }        
        }
        .icon--pesticides_herbicides {
            &:after {
                content : "Herbicides";
                background: var(--color-phy-herb);
            }        
        }
        .icon--pesticides_insecticides {
            &:after {
                content : "Insecticides";
                background: var(--color-phy-insec);
            }        
        }
    }
}

.dataviz .title--dataviz .icon:hover {
    &:after {
        display: block;
    }
}



/* MAIN MAP */
.comparaison-column .main-map {
    .layout__region--second {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .block--dataviz {
        margin : 0;
    }
}
@media screen and (max-width: 1300px) {
    .node-body.main-map {
        .layout__region--second {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }
    }
}

/* PAGE COMPARAISON STYLE */
.comparaison-territoire {
    .layout.l-67-33 { 
        display: block;
    }
    .layout__region--second {
        display: flex;
    }
    .layout__region--second > .block--dataviz:nth-child(1) {
        margin: 0 5px 0 0;
    }
    .layout__region--second > .block--dataviz:nth-child(2) {
        margin: 0 0 0 5px;
    }    
    .left {
        float: left;        
        width: 49%;
        margin-right: 1%;
    }
    .right {
        float: right;
        width: 49%;
        margin-left: 1%;
    }
    
    
}

.route--datagone-dataviz-tools-embed {
    .content-builder-sidebar--left {
        display: none;
    }
    .content-titles {
        display: none;
    }
    .block--dataviz {
        box-shadow : none;
    }
}

/*____________________________________________.p-radiobutton-box______________________________________________________ 

CHIFFRES CLES 
__________________________________________________________________________________________________ */

.dataviz.category--chiffre-cle {
    header,
    footer,
    .dataviz-sidebar {
        display : none;
   }
    user-select: none;
}

.keynumber.style0 {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    text-align: center;
    width: 100%;
    padding : 10px;
    
    .keynumber-content-title {
        line-height : 1.1;
        .title {
            margin : 0;
            font-size: 1.3em;
        }
        .icon {   
            height: 70px;
            width: 70px;
        }
        .icon::before {
                mask-size: 70px;
                background: currentColor;
        }
        .icon.icon--pesticides_pesticides::before, .icon.icon--pesticides_endocrinien::before {
            background: white;
        }
    }
    
    .prefixtext {
        font-size: 1.3em;
        margin : 0;
    }
    .text {
        margin : 0;
        font-size : 15px; 
        line-height: 1;

        strong {
            display: block;
            font-size : 30px;
            font-weight: bold;;
        }
        .icon {
            font-size: 1.8em;
            vertical-align: middle;
            
            &:before {
                background-color: #fff;
            }
        }
    }
    .sufixtext {
        font-size: 1.6em;
        line-height : 1;
        font-weight: bold;
        margin-bottom: 0;
        .icon::before {
            background : var(--color-primary)
        }
    }
    img {
        scale : 0.8;
    }
 }
 



/*__________________________________________________________________________________________________ 

GESTION DE LA COULEUR DES ICONS
__________________________________________________________________________________________________ */


/*__________________________________________________________________________________________________ 

FORMULAIRE
__________________________________________________________________________________________________ */

.dataviz-form .buttonFilter.switch {
    --p-toggleswitch-checked-background  : #213b50 !important;
}

.dataviz-form .buttonFilter.switch  {
    .radioFilter--element {
        margin-top : 10px;
    }
    .radioFilter--label {
        margin-bottom: 15px;
        font-weight: bold;
    }
    
}

.dataviz-form .radioFilter {
      
    --p-primary-color : #213b50 !important;
    --p-radiobutton-checked-hover-background : #213b50 !important;
    --p-radiobutton-checked-hover-border-color : #213b50 !important;
    --p-radiobutton-checked-background : #213b50 !important;
    --p-radiobutton-checked-border-color : #213b50 !important;
    --p-radiobutton-icon-checked-color : #213b50 !important;
    --p-radiobutton-border-color : var(--p-primary-color) !important;
    margin-top : 20px;
    .radioFilter--element {
        margin-bottom : 10px;
    }
    .radioFilter--label {
        margin-bottom: 15px;
        font-weight: bold;
    }
    .radioFilter--element-label {
        margin: 0 0 0 10px;
        font-family: var(--font-family);
    }
    .p-radiobutton-checked + .radioFilter--element-label {
        font-weight: bold;
    }
}


/*.dataviz-form .radioFilter[scanname="selectFamily"],  .dataviz-form .radioFilter[scanname="selectCombustible"] {*/
.dataviz-form .radioFilter.icon-button {
    
    --p-radiobutton-checked-background : none !important;
    --p-radiobutton-checked-hover-background : none !important;

    .radioFilter--element {
        margin-bottom : 10px;
        display: flex;
        flex-direction: row;
        align-items: center;
        .p-radiobutton-box {
            border : none;
            width: 27px;
            height: 25px;
        }
        .p-radiobutton {
            .icon::before {
                background: var(--color-disabled);
                mask-size : 25px;
            }
        }
        .p-radiobutton-checked
            .icon::before {
                background: currentColor;
        }
        .radioFilter--element-label {
            margin: 0 0 0 10px;
            font-family: var(--font-family);
        }
        .radioFilter--element-label {
            cursor : pointer;
        }
    }
    .p-radiobutton-checked + .radioFilter--element-label {
        font-weight: bold;
    }

}

/* Bouton pour la dataviz 
Evolution des concentrations de pesticides par site (en ng/m³)
*/
.custom-checkbox-icons {
    --color-transparent: transparent !important;
    --p-checkbox-border-color: var(--color-transparent)!important;
    --p-checkbox-checked-background:var(--color-transparent)!important;
    --p-checkbox-checked-border-color:var(--color-transparent)!important;
    --p-checkbox-checked-hover-background:var(--color-transparent)!important;
    --p-checkbox-checked-hover-border-color:var(--color-transparent)!important;
    align-items: center;
    .p-checkbox.p-component {
        font-weight: normal;
        height: 30px;
        width: 30px;
        input {
            display: none;
        }
        .p-checkbox-box {
            height: 30px;
            width: 30px;
        }
        .p-icon.p-checkbox-icon {
            display: none;
        }
    }
    .radioFilter--content {
        font-family: var(--font-family);
        margin : 0;
    }
    .p-checkbox.p-component.p-checkbox-checked + .radioFilter--content {
        font-weight: bold;
    }
}


/*.dataviz, .map-tooltip, .dataviz-form .radioFilter[scanname="selectFamily"]  .p-radiobutton-checked {*/
/*.dataviz-form .buttonsFilterSelection[scanname="selectStations"], */
.dataviz-form .radioFilter[scanname="selectFamily"]  .p-radiobutton-checked {
    .icon.icon--pesticides_pesticides::before {
        background: var(--color-phy-phytos);
    }
    .icon.icon--pesticides_herbicides::before {
        background: var(--color-phy-herb);
    }
    
    .icon.icon--pesticides_insecticides::before {
        background: var(--color-phy-insec);
    }  
    .icon.icon--pesticides_fongicides::before {
        background: var(--color-phy-fong);
    }
    .icon.icon--pesticides_endocrinien::before {
        background: var(--color-phy-endo);
    }
    .icon--pesticides_grandes_cultures::before {
        background : var(--color-site-grande-culture);
    }
    .icon--pesticides_viticultures::before {
        background : var(--color-site-viticulture);
    }
    .icon--pesticides_fourrages::before {
        background:  var(--color-site-fourrage);
    }
    .icon--pesticides_fond_urbain::before {
        background:  var(--color-site-fond_urbain);
    }
    .icon--pesticides_polycultures::before {
        background: var(--color-site-polycultures);
    }
    .icon--pesticides_arboricultures::before {
        background: var(--color-site-arboriculture);
    }
    
    .icon--emi_combustible_bois::before {
        background: var(--color-primary);
    }
    
    .icon--::before {
        background: var(--color-site-arboriculture);
    }
}


.dataviz-form div[scanname="selectStations"] { 
    
    .p-checkbox {
        .icon {
            color : #9ca3af;
        }
    }
    
    .p-checkbox.p-checkbox-checked  {
        .icon--pesticides_grandes_cultures {
            color : var(--color-site-grande-culture);
        }
        .icon--pesticides_viticultures {
            color : var(--color-site-viticulture);
        }
        .icon--pesticides_fourrages {
            color:  var(--color-site-fourrage);
        }
        .icon--pesticides_fond_urbain {
            color:  var(--color-site-fond_urbain);
        }
        .icon--pesticides_polycultures {
            color: var(--color-site-polycultures);
        }
        .icon--pesticides_arboricultures {
            color: var(--color-site-arboriculture);
        }
    }

}


/*__________________________________________________________________________________________________ */
/* SCANLIB V6 css*/
/*__________________________________________________________________________________________________ */
.dataviz .dataviz-form {
    user-select: none;
};
/* PIE */
.dataviz .labels--pie  {
    .label--pie.assol_viticulture {
        fill: white;
    }
    .label--pie.novalue {
        display: none;
    }
}
.dataviz .arc.novalue {
    pointer-events: none;
}
.dataviz .scan--pie {
    .infocentre {
        font-size : 1.3em ;
    }
}


/* HEATMAP */
.legend-container .text-legend,
.legend-container .legend-text {
    font-size : 14px;
    fill : var(--color-text);
    font-weight: bold;
}
 
/* TREEMAP */
.dataviz .treemap {
    .label--treemap .text {
        font-family: var(--font-family);
        font-weight: bold;
    }
    .icon.icon-text.label--treemap {
        fill : white
    }
}

/* PYRAMID */
.dataviz .pyramid {
    .axis--name,
    .stagger-label {
        font-size: 1em;
        fill : var(--color-primary);
        font-weight: bold;
    }
    .bar-label {
        font-size: 0.9em;
        fill: var(--color-primary);
    }  
    .axis.yaxis.label {
        font-size: 0.9em;
        fill : var(--color-text);
    }
}

/* PLOTBAR */
.dataviz .graphBar {
    .stagger-label {
        font-size: 1em;
        fill : var(--color-primary);
        font-weight: bold;
    }
    .bar_label.novalue {
        display: none;
    }
}

.tooltip.scan {
    background: white;
    table tbody td {
        border : none;
    }
}
.dataviz rect.bar[defy="novalue"] {
    pointer-events: none;
}

/* PLOTBARLINK */
.plotBarLink .text-top,
.plotBarLink .text-bottom {
    font-weight: bold;
    font-size: 1.1rem;
}

.plotBarLink .icon-legend {
    font-size: 3rem;
}

/* PLOTPOLARAREA */
.polararea text.label.outside.icon {
    font-size : 2em;
}
.petale-value-text .petale-text {
    font-size: 1.4em;
}
.petale-value-text .icon {
    font-size: 3em;
}

/* Axis */
.dataviz .axis.xaxis {
    label {
        fill : var(--color-text);
    }       
    .tick{
        font-size: 12px;
    }
}

.dataviz[data-nid="85"],.p-radiobutton-box
.dataviz[data-nid="116"] {
    .axis.xaxis {
        font-size: 12px;
    }
}

.dataviz .axis.yaxis {
    font-size: 1em;

    label {
        fill : var(--color-text);
    }       
    .tick{
        font-size: 14px;
        fill : var(--color-text);
    }
}
    
.dataviz .axis [label="selected"] {
    fill : var(--color-primary);
    font-weight: bold;
}


/* LEGEND */
.dataviz .map-legend {
    fill : var(--color-text);
    font-size : 0.9em;
}
.dataviz .local-map-legend {
    color : var(--color-text);
    font-size: 15px;
    font-weight: bold;
}
.dataviz .legend {
    .legend-title {
        fill : var(--color-text);
        color : var(--color-text);
        font-size: 15px;
        font-weight: bold;
    }
    .legend-text {
        fill : var(--color-text);
        font-size : 13px;;
    }
    .legend-icon {
        transform: scale(.05);
    }
}

/* LEGEND.BIG-ICONS */
.dataviz .legend.big-icons {
    .legend-icon {
        transform: scale(.07);
    } 
    .legend-text {
        transform: translate(10px,0px);  
    }
} 

/* BRUSH */
.dataviz .brush {
    rect.selection {
        stroke: none;
        fill: #ccc;
        fill-opacity: .7;
    }
    rect.overlay {
        stroke: #ccc;
        stroke-width: 1px;
    }       
    .handle--custom.icon {
        fill: #ccc;
    }
}

/* TOOLTIP */
.tooltip.graph,
.local-tooltip,
.waffle--tooltip{
    background-color : var(--color-primary);
    border : 1px solid var(--color-primary);
    color : white;
    border-radius : 5px;
    padding : 5px;
    z-index : 100;
    position : absolute;
    text-align: center;
    font-family: var(--font-family);
    pointer-events: none;
    
    .tooltip-title {
        font-size: 1em;
        color : white;
        text-align: center;
        font-weight: bold;
    }
    li:before {
        color : white !important;
    }
}

.map-tooltip,
.map2-tooltip,
.map-tooltip-sidebar {
    background-color : var(--color-primary);
    border : 1px solid var(--color-primary);
    color : white;
    border-radius : 5px;
    padding : 5px;
    z-index : 100;
    position : absolute;
    font-family: var(--font-family);
    pointer-events: none;
    
    .tooltip-title {
        font-size: 1em;
        color : white;
        text-align: center;
        font-weight: bold;
    }
    p {
        margin-bottom: 0px;
    }
}
.map-tooltip-form {
    background-color : var(--color-primary);
    border : 1px solid var(--color-primary);
    color : white;
    border-radius : 5px;
    padding : 5px;
    z-index : 100;
    position : absolute;
    font-family: var(--font-family);
    pointer-events: none;
    
    .tooltip-title {
        font-size: 1em;
        color : white;
        text-align: center;
        font-weight: bold;
    }
    p {
        margin-bottom: 0px;
    }
}

/* LEAFLET */
.leaflet-container {
    background: none;
}
.leaflet-control-zoom {
    display: none;
}
.leaflet-legend.leaflet-control {
    margin-bottom: 0px;
}
.leaflet-control-layers-toggle {
    background-image: url("/sites/atmo-occitanie/files/images/layers.png");
}
.leaflet-right {
    z-index : 1;
}
.leaflet-control-layers label {
    font-family: Montserrat;
}

/* Leaflet Legend */
.leaflet-bottom.leaflet-left {
    z-index : 10;
    display: grid;
    width: 100%;
    background: none;
    margin-bottom : 30px;
}
.leaflet-legend {
    background: #fff;
    margin : 0;
    width: fit-content;

    .legend-container {
        padding : 0 5px;
        font-family: var(--font-family);
        font-size: .813rem;
        fill: var(--color-text);
    }
}

/* Utilisé dans le theme "Agir" sur la carte du réseau routier pour masquer les geosites non sélectionnés */
.dataviz .leaflet-mask-pane svg {
    path.mask.leaflet-interactive {
        fill : #F5EEE6;
        fill-opacity: 0.8;
        stroke: none;
        pointer-events: none;
        stroke-width: 0px;
    }
    path.display.leaflet-interactive {
        fill : none;
        fill-opacity: 0.8;
        stroke: var(--color-primary);
        pointer-events: none;
        stroke-width: 3px;
    }
}

.dataviz .d3-overlay .icon path {
    pointer-events: auto;
}

/* STYLE DES DATAVIZ EN VIGNETTE */
.list--page-selection .dataviz .axis.yaxis,
.list--page-selection .dataviz .axis.xaxis {
    .tick {
        font-size: 11px;
    }
}
.list--page-selection .dataviz .axis.yaxis.label {
    font-size: 11px;
}

/* TYPEHEAD */
.typeahead__field input {
    border : none;
    background: #f2f2f2;
}
.typeahead__list {
    max-height: 450px;
    overflow-y: auto;
    
    > .typeahead__group:first-child {
        border-top: none;
    }
}

.typeahead__dropdown li:last-child {
  margin-top: none;
  padding-top: none;
  border-top: none;
}
.typeahead__list,
.typeahead__dropdown {
    padding : 0px;
    border: 1px solid var(--color-primary);
    z-index: 2;
}

.typeahead__list > .typeahead__group > a,
.typeahead__list > .typeahead__group > a:hover,
.typeahead__list > .typeahead__group > a:focus,
.typeahead__list > .typeahead__group.active > a {
  color: #ffffff;
  background: var(--color-primary);
}

.typeahead__container button {
    border : 1px solid #f2f2f2;
    background: #f2f2f2;
    color : var(--color-primary);
}
.typeahead__filter button::after {
    content: "▼";
    border : none;
    margin-right: 10px;
    vertical-align: 0px;
    color : var(--color-secondary);
}
.typeahead__container.cancel:not(.loading) .typeahead__cancel-button:hover {
    color : var(--color-secondary);
}
.typeahead__cancel-button {
    color : var(--color-secondary);
}
.typeahead__container a:not(.btn) {
    text-decoration: none;
}
.typeahead__result {
    .typeahead__item.typeahead__group-group.nodata {
        background: #f2f2f2;
        font-style: italic;
        pointer-events: none;
    }
}

/* OPENSANKEY */
.box_width_threshold,
.zdt_handles {
    display : none
}

.dataviz .ggg_nodes .node_text {
    fill : white
}
.dataviz .image-comparer__divider {
    border-left : 1px solid var(--color-primary);
}
.dataviz .image-comparer__handle {
    background: var(--color-primary);
}

/* SURCHARGE Spécifiques pour des affichages de section différentes entre screen et print */
.special0.layout.layout--twocol {
    display: block;
    
    .layout__region.layout__region--first {
        display: flex;
        flex-direction: row;
    }
}


/* RESPONSIVE */
/* On pilote le responsive de la page (< 1300px) */
@media screen and (max-width: 1300px) {
    .menu-title {
        display: none;
    }

    .layout.l-67-33 { 
        display: block;
    }
    .l-67-33 .layout__region--second {
        display: flex;
    }
}

/* si la largeur de la dataiviz est < 900px (container) */
@container dataviz (max-width: 900px) {
    .dataviz-container {
        width: 100%;
    }
    .dataviz-sidebar-container {
        display: block;
    }
    .dataviz-sidebar {
        width: 100%;
        padding : 0;
    }
    .dataviz-form--prefix {
        margin-bottom: 0px;
    }
    /*
    .buttonFilter.radioFilter.vertical {
        .radioFilter--label {
            text-align: right;
        }
        .radioFilter--groupcontent {
            display: flex;
            justify-content: right;
        }
        .radioFilter--content label {
            margin-right: 5px;
        }
        
    }
    .dataviz-form .radioFilter.buttonFilter {    
        .radioFilter--groupcontent {
            display: flex;
            flex-wrap: wrap;
        }
    }*/    
    .buttonFilter.radioFilter.icon-button {
        .radioFilter--content {
            display: flex;
            flex-direction: row;
            justify-content: right;
        }
    }
}


/*agir--selectTypeRoute selectTypeRoute_abaissement*/
.radioFilter[scanname="agir--selectTypeRoute_abaissement"] {
    .radioFilter--element{
        align-items: center;
    }
    /*route concerne */
    .route_concerne.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne_abaissement.svg");
        }
    }
    
    .route_concerne .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne_abaissement_disabled.svg");
        }
    }
    
    /*route 130*/
    .route130.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130_abaissement.svg");
        }
    }
    
    .route130 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130_abaissement_disabled.svg");
        }
    }
    
    /*route 110*/
    .route110.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110_abaissement.svg");
        }
    }
    
    .route110 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110_abaissement_disabled.svg");
        }
    }
    
    /*route 80 90*/
    .route80.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80_abaissement.svg");
        }
    }
    
    .route80 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80_abaissement_disabled.svg");
        }
    }
    
    
}

.radioFilter[scanname="agir--selectTypeRoute_abaissement-vertical"] {
    width: 100%;
    .radioFilter--content {
        display: flex;
        justify-content: space-around !important;
    }
    
    .route_concerne.radioFilter--element {
        display: none !important;
    }
    .radioFilter--element{
        align-items: center;
    }
    /*route concerne */
    .route_concerne.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne_abaissement_vertical.svg");
        }
    }
    
    .route_concerne .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne_abaissement_vertical_disabled.svg");
        }
    }
    
    /*route 130*/
    .route130.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130_abaissement_vertical.svg");
        }
    }
    
    .route130 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130_abaissement_vertical_disabled.svg");
        }
    }
    
    /*route 110*/
    .route110.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110_abaissement_vertical.svg");
        }
    }
    
    .route110 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110_abaissement_vertical_disabled.svg");
        }
    }
    
    /*route 80 90*/
    .route80.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80_abaissement_vertical.svg");
        }
    }
    
    .route80 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80_abaissement_vertical_disabled.svg");
        }
    }
    
    
}

/*agir--selectTypeRoute selectTypeRoute_abaissement*/
.radioFilter[scanname="agir--selectTypeRoute"] {
    .radioFilter--element{
        align-items: center;
    }
    /*route concerne */
    .route_concerne.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne.svg");
        }
    }
    
    .route_concerne .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route_concerne_disabled.svg");
        }
    }
    
    /*route 130*/
    .route130.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130.svg");
        }
    }
    
    .route130 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route130_disabled.svg");
        }
    }
    
    /*route 110*/
    .route110.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110.svg");
        }
    }
    
    .route110 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route110_disabled.svg");
        }
    }
    
    /*route 80 90*/
    .route80.checked .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80.svg");
        }
    }
    
    .route80 .radioFilter--element-label {
        font-size: 0;
        &:before {
            color: var(--color-primary);
        }
        &:after {
              content:url("/sites/atmo-occitanie/files/svgs/theme_agir/route80_disabled.svg");
        }
    }
    
    
}

.radioFilter[scanname="selectTypeReglementation"] {
    .radioFilter--content{
        display: flex;
        flex-direction: column;
        justify-content: space-around !important;
        .radioFilter--element{
            font-size: larger;
        }
        .p-radiobutton-box{
            box-shadow: none;
        }
    }
}


.buttonFilter[scanname="selectTypeIndicateur"] {
    .radioFilter--element{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .p-toggleswitch{
        margin : 0 5px;
        min-width: 40px;
    }
}

/*_________________________________________________________________*/
/* PRINT */
/*_________________________________________________________________*/
/* element ADMIN de la print Page */
.page--print {
    .nav--toolbar.print-quick-layout-actions {
        display : none;
    }
    .nav--toolbar {
        display : none;
    }
    .datagone-debug {
        display : none;
    } 
    .dataviz-form {
      right: -120%;
      margin-right: 0;
      max-width: 550px;
      transform: translateY(-100%);
    }

}
/*.print-page {
    padding: 0px;
}*/

.print-page {
    .no-print {
        display: none;
    }
}

.print-page {
    .category--no-move-form-print .dataviz-form{
        display: block;
        border : none;
        right: unset;
        margin-right: unset;
        width: unset;
        max-width: unset;
        transform: unset;
        position: unset;
        .radioFilter--label {
            display: none;
        }
    }
    
}


.page--print {
    
    .layout--threecol {
        display: flex;
    }
    .print-page.l-landscape {
        width: 297mm !important;
        min-height: 190mm;
    }

   /* .builder-row {
        margin-left : 0;
        margin-right: 0;
    }
    
    .node.node--page  {
        width: 100%;
    }
    .view-mode--print {
        width: 100%;
    }
    .dataviz-container {
        width: 100%;
    }
    .dataviz-sidebar-container {
        display: block;
    }
    .dataviz-sidebar {
        width: 100%;
        padding : 0;
    }
    .dataviz-form--prefix {
        margin-bottom: 5px;
    }
    
    .dataviz .dataviz-intro {
        max-width: unset;
        margin-top: 5px;
        margin-right: unset;
        font-size: 0.9em;
        p {
            margin: 0 0 0em;
        }
    }
    */
    
    .content-title {
        font-size: 1.5em;
    }
    .dataviz-actions {
        display: none;
    }
    
    .title.title--dataviz {
        font-size: 1em;
        display: inline;
    }
    
    .keynumber.style0 {
        font-size: 0.8em;
    }
    .special0.layout.layout--twocol {
        display: flex;
        .layout__region.layout__region--first {
            display: flex;
            flex: 0 1 33%;
            flex-direction: column;
        }
    }

    
}

.print-page .keynumber.style0 {
     .icon::before {
         font-size:  3em;
     }
     .prefixtext {
         margin: 0 0 0.5em;
     }
     .text {
         margin-top: 15px;
         
        strong {
            font-size: 1.5rem
        }
     }
     .icon {
         font-size: 0.8em;
     }
 }

/*_________________________________________________________________*/
/* RAPPORT TERRITORIAUX */
/*_________________________________________________________________*/
.category--rapport {
    .dataviz .dataviz-intro {
        display: none;
    }
    .node-comments-container {
        display: none !important;
    }
}

/*_________________________________________________________________*/
/* Rapport Emissions
/*_________________________________________________________________*/
.print-page.category--rapport-emissions {
    /*padding : 0;*/
    /*width: var(--print-page-width)-10mm*/
   /*width: var(--print-page-width);*/
    width: 190mm;
    padding : 0;
    margin :0;
    .builder-row {
        & > .builder-item {
            margin: 0 0mm;
            padding : 0 0mm;
        }
    }
        
}

.category--rapport-emissions {
    
    --box-shadow-l : none !important;

    /*pointer-events: none;*/
    background: white;
    padding-top: 0;
    .layout {
        margin: 0;
        padding: 0;
    }
    .content-titles {
        display: none;
    }
    h2 {
        border-bottom: 2px solid var(--color-primary);
        margin-bottom: 0;
        font-size: 14px;
    }
    h3 {
        font-family: var(--font-family);
        color : var(--color-primary);
    }
    p {
        margin: 0 0 5px;
        line-height: 1.2;
        font-size: 13px;
    }
    li {
        margin: 0;
        line-height: 1.2;
        font-size: 13px;
    }
    .block.block--dataviz {
        padding : 0;
    }
    .dataviz {
        .dataviz-header {
            margin-bottom: 5px;
            & .subtitle--dataviz {
                display: none;
            }
        }
    }
    .dataviz.print--mode, .dataviz[data-nid="331"], .dataviz[data-nid="280"],.dataviz[data-nid="414"],.dataviz[data-nid="411"]  {
         .dataviz-header {
            .title--dataviz {
                font-size: 14px;
            }
        }
        .legend, .dataviz .legend.big-icons {
            & .legend-icon {
                scale : 0.85 !important;
            }
        }

        .dataviz-sidebar-container {
            display: flex;
            flex-direction: row;
            .dataviz-container {
                width: 75%;
            }
            .dataviz-sidebar {
                width: 25%;
                padding-left : 10px;
            }
        }
        .dataviz-footer {
            ul {
                margin-bottom : 0;
            }
        }
        /*.dataviz-form--suffix {
            font-size: 12px;
        }*/
    }
    
    .dataviz[data-nid="331"] {
        .selection, .after-evolution, .handle {
            display: none;
        } 
         
    }
    
    .builder-item.layout__region.layout__region--second {
        flex-direction: column;
    }
    
    .dataviz[data-nid="263"],.dataviz[data-nid="284"],.dataviz[data-nid="279"],.dataviz[data-nid="280"],.dataviz[data-nid="264"],.dataviz[data-nid="319"]  {
        .dataviz-sidebar-container {
            display: flex;
            flex-direction: column;
            .dataviz-container {
                width: 100%;
            }
            .dataviz-sidebar {
                width: 100%;
            }
        }
         
    }
    .dataviz[data-nid="414"],.dataviz[data-nid="411"]  {
        margin-bottom: 15px;
        .dataviz-sidebar-container {
            display: flex;
            flex-direction: row;
            .dataviz-container {
                width: 75%;
            }
            .dataviz-sidebar {
                width: 25%;
            }
        }
         
    }
    
    .infocentre--content {
        font-size: 0.8em;
    }
    
    .leg-text-obj, .leg-text-data {
        font-size : 0.9em;
    }
    
    .petale-value-text .petale-text {
        font-size: 1.0em;
        transform: translateY(20px);
    }
    
    .plotBarLink .icon-legend svg {
        scale : 0.5
    }
    .layout--twocol {
        display: flex !important;
    }
    .category--chiffre-cle {
        margin : 0 5px;
    }
    .keynumber.style0 {
        & .keynumber-content-title {
            & .title {
                font-size: 1.1em;
            }
        }
    }
    
    
}