/* ===================================================================
   LAMINAK — "Rosé" Theme
   Deep midnight purple with soft rose and sakura pink accents.
   Elegant, warm, low-contrast dark.
   =================================================================== */

/* ── Theme Variables ── */
body.theme-rose {
  --bg:             #130a12;
  --bg-card:        #1c1020;
  --bg-input:       #261528;
  --bg-hover:       rgba(244, 114, 182, 0.07);
  --border:         rgba(200, 80, 160, 0.15);
  --text:           #fce8f2;
  --text-muted:     rgba(240, 160, 210, 0.48);
  --accent:         #f472b6;
  --accent-hover:   #f9a8d4;
  --accent-dim:     rgba(244, 114, 182, 0.1);
  --user-bg:        rgba(244, 114, 182, 0.09);
  --assistant-bg:   rgba(19, 10, 18, 0.55);
  --success:        #86efac;
  --warning:        #fde68a;
  --error:          #fca5a5;
  --thinking-bg:    rgba(38, 16, 38, 0.6);
  --thinking-border: rgba(244, 114, 182, 0.12);
  --tool-bg:        rgba(19, 10, 18, 0.5);
  --tool-border:    rgba(200, 80, 160, 0.12);
  --bg-secondary:   #1c1020;
  --glass:          rgba(19, 10, 18, 0.88);
  --glass-border:   rgba(200, 80, 160, 0.14);
  --orb-idle:       radial-gradient(circle, #f472b6 0%, #c026a5 40%, #7c1060 100%);
  --orb-thinking:   radial-gradient(circle, #c084fc 0%, #9333ea 40%, #6b21a8 100%);
  --orb-speaking:   radial-gradient(circle, #fb7185 0%, #e11d48 40%, #9f1239 100%);
  --orb-listening:  radial-gradient(circle, #f9a8d4 0%, #ec4899 40%, #be185d 100%);
  --orb-error:      radial-gradient(circle, #fca5a5 0%, #dc2626 40%, #991b1b 100%);
}

/* ── Background ── */
body.theme-rose {
  background: #130a12;
}

body.theme-rose::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(ellipse 65% 50% at 5%  90%, rgba(192, 38, 165, 0.07) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 90% 5%,  rgba(244, 114, 182, 0.05) 0%, transparent 55%),
    radial-gradient(ellipse 75% 55% at 50% 50%, rgba(80, 15, 60, 0.04)    0%, transparent 70%),
    #130a12;
  animation: roseShift 22s ease-in-out infinite alternate;
}

@keyframes roseShift {
  0%   { opacity: 1; }
  50%  { opacity: 0.82; }
  100% { opacity: 1; }
}

/* ── Header ── */
body.theme-rose header {
  background: rgba(19, 10, 18, 0.95);
  border-bottom: 1px solid rgba(200, 80, 160, 0.14);
}

body.theme-rose .logo-icon {
  background: linear-gradient(135deg, #f472b6, #c084fc);
  color: #130a12;
  border-radius: 50%;
  font-size: 13px;
}

/* ── Nav sidebar ── */
body.theme-rose #app-nav {
  background: #180d17;
  border-right: 1px solid rgba(200, 80, 160, 0.14);
}

body.theme-rose .nav-item.active {
  background: rgba(244, 114, 182, 0.09);
  color: #f472b6;
}

body.theme-rose .nav-item:hover {
  background: rgba(244, 114, 182, 0.05);
}

body.theme-rose .sidebar-footer {
  border-top: 1px solid rgba(200, 80, 160, 0.13);
}

/* ── Messages ── */
body.theme-rose .msg.user .msg-body {
  background: rgba(244, 114, 182, 0.08);
  border: 1px solid rgba(244, 114, 182, 0.16);
}

body.theme-rose .msg.assistant .msg-body {
  background: rgba(19, 10, 18, 0.5);
  border: 1px solid rgba(200, 80, 160, 0.1);
}

body.theme-rose .msg.assistant .msg-avatar {
  background: linear-gradient(135deg, #c026a5, #f472b6);
}

/* ── Input area ── */
body.theme-rose .input-area {
  background: rgba(19, 10, 18, 0.95);
  border-top: 1px solid rgba(200, 80, 160, 0.14);
}

body.theme-rose #msg-input {
  background: #261528;
  border: 1px solid rgba(200, 80, 160, 0.18);
  border-radius: 18px;
}

body.theme-rose #msg-input:focus {
  border-color: rgba(244, 114, 182, 0.4);
  box-shadow: 0 0 18px rgba(244, 114, 182, 0.07);
}

body.theme-rose .send-btn {
  background: linear-gradient(135deg, #c026a5, #f472b6);
  color: #fff;
  border-radius: 50%;
}
body.theme-rose .send-btn:hover {
  background: linear-gradient(135deg, #db2ab5, #f9a8d4);
}

/* ── Model picker ── */
body.theme-rose .model-picker-btn {
  background: #261528;
  border-color: rgba(200, 80, 160, 0.18);
}
body.theme-rose .model-picker-btn:hover {
  border-color: rgba(244, 114, 182, 0.4);
  color: #f472b6;
}
body.theme-rose .model-picker-bubble {
  background: #1c1020;
  border-color: rgba(200, 80, 160, 0.2);
  box-shadow: 0 8px 36px rgba(0, 0, 0, 0.55);
}
body.theme-rose .model-picker-bubble::after {
  background: #1c1020;
  border-color: rgba(200, 80, 160, 0.2);
}

/* ── Suggestions ── */
body.theme-rose .suggestion {
  background: #261528;
  border: 1px solid rgba(200, 80, 160, 0.14);
  border-radius: 22px;
}
body.theme-rose .suggestion:hover {
  background: rgba(244, 114, 182, 0.07);
  border-color: rgba(244, 114, 182, 0.32);
  color: #f472b6;
  box-shadow: 0 0 16px rgba(244, 114, 182, 0.08);
}

/* ── Thinking / tool blocks ── */
body.theme-rose .thinking-block {
  background: rgba(38, 16, 38, 0.45);
  border-color: rgba(244, 114, 182, 0.08);
}
body.theme-rose .tool-block {
  background: rgba(19, 10, 18, 0.4);
  border-color: rgba(200, 80, 160, 0.08);
}

/* ── Code blocks ── */
body.theme-rose pre, body.theme-rose code {
  background: #0d0610;
  border: 1px solid rgba(200, 80, 160, 0.14);
}

/* ── Auth & connect ── */
body.theme-rose .auth-card {
  background: #1c1020;
  border: 1px solid rgba(200, 80, 160, 0.18);
}
body.theme-rose #connect-screen {
  background: #130a12;
}
body.theme-rose #connect-screen .big-spinner {
  border-color: rgba(244, 114, 182, 0.12);
  border-top-color: #f472b6;
}

/* ── Scrollbars ── */
body.theme-rose ::-webkit-scrollbar { width: 4px; }
body.theme-rose ::-webkit-scrollbar-thumb {
  background: rgba(244, 114, 182, 0.18);
  border-radius: 2px;
}
body.theme-rose ::-webkit-scrollbar-track { background: transparent; }
