/**
 * CKUT/Amandla front-end isolation layer.
 *
 * CKUT's theme intentionally uses broad element selectors such as header, nav,
 * h1, p, a, img and audio. The Amandla plugin keeps CKUT's stylesheet loaded so
 * the native footer, marquee, popup and thermometer continue to work. This
 * layer only neutralizes broad element-level rules inside the Amandla shell.
 * The CKUT footer lives outside .amandla-plugin-scope and is never reset here.
 */

.amandla-plugin-scope {
  position: relative;
  display: block;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  isolation: isolate;
}

.amandla-plugin-scope,
.amandla-plugin-scope *,
.amandla-plugin-scope *::before,
.amandla-plugin-scope *::after {
  box-sizing: border-box;
}

/* Typography rules in CKUT main.css are global. Component CSS takes over next. */
.amandla-plugin-scope :where(h1, h2, h3, h4, h5, h6, p) {
  margin: 0;
  padding: 0;
  color: inherit;
  font: inherit;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: normal;
  line-height: inherit;
  text-transform: none;
}

.amandla-plugin-scope :where(small) {
  font: inherit;
  font-size: inherit;
}

.amandla-plugin-scope :where(b, strong) {
  font-family: inherit;
  font-weight: 700;
}

/* Link behavior is owned entirely by Amandla inside its shell. */
.amandla-plugin-scope :where(a) {
  color: inherit;
  background: transparent;
  text-decoration: none;
}

/* Prevent CKUT's global image and main-image rules from defining project media. */
.amandla-plugin-scope :where(img, picture, video, iframe) {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  object-fit: initial;
}

/* CKUT main.css sets every audio element to position:absolute. */
.amandla-plugin-scope :where(audio) {
  position: static;
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* Normalize controls before the Amandla component rules are applied. */
.amandla-plugin-scope :where(button, input, select, textarea) {
  box-sizing: border-box;
  color: inherit;
  font: inherit;
}

.amandla-plugin-scope :where(button) {
  margin: 0;
}

.amandla-plugin-scope :where(ul, ol) {
  margin: 0;
  padding: 0;
}

.amandla-plugin-scope :where(hr) {
  width: 100%;
  height: 1px;
  margin: 0;
  padding: 0;
  border: 0;
  background: currentColor;
}

/* Restore a visible keyboard focus state after CKUT's global :focus-visible rule. */
.amandla-plugin-scope :where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}