/* =====================================================
 * SEO & Accessibility additions
 * Last updated: 2026-05-15
 * ===================================================== */

/* ----- Visually-hidden (cho H1 SEO ẩn) -----
 * Pattern chuẩn WCAG: ẩn khỏi màn hình nhưng vẫn cho
 * screen reader và Google crawler đọc được.
 * KHÔNG dùng display:none vì Google sẽ bỏ qua nội dung.
 */
.visually-hidden,
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ----- Skip-to-content link (a11y) -----
 * Ẩn cho người dùng chuột, hiện khi user nhấn Tab.
 */
.skip-to-content {
  position: absolute;
  top: -100px;
  left: 0;
  z-index: 10000;
  padding: 12px 20px;
  background: #0a1628;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  border-radius: 0 0 8px 0;
  transition: top 0.2s ease;
}
.skip-to-content:focus,
.skip-to-content:focus-visible {
  top: 0;
  outline: 3px solid #00d4b8;
  outline-offset: 2px;
}

/* ----- Focus visible cho keyboard navigation ----- */
:focus-visible {
  outline: 2px solid #00d4b8;
  outline-offset: 2px;
}
/* Loại trừ các elements có focus tự custom */
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid #00d4b8;
  outline-offset: 2px;
}

/* =====================================================
 * LOGO DISPLAY FIX
 * ===================================================== */

/* Header (nav) - background tối → logo SÁNG (light) */
nav .logo-light,
header .logo-light {
  display: inline-block !important;
}
nav .logo-dark,
header .logo-dark {
  display: none !important;
}

/* Footer - background tối → logo SÁNG (light) */
.foot-brand .logo-light,
footer .logo-light {
  display: inline-block !important;
}
.foot-brand .logo-dark,
footer .logo-dark {
  display: none !important;
}

/* =====================================================
 * REDUCED MOTION (a11y - respect user preference)
 * ===================================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =====================================================
 * PRINT STYLES (cho user in trang)
 * ===================================================== */
@media print {
  nav, footer, .skip-to-content,
  .hero, .cta-band, .mobile-menu,
  .booking-section, .hamburger {
    display: none !important;
  }
  body {
    color: #000;
    background: #fff;
  }
  a {
    color: #000;
    text-decoration: underline;
  }
  /* Hiện URL sau link cho dễ tra cứu */
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
  }
}