/*
 * IslandTravelAtlas sitewide visual-quality foundation v1
 *
 * Shared corrections for contrast, empty modules, images,
 * notices, destination tools, focus states, and responsive layout.
 */

/* ---------- Basic rendering stability ---------- */

html {
  overflow-x: hidden;
}

body {
  overflow-wrap: break-word;
}

img {
  max-width: 100%;
}

img.pm-real-image,
img.ita-real-photo {
  display: block;
  background:
    linear-gradient(
      135deg,
      #dcebea,
      #edf5f4
    );
}

figure img.pm-real-image,
figure img.ita-real-photo {
  width: 100%;
  object-fit: cover;
}

/*
 * The installation script adds real intrinsic width/height
 * attributes. This lets browsers reserve image space before load.
 */
img[width][height] {
  height: auto;
}

/* ---------- Empty-module repair ---------- */

[data-affiliate-module]:empty,
[id*="flight-widget"]:empty,
[data-affiliate-module="sidebar"]:empty {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Avoid empty grid columns after an unused sidebar is removed. */
main:has(> [data-affiliate-module="sidebar"]:empty),
article:has(> [data-affiliate-module="sidebar"]:empty),
.r-layout:has(
  > [data-affiliate-module="sidebar"]:empty
) {
  grid-template-columns: minmax(0, 1fr) !important;
}

/* ---------- High-priority image correction ---------- */

img[fetchpriority="high"] {
  content-visibility: visible;
}

/* ---------- Shared dark-surface contrast ---------- */

.ita-dark-surface {
  color: #eef8f9;
}

.ita-dark-surface
:where(h1, h2, h3, h4) {
  color: #ffffff;
}

.ita-dark-surface
:where(p, li, dd, dt, small) {
  color: #d9eaec;
}

.ita-dark-surface
:where(.eyebrow, .kicker, [class*="kicker"]) {
  color: #f1c36d;
}

.ita-dark-surface
.breadcrumbs,
.ita-dark-surface
.breadcrumbs a {
  color: #ffffff;
}

.ita-dark-surface
.breadcrumbs span {
  color: #d6e7e9;
}

/* Restore normal dark text inside nested light cards. */
.ita-dark-surface
.ita-light-surface {
  color: #294f57;
}

.ita-dark-surface
.ita-light-surface
:where(h1, h2, h3, h4) {
  color: #17313a;
}

.ita-dark-surface
.ita-light-surface
:where(p, li, dd, dt, small, span) {
  color: #40584d;
}

/*
 * Do not override deliberately dark text used on gold or
 * pale call-to-action buttons.
 */
.ita-dark-surface
:is(
  .button,
  [class*="primary"],
  [class*="hub"]
) {
  color: #173840;
}

.ita-dark-surface
:is(
  .button,
  [class*="primary"],
  [class*="hub"]
)
span {
  color: inherit;
}

/* ---------- Confirmed Guides-directory contrast ---------- */

.rf-destination-card.ita-dark-surface {
  color: #ffffff !important;
}

.rf-destination-card.ita-dark-surface
:where(span, strong, h2, h3) {
  color: #ffffff !important;
}

.rf-destination-card.ita-dark-surface p {
  color: #e0eef0 !important;
}

.rf-destination-card.ita-dark-surface em {
  color: #f1c36d !important;
}

/* ---------- Confirmed Bali-hub contrast ---------- */

.bali-card-action.ita-dark-surface {
  color: #eaf7f8 !important;
}

.bali-card-action.ita-dark-surface:hover,
.bali-card-action.ita-dark-surface:focus-visible {
  color: #ffffff !important;
}

/* ---------- Shared highlighted planning notices ---------- */

.compliance-section:not(.caribbean-compliance-v3) {
  position: relative;
  padding: clamp(3rem, 6vw, 5rem) 1rem;
  background:
    radial-gradient(
      circle at 95% 0,
      rgba(211, 168, 76, 0.2),
      transparent 32%
    ),
    linear-gradient(
      135deg,
      #fff8e9,
      #f6efe2
    );
  border-top: 1px solid rgba(122, 74, 0, 0.15);
  border-bottom: 1px solid rgba(122, 74, 0, 0.15);
}

.compliance-section:not(.caribbean-compliance-v3)
.compliance-card {
  width: min(1080px, 100%);
  margin: 0 auto;
  padding: clamp(1.5rem, 4vw, 2.6rem);
  border: 1px solid rgba(122, 74, 0, 0.2);
  border-left: 6px solid #9a6516;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 18px 40px rgba(86, 58, 11, 0.08);
}

.compliance-section:not(.caribbean-compliance-v3)
.compliance-card h2 {
  color: #17313a !important;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1.12;
}

.compliance-section:not(.caribbean-compliance-v3)
.compliance-card p {
  color: #294f57 !important;
  line-height: 1.7;
}

.compliance-section:not(.caribbean-compliance-v3)
.compliance-card a {
  color: #066d70 !important;
  font-weight: 750;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* ---------- Shared bottom destination tools ---------- */

.pm-destination-tools {
  color: #eef8f9;
}

.pm-destination-tools h2 {
  color: #ffffff !important;
}

.pm-destination-tools
.pm-kicker {
  color: #f1c36d !important;
}

.pm-destination-tools
.pm-destination-tools-grid > div > p {
  color: #d5e7e9 !important;
}

.pm-destination-tools
.pm-destination-tool-links {
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
  margin-top: 1.5rem;
}

.pm-destination-tools
.pm-destination-tool-links > a {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 13px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.1),
      rgba(255, 255, 255, 0.05)
    );
  color: #ffffff !important;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background-color 160ms ease;
}

.pm-destination-tools
.pm-destination-tool-links > a:hover,
.pm-destination-tools
.pm-destination-tool-links > a:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(241, 195, 109, 0.72);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.16),
      rgba(255, 255, 255, 0.08)
    );
}

/* ---------- Shared related/continue-planning emphasis ---------- */

.r-section-related,
[class*="related-guides"] {
  border-radius: 20px;
}

.r-section-related h2,
[class*="related-guides"] h2 {
  color: #17313a;
}

.r-section-related a,
[class*="related-guides"] a {
  text-underline-offset: 3px;
}

/* ---------- Footer contrast ---------- */

.pm-footer,
.pm-footer.ita-dark-surface {
  color: #e9eef7;
}

.pm-footer
.pm-footer-brand p,
.pm-footer
.pm-footer-bottom p {
  color: #cbdde0 !important;
}

.pm-footer
.pm-footer-heading {
  color: #ffffff !important;
}

.pm-footer a,
.pm-footer button {
  color: #e6f2f3 !important;
}

.pm-footer a:hover,
.pm-footer a:focus-visible,
.pm-footer button:hover,
.pm-footer button:focus-visible {
  color: #ffffff !important;
}

/* ---------- Accessible focus ---------- */

main a:focus-visible,
footer a:focus-visible,
button:focus-visible {
  outline: 3px solid #d3a84c;
  outline-offset: 4px;
}

/* ---------- Responsive safeguards ---------- */

.table-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 700px) {
  .pm-destination-tools
  .pm-destination-tool-links {
    grid-template-columns: 1fr;
  }

  .compliance-section:not(.caribbean-compliance-v3) {
    padding-right: 0.85rem;
    padding-left: 0.85rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}