.approfondimenti-section {
  padding-bottom:10px;
   
}

.library-section {

    padding: 0;
	background: linear-gradient(
        to bottom,
        #FFFFFF 0px,
        #FFFFFF 100px,
		#EEF3F4  380px
        /* #F4F7F8 250px */
    );

}
.approfondimenti-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
	
}
.approfondimenti-subtitle {
    text-align:center;
	
}
.approfondimenti-icon {
    width: 52px;
    height: 52px;
    object-fit: contain;
}

.article-of-day {
    position: relative;
	padding-top:35px;
}

.article-of-day::before {
    content: "Articolo del giorno";

    position: absolute;
    top: -4px;
    left: 50%;
    transform: translateX(-50%);

    padding: 4px 18px;

    background: #f1f8f7;
    color: var(--primary-dark);

    border: 1px solid var(--primary-color-light);
    border-radius: 8px;

    white-space: nowrap;
}



#library-filter-button {
    position: absolute;
    top: 20px;
    right: -40px;

    width: 48px;
    height: 48px;

    border: none;
    border-radius: 50%;

    background: rgba(var(--primary-color-extralight-rgb), .35);
    backdrop-filter: blur(4px);
    box-shadow: 0 4px 14px rgba(0,0,0,.15);

    cursor: pointer;
    z-index: 150;
}




#library-filter-button:hover {
background:rgba(var(--primary-color-light-rgb),.65);
}




#library-filter-status {
    position: absolute;
    top: 20px;
    right: 16px;

    width: 22px;
    height: 22px;

    z-index: 160;
    display: none;
	
}

#library-filter-status img {
    width: 100%;
    height: 100%;
    object-fit: contain;
	cursor:pointer;
	filter: drop-shadow(2px 3px 5px rgba(0, 0, 0, 0.15));
}


#library-filter-close {
	margin:0;
	padding:0;
    position: absolute;
    top: 0px;
    right: 48px;
    

    z-index: 160;
	display:none;
	
	font-size:30px;
	color: var(--primary-title);
	
	cursor:pointer;
}

.library-filters {
    position: absolute;
    top: 20px;
    right: 70px;

    display: none;
    align-items: center;
    gap: 12px;

    z-index: 20;

    padding: 6px 10px;
	background:rgba(255,255,255,1);
	border-radius:10px;
	border: 2px solid var(--primary-color-light);
	
}

.library-filters label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    white-space: nowrap;
}

.library-filters label input {
    margin: 0;
}

.library-filters select {
    width: auto;
    min-width: 180px;
    padding: 7px 10px;
}
@media (max-width:1000px){

	#library-filter-button {
        right:  0px;
    }
	
	#library-filter-status {
        right: 48px;
    }
	
	#library-filter-close {
        right:  80px;
    }
	.library-filters {

        right:   100px;

    }
}
@media (max-width:780px){
	


    .library-filters {
		 flex-direction: column;
        align-items: stretch;
        
        width: 70%;
        box-sizing: border-box;
        gap: 8px;
    }

    .library-filters select {
        min-width: 0;
        flex: 1;
    }
	
	.library-filters label {
		align-self: flex-start;
		width: auto;
	}
}

#library-filter-button span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 17px;
    height: 17px;
    border: 2px solid var(--primary-text);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

#library-filter-button span::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 2px;
    background: var(--primary-text);
    right: -6px;
    bottom: -3px;
    transform: rotate(45deg);
}