:root {
  --bw-brown: #4E2A1A;
  --bw-cream: #F2DFB8;
  --bw-darkbrown: #3a241a;
  --bw-cream-soft: #E8D0A0;
  --bw-line: rgba(78, 42, 26, 0.20);
}

html, body, div.bg-background {
  background-color: var(--bw-cream) !important;
  color: var(--bw-brown) !important;
}

.welcome-content {
  background: var(--bw-cream) !important;
  color: var(--bw-brown) !important;
  border: 1px solid var(--bw-line);
}
.welcome-content .welcome-title,
.welcome-content .welcome-tagline,
.welcome-content .text-accent {
  color: var(--bw-brown) !important;
  opacity: 1 !important;
}
#welcome-close {
  background: var(--bw-brown) !important;
  color: var(--bw-cream) !important;
}

header.bg-primary {
  background-color: var(--bw-brown) !important;
  color: var(--bw-cream) !important;
}
header h1, header p, header span, header .text-accent {
  color: var(--bw-cream) !important;
}

div.sticky > div {
  background-color: rgba(242, 223, 184, 0.95) !important;
  border-color: var(--bw-line) !important;
}
div.sticky input {
  background-color: var(--bw-cream-soft) !important;
  color: var(--bw-brown) !important;
  border-color: var(--bw-line) !important;
}
div.sticky input::placeholder { color: rgba(78, 42, 26, 0.6) !important; }
div.sticky svg { color: var(--bw-brown) !important; }

div.sticky button {
  background-color: var(--bw-brown) !important;
  color: var(--bw-cream) !important;
  border: 1px solid var(--bw-brown) !important;
  box-shadow: none !important;
  opacity: 0.75;
}
div.sticky button:hover {
  opacity: 1;
}
div.sticky button.bg-primary {
  opacity: 1;
  font-weight: 700;
  box-shadow: inset 0 -3px 0 var(--bw-darkbrown) !important;
}

main section h2 {
  display: block !important;
  width: 100%;
  background-color: var(--bw-brown) !important;
  color: var(--bw-cream) !important;
  padding: 0.55rem 1rem !important;
  border-radius: 0.9rem;
}
main section h2 > span { display: none !important; }

main li.group {
  background-color: var(--bw-cream) !important;
  border-color: var(--bw-line) !important;
  box-shadow: 0 2px 8px rgba(78, 42, 26, 0.10);
}
main li.group div.bg-muted { background-color: var(--bw-cream) !important; }
main li.group h3,
main li.group .text-primary,
main li.group .text-foreground { color: var(--bw-brown) !important; }
main li.group p,
main li.group .text-muted-foreground { color: rgba(78, 42, 26, 0.8) !important; }
main li.group span.rounded-full {
  color: var(--bw-brown) !important;
  border-color: var(--bw-line) !important;
}

#no-results h3, #no-results p { color: var(--bw-brown) !important; }
footer { border-color: var(--bw-line) !important; }
footer h2, footer p, footer span { color: var(--bw-brown) !important; }
div.sticky div.overflow-x-auto {
  padding: 8px 6px 8px 6px;
  margin-top: 4px !important;
  margin-bottom: -4px;
  margin-left: -6px;
  margin-right: -6px;
}
div.sticky div.overflow-x-auto button {
  transition: transform 0.2s ease, opacity 0.2s ease;
}
div.sticky div.overflow-x-auto button:hover,
div.sticky div.overflow-x-auto button:active {
  transform: translateY(-2px);
}
