/* GLASSFORGE coverage for the complete Twig/public page estate. */

/* Keep intentionally dark storytelling surfaces dark and readable. */
.band,
.page-hero,
.room-detail-hero,
.article-hero,
.seo-landing-hero,
.payment-hero,
.booking-confirmation-hero {
  color: #fff8df !important;
  background-color: var(--gf-dark-glass-soft) !important;
  border-color: rgba(246, 210, 104, .28) !important;
}
.band {
  background: var(--gf-dark-glass) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 20px 55px rgba(18, 12, 4, .24) !important;
  -webkit-backdrop-filter: var(--gf-glass);
  backdrop-filter: var(--gf-glass);
}
.band :where(h1, h2, h3, strong, a) { color: #fff8df !important; }
.band :where(p, span, .muted) { color: rgba(255, 248, 223, .76) !important; }
.page-hero {
  background:
    linear-gradient(135deg, rgba(18, 15, 10, .94), rgba(35, 31, 25, .78)),
    url("/assets/hlalithwa/property/photo-10.jpg") center / cover !important;
  box-shadow: inset 0 -1px 0 rgba(246, 210, 104, .26), 0 24px 60px rgba(18, 12, 4, .22) !important;
}
.page-hero :where(h1, h2, h3, p, a),
.room-detail-hero :where(h1, h2, h3, p, a) { color: inherit; }
.page-hero p, .room-detail-hero p { color: rgba(255, 248, 223, .82) !important; }
.room-detail-hero::after { background: linear-gradient(180deg, rgba(18, 15, 10, .18), rgba(18, 15, 10, .9)) !important; }

/* Full public component coverage beyond the shared React class set. */
:where(
  .room-list-item,
  .faq-list details,
  .article-body,
  .card-body,
  .search-results,
  .directory-panel,
  .directory-category,
  .directory-entry,
  .location-content,
  .location-card,
  .attraction-card,
  .international-card,
  .contact-panel,
  .contact-details,
  .quote-card,
  .payment-card,
  .payment-status-card,
  .booking-confirmation-card,
  .guest-portal-card,
  .blog-index-card,
  .blog-post-card,
  .seo-content-section,
  .seo-answer-card,
  .seo-link-card,
  .content-section,
  .content-grid > article,
  .content-grid > div,
  .prose-card,
  .legal-card
) {
  background: var(--gf-surface) !important;
  border: 1px solid var(--gf-border) !important;
  box-shadow: var(--gf-raised) !important;
  -webkit-backdrop-filter: var(--gf-glass);
  backdrop-filter: var(--gf-glass);
  transition: box-shadow .2s var(--gf-ease), transform .2s var(--gf-ease), border-color .2s var(--gf-ease) !important;
}
:where(
  .room-list-item,
  .faq-list details,
  .directory-entry,
  .location-card,
  .attraction-card,
  .international-card,
  .blog-index-card,
  .seo-link-card
):hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--gold, #d6aa3c) 46%, transparent) !important;
  box-shadow: var(--gf-hover) !important;
}

.room-list-item { overflow: hidden; }
.room-list-item > img { border-right: 1px solid var(--gf-border); }
.rate-box { background: rgba(255, 255, 255, .28) !important; border-left: 1px solid var(--gf-border) !important; box-shadow: var(--gf-inset-sm) !important; }
.room-detail-intro {
  background:
    radial-gradient(80% 120% at 0 0, rgba(214, 170, 60, .1), transparent 55%),
    linear-gradient(180deg, rgba(255, 250, 240, .84), rgba(238, 229, 211, .7)) !important;
}
.room-detail-summary { background: var(--gf-surface) !important; border-color: var(--gf-border) !important; box-shadow: var(--gf-raised) !important; -webkit-backdrop-filter: var(--gf-glass); backdrop-filter: var(--gf-glass); }
.room-photo-main, .room-photo-thumb { border-color: var(--gf-border) !important; }
.faq-list details[open] { border-color: var(--gold, #d6aa3c) !important; box-shadow: var(--gf-inset-sm) !important; }
.faq-list summary { padding-right: 28px; color: var(--ink, #211a11); }
.article-body { line-height: 1.75; }
.article-body :where(h2, h3) { font-family: "Cormorant Garamond", Georgia, serif; }

.booking-search {
  background: color-mix(in srgb, var(--gold, #d6aa3c) 78%, rgba(255, 255, 255, .22)) !important;
  border: 1px solid rgba(255, 227, 141, .5) !important;
  box-shadow: var(--gf-raised) !important;
}
.booking-search label { background: rgba(255, 255, 255, .72) !important; border: 1px solid var(--gf-border) !important; box-shadow: var(--gf-inset-sm) !important; }
.search-shell { filter: drop-shadow(0 22px 38px rgba(35, 24, 8, .16)); }
.perk { background: var(--gf-surface) !important; border: 1px solid var(--gf-border) !important; box-shadow: var(--gf-raised-sm) !important; }
.summary-card { background: rgba(255, 255, 255, .38) !important; border: 1px solid var(--gf-border) !important; box-shadow: var(--gf-inset-sm) !important; }
.booking-summary p { background: rgba(255, 255, 255, .3) !important; border-color: var(--gf-border) !important; box-shadow: var(--gf-inset-sm) !important; }

/* Directory, blog, SEO and long-form pages stay readable at article scale. */
:where(.article-body, .seo-content-section, .prose-card, .legal-card) :where(p, li) { max-width: 76ch; }
:where(.article-body, .seo-content-section, .prose-card) a:not(.button) { color: var(--bronze, #8f6518); text-decoration-thickness: 1px; text-underline-offset: 3px; }
:where(.article-body, .seo-content-section, .prose-card) a:not(.button):hover { color: var(--gold-deep, #6d4610); }

/* Consistent section rhythm without changing page structure. */
.section { position: relative; }
.section:nth-of-type(even)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(100deg, rgba(214, 170, 60, .035), transparent 45%, rgba(23, 57, 47, .035));
}
.section-head { padding-bottom: 12px; border-bottom: 1px solid color-mix(in srgb, var(--gold, #d6aa3c) 18%, transparent); }

@media (max-width: 900px) {
  .room-list-item { grid-template-columns: 220px minmax(0, 1fr); }
  .room-list-item .rate-box { grid-column: 1 / -1; border-left: 0 !important; border-top: 1px solid var(--gf-border) !important; justify-items: start; text-align: left; }
}
@media (max-width: 680px) {
  .room-list-item { grid-template-columns: 1fr; }
  .room-list-item > img { min-height: 210px; border-right: 0; border-bottom: 1px solid var(--gf-border); }
  .page-hero { padding: 50px 0 !important; }
  .booking-search { grid-template-columns: 1fr !important; padding: 8px !important; }
}
@media (prefers-color-scheme: dark) {
  .room-detail-intro { background: linear-gradient(180deg, rgba(30, 24, 16, .92), rgba(24, 19, 13, .88)) !important; }
  .booking-search label, .rate-box, .summary-card, .booking-summary p { color: #f7ecd2; background: rgba(30, 24, 16, .76) !important; }
  .faq-list summary { color: #f7ecd2; }
}
@media (prefers-reduced-motion: reduce) {
  :where(.room-list-item, .faq-list details, .directory-entry, .location-card, .attraction-card, .international-card, .blog-index-card, .seo-link-card):hover { transform: none; }
}