@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range:
    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
    U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}
:root {
  --bg: #0b0f15;
  --surface: #121823;
  --surface-2: #19212d;
  --surface-3: #202938;
  --surface-raised: #19212d;
  --surface-hover: #202a38;
  --border: #2b3544;
  --border-strong: #344052;
  --text: #f3f5f8;
  --muted: #a0aabb;
  --accent: #f2a45a;
  --accent-hover: #ffbd7b;
  --accent-soft: #392b20;
  --accent-ink: #20160f;
  --success: #9cddb0;
  --success-surface: #24382d;
  --danger: #e57262;
  --danger-surface: #3b2b27;
  --warning: #ffd080;
  --warning-surface: #42351f;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --shadow-1: 0 6px 18px #0003;
  --shadow-2: 0 18px 44px #0005;
  --image-shade: linear-gradient(180deg, transparent 28%, #0b0f15e6 100%);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.5rem;
  --line-body: 1.55;
  --paper: var(--bg);
  --orange: var(--accent);
  --ink: var(--text);
  --pale: var(--surface-2);
  color-scheme: dark;
  --color-0000: #0000;
  --color-0002: #0002;
  --color-0003: #0003;
  --color-0004: #0004;
  --color-0005: #0005;
  --color-0006: #0006;
  --color-0007: #0007;
  --color-0008: #0008;
  --color-0009: #0009;
  --color-0a0e14: #0a0e14;
  --color-0e141df5: #0e141df5;
  --color-0f141d: #0f141d;
  --color-101620: #101620;
  --color-101620f5: #101620f5;
  --color-101620fa: #101620fa;
  --color-111721: #111721;
  --color-111823: #111823;
  --color-111823ed: #111823ed;
  --color-111925: #111925;
  --color-111925f5: #111925f5;
  --color-121925ed: #121925ed;
  --color-141b25: #141b25;
  --color-14251b: #14251b;
  --color-151c27: #151c27;
  --color-151e2b: #151e2b;
  --color-151e2bf2: #151e2bf2;
  --color-17191e: #17191e;
  --color-171a22: #171a22;
  --color-171f2b: #171f2b;
  --color-172130f5: #172130f5;
  --color-18212d: #18212d;
  --color-18212ded: #18212ded;
  --color-182230: #182230;
  --color-192331: #192331;
  --color-1a2534: #1a2534;
  --color-1b1f28: #1b1f28;
  --color-1b2431: #1b2431;
  --color-1b2634: #1b2634;
  --color-1b2637: #1b2637;
  --color-1d222c: #1d222c;
  --color-20242c: #20242c;
  --color-20242d: #20242d;
  --color-202a38: #202a38;
  --color-202d3c: #202d3c;
  --color-21170f: #21170f;
  --color-21170f33: #21170f33;
  --color-211a14: #211a14;
  --color-212630: #212630;
  --color-232832: #232832;
  --color-24180f: #24180f;
  --color-241c15e8: #241c15e8;
  --color-252a34: #252a34;
  --color-261b1777: #261b1777;
  --color-272b34: #272b34;
  --color-273140: #273140;
  --color-282b32: #282b32;
  --color-282e39: #282e39;
  --color-283447: #283447;
  --color-292218: #292218;
  --color-292318: #292318;
  --color-292e38: #292e38;
  --color-293548: #293548;
  --color-2b201b24: #2b201b24;
  --color-2b201b33: #2b201b33;
  --color-2b201b55: #2b201b55;
  --color-2b201b80: #2b201b80;
  --color-30251d: #30251d;
  --color-30251e: #30251e;
  --color-30291f: #30291f;
  --color-30343d: #30343d;
  --color-303b4b: #303b4b;
  --color-304055: #304055;
  --color-33291f: #33291f;
  --color-344052: #344052;
  --color-344154: #344154;
  --color-353a46: #353a46;
  --color-354256: #354256;
  --color-373c48: #373c48;
  --color-38291e: #38291e;
  --color-393e49: #393e49;
  --color-394659: #394659;
  --color-3a281c: #3a281c;
  --color-3a404c: #3a404c;
  --color-3a4657: #3a4657;
  --color-3a4658: #3a4658;
  --color-3b2e24: #3b2e24;
  --color-40261205: #40261205;
  --color-404653: #404653;
  --color-412b1b: #412b1b;
  --color-414753: #414753;
  --color-465367: #465367;
  --color-47634c: #47634c;
  --color-482b17: #482b17;
  --color-4a505d: #4a505d;
  --color-4e2c2020: #4e2c2020;
  --color-4e2c2025: #4e2c2025;
  --color-526176: #526176;
  --color-53647b: #53647b;
  --color-59473c: #59473c;
  --color-5d452c: #5d452c;
  --color-61574e: #61574e;
  --color-6dd3a0: #6dd3a0;
  --color-6dd3a01c: #6dd3a01c;
  --color-713d24: #713d24;
  --color-726051: #726051;
  --color-84796f: #84796f;
  --color-853719: #853719;
  --color-85441d: #85441d;
  --color-8c98a9: #8c98a9;
  --color-8d95a2: #8d95a2;
  --color-929fb1: #929fb1;
  --color-948578: #948578;
  --color-9b682f: #9b682f;
  --color-9b7c66: #9b7c66;
  --color-9ca8b8: #9ca8b8;
  --color-9da8b7: #9da8b7;
  --color-9da8b8: #9da8b8;
  --color-9f7149: #9f7149;
  --color-a32f19: #a32f19;
  --color-a4afbf: #a4afbf;
  --color-a74d25: #a74d25;
  --color-a8794e: #a8794e;
  --color-a8b2c1: #a8b2c1;
  --color-a93020: #a93020;
  --color-a94c1726: #a94c1726;
  --color-a9530c: #a9530c;
  --color-aab1be: #aab1be;
  --color-ad631d: #ad631d;
  --color-aeb8c7: #aeb8c7;
  --color-b4bac6: #b4bac6;
  --color-b5bbc7: #b5bbc7;
  --color-b8c4d5: #b8c4d5;
  --color-b9aa9b: #b9aa9b;
  --color-b9c0cb: #b9c0cb;
  --color-b9c4d2: #b9c4d2;
  --color-bd4c24: #bd4c24;
  --color-bdc7d5: #bdc7d5;
  --color-bdcfc1: #bdcfc1;
  --color-c0c8d4: #c0c8d4;
  --color-c1c9d4: #c1c9d4;
  --color-c2cbd8: #c2cbd8;
  --color-c4ccd8: #c4ccd8;
  --color-c7ccd5: #c7ccd5;
  --color-cdb49c: #cdb49c;
  --color-d0d8e3: #d0d8e3;
  --color-d4dce7: #d4dce7;
  --color-d58554: #d58554;
  --color-d5cabc: #d5cabc;
  --color-d6b89f: #d6b89f;
  --color-d79b7f: #d79b7f;
  --color-dac3a9: #dac3a9;
  --color-df7c3030: #df7c3030;
  --color-df7c3040: #df7c3040;
  --color-dfcdbb: #dfcdbb;
  --color-e4f4e8: #e4f4e8;
  --color-e6dbcf: #e6dbcf;
  --color-e6eaf0: #e6eaf0;
  --color-e7ad98: #e7ad98;
  --color-e7ebf1: #e7ebf1;
  --color-e87d30: #e87d30;
  --color-e88434: #e88434;
  --color-e8a66b: #e8a66b;
  --color-e8ebf0: #e8ebf0;
  --color-e8edf4: #e8edf4;
  --color-e98b3c: #e98b3c;
  --color-e9dfd4: #e9dfd4;
  --color-e9ebef: #e9ebef;
  --color-e9edf3: #e9edf3;
  --color-eceef2: #eceef2;
  --color-ed8a40: #ed8a40;
  --color-edf1f6: #edf1f6;
  --color-eee5d9: #eee5d9;
  --color-eee6db: #eee6db;
  --color-eef2f7: #eef2f7;
  --color-ef9146: #ef9146;
  --color-efe4d6: #efe4d6;
  --color-f0e3d4: #f0e3d4;
  --color-f0e4d6: #f0e4d6;
  --color-f1e6d9: #f1e6d9;
  --color-f1f4f8: #f1f4f8;
  --color-f29448: #f29448;
  --color-f2a45a24: #f2a45a24;
  --color-f2d2a1: #f2d2a1;
  --color-f2e3d4: #f2e3d4;
  --color-f2e5d5: #f2e5d5;
  --color-f2e7d9: #f2e7d9;
  --color-f3dfcb: #f3dfcb;
  --color-f4a261: #f4a261;
  --color-f4e4d4: #f4e4d4;
  --color-f4f6fa: #f4f6fa;
  --color-f5b77c: #f5b77c;
  --color-f5eadc: #f5eadc;
  --color-f5f6f8: #f5f6f8;
  --color-f5f7fa: #f5f7fa;
  --color-f6a45d: #f6a45d;
  --color-f7c19a: #f7c19a;
  --color-f7dfc8: #f7dfc8;
  --color-f7e2ce: #f7e2ce;
  --color-f8b56f: #f8b56f;
  --color-f9b56f: #f9b56f;
  --color-fae9da: #fae9da;
  --color-fbf5ec: #fbf5ec;
  --color-ff7900: #ff7900;
  --color-ff790033: #ff790033;
  --color-ff932e: #ff932e;
  --color-ff9a39: #ff9a39;
  --color-ffab61: #ffab61;
  --color-ffb06a: #ffb06a;
  --color-ffb26e: #ffb26e;
  --color-ffb36b: #ffb36b;
  --color-ffb56f: #ffb56f;
  --color-ffc27f: #ffc27f;
  --color-ffca91: #ffca91;
  --color-ffce9a: #ffce9a;
  --color-ffd09a: #ffd09a;
  --color-ffd09a2e: #ffd09a2e;
  --color-ffd09b: #ffd09b;
  --color-ffd19a: #ffd19a;
  --color-ffd3a0: #ffd3a0;
  --color-ffe0b8: #ffe0b8;
  --color-fff: #fff;
  --color-fff3e6: #fff3e6;
  --color-fff8: #fff8;
  --color-fff9: #fff9;
  --color-fffaf4: #fffaf4;
  --color-fffaf5: #fffaf5;
  --color-fffcf7: #fffcf7;
  --color-fffcf7dd: #fffcf7dd;
  --color-ffffff08: #ffffff08;
  --color-ffffff0a: #ffffff0a;
  --color-ffffff0c: #ffffff0c;
  --color-ffffff0d: #ffffff0d;
  --color-ffffff10: #ffffff10;
  --color-ffffff12: #ffffff12;
  --color-ffffff1c: #ffffff1c;
  --font-sans: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 30px;
}
button,
input,
select {
  font: inherit;
}
button,
a {
  touch-action: manipulation;
}
button {
  cursor: pointer;
  min-height: 44px;
  min-width: 44px;
}
a {
  color: inherit;
  text-decoration: none;
}
.hero {
  display: grid;
  grid-template-columns: 1.02fr 1fr;
  gap: 55px;
  padding: 25px 0 38px;
  align-items: center;
}
.pill:before {
  content: '';
  width: 6px;
  height: 6px;
  background: var(--orange);
  border-radius: 50%;
}
h1 span {
  color: var(--orange);
}
.lead {
  font-size: 15px;
  line-height: 1.75;
  max-width: 425px;
  color: var(--muted);
  margin: 0 0 25px;
}
.photo {
  position: relative;
  height: 625px;
  border-radius: 25px;
  overflow: hidden;
  background: var(--color-dac3a9);
}
.photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.photo:after {
  content: '';
  position: absolute;
  inset: 60% 0 0;
  background: linear-gradient(transparent, var(--color-261b1777));
}
.photolabel {
  position: absolute;
  bottom: 25px;
  left: 25px;
  right: 25px;
  z-index: 1;
  color: white;
}
.photolabel span {
  font-size: 10px;
  letter-spacing: 1.7px;
}
.photolabel strong {
  display: block;
  font-size: 23px;
  font-weight: 500;
  letter-spacing: -0.6px;
  margin-top: 9px;
}
.photocredit {
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 9px;
  background: var(--color-fff9);
  padding: 6px 8px;
  border-radius: 4px;
  color: var(--color-59473c);
}
.searchtabs {
  display: flex;
  align-items: center;
  gap: 24px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 17px;
  font-size: 12px;
  padding-bottom: 13px;
}
.searchtabs strong {
  color: var(--orange);
  display: flex;
  align-items: center;
  gap: 7px;
}
.searchtabs span {
  color: var(--color-84796f);
}
.soon {
  font-size: 8px;
  background: var(--color-eee6db);
  border-radius: 3px;
  padding: 3px 5px;
  margin-left: 5px;
}
.wide {
  grid-column: 1/-1;
}
.input {
  background: var(--paper);
  border: 1px solid var(--color-e9dfd4);
  border-radius: 7px;
  padding: 11px 10px;
  width: 100%;
  color: var(--ink);
  min-width: 0;
  font-size: 12px;
  min-height: 44px;
  height: auto;
}
.dates {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 5px;
}
.searchbutton {
  width: 100%;
  margin-top: 15px;
  padding: 13px;
}
.searchhint {
  margin: 10px 0 0;
  text-align: center;
  font-size: 10px;
  color: var(--muted);
}
.ownerlink {
  margin-top: 17px;
  width: 100%;
  padding: 13px;
}
.ownernote {
  margin: 8px 0 0;
  font-size: 10px;
  color: var(--muted);
}
.assurances {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 24px 0;
  gap: 30px;
}
.assurance {
  display: flex;
  gap: 14px;
  align-items: center;
}
.icon {
  width: 39px;
  height: 39px;
  border-radius: 50%;
  background: var(--pale);
  display: grid;
  place-items: center;
  color: var(--orange);
  flex-shrink: 0;
}
.assurance strong {
  font-size: 12px;
  display: block;
  margin-bottom: 5px;
}
.assurance p {
  font-size: 11px;
  margin: 0;
  color: var(--muted);
}
section.content {
  padding-top: 65px;
}
h2 {
  font-size: 34px;
  font-weight: 650;
  letter-spacing: -1.2px;
  margin: 0 0 12px;
}
.sectionhead {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: end;
  margin-bottom: 26px;
}
.sectionhead p {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
  margin: 0;
}
.textlink {
  color: var(--orange);
  font-size: 12px;
  border-bottom: 1px solid var(--color-d79b7f);
  padding-bottom: 4px;
  white-space: nowrap;
}
.country:hover {
  border-color: var(--orange);
  transform: translateY(-3px);
}
.steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 42px;
  padding-top: 10px;
}
.stepnum {
  font-size: 12px;
  color: var(--orange);
  background: var(--color-f2e3d4);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
}
.steps h3 {
  font-size: 17px;
  margin: 0 0 10px;
}
.steps p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.8;
  margin: 0;
}
.hostsection {
  margin-top: 65px;
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  background: var(--color-f0e4d6);
  border-radius: 18px;
  overflow: hidden;
}
.hostimage {
  min-height: 340px;
  background: url('assets/courtyard-600.webp') center 80% / cover;
}
.hostcopy {
  padding: 42px 45px;
}
.hostcopy h2 {
  font-size: 35px;
}
.hostcopy p {
  font-size: 13px;
  line-height: 1.8;
  color: var(--color-726051);
  max-width: 365px;
}
.hostcopy .button {
  margin-top: 9px;
}
.faqgrid {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 60px;
  padding-bottom: 60px;
}
.faqintro p {
  font-size: 13px;
  line-height: 1.8;
  color: var(--muted);
  max-width: 280px;
}
details {
  border-bottom: 1px solid var(--border);
  padding: 18px 0;
}
details:first-child {
  padding-top: 0;
}
summary {
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 18px;
}
summary:after {
  content: '+';
  color: var(--orange);
  font-size: 17px;
}
details[open] summary:after {
  content: '−';
}
details p {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.8;
  margin: 12px 22px 0 0;
}
footer {
  border-top: 1px solid var(--border);
  padding: 30px 0;
}
.footerline p {
  font-size: 11px;
  color: var(--muted);
}
.footerlinks {
  display: flex;
  gap: 24px;
  font-size: 11px;
}
.footnote {
  font-size: 10px;
  color: var(--color-948578);
  margin: 20px 0 0;
}
.helpbutton {
  position: fixed;
  bottom: 20px;
  right: 22px;
  z-index: 5;
  box-shadow: 0 4px 20px var(--color-4e2c2025);
  border-radius: 30px;
}
.helpbox {
  position: fixed;
  right: 22px;
  bottom: 80px;
  width: 310px;
  background: var(--color-fffcf7);
  border: 1px solid var(--border);
  box-shadow: 0 8px 30px var(--color-4e2c2020);
  border-radius: 14px;
  padding: 24px;
  z-index: 6;
}
.helpbox h3 {
  margin: 0 0 12px;
  font-size: 18px;
}
.helpbox p {
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}
.close {
  float: right;
  background: none;
  border: 0;
  font-size: 22px;
  color: var(--muted);
  padding: 0 4px;
}
dialog::backdrop {
  background: var(--color-2b201b80);
}
dialog h2 {
  font-size: 27px;
  margin-top: 18px;
}
dialog p {
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
}
dialog .input {
  margin-bottom: 15px;
}
dialog .button {
  margin-top: 12px;
}
#error {
  font-size: 11px;
  color: var(--color-a93020);
  margin: 10px 0 0;
}
#results {
  background: var(--color-f2e7d9);
  padding: 28px;
  border-radius: 14px;
  margin-top: 30px;
  scroll-margin-top: 30px;
}
.resulthead {
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
.resulthead h2 {
  font-size: 24px;
}
.resulthead p {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.6;
}
.svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.navtoggle {
  display: none;
}
[hidden] {
  display: none !important;
}
@media (max-width: 850px) {
  .wrap {
    padding: 0 22px;
  }
  .header {
    height: 78px;
  }
  .nav {
    gap: 18px;
  }
  .nav a {
    display: none;
  }
  .hero {
    gap: 25px;
    grid-template-columns: 1fr 1fr;
  }
  .photo {
    height: 620px;
  }
  h1 {
    font-size: 46px;
    letter-spacing: -2px;
  }
  .brand span {
    display: none;
  }
  .hero .lead {
    font-size: 13px;
  }
  .dates {
    grid-template-columns: 1fr;
  }
  .formgrid {
    gap: 10px;
  }
  .assurances {
    gap: 16px;
  }
  .assurance {
    gap: 9px;
  }
  .assurance p {
    line-height: 1.5;
  }
  .hostcopy {
    padding: 28px;
  }
  .faqgrid {
    gap: 30px;
  }
}
@media (max-width: 620px) {
  .reviewbar {
    font-size: 9px;
  }
  .hero h1 {
    font-size: 51px;
    max-width: 400px;
  }
  .lead {
    max-width: 380px;
  }
  .photo {
    height: 350px;
    border-radius: 18px;
  }
  .searchbox {
    padding: 17px;
  }
  .dates {
    grid-template-columns: 1.4fr 1fr;
  }
  .hero .lead {
    font-size: 14px;
  }
  .hero {
    grid-template-columns: 1fr;
    padding-top: 14px;
    padding-bottom: 25px;
  }
  .nav .button {
    font-size: 11px;
    padding: 11px 16px;
  }
  .assurances {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 25px 0;
  }
  .assurance {
    gap: 15px;
  }
  .assurance p {
    font-size: 12px;
  }
  .steps,
  .parkingcardlist {
    grid-template-columns: 1fr;
  }
  .sectionhead {
    align-items: start;
  }
  .sectionhead .textlink {
    display: none;
  }
  section.content {
    padding-top: 45px;
  }
  h2 {
    font-size: 29px;
  }
  .steps {
    gap: 28px;
  }
  .stepnum {
    margin-bottom: 12px;
  }
  .hostsection {
    grid-template-columns: 1fr;
    margin-top: 45px;
  }
  .hostimage {
    min-height: 220px;
  }
  .hostcopy {
    padding: 30px;
  }
  .hostcopy h2 {
    font-size: 31px;
  }
  .faqgrid {
    grid-template-columns: 1fr;
    gap: 25px;
    padding-bottom: 40px;
  }
  .footerline {
    align-items: start;
    flex-wrap: wrap;
  }
  .footerlinks {
    gap: 18px;
  }
  .helpbutton {
    padding: 12px 16px;
    right: 15px;
  }
  .helpbox {
    right: 15px;
    max-width: calc(100vw - 30px);
  }
  .footnote {
    padding-bottom: 35px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    transition: none !important;
  }
}

.pageintro {
  padding: 30px 0;
}
.pageintro h1 {
  font-size: 43px;
  margin: 12px 0;
}
.pageintro p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.toolbar .dates {
  grid-template-columns: 1fr;
}
.check {
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 12px;
  margin: 0;
}
.filterbar select,
.filterbar input[type='number'] {
  width: 145px;
}
.filterbar .button {
  padding: 11px 15px;
}
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
.cardbody .button {
  width: 100%;
  margin-top: 15px;
}
.maplayout {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 20px;
}
.maplayout .grid {
  grid-template-columns: 1fr;
}
.maplayout .parkingcard img {
  height: 150px;
}
.mapbox iframe {
  width: 100%;
  height: 500px;
  border: 0;
  border-radius: 8px;
}
.mapbox p {
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}
.mapbox .input {
  margin: 10px 0;
}
.detailtop {
  padding: 20px 0;
}
.detailtop h1 {
  font-size: 39px;
  margin: 20px 0 12px;
}
.detailtop p {
  font-size: 13px;
  color: var(--muted);
}
.detailhero {
  height: 350px;
  width: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.detailgrid {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  gap: 45px;
  margin-top: 30px;
  align-items: start;
}
.detailsection {
  border-bottom: 1px solid var(--border);
  padding: 0 0 28px;
  margin: 0 0 28px;
}
.detailsection h2 {
  font-size: 23px;
}
.detailsection p,
.detailsection li {
  font-size: 13px;
  line-height: 1.85;
  color: var(--muted);
}
.amenities {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
}
.amenities span {
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 12px;
}
.spots {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.bookingbox {
  position: sticky;
  top: 20px;
  background: var(--color-fffcf7);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 24px;
}
.bookingbox h2 {
  font-size: 24px;
}
.bookingbox .dates {
  grid-template-columns: 1.5fr 1fr;
}
.bookingbox label {
  margin-top: 16px;
}
.costrow {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin: 15px 0;
}
.total {
  border-top: 1px solid var(--border);
  padding-top: 15px;
  font-weight: bold;
}
.booknote {
  font-size: 11px;
  line-height: 1.7;
  color: var(--muted);
}
.bookingbox .button {
  width: 100%;
}
.calendar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  margin-top: 18px;
}
.calday small {
  display: block;
  color: var(--muted);
  font-size: 8px;
  margin-bottom: 5px;
}
.error {
  color: var(--color-a32f19);
}
.empty {
  padding: 35px;
  background: var(--color-f1e6d9);
  border-radius: 10px;
  line-height: 1.7;
}
.detailmap {
  width: 100%;
  height: 270px;
  border: 0;
  border-radius: 12px;
}
.backlink {
  font-size: 12px;
  color: var(--orange);
}
.stagefooter {
  margin-top: 65px;
}
.cardimage {
  position: relative;
}
.no-listing-photo {
  display: grid;
  min-height: 200px;
  padding: 16px;
  place-items: center;
  background: linear-gradient(145deg, var(--surface-2), var(--surface));
  color: var(--muted);
  text-align: center;
}
.cardimage small {
  position: absolute;
  bottom: 12px;
  left: 12px;
  background: var(--color-fffcf7dd);
  padding: 5px 8px;
  border-radius: 4px;
  font-size: 9px;
}
.confirmbox {
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin: 15px 0;
}
.confirmbox p {
  margin: 5px 0;
}
.dayheading {
  font-size: 11px;
  color: var(--muted);
  text-align: center;
}
.previewbanner {
  background: var(--color-f0e3d4);
  padding: 12px 18px;
  font-size: 12px;
  line-height: 1.6;
  border-radius: 10px;
  margin: 18px 0;
}
@media (max-width: 800px) {
  .toolbar {
    grid-template-columns: 1fr 1fr;
  }
  .grid {
    grid-template-columns: 1fr 1fr;
  }
  .detailgrid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .bookingbox {
    position: static;
  }
  .maplayout {
    grid-template-columns: 1fr;
  }
  .mapbox {
    position: static;
    grid-row: 1;
  }
  .mapbox iframe {
    height: 340px;
  }
  .maplayout .grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 520px) {
  .grid,
  .maplayout .grid {
    grid-template-columns: 1fr;
  }
  .toolbar .input {
    font-size: 11px;
  }
  .pageintro h1 {
    font-size: 36px;
  }
  .detailtop h1 {
    font-size: 32px;
  }
  .detailhero {
    height: 260px;
  }
  .filterbar {
    gap: 12px;
  }
  .detailgrid {
    margin-top: 24px;
  }
  .resultbar {
    align-items: start;
  }
  .bookingbox {
    padding: 20px;
  }
  .cardbody .button {
    width: 100%;
  }
  .header .nav {
    gap: 10px;
  }
}

button.calday {
  font-family: inherit;
  color: var(--ink);
  min-height: 54px;
  cursor: pointer;
}
button.calday:not(:disabled):hover {
  border-color: var(--orange);
  background: var(--color-f7dfc8);
}
button.calday:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 2px;
}
button.calday:disabled {
  cursor: not-allowed;
  color: var(--color-9b7c66);
}
#calendarHelp {
  min-height: 48px;
}

.calendar-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.calendar-nav label {
  flex: 1;
  max-width: 240px;
}
.calendar-nav button,
.duration-options button {
  background: var(--color-fff8);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  color: var(--ink);
  cursor: pointer;
}
.duration-options button:hover,
.calendar-nav button:hover {
  border-color: var(--orange);
}
.calendar-nav button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.bookingbox,
.detailgrid > div {
  min-width: 0;
}
.duration-heading {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 20px 0 10px;
  font-size: 11px;
  font-weight: 600;
}
.duration-heading span:last-child {
  font-weight: 400;
  color: var(--muted);
  font-size: 10px;
}
.duration-picker {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}
.duration-options {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  min-width: 0;
  flex: 1;
  margin: 0;
  padding: 5px 2px 9px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: var(--color-d6b89f) transparent;
  overscroll-behavior-x: contain;
}
.duration-options button {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 44px;
  border-radius: 999px;
  padding: 11px 19px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  background: var(--color-fffaf4);
  border: 1px solid var(--color-dfcdbb);
  scroll-snap-align: start;
  transition:
    background 0.15s,
    border-color 0.15s,
    box-shadow 0.15s;
}
.duration-options button:hover {
  background: var(--color-fae9da);
  border-color: var(--orange);
}
.duration-options button[aria-pressed='true'] {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--color-fff);
  box-shadow: 0 3px 8px var(--color-a94c1726);
}
.duration-arrow {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--color-fffaf4);
  color: var(--ink);
  font-size: 23px;
  line-height: 1;
  cursor: pointer;
}
.duration-arrow:hover {
  background: var(--color-fae9da);
  border-color: var(--orange);
}
.duration-options button:focus-visible,
.duration-arrow:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}
.workspace {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 40px;
  padding: 28px 0 70px;
}
.dashnav > a {
  display: block;
  padding: 13px 14px;
  margin: 5px 0;
  border-radius: 8px;
  font-size: 13px;
}
.navidentity {
  border-top: 1px solid var(--border);
  margin-top: 30px;
  padding-top: 20px;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.navidentity a {
  display: block;
  margin-top: 12px;
  color: var(--orange);
}
.dashutility {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 28px;
}
.dashpanel h1 {
  font-size: 36px;
  letter-spacing: -1px;
  margin: 10px 0;
}
.dashlead {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.8;
  margin-bottom: 30px;
}
.stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
  margin: 28px 0;
}
.stats strong {
  display: block;
  font-size: 32px;
}
.stats span {
  font-size: 11px;
  color: var(--muted);
}
.dashgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.dashcard {
  background: var(--color-fffcf7);
  border: 1px solid var(--border);
  padding: 24px;
  border-radius: 14px;
  margin-bottom: 18px;
  min-width: 0;
  overflow-wrap: anywhere;
}
.dashcard h2 {
  font-size: 24px;
  line-height: 1.3;
}
.dashcard h3 {
  font-size: 20px;
  margin: 10px 0;
}
.dashcard p {
  font-size: 13px;
  line-height: 1.8;
  color: var(--muted);
}
.cardtop {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 15px;
}
.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.button.small {
  font-size: 11px;
  padding: 10px 13px;
  min-height: 44px;
}
.textbutton {
  border: 0;
  background: none;
  color: var(--orange);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  padding: 5px 0;
}
.danger {
  color: var(--color-a32f19);
}
.spotrows {
  margin-top: 22px;
}
.spotrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid var(--border);
  padding: 18px 0;
}
.spotrow p {
  font-size: 11px;
  margin: 8px 0;
}
.spotrow .actions {
  justify-content: flex-end;
  max-width: 230px;
}
.formgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
#editForm label,
#profileForm label {
  display: block;
  margin: 14px 0 8px;
}
#editForm .check {
  display: flex;
}
#editForm button[type='submit'] {
  margin-top: 20px;
}
textarea {
  font: inherit;
  resize: vertical;
}
#modalError {
  color: var(--color-a32f19);
  font-size: 13px;
}
dialog {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 30px;
  width: calc(100% - 32px);
  max-width: 500px;
  background: var(--color-fffcf7);
  color: var(--ink);
  max-height: 90vh;
  overflow: auto;
}
@media (max-width: 900px) {
  .workspace {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .dashnav {
    border: 0;
    padding: 0;
    display: flex;
    gap: 6px;
    overflow: auto;
    align-items: center;
  }
  .dashnav > a {
    white-space: nowrap;
  }
  .dashnav > .eyebrow,
  .navidentity {
    display: none;
  }
  .dashgrid {
    grid-template-columns: 1fr;
  }
  .stats > div {
    padding: 16px;
  }
  .header {
    height: auto;
    min-height: 90px;
    flex-wrap: wrap;
    gap: 14px;
    padding: 20px 0;
  }
  .nav {
    display: flex !important;
    flex-wrap: wrap;
    gap: 14px;
  }
  .nav a {
    font-size: 12px;
  }
  .spotrow {
    align-items: start;
    flex-direction: column;
  }
  .spotrow .actions {
    justify-content: start;
    max-width: none;
  }
}
@media (max-width: 500px) {
  .wrap {
    padding: 0 18px;
  }
  .dashpanel h1 {
    font-size: 29px;
  }
  .stats {
    gap: 8px;
  }
  .stats > div {
    padding: 12px;
  }
  .stats strong {
    font-size: 25px;
  }
  .formgrid {
    grid-template-columns: 1fr;
  }
  .dashcard {
    padding: 18px;
  }
  .cardtop {
    flex-wrap: wrap;
  }
}
.preserve-lines {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.booking-timeline {
  padding-left: 22px;
  border-left: 1px solid var(--border);
  list-style: none;
  margin: 20px 0;
}
.booking-timeline li {
  position: relative;
  margin: 0 0 20px;
  font-size: 13px;
  text-transform: capitalize;
}
.booking-timeline li:before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--orange);
  position: absolute;
  left: -27px;
  top: 4px;
}
.booking-timeline span {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 6px;
}
.help-page {
  padding: 25px 0 80px;
}
.help-intro {
  padding: 35px 0 45px;
  max-width: 660px;
}
.help-intro h1 {
  font-size: 46px;
  letter-spacing: -1.5px;
  margin: 14px 0;
}
.help-intro p {
  color: var(--muted);
  line-height: 1.7;
}
.help-intro .input {
  margin-top: 16px;
  min-height: 54px;
}
.help-layout {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 50px;
}
.help-layout aside {
  align-self: start;
  position: sticky;
  top: 24px;
}
.help-layout aside > a {
  display: flex;
  margin-top: 18px;
}
#faqResults details {
  border-bottom: 1px solid var(--border);
  padding: 20px 0;
}
#faqResults summary {
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.5;
}
#faqResults p {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.9;
}
.support-contact {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 50px;
  margin-top: 65px;
  border-top: 1px solid var(--border);
  padding-top: 45px;
}
.support-contact h2 {
  font-size: 30px;
}
.support-contact p {
  font-size: 13px;
  line-height: 1.8;
  color: var(--muted);
}
#ticketForm label {
  display: block;
  font-size: 13px;
  margin: 18px 0 8px;
}
#ticketForm .input {
  width: 100%;
}
#ticketForm .button {
  margin-top: 15px;
}
#ticketSubmit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
#ticketAccount {
  font-size: 12px;
  line-height: 1.8;
  color: var(--muted);
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 700px) {
  .help-layout,
  .support-contact {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .help-layout aside {
    position: static;
  }
  .help-intro h1 {
    font-size: 36px;
  }
  .help-intro {
    padding-top: 16px;
  }
  .support-contact {
    margin-top: 30px;
    padding-top: 30px;
  }
}
#adminLink[hidden] {
  display: none;
}
.admin-stats {
  grid-template-columns: repeat(3, 1fr);
}
.admin-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 24px 0;
  font-size: 12px;
}
.admin-pagination button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
#adminRows {
  margin-top: 24px;
}
#adminRows [hidden] {
  display: none;
}
#reasonForm label,
#replyForm label,
#followupForm label {
  display: block;
  font-size: 13px;
  margin: 18px 0 8px;
}
#reasonForm .input,
#replyForm .input,
#followupForm .input {
  width: 100%;
}
#reasonForm button,
#replyForm button,
#followupForm button {
  margin-top: 16px;
}
.support-message strong {
  font-size: 12px;
}
.support-message small {
  display: block;
  color: var(--muted);
  font-size: 10px;
  margin-top: 5px;
}
.support-message p {
  font-size: 13px;
  line-height: 1.8;
}
#actionError,
#followupError {
  color: var(--color-a32f19);
  font-size: 12px;
}
@media (max-width: 600px) {
  .admin-stats {
    grid-template-columns: 1fr 1fr;
  }
  .admin-pagination {
    font-size: 11px;
    gap: 8px;
  }
}
button.calday.partially-booked .day-number {
  text-decoration: none;
}
button.calday.partially-booked small::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 3px;
  border-radius: 50%;
  background: var(--color-ad631d);
  vertical-align: middle;
}
button.calday.partially-booked small {
  font-size: 7px;
  line-height: 1.15;
  color: var(--color-85441d);
  margin: 4px 0 0;
  white-space: normal;
}
button.calday.partially-booked.selected {
  border: 2px solid var(--orange);
}
#dayAvailability {
  font-size: 12px;
  line-height: 1.8;
}
.searchbox,
.country,
.parkingcard,
.mapbox,
.bookingbox,
.dashcard,
.helpbox,
dialog {
  background: var(--color-1b1f28);
  color: var(--ink);
  border-color: var(--border);
}
.searchbox {
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 19px;
  background: var(--color-fffcf7);
  box-shadow: 0 8px 24px var(--color-0003);
}
.country:hover,
.parkingcard:hover {
  border-color: var(--color-ff7900);
}
.input:focus {
  border-color: var(--color-ff7900);
  box-shadow: 0 0 0 2px var(--color-ff790033);
}
label,
.searchtabs span,
.countrycode,
.tag,
.status {
  color: var(--color-b5bbc7);
}
.searchtabs,
.assurances,
.countrybottom,
details,
.detailsection,
.footerline,
footer {
  border-color: var(--color-373c48);
}
.pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  padding: 9px 13px;
  background: var(--color-3a281c);
  color: var(--color-ffb06a);
}
.pill:before,
.eyebrow,
.textlink,
.backlink,
.textbutton {
  color: var(--color-ff932e);
}
.icon,
.stepnum {
  background: var(--color-30251d);
  color: var(--color-ff932e);
}
.hostsection,
.previewbanner {
  background: var(--color-20242d);
}
.hostcopy p,
.dashcard p {
  color: var(--color-b4bac6);
}
#results,
.empty {
  background: var(--color-1d222c);
}
.resulthead p,
.detailtop p,
.detailsection p,
.detailsection li,
.booknote,
.dashlead,
.help-intro p,
.help-layout p {
  color: var(--color-aab1be);
}
.spot {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 13px 17px;
  background: var(--color-232832);
  border-color: var(--color-414753);
  color: var(--color-e9ebef);
}
.spot.active {
  background: var(--color-412b1b);
  border-color: var(--color-ff7900);
  color: var(--color-ffab61);
}
.amenities span,
.calendar-nav button,
.duration-options button,
.duration-arrow {
  background: var(--color-232832);
  border-color: var(--color-414753);
  color: var(--color-e9ebef);
}
.duration-options button[aria-pressed='true'],
.duration-options button:hover,
.calendar-nav button:hover {
  background: var(--color-ff7900);
  border-color: var(--color-ff7900);
  color: var(--color-17191e);
}
.calday {
  padding: 10px 3px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: 6px;
  font-size: 11px;
  background: var(--color-212630);
  border-color: var(--color-414753);
  color: var(--color-eceef2);
}
.calday.blocked {
  text-decoration: line-through;
  background: var(--color-282b32);
  color: var(--color-8d95a2);
}
.calday.selected {
  background: var(--color-482b17);
  border-color: var(--color-ff7900);
  color: var(--color-ffb26e);
}
.dashnav {
  border-right: 1px solid var(--border);
  padding-right: 24px;
  border-color: var(--color-393e49);
}
.dashnav > a.active {
  font-weight: bold;
  background: var(--color-30251e);
  color: var(--color-ff9a39);
}
.status {
  display: inline-block;
  border-radius: 20px;
  padding: 5px 9px;
  font-size: 10px;
  text-transform: capitalize;
  white-space: nowrap;
  background: var(--color-30343d);
  color: var(--color-e8ebf0);
}
.status-active,
.status-accepted {
  background: var(--success-surface);
  color: var(--success);
}
.status-pending {
  background: var(--warning-surface);
  color: var(--warning);
}
.status-paused,
.status-blocked {
  background: var(--danger-surface);
  color: var(--color-e7ad98);
}
.notification.unread {
  border-left: 4px solid var(--orange);
  background: var(--color-292218);
}
.msg {
  font-size: 12px;
  line-height: 1.7;
  padding: 12px;
  border-radius: 7px;
  background: var(--color-282e39);
  color: var(--color-e6eaf0);
}
.support-message {
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 10px;
  margin: 16px 0;
  background: var(--color-1b1f28);
  border-color: var(--color-3a404c);
}
.support-message.from-support {
  background: var(--color-272b34);
  border-color: var(--color-4a505d);
}
button.calday.partially-booked {
  background: var(--color-30291f);
  border-color: var(--color-9b682f);
  color: var(--color-f2d2a1);
}
.button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline-color: var(--color-ff9a39);
}

/* Match the search panel to the active dark theme. */
.toolbar label {
  color: var(--ink);
}

/* Premium India visual system */
body {
  margin: 0;
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(ellipse at 50% -25%, var(--color-1b2637) 0, transparent 58%),
    linear-gradient(145deg, var(--color-0f141d), var(--color-0a0e14) 72%);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  line-height: var(--line-body);
}
.wrap {
  margin: auto;
  padding: 0 32px;
  max-width: 1280px;
}
.reviewbar {
  text-align: center;
  font-size: 10px;
  padding: 8px;
  background: var(--color-101620);
  color: var(--color-9ca8b8);
  border-bottom: 1px solid var(--color-273140);
  letter-spacing: 0.7px;
}
.header {
  height: 94px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--color-ffffff0d);
}
.brand {
  font-size: 27px;
  font-weight: 800;
  letter-spacing: -1px;
  color: var(--color-ffb56f);
}
.brand span {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 2px;
  margin-left: 10px;
  color: var(--color-a8b2c1);
}
.nav {
  display: flex;
  align-items: center;
  font-weight: 600;
  gap: clamp(14px, 2vw, 28px);
  font-size: 13px;
}
.nav a:not(.button) {
  color: var(--color-c4ccd8);
  transition: color 0.18s ease;
}
.nav a:not(.button):hover {
  color: var(--accent-hover);
}
h1,
h2,
h3 {
  font-family: inherit;
  color: var(--color-f5f7fa);
  text-wrap: balance;
}
h1 {
  font-size: clamp(43px, 4.7vw, 64px);
  line-height: 1.04;
  margin: 22px 0 20px;
  font-weight: 720;
  letter-spacing: -0.045em;
}
.eyebrow {
  text-transform: uppercase;
  color: var(--orange);
  margin: 0 0 13px;
  letter-spacing: 1.35px;
  font-size: 10px;
  font-weight: 700;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-radius: 9px;
  padding: 15px 22px;
  font-size: 13px;
  background: linear-gradient(
    135deg,
    var(--color-ffc27f),
    var(--color-f29448) 72%,
    var(--color-e87d30)
  );
  color: var(--accent-ink);
  border: 1px solid var(--color-ffd3a0);
  box-shadow: 0 7px 22px var(--color-df7c3030);
  font-weight: 700;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease;
  min-height: 44px;
  font-family: var(--font-sans);
}
.button:hover {
  background: linear-gradient(
    135deg,
    var(--color-ffd09b),
    var(--color-f6a45d) 72%,
    var(--color-ed8a40)
  );
  box-shadow: 0 10px 28px var(--color-df7c3040);
  transform: translateY(-2px);
}
.button.dark {
  border-radius: 30px;
  padding: 12px 22px;
  background: var(--surface-3);
  color: var(--color-eef2f7);
  border: 1px solid var(--color-344154);
  box-shadow: none;
}
.button.dark:hover {
  background: var(--color-293548);
  border-color: var(--color-53647b);
}
.button.outline {
  border-color: var(--color-a9530c);
  background: var(--color-151c27);
  color: var(--accent-hover);
  border: 1px solid var(--color-465367);
  box-shadow: none;
}
.button.outline:hover {
  background: var(--color-202a38);
  border-color: var(--color-ffb56f);
  color: var(--color-ffd09a);
}
.input,
select.input,
textarea {
  color-scheme: dark;
  border-radius: 10px;
  border-color: var(--color-344052);
  background: var(--color-151c27);
  color: var(--color-f1f4f8);
  box-shadow: inset 0 1px var(--color-ffffff08);
}
.input:focus,
select.input:focus,
textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--color-f2a45a24);
}
label {
  font-size: 10px;
  font-weight: 600;
  display: block;
  margin-bottom: 7px;
  color: var(--color-c0c8d4);
}
.toolbar {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr;
  gap: 14px;
  border: 1px solid var(--border);
  padding: 20px;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--color-18212ded), var(--color-111823ed));
  border-color: var(--color-344052);
  box-shadow: 0 18px 44px var(--color-0003);
}
.toolbar .input {
  color: var(--ink);
  background: var(--color-101620);
}
.filterbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px 0;
  gap: 12px;
}
.resultbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  padding: 15px 0 22px;
  font-size: 13px;
  border-bottom: 1px solid var(--color-ffffff10);
  margin-bottom: 20px;
}
.seg {
  display: flex;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  border-color: var(--color-344052);
  background: var(--color-111721);
  padding: 3px;
}
.seg button {
  border: 0;
  padding: 10px 17px;
  background: var(--color-20242c);
  color: var(--color-c7ccd5);
  border-radius: 7px;
}
.seg button.active {
  background: var(--accent);
  color: var(--accent-ink);
}
.parkingcard,
.mapbox,
.bookingbox,
.dashcard,
.helpbox,
.searchbox {
  background: linear-gradient(150deg, var(--color-171f2b), var(--color-111721) 80%);
  border-color: var(--color-303b4b);
  box-shadow: 0 16px 42px var(--color-0003);
}
.parkingcard {
  background: var(--color-fffcf7);
  border: 1px solid var(--border);
  border-radius: 13px;
  overflow: hidden;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}
.parkingcard:hover {
  transform: translateY(-4px);
  border-color: var(--color-a8794e);
  box-shadow: 0 22px 48px var(--color-0005);
}
.parkingcard img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  filter: saturate(0.88);
}
.cardbody {
  padding: 22px;
  color: var(--color-344052);
}
.cardbody h2 {
  letter-spacing: -0.4px;
  line-height: 1.25;
  font-size: 21px;
  color: var(--color-111721);
}
.cardbody p {
  font-size: 12px;
  line-height: 1.7;
  color: var(--color-53647b);
}
.cardbody .tag {
  font-size: 9px;
  text-transform: uppercase;
  color: var(--color-713d24);
  letter-spacing: 1px;
}
.cardbody .rate {
  font-size: 23px;
  font-weight: 700;
  color: var(--color-853719);
}
.mapbox {
  position: sticky;
  top: 20px;
  align-self: start;
  background: linear-gradient(150deg, var(--surface-2), var(--surface) 80%);
  color: var(--text);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 18px;
}
.mapbox h2 {
  color: var(--text);
}
.mapbox label {
  color: var(--muted);
}
.mapbox iframe,
.detailmap {
  border: 1px solid var(--color-303b4b);
  border-radius: 12px;
}
.mapbox p,
.booknote {
  color: var(--color-a4afbf);
}
.empty,
.previewbanner,
.msg {
  background: linear-gradient(145deg, var(--color-18212d), var(--color-141b25));
  border: 1px solid var(--color-303b4b);
  color: var(--color-e7ebf1);
}
.spot,
.amenities span,
.calendar-nav button,
.duration-options button,
.duration-arrow {
  border-color: var(--color-3a4658);
}
.spot.active,
.duration-options button[aria-pressed='true'] {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--color-ffd09a);
}
.stats > div {
  border-radius: 12px;
  padding: 24px;
  background: linear-gradient(150deg, var(--color-1b2431), var(--color-141b25));
  border: 1px solid var(--color-303b4b);
}
.dashnav > a.active,
.dashboard-links > a.active {
  background: var(--color-30251d);
  color: var(--accent-hover);
}
.auth-layout .auth-card {
  background: linear-gradient(150deg, var(--color-171f2b), var(--color-111721));
  border: 1px solid var(--color-303b4b);
  border-radius: 22px;
  padding: 32px;
  box-shadow: 0 20px 52px var(--color-0004);
}
.auth-story {
  border: 1px solid var(--color-ffffff12);
  box-shadow: 0 20px 52px var(--color-0004);
}
.auth-email {
  background: var(--color-202a38);
  color: var(--text);
}
.auth-switch {
  border-color: var(--color-303b4b);
}
.auth-layout .auth-subtitle,
.auth-layout .booknote {
  color: var(--color-aeb8c7);
}
.footerline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  border-color: var(--color-303b4b);
}
.textlink,
.backlink,
.textbutton {
  color: var(--accent-hover);
}
@media (max-width: 800px) {
  .auth-layout .auth-card {
    padding: 25px;
  }
  .resultbar {
    gap: 12px;
  }
}
@media (max-width: 520px) {
  .cardbody {
    padding: 18px;
  }
  .toolbar {
    gap: 10px;
    padding: 15px;
    box-shadow: 0 12px 30px var(--color-0003);
  }
  .auth-layout .auth-card {
    padding: 22px;
    border-radius: 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .button,
  .parkingcard {
    transition: none;
  }
}

/* City autocomplete */
.city-field {
  position: relative;
  min-width: 0;
}
.city-suggestions[hidden] {
  display: none;
}
.city-suggestions {
  position: absolute;
  z-index: 50;
  top: calc(100% + 7px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--color-3a4657);
  border-radius: 14px;
  background: linear-gradient(145deg, var(--color-18212ded), var(--color-101620fa));
  box-shadow: 0 18px 42px var(--color-0008);
  backdrop-filter: blur(16px);
}
.city-suggestion {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--color-edf1f6);
  text-align: left;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
.city-suggestion:after {
  content: 'India';
  color: var(--color-8c98a9);
  font-size: 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.city-suggestion:hover,
.city-suggestion[aria-selected='true'] {
  background: var(--color-ffffff0c);
  color: var(--color-ffca91);
  outline: none;
}
.city-suggestion:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}
/* Shared select, date picker, and contrast components */ /* High-contrast states shared across the India site. Loaded after page styles. */

select option:disabled {
  color: var(--color-aeb8c7);
  opacity: 1;
}

button[aria-pressed='true'] {
  color: var(--accent-ink);
  background: var(--color-ffd09a);
  border-color: var(--color-ffd09a);
  font-weight: 700;
}

.dashboard-page .dashboard-switcher {
  color: var(--color-f1f4f8);
  background: var(--color-151c27);
  border-color: var(--color-3a4658);
}

.dashboard-page .dashboard-switcher label {
  color: var(--color-d4dce7);
}

.dashboard-page .dashboard-links > a.active,
.dashboard-page .dashnav > a.active,
.dashboard-page .dashboard-links > a[aria-current='page'] {
  color: var(--color-ffd09a);
  background: var(--accent-soft);
  border: 1px solid var(--accent);
}

.dashboard-page .payment-details {
  color: var(--color-f1f4f8);
  background: var(--color-151c27);
  border-color: var(--color-3a4658);
}

.dashboard-page .payment-details summary,
.dashboard-page .payment-details[open] summary {
  color: var(--color-f5f7fa);
  background: var(--color-1b2634);
}

.dashboard-page .payment-details summary span {
  color: var(--color-ffd09a);
}

.dashboard-page .payment-details .msg,
.dashboard-page .payment-details .msg p,
.dashboard-page .payment-details .booknote {
  color: var(--color-d0d8e3);
}

.listing-form .mode-card:has(input:checked) strong,
.listing-form .mode-card:has(input:checked) small {
  color: var(--color-f5f7fa);
}

.availability-options label:has(input:checked) {
  color: var(--accent-ink);
  background: var(--color-ffd09a);
  border-color: var(--color-ffd09a);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--color-ffd09a);
  outline-offset: 3px;
}

/* Signup and login labels need strong contrast against the dark auth card. */
.auth-layout #authForm label {
  color: var(--color-f1f4f8);
  font-size: 13px;
  font-weight: 650;
}
.auth-layout #authForm .input {
  color: var(--color-f1f4f8);
  background: var(--color-101620);
  border-color: var(--color-526176);
  caret-color: var(--color-ffd09a);
}
.auth-layout #authForm .input::placeholder {
  color: var(--color-aeb8c7);
  opacity: 1;
}
.auth-layout #authForm .input:focus {
  border-color: var(--color-ffd09a);
  box-shadow: 0 0 0 3px var(--color-ffd09a2e);
}
.auth-layout #authForm .booknote {
  color: var(--color-d4dce7);
}

/* Shared parking dropdown palette; native selects retain form and keyboard behaviour. */
select {
  accent-color: var(--orange);
  color: var(--ink);
  background-color: var(--paper);
  border-color: var(--border);
  font-family: inherit;
}
select option {
  color: var(--ink);
  background: var(--paper);
}
select option:checked {
  font-weight: 700;
  background: var(--color-f7dfc8);
  color: var(--color-853719);
}
@supports (appearance: base-select) {
  select,
  select::picker(select) {
    appearance: base-select;
  }
  select {
    align-items: center;
    gap: 12px;
    cursor: pointer;
    text-align: left;
  }
  select::picker-icon {
    color: var(--orange);
    transition: rotate 0.15s;
  }
  select:open::picker-icon {
    rotate: 180deg;
  }
  select::picker(select) {
    background: var(--paper);
    color: var(--ink);
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 10px 30px var(--color-2b201b24);
    padding: 6px;
    margin-block: 6px;
    max-height: 300px;
    overflow: auto;
    font: inherit;
  }
  select option {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 11px 13px;
    border-radius: 7px;
    font: inherit;
    cursor: pointer;
    white-space: normal;
  }
  select option:hover,
  select option:focus {
    background: var(--pale);
    color: var(--ink);
    outline: none;
  }
  select option:checked {
    background: var(--color-f7dfc8);
    color: var(--color-853719);
    font-weight: 600;
  }
  select option::checkmark {
    color: var(--orange);
    margin-inline-end: 2px;
  }
  select option:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }
}

input[type='date'],
input[type='time'],
input[type='datetime-local'] {
  accent-color: var(--orange);
  color: var(--ink);
  background: var(--paper);
}
.parking-date-field input::-webkit-calendar-picker-indicator {
  display: none;
}
.parking-date-open {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: var(--orange);
  font-size: 21px;
  border-radius: 6px;
  cursor: pointer;
}
.parking-date-open:hover {
  background: var(--color-f7dfc8);
}
.parking-date-picker {
  box-sizing: border-box;
  width: min(350px, calc(100vw - 28px));
  max-height: 90vh;
  overflow: auto;
  background: var(--paper);
  color: var(--ink);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 18px 60px var(--color-2b201b33);
  font: 14px var(--font-sans);
}
.parking-date-picker::backdrop {
  background: var(--color-2b201b55);
}
.date-picker-top,
.date-picker-month {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.picker-title {
  font-size: 14px;
  line-height: 1.5;
}
.picker-close,
.date-picker-month button {
  border: 1px solid var(--border);
  background: transparent;
  color: var(--orange);
  border-radius: 8px;
  width: 34px;
  height: 34px;
  flex-shrink: 0;
  font-size: 22px;
  cursor: pointer;
}
.date-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
}
.date-picker-grid span {
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  padding: 5px 0;
}
.date-picker-grid button {
  height: 36px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}
.date-picker-grid button:hover {
  background: var(--pale);
}
.date-picker-grid button[aria-pressed='true'] {
  background: var(--orange);
  color: white;
}
.date-picker-grid button:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}
.date-picker-time {
  display: flex;
  gap: 12px;
  margin-top: 16px;
}
.date-picker-time label {
  flex: 1;
  font-size: 12px;
  color: var(--muted);
}
.date-picker-time select {
  display: flex;
  width: 100%;
  padding: 10px;
  margin-top: 6px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 15px;
}
.date-picker-note {
  font-size: 11px;
  line-height: 1.6;
  color: var(--muted);
}
.date-picker-error {
  font-size: 12px;
  color: var(--color-a32f19);
  line-height: 1.5;
}
.date-picker-error:empty {
  display: none;
}
.date-picker-apply {
  width: 100%;
  border: 0;
  border-radius: 9px;
  padding: 13px;
  margin-top: 16px;
  background: var(--orange);
  color: white;
  font: 600 13px var(--font-sans);
  cursor: pointer;
}
.parking-date-field:has(input[type='time']) input {
  padding-right: 26px !important;
  font-size: 12px;
}
.parking-date-field:has(input[type='time']) .parking-date-open {
  width: 22px;
  right: 3px;
  font-size: 18px;
  padding: 0;
}

.parking-date-field {
  display: block;
  min-width: 0;
  width: 100%;
  position: relative;
}
.parking-date-field input {
  width: 100%;
  padding-right: 38px !important;
  color: transparent;
  -webkit-text-fill-color: transparent !important;
  caret-color: transparent;
}
.parking-date-value {
  position: absolute;
  left: 11px;
  right: 42px;
  top: 50%;
  transform: translateY(-50%);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  color: var(--ink);
  font: inherit;
  font-size: inherit;
}
.parking-date-field:has(input[type='time']) .parking-date-value {
  right: 28px;
}
.button.secondary {
  background: var(--surface-3);
  color: var(--text);
  border: 1px solid var(--border-strong);
  box-shadow: none;
}
.button.secondary:hover {
  background: var(--surface-hover);
  border-color: var(--accent-hover);
}
.button.ghost {
  background: transparent;
  color: var(--text);
  border: 1px solid transparent;
  box-shadow: none;
}
.button.ghost:hover {
  background: var(--surface-2);
  border-color: var(--border);
}
.button.danger {
  background: var(--danger-surface);
  color: var(--text);
  border: 1px solid var(--danger);
}
.button.danger:hover {
  background: var(--danger);
  color: var(--accent-ink);
}
.button.sm {
  min-height: 44px;
  padding: 9px 14px;
  font-size: var(--fs-sm);
}
.button.md {
  min-height: 48px;
  padding: 12px 20px;
  font-size: var(--fs-md);
}
.button.lg {
  min-height: 52px;
  padding: 14px 24px;
  font-size: var(--fs-lg);
}
.button:disabled,
.button[aria-disabled='true'] {
  opacity: 0.56;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}
.button[aria-busy='true'] {
  cursor: progress;
  pointer-events: none;
}
.button:focus-visible,
.input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--accent-hover);
  outline-offset: 3px;
}
.input,
select,
textarea {
  min-height: 44px;
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
}
textarea.input,
textarea {
  height: auto;
}
.input::placeholder {
  color: var(--muted);
  opacity: 1;
}
button,
input,
select,
textarea {
  font-family: var(--font-sans);
}
.rate,
.price,
.stats strong,
.booking-dates strong,
.costrow,
.price-filter,
output {
  font-variant-numeric: tabular-nums;
}
.date-picker-grid button,
.picker-close,
.date-picker-month button,
.parking-date-open,
.duration-arrow {
  min-width: 44px;
  min-height: 44px;
}
.date-picker-picker {
  font-family: var(--font-sans);
}
@media (max-width: 620px) {
  body {
    overflow-x: clip;
  }
}
@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;
  }
}