.finder-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(10, 1fr);
grid-column-gap: 5px;
grid-row-gap: var(--spacing-md);
}

.finder-grid div {
	align-items: flex-start;
}

.finder-grid div a{
	text-decoration: none;
	color: var(--color-black);
	
}


.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 2 / 1 / 3 / 2; }
.div3 { grid-area: 3 / 1 / 4 / 2; }
.div4 { grid-area: 4 / 1 / 5 / 2; }
.div5 { grid-area: 1 / 2 / 5 / 3; }
.div6 { grid-area: 5 / 1 / 6 / 2; }
.div7 { grid-area: 6 / 1 / 7 / 2; }
.div8 { grid-area: 7 / 1 / 8 / 2; }
.div9 { grid-area: 5 / 2 / 8 / 3; }
.div10 { grid-area: 1 / 3 / 8 / 4; }
.div11 { grid-area: 8 / 1 / 10 / 2; }
.div12 { grid-area: 8 / 2 / 10 / 3; } 
.div14 { grid-area: 10 / 1 / 11 / 2; }
.div15 { grid-area: 10 / 2 / 11 / 3; }
.div16 { grid-area: 8 / 3 / 11 / 4; }


.finder-border-left {
	border-left: var(--border-thick); 
	padding-left:var(--spacing-md);
}


/* Style du conteneur du menu */
details {
	font-size: var(--font-size-md-phone);	
	line-height: var(--font-line-height-md-phone);
	font-family: var(--font-family-main);
    width: 100%;
    user-select: none;
}


summary {
    padding: 10px 15px;
    
	border-radius: 17px;
	height:34px;
	border: var(--border-thin);
	
    color: white;
    list-style: none; /* Cache la flèche par défaut sur certains navigateurs */
    cursor: pointer;
	color: var(--color-black);
	background: var(--color-white);	

    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Ajout d'une flèche personnalisée via un pseudo-élément */
summary::after {
    content: ""; /* On laisse le contenu vide */
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('/assets/img/lO-ico-finder.svg');
    background-size: contain;
    background-repeat: no-repeat;
}