@import 'base.css';
#topBarInfos{
    color: white !important;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Carroussel vitrine */
.carrousselVitrine {
    
}

.carrousselVitrine .item {
    width: 100%;
    height: 536px;
    margin-right: 10px;
    background: var(--mainColor);
    counter-increment: item;
}

.item:before {
    display: block;
    text-align: center;
    content: counter(item);
    line-height: 536px;
    font-size: 80px;
    color: white;
}

@media (min-width: 576px) {
    .carrousselVitrine .item {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .carrousselVitrine .item {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .carrousselVitrine .item {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .carrousselVitrine .item {
        max-width: 1140px;
    }
}

/* newsletter */
.newsletter{
    background-color: var(--lightMainColor);
    background-image: url("/data/images/illustration-fruits.png");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: cover;
    background-attachment: scroll;
}

/* Blocs de construction du site */
.block-titres{
    border-bottom: 3px solid var(--color-border-grey);
    padding: 15px 0;
    padding-top: 0;
}
.block-titres.orange{
    border-bottom: 3px solid var(--mainColor);
}

/* Cartes des recettes */
.carte-recette{
    display: flex;
    margin-top: 3rem;
}
.carte-recette-img{
    width: 160px;
    height: 100%;
    border-radius: 5px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.carte-recette-infos{
    padding-left: 1rem;
    overflow-wrap: anywhere;
}

/*footer*/
footer{
    position: relative;
    bottom: 0;
    background-color: var(--lightMainColor);
    padding: 3rem 0;
}
footer a{
    color: var(--mainColor)!important;
}

/* Barre de navigation utilisateur connecté */
.memberNavbar{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1px 15px;
    background-color: var(--mainColor);
    color:white!important;
}
.memberNavbar .userProfilPic{
    width: 32px;
    height: 32px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* Editeur de recette */
.col-editor-content {
	flex: 0 0 calc(100% - 280px);
    max-width: calc(100% - 280px);
}
.col-editor-sidebar {
    flex: 0 0 280px;
    max-width: 280px;
}

.vbcard .card-header, .vbcard .card-body{
	padding: .75rem !important;
}
.vbcard .editor-headerPic{
	width: 100%;
	height: 126px;
	background-color: var(--lightMainColor);
	background-size: cover!important;
    background-repeat: no-repeat!important;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.vbcard .editor-headerPic i{
	font-size: 2.5em;
}
.rowSubText{
	font-size: 0.8em;
}

/* étoiles */
.rating {
    --dir: right;
    --fill: var(--mainColor);
    --fillbg: rgba(100, 100, 100, 0.15);
    --heart: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 21.328l-1.453-1.313q-2.484-2.25-3.609-3.328t-2.508-2.672-1.898-2.883-0.516-2.648q0-2.297 1.57-3.891t3.914-1.594q2.719 0 4.5 2.109 1.781-2.109 4.5-2.109 2.344 0 3.914 1.594t1.57 3.891q0 1.828-1.219 3.797t-2.648 3.422-4.664 4.359z"/></svg>');
    --star: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.25l-6.188 3.75 1.641-7.031-5.438-4.734 7.172-0.609 2.813-6.609 2.813 6.609 7.172 0.609-5.438 4.734 1.641 7.031z"/></svg>');
    --stars: 5;
    --starsize: 1.5rem;
    --symbol: var(--star);
    --value: 1;
    --w: calc(var(--stars) * var(--starsize));
    --x: calc(100% * (var(--value) / var(--stars)));
    block-size: var(--starsize);
    inline-size: var(--w);
    position: relative;
    touch-action: manipulation;
    -webkit-appearance: none;
}
[dir="rtl"] .rating {
--dir: left;
}
.rating::-moz-range-track {
    background: linear-gradient(to var(--dir), var(--fill) 0 var(--x), var(--fillbg) 0 var(--x));
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--symbol);
}
.rating::-webkit-slider-runnable-track {
    background: linear-gradient(to var(--dir), var(--fill) 0 var(--x), var(--fillbg) 0 var(--x));
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--symbol);
    -webkit-mask: repeat left center/var(--starsize) var(--symbol);
}
.rating::-moz-range-thumb {
    height: var(--starsize);
    opacity: 0;
    width: var(--starsize);
}
.rating::-webkit-slider-thumb {
    height: var(--starsize);
    opacity: 0;
    width: var(--starsize);
    -webkit-appearance: none;
}

/* NO JS */
.rating--nojs::-moz-range-track {
    background: var(--fillbg);
}
.rating--nojs::-moz-range-progress {
    background: var(--fill);
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--star);
}
.rating--nojs::-webkit-slider-runnable-track {
    background: var(--fillbg);
}
.rating--nojs::-webkit-slider-thumb {
    background-color: var(--fill);
    box-shadow: calc(0rem - var(--w)) 0 0 var(--w) var(--fill);
    opacity: 1;
    width: 1px;
}

/* contenu recette */
.recetteHeaderPic{
    width: 100%;
    height: 300px;
    background-position: center!important;
    background-size: cover!important;
    background-repeat: no-repeat!important;
    border-radius: 5px;
}
.receipe-content-area{
    margin-top: 3rem;
}

/* filtre recette */
.filtreRecettes{
    border-radius: 5px;
    
}