/* Shared hover layer for search/filter/sort toolbar buttons across share-site surfaces. */

:root {
  --fdc-shared-toolbar-accent: var(--primary, var(--fdc-shell-primary, var(--fdc-color-accent, #3b82f6)));
  --fdc-shared-toolbar-accent-strong: var(--primary-strong, var(--fdc-shared-toolbar-accent));
  --fdc-shared-toolbar-hover-border: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 28%, white);
  --fdc-shared-toolbar-hover-bg: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 8%, white);
  --fdc-shared-toolbar-hover-color: var(--fdc-shared-toolbar-accent);
  --fdc-shared-toolbar-hover-shadow: 0 10px 22px color-mix(in srgb, var(--fdc-shared-toolbar-accent) 16%, transparent);
  --fdc-shared-toolbar-sort-hover-border: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 18%, white);
  --fdc-shared-toolbar-sort-hover-bg: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 5%, white);
  --fdc-shared-toolbar-sort-hover-color: inherit;
  --fdc-shared-toolbar-sort-hover-shadow: 0 8px 18px color-mix(in srgb, var(--fdc-shared-toolbar-accent) 10%, transparent);
  --fdc-shared-toolbar-primary-hover-shadow: 0 12px 24px color-mix(in srgb, var(--fdc-shared-toolbar-accent) 24%, transparent);
}

:root[data-theme='dark'] {
  --fdc-shared-toolbar-hover-border: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 42%, transparent);
  --fdc-shared-toolbar-hover-bg: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 18%, transparent);
  --fdc-shared-toolbar-hover-color: #dbeafe;
  --fdc-shared-toolbar-hover-shadow: 0 12px 28px rgba(15, 23, 42, 0.28);
  --fdc-shared-toolbar-sort-hover-border: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 24%, transparent);
  --fdc-shared-toolbar-sort-hover-bg: color-mix(in srgb, var(--fdc-shared-toolbar-accent) 10%, transparent);
  --fdc-shared-toolbar-sort-hover-shadow: 0 10px 22px rgba(15, 23, 42, 0.22);
  --fdc-shared-toolbar-primary-hover-shadow: 0 16px 30px color-mix(in srgb, var(--fdc-shared-toolbar-accent) 28%, transparent);
}

.btn.fdc-toolbar-action-btn,
.news-filter-trigger,
.posts-filter-trigger,
.post-write-filter-trigger,
body.trade-market-page .trade-market-dropdown-trigger,
.map-filter-toolbar .filter-trigger,
.shared-card-detail-modal .modal-head-actions .btn,
.shared-card-detail-modal .modal-head-builder-btn,
.shared-card-detail-modal .modal-head-action,
.comment-sort-trigger,
.modal-comments-sort-trigger,
.news-refresh-button,
.posts-create-button,
body.trade-market-page .trade-market-toolbar-btn,
.post-write-button {
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.btn.fdc-toolbar-action-btn.fdc-toolbar-secondary-btn:hover:not(:disabled),
.btn.fdc-toolbar-action-btn.fdc-toolbar-secondary-btn:focus-visible,
.news-refresh-button:hover,
.news-refresh-button:focus-visible,
body.trade-market-page .trade-market-refresh-btn:hover,
body.trade-market-page .trade-market-refresh-btn:focus-visible,
body.trade-market-page .trade-market-reset-btn:hover,
body.trade-market-page .trade-market-reset-btn:focus-visible,
.shared-card-detail-modal .modal-head-actions .btn.ghost:hover,
.shared-card-detail-modal .modal-head-actions .btn.ghost:focus-visible,
.post-write-button.is-subtle:hover,
.post-write-button.is-subtle:focus-visible {
  border-color: var(--fdc-shared-toolbar-hover-border);
  background: var(--fdc-shared-toolbar-hover-bg);
  color: var(--fdc-shared-toolbar-hover-color);
  box-shadow: var(--fdc-shared-toolbar-hover-shadow);
  text-decoration: none;
}

.btn.fdc-toolbar-action-btn.fdc-search-submit:hover:not(:disabled),
.btn.fdc-toolbar-action-btn.fdc-search-submit:focus-visible,
.btn.fdc-toolbar-action-btn.primary:hover:not(:disabled),
.btn.fdc-toolbar-action-btn.primary:focus-visible,
#searchBtn.btn.primary.fdc-search-submit:hover:not(:disabled),
#searchBtn.btn.primary.fdc-search-submit:focus-visible,
#modalCardCommentSubmitButton.modal-action-btn.primary:hover:not(:disabled),
#modalCardCommentSubmitButton.modal-action-btn.primary:focus-visible,
.shared-card-detail-modal .modal-head-actions .btn.primary:hover:not(:disabled),
.shared-card-detail-modal .modal-head-actions .btn.primary:focus-visible,
.shared-card-detail-modal .modal-head-builder-btn:hover:not(:disabled),
.shared-card-detail-modal .modal-head-builder-btn:focus-visible,
.shared-card-detail-modal .modal-head-action:hover:not(:disabled),
.shared-card-detail-modal .modal-head-action:focus-visible,
.posts-create-button:hover,
.posts-create-button:focus-visible,
.post-write-button.is-primary:hover,
.post-write-button.is-primary:focus-visible {
  border-color: var(--fdc-shared-toolbar-accent-strong);
  background: var(--fdc-shared-toolbar-accent-strong);
  color: #fff;
  box-shadow: var(--fdc-shared-toolbar-primary-hover-shadow);
  transform: none;
  text-decoration: none;
}

.btn.filter-trigger:not(.toolbar-sort-button):not(.rune-slot-trigger):hover:not([disabled]),
.btn.filter-trigger:not(.toolbar-sort-button):not(.rune-slot-trigger):focus-visible,
.news-filter-trigger:not(.toolbar-sort-button):hover,
.news-filter-trigger:not(.toolbar-sort-button):focus-visible,
.posts-filter-trigger:not(.toolbar-sort-button):hover,
.posts-filter-trigger:not(.toolbar-sort-button):focus-visible,
.post-write-filter-trigger:hover,
.post-write-filter-trigger:focus-visible,
body.trade-market-page .trade-market-custom-select:not(.toolbar-sort-dropdown) .trade-market-dropdown-trigger:hover,
body.trade-market-page .trade-market-custom-select:not(.toolbar-sort-dropdown) .trade-market-dropdown-trigger:focus-visible,
.map-filter-toolbar .filter-trigger:not(.toolbar-sort-button):hover,
.map-filter-toolbar .filter-trigger:not(.toolbar-sort-button):focus-visible {
  border-color: var(--fdc-shared-toolbar-hover-border);
  background: var(--fdc-shared-toolbar-hover-bg);
  color: var(--fdc-shared-toolbar-hover-color);
  box-shadow: var(--fdc-shared-toolbar-hover-shadow);
}

.btn.filter-trigger.toolbar-sort-button:hover:not([disabled]),
.btn.filter-trigger.toolbar-sort-button:focus-visible,
.btn.filter-trigger.toolbar-sort-button[aria-expanded='true'],
.toolbar-sort-dropdown.is-open .btn.filter-trigger.toolbar-sort-button,
.toolbar-sort-dropdown #boardSortButton.toolbar-sort-button:hover:not([disabled]),
.toolbar-sort-dropdown #boardSortButton.toolbar-sort-button:focus-visible,
.toolbar-sort-dropdown.is-open #boardSortButton.toolbar-sort-button,
#boardSortButton.toolbar-sort-button:hover:not([disabled]),
#boardSortButton.toolbar-sort-button:focus-visible,
#boardSortButton.toolbar-sort-button[aria-expanded='true'],
#boardSortButton.toolbar-sort-button.is-active,
.news-filter-trigger.toolbar-sort-button:hover,
.news-filter-trigger.toolbar-sort-button:focus-visible,
.news-filter-trigger.toolbar-sort-button[aria-expanded='true'],
.toolbar-sort-dropdown.is-open .news-filter-trigger.toolbar-sort-button,
.posts-filter-trigger.toolbar-sort-button:hover,
.posts-filter-trigger.toolbar-sort-button:focus-visible,
.posts-filter-trigger.toolbar-sort-button[aria-expanded='true'],
.toolbar-sort-dropdown.is-open .posts-filter-trigger.toolbar-sort-button,
body.trade-market-page .trade-market-sort-wrap.toolbar-sort-dropdown .trade-market-dropdown-trigger:hover,
body.trade-market-page .trade-market-sort-wrap.toolbar-sort-dropdown .trade-market-dropdown-trigger:focus-visible,
body.trade-market-page .trade-market-sort-wrap.toolbar-sort-dropdown .trade-market-dropdown-trigger[aria-expanded='true'],
body.trade-market-page .trade-market-sort-wrap.toolbar-sort-dropdown.is-open .trade-market-dropdown-trigger,
.map-filter-toolbar .toolbar-sort-button.sort-trigger:hover,
.map-filter-toolbar .toolbar-sort-button.sort-trigger:focus-visible,
.map-filter-toolbar .toolbar-sort-button.sort-trigger[aria-expanded='true'],
.map-filter-toolbar .toolbar-sort-dropdown.is-open .toolbar-sort-button.sort-trigger,
.map-filter-toolbar #sortBtn.toolbar-sort-button:hover,
.map-filter-toolbar #sortBtn.toolbar-sort-button:focus-visible,
.map-filter-toolbar #sortBtn.toolbar-sort-button[aria-expanded='true'],
.map-filter-toolbar #sortDropdown.toolbar-sort-dropdown.is-open #sortBtn.toolbar-sort-button {
  border-color: var(--fdc-sort-trigger-hover-border, var(--fdc-shared-toolbar-sort-hover-border));
  background: var(--fdc-sort-trigger-hover-bg, var(--fdc-shared-toolbar-sort-hover-bg));
  color: var(--fdc-sort-trigger-hover-color, var(--fdc-shared-toolbar-sort-hover-color));
  box-shadow: var(--fdc-sort-trigger-hover-shadow, var(--fdc-shared-toolbar-sort-hover-shadow));
}

.comment-sort-trigger,
.modal-comments-sort-trigger {
  border-radius: 999px;
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.comment-sort-trigger:hover,
.comment-sort-trigger:focus-visible,
.comment-sort-dropdown.is-open .comment-sort-trigger,
.comment-sort-trigger[aria-expanded='true'],
.modal-comments-sort-trigger:hover,
.modal-comments-sort-trigger:focus-visible,
.modal-comments-sort-dropdown.is-open .modal-comments-sort-trigger,
.modal-comments-sort-trigger[aria-expanded='true'] {
  background: var(--fdc-shared-toolbar-hover-bg);
  color: var(--fdc-shared-toolbar-hover-color);
  box-shadow: var(--fdc-shared-toolbar-hover-shadow);
  transform: translateY(-1px);
}