/*
 * Compat layer: undo Tabler/Bootstrap "reboot" defaults and the few Tabler
 * classes whose names clash with the clay theme (avatar, btn, nav, toast,
 * pagination, modal-backdrop, icon, chat-bubble). `revert` falls back to the
 * browser default — the baseline the clay theme was designed on — while the
 * unlayered clay rules in style.css still apply on top.
 *
 * Elements that carry presentational attributes (svg fill/stroke/width,
 * img width/height, textarea rows...) only get targeted property resets,
 * because `all: revert` would discard those attributes too.
 */
@layer compat {
  html, body,
  h1, h2, h3, h4, h5, h6, p, hr, abbr, address, blockquote, figure,
  ol, ul, li, dl, dt, dd, b, strong, small, mark, sub, sup, a,
  pre, code, kbd, samp,
  table, caption, thead, tbody, tfoot, tr, th, td,
  label, legend, fieldset, output, summary, progress,
  .avatar, .btn, .btn-danger, .btn-sm, .nav, .pagination, .toast, .modal-backdrop, .icon,
  .chat-bubble, .chat-bubble-body, .active, .disabled {
    all: revert;
  }

  .avatar::before, .avatar::after, .btn::before, .btn::after, .nav::before, .nav::after,
  .toast::before, .toast::after, .chat-bubble::before, .chat-bubble::after {
    all: revert;
  }

  img, svg {
    vertical-align: revert;
  }

  button, input, optgroup, select, textarea {
    margin: revert;
    font-family: revert;
    font-size: revert;
    line-height: revert;
    text-transform: revert;
    border-radius: revert;
    resize: revert;
    word-wrap: revert;
    -webkit-appearance: revert;
    appearance: revert;
  }

  button:focus:not(:focus-visible) {
    outline: revert;
  }

  ::placeholder {
    color: revert;
    opacity: revert;
  }

  ::-webkit-datetime-edit-fields-wrapper,
  ::-webkit-datetime-edit-text,
  ::-webkit-datetime-edit-minute,
  ::-webkit-datetime-edit-hour-field,
  ::-webkit-datetime-edit-day-field,
  ::-webkit-datetime-edit-month-field,
  ::-webkit-datetime-edit-year-field,
  ::-webkit-inner-spin-button,
  ::-webkit-search-decoration,
  ::-webkit-color-swatch-wrapper,
  ::file-selector-button {
    all: revert;
  }

  [type="search"] {
    outline-offset: revert;
    -webkit-appearance: revert;
    appearance: revert;
  }

  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: revert;
  }
}