/* Shared close/clear controls: the X is drawn in CSS, so font and encoding cannot corrupt it. */
button:is(
  [aria-label="Close"],
  [aria-label^="Close "],
  [title="Close"]
),
header > button:is(
  .hunt-close,
  .hunt-splitter-close,
  .prey-selection-close,
  [data-party-application-close],
  [data-charm-picker-close],
  [data-trade-cancel]
),
.bestiary-titlebar > #close-bestiary {
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  display: block !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  border: 1px solid #676b63 !important;
  border-radius: 0 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-shadow: none !important;
  background:
    linear-gradient(45deg, transparent 44%, #e8ddbd 45% 55%, transparent 56%) center / 12px 12px no-repeat,
    linear-gradient(-45deg, transparent 44%, #e8ddbd 45% 55%, transparent 56%) center / 12px 12px no-repeat,
    linear-gradient(#474b46, #242723) !important;
  box-shadow: inset 0 0 0 1px #171916 !important;
  cursor: pointer !important;
  opacity: 1 !important;
}

button:is(
  [aria-label="Close"],
  [aria-label^="Close "],
  [title="Close"]
):hover,
header > button:is(
  .hunt-close,
  .hunt-splitter-close,
  .prey-selection-close,
  [data-party-application-close],
  [data-charm-picker-close],
  [data-trade-cancel]
):hover,
.bestiary-titlebar > #close-bestiary:hover {
  border-color: #c3a34e !important;
  filter: brightness(1.16) !important;
}

button:is(
  [aria-label="Close"],
  [aria-label^="Close "],
  [title="Close"]
):focus,
header > button:is(
  .hunt-close,
  .hunt-splitter-close,
  .prey-selection-close,
  [data-party-application-close],
  [data-charm-picker-close],
  [data-trade-cancel]
):focus,
.bestiary-titlebar > #close-bestiary:focus {
  outline: none !important;
}

button:is(
  [aria-label="Close"],
  [aria-label^="Close "],
  [title="Close"]
):focus-visible,
header > button:is(
  .hunt-close,
  .hunt-splitter-close,
  .prey-selection-close,
  [data-party-application-close],
  [data-charm-picker-close],
  [data-trade-cancel]
):focus-visible,
.bestiary-titlebar > #close-bestiary:focus-visible {
  outline: none !important;
  border-color: #e4c56e !important;
  box-shadow: inset 0 0 0 1px #171916, 0 0 0 2px #9b7a2f !important;
}

button:is([title="Clear search"], [aria-label="Clear search"], [data-market-clear]) {
  color: transparent !important;
  font-size: 0 !important;
  background:
    linear-gradient(45deg, transparent 43%, #d8d4c5 44% 56%, transparent 57%) center / 10px 10px no-repeat,
    linear-gradient(-45deg, transparent 43%, #d8d4c5 44% 56%, transparent 57%) center / 10px 10px no-repeat,
    linear-gradient(#363a36, #1c1f1c) !important;
}
