.mainrubrik-emplacements {
    pre {
        display: none;
    }
    .div {
        display: none;
    }

    .bloc.emplacement-bloc-localisation {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0 5em;

        .bloc-titre {
            flex: 0 0 100%;
        }

        >div {
            flex: 1;
        }
    }

    .emplacement-coordonnees {
        flex-direction: row;
        gap: 2em;

        >div {
            grid-template-columns: auto 1fr !important;
        }
    }

    // ADRESSE 
    [id$="-informations-adresse"] {
        .article-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
        }

        label {
            color: $brand700;
            border-bottom: $brand700 2px solid;
            font-weight: 600;
        }

        #emplacement_map {
            flex: 100%;
        }

        /* Core styles/functionality */
        input[type="checkbox"].map-dropdown {
            position: absolute;
            opacity: 0;
            z-index: -1;
        }

        iframe {
            max-height: 0;
            overflow: hidden;
            transition: all 0.35s;
        }

        input.map-dropdown:checked~iframe {
            max-height: 600px;
        }

        #encaps-map {
            height: 600px;
        }



        .display_map__label {
            border-bottom: solid 1px $gris600;
            cursor: pointer;
        }

        #emplacement-adresse .container {
            display: grid;
            grid-template-columns: 1fr auto;
            align-items: center;
        }

        #emplacement-adresse .container iframe {
            grid-column: 1/-1;
        }
    }

    // ACTE DE CONCESSION
    [id$="-informations-acte-concession"] {
        h4 {
            font-weight: 400;
        }
        .acte-concession {
            display: flex;
            margin-top: 1em;
            gap: 2em;
            h5 {
                font-size: 14px;
                border-bottom: 1px solid $gris400;
                margin-bottom: 5px;
            }
            i {
                color: $brand700;
                font-size: 1.5em;
            }
        }

        .acte-concession--infos {
            flex: 2;
        }
        .acte-concession--dates {
            flex: 3;
        }
        li {
            margin-top: 0.75em;
        }
    }

    // BÂTI
    [id$="-informations-bati"] {
        .article-titre {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            span {
                align-self: flex-start;
            }
        }
        h4 {
            font-weight: 400;
        }
        .bati {
            display: flex;
            margin-top: 1em;
            gap: 3em;
            h5 {
                font-size: 14px;
                border-bottom: 1px solid $gris400;
                margin-bottom: 5px;
            }
            i {
                color: $brand700;
                font-size: 1.5em;
            }
            ul {
                flex: 1;
            }
            li {
                margin-top: 0.75em;
            }
            p.placeholder {
                line-height: 1.5em;
            }
        }
    }

    // ABANDON
    [id$="-informations-abandon"] {
        .article-titre {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            span {
                align-self: flex-start;
            }
        }
        .reprise-timeline {
            display: flex;
            .etape {
                flex: 1;
                position: relative;
                text-align: center;
                z-index: 3;

                p {
                    font-size: 0.85em;
                    margin-top: 1.5em;
                    color: $gris600;
                    &.active {
                        font-weight: 600;
                        color: $gris900;
                    }
                }
                &:first-of-type:before,
                &:last-of-type:after {
                    content: '';
                    position: absolute;
                        top: 5px;
                        height: 50px;
                        width: 30%;
                        z-index: 0;
                        
                }
                &:first-of-type:before {
                    left: 0;
                        background: linear-gradient(90deg, $blanc 5%, transparent 95%);
                }
                &:last-of-type:after{
                    right: 0;
                        background: linear-gradient(90deg, transparent 5%, $blanc 95%);
                }

                span {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    padding: .5em;
                    margin: 0 auto;
                    width: 50px;
                    height: 50px;
                    font-size: 1.5em;
                    border-radius: 25px;
                    background: $gris300;
                    user-select: none;
                    &::before,
                    &::after {
                        content: ' ';
                        position: absolute;
                        top: 17px;
                        height: 16px;
                        width: 40%;
                        background: $gris300;
                        z-index: -1;
                    }

                    &::before {
                        left: 0;
                    }

                    &::after {
                        right: 0;
                    }
                    

                    &.done,
                    &.done::after,
                    &.done::before  {
                        background-color: $brand300;
                    }
                    
                    &.active {
                        background-color: $brand700;
                        color: $blanc;
                        font-weight: 700;
                        &::before {
                            background: $brand300;
                        }

                    }
                    
                    &.last::after,
                    &.first::before {
                        background: transparent;
                    }

                }
            }

        }
    }

    //
    // GESTION DE LA PLACE
    [id$="-informations-gestion-place"] {
        .article-titre {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            span {
                align-self: flex-start;
            }
        }
        h4 {
            font-weight: 400;
        }
        .gestion-place {
            display: flex;
            align-items: center;
            gap: 1em;
            h5 {
                font-size: 14px;
                border-bottom: 1px solid $gris400;
                margin-bottom: 5px;
            }
            i {
                color: $brand700;
                font-size: 1.5em;
            }
            p.gestion-place--occupation {
                flex: 1;
                font-size: 24px;
                span {
                    font-size: 2.5em;
                    font-weight: 800;
                }
            }
            ul {
                flex: 1;
            }
            li {
                margin-top: 0.75em;
            }
            p.placeholder {
                line-height: 1.5em;
            }
        }
    }

        // CONTRATS
        [id$="-informations-contrats"] {
            .contrat p i {
                color: $brand700;
                font-size: 1.5em;
            }
        
            h4 {
                display: flex;
                justify-content: space-between;
            }
            h5 {
                font-size: 1rem;
                margin-bottom: 10px;
            }
        }
        // TRAVAUX
        [id$="-informations-travaux"] {
            .travaux p i {
                color: $brand700;
                font-size: 1.5em;
            }
            small {
                display: block;
                font-weight: 400;
            }
            h4 {
                display: flex;
                justify-content: space-between;
            }
            h5 {
                font-size: 1rem;
                margin-bottom: 10px;
            }
            .travail-datedemande {
                margin-bottom: 1em;
            }
        }
        // OPERATIONS
        [id$="-informations-operations"] {
            .operation p i {
                color: $brand700;
                font-size: 1.5em;
            }
            .container {
                grid-template-columns: repeat(auto-fill, minmax(400px, 1fr ) );
                justify-content: flex-start;
            }
            article {
                max-width: 400px;
            }
            h4 {
                display: flex;
                justify-content: space-between;
            }
            h5 {
                font-size: 1rem;
                margin-bottom: 10px;
            }

        }
        // CONTACTS
        [id$="-informations-contacts"] {
            .contact p i {
                color: $brand700;
                font-size: 1.5em;
            }
            .container {
                grid-template-columns: repeat(3, 1fr );
                justify-content: flex-start;
                
                @media screen and (max-width: 1400px) {
                    grid-template-columns: repeat(2, 1fr );
                }                
                @media screen and (max-width: 1200px) {
                    grid-template-columns: repeat(1, 1fr );
                }
                .article-titre-bottomless {
                    margin-bottom: 1.5em;
                    gap: 1em;
                }
                span {
                   font-weight: 600; 
                   margin-top: 1em;
                }
            }
        }

}



// ACTION 1 - FORMULAIRE :

[id*=form-container] .formEntete #form-content {
    .emplacement-form {
        .bloc-titre{
            border-bottom: 1px solid $gris400;
        }
        > .bloc {
            margin-top : 1em;
            .bloc {
                align-self: flex-start;
            }
            .bloc .bloc-titre{
                font-weight: 500;
            }
        }
    }
    .emplacement-form.emplacement-consultation {
        .bloc.row-fluid {
            gap: calc($emplacement-gap/3) calc(2*$emplacement-gap);
        }
        .bloc.row-fluid.emplacement-fields-metadata {
            > .emplacement-field-emplacement, 
            > .emplacement-field-nature {
                flex-basis : 0 ;
            }
            .emplacement-field-nature .field{
                grid-template-columns: auto minmax(150px, 1fr);
            }
        }
        .bloc.row-fluid.emplacement-fields-adresse {
            gap : calc($emplacement-gap/3);
        }
        .bloc.row-fluid.emplacement-fields-plans {
            justify-content: space-between;
        }
    
        .bloc.row-fluid.emplacement-fields-acte {
            .emplacement-field-dates {
                align-self: flex-start;
                .field {
                    grid-template-columns : 1fr 1fr;
                }
            }
        }
        .bloc.row-fluid.emplacement-fields-abandon {
            .emplacement-field-dates {
                .field {
                    grid-template-columns : 1fr 1fr;
                }
            } 
        }
    }
}