/***********************************************************
 * Copyright (c) Microsoft Corporation. All rights reserved.
 * Licensed under the MIT License
 **********************************************************/
 @import '../../css/themes';

.location-list {
    margin: 0 40px 0 20px;
    max-width: 650px;
    .item {
        display: grid;
        grid-template-columns: 40px 1fr;
        grid-template-areas: "numbering item";
        .numbering {
            @include themify($themes) {
                color: themed('numbering') !important;
            }
            font-size: 32px;
            line-height: 37px;
            margin-top: 10px;
            margin-right: 33px;
            grid-area: numbering;
        }

        .location-item {
            @include themify($themes) {
                border: {
                    width: 1px;
                    style: solid;
                    color: themed('navBarBorderColor');
                }
                box-shadow: themed('shadow');
            }
            grid-area: item;
            position: relative;
            list-style: none;
            margin-bottom: 8px;
            margin-top: 8px;
            border-radius: 2px;

            .labelSection {
                .label{
                    text-overflow: ellipsis;
                    font-weight: 700;
                }
                .description {
                    font-style: italic;
                    font-size: smaller;
                }
                padding-bottom: 10px;
            }
            padding: {
                bottom: 14px;
                left: 22px;
                top: 14px;
                right: 12px;
            }
            .remove-button {
                height: 16px;
                width: 16px;
                position: absolute;
                right: 12px;
                top: 15px;
            }
        }
    }
}