/* =========================================
   RescueFleet – HESK Custom Overrides
   nutzt Farben aus app.css
   ========================================= */

/* Skiplink vollständig ausblenden (Fallback zu JS) */
a.skiplink {
    display: none !important;
}

/* Allgemeiner Text & Hintergrund */
body {
    background: var(--rf-light);
    color: var(--rf-text);
}

/* Links */
a {
    color: var(--rf-accent);
}

a:hover {
    color: var(--rf-accent-strong);
}

/* Buttons – Primär */
.btn-primary,
button.primary {
    background: var(--rf-navy) !important;
    border-color: var(--rf-navy) !important;
    color: #fff !important;
}

.btn-primary:hover {
    background: var(--rf-accent-strong) !important;
}

/* Buttons – Secondary / Cancel */
.btn-secondary,
.btn-cancel {
    background: transparent !important;
    border: 1px solid var(--rf-border) !important;
    color: var(--rf-muted) !important;
}

.btn-secondary:hover {
    background: var(--rf-border) !important;
}

/* Formulare */
input,
select,
textarea {
    background: var(--rf-surface);
    color: var(--rf-text);
    border: 1px solid var(--rf-border);
    border-radius: 12px;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--rf-accent);
    box-shadow: 0 0 0 3px var(--rf-focus);
    outline: none;
}

/* Tabellen */
table {
    background: var(--rf-surface);
    color: var(--rf-text);
}

th {
    color: var(--rf-muted);
    border-bottom: 1px solid var(--rf-border);
}

td {
    border-bottom: 1px solid var(--rf-border);
}

/* Statusfarben */
.status-success,
.badge-success {
    background: var(--rf-success);
    color: #fff;
}

.status-warning,
.badge-warning {
    background: var(--rf-warning);
    color: #111;
}

.status-error,
.badge-error {
    background: var(--rf-red);
    color: #fff;
}

/* Cards / Boxen */
.card,
.panel,
.box {
    background: var(--rf-surface);
    border: 1px solid var(--rf-border);
    border-radius: 16px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}

/* Dark Mode Feinjustierung */
html[data-bs-theme="dark"] body {
    background: var(--rf-light);
}

html[data-bs-theme="dark"] .card {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.45);
}