/* ==========================================================================
   EXTRAS — cookie banner, Nui chat widget, language toggle
   Uses the same design tokens defined in css/styles.css
   ========================================================================== */

/* ---------------------------------------------------------------------
   Language toggle (header)
   --------------------------------------------------------------------- */
.lang-toggle {
  margin-left: auto;
  margin-right: 0.75rem;
  min-width: 44px;
  height: 34px;
  padding: 0 0.65rem;
  border: 1px solid var(--gold);
  border-radius: var(--radius);
  background: transparent;
  color: var(--text-dark);
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
}
.lang-toggle:hover,
.lang-toggle:focus-visible {
  background: var(--gold);
  color: var(--ink);
}

/* ---------------------------------------------------------------------
   Cookie banner
   --------------------------------------------------------------------- */
.cookie-banner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 3000;
  background: var(--ink);
  border-top: 1px solid var(--border-soft);
  padding: 1.1rem 1.25rem;
}
.cookie-banner[hidden] { display: none; }
.cookie-banner-inner {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.cookie-banner p {
  color: var(--cream);
  font-size: 0.85rem;
  line-height: 1.5;
  margin: 0;
  flex: 1 1 420px;
}
.cookie-banner a { color: var(--gold-soft); text-decoration: underline; }
.cookie-banner-actions {
  display: flex;
  gap: 0.6rem;
  flex-shrink: 0;
}
.cookie-banner .btn { padding: 0.6rem 1.1rem; font-size: 0.78rem; }
.cookie-banner .btn-outline-dark {
  border-color: var(--gold);
  color: var(--cream);
}
.cookie-banner .btn-dark { background: var(--gold); color: var(--ink); }
.cookie-banner .btn-dark:hover { background: var(--gold-soft); }

@media (max-width: 640px) {
  .cookie-banner-inner { flex-direction: column; align-items: stretch; }
  .cookie-banner-actions { justify-content: flex-end; }
}

/* ---------------------------------------------------------------------
   Nui chat widget
   --------------------------------------------------------------------- */
.nui-widget {
  position: fixed;
  left: 1.25rem;
  bottom: 1.25rem;
  z-index: 2500;
}
.nui-launcher {
  width: 58px; height: 58px;
  border-radius: 50%;
  border: 1px solid var(--gold);
  background: var(--bordeaux);
  color: var(--cream);
  padding: 0;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  transition: transform var(--transition), background var(--transition);
}
.nui-launcher:hover { transform: translateY(-3px); background: var(--bordeaux-soft); }
.nui-avatar-img { width: 100%; height: 100%; display: block; object-fit: cover; }
.nui-avatar-img-sm { width: 34px; height: 34px; flex-shrink: 0; }
.nui-avatar-img-xs { width: 22px; height: 22px; flex-shrink: 0; margin-top: 2px; }

.nui-panel {
  position: absolute;
  left: 0;
  bottom: 72px;
  width: min(340px, calc(100vw - 2.5rem));
  max-height: 70vh;
  background: var(--cream);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  box-shadow: 0 16px 40px rgba(0,0,0,0.3);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.nui-panel[hidden] { display: none; }

.nui-panel-header {
  background: var(--ink);
  color: var(--cream);
  padding: 0.9rem 1rem;
  display: flex; align-items: center; gap: 0.6rem;
}
.nui-panel-header > div { flex: 1; }
.nui-panel-header strong { font-family: var(--font-display); color: var(--gold-soft); display: block; font-size: 1rem; }
.nui-panel-header span { font-size: 0.68rem; color: var(--text-muted); display: block; }
.nui-close {
  background: transparent; border: none; color: var(--cream);
  font-size: 1rem; cursor: pointer; line-height: 1;
  padding: 0.3rem; flex-shrink: 0;
}

.nui-messages {
  flex: 1;
  overflow-y: auto;
  padding: 0.9rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  min-height: 160px;
}
.nui-row { display: flex; gap: 0.5rem; align-items: flex-end; }
.nui-row.from-user { justify-content: flex-end; }
.nui-msg {
  max-width: 78%;
  font-size: 0.86rem;
  line-height: 1.45;
  padding: 0.6rem 0.8rem;
  border-radius: var(--radius);
}
.nui-msg.from-nui {
  background: #fff;
  border: 1px solid var(--border-soft);
  color: var(--text-dark);
}
.nui-msg.from-user {
  background: var(--bordeaux);
  color: var(--cream);
}
.nui-msg.is-typing { color: var(--text-muted); font-style: italic; }

.nui-consent {
  font-size: 0.65rem;
  color: var(--text-muted);
  padding: 0 1rem 0.5rem;
  margin: 0;
}
.nui-consent a { color: var(--bordeaux); }

.nui-form {
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem;
  border-top: 1px solid var(--border-soft);
  background: #fff;
}
.nui-form input {
  flex: 1;
  padding: 0.6rem 0.75rem;
  border: 1px solid rgba(107,31,42,0.25);
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-size: 0.85rem;
  background: var(--cream);
  color: var(--text-dark);
}
.nui-form input:focus { outline: 2px solid var(--gold); outline-offset: 1px; }
.nui-form .btn { padding: 0.6rem 0.9rem; font-size: 0.78rem; white-space: nowrap; }

@media (max-width: 480px) {
  .nui-widget { left: 0.75rem; bottom: 0.75rem; }
  .nui-panel { bottom: 68px; }
}