/* Feuille de style utilisée pour customiser les éléments du DSFR ou se créer des composant DSFR-friendly, mais propres à Parcoursup */

/*--------------------------------------------------------------------------------------------------------*/
/*MENU DE NAVIGATION*/
/*--------------------------------------------------------------------------------------------------------*/

.psup-tiles-nav > [class*=" fr-col-"] {
	padding:0;
}

.psup-tiles-display{
	display:none;
 }
.psup-tiles-nav-container{
	overflow:unset;
}
 
/*--------------------------------------------------------------------------------------------------------*/
 /*CARTE ELEMENT*/
/*--------------------------------------------------------------------------------------------------------*/
.psup-carte-chiffre-cle, .psup-carte-texte-cle {
	color: var(--text-label-grey);
	font-weight:bold;
}

/*--------------------------------------------------------------------------------------------------------*/
/* JAUGES HORIZONTALES*/
/*--------------------------------------------------------------------------------------------------------*/

g text{
	font-size: 0.83rem;
}

.bar-rate-0-33-cumulus {
	fill: var(--background-action-high-blue-cumulus);
}
.bar-rate-33-66-cumulus {
	fill: var(--background-action-blue-cumulus-hover);
}
.bar-rate-66-100-cumulus {
	fill: var(--background-action-high-blue-cumulus-active);
}
.bar-border-cumulus {
	fill: white;
	stroke: var(--background-action-high-blue-cumulus-active);
}

/*--------------------------------------------------------------------------------------------------------*/
/* JAUGES VERTICALES - CHART BAR */
/*--------------------------------------------------------------------------------------------------------*/
.psup-bar-chart-container {
	padding: 0;
}
.psup-bar-chart-container ul {
	list-style: none;
}
.psup-bar-chart-graph {
	align-self: center;
	overflow: visible;
}
.psup-bar-chart-y-text,
.psup-bar-chart-x-text {
	fill: currentColor;
	font-weight: bold;
}
.psup-bar-chart-x-text {
	width: calc(30px+10%);
}
.psup-bar-chart-domain {
	stroke: currentColor;
}
.psup-bar-chart-rate-0-33 {
	fill: var(--background-action-high-blue-ecume-active);
}
.psup-bar-chart-rate-33-66 {
	fill: var(--background-action-high-blue-ecume-hover);
}
.psup-bar-chart-rate-66-100 {
	fill: var(--background-action-high-blue-ecume);
}

/*--------------------------------------------------------------------------------------------------------*/
/* CARTE AVEC IMAGE
/*--------------------------------------------------------------------------------------------------------*/

.psup-carte-image{
	display: flex;
	box-shadow: 0 0 0 1px var(--border-default-grey);
	margin: 0 0 1.5rem;
	padding: 1rem;
	gap: 2rem;
  	flex-wrap: wrap;
}

@media screen and (max-width: 576px) {
	g text{ /* Pour facilier la lecture en mode mobile*/
		font-size: 1.15rem;
	}
	.fr-content-media__caption{ /* Pour facilier la lecture en mode mobile*/
		font-size: 1rem;
	}
}


/*--------------------------------------------------------------------------------------------------------*/
/* Modale didacticiel RGAA
/*--------------------------------------------------------------------------------------------------------*/
#modal-didacticiel-accessibilite {
	overflow: auto;
    display: none;
    background: white;
    position: fixed;
    z-index: 999999;
    top: 18%;
    left: 35%;
    padding: 2em;
    max-width: 600px;
    max-height: 600px;
    box-shadow: rgb(0 0 0 / 12%) 0px 1px 3px, rgb(0 0 0 / 24%) 0px 1px 2px;
}


/*--------------------------------------------------------------------------------------------------------*/
/* Tooltip perso adapté au DSFR
/*--------------------------------------------------------------------------------------------------------*/
.tooltipperso{
	border: 0;
}

.tooltiptextperso{
	color : #161616!important;
	border-color : #000091!important;
	border-radius : 0!important;
	font-weight: normal;
}

.fr-badge > .fr-tooltip {
	font-weight: normal !important;
	text-transform: none !important;
}
 
/*--------------------------------------------------------------------------------------------------------*/
/* ENTETE CONNECTEE */
/*--------------------------------------------------------------------------------------------------------*/

.fr-header .fr-header__menu-links .dsfr-doc-version {
    margin-left: -.5rem;
    margin-right: -.5rem
}

.fr-header .fr-header__menu-links .dsfr-doc-version__btn {
    padding-left: .5rem;
    padding-right: .5rem
}

.dsfr-doc-version {
    --rows: 8;
    position: relative
}

.dsfr-doc-version .dsfr-doc-version__btn {
    overflow: initial;
    width: 100%;
    max-width: 100%;
    min-height: 3rem;
    max-height: none;
    padding: .5rem 1rem;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem
}

.dsfr-doc-version .dsfr-doc-version__btn::before { /* Icone user avant le texte du bouton */
    --icon-size: 1rem;
    vertical-align: calc((.75em - var(--icon-size))*.5);
    width: var(--icon-size);
    height: var(--icon-size);
    content: "";
    background-color: currentColor;
    flex: none;
    margin-left: -.125rem;
    margin-right: .5rem;
    display: inline-block;
    -webkit-mask-image: url(../js/dsfr/icons/user/account-circle-line.svg);
    mask-image: url(../js/dsfr/icons/user/account-circle-line.svg);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%
}

.dsfr-doc-version .dsfr-doc-version__btn:after { /* Icone chevron après le texte du bouton */
    vertical-align: calc((.75em - var(--icon-size))*.5);
    width: var(--icon-size);
    height: var(--icon-size);
    --icon-size: 1rem;
    content: "";
    background-color: currentColor;
    flex: none;
    margin-left: auto;
    transition: transform .3s;
    display: inline-block;
    -webkit-mask-image: url(../js/dsfr/icons/arrows/arrow-down-s-line.svg);
    mask-image: url(../js/dsfr/icons/arrows/arrow-down-s-line.svg);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%
}

.dsfr-doc-version .dsfr-doc-version__btn[aria-expanded=true]:after {
    transform: rotate(-180deg)
}

.dsfr-doc-version__version {
    white-space: nowrap
}

.dsfr-doc-version__menu {
    margin: 0
}

.dsfr-doc-version .fr-nav__item:before {
    content: none
}

.dsfr-doc-version .fr-menu__list {
    width: auto;
    padding: 0
}

.dsfr-doc-version .dsfr-doc-version__btn[aria-expanded=true] {
    color: var(--text-active-blue-france);
    background-color: var(--background-open-blue-france);
    --idle: transparent;
    --hover: var(--background-open-blue-france-hover);
    --active: var(--background-open-blue-france-active)
}

.dsfr-doc-version .dsfr-doc-version__btn[aria-expanded=true]:hover {
    background-color: var(--hover-tint)
}

.dsfr-doc-version .dsfr-doc-version__btn[aria-expanded=true]:active {
    background-color: var(--active-tint)
}

.dsfr-doc-version__menu .dsfr-doc-version__version {
    box-shadow: none
}

@media (width>=62em) {
    .dsfr-doc-version .dsfr-doc-version__btn {
        width: auto;
        min-height: auto;
        padding: .25rem .75rem;
        font-size: .875rem;
        line-height: 1.5rem
    }

    .dsfr-doc-version .dsfr-doc-version__btn:after {
        margin-left: .25rem;
        margin-right: -.25rem
    }

    .dsfr-doc-version .dsfr-doc-version__btn:before {
        --icon-size: 1rem
    }

    .dsfr-doc-version__version[aria-current]:not([aria-current=false]) {
        display: inline-flex
    }

    .dsfr-doc-version__menu {
        margin: -.25rem -1rem 0
    }

    .dsfr-doc-version .fr-menu__list {
        grid-template-rows: repeat(var(--rows),auto);
        grid-auto-flow: column;
        display: grid
    }

    .fr-btns-group .dsfr-doc-version__menu {
        margin: -1.25rem -.75rem 0
    }
}

@media (prefers-reduced-motion:reduce) {
    .dsfr-doc-version .dsfr-doc-version__btn:after,.dsfr-doc-version__menu {
        transition: none
    }
}

/*--------------------------------------------------------------------------------------------------------*/
/* ICONES */
/*--------------------------------------------------------------------------------------------------------*/

.fr-icon-psup-circle-fill::before, .fr-icon-psup-circle-fill::after {
  -webkit-mask-image: url("../img/customDSFR/icon/circle-fill.svg");
  mask-image: url("../img/customDSFR/icon/circle-fill.svg");
  
}

.fr-icon-hourglass-line::before, .fr-icon-hourglass-line::after {
  -webkit-mask-image: url("../img/customDSFR/icon/hourglass-line.svg");
  mask-image: url("../img/customDSFR/icon/hourglass-line.svg");
}

/*--------------------------------------------------------------------------------------------------------*/
/* MENU */
/*--------------------------------------------------------------------------------------------------------*/
#psup-user-menu .fr-nav__link{
	justify-content: start !important;
}

/*--------------------------------------------------------------------------------------------------------*/
/* LABEL INPUT */
/*--------------------------------------------------------------------------------------------------------*/

label.psup-label-readonly{
	color: var(--text-default-grey) !important;
}

/*--------------------------------------------------------------------------------------------------------*/
/*  */
/*--------------------------------------------------------------------------------------------------------*/
.psup-criteria-detail {
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
	font-size: 1rem;
	line-height: 1.5rem; 
	box-shadow: inset 0 0 0 1px var(--border-default-grey);
	/* CSS hack to be replaced by 'gap' property with new browsers */
	margin: -1rem;
}
@media (min-width: 48em) {
	.psup-criteria-detail {
		flex-wrap: nowrap;
	}
}	


/*--------------------------------------------------------------------------------------------------------*/
/* TUILE DE TELECHARGEMENT  */
/*--------------------------------------------------------------------------------------------------------*/

/*Amélioration du responsive car sinon pas lisible sur téléphone */
@media (max-width: 48em) {
  .div-ressources .fr-tile--download {
    text-align: center;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    margin-right: 0 !important;
  }
 .div-ressources .fr-tile--download  .fr-tile__header {
   margin-bottom: 1rem;
    margin-right: 0;
  }

  .div-ressources .fr-tile--download  .fr-tile__content {
    align-items: center;
  }
}