.rentals-page {
  --rental-ink: #17362f;
  --rental-muted: #60746e;
  --rental-line: #d7e6e0;
  --rental-surface: #ffffff;
  --rental-wash: #edf8f4;
  background: linear-gradient(180deg, #eef9f5 0, #f8fbfa 360px, #f5f8f7 100%);
}

.rentals-page .topbar {
  position: sticky;
  top: 0;
  z-index: 30;
  border-bottom: 1px solid var(--rental-line);
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(14px);
}

.rentals-page .rental-shell {
  width: min(1160px, calc(100% - 32px));
  margin: 28px auto 72px;
}

.rentals-page .rental-public-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(290px, .75fr);
  align-items: end;
  gap: 28px;
  padding: clamp(24px, 5vw, 54px);
  border: 1px solid var(--rental-line);
  border-radius: 24px;
  background: linear-gradient(135deg, #fff 0%, #f3fbf8 65%, #e4f5ef 100%);
  box-shadow: 0 18px 50px rgba(23, 72, 60, .09);
}

.rentals-page .rental-heading { max-width: 720px; padding: 0; }
.rentals-page .rental-heading h1 { margin: 10px 0 14px; line-height: 1.04; color: var(--rental-ink); }
.rentals-page .rental-heading p { max-width: 650px; margin: 0; color: var(--rental-muted); font-size: 1.06rem; line-height: 1.6; }
.rentals-page .rental-account-hub { padding: 20px; border: 1px solid var(--rental-line); border-radius: 18px; background: rgba(255,255,255,.9); }
.rentals-page .rental-account-hub-label { margin: 0 0 12px; color: var(--rental-ink); font-weight: 800; }
.rentals-page .rental-heading-actions { display: grid; gap: 10px; }
.rentals-page .rental-heading-actions a { width: 100%; min-height: 48px; justify-content: center; text-align: center; }

.rentals-page .rental-search-surface,
.rentals-page .rental-results-surface {
  margin-top: 24px;
  padding: clamp(18px, 3vw, 28px);
  border: 1px solid var(--rental-line);
  border-radius: 20px;
  background: var(--rental-surface);
  box-shadow: 0 12px 32px rgba(23, 72, 60, .065);
}

.rentals-page .rental-section-heading { display: flex; align-items: flex-start; gap: 13px; }
.rentals-page .rental-section-heading h2 { margin: 0; color: var(--rental-ink); font-size: clamp(1.25rem, 2.4vw, 1.65rem); }
.rentals-page .rental-section-heading p { margin: 5px 0 0; color: var(--rental-muted); }
.rentals-page .rental-step { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: #087f70; color: #fff; font-weight: 900; }
.rentals-page .rental-filter-bar { grid-template-columns: minmax(190px, 1.2fr) minmax(170px, 1fr) minmax(180px, 1fr) auto; gap: 14px; margin-top: 22px; padding: 0; border: 0; }
.rentals-page .rental-filter-bar input,
.rentals-page .rental-filter-bar select { min-height: 52px; background: #fff; }
.rentals-page .rental-filter-bar button { min-height: 52px; white-space: nowrap; }
.rentals-page .rental-results-heading { padding-bottom: 4px; border-bottom: 1px solid var(--rental-line); }
.rentals-page #rentalPublicStatus:empty { display: none; }
.rentals-page .rental-unit-grid { margin-top: 18px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.rentals-page .rental-unit-card { border-radius: 16px; border-color: var(--rental-line); box-shadow: 0 8px 24px rgba(18,72,59,.08); }
.rentals-page .rental-unit-body { padding: 18px; }
.rentals-page .rental-detail-panel,
.rentals-page .rental-form-surface,
.rentals-page .rental-login-panel { border-radius: 18px; padding: clamp(18px, 4vw, 30px); }
.rentals-page .rental-command-header { padding: 20px; margin-bottom: 14px; border: 1px solid var(--rental-line); border-radius: 18px; background: #fff; }
.rentals-page .rental-tabs { position: sticky; top: 76px; z-index: 15; padding: 10px; border: 1px solid var(--rental-line); border-radius: 14px; background: rgba(245,250,248,.97); }
.rentals-page .rental-tabs { display:flex; gap:8px; overflow-x:auto; scrollbar-width:thin; }
.rentals-page .rental-tabs button { flex:0 0 auto; }
.rentals-page .rental-tabs button.active { color:#fff; background:#0f766e; border-color:#0f766e; box-shadow:0 6px 18px rgba(15,118,110,.22); }
.rentals-page .rental-owner-section-heading { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; }
.rentals-page .rental-owner-section-heading h2 { margin:.25rem 0; }
.rentals-page .rental-photo-gallery img { cursor:zoom-in; }
.rentals-page .rental-photo-gallery video { width:100%; min-height:180px; max-height:320px; object-fit:cover; border-radius:12px; background:#102621; }
.rental-gallery-lightbox { z-index:1000; display:grid; place-items:center; padding:20px; }
.rental-gallery-dialog { width:min(100%,980px); padding:14px; border-radius:18px; background:#fff; box-shadow:0 24px 80px rgba(0,0,0,.35); }
.rental-gallery-dialog > img { display:block; width:100%; max-height:72vh; object-fit:contain; border-radius:12px; background:#102621; }
.rental-gallery-dialog > [data-gallery-close] { display:block; margin-left:auto; font-size:1.5rem; }
.rental-gallery-controls { display:flex; align-items:center; justify-content:center; gap:18px; padding-top:12px; }
@media (max-width:640px) { .rentals-page .rental-owner-section-heading { align-items:stretch; flex-direction:column; } }
.rentals-page .rental-record { border-radius: 14px; }
.rentals-page .rental-auth-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 24px; }
.rentals-page .rental-auth-grid .rental-login-panel { width: min(100%, 820px); margin-inline: auto; background: #fff; border: 1px solid var(--rental-line); box-shadow: 0 12px 32px rgba(23,72,60,.07); }
.rentals-page .rental-auth-grid h2 { margin: 8px 0 10px; color: var(--rental-ink); }
.rentals-page .rental-auth-grid > section > p { color: var(--rental-muted); line-height: 1.55; }
.rentals-page .rental-account-link { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid var(--rental-line); text-align: center; }
.rentals-page .rental-account-link .text-action { display: inline; width: auto; padding: 0; font-weight: 800; }
.rentals-page #rentalTenantCreateForm { margin-top: 20px; }
.rentals-page #rentalTenantCreateForm .rental-confirm-line { padding: 14px; border-radius: 12px; background: var(--rental-wash); }
.rentals-page .rental-payment-method-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.rentals-page .rental-payment-method-grid .rental-confirm-line { padding: 13px; border: 1px solid var(--rental-line); border-radius: 12px; background: var(--rental-wash); }

@media (max-width: 800px) {
  .rentals-page .rental-shell { width: min(100% - 20px, 1160px); margin-top: 12px; }
  .rentals-page .rental-public-hero { grid-template-columns: 1fr; gap: 20px; padding: 22px 18px; border-radius: 18px; }
  .rentals-page .rental-filter-bar { grid-template-columns: 1fr; }
  .rentals-page .rental-filter-bar button { width: 100%; }
  .rentals-page .rental-search-surface,
  .rentals-page .rental-results-surface { padding: 18px 14px; border-radius: 16px; }
  .rentals-page .rental-unit-grid { grid-template-columns: 1fr; }
  .rentals-page .rental-top-actions { width: auto; margin-left: auto; }
  .rentals-page .rental-top-actions select { max-width: 120px; }
  .rentals-page .rental-payment-method-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .rentals-page .topbar { align-items: flex-start; gap: 10px; }
  .rentals-page .topbar .brand small { display: block; max-width: 145px; }
  .rentals-page .rental-top-actions { gap: 6px; }
  .rentals-page .rental-top-actions .site-home-button { padding-inline: 10px; }
}
