/**
 * Responsive Layout für /uebersicht (Mobile & Tablet).
 */

#links.uebersicht-panel {
    padding: 0.15rem 0.25rem 0.5rem;
    --uebersicht-control-font-size: 0.75rem;
    --uebersicht-control-line-height: 1.35;
    --uebersicht-control-pad-y: 0.15em;
    --uebersicht-control-pad-x: 0.4em;
    --uebersicht-control-border: 1px solid #9ca3af;
    --uebersicht-control-radius: 4px;
    --uebersicht-control-bg: #f3f4f6;
    --uebersicht-control-color: #1f2937;
    --uebersicht-control-height: calc(var(--uebersicht-control-font-size) * 1.725 + 2px);
}

/* Einzeilige Chips: gleiche Außenmaße (Suche, Filter-Tags, Buttons) */
#links #searchfield1,
#links .fwlink-filter-badges .uebersicht-cat-link,
#links .uebersicht-chip-btn {
    box-sizing: border-box;
    height: var(--uebersicht-control-height);
    min-height: var(--uebersicht-control-height);
    max-height: var(--uebersicht-control-height);
    margin: 0;
    padding: 0 var(--uebersicht-control-pad-x);
    font-size: var(--uebersicht-control-font-size) !important;
    font-weight: 500;
    line-height: calc(var(--uebersicht-control-height) - 2px);
    border: var(--uebersicht-control-border);
    border-radius: var(--uebersicht-control-radius);
    font-family: inherit;
}

#links .fwlink-filter-badges .uebersicht-cat-link {
    display: inline-flex;
    align-items: center;
    color: var(--uebersicht-control-color);
    background: var(--uebersicht-control-bg);
}

#links #searchfield1 {
    display: block;
}

#links.datatable-wide {
    padding-top: 0;
    padding-bottom: 0;
}

#Notifications:not(:has(.alert)) {
    padding: 0 !important;
    height: 0;
}

#Notifications:has(.alert) {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#links .uebersicht-toolbar-row {
    padding-top: 0.15rem !important;
    padding-bottom: 0.35rem !important;
}

#links.uebersicht-panel {
    overflow: visible;
}

/* Kein horizontaler Scroll der Tabelle – nur Tabellenbereich, nicht Filter-Dropdown */
#links .uebersicht-table-wrap {
    overflow-x: clip;
    max-width: 100%;
}

#links .uebersicht-table-wrap table {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
}

#links .uebersicht-table-wrap th,
#links .uebersicht-table-wrap td {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Vor List.js: nur erste 20 sichtbare Zeilen anzeigen */
#links:not(.list-initialized) tbody.list > tr.fwlink-row-initial-hidden {
    display: none;
}

/* Versteckte Hilfsspalten (Suche/List.js) – keine Breite */
#links .tags_kuerzel_round_id,
#links .links_beschreibung {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden;
}

/*
 * 12-Spalten-Raster (wie Bootstrap): 2 + 1 + 4 + 4 + 1 = 12
 * Titel | Link | Kategorie | Beschreibung | QR/Klicks
 */
#links .uebersicht-col-title {
    width: 16.666667%;
}

#links .uebersicht-col-link {
    width: 8.333333%;
}

#links .uebersicht-col-category {
    width: 33.333333%;
}

#links .uebersicht-col-desc {
    width: 33.333333%;
    font-size: 0.6875rem;
    line-height: 1.4;
    color: #868e96;
    font-weight: 400;
    word-break: break-word;
}

#links .uebersicht-col-qr {
    width: 8.333333%;
}

/* Eingeloggt: Bearbeiten = 1/12, Beschreibung = 3/12 (statt 4) */
#links:has(.uebersicht-col-modify) .uebersicht-col-desc {
    width: 25%;
}

#links .uebersicht-col-modify {
    width: 8.333333%;
}

#links .uebersicht-col-db {
    width: 8.333333%;
}

#links .uebersicht-col-target {
    width: 8.333333%;
}

/* Eingeloggt: DB-Update + Bearbeiten – Beschreibung etwas breiter */
#links:has(.uebersicht-col-db) .uebersicht-col-desc {
    width: 25%;
}

#links:has(.uebersicht-col-db) .uebersicht-col-category {
    width: 22.916667%;
}

#links:has(.uebersicht-col-db):not(.fwlink-target-check-active) .uebersicht-col-title {
    width: 25%;
}

#links.fwlink-target-check-active:has(.uebersicht-col-db) .uebersicht-col-title {
    width: 8.333333%;
}

/* Ziel-Status erst nach Klick auf „Ziele prüfen“ */
#links:not(.fwlink-target-check-active) .uebersicht-col-target {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden;
}

#links .uebersicht-col-db {
    font-size: 0.75rem;
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
}

/* Tabelle: ruhigeres Erscheinungsbild (Mobile & Desktop) */
#links .table {
    --bs-table-striped-bg: #f8f9fb;
    --bs-table-hover-bg: #f0f3f7;
    border-color: var(--fw-border, #dee2e6);
}

#links .table > :not(caption) > * > * {
    border-color: #e9ecef;
}

#links tbody tr.tr_disabled > * {
    background-color: #fee2e2 !important;
    box-shadow: none;
}

#links .table-hover > tbody > tr.tr_disabled:hover > * {
    background-color: #fecaca !important;
}

#links .uebersicht-title-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
}

#links .uebersicht-disabled-tag {
    display: inline-flex;
    align-items: center;
    font-size: var(--uebersicht-control-font-size);
    font-weight: 500;
    line-height: var(--uebersicht-control-line-height);
    padding: var(--uebersicht-control-pad-y) var(--uebersicht-control-pad-x);
    color: #7f1d1d;
    background-color: #fecaca;
    border: 1px solid #ef4444;
    border-radius: var(--uebersicht-control-radius);
    white-space: nowrap;
}

/* Tabellenkopf: max. 2 Zeilen, horizontal und vertikal zentriert */
#links thead th.theadfont {
    vertical-align: middle !important;
    text-align: center !important;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.25;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

#links thead th.theadfont .uebersicht-th-label {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    line-height: 1.25;
    word-break: break-word;
    hyphens: auto;
    max-width: 100%;
    margin-inline: auto;
    text-align: center;
}

#links thead th.sort.asc::after,
#links thead th.sort.desc::after {
    content: none;
    padding: 0;
}

#links thead th.sort.asc .uebersicht-th-label::after {
    content: "\002B73";
    padding-left: 0.15em;
    white-space: nowrap;
}

#links thead th.sort.desc .uebersicht-th-label::after {
    content: "\002B71";
    padding-left: 0.15em;
    white-space: nowrap;
}

/* Dokumenttitel: Hauptlink, dezent */
#links .uebersicht-col-title {
    line-height: 1.45;
}

#links .uebersicht-col-title a {
    color: var(--fw-accent, #1e3a5f);
    text-decoration: none;
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.4;
    word-break: break-word;
    hyphens: auto;
}

#links .uebersicht-col-title a:hover,
#links .uebersicht-col-title a:focus-visible {
    color: var(--fw-primary, #b91c1c);
    text-decoration: underline;
    text-underline-offset: 2px;
}

#links .tr_disabled .uebersicht-col-title a {
    color: #991b1b;
}

/* Kurzlink: Code-Optik, nicht als zweiter „lauter“ Link */
#links .uebersicht-col-link a {
    text-decoration: none;
}

#links .uebersicht-col-link .links_href {
    display: inline-block;
    font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.35;
    color: #4a5568;
    background-color: #eef1f5;
    border: 1px solid #e2e6eb;
    border-radius: 0.3rem;
    padding: 0.12rem 0.35rem;
    word-break: break-word;
    letter-spacing: 0.01em;
}

#links .uebersicht-col-link a:hover .links_href,
#links .uebersicht-col-link a:focus-visible .links_href {
    color: var(--fw-accent, #1e3a5f);
    background-color: #e4e9ef;
    border-color: #cfd6de;
}

#links .uebersicht-copy-btn .btn {
    opacity: 0.55;
    border-radius: 0.25rem;
    transition: opacity 0.15s ease, background-color 0.15s ease;
}

#links .uebersicht-copy-btn .btn:hover,
#links .uebersicht-copy-btn .btn:focus-visible {
    opacity: 1;
    background-color: #eef1f5;
}

/* Kategorie-Spalte: kompakte Textlinks, kein Pill-Badge */
#links .uebersicht-col-category {
    vertical-align: middle;
}

#links .uebersicht-category-cell {
    max-width: 100%;
    line-height: 1.35;
}

#links .uebersicht-category-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.35rem;
    max-width: 100%;
    word-break: break-word;
}

#links .uebersicht-category-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.35rem;
    min-width: 0;
}

#links .uebersicht-cat-link {
    margin: 0;
    box-sizing: border-box;
    min-height: var(--uebersicht-control-height);
    padding: var(--uebersicht-control-pad-y) var(--uebersicht-control-pad-x);
    font-size: var(--uebersicht-control-font-size);
    font-weight: 500;
    line-height: var(--uebersicht-control-line-height);
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    text-decoration: none;
    text-align: left;
    white-space: normal;
    word-break: break-word;
    color: #1f2937;
    border: 1px solid #9ca3af;
    border-radius: 4px;
    background: #f3f4f6;
    transition: color 0.12s ease, border-color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
}

#links .uebersicht-cat-link:hover,
#links .uebersicht-cat-link:focus-visible {
    outline: none;
    color: #111827;
    border-color: #6b7280;
    background: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

#links .uebersicht-cat-link--sub {
    font-weight: 400;
    color: #374151;
    border-color: #b8c0ca;
    background: #f9fafb;
}

#links .uebersicht-cat-link--intern {
    font-weight: 600;
    color: #111827;
    border-color: #6b7280;
    background: #e5e7eb;
}

#links .uebersicht-cat-details {
    display: contents;
}

#links .uebersicht-cat-details[hidden] {
    display: none !important;
}

#links .uebersicht-category-tags:not(:has(.uebersicht-cat-details[open])) .uebersicht-cat-link--folded {
    display: none;
}

#links .uebersicht-cat-details[open] .uebersicht-cat-more {
    order: 99;
}

#links .uebersicht-cat-more {
    list-style: none;
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    padding: 0.22em 0.5em;
    text-decoration: none;
    border: 1px dashed #9ca3af;
    border-radius: 999px;
    background: #f3f4f6;
    transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

#links .uebersicht-cat-more[data-count="0"] {
    display: none !important;
}

#links .uebersicht-cat-more::before {
    content: '+' attr(data-count);
}

#links .uebersicht-cat-details[open] .uebersicht-cat-more::before {
    content: '-' attr(data-count);
}

#links .uebersicht-cat-more::-webkit-details-marker {
    display: none;
}

#links .uebersicht-cat-more::marker {
    content: '';
}

#links .uebersicht-cat-more:hover,
#links .uebersicht-cat-details[open] .uebersicht-cat-more {
    color: #111827;
    background: #e5e7eb;
    border-color: #6b7280;
}

#links .uebersicht-cat-link--selected {
    background-color: green !important;
    border-color: #0d6e0d !important;
    color: #fff !important;
}

#links .uebersicht-cat-link--selected:hover,
#links .uebersicht-cat-link--selected:focus-visible {
    background-color: #0a5c0a !important;
    border-color: #084d08 !important;
    color: #fff !important;
}

#links .uebersicht-toolbar-row,
#links .uebersicht-filter-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    position: relative;
    z-index: 40;
    overflow: visible;
}

#links .uebersicht-toolbar-row {
    flex-wrap: nowrap;
    align-items: center;
}

#links .uebersicht-toolbar-row > .uebersicht-toolbar-search {
    min-width: 0;
}

#links .uebersicht-toolbar-row > .uebersicht-action-buttons {
    flex: 0 0 auto;
}

#links .uebersicht-toolbar-sidebar,
#links .uebersicht-filter-sidebar {
    display: flex;
    align-items: center;
    line-height: var(--uebersicht-control-line-height);
}

#links .uebersicht-toolbar-sidebar .uebersicht-logic-wrap,
#links .uebersicht-filter-sidebar .uebersicht-filter-label {
    width: auto;
    max-width: 100%;
}

#links .uebersicht-filter-main {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
    min-width: 0;
    overflow: visible;
}

@media (max-width: 991.98px) {
    #links .uebersicht-filter-row {
        flex-wrap: nowrap;
        align-items: center;
        gap: 0.35rem;
    }

    #links .uebersicht-toolbar-sidebar,
    #links .uebersicht-filter-sidebar,
    #links .uebersicht-pagination-bar {
        flex: 0 0 auto;
        width: auto !important;
        max-width: none;
    }

    #links .uebersicht-filter-main {
        flex: 1 1 auto;
        min-width: 0;
        width: auto !important;
        max-width: none;
    }

    #links .uebersicht-filter-label {
        white-space: nowrap;
    }
}

/* Chip-Buttons: Tags, Pagination, Aktionen */
#links .uebersicht-chip-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    white-space: nowrap;
    color: #1f2937;
    border: 1px solid #9ca3af;
    border-radius: 4px;
    background: #f3f4f6;
    transition: color 0.12s ease, border-color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
}

#links .uebersicht-chip-btn:hover,
#links .uebersicht-chip-btn:focus-visible {
    outline: none;
    color: #111827;
    border-color: #6b7280;
    background: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

#links .uebersicht-logic-wrap {
    display: inline-flex;
    align-items: flex-start;
    width: auto;
}

#links .uebersicht-logic-label {
    line-height: var(--uebersicht-control-line-height);
}

#links .uebersicht-logic-switch {
    position: relative;
    display: inline-grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
    flex-shrink: 0;
    box-sizing: border-box;
    padding: 2px;
    border: var(--uebersicht-control-border);
    border-radius: var(--uebersicht-control-radius);
    background: var(--uebersicht-control-bg);
}

#links .uebersicht-logic-switch-thumb {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 2px;
    width: calc(50% - 2px);
    border: 1px solid #0d6e0d;
    border-radius: calc(var(--uebersicht-control-radius) - 1px);
    background: green;
    transition: transform 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
    pointer-events: none;
    z-index: 0;
}

#links .uebersicht-logic-switch[data-logic="AND"] .uebersicht-logic-switch-thumb {
    transform: translateX(calc(100% + 2px));
}

#links .uebersicht-logic-option {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: var(--uebersicht-control-pad-y) var(--uebersicht-control-pad-x);
    min-width: 0;
    font-size: var(--uebersicht-control-font-size) !important;
    font-weight: 500;
    line-height: var(--uebersicht-control-line-height);
    text-align: center;
    white-space: nowrap;
    color: var(--uebersicht-control-color);
    border: 0;
    border-radius: calc(var(--uebersicht-control-radius) - 1px);
    background: transparent;
    cursor: pointer;
    transition: color 0.18s ease;
}

#links .uebersicht-logic-option[aria-pressed="true"] {
    color: #fff;
}

#links .uebersicht-logic-option:not([aria-pressed="true"]):hover,
#links .uebersicht-logic-option:not([aria-pressed="true"]):focus-visible {
    outline: none;
    color: #111827;
}

#links .uebersicht-logic-option:focus-visible {
    outline: 2px solid rgba(13, 110, 13, 0.35);
    outline-offset: 1px;
}

#links #downloadbutton,
#links #fwlink_check_targets_btn {
    background-color: #f3f4f6;
    color: #1f2937;
}

#links #searchfield1 {
    width: 100%;
    max-width: 100%;
    color: var(--uebersicht-control-color);
    background-color: var(--uebersicht-control-bg);
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
}

#links #searchfield1::placeholder {
    color: #6b7280;
    opacity: 1;
}

#links #searchfield1:hover {
    border-color: #6b7280;
    background-color: #e5e7eb;
}

#links #searchfield1:focus {
    color: #111827;
    border-color: #6b7280;
    background-color: #fff;
    box-shadow: 0 0 0 0.12rem rgba(107, 114, 128, 0.12);
}

#links .uebersicht-action-buttons .uebersicht-chip-btn {
    flex: 0 0 auto;
    min-width: auto;
}

@media (min-width: 768px) {
    #links .uebersicht-action-buttons .uebersicht-chip-btn {
        flex: 0 1 auto;
    }
}

/* Kategorie-Filter: gleiches Layout wie Kategorie-Spalte in der Tabelle */
#links .fwlink-filter-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.35rem;
    max-width: 100%;
}

#links .fwlink-filter-multiselect-wrap {
    display: none !important;
    position: relative;
    width: 100%;
    z-index: 30;
}

#links .uebersicht-filter-main.fwlink-filter-mode-multiselect .fwlink-filter-badges {
    display: none !important;
}

#links .uebersicht-filter-main.fwlink-filter-mode-multiselect {
    overflow: visible;
}

#links .uebersicht-filter-main.fwlink-filter-mode-multiselect .fwlink-filter-multiselect-wrap {
    display: block !important;
}

#links .uebersicht-filter-main.fwlink-filter-mode-multiselect #fwlink-filter-mobile {
    display: none !important;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.25rem;
    box-sizing: border-box;
    width: 100%;
    height: var(--uebersicht-control-height);
    min-height: var(--uebersicht-control-height);
    max-height: var(--uebersicht-control-height);
    padding: 0 var(--uebersicht-control-pad-x);
    padding-right: 2rem;
    overflow: visible;
    font-size: var(--uebersicht-control-font-size) !important;
    font-weight: 500;
    line-height: calc(var(--uebersicht-control-height) - 2px);
    color: var(--uebersicht-control-color);
    background-color: var(--uebersicht-control-bg);
    border: var(--uebersicht-control-border);
    border-radius: var(--uebersicht-control-radius);
    box-shadow: none;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown:hover {
    border-color: #6b7280;
    background-color: #e5e7eb;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown:focus-within {
    color: #111827;
    border-color: #6b7280;
    background-color: #fff;
    box-shadow: 0 0 0 0.12rem rgba(107, 114, 128, 0.12);
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown.fwlink-has-active-filters {
    border-color: #0d6e0d;
    box-shadow: 0 0 0 0.12rem rgba(0, 128, 0, 0.15);
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown > span.optext,
#links .fwlink-filter-multiselect-wrap .multiselect-dropdown > span.multiselect-placeholder,
#links .fwlink-filter-multiselect-wrap .multiselect-dropdown > span.maxselected {
    display: none !important;
}

#links .fwlink-filter-multiselect-wrap .fwlink-multiselect-chips {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    gap: 0.25rem;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

#links .fwlink-filter-multiselect-wrap .fwlink-multiselect-chips span.multiselect-placeholder,
#links .fwlink-filter-multiselect-wrap .fwlink-multiselect-chips span.fwlink-filter-chip {
    margin: 0;
    padding: 0 0.35em;
    font-size: var(--uebersicht-control-font-size) !important;
    line-height: calc(var(--uebersicht-control-height) - 6px);
    border-radius: 3px;
    white-space: nowrap;
    flex-shrink: 0;
}

#links .fwlink-filter-multiselect-wrap .fwlink-multiselect-chips span.multiselect-placeholder {
    color: #6b7280;
    background: transparent;
    border: 0;
}

#links .fwlink-filter-multiselect-wrap .fwlink-multiselect-chips span.fwlink-filter-chip {
    color: #fff;
    background: #0d6e0d;
    border: 1px solid #0a5c0a;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list div.checked {
    background-color: #0d6e0d;
    color: #fff;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list div.checked:hover,
#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list div.checked.multiselect-option-active {
    background-color: #0a5c0a;
    color: #fff;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list div.checked label {
    color: #fff;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list-wrapper {
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    width: 100%;
    min-width: 100%;
    z-index: 300;
    overflow: hidden;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list {
    max-height: min(32rem, 70vh);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #bec4ca transparent;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list::-webkit-scrollbar {
    width: 8px;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list::-webkit-scrollbar-thumb {
    background-color: #bec4ca;
    border-radius: 4px;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-search {
    font-size: 0.75rem !important;
}

#links .fwlink-filter-multiselect-wrap .multiselect-dropdown-list div {
    font-size: 0.75rem;
}

#links #fwlink-filter-mobile.fwlink-has-active-filters {
    border-color: green;
    box-shadow: 0 0 0 0.15rem rgba(0, 128, 0, 0.2);
}

#links #fwlink-filter-mobile option.fwlink-option-active {
    background-color: green;
    color: #fff;
}

@media (max-width: 991.98px) {
    #links.uebersicht-panel {
        --uebersicht-control-pad-y: 0.08em;
        --uebersicht-control-pad-x: 0.28em;
        --uebersicht-control-height: calc(var(--uebersicht-control-font-size) * 1.58 + 2px);
    }

    #links #fwlink-filter-mobile {
        width: 100%;
        margin-bottom: 0;
        box-sizing: border-box;
        height: var(--uebersicht-control-height);
        min-height: var(--uebersicht-control-height);
        max-height: var(--uebersicht-control-height);
        font-size: var(--uebersicht-control-font-size) !important;
        font-weight: 500;
        line-height: calc(var(--uebersicht-control-height) - 2px);
        padding: 0 1.75rem 0 var(--uebersicht-control-pad-x);
        color: var(--uebersicht-control-color);
        background-color: var(--uebersicht-control-bg);
        border: var(--uebersicht-control-border);
        border-radius: var(--uebersicht-control-radius);
        box-shadow: none;
    }

    #links .uebersicht-col-desc {
        display: none !important;
        width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    /* 4 + 1 + 6 + 1 = 12 (ohne Beschreibung) */
    #links .uebersicht-col-title {
        width: 33.333333%;
    }

    #links .uebersicht-col-link {
        width: 8.333333%;
    }

    #links .uebersicht-col-category {
        width: 50%;
    }

    #links .uebersicht-col-qr {
        width: 8.333333%;
    }

    /* Zusatzspalten auf Mobile ausblenden */
    #links .uebersicht-col-db,
    #links .uebersicht-col-target {
        display: none !important;
        width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    /* Eingeloggt: 3 + 1 + 5 + 1 + 1 = 12 */
    #links:has(.uebersicht-col-modify) .uebersicht-col-title {
        width: 25%;
    }

    #links:has(.uebersicht-col-modify) .uebersicht-col-category {
        width: 41.666667%;
    }

    #links:has(.uebersicht-col-modify) .uebersicht-col-modify {
        width: 8.333333%;
        display: table-cell !important;
    }

    /* Tags in der Tabelle: kleinere Schrift auf Mobile */
    #links .uebersicht-category-cell .uebersicht-cat-link {
        font-size: 0.65rem !important;
        min-height: calc(0.65rem * 1.58 + 2px);
        padding: 0.06em 0.22em;
        line-height: 1.3;
    }

    #links .uebersicht-cat-more {
        font-size: 0.6rem !important;
        padding: 0.1em 0.28em;
    }

    #links .uebersicht-action-buttons .uebersicht-chip-btn {
        font-size: var(--uebersicht-control-font-size) !important;
    }

    #links .uebersicht-logic-label {
        font-size: 0.75rem;
    }

    #links .tablefont,
    #links .theadfont {
        font-size: 0.75rem;
    }

    #links thead th.theadfont {
        font-size: 0.65rem;
    }

    #links .uebersicht-col-title a {
        font-size: 0.75rem;
    }

    #links .uebersicht-col-link {
        padding-left: 0.1rem !important;
        padding-right: 0.4rem !important;
        vertical-align: middle;
    }

    #links thead .uebersicht-col-link {
        padding-right: 0.4rem !important;
    }

    #links .uebersicht-col-category {
        padding-left: 0.3rem !important;
    }

    #links thead .uebersicht-col-category {
        padding-left: 0.3rem !important;
    }

    #links .uebersicht-col-link .links_href {
        font-size: 0.625rem;
        font-weight: 400;
        line-height: 1.25;
        letter-spacing: -0.03em;
        padding: 0.06rem 0.2rem;
        border-radius: 0.2rem;
    }

    #links .uebersicht-col-link .uebersicht-copy-btn .btn {
        padding: 0 !important;
    }

    #links .uebersicht-col-link .bi-copy {
        width: 10px;
        height: 10px;
    }

    /* Mobile: Link-Spalte ist schmal → Kopieren standardmäßig aus */
    #links .uebersicht-col-link .uebersicht-copy-btn {
        display: none !important;
    }

    #links thead .uebersicht-col-qr,
    #links .uebersicht-col-qr {
        padding: 0.1rem 0.08rem !important;
    }

    #links .uebersicht-qr-cell {
        font-size: 0.7rem;
        line-height: 1.3;
    }

    #links .uebersicht-col-qr .links_aufrufe {
        font-size: 0.7rem;
        line-height: 1.2;
    }
}

/* Beschreibung: erste Zeile Vorschau, zweite Zeile „Mehr anzeigen“ */
#links .links-desc-cell {
    line-height: 1.4;
    word-break: break-word;
    font-size: 0.6875rem;
    color: #868e96;
}

#links .links-desc-cell .uebersicht-desc-preview {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#links .links-desc-cell:has(.uebersicht-desc-rest.desc-show) .uebersicht-desc-preview {
    display: none;
}

#links .links-desc-cell .uebersicht-desc-more-row.desc-show {
    display: block !important;
    margin-top: 0.15rem;
}

#links .links-desc-cell .uebersicht-desc-rest.desc-show {
    display: block !important;
    margin-top: 0.15rem;
    white-space: normal;
}

#links .links-desc-cell .uebersicht-desc-less.desc-show {
    display: block !important;
    margin-top: 0.15rem;
}

#links .links-desc-cell .desc-toggle {
    margin-left: 0;
    font-size: 0.6875rem;
    font-weight: 400;
}

#links .links-desc-cell .desc-toggle a,
#links .links-desc-cell .desc-toggle a:visited {
    color: #868e96;
    text-decoration: none;
}

#links .links-desc-cell .desc-toggle a .underline {
    text-decoration-line: underline;
    text-underline-offset: 2px;
}

#links .links-desc-cell .desc-toggle a:hover,
#links .links-desc-cell .desc-toggle a:focus {
    color: #868e96;
}

#links .links-desc-cell .desc-toggle a:hover .underline,
#links .links-desc-cell .desc-toggle a:focus .underline {
    color: var(--fw-primary, #b91c1c);
}

/* Pagination: Einträge pro Seite + Seiten in einer Zeile */
#links .uebersicht-pagination-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

#links .uebersicht-pagination-inline {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.25rem 0.35rem;
    max-width: 100%;
    margin-left: auto;
}

#links .uebersicht-pagination-nav {
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 0 1 auto;
}

#links .pagination {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.25rem 0.35rem;
    padding: 0;
    margin: 0;
    list-style: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

#links .pagination .page-item {
    width: auto;
    margin: 0;
    flex-shrink: 0;
}

#links .pagination .page-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: auto;
    min-height: auto;
    padding: 0.15em 0.4em !important;
    border-radius: 4px;
    border: 1px solid #9ca3af;
    color: #1f2937;
    background-color: #f3f4f6;
    font-weight: 500;
    font-size: 0.75rem !important;
    line-height: 1.35;
    text-decoration: none;
    transition: color 0.12s ease, border-color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
}

#links .pagination .page-link:hover,
#links .pagination .page-link:focus-visible {
    color: #111827;
    border-color: #6b7280;
    background-color: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

#links .pagination .active .page-link,
#links .pagination li.active .page-link {
    background-color: var(--fw-primary, #b91c1c);
    border-color: var(--fw-primary, #b91c1c);
    color: #fff;
}

#links .pagination .disabled .page-link {
    opacity: 0.55;
    pointer-events: none;
}

#links #ddlViewBy {
    width: auto;
    min-width: 2.75rem;
    max-width: 3.75rem;
    height: auto;
    min-height: auto;
    padding: 0.15em 1.35rem 0.15em 0.4em;
    font-size: 0.75rem !important;
    font-weight: 500;
    line-height: 1.35;
    color: #1f2937;
    background-color: #f3f4f6;
    border: 1px solid #9ca3af;
    border-radius: 4px;
    flex-shrink: 0;
    box-shadow: none;
}

#links #ddlViewBy:hover {
    color: #111827;
    border-color: #6b7280;
    background-color: #e5e7eb;
}

#links #ddlViewBy:focus {
    border-color: #6b7280;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

#links #ddlViewform {
    display: flex;
    align-items: center;
    margin: 0;
}

/* Link-Spalte: Inhalt mittig in der Zeile (vertikal & horizontal) */
#links td.uebersicht-col-link {
    vertical-align: middle !important;
    text-align: center;
    container-type: inline-size;
    container-name: uebersicht-link-col;
}

/* Zu schmal: Kopieren ausblenden, damit der Kurzlink nicht umbricht */
@container uebersicht-link-col (max-width: 6.75rem) {
    #links .uebersicht-col-link .uebersicht-copy-btn {
        display: none !important;
    }

    #links .uebersicht-link-cell {
        justify-content: center;
    }

    #links .uebersicht-link-cell > a {
        flex: 1 1 100%;
        margin-left: 0;
    }

    #links .uebersicht-col-link .links_href {
        white-space: normal;
        word-break: break-word;
    }
}

@supports not (container-type: inline-size) {
    @media (max-width: 991.98px) {
        #links .uebersicht-col-link .uebersicht-copy-btn {
            display: none !important;
        }
    }
}

#links .uebersicht-link-cell {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 0.25rem;
    width: 100%;
    min-height: 100%;
}

#links .uebersicht-link-cell > a {
    flex: 1 1 auto;
    min-width: 0;
    text-align: center;
}

#links .uebersicht-col-link .links_href {
    text-align: center;
    white-space: nowrap;
}

#links .uebersicht-col-link .uebersicht-copy-btn {
    display: inline-flex;
    align-items: center;
    align-self: center;
    flex: 0 0 auto;
    margin-left: auto;
}

/* QR / Klicks: Mobile-first zweizeilig + zentriert */
#links th.uebersicht-col-qr,
#links td.uebersicht-col-qr {
    vertical-align: middle !important;
    text-align: center !important;
    padding-left: 0.12rem !important;
    padding-right: 0.12rem !important;
    min-width: 0;
}

#links .uebersicht-qr-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.12rem;
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
    line-height: 1.3;
}

#links .uebersicht-qr-cell > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    flex: 0 0 auto;
}

#links .uebersicht-col-qr .links_aufrufe {
    display: block;
    width: 100%;
    max-width: 100%;
    text-align: center;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
    word-break: break-word;
}

#links .uebersicht-qr-img {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    vertical-align: middle;
}

@media (min-width: 992px) {
    /* Desktop: QR und Klicks nebeneinander */
    #links .uebersicht-qr-cell {
        display: inline-grid;
        grid-template-columns: 30px 6.5ch;
        grid-template-rows: auto;
        align-items: center;
        justify-items: center;
        column-gap: 0.25rem;
        width: auto;
        flex-direction: row;
        gap: 0.25rem;
    }

    #links.fwlink-hide-clicks .uebersicht-qr-cell {
        display: flex;
        grid-template-columns: none;
        width: auto;
    }

    #links .uebersicht-qr-cell > a {
        width: 100%;
    }

    #links .uebersicht-col-qr .links_aufrufe {
        text-align: left;
        overflow-wrap: normal;
        word-break: normal;
    }

    #links .uebersicht-cat-link {
        font-size: 0.78rem;
    }

    #links .uebersicht-col-title a {
        font-size: 0.8125rem;
    }

    /* Kurzlink + Kopieren als kompakte Gruppe in der Spaltenmitte */
    #links .uebersicht-link-cell {
        justify-content: center;
        gap: 0.15rem;
    }

    #links .uebersicht-link-cell > a {
        flex: 0 1 auto;
    }

    #links .uebersicht-col-link .uebersicht-copy-btn {
        margin-left: 0;
    }

    #links .uebersicht-col-link .links_href {
        font-size: 0.8125rem;
        padding: 0.15rem 0.4rem;
    }

    #links .uebersicht-qr-img {
        width: 30px;
        height: 30px;
    }

    #links #ddlViewBy {
        min-width: 2.75rem;
        max-width: 3.75rem;
        padding: 0.18em 1.35rem 0.18em 0.4em;
        font-size: 0.75rem !important;
    }

    #links .pagination {
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 0.25rem 0.35rem;
    }

    #links .pagination .page-link {
        padding: 0.18em 0.4em !important;
        font-size: 0.75rem !important;
    }

    #links .uebersicht-pagination-inline {
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 0.25rem 0.35rem;
        margin-left: auto;
    }
}

/* Login / Registrierung – gleicher Chip-Stil wie Übersicht */
.auth-panel {
    --uebersicht-control-font-size: 0.8125rem;
    --uebersicht-control-line-height: 1.35;
    --uebersicht-control-pad-x: 0.45em;
    --uebersicht-control-border: 1px solid #9ca3af;
    --uebersicht-control-radius: 4px;
    --uebersicht-control-bg: #f3f4f6;
    --uebersicht-control-color: #1f2937;
    --uebersicht-control-height: calc(var(--uebersicht-control-font-size) * 1.725 + 2px);
    max-width: 26rem;
    margin-top: 0.15rem;
    padding: 1rem 1.1rem 1.1rem;
}

.auth-panel .auth-panel-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--fw-accent, #1e3a5f);
}

.auth-panel .auth-form-fields {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.auth-panel .auth-field-label {
    display: block;
    margin: 0.35rem 0 0.1rem;
    font-weight: 600;
    color: #374151;
}

.auth-panel .auth-field-input,
.auth-panel .auth-submit {
    box-sizing: border-box;
    height: var(--uebersicht-control-height);
    min-height: var(--uebersicht-control-height);
    margin: 0;
    padding: 0 var(--uebersicht-control-pad-x);
    font-size: var(--uebersicht-control-font-size) !important;
    font-weight: 500;
    line-height: calc(var(--uebersicht-control-height) - 2px);
    border: var(--uebersicht-control-border);
    border-radius: var(--uebersicht-control-radius);
    font-family: inherit;
}

.auth-panel .auth-field-input {
    display: block;
    width: 100%;
    color: var(--uebersicht-control-color);
    background-color: var(--uebersicht-control-bg);
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
}

.auth-panel .auth-field-input::placeholder {
    color: #6b7280;
    opacity: 1;
}

.auth-panel .auth-field-input:hover {
    border-color: #6b7280;
    background-color: #e5e7eb;
}

.auth-panel .auth-field-input:focus {
    color: #111827;
    border-color: #6b7280;
    background-color: #fff;
    box-shadow: 0 0 0 0.12rem rgba(107, 114, 128, 0.12);
    outline: none;
}

.auth-panel .auth-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.5rem;
    cursor: pointer;
    color: var(--uebersicht-control-color);
    background: var(--uebersicht-control-bg);
    transition: color 0.12s ease, border-color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
}

.auth-panel .auth-submit:hover,
.auth-panel .auth-submit:focus-visible {
    outline: none;
    color: #111827;
    border-color: #6b7280;
    background: #e5e7eb;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.auth-panel .auth-panel-links {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid #e5e7eb;
    line-height: 1.5;
    color: #6b7280;
}

.auth-panel .auth-panel-links a {
    color: var(--fw-accent, #1e3a5f);
    font-weight: 500;
    text-decoration: none;
}

.auth-panel .auth-panel-links a:hover,
.auth-panel .auth-panel-links a:focus-visible {
    color: var(--fw-primary, #b91c1c);
    text-decoration: underline;
}