/* Solopreneur — Shadcn Minimalist Dark Theme Companion Styles */

.skip-link {
  position: fixed;
  z-index: 100;
  top: 0.75rem;
  left: 0.75rem;
  transform: translateY(-200%);
  border-radius: 0.375rem;
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 600;
}
.skip-link:focus {
  transform: translateY(0);
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}
.auth-required .skip-link {
  display: none;
}

:root {
  --background: 240 10% 3.9%;
  --foreground: 0 0% 98%;
  --card: 240 10% 3.9%;
  --card-foreground: 0 0% 98%;
  --popover: 240 10% 3.9%;
  --popover-foreground: 0 0% 98%;
  --primary: 0 0% 98%;
  --primary-foreground: 240 5.9% 10%;
  --secondary: 240 3.7% 15.9%;
  --secondary-foreground: 0 0% 98%;
  --muted: 240 3.7% 15.9%;
  --muted-foreground: 240 5% 64.9%;
  --accent: 240 3.7% 15.9%;
  --accent-foreground: 0 0% 98%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 3.7% 15.9%;
  --input: 240 3.7% 15.9%;
  --ring: 240 4.9% 83.9%;
  --radius: 0.5rem;
}

html.light {
  color-scheme: light;
  --background: 0 0% 100%;
  --foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 3.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 240 10% 3.9%;
  --primary: 240 5.9% 10%;
  --primary-foreground: 0 0% 98%;
  --secondary: 240 4.8% 95.9%;
  --secondary-foreground: 240 5.9% 10%;
  --muted: 240 4.8% 95.9%;
  --muted-foreground: 240 3.8% 46.1%;
  --accent: 240 4.8% 95.9%;
  --accent-foreground: 240 5.9% 10%;
  --border: 240 5.9% 90%;
  --input: 240 5.9% 90%;
  --ring: 240 5% 64.9%;
}

html.light body { background-color: #fafafa; color: #18181b; color-scheme: light; }
html.light [class~="bg-zinc-950"] { background-color: #fff; }
html.light [class~="bg-zinc-900"] { background-color: #f4f4f5; }
html.light [class~="bg-zinc-850"] { background-color: #f4f4f5; }
html.light [class~="bg-zinc-800"] { background-color: #e4e4e7; }
html.light [class~="bg-zinc-700"] { background-color: #d4d4d8; }
html.light [class~="bg-zinc-600"] { background-color: #a1a1aa; }
html.light [class~="bg-zinc-500"] { background-color: #71717a; }
html.light [class~="bg-zinc-100"] { background-color: #fff; }
html.light [class~="bg-zinc-200"] { background-color: #f4f4f5; }
html.light [class~="text-zinc-50"], html.light [class~="text-zinc-100"], html.light [class~="text-zinc-200"] { color: #18181b; }
html.light [class~="text-zinc-300"] { color: #27272a; }
html.light [class~="text-zinc-400"] { color: #52525b; }
html.light [class~="text-zinc-500"] { color: #71717a; }
html.light [class~="text-zinc-600"] { color: #71717a; }
html.light [class~="text-zinc-700"] { color: #52525b; }
html.light [class~="text-zinc-800"], html.light [class~="text-zinc-900"], html.light [class~="text-zinc-950"] { color: #27272a; }
html.light [class~="border-zinc-800"], html.light [class~="border-zinc-800/80"], html.light [class~="border-zinc-800/70"] { border-color: #e4e4e7; }
html.light [class~="border-zinc-700"], html.light [class~="border-zinc-700/40"] { border-color: #d4d4d8; }
html.light [class~="border-zinc-600"], html.light [class~="border-zinc-500"] { border-color: #a1a1aa; }
html.light [class~="border-zinc-900"] { border-color: #e4e4e7; }
html.light [class~="bg-zinc-900/90"], html.light [class~="bg-zinc-900/80"], html.light [class~="bg-zinc-900/70"], html.light [class~="bg-zinc-900/50"], html.light [class~="bg-zinc-900/40"], html.light [class~="bg-zinc-900/30"], html.light [class~="bg-zinc-900/20"] { background-color: rgb(244 244 245 / 85%); }
html.light [class~="bg-zinc-800/80"], html.light [class~="bg-zinc-800/60"] { background-color: rgb(228 228 231 / 80%); }
html.light [class~="bg-zinc-950/90"], html.light [class~="bg-zinc-950/80"], html.light [class~="bg-zinc-950/60"], html.light [class~="bg-zinc-950/40"], html.light [class~="bg-zinc-950/20"] { background-color: rgb(255 255 255 / 94%); }
html.light [class~="bg-black/80"] { background-color: rgb(24 24 27 / 45%); }
html.light [class~="placeholder-zinc-500"]::placeholder, html.light [class~="placeholder-zinc-600"]::placeholder { color: #71717a; }
html.light [class~="selection:bg-zinc-800"]::selection { background-color: #d4d4d8; }
html.light [class~="selection:text-zinc-100"]::selection { color: #18181b; }
html.light [class~="hover:bg-zinc-900"]:hover, html.light [class~="hover:bg-zinc-800"]:hover, html.light [class~="hover:bg-zinc-800/60"]:hover { background-color: #e4e4e7; }
html.light [class~="hover:bg-zinc-700"]:hover { background-color: #d4d4d8; }
html.light [class~="hover:text-zinc-100"]:hover, html.light [class~="hover:text-zinc-200"]:hover { color: #09090b; }
html.light [class~="hover:border-zinc-700"]:hover, html.light [class~="hover:border-zinc-700/80"]:hover { border-color: #a1a1aa; }
html.light [class*="text-rose-"] { color: #be123c; }
html.light [class*="text-amber-"] { color: #a16207; }
html.light [class*="text-emerald-"] { color: #047857; }
html.light [class*="text-indigo-"] { color: #4338ca; }
html.light [class*="text-sky-"] { color: #0369a1; }
html.light [class*="text-purple-"] { color: #7e22ce; }
html.light [class*="bg-rose-950"], html.light [class*="bg-rose-900"] { background-color: rgb(255 228 230 / 78%); }
html.light [class*="bg-amber-950"] { background-color: rgb(254 243 199 / 78%); }
html.light [class*="bg-emerald-950"] { background-color: rgb(209 250 229 / 78%); }
html.light [class*="bg-indigo-950"], html.light [class*="bg-indigo-900"] { background-color: rgb(224 231 255 / 82%); }
html.light [class*="bg-sky-950"] { background-color: rgb(224 242 254 / 82%); }
html.light [class*="bg-purple-950"] { background-color: rgb(243 232 255 / 82%); }
html.light [class*="border-rose-"] { border-color: #fecdd3; }
html.light [class*="border-amber-"] { border-color: #fde68a; }
html.light [class*="border-emerald-"] { border-color: #a7f3d0; }
html.light [class*="border-indigo-"] { border-color: #c7d2fe; }
html.light [class*="border-sky-"] { border-color: #bae6fd; }
html.light [class*="border-purple-"] { border-color: #e9d5ff; }
html.light .task-card { background-color: #fff; border-color: #e4e4e7; }
html.light .task-card:hover { background-color: #fafafa; border-color: #c4c4ca; box-shadow: 0 0 0 1px rgb(24 24 27 / 3%), 0 0 14px rgb(24 24 27 / 5%); }
html.light .drag-over { border-color: #a1a1aa !important; background-color: rgb(24 24 27 / 4%) !important; }
html.light .chat-body pre { background: #f4f4f5; border-color: #e4e4e7; color: #27272a; }
html.light .chat-body code { background: rgb(24 24 27 / 5%); border-color: #e4e4e7; color: #3f3f46; }
html.light .chat-body h3, html.light .chat-body h4, html.light .chat-body strong, html.light .chat-body th { color: #18181b; }
html.light .chat-body li { color: #3f3f46; }
html.light .chat-body th, html.light .chat-body td { border-color: #e4e4e7; }
html.light .chat-body th { background: rgb(24 24 27 / 4%); }
html.light body.auth-required { background: #fafafa; }

/* Live agent run: visible state, elapsed time, and truthful group progress. */
.agent-live-card {
  border-color: rgb(99 102 241 / 24%);
  background: linear-gradient(145deg, rgb(24 24 27 / 92%), rgb(17 17 20 / 88%));
  box-shadow: 0 10px 28px rgb(0 0 0 / 14%);
}
.agent-live-card__mark {
  display: grid;
  width: 1.5rem;
  height: 1.5rem;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgb(129 140 248 / 24%);
  border-radius: 0.45rem;
  background: rgb(99 102 241 / 10%);
  color: #a5b4fc;
}
.agent-live-card__mark svg { width: 0.9rem; height: 0.9rem; }
.agent-live-dot.is-active { animation: agent-live-pulse 1.6s ease-in-out infinite; }
.agent-live-card__meta #live-agent-step-label { max-width: 72ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agent-live-card #live-agent-output {
  max-height: min(48vh, 28rem);
  overflow: auto;
  overscroll-behavior: contain;
  overflow-wrap: anywhere;
  padding: 0.15rem 0.1rem;
  scrollbar-color: rgb(161 161 170 / 30%) transparent;
}
.agent-step-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  padding: 0;
  list-style: none;
}
.agent-step-list.hidden { display: none; }
.agent-step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 0.15rem 0.45rem;
  min-width: 0;
  padding: 0.5rem 0.6rem;
  border: 1px solid rgb(63 63 70 / 68%);
  border-radius: 0.55rem;
  color: #a1a1aa;
  font-size: 0.68rem;
}
.agent-step__marker {
  display: grid;
  width: 1.1rem;
  height: 1.1rem;
  place-items: center;
  border: 1px solid rgb(82 82 91 / 75%);
  border-radius: 999px;
  color: #a1a1aa;
  font: 600 0.62rem/1 ui-monospace, monospace;
}
.agent-step__state {
  grid-column: 2;
  color: #71717a;
  font-size: 0.6rem;
}
.agent-step.is-current { border-color: rgb(129 140 248 / 42%); color: #e4e4e7; }
.agent-step.is-current .agent-step__marker { border-color: #818cf8; color: #c7d2fe; }
.agent-step.is-current .agent-step__state { color: #a5b4fc; }
.agent-step.is-complete .agent-step__marker { border-color: rgb(52 211 153 / 45%); color: #6ee7b7; }
.agent-step.is-complete .agent-step__state { color: #6ee7b7; }
@keyframes agent-live-pulse { 50% { opacity: 0.45; box-shadow: 0 0 0 3px rgb(129 140 248 / 12%); } }

html.light .agent-live-card {
  border-color: #c7d2fe;
  background: linear-gradient(145deg, #fff, #fafaff);
  box-shadow: 0 10px 28px rgb(24 24 27 / 6%);
}
html.light .agent-live-card__mark { border-color: #c7d2fe; background: #eef2ff; color: #4f46e5; }
html.light .agent-step { border-color: #e4e4e7; color: #52525b; }
html.light .agent-step__marker { border-color: #d4d4d8; color: #52525b; }
html.light .agent-step__state { color: #71717a; }
html.light .agent-step.is-current { border-color: #a5b4fc; color: #27272a; }
html.light .agent-step.is-current .agent-step__marker { border-color: #818cf8; color: #4338ca; }
html.light .agent-step.is-current .agent-step__state { color: #4338ca; }
html.light .agent-step.is-complete .agent-step__marker,
html.light .agent-step.is-complete .agent-step__state { color: #047857; }

@media (max-width: 560px) {
  .agent-step-list { grid-template-columns: 1fr; gap: 0.35rem; }
  .agent-step { grid-template-columns: auto minmax(0, 1fr) auto; }
  .agent-step__state { grid-column: 3; grid-row: 1; }
}

#task-drawer select {
  color-scheme: dark;
  color: hsl(var(--foreground));
  background-color: hsl(var(--popover));
  border-color: hsl(var(--border));
}
#task-drawer select option {
  color: hsl(var(--popover-foreground));
  background-color: hsl(var(--popover));
}
html.light #task-drawer select { color-scheme: light; }

.theme-select {
  color-scheme: dark;
  color: hsl(var(--foreground));
  background-color: hsl(var(--popover));
  border-color: hsl(var(--border));
}
.theme-select option {
  color: hsl(var(--popover-foreground));
  background-color: hsl(var(--popover));
}
html.light .theme-select { color-scheme: light; }

.obsidian-import-heading { margin-bottom: 1.25rem; border-bottom: 1px solid #27272a; padding-bottom: 1rem; }
.obsidian-import-items { max-height: 10rem; overflow-y: auto; }
.obsidian-import-item { margin-top: 0.25rem; }
.obsidian-import-item:first-child { margin-top: 0; }
html.light .obsidian-import-heading { border-color: #e4e4e7; }

body.auth-required {
  display: block;
  height: auto;
  min-height: 100dvh;
  overflow: auto;
  background: #09090b;
}

body.auth-required > :not(#auth-view) {
  display: none !important;
}

#auth-view {
  min-height: 100dvh;
}

.auth-panel {
  width: min(100%, 24rem);
  margin-inline: auto;
}

.auth-panel h1 {
  max-width: 22ch;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -0.025em;
}

/* Hairline Sleek Scrollbars (Shadcn aesthetic) */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.24);
}

/* Linear-Grade Kanban Columns (Consistent 320px Width) */
.kanban-col {
  width: 320px !important;
  min-width: 320px !important;
  max-width: 320px !important;
  flex: 0 0 320px !important;
}

@media (max-width: 640px) {
  header {
    height: auto !important;
    min-height: 3rem;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-block: 0.5rem;
  }

  header > div {
    width: 100%;
    justify-content: space-between;
  }

  header > div:last-child {
    min-width: 0;
    flex-wrap: wrap;
  }

  header > div:last-child > nav[aria-label="Ana gezinme"] {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: thin;
  }

  header > div:last-child > nav[aria-label="Ana gezinme"] .nav-tab {
    flex-shrink: 0;
  }

  header > div:last-child > #workspace-select {
    max-width: 8rem;
  }

  .kanban-col {
    width: min(320px, calc(100vw - 2.5rem)) !important;
    min-width: min(320px, calc(100vw - 2.5rem)) !important;
    max-width: min(320px, calc(100vw - 2.5rem)) !important;
    max-height: calc(100dvh - 8rem);
  }
}

:where(button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid #a1a1aa;
  outline-offset: 2px;
}

html.light :where(button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline-color: #52525b;
}

:where(button, input, select, textarea):disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Linear / Shadcn Task Card Aesthetics */
.task-card {
  background-color: rgba(24, 24, 27, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0.5rem;
  transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.task-card:hover {
  background-color: rgba(39, 39, 42, 0.85);
  border-color: rgba(255, 255, 255, 0.18);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.025), 0 0 14px rgba(255, 255, 255, 0.035);
}

/* Drawer Transitions */
.drawer.open {
  transform: translateX(0) !important;
}

/* Drag and Drop Subtle Highlights */
.drag-over {
  border-color: rgba(255, 255, 255, 0.3) !important;
  background-color: rgba(255, 255, 255, 0.03) !important;
}

.dragging {
  opacity: 0.35;
  transform: scale(0.98);
}

/* Chat Markdown Formatting */
.chat-body pre {
  background: #09090b;
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0.75rem;
  border-radius: 0.5rem;
  overflow-x: auto;
  margin: 0.5rem 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.75rem;
  line-height: 1.5;
  color: #f4f4f5;
}

.chat-body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0.12rem 0.3rem;
  border-radius: 0.25rem;
  font-size: 0.8em;
  color: #e4e4e7;
}

.chat-body h3 {
  color: #f4f4f5;
  font-weight: 600;
  font-size: 0.875rem;
  margin: 0.75rem 0 0.25rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 0.2rem;
}

.chat-body h4 {
  color: #e4e4e7;
  font-weight: 600;
  font-size: 0.8rem;
  margin: 0.6rem 0 0.2rem 0;
}

.chat-body strong {
  color: #ffffff;
  font-weight: 600;
}

.chat-body li {
  margin-left: 1.25rem;
  list-style-type: disc;
  margin-top: 0.2rem;
  color: #d4d4d8;
}

.chat-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0;
  font-size: 0.75rem;
}

.chat-body th, .chat-body td {
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 0.35rem 0.5rem;
  text-align: left;
}

.chat-body th {
  background: rgba(255, 255, 255, 0.04);
  font-weight: 600;
  color: #f4f4f5;
}

.settings-section {
  margin-bottom: 1.75rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid hsl(var(--border));
}
.settings-section-content {
  padding: 0;
}
.settings-tabs {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 1.5rem;
  overflow-x: auto;
  border-bottom: 1px solid hsl(var(--border));
  scrollbar-width: thin;
}
.settings-tab-button {
  flex: 0 0 auto;
  border-bottom: 2px solid transparent;
  padding: 0.65rem 0.85rem;
  color: hsl(var(--muted-foreground));
  font-size: 0.8rem;
  font-weight: 500;
  white-space: nowrap;
  transition: color 120ms ease, border-color 120ms ease;
}
.settings-tab-button:hover { color: hsl(var(--foreground)); }
.settings-tab-button[aria-selected="true"] {
  border-bottom-color: hsl(var(--foreground));
  color: hsl(var(--foreground));
}
.settings-tab-button:focus-visible {
  outline: 2px solid hsl(var(--foreground));
  outline-offset: -2px;
}