/* Glitchlit Systems Theme for Vikunja */

:root {
  --primary: #c45d2c !important;
  --primary-hover: #d4703c !important;
  --primary-dark: #a34a22 !important;
}

body {
  font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.navbar, .app-sidebar, [class*="sidebar"] {
  background: #101216 !important;
  border-color: #1C2027 !important;
}

.logo {
  filter: brightness(0.9) sepia(0.3) hue-rotate(-10deg) saturate(1.5) !important;
}

/* Dark room background */
body, .app-content, [class*="content"], main {
  background: #0B0D10 !important;
}

/* Cards and surfaces */
/* Cards - but not project grid cards which have their own colors */
.card:not([style*="background"]),
[class*="card"]:not([style*="background"]):not([class*="project"]),
.task,
.modal-content {
  background: #171A20 !important;
  border-color: #262A32 !important;
  color: #ECEDEF !important;
}

/* Project cards: keep their inline color, just fix text and border */
[style*="background"][class*="card"],
[class*="project"][class*="card"],
[class*="project-grid"] a {
  color: #ECEDEF !important;
}

/* Text */
body, p, span, div, li, td, th, label, input, textarea, select {
  color: #ECEDEF !important;
}

h1, h2, h3, h4, h5, h6, [class*="title"] {
  color: #ECEDEF !important;
}

/* Muted text */
[class*="muted"], [class*="secondary"], [class*="help"], small, .info {
  color: #9AA1AC !important;
}

/* Primary buttons */
.button.is-primary, [class*="btn-primary"], button[class*="primary"] {
  background: #c45d2c !important;
  border-color: #c45d2c !important;
  color: #101216 !important;
}

.button.is-primary:hover, [class*="btn-primary"]:hover {
  background: #d4703c !important;
  border-color: #d4703c !important;
}

/* Links */
a {
  color: #c45d2c !important;
}

a:hover {
  color: #d4703c !important;
}

/* Inputs */
input, textarea, select, [class*="input"] {
  background: #1E222A !important;
  border-color: #262A32 !important;
  color: #ECEDEF !important;
}

input:focus, textarea:focus, select:focus {
  border-color: #c45d2c !important;
  box-shadow: 0 0 0 1px rgba(196, 93, 44, 0.3) !important;
}

/* Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #101216;
}
::-webkit-scrollbar-thumb {
  background: #262A32;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #3C424B;
}

/* Selection */
::selection {
  background: rgba(196, 93, 44, 0.38) !important;
  color: #ECEDEF !important;
}

/* Borders - preserve inline project colors */
hr, [class*="divider"] {
  border-color: #1C2027 !important;
}

/* Navigation items */
.navbar-item, [class*="nav-item"], [class*="menu-item"] {
  color: #9AA1AC !important;
}

.navbar-item:hover, [class*="nav-item"]:hover, [class*="menu-item"]:hover,
.navbar-item.is-active, [class*="nav-item"].active, [class*="menu-item"].active {
  color: #ECEDEF !important;
  background: rgba(196, 93, 44, 0.08) !important;
}

/* Tags and labels */
[class*="tag"], [class*="label"], [class*="badge"] {
  background: rgba(196, 93, 44, 0.1) !important;
  color: #c45d2c !important;
  border: 1px solid rgba(196, 93, 44, 0.32) !important;
}

/* Checkboxes and toggles */
input[type="checkbox"]:checked {
  background-color: #c45d2c !important;
  border-color: #c45d2c !important;
}

/* Dropdown menus */
[class*="dropdown"], [class*="popup"], [class*="menu-content"] {
  background: #171A20 !important;
  border-color: #262A32 !important;
}

/* Task priority colors - keep functional */
[class*="priority-1"], [class*="low"] { border-left-color: #8BB0A6 !important; }
[class*="priority-2"], [class*="medium"] { border-left-color: #c45d2c !important; }
[class*="priority-3"], [class*="high"] { border-left-color: #C45D2C !important; }
[class*="priority-4"], [class*="urgent"] { border-left-color: #e04444 !important; }

/* Login page */
[class*="login"], [class*="auth"] {
  background: #0B0D10 !important;
}

/* Fix: active view tab - white text on gold background for contrast */
[class*="view"] [class*="active"],
[class*="tab"] [class*="active"],
[class*="view-switcher"] [class*="active"],
.is-active[class*="view"],
[class*="list-view"].is-active,
[class*="view"] a.is-active,
[class*="view"] .active {
  color: #101216 !important;
  background: #c45d2c !important;
}

/* Non-active view tabs stay readable */
[class*="view"] a,
[class*="view-switcher"] a,
[class*="tab"] a {
  color: #9AA1AC !important;
}

[class*="view"] a:hover,
[class*="view-switcher"] a:hover,
[class*="tab"] a:hover {
  color: #ECEDEF !important;
}

/* Fix: Let project cards show their assigned colors */
.project-card, [class*="project-card"], .project-grid-item, [class*="project-grid"] .card {
  background: var(--project-color, #171A20) !important;
}

/* Override the generic card background rule for project cards specifically */
[class*="projects-list"] .card,
[class*="project"] [class*="card"],
.projects .card,
a[class*="project"] {
  background: unset !important;
}




/* Fix markdown rendering in task detail description */
.task-detail .description,
[class*="description"] .raw-content,
.detail-content .description,
.task-show .description {
  white-space: pre-line !important;
}