@import url("./popap.css");

.locatemap_circle {
    position: relative;
    z-index: 1051;
}

.locatemap_circle:before {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 60px;
    height: 60px;
    background: url('../../images/spin.svg') no-repeat center center;
    background-size: 60px auto;
    z-index: 1052;
    content: "";
    margin-top: -30px;
    margin-left: -30px;
    -webkit-animation: spin 3s linear 0s infinite;
    animation: spin 3s linear 0s infinite;
}

.locatemap_circle:after {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    opacity: 0.6;
    z-index: 1051;
    content: "";
}


.modal .locatemap_circle:before {
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    background-size: 30px auto;
}

.modal .locatemap_circle:after, .modal .locatemap_circle:before {
    position: absolute;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}


.locatemap_wrapper {
    display: flex;
    padding: 24px 24px;
    position: relative;
    font-size: 16px;
    background: white;
    min-height: 600px;
    flex-direction: column;
}

@media (min-width: 1366px) {
    .locatemap_wrapper {
        min-height: auto;
    }
}

.locatemap_desktop_bar {
    flex: 0 0 auto;
    width: 100%;
    height: 40px;
    display: flex;
    z-index: 100;
    position: relative;
    align-items: center;
    margin-bottom: 20px;
}

.locatemap_not_support_geo_api .locatemap_modal_address {
    max-width: 640px;
    min-width: 640px;
}

.locatemap_desktop_detected {
    flex: 0 0 auto;
    position: relative;
    min-width: 150px;
    background: white;
    font-weight: bold;
    border-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    cursor: pointer;
    padding-left: 30px;
    left: 3px;
    border: 1px solid rgb(255, 227, 2);
    height: 100%;
    z-index: 1;

}

.locatemap_desktop_detected:before {
    content: "";
    position: absolute;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M8.10001 6.22498C7.72917 6.22498 7.36666 6.33494 7.05831 6.54097C6.74997 6.747 6.50965 7.03983 6.36773 7.38244C6.22582 7.72506 6.18869 8.10206 6.26103 8.46577C6.33338 8.82948 6.51196 9.16358 6.77418 9.4258C7.03641 9.68802 7.3705 9.8666 7.73421 9.93895C8.09793 10.0113 8.47493 9.97416 8.81754 9.83225C9.16015 9.69033 9.45298 9.45001 9.65901 9.14167C9.86504 8.83333 9.97501 8.47082 9.97501 8.09998C9.97436 7.60289 9.77661 7.12636 9.42512 6.77487C9.07363 6.42338 8.59709 6.22562 8.10001 6.22498Z' fill='black'/%3E %3Cpath d='M14.6625 7.16248H13.6303C13.435 6.01541 12.8882 4.95734 12.0654 4.13457C11.2426 3.3118 10.1846 2.76498 9.03751 2.56973V1.53748C9.03751 1.28884 8.93873 1.05038 8.76292 0.874563C8.5871 0.698748 8.34865 0.599976 8.10001 0.599976C7.85137 0.599976 7.61291 0.698748 7.43709 0.874563C7.26128 1.05038 7.16251 1.28884 7.16251 1.53748V2.56973C6.01544 2.76498 4.95737 3.3118 4.1346 4.13457C3.31183 4.95734 2.76501 6.01541 2.56976 7.16248H1.53751C1.28887 7.16248 1.05041 7.26125 0.874593 7.43706C0.698778 7.61288 0.600006 7.85134 0.600006 8.09998C0.600006 8.34862 0.698778 8.58707 0.874593 8.76289C1.05041 8.9387 1.28887 9.03748 1.53751 9.03748H2.56976C2.76501 10.1845 3.31183 11.2426 4.1346 12.0654C4.95737 12.8881 6.01544 13.435 7.16251 13.6302V14.6625C7.16251 14.9111 7.26128 15.1496 7.43709 15.3254C7.61291 15.5012 7.85137 15.6 8.10001 15.6C8.34865 15.6 8.5871 15.5012 8.76292 15.3254C8.93873 15.1496 9.03751 14.9111 9.03751 14.6625V13.6302C10.1846 13.435 11.2426 12.8881 12.0654 12.0654C12.8882 11.2426 13.435 10.1845 13.6303 9.03748H14.6625C14.9111 9.03748 15.1496 8.9387 15.3254 8.76289C15.5012 8.58707 15.6 8.34862 15.6 8.09998C15.6 7.85134 15.5012 7.61288 15.3254 7.43706C15.1496 7.26125 14.9111 7.16248 14.6625 7.16248ZM8.10001 11.85C7.35833 11.85 6.6333 11.63 6.01662 11.218C5.39993 10.8059 4.91929 10.2203 4.63546 9.53504C4.35163 8.84982 4.27737 8.09582 4.42206 7.36839C4.56676 6.64096 4.92391 5.97277 5.44836 5.44833C5.9728 4.92388 6.64099 4.56673 7.36842 4.42203C8.09585 4.27734 8.84985 4.3516 9.53507 4.63543C10.2203 4.91926 10.806 5.3999 11.218 6.01659C11.6301 6.63327 11.85 7.3583 11.85 8.09998C11.849 9.09424 11.4536 10.0475 10.7506 10.7505C10.0475 11.4536 9.09427 11.849 8.10001 11.85Z' fill='black'/%3E %3C/svg%3E ");
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    left: 10px;
    top: 10px;

}

.locatemap_modal_address {
    flex: 1 1 auto;
    height: inherit;
    margin-right: 10px;
}

.locatemap_ok_cls {
    flex: 0 0 auto;
    border: 1px solid rgb(255, 227, 2);
    height: 100%;
    min-width: 100px;
    background: rgb(255, 227, 2);
    font-weight: bold;
    border-radius: 4px;
    cursor: pointer;
}

.locatemap_ok_cls:disabled {
    color: #ccb04c;
    cursor: default;
}

.locatemap_map {
    flex: 1 0 auto;
    width: 100%;
    height: 400px;
    position: relative;
}


.locatemap_box_content {
    height: inherit;
    display: flex;
    font-size: 19px;
    background: rgb(255, 227, 2);
    align-items: center;
    font-weight: bold;
    border-radius: 4px;
}

.locatemap_address_text {
    flex: 1 1 auto;
    padding-left: 30px;
}

.locatemap_remove {
    flex: 0 0 auto;
    cursor: pointer;
    padding: 10px;
}

.locatemap_remove span {
    background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M0.146283 0.152529C0.239976 0.0588642 0.367034 0.00624616 0.499516 0.00624616C0.631998 0.00624616 0.759057 0.0588642 0.85275 0.152529L3.99688 3.29666L7.141 0.152529C7.18709 0.10481 7.24222 0.0667475 7.30318 0.0405628C7.36414 0.0143781 7.4297 0.000595337 7.49604 1.88641e-05C7.56238 -0.000557609 7.62817 0.0120837 7.68957 0.0372052C7.75097 0.0623267 7.80675 0.0994252 7.85366 0.146336C7.90057 0.193247 7.93767 0.249031 7.96279 0.310433C7.98792 0.371835 8.00056 0.437625 7.99998 0.503964C7.9994 0.570304 7.98562 0.635864 7.95944 0.69682C7.93325 0.757776 7.89519 0.812907 7.84747 0.858996L4.70334 4.00312L7.84747 7.14725C7.93848 7.24148 7.98884 7.36769 7.9877 7.49869C7.98656 7.62969 7.93402 7.755 7.84138 7.84763C7.74875 7.94027 7.62344 7.99281 7.49244 7.99395C7.36144 7.99509 7.23523 7.94473 7.141 7.85372L3.99688 4.70959L0.85275 7.85372C0.75852 7.94473 0.632314 7.99509 0.501314 7.99395C0.370315 7.99281 0.245003 7.94027 0.152369 7.84763C0.0597348 7.755 0.00718999 7.62969 0.00605164 7.49869C0.00491329 7.36769 0.0552725 7.24148 0.146283 7.14725L3.29041 4.00312L0.146283 0.858996C0.052618 0.765303 0 0.638245 0 0.505762C0 0.37328 0.052618 0.246222 0.146283 0.152529V0.152529Z' fill='black'/%3E %3C/svg%3E ");
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    margin-top: 8px;
    opacity: 1;
}

.locatemap_box_query {
    height: 100%;
    display: block;
    position: sticky;
    opacity: 1;
    transform: scale(1) translateY(0);
}

.locatemap_content {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    border: 1px dashed #ccc;
}

.locatemap_content::after {
    content: "Загрузка карты";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    bottom: 50%;
    text-align: center;
    font-size: 16px;
    color: #ccc;
}

.locatemap_content.locatemap_content_init:after {
    display: none;
}


.locatemap__container {
    height: 100%;
}

.locatemap_input_csl {
    width: 100%;
    padding: 1px 2px;
    text-overflow: ellipsis;
    line-height: 18px;
    -webkit-appearance: none;
    border: 1px solid #cccccc;
    font-size: 15px;
    box-shadow: inset 0 1px 3px 0 rgb(0 0 0 / 21%);
    border-radius: 5px;
    padding-right: 25px;
    padding-left: 15px;
    height: inherit;
}

.locatemap_input:focus {
    outline: none;
}


.locatemap_header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
    border-bottom: 1px solid #dee2e6;
}

.in.locatemap_header .close {
    margin-top: -2px;
}

.locatemap_header_title {
    margin-bottom: 0;
    line-height: 1.5;
}

.locatemap_header_closed {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    text-transform: none;
    -webkit-appearance: button;
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    color: #000;
    background: transparent url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M0.293 0.29302C0.480528 0.105549 0.734836 0.000233689 1 0.000233689C1.26516 0.000233689 1.51947 0.105549 1.707 0.29302L8 6.58602L14.293 0.29302C14.3852 0.19751 14.4956 0.121328 14.6176 0.0689187C14.7396 0.0165097 14.8708 -0.0110765 15.0036 -0.0122303C15.1364 -0.0133841 15.2681 0.0119176 15.391 0.0621985C15.5139 0.112479 15.6255 0.186732 15.7194 0.280625C15.8133 0.374518 15.8875 0.48617 15.9378 0.609066C15.9881 0.731962 16.0134 0.863642 16.0123 0.996421C16.0111 1.1292 15.9835 1.26042 15.9311 1.38242C15.8787 1.50443 15.8025 1.61477 15.707 1.70702L9.414 8.00002L15.707 14.293C15.8892 14.4816 15.99 14.7342 15.9877 14.9964C15.9854 15.2586 15.8802 15.5094 15.6948 15.6948C15.5094 15.8802 15.2586 15.9854 14.9964 15.9877C14.7342 15.99 14.4816 15.8892 14.293 15.707L8 9.41402L1.707 15.707C1.5184 15.8892 1.2658 15.99 1.0036 15.9877C0.741402 15.9854 0.49059 15.8802 0.305182 15.6948C0.119773 15.5094 0.0146045 15.2586 0.012326 14.9964C0.0100476 14.7342 0.110842 14.4816 0.293 14.293L6.586 8.00002L0.293 1.70702C0.105529 1.51949 0.000213623 1.26518 0.000213623 1.00002C0.000213623 0.734856 0.105529 0.480548 0.293 0.29302V0.29302Z' fill='black'/%3E %3C/svg%3E ") center/1em auto no-repeat;
    border: 0;
    border-radius: 0.25rem;
    opacity: .5;
    padding: 0.5rem 0.5rem;
    margin: -0.5rem -0.5rem -0.5rem auto;
}

.locatemap_header_closed:hover {
    opacity: .9;
}

.locatemap_my_address {
    max-width: 300px;
    overflow: hidden;
    white-space: nowrap;
    text-align: left;
    text-overflow: ellipsis;
}


.locatemap-message-success {
    background-color: green !important;
}

.locatemap-message-error {
    background-color: brown !important;
}

.locatemap-message-info {
    background-color: black !important;
}

