/*
 * Page stylesheet for Lien he
 */

/* Map section: dropdown trên, map dưới, khung bo tròn, không full-width */
.col-rt {
    width: 100%;
    max-width: 100%;
}

.ct-map {
    max-width: 1200px;
    margin: 0 auto;
    border-radius: 1.2rem;
    overflow: visible;
    background-color: transparent;
}

/* Dropdown nằm trong map, góc phải */
.ct-map .my-sl-custom {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    left: auto;
    z-index: 2;
}

.ct-map-select {
    position: relative;
}

/* Nút placeholder giữ kích thước tự nhiên, không giãn full */
.ct-map .my-sl-placeholder {
    width: auto;
    min-width: 24rem;
}

/* Dropdown panel xuất hiện dưới placeholder (không absolute so với map) */
.ct-map .my-sl-panel {
    max-height: 40rem;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* Bỏ aspect-ratio trick và absolute positioning của map block */
.ct-map-block {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 16/9;
    border-radius: 1.2rem;
    overflow: hidden;
}

.ct-map-block iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: none;
}

/* Address trong dropdown cho phép xuống dòng */
.ct-map .my-sl-panel ul li {
    white-space: normal;
}

.ct-map .my-sl-panel ul li img {
    flex-shrink: 0;
}

/* Click toàn bộ item để đổi map, riêng link "Xem chi tiết" để điều hướng */
.ct-map .my-sl-panel .item {
    cursor: pointer;
}

.ct-map .my-sl-panel .item .golink {
    cursor: default;
}

@media screen and (max-width: 768px) {
    .ct-map {
        max-width: 100%;
    }

    .ct-map-block {
        aspect-ratio: 4/3;
        border-radius: 0.8rem;
    }

    .ct-map-select {
        padding: 1rem 1rem 0;
    }
}
