/* Butik Wallpaper consultation theme. */
:root {
  --bwp-chat-bg: #140d20;
  --bwp-chat-panel: #211530;
  --bwp-chat-field: #2d1d40;
  --bwp-chat-user: #452468;
  --bwp-chat-border: #8565a6;
  --bwp-chat-text: #fff8ff;
  --bwp-chat-muted: #d9c6e8;
  --bwp-chat-link: #ebcaff;
  --bwp-chat-yellow: #ffed00;
}

body.bwp-consultation,
.bwp-chat,
.embedded-product-chat {
  color-scheme: dark;
  background: var(--bwp-chat-bg);
  color: var(--bwp-chat-text);
  border-color: var(--bwp-chat-border);
}

.bwp-consultation .welcome,
.bwp-consultation .product-pick,
.bwp-consultation .composer,
.bwp-consultation .rollcalc,
.bwp-chat .chat-start,
.bwp-chat .chat-compose {
  background: var(--bwp-chat-panel);
  border-color: var(--bwp-chat-border);
}

.bwp-consultation .chat,
.bwp-chat .chat-feed,
.embedded-product-chat .product-chat-frame {
  background: var(--bwp-chat-bg);
}

.bwp-consultation .header,
.bwp-chat .chat-head,
.embedded-product-chat > h2 {
  background: #35076b;
  border-color: var(--bwp-chat-border);
  color: var(--bwp-chat-text);
}

.bwp-consultation :is(p, .tag, .caption, .chatName, .header small, .form-footer, #handoffNote),
.bwp-chat :is(.chat-help, .chat-notice, .chat-message small) {
  color: var(--bwp-chat-muted);
}

.bwp-consultation :is(.rollcalc strong, .form-banner h1),
.bwp-chat :is(h2, h3, label) {
  color: var(--bwp-chat-text);
}

.bwp-consultation :is(.form-footer a, .handoff),
.bwp-chat :is(.chat-message a, .chat-bottom a),
.embedded-product-chat .product-chat-open {
  color: var(--bwp-chat-link);
}

.bwp-consultation :is(input:not([type="checkbox"]), textarea, select),
.bwp-chat :is(.chat-start input:not([type="checkbox"]), .chat-start select, .chat-compose textarea) {
  background: var(--bwp-chat-field);
  border-color: var(--bwp-chat-border);
  color: var(--bwp-chat-text) !important;
  -webkit-text-fill-color: currentColor;
}

.bwp-consultation :is(input, textarea)::placeholder,
.bwp-chat :is(input, textarea)::placeholder {
  color: var(--bwp-chat-muted);
  opacity: 1;
  -webkit-text-fill-color: currentColor;
}

.bwp-consultation :is(.composebox, .trial, .reset, .chips button),
.bwp-chat :is(.chat-quick button, .chat-reset, .chat-message > div) {
  background: var(--bwp-chat-field);
  color: var(--bwp-chat-text);
  border-color: var(--bwp-chat-border);
}

.bwp-chat .chat-quick,
.bwp-consultation .rollcalc :is(th, td) {
  border-color: var(--bwp-chat-border);
}

.bwp-consultation .user .bubble,
.bwp-chat .chat-message.user > div {
  background: var(--bwp-chat-user);
  color: var(--bwp-chat-text);
}

.bwp-consultation :is(.primary, .send),
.bwp-chat :is(.chat-start button, .chat-compose button, .chat-action) {
  background: var(--bwp-chat-yellow);
  color: #290849;
}

.bwp-consultation .avatar {
  background: var(--bwp-chat-user);
  color: var(--bwp-chat-yellow);
}

.bwp-consultation :is(button, a, input, textarea, select, summary):focus-visible,
.bwp-chat :is(button, a, input, textarea, select, summary):focus-visible,
.embedded-product-chat .product-chat-open:focus-visible {
  outline: 2px solid var(--bwp-chat-yellow);
  outline-offset: 3px;
}

.bwp-chat .chat-error {
  color: #ffb4c2 !important;
}

.bwp-consultation .bwp-pinterest-reference,
.bwp-consultation .bwp-pinterest-reference :is(button, input, a) {
  background-color: var(--bwp-chat-field) !important;
  border-color: var(--bwp-chat-border) !important;
  color: var(--bwp-chat-text) !important;
}
