:root, :root.light, :root.dark {
  --ikigai-canvas: oklch(0.9613 0.007 88.64);
  --ikigai-ink: oklch(0.2316 0.0184 158.26);
  --ikigai-forest: oklch(0.3766 0.0528 145.34);
  --ikigai-brass: oklch(0.478 0.0697 104.36);
  --cal-bg-subtle: var(--ikigai-canvas);
  --cal-bg-muted: oklch(0.977 0.006 88.64);
  --cal-bg-emphasis: oklch(0.88 0.01 88.64);
  --cal-bg-primary: var(--ikigai-forest);
  --cal-bg-primary-emphasis: oklch(0.31 0.045 145.34);
  --cal-bg-primary-muted: oklch(0.94 0.018 145.34);
  --cal-bg-brand: var(--ikigai-forest);
  --cal-bg-brand-emphasis: oklch(0.31 0.045 145.34);
  --cal-bg-brand-muted: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-success-subtle: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-success-emphasis: var(--ikigai-forest);
  --cal-bg-semantic-info-subtle: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-info-emphasis: var(--ikigai-forest);
  --cal-text-emphasis: var(--ikigai-ink);
  --cal-text: var(--ikigai-ink);
  --cal-text-brand: white;
  --cal-brand-text: white;
  --cal-brand: var(--ikigai-forest);
  --cal-brand-emphasis: oklch(0.31 0.045 145.34);
  --cal-brand-muted: oklch(0.94 0.018 145.34);
  --cal-brand-subtle: var(--ikigai-brass);
  --cal-brand-accent: white;
  color-scheme: light !important;
}

html, html.light, html.dark {
  background: var(--ikigai-canvas) !important;
  color-scheme: light !important;
}
html body, html.light body, html.dark body {
  background-color: var(--ikigai-canvas) !important;
  color: var(--ikigai-ink);
  color-scheme: light !important;
  --cal-brand: var(--ikigai-forest) !important;
  --cal-bg-brand: var(--ikigai-forest) !important;
  --cal-brand-text: white !important;
  --default-ring-color: rgb(47 73 48 / 0.42);
  --cal-bg-semantic-attention-subtle: oklch(0.95 0.025 95);
  --cal-bg-semantic-attention-emphasis: var(--ikigai-brass);
  --cal-text-semantic-attention: var(--ikigai-ink);
}
body:has(aside) main.bg-default { background-color: var(--ikigai-canvas) !important; }
body:has(aside) main.bg-default .bg-default.sticky { background-color: var(--ikigai-canvas) !important; }
body .text-muted { color: oklch(0.45 0.018 158.26) !important; }
input[type="checkbox"], input[type="radio"] { accent-color: #2F4930 !important; }
h1, h2, .ikigai-booking h1, .ikigai-booking h2, .ikigai-booking h3 {
  font-family: var(--font-cal), Georgia, serif;
}
.ikigai-booking {
  --ikigai-canvas: oklch(0.9613 0.007 88.64);
  --ikigai-ink: oklch(0.2316 0.0184 158.26);
  --ikigai-forest: oklch(0.3766 0.0528 145.34);
  --ikigai-brass: oklch(0.478 0.0697 104.36);
  --cal-bg-subtle: var(--ikigai-canvas);
  --cal-bg-muted: oklch(0.977 0.006 88.64);
  --cal-bg-emphasis: oklch(0.88 0.01 88.64);
  --cal-bg-primary: var(--ikigai-forest);
  --cal-bg-primary-emphasis: oklch(0.31 0.045 145.34);
  --cal-bg-primary-muted: oklch(0.94 0.018 145.34);
  --cal-bg-brand: var(--ikigai-forest);
  --cal-bg-brand-emphasis: oklch(0.31 0.045 145.34);
  --cal-bg-brand-muted: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-success-subtle: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-success-emphasis: var(--ikigai-forest);
  --cal-bg-semantic-info-subtle: oklch(0.94 0.018 145.34);
  --cal-bg-semantic-info-emphasis: var(--ikigai-forest);
  --cal-text-emphasis: var(--ikigai-ink);
  --cal-text: var(--ikigai-ink);
  --cal-text-brand: white;
  --cal-brand-text: white;
  --cal-brand: var(--ikigai-forest) !important;
  --cal-bg-brand: var(--ikigai-forest) !important;
  --cal-brand-emphasis: oklch(0.31 0.045 145.34);
  --cal-brand-muted: oklch(0.94 0.018 145.34);
  --cal-brand-subtle: var(--ikigai-brass);
  --cal-brand-accent: white;
  background: var(--ikigai-canvas);
  color: var(--ikigai-ink);
  color-scheme: light;
  min-height: 100vh;
}
.ikigai-brand-header { max-width: 1200px; margin: 0 auto; padding: 22px 24px 16px; }
.ikigai-brand-header a { display: inline-flex; align-items: center; }
.ikigai-brand-header img { display: block; width: 174px; height: auto; }
.ikigai-brand-rule { height: 1px; max-width: 1200px; margin: 0 auto; background: color-mix(in oklab, var(--ikigai-brass) 34%, transparent); }
.ikigai-auth { background: var(--ikigai-canvas) !important; }
.ikigai-auth button[type="submit"], body:has(input[placeholder="john.doe@example.com"]) button[type="submit"] {
  background: var(--ikigai-forest) !important;
  border-color: var(--ikigai-forest) !important;
  color: #fff !important;
}
body:has(input[placeholder="john.doe@example.com"]) img[alt="Ikigai Real Estate"] {
  width: 180px !important;
  height: auto !important;
}
.ikigai-auth-grid { display: none !important; }
.ikigai-auth .fixed.inset-x-0.bottom-0 .rounded-lg {
  background: #fff !important;
  border: 1px solid color-mix(in oklab, var(--ikigai-brass) 34%, white);
  color: var(--ikigai-ink) !important;
}
.ikigai-auth .fixed.inset-x-0.bottom-0 .rounded-lg p,
.ikigai-auth .fixed.inset-x-0.bottom-0 .rounded-lg button { color: var(--ikigai-ink) !important; }
.ikigai-auth [data-testid="login-subtitle"] { color: var(--ikigai-ink); font-family: var(--font-cal), Georgia, serif; font-size: 1.45rem; font-weight: 500; line-height: 1.25; }
[class*="bg-orange-400"] { border: 1px solid color-mix(in oklab, var(--ikigai-brass) 48%, white); background: oklch(0.95 0.025 95) !important; color: var(--ikigai-ink) !important; }
[class*="bg-orange-400"] a { color: var(--ikigai-forest) !important; }
.ikigai-booking h1, .ikigai-booking h2, .ikigai-booking h3 { font-family: var(--font-cal), Georgia, serif; color: var(--ikigai-ink); }
.ikigai-booking .text-blue-500, .ikigai-booking .fill-blue-500 { color: var(--ikigai-forest) !important; fill: var(--ikigai-forest) !important; }
.ikigai-booking [class*="bg-blue-100"] { background: oklch(0.94 0.018 145.34) !important; }
.ikigai-booking [class*="text-blue-"] { color: var(--ikigai-forest) !important; }
.ikigai-booking [class~="bg-cal-info"] { background: oklch(0.94 0.018 145.34) !important; color: var(--ikigai-forest) !important; }
.ikigai-booking [class~="bg-cal-success"] { background: var(--ikigai-forest) !important; }
.ikigai-booking [class*="bg-green-100"] { background: var(--ikigai-forest) !important; }
.ikigai-booking [class*="text-green-"] { color: #fff !important; }
.ikigai-booking svg:has(use[href="#clock"]) { color: var(--ikigai-ink) !important; stroke: currentColor !important; }
.ikigai-booking svg:has(use[href="#clock"]) use { stroke: currentColor !important; }
.ikigai-booking [data-testid="time"] {
  background: #fff !important;
  border: 1px solid var(--ikigai-forest) !important;
  color: var(--ikigai-forest) !important;
}
.ikigai-booking [data-testid="time"]:hover,
.ikigai-booking [data-testid="time"]:focus-visible { background: oklch(0.94 0.018 145.34) !important; }
.ikigai-booking [data-testid="time"][data-selected="true"] {
  background: var(--ikigai-forest) !important;
  border-color: var(--ikigai-forest) !important;
  color: #fff !important;
}
body div.fixed.inset-x-0.bottom-0:has([class*="5B93F9"]) { display: none !important; }
body:has(a[href="/vikas-arora/private-tour"]) main img[alt="Ikigai Real Estate"] { display: none !important; }
.ikigai-booking p.line-clamp-1[data-state="closed"] {
  display: block;
  flex: 1;
  min-width: 0;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  -webkit-line-clamp: unset;
}
.ikigai-booking p.line-clamp-1 {
  min-width: 0;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  -webkit-line-clamp: unset;
}

@media (max-width: 639px) {
  .ikigai-booking [data-testid="success-page"] [class*="grid-cols-3"] {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.9rem;
  }
  div:has(> input[data-testid="profile-form-email-0"]) {
    height: auto !important;
    min-height: 2rem;
    flex-wrap: wrap;
    padding-bottom: 0.35rem;
  }
  input[data-testid="profile-form-email-0"] {
    flex: 1 1 100% !important;
    width: 100%;
    min-width: 0;
  }
  div.overflow-x-auto:has([data-testid="upcoming"]) { overflow: visible !important; }
  [data-orientation="horizontal"][role="group"]:has([data-testid="upcoming"]) {
    width: max-content;
    max-width: 100%;
    flex-wrap: wrap;
  }
  [data-orientation="horizontal"][role="group"]:has([data-testid="upcoming"]) > button { flex: 0 0 auto; }
}
.ikigai-booking [aria-pressed="true"],
.ikigai-booking [aria-selected="true"],
.ikigai-booking [aria-checked="true"],
.ikigai-booking [data-state="on"] {
  background-color: var(--ikigai-forest) !important;
  border-color: var(--ikigai-forest) !important;
  color: #fff !important;
}
[role="listbox"], [role="option"], [cmdk-root], [cmdk-list], [cmdk-item] {
  background-color: #fff !important;
  color: var(--ikigai-ink) !important;
  color-scheme: light !important;
}
[role="option"][aria-selected="true"], [cmdk-item][aria-selected="true"] {
  background-color: var(--ikigai-forest) !important;
  color: #fff !important;
}
@media (max-width: 640px) {
  .ikigai-brand-header { padding: 16px 20px 12px; }
  .ikigai-brand-header img { width: 148px; }
}

/* Team preview review: keep the member identity readable before its controls. */
@media (max-width: 639px) {
  body:has(a[href="/settings/teams"]) main li:has([data-testid="select-control"]) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
  }
  body:has(a[href="/settings/teams"]) main li:has([data-testid="select-control"]) > div:last-child {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  body:has(a[href="/settings/teams"]) main li:has([data-testid="select-control"]) > div:first-child > div:last-child p.truncate {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    overflow-wrap: anywhere;
  }
  body:has(a[href="/settings/teams"]) main li:has([data-testid="select-control"]) > div:first-child > div:last-child span.ms-2 {
    display: block;
    margin-inline-start: 0;
  }

  /* Keep booking filters readable and put mobile navigation after the rows. */
  body:has([data-testid="upcoming"]):has([data-testid="cancelled"]) div.overflow-x-auto:has([data-testid="cancelled"]) {
    overflow: visible !important;
  }
  body:has([data-testid="upcoming"]):has([data-testid="cancelled"]) [role="group"]:has([data-testid="cancelled"]) {
    display: flex;
    width: 100%;
    max-width: 100%;
    flex-wrap: wrap;
    gap: 0.25rem;
  }
  body:has([data-testid="upcoming"]):has([data-testid="cancelled"]) [role="group"]:has([data-testid="cancelled"]) > button {
    flex: 0 0 auto;
  }
  body:has([data-testid="upcoming"]) nav.fixed.bottom-0 {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    margin-top: 1rem !important;
    padding-bottom: max(0.5rem, env(safe-area-inset-bottom)) !important;
    background-color: var(--cal-bg-muted) !important;
  }

  body:has(a[href^="/team/"]) .ikigai-booking [data-testid="success-page"] [class*="grid-cols-3"] {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.35rem;
  }
  body:has(a[href^="/team/"]) .ikigai-booking [data-testid="success-page"] [class*="grid-cols-3"] > .font-medium {
    margin-top: 0.5rem;
  }
}
