/* SHELA WARM THEME — 19.8.2026, Grega: "poglej kaki UI ma Claude, svetoven —
   daj Sheli tudi tak". Topla nevtralna paleta (Claude dark), serif v odgovorih,
   umirjen sidebar/composer. Naložena ZADNJA — povozi pro-theme. Reverzibilno:
   odstrani <link> iz index.html. */

/* ── paleta ─────────────────────────────────────────── */
:root {
  --sh-bg: #262624;          /* glavno ozadje (toplo, Claude) */
  --sh-side: #1f1e1b;        /* sidebar */
  --sh-raise: #2b2a26;       /* kartice, hover */
  --sh-raise2: #32312c;      /* user bubble, aktivno */
  --sh-line: rgba(255,255,255,.07);
  --sh-text: #eceae2;        /* topla kremna */
  --sh-mut: #b3afa4;
  --sh-acc: #6c5ce7;         /* Shela vijolična — samo za poudarke */
}

/* ── SRCE TEME: predefinicija tailwind/shadcn tokenov (oklch, topel hue 85)
   — cela aplikacija (sidebar, kartice, borderji, popoverji) se obarva
   harmonično, brez krpanja posameznih elementov. ── */
html.dark, html .dark, .dark {
  --background: oklch(21.5% .006 85) !important;
  --foreground: oklch(92.5% .008 85) !important;
  --card: oklch(24% .007 85) !important;
  --card-foreground: oklch(92.5% .008 85) !important;
  --popover: oklch(24% .007 85) !important;
  --popover-foreground: oklch(92.5% .008 85) !important;
  --secondary: oklch(27% .007 85) !important;
  --secondary-foreground: oklch(82% .008 85) !important;
  --muted: oklch(28% .007 85) !important;
  --muted-foreground: oklch(66% .012 85) !important;
  --accent: oklch(30% .008 85) !important;
  --accent-foreground: oklch(92.5% .008 85) !important;
  --border: oklch(31% .008 85) !important;
  --input: oklch(31% .008 85) !important;
  --sidebar: oklch(18.5% .006 85) !important;
  --sidebar-foreground: oklch(92.5% .008 85) !important;
  --sidebar-accent: oklch(24% .007 85) !important;
  --sidebar-accent-foreground: oklch(92.5% .008 85) !important;
  --sidebar-border: oklch(27% .008 85) !important;
  --terminal-bg: oklch(17% .006 85) !important;
}

html, body, #root { background: var(--sh-bg) !important; }
#root { color: var(--sh-text); }

/* živo ozadje (plošče) — umiri: toplo, prosojno */
#shela-alive-bg, canvas#shela-alive-bg, .shela-alive-bg {
  opacity: .35 !important; filter: saturate(.45) sepia(.22) brightness(.8);
}

/* ── sidebar ────────────────────────────────────────── */
#root .bg-sidebar { background: var(--sh-side) !important; border-right: 1px solid var(--sh-line); }
#root .bg-sidebar button, #root .bg-sidebar a { border-radius: 10px; }
#root .bg-sidebar [class*="hover"]:hover { background: var(--sh-raise) !important; }
#root .bg-sidebar input { background: #262521 !important; border: 1px solid var(--sh-line) !important;
  border-radius: 10px !important; color: var(--sh-text) !important; }
#root .bg-sidebar input::placeholder { color: #8a867c; }
/* aktivni pogovor: mirno, brez črtice (Claude slog) */
.shela-conv-active, #root [class*="sidebar"] a[class*="bg-"] { border-left: none !important;
  background: var(--sh-raise2) !important; }

/* ── glava ──────────────────────────────────────────── */
.shela-header-v2, #root header { background: rgba(38,38,36,.86) !important;
  border-bottom: 1px solid var(--sh-line) !important; backdrop-filter: blur(14px); }

/* ── sporočila: serif kot Claude ────────────────────── */
.prose, .prose p, .prose li, .prose blockquote {
  font-family: Georgia, 'Iowan Old Style', 'Times New Roman', serif !important;
  font-size: 15.5px !important; line-height: 1.68 !important; color: var(--sh-text) !important;
  letter-spacing: .002em;
}
.prose h1, .prose h2, .prose h3, .prose h4 { font-family: Georgia, serif !important;
  color: #f3f1ea !important; font-weight: 600; }
.prose strong { color: #f6f4ee; }
.prose code, .prose pre, .prose pre * { font-family: ui-monospace, SFMono-Regular, Menlo, monospace !important;
  font-size: 13px !important; }
.prose pre { background: #201f1c !important; border: 1px solid var(--sh-line) !important; border-radius: 12px; }
.prose a { color: #b9a8ff !important; text-decoration-color: rgba(185,168,255,.4); }
/* user bubble: topel, zaobljen */
#root [class*="rounded-2xl"][class*="bg-primary"], #root .bg-primary\/10 {
  background: var(--sh-raise2) !important; color: var(--sh-text) !important;
  border: 1px solid var(--sh-line) !important;
}

/* ── composer ───────────────────────────────────────── */
#root form .rounded-2xl, #root form [class*="rounded-2xl"] {
  background: #30302b !important; border-color: rgba(255,255,255,.10) !important;
  border-radius: 24px !important; box-shadow: 0 6px 28px rgba(0,0,0,.30) !important;
}
#root form:has(textarea:focus) { box-shadow: none; }
#root form:has(textarea:focus) .rounded-2xl { border-color: rgba(255,255,255,.18) !important; }
#root textarea { color: var(--sh-text) !important; font-size: 15px; }
#root textarea::placeholder { color: #8a867c !important; }
/* send gumb ostane vijoličen — edini močan poudarek */
#root form button:has(svg.lucide-arrow-up) { background: var(--sh-acc) !important; }

/* modelski gumbi: mirni, aktiven = kremen z temnim tekstom (Claude izbor) */
#root [class*="model"] button, .shela-model-pills button { border-radius: 999px; }
/* :not([role="tab"]) — brez tega je izbirnik zajel zavihke racunalniske
   plosce, ki imajo "bg-accent" v imenu razreda tudi kadar niso aktivni. */
#root button[class*="bg-accent"]:not([role="tab"]), #root [data-state="active"][class*="pill"]:not([role="tab"]) { background: #eceae2 !important; color: #262624 !important; }

/* Zavihki racunalniske plosce: berljivi na temnem, aktiven svetlejsi. */
#root [role="tablist"] [role="tab"] { color: #b7b3a8 !important; background: transparent !important; }
#root [role="tablist"] [role="tab"]:hover { color: #e8e5db !important; }
#root [role="tablist"] [role="tab"][data-state="active"] { color: #f5f3ec !important; background: rgba(255,255,255,.08) !important; }

/* ── empty state ────────────────────────────────────── */
.shela-cards-head, .shela-empty-title, h1[class*="text-2xl"], h2[class*="text-2xl"] {
  background: linear-gradient(100deg, #f3f1ea 30%, #cfcabb 90%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
}
.shela-mcard { background: var(--sh-raise) !important; border: 1px solid var(--sh-line) !important; }
.shela-mcard:hover { box-shadow: 0 10px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.12) !important; }
.shela-mcard-tile { filter: saturate(.55) brightness(.92); }
.shela-mcard-title { color: var(--sh-text) !important; }
.shela-mcard-desc { color: var(--sh-mut) !important; }

/* ── computer/terminal panel: topel namesto modrikast ── */
#root [class*="terminal"], .shela-terminal, #root pre[class*="bg-"] { background: #201f1c !important; }

/* Music studio uskladi */
#shela-mstudio { background: #2b2a26 !important; border-color: rgba(255,255,255,.10) !important; }
#shela-mstudio .mst-desc, #shela-mstudio .mst-count { background: #201f1c !important; }
#shela-mstudio .mst-chip { background: #32312c; }

/* ── scrollbari: tanki, diskretni ───────────────────── */
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.16) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); border-radius: 99px; }
*::-webkit-scrollbar-track { background: transparent; }

/* mobilne nianse */
@media (max-width: 767px) {
  .shela-header-v2 { background: rgba(31,30,27,.92) !important; }
}

/* paperclip pospravljen pod "+" (Claude slog) — file input ostane, meni ga klice */
#shela-upload-btn, button.shela-upload-btn { display: none !important; }

/* 19.8. (Grega): New Chat na mobile pod Dynamic Islandom — spusti header sidebarja */
@media (max-width: 767px) {
  /* POZOR: mobilni predal je Radix Sheet PORTAL izven #root — zato brez #root! */
  .bg-sidebar > div:first-child {
    padding-top: calc(env(safe-area-inset-top, 0px) + 18px) !important;
  }
}