/*
  Custom overrides by EOX
  Some of these things are considered bugs, to be fixed by the upstream library,
  some others are considered our "opinion"
*/

/* Fix block size on .no-space helper class */
.list.no-space > li,
.list.no-space > li > details > summary {
  min-block-size: 0rem;
  padding: 0 1rem;
}

/* Adjust small checkbox and radio size */
:is(.checkbox, .radio, .switch).small {
  --_size: 1.2rem;
}

/* Ajust checkbox box-shadow size to fit with other elements such as icons */
:is(.checkbox, .radio):is(:hover) > input:not(:disabled) + span:after,
:is(.checkbox, .radio) > input:not(:disabled):is(:focus) + span:after {
  box-shadow: 0 0 0 0.4rem currentColor;
}

/* Fix checkbox border radius if .no-round or .square helpers applied */
:is(.checkbox, .radio, .switch):is(.no-round, .square) > span:before,
:is(.checkbox, .radio, .switch):is(.no-round, .square) > span > i,
:is(.checkbox, .radio):is(.no-round, .square) > span:after {
  border-radius: 0.15rem;
}

/* Explicitly add scrollbar styling to the .scroll helper class */
.scroll::-webkit-scrollbar,
.scroll::-webkit-scrollbar-thumb,
.scroll::-webkit-scrollbar-button {
  background: none;
  inline-size: 0.4rem;
  block-size: 0.4rem;
}

.scroll:is(:hover, :focus)::-webkit-scrollbar-thumb {
  background: var(--outline);
  border-radius: 1rem;
}

/* Add tiny version of headings */
h1.tiny {
  font-size: 2.6875rem;
}
h2.tiny {
  font-size: 1.9375rem;
}
h3.tiny {
  font-size: 1.375rem;
}
h4.tiny {
  font-size: 1.125rem;
}
h5.tiny {
  font-size: 0.875rem;
}
h6.tiny {
  font-size: 0.625rem;
}

/* Make links underlined by default and change color on hover
see also https://github.com/beercss/beercss/issues/76 */
.link {
  text-decoration: underline;
}
.link:hover {
  color: var(--on-primary-container) !important;
}

/* Smoothly rotate icons in details summary if they have the 'rotate' class */
details summary .rotate {
  transition: transform 0.3s ease;
}
details[open]:not(.is-closing) summary .rotate {
  transform: rotate(180deg);
}

details.fast-animate summary .rotate {
  transition: transform 0.15s ease;
}
details.slow-animate summary .rotate {
  transition: transform 0.5s ease;
}
details.no-animate summary .rotate {
  transition: none;
}