/* ============================================================
   XRechnungen – Utilities: Scrollbar, Selection, Focus-Rings,
                            Dark-Mode Overrides, Misc Fixes
   ============================================================ */

/* ── Scrollbar (Webkit) ──────────────────────────────────── */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--surface-alt); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--primary); }

/* ── Text selection ──────────────────────────────────────── */
::selection { background: color-mix(in srgb, var(--primary) 30%, transparent); color: var(--fg); }

/* ── Focus rings (all interactive elements) ─────────────── */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

/* ── Checkbox & radio: scheme-aware accent ───────────────── */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
    accent-color: var(--primary);
}

/* ── Table row hover ─────────────────────────────────────── */
table tbody tr:hover td { background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }

/* ── Dropdown option checked state ──────────────────────── */
select option:checked {
    background: color-mix(in srgb, var(--primary) 20%, var(--surface));
    color: var(--fg);
}

/* ── Dark-mode utilities ─────────────────────────────────── */
html[data-theme="dark"] table th {
    background: var(--surface-alt);
    color: var(--fg);
}
html[data-theme="dark"] table tbody tr:hover td {
    background: color-mix(in srgb, var(--primary) 8%, var(--surface));
}
html[data-theme="dark"] ::placeholder { color: var(--muted); opacity: 0.7; }
html[data-theme="dark"] code {
    background: rgba(255,255,255,0.08);
    color: var(--accent);
    border-color: rgba(255,255,255,0.12);
}

/* ── Disabled-Defaults (a11y, DESIGN_SYSTEM §11) ─────────── */
button:disabled, .btn:disabled, .btn[disabled],
input:disabled, select:disabled, textarea:disabled,
[aria-disabled="true"] {
    opacity: .5;
    cursor: not-allowed;
}
button:disabled:hover, .btn:disabled:hover {
    border-color: var(--border); color: inherit; background: var(--surface);
    transform: none; box-shadow: none;
}

/* ── Reduced Motion (Pflicht, DESIGN_SYSTEM §12) ─────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}