/* Canonical day-part theme tokens — shared across all 2x4m subdomains.
 * Bump UI_PUBLIC_STYLES_VERSION when this file changes.
 */

:root,
[data-theme='day'] {
  --cream: #faf8f5;
  --ink: #1a1410;
  --border: #e7e5e4;
  --border-strong: #1a1410;
  --border-shadow: #1a1410;
  --sticker-muted: #4a433d;
  --sticker-subtle: #5c534c;
  --surface: #ffffff;
  --surface-muted: #faf8f5;
  --dot-opacity: 0.06;
  --nav-bg: rgba(250, 248, 245, 0.94);
  --footer-bg: #ffffff;
  --status-available: #dcfce7;
  --status-busy: #fef3c7;
  --status-offline: #fee2e2;
  --search-ring: rgba(124, 58, 237, 0.3);
  color-scheme: light;
}

/* Soft warm morning */
[data-theme='dawn'] {
  --cream: #fdf6ee;
  --ink: #2c241c;
  --border: #eadfce;
  --border-strong: #2c241c;
  --border-shadow: #2c241c;
  --sticker-muted: #5c4f42;
  --sticker-subtle: #6d5f52;
  --surface: #fffcf8;
  --surface-muted: #faf3ea;
  --dot-opacity: 0.05;
  --nav-bg: rgba(253, 246, 238, 0.94);
  --footer-bg: #fffcf8;
  --status-available: #ecfdf5;
  --status-busy: #fef9c3;
  --status-offline: #ffe4e6;
  --search-ring: rgba(251, 146, 60, 0.35);
  color-scheme: light;
}

/* True evening — warm dark (not the old light-tan dusk) */
[data-theme='dusk'] {
  --cream: #1a1511;
  --ink: #f3e8d8;
  --border: #3d342c;
  --border-strong: #6b5c4d;
  --border-shadow: #0c0a08;
  --sticker-muted: #cbb9a4;
  --sticker-subtle: #a8947e;
  --surface: #241e18;
  --surface-muted: #1c1713;
  --dot-opacity: 0.1;
  --nav-bg: rgba(26, 21, 17, 0.94);
  --footer-bg: #1c1713;
  --status-available: #14532d;
  --status-busy: #713f12;
  --status-offline: #7f1d1d;
  --search-ring: rgba(251, 146, 60, 0.35);
  color-scheme: dark;
}

/* Deep night — high-contrast dark */
[data-theme='night'] {
  --cream: #0c0b0a;
  --ink: #f5f0ea;
  --border: #2e2a26;
  --border-strong: #5c534c;
  --border-shadow: #050504;
  --sticker-muted: #d4c8b8;
  --sticker-subtle: #b8a99a;
  --surface: #161412;
  --surface-muted: #100e0c;
  --dot-opacity: 0.12;
  --nav-bg: rgba(12, 11, 10, 0.96);
  --footer-bg: #100e0c;
  --status-available: #14532d;
  --status-busy: #713f12;
  --status-offline: #7f1d1d;
  --search-ring: rgba(245, 158, 11, 0.35);
  color-scheme: dark;
}

/* -------------------------------------------------------------------------- */
/* Apply tokens to the document shell (overrides hardcoded bg-white)          */
/* -------------------------------------------------------------------------- */

html {
  background-color: var(--cream);
  color: var(--ink);
}

body {
  background-color: var(--cream) !important;
  color: var(--ink) !important;
  min-height: 100vh;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

/* Platform chrome content wrappers */
.platform-chrome-content,
[data-platform-chrome-content],
.min-h-screen.bg-white,
.min-h-full.bg-white,
body.bg-white,
body.min-h-full {
  background-color: var(--cream) !important;
  color: var(--ink);
}

/* Nav bar */
.navigation-menu-root {
  background-color: var(--nav-bg) !important;
  border-bottom-color: var(--border) !important;
  color: var(--ink);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease;
}

.nav-brand-label {
  color: var(--sticker-muted) !important;
}

/* Footer */
.platform-footer,
footer.platform-footer {
  background-color: var(--footer-bg) !important;
  border-top-color: var(--border) !important;
  color: var(--ink);
}

.platform-footer a {
  color: var(--sticker-muted);
}

.platform-footer a:hover {
  color: var(--ink);
}

/* -------------------------------------------------------------------------- */
/* Logo: black Base_solid mark — invert on dark themes so it stays visible    */
/* -------------------------------------------------------------------------- */

.nav-logo-img,
.nav-logo img,
.platform-signin-logo__img,
.platform-signin-logo img {
  transition: filter 0.15s ease;
}

/* Light themes: black mark on cream/white */
[data-theme='day'] .nav-logo-img,
[data-theme='day'] .nav-logo img,
[data-theme='dawn'] .nav-logo-img,
[data-theme='dawn'] .nav-logo img {
  filter: none;
}

/* Dark themes: force white mark */
[data-theme='night'] .nav-logo-img,
[data-theme='night'] .nav-logo img,
[data-theme='dusk'] .nav-logo-img,
[data-theme='dusk'] .nav-logo img,
[data-theme='night'] .platform-signin-logo__img,
[data-theme='night'] .platform-signin-logo img,
[data-theme='dusk'] .platform-signin-logo__img,
[data-theme='dusk'] .platform-signin-logo img {
  filter: brightness(0) invert(1);
}

/* -------------------------------------------------------------------------- */
/* Surface cards / common Tailwind whites used across landings                */
/* -------------------------------------------------------------------------- */

[data-theme='night'] .bg-white,
[data-theme='dusk'] .bg-white,
[data-theme='night'] .bg-gray-50,
[data-theme='dusk'] .bg-gray-50,
[data-theme='night'] .bg-stone-50,
[data-theme='dusk'] .bg-stone-50 {
  background-color: var(--surface) !important;
}

[data-theme='night'] .text-gray-900,
[data-theme='dusk'] .text-gray-900,
[data-theme='night'] .text-ink-900,
[data-theme='dusk'] .text-ink-900,
[data-theme='night'] .text-ink-800,
[data-theme='dusk'] .text-ink-800,
[data-theme='night'] .text-zinc-900,
[data-theme='dusk'] .text-zinc-900 {
  color: var(--ink) !important;
}

/* Body / secondary copy — was stuck on light-theme stone (unreadable on night) */
[data-theme='night'] .text-gray-600,
[data-theme='dusk'] .text-gray-600,
[data-theme='night'] .text-gray-700,
[data-theme='dusk'] .text-gray-700,
[data-theme='night'] .text-gray-500,
[data-theme='dusk'] .text-gray-500,
[data-theme='night'] .text-ink-700,
[data-theme='dusk'] .text-ink-700,
[data-theme='night'] .text-ink-600,
[data-theme='dusk'] .text-ink-600,
[data-theme='night'] .text-ink-500,
[data-theme='dusk'] .text-ink-500,
[data-theme='night'] .text-muted,
[data-theme='dusk'] .text-muted {
  color: var(--sticker-muted) !important;
}

[data-theme='night'] .text-gray-400,
[data-theme='dusk'] .text-gray-400,
[data-theme='night'] .text-ink-400,
[data-theme='dusk'] .text-ink-400,
[data-theme='night'] .text-ink-300,
[data-theme='dusk'] .text-ink-300 {
  color: var(--sticker-subtle) !important;
}

/* Amber labels on dark surfaces (location lines, pills) */
[data-theme='night'] .text-amber-900,
[data-theme='dusk'] .text-amber-900,
[data-theme='night'] .text-amber-800,
[data-theme='dusk'] .text-amber-800 {
  color: #fbbf24 !important;
}

[data-theme='night'] .bg-amber-50,
[data-theme='dusk'] .bg-amber-50 {
  background-color: color-mix(in srgb, #f59e0b 18%, var(--surface)) !important;
}

[data-theme='night'] .bg-gray-100,
[data-theme='dusk'] .bg-gray-100,
[data-theme='night'] .bg-ink-50,
[data-theme='dusk'] .bg-ink-50 {
  background-color: var(--surface-muted) !important;
}

[data-theme='night'] .border-gray-200,
[data-theme='dusk'] .border-gray-200,
[data-theme='night'] .border-gray-100,
[data-theme='dusk'] .border-gray-100,
[data-theme='night'] .border-stone-200,
[data-theme='dusk'] .border-stone-200,
[data-theme='night'] .border-ink-100,
[data-theme='dusk'] .border-ink-100,
[data-theme='night'] .border-ink-50,
[data-theme='dusk'] .border-ink-50 {
  border-color: var(--border) !important;
}

/* Soft panels / marketing cards */
[data-theme='night'] .surface-card,
[data-theme='dusk'] .surface-card {
  background: var(--surface);
  border-color: var(--border);
  color: var(--ink);
}

/* -------------------------------------------------------------------------- */
/* Day-part control chrome                                                    */
/* -------------------------------------------------------------------------- */

.day-night-badge {
  background: var(--surface);
  color: var(--ink);
  border: 1px solid var(--border-strong, var(--border));
  box-shadow: none;
  line-height: 1;
  height: var(--platform-nav-control-height, 2rem);
  max-height: var(--platform-nav-control-height, 2rem);
  transition:
    transform 0.15s ease,
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}

.day-night-badge svg {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
}

@media (max-width: 960px) {
  .day-night-badge span {
    display: none;
  }
}

.day-night-menu button svg,
.day-night-menu-option-icon {
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.day-night-badge:hover {
  background: var(--ink);
  color: var(--cream);
  border-color: var(--ink);
}

/*
 * Day-part menu — high-contrast panel in every mode.
 * Avoid relying on Tailwind arbitrary var() colors (easy to lose to dark overrides).
 */
.day-night-menu {
  border: 1px solid var(--border-strong, var(--border));
  box-shadow: 0 16px 40px -12px color-mix(in srgb, #000 45%, transparent);
  background: var(--surface);
  color: var(--ink);
  min-width: 14rem;
}

/* Elevated panel on dark themes so options never sit pure black-on-black */
[data-theme='night'] .day-night-menu,
[data-theme='dusk'] .day-night-menu {
  background: #2c2620;
  border-color: #6b5f52;
  color: #f5f0ea;
  box-shadow: 0 18px 44px -10px rgba(0, 0, 0, 0.65);
}

.day-night-menu-item + .day-night-menu-item {
  margin-top: 0.125rem;
}

.day-night-menu-option,
.day-night-menu button {
  min-height: 2.35rem;
  padding-block: 0.55rem;
  color: var(--ink) !important;
  background: transparent;
  transition:
    background-color 0.12s ease,
    color 0.12s ease;
}

[data-theme='night'] .day-night-menu-option,
[data-theme='dusk'] .day-night-menu-option,
[data-theme='night'] .day-night-menu button,
[data-theme='dusk'] .day-night-menu button {
  color: #f5f0ea !important;
}

.day-night-menu-option-label {
  color: inherit !important;
}

.day-night-menu-option-greeting {
  color: var(--sticker-muted, #78716c) !important;
  opacity: 1 !important;
}

[data-theme='night'] .day-night-menu-option-greeting,
[data-theme='dusk'] .day-night-menu-option-greeting {
  color: #c9b8a4 !important;
}

.day-night-menu-option:hover,
.day-night-menu button:hover {
  background: var(--surface-muted) !important;
}

[data-theme='night'] .day-night-menu-option:hover,
[data-theme='dusk'] .day-night-menu-option:hover {
  background: #3a322b !important;
}

/* Selected: invert for clear active state */
.day-night-menu-option[data-selected='true'],
.day-night-menu-option[aria-selected='true'],
.day-night-menu button[aria-selected='true'] {
  background: var(--ink) !important;
  color: var(--cream) !important;
}

[data-theme='night'] .day-night-menu-option[data-selected='true'],
[data-theme='dusk'] .day-night-menu-option[data-selected='true'],
[data-theme='night'] .day-night-menu button[aria-selected='true'],
[data-theme='dusk'] .day-night-menu button[aria-selected='true'] {
  background: #f5f0ea !important;
  color: #1a1410 !important;
}

.day-night-menu-option[data-selected='true'] .day-night-menu-option-greeting,
.day-night-menu-option[aria-selected='true'] .day-night-menu-option-greeting {
  color: inherit !important;
  opacity: 0.72 !important;
}

[data-theme='night']
  .day-night-menu-option[data-selected='true']
  .day-night-menu-option-greeting,
[data-theme='dusk']
  .day-night-menu-option[data-selected='true']
  .day-night-menu-option-greeting {
  color: #5c534c !important;
  opacity: 1 !important;
}
