/* Homepage font pair, one content edge and a shared spacing scale.
 * Public sections retain their full-width backgrounds. Manage retains its
 * compact working scale and independently scrollable tables/calendars. */
body.ppr-unified-design {
  --pr-body-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pr-heading-font: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ppr-content-width: 1180px;
  --ppr-gutter: 24px;
  --ppr-gap: 24px;
  --ppr-manage-gutter: 32px;
  font-family: var(--pr-body-font) !important;
  font-optical-sizing: auto;
}
body.ppr-unified-design :is(main, header, footer, aside, dialog, .ppr-luxe-header, .top, .foot) :is(p, a, li, dt, dd, label, legend, input, select, textarea, button, summary, small, strong, em, th, td, caption, figcaption, blockquote) {
  font-family: var(--pr-body-font) !important;
}
/* Explicit display text rules also cover page-specific font shorthands. */
body.ppr-unified-design :is(main, header, footer, aside, dialog) :is(h1, h2, h3, h4, h5, h6),
body.ppr-unified-design :is(main, header, footer, aside, dialog) :is(h1, h2, h3, h4, h5, h6) :is(a, span, strong, em) {
  font-family: var(--pr-heading-font) !important;
  font-weight: 600 !important;
}
body.ppr-unified-design :is(pre, code, kbd, samp) {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
}

/* Align header, main sections, supporting copy and footer to the same rail. */
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(.site-shell, .w, .ppr-luxe-inner) {
  box-sizing: border-box;
  width: min(calc(100% - var(--ppr-gutter) * 2), var(--ppr-content-width)) !important;
  max-width: var(--ppr-content-width) !important;
  margin-inline: auto !important;
  min-width: 0;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) .ppr-luxe-inner {
  padding-inline: 0 !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(.pr-seo-section, .pr-i18n-location, .pr-i18n-support, .pr-location-faq) {
  box-sizing: border-box;
  width: min(calc(100% - var(--ppr-gutter) * 2), var(--ppr-content-width)) !important;
  max-width: var(--ppr-content-width) !important;
  padding-inline: 0 !important;
  margin-inline: auto !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) .site-shell .site-shell {
  width: 100% !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(.story-grid, .feature-grid, .planning-grid, .planning-split, .island-guide-grid, .beach-grid, .gallery-grid, .review-grid, .villa-showcase-grid, .location-map-grid, .contact-layout, .contact-fields, .fd-restaurant-grid, .fd-drink-grid, .act-choice-grid, .act-planning-grid, .footer-grid) {
  column-gap: var(--ppr-gap) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(.site-shell, .w) > * {
  min-width: 0;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) main :is(input, select, textarea) {
  max-width: 100%;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(.button-row, .fd-buttons, .fd-app-links) {
  gap: 12px;
  flex-wrap: wrap;
}

/* Match the homepage's vertical rhythm across every public content template.
 * Scope to content sections and card grids, keeping heroes and form controls
 * at their existing dimensions. Adjacent sections have 64px total breathing room. */
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) {
  --ppr-section-space: 32px;
  --ppr-intro-space: 24px;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) :is(.section:not(.booking-section), .fd-section) {
  padding-block: var(--ppr-section-space) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) .booking-section {
  padding-bottom: var(--ppr-section-space) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) :is(.section-intro, .fd-section-heading) {
  row-gap: 16px !important;
  column-gap: var(--ppr-gap) !important;
  margin-bottom: var(--ppr-intro-space) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) :is(.story-grid, .feature-grid:not(.amenities-feature-grid), .planning-grid, .planning-split, .island-guide-grid, .beach-grid, .gallery-grid, .review-grid, .villa-showcase-grid, .location-map-grid, .contact-layout, .contact-hero-grid, .contact-bottom-grid, .fd-hero-grid, .fd-intro, .fd-order-grid, .fd-faq-layout, .fd-restaurant-grid, .fd-drink-grid) {
  row-gap: var(--ppr-gap) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) :is(.pr-seo-section, .pr-i18n-location, .pr-i18n-support, .pr-location-faq) {
  margin-block: var(--ppr-section-space) !important;
}
body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) :is(#main-content, main) .cta-panel {
  padding-block: var(--ppr-section-space) !important;
}
body.ppr-unified-design.pr-public-site :is(#main-content, main) .contact-hero {
  padding-block: var(--ppr-section-space) !important;
}
body.ppr-unified-design.pr-public-site :is(#main-content, main) .contact-section {
  padding-bottom: var(--ppr-section-space) !important;
}
body.ppr-unified-design.pr-public-site :is(#main-content, main) .fd-drink-grid {
  margin-top: var(--ppr-intro-space) !important;
}
body.ppr-unified-design.pr-activities-page main > .w > .grid {
  padding-bottom: var(--ppr-section-space) !important;
}
body.ppr-unified-design.pr-activities-page main > .act-planning {
  margin-bottom: var(--ppr-section-space) !important;
}
body.ppr-unified-design.pr-activities-page main > .seo {
  padding-block: var(--ppr-section-space) !important;
}

/* The same typefaces, with sizes suitable for a working dashboard. */
body.management.ppr-unified-design:not(.auth) .workspace > :is(main, header) {
  box-sizing: border-box;
  padding-inline: var(--ppr-manage-gutter) !important;
  min-width: 0;
}
body.management.ppr-unified-design:not(.auth) .workspace > main {
  width: 100%;
  max-width: none !important;
  margin-inline: 0 !important;
}
body.management.ppr-unified-design:not(.auth) main .page-title h1 {
  font-family: var(--pr-heading-font) !important;
  font-size: clamp(1.875rem, 3.1vw, 2.75rem) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
}
body.management.ppr-unified-design:not(.auth) main :is(h2, h3, h4, h5, h6) {
  font-family: var(--pr-heading-font) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -.015em;
}
body.management.ppr-unified-design:not(.auth) main h2 { font-size: 1.5rem !important; }
body.management.ppr-unified-design:not(.auth) main h3 { font-size: 1.25rem !important; }
body.management.ppr-unified-design:not(.auth) :is(.card-grid, .stats, .details, .day-villas, .ppr-payment-overview, .ppr-payment-editor) {
  column-gap: var(--ppr-gap) !important;
}
body.management.ppr-unified-design:not(.auth) main > .location-switcher {
  width: 100%;
  max-width: none;
  margin-inline: 0 !important;
}
body.management.ppr-unified-design:not(.auth) :is(.page-title, .toolbar, .filters, .month-toolbar) {
  gap: 16px;
  min-width: 0;
  flex-wrap: wrap;
}
body.management.ppr-unified-design:not(.auth) main :is(.card, .hero-stat, .metric, .legacy) {
  padding-inline: var(--ppr-gap) !important;
  min-width: 0;
}
/* Contain wide data instead of clipping it or expanding the entire page. */
body.management.ppr-unified-design:not(.auth) :is(.table-scroll, .calendar-scroll, .month-scroll) {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
body.management.ppr-unified-design:not(.auth) .workspace > header form {
  min-width: 0;
}
body.management.ppr-unified-design:not(.auth) .workspace > header input {
  min-width: 0;
}
@media (max-width: 1068px) {
  body.ppr-unified-design { --ppr-gap: 20px; --ppr-manage-gutter: 24px; }
}
@media (max-width: 760px) {
  body.ppr-unified-design { --ppr-gutter: 16px; --ppr-gap: 16px; --ppr-manage-gutter: 16px; }
  body.ppr-unified-design:is(.pr-public-site, .pr-activities-page) { --ppr-section-space: 24px; --ppr-intro-space: 20px; }
  body.management.ppr-unified-design:not(.auth) .workspace > header { gap: 12px; }
  body.management.ppr-unified-design:not(.auth) .workspace > header form { max-width: 100%; }
  body.management.ppr-unified-design:not(.auth) main .page-title h1 { font-size: 1.875rem !important; }
}
