/*
 * TemizKat semantic colour contract — canonical source.
 * Values are extracted from the existing public landing palette.
 * Keep this file colour-only: no layout, spacing or typography declarations.
 * Generated mirrors:
 *   landing/src/css/temizkat-semantik.css
 *   src/app/assets/css/temizkat-theme.css
 */
:root {
  color-scheme: light;

  --tk-light-bg: #F6F4EF;
  --tk-light-surface: #FFFFFF;
  --tk-light-surface-elevated: #EDE9E2;
  --tk-light-text: #12141D;
  --tk-light-muted: #4A4E5C;
  --tk-light-secondary: #0B1B33;
  --tk-light-border: #E2DCD1;
  --tk-light-focus: #0A6E63;
  --tk-light-disabled: #B9AFA0;

  --tk-dark-bg: #0B1B33;
  --tk-dark-surface: #12284A;
  --tk-dark-surface-elevated: #1B3156;
  --tk-dark-text: #F2EFE8;
  --tk-dark-muted: #A9B4C9;
  --tk-dark-secondary: #22375C;
  --tk-dark-border: #22375C;
  --tk-dark-focus: #8FD6CC;
  --tk-dark-disabled: #4A4E5C;

  --tk-primary: #0A6E63;
  --tk-primary-rgb: 10 110 99;
  --tk-primary-hover: #085A51;
  --tk-primary-active: #085A51;
  --tk-accent-light: #0E9384;
  --tk-accent-dark: #8FD6CC;
  --tk-success: #12B76A;
  --tk-warning: #FFB454;
  --tk-danger: #D92D20;
  --tk-on-primary: #FFFFFF;
  --tk-on-primary-rgb: 255 255 255;
  --tk-form-surface: var(--tk-light-surface);
  --tk-form-text: var(--tk-light-text);
  --tk-form-placeholder: var(--tk-light-muted);

  --tk-bg: var(--tk-light-bg);
  --tk-surface: var(--tk-light-surface);
  --tk-surface-elevated: var(--tk-light-surface-elevated);
  --tk-text: var(--tk-light-text);
  --tk-muted: var(--tk-light-muted);
  --tk-secondary: var(--tk-light-secondary);
  --tk-accent: var(--tk-accent-light);
  --tk-border: var(--tk-light-border);
  --tk-focus: var(--tk-light-focus);
  --tk-disabled: var(--tk-light-disabled);
  --tk-bg-rgb: 246 244 239;
  --tk-surface-rgb: 255 255 255;
  --tk-surface-elevated-rgb: 237 233 226;
  --tk-text-rgb: 18 20 29;
  --tk-muted-rgb: 74 78 92;
  --tk-secondary-rgb: 11 27 51;
  --tk-accent-rgb: 14 147 132;
  --tk-border-rgb: 226 220 209;
  --tk-focus-rgb: 10 110 99;
  --tk-disabled-rgb: 185 175 160;
  --tk-success-rgb: 18 183 106;
  --tk-warning-rgb: 255 180 84;
  --tk-danger-rgb: 217 45 32;
}

html[data-tk-surface="light"] {
  color-scheme: light;
}

html.dark[data-tk-surface="panel"] {
  color-scheme: dark;
  --tk-bg: var(--tk-dark-bg);
  --tk-surface: var(--tk-dark-surface);
  --tk-surface-elevated: var(--tk-dark-surface-elevated);
  --tk-text: var(--tk-dark-text);
  --tk-muted: var(--tk-dark-muted);
  --tk-secondary: var(--tk-dark-secondary);
  --tk-accent: var(--tk-accent-dark);
  --tk-border: var(--tk-dark-border);
  --tk-focus: var(--tk-dark-focus);
  --tk-disabled: var(--tk-dark-disabled);
  --tk-bg-rgb: 11 27 51;
  --tk-surface-rgb: 18 40 74;
  --tk-surface-elevated-rgb: 27 49 86;
  --tk-text-rgb: 242 239 232;
  --tk-muted-rgb: 169 180 201;
  --tk-secondary-rgb: 34 55 92;
  --tk-accent-rgb: 143 214 204;
  --tk-border-rgb: 34 55 92;
  --tk-focus-rgb: 143 214 204;
  --tk-disabled-rgb: 74 78 92;
  --tk-form-surface: #374151;
  --tk-form-text: #FFFFFF;
  --tk-form-placeholder: #D1D5DB;
}

html[data-tk-surface="light"] body,
html[data-tk-surface="light"] main,
html.dark[data-tk-surface="panel"] body,
html.dark[data-tk-surface="panel"] main {
  background-color: var(--tk-bg);
  color: var(--tk-text);
}

html[data-tk-surface="light"] :where(.bg-dark) {
  background-color: var(--tk-bg);
}

html[data-tk-surface="light"] :where(.bg-surface) {
  background-color: var(--tk-surface);
}

html[data-tk-surface="light"] :where(.border-slate-600, .border-slate-700) {
  border-color: var(--tk-border);
}

html[data-tk-surface="light"] :where(.text-slate-200, .text-slate-300, .text-slate-400, .text-slate-500) {
  color: var(--tk-muted);
}

html[data-tk-surface="light"] :where(.placeholder-slate-400)::placeholder {
  color: var(--tk-muted);
}

html[data-tk-surface="light"] :where(input, select, textarea).text-white {
  color: var(--tk-text);
}

html[data-tk-surface="light"] :where(.password-toggle):hover {
  color: var(--tk-primary);
}

html.dark[data-tk-surface="panel"] :where(.bg-white, .bg-gray-50, .bg-gray-100, [class~="dark:bg-gray-900"]) {
  background-color: var(--tk-bg);
}

html.dark[data-tk-surface="panel"] :where(.bg-gray-200, .bg-gray-700, .bg-gray-800, [class~="dark:bg-gray-800"]) {
  background-color: var(--tk-surface);
}

html.dark[data-tk-surface="panel"] :where(.text-gray-900, .text-gray-800, .text-gray-700, [class~="dark:text-white"]) {
  color: var(--tk-text);
}

html.dark[data-tk-surface="panel"] :where(.text-gray-600, .text-gray-500, .text-gray-400, .text-gray-300, [class~="dark:text-gray-300"], [class~="dark:text-gray-400"]) {
  color: var(--tk-muted);
}

html.dark[data-tk-surface="panel"] :where(.border-gray-200, .border-gray-300, .border-gray-600, .border-gray-700, [class~="dark:border-gray-700"]) {
  border-color: var(--tk-border);
}

html[data-tk-surface="panel"] main :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]), select, textarea) {
  background-color: var(--tk-form-surface);
  color: var(--tk-form-text);
}

html[data-tk-surface="panel"] main :where(input, textarea)::placeholder {
  color: var(--tk-form-placeholder);
  opacity: 1;
}

html.dark[data-tk-surface="panel"] main :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]), select, textarea) {
  background-color: var(--tk-form-surface) !important;
  color: var(--tk-form-text) !important;
}

@media (max-width: 639px) {
  html.dark[data-tk-surface="panel"] :where(body.bg-gray-50, main.bg-gray-50) {
    background-color: #111827 !important;
  }
}

html[data-tk-surface] :where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--tk-focus);
  outline-offset: 3px;
}

html[data-tk-surface] :where(button, input, select, textarea):disabled {
  border-color: var(--tk-disabled);
}