/* Document CSS */


/* filtrar per */

.imc--filtra-per { margin-bottom: .5em; }
.imc--filtra-per .imc--f-el .imc--f-control { flex-wrap: wrap; gap: .5em; }



/* filtres mes */

.imc--filtres-mes { display: flex; align-items: center; gap: 0 .5em; margin-bottom: 1em; }

.imc--filtres-mes button span { text-wrap: nowrap; }
.imc--filtres-mes button strong { display: inline-flex; align-items: center; justify-content: center; width: 2em; height: 2em; font-size: .8em; font-weight: normal; color: #000; background-color: var(--color-secundari-hover); border: 2px solid #fff; border-radius: 50%; }



/* filtres -> expedients */

.imc--popup.imc--popup-filtres > .imc--contingut { grid-template-rows: auto 1fr auto; top: 0; left: auto; right: 0; width: 100%; max-width: 60em; height: 100%; max-height: 100vh; background-color: #fff; transform: translateX(100%); transition: transform .2s ease-out; }

.imc--popup.imc--popup-filtres[aria-hidden="false"] > .imc--contingut { transform: translateX(0); }


.imc--popup.imc--popup-filtres > .imc--contingut header { padding: 1em 1.5em 1em 2em; background-color: transparent; }

.imc--popup-filtres h3 span { font-size: 1em !important; }

.imc--popup-filtres .imc--info { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 1em; }
.imc--popup-filtres .imc--info hr { margin-bottom: .5em; }
.imc--popup-filtres .imc--info .imc--f-els { justify-content: flex-start; margin-bottom: 0; }


.imc--popup-filtres div[data-element="acordio"] > button { margin-bottom: 0; }




/* MEDIA */

@media only screen and (max-width : 700px) {

    .imc--filtra-per .imc--f-select,
    .imc--filtra-per .imc--f-select .imc--select { width: 100%; }

    .imc--filtra-per .imc--f-select .imc--select::after { margin-left: auto; }


    .imc--filtres-mes { justify-content: center; }


    .imc--popup.imc--popup-filtres > .imc--contingut header { display: flex; align-items: center; min-height: 4em; padding: 1em 4em 1em 1em; }
    .imc--popup.imc--popup-filtres > .imc--contingut h2 span { font-size: 1.2em; }

    .imc--popup.imc--popup-filtres .imc--info { flex-direction: column; }
    .imc--popup.imc--popup-filtres .imc--info .imc--f-els { flex-direction: column; }

}