//
// modele bouton
//
.btn {
	@include bouton();
	&.right {
		float:right;
		margin-left:$spacer;
	}
	&.left {
		float:left;
		margin-right:$spacer;
	}
}
// pour usage du btn, mais utile ailleurs eventuellement
.taille70 {
	font-size:70%;
}
.taille80 {
	font-size:80%;
}
.taille90 {
	font-size:90%;
}
.taille110 {
	font-size:110%;
}
.taille120 {
	font-size:120%;
}
.taille130 {
	font-size:130%;
}


.formulaire_spip.formulaire_recherche {
	margin:2rem 0;
    form {
        position:      relative;
        border:        1px solid #B3B3B3;
        border-radius: $spacer/2;
        padding:       0.5rem 1.5em 0.5rem 2.5em;
        width:         100%;
		max-width:500px;
        display:       flex;
        align-items:   center;
        background:    white;
		
		&:before {
			@extend .fa-search;
			@extend .fas;
			color: #AACBCF;
			display: block;
			position: absolute;
			top: 50%;
			left: 1rem;
			margin-top:-0.5rem;
			width: 1.5rem;
			height: 1.5rem;
			background: none;
		}
    }
    button, label {
        @include visuallyhidden;
    }
    input[type=search],
    input[type=text] {
        width:       100%;
        padding:     0;
        border:      none;
        min-height:  2.5em;
        line-height: 2.5em;
        background:  white;
    }
}

a.back-to-top {
    display: none;
    @include media($bp-large-up) {
        position:    fixed;
        width:       52px;
        height:      66px;
        right:       20px;
        bottom:      20px;
        z-index:     999;
        text-indent: -9999px;
        background:  url("../images/back-top.png") no-repeat center;
        outline:     none;
    }
    &:focus {
        background: none !important;
    }
}


// ------------------------------------------------
// Affichage de valeurs de formulaires
// ------------------------------------------------

.champ.afficher {
    display: flex;
    margin-bottom: 0.5em;
    .label {
        margin-right: 1em;
        width: 25%;
    }
    &.saisie_fieldset {
        display: block;
        margin: 1em 0;
        & > .champ {
            margin-left: 1.5em;
        }
    }
}


// tri par periode : blog ou inclure/listetranscriptions_selectionperiode
//
.periode { 
	width:100%;
	margin-bottom:1em;
	a, span { display: inline-block; margin-right:0.25em;
		&.annees { font-size:0.8em; line-height:1.8; font-style:italic; color:$grayLight; clear:left;
			&:after {  font-size:0.85em; font-style:normal; }
		}
		&.archive { cursor:pointer; color:$grayLight; }
		&.mois_archive { width:0; overflow:hidden; margin:0; height:0;
			&.ouvert { width:auto; height:auto; overflow:visible; display:inline; }
		}
		&.annees.archive.ouvert { color:$gray; }
	}
	span { 
		&:hover { color:$gray; }
	}
	a { padding:0 0.3em; font-weight:700;
		&.on { text-decoration:underline; }
	}
}


// page sommaire
.page_sommaire {
	.page_content {
		margin-right:0;
	}
}
.texte_accueil {
	margin-bottom:$spacer;
}