/* Document CSS */


/* contingut */

.imc--co-contingut { padding: 0 2em 2em 2em; }
.imc--co-contingut .imc--co { width: 100%; max-width: var(--app-amplaria); margin: 0 auto; }



/* presentació */

.imc--presentacio { text-align: center; padding-top: 2em; margin-bottom: 1.5em; background-color: transparent !important; border: 0 !important; }
.imc--presentacio h1 > span { font-size: 1.5em; font-weight: normal; }



/* idioma */

.imc--idioma { display: flex; justify-content: center; gap: 0 1em; margin-bottom: 2em; }

html[lang="ca-ES"] .imc--idioma button[data-idioma="ca-ES"],
html[lang="es-ES"] .imc--idioma button[data-idioma="es-ES"],
html[lang="en-GB"] .imc--idioma button[data-idioma="en-GB"] { font-weight: bold; background-color: var(--color-principal-seleccionat); border-color: var(--color-principal); pointer-events: none; }



/* accessos */

.imc--accessos { display: flex; justify-content: center; gap: 0 1.5em; margin-bottom: 2em; }
.imc--accessos .imc--acces { width: 100%; max-width: 25em; text-align: center; }

.imc--accessos .imc--acces button { display: inline-flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; min-height: 15em; margin-bottom: 1em; border-radius: 1.3em; }
.imc--accessos .imc--acces button::after { content: ""; display: block; width: 100%; height: 6em; background: transparent url() no-repeat center center / auto 70%; }

.imc--accessos .imc--acces button[data-accio="acces-clave"]::after { background-image: url(../imgs/logo_clave.svg); }
.imc--accessos .imc--acces button[data-accio="acces-certificat"]::after { background-image: url(../imgs/logo_certificat.svg); background-size: auto 100%; }

.imc--accessos .imc--acces button span { position: relative; bottom: .9em; font-size: 1.2em; }

.imc--accessos .imc--acces p.imc--info { min-height: 5em; font-size: .9em; margin-bottom: 1em; }

.imc--accessos .imc--acces a { display: inline-flex; align-items: center; gap: 0 .7em; }
.imc--accessos .imc--acces a::after { content: ""; display: block; width: 1.5em; height: 1em; background: transparent url(../imgs/icones/ico_fletxa.svg) no-repeat center center / 100% auto; }



/* funcionar habilitat */

.imc--funcionari-habilitat { text-align: center; padding: .5em 2em; margin-bottom: 2em; border: 1px dotted #aaa; border-right: none; border-left: none; }

.imc--funcionari-habilitat a { display: inline-flex; align-items: center; gap: 0 .7em; padding: .5em 1em; }
.imc--funcionari-habilitat a::before { content: ""; display: block; width: 1.5em; height: 1em; background: transparent url(../imgs/icones/ico_funcionari_habilitat_093574.svg) no-repeat center center / auto 100%; }
.imc--funcionari-habilitat a::after { content: ""; display: block; width: 1.5em; height: 1em; background: transparent url(../imgs/icones/ico_fletxa.svg) no-repeat center center / 100% auto; }

.imc--funcionari-habilitat a span { font-size: 1.1em; }



/* problemes */

.imc--problemes { text-align: center; }
.imc--problemes p { font-size: .9em; }



/* funcionari habilitat */

.imc--login-func header {
    text-align: center;
    padding: 1em 2em 1em 2em;
    margin-bottom: 1.5em;
    background-color: #f2f2f2;
    border-bottom: 1px solid #ccc;
}
.imc--login-func header .imc--co { width: 100%; max-width: var(--app-amplaria); margin: 0 auto; }

.imc--login-func header .imc--co > p {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 1em;
    margin-bottom: 1em;
}

.imc--login-func .imc--ico.imc--torna::before {
    background-image: url(../imgs/icones/ico_fletxa.svg);
    transform: rotate(180deg);
}

.imc--login-func .imc--ico.imc--desconnecta::before {
    background-image: url(../imgs/icones/ico_desconnecta_EF2345.svg);
}

.imc--login-func header h1 span { font-size: 2em; }


.imc--login-func h2 { margin-bottom: 1em; }
.imc--login-func h2 span { font-weight: 400; }


.imc--login-func .imc--blocs { width: 100%; max-width: 59em; margin: 0 auto; }
.imc--login-func .imc--blocs .imc--bloc { margin-bottom: 1.5em; }
.imc--login-func .imc--blocs .imc--bloc > p { margin-bottom: 1em; }


.imc--login-func .imc--f-els { justify-content: flex-start; }

.imc--f-el.imc--f-func-persona-nif { width: 10em; }
.imc--f-el.imc--f-func-persona-nom { width: calc(33% - 5em); }
.imc--f-el.imc--f-func-persona-cognom1 { width: calc(33% - 4.5em); }
.imc--f-el.imc--f-func-persona-cognom2 { width: calc(33% - 4.5em); }


.imc--plantilla { padding: .8em 1em; margin-bottom: 1.5em; background-color: #ffc; }


.imc--ico-darrere.imc--descarrega::after { background-image: url(../imgs/icones/ico_descarrega_093574.svg); }

.imc--ico-darrere.imc--adjuntar::after { background-image: url(../imgs/icones/ico_adjuntar_093574.svg); }
[disabled].imc--ico-darrere.imc--adjuntar::after { background-image: url(../imgs/icones/ico_adjuntar_111.svg); }


.imc--consentiment { display: flex; align-items: center; justify-content: center; gap: 0 1em; padding: .8em 1em; margin-bottom: 1.5em; background-color: #f2f2f2; }

/*.imc--img.imc--elimina { padding-right: .8em; padding-left: .8em; margin-right: 2em; }*/

.imc--enviament { text-align: center; }



/* pasos */

.imc--login-pasos .imc--pasos { margin-bottom: 2em; }
.imc--login-pasos .imc--pasos ol { display: flex; align-items: center; justify-content: center; gap: 0 2em; font-size: 1.2em; }
.imc--login-pasos .imc--pasos ol li { display: flex; align-items: center; justify-content: center; gap: 0 1em; white-space: nowrap; } 
.imc--login-pasos .imc--pasos ol li:not(:last-child)::after { content: ""; width: 100%; min-width: 3em; border-bottom: 1px dashed #666; }

.imc--login-pasos .imc--pasos ol div { display: flex; align-items: center; justify-content: center; gap: 0 .5em; white-space: nowrap; }
.imc--login-pasos .imc--pasos ol div span { display: inline-flex; align-items: center; justify-content: center; font-size: 1.5em; width: 2em; height: 2em; border: 2px solid #666; border-radius: 50%; }

.imc--login-pasos .imc--pasos ol div:not([aria-current]) { color: #666; }
.imc--login-pasos .imc--pasos ol div:not([aria-current]) span { border: 2px solid #ccc; }
.imc--login-pasos .imc--pasos ol div:not([aria-current]) strong { font-weight: normal; }

.imc--login-pasos .imc--pasos ol div[data-completat] { color: rgb(8, 108, 0)}
.imc--login-pasos .imc--pasos ol div[data-completat] span { border: 2px solid rgb(8, 108, 0)}


.imc--login-pasos .imc--pas { margin-bottom: 3em; }
.imc--login-pasos .imc--pas[aria-hidden="true"] { display: none; }

.imc--login-pasos .imc--pas p { text-align: center; margin-bottom: 1.5em; }
.imc--login-pasos .imc--pas .imc--f-els { padding: 2em 1em; margin-bottom: 2.5em; background-color: #f2f2f2; }

.imc--login-pasos .imc--pas-botonera { display: flex; align-items: center; justify-content: center; gap: 0 2em; }


.imc--login-pasos .imc--plantilla { display: flex; align-content: center; justify-content: center; gap: 0 1em; text-align: center; padding: 2em 1em; margin-bottom: 2.5em; background-color: #f2f2f2; }


.imc--login-pasos .imc--consentiment { padding: 2em 1em; margin-bottom: 2.5em; }

.imc--login-pasos .imc--consentiment input[type="file"],
.imc--login-pasos .imc--consentiment .imc--arxiu { display: none; }

.imc--login-pasos .imc--consentiment[data-estat="annexat"] button.imc--annexa { display: none; }

.imc--login-pasos .imc--consentiment[data-estat="annexat"] .imc--arxiu { display: flex; align-items: center; justify-content: center; gap: 0 2em; }

.imc--login-pasos .imc--consentiment .imc--nom { display: flex; align-items: center; gap: 0 .5em; font-weight: bold; }
.imc--login-pasos .imc--consentiment .imc--nom::before { content: ""; display: inline-block; vertical-align: middle; position: relative; top: 0; width: 1.2em; height: 1.2em; background: transparent url("../imgs/icones/ico_doc.svg") no-repeat 50% 50% / auto 100%; }


.imc--login-pasos .imc--consentiment button.imc--bt-terciari { background-color: #fff; }



.imc--annex-iframe { width: 100%; height: calc(80vh - 12em); }



/* MEDIA QUERYS */

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

	.imc--login-func header h1 span { font-size: 1.7em; }

	.imc--login-func .imc--blocs { padding-top: 0; }

	.imc--f-el.imc--f-func-persona-nif,
	.imc--f-el.imc--f-func-persona-nom,
	.imc--f-el.imc--f-func-persona-cognom1,
	.imc--f-el.imc--f-func-persona-cognom2 { width: calc(50% - 1em); }

}

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

	.imc--f-el.imc--f-func-persona-nif,
	.imc--f-el.imc--f-func-persona-nom,
	.imc--f-el.imc--f-func-persona-cognom1,
	.imc--f-el.imc--f-func-persona-cognom2 { width: 100%; }

    .imc--img.imc--elimina { margin-right: 0; }

	.imc--consentiment { display: flex; align-items: center; flex-wrap: wrap; gap: .5em; }


	button.imc--envia { width: 100%; text-align: center; }

}

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

	.imc--presentacio p { font-size: 1.2em; }

	.imc--idioma { gap: 0 .3em; }
	.imc--idioma button span { font-size: .9em; }

	.imc--accessos { flex-direction: column; gap: 1.5em .5em; }
	.imc--accessos .imc--acces button { min-height: 8em; }
	.imc--accessos .imc--acces button::after { height: 4em; }
	.imc--accessos .imc--acces button span { position: static; bottom: 0; }

	.imc--accessos .imc--acces p.imc--info { text-align: left; min-height: inherit; }

	.imc--accessos a { text-align: left; text-wrap: balance; }

	.imc--funcionari-habilitat { padding: .5em 0; }

	.imc--problemes p a { display: block; }

}