/* ChatClean brand theme — overlays Chatwoot compiled styles */
:root {
  --cc-forest: #14231b;
  --cc-institutional: #1f4a34;
  --cc-medium: #35894a;
  --cc-action: #51bc69;
  --cc-whatsapp: #00bd42;
  --cc-gold: #b7923e;
  --cc-gold-dark: #a07e35;
  --cc-champagne: #e7d6a8;
  --cc-cream: #fdf6e6;
  --cc-bg: #f8f7f3;
  --cc-bg-muted: #f1efe5;
  --cc-white: #ffffff;
  --cc-text: #14231b;
  --cc-text-muted: #5e6560;
  --cc-border: #e9e5d6;
  --cc-selected: #eef8f0;
  --cc-sent: #dbf0e0;
  --cc-disabled: #8a918b;

  --slate-1: 248 247 243;
  --slate-2: 253 246 230;
  --slate-3: 241 239 229;
  --slate-4: 233 229 214;
  --slate-5: 231 214 168;
  --slate-6: 217 208 184;
  --slate-7: 196 188 164;
  --slate-8: 160 126 53;
  --slate-9: 94 101 96;
  --slate-10: 94 101 96;
  --slate-11: 94 101 96;
  --slate-12: 20 35 27;

  --iris-1: 238 248 240;
  --iris-2: 219 240 224;
  --iris-3: 219 240 224;
  --iris-4: 196 232 204;
  --iris-5: 160 216 172;
  --iris-6: 120 200 140;
  --iris-7: 81 188 105;
  --iris-8: 53 137 74;
  --iris-9: 81 188 105;
  --iris-10: 53 137 74;
  --iris-11: 31 74 52;
  --iris-12: 20 35 27;

  --blue-1: 238 248 240;
  --blue-2: 219 240 224;
  --blue-3: 219 240 224;
  --blue-4: 196 232 204;
  --blue-5: 160 216 172;
  --blue-6: 120 200 140;
  --blue-7: 81 188 105;
  --blue-8: 53 137 74;
  --blue-9: 81 188 105;
  --blue-10: 53 137 74;
  --blue-11: 31 74 52;
  --blue-12: 20 35 27;

  --teal-9: 81 188 105;
  --teal-10: 53 137 74;
  --teal-11: 31 74 52;

  --amber-1: 253 246 230;
  --amber-2: 253 246 230;
  --amber-3: 231 214 168;
  --amber-4: 231 214 168;
  --amber-5: 183 146 62;
  --amber-8: 160 126 53;
  --amber-9: 183 146 62;
  --amber-10: 160 126 53;
  --amber-11: 160 126 53;
  --amber-12: 20 35 27;

  --background-color: 248 247 243;
  --surface-1: 255 255 255;
  --surface-2: 255 255 255;
  --surface-active: 255 255 255;
  --card-color: 255 255 255;
  --border-weak: 233 229 214;
  --border-strong: 231 214 168;
  --border-container: 233 229 214;
  --label-background: 241 239 229;
  --text-blue: 20 35 27;
  --solid-blue: 219 240 224;
  --solid-iris: 219 240 224;
  --solid-amber: 231 214 168;
  --border-blue: 81, 188, 105, 0.5;
  --button-color: 255 255 255;
  --alpha-3: 255, 255, 255, 0.98;
}

html,
body,
#app {
  background: var(--cc-bg) !important;
  color: var(--cc-text);
}

body {
  color: var(--cc-text) !important;
}

/* Brand color utilities compiled as hex in the official build */
.bg-n-brand,
.bg-woot-500,
.bg-woot-600,
[class*="bg-n-brand"] {
  background-color: var(--cc-action) !important;
}

.text-n-brand,
.text-woot-500,
.text-woot-600,
.text-link,
a.text-n-brand {
  color: var(--cc-medium) !important;
}

.border-n-brand,
.ring-n-brand,
.outline-n-brand,
.focus\:ring-n-brand:focus,
.focus\:outline-n-brand:focus {
  border-color: var(--cc-action) !important;
  --tw-ring-color: var(--cc-action) !important;
  outline-color: var(--cc-action) !important;
}

/* Login — solid cream, no gradient */
main.min-h-screen.bg-n-brand\/5,
main.min-h-screen {
  background: var(--cc-bg) !important;
}

main.min-h-screen img[alt] {
  height: 3.25rem !important;
  width: auto !important;
}

main.min-h-screen h2 {
  color: #14231b !important;
}

main.min-h-screen section.bg-white,
main.min-h-screen section.shadow {
  background: #ffffff !important;
  border: 1px solid #e9e5d6;
}

/* Primary buttons */
button[class*="bg-n-blue"],
button.bg-n-solid-blue,
[class*="bg-n-blue-9"],
button.solid.blue,
button[color="blue"] {
  background-color: var(--cc-action) !important;
  color: #fff !important;
}

button:hover[class*="bg-n-blue"],
button.solid.blue:hover {
  background-color: var(--cc-medium) !important;
}

/* Sidebar — premium WAC chrome, solids only */
.bg-n-background.fixed.top-0.h-full.z-40,
aside.bg-n-background,
[class*="w-[200px]"].bg-n-background {
  background: var(--cc-forest) !important;
  color: #f1efe5 !important;
  border-color: var(--cc-institutional) !important;
  box-shadow: inset -1px 0 0 rgba(183, 146, 62, 0.28);
}

aside.bg-n-background [class*="bg-gradient"],
aside.bg-n-background [class*="gradient-to"] {
  background-image: none !important;
}

aside.bg-n-background .pointer-events-none.absolute[class*="gradient"],
aside.bg-n-background [class*="bg-gradient-to-t"] {
  display: none !important;
}

aside.bg-n-background .text-n-slate-10,
aside.bg-n-background .text-n-slate-11,
aside.bg-n-background .text-n-slate-12 {
  color: #fdf6e6 !important;
  -webkit-text-fill-color: #fdf6e6 !important;
}

aside.bg-n-background .n-dropdown-body .text-n-slate-10,
aside.bg-n-background .n-dropdown-body .text-n-slate-11,
aside.bg-n-background .n-dropdown-body .text-n-slate-12 {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

aside.bg-n-background > section:first-child {
  padding: 16px 12px 14px !important;
  margin: 0 !important;
  border-bottom: 1px solid rgba(231, 214, 168, 0.16);
  gap: 12px !important;
}

aside.bg-n-background > section:first-child .w-px {
  background: rgba(231, 214, 168, 0.35) !important;
}

aside.bg-n-background a[href*="/search"],
aside.bg-n-background a.bg-n-button-color {
  background: var(--cc-institutional) !important;
  outline-color: rgba(231, 214, 168, 0.28) !important;
  color: var(--cc-champagne) !important;
  height: 36px !important;
  border-radius: 10px !important;
}

aside.bg-n-background a[href*="/search"] .text-n-slate-10,
aside.bg-n-background a[href*="/search"] span {
  color: var(--cc-champagne) !important;
}

aside.bg-n-background > section:first-child button:not(.n-dropdown-body button) {
  background: var(--cc-institutional) !important;
  color: var(--cc-champagne) !important;
  outline-color: rgba(231, 214, 168, 0.28) !important;
  border-radius: 10px !important;
}

aside.bg-n-background nav {
  padding-top: 10px !important;
}

aside.bg-n-background nav a,
aside.bg-n-background nav [role="button"],
aside.bg-n-background nav button {
  border-radius: 10px !important;
  min-height: 36px !important;
  background-image: none !important;
}

aside.bg-n-background nav a:hover:not(.n-dropdown-body *),
aside.bg-n-background nav [role="button"]:hover:not(.n-dropdown-body *),
aside.bg-n-background nav button:hover:not(.n-dropdown-body *) {
  background: var(--cc-institutional) !important;
  background-image: none !important;
  color: var(--cc-cream) !important;
}

aside.bg-n-background nav a.active:not(.n-dropdown-body *),
aside.bg-n-background nav [role="button"].active:not(.n-dropdown-body *),
aside.bg-n-background nav .active:not(.n-dropdown-body *):not(.n-dropdown-item *),
aside.bg-n-background nav .bg-n-alpha-2:not(.n-dropdown-body *) {
  background: var(--cc-institutional) !important;
  background-image: none !important;
  color: var(--cc-cream) !important;
  box-shadow: inset 3px 0 0 var(--cc-gold);
}

aside.bg-n-background nav .active:not(.n-dropdown-body *) svg,
aside.bg-n-background nav .active:not(.n-dropdown-body *) [class*="i-lucide"],
aside.bg-n-background nav .bg-n-alpha-2:not(.n-dropdown-body *) [class*="i-lucide"] {
  color: var(--cc-champagne) !important;
}

aside.bg-n-background nav .child-item::before,
aside.bg-n-background nav [class*="before:bg-n-slate"]::before {
  background: rgba(231, 214, 168, 0.22) !important;
}

aside.bg-n-background nav .child-item::after,
aside.bg-n-background nav [class*="after:border-n-slate"]::after {
  border-color: rgba(231, 214, 168, 0.22) !important;
}

aside.bg-n-background nav [data-test-id="sidebar-unread-badge"],
aside.bg-n-background nav [class*="rounded-full"].bg-n-slate-4,
aside.bg-n-background nav [class*="rounded-full"].bg-n-slate-5 {
  background: var(--cc-gold) !important;
  color: var(--cc-forest) !important;
  border-color: transparent !important;
}

aside.bg-n-background [class*="border-n-weak"]:not(.n-dropdown-body):not(.n-dropdown-body *),
aside.bg-n-background [class*="border-n-slate"]:not(.n-dropdown-body *) {
  border-color: rgba(231, 214, 168, 0.16) !important;
}

aside.bg-n-background > section:last-of-type > div[class*="border-t"] {
  border-top: 1px solid rgba(231, 214, 168, 0.18) !important;
  box-shadow: none !important;
  padding: 10px 8px !important;
  background: #101c16 !important;
}

aside.bg-n-background > section:last-of-type button {
  color: #fdf6e6 !important;
  -webkit-text-fill-color: #fdf6e6 !important;
}

aside.bg-n-background > section:last-of-type button .text-n-slate-12,
aside.bg-n-background > section:last-of-type button div {
  color: #fdf6e6 !important;
  -webkit-text-fill-color: #fdf6e6 !important;
  font-weight: 650 !important;
}

aside.bg-n-background > section:last-of-type button .text-n-slate-11 {
  color: #e7d6a8 !important;
  -webkit-text-fill-color: #e7d6a8 !important;
  font-weight: 500 !important;
}

aside.bg-n-background > section:last-of-type .n-dropdown-body,
aside.bg-n-background > section:last-of-type .n-dropdown-body button,
aside.bg-n-background > section:last-of-type .n-dropdown-body div,
aside.bg-n-background > section:last-of-type .n-dropdown-body * {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

aside.bg-n-background > section:last-of-type button:not(.n-dropdown-body button):hover {
  background: var(--cc-institutional) !important;
}

/* Profile / Admin WAC menu — cream card, gold edge, always dark type */
html body .n-dropdown-body,
html body ul.n-dropdown-body,
html body .n-dropdown-body.bg-n-alpha-3,
html.dark .n-dropdown-body,
html.dark ul.n-dropdown-body {
  --slate-10: 94 101 96;
  --slate-11: 62 70 64;
  --slate-12: 20 35 27;
  --alpha-1: 31, 74, 52, 0.08;
  --alpha-2: 31, 74, 52, 0.1;
  --alpha-3: 255, 253, 248, 1;
  --button-color: 238 248 240;
  background: #fffdf8 !important;
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
  border: 1px solid #e7d6a8 !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 3px 0 0 #b7923e,
    0 22px 48px rgba(20, 35, 27, 0.22),
    0 0 0 1px rgba(183, 146, 62, 0.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 12px 10px 10px !important;
  gap: 4px !important;
}

html body .n-dropdown-body,
html body .n-dropdown-body *,
html.dark .n-dropdown-body,
html.dark .n-dropdown-body * {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

html body .n-dropdown-body .text-n-slate-10,
html body .n-dropdown-body .text-n-slate-11,
html.dark .n-dropdown-body .text-n-slate-10,
html.dark .n-dropdown-body .text-n-slate-11 {
  color: #5e6560 !important;
  -webkit-text-fill-color: #5e6560 !important;
}

html body .n-dropdown-body svg,
html body .n-dropdown-body [class*="i-lucide"],
html.dark .n-dropdown-body svg,
html.dark .n-dropdown-body [class*="i-lucide"] {
  color: #1f4a34 !important;
  -webkit-text-fill-color: #1f4a34 !important;
}

html body .n-dropdown-section {
  background: #fdf6e6 !important;
  border: 1px solid #efe3c0 !important;
  border-radius: 12px !important;
  margin: 2px 0 8px !important;
  padding: 8px 4px 6px !important;
}

html body .n-dropdown-item > a,
html body .n-dropdown-item > button,
html body .n-dropdown-item > div,
html body .n-dropdown-item > [class] {
  border-radius: 10px !important;
  min-height: 40px !important;
  padding: 10px 12px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.35 !important;
  background: transparent !important;
}

html body .n-dropdown-item > a:hover,
html body .n-dropdown-item > button:hover,
html body .n-dropdown-item > div:hover,
html body .n-dropdown-body a:hover,
html body .n-dropdown-body button:hover:not([role="switch"]) {
  background: #eef8f0 !important;
}

html body .n-dropdown-body button[class*="bg-n-slate"],
html body .n-dropdown-body button[class*="text-n-slate"] {
  background: #eef8f0 !important;
  color: #1f4a34 !important;
  -webkit-text-fill-color: #1f4a34 !important;
  border: 1px solid #c8e6cf !important;
  border-radius: 999px !important;
  min-height: 32px !important;
  font-weight: 650 !important;
}

html body .n-dropdown-body [role="switch"] {
  background: #d7d2c4 !important;
  -webkit-text-fill-color: transparent !important;
}

html body .n-dropdown-body [role="switch"][aria-checked="true"] {
  background: #51bc69 !important;
}

html body .n-dropdown-body [role="switch"] span:not(.sr-only) {
  -webkit-text-fill-color: transparent !important;
}

html body .n-dropdown-body [class*="border-b"],
html body .n-dropdown-body .h-0 {
  border-color: #efe3c0 !important;
  margin: 6px 2px !important;
}

html body .n-dropdown-body a[href="/super_admin"],
html body .n-dropdown-body a[href="/super_admin"] * {
  color: #a07e35 !important;
  -webkit-text-fill-color: #a07e35 !important;
}

html body .n-dropdown-body .n-dropdown-item:last-child > *,
html body .n-dropdown-body .n-dropdown-item:last-child [class*="i-lucide"] {
  color: #9b2c3a !important;
  -webkit-text-fill-color: #9b2c3a !important;
}

/* Light surfaces: never use white text */
.bg-white,
.bg-n-solid-1,
.bg-n-solid-2,
.bg-n-solid-3,
.bg-n-surface-1,
.bg-n-surface-2,
.bg-n-card,
.bg-n-alpha-3,
[class*="bg-n-solid"],
[class*="bg-n-surface"] {
  color: #14231b;
}

.bg-white .text-white:not(button):not([class*="bg-n-brand"]):not([class*="bg-n-blue"]),
.bg-n-solid-1 .text-white:not(button),
.bg-n-solid-2 .text-white:not(button),
.bg-n-surface-1 .text-white:not(button) {
  color: #14231b !important;
}

/* Conversation list / inbox */
[class*="conversation"],
.conversations-list,
[data-testid="conversation-list"] {
  --cc-list-bg: var(--cc-white);
}

.conversation.active,
.conversation.selected,
[class*="conversation"][class*="active"],
li.active[class*="conversation"] {
  background: var(--cc-selected) !important;
}

/* Incoming / outgoing bubbles — Chatwoot next bubbles */
.bg-n-slate-3[class*="rounded"],
[class*="outgoing"] [class*="bg-n-"],
.message.outgoing .message-text,
[data-message-type="outgoing"] {
  background-color: var(--cc-sent) !important;
}

/* Cards and tables */
.bg-white,
.bg-n-solid-1,
.bg-n-solid-2,
.bg-n-solid-3,
.bg-n-surface-1,
.bg-n-surface-2,
.bg-n-card {
  background-color: var(--cc-white);
}

input,
textarea,
select,
[class*="ring-n-weak"] {
  border-color: var(--cc-border);
}

/* WhatsApp-specific actions */
[href*="whatsapp"] button,
button[class*="whatsapp"],
a[href*="whatsapp"] {
  --cc-action-local: var(--cc-whatsapp);
}

/* Super admin */
.super-admin,
body.administrate {
  background: var(--cc-bg);
}

/* Channel colors stay on icons only */
.i-ri-whatsapp-fill,
[class*="whatsapp"] .icon,
.channel-whatsapp {
  color: var(--cc-whatsapp);
}
.i-ri-instagram-fill,
.channel-instagram {
  color: #e1306c;
}
.i-ri-facebook-fill,
.channel-facebook {
  color: #1877f2;
}
.i-ri-telegram-fill,
.channel-telegram {
  color: #229ed9;
}

/* Super Admin — ChatClean palette, no washed type */
body.min-h-full.bg-n-background,
html.dark body.min-h-full.bg-n-background,
body.administrate,
.super-admin {
  --slate-10: 94 101 96;
  --slate-11: 62 70 64;
  --slate-12: 20 35 27;
  --solid-1: 255 255 255;
  --solid-2: 255 255 255;
  --solid-3: 255 255 255;
  --card-color: 255 255 255;
  --background-color: 248 247 243;
  --alpha-3: 255, 255, 255, 0.98;
  background: var(--cc-bg) !important;
  color: var(--cc-text) !important;
}

.bg-pixel-band,
[class*="bg-pixel-band"] {
  background-image: none !important;
  display: none !important;
}

aside.border-e,
aside.lg\:h-dvh,
aside.lg\:sticky.lg\:flex {
  background: var(--cc-forest) !important;
  border-color: var(--cc-institutional) !important;
  color: #f1efe5 !important;
  box-shadow: inset -1px 0 0 rgba(183, 146, 62, 0.28);
}

aside.border-e > div:first-child {
  padding: 16px 16px 14px !important;
  border-bottom: 1px solid rgba(231, 214, 168, 0.16);
}

aside.border-e,
aside.border-e a,
aside.border-e button,
aside.border-e summary,
aside.border-e span,
aside.border-e p,
aside.border-e .text-n-slate-10,
aside.border-e .text-n-slate-11,
aside.border-e .text-n-slate-12,
aside.border-e .text-label,
aside.border-e [data-dropdown] > summary,
aside.border-e [data-dropdown] > summary * {
  color: #fdf6e6 !important;
  -webkit-text-fill-color: #fdf6e6 !important;
}

aside.border-e .uppercase,
aside.border-e .tracking-wider,
aside.border-e p.text-xs {
  color: #b7923e !important;
  -webkit-text-fill-color: #b7923e !important;
  letter-spacing: 0.12em !important;
  font-weight: 650 !important;
}

aside.border-e .text-label-small:not([data-dropdown] *):not(.absolute *) {
  color: #e7d6a8 !important;
  -webkit-text-fill-color: #e7d6a8 !important;
}

aside.border-e button[data-dialog-open="command-bar"] {
  background: var(--cc-institutional) !important;
  border-color: rgba(231, 214, 168, 0.28) !important;
  color: var(--cc-champagne) !important;
  -webkit-text-fill-color: var(--cc-champagne) !important;
  border-radius: 10px !important;
  height: 40px !important;
}

aside.border-e nav a {
  min-height: 40px !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-weight: 600 !important;
  background-image: none !important;
}

aside.border-e nav a [class*="i-lucide"] {
  color: #e7d6a8 !important;
  -webkit-text-fill-color: #e7d6a8 !important;
}

aside.border-e nav a:hover,
aside.border-e nav a[aria-current="page"] {
  background: var(--cc-institutional) !important;
  color: var(--cc-cream) !important;
  -webkit-text-fill-color: var(--cc-cream) !important;
}

aside.border-e nav a[aria-current="page"] {
  box-shadow: inset 3px 0 0 var(--cc-gold);
}

aside.border-e nav a[aria-current="page"] [class*="i-lucide"],
aside.border-e nav a:hover [class*="i-lucide"] {
  color: var(--cc-champagne) !important;
  -webkit-text-fill-color: var(--cc-champagne) !important;
}

aside.border-e > div.border-t {
  border-top: 1px solid rgba(231, 214, 168, 0.18) !important;
  background: #101c16 !important;
}

aside.border-e [data-dropdown] > summary {
  background: transparent !important;
  color: #fdf6e6 !important;
}

aside.border-e [data-dropdown] > summary .text-n-slate-12,
aside.border-e [data-dropdown] > summary .text-label {
  color: #fdf6e6 !important;
  -webkit-text-fill-color: #fdf6e6 !important;
  font-weight: 650 !important;
}

aside.border-e [data-dropdown] > div,
aside.border-e details > div.absolute {
  background: #fffdf8 !important;
  color: #14231b !important;
  border-color: #e7d6a8 !important;
  box-shadow: 0 18px 40px rgba(20, 35, 27, 0.18) !important;
}

aside.border-e [data-dropdown] > div,
aside.border-e [data-dropdown] > div *,
aside.border-e details > div.absolute,
aside.border-e details > div.absolute * {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

header.sticky.lg\:hidden {
  background: var(--cc-forest) !important;
  border-color: var(--cc-institutional) !important;
  color: #f1efe5 !important;
}

header.sticky.lg\:hidden .text-n-slate-11,
header.sticky.lg\:hidden .text-n-slate-12,
header.sticky.lg\:hidden a,
header.sticky.lg\:hidden span {
  color: #f1efe5 !important;
}

.bg-n-brand,
[class*="bg-n-brand"] {
  background-color: var(--cc-action) !important;
}

button.bg-n-brand,
a.bg-n-brand,
[class*="bg-n-brand"].text-white {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.min-h-full main,
body.min-h-full main .text-n-slate-12,
body.min-h-full main h1,
body.min-h-full main h2,
body.min-h-full main td,
body.min-h-full main th,
body.min-h-full main p,
body.min-h-full main a:not(.bg-n-brand):not([class*="bg-n-brand"]) {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

body.min-h-full main .text-n-slate-10,
body.min-h-full main .text-n-slate-11,
body.min-h-full main .text-label-small,
body.min-h-full main .text-body-main {
  color: #5e6560 !important;
  -webkit-text-fill-color: #5e6560 !important;
}

body.min-h-full main h1,
body.min-h-full main .text-heading-1,
body.min-h-full main .text-heading-2,
body.min-h-full main .text-heading-3 {
  color: #14231b !important;
  -webkit-text-fill-color: #14231b !important;
}

main .rounded-xl.border,
main [class*="bg-n-solid-1"],
main [class*="bg-n-solid-2"],
main table {
  background: #ffffff !important;
  border-color: var(--cc-border) !important;
  color: #14231b !important;
}

main th {
  background: #fdf6e6 !important;
  color: #14231b !important;
  font-weight: 650 !important;
}

main input,
main select,
main textarea {
  color: #14231b !important;
  background: #ffffff !important;
  border-color: #e9e5d6 !important;
}