/* ===================================================================
   LAMINAK — "Nord" Theme
   Inspired by the Nord colour palette by Arctic Ice Studio.
   Cool, composed, Scandinavian clarity.
   =================================================================== */

/* ── Theme Variables ── */
body.theme-nord {
  --bg:             #080c14;
  --bg-card:        #3b4252;
  --bg-input:       #434c5e;
  --bg-hover:       rgba(136, 192, 208, 0.09);
  --border:         rgba(76, 86, 106, 0.85);
  --text:           #eceff4;
  --text-muted:     #818a97;
  --accent:         #88c0d0;
  --accent-hover:   #8fbcbb;
  --accent-dim:     rgba(136, 192, 208, 0.12);
  --user-bg:        rgba(136, 192, 208, 0.12);
  --assistant-bg:   #3b4252;
  --success:        #a3be8c;
  --warning:        #ebcb8b;
  --error:          #bf616a;
  --thinking-bg:    rgba(59, 66, 82, 0.7);
  --thinking-border: rgba(136, 192, 208, 0.18);
  --tool-bg:        rgba(46, 52, 64, 0.6);
  --tool-border:    rgba(76, 86, 106, 0.6);
  --bg-secondary:   #3b4252;
  --glass:          rgba(46, 52, 64, 0.92);
  --glass-border:   rgba(76, 86, 106, 0.7);
  --orb-idle:       radial-gradient(circle, #88c0d0 0%, #5e81ac 40%, #3b5276 100%);
  --orb-thinking:   radial-gradient(circle, #b48ead 0%, #7e5d8e 40%, #5c3c6a 100%);
  --orb-speaking:   radial-gradient(circle, #a3be8c 0%, #6c9e5a 40%, #4c7040 100%);
  --orb-listening:  radial-gradient(circle, #ebcb8b 0%, #d08770 40%, #b05240 100%);
  --orb-error:      radial-gradient(circle, #bf616a 0%, #9e3a43 40%, #7a1f28 100%);
}

/* ── Background ── */
body.theme-nord {
  background: #080c14;
}

body.theme-nord #app-shell {
  background: #080c14 !important;
}

/* ── Aurora — clippée dans la zone de messages ── */

/* Rideau d'aurore boréale : bandes lumineuses diagonales qui dérivent */
body.theme-nord .messages::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-attachment: fixed;
  background:
    linear-gradient(118deg,
      transparent          0%,
      rgba(0, 210, 165, 0.00) 20%,
      rgba(0, 210, 165, 0.10) 28%,
      rgba(0, 210, 165, 0.14) 32%,
      rgba(0, 210, 165, 0.00) 42%,
      transparent          50%,
      rgba(130, 55, 230, 0.00) 52%,
      rgba(130, 55, 230, 0.08) 58%,
      rgba(130, 55, 230, 0.11) 63%,
      rgba(130, 55, 230, 0.00) 72%,
      transparent          80%,
      rgba(0, 150, 240, 0.00) 82%,
      rgba(0, 150, 240, 0.07) 88%,
      rgba(0, 150, 240, 0.09) 92%,
      rgba(0, 150, 240, 0.00) 100%
    );
  background-size: 200% 200%;
  animation: nord-curtain 18s ease-in-out infinite alternate;
}

body.theme-nord .messages > * {
  position: relative;
  z-index: 1;
}

/* Fond étoilé doux — 3 grilles décalées pour éviter l'effet quadrillage */
body.theme-nord .messages::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-attachment: fixed;
  background-image:
    radial-gradient(circle, rgba(255, 255, 255, 0.75) 0.5px, transparent 0.5px),
    radial-gradient(circle, rgba(200, 230, 255, 0.55) 0.5px, transparent 0.5px),
    radial-gradient(circle, rgba(180, 220, 255, 0.45) 1px,   transparent 1px);
  background-size:     97px  91px,
                      173px 157px,
                      311px 283px;
  background-position: 13px   7px,
                        41px  63px,
                        87px  19px;
  opacity: 0.45;
  animation: nord-twinkle 9s ease-in-out infinite alternate;
}

@keyframes nord-twinkle {
  0%   { opacity: 0.35; }
  40%  { opacity: 0.55; }
  100% { opacity: 0.40; }
}

@keyframes nord-curtain {
  0%   { background-position: 0%   0%;   opacity: 0.6; }
  20%  { background-position: 30%  40%;  opacity: 1.0; }
  45%  { background-position: 60%  20%;  opacity: 0.75; }
  70%  { background-position: 20%  80%;  opacity: 0.95; }
  100% { background-position: 80%  50%;  opacity: 0.8; }
}

/* ── Header ── */
body.theme-nord header {
  background: #3b4252;
  border-bottom: 1px solid rgba(76, 86, 106, 0.9);
}

body.theme-nord .logo-icon {
  background: #88c0d0;
  color: #2e3440;
  border-radius: 8px;
}

/* ── Nav sidebar ── */
body.theme-nord #app-nav {
  background: #3b4252;
  border-right: 1px solid rgba(76, 86, 106, 0.85);
}

body.theme-nord .nav-item.active {
  background: rgba(136, 192, 208, 0.12);
  color: #88c0d0;
}

body.theme-nord .nav-item:hover {
  background: rgba(136, 192, 208, 0.07);
}

body.theme-nord .sidebar-footer {
  border-top: 1px solid rgba(76, 86, 106, 0.7);
}

/* ── Messages ── */
body.theme-nord .msg.user .msg-body {
  background: rgba(136, 192, 208, 0.1);
  border: 1px solid rgba(136, 192, 208, 0.18);
}

body.theme-nord .msg.assistant .msg-body {
  background: rgba(59, 66, 82, 0.5);
  border: 1px solid rgba(76, 86, 106, 0.5);
}

body.theme-nord .msg.assistant .msg-avatar {
  background: linear-gradient(135deg, #5e81ac, #88c0d0);
}

/* ── Input area ── */
body.theme-nord .input-area {
  background: #3b4252;
  border-top: 1px solid rgba(76, 86, 106, 0.85);
}

body.theme-nord #msg-input {
  background: #434c5e;
  border: 1px solid rgba(76, 86, 106, 0.8);
  border-radius: 12px;
}

body.theme-nord #msg-input:focus {
  border-color: rgba(136, 192, 208, 0.5);
  box-shadow: 0 0 0 2px rgba(136, 192, 208, 0.08);
}

body.theme-nord .send-btn {
  background: #88c0d0;
  color: #2e3440;
}
body.theme-nord .send-btn:hover {
  background: #8fbcbb;
}

/* ── Model picker ── */
body.theme-nord .model-picker-btn {
  background: #434c5e;
  border-color: rgba(76, 86, 106, 0.8);
}
body.theme-nord .model-picker-bubble {
  background: #3b4252;
  border-color: rgba(76, 86, 106, 0.85);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.4);
}
body.theme-nord .model-picker-bubble::after {
  background: #3b4252;
}

/* ── Suggestions ── */
body.theme-nord .suggestion {
  background: #434c5e;
  border: 1px solid rgba(76, 86, 106, 0.7);
  border-radius: 10px;
}
body.theme-nord .suggestion:hover {
  background: rgba(136, 192, 208, 0.08);
  border-color: rgba(136, 192, 208, 0.3);
  color: #88c0d0;
}

/* ── Thinking / tool blocks ── */
body.theme-nord .thinking-block {
  background: rgba(59, 66, 82, 0.5);
  border-color: rgba(136, 192, 208, 0.12);
}
body.theme-nord .tool-block {
  background: rgba(46, 52, 64, 0.5);
  border-color: rgba(76, 86, 106, 0.5);
}

/* ── Auth & connect ── */
body.theme-nord .auth-card {
  background: #3b4252;
  border: 1px solid rgba(76, 86, 106, 0.8);
}
body.theme-nord #connect-screen {
  background: #2e3440;
}
body.theme-nord #connect-screen .big-spinner {
  border-color: rgba(136, 192, 208, 0.15);
  border-top-color: #88c0d0;
}

/* ── Scrollbars ── */
body.theme-nord ::-webkit-scrollbar { width: 5px; }
body.theme-nord ::-webkit-scrollbar-thumb {
  background: rgba(136, 192, 208, 0.2);
  border-radius: 3px;
}
body.theme-nord ::-webkit-scrollbar-track { background: transparent; }

/* ── Code blocks ── */
body.theme-nord pre, body.theme-nord code {
  background: #242933;
}
