:root:root {
  --text-primary: 43 40 36 !important;
  --text-secondary: 91 82 74 !important;
  --text-secondary-alt: 110 97 87 !important;
  --text-tertiary: 124 109 97 !important;
  --accent-primary: 47 130 91 !important;
  --accent-primary-hover: 31 99 69 !important;
  --surface-active: 222 239 227 !important;
  --surface-active-alt: 235 218 174 !important;
  --surface-hover: 230 242 232 !important;
  --surface-hover-alt: 234 216 178 !important;
  --surface-composer-hover: 241 226 196 !important;
  --surface-primary: 247 251 247 !important;
  --surface-primary-alt: 237 245 239 !important;
  --surface-primary-contrast: 246 235 207 !important;
  --surface-secondary: 237 245 239 !important;
  --surface-secondary-alt: 241 228 197 !important;
  --surface-tertiary: 246 236 211 !important;
  --surface-tertiary-alt: 255 252 242 !important;
  --surface-dialog: 255 252 242 !important;
  --surface-submit: 47 130 91 !important;
  --surface-submit-hover: 31 99 69 !important;
  --surface-chat: 247 251 247 !important;
  --border-light: 230 216 187 !important;
  --border-medium-alt: 211 190 157 !important;
  --border-medium: 218 200 168 !important;
  --border-heavy: 177 151 130 !important;
  --border-xheavy: 130 105 92 !important;
}

html body {
  background-color: rgb(var(--surface-primary));
  background-image:
    radial-gradient(circle at 14% 12%, rgb(123 207 154 / 0.2), transparent 28rem),
    radial-gradient(circle at 88% 16%, rgb(188 235 197 / 0.24), transparent 26rem),
    radial-gradient(circle at 78% 90%, rgb(47 130 91 / 0.1), transparent 32rem);
}

html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) body,
html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) #root > div {
  background-color: #fbf4df !important;
  background-image:
    radial-gradient(circle at 16% 18%, rgb(123 207 154 / 0.42), transparent 30rem),
    radial-gradient(circle at 84% 25%, rgb(188 235 197 / 0.52), transparent 27rem),
    radial-gradient(circle at 72% 88%, rgb(47 130 91 / 0.25), transparent 31rem),
    repeating-linear-gradient(12deg, rgb(38 50 36 / 0.018) 0 1px, transparent 1px 5px) !important;
}

html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) main > div {
  border: 1px solid rgb(255 255 255 / 0.72);
  border-radius: 1.75rem;
  background: rgb(255 252 242 / 0.84) !important;
  box-shadow: 0 24px 70px rgb(70 49 82 / 0.16);
  backdrop-filter: blur(18px);
}

html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) img[src$="logo.svg"] {
  content: url("/assets/kia-logo-v3.svg");
  position: relative;
  z-index: 2;
  transform: translateY(5.75rem) scale(1.85);
  transform-origin: center;
}

html:not(:has(input[autocomplete="current-password"])) textarea,
html:not(:has(input[autocomplete="current-password"])) form [contenteditable="true"] {
  caret-color: rgb(var(--accent-primary));
}

/* A uniform chat surface avoids rectangular bands around rounded controls. */
html:not(:has(input[autocomplete="current-password"])) main {
  background-color: rgb(var(--surface-primary));
  background-image: none;
}

.kia-floating-brand {
  position: fixed;
  z-index: 30;
  top: 0.35rem;
  left: 50%;
  width: 7.5rem;
  height: 2.75rem;
  transform: translateX(-50%);
  pointer-events: none;
}

.kia-floating-brand img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

html.dark.dark {
  --text-primary: 246 238 219 !important;
  --text-secondary: 205 192 175 !important;
  --text-secondary-alt: 187 170 158 !important;
  --text-tertiary: 169 151 145 !important;
  --accent-primary: 126 211 154 !important;
  --accent-primary-hover: 161 229 181 !important;
  --surface-active: 69 56 75 !important;
  --surface-active-alt: 81 64 87 !important;
  --surface-hover: 73 59 79 !important;
  --surface-hover-alt: 89 70 91 !important;
  --surface-composer-hover: 77 62 80 !important;
  --surface-primary: 32 27 39 !important;
  --surface-primary-alt: 40 33 47 !important;
  --surface-primary-contrast: 48 39 55 !important;
  --surface-secondary: 42 35 49 !important;
  --surface-secondary-alt: 58 46 63 !important;
  --surface-tertiary: 52 42 59 !important;
  --surface-tertiary-alt: 45 36 51 !important;
  --surface-dialog: 38 31 45 !important;
  --surface-submit: 88 176 121 !important;
  --surface-submit-hover: 112 201 143 !important;
  --surface-chat: 45 36 51 !important;
  --border-light: 79 65 84 !important;
  --border-medium-alt: 98 78 99 !important;
  --border-medium: 92 73 94 !important;
  --border-heavy: 125 99 116 !important;
  --border-xheavy: 163 132 145 !important;
}

html.dark:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) body,
html.dark:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) #root > div {
  background-color: #201b27 !important;
  background-image:
    radial-gradient(circle at 18% 18%, rgb(47 130 91 / 0.44), transparent 30rem),
    radial-gradient(circle at 82% 28%, rgb(75 153 105 / 0.3), transparent 28rem),
    radial-gradient(circle at 72% 88%, rgb(26 83 59 / 0.46), transparent 32rem) !important;
}

html.dark:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) main > div {
  border-color: rgb(255 255 255 / 0.1);
  background: rgb(38 31 45 / 0.82) !important;
}

@media (max-width: 640px) {
  html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) img[src$="logo.svg"] {
    transform: translateY(4.5rem) scale(1.55);
  }

  .kia-floating-brand {
    top: 0.45rem;
    width: 5.25rem;
    height: 2.25rem;
  }

  html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) main {
    padding: 1rem;
  }

  html:has(input[autocomplete="current-password"]):not(:has(#confirm_password)) main > div {
    border-radius: 1.4rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html *,
  html *::before,
  html *::after {
    scroll-behavior: auto !important;
  }
}

/* Static branding only: no observer, history hook or injected chat logo. */
html [role="menu"], html [role="dialog"], html [data-radix-popper-content-wrapper] > * {
  background-color: rgb(var(--surface-primary)) !important;
}
#kia-floating-brand { display: none !important; }
/* Softer K-IA control edges; keep keyboard focus visible. */
html:root:not(.dark) {
  --border-light: 207 220 212 !important;
  --border-medium: 183 202 191 !important;
  --border-medium-alt: 183 202 191 !important;
  --border-heavy: 148 175 158 !important;
  --border-xheavy: 109 143 122 !important;
}
html:not(.dark) form div:has(> textarea),
html:not(.dark) form div.rounded-t-3xl:has(textarea) {
  border-color: #cfdcd4 !important;
  box-shadow: 0 2px 8px rgb(35 75 50 / 0.09) !important;
}
/* The outer composer band must not paint square corners around the rounded field. */
html [class*="view-transition-name:chat-form"] {
  background-color: transparent !important;
  background-image: none !important;
}