/* MinRes AI Assistant — Chainlit copilot theme overrides */
/* Comprehensive earth-tone branding: #9b6b3d primary, #faf9f7 paper, #f1ede7 cream */
/* Uses !important because custom CSS loads BEFORE compiled Chainlit CSS */

:root,
[data-theme="light"],
[data-theme="dark"] {
  /* Primary: MinRes earth brown #9b6b3d ≈ hsl(29, 44%, 42%) */
  --primary: 29 44% 42% !important;
  --primary-foreground: 0 0% 100% !important;
  --ring: 29 44% 42% !important;

  /* Backgrounds: solid white/cream, no transparency */
  --background: 0 0% 100% !important;
  --foreground: 0 0% 10% !important;
  --card: 30 20% 98% !important;
  --card-foreground: 0 0% 10% !important;
  --popover: 0 0% 100% !important;
  --popover-foreground: 0 0% 10% !important;

  /* Accent: #f1ede7 cream */
  --accent: 30 25% 93% !important;
  --accent-foreground: 0 0% 15% !important;

  /* Muted: warm gray */
  --muted: 30 10% 92% !important;
  --muted-foreground: 25 8% 40% !important;

  /* Border/input: warm tones */
  --border: 30 15% 88% !important;
  --input: 30 15% 88% !important;

  /* Secondary */
  --secondary: 30 18% 96% !important;
  --secondary-foreground: 0 0% 15% !important;

  /* Destructive (keep red) */
  --destructive: 0 84% 60% !important;
  --destructive-foreground: 0 0% 100% !important;

  /* Sidebar: warm off-white — solid, no transparency */
  --sidebar-background: 0 0% 100% !important;
  --sidebar-foreground: 25 10% 20% !important;
  --sidebar-primary: 29 44% 42% !important;
  --sidebar-primary-foreground: 0 0% 100% !important;
  --sidebar-accent: 30 20% 94% !important;
  --sidebar-accent-foreground: 25 10% 20% !important;
  --sidebar-border: 30 12% 90% !important;
  --sidebar-ring: 29 44% 42% !important;

  /* Chart colors: earth palette */
  --chart-1: 29 44% 42% !important;
  --chart-2: 30 25% 55% !important;
  --chart-3: 25 18% 68% !important;
  --chart-4: 30 30% 80% !important;
  --chart-5: 30 15% 88% !important;
}

/* Ensure solid backgrounds everywhere */
body, #root, #app, main {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* ====== Copilot floating button: earth brown ====== */
button[class*="fixed"][class*="rounded-full"],
.cl-widget-button,
[id="chainlit-copilot-button"],
button.fixed.rounded-full {
  background-color: #9b6b3d !important;
  background: #9b6b3d !important;
  color: #ffffff !important;
}

button[class*="fixed"][class*="rounded-full"]:hover,
.cl-widget-button:hover {
  background-color: #845a32 !important;
  background: #845a32 !important;
}

/* ====== Primary buttons (send, etc.) ====== */
button[class*="bg-primary"],
.bg-primary {
  background-color: hsl(29, 44%, 42%) !important;
  color: #ffffff !important;
}

button[class*="bg-primary"]:hover,
.bg-primary:hover {
  background-color: hsl(29, 44%, 36%) !important;
}

/* ====== Hide/rebrand Chainlit branding ====== */
/* Hide the "Chainlit" text and logo */
img[src*="chainlit"],
svg[class*="chainlit"],
a[href*="chainlit.io"],
[class*="watermark"],
[class*="Watermark"],
[class*="powered-by"],
[class*="branding"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* ====== Message bubbles ====== */
/* User messages: earth brown */
[data-testid="user-message"],
.user-message,
[class*="user"] [class*="message"] {
  background-color: #9b6b3d !important;
  color: #ffffff !important;
}

/* Assistant messages: cream */
[data-testid="assistant-message"],
.assistant-message {
  background-color: #faf9f7 !important;
  color: #1a1a1a !important;
}

/* ====== Header area ====== */
[class*="header"],
.dialog-header {
  border-bottom-color: #e8e2db !important;
}

/* ====== Input field ====== */
input[type="text"],
textarea,
[class*="composer"],
[class*="Composer"] {
  border-color: #ddd6cd !important;
  background: #faf9f7 !important;
}

input[type="text"]:focus,
textarea:focus,
[class*="composer"]:focus-within {
  border-color: #9b6b3d !important;
  box-shadow: 0 0 0 3px rgba(155, 107, 61, 0.1) !important;
}

/* ====== Focus rings ====== */
*:focus-visible {
  outline-color: #9b6b3d !important;
}

/* ====== Scrollbar ====== */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #faf9f7;
}
::-webkit-scrollbar-thumb {
  background: #d4cdc4;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #b0a89f;
}

/* ====== Links ====== */
a {
  color: #9b6b3d !important;
}
a:hover {
  color: #845a32 !important;
}

/* ====== Tool call steps ====== */
[class*="step"],
[class*="Step"],
[class*="tool-call"] {
  border-color: #e8e2db !important;
}

/* ====== Badge/notification dot ====== */
[class*="badge"],
.badge {
  background-color: #9b6b3d !important;
  color: #ffffff !important;
}
