/* ============================================================
 * Wiya — brand override stylesheet
 * Loaded after Chatwoot's compiled CSS to swap blue → brand yellow
 * without touching upstream code.
 * ============================================================ */

:root {
  --wiya-yellow:        #f3d244;
  --wiya-yellow-hover:  #d9b934;
  --wiya-yellow-press:  #b8961a;
  --wiya-yellow-soft:   #fef3b8;
  --wiya-yellow-tint:   #faea7a;
  --wiya-on-yellow:     #1a1a1a;
  --wiya-bark:          #2c2820;

  --w-50:  #fef9e0;
  --w-100: #fcf1b3;
  --w-200: #fae980;
  --w-300: #f7df4d;
  --w-400: #f5d52a;
  --w-500: #f3d244;
  --w-600: #d9b934;
  --w-700: #b8961a;
  --w-800: #8a7012;
  --w-900: #5c4a0a;
}

.bg-woot-50   { background-color: #fef9e0 !important; }
.bg-woot-100  { background-color: #fcf1b3 !important; }
.bg-woot-200  { background-color: #fae980 !important; }
.bg-woot-300  { background-color: #f7df4d !important; }
.bg-woot-400  { background-color: #f5d52a !important; }
.bg-woot-500  { background-color: var(--wiya-yellow) !important; }
.bg-woot-600  { background-color: var(--wiya-yellow-hover) !important; }
.bg-woot-700  { background-color: var(--wiya-yellow-press) !important; }
.bg-woot-800  { background-color: #8a7012 !important; }
.bg-woot-900  { background-color: #5c4a0a !important; }

.hover\:bg-woot-500:hover { background-color: var(--wiya-yellow) !important; }
.hover\:bg-woot-600:hover { background-color: var(--wiya-yellow-hover) !important; }
.hover\:bg-woot-700:hover { background-color: var(--wiya-yellow-press) !important; }

.text-woot-500 { color: var(--wiya-yellow-press) !important; }
.text-woot-600 { color: var(--wiya-yellow-press) !important; }
.text-woot-700 { color: #8a7012 !important; }
.hover\:text-woot-500:hover { color: var(--wiya-yellow-press) !important; }
.hover\:text-woot-600:hover { color: var(--wiya-yellow-press) !important; }
.hover\:text-woot-700:hover { color: #8a7012 !important; }
.dark\:text-woot-500 { color: var(--wiya-yellow) !important; }

.border-woot-500 { border-color: var(--wiya-yellow) !important; }
.border-woot-600 { border-color: var(--wiya-yellow-hover) !important; }
.hover\:border-woot-500:hover { border-color: var(--wiya-yellow) !important; }
.hover\:border-woot-700:hover { border-color: var(--wiya-yellow-press) !important; }

.ring-woot-500           { --tw-ring-color: var(--wiya-yellow) !important; }
.focus\:ring-woot-500:focus      { --tw-ring-color: var(--wiya-yellow) !important; }
.focus\:border-woot-500:focus    { border-color: var(--wiya-yellow) !important; }
.focus-visible\:outline-woot-500:focus-visible { outline-color: var(--wiya-yellow) !important; }
.dark\:focus\:ring-woot-500:focus    { --tw-ring-color: var(--wiya-yellow) !important; }
.dark\:focus\:border-woot-500:focus  { border-color: var(--wiya-yellow) !important; }

.text-woot-500.fill-current,
.fill-woot-500 { fill: var(--wiya-yellow-press) !important; }

.text-n-woot-600 { color: var(--wiya-yellow-press) !important; }
.text-n-woot-700 { color: #8a7012 !important; }
.hover\:text-n-woot-700:hover { color: #8a7012 !important; }

button.bg-woot-500,
.bg-woot-500.text-white {
  color: var(--wiya-on-yellow) !important;
}

button.bg-woot-500:hover,
.hover\:bg-woot-600:hover {
  background-color: var(--wiya-yellow-hover) !important;
  color: var(--wiya-on-yellow) !important;
}

.emoji-row__item:focus,
.emoji-row__item:focus-within {
  box-shadow: 0 0 0 1px var(--wiya-yellow) !important;
}

::selection {
  background-color: var(--wiya-yellow-tint);
  color: var(--wiya-on-yellow);
}