/* ========================================================================
   SIENNA ACCESSIBILITY WIDGET: brand theme
   Widget: /js/sienna-accessibility.umd.js (Sienna 2.1.0, MIT, Clue-patched).
   The widget has no colour option, so its default blue is overridden here.
   Colours come from the site's own --primary-color / --primary-color-dark
   (client.css), so this file is identical on every Clue site.
   Selectors carry an extra class or element so they outrank the widget's
   own <style> tags, which load later in the document.
   Button size and position stay as before: bottom-left corner (the widget
   default) and the 0.75 scale in clue.css; the chat bubble sits bottom-right.
   ======================================================================== */

:root {
  --asw-brand: var(--primary-color, #0848ca);
  --asw-brand-dark: var(--primary-color-dark, var(--asw-brand));
  --asw-brand-tint: color-mix(in srgb, var(--asw-brand) 8%, #fff);
  --asw-brand-line: color-mix(in srgb, var(--asw-brand) 20%, transparent);
}

/* Launcher button */
.asw-container .asw-menu-btn {
  background: var(--asw-brand) !important;
  outline-color: var(--asw-brand) !important;
  padding: 0 !important;
}

/* The launcher's decorative outline is permanent, so keyboard focus gets
   an extra white-and-dark ring outside it. */
.asw-container .asw-menu-btn:focus-visible {
  box-shadow: 0 0 0 9px #fff, 0 0 0 13px #1a1a1a !important;
}

/* Menu header */
.asw-container .asw-menu-header {
  background: linear-gradient(135deg, var(--asw-brand), var(--asw-brand-dark)) !important;
}
.asw-container .asw-menu-header svg {
  fill: var(--asw-brand) !important;
}

/* Cards and section titles */
.asw-container .asw-card {
  border-color: var(--asw-brand-line) !important;
}
.asw-container .asw-card-title {
  color: var(--asw-brand) !important;
}

/* Feature buttons */
.asw-container .asw-btn:hover {
  border-color: var(--asw-brand-line) !important;
}
.asw-container .asw-btn.asw-selected {
  border-color: var(--asw-brand) !important;
  background: var(--asw-brand-tint) !important;
}
.asw-container .asw-btn.asw-selected svg,
.asw-container .asw-btn.asw-selected span {
  fill: var(--asw-brand) !important;
  color: var(--asw-brand) !important;
}
.asw-container .asw-btn.asw-selected::after {
  background: var(--asw-brand) !important;
}
.asw-container .asw-plus:hover,
.asw-container .asw-minus:hover {
  border-color: var(--asw-brand) !important;
}

/* Profiles */
.asw-container .asw-profile-btn:hover,
.asw-container .asw-profile-btn.asw-selected {
  border-color: var(--asw-brand) !important;
}
.asw-container .asw-profile-icon {
  color: var(--asw-brand) !important;
  background: var(--asw-brand-tint) !important;
}
.asw-container .asw-profile-btn.asw-selected .asw-profile-toggle {
  background: var(--asw-brand) !important;
}

/* Reset button at the bottom of the menu */
.asw-container .asw-menu-reset-footer-btn {
  background: var(--asw-brand) !important;
}

/* Page Structure dialog (appended to <body>, outside the widget container) */
html body .asw-structure-header {
  background: linear-gradient(135deg, var(--asw-brand), var(--asw-brand-dark)) !important;
}
html body .asw-tab-btn:hover,
html body .asw-tab-btn.asw-active,
html body .asw-action-btn:hover {
  color: var(--asw-brand) !important;
}
html body .asw-tab-btn.asw-active::after {
  background: var(--asw-brand) !important;
}
html body .asw-structure-item:hover,
html body .asw-structure-item:focus-within {
  background: var(--asw-brand-tint) !important;
  border-color: var(--asw-brand-line) !important;
}
html body .asw-structure-nested-wrapper {
  border-left-color: var(--asw-brand-line) !important;
}
/* The vendor fades "Visit link" to 40%, which fails text contrast. */
html body .asw-structure-actions {
  opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  .asw-container .asw-btn:hover {
    transform: none !important;
  }
  .asw-container *,
  .asw-structure-modal,
  .asw-structure-overlay,
  .asw-super-focus-highlight {
    transition: none !important;
    animation: none !important;
  }
}
