/* Shared usability fixes for phones, tablets and desktop. */
.weather-locations .btn,.weather-toolbar .btn {min-height:44px;display:inline-flex;align-items:center;gap:.4rem}
.weather-toolbar {display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.weather-source-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.weather-source {display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:14px;background:#edf5f8;border:1px solid #d4e5eb;font-size:.85rem}
.weather-source strong {color:#164957}
.weather-source small {color:#4c6571}
.weather-source-fresh>span {color:#166445}
.weather-source-stale>span,.weather-source-unavailable>span {color:#84520b}
.weather-forecast-grid {display:grid;grid-template-columns:repeat(5,minmax(90px,1fr));gap:8px;overflow-x:auto;padding:2px 0 12px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.weather-forecast-grid>.col {scroll-snap-align:start;min-width:0}
.weather-tide-chart {min-height:135px;overflow-x:auto;padding-bottom:4px;overscroll-behavior-x:contain}
.weather-source-links {display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.weather-source-links a {padding:8px 0}
.weather-toolbar [disabled] {cursor:wait}
.halong-living .bay-world {z-index:-3}
.halong-living .bay-school {z-index:-2}
.halong-living .ocean-foreground {z-index:-1}
.hlx-tt-the {position:relative}
.hlx-tt-the a {text-decoration:none;color:inherit}
.hlx-tt-meta {min-width:0}
.hlx-tt-nut-xoa {min-width:44px;min-height:44px}
.table-responsive:focus-visible {outline:3px solid #ec9b24;outline-offset:3px}
#main-content input,#main-content select,#main-content textarea {max-width:100%}
.footer-pro a,.footer-pro p {overflow-wrap:anywhere}
body.mobile-menu-dang-mo .bay-motion-toggle {visibility:hidden}
@media(min-width:1200px) {
 .navbar-main .navbar-brand {flex:0 1 220px;min-width:170px}
 .navbar-main .brand-text-main {font-size:1.2rem}
 .navbar-main .brand-text-sub {font-size:.55rem;max-width:210px}
 .navbar-main .nav-link {white-space:nowrap;font-size:.88rem;padding-left:.5rem;padding-right:.5rem}
 .navbar-main .navbar-collapse>.btn {max-width:190px;font-size:.85rem}
}
@media(max-width:1199px) {
 .navbar-main #navMenu {max-height:calc(100dvh - 90px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:12px}
 .navbar-main .nav-link,.navbar-main .dropdown-item {min-height:44px;display:flex;align-items:center;gap:.5rem}
 .navbar-main .dropdown-menu {max-width:100%;margin:0 0 8px;border-radius:12px;background:#eef8fb}
 .navbar-main .dropdown-item {color:#194655;white-space:normal}
 .navbar-main .navbar-collapse>.btn {margin:8px 0 0!important;min-height:44px;display:inline-flex;align-items:center;gap:6px}
}
@media(max-width:575px) {
 .weather-source-grid {grid-template-columns:1fr}
 .weather-forecast-grid {grid-template-columns:repeat(5,minmax(100px,1fr))}
 .weather-source {padding:12px;font-size:.8rem}
 .section-heading h1 {font-size:1.3rem;line-height:1.4;overflow-wrap:anywhere}
 #main-content .btn:not(.btn-yeu-thich):not(.btn-close) {white-space:normal}
 .modal-dialog {margin:10px}
 .modal-body {overflow-wrap:anywhere}
}
@media(min-width:768px) and (max-width:1199px) {
 .visitor-welcome {grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px}
 .visitor-copy h2 {font-size:2rem}
 .visitor-booking {min-width:0}
 .topbar .container {gap:12px;flex-wrap:wrap}
}