/* Wire shares account appearance while retaining its layout and accent colors. */
html[data-theme="dark"] {
  --wire-navy: #d9e2ef;
  --wire-navy-soft: #a7bdd5;
  --wire-cream: var(--bg-page);
  --wire-panel: var(--bg-panel-hi);
  --wire-panel-hi: var(--bg-panel);
  --wire-border: var(--border-color);
  --wire-border-strong: var(--border-strong);
  --wire-text: var(--text-primary);
  --wire-muted: var(--text-muted);
  --wire-btn-bg-white: var(--surface-raised);
  --wire-btn-bg-white-hover: var(--bg-page);
  --wire-btn-shadow-white: 0 2px 8px rgba(0,0,0,.18);
}
html[data-theme="dark"] body.rb-theme-body { background: var(--bg-page) !important; }
html[data-theme="dark"] .wire-shell .accordion-body { background: var(--wire-panel); }
html[data-theme="dark"] .wire-prompt-text-block { background: var(--wire-panel); }
html[data-theme="dark"] .wire-prompt-picker-item { background: var(--wire-panel); }
html[data-theme="dark"] .wire-linked-prompt-item { background: var(--wire-panel); }
html[data-theme="dark"] .wire-card,
html[data-theme="dark"] .wire-form,
html[data-theme="dark"] .wire-panel { background: var(--wire-panel); }
html[data-theme="dark"] .wire-badge { background: var(--wire-panel); }
html[data-theme="dark"] .wire-danger { background: var(--wire-panel); }
html[data-theme="dark"] .wire-tag-admin-item { background: var(--wire-panel); }
html[data-theme="dark"] .wire-shell input[type="checkbox"],
html[data-theme="dark"] .wire-shell input[type="radio"] { background: var(--wire-panel) !important; }
html[data-theme="dark"] .wire-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]),
html[data-theme="dark"] .wire-form textarea,
html[data-theme="dark"] .wire-form select { background: var(--wire-panel) !important; }
html[data-theme="dark"] .wire-select-wrap--traditional select option { background: var(--wire-panel); }
html[data-theme="dark"] .wire-select-wrap:not(.wire-select-wrap--traditional) select option { background: var(--wire-panel); }
html[data-theme="dark"] .wire-message { background: var(--wire-panel); }
html[data-theme="dark"] .wire-comment-bubble { background: var(--wire-panel); }
html[data-theme="dark"] .wire-empty { background: var(--wire-panel); }
html[data-theme="dark"] .wire-identity-panel { background: var(--wire-panel); }
html[data-theme="dark"] .wire-stat { background: var(--wire-panel); }
html[data-theme="dark"] .wire-composer-box { background: var(--wire-panel); }
html[data-theme="dark"] .wire-richtext-wrap { background: var(--wire-panel); }
html[data-theme="dark"] .wire-richtext-wrap .ql-toolbar.ql-snow { background: var(--wire-panel); }
html[data-theme="dark"] .wire-image-thumb { background: var(--wire-panel); }
html[data-theme="dark"] .wire-image-modal-panel { background: var(--wire-panel); }
html[data-theme="dark"] .wire-image-stage { background: var(--wire-panel); }
html[data-theme="dark"] .wire-zoom-icon { background: var(--wire-panel); }
html[data-theme="dark"] .wire-mini-post { background: var(--wire-panel); }
html[data-theme="dark"] .wire-help-emoji { background: var(--wire-panel); }
html[data-theme="dark"] .wire-notification-comment { background: var(--wire-panel); }
html[data-theme="dark"] .wire-badge { color: var(--wire-amber-hi); }
html[data-theme="dark"] .wire-richtext-wrap .ql-stroke { stroke: var(--wire-text); }
html[data-theme="dark"] .wire-richtext-wrap .ql-fill { fill: var(--wire-text); }
html[data-theme="dark"] .wire-richtext-wrap .ql-picker { color: var(--wire-text); }

html[data-theme="dark"] :is(.wire-card, .wire-form, .wire-panel, .wire-stat, .wire-composer-box, .wire-comment-bubble, .wire-identity-panel, .wire-message, .wire-empty, .wire-prompt-picker-item, .wire-linked-prompt-item, .wire-richtext-wrap) { border-color: var(--wire-border); box-shadow: 0 6px 18px rgba(0,0,0,.14); }

/* Wire branding, with shared keyboard/menu behavior but its own destinations. */
.wire-header.rb-workspace-nav { min-height: 88px; --link-color: var(--wire-accent-text); }
.wire-header.rb-workspace-nav .wire-header-brand {
  background: linear-gradient(180deg, #91b9d3 0%, #b6d1e2 62%, #dae8ef 100%);
  border-radius: 10px; padding: 0 8px;
}
.wire-header.rb-workspace-nav .wire-header-brand img { width: 132px; height: 72px; }
.wire-header.rb-workspace-nav .rb-workspace-count { background: #92400e; color: #fff; }
.wire-header.rb-workspace-nav .rb-workspace-dropdown { max-height: calc(100dvh - var(--workspace-nav-height) - 16px); }
@media (max-width: 1200px) {
  .wire-header .rb-workspace-destinations { max-height: calc(100dvh - var(--workspace-nav-height)); }
}

/* Foregrounds and surfaces are separate: a gradient is not a valid color in
   option backgrounds or the final layer of a composite background. */
:root { --wire-accent-text: #92400e; --wire-success-text: #17653a; }
html[data-theme="dark"] { --wire-accent-text: #fbbf24; --wire-success-text: #7ee0b0; color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
html[data-theme="light"] .wire-shell { --wire-muted: #4a5568; }
html[data-theme="light"] .wire-shell .btn-ghost,
html[data-theme="light"] .wire-shell .btn-secondary,
html[data-theme="light"] .wire-shell .btn-ghost:hover,
html[data-theme="light"] .wire-shell .btn-secondary:hover { color: var(--wire-navy) !important; }
html[data-theme="light"] .wire-shell .wire-course-rating-stars {
  --wire-star-empty: #5a6e82; --wire-star-fill: #946200;
}
.wire-shell a:hover, .wire-shell .wire-kicker,
.wire-shell .wire-dropdown-item:hover, .wire-shell .wire-dropdown-item:focus-visible { color: var(--wire-accent-text); }
html[data-theme] .wire-shell .wire-course-completed { color: var(--wire-success-text); }
.wire-shell .btn-danger, .wire-shell .btn-danger:hover { color: #350808 !important; }
html[data-theme="dark"] .wire-shell .accordion-button::after { filter: brightness(0) invert(1); }
.wire-shell .wire-form .errorlist { color: var(--status-error); }
.wire-shell :is(input, textarea)::placeholder { color: var(--wire-muted); opacity: 1; }
.wire-shell :is(a, button, input, select, textarea, summary):focus-visible { outline: 2px solid var(--wire-accent-text); outline-offset: 3px; }

/* Orange selects were turned navy while retaining their black label. Match
   the field's foreground to its final background, including native options. */
.wire-shell .wire-select-wrap:not(.wire-select-wrap--traditional) select {
  background: #f59e0b !important; color: #0a0a0a !important;
}
.wire-shell .wire-select-wrap:not(.wire-select-wrap--traditional) select:focus,
.wire-shell .wire-select-wrap:not(.wire-select-wrap--traditional).is-open select { background: #fcd34d !important; }
html[data-theme="dark"] .wire-shell select option { background: var(--wire-panel); color: var(--wire-text); }

/* Quill loads after the page stylesheet. Specificity must cover its picker,
   tooltip and placeholder defaults as well as the editor's text. */
.wire-shell .wire-richtext-wrap .ql-editor.ql-blank::before { color: var(--wire-muted); }
.wire-shell .wire-richtext-wrap .ql-picker-options,
.wire-shell .wire-richtext-wrap .ql-tooltip { background: var(--wire-panel); color: var(--wire-text); border-color: var(--wire-border); }
.wire-shell .wire-richtext-wrap .ql-tooltip input[type="text"] { color: var(--wire-text); background: var(--wire-panel); }
.wire-shell .wire-richtext-wrap .ql-tooltip a { color: var(--wire-accent-text); }
/* Keep the link editor inside the card on narrow screens, including Save. */
.wire-shell .wire-richtext-wrap .ql-tooltip {
  position: relative; left: 0 !important; top: 0 !important; transform: none;
  margin: 8px; width: calc(100% - 16px); white-space: normal; border-radius: 8px;
}
.wire-shell .wire-richtext-wrap .ql-tooltip:not(.ql-hidden) { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.wire-shell .wire-richtext-wrap .ql-tooltip input[type="text"] { flex: 1 1 120px; min-width: 0; max-width: 100%; }
.wire-shell .wire-richtext-wrap .ql-picker-item:hover,
.wire-shell .wire-richtext-wrap .ql-picker-item.ql-selected,
.wire-shell .wire-richtext-wrap .ql-picker-label:hover,
.wire-shell .wire-richtext-wrap .ql-picker-label.ql-active { color: var(--wire-accent-text); }
.wire-shell .wire-richtext-wrap :is(button:hover, button.ql-active, .ql-picker-label:hover) .ql-stroke { stroke: var(--wire-accent-text); }
.wire-shell .wire-richtext-wrap :is(button:hover, button.ql-active, .ql-picker-label:hover) .ql-fill { fill: var(--wire-accent-text); }