/*
|--------------------------------------------------------------------------
| Findzle Contacts - Sélecteur d'espace
|--------------------------------------------------------------------------
| Style du sélecteur Personnel / Organisation.
|--------------------------------------------------------------------------
*/

#assets-sidebar .contacts-context-selector {
    display: grid;
    gap: 8px;

    padding:
        18px
        16px
        22px;
}

#assets-sidebar .contacts-context-selector label {
    display: block;

    margin: 0 8px;

    color: #66728a;

    font-size: 12px;
    font-weight: 800;

    line-height: 1.2;

    letter-spacing: .08em;
    text-transform: uppercase;
}

#assets-sidebar .contacts-context-selector {
    position: relative;
}

#assets-sidebar .contacts-context-selector select {
    width: 100%;
    min-height: 58px;

    padding:
        0
        46px
        0
        16px;

    border:
        1px solid
        #d9e2f1;

    border-radius:
        14px;

    background-color:
        #ffffff;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2365728a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");

    background-repeat:
        no-repeat;

    background-position:
        right 16px center;

    background-size:
        14px 14px;

    color:
        #102044;

    font-family:
        inherit;

    font-size:
        15px;

    font-weight:
        700;

    line-height:
        1.2;

    cursor:
        pointer;

    appearance:
        none;

    -webkit-appearance:
        none;

    -moz-appearance:
        none;

    box-sizing:
        border-box;

    transition:
        border-color .15s ease,
        background-color .15s ease,
        box-shadow .15s ease;
}

#assets-sidebar .contacts-context-selector select:hover {
    border-color:
        #bcc9dc;

    background-color:
        #f9fbff;
}

#assets-sidebar .contacts-context-selector select:focus {
    border-color:
        #3157d5;

    outline:
        0;

    box-shadow:
        0 0 0 3px
        rgba(
            49,
            87,
            213,
            .11
        );
}

#assets-sidebar .contacts-context-selector select option {
    color:
        #102044;

    background:
        #ffffff;

    font-family:
        inherit;

    font-size:
        15px;

    font-weight:
        600;
}


/*
|--------------------------------------------------------------------------
| Sidebar réduite
|--------------------------------------------------------------------------
*/

body.fz-sidebar-collapsed
#assets-sidebar
.contacts-context-selector {
    padding:
        14px
        8px;
}

body.fz-sidebar-collapsed
#assets-sidebar
.contacts-context-selector label {
    display:
        none;
}

body.fz-sidebar-collapsed
#assets-sidebar
.contacts-context-selector select {
    min-height:
        44px;

    padding:
        0
        28px
        0
        8px;

    font-size:
        0;

    background-position:
        center;
}


/*
|--------------------------------------------------------------------------
| Mode sombre
|--------------------------------------------------------------------------
*/

html[data-theme="dark"]
#assets-sidebar
.contacts-context-selector label {
    color:
        #98a7c0;
}

html[data-theme="dark"]
#assets-sidebar
.contacts-context-selector select {
    border-color:
        rgba(
            255,
            255,
            255,
            .14
        );

    background-color:
        #182238;

    color:
        #edf2ff;
}

html[data-theme="dark"]
#assets-sidebar
.contacts-context-selector select:hover {
    background-color:
        #1c2942;
}

html[data-theme="dark"]
#assets-sidebar
.contacts-context-selector select option {
    background:
        #182238;

    color:
        #edf2ff;
}
