/* ═══════════════════════════════════════════════════════════════════════════
   IBC Intranet – Basis-Stile für HTML-Elemente
   ─────────────────────────────────────────────────────────────────────────────
   Das Projekt nutzt ausschließlich Tailwind. Bootstrap war zuletzt nur noch als
   CSS eingebunden und lieferte praktisch nur diese Element-Grundstile (kein
   Bootstrap-JavaScript, kaum Bootstrap-Klassen). Sie stehen jetzt hier – mit
   denselben Werten und derselben Spezifität, damit sich an bestehenden Seiten
   nichts verschiebt.

   Tailwinds eigenes Preflight bleibt abgeschaltet (tailwind.config.js), weil es
   Überschriften, Listen und Bilder anders zurücksetzt als die Seiten erwarten.

   Einbinden VOR theme.css – an der Stelle, an der vorher Bootstrap stand –,
   damit die Kaskade unverändert bleibt.
   ═══════════════════════════════════════════════════════════════════════════ */

*,
*::before,
*::after {
    box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
    :root {
        scroll-behavior: smooth;
    }
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans",
        "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
        "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

hr {
    margin: 1rem 0;
    color: inherit;
    border: 0;
    border-top: 1px solid;
    opacity: 0.25;
}

/* ── Überschriften & Text ──────────────────────────────────────────────── */

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

h1 { font-size: calc(1.375rem + 1.5vw); }
h2 { font-size: calc(1.325rem + 0.9vw); }
h3 { font-size: calc(1.3rem + 0.6vw); }
h4 { font-size: calc(1.275rem + 0.3vw); }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }

@media (min-width: 1200px) {
    h1 { font-size: 2.5rem; }
    h2 { font-size: 2rem; }
    h3 { font-size: 1.75rem; }
    h4 { font-size: 1.5rem; }
}

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

abbr[title] {
    text-decoration: underline dotted;
    cursor: help;
    text-decoration-skip-ink: none;
}

address {
    margin-bottom: 1rem;
    font-style: normal;
    line-height: inherit;
}

ol, ul {
    padding-left: 2rem;
}

ol, ul, dl {
    margin-top: 0;
    margin-bottom: 1rem;
}

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

dt { font-weight: 700; }

dd {
    margin-bottom: 0.5rem;
    margin-left: 0;
}

blockquote { margin: 0 0 1rem; }

b, strong { font-weight: bolder; }

small { font-size: 0.875em; }

mark {
    padding: 0.1875em;
    color: #212529;
    background-color: #fff3cd;
}

sub, sup {
    position: relative;
    font-size: 0.75em;
    line-height: 0;
    vertical-align: baseline;
}
sub { bottom: -0.25em; }
sup { top: -0.5em; }

a {
    color: #0d6efd;
    text-decoration: underline;
}
a:hover {
    color: #0a58ca;
}
a:not([href]):not([class]),
a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}

/* ── Code ──────────────────────────────────────────────────────────────── */

pre, code, kbd, samp {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 1em;
}

pre {
    display: block;
    margin-top: 0;
    margin-bottom: 1rem;
    overflow: auto;
    font-size: 0.875em;
}
pre code {
    font-size: inherit;
    color: inherit;
    word-break: normal;
}

code {
    font-size: 0.875em;
    color: #d63384;
    word-wrap: break-word;
}
a > code { color: inherit; }

kbd {
    padding: 0.1875rem 0.375rem;
    font-size: 0.875em;
    color: #fff;
    background-color: #212529;
    border-radius: 0.25rem;
}
kbd kbd {
    padding: 0;
    font-size: 1em;
}

/* ── Medien & Tabellen ─────────────────────────────────────────────────── */

figure { margin: 0 0 1rem; }

img, svg { vertical-align: middle; }

table {
    caption-side: bottom;
    border-collapse: collapse;
}

caption {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    color: rgba(33, 37, 41, 0.75);
    text-align: left;
}

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

thead, tbody, tfoot, tr, td, th {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
}

/* ── Formulare ─────────────────────────────────────────────────────────── */

label { display: inline-block; }

button { border-radius: 0; }

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

input, button, select, optgroup, textarea {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

button, select { text-transform: none; }

[role="button"] { cursor: pointer; }

select { word-wrap: normal; }
select:disabled { opacity: 1; }

[list]:not([type="date"]):not([type="datetime-local"]):not([type="month"]):not([type="week"]):not([type="time"])::-webkit-calendar-picker-indicator {
    display: none !important;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
    appearance: button;
}
button:not(:disabled),
[type="button"]:not(:disabled),
[type="reset"]:not(:disabled),
[type="submit"]:not(:disabled) {
    cursor: pointer;
}

::-moz-focus-inner {
    padding: 0;
    border-style: none;
}

textarea { resize: vertical; }

fieldset {
    min-width: 0;
    padding: 0;
    margin: 0;
    border: 0;
}

legend {
    float: left;
    width: 100%;
    padding: 0;
    margin-bottom: 0.5rem;
    font-size: calc(1.275rem + 0.3vw);
    line-height: inherit;
}
@media (min-width: 1200px) {
    legend { font-size: 1.5rem; }
}
legend + * { clear: left; }

::-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 {
    padding: 0;
}

::-webkit-inner-spin-button { height: auto; }

[type="search"] {
    -webkit-appearance: textfield;
    appearance: textfield;
    outline-offset: -2px;
}

::-webkit-search-decoration { -webkit-appearance: none; }

::-webkit-color-swatch-wrapper { padding: 0; }

::file-selector-button {
    font: inherit;
    -webkit-appearance: button;
    appearance: button;
}

output { display: inline-block; }

iframe { border: 0; }

summary {
    display: list-item;
    cursor: pointer;
}

progress { vertical-align: baseline; }

[hidden] { display: none !important; }


/* ═══════════════════════════════════════════════════════════════════════════
   Gleichnamige Hilfsklassen – Werte aus der Bootstrap-Zeit
   ─────────────────────────────────────────────────────────────────────────────
   Tailwind und Bootstrap teilen sich Klassennamen wie px-4, mb-3, gap-3,
   border, rounded oder shadow-sm – mit unterschiedlichen Werten
   (Bootstrap „3" = 1rem, Tailwind „3" = .75rem). Bootstrap setzte seine Werte
   mit !important, deshalb galten auf allen Seiten bisher diese hier.

   Beim Entfernen von Bootstrap bleiben sie erhalten, damit sich auf den
   22 betroffenen Seiten (≈ 870 Verwendungen) kein Abstand und kein Rahmen
   verschiebt. Werte, Reihenfolge und !important entsprechen exakt dem
   bisherigen Stand (ausgelesen aus Bootstrap 5.3.3).

   Für NEUE Oberflächen: Tailwind-Klassen ohne diese Namenskollision nutzen
   (z. B. px-6 statt px-4 für 1.5rem) – oder bewusst mit diesen Werten rechnen.
   ═══════════════════════════════════════════════════════════════════════════ */

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    color: #212529;
    overflow-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.175);
    border-radius: 0.375rem;
}
.card > hr {
    margin-right: 0;
    margin-left: 0;
}

.shadow      { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; }
.shadow-sm   { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; }
.shadow-lg   { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; }
.shadow-none { box-shadow: none !important; }

.border   { border: 1px solid #dee2e6 !important; }
.border-0 { border: 0 !important; }

.m-0 { margin: 0 !important; }
.m-1 { margin: .25rem !important; }
.m-2 { margin: .5rem !important; }
.m-3 { margin: 1rem !important; }
.m-4 { margin: 1.5rem !important; }
.m-5 { margin: 3rem !important; }
.m-auto { margin: auto !important; }

.mx-0 { margin-right: 0 !important; margin-left: 0 !important; }
.mx-1 { margin-right: .25rem !important; margin-left: .25rem !important; }
.mx-2 { margin-right: .5rem !important; margin-left: .5rem !important; }
.mx-3 { margin-right: 1rem !important; margin-left: 1rem !important; }
.mx-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important; }
.mx-5 { margin-right: 3rem !important; margin-left: 3rem !important; }
.mx-auto { margin-right: auto !important; margin-left: auto !important; }

.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-1 { margin-top: .25rem !important; margin-bottom: .25rem !important; }
.my-2 { margin-top: .5rem !important; margin-bottom: .5rem !important; }
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: .25rem !important; }
.mt-2 { margin-top: .5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mt-auto { margin-top: auto !important; }

.me-0 { margin-right: 0 !important; }
.me-1 { margin-right: .25rem !important; }
.me-2 { margin-right: .5rem !important; }
.me-3 { margin-right: 1rem !important; }
.me-4 { margin-right: 1.5rem !important; }
.me-5 { margin-right: 3rem !important; }
.me-auto { margin-right: auto !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: .25rem !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.mb-auto { margin-bottom: auto !important; }

.ms-0 { margin-left: 0 !important; }
.ms-1 { margin-left: .25rem !important; }
.ms-2 { margin-left: .5rem !important; }
.ms-3 { margin-left: 1rem !important; }
.ms-4 { margin-left: 1.5rem !important; }
.ms-5 { margin-left: 3rem !important; }
.ms-auto { margin-left: auto !important; }

.p-0 { padding: 0 !important; }
.p-1 { padding: .25rem !important; }
.p-2 { padding: .5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }

.px-0 { padding-right: 0 !important; padding-left: 0 !important; }
.px-1 { padding-right: .25rem !important; padding-left: .25rem !important; }
.px-2 { padding-right: .5rem !important; padding-left: .5rem !important; }
.px-3 { padding-right: 1rem !important; padding-left: 1rem !important; }
.px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; }
.px-5 { padding-right: 3rem !important; padding-left: 3rem !important; }

.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1 { padding-top: .25rem !important; padding-bottom: .25rem !important; }
.py-2 { padding-top: .5rem !important; padding-bottom: .5rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: .25rem !important; }
.pt-2 { padding-top: .5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }

.pe-0 { padding-right: 0 !important; }
.pe-1 { padding-right: .25rem !important; }
.pe-2 { padding-right: .5rem !important; }
.pe-3 { padding-right: 1rem !important; }
.pe-4 { padding-right: 1.5rem !important; }
.pe-5 { padding-right: 3rem !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: .25rem !important; }
.pb-2 { padding-bottom: .5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }

.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: .25rem !important; }
.ps-2 { padding-left: .5rem !important; }
.ps-3 { padding-left: 1rem !important; }
.ps-4 { padding-left: 1.5rem !important; }
.ps-5 { padding-left: 3rem !important; }

.gap-0 { gap: 0 !important; }
.gap-1 { gap: .25rem !important; }
.gap-2 { gap: .5rem !important; }
.gap-3 { gap: 1rem !important; }
.gap-4 { gap: 1.5rem !important; }
.gap-5 { gap: 3rem !important; }

.pe-auto { pointer-events: auto !important; }

.rounded   { border-radius: 0.375rem !important; }
.rounded-0 { border-radius: 0 !important; }
