/* JAVIN GLOBAL THEME V1
 * Source of truth: html[data-theme] / body.theme-*
 * Loaded after page CSS so legacy forced backgrounds cannot override theme.
 */

html[data-theme="dark"] {
  color-scheme: dark;
  --javin-bg: #0b0b0b;
  --javin-surface: #151515;
  --javin-surface-2: #1d1d1d;
  --javin-text: #f5f5f5;
  --javin-muted: #b8b8b8;
  --javin-border: #333;
  --javin-input: #171717;
}

html[data-theme="light"] {
  color-scheme: light;
  --javin-bg: #f7f7f7;
  --javin-surface: #ffffff;
  --javin-surface-2: #f1f1f1;
  --javin-text: #111111;
  --javin-muted: #666666;
  --javin-border: #d6d6d6;
  --javin-input: #ffffff;
}

/* Global page surface */
html[data-theme="dark"],
html[data-theme="dark"] body,
body.theme-dark {
  background-color: var(--javin-bg) !important;
  color: var(--javin-text) !important;
}

html[data-theme="light"],
html[data-theme="light"] body,
body.theme-light {
  background-color: var(--javin-bg) !important;
  color: var(--javin-text) !important;
}

/* Native document surfaces */
html[data-theme="dark"] body *,
body.theme-dark * {
  scrollbar-color: #555 #111;
}

html[data-theme="light"] body *,
body.theme-light * {
  scrollbar-color: #aaa #eee;
}

/* Generic text/surface elements.
 * Do not force border/background on cards so existing neobrutal visuals stay intact.
 */
html[data-theme="dark"] body :is(p, span, label, small, li, dt, dd),
body.theme-dark :is(p, span, label, small, li, dt, dd) {
  border-color: inherit;
}

html[data-theme="dark"] body :is(input, textarea, select),
body.theme-dark :is(input, textarea, select) {
  color: #f5f5f5 !important;
  background-color: var(--javin-input) !important;
  border-color: var(--javin-border) !important;
  color-scheme: dark;
}

html[data-theme="light"] body :is(input, textarea, select),
body.theme-light :is(input, textarea, select) {
  color: #111 !important;
  background-color: var(--javin-input) !important;
  color-scheme: light;
}

/* Placeholder */
html[data-theme="dark"] body ::placeholder,
body.theme-dark ::placeholder {
  color: #8e8e8e !important;
}

html[data-theme="light"] body ::placeholder,
body.theme-light ::placeholder {
  color: #777 !important;
}

/* Native-like focus */
html[data-theme="dark"] body :is(input, textarea, select):focus-visible,
body.theme-dark :is(input, textarea, select):focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

html[data-theme="light"] body :is(input, textarea, select):focus-visible,
body.theme-light :is(input, textarea, select):focus-visible {
  outline: 2px solid #111;
  outline-offset: 2px;
}

/* Common modal/dialog surfaces */
html[data-theme="dark"] body :is(
  dialog,
  .modal,
  .modal-content,
  .dialog,
  .dialog-content,
  .popup,
  .popup-content,
  .sheet,
  .bottom-sheet
),
body.theme-dark :is(
  dialog,
  .modal,
  .modal-content,
  .dialog,
  .dialog-content,
  .popup,
  .popup-content,
  .sheet,
  .bottom-sheet
) {
  background-color: var(--javin-surface) !important;
  color: var(--javin-text);
}

/* Preserve clickable header controls */
html[data-theme="dark"] #profileCard,
html[data-theme="dark"] #notifBell,
body.theme-dark #profileCard,
body.theme-dark #notifBell {
  pointer-events: auto;
}

html[data-theme="light"] #profileCard,
html[data-theme="light"] #notifBell,
body.theme-light #profileCard,
body.theme-light #notifBell {
  pointer-events: auto;
}

/* Selection */
html[data-theme="dark"] body ::selection,
body.theme-dark ::selection {
  background: #fff;
  color: #000;
}

html[data-theme="light"] body ::selection,
body.theme-light ::selection {
  background: #111;
  color: #fff;
}

/* Avoid forced white document canvas from legacy pages */
html[data-theme="dark"] {
  background-color: var(--javin-bg) !important;
}

html[data-theme="light"] {
  background-color: var(--javin-bg) !important;
}

/* JAVIN-DARK-NEOBRUTAL-V1 */
html[data-theme="dark"],
body.theme-dark {
  --javin-bg: #08080c !important;
  --javin-surface: #181820 !important;
  --javin-surface-2: #111118 !important;
  --javin-text: #ffffff !important;
  --javin-muted: #c4b5fd !important;
  --javin-input: #111118 !important;
  --javin-border: #ffffff !important;
  --javin-accent: #a855f7 !important;
  --javin-accent-2: #c084fc !important;
}

html[data-theme="dark"] body,
body.theme-dark {
  background: #08080c !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .fx-card,
body.theme-dark .fx-card,
html[data-theme="dark"] .card,
body.theme-dark .card,
html[data-theme="dark"] .settings-item,
body.theme-dark .settings-item {
  background: #181820 !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
body.theme-dark input,
body.theme-dark textarea,
body.theme-dark select {
  background: #111118 !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
}

html[data-theme="dark"] button,
body.theme-dark button {
  color: #ffffff;
}

html[data-theme="dark"] .fx-cat.active,
body.theme-dark .fx-cat.active,
html[data-theme="dark"] .active,
body.theme-dark .active {
  background: #a855f7 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] a,
body.theme-dark a {
  color: #c084fc;
}

html[data-theme="dark"] .pf-tier-inline.basic,
body.theme-dark .pf-tier-inline.basic,
html[data-theme="dark"] .tier-pill.basic,
body.theme-dark .tier-pill.basic {
  background: #a855f7 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .pf-edit-input:focus,
body.theme-dark .pf-edit-input:focus,
html[data-theme="dark"] input:focus,
body.theme-dark input:focus,
html[data-theme="dark"] textarea:focus,
body.theme-dark textarea:focus {
  background: #241333 !important;
  border-color: #c084fc !important;
}

html[data-theme="dark"] .fx-header,
body.theme-dark .fx-header {
  background: rgba(8,8,12,.92) !important;
  border-color: rgba(255,255,255,.18) !important;
}

html[data-theme="dark"] .fx-card,
body.theme-dark .fx-card {
  box-shadow: 5px 5px 0 #a855f7 !important;
}

/* JAVIN-DARK-NEOBRUTAL-V1-END */
