/*!
 * bootstrapxxs.css
 * Tiny Bootstrap-compatible normalizer / reset
 * Designed for very small projects and xxs layouts
 */

/* Root variables – kompatibel zu Bootstrap 5 */
:root {
  --bs-font-sans-serif: system-ui, -apple-system, BlinkMacSystemFont,
                        "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --bs-font-monospace:  SFMono-Regular, Menlo, Monaco, Consolas,
                        "Liberation Mono", "Courier New", monospace;

  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #ffffff;
  --bs-body-text-align: left;

  --bs-link-color-rgb: 13, 110, 253;
  --bs-link-hover-color-rgb: 10, 88, 202;

  --bs-border-width: 1px;
  --bs-border-radius: .375rem;
  --bs-dark-rgb: 33, 37, 41;
  --bs-emphasis-color-rgb: 33, 37, 41;
}

/* Box-Model – alles Border-Box */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* HTML / Body Basislayout */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--bs-body-font-family);
  font-size: var(--bs-body-font-size);
  font-weight: var(--bs-body-font-weight);
  line-height: var(--bs-body-line-height);
  color: var(--bs-body-color);
  text-align: var(--bs-body-text-align);
  background-color: var(--bs-body-bg);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Block-Elemente mit sauberem Start */
main {
  display: block;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
}

h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.1rem; }
h6 { font-size: 1rem; }

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

hr {
  height: 0;
  margin: 1rem 0;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, .1);
}

/* Listen */
ul, ol {
  margin-top: 0;
  margin-bottom: 1rem;
  padding-left: 2rem;
}

li > ul,
li > ol {
  margin-bottom: 0;
}

/* Links */
a {
  color: rgba(var(--bs-link-color-rgb), 1);
  text-decoration: underline;
  background-color: transparent;
}

a:hover {
  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
  text-decoration: underline;
}

a:not([href]):not([class]) {
  color: inherit;
  text-decoration: none;
}

/* Typografie-Feintuning */
b, strong {
  font-weight: bolder;
}

small {
  font-size: 80%;
}

sub, sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub { bottom: -.25em; }
sup { top: -.5em; }

/* Code & Monospace */
pre, code, kbd, samp {
  font-family: var(--bs-font-monospace);
  font-size: .875em;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
}

/* Bilder & Medien */
img, svg, video, canvas {
  max-width: 100%;
  height: auto;
}

img {
  border-style: none;
}

picture {
  display: inline-block;
}

/* Formulare – sanfter Reset ohne Styles zu zerstören */
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  color: inherit;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="submit"],
[type="reset"] {
  -webkit-appearance: button;
}

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

button[disabled],
input[disabled],
select[disabled],
textarea[disabled] {
  cursor: default;
}

textarea {
  resize: vertical;
}

/* Tabellen */
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

th {
  text-align: inherit;
  text-align: -webkit-match-parent;
}

/* Iframes */
iframe {
  border: 0;
}

/* Details / Summary */
details {
  display: block;
}

summary {
  display: list-item;
}

/* Visuelle Hilfsklassen */
[hidden] {
  display: none !important;
}

.clearfix::after {
  display: block;
  clear: both;
  content: "";
}

/* Kleine Hilfsklasse für Dark-Backgrounds */
.bg-dark {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
  color: #fff;
}