/* ==========================================================================
   Niwa Chatbot - Neutral Theme
   --------------------------------------------------------------------------
   Adaptive charcoal glass that remains legible over both light and dark sites.
   Applied when: data-niwa-theme="neutral" on .niwa-widget
   ========================================================================== */

.niwa-widget[data-niwa-theme="neutral"] {
  /* Brand */
  --niwa-color-primary:             #E8E6E1;
  --niwa-color-primary-active:      #FFFFFF;
  --niwa-color-primary-subtle:      rgba(255, 255, 255, 0.12);
  --niwa-color-accent:              #E8DED0;
  --niwa-color-accent-hover:        #FFFFFF;

  /* Surfaces */
  --niwa-color-surface-base:        #4D4D49;
  --niwa-color-surface-raised:      rgba(255, 255, 255, 0.13);
  --niwa-color-surface-overlay:     rgba(255, 255, 255, 0.08);
  --niwa-color-surface-sunken:      rgba(0, 0, 0, 0.22);

  /* Text */
  --niwa-color-text-primary:        #FFFFFF;
  --niwa-color-text-secondary:      rgba(255, 255, 255, 0.72);
  --niwa-color-text-tertiary:       rgba(255, 255, 255, 0.48);
  --niwa-color-text-inverse:        #242522;
  --niwa-color-text-link:           #FFFFFF;

  /* Borders and bubbles */
  --niwa-color-border-default:      rgba(255, 255, 255, 0.20);
  --niwa-color-border-subtle:       rgba(255, 255, 255, 0.10);
  --niwa-color-border-focus:        rgba(255, 255, 255, 0.75);
  --niwa-color-bubble-bot:          rgba(255, 255, 255, 0.13);
  --niwa-color-bubble-bot-text:     #FFFFFF;
  --niwa-color-bubble-user:         rgba(255, 255, 255, 0.14);
  --niwa-color-bubble-user-text:    #FFFFFF;
  --niwa-color-message-time:        rgba(255, 255, 255, 0.50);

  /* In-chat products */
  --niwa-product-panel-bg:          rgba(255, 255, 255, 0.13);
  --niwa-product-control-bg:        rgba(255, 255, 255, 0.11);
  --niwa-product-control-active:    rgba(255, 255, 255, 0.11);
  --niwa-product-chip-bg:           rgba(255, 255, 255, 0.085);
  --niwa-product-chip-active-bg:    rgba(255, 255, 255, 0.14);
  --niwa-product-action-bg:         rgba(255, 255, 255, 0.11);
  --niwa-product-close-bg:          rgba(255, 255, 255, 0.11);
  --niwa-product-text:              #FFFFFF;
  --niwa-product-muted:             rgba(255, 255, 255, 0.78);
  --niwa-product-selected-border:   #FFFFFF;

  /* Elevation and glass */
  --niwa-shadow-sm:     0 1px 3px rgba(0, 0, 0, 0.20);
  --niwa-shadow-md:     0 5px 16px rgba(0, 0, 0, 0.24);
  --niwa-shadow-lg:     0 14px 38px rgba(0, 0, 0, 0.28);
  --niwa-shadow-xl:     0 20px 54px rgba(0, 0, 0, 0.34);
  --niwa-glass-bg:      rgba(34, 35, 33, 0.38);
  --niwa-glass-blur:    blur(36px) saturate(0.78);
  --niwa-glass-border:  1px solid rgba(255, 255, 255, 0.30);
  --niwa-glass-shadow:  0 18px 50px rgba(0, 0, 0, 0.26), 0 1px 0 rgba(255, 255, 255, 0.12) inset;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph, .niwa-center) {
  background: var(--niwa-glass-bg);
  backdrop-filter: var(--niwa-glass-blur);
  -webkit-backdrop-filter: var(--niwa-glass-blur);
  border: var(--niwa-glass-border);
  box-shadow: var(--niwa-glass-shadow);
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph, .niwa-center):not(.niwa-morph--open):not(.niwa-center--open):hover {
  background: rgba(34, 35, 33, 0.44);
  border-color: rgba(255, 255, 255, 0.34);
}

.niwa-widget[data-niwa-theme="neutral"] .niwa-morph__wordmark {
  filter: invert(1);
  opacity: 0.55;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__close, .niwa-center__close) {
  color: #FFFFFF;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__close, .niwa-center__close):hover {
  background: rgba(255, 255, 255, 0.10);
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__textarea, .niwa-center__textarea),
.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__textarea, .niwa-center__textarea)::placeholder {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  opacity: 1;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__send, .niwa-center__send) {
  background: rgba(18, 20, 19, 0.56) !important;
  color: #FFFFFF !important;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__send--disabled, .niwa-center__send--disabled) {
  background: rgba(28, 30, 29, 0.48) !important;
  color: #FFFFFF !important;
  opacity: 0.52 !important;
}

.niwa-widget[data-niwa-theme="neutral"] .niwa-message__time {
  color: rgba(255, 255, 255, 0.50);
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__body, .niwa-center__body) {
  scrollbar-color: rgba(255, 255, 255, 0.24) transparent;
}

.niwa-widget[data-niwa-theme="neutral"] :is(.niwa-morph__label, .niwa-center__label) {
  color: rgba(255, 255, 255, 0.72);
}

.niwa-attention-bubble[data-niwa-theme="neutral"] {
  background: rgba(34, 35, 33, 0.42);
  backdrop-filter: blur(40px) saturate(0.78);
  -webkit-backdrop-filter: blur(40px) saturate(0.78);
  border-color: rgba(255, 255, 255, 0.16);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.26), 0 1px 0 rgba(255, 255, 255, 0.12) inset;
  color: #FFFFFF;
}

.niwa-attention-bubble[data-niwa-theme="neutral"] :is(.niwa-bubble-title, .niwa-bubble-text) {
  color: #FFFFFF;
}

.niwa-attention-bubble[data-niwa-theme="neutral"] .niwa-bubble-avatar {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.10);
}

.niwa-attention-bubble[data-niwa-theme="neutral"] .niwa-bubble-close {
  background: rgba(255, 255, 255, 0.10);
  color: rgba(255, 255, 255, 0.72);
}

.niwa-attention-bubble[data-niwa-theme="neutral"] .niwa-bubble-action-btn {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.20);
  color: #FFFFFF;
}
