/* inter-100 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100;
    src: url('../fonts/inter-v13-latin-100.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-100.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-100.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-100.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-100.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-100.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-200 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/inter-v13-latin-200.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-200.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-200.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-200.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-200.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-200.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-300 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/inter-v13-latin-300.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-300.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-300.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-300.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-300.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-300.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-regular - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/inter-v13-latin-regular.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-regular.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-regular.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-regular.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-regular.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-regular.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-500 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/inter-v13-latin-500.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-500.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-500.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-500.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-500.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-500.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-600 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/inter-v13-latin-600.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-600.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-600.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-600.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-600.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-600.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-700 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/inter-v13-latin-700.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-700.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-700.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-700.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-700.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-700.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-800 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 800;
    src: url('../fonts/inter-v13-latin-800.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-800.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-800.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-800.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-800.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-800.svg#Inter') format('svg');
    /* Legacy iOS */
}

/* inter-900 - latin */
@font-face {
    font-display: swap;
    /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Inter';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/inter-v13-latin-900.eot');
    /* IE9 Compat Modes */
    src: url('../fonts/inter-v13-latin-900.eot?#iefix') format('embedded-opentype'),
        /* IE6-IE8 */
        url('../fonts/inter-v13-latin-900.woff2') format('woff2'),
        /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/inter-v13-latin-900.woff') format('woff'),
        /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
        url('../fonts/inter-v13-latin-900.ttf') format('truetype'),
        /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
        url('../fonts/inter-v13-latin-900.svg#Inter') format('svg');
    /* Legacy iOS */
}

:root {
    --custom-primary: #191d93;
    --custom-primary-50: #f1f5f9;
    --custom-primary-100: #c4c2e8;
    --custom-primary-200: #111270;
    --custom-primary-300: #191d93;
    --custom-primary-400: #010483;
    --custom-primary-light: #3d42b5;
    --custom-primary-glow: rgba(25,29,147,0.08);

    --custom-success: #08c27f;
    --custom-success-50: #ecfdf5;
    --custom-success-glow: rgba(8,194,127,0.08);
    --custom-danger: #d11559;
    --custom-danger-100: #d11559;
    --custom-danger-50: rgba(209,21,89,0.08);
    --custom-danger-light: rgba(209,21,89,0.04);

    --custom-font: #0c0a2e;
    --custom-font-50: #475569;
    --custom-font-lighter: #94a3b8;
    --custom-font-light: #64748b;

    --custom-background-100: #f8fafc;
    --custom-background-200: #f1f5f9;
    --custom-background-300: #f8fafc;

    /* CI-Farben Filtergruppen */
    --ci-regional: #191d93;
    --ci-regional-bg: rgba(25,29,147,0.06);
    --ci-regional-border: rgba(25,29,147,0.15);
    --ci-regional-light: rgba(25,29,147,0.1);
    --ci-datadive: #d11559;
    --ci-datadive-bg: rgba(209,21,89,0.06);
    --ci-datadive-border: rgba(209,21,89,0.15);
    --ci-datadive-light: rgba(209,21,89,0.1);
    --ci-visibleweb: #08c27f;
    --ci-visibleweb-bg: rgba(8,194,127,0.06);
    --ci-visibleweb-border: rgba(8,194,127,0.15);
    --ci-visibleweb-light: rgba(8,194,127,0.1);

    /* Graustufen (Design-System) */
    --g50: #f8fafc;
    --g100: #f1f5f9;
    --g200: #e2e8f0;
    --g300: #cbd5e1;
    --g400: #94a3b8;
    --g500: #64748b;
    --g600: #475569;
    --g700: #334155;
    --g800: #1e293b;

    /* Schatten */
    --sh: 0 1px 3px rgba(0,0,0,.04);
    --sh-md: 0 4px 6px -1px rgba(0,0,0,.06), 0 2px 4px -2px rgba(0,0,0,.04);
    --sh-lg: 0 10px 15px -3px rgba(0,0,0,.08), 0 4px 6px -4px rgba(0,0,0,.04);

    /* Radii */
    --r: 12px;
    --r-sm: 8px;
    --r-lg: 20px;

    /* Transitions */
    --ease: all .3s cubic-bezier(.16,1,.3,1);
}

* {
    font-family: 'Inter';
}

/* Viewport/Sticky: gleiche Hoehe wie .search3-header */
:root {
    --search3-header-height: 72px;
}

/* Minimaler Header fuer Firmensuche (konsistent zum Marketing-Header) */
.search3-header {
    background: var(--custom-primary, #191d93);
    padding: 0 clamp(1.25rem, 3vw, 2rem);
    height: var(--search3-header-height);
    min-height: var(--search3-header-height);
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
    z-index: 1030;
}

/* Burger-Button: Default verborgen (Desktop), wird in Mobile-Override gezeigt */
.search3-header-burger {
    display: none;
}
.search3-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 100%;
    gap: 1rem;
    min-width: 0;
}
.search3-header-brand {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
}
.search3-header-page-title {
    font-size: 1rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.96);
    letter-spacing: -0.02em;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.search3-header-logo {
    flex-shrink: 0;
}
.search3-header-logo img,
.search3-header .search3-header-logo img {
    height: 44px !important;
    max-height: 44px !important;
    width: auto !important;
    max-width: 240px !important;
    object-fit: contain !important;
    display: block;
    filter: brightness(0) invert(1);
}
.search3-header-nav {
    display: flex;
    align-items: center;
    gap: clamp(0.85rem, 2vw, 1.35rem);
    flex-shrink: 0;
}
.search3-header-nav > a:not(.search3-header-help):not(.search3-header-login) {
    color: rgba(255, 255, 255, 0.88);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: color 0.15s ease, opacity 0.15s ease;
    padding: 0.35rem 0;
    border-bottom: 1px solid transparent;
}
.search3-header-nav > a:not(.search3-header-help):not(.search3-header-login):hover {
    color: #ffffff;
    border-bottom-color: rgba(255, 255, 255, 0.35);
}

.search3-header-help {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.375rem;
    height: 2.375rem;
    flex-shrink: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.42);
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease;
}
.search3-header-help:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.65);
    color: #ffffff;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.search3-header-help:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.85);
    outline-offset: 2px;
}
.search3-header-help i {
    font-size: 1.2rem;
    line-height: 1;
}
.search3-header-help svg {
    width: 1rem;
    height: 1rem;
    display: block;
}

.search3-header-nav .search3-header-login {
    color: var(--custom-primary, #191d93) !important;
    background: #ffffff !important;
    padding: 0.5rem 1.2rem;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.875rem;
    line-height: 1.2;
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.1),
        0 2px 8px rgba(15, 23, 42, 0.08);
    margin-left: 0.15rem;
}
.search3-header-nav .search3-header-login:hover {
    background: #f1f5f9 !important;
    color: var(--custom-primary, #191d93) !important;
    border-color: rgba(255, 255, 255, 0.55);
    box-shadow:
        0 2px 4px rgba(15, 23, 42, 0.12),
        0 4px 14px rgba(15, 23, 42, 0.1);
}
.search3-header-nav .search3-header-login:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.9);
    outline-offset: 2px;
}

@media (max-width: 768px) {
    :root {
        --search3-header-height: 64px;
    }
    .search3-header {
        padding: 0 0.875rem;
    }
    .search3-header-logo img,
    .search3-header .search3-header-logo img {
        height: 32px !important;
        max-height: 32px !important;
        max-width: 140px !important;
    }
    .search3-header-nav {
        gap: 0.5rem;
    }
    .search3-header-nav a {
        font-size: 0.8125rem;
    }
    .search3-header-page-title {
        font-size: 0.875rem;
        max-width: 9rem;
    }
}

/*
 * Mobile Header-Strategie:
 * Unter 600px werden die textlastigen Sekundaer-Links (Preise, Anleitung,
 * Kontakt, Help) im Header ausgeblendet, weil sie sich sonst mit dem Logo
 * ueberlappen. Stattdessen wird der Burger-Button (search3-header-burger)
 * sichtbar, der diese Links ueber ein Bootstrap-Dropdown erreichbar macht.
 * Login-CTA bleibt prominent.
 */
@media (max-width: 600px) {
    .search3-header-nav > a:not(.search3-header-help):not(.search3-header-login),
    .search3-header-help {
        display: none !important;
    }
    .search3-header-nav .search3-header-login {
        padding: 0.4rem 0.85rem;
        font-size: 0.8125rem;
    }
    .search3-header-logo img,
    .search3-header .search3-header-logo img {
        max-width: 160px !important;
    }
    /* Burger-Button sichtbar machen */
    .search3-header-burger {
        display: inline-flex !important;
        align-items: center;
        margin-left: 0.4rem;
    }
    .search3-header-burger-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        padding: 0;
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(255, 255, 255, 0.18);
        border-radius: 8px;
        color: #ffffff;
        cursor: pointer;
        transition: background-color 0.15s ease, border-color 0.15s ease;
    }
    .search3-header-burger-btn:hover,
    .search3-header-burger-btn:focus-visible {
        background: rgba(255, 255, 255, 0.15);
        border-color: rgba(255, 255, 255, 0.35);
        outline: none;
    }
    .search3-header-burger-btn svg {
        display: block;
    }
    .search3-header-burger-menu {
        font-size: 0.9rem;
        min-width: 200px;
        padding: 0.4rem;
        margin-top: 6px !important;
        border: 1px solid #e5e7eb;
        box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    }
    .search3-header-burger-menu .dropdown-item {
        display: flex;
        align-items: center;
        gap: 0.55rem;
        padding: 0.55rem 0.65rem;
        border-radius: 6px;
        color: #1f2937;
    }
    .search3-header-burger-menu .dropdown-item i {
        color: var(--custom-primary, #191d93);
        font-size: 0.95rem;
        flex-shrink: 0;
    }
    .search3-header-burger-menu .dropdown-item:hover,
    .search3-header-burger-menu .dropdown-item:focus {
        background: #f3f4f6;
        color: var(--custom-primary, #191d93);
    }
    .search3-header-burger-menu .dropdown-divider {
        margin: 0.3rem 0;
    }
}

@media (max-width: 420px) {
    .search3-header-page-title {
        display: none;
    }
    .search3-header-logo img,
    .search3-header .search3-header-logo img {
        max-width: 120px !important;
    }
}

/* Footer auf Firmensuche ausblenden */
footer,
.footer,
#footer,
.footer-new,
.footer-section {
    display: none !important;
}

#filterSection .accordion-button::after,
.accordion-button:not(.collapsed)::after {
    margin: 0 !important;
    content: url('../../assets/icons/chevron-down.svg');
    transform: rotate(0deg);
}

.accordion-button::after,


#searchCountrySwitcher button.dach-dropdown::after {
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: none;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    height: 18px;
    margin: 0 0 0 0.5rem !important;
    content: url('../../assets/icons/chevron-down.svg');
    transform: rotate(180deg);
    border: 0;
    transition: 0.2s ease-in-out;
}

#searchCountrySwitcher button.dach-dropdown::after {
    height: 10px !important;
    width: 10px !important;
    margin: 0 0 0 0.15rem !important;
}

#searchCountrySwitcher button.dach-dropdown.show::after {
    transform: rotate(360deg);
}

#filterSection .accordion-button::after {
    transform: rotate(180deg);
}

#filterAccordion .accordion-button {
    width: 265px;
    height: 48px;
    padding: 14px 10px;
    display: flex;
    justify-content: space-between;
    gap: 6px;
    align-items: center;
    color: var(--custom-primary) !important;
    box-shadow: none !important;
}

#filterAccordion .accordion-button.custom-none {
    color: var(--custom-font) !important;
}

#filterAccordion .accordion-button.custom-danger {
    color: var(--custom-danger) !important;
}

#filterAccordion .accordion-button.custom-success {
    color: var(--custom-success) !important;
}

.dach-dropdown {
    padding-inline: 7px !important;
}

#searchCountrySwitcher button.dach-dropdown {
    min-width: 0 !important;
    border-radius: 10px;
    background-color: white;
    color: var(--custom-primary-200);
    height: 38px;
    border: none !important
}

#searchCountrySwitcher button.dach-dropdown>.flag-icon {
    margin-right: 2px !important
}

#searchCountrySwitcher button.dach-dropdown>span {
    margin-left: 2px !important
}

#filterAccordion .accordion-button:not(.collapsed) {
    border-radius: 0 !important;
    background-color: white !important;
    max-width: 265px;
    height: 48px;
    margin-top: 0 !important;
}


#filterSection .accordion-button,
.accordion-button:not(.collapsed) {
    font-weight: 500 !important;
}

.form-check-input {
    width: 18px;
    height: 18px;
    flex: none !important;
    padding: 0 !important;
}

#filterAccordion .accordion-button {
    border-radius: 0 !important;
    background-color: white !important;
    max-width: 265px;
    height: 48px;
    margin-top: 0 !important;
}

#filterAccordion .accordion-body {
    border-radius: 0 !important;
    background-color: var(--custom-background-100) !important;
    width: 265px;
    padding: 0 !important;
}

.accordion-item:last-of-type .accordion-collapse {
    border-radius: 0 !important;
}

/* Start Icon Card */

.searchFiltersParent .icon_card {
    box-shadow: none !important;
    background-color: transparent !important;
}

.searchFiltersParent .icon_card_title {
    font-size: 1rem !important
}

.searchFiltersParent .icon_card {
    border: none !important;
    padding: 14px 10px;
}

.icon_card .icon_card_title {
    color: var(--custom-font);
    font-weight: 400 !important;
    border: none !important
}

.form-check-input:checked {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
}

.icon_card .icon_card_title:has(+ .form-check-input:checked),
.icon_card .icon_image svg:has(+ .form-check-input:checked) {
    color: var(--custom-primary) !important;
}

#filterSection .icon_card:hover {
    background-color: var(--custom-primary-glow) !important;
}

#filterSection .icon_card:hover .icon_card_title,
#filterSection .icon_card:hover .icon_image {
    color: var(--custom-primary) !important;
}

.icon_image:has(+ .d-flex.justify-content-between.w-100.align-items-center .form-check-input:checked) {
    color: var(--custom-primary) !important;
}

.searchFiltersParent .icon_image {
    width: 18px !important;
    height: 18px !important;
    margin-right: 12px !important;
}

.custom-search {
    margin-left: 0 !important
}

.custom-search .searchInput {
    padding: 12px 24px 12px 24px;
    font-size: 0.75rem;
    /* width: 265px; */
    height: 40px;
    border: 2px solid var(--custom-primary-100) !important;
}

.custom-search #searchIconBtn {
    top: 50%;
    right: 16px;
    width: 18px;
    height: 18px;
    padding: 0 !important;
    color: black !important;
    font-size: 12px;
    transform: translateY(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-search .searchBox .search-icon {
    background-color: white;
}

.custom-search .searchBox .search-icon .fa-search:before {
    color: black !important;
    width: 18px;
    height: 18px;
}

/* Start of Dach Filter */
.dach-filter-container {
    padding: 12px 10px !important;
}

/* End of Dach Filter */

/* Start of custom Dropdown */
.custom-dropdown {
    border-radius: 10px;
    border: 1px solid #E7E7E7;
    background: #FFF;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.08);
    padding: 0 !important;
    overflow: hidden
}

.custom-dropdown>li {
    font-size: 14px !important;
}

.dropdown-menu {
    z-index: 1000;
}

/* End of custom Dropdown */

/* Start of custom Card Properties */
.card-image {
    width: 235px;
    height: 235px;
}

#noDataFoundCard {
    border: none !important;
    max-width: 610px;
    margin: 0 auto !important;
}

#noDataFoundCard h4 {
    color: var(--custom-primary) !important;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 27px;
    /* 168.75% */
}

#noDataFoundCard .no-results-paragraph {
    color: var(--custom-font-light) !important;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 27px;
    /* 168.75% */
}

#noDataFoundCard .no-results-notice {
    background-color: var(--custom-danger-light);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 27px;
    /* 168.75% */
    font-size: 12px;
    color: var(--custom-font);
    border-radius: 12px;
    padding: 8px 24px;
}

#noDataFoundCard .no-results-notice>p {
    color: var(--custom-danger-100);
    font-size: 12px;
    line-height: 140%;
    font-weight: 400;
    color: var(--custom-font);
}

#noDataFoundCard .no-results-notice>p>span {
    color: var(--custom-danger-100) !important;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 168.75%;
}

.card-image-container,
.button-container {
    display: flex;
    justify-content: center;
}

.button-container {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 2rem;
}

.custom-primary-button {
    border-radius: 12px;
    border: 1px solid var(--custom-primary);
    background-color: var(--custom-primary) !important;
    background: #FFF;
    box-shadow: 4px 4px 25px 0px rgba(38, 32, 133, 0.12);
    display: flex;
    padding: 15px 43px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    height: 49px;
}

.custom-primary-button a {
    padding: 0 !important;
    color: white !important;
}

.custom-outline-button a {
    padding: 0 !important;
    color: var(--custom-primary) !important;
}

.custom-outline-button {
    border-radius: 12px;
    border: 1px solid var(--custom-primary);
    background: #FFF;
    box-shadow: 4px 4px 25px 0px rgba(38, 32, 133, 0.12);
    display: flex;
    padding: 15px 43px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    height: 49px;
}

.custom-outline-button a {
    padding: 0 !important;
}

/* End of custom Card Properties */

/* Utilities */
.custom-min-height {
    min-height: calc(100vh - 160px);
}

/* End of Utilities */


/* Calculating state: value stays visible, slightly faded, with inline spinner */
.calculating {
    opacity: 0.6 !important;
    cursor: progress !important;
    display: inline-block;
}

.calculating::after {
    content: '';
    display: inline-block;
    width: 0.7em;
    height: 0.7em;
    margin-left: 0.35em;
    border: 2px solid #d1d5db;
    border-top-color: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: calc-spin 0.8s linear infinite;
    vertical-align: middle;
}

.command-headline-count.calculating::after { display: none; }
.pricing-hero-value.calculating::after { display: none; }
.pricing-unit-hero-value.calculating::after { display: none; }
.pricing-calc-total.calculating::after { display: none; }

.command-headline-spinner {
    display: none;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(148,163,184,0.35);
    border-top-color: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: calc-spin 0.8s linear infinite;
    vertical-align: middle;
    margin-left: 0.5rem;
}
.command-headline-spinner.active {
    display: inline-block;
}

@keyframes calc-spin {
    to { transform: rotate(360deg); }
}

/* Inline loading status (under KPI strip) */
.search-loading-status {
    display: none;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0;
    font-size: 0.8rem;
    color: #6b7280;
}

.search-loading-status.active {
    display: flex;
}

.search-loading-status-spinner {
    width: 14px;
    height: 14px;
    border: 2px solid #d1d5db;
    border-top-color: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: calc-spin 0.8s linear infinite;
    flex-shrink: 0;
    font-style: normal;
    font-weight: 600;
    line-height: 140%;
}

/* Hint Action Bar (replaces normal action bar in hint state) */
.hint-bar {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0.5rem 0 0;
}
.hint-bar-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.hint-bar-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 1.2rem;
    border-radius: 8px;
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}
.hint-bar-btn--primary {
    background: var(--custom-primary, #191d93);
    color: #fff;
}
.hint-bar-btn--primary:hover {
    background: var(--custom-primary-light, #3d42b5);
}
.hint-bar-btn--secondary {
    background: #fff;
    color: var(--custom-primary, #191d93);
    border-color: var(--custom-primary, #191d93);
}
.hint-bar-btn--secondary:hover {
    background: var(--custom-primary-glow, rgba(25,29,147,0.08));
}
.hint-bar-btn svg { flex-shrink: 0; }

/* Hint Search Box (centered below hint action bar) */
.hint-search-section {
    margin-top: 0;
    max-width: 100%;
}
.hint-bar-or {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.75rem 0 0.5rem;
    color: #9ca3af;
    font-size: 0.72rem;
}
.hint-bar-or::before,
.hint-bar-or::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}
.hint-search-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    color: #4b5563;
    margin-bottom: 0.35rem;
}
.hint-search-box {
    max-width: 480px;
    margin: 0.75rem auto 0.5rem 0;
}
.hint-search-divider {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    color: #9ca3af;
    font-size: 0.72rem;
}
.hint-search-divider::before,
.hint-search-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}
.hint-search-wrap {
    display: flex;
    align-items: center;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    background: #f9fafb;
    overflow: hidden;
    transition: border-color 0.15s ease;
}
.hint-search-wrap:focus-within {
    border-color: var(--custom-primary, #191d93);
    box-shadow: 0 0 0 4px var(--custom-primary-glow, rgba(25,29,147,0.12));
}
.hint-search-icon {
    margin-left: 0.65rem;
    color: #9ca3af;
    flex-shrink: 0;
}
.hint-search-input {
    flex: 1;
    border: none;
    background: transparent;
    padding: 0.6rem 0.6rem;
    font-size: 0.88rem;
    color: #1f2937;
    outline: none;
}
.hint-search-input::placeholder { color: #9ca3af; }
.hint-search-btn {
    padding: 0.6rem 1rem;
    background: var(--custom-primary, #191d93);
    color: #fff;
    border: none;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}
.hint-search-btn:hover {
    background: var(--custom-primary-light, #3d42b5);
}
.hint-search-preview {
    margin-top: 0.5rem;
    padding: 0.6rem;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 0.8rem;
}

/* End of Background Search Indicator */

/* Empty State Hint */
.empty-state-hint {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding: 1.5rem 1.5rem;
    margin: 1rem 0 0.75rem;
    border-radius: 10px;
    border: 1px solid #f3f4f6;
    background: #fafbfc;
}
.empty-state-hint-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.75rem;
}
.empty-state-hint-cause-label {
    font-size: 0.875rem;
    color: #4b5563;
    margin-bottom: 0.45rem;
    letter-spacing: 0.01em;
}
.empty-state-hint-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
    margin-top: 0.75rem;
}
#filter-groups .chipSec.problem-highlight {
    box-shadow: 0 0 0 2px #ef4444;
    border-radius: 100px;
}
.empty-state-hint-btn-primary {
    padding: 0.6rem 1.4rem;
    background: var(--custom-primary, #191d93) !important;
    color: #fff !important;
    border: none;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}
.empty-state-hint-btn-primary:hover {
    background: var(--custom-primary-light, #3d42b5) !important;
}

/* Start of Initial Explanation – Discovery Screen */
#initialExplanation {
    flex: 1;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-height: calc(100vh - var(--search3-header-height));
    padding: clamp(18px, 2.4vw, 28px);
    background: #f8f7f6 !important;
    border-radius: 22px;
}

.discovery-screen {
    width: 100%;
    padding: 0;
    background: transparent;
    border-radius: 0;
}

.discovery-screen--search-first {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    padding: 0;
    min-height: calc(100vh - var(--search3-header-height));
    background: transparent;
    border-radius: 0;
}

.discovery-screen-shell {
    width: 100%;
    display: flex;
    justify-content: stretch;
    box-sizing: border-box;
    padding: 28px 24px 40px;
    background: #ffffff;
    border-radius: 18px;
}

.discovery-screen-content {
    width: 100%;
    max-width: none;
    margin-inline: auto;
    background: transparent;
    border-radius: 0;
    padding: 0;
}

.discovery-screen--search-first .discovery-screen-shell {
    flex-direction: column;
    flex: 1 1 auto;
    align-self: stretch;
    min-height: 0;
}

.discovery-screen--search-first .discovery-screen-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.discovery-workspace-bar {
    width: 100%;
    max-width: 920px;
    margin: 0 auto 1.25rem;
    padding-bottom: 0.95rem;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
}

.discovery-workspace-bar__title {
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.discovery-workspace-bar__right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.65rem;
    flex-wrap: wrap;
}

.discovery-workspace-bar > .discovery-workspace-bar__right:only-child {
    margin-left: auto;
}

.discovery-workspace-bar__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.45rem;
}

.discovery-workspace-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.34rem 0.58rem;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #64748b;
    font-size: 0.71rem;
    font-weight: 600;
    line-height: 1;
}

.discovery-workspace-action {
    padding: 0.34rem 0.62rem;
    border-radius: 999px;
    border: 1px solid #e2e8f0;
    color: #475569;
    background: #ffffff;
    font-size: 0.74rem;
    font-weight: 600;
    box-shadow: none;
}

.discovery-workspace-action:hover:not(.disabled) {
    border-color: #cbd5e1;
    color: var(--custom-primary, #191d93);
    background: #f8fafc;
    box-shadow: none;
    text-decoration: none;
}

.legacy-search-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    width: 100%;
    max-width: 760px;
    margin: 1rem auto 1.45rem;
    color: #64748b;
    font-size: 0.8125rem;
}

.legacy-search-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.7rem;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    color: #312e81;
    background: #ffffff;
    font-size: 0.81rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: all 0.18s ease;
}

.legacy-search-pill:hover {
    color: var(--custom-primary, #191d93);
    border-color: #c7d2fe;
    background: #f8f7ff;
    text-decoration: none;
}

@media (max-width: 576px) {
    .legacy-search-row {
        flex-direction: column;
        gap: 0.5rem;
        margin-top: 0.85rem;
        text-align: center;
    }
}

.discovery-screen--search-first .discovery-smart-search--hero {
    width: 100%;
    max-width: 760px;
    margin-inline: auto;
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.05rem;
}
.discovery-screen--search-first .discovery-smart-search--hero > .discovery-smart-input-wrap {
    width: 100%;
    align-self: stretch;
}
.discovery-screen--search-first .discovery-smart-search--hero > .discovery-smart-preview {
    align-self: stretch;
    width: 100%;
    margin-top: 0;
}
.discovery-screen--search-first .discovery-smart-search--hero .discovery-search-sample {
    margin-top: 0;
}

/* Dezentes Pulsieren: nah am statischen Suchfeld, nur minimale Bewegung */
@keyframes discovery-hero-search-pulse {
    0%,
    100% {
        border-color: rgba(25, 29, 147, 0.2);
        box-shadow:
            0 4px 20px rgba(25, 29, 147, 0.07),
            0 1px 3px rgba(15, 23, 42, 0.05);
    }
    50% {
        border-color: rgba(25, 29, 147, 0.28);
        box-shadow:
            0 0 0 2px rgba(58, 49, 200, 0.06),
            0 5px 22px rgba(25, 29, 147, 0.09),
            0 1px 4px rgba(15, 23, 42, 0.06);
    }
}

@keyframes discovery-hero-search-pulse-focus {
    0%,
    100% {
        border-color: rgba(25, 29, 147, 0.45);
        box-shadow:
            0 0 0 2px rgba(58, 49, 200, 0.09),
            0 6px 26px rgba(25, 29, 147, 0.1),
            0 2px 6px rgba(15, 23, 42, 0.05);
    }
    50% {
        border-color: rgba(25, 29, 147, 0.52);
        box-shadow:
            0 0 0 3px rgba(58, 49, 200, 0.12),
            0 7px 28px rgba(25, 29, 147, 0.12),
            0 2px 7px rgba(15, 23, 42, 0.06);
    }
}

/* Hero-Variante: die Shell traegt den Rahmen, nicht der Input-Wrap.
   So bilden Input + Chat visuell EINE Box.
   WICHTIG: overflow explizit auf visible setzen (nicht nur weglassen), weil
   eine allgemeinere .discovery-smart-shell-Regel weiter unten in der Datei
   overflow:hidden vererbt. Sonst werden Tooltips aus der Trust-Bar geclippt.
   Die rounded corners werden stattdessen direkt an den Ecken-Kindern (Hint,
   Trust) ueber border-radius: inherit sichergestellt. */
.discovery-screen--search-first .discovery-smart-shell {
    width: 100%;
    border-radius: 22px;
    border: 1px solid rgba(148, 163, 184, 0.42);
    box-shadow:
        0 12px 32px rgba(15, 23, 42, 0.08),
        0 2px 4px rgba(15, 23, 42, 0.05);
    background: #ffffff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    overflow: visible;
}
/* Top-Ecke: der Hint sitzt ganz oben und uebernimmt die oberen Radien, damit
   bei aktivem Background (#eef1fb im focus/chat-state) nichts die rounded
   corners bricht. */
.discovery-screen--search-first .discovery-smart-shell > .discovery-smart-hint {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
/* Bottom-Ecke: Trust sitzt ganz unten und hat bereits border-bottom-radius
   inherit. Im Chat-State wird der Input-Wrap nach unten geordert (order:3),
   der Trust bleibt aber weiter unten im DOM-Fluss. Damit bleiben die unteren
   Radien in beiden States sauber. */
.discovery-screen--search-first .discovery-smart-shell:hover:not(:focus-within) {
    border-color: rgba(100, 116, 139, 0.52);
}
.discovery-screen--search-first .discovery-smart-shell:focus-within,
.discovery-screen--search-first .discovery-smart-shell.is-chat-active {
    border-color: rgba(25, 29, 147, 0.45);
    box-shadow:
        0 0 0 4px rgba(58, 49, 200, 0.08),
        0 12px 34px rgba(15, 23, 42, 0.08);
}

/* Assistenten-Hinweis oben in der Shell: zeigt "hier spricht der KI-Assistent".
   Dezenter Header-Strip des Input-Containers, nicht mehr als eigener farbiger Block. */
.discovery-smart-hint {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
    background: #f7f8fc;
    border-bottom: 1px solid rgba(226, 232, 240, 0.9);
    line-height: 1.35;
    color: #475569;
    letter-spacing: 0.005em;
}
.discovery-smart-hint__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--custom-primary, #191d93);
    color: #ffffff;
    box-shadow: none;
}
.discovery-smart-hint__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    gap: 2px;
}
.discovery-smart-hint__text {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.discovery-smart-hint__sub {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 12px;
    font-weight: 400;
    color: #64748b;
    letter-spacing: 0;
    line-height: 1.4;
    margin-top: 2px;
}
.discovery-smart-hint__sub-label {
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #94a3b8;
    flex-shrink: 0;
}
.discovery-smart-hint__metric {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px 3px 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(25, 29, 147, 0.06), rgba(124, 58, 237, 0.08));
    border: 1px solid rgba(99, 102, 241, 0.18);
    color: #475569;
    white-space: nowrap;
    transition: border-color 0.2s ease, transform 0.2s ease;
}
.discovery-smart-hint__metric:hover {
    border-color: rgba(124, 58, 237, 0.35);
    transform: translateY(-0.5px);
}
.discovery-smart-hint__metric svg {
    color: #7c3aed;
    flex-shrink: 0;
    opacity: 0.85;
}
.discovery-smart-hint__metric-value {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: -0.01em;
    background: linear-gradient(90deg, #191d93 0%, #4f46e5 50%, #7c3aed 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.discovery-smart-hint__metric-text {
    font-weight: 500;
    font-size: 11.5px;
    color: #475569;
}
.discovery-smart-hint__metric-label {
    font-weight: 500;
    font-size: 11.5px;
    color: #64748b;
}

/* --- Inline Trust-Bar: Social Proof im Moment der Entscheidung ----------- */
.discovery-smart-trust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 14px;
    padding: 10px 18px 12px;
    border-top: 1px solid rgba(226, 232, 240, 0.8);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0) 0%, rgba(241, 245, 249, 0.6) 100%);
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
    font-size: 11.5px;
    color: #64748b;
    line-height: 1.3;
    position: relative;
    z-index: 1;
}
.discovery-smart-trust__item {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}
/* Sofort-Tooltip fuer Trust-Items (data-tip).
   Wir nutzen einen eigenen Tooltip statt des nativen title-Attributs,
   weil der Browser dort eine feste 500ms-Delay hat. Unser Tooltip
   erscheint SOFORT beim Hover - keine Verzoegerung, keine Fade-
   Transition.

   Position: unter dem Item. Die Trust-Bar ist das letzte Kind der
   Card; darunter kommt erst der Separator der Support-Zone - genug
   Platz fuer das Popover.

   Robust gegen Clipping: sehr hoher z-index (9999) + overflow:visible
   auf der Shell. Dunkle Pillen-Optik (kein verwirrendes weisses Mini-
   Popover, das mit der Card verschmilzt). */
.discovery-smart-trust__item[data-tip] {
    cursor: help;
}
.discovery-smart-trust__item[data-tip]::after {
    content: attr(data-tip);
    position: absolute;
    left: 50%;
    top: calc(100% + 8px);
    transform: translateX(-50%);
    padding: 6px 10px;
    border-radius: 6px;
    background: #0f172a;
    color: #ffffff;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    white-space: normal;
    width: max-content;
    max-width: 240px;
    text-align: center;
    box-shadow: 0 4px 14px -4px rgba(15, 23, 42, 0.35);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 9999;
}
.discovery-smart-trust__item[data-tip]:hover::after,
.discovery-smart-trust__item[data-tip]:focus-visible::after {
    opacity: 1;
    visibility: visible;
}
/* Im Chat-State wandert die Trust-Bar an den Kopf der Card (order:1) und
   direkt darunter liegt der Chat-Content. Wuerde der Tooltip weiter nach
   unten klappen, verdeckt er genau die KI-Antwort, die der User gerade
   liest. Deshalb im Chat-State nach oben oeffnen - dort ist nur die
   Headline der Seite, die durch einen Tooltip nicht gestoert wird. */
.discovery-smart-shell.is-chat-active .discovery-smart-trust__item[data-tip]::after {
    top: auto;
    bottom: calc(100% + 8px);
}
.discovery-smart-trust__item strong {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.005em;
}
.discovery-smart-trust__icon {
    color: #7c3aed;
    flex-shrink: 0;
    opacity: 0.9;
}
.discovery-smart-trust__icon--star {
    color: #f59e0b;
    opacity: 1;
}
/* Top-Dienstleister-Auszeichnung: goldener Akzent hebt das Award-Badge dezent
   aus den blauen/violetten Icons ab. Gleicher Farbton wie die Sterne, damit
   die Auszeichnungs-Semantik konsistent wahrgenommen wird. */
.discovery-smart-trust__icon--award {
    color: #f59e0b;
    opacity: 1;
}
.discovery-smart-trust__item--award strong {
    color: #0f172a;
}
.discovery-smart-trust__label {
    color: #64748b;
    font-weight: 500;
}
.discovery-smart-trust__sep {
    width: 1px;
    height: 12px;
    background: rgba(148, 163, 184, 0.4);
    flex-shrink: 0;
}
@media (max-width: 720px) {
    .discovery-smart-trust {
        gap: 4px 10px;
        padding: 8px 14px 10px;
        font-size: 11px;
        /* Umbrechende Trust-Items zentrieren - sieht geschlossener aus
           als linksbuendig, besonders wenn die Bar in 2 Zeilen wrappt. */
        justify-content: center;
    }
    .discovery-smart-trust__label {
        display: none;
    }
}
/* Erst auf sehr schmalen Viewports IITR komplett ausblenden, damit die
   Trust-Bar nicht in 2 Zeilen umbricht und die Auszeichnung trotzdem
   sichtbar bleibt so lange irgendwie Platz da ist. */
@media (max-width: 400px) {
    .discovery-smart-trust__item--optional,
    .discovery-smart-trust__sep--optional {
        display: none;
    }
}
.discovery-smart-shell:focus-within .discovery-smart-hint,
.discovery-smart-shell.is-chat-active .discovery-smart-hint {
    background: #eef1fb;
}
@media (max-width: 640px) {
    .discovery-smart-hint {
        padding: 10px 14px;
        gap: 10px;
    }
    .discovery-smart-hint__avatar {
        width: 22px;
        height: 22px;
    }
    .discovery-smart-hint__text {
        font-size: 13px;
        white-space: normal;
        /* Headline-Text zentrieren auf Mobile - passt zum zentrierten
           Chip-Block darunter und wirkt insgesamt harmonischer. */
        text-align: center;
    }
    .discovery-smart-hint__body {
        /* Body auf Mobile zentrieren, damit Headline und Metric-Chips
           mittig sitzen statt links angeflanscht. */
        align-items: center;
    }
    .discovery-smart-hint__sub {
        font-size: 11.5px;
        gap: 6px;
        /* Umbrechende Metric-Chips zentrieren - verhindert dass bei
           "2 Chips oben + 1 Chip unten" der einzelne Chip links haengt. */
        justify-content: center;
    }
    .discovery-smart-hint__metric {
        padding: 2px 8px 2px 6px;
    }
    .discovery-smart-hint__metric-label {
        display: none;
    }
}

.discovery-screen--search-first .discovery-smart-input-wrap {
    border-radius: 0;
    border: none;
    box-shadow: none;
    background: transparent;
    animation: none;
    overflow: visible;
    gap: 0.5rem;
}
.discovery-screen--search-first .discovery-smart-input {
    flex: 1;
    min-width: 0;
    padding: 18px 10px 18px 46px;
    font-size: 16px;
    border: none;
    border-radius: 22px;
    background: transparent;
    min-height: 62px;
    max-height: 220px;
    line-height: 1.45;
    resize: none;
    overflow-y: hidden;
    font-family: var(--custom-font-family), 'Inter', sans-serif;
}
.discovery-screen--search-first .discovery-smart-icon {
    top: 18px;
    left: 16px;
    width: 22px;
    height: 22px;
    color: #9AA0A6;
    transition: color 0.2s ease;
}
.discovery-screen--search-first .discovery-smart-input-wrap:hover .discovery-smart-icon,
.discovery-screen--search-first .discovery-smart-input-wrap:focus-within .discovery-smart-icon {
    color: rgba(25, 29, 147, 0.65);
}
.discovery-screen--search-first .discovery-smart-input-wrap:focus-within .discovery-smart-icon {
    color: var(--custom-primary, #191d93);
}
.discovery-screen--search-first .discovery-smart-btn {
    flex-shrink: 0;
    align-self: flex-end;
    margin: 10px 10px 10px 0;
    padding: 10px 14px;
    font-size: 13px;
    border-radius: 22px;
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    margin: 10px 10px 10px 0;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(25, 29, 147, 0.22);
    transition: background 0.15s ease, box-shadow 0.2s ease, transform 0.1s ease;
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta:hover {
    box-shadow: 0 6px 16px rgba(25, 29, 147, 0.28);
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta:active {
    transform: scale(0.96);
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta svg {
    width: 18px;
    height: 18px;
    display: block;
}
.discovery-screen--search-first .discovery-smart-preview {
    justify-content: center;
    padding: 0 8px;
}
.discovery-screen--search-first .discovery-also-searched {
    width: 100%;
    max-width: 652px;
    margin-inline: auto;
    margin-top: 0;
}
.discovery-screen--search-first .discovery-also-searched-label {
    text-align: center;
    color: #6b7280;
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.02em;
    margin-bottom: 12px;
}
.discovery-screen--search-first .discovery-also-searched-label--hero {
    color: var(--g600);
    font-weight: 600;
    font-size: 0.8rem;
    letter-spacing: 0.02em;
    text-transform: none;
}
.discovery-screen--search-first .discovery-sidebar-hint {
    justify-content: center;
    border-top: none;
    color: #94a3b8;
    font-size: 12px;
    margin-top: 0;
}
.discovery-bottom-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.discovery-video-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    color: #94a3b8;
    text-decoration: none;
    transition: color 0.15s;
}
.discovery-video-link:hover {
    color: #64748b;
}
/* AI Search Chat (integriert in discovery-smart-shell) */
.ai-search-chat {
    width: 100%;
    background: transparent;
    animation: aiChatFadeIn 0.25s ease;
}

/* "Von vorne anfangen": dezenter Tertiär-Link ganz rechts in der
   action-row neben "Filter anwenden" und "Verwerfen". Kein Button-
   Rahmen, kein Hintergrund - damit der Link nicht als dritter Primaer-
   Button missverstanden wird. Hover dunkler. Der User findet so die
   Escape-Hatch fuer den Dialog-Reset genau dort, wo er ohnehin
   entscheidet, ob er den Vorschlag annimmt oder verwirft. */
.ai-search-chat-reset {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding: 6px 4px;
    border: 0;
    background: transparent;
    color: #6B7280;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.12s ease;
}
.ai-search-chat-reset:hover,
.ai-search-chat-reset:focus-visible {
    color: #111827;
    text-decoration: underline;
    outline: none;
}
.ai-search-chat-reset svg {
    flex: 0 0 auto;
    opacity: 0.7;
}
.ai-search-chat-reset__label {
    white-space: nowrap;
}
@media (max-width: 480px) {
    .ai-search-chat-reset__label {
        display: none;
    }
}
.ai-search-chat-bubble {
    display: flex;
    gap: 12px;
    padding: 6px 20px 18px;
    background: transparent;
    border: none;
    border-radius: 0;
    transition: opacity 0.2s ease-out;
}

/* "Mehr/Weniger anzeigen"-Toggle fuer lange Filter-Beschreibungen.
   Inline-Button mit Link-Style, damit er sich harmonisch in den Fliesstext
   integriert, ohne wie ein primaerer Button zu wirken. */
.ai-search-narrative__preview,
.ai-search-narrative__rest {
    display: inline;
}
.ai-search-narrative__toggle {
    display: inline;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    color: var(--bs-primary, #0d6efd);
    font: inherit;
    font-weight: 500;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.ai-search-narrative__toggle:hover,
.ai-search-narrative__toggle:focus {
    color: var(--bs-primary, #0d6efd);
    text-decoration-thickness: 2px;
    outline: none;
}
/* Dialog-Kontext bleibt sichtbar waehrend die naechste AI-Antwort laedt.
   Visuell gedimmt, interaktive Buttons/Chips darunter pointer-events: none,
   damit der User nicht erneut klickt und Race-Conditions ausloest. */
.ai-search-chat-bubble.is-waiting {
    opacity: 0.55;
    pointer-events: none;
    position: relative;
}
/* Klares "disabled"-Feedback auf allen Chips/Buttons in der gedimmten
   Bubble: Mauszeiger signalisiert nicht-klickbar, Saturation reduziert. */
.ai-search-chat-bubble.is-waiting .ai-search-suggestions,
.ai-search-chat-bubble.is-waiting .ai-search-filters-preview,
.ai-search-chat-bubble.is-waiting .ai-search-suggestion-send,
.ai-search-chat-bubble.is-waiting .ai-search-suggestion-select-all,
.ai-search-chat-bubble.is-waiting button:not([data-action="retry"]):not([data-ai-cancel]):not(.ai-search-result-feedback__dismiss),
.ai-search-chat-bubble.is-waiting .ai-offer-cta__button,
.ai-search-chat-bubble.is-waiting .ai-search-chip {
    cursor: not-allowed !important;
    filter: saturate(0.4) grayscale(0.25);
}
/* Escape-Hatch: Reset-/Abbruch-Buttons muessen auch im is-waiting-Zustand
   klickbar bleiben, damit der User eine hängende Verarbeitung abbrechen und
   von vorne anfangen kann. Race-Conditions werden im JS-Handler durch
   Reset-Logik abgefangen, nicht ueber pointer-events. */
.ai-search-chat-bubble.is-waiting [data-action="retry"],
.ai-search-chat-bubble.is-waiting [data-ai-cancel],
.ai-search-chat-bubble.is-waiting .ai-search-result-feedback__dismiss {
    pointer-events: auto;
    opacity: 1;
    filter: none;
    cursor: pointer;
}
@keyframes aiChatFadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
}
.ai-search-chat-icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F1F5F9;
    border-radius: 6px;
    color: #64748B;
}
.ai-search-chat-icon svg {
    width: 12px;
    height: 12px;
}
.ai-search-chat-content {
    flex: 1;
    min-width: 0;
}
.ai-search-chat-text {
    font-size: 14px;
    color: var(--g800, #1f2937);
    line-height: 1.55;
    margin: 0 0 10px;
    font-weight: 500;
}
.ai-search-chat-text:last-child {
    margin-bottom: 0;
}

.ai-offer-cta {
    display: flex;
    margin: 10px 0 12px;
}
.ai-offer-cta__button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid rgba(25, 29, 147, 0.18);
    border-radius: 999px;
    background: #fff;
    color: var(--custom-primary, #191d93);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.ai-offer-cta__button:hover {
    background: #f8fafc;
    border-color: rgba(25, 29, 147, 0.32);
    box-shadow: 0 3px 8px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}
.ai-offer-cta__button:focus-visible {
    outline: 2px solid rgba(25, 29, 147, 0.28);
    outline-offset: 2px;
}
.ai-offer-cta__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 18px;
    padding: 0 5px;
    border-radius: 5px;
    background: #eef2ff;
    color: var(--custom-primary, #191d93);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.02em;
}
.ai-panel > .ai-offer-cta {
    flex: 0 0 auto;
    margin: 10px 14px 0;
}
.ai-panel .ai-offer-cta__button {
    width: 100%;
    justify-content: center;
}

/* Intent-Badge: Zwei Modi.
   1) Sonder-Intents (Legal, Clarify, Greeting, B2C, Analysis, Advisory):
      dezenter Text-Label, KEIN Pill-Styling mehr. Kleiner Dot davor.
   2) Filter-Status (--status): mehrzeiliger Confidence-Header mit
      Ampel-Dot je Zeile ("Exakt zugeordnet: ...", "Indikator-basiert: ...",
      "Interpretation: ..."). Ersetzt den frueheren gruenen "FILTER
      ANGEWANDT"-Pill, der wie ein Conversion-Badge wirkte und noch dazu
      irrefuehrend war (er kam VOR dem Apply-Klick). */
.ai-search-intent-badge {
    display: none;
    align-items: center;
    gap: 6px;
    padding: 0;
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 500;
    color: #475569;
    background: transparent;
    border: 0;
    text-transform: none;
    letter-spacing: 0;
    border-radius: 0;
    width: auto;
}
/* Sonder-Intents: kleiner farbiger Dot als einziger Akzent. */
.ai-search-intent-badge:not(.ai-search-intent-badge--status)::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #94a3b8;
    flex: 0 0 auto;
}
.ai-search-intent-badge--analysis::before,
.ai-search-intent-badge--advisory::before { background: #0ea5e9; }
.ai-search-intent-badge--clarify::before { background: #f59e0b; }
.ai-search-intent-badge--legal::before,
.ai-search-intent-badge--b2c::before { background: #64748b; }
.ai-search-intent-badge--greeting::before { background: #94a3b8; }
.ai-search-intent-badge--help::before { background: #0ea5e9; }

/* Filter-Status-Mode: mehrzeilig, jede Zeile mit eigenem Dot. */
.ai-search-intent-badge--status {
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    font-size: 12.5px;
    line-height: 1.5;
    color: #334155;
}
.ai-search-status-row {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.ai-search-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: inline-block;
}
.ai-search-status-row--hard .ai-search-status-dot { background: #16a34a; }
.ai-search-status-row--indicator .ai-search-status-dot { background: #f59e0b; }
.ai-search-status-row--assumption .ai-search-status-dot { background: #f97316; }
.ai-search-status-label {
    color: #475569;
    font-weight: 600;
}
.ai-search-status-items {
    color: #64748b;
    font-weight: 400;
}

.ai-search-filter-diff {
    display: none;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 10px;
    font-size: 12.5px;
    line-height: 1.4;
}
.ai-search-filter-diff[style*="block"],
.ai-search-filter-diff[style*="flex"] {
    display: flex !important;
}
.ai-search-filter-diff__row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 4px 2px;
    border: 0;
    background: transparent;
}
.ai-search-filter-diff__row + .ai-search-filter-diff__row {
    padding-top: 2px;
}
.ai-search-filter-diff__row--add {
    color: #334155;
}
.ai-search-filter-diff__row--remove {
    color: #334155;
}
.ai-search-filter-diff__marker {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    font-family: inherit;
}
.ai-search-filter-diff__row--add .ai-search-filter-diff__marker {
    background: #dcfce7;
    color: #15803d;
}
.ai-search-filter-diff__row--remove .ai-search-filter-diff__marker {
    background: #fee2e2;
    color: #b91c1c;
}
.ai-search-filter-diff__label {
    flex: 0 0 auto;
    font-size: 12.5px;
    font-weight: 500;
    color: #64748b;
    letter-spacing: 0;
    text-transform: none;
}
.ai-search-filter-diff__items {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    flex: 1 1 auto;
}
.ai-search-filter-diff__item {
    display: inline-flex;
    gap: 4px;
    align-items: baseline;
}
.ai-search-filter-diff__key {
    font-weight: 600;
    color: #1e293b;
}
.ai-search-filter-diff__val {
    color: #334155;
}

/* Narrative ("So bin ich darauf gekommen") sitzt jetzt zwischen den
   Filter-Chips und den Aktions-Buttons. Dort muss sie sich ruhig in den
   Flow einfuegen, nicht als eigener Kasten wirken - der User sieht erst
   die konkreten Chips, liest dann kurz die Begruendung, klickt dann
   "Filter anwenden". Deshalb: kein Rahmen, kein Background, nur dezenter
   grauer Text mit klarem Spacing. */
/* Erfolgs-Header: sitzt direkt ueber den Filter-Pills. Ersetzt den frueheren
   "Ihre Auswahl ist bereit: 38 Filter - pruefen und starten"-Hint. Positives
   Framing mit Check-Icon und gruenem Erfolgs-Ton, ohne eine Trefferzahl zu
   versprechen (die echten Counts gibt es erst nach Apply). Zweispaltige
   Struktur: Check-Icon links + Title/Sub-Stack rechts. */
.ai-search-filters-count {
    display: none;
    align-items: center;
    gap: 12px;
    margin: 2px 0 12px;
    padding: 10px 14px;
    border-radius: 12px;
    background: linear-gradient(135deg, #F0FDF4 0%, #ECFDF5 100%);
    border: 1px solid #BBF7D0;
    font-size: 13px;
    line-height: 1.4;
    color: #065F46;
}
.ai-search-filters-count__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #10B981;
    color: #ffffff;
    box-shadow:
        0 0 0 3px rgba(16, 185, 129, 0.18),
        0 1px 2px rgba(6, 95, 70, 0.18);
}
.ai-search-filters-count__check svg {
    display: block;
}
.ai-search-filters-count__text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
}
.ai-search-filters-count__title {
    font-size: 14.5px;
    font-weight: 600;
    color: #0f172a;
    letter-spacing: -0.005em;
    line-height: 1.3;
}
.ai-search-filters-count__sub {
    font-size: 12.5px;
    font-weight: 400;
    color: #64748b;
    line-height: 1.4;
}
.ai-search-filters-count__sub strong {
    font-weight: 700;
    color: var(--custom-primary, #191d93);
}
/* Legacy slots - falls noch von irgendwo gerendert, harmonisch beibehalten. */
.ai-search-filters-count__dot {
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18);
}
.ai-search-filters-count__label {
    color: #475569;
}
.ai-search-filters-count__value {
    font-weight: 700;
    color: var(--custom-primary, #191d93);
}
.ai-search-filters-count__hint {
    color: #94a3b8;
    font-size: 11.5px;
}

.ai-search-narrative {
    display: none;
    margin: 4px 0 12px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: #64748b;
}

.ai-search-narrative__header {
    display: none;
}
.ai-search-narrative__details {
    margin: 0;
}
.ai-search-narrative__summary {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 2px;
    font-size: 11.5px;
    font-weight: 500;
    color: #94a3b8;
    cursor: pointer;
    user-select: none;
    list-style: none;
    transition: color 0.15s ease;
}
.ai-search-narrative__summary::-webkit-details-marker {
    display: none;
}
.ai-search-narrative__summary:hover {
    color: #475569;
}
.ai-search-narrative__chevron {
    transition: transform 0.18s ease;
    flex-shrink: 0;
    opacity: 0.7;
}
.ai-search-narrative__details[open] .ai-search-narrative__chevron {
    transform: rotate(90deg);
}
.ai-search-narrative__summary-label {
    letter-spacing: 0.005em;
}
.ai-search-narrative__list {
    margin: 6px 0 0;
    padding-left: 18px;
    list-style: disc;
}
.ai-search-narrative__item {
    margin: 2px 0;
    color: #64748b;
}

/* Actions-Container: haelt die Apply/Cancel-Buttons + den Reassurance-Hint
   darunter. Sitzt NACH der Narrative. Leer = unsichtbar. Spalten-Layout,
   damit Reassurance unter der Buttonzeile sitzt. */
.ai-search-actions {
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin: 8px 0 0;
}
.ai-search-actions .ai-search-preview-actions {
    margin: 0;
}

/* Legal-Disclaimer-Block: prominent, aber ohne Alarmton. Der rechtliche
   Hinweis muss klar vom normalen Chat abgegrenzt sein, damit der User
   versteht "das ist kein Beratungsgespraech" und nicht nach weiteren
   juristischen Details fragt. Ton: freundlich, aber unmissverstaendlich. */
.ai-search-legal-disclaimer {
    margin: 0 0 12px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #fff7ed;
    border: 1px solid #fdba74;
    color: #7c2d12;
    font-size: 13px;
    line-height: 1.5;
}
.ai-search-result-feedback__inline-legal {
    animation: ai-legal-fade-in 0.25s ease-out;
}
@keyframes ai-legal-fade-in {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
.ai-search-legal-disclaimer__inner {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.ai-search-legal-disclaimer__icon {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fed7aa;
    color: #9a3412;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    font-family: Georgia, "Times New Roman", serif;
}
.ai-search-legal-disclaimer__content {
    flex: 1 1 auto;
    min-width: 0;
}
.ai-search-legal-disclaimer__title {
    font-weight: 600;
    color: #7c2d12;
    margin-bottom: 2px;
    font-size: 13.5px;
}
.ai-search-legal-disclaimer__body {
    color: #9a3412;
}
.ai-search-intent-badge--legal {
    /* Bewusst neutral/zurueckhaltend. Frueher war das Badge orange und
       wirkte wie eine Warnung. Jetzt: dezentes Label wie die anderen
       Intent-Badges, damit der freundliche Chat-Ton im Vordergrund steht. */
    color: #475569;
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.ai-search-result-feedback__undo {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid #d1d5db;
    background: #f9fafb;
    color: #374151;
    font-size: 11.5px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}
.ai-search-result-feedback__undo:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
    color: #111827;
}
.ai-search-result-feedback__undo:focus-visible {
    outline: 2px solid #6366f1;
    outline-offset: 1px;
}

.ai-search-warnings {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 12px;
}
.ai-search-warning {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 12.5px;
    line-height: 1.45;
    border: 1px solid transparent;
}
.ai-search-warning__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
}
.ai-search-warning__text {
    flex: 1 1 auto;
    color: var(--g800, #1f2937);
}
.ai-search-warning--info {
    background: #f1f5f9;
    border-color: #e2e8f0;
    color: #334155;
}
.ai-search-warning--soft {
    background: #fefce8;
    border-color: #fde68a;
    color: #854d0e;
}
.ai-search-warning--hard {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

/* Confidence-Tiers: zeigt in einer kompakten Legende welche Filter hart messbar
   sind, welche Indikator und welche nur Annäherung. Bewusst subtil gestaltet,
   damit es informiert ohne die Hauptinhalte zu dominieren. */
.ai-search-confidence {
    margin-top: 8px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(248, 250, 252, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.25);
    font-size: 12px;
    line-height: 1.55;
    color: #334155;
}
.ai-search-confidence__inner {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ai-search-confidence__row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
}
.ai-search-confidence__dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex: 0 0 auto;
    position: relative;
    top: 1px;
}
.ai-search-confidence__dot--hard {
    background: #16a34a;
}
.ai-search-confidence__dot--indicator {
    background: #eab308;
}
.ai-search-confidence__dot--assumption {
    background: #f97316;
}
.ai-search-confidence__label {
    font-weight: 600;
    color: #1e293b;
    flex: 0 0 auto;
}
.ai-search-confidence__items {
    flex: 1 1 auto;
    color: #475569;
    min-width: 0;
    word-break: break-word;
}
.ai-search-confidence__notes {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed rgba(148, 163, 184, 0.3);
    font-size: 11.5px;
    color: #64748b;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.ai-search-suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.ai-search-suggestion-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}
.ai-search-suggestion-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 500;
    color: #4F46E5;
    background: #EEF2FF;
    border: 1px solid #C7D2FE;
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.15s;
}
.ai-search-suggestion-chip:hover {
    background: #E0E7FF;
    border-color: #6366F1;
    box-shadow: 0 1px 3px rgba(99,102,241,0.12);
}
.ai-search-suggestion-chip__check {
    width: 14px;
    height: 14px;
    border: 1.5px solid #C7D2FE;
    border-radius: 4px;
    background: #fff;
    position: relative;
    flex-shrink: 0;
    transition: all 0.15s;
}
.ai-search-suggestion-chip.is-selected {
    color: #fff;
    background: #4F46E5;
    border-color: #4F46E5;
}
.ai-search-suggestion-chip.is-selected:hover {
    background: #4338CA;
    border-color: #4338CA;
}
.ai-search-suggestion-chip.is-selected .ai-search-suggestion-chip__check {
    background: #fff;
    border-color: #fff;
}
.ai-search-suggestion-chip.is-selected .ai-search-suggestion-chip__check::after {
    content: "";
    position: absolute;
    top: 1px;
    left: 4px;
    width: 4px;
    height: 8px;
    border: solid #4F46E5;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Multi-Select Chips als native <input type="checkbox"> + gestyltes Label
   (Phase 1 MVP). Die native Checkbox wird visuell versteckt aber bleibt
   im Focus-Flow; Tab/Space funktionieren so ohne zusaetzliches JS. */
.ai-search-suggestion-chip.ai-chip--multi {
    cursor: pointer;
    user-select: none;
}
.ai-chip__checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 1px;
    height: 1px;
    margin: 0;
}
.ai-search-suggestion-chip.ai-chip--multi:focus-within {
    outline: 2px solid #4F46E5;
    outline-offset: 2px;
}
.ai-search-suggestion-chip.ai-chip--multi::before {
    content: "";
    width: 14px;
    height: 14px;
    border: 1.5px solid #C7D2FE;
    border-radius: 4px;
    background: #fff;
    flex-shrink: 0;
    position: relative;
    transition: all 0.15s;
}
.ai-search-suggestion-chip.ai-chip--multi.is-selected::before {
    background: #4F46E5;
    border-color: #4F46E5;
}
.ai-search-suggestion-chip.ai-chip--multi.is-selected::after {
    content: "";
    position: absolute;
    left: 18px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    pointer-events: none;
}
.ai-search-suggestion-send {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: #4F46E5;
    border: 1px solid #4F46E5;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s;
    margin-top: 2px;
}
.ai-search-suggestion-send:hover {
    background: #4338CA;
    border-color: #4338CA;
    box-shadow: 0 2px 6px rgba(99,102,241,0.25);
}
.ai-search-suggestion-select-all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 600;
    color: #4F46E5;
    background: #EEF2FF;
    border: 1px solid #C7D2FE;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s;
    margin-top: 6px;
    margin-right: 8px;
}
.ai-search-suggestion-select-all:hover {
    background: #E0E7FF;
    border-color: #A5B4FC;
}
.ai-search-suggestion-select-all.is-active {
    background: #4F46E5;
    border-color: #4F46E5;
    color: #fff;
}
.ai-search-suggestion-select-all.is-active:hover {
    background: #4338CA;
    border-color: #4338CA;
}
/* Filter-Pills Grid: jede Kategorie ist EINE kompakte Pill (Icon + Label +
   Werte-Liste + Remove). Auf >=720px wird das Grid zweispaltig, darunter
   einspaltig - so passt der "60 weitere Filter"-Toggle visuell ins Layout
   ohne dass die Bubble bei vielen Kategorien zu hoch wird. */
.ai-search-filters-preview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 8px;
    margin-top: 12px;
    border: 0;
    background: transparent;
    overflow: visible;
}
.ai-search-filters-preview:empty {
    display: none;
}
.ai-search-filter-pill {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 9px 10px 9px 12px;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.025);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease, background 0.15s ease;
    min-width: 0;
}
.ai-search-filter-pill[data-expandable="true"] {
    cursor: pointer;
}
.ai-search-filter-pill[data-expandable="true"]:hover {
    border-color: #CBD5E1;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}
/* Beim Aufklappen kontrollierter Lift-Effekt: kein hover-translate, weil
   die Pill jetzt eine ganze Grid-Reihe einnimmt und bewegung distrahiert. */
.ai-search-filter-pill.is-expanded {
    background: #F8FAFC;
    border-color: #CBD5E1;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
    transform: none;
    cursor: default;
    /* Pill nimmt die gesamte Grid-Reihe ein, damit die Werte-Liste
       Platz hat ohne Layout-Shifts in der Grid-Spalte daneben. */
    grid-column: 1 / -1;
}
.ai-search-filter-pill.is-expanded:hover {
    transform: none;
}
.ai-search-filter-pill__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: #F1F5F9;
    color: #475569;
}
.ai-search-filter-pill__icon svg {
    display: block;
}
/* Semantische Farb-Tints je Kategorie - parallel zur bestehenden
   .ai-search-filter-tag--*-Palette, aber nur fuer den Icon-Slot. Pill selbst
   bleibt neutral weiss, damit das Grid bei vielen Kategorien ruhig wirkt. */
.ai-search-filter-pill[data-cat="branch"] .ai-search-filter-pill__icon { background: #F5F0FE; color: #5B21B6; }
.ai-search-filter-pill[data-cat="state"] .ai-search-filter-pill__icon { background: #EEF4FE; color: #1E40AF; }
.ai-search-filter-pill[data-cat="employee"] .ai-search-filter-pill__icon { background: #FFF7E6; color: #92400E; }
.ai-search-filter-pill[data-cat="technology"] .ai-search-filter-pill__icon { background: #EAFBF3; color: #065F46; }
.ai-search-filter-pill[data-cat="keyword"] .ai-search-filter-pill__icon { background: #EAFBF3; color: #065F46; }
.ai-search-filter-pill[data-cat="required"] .ai-search-filter-pill__icon { background: #FEEFEE; color: #991B1B; }
.ai-search-filter-pill[data-cat="job"] .ai-search-filter-pill__icon { background: #FFF7E6; color: #92400E; }
.ai-search-filter-pill[data-cat="exclude"] .ai-search-filter-pill__icon { background: #F4F5FA; color: #6B7280; }
.ai-search-filter-pill__body {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1 1 auto;
}
.ai-search-filter-pill__label {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.2;
}
.ai-search-filter-pill__values {
    font-size: 13px;
    font-weight: 500;
    color: #1f2937;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.ai-search-filter-pill[data-cat="exclude"] .ai-search-filter-pill__values {
    text-decoration: line-through;
    color: #6B7280;
}
.ai-search-filter-pill__count {
    flex-shrink: 0;
    margin-left: 6px;
    padding: 2px 7px;
    font-size: 11px;
    font-weight: 600;
    color: #475569;
    background: #F1F5F9;
    border-radius: 999px;
    line-height: 1.4;
}
.ai-search-filter-pill__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-left: 2px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #94a3b8;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.ai-search-filter-pill__remove:hover {
    opacity: 1;
    color: #ef4444;
    background: #FEF2F2;
}
.ai-search-filter-pill__remove svg {
    display: block;
}
/* Toggle-Pill ("+ N weitere Filter") - dezent, gestrichelt, fuegt sich ins
   Grid ein und ist klar als Aktion erkennbar. Bei [data-expanded="true"]
   wechselt der Stil zu solid + reduzierter Opacity. */
.ai-search-filter-pill--toggle {
    cursor: pointer;
    background: transparent;
    border-style: dashed;
    border-color: #CBD5E1;
    color: #475569;
    text-align: left;
    font-size: 13px;
    font-weight: 500;
    justify-content: center;
    padding: 10px 14px;
}
.ai-search-filter-pill--toggle:hover {
    background: #F8FAFC;
    border-color: #94A3B8;
    color: #1f2937;
    transform: translateY(-1px);
}
.ai-search-filter-pill--toggle[data-expanded="true"] {
    border-style: solid;
    opacity: 0.85;
}
/* Hidden-Pill: vom Toggle verwaltet. */
.ai-search-filter-pill--hidden {
    display: none !important;
}

/* Legacy Selektoren: alte Render-Pfade wurden auf .ai-search-filter-pill
   umgestellt. Falls noch irgendwo .ai-search-filter-group/-tag gerendert
   wird (z.B. aus Cache), bleiben die Styles harmonisch erhalten. */
.ai-search-filter-group {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 10px 12px;
}
.ai-search-filter-group__label {
    flex: 0 0 132px;
    padding-top: 6px;
    font-size: 11px;
    font-weight: 600;
    color: #6B7280;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1.25;
}
.ai-search-filter-group__chips {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}
@media (max-width: 640px) {
    .ai-search-filter-group {
        flex-direction: column;
        gap: 6px;
    }
    .ai-search-filter-group__label {
        flex: 0 0 auto;
        padding-top: 0;
    }
}
.ai-search-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 4px 4px 11px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 8px;
    background: #F4F5FA;
    color: #3C3E54;
    border: 1px solid #E3E5EE;
    line-height: 1.35;
    letter-spacing: 0.01em;
}
.ai-search-filter-tag__label {
    display: inline-block;
}
.ai-search-filter-tag__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    padding: 0;
    margin-left: 2px;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: inherit;
    opacity: 0.5;
    cursor: pointer;
    transition: opacity 0.15s ease, background 0.15s ease;
}
.ai-search-filter-tag__remove:hover {
    opacity: 1;
    background: rgba(0, 0, 0, 0.08);
}
.ai-search-filter-tag__remove svg {
    display: block;
}
.ai-search-filter-tag--branch { background: #F5F0FE; color: #5B21B6; border-color: #E4D7FB; }
.ai-search-filter-tag--state { background: #EEF4FE; color: #1E40AF; border-color: #DBE7FC; }
.ai-search-filter-tag--employee { background: #FFF7E6; color: #92400E; border-color: #FCE7C0; }
.ai-search-filter-tag--technology { background: #EAFBF3; color: #065F46; border-color: #CDF0DF; }
.ai-search-filter-tag--keyword { background: #EAFBF3; color: #065F46; border-color: #CDF0DF; }
.ai-search-filter-tag--required { background: #FEEFEE; color: #991B1B; border-color: #FBDADA; }
.ai-search-filter-tag--job { background: #FFF7E6; color: #92400E; border-color: #FCE7C0; }
.ai-search-filter-tag--exclude { background: #F4F5FA; color: #6B7280; border-color: #E3E5EE; text-decoration: line-through; }
.ai-search-filter-tag--collapsed { display: none !important; }
.ai-search-filter-tag--toggle {
    cursor: pointer;
    background: transparent;
    color: inherit;
    border-style: dashed;
    padding: 4px 11px;
    font-weight: 500;
    opacity: 0.85;
    transition: opacity 0.15s ease, background 0.15s ease;
}
.ai-search-filter-tag--toggle:hover {
    opacity: 1;
    background: rgba(0, 0, 0, 0.04);
}
.ai-search-filter-tag--toggle[data-expanded="true"] {
    border-style: solid;
    opacity: 0.75;
}

/* Inline-Expand-Liste: alle Einzelwerte einer Pill als 2-Spalten-Grid mit
   individuellem Remove-Knopf. Sitzt direkt IN der Pill (kein Float-Popover
   mehr, das beim Hover wegrutscht). Sichtbar nur, wenn die Pill .is-expanded
   hat - das Toggle setzt der Click-Handler im JS. Recycelt 1:1 die
   bestehende removeFilterFromPreview()-Logik. */
.ai-search-filter-pill__popover {
    flex-basis: 100%;
    width: 100%;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #E2E8F0;
    display: none;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 2px 6px;
    max-height: 320px;
    overflow-y: auto;
}
.ai-search-filter-pill.is-expanded .ai-search-filter-pill__popover {
    display: grid;
}
.ai-search-filter-pill__popover-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 6px;
    font-size: 12.5px;
    color: #1f2937;
    line-height: 1.35;
    background: #FFFFFF;
    border: 1px solid transparent;
    transition: background 0.12s ease, border-color 0.12s ease;
}
.ai-search-filter-pill__popover-item:hover {
    background: #F1F5F9;
    border-color: #E2E8F0;
}
.ai-search-filter-pill__popover-value {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ai-search-filter-pill__popover-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 5px;
    color: #94a3b8;
    cursor: pointer;
    transition: color 0.12s ease, background 0.12s ease;
}
.ai-search-filter-pill__popover-remove:hover {
    color: #ef4444;
    background: #FEF2F2;
}
.ai-search-filter-pill__popover-remove svg {
    display: block;
}

/* Chevron: kleines Klick-Affordance-Icon zwischen Count-Badge und Remove.
   Rotiert beim Aufklappen. Bei Single-Value-Pills nicht gerendert. */
.ai-search-filter-pill__chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #94a3b8;
    cursor: pointer;
    transition: color 0.12s ease, background 0.12s ease, transform 0.18s ease;
}
.ai-search-filter-pill__chevron:hover {
    color: #475569;
    background: #F1F5F9;
}
.ai-search-filter-pill__chevron svg {
    display: block;
    transition: transform 0.18s ease;
}
.ai-search-filter-pill.is-expanded .ai-search-filter-pill__chevron svg {
    transform: rotate(180deg);
}

.ai-search-preview-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
    width: 100%;
}
/* Primary CTA: groesser, shine, ambient glow, idle arrow drift.
   Drei Aufmerksamkeits-Layer:
   1) Shine: Highlight wandert alle 5s einmal ueber den Button (Hero-CTA-Stil)
   2) Ambient Glow: pulst die ersten 8s nach Render staerker
   3) Arrow Drift: kleines Pendeln des Pfeils im Idle-Zustand
   Alle drei Layer werden bei prefers-reduced-motion deaktiviert. */
.ai-search-apply-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 28px;
    min-height: 52px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: #fff;
    background: linear-gradient(120deg, #191d93 0%, #3d42b5 58%, #4f46e5 100%);
    border: none;
    border-radius: 14px;
    cursor: pointer;
    overflow: hidden;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.18) inset,
        0 1px 2px rgba(25, 29, 147, 0.35),
        0 10px 26px rgba(25, 29, 147, 0.32);
    transition: background 0.2s ease, transform 0.12s ease, box-shadow 0.2s ease, filter 0.2s ease;
    animation: aiApplyAmbientGlow 2.4s ease-in-out 0s 4;
}
.ai-search-apply-btn__label {
    display: inline-block;
    white-space: nowrap;
    position: relative;
    z-index: 1;
}
.ai-search-apply-btn svg {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    transition: transform 0.18s ease;
    animation: aiApplyArrowDrift 4s ease-in-out infinite;
}
.ai-search-apply-btn__shine {
    position: absolute;
    top: 0;
    left: 0;
    width: 35%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0) 100%);
    transform: translateX(-160%) skewX(-20deg);
    animation: aiApplyShine 5s ease-in-out infinite;
    animation-delay: 1.2s;
    pointer-events: none;
    z-index: 0;
}
.ai-search-apply-btn:hover {
    filter: brightness(1.06);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.22) inset,
        0 2px 3px rgba(25, 29, 147, 0.38),
        0 14px 30px rgba(25, 29, 147, 0.38);
    transform: translateY(-1px);
}
.ai-search-apply-btn:hover svg {
    transform: translateX(4px);
    animation: none;
}
.ai-search-apply-btn:active {
    transform: scale(0.985);
}
.ai-search-apply-btn:focus-visible {
    outline: 2px solid rgba(79, 70, 229, 0.55);
    outline-offset: 2px;
}
@keyframes aiApplyShine {
    0%   { transform: translateX(-160%) skewX(-20deg); }
    35%  { transform: translateX(420%) skewX(-20deg); }
    100% { transform: translateX(420%) skewX(-20deg); }
}
@keyframes aiApplyAmbientGlow {
    0%, 100% {
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.18) inset,
            0 1px 2px rgba(25, 29, 147, 0.35),
            0 10px 26px rgba(25, 29, 147, 0.32);
    }
    50% {
        box-shadow:
            0 1px 0 rgba(255, 255, 255, 0.22) inset,
            0 2px 3px rgba(25, 29, 147, 0.4),
            0 16px 36px rgba(124, 58, 237, 0.42);
    }
}
@keyframes aiApplyArrowDrift {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(2px); }
}
@media (prefers-reduced-motion: reduce) {
    .ai-search-apply-btn,
    .ai-search-apply-btn svg,
    .ai-search-apply-btn__shine {
        animation: none !important;
    }
}

/* Verwerfen: Ghost-Sekundaeraktion, kein Border mehr - er soll bewusst
   nicht mit dem Primary konkurrieren. */
.ai-search-cancel-btn {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #94a3b8;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease;
}
.ai-search-cancel-btn:hover {
    color: #475569;
    background: #F8FAFC;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Mikro-Reassurance unter den Action-Buttons: senkt die wahrgenommene Huerde
   des Klicks ("ich kann jederzeit zurueck"). Sehr dezent - das soll keine
   eigene Aufmerksamkeit ziehen, sondern nur am Rand ankommen. */
.ai-search-preview-reassurance {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 8px 0 0;
    padding: 0;
    font-size: 11.5px;
    font-weight: 400;
    color: #94a3b8;
    line-height: 1.4;
}
.ai-search-preview-reassurance svg {
    flex-shrink: 0;
    opacity: 0.8;
}

.ai-search-preview-hint {
    font-size: 12px;
    color: #6B7280;
    font-weight: 400;
    line-height: 1.35;
}
.ai-search-reply-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    padding: 4px 4px 4px 14px;
    background: #F8F9FB;
    border: 1px solid #E3E5EE;
    border-radius: 10px;
    transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.ai-search-reply-wrap:focus-within {
    background: #ffffff;
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(58, 49, 200, 0.1);
}
.ai-search-reply-wrap--refine {
    margin-top: 14px;
}
.ai-search-reply-input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-size: 13px;
    color: var(--g800, #1f2937);
    line-height: 1.4;
}
.ai-search-reply-input::placeholder {
    color: var(--g400, #9ca3af);
}
.ai-search-reply-btn {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: var(--custom-primary);
    color: #fff;
    cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}
.ai-search-reply-btn:hover {
    background: var(--custom-primary-200);
}
.ai-search-reply-btn:active {
    transform: scale(0.96);
}
.ai-search-count-feedback {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 4px 20px 18px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.5;
    border-radius: 10px;
    animation: aiChatFadeIn 0.3s ease;
}
.ai-search-count-feedback--success {
    background: #F0FDF7;
    border: 1px solid #BBF2D4;
    color: #065F46;
}
.ai-search-count-feedback--warning {
    background: #FFFAEB;
    border: 1px solid #FDE1A4;
    color: #92400E;
}
.ai-search-count-feedback--empty {
    background: #FEF5F5;
    border: 1px solid #FBCDCD;
    color: #991B1B;
}
.ai-search-count-feedback__action {
    background: rgba(255, 255, 255, 0.7);
}
.ai-search-count-feedback__action:hover {
    background: #ffffff;
}
.ai-search-count-feedback__icon {
    flex-shrink: 0;
    margin-top: 1px;
}
.ai-search-count-feedback__body {
    flex: 1;
    min-width: 0;
}
.ai-search-count-feedback__text {
    margin: 0 0 6px;
}
.ai-search-count-feedback__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.ai-search-count-feedback__action {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 16px;
    border: 1px solid currentColor;
    background: transparent;
    cursor: pointer;
    opacity: 0.85;
    transition: opacity 0.15s;
}
.ai-search-count-feedback__action:hover {
    opacity: 1;
}

/* ========================================
   AI Result Feedback (im Results-Bereich, nach Filter-Anwenden)
   ======================================== */
.ai-search-result-feedback {
    margin: 0 0 12px 0;
}
.ai-search-result-feedback__inner {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 44px 14px 16px;
    font-size: 13px;
    line-height: 1.5;
    color: #1f2937;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.25);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 16px -4px rgba(15, 23, 42, 0.06);
    animation: aiChatFadeIn 0.3s ease;
}
.ai-search-result-feedback--success,
.ai-search-result-feedback--warning,
.ai-search-result-feedback--empty {
    background: #ffffff;
    color: #1f2937;
    border-color: rgba(148, 163, 184, 0.25);
}
.ai-search-result-feedback__icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    margin-top: 1px;
    border-radius: 50%;
    background: rgba(58, 49, 200, 0.08);
    color: var(--custom-primary);
}
.ai-search-result-feedback--warning .ai-search-result-feedback__icon {
    background: rgba(245, 158, 11, 0.12);
    color: #B45309;
}
.ai-search-result-feedback--empty .ai-search-result-feedback__icon {
    background: rgba(239, 68, 68, 0.10);
    color: #B91C1C;
}
.ai-search-result-feedback--pending .ai-search-result-feedback__icon {
    background: rgba(100, 116, 139, 0.10);
    color: #64748b;
}
.ai-search-result-feedback--pending .ai-search-result-feedback__text {
    color: #64748b;
    font-style: italic;
}
.ai-search-result-feedback__body {
    flex: 1;
    min-width: 0;
}
.ai-search-result-feedback__text {
    margin: 0 0 8px;
    font-weight: 500;
}
.ai-search-result-feedback__text:empty {
    display: none;
    margin: 0;
}
.ai-search-result-feedback__text strong {
    font-weight: 700;
}
.ai-search-result-feedback__sub {
    display: inline;
    font-weight: 400;
    opacity: 0.82;
}
/* Kompakte Variante: Box ohne Narrative + ohne Chips (z.B. Filter-only-Suche).
   Icon bleibt dezent, aber die Leiste steht weniger aufdringlich da. */
.ai-search-result-feedback--success .ai-search-result-feedback__icon {
    background: rgba(100, 116, 139, 0.08);
    color: #475569;
}
.ai-search-result-feedback__body > .ai-search-result-feedback__mode-toggle:first-child {
    margin-top: 0;
}
.ai-search-result-feedback__mode-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.ai-search-result-feedback__mode {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border: 1px solid #d8dee8;
    border-radius: 8px;
    background: #ffffff;
    color: #475569;
    font-size: 12px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.ai-search-result-feedback__mode:hover {
    color: #1f2937;
    border-color: #b0bac8;
    background: #f8fafc;
}
.ai-search-result-feedback__mode.is-active {
    background: #eef0fc;
    color: var(--custom-primary, #191d93);
    border-color: var(--custom-primary-100, #c4c2e8);
    box-shadow: 0 1px 3px var(--custom-primary-glow, rgba(25, 29, 147, 0.18));
    font-weight: 600;
}
.ai-search-result-feedback__mode svg {
    flex: 0 0 auto;
    opacity: 0.7;
}
.ai-search-result-feedback__mode.is-active svg {
    opacity: 1;
    color: var(--custom-primary, #191d93);
}
/* Primary-Variante: "KI-Assistent" oeffnet das Slide-in-Panel und ist der
   prominentere Einstiegspunkt. Wir zeichnen ihn im CI-Blau aus, damit
   User den Haupteinstieg sofort sehen. */
.ai-search-result-feedback__mode--primary {
    background: var(--custom-primary, #191d93);
    color: #ffffff;
    border-color: var(--custom-primary, #191d93);
    font-weight: 600;
    box-shadow: 0 1px 3px var(--custom-primary-glow, rgba(25, 29, 147, 0.18));
}
.ai-search-result-feedback__mode--primary:hover {
    background: #15187a;
    color: #ffffff;
    border-color: #15187a;
    box-shadow: 0 2px 6px var(--custom-primary-glow, rgba(25, 29, 147, 0.28));
}
.ai-search-result-feedback__mode--primary svg {
    opacity: 1;
}

/* ---------- Deterministische Analyse: Preset-Buttons + Ergebnis-Panel ---------- */
.ai-search-result-feedback__presets {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}
.ai-search-result-feedback__preset {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border: 1px solid #d8dee8;
    border-radius: 999px;
    background: #ffffff;
    color: #334155;
    font-size: 12px;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.ai-search-result-feedback__preset:hover {
    background: #f1f5f9;
    border-color: var(--custom-primary-100, #c4c2e8);
    color: var(--custom-primary, #191d93);
}
.ai-search-result-feedback__preset.is-active {
    background: var(--custom-primary-glow, rgba(25, 29, 147, 0.08));
    border-color: var(--custom-primary, #191d93);
    color: var(--custom-primary, #191d93);
    font-weight: 600;
}
.ai-search-result-feedback__preset[disabled] {
    opacity: 0.5;
    cursor: progress;
}
.ai-search-result-feedback__analysis {
    margin-top: 12px;
    padding: 12px 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}
.ai-search-result-feedback__analysis-loading {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--custom-primary, #191d93);
    font-weight: 500;
}
.ai-search-result-feedback__analysis-loading-text {
    flex: 1;
    min-width: 0;
}
.ai-search-result-feedback__analysis-spinner {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    border: 2px solid var(--custom-primary-100, rgba(25, 29, 147, 0.25));
    border-top-color: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: ai-search-spinner 0.7s linear infinite;
}
.ai-search-result-feedback__analysis-error,
.ai-search-result-feedback__analysis-hint {
    font-size: 12px;
    color: #64748b;
}
.ai-search-result-feedback__analysis-error {
    color: #b91c1c;
}
.ai-search-result-feedback__analysis-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}
.ai-search-result-feedback__analysis-header strong {
    color: #0f172a;
    font-size: 13px;
    flex: 1;
}
.ai-search-result-feedback__analysis-total {
    font-size: 11px;
    color: #64748b;
    margin-left: auto;
}
.ai-search-result-feedback__analysis-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    margin-left: 4px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.ai-search-result-feedback__analysis-close:hover {
    background: #e2e8f0;
    color: #0f172a;
}
.ai-search-result-feedback__analysis-deeplinks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #e2e8f0;
}
.ai-search-result-feedback__analysis-deeplink {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: #ffffff;
    color: var(--custom-primary, #191d93);
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.ai-search-result-feedback__analysis-deeplink:hover {
    background: var(--custom-primary-glow, rgba(25, 29, 147, 0.08));
    border-color: var(--custom-primary, #191d93);
    color: var(--custom-primary, #191d93);
}
.ai-search-result-feedback__analysis-deeplink svg {
    opacity: 0.7;
}
.ai-search-result-feedback__analysis-summary {
    font-size: 12px;
    color: #475569;
    margin-bottom: 8px;
}
.ai-search-result-feedback__bars {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.ai-search-result-feedback__bar-row {
    display: grid;
    grid-template-columns: minmax(110px, 180px) 1fr auto;
    align-items: center;
    gap: 10px;
    font-size: 12px;
}
.ai-search-result-feedback__bar-label {
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ai-search-result-feedback__bar-track {
    position: relative;
    height: 8px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
}
.ai-search-result-feedback__bar-fill {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, var(--custom-primary, #191d93) 0%, var(--custom-primary-light, #3d42b5) 100%);
    border-radius: 999px;
    transition: width 0.25s ease;
}
.ai-search-result-feedback__bar-value {
    font-variant-numeric: tabular-nums;
    color: #334155;
    white-space: nowrap;
}
.ai-search-result-feedback__bar-value em {
    font-style: normal;
    color: #94a3b8;
    font-size: 11px;
}
.ai-search-result-feedback__chat {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    margin-top: 8px;
    padding: 4px 4px 4px 12px;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.3);
    border-radius: 10px;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.ai-search-result-feedback__chat:focus-within {
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(58, 49, 200, 0.08);
}
.ai-search-result-feedback__chat-input {
    flex: 1;
    min-width: 0;
    padding: 6px 4px;
    border: none;
    outline: none;
    background: transparent;
    font-size: 13px;
    color: #1f2937;
    font-family: inherit;
    line-height: 1.35;
    resize: none;
    min-height: 22px;
    max-height: 180px;
    overflow-y: auto;
}
.ai-search-result-feedback__chat-input::placeholder {
    color: #9CA3AF;
    font-weight: 400;
    opacity: 0.8;
}
.ai-search-result-feedback__chat-input::-webkit-search-cancel-button,
.ai-search-result-feedback__chat-input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}
.ai-search-result-feedback__chat-send {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: var(--custom-primary);
    color: #ffffff;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.1s ease;
}
.ai-search-result-feedback__chat-send:hover {
    background: var(--custom-primary-200);
}
.ai-search-result-feedback__chat-send:active {
    transform: scale(0.95);
}
.ai-search-result-feedback__chat-send:disabled,
.ai-search-result-feedback__chat-input:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}
.ai-search-result-feedback.is-busy .ai-search-result-feedback__chat-send {
    position: relative;
}
.ai-search-result-feedback.is-busy .ai-search-result-feedback__chat-send::after {
    content: '';
    position: absolute;
    inset: 6px;
    border: 2px solid rgba(255, 255, 255, 0.55);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: ai-search-spinner 0.7s linear infinite;
}
.ai-search-result-feedback.is-busy .ai-search-result-feedback__chat-send svg {
    visibility: hidden;
}
@keyframes ai-search-spinner {
    to { transform: rotate(360deg); }
}

/* Live-Status Zeile im Results-Feedback (Activity-Stream aus dem Backend) */
.ai-search-result-feedback__status {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--custom-primary-glow, rgba(25, 29, 147, 0.06));
    border: 1px solid var(--custom-primary-100, rgba(25, 29, 147, 0.18));
    font-size: 12.5px;
    line-height: 1.35;
    color: var(--custom-primary, #191d93);
    animation: ai-search-status-in 0.18s ease-out;
}
@keyframes ai-search-status-in {
    from { opacity: 0; transform: translateY(-2px); }
    to   { opacity: 1; transform: translateY(0); }
}
.ai-search-result-feedback__status-dots {
    display: inline-flex;
    gap: 3px;
    flex-shrink: 0;
}
.ai-search-result-feedback__status-dots span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--custom-primary, #191d93);
    animation: ai-search-status-pulse 1.2s ease-in-out infinite;
}
.ai-search-result-feedback__status-dots span:nth-child(2) { animation-delay: 0.18s; }
.ai-search-result-feedback__status-dots span:nth-child(3) { animation-delay: 0.36s; }
@keyframes ai-search-status-pulse {
    0%, 100% { opacity: 0.35; transform: scale(0.85); }
    50%      { opacity: 1;    transform: scale(1);    }
}
.ai-search-result-feedback__status-text {
    flex: 1;
    min-width: 0;
    font-weight: 500;
    word-break: break-word;
}

.ai-search-result-feedback__inline-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 8px;
    padding: 8px 10px 8px 12px;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.4;
    color: #334155;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(148, 163, 184, 0.28);
}

.ai-search-result-feedback__inline-note-text {
    flex: 1 1 auto;
    min-width: 0;
}

.ai-search-result-feedback__inline-note-close {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.ai-search-result-feedback__inline-note-close:hover,
.ai-search-result-feedback__inline-note-close:focus-visible {
    background: rgba(100, 116, 139, 0.12);
    color: #1e293b;
    outline: none;
}

.ai-search-result-feedback__inline-note.is-error {
    color: #7f1d1d;
    background: #fef2f2;
    border-color: rgba(239, 68, 68, 0.3);
}

.ai-search-result-feedback__dedup-confirm {
    position: relative;
    margin-top: 10px;
    padding: 12px 38px 12px 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--custom-primary-100, rgba(58, 49, 200, 0.18));
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.ai-search-result-feedback__dedup-confirm-title {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: #1e293b;
}
.ai-search-result-feedback__dedup-confirm-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.ai-search-result-feedback__dedup-confirm-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: #ffffff;
    color: #1e293b;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.ai-search-result-feedback__dedup-confirm-item:hover,
.ai-search-result-feedback__dedup-confirm-item:focus-visible {
    border-color: var(--custom-primary, #3a31c8);
    background: #eef0ff;
    color: #1e293b;
    outline: none;
    box-shadow: 0 1px 3px rgba(58, 49, 200, 0.18);
}
.ai-search-result-feedback__dedup-confirm-item:hover .ai-search-result-feedback__dedup-confirm-hint,
.ai-search-result-feedback__dedup-confirm-item:focus-visible .ai-search-result-feedback__dedup-confirm-hint {
    color: #475569;
}
.ai-search-result-feedback__dedup-confirm-item.is-applied {
    border-color: rgba(16, 185, 129, 0.45);
    background: rgba(16, 185, 129, 0.08);
    color: #065f46;
    cursor: default;
}
.ai-search-result-feedback__dedup-confirm-item[disabled] {
    opacity: 0.85;
}
.ai-search-result-feedback__dedup-confirm-label {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}
.ai-search-result-feedback__dedup-confirm-hint {
    font-size: 12px;
    color: #64748b;
    line-height: 1.35;
}
.ai-search-result-feedback__dedup-confirm-item.is-applied .ai-search-result-feedback__dedup-confirm-hint {
    color: #047857;
}
.ai-search-result-feedback__dedup-confirm-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.ai-search-result-feedback__dedup-confirm-close:hover,
.ai-search-result-feedback__dedup-confirm-close:focus-visible {
    background: rgba(100, 116, 139, 0.12);
    color: #1e293b;
    outline: none;
}

.ai-search-result-feedback__inline-clarify {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(99, 102, 241, 0.25);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}
.ai-search-result-feedback__inline-clarify-text {
    margin: 0 0 8px 0;
    font-size: 13px;
    line-height: 1.4;
    color: #1f2937;
    font-weight: 500;
}
.ai-search-result-feedback__inline-clarify-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.ai-search-result-feedback__inline-clarify-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: 500;
    color: var(--custom-primary, #191d93);
    background: #eef2ff;
    border: 1px solid rgba(99, 102, 241, 0.3);
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.ai-search-result-feedback__inline-clarify-chip:hover {
    background: #e0e7ff;
    border-color: rgba(99, 102, 241, 0.5);
}
.ai-search-result-feedback__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.ai-search-result-feedback__action {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: #ffffff;
    color: #1f2937;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}
.ai-search-result-feedback__action:hover {
    background: #f8fafc;
    border-color: rgba(58, 49, 200, 0.35);
    color: var(--custom-primary);
    transform: translateY(-1px);
}
.ai-search-result-feedback__action:active {
    transform: translateY(0);
}

/* Relax-Action: deutlicher als "Weichmacher" kennzeichnen, damit der
   User im 0-Treffer-Banner sieht, dass er hier gezielt entspannt. */
.ai-search-result-feedback__action--relax {
    background: #fff7ed;
    border-color: rgba(249, 115, 22, 0.35);
    color: #9a3412;
}
.ai-search-result-feedback__action--relax:hover {
    background: #ffedd5;
    border-color: rgba(249, 115, 22, 0.6);
    color: #7c2d12;
}

/* Advisory-Strategy-Badge: signalisiert dass eine Scoring-Strategie
   aktiv ist (Stage B-Mini). Bewusst zurueckhaltend, damit er die
   Narrative nicht ueberlaedt. */
.ai-search-result-feedback__strategy {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    margin-bottom: 6px;
    font-size: 11.5px;
    font-weight: 500;
    color: #4338ca;
    background: rgba(99, 102, 241, 0.08);
    border: 1px solid rgba(99, 102, 241, 0.24);
    border-radius: 999px;
    width: fit-content;
}
.ai-search-result-feedback__strategy svg {
    color: #6366f1;
    flex-shrink: 0;
}

/* Smart-Suggestions als chat-bubble-artige Text-Vorschlaege, bewusst kein Pill-Look. */
.ai-search-result-feedback__suggestions {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px 8px;
    margin-top: 4px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(99, 102, 241, 0.06);
    border: 1px solid rgba(99, 102, 241, 0.16);
    font-size: 12.5px;
    line-height: 1.55;
    color: #334155;
}
.ai-search-result-feedback__suggestions-label {
    font-weight: 600;
    color: #3a31c8;
    font-size: 11.5px;
    letter-spacing: 0.2px;
    text-transform: uppercase;
    flex: 0 0 auto;
}
.ai-search-result-feedback__suggestions-list {
    display: inline;
    flex: 1 1 auto;
    min-width: 0;
}
.ai-search-result-feedback__suggestions-sep {
    display: inline-block;
    margin: 0 4px;
    color: rgba(99, 102, 241, 0.5);
    font-weight: 600;
}
.ai-search-result-feedback__suggestion {
    display: inline;
    padding: 0;
    border: 0;
    background: transparent;
    color: #3a31c8;
    font: inherit;
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: rgba(58, 49, 200, 0.35);
    text-underline-offset: 3px;
    cursor: pointer;
    transition: color 0.12s ease, text-decoration-color 0.12s ease;
}
.ai-search-result-feedback__suggestion:hover,
.ai-search-result-feedback__suggestion:focus-visible {
    color: #1f1a8a;
    text-decoration-color: #1f1a8a;
    outline: none;
}

/* LLM-generierter Refinement-Chip: abhebbare Pille mit CI-Blau-Outline
   und KI-Indikator, damit er sich von den statischen Vorschlags-Chips
   der Branchen-Cluster optisch unterscheidet. Nur 0-2 pro Auswahl. */
.ai-search-result-feedback__suggestion--llm {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    margin: 0 2px;
    border: 1px solid rgba(58, 49, 200, 0.35);
    background: rgba(58, 49, 200, 0.06);
    color: #3a31c8;
    text-decoration: none;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.ai-search-result-feedback__suggestion--llm::before {
    content: "KI";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    padding: 0 5px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #FFFFFF;
    background: #3a31c8;
    border-radius: 999px;
    line-height: 1;
    height: 14px;
}
.ai-search-result-feedback__suggestion--llm:hover,
.ai-search-result-feedback__suggestion--llm:focus-visible {
    background: rgba(58, 49, 200, 0.12);
    border-color: #3a31c8;
    color: #1f1a8a;
    text-decoration: none;
}
.ai-search-result-feedback__dismiss {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    color: inherit;
    opacity: 0.5;
    cursor: pointer;
    border-radius: 6px;
    transition: opacity 0.15s, background 0.15s;
}
.ai-search-result-feedback__dismiss:hover {
    opacity: 0.9;
    background: rgba(0, 0, 0, 0.05);
}

/* Reopen-Pille. Wird als einziger Inhalt des Mount-Containers gerendert,
   wenn der User das volle Refinement-Banner ueber das X geschlossen hat.
   Dezente Pille in CI-Blau, deutlich kleiner als das volle Banner, damit
   sie ueber der Ergebnisliste nicht stoert. Ein Klick reaktiviert das
   vollstaendige Banner mitsamt Chat-Input und Vorschlaegen. */
.ai-search-result-feedback__reopen {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 600;
    color: #ffffff;
    background: var(--custom-primary, #191d93);
    border: 1px solid var(--custom-primary, #191d93);
    border-radius: 999px;
    cursor: pointer;
    box-shadow: 0 1px 3px var(--custom-primary-glow, rgba(25, 29, 147, 0.18));
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.ai-search-result-feedback__reopen:hover {
    background: #15187a;
    border-color: #15187a;
    box-shadow: 0 2px 6px var(--custom-primary-glow, rgba(25, 29, 147, 0.28));
}
.ai-search-result-feedback__reopen svg {
    opacity: 0.95;
}

.ai-search-loading {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    padding: 4px 20px 18px 20px;
    text-align: left;
    background: transparent;
    border: none;
    border-radius: 0;
    animation: aiChatFadeIn 0.25s ease;
}

.ai-search-loading-dots {
    padding-left: 2px;
}
.ai-search-loading-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.ai-search-loading-dots span {
    width: 7px;
    height: 7px;
    background: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: aiDotPulse 1.2s ease-in-out infinite;
}
.ai-search-loading-dots span:nth-child(2) { animation-delay: 0.2s; }
.ai-search-loading-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes aiDotPulse {
    0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
    40% { opacity: 1; transform: scale(1); }
}
.ai-search-loading-text {
    display: block;
    max-width: 28rem;
    margin: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--g600);
    line-height: 1.45;
    letter-spacing: 0.01em;
    opacity: 1;
    transition: opacity 0.15s ease-out;
}

.discovery-video-link:hover {
    color: #6B7280;
    text-decoration: none;
}
.discovery-video-link svg {
    opacity: 0.7;
}

.discovery-search-hero {
    text-align: center;
    width: 100%;
    max-width: 760px;
    margin-inline: auto;
    margin-bottom: 1.5rem;
}
.discovery-screen--search-first .discovery-search-hero {
    margin-bottom: 1.5rem;
}
.discovery-screen--search-first .discovery-search-hero-title {
    font-size: clamp(calc(1.5rem - 1px), calc(3.2vw - 1px), calc(2rem - 1px));
    font-weight: 800;
    color: var(--custom-font);
    margin: 0 0 6px 0;
    line-height: 1.15;
    letter-spacing: -0.025em;
    text-wrap: balance;
}
.discovery-search-hero-highlight {
    color: var(--custom-primary, #191d93);
    font-weight: 800;
}
.discovery-screen--search-first .discovery-search-hero-subtitle {
    font-size: clamp(0.95rem, 1.6vw, 1.15rem);
    color: var(--custom-primary, #191d93);
    opacity: 0.62;
    margin: 0 0 0 0;
    max-width: 40rem;
    margin-inline: auto;
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: -0.01em;
}
.discovery-search-hero-subtitle-highlight {
    color: var(--custom-primary, #191d93);
    font-weight: 600;
}
.discovery-search-hero-stat {
    font-size: 13px;
    color: var(--g500);
    margin: 8px 0 0;
    text-align: center;
}
.discovery-search-sample {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    width: fit-content;
    max-width: min(100%, 40rem);
    margin: 0.85rem 0 0;
    padding: 0.2rem 0;
    font-size: 0;
    line-height: 0;
    text-align: left;
    color: var(--g700);
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
.discovery-search-sample__pulse {
    flex-shrink: 0;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--custom-primary, #191d93);
    box-shadow: 0 0 10px rgba(25, 29, 147, 0.35);
    animation: discoverySearchSamplePulse 2.2s ease-in-out infinite;
}
.discovery-search-sample__text {
    font-size: clamp(0.8125rem, 1.85vw, 0.9375rem);
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.01em;
    color: var(--g700);
}
.discovery-search-sample__hit {
    font-weight: 800;
    color: var(--custom-primary, #191d93);
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}
@keyframes discoverySearchSamplePulse {
    0%, 100% {
        opacity: 0.88;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.12);
    }
}
@media (prefers-reduced-motion: reduce) {
    .discovery-search-sample__pulse {
        animation: none;
    }
}
.discovery-trust-bar {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
    justify-content: center;
}
.discovery-trust-bar--screen-bottom {
    margin-top: auto;
    padding-top: 1.5rem;
    margin-bottom: 0;
    width: 100%;
    max-width: 920px;
    margin-inline: auto;
}
.discovery-trust-bar .pricing-trust-inline {
    justify-content: center;
    gap: 0.4rem 0.65rem;
    row-gap: 0.5rem;
}
.discovery-trust-bar .pricing-trust-chip {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--g600);
    padding: 0.25rem 0.08rem;
    line-height: 1.45;
}
.discovery-trust-bar .pricing-trust-chip--customers {
    font-weight: 700;
    color: var(--g800);
}
.discovery-trust-bar .pricing-trust-chip:nth-child(n+3) {
    opacity: 1;
}
.discovery-trust-bar .pricing-trust-chip--stars {
    color: var(--g700);
    background: transparent;
    padding: 0.25rem 0.08rem;
}
.discovery-trust-bar .pricing-trust-chip--stars svg {
    width: 16px;
    height: 16px;
}
.discovery-trust-benefits {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.7rem 1rem;
    margin-top: 0.55rem;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--g600);
}
.discovery-trust-benefits__item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
.discovery-trust-benefits__check {
    color: var(--custom-primary, #191d93);
    font-size: 11px;
    line-height: 1;
}
.discovery-micro-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.35rem 0.9rem;
    margin-top: 1rem;
}
.discovery-data-basis {
    margin: 0.55rem 0 0 0;
    text-align: center;
    font-size: 0.78rem;
    color: var(--g600, #6b7280);
    font-weight: 400;
    letter-spacing: 0.1px;
}
.discovery-data-basis__highlight {
    color: var(--custom-primary, #191d93);
    font-weight: 600;
}
.discovery-data-basis--live {
    margin: 0.35rem 0 0 1rem;
    text-align: left;
    font-size: 0.72rem;
    color: var(--g500, #94a3b8);
    opacity: 0.9;
}
.discovery-data-basis--live .discovery-data-basis__highlight {
    font-weight: 600;
    color: var(--custom-primary-200, #191d93);
    opacity: 0.85;
}
.discovery-data-basis--hero {
    margin: 0.35rem 0 0 0;
    text-align: center;
    font-size: 0.82rem;
    color: var(--g600, #6b7280);
}
.discovery-micro-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--g600);
    letter-spacing: 0.01em;
}
.discovery-micro-badge__check {
    color: var(--custom-primary, #191d93);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
}

/* Inline-USPs (subtile Trust-Zeile unter dem Suchfeld) */
.discovery-inline-usps {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0 0.65rem;
    margin-top: 0.75rem;
    font-size: 0.75rem;
    color: var(--g500, #64748b);
    letter-spacing: 0.01em;
    line-height: 1.5;
}
.discovery-inline-usp {
    display: inline-flex;
    align-items: center;
    position: relative;
}
.discovery-inline-usp + .discovery-inline-usp::before {
    content: "·";
    margin-right: 0.65rem;
    color: var(--g400, #94a3b8);
    font-weight: 600;
}

.discovery-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 1.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--g200);
}

.discovery-header-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--custom-primary-50);
    color: var(--custom-primary);
    flex-shrink: 0;
}

.discovery-header-title {
    font-size: 19px;
    font-weight: 700;
    color: var(--custom-font);
    margin: 0 0 3px 0;
    line-height: 1.3;
}

.discovery-header-subtitle {
    font-size: 13px;
    color: var(--custom-font-50);
    margin: 0;
    line-height: 1.5;
}

/* Discovery Segments */
.discovery-segments {
    margin-bottom: 1rem;
}

.discovery-segments--primary {
    margin-bottom: 1.5rem;
}

.discovery-segments-label {
    display: block;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--custom-font-50);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
}

.discovery-segments-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.discovery-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    background: white;
    border: 1px solid var(--g200);
    border-radius: var(--r-sm);
    cursor: pointer;
    transition: var(--ease);
    text-align: left;
}

.discovery-chip:hover {
    background: var(--g50);
    border-color: var(--g300);
    transform: translateY(-1px);
    box-shadow: var(--sh-md);
}

.discovery-chip-icon {
    flex-shrink: 0;
    color: var(--custom-primary);
    opacity: 0.7;
}

.discovery-chip:hover .discovery-chip-icon {
    opacity: 1;
}

.discovery-chip-name {
    font-size: 12.5px;
    font-weight: 500;
    color: var(--custom-font);
    line-height: 1.2;
}

.discovery-chip:hover .discovery-chip-name {
    color: var(--custom-font);
}

.discovery-chip-count {
    font-size: 11px;
    font-weight: 500;
    padding: 2px 6px;
    border-radius: 5px;
    background: var(--g100);
    color: var(--custom-primary);
    line-height: 1.2;
}

/* Segment action button (inline after chips) */
.discovery-segment-action {
    display: inline-flex;
    align-items: center;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--custom-primary);
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px 4px;
    transition: opacity 0.15s ease;
    white-space: nowrap;
}

.discovery-segment-action:hover {
    opacity: 0.7;
}

/* Power Feature (Web Keyword) */
.discovery-power-feature {
    background: var(--g50);
    border: 1px solid var(--g200);
    border-radius: var(--r);
    padding: 12px 14px;
}

.discovery-power-feature-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 10px;
}

.discovery-power-feature-header svg {
    color: var(--custom-primary);
    flex-shrink: 0;
    margin-top: 1px;
}

.discovery-power-feature-title {
    display: block;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--custom-font);
    line-height: 1.3;
}

.discovery-power-feature-subtitle {
    display: block;
    font-size: 11.5px;
    color: var(--custom-font-50);
    line-height: 1.4;
}

.discovery-keyword-search {
    margin-bottom: 10px;
}

.discovery-keyword-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.discovery-keyword-input-icon {
    position: absolute;
    left: 12px;
    color: var(--custom-font-50);
    pointer-events: none;
}

.discovery-keyword-input {
    width: 100%;
    padding: 11px 14px 11px 36px;
    font-size: 14px;
    font-weight: 500;
    color: var(--custom-font);
    background: white;
    border: 1.5px solid #DDDDE5;
    border-radius: 10px;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.discovery-keyword-input::placeholder {
    color: #A0A0B0;
    font-weight: 400;
}

.discovery-keyword-input:focus {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(58, 49, 200, 0.08);
}

.discovery-keyword-counter {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--custom-primary);
    padding-left: 2px;
}

.discovery-keyword-counter--action {
    cursor: pointer;
}

.discovery-keyword-action-link {
    text-decoration: none;
    transition: opacity 0.15s ease;
}

.discovery-keyword-counter--action:hover .discovery-keyword-action-link {
    opacity: 0.75;
}

.discovery-power-feature-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.discovery-power-feature-chips .discovery-chip-name {
    font-weight: 600;
    color: var(--custom-primary-200);
}

/* Discovery Custom Filters */
.discovery-custom {
    margin-top: 1.25rem;
    margin-bottom: 0.25rem;
}

.discovery-custom-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.discovery-custom-divider::before,
.discovery-custom-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #EDEDF5;
}

.discovery-custom-divider span {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--custom-font-50);
    white-space: nowrap;
}

.discovery-custom-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.discovery-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 500;
    padding: 7px 12px;
    border-radius: 8px;
    background: #F8F8FC;
    color: var(--custom-font);
    border: 1px solid #EDEDF5;
    cursor: pointer;
    transition: all 0.15s ease;
}

.discovery-filter-btn:hover {
    border-color: var(--custom-primary);
    color: var(--custom-primary);
    background: var(--custom-primary-50);
}

/* Featured chips (top markets) */
.discovery-chip--featured {
    border-width: 1.5px;
    border-color: var(--custom-primary);
    background: var(--custom-primary-50);
    padding: 9px 16px;
}

.discovery-chip--featured .discovery-chip-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--custom-primary-200);
}

.discovery-chip--featured .discovery-chip-count {
    background: white;
    font-weight: 600;
    font-size: 11px;
    color: var(--custom-primary);
}

.discovery-chip--featured:hover {
    background: white;
    border-color: var(--custom-primary-200);
    box-shadow: 0 3px 12px rgba(58, 49, 200, 0.12);
}

/* "More" chip (Weitere Branchen, Alle Regionen) */
.discovery-chip--more {
    border-style: dashed;
    border-color: #C0C0CC;
    background: transparent;
}

.discovery-chip--more .discovery-chip-name {
    color: var(--custom-font-50);
    font-weight: 500;
    font-size: 12px;
}

.discovery-chip-arrow {
    font-size: 13px;
    color: var(--custom-font-50);
    transition: transform 0.15s ease;
}

.discovery-chip--more:hover {
    background: #F6F6FA;
    border-style: solid;
    border-color: #A0A0B0;
}

.discovery-chip--more:hover .discovery-chip-arrow {
    transform: translateX(2px);
}

/* Combo chips (ready-made target groups) */
.discovery-chip--combo {
    border: 1px dashed var(--custom-primary);
    background: white;
}

.discovery-chip--combo .discovery-chip-name {
    color: var(--custom-primary-200);
    font-weight: 600;
    font-size: 12.5px;
}

.discovery-chip--combo:hover {
    background: var(--custom-primary-50);
    border-style: solid;
}

/* Muted count (smaller, less prominent) */
.discovery-chip-count--muted {
    font-size: 10px;
    opacity: 0.55;
}

/* Smart Search */
.discovery-smart-search {
    margin-bottom: 1.25rem;
}

.discovery-smart-shell {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #ffffff;
    border: 1px solid #E3E5EE;
    border-radius: 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    overflow: hidden;
}

.discovery-smart-shell:focus-within {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 4px rgba(58, 49, 200, 0.08), 0 4px 12px rgba(15, 23, 42, 0.06);
}

.discovery-smart-shell.is-chat-active {
    border-color: #D8DBEC;
    box-shadow: 0 10px 32px -18px rgba(58, 49, 200, 0.25), 0 2px 6px rgba(15, 23, 42, 0.04);
}

/* Chat-Layout: Wenn der KI-Assistent aktiv ist, muss sich die Shell wie ein
   echter Chat lesen. Oben die Nachricht + Chips der KI, UNTEN die Eingabe
   ("Ihre Antwort"). Ohne diesen Umbau steht das Eingabefeld ueber der KI-
   Nachricht und der User versteht nicht, dass er dort antworten soll.
   Wir nutzen CSS-order, weil die Shell bereits flex-column ist - kein
   DOM-Umhaengen noetig. */
.discovery-smart-shell.is-chat-active > .discovery-smart-hint {
    order: 1;
}
.discovery-smart-shell.is-chat-active > .ai-search-chat {
    order: 2;
}
.discovery-smart-shell.is-chat-active > .discovery-smart-input-wrap {
    order: 3;
    border-top: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(248, 250, 252, 0.6);
}
.discovery-smart-shell.is-chat-active > .discovery-smart-input-wrap .discovery-smart-icon {
    /* Lupe im Reply-Modus raus: hier wird geantwortet, nicht gesucht. Pfeil
       am Senden-Button reicht als visuelle Aktion. */
    display: none;
}
.discovery-smart-shell.is-chat-active > .discovery-smart-input-wrap .discovery-smart-input {
    padding-left: 20px;
}

.discovery-smart-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 56px;
    padding: 6px 6px 6px 0;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
}
.discovery-smart-input-wrap:has(textarea.discovery-smart-input) {
    align-items: flex-end;
}

.discovery-smart-icon {
    position: absolute;
    top: 17px;
    left: 20px;
    color: #9CA3AF;
    pointer-events: none;
    flex-shrink: 0;
}

.discovery-smart-input {
    flex: 1;
    padding: 16px 14px 16px 52px;
    font-size: 15px;
    font-weight: 500;
    color: var(--custom-font);
    border: none;
    outline: none;
    background: transparent;
    font-family: var(--custom-font-family), 'Inter', sans-serif;
}

textarea.discovery-smart-input {
    resize: none;
    line-height: 1.45;
    overflow-y: hidden;
    min-height: 56px;
    max-height: 220px;
    display: block;
    width: 100%;
    box-sizing: border-box;
    vertical-align: middle;
}

.discovery-smart-input::placeholder {
    color: #B0B0C0;
    font-weight: 400;
}

.discovery-smart-btn {
    padding: 10px 20px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: white;
    background: var(--custom-primary);
    border: none;
    border-radius: 10px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease, transform 0.1s ease;
}

.discovery-smart-btn:hover {
    background: var(--custom-primary-200);
}

.discovery-smart-btn:active {
    transform: scale(0.97);
}

/* Smart Search Preview Tags */
.discovery-smart-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    min-height: 0;
}

.smart-search-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 11.5px;
    font-weight: 600;
    border-radius: 6px;
    line-height: 1.4;
    white-space: nowrap;
    color: var(--custom-primary, #191d93);
    background: rgba(25, 29, 147, 0.08);
    border: 1px solid rgba(25, 29, 147, 0.14);
}

.smart-search-tag--clickable {
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.smart-search-tag--clickable:hover {
    opacity: 1;
    background: rgba(25, 29, 147, 0.12);
    border-color: rgba(25, 29, 147, 0.22);
}

.discovery-also-searched {
    margin-top: 0;
    margin-bottom: 0;
}
.discovery-also-searched-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #6B7280;
    margin-bottom: 10px;
    letter-spacing: 0.01em;
}
.discovery-also-searched-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: center;
    gap: 10px 12px;
    max-width: 640px;
    margin-inline: auto;
}
.discovery-also-searched-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--g700);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    text-align: center;
    line-height: 1.4;
    white-space: normal;
}
.discovery-also-searched-chip__label {
    flex: 0 0 auto;
    min-width: 0;
    line-height: 1.3;
}
/* Count steht als eigene, zentrierte Pille in Zeile 2. Vorher saßen
   Label und Count in einer Flex-Row mit space-between - das fuehrte
   dazu, dass die Pille bei unterschiedlich langen Labels an
   unterschiedlichen Positionen klebte und die Chips optisch sprangen. */
.discovery-also-searched-chip__count {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    font-variant-numeric: tabular-nums;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--custom-primary, #191d93);
    background: rgba(25, 29, 147, 0.08);
    padding: 3px 9px;
    border-radius: 999px;
    line-height: 1.4;
    letter-spacing: 0.01em;
}
.discovery-also-searched-chip__count-value {
    font-weight: 700;
}
.discovery-also-searched-chip__count-unit {
    font-size: 10.5px;
    font-weight: 500;
    color: rgba(25, 29, 147, 0.7);
    letter-spacing: 0.01em;
}
.discovery-also-searched-chip:hover .discovery-also-searched-chip__count {
    background: rgba(25, 29, 147, 0.14);
}
.discovery-also-searched-chip:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}
@media (max-width: 767px) {
    .discovery-also-searched-grid {
        grid-template-columns: 1fr;
    }
    .discovery-also-searched-chip__count-unit {
        display: none;
    }
}

/* Sidebar hint */
.discovery-sidebar-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 1rem;
    padding-top: 0.75rem;
    border-top: 1px solid #EDEDF5;
}

.discovery-sidebar-hint svg {
    color: #94a3b8;
    flex-shrink: 0;
    animation: none;
}

.discovery-sidebar-hint span {
    font-size: 11.5px;
    color: var(--custom-font-50);
}

.discovery-support-zone {
    width: 100%;
    max-width: 760px;
    margin: 2.75rem auto 0;
    padding-top: 1.75rem;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}

@media (max-width: 767px) {
    .discovery-workspace-bar {
        flex-direction: column;
        align-items: flex-start;
    }

    .discovery-workspace-bar__right,
    .discovery-workspace-bar__meta {
        justify-content: flex-start;
    }

    .discovery-screen--search-first .discovery-also-searched,
    .discovery-support-zone {
        max-width: 100%;
    }
}

@keyframes discovery-nudge {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(-3px); }
}

@media screen and (max-width: 576px) {
    .discovery-header-title {
        font-size: 16px;
    }
    .discovery-screen {
        padding: 1rem 0.75rem 0.75rem;
    }
    .discovery-screen--search-first {
        padding: 1.5rem 1rem 1.5rem;
        min-height: auto;
    }
    #initialExplanation {
        padding: 1.75rem 1rem 1.5rem;
        min-height: auto;
    }
    .discovery-screen--search-first .discovery-search-hero-title {
        font-size: calc(1.28rem - 1px);
    }
    .discovery-screen--search-first .discovery-smart-input {
        padding: 15px 8px 15px 40px;
        font-size: 15px;
        height: 52px;
    }
    .discovery-screen--search-first .discovery-smart-input-wrap {
        border-radius: 24px;
    }
    .discovery-screen--search-first .discovery-smart-input {
        border-radius: 24px;
    }
    .discovery-chip--featured {
        padding: 7px 12px;
    }
    .discovery-chip--featured .discovery-chip-name {
        font-size: 12px;
    }
    .discovery-smart-input {
        padding: 10px 10px 10px 36px;
        font-size: 13.5px;
    }
    .discovery-smart-btn {
        padding: 8px 14px;
        font-size: 12px;
    }
    .discovery-smart-icon {
        left: 10px;
        width: 16px;
        height: 16px;
    }
}

/* End of Initial Explanation */

/* ============================================================
   Search Refinement Screen – Guided Market Discovery
   ============================================================ */
.refinement-screen {
    width: 100%;
    padding: 2rem 1.5rem 1.5rem;
}

/* Header */
.refinement-header {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #F0F0F5;
}

.refinement-header-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--custom-primary-50);
    color: var(--custom-primary);
    flex-shrink: 0;
}

.refinement-header-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--custom-font);
    margin: 0 0 4px 0;
    line-height: 1.3;
}

.refinement-header-subtitle {
    font-size: 15px;
    color: var(--custom-font-50);
    margin: 0;
    line-height: 1.5;
}

/* Market Segments */
.refinement-segments {
    margin-bottom: 1.25rem;
}

.refinement-segments--primary {
    margin-bottom: 1.75rem;
}

.refinement-segments-label {
    display: block;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--custom-font-50);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
}

.refinement-segments-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Refinement Chip */
.refinement-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: white;
    border: 1.5px solid var(--custom-primary-100);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: left;
}

.refinement-chip:hover {
    background: var(--custom-primary-50);
    border-color: var(--custom-primary);
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(58, 49, 200, 0.08);
}

.refinement-chip-icon {
    flex-shrink: 0;
    color: var(--custom-primary);
    opacity: 0.7;
}

.refinement-chip:hover .refinement-chip-icon {
    opacity: 1;
}

.refinement-chip-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--custom-font);
    line-height: 1.2;
}

.refinement-chip:hover .refinement-chip-name {
    color: var(--custom-primary);
}

.refinement-chip-count {
    font-size: 11.5px;
    font-weight: 500;
    padding: 2px 7px;
    border-radius: 5px;
    background: var(--custom-primary-50);
    color: var(--custom-primary);
    line-height: 1.2;
}

/* Featured chips (top 4) */
.refinement-chip--featured {
    border-width: 2px;
    border-color: var(--custom-primary);
    background: var(--custom-primary-50);
    padding: 11px 18px;
}

.refinement-chip--featured .refinement-chip-name {
    font-size: 14.5px;
    color: var(--custom-primary-200);
}

.refinement-chip--featured .refinement-chip-count {
    background: white;
    font-weight: 600;
    font-size: 12px;
}

.refinement-chip--featured:hover {
    background: white;
    box-shadow: 0 4px 14px rgba(58, 49, 200, 0.12);
}

/* Segment action button (inline after chips) */
.refinement-segment-action {
    display: inline-flex;
    align-items: center;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--custom-primary);
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px 4px;
    transition: opacity 0.15s ease;
    white-space: nowrap;
}

.refinement-segment-action:hover {
    opacity: 0.7;
}

/* Power Feature (Web Keyword) */
.refinement-power-feature {
    background: #F8F8FC;
    border: 1px solid #EDEDF5;
    border-radius: 12px;
    padding: 14px 16px;
}

.refinement-power-feature-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.refinement-power-feature-header svg {
    color: var(--custom-primary);
    flex-shrink: 0;
    margin-top: 1px;
}

.refinement-power-feature-title {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--custom-font);
    line-height: 1.3;
}

.refinement-power-feature-subtitle {
    display: block;
    font-size: 12px;
    color: var(--custom-font-50);
    line-height: 1.4;
}

.refinement-power-feature-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Custom Filter Section */
.refinement-custom {
    margin-top: 1.75rem;
    margin-bottom: 0.5rem;
}

.refinement-custom-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.refinement-custom-divider::before,
.refinement-custom-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #E8E8EE;
}

.refinement-custom-divider span {
    font-size: 13px;
    font-weight: 500;
    color: var(--custom-font-50);
    white-space: nowrap;
}

.refinement-custom-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.refinement-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 500;
    padding: 8px 14px;
    border-radius: 8px;
    background: #F8F8FC;
    color: var(--custom-font);
    border: 1px solid #E8E8EE;
    cursor: pointer;
    transition: all 0.15s ease;
}

.refinement-filter-btn:hover {
    border-color: var(--custom-primary);
    color: var(--custom-primary);
    background: var(--custom-primary-50);
}

.refinement-filter-btn svg {
    flex-shrink: 0;
    color: var(--custom-font-50);
}

.refinement-filter-btn:hover svg {
    color: var(--custom-primary);
}

/* Sidebar hint */
.refinement-sidebar-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid #EDEDF5;
}

.refinement-sidebar-hint svg {
    color: var(--custom-primary);
    flex-shrink: 0;
    animation: discovery-nudge 2s ease-in-out infinite;
}

.refinement-sidebar-hint span {
    font-size: 12.5px;
    color: var(--custom-font-50);
}

@media screen and (max-width: 576px) {
    .refinement-screen {
        padding: 1.25rem 1rem 1rem;
    }
    .refinement-header-title {
        font-size: 19px;
    }
}
/* End Search Refinement Screen */

/* Start of Filter Results Header */
#filter-results-header {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

#filter-results-header h4 {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--custom-font);
    margin-bottom: 0.5rem;
}

#filter-results-header p {
    font-size: 0.875rem;
    color: #666;
    margin-bottom: 0;
}

/* Filter Groups Wrapper */
#filter-groups-wrapper {
    /* padding-left: 1.25rem; */
    padding-right: 1.25rem;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 1rem 0 !important;
}

/* Clear All Filters – chip + info icon */
.chip-clear-all-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    margin-left: 4px;
}

.chip-clear-all-wrapper .chip-clear-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    padding: 0 10px;
    font-size: 0.7rem;
    font-weight: 500;
    color: #ffffff;
    background-color: #7f1d1d;
    border: 1px solid #991b1b;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}

.chip-clear-all-wrapper .chip-clear-all:hover {
    background-color: #991b1b;
    border-color: #b91c1c;
}

.chip-clear-all-wrapper .chip-clear-all:active {
    opacity: 0.9;
}

.chip-clear-all-wrapper .chip-clear-all .chipText {
    font-size: 0.75rem !important;
    color: inherit;
}

/* Info icon next to "Alle Filter entfernen" chip */
.chip-clear-all-info {
    flex-shrink: 0;
}

.chip-clear-all-info .filter-info-icon,
.chip-clear-all-info svg {
    width: 14px;
    height: 14px;
}

/* Legacy: keep .btn-clear-all-filters for any existing references */
.btn-clear-all-filters {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    border: none;
    background-color: transparent;
    border-radius: 0;
    cursor: pointer;
    transition: opacity 0.2s ease;
    flex-shrink: 0;
    padding: 4px;
    margin-left: 8px;
}

.btn-clear-all-filters:hover {
    opacity: 0.7;
}

.btn-clear-all-filters:active {
    opacity: 0.5;
}

.btn-clear-all-filters svg {
    width: 14px;
    height: 14px;
}

/* Start of Chip */
#filter-groups {
    display: contents;
}

.chipSec {
    margin: 0 !important;
    height: 30px !important;
}

#filter-groups .chip,
#filter-groups-restrictive .chip {
    font-size: 0.75rem;
    color: var(--custom-font);
    border: 1px solid var(--custom-primary-100, rgba(25,29,147,0.15)) !important;
    background-color: var(--custom-primary-50);
    padding: 0.2rem 0.5rem;
    border-radius: 2rem;
}

#filter-groups .chip>.chipText,
#filter-groups-restrictive .chip>.chipText {
    font-size: 0.75rem !important;
    font-weight: 500;
}

#filter-groups>.chip-sec>.chip {
    border: none !important;
    color: var(--custom-font);
}

#filter-groups .chip.chip_bg_2 {
    border: none;
    background-color: var(--custom-danger-50);
    color: var(--custom-font) !important;
}

#filter-groups .chip.chip_bg_3 {
    border: none;
    background-color: var(--custom-success-50);
    color: var(--custom-font) !important;
}

#filter-groups .chip.chip_excluded {
    border: none;
    background-color: #f5f5f5;
    color: #999999 !important;
    opacity: 0.8;
}

#filter-groups .chip.chip_excluded .chipText {
    color: #999999 !important;
}

/* Filter Section-Based Chip Colors */
#filter-groups .chip.chip_purple {
    background-color: var(--ci-regional-bg);
    color: var(--ci-regional) !important;
    border: 1px solid var(--ci-regional-border);
}

#filter-groups .chip.chip_purple .chipText {
    color: var(--ci-regional) !important;
}

#filter-groups .chip.chip_orange {
    background-color: var(--ci-datadive-bg);
    color: var(--ci-datadive) !important;
    border: 1px solid var(--ci-datadive-border);
}

#filter-groups .chip.chip_orange .chipText {
    color: var(--ci-datadive) !important;
}

#filter-groups .chip.chip_green {
    background-color: var(--ci-visibleweb-bg);
    color: #14532d !important;
    border: 1px solid rgba(8,194,127,0.18);
}

#filter-groups .chip.chip_green .chipText,
#filter-groups .chip.chip_green .chipIcon,
#filter-groups .chip.chip_green .chipImg {
    color: #14532d !important;
}

#filter-groups .chip.chip_business_contact_summary,
#filter-groups-restrictive .chip.chip_business_contact_summary {
    background-color: #f3f4f6;
    color: #111827 !important;
    border: 1px solid #d1d5db !important;
    box-shadow: none;
}

#filter-groups .chip.chip_business_contact_summary .chipText,
#filter-groups .chip.chip_business_contact_summary .chipIcon,
#filter-groups .chip.chip_business_contact_summary .chipImg,
#filter-groups-restrictive .chip.chip_business_contact_summary .chipText,
#filter-groups-restrictive .chip.chip_business_contact_summary .chipIcon,
#filter-groups-restrictive .chip.chip_business_contact_summary .chipImg {
    color: #111827 !important;
}

#filter-groups .chip.chip_excluded .chipImg svg path {
    stroke: #999999 !important;
}

#filter-groups .chipIcon,
#filter-groups-restrictive .chipIcon {
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#filter-groups .chipIcon i,
#filter-groups-restrictive .chipIcon i {
    font-size: 0.7rem;
}

/* Grouped Chips */
.chipSec-group {
    margin: 0 !important;
    height: 30px !important;
}

#filter-groups .chipSec#business_contact_summary_chip,
#filter-groups-restrictive .chipSec#business_contact_summary_chip {
    position: relative;
}

.chip-summary-preview {
    position: absolute;
    top: calc(100% + 0.45rem);
    left: 0;
    z-index: 30;
    width: min(360px, 82vw);
    padding: 0.8rem 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
}

.chip-summary-preview__title {
    font-size: 0.7rem;
    font-weight: 700;
    color: #111827;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.55rem;
}

.chip-summary-preview__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.38rem;
    margin-bottom: 0.7rem;
}

.chip-summary-preview__item {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    color: #111827;
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.2;
}

.chip-summary-preview__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.35rem 0.75rem;
    border-radius: 8px;
    border: 1px solid rgba(25, 29, 147, 0.16);
    background: rgba(25, 29, 147, 0.06);
    color: var(--custom-primary, #191d93);
    font-size: 0.74rem;
    font-weight: 600;
    cursor: pointer;
}

.chip-summary-preview__action:hover {
    background: rgba(25, 29, 147, 0.1);
}

#filter-groups .chip.chip-grouped {
    cursor: pointer;
    transition: opacity 0.15s;
}

#filter-groups .chip.chip-grouped:hover {
    opacity: 0.85;
}

#filter-groups .chip-group-count {
    font-weight: 600;
    margin-left: 1px;
}

#filter-groups .chipGroupRemove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 2px;
    border-radius: 50%;
    transition: background-color 0.15s;
    padding: 1px;
}

#filter-groups .chipGroupRemove:hover {
    background-color: rgba(0,0,0,0.08);
}

#filter-groups .chip.chip_excluded .chipGroupRemove svg path {
    stroke: #999999 !important;
}

/* End of Chip */

/* Start of Shop Results Card */
#certificates .certificates {
    margin-top: 8px;
    gap: 8px
}

#searchQuickOverviewResults>div:not(.search-actions) {
    /* border-radius: 20px;
    border: 1px solid #EAEAEA;
    background: #FFF; */
    padding: 0 !important;
}

div.search-actions {
    padding: 0 !important;
    margin-top: 32px !important;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    background: #FFF;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

div.search-actions>a,
div.search-actions>button {
    padding-inline: 0 !important;
    height: 30px !important;
    gap: 8px;
    margin: 0 !important;
    flex: 1;
}

div.search-actions>a>button,
div.search-actions>button {
    border-radius: var(--r-sm) !important;
    margin: 0 !important;
    height: 40px !important;
    gap: 0.5rem;
    padding-inline: 1rem;
    background-color: #F1F1F1;
    border: 1px solid #D9D9D9;
    color: var(--custom-font-light);
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.search-actions button.disabled {
    background-color: #E6E6E6;
    border-color: #D0D0D0;
    color: #A8A8A8;
    box-shadow: none;
}

.search-actions button.disabled:focus {
    color: #A8A8A8 !important;
}

.search-actions button:focus {
    color: inherit !important;
}

div.search-actions>a>button:not(.disabled):hover,
div.search-actions>button:not(.disabled):hover {
    border-color: var(--custom-primary);
    color: var(--custom-primary);
    background-color: #fff;
    box-shadow: var(--sh-md);
    transform: translateY(-1px);
}

/* Action Bar (under result count) */
.search-action-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0 0 1.02rem;
    padding: 0.08rem 0 0.9rem;
    background: transparent;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid rgba(203,213,225,0.95);
}

.search-action-bar a {
    text-decoration: none;
}

.search-action-bar-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    border-radius: 6px;
    border: 1px solid var(--g200, #d1d5db);
    background: #fff;
    color: var(--custom-font-light, #4b5563);
    cursor: pointer;
    transition: background-color 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
    white-space: nowrap;
    line-height: 1.4;
}
.search-action-bar-btn:focus-visible {
    outline: 2px solid rgba(25,29,147,0.28);
    outline-offset: 2px;
}

.search-action-bar-btn svg {
    flex-shrink: 0;
}

.search-action-bar-btn .search-action-bar-btn-icon {
    flex-shrink: 0;
    font-size: 1rem;
    line-height: 1;
}

.search-action-bar-btn:hover:not(.disabled) {
    border-color: var(--custom-primary);
    color: var(--custom-primary);
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.search-action-bar-primary {
    background: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(25,29,147,0.16);
}

.search-action-bar-primary:hover:not(.disabled) {
    background: var(--custom-primary-dark, #12156e) !important;
    border-color: var(--custom-primary-dark, #12156e) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(55, 65, 160, 0.22);
}

.search-action-bar-primary.disabled {
    background: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #fff !important;
    opacity: 0.45;
}

.search-action-bar-export {
    background: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #fff !important;
}
.search-action-bar-export:hover:not(.disabled) {
    background: var(--custom-primary-dark, #2d3a8c) !important;
    border-color: var(--custom-primary-dark, #2d3a8c) !important;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(55, 65, 160, 0.3);
}
.search-action-bar-export.disabled {
    background: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #fff !important;
    opacity: 0.45;
    pointer-events: none;
}

.search-action-bar-ghost {
    background: var(--g50, #f8f9fa) !important;
    border-color: var(--g200, #e5e7eb) !important;
    color: var(--g600, #4b5563) !important;
}
.search-action-bar-ghost:hover:not(.disabled) {
    background: #fff !important;
    border-color: var(--custom-primary, #191d93) !important;
    color: var(--custom-primary, #191d93) !important;
    box-shadow: none;
}
.search-action-bar-btn.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.search-action-bar-danger:not(.disabled) {
    color: #dc3545;
    border-color: #f5c6cb;
}

.search-action-bar-danger:hover:not(.disabled) {
    color: #dc3545;
    border-color: #dc3545;
    background: #fff5f5;
}

.search-action-bar-reset {
    background: none !important;
    border: none !important;
    color: var(--g400, #9ca3af) !important;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 0.25rem 0.5rem;
    cursor: pointer;
}
.search-action-bar-reset:hover:not(.disabled) {
    color: var(--g600, #4b5563) !important;
    text-decoration: underline;
}
.search-action-bar-reset.disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}

@media (max-width: 576px) {
    .search-action-bar {
        gap: 0.375rem;
        padding: 0.5rem;
    }
    .search-action-bar-btn {
        font-size: 0.75rem;
        padding: 0.3rem 0.5rem;
    }
}

.video-tutorial-button {
    border-radius: var(--r-sm);
    padding: 0.2rem 0.4rem;
    box-shadow: var(--sh);
    border: 1px solid var(--g200);
}

@keyframes videoPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(25,29,147,0.15);
    }

    50% {
        box-shadow: 0 0 12px 8px rgba(25,29,147,0.2);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(25,29,147,0.15);
    }
}

#searchQuickOverviewResults .entry_section {
    gap: 8px
}

#searchQuickOverviewResults .entry_section h1 {
    color: var(--custom-primary);
    font-size: 34px;
    font-style: normal;
    font-weight: 800;
    line-height: 1;
}


#searchFilters .filter-sections-container {
    gap: 0;
}
#searchFilters .filter-sections-container > .mb-3 {
    margin-bottom: 1.5rem !important;
}
#searchFilters .filter-sections-container > .mb-3:first-child {
    margin-top: -0.14rem;
}
#searchFilters .filter-sections-container > .mb-3 + .mb-3 {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

/* searchPanel entfernt */

#searchFilters h6 {
    color: #0b0b0b;
}


@media (max-width: 1024px) {
    #buySection2 {
        padding: 1rem;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    #initialExplanation {
        padding: 0;
        border-radius: 0;
    }

    .discovery-screen-shell {
        padding: 24px 16px 36px;
        border-radius: 0;
    }

    .discovery-screen-content {
        padding: 8px 0 0;
    }
}

#searchQuickOverviewResults .entry_section h3 {
    color: var(--custom-primary);
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 1;
}

#cardsContainer {
    min-height: calc(100vh - var(--search3-header-height));
    flex-direction: column;
    align-items: stretch;
}

#searchQuickOverviewResults {
    border-radius: 22px;
    background: #f8f7f6 !important;
}

#buySection2 {
    margin-left: 0;
    padding: 28px 24px 40px;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: none !important;
}

#dataSourceText>p {
    margin-top: 6px;
    color: var(--custom-font-50) !important;
}

#priceFilterSection {
    margin-bottom: 30px !important;
}

#priceFilterSection>div>h4 {
    color: var(--custom-font) !important;
}

#additionalFilters {
    padding: 16px 20px;
    background-color: var(--g50);
    border-radius: var(--r);
    margin-top: 29px !important;
}

#additionalFilters>div {
    padding: 0 !important;
}

#additionalFilters p {
    font-size: 14px !important;
}

#searchCountrySwitcher.extra-classes>button {
    border: 1px solid #D3D3D3 !important;
}

#buySectionDataInformation {
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15,23,42,0.03) !important;
    padding: 20px !important;
}

#pricingSection {
    padding: 1.25rem 1.5rem !important;
    border-radius: 10px !important;
    background: #fff !important;
    border: 1px solid rgba(226,232,240,0.92) !important;
    box-shadow: 0 10px 28px rgba(15,23,42,0.08), 0 2px 6px rgba(15,23,42,0.04) !important;
}

#buySectionDataInformation,
#buySectionDataInformation.row,
#buySectionDataInformation[class],
#buySectionDataInformation[class=""],
div#buySectionDataInformation,
div#buySectionDataInformation[class],
div#buySectionDataInformation[class=""] {
    padding: 20px !important;
}


#ifAvailable>ul>li,
#numOfEntries>ul>li {
    font-size: 0.875rem !important;
    display: flex !important;
    gap: 8px;
}

.small-text {
    font-size: 0.75rem !important;
}

.text-custom-primary {
    color: var(--custom-primary) !important;
}

.text-custom-font {
    color: var(--custom-font) !important;
}

.text-custom-light {
    color: var(--custom-font-light) !important;
    font-size: 0.875rem;
    font-weight: 400;
}

#discountPrice {
    color: var(--custom-font, #1e293b);
    font-size: 30px;
    flex: none !important;
    font-style: normal;
    font-weight: 700;
    line-height: 1.1;
}

#pricingCalculation #discountPrice {
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.22;
    letter-spacing: -0.018em;
}

#mainPriceAlt {
    color: #575757;
    flex: none !important;
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 1;
    text-decoration-line: strikethrough;
}

#pricingContainer {
    flex-wrap: wrap;
    gap: 8px;
}

#rating>div {
    margin-top: 0.25rem;
}

#paymentMethods>div>label>img {
    height: 18px !important;
    width: auto;
}

.buy-button-container {
    gap: 0.5rem !important;
}

.offer-button {
    display: inline-flex;
    width: 100%;
    padding: 14px 0;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    border: 1px solid var(--g300);
    color: var(--custom-font-light);
    background-color: white;
    font-weight: 600;
    transition: var(--ease);
}
.offer-button:hover {
    background: var(--custom-primary);
    color: #fff;
    border-color: var(--custom-primary);
    transform: translateY(-1px);
    box-shadow: var(--sh-md);
}

#buySection {
    width: 100%;
}

.cart-button {
    display: inline-flex;
    width: 100%;
    padding: 14px 0;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--custom-primary) 0%, var(--custom-primary-light) 100%);
    border: none !important;
    color: white !important;
    font-weight: 600;
    transition: var(--ease);
    box-shadow: 0 4px 15px rgba(25,29,147,0.3);
    position: relative;
    overflow: hidden;
}
.cart-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(25,29,147,0.4);
}
.cart-button:active {
    transform: translateY(0);
}

/* Modal „Datensätze begrenzen“: Formular stapelt Body + Footer (kein inline-flex in einer Zeile) */
#addLimitFilter_limit_form {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0 0 0.2rem;
    border: none;
    background: none;
    box-sizing: border-box;
}

#addLimitFilter_limit_form input[type="number"] {
    width: 100%;
    min-height: 44px;
    font-size: 0.95rem;
    padding: 10px 14px;
    border: 2px solid var(--g200, #e5e7eb);
    border-radius: 8px;
    background-color: #fff !important;
    color: var(--custom-font, #1e293b);
    box-sizing: border-box;
    -moz-appearance: textfield;
}

#addLimitFilter_limit_form input[type="number"]::-webkit-outer-spin-button,
#addLimitFilter_limit_form input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#addLimitFilter_limit_form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 8px 24px;
    font-weight: 600;
    font-size: 0.85rem;
    border-radius: 8px;
    border: none;
    background: linear-gradient(135deg, #191d93, #2a30b8);
    color: #fff;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(25, 29, 147, 0.3);
    width: auto;
    height: auto;
}

#addLimitFilter_limit_form button[type="submit"]:hover {
    filter: brightness(1.05);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
li,
div {
    font-family: 'Inter' !important;
}

#totalFoundCount {
    color: var(--custom-primary);
    font-size: 30px;
    font-weight: 700 !important;
    line-height: 1.1;
}

/* End of Shop Results Card */

@media (max-width: 992px) {
    #searchQuickOverviewResults>div.search-actions>a {
        padding: 0 !important;
    }

    .custom-search .searchInput {
        width: 100%;
    }

    #filterSection .accordion-header>button {
        max-width: none !important;
    }

    #filterSection .accordion-button {
        width: 100%;
    }

    #filterSection .accordion-body {
        max-width: none !important;
        width: 100%;
    }
}

/* Start of Modal */
.modal-content {
    border-radius: var(--r-lg) !important;
    padding: 2.5rem !important;
    border: none !important;
}

.modal-content .modal-header>.btn-close {
    content: url('../icons/close-circle.svg');
    background: white !important;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    ;
    padding: 0 !important;
    position: relative;
}

.modal-content .modal-header>.btn-close:after {
    content: url('../icons/close-circle.svg');
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.modal-header,
.modal-body,
.modal-footer {
    padding: 0 !important;
}

.modal-body {
    margin: 1.75rem 0 !important;
}

.modal-body>.input-group {
    border-radius: 50px;
    border: 2px solid var(--custom-primary-100);
    height: 60px;
    background: #FFF;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin: 0 !important;
}

.modal-body .modal_search_input {
    background-color: white !important;
    border: none !important;
    height: 100%;
    color: var(--custom-primary) !important;
}

.modal-body .modal_search_input::placeholder {
    color: var(--custom-primary);
}

.modal-body .modal_seachIcon,
.modal-body .input-group-text {
    background-color: white !important;
    height: 20px;
    padding: 0 20px !important;
    border: none !important;
    position: relative;
}

.modal-body .modal_seachIcon:after,
.modal-body .input-group-text:after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 1px;
    background-color: var(--custom-primary);
    z-index: 10;
}

.modal-body>.form-check {
    margin-top: 14px;
    margin-left: 0.25rem;
}

.modal-header h5 {
    color: black;
    font-family: 'Inter';
    font-size: 26px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.modal-custom-button {
    display: inline-flex;
    padding: 18px 44px;
    height: 55px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: var(--r);
    background: linear-gradient(135deg, var(--custom-primary) 0%, var(--custom-primary-light) 100%) !important;
    color: white !important;
    margin: 0 !important;
    font-weight: 600;
    transition: var(--ease);
    box-shadow: 0 4px 15px rgba(25,29,147,0.25);
}
.modal-custom-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(25,29,147,0.35);
}

.custom-alert-success {
    color: #029F68;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    /* 28px */
}

/* End of Modal */

/* Start of CMS filter */

.dropdown-menu {
    background-color: white !important;
    width: auto;
    height: auto;
    border-radius: var(--r) !important;
    box-shadow: var(--sh-lg);
    padding: 1rem !important;
}

.dropdown-menu .modal_search_input {
    background-color: white !important;
    border-radius: 50px !important;
    border: 2px solid #EFEFEF;
}

/* End of CMS filter */

/* Start of Custom Autocomplete List */
.filter_search_input {
    font-size: 12px;
    height: 40px;
    padding-left: 12px;
    width: 100% !important;
    position: relative;
}

.filter_search_input::after {
    content: '';
    position: absolute;
    right: 14px;
    top: 0;
    width: 18px;
    height: 18px;
    background-color: black;
}

.custom-autocomplete-list {
    list-style: none !important;
    padding: 0;
    max-height: 200px;
    overflow-y: scroll;
}

.radio-item {
    display: flex;
    flex-direction: row-reverse;
    justify-content: start;
    gap: 8px;
}

.radio-item>.form-check-input {
    width: 20px;
    height: 20px;
}

.custom-autocomplete-list {
    margin-bottom: 0 !important;
}

.custom-autocomplete-list>.autocomplete-item,
.autocomplete-item {
    padding: 0.75rem 0.75rem 0.75rem 0;
    border-radius: 0.25rem;
    display: flex;
    justify-content: space-between;
}

.form-check-input:checked[type='checkbox'] {
    background-image: url('../icons/check.svg') !important;
    background-size: 14px;
}

.custom-autocomplete-list>.autocomplete-item label:has(+ .form-check-input:checked) {
    color: var(--custom-primary) !important;
    font-weight: 700 !important;
}

.form-check-label:has(~ .form-check-input:checked) {
    color: var(--custom-primary) !important;
    font-weight: 700 !important;
}

.autocomplete-group-title {
    background-color: #f5f5f5;
    padding: 0.25rem !important;
    color: #5C5C5C;
    font-size: 0.75rem !important;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

/* End of Custom Autocomplete List */


/* start of firmenname sidebar desktop */
#Firmname-flex-box {
    display: flex;
    justify-content: center;
    align-items: center;
}

.dropdown-menu {
    border: none;
    background: rgba(0, 0, 0, 0);
    z-index: 1000;
}

.dropdown-toggle::after {
    display: none;
}

.firm-name-dropdown-menu {
    width: 314px;
    height: 194px;
    border-radius: 20px;
    background: #FFF;
    box-shadow: 0px 2px 18px 2px rgba(179, 179, 179, 0.20);
    padding: 15px;
}

.svg-box {
    width: fit-content;
}

.firm-name-dropdown-menu input[type="text"] {
    width: 285px;
    height: 40px;
    flex-shrink: 0;

    border-radius: 50px;
    border: 2px solid #EFEFEF;
    /* background: #FFF; */
    padding: 0 35px 0 20px;
    color: #666;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}



.flex-box-centered {
    display: flex;
    align-items: center;
    margin-top: 24px;
    flex-flow: nowrap;
    gap: 10px;
    margin-bottom: 37px;
}

.flex-start {
    justify-content: flex-start;
}

.space-around {
    justify-content: space-around;
}

.apply-filter-button {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    outline: inherit;
    max-width: 100%;
    width: 100%;
    min-width: 137px;
    height: 36px;
    background: linear-gradient(135deg, var(--custom-primary) 0%, var(--custom-primary-light) 100%);
    color: #FFF;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    border-radius: var(--r-sm);
    box-shadow: 0 2px 12px rgba(25,29,147,0.15);
    transition: var(--ease);
}
.apply-filter-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(25,29,147,0.25);
}

.custom-close-button {
    max-width: 100%;
    width: 100%;
    min-width: 137px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid #AEAEAE;
    background: #FEFEFF;
    color: #666;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.icon-absolute {
    position: absolute;
    top: 10px;
    right: 12px;
}

.relative-box {
    position: relative;
}

/* end of firmenname sidebar desktop */


/* start of serviceleistungen sidebar deskop */

.searchbar {
    width: 100%;
    height: 40px;
    flex-shrink: 0;
    border-radius: 50px !important;
    margin-bottom: 9px;
    border: 2px solid #EFEFEF;
    background: #FFF;
    overflow: hidden;
    padding: 0 15px;
    color: #666;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.checkbox_categorys {
    display: flex;
    flex-flow: column;
    width: 100%;
}

::-webkit-scrollbar {
    width: 6px;
    margin-left: 11px;
}

::-webkit-scrollbar-thumb {
    background-color: var(--custom-primary);
    border-radius: 100px;
    height: 98px;
}

::-webkit-scrollbar-track {
    background-color: #F5F5F5;
    border-radius: 3px;
}

/* Firefox Scrollbar */
html {
    scrollbar-width: thin;
    scrollbar-color: var(--custom-primary) var(--g100);
}

#addPlaceAttributeFilterModal_list_div {
    height: 311px;
    overflow-y: scroll;
    background-color: white !important;
    border: none;
    padding-right: 0 !important;
    width: 100%;
    margin: 0 0 0 5px;
}

#addPlaceAttributeFilterModal_list_div optgroup {
    background-color: white !important;
    color: black !important;
}

.strong-group {
    width: 100%;
    padding: 0 11px 0 0;
}

.strong-group-name {
    background: #F5F5F5;
    height: 23px;
    color: #5C5C5C;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    display: flex;
    align-items: center;
    padding-left: 5px;
    padding-right: 11px;
    margin-bottom: 0;
}

.strong-group-item {
    color: #020025;
    text-align: left;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    padding-left: 5px;
    margin-bottom: 0;

    /* line-height: 120%; */
}

/* end of serviceleistungen sidebar deskop */

body {
    overflow-x: hidden !important;
}

body,
#custom-container.container-fluid.custom,
.container-scroller,
.page-body-wrapper,
.main-panel,
.content-wrapper {
    background: #f8f7f6 !important;
}

/* Start of Preview */
.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-accent-bg: white;
}

.table-striped>tbody>tr:nth-of-type(even)>* {
    background-color: #FAFAFA;
}


/* End of Preview */

/* Fast Preview Modal */
#fastPreviewModal > .modal-dialog {
    width: calc(100% - 48px) !important;
    max-width: 1140px !important;
    max-height: 90vh;
    display: flex;
    align-items: center;
}

#fastPreviewModal .modal-content {
    border: 1px solid var(--g200);
    box-shadow: var(--sh-lg);
    padding: 1.25rem 1.5rem 1rem !important;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#fastPreviewModal .modal-header {
    background: #f7f8fa;
    border-bottom: 1px solid var(--g200);
    padding: 0.875rem 1.25rem !important;
    margin: -1.25rem -1.5rem 0 !important;
    border-radius: var(--r-lg) var(--r-lg) 0 0;
    flex-shrink: 0;
}

#fastPreviewModal .modal-header .modal-title {
    color: var(--custom-font);
    font-weight: 700;
    font-size: 1.1rem !important;
    line-height: 1.3;
}

#fastPreviewModal .modal-body {
    padding: 0 !important;
    margin: 0 !important;
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
}

#fastPreviewModal .fast-preview-subtitle {
    color: var(--g500);
    font-size: 0.82rem !important;
    margin-top: 2px;
}

/* KPI Cards (Beispielzahl, Gesamtzahl, Maskierungs-Hinweis) */
#fastPreviewModal .fp-kpi-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 18px 14px 14px;
}

#fastPreviewModal .fp-kpi-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: #f7f8fa;
    border: 1px solid var(--g200);
    border-radius: 10px;
}

#fastPreviewModal .fp-kpi-card-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--custom-primary-glow);
    color: var(--custom-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

#fastPreviewModal .fp-kpi-card-body {
    min-width: 0;
}

#fastPreviewModal .fp-kpi-card-value {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--custom-font);
    line-height: 1.1;
}

#fastPreviewModal .fp-kpi-card-value--small {
    font-size: 0.95rem;
    line-height: 1.25;
}

#fastPreviewModal .fp-kpi-card-label {
    font-size: 0.78rem;
    color: var(--g500);
    margin-top: 3px;
    line-height: 1.3;
}

@media (max-width: 768px) {
    #fastPreviewModal .fp-kpi-cards {
        grid-template-columns: 1fr;
    }
}

/* Active Filters Card */
#fastPreviewModal .fp-active-filters-card {
    margin: 0 14px 14px;
    padding: 14px 16px;
    background: #fff;
    border: 1px solid var(--g200);
    border-radius: 10px;
}

#fastPreviewModal .fp-active-filters-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

#fastPreviewModal .fp-active-filters-title {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--custom-font);
}

#fastPreviewModal .fp-active-filters-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: rgba(76, 175, 80, 0.10);
    color: #2e7d32;
    border: 1px solid rgba(76, 175, 80, 0.30);
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
}

#fastPreviewModal .fp-active-filters-groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 10px 18px;
}

#fastPreviewModal .fp-active-filter-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

#fastPreviewModal .fp-active-filter-group-header {
    display: flex;
    align-items: center;
    gap: 6px;
}

#fastPreviewModal .fp-active-filter-group-icon {
    color: var(--custom-primary);
    display: inline-flex;
}

#fastPreviewModal .fp-active-filter-group-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--g700);
}

#fastPreviewModal .fp-active-filter-group-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding-left: 22px;
}

#fastPreviewModal .fp-active-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px 3px 7px;
    background: var(--custom-primary-glow);
    color: var(--custom-primary);
    border: 1px solid rgba(25, 29, 147, 0.18);
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 500;
    line-height: 1.3;
}

#fastPreviewModal .fp-active-filter-chip-icon {
    flex-shrink: 0;
    color: var(--custom-primary);
    opacity: 0.7;
}

#fastPreviewModal .fp-active-filter-chip-text {
    line-height: 1;
}

/* Pagination Info */
#fastPreviewModal .fp-pagination-info {
    text-align: center;
    padding: 10px 14px;
    color: var(--g500);
    font-size: 0.78rem;
    border-top: 1px solid var(--g100);
}

/* CTA Block (statt fp-suggestions) */
#fastPreviewModal .fp-cta-block {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 14px 14px 0;
    padding: 14px 16px;
    background: linear-gradient(135deg, var(--custom-primary-glow), #fff);
    border: 1px solid rgba(25, 29, 147, 0.18);
    border-radius: 10px;
}

#fastPreviewModal .fp-cta-block-icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--custom-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

#fastPreviewModal .fp-cta-block-content {
    flex: 1;
    min-width: 0;
}

#fastPreviewModal .fp-cta-block-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--custom-font);
    margin-bottom: 2px;
}

#fastPreviewModal .fp-cta-block-text {
    font-size: 0.8rem;
    color: var(--g600);
    line-height: 1.4;
}

#fastPreviewModal .fp-cta-block-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex-shrink: 0;
}

#fastPreviewModal .fp-cta-block-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--custom-primary);
    color: #fff !important;
    border: none;
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s;
}

#fastPreviewModal .fp-cta-block-button:hover {
    background: #2e2ab0;
}

#fastPreviewModal .fp-cta-block-button--secondary {
    background: #fff;
    color: var(--custom-primary) !important;
    border: 1px solid rgba(25, 29, 147, 0.30);
}

#fastPreviewModal .fp-cta-block-button--secondary:hover {
    background: var(--custom-primary-glow);
}

@media (max-width: 768px) {
    #fastPreviewModal .fp-cta-block {
        flex-direction: column;
        text-align: center;
    }
    #fastPreviewModal .fp-cta-block-actions {
        width: 100%;
        justify-content: center;
    }
}

/* Footer Info */
#fastPreviewModal .fp-footer-info {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 14px 14px 0;
    padding: 10px 14px;
    background: #f7f8fa;
    border-radius: 8px;
    color: var(--g600);
    font-size: 0.76rem;
    line-height: 1.45;
}

#fastPreviewModal .fp-footer-info-icon {
    flex-shrink: 0;
    color: var(--g500);
    margin-top: 2px;
}


#fastPreviewModal #fastPreviewTableContainer {
    margin: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    overscroll-behavior-y: none;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

#fastPreviewModal #fastPreviewTableContainer::-webkit-scrollbar {
    display: none;
}

#fastPreviewModal .fp-scrollbar {
    padding: 6px 0 2px;
}

#fastPreviewModal .fp-scrollbar-track {
    height: 8px;
    background: rgba(25, 29, 147, 0.06);
    border-radius: 4px;
    position: relative;
    cursor: pointer;
}

#fastPreviewModal .fp-scrollbar-thumb {
    height: 100%;
    background: rgba(25, 29, 147, 0.2);
    border-radius: 4px;
    position: absolute;
    top: 0;
    left: 0;
    min-width: 30px;
    cursor: grab;
    transition: background 0.15s;
}

#fastPreviewModal .fp-scrollbar-thumb:hover,
#fastPreviewModal .fp-scrollbar-thumb.dragging {
    background: rgba(25, 29, 147, 0.35);
}

#fastPreviewModal #fastPreviewTable {
    margin: 0;
    font-size: 0.82rem;
    border-collapse: collapse;
}

#fastPreviewModal #fastPreviewTable thead th {
    background: var(--g50);
    color: var(--g600);
    font-weight: 500;
    font-size: 0.78rem;
    padding: 0.65rem 0.875rem;
    border-bottom: 2px solid var(--g200);
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}

#fastPreviewModal #fastPreviewTable tbody td {
    padding: 0.6rem 0.875rem;
    color: var(--custom-font);
    border-bottom: 1px solid var(--g100);
    vertical-align: middle;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#fastPreviewModal #fastPreviewTable tbody tr:hover td {
    background: var(--custom-primary-glow);
}

#fastPreviewModal .fp-status {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
}

#fastPreviewModal .fp-status-ok { background: #4CAF50; }
#fastPreviewModal .fp-status-err { background: #EF5350; }
#fastPreviewModal .fp-status-na { background: #BDBDBD; }

#fastPreviewModal .fp-status-cell {
    white-space: nowrap;
    font-size: 0.78rem;
}


#fastPreviewModal .fp-company-link {
    color: var(--custom-font);
    text-decoration: none;
}

#fastPreviewModal .fp-company-link:hover {
    color: var(--custom-primary);
    text-decoration: underline;
}

#fastPreviewModal .fp-col-web {
    width: 32px;
    min-width: 32px;
    max-width: 32px;
    padding-left: 14px !important;
    padding-right: 0 !important;
    text-align: center;
}

#fastPreviewModal .fp-globe-link {
    font-size: 0.85rem;
    text-decoration: none;
    opacity: 0.75;
    transition: opacity 0.15s;
}

#fastPreviewModal #fastPreviewTable tbody tr:hover .fp-globe-link {
    opacity: 1;
}

#fastPreviewModal .fp-sample-info {
    color: #9ca3af;
    font-size: 0.8rem;
    margin: 22px 0 6px 14px;
    padding: 0;
}

/* Filter-Match-Spalten und -Badges */
#fastPreviewModal #fastPreviewTable thead th.fp-col-filter-match {
    color: var(--custom-primary);
    background: var(--custom-primary-glow);
    border-bottom-color: var(--custom-primary);
    border-bottom-width: 2px;
}

#fastPreviewModal .fp-match-struct-cell {
    white-space: nowrap;
}

#fastPreviewModal .fp-match-struct {
    display: inline-block;
    color: var(--custom-font);
    font-weight: 500;
}

#fastPreviewModal #fastPreviewTable tbody td.fp-match-cell {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    max-width: 360px;
    min-width: 180px;
    line-height: 1.6;
}

#fastPreviewModal .fp-match-badge {
    display: inline-block;
    padding: 2px 8px;
    margin: 0 4px 2px 0;
    background: var(--custom-primary-glow);
    color: var(--custom-primary);
    border: 1px solid rgba(25, 29, 147, 0.18);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.4;
    white-space: nowrap;
    vertical-align: baseline;
}

#fastPreviewModal .fp-match-badge--more {
    background: transparent;
    color: #6b7280;
    border-color: var(--g200);
    font-weight: 400;
}

/* Avatar-Spalte (deterministische Initialen-Kreise) */
#fastPreviewModal .fp-col-avatar {
    width: 36px;
    min-width: 36px;
    max-width: 36px;
    padding-left: 14px !important;
    padding-right: 0 !important;
    text-align: center;
}

#fastPreviewModal .fp-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1;
    user-select: none;
    text-decoration: none;
}

#fastPreviewModal .fp-avatar--link {
    cursor: pointer;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

#fastPreviewModal .fp-avatar--link:hover {
    transform: scale(1.1);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    text-decoration: none;
}

#fastPreviewModal .fp-avatar--link:focus-visible {
    outline: 2px solid var(--custom-primary);
    outline-offset: 2px;
}

#fastPreviewModal #fastPreviewTable tbody td.fp-col-firma {
    font-weight: 600;
    color: var(--custom-font);
    min-width: 240px;
    max-width: 340px;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    line-height: 1.35;
}

#fastPreviewModal #fastPreviewTable tbody td.fp-col-firma .fp-firma-text {
    color: var(--custom-font);
    overflow-wrap: anywhere;
}

/* Standort-Spalte (Stadt + Region kombiniert) */
#fastPreviewModal .fp-col-location {
    color: var(--custom-font);
}

#fastPreviewModal .fp-location-region {
    color: var(--g500);
    font-size: 0.78rem;
}

#fastPreviewModal .fp-col-webstatus {
    max-width: 220px;
}

#fastPreviewModal #fastPreviewTable tbody td.fp-col-contact {
    max-width: 200px;
    white-space: normal;
    line-height: 1.35;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

#fastPreviewModal .fp-contact-line {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
    color: var(--custom-font);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#fastPreviewModal .fp-contact-line + .fp-contact-line {
    margin-top: 3px;
}

#fastPreviewModal .fp-contact-icon {
    flex-shrink: 0;
    color: var(--g500);
}

#fastPreviewModal .fp-contact-text {
    overflow: hidden;
    text-overflow: ellipsis;
}

#fastPreviewModal .fp-empty {
    color: var(--g300);
    font-style: normal;
}


#fastPreviewModal #fastPreviewLoading {
    padding: 3rem 1rem !important;
}

#fastPreviewModal .fast-preview-loader {
    height: 4px;
    max-width: 320px;
    margin: 0 auto;
    background: var(--g100);
    border-radius: 2px;
    overflow: hidden;
    position: relative;
}

#fastPreviewModal .fast-preview-loader-bar {
    position: absolute;
    height: 100%;
    width: 40%;
    background: var(--custom-primary);
    border-radius: 2px;
    animation: fp-loader 1.2s ease-in-out infinite;
}

@keyframes fp-loader {
    0% { left: -40%; }
    100% { left: 100%; }
}

#fastPreviewModal #fastPreviewLoading .loading_section {
    color: var(--g600);
    font-size: 0.875rem;
    margin-top: 1rem;
}

#fastPreviewModal #fastPreviewEmpty {
    padding: 3rem 1rem;
}

#fastPreviewModal .fp-empty-state {
    max-width: none;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

#fastPreviewModal .fp-empty-state {
    max-width: 760px;
    margin: 0 auto;
}

#fastPreviewModal #fastPreviewBasicEmptyState {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

#fastPreviewModal .fp-volume-hero {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
}

#fastPreviewModal .fp-volume-primary-wrap {
    margin-top: 0.75rem;
}

#fastPreviewModal .fp-empty-icon-volume {
    background: rgba(25, 29, 147, 0.1);
    box-shadow: 0 8px 18px rgba(25, 29, 147, 0.14), inset 0 0 0 1px rgba(25, 29, 147, 0.08);
    animation: fp-volume-pulse 2.6s ease-in-out infinite;
}

#fastPreviewModal .fp-volume-card {
    border-radius: 18px;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(25, 29, 147, 0.09);
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

#fastPreviewModal .fp-volume-card-primary {
    background: linear-gradient(180deg, rgba(25, 29, 147, 0.08) 0%, rgba(25, 29, 147, 0.025) 100%), #fff;
    border-color: rgba(25, 29, 147, 0.2);
    box-shadow: 0 20px 44px rgba(25, 29, 147, 0.12);
}

#fastPreviewModal .fp-volume-card-title {
    font-size: 1rem;
    font-weight: 800;
    color: var(--custom-font);
    line-height: 1.35;
}

#fastPreviewModal .fp-volume-card-text {
    margin-top: 0.45rem;
    color: var(--g600);
    font-size: 0.88rem;
    line-height: 1.55;
}

#fastPreviewModal .fp-volume-card-hint {
    margin-top: 0.85rem;
    padding: 0.78rem 0.9rem;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(25, 29, 147, 0.15) 0%, rgba(25, 29, 147, 0.09) 100%);
    border: 1px solid rgba(25, 29, 147, 0.14);
    color: var(--custom-primary);
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.45;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.45);
}

#fastPreviewModal .fp-volume-quick-title {
    margin-top: 0.9rem;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--g500);
}

#fastPreviewModal .fp-volume-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.55rem;
}

#fastPreviewModal .fp-volume-secondary-actions {
    display: flex;
    margin-top: 0.9rem;
}

#fastPreviewModal .fp-volume-card-secondary {
    margin-top: 0.7rem;
    border-color: rgba(15, 23, 42, 0.08);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
    box-shadow: none;
    padding: 0.85rem 1rem;
}

#fastPreviewModal .fp-volume-card-secondary .fp-volume-card-title {
    font-size: 0.92rem;
    color: var(--g700);
}

#fastPreviewModal .fp-volume-card-inline {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

#fastPreviewModal .fp-volume-secondary-actions .fp-empty-action {
    width: 100%;
    margin-left: 0;
    min-width: 0;
    opacity: 0.92;
}

#fastPreviewModal .fp-empty-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.08);
    box-shadow: inset 0 0 0 1px rgba(25, 29, 147, 0.06);
    flex: 0 0 auto;
}

#fastPreviewModal .fp-empty-content {
    flex: 1 1 auto;
}

#fastPreviewModal .fp-empty-title {
    font-size: 1.08rem;
    line-height: 1.35;
    font-weight: 800;
    color: var(--custom-font);
    margin-bottom: 0.45rem;
}

#fastPreviewModal .fp-empty-text {
    color: var(--g600);
    font-size: 0.95rem;
    line-height: 1.6;
}

#fastPreviewModal .fp-empty-meta {
    display: block;
    margin-top: 0.9rem;
    color: var(--g500);
    font-size: 0.88rem;
    font-weight: 600;
}

#fastPreviewModal .fp-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.85rem;
}

#fastPreviewModal .fp-empty-action {
    min-height: 44px;
    padding: 0.72rem 1rem;
    font-size: 0.84rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    white-space: normal;
    text-align: center;
}

#fastPreviewModal #fpUnavailableAddBranch {
    box-shadow: 0 10px 22px rgba(25, 29, 147, 0.18);
}

#fastPreviewModal #fpUnavailableAddRadius,
#fastPreviewModal #fpUnavailableAddEmployeeClass {
    padding: 0.6rem 0.82rem;
    min-height: 40px;
    font-size: 0.78rem;
    border-color: rgba(25, 29, 147, 0.14);
    background: rgba(255,255,255,0.82) !important;
}

#fastPreviewModal .fp-empty-action-sm {
    min-height: 40px;
    padding: 0.62rem 0.85rem;
    font-size: 0.8rem;
}

#fastPreviewModal .fp-empty-action:hover {
    transform: translateY(-1px);
}

@keyframes fp-volume-pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 8px 18px rgba(25, 29, 147, 0.14), inset 0 0 0 1px rgba(25, 29, 147, 0.08);
    }
    50% {
        transform: scale(1.04);
        box-shadow: 0 10px 24px rgba(25, 29, 147, 0.18), inset 0 0 0 1px rgba(25, 29, 147, 0.1);
    }
}

@media (max-width: 768px) {
    #fastPreviewModal > .modal-dialog {
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        margin: 12px auto;
    }

    #fastPreviewModal .modal-content {
        padding: 0.5rem 0.5rem 0.5rem !important;
    }

    #fastPreviewModal .modal-header {
        padding: 0.6rem 1rem !important;
        margin: -0.5rem -0.5rem 0 !important;
    }

    #fastPreviewModal .modal-header .modal-title {
        font-size: 0.95rem !important;
    }

    #fastPreviewModal .fast-preview-subtitle {
        font-size: 0.72rem !important;
    }

    #fastPreviewModal .fp-sample-info {
        font-size: 0.7rem;
        margin: 14px 0 4px 10px;
    }

    #fastPreviewModal #fastPreviewTable {
        font-size: 0.72rem;
    }

    #fastPreviewModal #fastPreviewTable thead th {
        font-size: 0.68rem;
        padding: 0.45rem 0.5rem;
    }

    #fastPreviewModal #fastPreviewTable tbody td {
        padding: 0.45rem 0.5rem;
    }

    #fastPreviewModal .fp-cta-block {
        padding: 10px 12px;
        margin-left: 10px;
        margin-right: 10px;
    }

    #fastPreviewModal .fp-cta-block-title {
        font-size: 0.85rem;
    }

    #fastPreviewModal .fp-cta-block-text {
        font-size: 0.72rem;
    }

    #fastPreviewModal .fp-footer-info {
        font-size: 0.68rem;
        padding: 8px 10px;
        margin-left: 10px;
        margin-right: 10px;
    }

    #fastPreviewModal .fp-kpi-cards {
        margin-left: 10px;
        margin-right: 10px;
    }

    #fastPreviewModal .fp-active-filters-card {
        margin-left: 10px;
        margin-right: 10px;
        padding: 10px 12px;
    }

    #fastPreviewModal .fp-empty-state {
        padding: 1.1rem;
        border-radius: 14px;
    }

    #fastPreviewModal #fastPreviewBasicEmptyState,
    #fastPreviewModal .fp-volume-hero {
        gap: 0.8rem;
    }

    #fastPreviewModal .fp-empty-icon {
        width: 44px;
        height: 44px;
        border-radius: 12px;
    }

    #fastPreviewModal .fp-empty-title {
        font-size: 0.98rem;
    }

    #fastPreviewModal .fp-empty-text {
        font-size: 0.88rem;
    }

    #fastPreviewModal .fp-empty-actions {
        flex-direction: column;
    }

    #fastPreviewModal .fp-empty-action {
        width: 100%;
    }

    #fastPreviewModal .fp-volume-quick-actions {
        flex-direction: column;
    }

    #fastPreviewModal .fp-volume-secondary-actions .fp-empty-action {
        width: 100%;
        margin-left: 0;
        min-width: 0;
    }

}

/* End of Fast Preview */

/* Start of User Searches */
#userSearchesModal .modal-body .input-group {
    overflow: visible !important;
}

#userSearchesModal .modal-body .select2.select2-container.select2-container--bootstrap-5.select2-container--below {
    height: 100% !important;
}

#userSearchesModal .modal-body .select2.select2-container.select2-container--bootstrap-5.select2-container--below>.select2-selection__placeholder {
    color: var(--custom-primary) !important;
}

#userSearchesModal .modal-body .select2-container.select2-container--bootstrap-5.select2-container--open {
    top: 0 !important;
}

#userSearchesModal .modal-body .select2-dropdown.select2-dropdown--below {
    background: none;
    border: none;
    overflow: visible;
}

#userSearchesModal .modal-body .select2-dropdown.select2-dropdown--below .select2-search__field {
    height: 100%;
    border: none;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    color: var(--custom-primary) !important;
}

#userSearchesModal .modal-body .select2-dropdown.select2-dropdown--below .select2-search__field::placeholder {
    content: "Bitte Suche eingeben...";
    color: var(--custom-primary) !important;
}

#userSearchesModal .modal-body .select2-dropdown.select2-dropdown--below .select2-results {
    top: 8px;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    border: none !important;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.10);
}

#userSearchesModal .select2-selection.select2-selection--single {
    border-radius: 50px !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
}

#userSearchesModal .select2-search.select2-search--dropdown {
    padding: 0;
    height: 56px;
}

#userSearchesModal .select2-container--bootstrap-5 .select2-dropdown .select2-results__options {
    background-color: white;
    padding-inline: 1rem !important;
}

#userSearchesModal .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted {
    background-color: white;
}

#userSearchesModal .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option {
    border-bottom: 1px solid #EEE;
    padding: 1rem 0;
}

#userSearchesModal .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option .delete-button {
    width: auto;
    height: auto;
    background-color: white;
    border: none;
}

#userSearchesModal>.modal-dialog,
#saveNewSearchModal>.modal-dialog {
    width: 933px !important;
    max-width: calc(100% - 64px) !important;
}


/* End of User Searches */


#action-buttons-search-result {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}

#action-buttons-search-result .flex-item {
    box-sizing: border-box;
    margin: 5px;
    padding: 10px;
    text-align: right;
    width: 200px;
}

#action-buttons-search-result svg {
    margin-right: 5px;
}

#search-header-links {
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
}

#search-header-links a {
    color: #303030 !important;
}

#search-header-links .icon_image {
    display: inline-block;
    width: auto !important;
    height: auto !important;
    line-height: normal !important;
    margin-right: 4px !important;
}

@media (max-width: 600px) {
    #search-header-links {
        flex: 100%;
        flex-flow: column wrap;
    }
}

/* Unified Search Card Wrapper */
.unified-search-card-wrapper {
    background: #f8f7f6;
    border-radius: 0;
    box-shadow: none;
    border: none;
    border-bottom: 1px solid var(--g200);
    overflow: visible;
    margin: 0;
    max-width: 100%;
    padding: 0;
}

.unified-search-card-wrapper #search-header-links {
    padding: 1.5rem 1.25rem 0 2rem;
    margin: 0;
    background: #f8f7f6;
}

.unified-search-card-wrapper .test {
    margin: 0;
    padding: 0;
    background: #f8f7f6;
    align-items: flex-start;
}

@media (min-width: 1200px) {
    #custom-container.container-fluid.custom {
        max-width: min(100%, 1680px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .unified-search-card-wrapper {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (min-width: 1700px) {
    #custom-container.container-fluid.custom {
        max-width: min(100%, 2080px) !important;
    }

    .unified-search-card-wrapper {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .unified-search-card-wrapper .test > section,
    .unified-search-card-wrapper .test > div:not(#searchFilters) {
        padding: 0 1.5rem;
    }

    .discovery-screen-content {
        max-width: none;
    }

    .discovery-workspace-bar,
    .discovery-screen--search-first .discovery-smart-search--hero,
    .discovery-search-hero {
        max-width: 760px;
    }

    .discovery-support-zone {
        max-width: 760px;
    }

    .discovery-screen--search-first .discovery-also-searched {
        max-width: 652px;
    }

    .discovery-also-searched-grid {
        grid-template-columns: repeat(2, minmax(0, 320px));
        justify-content: center;
        gap: 10px 12px;
    }
}

/* Sidebar-Spalte: nur Layout, Scroll, Abstand; Modul-Optik liegt in .filter-sidebar */
.unified-search-card-wrapper #searchFilters {
    border: none;
    margin: 0;
    min-width: 270px;
    max-width: 300px;
    padding: 0.78rem 1rem 1.35rem 1rem;
    background: transparent !important;
    border-radius: 18px;
    position: sticky;
    top: var(--search3-header-height);
    align-self: flex-start;
    max-height: calc(100vh - var(--search3-header-height));
    overflow-y: scroll;
    scrollbar-width: auto;
    scrollbar-color: var(--g300) #e8eaed;
    box-shadow: none;
}

@media (min-width: 992px) {
    .unified-search-card-wrapper #searchFilters {
        border: none;
        border-radius: 18px;
        padding-top: 0.62rem;
        box-shadow:
            0 18px 40px rgba(15, 23, 42, 0.09),
            0 6px 16px rgba(15, 23, 42, 0.07);
        margin: 1rem 0.85rem 1rem 1rem;
        z-index: 2;
        padding: 0;
        top: calc(var(--search3-header-height) + 1rem);
        max-height: calc(100vh - var(--search3-header-height) - 2rem);
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-gutter: stable;
    }
}

.unified-search-card-wrapper #searchFilters::-webkit-scrollbar {
    width: 5px;
}

.unified-search-card-wrapper #searchFilters::-webkit-scrollbar-track {
    background: #e8eaed;
    border-radius: 5px;
}

.unified-search-card-wrapper #searchFilters::-webkit-scrollbar-thumb {
    background: var(--g300);
    border-radius: 5px;
    min-height: 40px;
}

.unified-search-card-wrapper .searchFiltersParent {
    margin: 0 !important;
    padding: 0;
    background: transparent !important;
}

/* Ein zusammenhaengendes Filter-Modul: klare Klammer ohne Karten-Overload */
.unified-search-card-wrapper #filterSection.filter-sidebar {
    width: 100%;
    box-sizing: border-box;
    background: #f7f8fa !important;
    border-radius: 14px;
    border: 1px solid #eaecef;
    padding: 12px;
    box-shadow: none;
}

/* Filter-Sidebar: Zeilen-Icons (bi-*) durchgaengig CI-Blau; Hover etwas aufgehellt */
.unified-search-card-wrapper #searchFilters .filter-item-card .filter-icon {
    color: var(--custom-primary, #191d93) !important;
    opacity: 1;
}
.unified-search-card-wrapper #searchFilters .filter-item-card:hover:not(.is-disabled) .filter-icon {
    color: var(--custom-primary-light, #3d42b5) !important;
    opacity: 1;
}
.unified-search-card-wrapper #searchFilters .filter-item-card.filter-row--modal-active .filter-icon {
    color: var(--custom-primary, #191d93) !important;
    opacity: 1;
}
.unified-search-card-wrapper #searchFilters .filter-item-card.filter-active .filter-icon {
    color: var(--custom-primary, #191d93) !important;
    opacity: 1;
}
.unified-search-card-wrapper #searchFilters .filter-item-card.is-disabled .filter-icon {
    color: var(--custom-primary, #191d93) !important;
    opacity: 0.4;
}

.unified-search-card-wrapper #filterSection:not(.filter-sidebar) {
    width: 100%;
    background: transparent !important;
}

.unified-search-card-wrapper #searchFilters label,
.unified-search-card-wrapper #searchFilters .form-label,
.unified-search-card-wrapper #searchFilters .form-check-label {
    color: var(--g600);
}

/* Video Tutorial Button Styling */
.unified-search-card-wrapper .video-tutorial-button {
    border: 1px solid var(--g200) !important;
    box-shadow: none !important;
    border-radius: var(--r-sm);
    padding: 0.35rem 0.75rem;
    transition: var(--ease);
    font-size: 0.85rem;
}

.unified-search-card-wrapper .video-tutorial-button:hover {
    background-color: var(--custom-primary-glow) !important;
}

/* Search Input Styling */

.unified-search-card-wrapper .searchInput {
    border-radius: var(--r-sm);
    border: 1px solid var(--g200);
    padding: 0.5rem 2.5rem 0.5rem 0.75rem;
    background: var(--g50);
    transition: var(--ease);
    font-size: 0.875rem;
    color: var(--g700);
}

.unified-search-card-wrapper .searchInput::placeholder {
    color: var(--g400);
}

.unified-search-card-wrapper .searchInput:focus {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(25,29,147,0.08);
    outline: none;
    background: #ffffff;
}

/* Search Icon Styling */
.unified-search-card-wrapper #searchIconBtn,
.unified-search-card-wrapper .search-icon {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 20px !important;
    height: 20px !important;
    z-index: 10;
    pointer-events: auto;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.unified-search-card-wrapper #searchIconBtn img,
.unified-search-card-wrapper .search-icon img {
    width: 18px !important;
    height: 18px !important;
    opacity: 0.7;
    transition: all 0.2s ease;
    display: block;
    filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(238deg) brightness(95%) contrast(92%);
}

.unified-search-card-wrapper #searchIconBtn:hover img,
.unified-search-card-wrapper .search-icon:hover img {
    opacity: 1;
    transform: scale(1.1);
}

.unified-search-card-wrapper .searchInput:focus~#searchIconBtn img,
.unified-search-card-wrapper .searchInput:focus~.search-icon img {
    opacity: 0.9;
}

/* Filter Header Styling: eine Zeile Icon + Filter + DACH, darunter volle Trennlinie */
.unified-search-card-wrapper .dach-filter-container {
    margin-bottom: 1.15rem;
    padding: 0 0 1rem 0 !important;
    border-bottom: 1px solid #eaecef;
    gap: 0.4rem;
    min-width: 0;
    flex-wrap: wrap;
    row-gap: 0.5rem;
}
.unified-search-card-wrapper .dach-filter-container .dach-filter__icon {
    width: 18px;
    height: 18px;
    color: var(--custom-primary, #191d93);
}
.unified-search-card-wrapper .dach-filter-container .filter-heading {
    margin: 0;
    line-height: 1.3;
    flex-shrink: 0;
    font-size: 1.0625rem;
    font-weight: 700;
    letter-spacing: -0.015em;
    color: #111827;
}
.unified-search-card-wrapper .dach-filter-container .filter-heading-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: rgba(25, 29, 147, 0.1);
    color: var(--custom-primary, #191d93);
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.01em;
    white-space: nowrap;
    flex-shrink: 0;
}
.unified-search-card-wrapper .dach-filter-container .filter-country-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--g500, #64748b);
    letter-spacing: 0.01em;
    white-space: nowrap;
    flex-shrink: 0;
    margin-left: auto;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher {
    flex-shrink: 0;
    margin-left: 0 !important;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher .dach-dropdown {
    padding-inline: 3px 5px !important;
    max-width: none;
    flex-wrap: nowrap;
    font-size: 0.8125rem;
    gap: 0;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher .dach-dropdown .flag-icon {
    flex-shrink: 0;
    margin-right: 1px;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher .dach-dropdown .flag-icon:last-of-type {
    margin-right: 0;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher .dach-dropdown > span {
    margin-left: 4px !important;
}
.unified-search-card-wrapper .dach-filter-container #searchCountrySwitcher.search-country-switcher .dach-dropdown > span {
    flex-shrink: 0;
}

/* Main Content Area (right side) */
.unified-search-card-wrapper .test>section,
.unified-search-card-wrapper .test>div:not(#searchFilters) {
    background: #f8f7f6;
    padding: 0 1.25rem;
    flex: 1;
    min-width: 0;
    border-radius: 0;
    min-height: calc(100vh - var(--search3-header-height));
}

.unified-search-card-wrapper .search3-main-column {
    padding: 0;
    background: #ffffff;
}

.unified-search-card-wrapper .filter-section-tagline {
    display: none;
}

/* Filter Section Backgrounds - Subtle and Professional */
.unified-search-card-wrapper .filter-sections-container {
    background: transparent;
}

/* Akkordeon: kein Karten-Rahmen (Bootstrap .border/.rounded auf dem Button) */
.unified-search-card-wrapper button.filter-section-button.border.rounded {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border-left: none !important;
}
.unified-search-card-wrapper .filter-section-button {
    border-radius: 0 !important;
    border: none !important;
    border-left: none !important;
    margin-bottom: 0;
    padding: 0.46rem 0.4rem !important;
    transition: background-color 0.15s ease;
    background: transparent !important;
    text-align: left;
    font-weight: 500;
    color: #111827;
}

.unified-search-card-wrapper .filter-section-button:hover {
    background: rgba(0, 0, 0, 0.03) !important;
}

.unified-search-card-wrapper .business-contact-section-button {
    border-radius: 8px !important;
    background: rgba(148, 163, 184, 0.08) !important;
    box-shadow: inset 0 0 0 1px rgba(203, 213, 225, 0.85);
}

.unified-search-card-wrapper .business-contact-section-button:hover {
    background: rgba(148, 163, 184, 0.12) !important;
}

.unified-search-card-wrapper .business-contact-section-button[aria-expanded="true"] {
    background: rgba(148, 163, 184, 0.14) !important;
}

.unified-search-card-wrapper .business-contact-section-button .chevron-icon {
    color: #7c8798;
    opacity: 1;
}

.unified-search-card-wrapper .business-contact-section-button:hover .chevron-icon,
.unified-search-card-wrapper .business-contact-section-button[aria-expanded="true"] .chevron-icon {
    color: #64748b;
}

/* Filter-Spalte Desktop: gleiche flache Liste wie Mobil, keine verschachtelten Karten */
@media (min-width: 992px) {
    .unified-search-card-wrapper #searchFilters .filter-sections-container > .mb-3 {
        margin-bottom: 0.95rem !important;
        border: none;
        border-radius: 0;
        background: transparent;
        overflow: visible;
        box-shadow: none;
    }

    .unified-search-card-wrapper #searchFilters .filter-sections-container > .mb-3:first-child {
        margin-top: -0.18rem;
    }

    .unified-search-card-wrapper #searchFilters .filter-section-button {
        padding: 0.4rem 0.28rem !important;
    }

    .unified-search-card-wrapper #searchFilters .filter-section-button .fw-semibold {
        font-size: 0.8125rem !important;
        letter-spacing: -0.015em !important;
    }

    .unified-search-card-wrapper #searchFilters .filter-section-button.filter-section-gray {
        background-color: transparent !important;
        border-color: transparent !important;
    }
}

/* Filterzeilen: flach im Soft-Block, sehr leichte Divider zwischen Zeilen, kein Schatten */
.unified-search-card-wrapper #searchFilters .filter-sections-container .collapse .filter-item.filter-item-card {
    border: none !important;
    border-bottom: none !important;
    border-radius: 8px !important;
    margin-bottom: 0 !important;
    padding: 0.75rem 0.875rem !important;
    background: transparent !important;
    box-shadow: none !important;
    transition: background-color 0.12s ease;
    cursor: pointer;
}

.unified-search-card-wrapper #searchFilters .filter-item.filter-item-start {
    background: rgba(25, 29, 147, 0.04) !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-actions {
    margin: -0.18rem 0 0.28rem;
    padding-left: 0;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: none;
    background: transparent;
    border-radius: 8px;
    padding: 0.32rem 0.75rem 0.36rem calc(1.125rem + 0.875rem);
    color: #6b7280;
    margin-top: 0;
    box-shadow: none;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction .small {
    font-size: 0.71875rem;
    text-align: left;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction-label {
    color: #6b7280;
    font-weight: 500;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction:not(.is-disabled):hover {
    background: transparent !important;
    color: #4b5563;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction:not(.is-disabled):hover .filter-inline-subaction-label {
    color: #4b5563;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-item-card:hover:not(.is-disabled):not(.filter-row--modal-active):not(.filter-active) {
    background: transparent !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-row--modal-active {
    background: rgba(25, 29, 147, 0.08) !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-row--modal-active:hover {
    background: rgba(25, 29, 147, 0.1) !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-active {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-active .filter-inline-subaction-label {
    color: #191d93 !important;
    font-weight: 600;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.filter-active .small:not(.badge) {
    color: #191d93 !important;
}

.unified-search-card-wrapper #searchFilters .filter-inline-subaction.is-disabled {
    opacity: 0.82;
    cursor: not-allowed;
}

.unified-search-card-wrapper #searchFilters .filter-item-start-label {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    font-size: 0.625rem;
    line-height: 1;
    font-weight: 600;
    color: #191d93;
    background: rgba(25, 29, 147, 0.08);
    border-radius: 999px;
    padding: 0.22rem 0.42rem;
}

.unified-search-card-wrapper #searchFilters .filter-item.filter-active .filter-item-start-label,
.unified-search-card-wrapper #searchFilters .filter-item:hover .filter-item-start-label {
    background: rgba(25, 29, 147, 0.12);
}

.unified-search-card-wrapper
    #searchFilters
    .filter-sections-container
    .collapse
    .filter-item.filter-item-card:not(:last-child) {
    border-bottom: 1px solid rgba(0, 0, 0, 0.055) !important;
}

.unified-search-card-wrapper
    #searchFilters
    .filter-sections-container
    .collapse
    .filter-item.filter-item-card:hover:not(.is-disabled):not(.filter-row--modal-active):not(.filter-active) {
    background: rgba(0, 0, 0, 0.04) !important;
}

.unified-search-card-wrapper
    #searchFilters
    .filter-sections-container
    .collapse
    .filter-item.filter-item-card.filter-active:hover:not(.is-disabled):not(.filter-row--modal-active) {
    background: rgba(25, 29, 147, 0.09) !important;
}

/* Abstaende: Gap zwischen Items; Data-Dive-Gruppen weiter auseinander */
.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-collapse-inner > .d-flex.flex-column {
    gap: 0 !important;
}
.unified-search-card-wrapper #searchFilters #collapseB2BDataDiveMore > .d-flex.flex-column {
    gap: 0 !important;
}
.unified-search-card-wrapper #searchFilters .filter-group-block > .d-flex.flex-column {
    gap: 0 !important;
}
.unified-search-card-wrapper #searchFilters #collapseB2BRegional .filter-collapse-inner > .d-flex.flex-column,
.unified-search-card-wrapper #searchFilters #collapseB2BVisibleWeb .filter-collapse-inner > .d-flex.flex-column {
    gap: 0 !important;
}

.unified-search-card-wrapper #searchFilters .filter-collapse-inner .fw-medium.text-secondary.mt-2 {
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #9ca3af !important;
    margin-top: 1.25rem !important;
    margin-bottom: 0.25rem !important;
    padding-left: 0.125rem;
    padding-right: 0.125rem;
}
.unified-search-card-wrapper #searchFilters .filter-collapse-inner .fw-medium.text-secondary.mt-2 .small.text-muted {
    font-size: 0.6875rem !important;
    text-transform: none;
    letter-spacing: 0.02em;
    font-weight: 400;
    margin-top: 0.2rem;
    color: #6b7280 !important;
}

/* CI-Akzent am Gruppentitel: ©-Symbol als echtes Copyright-Superscript */
.unified-search-card-wrapper .filter-section-button .filter-section-ci-accent {
    font-weight: 600;
    font-size: 0.65em;
    vertical-align: super;
    line-height: 1;
    margin-left: 0.15em;
    letter-spacing: 0;
}
.unified-search-card-wrapper .filter-section-button.filter-section-purple .filter-section-ci-accent {
    color: var(--ci-regional);
}
.unified-search-card-wrapper .filter-section-button.filter-section-red .filter-section-ci-accent {
    color: var(--ci-datadive);
}
.unified-search-card-wrapper .filter-section-button.filter-section-green .filter-section-ci-accent {
    color: var(--ci-visibleweb);
}

.unified-search-card-wrapper .filter-section-button .chevron-icon {
    width: 11px;
    height: 11px;
    color: #b0b7c3;
    opacity: 0.92;
    flex-shrink: 0;
    transition: transform 0.2s ease, opacity 0.15s ease;
}
.unified-search-card-wrapper .filter-section-button:hover .chevron-icon {
    color: #9ca3af;
    opacity: 1;
}
.unified-search-card-wrapper .filter-section-button > .d-flex.align-items-center:first-child {
    gap: 0.45rem;
    min-width: 0;
    flex: 1;
}
.unified-search-card-wrapper .filter-section-button .filter-info-icon-wrapper {
    flex: 0 0 1.125rem;
    width: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    opacity: 0.75;
}
.unified-search-card-wrapper .filter-section-button:hover .filter-info-icon-wrapper {
    opacity: 0.9;
    color: #475569;
}
.unified-search-card-wrapper .filter-section-button .filter-info-icon-wrapper svg {
    width: 13px;
    height: 13px;
}

.filter-section-tagline {
    display: none;
}

/* Collapse content backgrounds */
.unified-search-card-wrapper .collapse {
    background: transparent;
}

.unified-search-card-wrapper .collapse.show {
    background: transparent;
    margin-top: 0;
    padding: 0;
}

/* Filter items styling */
.unified-search-card-wrapper .filter-item {
    background: transparent !important;
    border-radius: 4px;
    margin-bottom: 1px;
    transition: background-color 0.15s ease;
}
.unified-search-card-wrapper .filter-item .small,
.unified-search-card-wrapper .filter-item span.small {
    font-size: 0.8125rem;
    line-height: 1.28;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #111827;
}
.unified-search-card-wrapper .filter-item-card .small.text-muted {
    font-weight: 400;
    font-size: 0.703125rem !important;
    letter-spacing: 0.01em;
    color: #7f8a9b !important;
    line-height: 1.18;
}

.unified-search-card-wrapper .filter-item-card .filter-item-microtext {
    display: block;
    max-width: 100%;
    font-size: 0.6875rem !important;
    color: #7f8a9b !important;
    line-height: 1.14;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.unified-search-card-wrapper .filter-item:hover {
    background: rgba(248, 250, 252, 0.75) !important;
}

/* B2B sections: flat collapse areas */
.unified-search-card-wrapper #collapseB2BDataDive.collapse.show,
.unified-search-card-wrapper #collapseB2BRegional.collapse.show,
.unified-search-card-wrapper #collapseB2BVisibleWeb.collapse.show {
    background: transparent;
}
/* Soft-Container: Regional + Visible Web (ein Block pro Sektion) */
.unified-search-card-wrapper #searchFilters #collapseB2BRegional .filter-collapse-inner,
.unified-search-card-wrapper #searchFilters #collapseB2BVisibleWeb .filter-collapse-inner {
    padding: 9px 8px !important;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.6);
    border: none;
    box-shadow: none;
    margin: 0 !important;
}

/* Data Dive: Block pro filter-group-block */
.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-collapse-inner {
    padding: 9px 8px !important;
    margin: 0 !important;
    background: rgba(255, 255, 255, 0.6);
    border: none;
    border-radius: 10px;
    box-shadow: none;
}

.unified-search-card-wrapper #searchFilters .filter-item.filter-item-card {
    padding-top: 0.46rem !important;
    padding-bottom: 0.46rem !important;
    padding-left: 0.72rem !important;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: transparent;
    border-radius: 8px;
    padding: 0.48rem 2.15rem 0.48rem calc(0.72rem + 1.125rem + 0.55rem);
    margin: 0.18rem 0 0.12rem;
    color: #64748b;
    font-size: 0.71875rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: left;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:hover {
    background: rgba(25, 29, 147, 0.045);
    color: #475569;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(25, 29, 147, 0.12);
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button.has-active-filters {
    color: #191d93;
    background: rgba(25, 29, 147, 0.05);
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-label--open {
    display: none;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:not(.collapsed) .filter-subtoggle-label--closed {
    display: none;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:not(.collapsed) .filter-subtoggle-label--open {
    display: inline;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-chevron {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    width: 11px;
    height: 11px;
    color: #8f98a8;
    opacity: 0.98;
    transform: translateY(-50%);
    transition: transform 0.18s ease, color 0.12s ease;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:hover .filter-subtoggle-chevron,
.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button.has-active-filters .filter-subtoggle-chevron {
    color: #6b7280;
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDive .filter-subtoggle-button:not(.collapsed) .filter-subtoggle-chevron {
    transform: translateY(-50%) rotate(180deg);
}

.unified-search-card-wrapper #searchFilters #collapseB2BDataDiveMore {
    margin-top: 0;
}

/* Filter group blocks and headings */
.unified-search-card-wrapper .filter-group-block {
    margin-bottom: 0;
}
.unified-search-card-wrapper .filter-group-block:last-child {
    margin-bottom: 0;
}
.unified-search-card-wrapper .filter-group-heading {
    font-weight: 500;
    color: #9ca3af;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.375rem;
    margin-top: 0;
    padding: 0 0.125rem;
}

/* Filter item cards */
/* Einheitliche Icon-Schiene: alle Einträge einer Spalte optisch bündig */
.unified-search-card-wrapper .filter-item-card .filter-icon {
    width: 1.125rem;
    min-width: 1.125rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9375rem;
    line-height: 1;
    color: #8892a2;
    opacity: 0.76;
    transition: color 0.12s ease, opacity 0.12s ease;
    -webkit-font-smoothing: antialiased;
}
.unified-search-card-wrapper .filter-item-card:hover:not(.is-disabled) .filter-icon {
    color: #7b8696;
    opacity: 0.84;
}
.unified-search-card-wrapper .filter-item-card .filter-item-right {
    flex: 0 0 auto;
    min-width: 2rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.2rem;
}

/* Chevron-Spalte in der Sidebar: feste rechte Rail wie bei Tool-Listen */
.unified-search-card-wrapper #searchFilters .filter-item.filter-item-card:has(.filter-item-right) {
    position: relative;
    padding-right: 2.15rem !important;
}

.unified-search-card-wrapper #searchFilters .filter-item.filter-item-card:has(.filter-item-right) .filter-item-right {
    position: absolute;
    right: 0.68rem;
    top: 0.72rem;
    transform: none;
    min-width: auto;
    gap: 0.25rem;
}
.unified-search-card-wrapper .filter-item-card .d-flex.align-items-center.gap-2 {
    gap: 0.625rem !important;
}

/* Geoeffnetes Filter-Modal: CI-Ton + Radius, kein Item-Schatten */
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active {
    border: none !important;
    border-bottom: none !important;
    border-radius: 8px !important;
    background: rgba(25, 29, 147, 0.08) !important;
    box-shadow: none;
    margin: 0 !important;
    z-index: 1;
    position: relative;
}
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active:hover {
    background: rgba(25, 29, 147, 0.1) !important;
}
.unified-search-card-wrapper .filter-item-card.filter-item-power.filter-row--modal-active {
    background: rgba(25, 29, 147, 0.08) !important;
    border: none !important;
}
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active .filter-icon {
    color: #475569 !important;
    opacity: 1;
}
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active .filter-item-chevron {
    opacity: 0.92;
    color: #b0b7c3 !important;
}
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active .small,
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active span.small {
    color: #111827;
    font-weight: 500;
}
.unified-search-card-wrapper .filter-item-card.filter-row--modal-active .small.text-muted {
    font-weight: 400 !important;
    color: #4b5563 !important;
}
/* Aktiver Filter-Zustand */
.unified-search-card-wrapper .filter-item.filter-active:not(.filter-item-card) {
    border-radius: 4px !important;
}
.unified-search-card-wrapper .filter-item.filter-item-card.filter-active {
    background: rgba(25, 29, 147, 0.06) !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.unified-search-card-wrapper .filter-item.filter-active .small {
    font-weight: 500;
    color: var(--g800);
}
.unified-search-card-wrapper .filter-item.filter-item-card.filter-active .small:not(.text-muted):not(.badge) {
    font-weight: 600;
    color: #191d93 !important;
}
.unified-search-card-wrapper .filter-item.filter-active .filter-icon {
    opacity: 1;
}
.unified-search-card-wrapper .filter-item.filter-item-card.filter-active .filter-icon {
    color: #191d93 !important;
}
.unified-search-card-wrapper .filter-item-card .small:not(.text-muted):not(.badge) {
    font-weight: 500;
    color: #111827;
    letter-spacing: -0.01em;
    font-size: 0.78125rem;
}
.unified-search-card-wrapper .filter-item-card .filter-item-chevron {
    color: #8f98a8 !important;
    opacity: 0.98;
    width: 11px !important;
    height: 11px !important;
    padding: 0;
    margin-top: 0;
    box-sizing: content-box;
    border-radius: 0;
    background: transparent;
    border: none;
    transition: opacity 0.12s ease, color 0.12s ease;
}
.unified-search-card-wrapper .filter-item-card:hover:not(.is-disabled):not(.filter-row--modal-active) .filter-item-chevron {
    color: #7f8898 !important;
    opacity: 0.95;
}
.unified-search-card-wrapper .filter-item-card.is-disabled .filter-item-chevron {
    opacity: 0.4;
}
.unified-search-card-wrapper .filter-item-chevron {
    flex-shrink: 0;
    opacity: 0.88;
    transition: opacity 0.15s ease, color 0.15s ease;
    width: 10px;
    height: 10px;
}
.unified-search-card-wrapper .filter-item:hover .filter-item-chevron {
    color: #9ca3af !important;
    opacity: 0.95;
}

.unified-search-card-wrapper .filter-item-card .filter-info-icon-wrapper {
    opacity: 0.48;
}
.unified-search-card-wrapper .filter-item-card .filter-info-icon-wrapper:hover {
    opacity: 0.88;
}

.unified-search-card-wrapper #contactsFromEmailParent .email-contact-info-icon {
    margin-right: 0.45rem;
}

.unified-search-card-wrapper #contactsFromEmailParent .email-contact-actions {
    margin-left: 0.8rem;
}

/* Visible-Web-Gruppenkopf: Power-Filter-Badge (eine Zeile unter „Digitale Signale“) */
.unified-search-card-wrapper .filter-section-button .filter-power-badge {
    font-weight: 600;
    font-size: 0.56rem !important;
    padding: 0.08rem 0.34rem !important;
    line-height: 1.25;
    border: 1px solid rgba(8, 194, 127, 0.45);
    background: rgba(8, 194, 127, 0.1) !important;
    color: #0f5132 !important;
    gap: 0.25rem !important;
}
.unified-search-card-wrapper .filter-section-button .filter-power-badge .filter-power-badge-icon {
    font-size: 0.68rem;
    line-height: 1;
    opacity: 0.98;
    flex-shrink: 0;
}

/* Datenqualitaet section */
.unified-search-card-wrapper .filter-group-datenqualitaet {
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}
.unified-search-card-wrapper .filter-group-heading-muted {
    font-weight: 600;
    color: var(--g500);
    font-size: 0.75rem;
}

/* Filter row right-side indicators: count badge and check (section colors applied via parent) */
/* Only show circle when badge is visible (no d-none) – never show colored badge when count is null/zero */
.unified-search-card-wrapper .filter-indicator-count.d-none {
    display: none !important;
    visibility: hidden !important;
}
.unified-search-card-wrapper .filter-indicator-count:not(.d-none) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 2rem;
    padding: 0.1rem 0.35rem;
    font-size: 0.65rem;
    min-width: 1rem;
    font-size: 0.7rem !important;
    min-width: 1.25rem;
    height: 1.25rem;
}
.unified-search-card-wrapper .filter-indicator-check .bi-check-circle-fill {
    font-size: 1.1rem;
}
/* Section-specific indicator colors (badge/check) – CI-Farben */
.unified-search-card-wrapper #collapseB2BRegional .filter-indicator-count { background-color: var(--ci-regional) !important; color: #fff !important; }
.unified-search-card-wrapper #collapseB2BRegional .filter-indicator-check .bi-check-circle-fill { color: var(--ci-regional) !important; }
.unified-search-card-wrapper #collapseB2BDataDive .filter-indicator-count { background-color: var(--ci-datadive) !important; color: #fff !important; }
.unified-search-card-wrapper #collapseB2BDataDive .filter-indicator-check .bi-check-circle-fill { color: var(--ci-datadive) !important; }
.unified-search-card-wrapper #collapseB2BVisibleWeb .filter-indicator-count { background-color: var(--ci-visibleweb) !important; color: #fff !important; }
.unified-search-card-wrapper #collapseB2BVisibleWeb .filter-indicator-check .bi-check-circle-fill { color: var(--ci-visibleweb) !important; }

/* Responsive Design */
@media (max-width: 991.98px) {
    .unified-search-card-wrapper {
        margin: 0;
    }

    .unified-search-card-wrapper #searchFilters {
        max-width: 100%;
        width: 100%;
        min-width: unset;
        border: none;
        border-radius: 0;
        box-shadow: none;
        margin: 0;
        /* Auf Mobile wandert der Filter-Block unter die Hero-Suche (s. order).
           border-top statt border-bottom, damit die Trennlinie visuell
           zwischen Chat-Bereich und Filter sitzt - nicht ueber dem Filter. */
        border-top: 1px solid var(--g200);
        padding: 0.75rem 1rem;
        position: static;
        max-height: none;
        overflow-y: visible;
        top: auto;
        scrollbar-gutter: auto;
        background: transparent !important;
        /* Chat-Hero oben, Filter unten. Auf Mobile ist die Hero-Suche das
           primaere Interaktionselement - der Filter-Block ist eine
           Alternative fuer Power-User und muss nicht den First-View
           blockieren. */
        order: 2;
    }

    .unified-search-card-wrapper .test {
        flex-direction: column;
    }
}

@media (max-width: 768px) {
    .unified-search-card-wrapper {
        margin: 0;
    }

    .unified-search-card-wrapper #search-header-links {
        padding: 0.5rem 0.75rem 0 0.75rem;
    }

    .unified-search-card-wrapper .test>section,
    .unified-search-card-wrapper .test>div:not(#searchFilters) {
        padding: 0 0.75rem;
    }

    .unified-search-card-wrapper .search3-main-column {
        padding: 0;
    }

    .discovery-screen-shell {
        padding-right: 0;
    }

}

/* Filter Info Icon and Tooltip Styles */
.filter-info-icon-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: help;
    z-index: 10;
    position: relative;
}

.filter-info-icon,
.filter-info-icon-wrapper svg {
    position: relative !important;
    z-index: 0 !important;
}
.filter-info-icon {
    width: 14px;
    height: 14px;
    cursor: help;
    transition: opacity 0.15s ease;
}
.filter-info-icon:hover {
    opacity: 0.8;
}

.filter-info-icon-wrapper svg circle {
    transition: fill 0.2s ease;
}
.filter-info-icon-wrapper:hover svg circle {
    fill: var(--g700);
}

/* Info-Icon: immer sichtbar, dezent */
.filter-info-icon-wrapper {
    cursor: pointer;
    opacity: 0.4;
    transition: opacity 0.15s ease;
}
.filter-info-icon-wrapper:hover {
    opacity: 0.85;
}

.filter-info-icon-wrapper > * {
    pointer-events: none;
}

/* Modal Description Styling */
#comprehensiveFilterModal .modal-description {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #666;
    margin-top: 0.25rem;
}

/* Comprehensive Filter Modal (R1A: Shell nur CSS/Blade, kein search3-modal.js) */
#comprehensiveFilterModal .modal-content {
    border: 1px solid var(--g200) !important;
    border-radius: var(--r-lg) !important;
    overflow: hidden;
    box-shadow: var(--sh-lg) !important;
    padding: 0 !important;
}

/* Kopfzeile ruhiger und konsistent ueber alle Modals */
#comprehensiveFilterModal .modal-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding: 1rem 1.25rem !important;
    min-height: 4.5rem;
    margin: 0 !important;
    border-radius: var(--r-lg) var(--r-lg) 0 0;
    align-items: center;
}

#comprehensiveFilterModal .filter-modal-header-main {
    min-width: 0;
    align-items: flex-start !important;
}

#comprehensiveFilterModal .filter-modal-title-row {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    flex-wrap: wrap;
}

#comprehensiveFilterModal .filter-modal-header-icon {
    width: 1.375rem;
    min-width: 1.375rem;
    height: 1.375rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    flex-shrink: 0;
    margin-top: 0;
}

#comprehensiveFilterModal .filter-modal-header-glyph {
    display: block;
    font-size: 1.02rem;
    line-height: 1;
    color: var(--custom-primary, #191d93);
    opacity: 1;
    transform: none;
}

#comprehensiveFilterModal .filter-modal-header-copy {
    min-width: 0;
}

#comprehensiveFilterModal .modal-header .modal-title {
    color: #1e293b !important;
    font-weight: 600;
    font-size: 1.125rem;
    line-height: 1.3;
    margin-bottom: 0;
    min-width: 0;
}

#comprehensiveFilterModal .modal-header .modal-description {
    color: #4b5563 !important;
    font-size: 0.8rem;
    line-height: 1.4;
    margin-top: 0.15rem;
}

#comprehensiveFilterModal.modal-variant-branches .modal-header {
    padding: 0.875rem 1.25rem !important;
    min-height: auto;
}

#comprehensiveFilterModal.modal-variant-branches .modal-header .modal-title {
    font-size: 1rem;
    font-weight: 600;
}

/* Flaches X: modern.css (#f7f7f7) + globales Kreis-Icon + BS-Padding vollstaendig ueberschreiben */
#comprehensiveFilterModal .modal-header > .btn-close {
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    width: 2rem !important;
    height: 2rem !important;
    min-width: 2rem !important;
    min-height: 2rem !important;
    padding: 0 !important;
    margin: 0 0 0 auto !important;
    flex-shrink: 0;
    align-self: center;
    border: 0 !important;
    border-radius: 0.375rem;
    opacity: 0.6;
    filter: none !important;
    content: normal !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    text-indent: -9999px;
    overflow: hidden;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.15s ease, background-color 0.15s ease;
    background: transparent none center / 1rem 1rem no-repeat !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23191d93'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") !important;
}

#comprehensiveFilterModal .modal-header > .btn-close::before {
    content: none !important;
    display: none !important;
}

#comprehensiveFilterModal .modal-header > .btn-close::after {
    content: none !important;
    display: none !important;
}

#comprehensiveFilterModal .modal-header > .btn-close:hover {
    background-color: rgba(15, 23, 42, 0.04) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23111270'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 1rem 1rem !important;
    opacity: 1;
    transform: none;
    box-shadow: none;
}

#comprehensiveFilterModal .modal-header > .btn-close:focus-visible {
    opacity: 1;
    outline: 2px solid rgba(30, 41, 59, 0.18);
    outline-offset: 2px;
    box-shadow: none !important;
}

#comprehensiveFilterModal .modal-body {
    padding: 1rem 1.25rem !important;
    margin: 0 !important;
    background-color: #fff;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}
#comprehensiveFilterModal .modal-body .form-control {
    padding: 0.45rem 0.75rem;
    font-size: 0.875rem;
}

#comprehensiveFilterModal .modal-body .form-control:focus {
    border-color: var(--custom-primary-100, #c4c2e8);
    box-shadow: 0 0 0 0.2rem rgba(25, 29, 147, 0.12);
}

#comprehensiveFilterModal .modal-body #filterSearchInput.form-control {
    padding: 0.72rem 0.9rem;
    border: 1px solid #d0d5dd;
    background: #fff;
    border-radius: 10px;
    font-size: 0.875rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

#comprehensiveFilterModal .modal-body #filterSearchInput.form-control:focus {
    border-color: rgba(25, 29, 147, 0.24);
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.07);
}

#comprehensiveFilterModal .modal-body #filterSearchInput.form-control::placeholder {
    color: #9aa4b2;
    opacity: 1;
}

#comprehensiveFilterModal.modal-variant-branches .modal-body .filter-modal-search-wrap .form-control {
    padding: 0.72rem 0.9rem;
    border: 1px solid #d0d5dd;
    background: #fff;
    border-radius: 10px;
    font-size: 0.875rem;
}

#comprehensiveFilterModal.modal-variant-branches .modal-body .filter-modal-search-wrap .form-control:focus {
    border-color: var(--custom-primary, #191d93);
    box-shadow: 0 0 0 2px rgba(25, 29, 147, 0.08);
}

#comprehensiveFilterModal.modal-variant-data-dive .modal-body .filter-modal-search-wrap .form-control {
    padding: 0.72rem 0.9rem;
    border: 1px solid #d7dce5;
    background: #fff;
    border-radius: 10px;
    font-size: 0.875rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

#comprehensiveFilterModal.modal-variant-data-dive .modal-body .filter-modal-search-wrap .form-control:focus {
    border-color: rgba(25, 29, 147, 0.24);
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.07);
}

/* Hinweis unter Suche: dezente Hilfszeile (Branchen / Codes), optisch bündig zur Eingabe */
#comprehensiveFilterModal .filter-modal-search-hint {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    margin-bottom: 0;
    padding: 0.5rem 0.75rem;
    min-height: 2.25rem;
    box-sizing: border-box;
    background: var(--g50);
    border: 1px solid var(--g100);
    border-radius: 0.375rem;
    font-size: 0.8125rem;
    line-height: 1.4;
    color: var(--g600);
}
#comprehensiveFilterModal .filter-modal-search-hint .bi {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.125rem;
    height: 1.125rem;
    font-size: 1rem;
    line-height: 1;
    color: var(--g400);
    opacity: 0.95;
}
#comprehensiveFilterModal .filter-modal-search-hint span {
    flex: 1;
    min-width: 0;
    line-height: 1.4;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-search-hint {
    margin-top: 0.45rem;
    padding: 0.1rem 0.125rem 0;
    min-height: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    font-size: 0.78125rem;
    color: var(--g500);
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-search-hint .bi {
    color: var(--g400);
    width: 1rem;
    height: 1rem;
    font-size: 0.9rem;
}

/* Checkbox-Listen (Services, Mitarbeiter-/Umsatzklasse u.a.): gleicher Hover wie Suchlisten-Zeilen */
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check {
    padding: 0.45rem 0.5rem;
    margin-bottom: 0.125rem;
    border-radius: 0.375rem;
    border: 1px solid transparent;
    transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:last-child {
    margin-bottom: 0;
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:hover {
    background-color: var(--g100);
    border-color: var(--g200);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:hover .form-check-label {
    color: var(--custom-primary, #191d93);
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:has(.form-check-input:checked) {
    background-color: #f9fafb;
    border-color: var(--g200);
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:has(.form-check-input:checked) .form-check-label {
    color: #1e293b;
    font-weight: 600;
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:has(.form-check-input:checked):hover {
    background-color: #f1f5f9;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll .form-check:has(.form-check-input:checked):hover .form-check-label {
    color: #1e293b;
}

/* Kurze feste Listen: kompakter, kein Scroll-Zwang, alles auf einen Blick */
#comprehensiveFilterModal .filter-modal-checkbox-scroll--compact {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}
#comprehensiveFilterModal .filter-modal-checkbox-scroll--compact .form-check {
    padding: 0.2rem 0.4rem;
    margin-bottom: 0;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    gap: 0.9rem;
    width: 100%;
    margin-bottom: 0;
    padding: 0.8rem 0.95rem;
    background: #fbfcfd;
    border: 1px solid #e8edf3;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check:hover,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check:hover {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.16);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check:has(.form-check-input:checked),
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check:has(.form-check-input:checked) {
    background: rgba(25, 29, 147, 0.08);
    border-color: rgba(25, 29, 147, 0.18);
    box-shadow: inset 0 0 0 1px rgba(25, 29, 147, 0.04);
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check .form-check-input,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check .form-check-input {
    margin: 0;
    flex-shrink: 0;
    width: 1.05rem;
    height: 1.05rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check .form-check-label,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check .form-check-label {
    flex: 1;
    margin: 0;
    color: #1e293b;
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.35;
}

.filter-modal-dd-clickrow {
    cursor: pointer;
}

.filter-modal-dd-icon {
    font-size: 1rem;
    opacity: 0.45;
    flex-shrink: 0;
    color: #64748b;
}

.filter-modal-dd-clickrow:has(.form-check-input:checked) .filter-modal-dd-icon {
    opacity: 0.7;
    color: var(--custom-primary);
}

.dd-rev-range,
.dd-emp-range {
    font-size: 0.875rem;
    color: #334155;
    letter-spacing: 0.01em;
}

.dd-rev-range strong,
.dd-emp-range strong {
    font-weight: 700;
    color: #1e293b;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--compact {
    gap: 0.45rem;
}

#comprehensiveFilterModal .modal-body .mb-3 {
    margin-bottom: 0.75rem !important;
}

#comprehensiveFilterModal .modal-footer {
    background: #fff !important;
    border-top: 1px solid var(--g200) !important;
    padding: 0.75rem 1.25rem !important;
    border-radius: 0 0 var(--r-lg) var(--r-lg);
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

#comprehensiveFilterModal.modal-variant-branches .modal-footer {
    padding: 0.875rem 1.25rem !important;
}

#comprehensiveFilterModal .modal-footer .btn {
    padding: 0.5rem 1.5rem;
    font-weight: 600;
    border-radius: 8px;
    transition: var(--ease);
    font-size: 0.85rem;
    border: 2px solid transparent;
}

#comprehensiveFilterModal .modal-footer .btn-secondary {
    background-color: #fff;
    color: var(--g500);
    border-color: var(--g200);
}

#comprehensiveFilterModal .modal-footer .btn-secondary:hover {
    background-color: var(--g50);
    border-color: var(--g300);
    color: var(--g700);
    transform: translateY(-1px);
    box-shadow: var(--sh-md);
}

#comprehensiveFilterModal .modal-footer .btn-primary {
    background: var(--custom-primary, #191d93) !important;
    color: #fff;
    border: none;
    box-shadow: none;
}

#comprehensiveFilterModal .modal-footer .btn-primary:hover {
    background: var(--custom-primary-200, #111270) !important;
    transform: none;
    box-shadow: 0 1px 3px rgba(25, 29, 147, 0.2);
}

#comprehensiveFilterModal .modal-footer .btn-primary:active {
    transform: translateY(0);
    box-shadow: none;
}

#comprehensiveFilterModal .modal-footer .btn-primary.modal-apply-pulse {
    animation: modalApplyPulse 0.2s ease;
}

#comprehensiveFilterModal .modal-footer .btn-primary.modal-apply-confirming {
    background: var(--custom-primary-200, #111270) !important;
    box-shadow: 0 0 0 2px rgba(25, 29, 147, 0.1);
}

#comprehensiveFilterModal .modal-footer .btn:focus-visible {
    outline: 2px solid var(--custom-primary, #191d93);
    outline-offset: 2px;
}

@keyframes modalApplyPulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.035); }
    100% { transform: scale(1); }
}

#comprehensiveFilterModal .filter-modal-clear-all.text-danger {
    color: var(--g600) !important;
}

#comprehensiveFilterModal .filter-modal-clear-all.text-danger:hover {
    color: var(--g800) !important;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-clear-all.text-danger {
    color: #64748b !important;
    font-size: 0.8125rem !important;
    font-weight: 500;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-clear-all.text-danger:hover {
    color: #334155 !important;
}

#comprehensiveFilterModal .filter-modal-popular-section {
    background: #fff;
    border: 1px solid var(--g200);
    border-radius: 8px;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-popular-section--branches {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-top: 0.25rem;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-popular-section--branches .filter-modal-popular-label {
    margin-bottom: 0.4rem !important;
    color: #9ca3af !important;
    letter-spacing: 0.03em;
}

/* R1B: „Häufig gesucht“ aktiv wie Listenzeile (hell + Rand), nicht Vollfläche Primär */
#comprehensiveFilterModal .filter-modal-popular-chip.filter-modal-popular-chip-active {
    background: rgba(25, 29, 147, 0.08) !important;
    color: #1e293b !important;
    border-color: var(--custom-primary, #191d93) !important;
    font-weight: 600;
}
#comprehensiveFilterModal .filter-modal-popular-chip.filter-modal-popular-chip-active:hover {
    background: rgba(25, 29, 147, 0.12) !important;
    color: #0f172a !important;
    border-color: var(--custom-primary-200, #111270) !important;
}

/* Untertitel nur im Modal-Titel (Header); im Body nicht verwendet */
#comprehensiveFilterModal .filter-modal-title-row .filter-modal-subtitle {
    font-size: 0.8125rem;
    color: #4b5563 !important;
    font-weight: 400;
    line-height: 1.3;
    white-space: nowrap;
}

/* R1B: Suchlisten-Zeilen (ohne .sl-option: Rechtsform nutzt .sl-option eigene Abmessungen) */
#comprehensiveFilterModal .filter-option-item {
    position: relative;
    list-style: none;
    cursor: pointer;
}

#comprehensiveFilterModal .filter-option-item:not(.sl-option) {
    padding: 0.5rem 0.625rem !important;
    font-size: 0.85rem;
    border-radius: 0.375rem;
    border: 1px solid transparent;
    transition: background-color 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease, color 0.12s ease;
}

/* Deutlicher Hover: wirkt klickbar, ohne neue UI-Elemente */
#comprehensiveFilterModal .filter-option-item:not(.sl-option):not(.filter-option-item-selected):hover {
    background-color: var(--g100);
    border-color: var(--g200);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

#comprehensiveFilterModal .filter-option-item:not(.sl-option):not(.filter-option-item-selected):hover .filter-option-item-label {
    color: var(--custom-primary, #191d93);
}

#comprehensiveFilterModal .filter-option-item-selected:not(.sl-option) {
    background-color: #f9fafb !important;
    border-color: var(--g200);
}

#comprehensiveFilterModal .filter-option-item-selected:not(.sl-option):hover {
    background-color: #f1f5f9 !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

#comprehensiveFilterModal .filter-option-item .filter-option-item-label {
    color: var(--g800);
    font-weight: 400;
}

#comprehensiveFilterModal .filter-option-item-selected .filter-option-item-label {
    color: #1e293b;
    font-weight: 600;
}

#comprehensiveFilterModal .filter-option-item-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: 0.5rem;
    color: var(--custom-primary, #191d93);
    width: 1rem;
    height: 1rem;
    opacity: 0.96;
}

#comprehensiveFilterModal .filter-option-item-check svg {
    width: 16px;
    height: 16px;
}

#comprehensiveFilterModal .filter-option-item::before {
    display: none;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-list-scroll--branches {
    background: #fff;
    border-radius: 10px;
}

#comprehensiveFilterModal.modal-variant-branches .filter-option-item:not(.sl-option) {
    padding: 0.7rem 0.85rem !important;
    border-radius: 8px;
    background: #fbfcfd;
    border: 1px solid #edf2f7;
    margin-bottom: 0.28rem;
    justify-content: flex-start !important;
    transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

#comprehensiveFilterModal.modal-variant-branches .filter-option-item:not(.sl-option) + .filter-option-item:not(.sl-option) {
    margin-top: 0.25rem;
}

#comprehensiveFilterModal.modal-variant-branches .filter-option-item:not(.sl-option):not(.filter-option-item-selected):hover {
    background-color: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.16);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#comprehensiveFilterModal.modal-variant-branches .filter-option-item:not(.sl-option):active {
    transform: none;
}

#comprehensiveFilterModal.modal-variant-branches .filter-option-item-selected:not(.sl-option) {
    background-color: rgba(25, 29, 147, 0.08) !important;
    border-color: rgba(25, 29, 147, 0.18);
    box-shadow: inset 0 0 0 1px rgba(25, 29, 147, 0.04);
}

#comprehensiveFilterModal.modal-variant-branches .branch-option-row {
    gap: 0.72rem;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row {
    display: flex;
    align-items: center;
    gap: 0.72rem;
    padding: 0.8rem 0.95rem !important;
    border-radius: 10px;
    border: 1px solid #e8edf3;
    background: #fbfcfd;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row:hover {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.16);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row.sl-option-active {
    background: #f9fafb !important;
    border-color: var(--g200);
    box-shadow: none;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row.sl-option-active:hover {
    background: #f1f5f9 !important;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .sl-option-label {
    color: #1e293b;
    font-weight: 500;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row.sl-option-active .sl-option-label {
    color: #1e293b !important;
    font-weight: 600;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .searchable-checkbox-row__content {
    min-width: 0;
    flex: 1;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .searchable-checkbox-row__content .small {
    margin-top: 0.12rem;
    line-height: 1.3;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .branch-list-checkbox {
    position: static;
    transform: none;
    flex-shrink: 0;
    width: 0.98rem;
    height: 0.98rem;
    margin: 0;
    border-radius: 0.24rem;
    border-width: 1.5px;
    border-color: #64748b;
    background: #fff;
    pointer-events: auto;
    cursor: pointer;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .branch-list-checkbox svg {
    width: 10px;
    height: 10px;
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row .branch-list-checkbox.sl-checkbox-checked {
    background: var(--custom-primary, #191d93);
    border-color: var(--custom-primary, #191d93);
}

#comprehensiveFilterModal.modal-variant-branches .searchable-checkbox-row:hover .branch-list-checkbox:not(.sl-checkbox-checked) {
    border-color: rgba(25, 29, 147, 0.34);
}

/* Rechtsform / Ansprechpartner: sl-option aktiv gleiche Sprache wie filter-option-item */
#comprehensiveFilterModal .sl-option.sl-option-active {
    background-color: #f9fafb !important;
    border: 1px solid var(--g200);
    box-shadow: none;
}
#comprehensiveFilterModal .sl-option.sl-option-active:hover {
    background-color: #f1f5f9 !important;
}
#comprehensiveFilterModal .sl-option.sl-option-active .sl-option-label {
    color: #1e293b !important;
    font-weight: 600;
}

.filter-modal-subtitle {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--g400);
    margin-left: 0.5rem;
}

/* Popular branch quick-select chips */
.filter-modal-popular-section {
    padding: 0.5rem 0.625rem;
    background: var(--g50);
    border-radius: 6px;
    border: 1px solid var(--g100);
}
.filter-modal-popular-label {
    color: var(--g500) !important;
    font-size: 0.7rem !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.filter-modal-popular-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    border-radius: 2rem;
    border: 1px solid var(--g200);
    background: #fff;
    color: var(--g700);
    cursor: pointer;
    transition: all 0.15s ease;
    font-weight: 500;
}
.filter-modal-popular-chip:hover {
    border-color: var(--custom-primary-100);
    background: var(--custom-primary-glow);
    color: var(--custom-primary);
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-popular-chip {
    padding: 0.34rem 0.68rem;
    font-size: 0.78125rem;
    border-color: #dbe2ea;
    background: #fff;
    color: #475569;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-popular-chip:hover {
    border-color: rgba(25, 29, 147, 0.22);
    background: rgba(25, 29, 147, 0.04);
    color: #191d93;
}
.filter-modal-popular-chip-active {
    background: var(--custom-primary) !important;
    color: #fff !important;
    border-color: var(--custom-primary) !important;
}
.filter-modal-popular-chip-active:hover {
    background: var(--custom-primary-200) !important;
    border-color: var(--custom-primary-200) !important;
}

/* Quick-select category buttons (Tech / CMS / Legal-Form modals) */
.tech-quick-btn,
.cms-quick-btn,
.legal-form-quick-btn {
    padding: 0.25rem 0.6rem !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    background: rgba(25, 29, 147, 0.04) !important;
    border: 1px solid rgba(25, 29, 147, 0.14) !important;
    color: var(--custom-primary) !important;
    border-radius: 2rem;
}
button.tech-quick-btn > .bi,
button.cms-quick-btn > .bi,
button.legal-form-quick-btn > .bi {
    font-size: 0.75rem !important;
    margin-right: 0.25rem !important;
    opacity: 0.5;
    flex-shrink: 0;
}
.tech-quick-btn:hover,
.cms-quick-btn:hover,
.legal-form-quick-btn:hover {
    background: rgba(25, 29, 147, 0.08) !important;
    border-color: rgba(25, 29, 147, 0.25) !important;
    color: #191d93 !important;
}
.tech-quick-btn:hover > .bi,
.cms-quick-btn:hover > .bi,
.legal-form-quick-btn:hover > .bi {
    opacity: 0.8;
}
.tech-quick-btn.filter-modal-popular-chip-active,
.cms-quick-btn.filter-modal-popular-chip-active,
.legal-form-quick-btn.filter-modal-popular-chip-active {
    background: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #fff !important;
}
.tech-quick-btn.filter-modal-popular-chip-active > .bi,
.cms-quick-btn.filter-modal-popular-chip-active > .bi,
.legal-form-quick-btn.filter-modal-popular-chip-active > .bi {
    opacity: 1;
}
.tech-quick-btn.filter-modal-popular-chip-active:hover,
.cms-quick-btn.filter-modal-popular-chip-active:hover,
.legal-form-quick-btn.filter-modal-popular-chip-active:hover {
    background: var(--custom-primary-200) !important;
    border-color: var(--custom-primary-200) !important;
}

/* Legal-form categories */
.lf-category {
    margin-bottom: 0.5rem;
}
.lf-category:last-child {
    margin-bottom: 0;
}
.lf-category-label {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--g400);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.5rem 0.625rem 0.25rem;
}
.lf-category:first-child .lf-category-label {
    padding-top: 0.25rem;
}

/* Searchable-list: option items with checkbox for contact-person and legal-form */
.sl-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    border-radius: 0.375rem;
    cursor: pointer;
    transition: background-color 0.12s;
    user-select: none;
}
.sl-option:hover {
    background-color: var(--g50);
}
.sl-option-active {
    background-color: var(--custom-primary-glow) !important;
}
.sl-option-active:hover {
    background-color: rgba(25,29,147,0.12) !important;
}
.sl-option-active .sl-option-label {
    color: var(--custom-primary);
    font-weight: 600;
}
.sl-checkbox {
    flex-shrink: 0;
    width: 1.125rem;
    height: 1.125rem;
    border: 1.5px solid var(--g300);
    border-radius: 0.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.12s;
    background: #fff;
}
.sl-option:hover .sl-checkbox:not(.sl-checkbox-checked) {
    border-color: var(--custom-primary-100);
}
.sl-checkbox-checked {
    background: var(--custom-primary);
    border-color: var(--custom-primary);
}
.sl-option-content {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    min-width: 0;
    flex: 1;
}
.sl-option-label {
    font-size: 0.875rem;
    color: var(--g700);
    line-height: 1.3;
}

/* Checkbox lists in modal: no bullets, keep list visually clean */
#comprehensiveFilterModal [style*="max-height"][style*="overflow-y"] .form-check {
    position: relative;
}

#comprehensiveFilterModal [style*="max-height"][style*="overflow-y"] .form-check::before {
    display: none;
}

#comprehensiveFilterModal .form-check-input {
    margin-left: 0;
    margin-right: 10px;
    position: relative;
    z-index: 2;
}

/* Remove bullets from inline checkboxes (WZ-Codes, NACE-Codes) and control elements */
#comprehensiveFilterModal .form-check-inline::before,
#comprehensiveFilterModal .form-check.no-bullet::before,
#comprehensiveFilterModal .form-check:has(.branch-code-type-checkbox)::before {
    display: none !important;
}

#comprehensiveFilterModal .filter-option-item-selected::before {
    display: none;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.8rem 0.95rem;
    border-radius: 10px;
    border: 1px solid #e8edf3;
    background: #fbfcfd;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
    transition: background-color 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option:hover {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.16);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option.sl-option-active {
    background: rgba(25, 29, 147, 0.08) !important;
    border-color: rgba(25, 29, 147, 0.18);
    box-shadow: inset 0 0 0 1px rgba(25, 29, 147, 0.04);
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option-label {
    color: #1e293b;
    font-size: 0.875rem;
    font-weight: 500;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option-active .sl-option-label {
    color: #1e293b !important;
    font-weight: 600;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-checkbox {
    width: 1.05rem;
    height: 1.05rem;
    border-radius: 0.3rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-checkbox svg {
    width: 11px;
    height: 11px;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-option,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-dd-check,
#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-checkbox-scroll--data-dive .form-check {
    min-height: 2.85rem;
}

/* Contact-person modal: recommended filter section */
.sl-recommended-section {
    margin-bottom: 0.5rem;
    background: rgba(25, 29, 147, 0.03);
    border: 1px solid rgba(25, 29, 147, 0.08);
    border-radius: 10px;
    padding: 0.5rem 0.375rem 0.5rem;
}
.sl-recommended-section .sl-option {
    border-radius: 8px;
}
.sl-recommended-badge {
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.08);
    border: 1px solid rgba(25, 29, 147, 0.12);
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
}
.sl-recommended-hint {
    font-size: 0.7rem;
    color: var(--g500);
    padding: 0.25rem 0.5rem 0;
    margin-top: 0;
    margin-bottom: 0;
}
.sl-section-divider {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--g400);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.625rem 0.625rem 0.375rem;
    margin-top: 0.25rem;
    border-top: 1px solid var(--g100);
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-recommended-section {
    margin-bottom: 0.75rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-recommended-badge {
    color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.08);
    border: 1px solid rgba(25, 29, 147, 0.12);
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-recommended-hint {
    color: #64748b;
}

#comprehensiveFilterModal.modal-variant-data-dive .sl-section-divider,
#comprehensiveFilterModal.modal-variant-data-dive .lf-category-label {
    color: #94a3b8;
    letter-spacing: 0.04em;
}

/* In-modal selected chips: always visible above scrollable list; removable */
#comprehensiveFilterModal .filter-modal-selected-chips-wrap {
    flex-shrink: 0;
    background: rgba(25,29,147,0.03);
    border: 1px solid var(--ci-regional-border);
    border-radius: 6px;
    padding: 0.4rem 0.625rem;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-selected-chips-wrap--branches {
    background: rgba(25, 29, 147, 0.04);
    border: 1px solid rgba(25, 29, 147, 0.09);
    border-radius: 10px;
    padding: 0.625rem 0.7rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-selected-chips-wrap--data-dive {
    background: rgba(209, 21, 89, 0.035);
    border: 1px solid rgba(209, 21, 89, 0.1);
    border-radius: 10px;
    padding: 0.6rem 0.7rem;
}

#comprehensiveFilterModal .filter-modal-selected-chips-label {
    color: var(--custom-primary);
    font-weight: 600 !important;
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-selected-chips-label {
    font-size: 0.75rem;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-selected-chips-label {
    font-size: 0.75rem;
    color: #475569 !important;
}

#comprehensiveFilterModal.modal-variant-data-dive .filter-modal-chip {
    padding: 0.32rem 0.55rem;
    font-size: 0.8125rem;
    border-radius: 8px !important;
    background: rgba(209, 21, 89, 0.06);
    border: 1px solid rgba(209, 21, 89, 0.14);
}

#comprehensiveFilterModal .filter-modal-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.45rem;
    font-size: 0.75rem;
    font-weight: 500;
    background: var(--custom-primary-glow);
    color: var(--custom-primary);
    border: 1px solid var(--ci-regional-border);
}

#comprehensiveFilterModal.modal-variant-branches .filter-modal-chip {
    padding: 0.32rem 0.55rem;
    font-size: 0.8125rem;
    border-radius: 8px !important;
    background: rgba(25, 29, 147, 0.08);
    border: 1px solid rgba(25, 29, 147, 0.14);
    animation: branchModalChipIn 0.18s ease both;
}

@keyframes branchModalSelectFlash {
    0% {
        background-color: rgba(25, 29, 147, 0.13);
    }
    100% {
        background-color: rgba(25, 29, 147, 0.08);
    }
}

@keyframes branchModalChipIn {
    0% {
        opacity: 0;
        transform: translateY(4px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

#comprehensiveFilterModal .filter-modal-chip .filter-modal-chip-text {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#comprehensiveFilterModal .filter-modal-chip-remove {
    padding: 0;
    width: 1rem;
    height: 1rem;
    font-size: 0.65rem;
    opacity: 0.8;
    background-size: 0.65rem;
    flex-shrink: 0;
}

#comprehensiveFilterModal .filter-modal-chip-remove:hover {
    opacity: 1;
}

/* Web Keywords: Smart Keyword Discovery */
.wk-discovery {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.wk-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.wk-input-wrap .wk-input-icon {
    position: absolute;
    left: 14px;
    color: var(--g500);
    font-size: 15px;
    pointer-events: none;
    transition: color 0.2s ease;
    z-index: 2;
}

.wk-input-wrap:focus-within .wk-input-icon {
    color: var(--custom-primary);
}

.wk-input-wrap .wk-input {
    width: 100%;
    padding: 0.75rem 0.9rem 0.75rem 2.5rem;
    font-size: 0.9375rem;
    border: 1.5px solid var(--g200);
    border-radius: 10px;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
}

.wk-input-wrap .wk-input::placeholder {
    color: var(--g500);
    font-size: 0.875rem;
}

.wk-input-wrap .wk-input:focus {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.08);
}

.wk-input-wrap .wk-add-btn {
    position: absolute;
    right: 6px;
    padding: 0.4rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: 7px;
    border: none;
    background: var(--custom-primary);
    color: #fff;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.1s ease;
    z-index: 2;
}

.wk-input-wrap .wk-add-btn:hover {
    background: var(--custom-primary-light);
}

.wk-input-wrap .wk-add-btn:active {
    transform: scale(0.96);
}

.wk-hint {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #047857;
    background: linear-gradient(135deg, rgba(8, 194, 127, 0.08), rgba(8, 194, 127, 0.03));
    border: 1px solid rgba(8, 194, 127, 0.18);
    border-radius: 8px;
    padding: 8px 12px;
}

.wk-hint i {
    font-size: 13px;
    opacity: 0.85;
}

.wk-hint::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #10b981;
    flex-shrink: 0;
    animation: wkPulse 2s ease-in-out infinite;
    box-shadow: 0 0 4px rgba(16, 185, 129, 0.5);
}

@keyframes wkPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.85); }
}

.wk-chips-area {
    margin-top: 16px;
}

.wk-chips-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.wk-chips-count {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-primary);
    display: flex;
    align-items: center;
    gap: 5px;
}

.wk-chips-count i {
    font-size: 13px;
}

.wk-chips-clear {
    font-size: 0.7rem;
    color: var(--custom-font-light);
    cursor: pointer;
    border: none;
    background: none;
    padding: 2px 6px;
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
}

.wk-chips-clear:hover {
    color: var(--custom-font);
    background: var(--g50);
}

.wk-chips-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-height: 140px;
    overflow-y: auto;
    padding: 2px 0;
}

.wk-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px 5px 8px;
    background: rgba(25, 29, 147, 0.06);
    border: 1px solid rgba(25, 29, 147, 0.12);
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--custom-font);
    animation: wkChipIn 0.2s ease;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.wk-chip:hover {
    background: rgba(25, 29, 147, 0.1);
    border-color: rgba(25, 29, 147, 0.2);
}

.wk-chip i.bi-tag {
    font-size: 11px;
    color: var(--custom-primary);
    opacity: 0.7;
}

.wk-chip-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: none;
    background: transparent;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    color: var(--custom-font-light);
    font-size: 14px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.wk-chip-remove:hover {
    background: rgba(25, 29, 147, 0.12);
    color: var(--custom-font);
}

@keyframes wkChipIn {
    from {
        opacity: 0;
        transform: scale(0.85) translateY(4px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.wk-divider {
    height: 1px;
    background: var(--g200);
    margin: 16px 0;
    opacity: 0.6;
}

.wk-suggestions {
    margin-top: 16px;
}

.wk-suggestions-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-font-light);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 10px;
}

.wk-suggestions-title i {
    font-size: 13px;
    opacity: 0.7;
}

.wk-suggestion-group {
    margin-bottom: 12px;
}

.wk-suggestion-group:last-child {
    margin-bottom: 0;
}

.wk-suggestion-group-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--custom-font-lighter);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

.wk-suggestion-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.wk-suggestion-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--custom-font-50);
    background: var(--g50);
    border: 1px solid var(--g200);
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.wk-suggestion-tag:hover {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.15);
    color: var(--custom-primary);
}

.wk-suggestion-tag:active {
    transform: scale(0.95);
}

.wk-suggestion-tag.wk-suggestion-tag--added {
    background: var(--g100, #f1f5f9);
    border-color: var(--g300, #cbd5e1);
    color: var(--g500, #64748b);
    pointer-events: none;
    opacity: 0.7;
}

.wk-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px 16px;
    color: var(--custom-font-light);
}

.wk-empty-state-icon {
    font-size: 28px;
    color: var(--g500);
    margin-bottom: 8px;
    opacity: 0.5;
}

.wk-empty-state-text {
    font-size: 0.8125rem;
    line-height: 1.5;
    max-width: 280px;
}

.wk-empty-state-text strong {
    color: var(--custom-font);
    font-weight: 600;
}

.wk-more-toggle {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 4px;
    padding: 6px 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-primary);
    background: none;
    border: none;
    cursor: pointer;
    transition: opacity 0.15s ease;
}

.wk-more-toggle:hover {
    opacity: 0.75;
}

.wk-more-toggle i {
    font-size: 13px;
}

/* Visible Web Shared: Modern filter cards */
.vw-filter {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.vw-search-wrap {
    position: relative;
    margin-bottom: 12px;
}

.vw-search-wrap .vw-search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--g500);
    font-size: 15px;
    pointer-events: none;
    transition: color 0.2s ease;
    z-index: 2;
}

.vw-search-wrap:focus-within .vw-search-icon {
    color: var(--custom-primary);
}

.vw-search-wrap .vw-search-input {
    width: 100%;
    padding: 0.7rem 0.9rem 0.7rem 2.5rem;
    font-size: 0.9375rem;
    border: 1.5px solid var(--g200);
    border-radius: 10px;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
}

.vw-search-wrap .vw-search-input::placeholder {
    color: var(--g500);
    font-size: 0.875rem;
}

.vw-search-wrap .vw-search-input:focus {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.08);
}

.vw-chips-area {
    margin-bottom: 12px;
}

.vw-chips-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.vw-chips-count {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-primary);
    display: flex;
    align-items: center;
    gap: 5px;
}

.vw-chips-count i {
    font-size: 13px;
}

.vw-chips-clear {
    font-size: 0.7rem;
    color: var(--custom-font-light);
    cursor: pointer;
    border: none;
    background: none;
    padding: 2px 6px;
    border-radius: 4px;
    transition: color 0.15s ease, background 0.15s ease;
}

.vw-chips-clear:hover {
    color: var(--custom-font);
    background: var(--g50);
}

.vw-chips-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-height: 100px;
    overflow-y: auto;
    padding: 2px 0;
}

.vw-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px 5px 8px;
    background: rgba(25, 29, 147, 0.06);
    border: 1px solid rgba(25, 29, 147, 0.12);
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--custom-font);
    animation: wkChipIn 0.2s ease;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.vw-chip:hover {
    background: rgba(25, 29, 147, 0.1);
    border-color: rgba(25, 29, 147, 0.2);
}

.vw-chip i {
    font-size: 11px;
    color: var(--custom-primary);
    opacity: 0.7;
}

.vw-chip-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border: none;
    background: transparent;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    color: var(--custom-font-light);
    font-size: 14px;
    line-height: 1;
    transition: background 0.15s ease, color 0.15s ease;
}

.vw-chip-remove:hover {
    background: rgba(25, 29, 147, 0.12);
    color: var(--custom-font);
}

.vw-divider {
    height: 1px;
    background: var(--g200);
    margin: 12px 0;
    opacity: 0.6;
}

.vw-section-title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-font-light);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 10px;
}

.vw-section-title i {
    font-size: 13px;
    opacity: 0.7;
}

/* Visible Web: Category groups */
.vw-category {
    margin-bottom: 10px;
}

.vw-category:last-child {
    margin-bottom: 0;
}

.vw-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    cursor: pointer;
    border: none;
    background: none;
    width: 100%;
    text-align: left;
}

.vw-category-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--custom-font-lighter);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.vw-category-hint {
    width: 100%;
    font-size: 0.7rem;
    font-weight: 400;
    color: var(--g400, #9ca3af);
    text-transform: none;
    letter-spacing: 0;
}

.vw-category-count {
    font-size: 0.6875rem;
    color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.08);
    padding: 1px 7px;
    border-radius: 10px;
    font-weight: 600;
    opacity: 0.65;
}

.vw-category-chevron {
    font-size: 10px;
    color: var(--g500);
    transition: transform 0.2s ease;
}

.vw-category-header[aria-expanded="false"] .vw-category-chevron {
    transform: rotate(-90deg);
}

.vw-category-body {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 2px 0 6px;
}

.vw-category-header[aria-expanded="false"] + .vw-category-body {
    display: none;
}

/* Visible Web: Option items (clickable tags) */
.vw-option {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--custom-font-50);
    background: var(--g50);
    border: 1px solid var(--g200);
    border-radius: 7px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.vw-option:hover {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.15);
    color: var(--custom-primary);
}

.vw-option:active {
    transform: scale(0.96);
}

.vw-option.vw-option--selected {
    background: var(--g100, #f1f5f9);
    border-color: var(--g300, #cbd5e1);
    color: var(--g500, #64748b);
    font-weight: 500;
    opacity: 0.7;
}

.vw-option.vw-option--selected .vw-option-check {
    display: inline-flex;
    color: var(--custom-primary);
    opacity: 1;
}

.vw-option.vw-option--selected:hover {
    opacity: 0.9;
    background: var(--g100, #f1f5f9);
    border-color: var(--g400, #94a3b8);
}

.vw-option-check {
    display: none;
    font-size: 11px;
}

/* Section color on chips area: Visible Web (green) */
.vw-filter--visibleweb .vw-chip {
    background: rgba(8, 194, 127, 0.07);
    border-color: rgba(8, 194, 127, 0.16);
}
.vw-filter--visibleweb .vw-chip:hover {
    background: rgba(8, 194, 127, 0.12);
    border-color: rgba(8, 194, 127, 0.24);
}
.vw-filter--visibleweb .vw-chip i {
    color: var(--ci-visibleweb);
}
.vw-filter--visibleweb .vw-chips-count i {
    color: var(--ci-visibleweb);
}

/* Section color on chips area: Data Dive (pink) */
.vw-filter--datadive .vw-chip {
    background: rgba(209, 21, 89, 0.06);
    border-color: rgba(209, 21, 89, 0.14);
}
.vw-filter--datadive .vw-chip:hover {
    background: rgba(209, 21, 89, 0.1);
    border-color: rgba(209, 21, 89, 0.22);
}
.vw-filter--datadive .vw-chip i {
    color: var(--ci-datadive);
}
.vw-filter--datadive .vw-chips-count i {
    color: var(--ci-datadive);
}

/* Section color on chips area: Services (blue, consistent with other modals) */
.vw-filter--services .vw-chip {
    background: rgba(25, 29, 147, 0.06);
    border-color: rgba(25, 29, 147, 0.14);
}
.vw-filter--services .vw-chip:hover {
    background: rgba(25, 29, 147, 0.1);
    border-color: rgba(25, 29, 147, 0.22);
}
.vw-filter--services .vw-chip i {
    color: var(--custom-primary);
}
.vw-filter--services .vw-chips-count i {
    color: var(--custom-primary);
}

/* Section color on chips area: Web Keywords (Visible Web green) */
.wk-discovery--visibleweb .wk-chip {
    background: rgba(8, 194, 127, 0.07);
    border-color: rgba(8, 194, 127, 0.16);
}
.wk-discovery--visibleweb .wk-chip:hover {
    background: rgba(8, 194, 127, 0.12);
    border-color: rgba(8, 194, 127, 0.24);
}
.wk-discovery--visibleweb .wk-chip i {
    color: var(--ci-visibleweb);
}
.wk-discovery--visibleweb .wk-chips-count i {
    color: var(--ci-visibleweb);
}

.vw-options-scroll {
    max-height: 280px;
    overflow-y: auto;
    padding-right: 4px;
}

/* Visible Web: Show-all toggle (inline variant sits among quick-select chips) */
.vw-show-all-toggle--inline {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.6rem !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    background: none !important;
    border: 1px dashed var(--g300) !important;
    color: var(--g500) !important;
    border-radius: 2rem;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}
.vw-show-all-toggle--inline:hover {
    background: var(--g50) !important;
    border-color: rgba(25, 29, 147, 0.3) !important;
    color: var(--custom-primary) !important;
}
.vw-show-all-toggle--inline .bi {
    font-size: 0.7rem;
}

/* Visible Web: Insight cards */
.vw-insight-card {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    background: var(--g50);
    border: 1.5px solid var(--g200);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.vw-insight-card:hover {
    border-color: rgba(25, 29, 147, 0.3);
    background: rgba(25, 29, 147, 0.06);
    box-shadow: 0 2px 8px rgba(25, 29, 147, 0.08);
}

.vw-insight-card.vw-insight-card--selected {
    border-color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.05);
}

.vw-insight-checkbox {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border: 2px solid var(--g200);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 1px;
    transition: all 0.15s ease;
}

.vw-insight-card--selected .vw-insight-checkbox {
    background: var(--custom-primary);
    border-color: var(--custom-primary);
}

.vw-insight-checkbox svg {
    display: none;
}

.vw-insight-card--selected .vw-insight-checkbox svg {
    display: block;
}

.vw-insight-content {
    flex: 1;
    min-width: 0;
}

.vw-insight-label {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--custom-font);
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 8px;
}

.vw-insight-desc {
    font-size: 0.75rem;
    color: var(--custom-font-light);
    line-height: 1.4;
    margin-top: 2px;
}

.vw-insight-badge {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 6px;
    border-radius: 4px;
    background: rgba(25, 29, 147, 0.08);
    color: var(--custom-primary);
}

.vw-insights-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Visible Web: Star rating */
.vw-rating-wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.vw-stars {
    display: flex;
    gap: 6px;
}

.vw-star {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 2px solid var(--g200);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
    font-size: 20px;
    color: var(--g500);
    background: #fff;
}

.vw-star:hover,
.vw-star.vw-star--hover {
    border-color: #f59e0b;
    background: #fffbeb;
    color: #f59e0b;
}

.vw-star.vw-star--active {
    border-color: #f59e0b;
    background: #fef3c7;
    color: #f59e0b;
}

.vw-star-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-font);
    text-align: center;
    margin-top: 2px;
}

.vw-conditions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.vw-condition {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: var(--g50);
    border: 1.5px solid var(--g200);
    border-radius: 9px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.vw-condition:hover {
    border-color: rgba(25, 29, 147, 0.2);
    background: rgba(25, 29, 147, 0.03);
}

.vw-condition.vw-condition--selected {
    border-color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.05);
}

.vw-condition.vw-condition--disabled {
    opacity: 0.4;
    pointer-events: none;
}

.vw-condition-radio {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    border: 2px solid var(--g200);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.vw-condition--selected .vw-condition-radio {
    border-color: var(--custom-primary);
}

.vw-condition--selected .vw-condition-radio::after {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--custom-primary);
}

.vw-condition-label {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--custom-font);
}

.vw-condition-symbol {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-font-light);
    margin-left: auto;
    font-family: monospace;
}

.vw-reviews-count-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.vw-reviews-count-input {
    width: 140px;
    padding: 8px 12px;
    border: 2px solid var(--g200);
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--custom-font);
    background: #fff;
    transition: border-color 0.15s ease;
    outline: none;
}

.vw-reviews-count-input:focus {
    border-color: var(--ci-blue);
}

.vw-reviews-count-input::placeholder {
    color: var(--g400);
    font-weight: 400;
}

.vw-reviews-count-hint {
    font-size: 0.6875rem;
    color: var(--g500);
    line-height: 1.3;
}

/* Company name modal */
.cn-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--custom-font-light);
    background: rgba(25, 29, 147, 0.04);
    border: 1px solid rgba(25, 29, 147, 0.08);
    border-radius: 6px;
    padding: 6px 10px;
}

.cn-hint i {
    font-size: 13px;
    opacity: 0.6;
}

.cn-suggestions-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.cn-suggestion-tag {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border: 1.5px solid var(--g200);
    border-radius: 20px;
    background: var(--g50);
    color: var(--custom-font);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
}

.cn-suggestion-tag:hover {
    border-color: rgba(25, 29, 147, 0.25);
    background: rgba(25, 29, 147, 0.04);
    color: var(--custom-primary);
}

.cn-suggestion-tag--added {
    background: var(--g100, #f1f5f9);
    border-color: var(--g300, #cbd5e1);
    color: var(--g500, #64748b);
    pointer-events: none;
    opacity: 0.7;
}

.cn-usecase-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--custom-font-light);
    opacity: 0.8;
}

.cn-usecase-hint i {
    font-size: 12px;
}

/* Branch code search */
.bc-search-wrap {
    margin-bottom: 16px;
}

.bc-search-input-row {
    position: relative;
    display: flex;
    align-items: center;
}

.bc-search-icon {
    position: absolute;
    left: 14px;
    color: var(--g400, #94a3b8);
    font-size: 14px;
    pointer-events: none;
    z-index: 2;
    transition: color 0.2s ease;
}

.bc-search-input-row:focus-within .bc-search-icon {
    color: var(--custom-primary);
}

.bc-search-input {
    width: 100%;
    padding: 0.7rem 0.9rem 0.7rem 2.4rem;
    font-size: 0.9rem;
    border: 1.5px solid var(--g200, #e2e8f0);
    border-radius: 10px;
    background: #fff;
    color: var(--custom-font);
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bc-search-input::placeholder {
    color: var(--g400, #94a3b8);
    font-size: 0.85rem;
}

.bc-search-input:focus {
    border-color: var(--custom-primary);
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.08);
}

.bc-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 8px 12px;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--g600, #475569);
    background: var(--g50, #f8fafc);
    border: 1px solid var(--g200, #e2e8f0);
    border-radius: 8px;
}

.bc-hint i {
    font-size: 13px;
    color: var(--g500, #64748b);
    flex-shrink: 0;
}

/* Founding date jubilee quick-select */
.fd-jubilee-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 4px 0 2px;
}

.fd-jubilee-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1.5px solid var(--g200);
    border-radius: 9px;
    background: var(--g50);
    color: var(--custom-font);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.fd-jubilee-btn i {
    font-size: 0.875rem;
    opacity: 0.6;
}

.fd-jubilee-btn:hover {
    border-color: rgba(25, 29, 147, 0.25);
    background: rgba(25, 29, 147, 0.04);
}

.fd-jubilee-btn--active {
    border-color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.07);
    color: var(--custom-primary);
}

.fd-jubilee-btn--active i {
    opacity: 1;
}

.fd-jubilee-year {
    font-size: 0.6875rem;
    font-weight: 400;
    opacity: 0.6;
    margin-left: 2px;
}

.fd-jubilee-btn--active .fd-jubilee-year {
    opacity: 0.8;
}

/* Founding date year input (card-style, matching rating modal) */
.vw-founding-year-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 0 4px;
}

.vw-founding-year-input {
    width: 160px;
    padding: 12px 16px;
    border: 2px solid rgba(25, 29, 147, 0.25);
    border-radius: 10px;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.03);
    text-align: center;
    letter-spacing: 0.08em;
    transition: border-color 0.15s ease, background 0.15s ease;
    outline: none;
}

.vw-founding-year-input:focus {
    border-color: var(--custom-primary);
    background: rgba(25, 29, 147, 0.05);
}

.vw-founding-year-input::placeholder {
    color: var(--g400);
    font-weight: 400;
    font-size: 0.875rem;
    letter-spacing: normal;
}

.vw-founding-year-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-primary);
    text-align: center;
}

/* Reset confirmation message (subtle, no alert) */
.filter-reset-message {
    font-size: 0.8125rem;
    color: #059669;
    transition: opacity 0.2s ease;
}

/* Branch code type toggler (WZ / NACE – one at a time) */
#comprehensiveFilterModal .branch-code-type-toggler {
    border: 1px solid var(--g200);
    box-shadow: var(--sh);
}

#comprehensiveFilterModal .branch-code-type-option {
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

#comprehensiveFilterModal .branch-code-type-option.branch-code-type-active {
    background: rgba(25, 29, 147, 0.08);
    color: var(--custom-primary);
    box-shadow: inset 0 0 0 1px rgba(25, 29, 147, 0.14);
}

#comprehensiveFilterModal .branch-code-type-option.branch-code-type-inactive {
    background: #fff;
    color: #475569;
}

#comprehensiveFilterModal .branch-code-type-option.branch-code-type-inactive:hover {
    background: #f8fafc;
}

/* Add left margin to WZ-Codes and NACE-Codes checkboxes with !important */
#comprehensiveFilterModal .d-flex.flex-wrap .form-check-inline.no-bullet:first-child {
    margin-left: 0 !important;
}

#comprehensiveFilterModal .d-flex.flex-wrap .form-check-inline.no-bullet:not(:first-child) {
    margin-left: 0.75rem !important;
}

/* Alternative: Target by ID for maximum specificity */
#comprehensiveFilterModal #branchCodeFilterNace {
    margin-left: 0.75rem !important;
}

#comprehensiveFilterModal .form-check-inline.no-bullet:has(#branchCodeFilterNace) {
    margin-left: 0.75rem !important;
}

/* Quality Filters Styling */
.quality-filters-list {
    gap: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

.quality-filter-item {
    background-color: transparent;
    border-radius: 0;
    padding: 0.3rem 0;
    border: none;
    border-bottom: 1px solid var(--g100, #f3f4f6);
    box-shadow: none;
    transition: background-color 0.15s;
    min-width: 0;
    width: 100%;
    overflow: visible;
}

.quality-filter-item:last-child {
    border-bottom: none;
}

.quality-filter-item:hover {
    background-color: var(--g50, #f8f9fa);
    box-shadow: none;
    border-color: var(--g100, #f3f4f6);
}

.quality-filter-item>div {
    width: 100%;
    min-width: 0;
}

.quality-filter-item label {
    user-select: none;
}

.toggle-switch-label {
    flex: 1;
    margin-right: 1rem;
    font-size: 0.8125rem;
    color: var(--g700);
    line-height: 1.4;
}

.badge.bg-warning {
    background-color: #fef3c7 !important;
    color: #92400e !important;
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
}

/* Toggle Switch Styling */
.toggle-switch {
    position: relative;
    display: inline-block;
    width: 52px;
    height: 28px;
    flex-shrink: 0;
    cursor: pointer;
}

.toggle-switch-input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.toggle-switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--g400, #94a3b8);
    transition: var(--ease);
    border-radius: 28px;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}

.toggle-switch-slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 3px;
    bottom: 3px;
    background-color: #ffffff;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.toggle-switch-input:checked+.toggle-switch-slider {
    background-color: var(--custom-primary);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 0 8px rgba(25,29,147,0.25);
}

.toggle-switch-input:checked+.toggle-switch-slider:before {
    transform: translateX(24px);
    box-shadow: 0 2px 8px rgba(25,29,147,0.5);
}

.toggle-switch-input:focus+.toggle-switch-slider {
    box-shadow: 0 0 0 3px rgba(25,29,147,0.1);
}

.toggle-switch-input:checked:focus+.toggle-switch-slider {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 0 0 3px rgba(25,29,147,0.1);
}

.toggle-switch:hover .toggle-switch-slider {
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.12);
}

.toggle-switch:hover .toggle-switch-input:checked+.toggle-switch-slider {
    background-color: var(--custom-primary-200);
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.18);
}

/* E-Mail Ansprechpartner: kompakter Toggle, optisch an eine Zeile angepasst */
.unified-search-card-wrapper #contactsFromEmailParent .toggle-switch.toggle-switch--email-contact {
    width: 38px;
    height: 20px;
}
.unified-search-card-wrapper #contactsFromEmailParent .toggle-switch.toggle-switch--email-contact .toggle-switch-slider {
    border-radius: 20px;
}
.unified-search-card-wrapper #contactsFromEmailParent .toggle-switch.toggle-switch--email-contact .toggle-switch-slider:before {
    height: 14px;
    width: 14px;
    left: 3px;
    bottom: 3px;
}
.unified-search-card-wrapper #contactsFromEmailParent .toggle-switch.toggle-switch--email-contact .toggle-switch-input:checked + .toggle-switch-slider:before {
    transform: translateX(18px);
}

.filter-item-card.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.filter-item-card.is-disabled .toggle-switch-input,
.filter-item-card.is-disabled label:not(.filter-info-icon-wrapper *) {
    pointer-events: none;
}

.filter-item-card.is-disabled .filter-info-icon-wrapper {
    pointer-events: auto;
    opacity: 1;
}

/* Gesperrte Filter: Schloss nur bei is-disabled (Logik unveraendert) */
.unified-search-card-wrapper .filter-gate-lock {
    display: none;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    line-height: 1;
    flex-shrink: 0;
}
.unified-search-card-wrapper .filter-item-card.is-disabled .filter-gate-lock:not(.filter-gate-lock--heading) {
    display: inline-flex;
}
.unified-search-card-wrapper .filter-item-card.is-disabled .filter-gate-lock:not(.filter-gate-lock--heading) i {
    font-size: 0.72rem;
    color: #64748b;
    opacity: 0.95;
}
.unified-search-card-wrapper .filter-group-datenqualitaet .filter-gate-lock--heading {
    display: none;
    align-items: center;
}
.unified-search-card-wrapper .filter-group-datenqualitaet:has(.filter-item-card.is-disabled) .filter-gate-lock--heading {
    display: inline-flex;
}
.unified-search-card-wrapper .filter-group-datenqualitaet .filter-gate-lock--heading i {
    font-size: 0.62rem;
    color: #94a3b8;
    opacity: 0.95;
}

/* Contact Data Statistics Styling */
.contact-data-stats {
    padding: 1rem 0;
    border-top: 1px solid var(--g200);
    border-bottom: 1px solid var(--g200);
}

.contact-stat-item {
    flex: 0 0 auto;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: background-color 0.2s ease;
}

.contact-stat-item:hover {
    background-color: var(--g50);
}

.contact-stat-item svg {
    flex-shrink: 0;
}

.contact-stat-number {
    font-size: 1.125rem;
    line-height: 1.2;
    margin: 0 0.25rem;
}

.contact-stat-label {
    font-size: 0.875rem;
    line-height: 1.3;
    white-space: nowrap;
}

@media (max-width: 768px) {
    .contact-data-stats {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 0.75rem !important;
    }

    .contact-stat-item {
        width: 100%;
        justify-content: flex-start;
    }
}

/* PLZ-Gebiet Inline-Inputs */
.loc-postal-input-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.loc-postal-field {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.loc-postal-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--custom-font-light);
}

.loc-postal-input {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid var(--g200);
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--custom-font);
    background: var(--g50);
    outline: none;
    transition: all 0.15s ease;
}

.loc-postal-input:focus {
    border-color: rgba(25, 29, 147, 0.35);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(25, 29, 147, 0.06);
}

.loc-postal-separator {
    display: flex;
    align-items: center;
    padding-bottom: 8px;
    color: var(--g400);
    font-size: 14px;
}

.loc-postal-add-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    border: 1.5px solid var(--custom-primary);
    border-radius: 10px;
    background: rgba(25, 29, 147, 0.04);
    color: var(--custom-primary);
    font-size: 16px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.loc-postal-add-btn:hover {
    background: rgba(25, 29, 147, 0.1);
    box-shadow: 0 2px 6px rgba(25, 29, 147, 0.12);
}

/* Standort Wizard */
.location-wizard {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.location-wizard__intro {
    padding: 1rem 1.125rem;
    border: 1px solid var(--g200);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, var(--g50) 100%);
}

.location-wizard__question {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--g800);
    margin-bottom: 0.35rem;
}

.location-wizard__choices {
    display: grid;
    gap: 0.875rem;
}

@media (min-width: 768px) {
    .location-wizard__choices {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.location-method-choice {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    padding: 1rem 1.125rem;
    border: 1px solid var(--g200);
    border-radius: 14px;
    background: #ffffff;
    color: inherit;
    text-align: left;
    transition: var(--ease);
    box-shadow: var(--sh);
    min-height: 100%;
}

.location-method-choice:hover,
.location-method-choice:focus-visible {
    border-color: var(--ci-regional-border);
    background: var(--ci-regional-bg);
    transform: translateY(-1px);
    box-shadow: var(--sh-md);
    outline: none;
}

.location-method-choice.is-active {
    border-color: rgba(25,29,147,0.24);
    background: rgba(25,29,147,0.05);
}

.location-method-choice__icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 12px;
    background: rgba(25,29,147,0.08);
    color: var(--ci-regional);
    font-size: 1rem;
}

.location-method-choice__icon i {
    line-height: 1;
}

.location-method-choice.is-active .location-method-choice__icon {
    background: rgba(25,29,147,0.12);
}

.location-method-choice:hover .location-method-choice__icon,
.location-method-choice:focus-visible .location-method-choice__icon {
    background: rgba(25,29,147,0.12);
}

.location-method-choice__title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--g800);
}

.location-method-choice__description {
    font-size: 0.875rem;
    color: var(--g600);
    line-height: 1.45;
}

.location-method-choice__cta {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--ci-regional);
}

.location-wizard__detail-head {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.location-wizard__back {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ci-regional);
    font-size: 0.875rem;
    font-weight: 700;
}

.location-wizard__back:hover,
.location-wizard__back:focus-visible {
    text-decoration: underline;
    outline: 2px solid rgba(25,29,147,0.2);
    outline-offset: 3px;
}

.location-wizard__eyebrow {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ci-regional);
    margin-bottom: 0.25rem;
}

.location-wizard__detail-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--g800);
    margin: 0 0 0.25rem;
}

.location-method-panel {
    padding: 1rem 1.125rem;
    border: 1px solid var(--g200);
    border-radius: 14px;
    background: #ffffff;
}

.location-method-results {
    max-height: 240px;
    overflow-y: auto;
}

/* Radius Slider Styling */
.radius-slider-container {
    padding: 1rem 0;
}

.radius-slider-wrapper {
    position: relative;
    padding: 0.75rem 0 4.25rem 0;
}

.radius-slider {
    width: 100%;
    height: 8px;
    border-radius: 4px;
    background: linear-gradient(to right, var(--custom-primary) 0%, var(--custom-primary) 0%, var(--g200) 0%, var(--g200) 100%);
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    z-index: 2;
    margin: 0;
}

.radius-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--custom-primary);
    cursor: pointer;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 3;
}

.radius-slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--custom-primary);
    cursor: pointer;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 3;
}

.radius-slider::-moz-range-track {
    height: 8px;
    border-radius: 4px;
    background: var(--g200);
}

.radius-slider:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.radius-slider-labels {
    display: flex;
    justify-content: space-between;
    position: absolute;
    width: calc(100% - 20px);
    top: 2rem;
    left: 10px;
    right: 10px;
    pointer-events: none;
    padding: 0;
    margin: 0;
}

.radius-slider-labels .slider-label {
    font-size: 0.75rem;
    color: var(--g700);
    font-weight: 500;
    position: relative;
    flex-shrink: 0;
}

.radius-display-value {
    text-align: center;
    font-size: 1.1rem;
    color: var(--g800);
    margin-top: 2rem;
    line-height: 1.4;
}

.radius-display-value span {
    color: var(--g800);
}

/* Filter Tooltip Styles (extracted from search3.blade.php) */

.filter-icon {
    color: var(--g400);
    font-size: 14px;
    transition: color 0.15s ease;
}

.filter-item:hover .filter-icon {
    color: var(--g600);
}

/* Zweizeilige Einträge: Unterzeile unter dem Text, nicht unter dem Icon */
.unified-search-card-wrapper .filter-item-card .flex-column .small.text-muted.ms-4 {
    margin-left: 0 !important;
    padding-left: calc(1.125rem + 0.5rem);
    display: block;
}


.filter-modal-clear-all {
    white-space: nowrap;
    font-weight: 500;
}
.filter-modal-clear-all:hover {
    text-decoration: underline !important;
}
.filter-modal-selected-chips-wrap {
    max-height: 180px;
    overflow-y: auto;
}

/* States Modal */
.states-modal-wrap {
    display: flex;
    flex-direction: column;
}

.states-scroll-container {
    max-height: 380px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--g300) transparent;
}
.states-scroll-container::-webkit-scrollbar {
    width: 5px;
}
.states-scroll-container::-webkit-scrollbar-thumb {
    background: var(--g300);
    border-radius: 10px;
}

.states-country-group {
    margin-bottom: 0.625rem;
}
.states-country-group:last-child {
    margin-bottom: 0;
}

.states-country-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.625rem;
    background: #f0f1f8;
    border: 1px solid #d4d6e8;
    border-radius: 8px;
    margin-bottom: 0.375rem;
    position: sticky;
    top: 0;
    z-index: 2;
}

.states-country-header .form-check-input {
    width: 1rem;
    height: 1rem;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.states-country-flag {
    font-size: 1.1rem;
    line-height: 1;
}

.states-country-name {
    font-weight: 600;
    font-size: 0.825rem;
    color: var(--custom-primary);
    letter-spacing: 0.01em;
}

.states-country-count {
    margin-left: auto;
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--custom-primary);
    background: rgba(25,29,147,0.1);
    padding: 0.1rem 0.45rem;
    border-radius: 10px;
    line-height: 1.4;
}

/* Quick filter buttons */
.states-quick-filters {
    padding: 0 0.25rem;
}

.states-quick-label {
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--g500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.3rem;
}

.states-quick-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.states-quick-btn {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--custom-primary);
    background: var(--custom-primary-glow, rgba(25,29,147,0.06));
    border: 1px solid rgba(25,29,147,0.15);
    border-radius: 20px;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}
.states-quick-btn:hover {
    background: rgba(25,29,147,0.12);
    border-color: rgba(25,29,147,0.25);
}
.states-quick-btn:active {
    transform: scale(0.97);
}

/* States two-column layout (column-first fill) */
.states-two-col {
    display: flex;
    gap: 0;
    padding: 0 0.125rem 0.375rem;
}

.states-col {
    flex: 1;
    min-width: 0;
}

.states-two-col .form-check.states-grid-item {
    padding: 0.225rem 0.5rem;
    margin: 0;
    border-radius: 6px;
    transition: background-color 0.15s ease;
}
.states-two-col .form-check.states-grid-item:hover {
    background-color: var(--g50);
}

.states-two-col .form-check-label {
    font-size: 0.8rem;
    color: var(--custom-font);
    padding-left: 0.35rem !important;
}

.states-two-col .form-check-input {
    width: 0.875rem;
    height: 0.875rem;
    margin-top: 0.15rem;
}

/* Empty selection hint */
.states-empty-hint {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffc107;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    font-size: 0.8rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-align: center;
}

@media (max-width: 576px) {
    .states-two-col {
        flex-direction: column;
    }
    .states-scroll-container {
        max-height: 300px;
    }
}

/* ========================================
   COMMAND CENTER STYLES
   ======================================== */

.search-hint-banner {
    font-size: 13px;
    line-height: 1.45;
    padding: 0.5rem 0.7rem;
    margin: 0.4rem 0 0.1rem;
    border-radius: 6px;
    background: #f0f4ff;
    color: #3b4a6b;
    border: 1px solid #d4ddf2;
}
.search-hint-banner.is-error {
    background: #fef3f2;
    color: #7a2e2e;
    border-color: #f5d4d4;
    padding: 0.85rem 1rem;
    margin: 0.45rem 0 0.2rem;
}
.search-hint-banner__error-text {
    margin: 0 0 0.15rem;
    font-size: 0.9rem;
    line-height: 1.5;
    color: #6b2d2d;
    font-weight: 500;
}
.search-hint-banner__actions {
    margin-top: 0.55rem;
}
.search-hint-banner__retry.pricing-cta-primary {
    font-size: 0.88rem;
    padding: 0.85rem 1rem;
    margin-top: 0.1rem;
}
.search-hint-banner__retry.pricing-cta-primary.search-hint-banner__retry--busy::before {
    display: none;
}
.search-hint-banner__retry.pricing-cta-primary.search-hint-banner__retry--busy {
    gap: 0.55rem;
}
.command-headline.command-headline--stale-result .command-headline-count {
    opacity: 0.42;
}

/* Registrierungs-Hinweis fuer gespeicherte Suchen */
#searchRequiresRegistrationModal .search3-registration-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--custom-primary, #191d93);
    border: 1px solid var(--custom-primary, #191d93);
    color: #fff;
    font-weight: 600;
    font-size: 0.9375rem;
    border-radius: 8px;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

#searchRequiresRegistrationModal .search3-registration-cta:hover,
#searchRequiresRegistrationModal .search3-registration-cta:focus {
    background-color: #4338ca;
    border-color: #4338ca;
    color: #fff;
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.35);
}

#searchRequiresRegistrationModal .search3-registration-cta:focus-visible {
    outline: 2px solid var(--custom-primary-100, #c4c2e8);
    outline-offset: 2px;
}

#searchRequiresRegistrationModal .search3-registration-cta--solo {
    min-width: min(100%, 280px);
}

/* Command Headline */
.command-headline {
    position: relative;
    overflow: visible;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0 0 1.08rem;
    margin-bottom: 0.98rem;
    box-shadow: none;
    border-bottom: 1px solid rgba(203,213,225,0.95);
}
.command-headline-row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.28rem 0.55rem;
    margin-bottom: 0.18rem;
}
.command-headline-count {
    font-size: 3.05rem;
    font-weight: 800;
    color: #0f172a !important;
    line-height: 0.96;
    letter-spacing: -0.05em;
}
.search3-value--updating {
    opacity: 0.56;
    transition: opacity 0.18s ease, color 0.18s ease, background-color 0.18s ease;
}
.search3-value--updated {
    background: rgba(25, 29, 147, 0.08);
    border-radius: 6px;
    transition: opacity 0.18s ease, color 0.18s ease, background-color 0.18s ease;
}
.command-headline-label {
    font-size: 1.16rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
    max-width: 42rem;
}
.command-headline-subtitle {
    margin-top: 0.22rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: #475569;
    line-height: 1.35;
    max-width: 50rem;
}
.results-activity-zone {
    margin: 0.56rem 0 0;
}
.command-headline .results-activity-zone {
    margin-top: 0.6rem;
    padding-top: 0.62rem;
    border-top: 1px solid rgba(226,232,240,0.9);
}
.results-activity-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-bottom: 0.28rem;
}
.results-activity-zone .search-hint-banner {
    margin: 0 0 0.55rem;
    padding: 0;
    background: transparent;
    border: none;
    color: #475569;
}
.results-activity-zone .loading-activity {
    padding: 0.15rem 0 0.3rem;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
.command-headline .results-activity-zone .loading-activity {
    padding-bottom: 0;
}
.results-secondary-info {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    margin-bottom: 1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid rgba(226,232,240,0.9);
}
.results-secondary-info .kpi-bonus {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}
.results-secondary-info .command-headline-meta {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    color: #64748b;
}
.results-secondary-info .command-meta-date--fresh {
    color: #475569;
}
.results-secondary-info .command-meta-date--fresh #dataUpdateDate,
.results-secondary-info .limit-slider-value {
    color: var(--custom-primary, #191d93);
}
.results-secondary-info .command-meta-sep {
    color: #d1d5db;
}
.results-secondary-info .limit-slider-label {
    color: #475569;
}
.results-secondary-info .limit-slider {
    background: #e5e7eb;
}
.results-secondary-info .limit-slider::-moz-range-track {
    background: #e5e7eb;
}
.results-secondary-info .limit-slider-exact-btn {
    color: var(--custom-primary, #191d93);
    border-bottom-color: rgba(25, 29, 147, 0.35);
}
.results-secondary-info .limit-slider-exact-btn:hover {
    color: var(--custom-primary, #191d93);
    border-bottom-color: var(--custom-primary, #191d93);
}
.results-secondary-info .limit-slider-exact-btn:focus-visible {
    outline: 2px solid rgba(25,29,147,0.28);
}
.results-activity-zone .command-quality-badge {
    background: #e8f5ee;
    color: #2f6f53;
    border: 1px solid #cbe7d6;
}
.results-activity-zone .command-web-badge {
    background: rgba(25,29,147,0.08);
    color: var(--custom-primary, #191d93);
    border: 1px solid rgba(25,29,147,0.12);
}
.command-headline-stats-legacy {
    display: none;
}
.command-headline-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.32rem;
    margin-top: 0.28rem;
    padding-top: 0;
    border-top: none;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.2;
}
.command-meta-date {
    white-space: normal;
}
.command-meta-date--fresh {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.1rem 0;
    border-radius: 0;
    border: none;
    background: transparent;
    color: #64748b;
    font-weight: 600;
    box-shadow: none;
}
.command-meta-date--fresh #dataUpdateDate {
    color: #334155;
    font-weight: 700;
}
.command-meta-sep {
    margin: 0 0.5rem;
    color: #cbd5e1;
    user-select: none;
    flex: 0 0 auto;
}
.command-limit-inline {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
}
.limit-dropdown {
    position: relative;
    display: inline-flex;
}
.limit-dropdown-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    transition: color 0.15s ease;
}
.limit-dropdown-trigger:hover {
    color: #ffffff;
}
.limit-slider-wrap {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.5rem;
}
.limit-slider-exact-btn {
    margin: 0;
    padding: 0.15rem 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #ffffff;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.35);
    border-radius: 0;
    cursor: pointer;
    line-height: 1.2;
    white-space: nowrap;
}
.limit-slider-exact-btn:hover {
    color: #ffffff;
    border-bottom-color: rgba(255,255,255,0.72);
}
.limit-slider-exact-btn:focus-visible {
    outline: 2px solid rgba(255,255,255,0.55);
    outline-offset: 2px;
}
.limit-slider-label {
    color: rgba(255,255,255,0.82);
    white-space: nowrap;
    font-weight: 700;
}
.limit-slider-value {
    font-weight: 700;
    color: #ffffff;
    min-width: 2.5rem;
    text-align: right;
}
.limit-slider {
    -webkit-appearance: none;
    appearance: none;
    width: 100px;
    height: 4px;
    border-radius: 2px;
    background: rgba(255,255,255,0.28);
    outline: none;
    cursor: pointer;
    margin: 0 0.15rem;
}
.limit-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.22);
    cursor: pointer;
    margin-top: -5px;
    transition: transform 0.1s ease;
}
.limit-slider::-webkit-slider-thumb:hover {
    transform: scale(1.2);
}
.limit-slider::-moz-range-thumb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
    cursor: pointer;
}
.limit-slider::-webkit-slider-runnable-track {
    height: 4px;
    border-radius: 2px;
}
.limit-slider::-moz-range-track {
    height: 4px;
    border-radius: 2px;
    background: rgba(255,255,255,0.28);
}
.limit-dropdown-chevron {
    transition: transform 0.2s ease;
}
.limit-dropdown.open .limit-dropdown-chevron {
    transform: rotate(180deg);
}
.command-limit-value {
    font-weight: 600;
    color: var(--g600, #4b5563);
}
.limit-dropdown-trigger:hover .command-limit-value {
    color: #ffffff;
}
.limit-dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 130px;
    background: #fff;
    border: 1px solid var(--g200, #e5e7eb);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
    padding: 0.25rem 0;
    z-index: 100;
}
.limit-dropdown.open .limit-dropdown-menu {
    display: block;
}
.limit-dropdown-header {
    padding: 0.5rem 0.85rem 0.35rem;
    font-size: 0.675rem;
    font-weight: 600;
    color: var(--g400, #9ca3af);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--g100, #f3f4f6);
    margin-bottom: 0.2rem;
}
.limit-dropdown-item {
    display: block;
    width: 100%;
    padding: 0.4rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--g600, #4b5563);
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background 0.1s ease;
}
.limit-dropdown-item:hover {
    background: var(--g50, #f8f9fa);
}
.limit-dropdown-item.active {
    color: var(--custom-primary, #191d93);
    font-weight: 600;
}
.limit-dropdown-badge {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 600;
    padding: 0.1rem 0.35rem;
    border-radius: 3px;
    background: #eff6ff;
    color: var(--custom-primary, #191d93);
    margin-left: 0.25rem;
    vertical-align: middle;
    letter-spacing: 0.01em;
}
.limit-dropdown-badge--value {
    background: #f0fdf4;
    color: #15803d;
}
.command-limit-text {
    font-size: 0.75rem;
    color: var(--g500, #6b7280);
    white-space: nowrap;
    margin-right: 0.375rem;
    cursor: default;
}
.command-limit-input {
    width: 64px;
    height: 22px;
    font-size: 0.7rem;
    padding: 0 0.3rem;
    border: 1px solid var(--g200, #e5e7eb);
    border-right: none;
    border-radius: 3px 0 0 3px;
    color: var(--custom-font, #1e293b);
    background: #fff;
    outline: none;
    transition: border-color 0.15s;
    -moz-appearance: textfield;
}
.command-limit-input::-webkit-outer-spin-button,
.command-limit-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.command-limit-input:focus {
    border-color: var(--custom-primary, #191d93);
}
.command-limit-input:focus + .command-limit-btn {
    border-color: var(--custom-primary, #191d93);
}
.command-limit-input::placeholder {
    color: var(--g400, #9ca3af);
    font-size: 0.65rem;
}
.command-limit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    font-size: 0;
    color: var(--g500, #6b7280);
    background: var(--g50, #f8f9fa);
    border: 1px solid var(--g200, #e5e7eb);
    border-radius: 0 3px 3px 0;
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1;
    flex-shrink: 0;
}
.command-limit-btn:hover {
    background: var(--custom-primary, #191d93);
    color: #fff;
    border-color: var(--custom-primary, #191d93);
}
.command-limit-btn:hover svg {
    stroke: #fff;
}
.command-quality-badge,
.command-web-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.18rem 0.48rem;
    font-size: 0.64rem;
    font-weight: 600;
    border-radius: 20px;
    white-space: nowrap;
}
.command-quality-badge {
    background: rgba(255,255,255,0.12);
    color: #ffffff;
    border: 1px solid rgba(255,255,255,0.18);
}
.command-quality-badge::before {
    content: "\2713";
    font-size: 0.55rem;
    font-weight: 700;
}
.command-web-badge {
    background: rgba(255,255,255,0.12);
    color: #ffffff;
    border: 1px solid rgba(255,255,255,0.18);
}
.command-web-badge::before {
    content: "\2713";
    font-size: 0.6rem;
    font-weight: 700;
}

/* KPI Strip (compact, scannable) */
.kpi-strip-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--g500, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top: 0.5rem;
    margin-bottom: 0.3rem;
}
.kpi-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0 0 0.65rem;
}
.kpi-strip.kpi-strip--muted .kpi-chip {
    opacity: 0.45;
}
.kpi-chip {
    display: inline-flex;
    align-items: baseline;
    gap: 0.28rem;
    padding: 0.08rem 0;
    background: transparent;
    border: none;
    border-radius: 0;
    font-size: 0.72rem;
    line-height: 1.25;
    box-shadow: none;
}
.kpi-chip-num {
    font-weight: 700;
    color: #1e293b;
    font-size: 0.96rem;
}
.kpi-chip-lbl {
    color: #475569;
    font-size: 0.66rem;
    font-weight: 600;
}
.kpi-chip--value {
    background: transparent;
    border-bottom: 1px solid rgba(25,29,147,0.15);
    box-shadow: none;
}
.kpi-chip--value .kpi-chip-num {
    font-size: 1.08rem;
    color: #28348f;
    font-weight: 750;
}
.kpi-chip--value .kpi-chip-lbl {
    color: #334155;
    font-weight: 650;
}
.kpi-chip--muted {
    opacity: 0.72;
}
.kpi-chip--muted .kpi-chip-num {
    color: #475569;
}
.kpi-chip--muted .kpi-chip-lbl {
    color: #64748b;
}

@media (max-width: 480px) {
    .kpi-strip {
        gap: 0.25rem;
    }
    .command-headline-count {
        font-size: 24px;
    }
    .command-headline-label {
        font-size: 18px;
    }
}

/* Filter Chips Section */
.filter-chips-section {
    margin-top: 0;
    margin-bottom: 0.82rem;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
.filter-chips-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6rem;
}
.filter-chips-row--restrictive {
    margin-top: 0.34rem;
    padding-top: 0.38rem;
    border-top: 1px solid rgba(226,232,240,0.95);
}
.filter-chips-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #334155;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.filter-chips-label--restrictive {
    color: #64748b;
}
.filter-chips-items {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    flex: 1;
}
.filter-chips-items--restrictive {
    flex: 0 1 auto;
}
.filter-chips-clear-wrap {
    margin-left: auto;
    flex-shrink: 0;
}
.filter-chips-clear {
    background: none;
    border: none;
    color: var(--g400, #9ca3af);
    font-size: 0.7rem;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.filter-chips-clear:hover {
    color: var(--custom-primary, #191d93);
}
.search-action-bar-divider {
    width: 1px;
    height: 1rem;
    background: var(--g200, #e5e7eb);
    margin: 0 0.125rem;
    flex-shrink: 0;
    align-self: center;
}

.search-action-bar-divider--after-primary {
    margin-left: 0.25rem;
    margin-right: 0.35rem;
}

.search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--g500, #6b7280) !important;
    font-size: 0.75rem;
    font-weight: 400;
    padding: 0.28rem 0.4rem;
    box-shadow: none !important;
}

.search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph svg,
.search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph .search-action-bar-btn-icon {
    opacity: 0.82;
}

.search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph:hover:not(.disabled) {
    background: var(--g50, #f9fafb) !important;
    border-color: transparent !important;
    color: var(--custom-primary, #191d93) !important;
    text-decoration: underline;
    text-underline-offset: 2px;
    box-shadow: none !important;
}

.search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph.disabled {
    opacity: 0.45;
}

.search-action-bar-spacer {
    flex: 1;
}

/* Results Grid: Preisspalte Kompromiss Lesbarkeit vs. mittlere Luft */
.command-results-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
    gap: 0.5rem;
    align-items: start;
    width: 100%;
}
@media (max-width: 991px) {
    .command-results-grid {
        grid-template-columns: 1fr;
    }
    .command-results-right {
        position: static;
        top: auto;
        padding-left: 0;
        border-left: none;
    }
    #buySectionDataInformation,
    #buySectionDataInformation.row,
    #buySectionDataInformation[class],
    #buySectionDataInformation[class=""],
    div#buySectionDataInformation,
    div#buySectionDataInformation[class],
    div#buySectionDataInformation[class=""] {
        margin-top: 0;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 20px clamp(16px, 2.8vw, 28px) 0 !important;
        background: transparent !important;
    }
}
.command-results-left {
    min-width: 0;
}
.command-results-right {
    min-width: 260px;
    position: sticky;
    top: 0.5rem;
    padding-left: 0;
    border-left: none;
}
.results-selection-panel {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
}

@media (min-width: 1600px) {
    #buySection2 {
        padding: 56px 40px !important;
    }

    .command-results-grid {
        grid-template-columns: minmax(0, 1fr) 470px;
        gap: 3.5rem;
        margin: 0 auto;
    }

    .command-headline {
        padding: 0 0 1.1rem;
    }

    .command-headline-count {
        font-size: 3rem;
    }

    .command-headline-label {
        font-size: 1.2rem;
        max-width: 48rem;
    }
}

/* Quality Section */
.quality-reset-link {
    display: inline-block;
    background: none;
    border: none;
    color: var(--g400, #9ca3af);
    font-size: 0.7rem;
    font-weight: 400;
    padding: 0;
    margin-top: 0.75rem;
    cursor: pointer;
}
.quality-reset-link:hover:not(.disabled) {
    color: var(--g600, #4b5563);
    text-decoration: underline;
}
.quality-reset-link.disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}
.quality-section {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    margin-top: 0.45rem;
    margin-bottom: 0.15rem;
    box-shadow: none;
}
.quality-section-title {
    font-size: 0.78rem;
    font-weight: 700;
    color: #334155;
    margin: 0 0 0.58rem;
    padding: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.quality-filter-row {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
    margin: 0;
    padding: 0.25rem 0.4rem;
    border-radius: 5px;
    transition: background-color 0.15s;
}
.quality-filter-row:hover {
    background-color: rgba(0,0,0,0.025);
}
.quality-filter-name {
    font-size: 0.75rem;
    color: var(--g600, #4b5563);
    line-height: 1.3;
    white-space: nowrap;
}
.filter-info-icon-wrapper {
    flex-shrink: 0;
    line-height: 0;
}
.refine-block {
    display: flex;
    flex-direction: column;
}
.refine-block--select {
    gap: 0.08rem;
    padding: 0.2rem 0 0.1rem;
    width: 100%;
    max-width: 900px;
}
.quality-section-intro {
    margin: -0.02rem 0 0.62rem;
    font-size: 0.76rem;
    line-height: 1.45;
    color: #475569;
    font-weight: 500;
    max-width: 52rem;
}
.refine-block--quality {
    gap: 0;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.2rem;
}
.refine-quality-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.2rem;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0.1rem;
}
.refine-quality-cell {
    min-width: 0;
}
.refine-quality-label {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    cursor: pointer;
    padding: 0.18rem 0.22rem;
    border-radius: 4px;
    margin: 0;
    transition: background-color 0.15s;
}
.refine-quality-label:hover {
    background-color: rgba(0,0,0,0.03);
}
.refine-quality-text {
    font-size: 0.64rem;
    color: #1a1a1a;
    line-height: 1.2;
}
.refine-title--quality {
    margin-top: 0.75rem !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.refine-checkbox-item {
    display: grid;
    grid-template-columns: auto max-content max-content;
    align-items: center;
    justify-content: start;
    gap: 0.28rem 0.42rem;
    cursor: pointer;
    font-size: 0.76rem;
    font-weight: 500;
    color: #1a1a1a;
    user-select: none;
    margin: 0;
    line-height: 1.2;
    transition: color 0.12s ease, background-color 0.12s ease, box-shadow 0.12s ease;
    padding: 10px 0;
    border-radius: 8px;
    border: none;
    background: transparent;
    box-shadow: none;
}
.refine-checkbox-item:hover {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}
.refine-checkbox-item:active {
    background: transparent;
}
.refine-checkbox-item--updating {
    opacity: 1;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}
.refine-checkbox-item--updated {
    border-color: transparent;
    background: transparent;
}
.refine-checkbox-item:has(.refine-cb:checked) {
    color: #0f172a;
    font-weight: 500;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}
.refine-checkbox-item--static {
    cursor: default;
    opacity: 0.94;
}
.refine-checkbox-item--static:hover,
.refine-checkbox-item--static:active {
    background: transparent;
    box-shadow: none;
}
.refine-static-marker {
    width: 17px;
    height: 17px;
    border-radius: 999px;
    background: rgba(25,29,147,0.08);
    box-shadow: inset 0 0 0 4px #ffffff;
    border: 1px solid rgba(25,29,147,0.16);
}
.refine-cb {
    width: 17px;
    height: 17px;
    accent-color: var(--custom-primary, #191d93);
    transform: scale(1.05);
    transform-origin: center;
}
.refine-checkbox-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.05rem;
    max-width: 260px;
}
.refine-checkbox-title {
    font-size: 0.8rem;
    font-weight: 700;
    color: inherit;
    line-height: 1.2;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-checkbox-title {
    color: #0f172a;
    font-weight: 600;
}
.refine-checkbox-subline {
    font-size: 0.67rem;
    font-weight: 500;
    color: #64748b;
    line-height: 1.25;
}
.refine-avail {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.1rem;
    font-size: 0.74rem;
    font-weight: 700;
    color: #1f2937;
    white-space: nowrap;
    justify-self: start;
    min-width: 0;
    max-width: none;
    text-align: left;
    line-height: 1.1;
    padding: 0;
    border-radius: 0;
    border: none;
    background: transparent;
}
.refine-avail--updating {
    opacity: 1;
    color: var(--custom-primary, #191d93);
    border-color: transparent;
    background: transparent;
    transition: opacity 0.18s ease, color 0.18s ease, background-color 0.18s ease;
}
.refine-avail--updated {
    border-color: transparent;
    background: transparent;
    transition: opacity 0.18s ease, color 0.18s ease, background-color 0.18s ease;
}
.refine-avail:empty {
    display: none;
}
.refine-avail-num {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    letter-spacing: -0.02em;
}
.refine-avail-label {
    font-size: 0.74rem;
    font-weight: 600;
    color: #475569;
    line-height: 1.15;
}
.refine-avail-note {
    font-size: 0.66rem;
    font-weight: 500;
    color: #64748b;
    line-height: 1.2;
}
.refine-avail-note--loading {
    color: #64748b;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-avail-num {
    color: #475569;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-avail-label {
    color: #64748b;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-avail-note {
    color: #475569;
}
.refine-checkbox-subline--dynamic {
    color: #64748b;
    font-size: 0.62rem;
    font-weight: 600;
    white-space: nowrap;
}
.refine-avail--loading {
    min-width: 168px;
}
.refine-avail-loading {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    justify-content: flex-start;
}
.refine-avail-loading-num {
    width: 34px;
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(148,163,184,0.16) 0%, rgba(25,29,147,0.24) 50%, rgba(148,163,184,0.16) 100%);
    background-size: 200% 100%;
    animation: refineAvailPulse 1.25s ease-in-out infinite;
}
.refine-avail-loading-label {
    font-size: 0.64rem;
    font-weight: 500;
    color: #64748b;
    white-space: nowrap;
    text-align: left;
}
@media (max-width: 575px) {
    .results-selection-panel {
        padding: 0.85rem 0.8rem 0.8rem;
    }
    .refine-quality-grid {
        grid-template-columns: 1fr;
    }
    .refine-checkbox-item {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
        justify-content: stretch;
    }
    .refine-avail {
        grid-column: 2;
        justify-self: start;
        align-items: flex-start;
        text-align: left;
        min-width: 0;
        max-width: none;
        margin-top: 0.05rem;
    }
    .refine-avail--loading {
        min-width: 0;
    }
}
.refine-cb {
    width: 17px;
    height: 17px;
    accent-color: var(--custom-primary, #191d93);
    cursor: pointer;
    flex-shrink: 0;
    transform: scale(1.05);
    transform-origin: center;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-checkbox-subline {
    color: #475569;
}
.toggle-switch-sm {
    transform: scale(0.7);
    flex-shrink: 0;
}

/* Bonus Datafields (inline under KPIs) */
.kpi-bonus {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem 0.45rem;
    margin-top: 0.8rem;
    padding-top: 0.7rem;
    border-top: 1px solid rgba(25,29,147,0.08);
    font-size: 0.8rem;
    color: var(--g500, #6b7280);
    line-height: 1.35;
    opacity: 0.92;
}
.kpi-bonus-label {
    font-weight: 700;
    color: var(--g500, #6b7280);
    margin-right: 0.15rem;
}
.kpi-bonus-item {
    color: var(--g600, #4b5563);
}
.kpi-bonus-sep {
    color: var(--g300, #d1d5db);
}
.kpi-bonus-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    color: var(--g600, #4b5563);
    font-size: 0.78rem;
    line-height: 1.3;
}
.kpi-bonus-badge svg {
    flex-shrink: 0;
    opacity: 0.56;
}
.pricing-bonus-fields {
    margin-top: 0.28rem;
}
.pricing-limit-control {
    margin-top: 0.15rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding-top: 0.05rem;
}
.pricing-panel .limit-slider-wrap {
    display: flex;
    align-items: center;
    gap: 0.35rem 0.55rem;
    width: 100%;
}
.pricing-panel .limit-slider-label {
    color: #475569;
}
.pricing-panel .limit-slider-value {
    color: var(--custom-primary, #191d93);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.5rem;
    padding: 0.22rem 0.5rem;
    border-radius: 999px;
    background: rgba(25,29,147,0.06);
    border: 1px solid rgba(25,29,147,0.12);
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
}
.pricing-panel .limit-slider {
    flex: 1 1 auto;
    min-width: 120px;
    background: #e5e7eb;
}
.pricing-panel .limit-slider::-moz-range-track {
    background: #e5e7eb;
}
.pricing-panel .limit-slider::-webkit-slider-thumb,
.pricing-panel .limit-slider::-moz-range-thumb {
    background: var(--custom-primary, #191d93);
    border-color: var(--custom-primary, #191d93);
    box-shadow: none;
}
.pricing-panel .limit-slider-exact-btn {
    color: var(--custom-primary, #191d93);
    border-bottom: none;
    text-decoration: none;
    padding-left: 0;
    padding-right: 0;
}
.pricing-panel .limit-slider-exact-btn:hover {
    color: #0f172a;
    border-bottom: none;
    text-decoration: none;
}
.pricing-panel .limit-slider-exact-btn:focus-visible {
    outline: 2px solid rgba(25,29,147,0.22);
}
.limit-slider-wrap--loading .limit-slider,
.limit-slider-wrap--loading .limit-slider-exact-btn {
    opacity: 0.45;
    pointer-events: none;
    cursor: progress;
}
.limit-slider:disabled {
    cursor: progress;
}
.limit-slider-exact-btn:disabled {
    cursor: progress;
    opacity: 0.6;
}
.pricing-panel .kpi-bonus {
    margin-top: 0;
    padding-top: 0.28rem;
    border-top: none;
    gap: 0.1rem;
    font-size: 0.74rem;
    color: #64748b;
}
.pricing-panel .kpi-bonus-label {
    color: #334155;
    width: 100%;
    margin-right: 0;
    margin-bottom: 0.12rem;
    font-weight: 700;
    font-size: 0.78rem;
    line-height: 1.3;
}
.pricing-panel .kpi-bonus-values {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.18rem 0.28rem;
    width: 100%;
    font-size: 0.68rem;
    line-height: 1.35;
    color: #475569;
}
.pricing-panel .kpi-bonus-badge {
    display: inline;
    color: #475569;
    white-space: nowrap;
}
.pricing-panel .kpi-bonus-sep {
    color: #94a3b8;
    margin: 0 0.18rem;
}

/* Pricing Panel */
.pricing-panel {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 2px 0 0;
    box-shadow: none;
}
.pricing-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 2.5rem 1.5rem;
    min-height: 200px;
}
.pricing-empty-icon {
    margin-bottom: 0.75rem;
    opacity: 0.5;
}
.pricing-empty-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: #6b7280;
    margin-bottom: 0.35rem;
}
.pricing-empty-text {
    font-size: 0.78rem;
    color: #9ca3af;
    line-height: 1.5;
}
.pricing-panel--empty {
    opacity: 0.55;
    pointer-events: none;
}
.pricing-panel--empty .pricing-footer {
    display: none;
}
.pricing-panel-title {
    font-size: 0.76rem;
    font-weight: 700;
    color: #1e293b;
    text-transform: none;
    letter-spacing: 0.01em;
    margin-bottom: 0.42rem;
}
.pricing-filter-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 0.42rem;
    margin-bottom: 0.68rem;
    min-width: 0;
    max-width: 100%;
}
.pricing-filter-summary b {
    font-weight: 700;
    color: #0f172a;
}
.pricing-filter-summary-item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    width: auto;
    padding: 0.38rem 0.68rem;
    color: #475569;
    white-space: normal;
    overflow-wrap: anywhere;
    border: 1px solid rgba(226,232,240,0.95);
    border-radius: 999px;
    background: rgba(248,250,252,0.96);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}
.pricing-filter-summary-item:last-child {
    padding-bottom: 0.38rem;
    border-bottom-color: rgba(226,232,240,0.95);
}
.pricing-filter-summary-label {
    display: none;
    margin-bottom: 0.04rem;
    font-size: 0.58rem;
    line-height: 1.3;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}
.pricing-filter-summary-value {
    display: block;
    max-width: 100%;
    font-size: 0.72rem;
    line-height: 1.2;
    color: #334155;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.pricing-filter-summary-more-wrap {
    position: relative;
    display: inline-flex;
}
.pricing-filter-summary-more {
    display: inline-flex;
    align-items: center;
    padding: 0.38rem 0.68rem;
    color: #64748b;
    background: rgba(255,255,255,0.7);
    border: 1px dashed rgba(203,213,225,0.95);
    border-radius: 999px;
    font-size: 0.68rem;
    line-height: 1.2;
    font-weight: 700;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}
.pricing-filter-summary-preview {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    z-index: 15;
    display: none;
    min-width: 220px;
    max-width: min(340px, 85vw);
    max-height: min(420px, 65vh);
    overflow-y: auto;
    padding: 0.35rem 0.6rem;
    border: 1px solid rgba(226,232,240,0.95);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 40px rgba(15,23,42,0.12), 0 4px 10px rgba(15,23,42,0.06);
}
.pricing-filter-summary-more-wrap.is-open .pricing-filter-summary-preview {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.pricing-filter-summary-preview-item {
    display: block;
    font-size: 0.72rem;
    line-height: 1.3;
    color: #334155;
}
.pricing-filter-summary-preview-group {
    display: flex;
    flex-direction: column;
    gap: 0.14rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid rgba(226,232,240,0.7);
}
.pricing-filter-summary-preview-group:first-child {
    padding-top: 0.25rem;
}
.pricing-filter-summary-preview-group:last-child {
    padding-bottom: 0.25rem;
    border-bottom: none;
}
.pricing-filter-summary-preview-label {
    font-size: 0.62rem;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.pricing-filter-summary-preview-values {
    font-size: 0.74rem;
    line-height: 1.4;
    color: #334155;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.pricing-unit-hero {
    margin-bottom: 0.18rem;
    padding: 0.1rem 0 0.06rem;
    border-radius: 0;
    background: transparent;
    border: none;
}
.pricing-unit-hero-value {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: var(--custom-primary, #191d93);
    line-height: 1.1;
}
.pricing-unit-hero-label {
    font-size: 0.72rem;
    color: #64748b;
}
.pricing-unit-hero--lead {
    margin-bottom: 0.52rem;
}
.pricing-unit-hero-inline {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.5rem;
    max-width: 100%;
}
.pricing-unit-hero--lead .pricing-unit-hero-inline .pricing-unit-hero-value {
    display: inline;
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.025em;
    color: var(--custom-primary, #191d93);
    line-height: 1.12;
}
.pricing-unit-hero--lead .pricing-unit-hero-inline .pricing-unit-hero-label {
    display: inline;
    margin-top: 0;
    font-size: 0.77rem;
    font-weight: 600;
    color: #64748b;
    letter-spacing: 0.01em;
}
.pricing-records--selected {
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
    padding: 0.18rem 0 0.28rem;
    line-height: 1.35;
}
.pricing-selection-hint {
    font-size: 0.6875rem;
    line-height: 1.35;
    color: #64748b;
    margin: 0.15rem 0 0.35rem;
}
.pricing-selection-hint--control {
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.4;
    color: #475569;
    margin: 0.18rem 0 0.32rem;
}
.pricing-panel-adjust {
    margin: 0.2rem 0 0.4rem;
    padding: 0;
    text-align: right;
}
.pricing-limit-link {
    display: inline;
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    font-size: inherit;
    font-weight: 600;
    color: var(--custom-primary, #191d93);
    text-decoration: underline;
    text-underline-offset: 0.12em;
    cursor: pointer;
}
.pricing-limit-link:hover {
    color: #0f172a;
}
.pricing-limit-link--subtle {
    font-size: 0.6875rem;
    font-weight: 500;
    color: #64748b;
    text-decoration: none;
    border-bottom: 1px solid rgba(100, 116, 139, 0.38);
    text-underline-offset: 0;
}
.pricing-limit-link--subtle:hover {
    color: #475569;
    border-bottom-color: rgba(71, 85, 105, 0.5);
}
.pricing-sum-section {
    display: block;
    margin-top: 0.1rem;
}
.pricing-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: nowrap;
    padding: 0.75rem 0.85rem;
    margin: 0.08rem 0 0.7rem;
    border: 1px solid rgba(226,232,240,0.95);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,250,252,0.98) 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}
.pricing-total-label {
    font-size: 0.72rem;
    color: #475569;
    font-weight: 700;
    line-height: 1.35;
}
.pricing-total-main {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.12rem;
    flex-shrink: 0;
}
.pricing-total-value {
    font-size: 28px;
    font-weight: 800;
    color: var(--custom-primary, #191d93);
    letter-spacing: -0.03em;
    white-space: nowrap;
    line-height: 1.15;
}
.pricing-panel .pricing-total.pricing-total--derived {
    margin-top: 0.28rem;
    padding-top: 0.75rem;
    align-items: center;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: #475569;
    text-transform: none;
    letter-spacing: 0.01em;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-value {
    font-size: 2rem;
    font-weight: 800;
    color: #1e293b;
    letter-spacing: -0.03em;
    line-height: 1.08;
}
.pricing-total-note {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.06rem;
    font-size: 0.66rem;
    line-height: 1.25;
    color: #64748b;
    text-align: right;
}
.pricing-calculation {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.5rem 0;
    margin: 0.375rem 0;
    border-top: 1px solid var(--g200, #e5e7eb);
    border-bottom: 1px solid var(--g200, #e5e7eb);
    font-size: 0.8125rem;
    color: var(--g500, #6b7280);
}
.pricing-calc-formula {
    font-size: 0.8125rem;
}
.pricing-calc-equals {
    font-size: 0.8125rem;
}
.pricing-calc-total {
    font-size: 22px;
    font-weight: 700;
    color: var(--custom-font, #1e293b);
}
@keyframes pricePulse {
    0% { transform: scale(1); color: #111; }
    30% { transform: scale(1.08); color: var(--custom-primary, #191d93); }
    100% { transform: scale(1); color: #111; }
}
.price-pulse {
    animation: pricePulse 0.4s ease-out;
}
.pricing-hero {
    margin-bottom: 0.375rem;
}
.pricing-hero-value {
    display: block;
    font-size: 30px;
    font-weight: 700;
    color: var(--custom-font, #1e293b);
    line-height: 1.1;
}
.pricing-hero-label {
    font-size: 0.75rem;
    color: var(--g500, #6b7280);
}
.pricing-records {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    font-size: 0.76rem;
    color: #334155;
    padding: 0.12rem 0 0.05rem;
    font-weight: 600;
}
.pricing-records span {
    font-weight: 800;
    font-size: 1rem;
    color: #1e293b;
}
.pricing-records--selected span {
    font-weight: 800;
    font-size: 1.1875rem;
    color: #1e293b;
    letter-spacing: -0.02em;
}
.pricing-framing {
    font-size: 0.75rem;
    color: var(--g500, #6b7280);
    font-style: italic;
    margin: 0 0 0.375rem;
    line-height: 1.4;
}
.pricing-note {
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
    font-size: 0.66rem;
    color: #64748b;
    margin: 0.22rem 0 0.24rem;
}
.pricing-info {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}
.pricing-info-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.66rem;
    color: #64748b;
    padding: 0.1rem 0;
    font-weight: 500;
}
.pricing-info-item svg {
    flex-shrink: 0;
    stroke: var(--custom-primary, #191d93) !important;
    width: 12px;
    height: 12px;
}
.pricing-info-item--preview,
.pricing-info-item--fresh {
    padding: 0.16rem 0;
    border-radius: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}
.pricing-info-item--preview {
    font-size: 0.73rem;
    font-weight: 700;
    color: var(--custom-primary, #191d93);
    cursor: pointer;
}
.pricing-info-item--preview:hover,
.pricing-info-item--preview:focus-visible {
    color: #141b84;
    text-decoration: underline;
    text-underline-offset: 2px;
    outline: 2px solid rgba(25,29,147,0.2);
    outline-offset: 2px;
}
.pricing-info-item:not(.pricing-info-item--preview) {
    opacity: 0.84;
}
.pricing-info-item--fresh {
    color: #475569;
}
.pricing-info-item--fresh #pricingDataDate {
    font-weight: 800;
    color: var(--custom-primary, #191d93);
}
.pricing-footer {
    border-top: 1px solid rgba(148, 163, 184, 0.22);
    margin-top: 0.55rem;
    padding-top: 0.5rem;
    opacity: 0.9;
}
.pricing-trust-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.28rem;
}
.pricing-trust-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.24rem;
    font-size: 0.625rem;
    color: #334155;
    white-space: nowrap;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: none;
}
.pricing-trust-chip:nth-child(n+3) {
    opacity: 0.88;
}
.pricing-trust-chip svg {
    flex-shrink: 0;
}
.pricing-trust-chip--award {
    cursor: default;
}
.pricing-trust-chip--award .fa-award {
    color: #f59e0b;
    font-size: 0.8rem;
}
.pricing-cta {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin: 0.45rem 0 0.45rem;
    padding-top: 0.2rem;
}

@media (max-width: 767px) {
    .command-meta-sep {
        display: none;
    }

    .pricing-filter-summary-item,
    .pricing-filter-summary-more {
        width: auto;
        max-width: 100%;
    }

    .pricing-total {
        flex-wrap: wrap;
        gap: 0.45rem;
    }

    .pricing-total-main {
        width: 100%;
        align-items: flex-start;
    }

    .pricing-total-note {
        align-items: flex-start;
        text-align: left;
    }
}
.pricing-cta-primary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.78rem 0.9rem;
    font-size: 0.84rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(180deg, #2026a8 0%, var(--custom-primary, #191d93) 100%);
    border: 1px solid #13187b;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 14px 28px rgba(25,29,147,0.22), 0 0 0 1px rgba(19,24,123,0.06);
    transition: background 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease, border-color 0.12s ease;
}
.pricing-cta-primary::before {
    content: "\2192";
    font-size: 0.95em;
    line-height: 1;
    font-weight: 800;
}
.pricing-cta-primary:hover {
    background: linear-gradient(180deg, #191f9a 0%, #151a86 100%);
    border-color: #0f146a;
    box-shadow: 0 18px 34px rgba(25,29,147,0.26), 0 0 0 1px rgba(15,20,106,0.07);
    color: #fff;
    transform: scale(1.02);
}
.pricing-cta-primary:active {
    transform: scale(0.995);
    box-shadow: 0 4px 10px rgba(25,29,147,0.22);
}
.pricing-cta-primary:disabled,
.pricing-cta-primary[disabled] {
    background: linear-gradient(180deg, #2026a8 0%, var(--custom-primary, #191d93) 100%) !important;
    border-color: #13187b !important;
    color: #fff !important;
    opacity: 1 !important;
    cursor: default;
    transform: none;
    box-shadow: 0 6px 14px rgba(25,29,147,0.24), 0 0 0 1px rgba(19,24,123,0.04);
}
.pricing-cta-secondary {
    background: none;
    border: none;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    padding: 0.24rem 0.18rem;
    margin-top: 0.46rem;
    text-decoration: underline;
    text-underline-offset: 2px;
    line-height: 1.3;
}
.pricing-limit-link:focus-visible {
    outline: 2px solid rgba(25,29,147,0.26);
    outline-offset: 2px;
    border-radius: 6px;
}
.pricing-cta-secondary:hover {
    color: var(--custom-primary, #191d93);
}

#creditExportSummary #creditPackageDropdown .pricing-cta-secondary {
    background: #ffffff;
    border: 1px solid var(--g200, #e2e8f0);
    color: var(--custom-primary, #191d93);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.75rem 0.9rem;
    margin-top: 0;
    text-decoration: none;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

#creditExportSummary #creditPackageDropdown .pricing-cta-secondary:hover {
    background: var(--custom-background-200, #f1f5f9);
    border-color: var(--g300, #cbd5e1);
    color: var(--custom-primary-400, #010483);
}

/* ============================================================
   Pricing-Box Refinement (visuelle Aufwertung, keine Logik)
   ============================================================
   Reine Override-Regeln auf den existierenden .pricing-*-Klassen.
   Markup und IDs bleiben unangetastet. JS-Targets (#payNow, #ctaRecordCount,
   #pricingCalculation, #discountPrice, #pricingDiscountNote, #kpiBonusFields,
   #socialMediaBonusItem, #pricingPreviewTrigger ...) werden nicht beruehrt.
   ============================================================ */

/* --- 0. Titelzeile mit Status-Badge -------------------------------------- */
.pricing-panel-titlebar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 12px;
    flex-wrap: wrap;
}
.pricing-panel-titlebar .pricing-panel-title {
    margin: 0;
    flex: 1 1 auto;
}
.pricing-panel-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px 3px 7px;
    background: transparent;
    border: 1px solid #BBF7D0;
    border-radius: 999px;
    color: #047857;
    font-size: 0.66rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.005em;
    flex-shrink: 0;
    white-space: nowrap;
}
.pricing-panel-status svg {
    width: 11px;
    height: 11px;
    flex-shrink: 0;
}
.pricing-panel-status--available {
    /* leichte "Heart-Beat"-Animation, dezent, einmal alle 4s. */
    animation: pricingPanelStatusPulse 4s ease-in-out infinite;
}
@keyframes pricingPanelStatusPulse {
    0%, 90%, 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
    93%           { box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.18); }
    96%           { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}
@media (prefers-reduced-motion: reduce) {
    .pricing-panel-status--available { animation: none !important; }
}

/* --- 1. Total-Preis-Box: einfacher Flex-Row-Stack, kein Grid-Trick ----- */
/* Layout: Label links, rechts ein Column-Stack mit Preis + Discount-Pill +
   MwSt-Note. Kein display:contents-Hack mehr - dadurch passt die Discount-
   Pill IMMER in ihr eigenes Container-Box und kann nie mehr in andere
   Spalten overflowen. Bei Zoom wickelt sich der Pill-Text einfach auf
   2 Zeilen, ohne den Preis zu beruehren. */
.pricing-panel .pricing-total.pricing-total--derived {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 11px;
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    box-shadow: none;
    margin-top: 12px;
    margin-bottom: 14px;
    flex-wrap: nowrap;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-label {
    flex-shrink: 1;
    min-width: 0;
    font-size: 0.86rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.005em;
    line-height: 1.2;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-main {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    flex-shrink: 0;
    min-width: 0;
    max-width: 60%;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-value {
    font-size: 1.7rem;
    font-weight: 800;
    color: var(--custom-primary, #191d93);
    letter-spacing: -0.035em;
    line-height: 1;
    white-space: nowrap;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-note {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    font-size: 0.68rem;
    color: #64748b;
    line-height: 1.3;
    text-align: right;
    max-width: 100%;
}
.pricing-panel .pricing-total.pricing-total--derived .pricing-total-note > span:not(#pricingDiscountNote) {
    white-space: nowrap;
}
/* Discount-Pill: schmal, bricht bei zu enger Breite an WORT-Grenzen
   (white-space: normal, KEIN overflow-wrap: anywhere - sonst werden
   Buchstaben mitten im Wort zerlegt). Border-Radius leicht abgerundet
   statt voll-pill, damit 2-zeiliger Inhalt nicht weird aussieht. */
.pricing-panel #pricingDiscountNote {
    display: inline-flex;
    align-items: flex-start;
    gap: 5px;
    padding: 2px 8px 2px 7px;
    background: transparent;
    border: 1px solid #BBF7D0;
    border-radius: 6px;
    color: #047857;
    font-weight: 600;
    font-size: 0.62rem;
    line-height: 1.35;
    letter-spacing: 0.005em;
    white-space: normal;
    max-width: 100%;
    align-self: flex-end;
    text-align: left;
}
.pricing-panel #pricingDiscountNote::before {
    content: "";
    flex-shrink: 0;
    width: 5px;
    height: 5px;
    border-radius: 999px;
    background: #10b981;
    margin-top: 4px;
}
/* Wenn Discount-Note vom JS auf display:none gesetzt wird (kein Rabatt),
   soll das Grid nicht trotzdem eine ganze leere zweite Zeile reservieren.
   row-gap bleibt klein, Reihe 2 ist dann leer aber visuell unauffaellig. */

/* --- 2. Datenfelder-Chips ("Inklusive wichtiger Firmendaten") ------------ */
.kpi-bonus {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 10px 0 4px;
    margin-top: 10px;
    border-top: 1px solid #E2E8F0;
    opacity: 1;
}
.kpi-bonus-label {
    flex-basis: 100%;
    font-size: 0.78rem;
    font-weight: 700;
    color: #475569;
    margin: 0;
    letter-spacing: 0.005em;
}
.kpi-bonus-values {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    align-items: stretch;
}
/* Pipes raus: gehoeren ins alte Inline-Layout. Wir lassen die Spans im DOM,
   damit JS (auch wenn aktuell nicht referenziert) sie noch findet. */
.kpi-bonus-sep {
    display: none !important;
}
/* Outlined Chips dezenter: kein Box-Shadow, kein Hover-Lift. Sie sind
   reine Info-Tokens, sollen nicht aktiv wirken. Grosser Gap zwischen
   Icon und Label (16px Flex-gap + 4px svg-margin = ~20px visuell, da der
   SVG-viewBox-Inhalt selbst zentriert sitzt). */
.kpi-bonus-badge {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 3px 12px 3px 11px;
    background: transparent;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    color: #475569;
    font-size: 0.68rem;
    font-weight: 500;
    line-height: 1.3;
    box-shadow: none;
    white-space: nowrap;
}
.kpi-bonus-badge svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    color: var(--custom-primary, #191d93);
    opacity: 0.85;
    margin-right: 2px;
}

/* --- 3. Pricing-Info-Items als auto-fit-Grid mit CI-Indigo-Circles -----
   auto-fit + minmax: 2-Spalten wenn Container >= 270px, sonst 1-Spalte.
   Verhindert dass z.B. "Datenbestand vom 30.04.2026" beim Zoom in der
   Spalte umbricht und das Datum auf einer eigenen Zeile landet. */
.pricing-info {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    column-gap: 12px;
    row-gap: 4px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid #F1F5F9;
}
.pricing-info-item {
    font-size: 0.72rem;
    padding: 0;
    line-height: 1.3;
    color: #334155;
    align-items: center;
    gap: 6px;
    font-weight: 500;
    min-width: 0;
}
/* Alle Bullets cleaner: kleinere, dezente Indigo-Tint-Circles mit
   Indigo-Check innen. Nicht mehr aufdringlich filled, sondern soft. */
.pricing-info-item svg {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0;
    background: rgba(25, 29, 147, 0.08) !important;
    border-radius: 50%;
    padding: 3px;
    color: var(--custom-primary, #191d93) !important;
    stroke: var(--custom-primary, #191d93) !important;
    stroke-width: 2.5;
    box-sizing: border-box;
}
.pricing-info-item--preview {
    font-size: 0.72rem;
    color: #334155 !important;
    font-weight: 500;
    cursor: pointer;
}
.pricing-info-item--preview:hover,
.pricing-info-item--preview:focus-visible {
    color: #1e293b !important;
    text-decoration: underline;
    text-decoration-color: var(--custom-primary, #191d93);
    text-underline-offset: 3px;
    outline: none;
}
.pricing-info-item:not(.pricing-info-item--preview) {
    opacity: 1;
}
/* "Datenbestand vom <DATUM>" - das Datum NIEMALS umbrechen, damit es nicht
   in eine eigene Zeile faellt. white-space: nowrap auf dem Datum allein
   reicht, das Label davor darf umbrechen, wenn es absolut sein muss. */
.pricing-info-item--fresh {
    flex-wrap: nowrap;
}
.pricing-info-item--fresh #pricingDataDate {
    font-weight: 700;
    color: #0f172a;
    white-space: nowrap;
    margin-left: 2px;
}
@media (max-width: 480px) {
    .pricing-info {
        grid-template-columns: 1fr;
        gap: 5px;
    }
}

/* --- 4. Trust-Chips noch subtiler, klare Spaltenbreiten ---------------- */
.pricing-footer {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #F1F5F9;
    opacity: 0.92;
}
.pricing-trust-inline {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 4px 4px;
    align-items: stretch;
}
.pricing-trust-chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 2px;
    padding: 2px 2px;
    font-size: 0.56rem;
    color: #64748b;
    line-height: 1.2;
    background: transparent;
    border: 0;
    border-radius: 6px;
    text-align: center;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
    hyphens: none;
}
.pricing-trust-chip:nth-child(n+3) {
    opacity: 1;
}
.pricing-trust-chip svg,
.pricing-trust-chip .fa-award {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    color: #94a3b8;
    opacity: 1;
    margin-bottom: 1px;
}
.pricing-trust-chip .fa-award {
    font-size: 0.72rem;
    color: #f59e0b;
}
/* Auf zwei Reihen wechseln, wenn 5 Spalten zu eng werden (Container <440px). */
@media (max-width: 480px) {
    .pricing-trust-inline {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px 6px;
    }
    .pricing-trust-chip:nth-child(n+4) {
        grid-column: span 1;
    }
}

/* --- 5. Primary CTA: groesser, Download links, Pfeil rechts, Shine ------- */
.pricing-cta-primary {
    position: relative;
    overflow: hidden;
    padding: 1rem 1rem;
    font-size: 0.95rem;
    font-weight: 800;
    border-radius: 12px;
    letter-spacing: -0.005em;
    box-shadow:
        0 16px 32px rgba(25, 29, 147, 0.26),
        0 1px 2px rgba(19, 24, 123, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
    /* Wir wollen den unicode-Pfeil aus dem alten ::before NICHT mehr.
       Stattdessen Download-Icon links via maskiertes Pseudo. */
    gap: 12px;
}
/* Alten "->" Pseudo-Pfeil entfernen, durch Download-Icon ersetzen. */
.pricing-cta-primary::before {
    content: "";
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><polyline points='7 10 12 15 17 10'/><line x1='12' y1='15' x2='12' y2='3'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><polyline points='7 10 12 15 17 10'/><line x1='12' y1='15' x2='12' y2='3'/></svg>") center / contain no-repeat;
    flex-shrink: 0;
}
/* Pfeil rechts via ::after (CSS-only, ueberlebt JS-innerHTML-Resets). */
.pricing-cta-primary::after {
    content: "";
    width: 16px;
    height: 16px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='12' x2='19' y2='12'/><polyline points='12 5 19 12 12 19'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><line x1='5' y1='12' x2='19' y2='12'/><polyline points='12 5 19 12 12 19'/></svg>") center / contain no-repeat;
    flex-shrink: 0;
    transition: transform 0.18s ease;
}
.pricing-cta-primary:hover::after {
    transform: translateX(3px);
}
/* Dezente Shine-Animation - alle ~6s ein einmaliger Highlight-Run.
   Eigener Layer-Span via ::before NICHT moeglich, weil ::before bereits
   das Download-Icon ist. Stattdessen ein gradient-overlay in der
   Hintergrund-Komposition (ohne extra DOM, ohne JS-Zugriff). */
.pricing-cta-primary {
    background:
        linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.18) 50%, transparent 70%) -200% 0 / 250% 100% no-repeat,
        linear-gradient(180deg, #2026a8 0%, var(--custom-primary, #191d93) 100%);
    animation: pricingCtaShine 6s ease-in-out 1.5s infinite;
}
.pricing-cta-primary:hover {
    background:
        linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.22) 50%, transparent 70%) -200% 0 / 250% 100% no-repeat,
        linear-gradient(180deg, #191f9a 0%, #151a86 100%);
}
@keyframes pricingCtaShine {
    0%, 18%, 100% { background-position: -200% 0, 0 0; }
    28%           { background-position: 200% 0, 0 0; }
}
@media (prefers-reduced-motion: reduce) {
    .pricing-cta-primary { animation: none !important; }
    .pricing-cta-primary:hover::after { transform: none; }
}

/* --- 6. Secondary CTA: outlined Button-Card statt Link-Style ------------- */
.pricing-cta-secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #ffffff;
    border: 1px solid #E2E8F0;
    color: #334155;
    font-size: 0.86rem;
    font-weight: 600;
    padding: 0.72rem 0.9rem;
    margin-top: 8px;
    text-decoration: none;
    border-radius: 12px;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.025);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}
.pricing-cta-secondary:hover {
    background: #F8FAFC;
    border-color: #CBD5E1;
    color: var(--custom-primary, #191d93);
    text-decoration: none;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.05);
    transform: translateY(-1px);
}
.pricing-cta-secondary svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: currentColor;
}

/* --- 7. Filter-Chips oben ("Ihre Auswahl" - JS-rendered, nur Styling) --- */
.pricing-filter-summary--selection {
    margin-bottom: 14px;
}
.pricing-filter-summary--selection .pricing-filter-summary-item {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 999px;
    padding: 6px 12px;
    box-shadow: 0 1px 1px rgba(15, 23, 42, 0.025);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.pricing-filter-summary--selection .pricing-filter-summary-item:hover {
    border-color: #CBD5E1;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05);
    transform: translateY(-1px);
}
.pricing-filter-summary--selection .pricing-filter-summary-value {
    font-weight: 600;
    color: #1f2937;
}

/* --- 8. CTA-Zahl visuell integrieren ------------------------------------ */
/* Die ctaRecordCount-Zahl bekommt einen leichten "Pill"-Hintergrund, damit
   sie sich klar als wichtigste Information im Button-Text abhebt, ohne wie
   ein Fremdkoerper zu wirken. Greift nur auf den Span im Pay-Now-Button. */
#payNow #ctaRecordCount {
    display: inline-block;
    padding: 1px 8px;
    margin: 0 1px;
    background: rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    letter-spacing: 0.005em;
}

/* --- 9. Atmung zwischen Sektionen + Hero-Preis kompakter ---------------- */
.pricing-panel .pricing-unit-hero--lead {
    margin-top: 8px;
    margin-bottom: 6px;
}
/* "Pro Datensatz"-Preis etwas kleiner als zuvor (war 2rem). */
.pricing-panel .pricing-unit-hero--lead .pricing-unit-hero-inline .pricing-unit-hero-value {
    font-size: 1.65rem;
    font-weight: 800;
    letter-spacing: -0.03em;
}
.pricing-panel .pricing-unit-hero--lead .pricing-unit-hero-inline .pricing-unit-hero-label {
    font-size: 0.74rem;
}
.pricing-panel .pricing-records--selected {
    margin-top: 4px;
    font-size: 0.74rem;
}
.pricing-panel .pricing-limit-control {
    margin-top: 10px;
    margin-bottom: 4px;
}
.pricing-panel .pricing-cta {
    margin: 14px 0 0;
    gap: 6px;
}
.pricing-panel .pricing-bonus-fields {
    margin-top: 2px;
}
/* Mehr Atmung zwischen den Sektionen: Bonus-Block und Bullets bekommen
   etwas mehr Margin, damit nichts mehr "stuffed" wirkt. */
.pricing-panel .kpi-bonus {
    margin-top: 14px;
    padding-top: 12px;
}
.pricing-panel .pricing-info {
    margin-top: 12px;
    padding-top: 10px;
}

/* --- 10. PDF-Angebot-Button: deutlich kompakter ------------------------- */
.pricing-cta-secondary {
    padding: 0.4rem 0.7rem;
    font-size: 0.72rem;
    font-weight: 600;
    border-radius: 8px;
    gap: 6px;
    margin-top: 3px;
}
.pricing-cta-secondary svg {
    width: 12px;
    height: 12px;
}

/* --- 11. Primary CTA: etwas kompakter, damit Gesamthoehe stimmt --------- */
.pricing-cta-primary {
    padding: 0.85rem 0.95rem;
    font-size: 0.88rem;
    border-radius: 11px;
    gap: 10px;
}
.pricing-cta-primary::before {
    width: 16px;
    height: 16px;
}
.pricing-cta-primary::after {
    width: 14px;
    height: 14px;
}

/* ============================================================
   Search-Screen Refinement v2 (Pixel-Genau, SaaS-Cleanup)
   ============================================================
   Ziel: Linke Result-Spalte sieht aus wie aus einem Guss mit der Pricing-
   Box rechts. Card-in-Card-Architektur wie auf der Inspiration:

   [Outer Card .results-selection-panel]
     [Action-Bar Toolbar]                                          (eigene
   Visual-Card via .search-action-bar)
     [VORSCHLAG-Box .ai-search-result-feedback]                  (eigene Card,
   nur zwischendurch sichtbar)
     [Datenverfuegbarkeit-Sektion .quality-section]
        Section-Titel: DATENVERFUEGBARKEIT IN IHRER AUSWAHL
        Intro-Helper-Text
        Liste .refine-block--select - Inset-Card mit Trennlinien
        Section-Titel: DATENQUALITAET OPTIMIEREN
        Toggle-Grid - Inset-Card mit 2 Spalten
     [Reset-Link "Neue Suche starten"]

   Konsistente Design-Tokens:
   - Border-Radius: 12px (Card), 8px (Inner), 6px (Mikro)
   - Border-Color: #E2E8F0 (Card), #F1F5F9 (Trennlinien)
   - Shadow: 0 1px 2px rgba(15,23,42,0.04) (Card-Default),
             0 4px 12px rgba(15,23,42,0.06) (Hover)
   - Padding: 18px (Card outer), 14-16px (Card inner), 12-14px (Row)
   - Spacing: 16px zwischen Cards
   - Indigo-Akzent: var(--custom-primary, #191d93) bei Primary/Active

   Markup und JS-IDs bleiben unangetastet. Pure visual.
   ============================================================ */

/* --- 0. Outer Card Container fuer den linken Result-Bereich ------------- */
.results-selection-panel {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 14px;
    padding: 14px 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

/* --- 1. Action-Bar: kompakte Toolbar als Tab-Group ---------------------- */
.search-action-bar {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 0 12px;
    margin: 0 0 12px;
    border-bottom: 1px solid #F1F5F9;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}
.search-action-bar-divider,
.search-action-bar-divider--after-primary {
    display: none !important;
}
.search-action-bar .search-action-bar-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    padding: 0.45rem 0.85rem;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    border-width: 1px;
    border-style: solid;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}
.search-action-bar .search-action-bar-btn svg,
.search-action-bar .search-action-bar-btn .search-action-bar-btn-icon {
    width: 14px;
    height: 14px;
    margin-right: 6px;
    flex-shrink: 0;
}
.search-action-bar .search-action-bar-text-short {
    display: none;
}

@media (max-width: 768px) {
    .search-action-bar .search-action-bar-text-full {
        display: none;
    }

    .search-action-bar .search-action-bar-text-short {
        display: inline;
    }
}
/* Primary: Datenvorschau ansehen */
.search-action-bar .search-action-bar-primary {
    background: var(--custom-primary, #191d93);
    color: #FFFFFF;
    border-color: var(--custom-primary, #191d93);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.2) inset,
        0 4px 14px rgba(25, 29, 147, 0.28);
}
.search-action-bar .search-action-bar-primary:hover:not(.disabled) {
    background: #141b84;
    color: #FFFFFF;
    border-color: #141b84;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.22) inset,
        0 6px 18px rgba(25, 29, 147, 0.34);
    transform: translateY(-1px);
}
.search-action-bar .search-action-bar-primary.disabled {
    background: var(--custom-primary, #191d93);
    color: #FFFFFF;
    border-color: var(--custom-primary, #191d93);
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
    box-shadow: 0 2px 6px rgba(25, 29, 147, 0.14);
}
/* Sekundaer: Suche speichern + Gespeicherte Suchen */
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph {
    background: #FFFFFF;
    color: #475569;
    border-color: #E2E8F0;
    box-shadow: none;
}
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph svg,
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph .search-action-bar-btn-icon {
    color: #94a3b8;
    opacity: 1;
}
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph:hover:not(.disabled) {
    background: #F8FAFC;
    color: var(--custom-primary, #191d93);
    border-color: #CBD5E1;
}
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph:hover:not(.disabled) svg,
.search-action-bar .search-action-bar-btn.search-action-bar-ghost.search-action-bar-deemph:hover:not(.disabled) .search-action-bar-btn-icon {
    color: var(--custom-primary, #191d93);
}

/* --- 2. Datenverfuegbarkeit + Datenqualitaet Section ------------------- */
.quality-section {
    margin: 0;
    padding: 0;
}

/* Sektionstitel (DATENVERFUEGBARKEIT, DATENQUALITAET): einheitliches Label-
   Format wie auf der Inspiration. */
.quality-section .quality-section-title {
    display: block;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 4px;
    padding: 0;
}
/* DATENQUALITAET OPTIMIEREN - Titel verschmilzt visuell mit der Toggle-Card
   darunter. Border + BG identisch zur Card, kein Bottom-Border, keine
   Bottom-Radius. Die Grid-Card direkt darunter spiegelt das (kein Top-
   Border, keine Top-Radius) - so entsteht eine Card mit Header.
   Identische Optik wie die Datenverfuegbarkeits-Card weiter oben. */
.quality-section #qualityOptimizeTitle {
    display: block !important;
    margin: 12px 0 0 !important;
    padding: 9px 14px !important;
    font-size: 0.68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    color: #64748b !important;
    text-transform: uppercase;
    background: #FAFBFC;
    border: 1px solid #EDF0F4;
    border-bottom: 0;
    border-radius: 10px 10px 0 0;
}
/* Wenn DATENQUALITAET-Titel sichtbar ist, schluss verbinden mit Toggle-Grid. */
.quality-section #qualityOptimizeTitle + #qualityOptimizeGrid.refine-quality-grid {
    margin-top: 0;
    border-top: 0;
    border-radius: 0 0 10px 10px;
}
.quality-section .quality-section-intro {
    margin: 0 0 8px;
    font-size: 0.74rem;
    line-height: 1.4;
    color: #64748b;
    font-weight: 400;
    max-width: none;
}

/* --- 2a. Datenverfuegbarkeit-Liste: Inset-Card, dicht und scannbar ----- */
.refine-block.refine-block--select {
    background: #FAFBFC;
    border: 1px solid #EDF0F4;
    border-radius: 10px;
    padding: 0 12px;
    box-shadow: none;
    gap: 0;
    max-width: none;
}
/* Grid: [checkbox/marker] [icon] [copy] [avail] - 4 Spalten. Sehr kompakt
   wie auf der Inspiration. */
.refine-checkbox-item {
    display: grid;
    grid-template-columns: auto 22px 1fr max-content;
    align-items: center;
    gap: 0 10px;
    padding: 7px 0;
    border-bottom: 1px solid #EDF0F4;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 500;
    color: #1f2937;
    transition: background 0.12s ease;
}
.refine-checkbox-item:last-child {
    border-bottom: none;
}
.refine-checkbox-item:hover:not(.refine-checkbox-item--static) {
    background: #F2F5FA;
    box-shadow: none;
    border-radius: 0;
}
.refine-checkbox-item:active {
    background: #EBEFF7;
}
/* Static-Marker (Adressdaten mit Anschrift) - immer "an", kein Click. */
.refine-checkbox-item--static {
    cursor: default;
    opacity: 1;
}
.refine-checkbox-item--static:hover,
.refine-checkbox-item--static:active {
    background: transparent;
}
.refine-static-marker {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    background: var(--custom-primary, #191d93);
    box-shadow:
        inset 0 0 0 4px #ffffff,
        0 0 0 1px var(--custom-primary, #191d93);
    border: none;
}
.refine-cb {
    width: 18px;
    height: 18px;
    accent-color: var(--custom-primary, #191d93);
    transform: scale(1.05);
    transform-origin: center;
    cursor: pointer;
}
/* Icon inline ohne Container-Box, kompakt 16px in 22px-Slot. */
.refine-checkbox-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 0;
    background: transparent;
    border: 0;
    color: #64748b;
    flex-shrink: 0;
    transition: color 0.15s ease;
}
.refine-checkbox-icon svg {
    width: 16px;
    height: 16px;
    stroke-width: 1.8;
}
/* Aktive/statische Reihe: Icon-Tint in CI-Indigo. */
.refine-checkbox-item:has(.refine-cb:checked) .refine-checkbox-icon,
.refine-checkbox-item--static .refine-checkbox-icon {
    color: var(--custom-primary, #191d93);
}
.refine-checkbox-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    max-width: none;
    align-items: flex-start;
}
.refine-checkbox-title {
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    line-height: 1.2;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-checkbox-title {
    color: #0f172a !important;
    font-weight: 600 !important;
}
/* Avail-Counter rechts: groesser, prominenter, in dunkler Farbe. */
.refine-avail {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 3px;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.2;
    text-align: right;
}
.refine-avail-num {
    font-size: 0.86rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}
.refine-checkbox-item:has(.refine-cb:checked) .refine-avail-num {
    color: var(--custom-primary, #191d93);
}
.refine-avail-label {
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 500;
}
.refine-avail-note {
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 400;
    font-style: normal;
}
.refine-avail--loading {
    opacity: 0.5;
}

/* --- 2b. Datenqualitaet-Toggles: identische Optik zur Datenverfuegbarkeits-
   Card (gleicher BG/Border/Radius), klar klickbar via Aktiv-Tint. -------- */
#qualityOptimizeGrid.refine-quality-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px 14px;
    background: #FAFBFC;
    border: 1px solid #EDF0F4;
    border-radius: 10px;
    padding: 6px 12px;
    box-shadow: none;
    margin-top: 4px;
}
.refine-quality-cell {
    min-width: 0;
}
.refine-quality-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 5px 4px;
    border-radius: 6px;
    margin: 0;
    transition: background 0.12s ease;
}
.refine-quality-label:hover {
    background: rgba(25, 29, 147, 0.04);
}
/* Schrift einheitlich mit refine-checkbox-title (Datenverfuegbarkeits-Liste). */
.refine-quality-text {
    font-size: 0.78rem;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.3;
    flex: 1 1 auto;
}
/* Aktive Toggles: nur der Switch selbst wird blau, kein Cell-BG-Tint.
   Text leicht dunkler fuer subtiles Active-Feedback. */
.refine-quality-cell:has(.toggle-switch-input:checked) .refine-quality-text {
    color: #0f172a;
}
/* Toggles kleiner zurueck (war: 0.78 -> jetzt 0.62 = ~17x32px = kompakt) */
#qualityOptimizeGrid .toggle-switch.toggle-switch-sm {
    transform: scale(0.62);
    transform-origin: left center;
    margin-right: -8px;
}
.refine-quality-label .filter-info-icon-wrapper {
    margin-left: auto;
    flex-shrink: 0;
    opacity: 0.7;
    transition: opacity 0.12s ease;
}
.refine-quality-label:hover .filter-info-icon-wrapper {
    opacity: 1;
}

/* --- 3. VORSCHLAG-Box als saubere Action-Card (KI-Bereich) -------------
   WICHTIG: __inner ist im Original-CSS als flex-row angelegt (icon links,
   body rechts). Wir overriden NUR Padding/Spacing, NICHT die Direction. */
.ai-search-result-feedback {
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    margin: 0 0 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ai-search-result-feedback:hover {
    border-color: #CBD5E1;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.05);
}
/* Compact-Reopen-Modus: wenn die Box nur den Reopen-Button enthaelt
   (User hat sie ueber X geschlossen), Card-Optik zurueckfahren - sonst
   schwebt die kleine Pille in einem riesigen leeren Karton. */
.ai-search-result-feedback:has(> .ai-search-result-feedback__reopen):not(:has(.ai-search-result-feedback__inner)) {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    margin: 0 0 8px;
}
.ai-search-result-feedback:has(> .ai-search-result-feedback__reopen):not(:has(.ai-search-result-feedback__inner)):hover {
    border: 0;
    box-shadow: none;
}
.ai-search-result-feedback .ai-search-result-feedback__inner {
    padding: 12px 40px 12px 14px;
    gap: 10px;
    border-radius: 12px;
    border-color: #E2E8F0;
    box-shadow: none;
    background: transparent;
}
/* VORSCHLAG-Icon: identisch zum Discovery-Hero-Avatar (voll-indigo Kreis,
   weisses Atom-Orbit-Icon innen, gradient-Hintergrund + sanftes Pulsieren).
   Verbindet visuell Discovery <-> KI-Result. */
.ai-search-result-feedback__icon {
    width: 24px;
    height: 24px;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #191d93 0%, #4f46e5 45%, #7c3aed 100%) !important;
    color: #FFFFFF !important;
    margin-top: 0;
    box-shadow:
        0 6px 14px -4px rgba(79, 70, 229, 0.55),
        0 2px 4px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    animation: discovery-hero-sparkle-pulse 2.4s ease-in-out infinite;
}
.ai-search-result-feedback__icon svg {
    width: 13px;
    height: 13px;
}
@media (prefers-reduced-motion: reduce) {
    .ai-search-result-feedback__icon {
        animation: none !important;
    }
}
/* Sonder-Tints fuer warning/empty bleiben erhalten - aber als Filled-Circle. */
.ai-search-result-feedback--warning .ai-search-result-feedback__icon {
    background: #f59e0b !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 6px rgba(245, 158, 11, 0.25);
}
.ai-search-result-feedback--empty .ai-search-result-feedback__icon {
    background: #ef4444 !important;
    color: #FFFFFF !important;
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.25);
}
.ai-search-result-feedback__body {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
    min-width: 0;
}
.ai-search-result-feedback__body > *:first-child {
    margin-top: 0;
}
.ai-search-result-feedback__text {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.4;
    color: #334155;
}
/* Vorschlag-Zeile: default kompakt einzeilig, erweitert lesbar mehrzeilig. */
.ai-search-result-feedback__suggestions {
    display: flex;
    align-items: center;
    gap: 6px 8px;
    flex-wrap: wrap;
    margin: 0;
    min-width: 0;
    max-width: 100%;
}
.ai-search-result-feedback__suggestions-list {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
    flex: 1 1 auto;
    overflow: visible;
}
.ai-search-result-feedback__suggestions-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    background: rgba(25, 29, 147, 0.08);
    border: 1px solid rgba(25, 29, 147, 0.16);
    border-radius: 999px;
    color: var(--custom-primary, #191d93);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.2;
    flex-shrink: 0;
}
/* Suggestion-Chips: subtile Add-Buttons. Bewusst ZURUECKHALTEND, damit sie
   nicht mit den filled Filter-Pills oben um Aufmerksamkeit konkurrieren.
   Das + signalisiert "kann hinzugefuegt werden". Hover hebt sie dezent. */
.ai-search-result-feedback__suggestion {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px 4px 8px;
    border-radius: 8px;
    font-size: 0.76rem;
    font-weight: 500;
    color: var(--custom-primary, #191d93);
    background: transparent;
    border: 1px solid rgba(25, 29, 147, 0.12);
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
    line-height: 1.25;
    white-space: nowrap;
    max-width: min(100%, 340px);
    min-width: 0;
    overflow: hidden;
    text-decoration: none;
    text-align: left;
    flex: 0 0 auto;
}
.ai-search-result-feedback__suggestion-label-main {
    display: inline-block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
}
.ai-search-result-feedback__suggestion-label-action {
    flex-shrink: 0;
    text-decoration: none;
    white-space: nowrap;
    font-weight: inherit;
    color: inherit;
}
.ai-search-result-feedback__suggestion-extra {
    display: none !important;
}
.ai-search-result-feedback__suggestions--expanded {
    flex-wrap: wrap;
    align-items: flex-start;
}
.ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestions-list {
    flex-wrap: wrap;
    overflow: visible;
    align-items: flex-start;
}
.ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestion-extra {
    display: inline-flex !important;
}
.ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestion {
    align-items: flex-start;
    white-space: normal;
    max-width: min(100%, 360px);
    overflow: visible;
}
.ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestion-label-main {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
}
.ai-search-result-feedback__suggestions-actions {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    flex: 0 0 auto;
}
.ai-search-result-feedback__suggestions-action {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 4px 9px;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.25;
    cursor: pointer;
    white-space: nowrap;
}
.ai-search-result-feedback__suggestions-action:hover,
.ai-search-result-feedback__suggestions-action:focus-visible {
    background: rgba(15, 23, 42, 0.05);
    color: #0f172a;
    outline: 2px solid rgba(25, 29, 147, 0.28);
    outline-offset: 2px;
}
.ai-search-result-feedback__suggestions-action:disabled {
    opacity: 0.65;
    cursor: wait;
}
.ai-search-result-feedback__suggestions-load-more {
    display: none;
    background: var(--custom-primary, #191d93);
    border-color: var(--custom-primary, #191d93);
    color: #fff;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(25, 29, 147, 0.14);
}
.ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestions-load-more {
    display: inline-flex;
}
.ai-search-result-feedback__suggestions-load-more:hover,
.ai-search-result-feedback__suggestions-load-more:focus-visible {
    background: #141b84;
    border-color: #141b84;
    color: #fff;
}
.ai-search-result-feedback__suggestions-toggle {
    color: #64748b;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.ai-search-result-feedback__suggestions-toggle:hover,
.ai-search-result-feedback__suggestions-toggle:focus-visible {
    color: #334155;
    text-decoration: underline;
}
@media (max-width: 767.98px) {
    .ai-search-result-feedback__suggestions {
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .ai-search-result-feedback__suggestions-list {
        order: 3;
        flex: 1 1 100%;
        flex-wrap: wrap;
        overflow: visible;
        align-items: flex-start;
    }
    .ai-search-result-feedback__suggestions-actions {
        margin-left: auto;
    }
    .ai-search-result-feedback__suggestion {
        max-width: 100%;
        white-space: normal;
        overflow: visible;
    }
    .ai-search-result-feedback__suggestion-label-main {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: anywhere;
    }
}
.ai-search-result-feedback__suggestion::before {
    content: "+";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 11px;
    height: 11px;
    color: rgba(25, 29, 147, 0.55);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1;
    transition: color 0.12s ease;
}
.ai-search-result-feedback__suggestion:hover {
    background: rgba(25, 29, 147, 0.05);
    border-color: rgba(25, 29, 147, 0.3);
    color: #141b84;
    text-decoration: none;
}
.ai-search-result-feedback__suggestion:focus-visible {
    background: rgba(25, 29, 147, 0.05);
    border-color: rgba(25, 29, 147, 0.35);
    color: #141b84;
    outline: 2px solid rgba(25, 29, 147, 0.28);
    outline-offset: 2px;
    text-decoration: none;
}
.ai-search-result-feedback__suggestion:hover::before {
    color: var(--custom-primary, #191d93);
}
/* Separator-Punkte raus: Chips haben eigenen visuellen Gap. */
.ai-search-result-feedback__suggestions-sep {
    display: none !important;
}

/* Mode-Toggle-Wrapper enthaelt Rueckgaengig + KI-Assistent + Auswahl
   analysieren als EINE Reihe (siehe JS-Edit). */
.ai-search-result-feedback__mode-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}
/* Sekundaer-Buttons (Rueckgaengig + Auswahl analysieren): outlined-Stil. */
.ai-search-result-feedback__undo,
.ai-search-result-feedback__mode {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0.4rem 0.75rem;
    border-radius: 8px;
    font-size: 0.76rem;
    font-weight: 600;
    line-height: 1.2;
    background: #FFFFFF;
    border: 1px solid #E2E8F0;
    color: #475569;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
    margin: 0;
}
.ai-search-result-feedback__undo:hover,
.ai-search-result-feedback__mode:hover {
    background: #F8FAFC;
    color: var(--custom-primary, #191d93);
    border-color: #CBD5E1;
}
.ai-search-result-feedback__undo svg,
.ai-search-result-feedback__mode svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    color: #94a3b8;
    transition: color 0.15s ease;
}
.ai-search-result-feedback__undo:hover svg,
.ai-search-result-feedback__mode:hover svg {
    color: var(--custom-primary, #191d93);
}
/* KI-Assistent + Auswahl analysieren behalten beide den weissen Outlined-
   Default. Aktiv-State (Slide-in offen / Analyze-Modus aktiv) wechselt zu
   filled Indigo - so wirken die zwei Buttons als gleichwertige Toggle-Tabs. */
.ai-search-result-feedback__mode.is-active,
.ai-search-result-feedback__mode--primary.is-active {
    background: var(--custom-primary, #191d93) !important;
    color: #FFFFFF !important;
    border-color: var(--custom-primary, #191d93) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.2) inset,
        0 3px 10px rgba(25, 29, 147, 0.24) !important;
}
.ai-search-result-feedback__mode.is-active:hover,
.ai-search-result-feedback__mode--primary.is-active:hover {
    background: #141b84 !important;
    color: #FFFFFF !important;
    border-color: #141b84 !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.22) inset,
        0 5px 14px rgba(25, 29, 147, 0.3) !important;
    transform: translateY(-1px);
}
.ai-search-result-feedback__mode.is-active svg,
.ai-search-result-feedback__mode--primary.is-active svg {
    color: #FFFFFF !important;
}
/* Dismiss-X oben rechts in der Card */
.ai-search-result-feedback__dismiss {
    background: transparent;
    border: 0;
    color: #94a3b8;
    padding: 4px;
    border-radius: 6px;
    cursor: pointer;
    transition: color 0.12s ease, background 0.12s ease;
    position: absolute;
    top: 8px;
    right: 8px;
}
.ai-search-result-feedback__dismiss:hover {
    color: #475569;
    background: #F1F5F9;
}

/* --- 3a. "Alle Filter entfernen"-Button mit Trash-Icon ------------------ */
.filter-chips-clear {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px;
    background: transparent;
    border: 0;
    color: #94a3b8;
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    border-radius: 6px;
    transition: color 0.12s ease, background 0.12s ease;
}
.filter-chips-clear:hover {
    color: #ef4444;
    background: #FEF2F2;
}
.filter-chips-clear svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
    opacity: 0.85;
}

/* --- 4. "Neue Suche starten"-Reset-Link --------------------------------- */
.quality-reset-link {
    margin-top: 16px;
    padding: 6px 0;
    font-size: 0.76rem;
    font-weight: 500;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
}
.quality-reset-link::before {
    content: "";
    width: 13px;
    height: 13px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='1 4 1 10 7 10'/><path d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='1 4 1 10 7 10'/><path d='M3.51 15a9 9 0 1 0 2.13-9.36L1 10'/></svg>") center / contain no-repeat;
}
.quality-reset-link:hover:not(.disabled) {
    color: var(--custom-primary, #191d93);
    text-decoration: none;
}
.quality-reset-link:hover:not(.disabled)::before {
    background: var(--custom-primary, #191d93);
}

/* --- 5. Stats-Expect-Hint dezenter (kommt nach der Liste) --------------- */
.stats-expect-hint {
    margin-top: 6px;
    padding: 8px 12px;
    background: #FAFBFC;
    border: 1px solid #EDF0F4;
    border-radius: 8px;
    font-size: 0.72rem;
    color: #64748b;
}

/* --- 6. Result-Count-Headliner: kompakt aber prominent ----------------- */
.command-headline {
    padding-bottom: 12px;
    margin-bottom: 14px;
    border-bottom: 1px solid #EDF0F4;
}
.command-headline-row {
    align-items: baseline;
    gap: 4px 10px;
    margin-bottom: 4px;
}
.command-headline-count {
    font-size: 2.3rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;
}
.command-headline-label {
    font-size: 0.95rem;
    font-weight: 600;
    color: #334155;
    line-height: 1.25;
}
.command-headline-subtitle {
    font-size: 0.82rem;
    font-weight: 400;
    color: #64748b;
    margin-top: 2px;
}
.command-headline-meta {
    margin-top: 6px;
    font-size: 0.74rem;
    color: #64748b;
}
/* Calendar-Icon vor "Datenbestand zuletzt aktualisiert" - matcht Inspiration. */
.command-meta-date--fresh {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    font-weight: 500;
}
.command-meta-date--fresh::before {
    content: "";
    width: 13px;
    height: 13px;
    background: currentColor;
    flex-shrink: 0;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='4' width='18' height='18' rx='2' ry='2'/><line x1='16' y1='2' x2='16' y2='6'/><line x1='8' y1='2' x2='8' y2='6'/><line x1='3' y1='10' x2='21' y2='10'/></svg>") center / contain no-repeat;
}
.command-meta-date--fresh #dataUpdateDate {
    color: #0f172a;
    font-weight: 700;
}

/* ============================================================
   Conversion Loader: Activity Feed
   ============================================================ */
.loading-activity {
    padding: 0.4rem 0 0.5rem;
}
.loading-activity-log {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.loading-progress-bar {
    height: 2px;
    background: rgba(148,163,184,0.18);
    border-radius: 3px;
    margin: 0.5rem 0 0.65rem;
    overflow: hidden;
}
.loading-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--custom-primary, #191d93), #4f46e5);
    border-radius: 3px;
    width: 0%;
    position: relative;
    transition: width 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}
.loading-progress-fill::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.08) 45%, rgba(255,255,255,0.14) 50%, rgba(255,255,255,0.08) 55%, transparent 100%);
    background-size: 180% 100%;
    animation: search3LoaderSheen 4.8s linear infinite;
    pointer-events: none;
    border-radius: 3px;
}
.activity-step {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.3rem 0;
    animation: activityStepIn 0.22s ease both;
    position: relative;
}
.activity-step::before {
    display: none;
}
.activity-step:last-child::before { display: none; }
.activity-dot {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 2px;
    transition: all 0.35s ease;
}
.activity-dot--active {
    background: var(--custom-primary, #191d93);
    box-shadow: 0 0 0 3px rgba(25,29,147,0.15);
    animation: activityPulse 1.2s ease-in-out infinite;
}
.activity-dot--done {
    background: #22c55e;
    box-shadow: none;
    animation: none;
}
.activity-dot--done + .activity-step-text .activity-check {
    display: inline;
}
.activity-step-text {
    font-size: 0.8rem;
    font-weight: 500;
    color: #334155;
    line-height: 1.35;
}
.activity-step--current .activity-step-text {
    color: #0f172a;
    font-weight: 600;
}
.activity-step:not(.activity-step--current) .activity-step-text {
    color: #64748b;
}
.activity-check {
    display: none;
    color: #22c55e;
    margin-left: 0.3rem;
    font-size: 0.75rem;
}
@keyframes activityStepIn {
    0% { opacity: 0; transform: translateY(-3px); }
    100% { opacity: 1; transform: translateY(0); }
}
@keyframes activityPulse {
    0%, 100% { box-shadow: 0 0 0 3px rgba(25,29,147,0.1); }
    50% { box-shadow: 0 0 0 5px rgba(25,29,147,0.2); }
}
@keyframes search3LoaderSheen {
    0% { background-position: 120% 0; }
    100% { background-position: -120% 0; }
}

/* ============================================================
   Conversion Loader: Live Stats during Loading
   ============================================================ */
.activity-live-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1rem;
    padding: 0.5rem 0 0.15rem;
    margin-left: 1.65rem;
    animation: activityStepIn 0.3s ease both;
}
.live-stat {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
}
.live-stat-icon {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.live-stat-icon--on { background: #22c55e; box-shadow: 0 0 3px rgba(34,197,94,0.4); }
.approx-pulse {
    display: inline-block;
    vertical-align: baseline;
    color: #64748b;
    font-weight: 600;
    letter-spacing: 0.08em;
    animation: dotFade 1.4s ease-in-out infinite;
}
.approx-pulse::after { content: '\2026'; }
@keyframes dotFade {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.7; }
}
.kpi-loading-dots {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    vertical-align: middle;
}
.kpi-loading-dots span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #94a3b8;
    animation: kpiDotBounce 1.2s ease-in-out infinite;
}
.kpi-loading-dots span:nth-child(2) { animation-delay: 0.15s; }
.kpi-loading-dots span:nth-child(3) { animation-delay: 0.3s; }
.kpi-chip .approx-pulse { font-size: inherit; }

.kpi-chip-lbl--loading {
    font-size: 0.72rem;
    opacity: 0.7;
}

/* Collapsed Activity Feed (Phase 2) */
.loading-activity--collapsed {
    max-height: 36px;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.3s ease;
}
.loading-activity--collapsed .loading-activity-log,
.loading-activity--collapsed .loading-activity-preview,
.loading-activity--collapsed .loader-presell,
.loading-activity--collapsed .loading-progress-bar {
    display: none !important;
}
.collapsed-status {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.82rem;
    color: #4b5563;
    padding: 0.4rem 0;
}
.collapsed-status .mini-spinner {
    width: 14px; height: 14px;
    border: 2px solid #e5e7eb;
    border-top-color: var(--custom-primary, #191d93);
    border-radius: 50%;
    animation: calc-spin 0.8s linear infinite;
    flex-shrink: 0;
}

/* Button Pop-Trigger (Phase 2 Conversion-Anker) */
@keyframes ctaPop {
    0%   { transform: scale(1); box-shadow: 0 2px 8px rgba(25,29,147,0.15); }
    40%  { transform: scale(1.035); box-shadow: 0 4px 20px rgba(25,29,147,0.35); }
    100% { transform: scale(1); box-shadow: 0 2px 8px rgba(25,29,147,0.15); }
}
.cta-pulse {
    animation: ctaPop 0.3s ease-out;
}

/* Button Vertrauens-Subline (unter dem Button) */
.cta-verify-hint {
    font-size: 0.72rem;
    color: #4b5563;
    margin-top: 0.35rem;
    text-align: center;
    line-height: 1.3;
    transition: opacity 0.3s ease;
}
.cta-verify-sep {
    margin: 0 0.15rem;
    opacity: 0.5;
}
.cta-mini-trust {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.35rem;
    font-size: 0.68rem;
    color: #6b7280;
}
.cta-mini-trust-item {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}
.cta-mini-trust-item svg {
    color: var(--custom-primary, #191d93);
    opacity: 0.7;
}

/* Erwartungshinweis unter KPI-Strip */
.stats-expect-hint {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: #4b5563;
    padding: 0.35rem 0 0.15rem;
}
.stats-expect-hint.is-loading {
    color: #475569;
}
.stats-expect-hint svg {
    flex-shrink: 0;
    color: #16a34a;
}
.stats-expect-hint.is-loading svg {
    color: var(--custom-primary, #191d93);
}

@keyframes refineAvailPulse {
    0% { background-position: 100% 0; opacity: 0.72; }
    50% { opacity: 1; }
    100% { background-position: -100% 0; opacity: 0.72; }
}

/* Zahlen-Reveal Animation */
@keyframes statReveal {
    0%   { transform: scale(1.03); opacity: 0.6; }
    100% { transform: scale(1); opacity: 1; }
}
.stat-reveal {
    animation: statReveal 0.15s ease-out;
}
.headline-loading-dots {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    vertical-align: middle;
}
.headline-loading-dots span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--custom-primary, #191d93);
    opacity: 0.3;
    animation: kpiDotBounce 1.2s ease-in-out infinite;
}
.headline-loading-dots span:nth-child(2) { animation-delay: 0.15s; }
.headline-loading-dots span:nth-child(3) { animation-delay: 0.3s; }
@keyframes kpiDotBounce {
    0%, 60%, 100% { opacity: 0.2; transform: scale(0.8); }
    30% { opacity: 0.7; transform: scale(1); }
}
.pay-btn-pulse {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.8);
    animation: payPulse 1s ease-in-out infinite;
    margin-right: 2px;
    vertical-align: middle;
}
@keyframes payPulse {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 1; }
}
@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ============================================================
   Conversion Loader: Inline Preview (inside Activity)
   ============================================================ */
.loading-activity-preview {
    padding: 0.5rem 0 0.25rem;
    margin-left: 1.65rem;
    animation: activityStepIn 0.35s ease both;
}
.loading-activity-preview-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.45rem;
}
.inline-preview-cards {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.preview-card {
    flex: 1 1 0;
    min-width: 155px;
    max-width: 280px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.65rem 0.8rem;
    animation: previewCardIn 0.35s ease both;
}
.preview-card:nth-child(2) { animation-delay: 0.08s; }
.preview-card:nth-child(3) { animation-delay: 0.16s; }
@keyframes previewCardIn {
    0% { opacity: 0; transform: translateY(6px); }
    100% { opacity: 1; transform: translateY(0); }
}
.preview-card-name {
    font-size: 0.82rem;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.preview-card-meta {
    font-size: 0.7rem;
    color: #64748b;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.preview-card-dots {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0.4rem;
}
.preview-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}
.preview-dot--on { background: #22c55e; box-shadow: 0 0 3px rgba(34,197,94,0.4); }
.preview-dot--off { background: #d1d5db; }

@media (max-width: 576px) {
    .inline-preview-cards {
        flex-direction: column;
    }
    .preview-card {
        max-width: 100%;
    }
}

/* ============================================================
   Conversion Loader: Progressive Reveal
   ============================================================ */
.count-reveal {
    animation: countReveal 0.5s ease-out;
}
@keyframes countReveal {
    0% { opacity: 0.3; transform: scale(0.95); }
    60% { transform: scale(1.03); }
    100% { opacity: 1; transform: scale(1); }
}

/* ============================================================
   Conversion Loader: Pre-Sell Trust Bar (inside Activity)
   ============================================================ */
.loader-presell {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.3rem 0.75rem;
    padding: 0.55rem 0.75rem;
    margin-top: 0.55rem;
    margin-left: 1.65rem;
    min-height: 34px;
    background: #f0fdf4;
    border: 1px solid #dcfce7;
    border-radius: 8px;
    animation: activityStepIn 0.35s ease both;
}
.loader-presell-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.7rem;
    color: #166534;
    font-weight: 600;
}
.loader-presell-item svg { color: #16a34a; flex-shrink: 0; }
.loader-presell-sep {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #86efac;
    flex-shrink: 0;
}
@media (max-width: 576px) {
    .loader-presell {
        gap: 0.25rem 0.5rem;
        padding: 0.45rem 0.55rem;
        margin-left: 0;
    }
    .loader-presell-sep { display: none; }
}

/* ========================================
   Action-Bound Suggestion Chips (4 Typen)
   ========================================
   Chatbox-interne Chips sind bewusst neutral gehalten. Farben/Icons
   differenzieren nur nach Aktions-Typ (direct / missing_param / manual /
   followup), NICHT nach Filter-Gruppe. Filter-Gruppen-Farben gelten
   ausschliesslich in der Haupt-UI, damit der User Chat-Vorschlag und
   angewendeten Filter visuell unterscheiden kann. */

.ai-search-suggestion-chip.ai-chip--direct,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param,
.ai-search-suggestion-chip.ai-chip--manual,
.ai-search-suggestion-chip.ai-chip--followup {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    min-height: 44px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    line-height: 1.2;
}

/* A11y: sichtbarer Keyboard-Fokus fuer alle Chip-Kinds. Inklusive der
   kompakten Inline-Variante im Result-Feedback-Flow. */
.ai-search-suggestion-chip.ai-chip--direct:focus-visible,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param:focus-visible,
.ai-search-suggestion-chip.ai-chip--manual:focus-visible,
.ai-search-suggestion-chip.ai-chip--followup:focus-visible,
.ai-search-result-feedback__suggestion.ai-chip--direct:focus-visible,
.ai-search-result-feedback__suggestion.ai-chip--action_with_missing_param:focus-visible,
.ai-search-result-feedback__suggestion.ai-chip--manual:focus-visible {
    outline: 2px solid #2563EB;
    outline-offset: 2px;
}
.ai-chip__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}
.ai-chip__hint {
    display: inline-block;
    margin-left: 4px;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: 500;
    color: #6B7280;
    background: rgba(17, 24, 39, 0.05);
    border-radius: 10px;
    white-space: nowrap;
}

/* Alle 4 Kinds im Chat: neutral grau/weiss. Differenziert wird nur ueber
   Icon und Hint-Pill, NICHT ueber Farbe. Entscheidung: der Chat soll nie
   mit Farbe suggerieren, dass der Klick "sicher" oder "gefaehrlich" ist.
   Farben gehoeren zu realen Filter-Gruppen in der Haupt-UI. */
.ai-search-suggestion-chip.ai-chip--direct,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param,
.ai-search-suggestion-chip.ai-chip--followup {
    color: #374151;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
}
.ai-search-suggestion-chip.ai-chip--direct:hover,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param:hover,
.ai-search-suggestion-chip.ai-chip--followup:hover {
    background: #F9FAFB;
    border-color: #9CA3AF;
}
/* Multi-Select aktiv: alle Chip-Kinds einheitlich in CI-Indigo, leicht
   transparent, damit ausgewaehlte und nicht-ausgewaehlte Chips zusammen
   als ein ruhiges Raster wirken. Frueher wurde followup.is-selected in
   kraeftigem Schwarz gerendert, die anderen Kinds hatten gar keinen
   Selected-State, was zu sichtbarer Inkonsistenz fuehrte. */
.ai-search-suggestion-chip.ai-chip--direct.is-selected,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param.is-selected,
.ai-search-suggestion-chip.ai-chip--followup.is-selected {
    color: #3730A3;
    background: rgba(99, 102, 241, 0.12);
    border-color: #6366F1;
    box-shadow: inset 0 0 0 1px #6366F1;
}
.ai-search-suggestion-chip.ai-chip--direct.is-selected:hover,
.ai-search-suggestion-chip.ai-chip--action_with_missing_param.is-selected:hover,
.ai-search-suggestion-chip.ai-chip--followup.is-selected:hover {
    background: rgba(99, 102, 241, 0.18);
    border-color: #4F46E5;
}

/* manual: Escape-Action bleibt als dashed outline erkennbar, aber ebenfalls
   in neutralem Grau. Signalisiert "Ausgang aus dem AI-Flow". */
.ai-search-suggestion-chip.ai-chip--manual {
    color: #6B7280;
    background: transparent;
    border: 1px dashed #D1D5DB;
}
.ai-search-suggestion-chip.ai-chip--manual:hover {
    color: #374151;
    background: #F9FAFB;
    border-color: #9CA3AF;
    border-style: solid;
}

/* Inline-Variante (ai-search-result-feedback__suggestion) fuer
   action_with_missing_param + direct bekommt ein Icon + Hint-Pill.
   Andere Varianten bleiben beim dezenten Link-Stil. */
.ai-search-result-feedback__suggestion.ai-chip--direct,
.ai-search-result-feedback__suggestion.ai-chip--action_with_missing_param,
.ai-search-result-feedback__suggestion.ai-chip--manual {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 14px;
    text-decoration: none;
    font-size: 12.5px;
    margin: 2px 4px 2px 0;
}
.ai-search-result-feedback__suggestion.ai-chip--direct,
.ai-search-result-feedback__suggestion.ai-chip--action_with_missing_param {
    color: #374151;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
}
.ai-search-result-feedback__suggestion.ai-chip--direct:hover,
.ai-search-result-feedback__suggestion.ai-chip--action_with_missing_param:hover {
    background: #F9FAFB;
    color: #111827;
    text-decoration: none;
}
.ai-search-result-feedback__suggestion.ai-chip--manual {
    color: #6B7280;
    background: transparent;
    border: 1px dashed #D1D5DB;
}
.ai-search-result-feedback__suggestion.ai-chip--manual:hover {
    color: #374151;
    background: #F9FAFB;
    text-decoration: none;
}

/* ========================================
   Chatbox: Filter-Vorschau in neutralem Stil
   ========================================
   Die Filter-Tags unter der AI-Antwort (#aiSearchFilters) uebernehmen
   historisch die Filter-Gruppen-Farben der Haupt-UI. Das verwaescht die
   Trennung "Vorschlag" vs. "angewendet". Innerhalb der Chatbox setzen
   wir alle Tags auf einen neutralen Grauton zurueck. Die Farben
   erscheinen erst wenn die Filter in die Haupt-UI uebernommen wurden. */
#aiSearchFilters .ai-search-filter-tag,
.ai-search-chat-bubble .ai-search-filter-tag {
    background: #F9FAFB !important;
    color: #374151 !important;
    border-color: #E5E7EB !important;
}
#aiSearchFilters .ai-search-filter-tag--exclude,
.ai-search-chat-bubble .ai-search-filter-tag--exclude {
    background: #F9FAFB !important;
    color: #9CA3AF !important;
    border-color: #E5E7EB !important;
    text-decoration: line-through;
}
#aiSearchFilters .ai-search-filter-tag__remove:hover,
.ai-search-chat-bubble .ai-search-filter-tag__remove:hover {
    background: #F3F4F6 !important;
    color: #111827 !important;
}

/* ========================================
   Phase 1 Hybrid-Layer: Apply-Preview + Applied-Status
   ========================================
   Preview-Bubble zeigt zusammengefasste Auswahl + zwei Buttons, bevor
   die Filter wirklich angewendet werden. Erscheint NUR bei Mehrschritt-
   Flows (nach Pending-Action-Completion). Direct-Chips bleiben Ein-Klick.
   Applied-Status bleibt nach dem Anwenden in der Chatbox stehen, damit
   der User Kontext behaelt und direkt Refinement eingeben kann. */
.ai-apply-preview {
    margin-top: 12px;
    padding: 12px 14px;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    background: #FFFFFF;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ai-apply-preview__summary {
    font-size: 14px;
    color: #111827;
    line-height: 1.4;
}
.ai-apply-preview__actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ai-apply-preview__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 500;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.ai-apply-preview__btn--primary {
    background: var(--custom-primary, #191d93);
    color: #FFFFFF;
    border-color: var(--custom-primary, #191d93);
}
.ai-apply-preview__btn--primary:hover {
    background: var(--custom-primary-400, #010483);
    border-color: var(--custom-primary-400, #010483);
}
.ai-apply-preview__btn--primary:focus-visible {
    outline: 2px solid var(--custom-primary-light, #3d42b5);
    outline-offset: 2px;
}
.ai-apply-preview__btn--secondary {
    background: #FFFFFF;
    color: #374151;
    border-color: #E5E7EB;
}
.ai-apply-preview__btn--secondary:hover {
    background: #F9FAFB;
    border-color: #9CA3AF;
}
.ai-apply-preview__btn--secondary:focus-visible {
    outline: 2px solid #3B82F6;
    outline-offset: 2px;
}

.ai-applied-status {
    margin-top: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: #F9FAFB;
    border: 1px solid #E5E7EB;
    color: #6B7280;
    font-size: 12.5px;
    line-height: 1.4;
}

/* ========================================================================
   Degraded-Mode: AI nicht verfuegbar (kein API-Key, 503/502 bei /api/ai-search).
   Die Klasse `ai-degraded` wird auf <body> gesetzt, wenn das Meta-Tag
   `ai-search-enabled` auf "0" steht oder ein AI-Endpunkt zur Laufzeit mit
   503/502 antwortet. Alle UI-Elemente, die ohne AI sinnlos oder tot sind,
   werden dann ausgeblendet. Die Hero-Smart-Suche bleibt nutzbar, weil sie
   intern auf einen lokalen Regex-Parser zurueckfaellt.
   Die Klasse `ai-tool-calling-degraded` greift nur fuer Tool-Calling-Features
   (Modify-Chips), wenn /api/ai-search/modify 503 liefert waehrend /api/ai-search
   noch verfuegbar ist.
   ======================================================================== */
body.ai-degraded #aiPanel,
body.ai-degraded #aiSearchChat,
body.ai-degraded [data-ai-assistant-open],
body.ai-degraded .ai-search-result-feedback__chat,
body.ai-degraded .ai-search-result-feedback__mode--primary,
body.ai-degraded .ai-search-result-feedback__reopen {
    display: none !important;
}

/* Analyse-Deeplinks: nur die AI-abhaengigen Chips ausblenden, nicht den
   ganzen Container. Chips mit data-changes rufen /api/ai-search/modify
   (Tool-Calling), waehrend Chips mit data-open-filter oder data-action-name
   rein lokal Filter-Modals oder Toggles oeffnen und ohne AI funktionieren. */
body.ai-degraded .ai-search-result-feedback__analysis-deeplink[data-changes],
body.ai-tool-calling-degraded .ai-search-result-feedback__analysis-deeplink[data-changes] {
    display: none !important;
}

/* Wenn ein Deeplinks-Container nur AI-Chips enthielt (z.B. Kontakt-Preset),
   dann bleibt er leer und muss komplett weg, damit keine leere Leiste
   gerendert wird. */
body.ai-degraded .ai-search-result-feedback__analysis-deeplinks:not(:has(.ai-search-result-feedback__analysis-deeplink:not([data-changes]))),
body.ai-tool-calling-degraded .ai-search-result-feedback__analysis-deeplinks:not(:has(.ai-search-result-feedback__analysis-deeplink:not([data-changes]))) {
    display: none !important;
}

/* ========================================================================
   AI-Panel (Slide-in-Chat von rechts).
   Siehe backend/doc/ai-panel-architecture.md.
   ======================================================================== */

/* Slide-in-Chat von rechts. Das Panel ergaenzt die bestehende
   AI-Refinement-UI um einen optionalen Dialog-Verlauf und ist per
   default geschlossen. Geoeffnet durch den Trigger-Button oben rechts
   oder programmatisch ueber aiPanelSetState('open'). */
.ai-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 92vw);
    margin: 0;
    border: none;
    border-left: 1px solid #E5E7EB;
    border-radius: 0;
    background: #FFFFFF;
    box-shadow: -8px 0 24px rgba(17, 24, 39, 0.08);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.25s ease-out, visibility 0s linear 0.25s;
    visibility: hidden;
    z-index: 1040;
    overflow: hidden;
}
.ai-panel[data-state="open"] {
    transform: translateX(0);
    visibility: visible;
    transition: transform 0.25s ease-out;
}
.ai-panel[data-state="closed"] {
    transform: translateX(100%);
    visibility: hidden;
}

.ai-panel__header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid #E5E7EB;
    background: #F9FAFB;
    flex: 0 0 auto;
}

.ai-panel__title {
    font-weight: 600;
    font-size: 14px;
    color: #111827;
    flex: 1 1 auto;
}

.ai-panel__memory-hint {
    margin: 10px 14px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    background: #FEF3C7;
    border: 1px solid #FCD34D;
    border-radius: 6px;
    color: #92400E;
    font-size: 12px;
    line-height: 1.3;
    flex: 0 0 auto;
}

.ai-panel__memory-hint[hidden] {
    display: none !important;
}

.ai-panel__memory-hint-dismiss {
    margin-left: auto;
    padding: 2px 8px;
    border: 1px solid #F59E0B;
    background: #FFFFFF;
    color: #92400E;
    font-size: 11px;
    border-radius: 4px;
    cursor: pointer;
}

.ai-panel__restart,
.ai-panel__close {
    flex: 0 0 auto;
    padding: 4px 6px;
    border: 1px solid #D1D5DB;
    background: #FFFFFF;
    color: #6B7280;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1;
}
.ai-panel__restart:hover,
.ai-panel__close:hover {
    border-color: #9CA3AF;
    color: #111827;
}

.ai-panel__turns {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ai-panel__turns:empty::before {
    content: "Ihr KI-Assistent. Geben Sie unten eine Anweisung ein, z.B. \"nur GmbHs\", \"bundesweit\" oder \"mit Mobilnummer\". Der Assistent berücksichtigt Ihren aktuellen Filterstand.";
    color: #9CA3AF;
    font-size: 13px;
    line-height: 1.5;
    display: block;
    padding: 6px 2px;
}

.ai-panel__empty {
    color: #9CA3AF;
    font-size: 13px;
    padding: 10px 0;
}

.ai-panel__turn {
    padding: 10px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #FFFFFF;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ai-panel__turn--loading {
    background: #F9FAFB;
}

.ai-panel__turn--failed {
    background: #FEF2F2;
    border-color: #FECACA;
}

/* Failed-Turn: Fehlerursache prominent, damit der User weiss warum
   die Aktion nicht geklappt hat, statt nur einen leeren roten Block
   mit "Erneut versuchen" zu sehen. */
.ai-panel__turn-error {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 8px 10px;
    background: #FFFFFF;
    border: 1px solid #FECACA;
    border-radius: 6px;
    color: #991B1B;
    font-size: 12.5px;
    line-height: 1.45;
}
.ai-panel__turn-error-icon {
    flex: 0 0 auto;
    color: #DC2626;
    margin-top: 1px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ai-panel__turn-error-text {
    flex: 1 1 auto;
    min-width: 0;
    white-space: pre-wrap;
    word-break: break-word;
}

.ai-panel__turn--superseded,
.ai-panel__turn--reverted,
.ai-panel__turn--cancelled,
.ai-panel__turn--abandoned {
    opacity: 0.55;
}

.ai-panel__turn-user {
    font-weight: 600;
    color: #111827;
    font-size: 13px;
    white-space: pre-wrap;
    word-break: break-word;
}

.ai-panel__turn-ai {
    color: #374151;
    font-size: 13px;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
}

/* Legal-/Steuer-/DSGVO-Abwehr im Side-Panel: eigener Block mit §-Icon,
   Titel und warmem Orange-Ton. Klar abgegrenzt von normalen AI-Antworten,
   damit der User sieht "das ist keine Such-Antwort, sondern ein Hinweis". */
.ai-panel__turn-legal {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fff7ed;
    border: 1px solid #fdba74;
    color: #7c2d12;
    margin-top: 4px;
}
.ai-panel__turn-legal-icon {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #fed7aa;
    color: #9a3412;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    font-family: Georgia, "Times New Roman", serif;
}
.ai-panel__turn-legal-content {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
    line-height: 1.45;
}
.ai-panel__turn-legal-title {
    font-weight: 600;
    color: #7c2d12;
    margin-bottom: 2px;
}
.ai-panel__turn-legal-body {
    color: #9a3412;
    white-space: pre-wrap;
    word-break: break-word;
}
.ai-panel__turn--legal_deflection {
    /* Turn-Container-Override: der Legal-Block hat bereits eigene Border,
       wir wollen keine doppelte visuelle Abgrenzung. */
    border-color: #fed7aa;
}

.ai-panel__turn-ai--loading {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ai-panel__skeleton {
    display: block;
    height: 10px;
    border-radius: 5px;
    background: linear-gradient(90deg, #F3F4F6 25%, #E5E7EB 37%, #F3F4F6 63%);
    background-size: 400% 100%;
    animation: ai-panel-skeleton 1.4s ease infinite;
    width: 100%;
}
.ai-panel__skeleton--short {
    width: 65%;
}

@keyframes ai-panel-skeleton {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

.ai-panel__cancel {
    align-self: flex-start;
    padding: 4px 10px;
    border: 1px solid #D1D5DB;
    background: #FFFFFF;
    color: #374151;
    font-size: 12px;
    border-radius: 6px;
    cursor: pointer;
}
.ai-panel__cancel:hover { border-color: #9CA3AF; }

.ai-panel__turn-suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.ai-panel__suggestion-hint {
    padding: 3px 8px;
    border: 1px solid #E5E7EB;
    background: #F3F4F6;
    color: #374151;
    border-radius: 999px;
    font-size: 11.5px;
}
.ai-panel__suggestion-hint--clickable {
    cursor: pointer;
    font: inherit;
    line-height: 1.4;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}
.ai-panel__suggestion-hint--clickable:hover,
.ai-panel__suggestion-hint--clickable:focus-visible {
    background: #EEF2FF;
    border-color: #C7D2FE;
    color: #312E81;
    outline: none;
}
.ai-panel__suggestion-hint--clickable:active {
    background: #E0E7FF;
}

.ai-panel__turn-delta {
    color: #6B7280;
    font-size: 12px;
    line-height: 1.4;
    background: #F9FAFB;
    border-left: 3px solid #60A5FA;
    padding: 4px 8px;
    border-radius: 4px;
    word-break: break-word;
}

.ai-panel__turn-revert,
.ai-panel__turn-retry {
    align-self: flex-start;
    padding: 4px 10px;
    border: 1px solid #D1D5DB;
    background: #FFFFFF;
    color: #374151;
    font-size: 12px;
    border-radius: 6px;
    cursor: pointer;
}
.ai-panel__turn-revert:hover,
.ai-panel__turn-retry:hover {
    border-color: #6366F1;
    color: #4F46E5;
}

.ai-panel__turn-badge {
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 999px;
    background: #F3F4F6;
    color: #6B7280;
    font-size: 11px;
    line-height: 1.4;
}

/* Composer am Panel-Fuss: Input-Bereich mit Send-Button und Hinweistext.
   Der Composer ist die HAUPTINTERAKTION des Assistenten - entsprechend
   prominent: grosszuegige Hoehe (mind. 3 Zeilen Platz), kraeftiger Rand,
   leichter Schatten und abgesetzte Flaeche vom Verlauf daruber. Der
   Turns-Bereich scrollt ueber dem Composer weg, sodass der Composer
   immer sichtbar und greifbar bleibt. */
.ai-panel__composer {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-end;
    gap: 8px;
    margin: 10px 14px 6px;
    padding: 8px 8px 8px 14px;
    background: #FFFFFF;
    border: 1.5px solid #D1D5DB;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(17, 24, 39, 0.04);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ai-panel__composer:focus-within {
    border-color: var(--custom-primary, #4F46E5);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12), 0 2px 8px rgba(17, 24, 39, 0.06);
}
.ai-panel__composer-input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 8px 4px;
    border: none;
    outline: none;
    background: transparent;
    font-size: 14px;
    color: #111827;
    font-family: inherit;
    line-height: 1.5;
    resize: none;
    /* ~3 Zeilen Platz von Anfang an, damit der User sieht dass mehr
       als ein Kurzbefehl erwartet wird. Waechst bis 220px, darueber
       scrollt das Textarea intern. */
    min-height: 68px;
    max-height: 220px;
    overflow-y: auto;
}
.ai-panel__composer-input::placeholder {
    color: #9CA3AF;
    opacity: 0.9;
}
.ai-panel__composer-send {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: none;
    border-radius: 9px;
    background: var(--custom-primary, #4F46E5);
    color: #FFFFFF;
    cursor: pointer;
    transition: background 0.15s ease, transform 0.1s ease;
    align-self: flex-end;
    margin-bottom: 2px;
}
.ai-panel__composer-send:hover {
    background: var(--custom-primary-200, #4338CA);
}
.ai-panel__composer-send:active {
    transform: scale(0.95);
}
.ai-panel__composer-send:focus-visible {
    outline: 2px solid #A5B4FC;
    outline-offset: 2px;
}
.ai-panel__composer-hint {
    flex: 0 0 auto;
    padding: 0 18px 12px;
    font-size: 11px;
    color: #9CA3AF;
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.ai-panel__composer-hint kbd {
    display: inline-block;
    padding: 1px 5px;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px;
    color: #4B5563;
    background: #F3F4F6;
    border: 1px solid #E5E7EB;
    border-bottom-width: 2px;
    border-radius: 4px;
    line-height: 1.2;
}

/* Sichtbarer, dezent-schicker Scrollbar im Verlauf. Macht klar,
   dass der Verlauf scrollt wenn er voll ist. */
.ai-panel__turns {
    scrollbar-width: thin;
    scrollbar-color: #D1D5DB transparent;
}
.ai-panel__turns::-webkit-scrollbar {
    width: 8px;
}
.ai-panel__turns::-webkit-scrollbar-track {
    background: transparent;
}
.ai-panel__turns::-webkit-scrollbar-thumb {
    background-color: #D1D5DB;
    border-radius: 4px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.ai-panel__turns::-webkit-scrollbar-thumb:hover {
    background-color: #9CA3AF;
    background-clip: padding-box;
}

/* Trigger-Button unten rechts. Sichtbar sobald einmal eine AI-Suche
   lief, damit der User den Assistenten jederzeit wieder oeffnen und
   eine neue Anweisung geben kann. Badge zeigt die aktuelle Anzahl
   kontexttragender Turns (applied + clarification_open + loading). */
.ai-panel-trigger {
    position: fixed;
    bottom: 24px;
    right: 24px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1px solid #D1D5DB;
    background: #FFFFFF;
    color: #111827;
    font-size: 13px;
    font-weight: 600;
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(17, 24, 39, 0.12), 0 2px 6px rgba(17, 24, 39, 0.06);
    cursor: pointer;
    z-index: 1039;
    transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
}
.ai-panel-trigger:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.16), 0 3px 8px rgba(17, 24, 39, 0.08);
    border-color: #A5B4FC;
}
.ai-panel-trigger:focus-visible {
    outline: 2px solid #6366F1;
    outline-offset: 2px;
}
.ai-panel-trigger[aria-expanded="true"] {
    border-color: #6366F1;
    color: #4F46E5;
}
.ai-panel-trigger svg {
    color: #4F46E5;
    flex: 0 0 auto;
}
.ai-panel-trigger__label {
    line-height: 1;
}
.ai-panel-trigger__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: #4F46E5;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}
.ai-panel-trigger__badge[hidden] {
    display: none;
}

/* Mobile: Trigger bleibt sichtbar aber kompakter, Panel wird Vollbild */
@media (max-width: 640px) {
    .ai-panel {
        width: 100vw;
    }
    .ai-panel-trigger {
        bottom: 16px;
        right: 16px;
        padding: 10px 14px;
    }
    .ai-panel-trigger__label {
        display: none;
    }
}

/* ──────────────────────────────────────────────────────────────────
   Inline-Confirm-Popover: ersetzt window.confirm() fuer destruktive
   Aktionen (Verwerfen, Dialog-Restart). Positioniert sich direkt am
   auslösenden Button via JS (position:fixed + top/left). Der Pfeil
   zeigt auf den Anker, Richtung (oben/unten) wird dynamisch gesetzt.
   ────────────────────────────────────────────────────────────────── */
.ai-confirm-popover {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    min-width: 280px;
    max-width: 340px;
    padding: 14px 16px 12px;
    background: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(17, 24, 39, 0.16), 0 3px 8px rgba(17, 24, 39, 0.08);
    color: #111827;
    font-size: 13px;
    line-height: 1.45;
    animation: aiConfirmFadeIn 0.14s ease-out;
}
@keyframes aiConfirmFadeIn {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}
.ai-confirm-popover.is-danger {
    border-top: 3px solid #DC2626;
    padding-top: 11px;
}
.ai-confirm-popover__title {
    font-weight: 600;
    font-size: 14px;
    color: #111827;
    margin-bottom: 4px;
}
.ai-confirm-popover__body {
    color: #4B5563;
    font-size: 12.5px;
    margin-bottom: 12px;
}
.ai-confirm-popover__input {
    display: block;
    width: 100%;
    min-height: 56px;
    max-height: 140px;
    padding: 8px 10px;
    margin-bottom: 12px;
    border: 1px solid #E5E7EB;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    line-height: 1.4;
    color: #111827;
    background: #FFFFFF;
    resize: vertical;
    box-sizing: border-box;
    transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
.ai-confirm-popover__input:focus {
    outline: none;
    border-color: #3a31c8;
    box-shadow: 0 0 0 2px rgba(58, 49, 200, 0.15);
}
.ai-confirm-popover__input::placeholder {
    color: #9CA3AF;
}
.ai-confirm-popover.is-prompt {
    min-width: 280px;
}
.ai-confirm-popover__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.ai-confirm-popover__btn {
    padding: 6px 14px;
    font-size: 12.5px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.ai-confirm-popover__btn--cancel {
    background: #FFFFFF;
    border: 1px solid #D1D5DB;
    color: #374151;
}
.ai-confirm-popover__btn--cancel:hover {
    background: #F3F4F6;
    border-color: #9CA3AF;
}
.ai-confirm-popover__btn--confirm {
    background: var(--custom-primary, #4F46E5);
    border: 1px solid var(--custom-primary, #4F46E5);
    color: #FFFFFF;
}
.ai-confirm-popover__btn--confirm:hover {
    background: var(--custom-primary-200, #4338CA);
    border-color: var(--custom-primary-200, #4338CA);
}
.ai-confirm-popover__btn--danger {
    background: #DC2626;
    border-color: #DC2626;
}
.ai-confirm-popover__btn--danger:hover {
    background: #B91C1C;
    border-color: #B91C1C;
}
.ai-confirm-popover__btn:focus-visible {
    outline: 2px solid #6366F1;
    outline-offset: 2px;
}

.ai-confirm-popover__arrow {
    position: absolute;
    width: 14px;
    height: 14px;
    background: #FFFFFF;
    border-left: 1px solid #E5E7EB;
    border-top: 1px solid #E5E7EB;
    transform: rotate(45deg);
}
.ai-confirm-popover.is-above .ai-confirm-popover__arrow {
    bottom: -7px;
    transform: rotate(225deg);
    border-top-color: #E5E7EB;
}
.ai-confirm-popover.is-below .ai-confirm-popover__arrow {
    top: -7px;
    transform: rotate(45deg);
}

@media (max-width: 480px) {
    .ai-confirm-popover {
        min-width: 0;
        max-width: calc(100vw - 24px);
    }
}

/* ==========================================================================
   Hero Search: Magnet-Effekt (gradient glow, tiefe, shimmer, badges)
   Ziel: Das Eingabefeld wirkt wie ein Magnet, der den User optisch hineinzieht.
   Nur CSS + bestehendes HTML - keine JS-Abhaengigkeit.
   ========================================================================== */

@property --discovery-hero-angle {
    syntax: '<angle>';
    initial-value: 0deg;
    inherits: false;
}

@keyframes discovery-hero-halo-rotate {
    to { --discovery-hero-angle: 360deg; }
}

@keyframes discovery-hero-halo-rotate-fallback {
    0%   { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes discovery-hero-halo-breathe {
    0%, 100% { opacity: 0.55; }
    50%      { opacity: 0.85; }
}

@keyframes discovery-hero-sparkle-pulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(79, 70, 229, 0.55);
    }
    50% {
        transform: scale(1.08);
        box-shadow: 0 0 0 8px rgba(124, 58, 237, 0);
    }
}

@keyframes discovery-hero-badge-dot {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.55);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(124, 58, 237, 0);
    }
}

@keyframes discovery-hero-btn-shine {
    0%   { transform: translateX(-160%) skewX(-20deg); }
    60%  { transform: translateX(260%)  skewX(-20deg); }
    100% { transform: translateX(260%)  skewX(-20deg); }
}

@keyframes discovery-hero-blob-drift-a {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(30px, -20px, 0) scale(1.08); }
}

@keyframes discovery-hero-blob-drift-b {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(-40px, 25px, 0) scale(1.1); }
}

/* --- Hintergrund-Blobs hinter der Hero-Zone ------------------------------- */
/* Markenkonformer Mix: CI-Blau + abgestimmtes CI-Violett, dezent. */
.discovery-screen--search-first {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.discovery-screen--search-first::before,
.discovery-screen--search-first::after {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.55;
    will-change: transform;
}
.discovery-screen--search-first::before {
    top: -120px;
    left: -80px;
    width: 520px;
    height: 520px;
    background: radial-gradient(closest-side, rgba(25, 29, 147, 0.38), rgba(25, 29, 147, 0) 70%);
    animation: discovery-hero-blob-drift-a 14s ease-in-out infinite;
}
.discovery-screen--search-first::after {
    top: 60px;
    right: -100px;
    width: 560px;
    height: 560px;
    background: radial-gradient(closest-side, rgba(124, 58, 237, 0.3), rgba(124, 58, 237, 0) 70%);
    animation: discovery-hero-blob-drift-b 18s ease-in-out infinite;
}
@media (max-width: 768px) {
    .discovery-screen--search-first::before,
    .discovery-screen--search-first::after {
        filter: blur(60px);
        opacity: 0.4;
    }
}

/* --- Hero-Shell: Magnet-Halo (rotierendes conic-gradient) ---------------- */
.discovery-screen--search-first .discovery-smart-search--hero {
    position: relative;
    isolation: isolate;
    padding: 6px;
    max-width: 820px;
}
/* Moderater Halo - eine Hauptschicht mit leichter Rotation + eine sehr
   zurueckhaltende zweite Schicht fuer leichte Tiefe. Bewusst reduzierte
   Saettigung und Opacity, damit der Effekt im B2B-Kontext nicht wie ein
   Showcase wirkt, sondern nur eine subtile "lebendige" Anmutung gibt. */
.discovery-screen--search-first .discovery-smart-search--hero::before {
    content: '';
    position: absolute;
    inset: -5px;
    z-index: -1;
    border-radius: 26px;
    background:
        conic-gradient(
            from var(--discovery-hero-angle, 0deg),
            rgba(25, 29, 147, 0.9) 0%,
            rgba(79, 70, 229, 0.75) 30%,
            rgba(99, 102, 241, 0.7) 55%,
            rgba(79, 70, 229, 0.75) 75%,
            rgba(25, 29, 147, 0.9) 100%
        );
    filter: blur(13px) saturate(0.65);
    opacity: 0.055;
    animation:
        discovery-hero-halo-rotate 26s linear infinite,
        discovery-hero-halo-breathe 9s ease-in-out infinite;
    transition: opacity 0.35s ease;
}
/* Zweite Schicht: sehr leise, nur fuer minimale Tiefe - keine eigene
   Rotation mehr, damit der Blickfang ruhig bleibt. */
.discovery-screen--search-first .discovery-smart-search--hero::after {
    content: '';
    position: absolute;
    inset: -2px;
    z-index: -1;
    border-radius: 24px;
    background:
        radial-gradient(80% 60% at 50% 50%, rgba(79, 70, 229, 0.35), rgba(79, 70, 229, 0) 70%);
    filter: blur(10px);
    opacity: 0.04;
    transition: opacity 0.35s ease;
    pointer-events: none;
}
/* Hover/Focus: Halo wird etwas lebendiger, bleibt aber dezent. */
.discovery-screen--search-first .discovery-smart-search--hero:hover::before,
.discovery-screen--search-first .discovery-smart-search--hero:focus-within::before {
    opacity: 0.09;
}
.discovery-screen--search-first .discovery-smart-search--hero:hover::after,
.discovery-screen--search-first .discovery-smart-search--hero:focus-within::after {
    opacity: 0.06;
}
/* Chat-State: Halo fast ausblenden - die Card steht klar im Vordergrund,
   Buttons und Content duerfen nicht mit einem Glow konkurrieren. */
.discovery-screen--search-first .discovery-smart-search--hero:has(.discovery-smart-shell.is-chat-active)::before {
    opacity: 0.025;
}
.discovery-screen--search-first .discovery-smart-search--hero:has(.discovery-smart-shell.is-chat-active)::after {
    opacity: 0.015;
}
.discovery-screen--search-first .discovery-smart-search--hero:has(.discovery-smart-shell.is-chat-active):hover::before {
    opacity: 0.045;
}
.discovery-screen--search-first .discovery-smart-search--hero:has(.discovery-smart-shell.is-chat-active):hover::after {
    opacity: 0.03;
}
/* Im Chat-State gehoert der Filter-Count logisch an die Chat-Bubble (direkt
   bei der Filter-Tabelle), nicht in die Card-Kopfzone. Der obere Hint mit
   Sparkle-Avatar, Metric-Chips und AI-Echtzeit-Badge ist in diesem State
   doppeldeutig und konkurriert mit der Chat-Bubble darunter. Daher komplett
   ausblenden. Die Inline-Trust-Bar oben bleibt (diese sitzt NICHT im Hint). */
.discovery-screen--search-first .discovery-smart-shell.is-chat-active > .discovery-smart-hint {
    display: none;
}

/* --- Hero-Shell: klarer Business-Look, praezise Kante -------------------- */
/* Praezise Schatten mit wenig Blur + 1px Highlight oben fuer "Premium-SaaS". */
.discovery-screen--search-first .discovery-smart-shell {
    position: relative;
    border-radius: 20px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #ffffff;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 2px 4px rgba(15, 23, 42, 0.04),
        0 8px 20px -10px rgba(25, 29, 147, 0.12),
        0 16px 32px -18px rgba(15, 23, 42, 0.12);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.discovery-screen--search-first .discovery-smart-shell:hover {
    border-color: rgba(99, 102, 241, 0.35);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 2px 4px rgba(15, 23, 42, 0.05),
        0 10px 24px -10px rgba(79, 70, 229, 0.2),
        0 20px 38px -20px rgba(15, 23, 42, 0.14);
}
.discovery-screen--search-first .discovery-smart-shell:focus-within {
    border-color: rgba(79, 70, 229, 0.6);
    box-shadow:
        0 0 0 3px rgba(79, 70, 229, 0.12),
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 2px 4px rgba(15, 23, 42, 0.05),
        0 12px 26px -10px rgba(79, 70, 229, 0.22),
        0 22px 40px -20px rgba(15, 23, 42, 0.16);
}

/* Innerer Licht-Akzent auf der Shell (clip-safe - bleibt in overflow:hidden).
   Kombiniert Blau-Akzent oben-links mit Violett-Akzent unten-rechts. */
.discovery-smart-shell__glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background:
        radial-gradient(120% 80% at 50% -20%, rgba(25, 29, 147, 0.12), rgba(25, 29, 147, 0) 55%),
        radial-gradient(80% 60% at 100% 120%, rgba(124, 58, 237, 0.1), rgba(124, 58, 237, 0) 60%),
        radial-gradient(60% 50% at 0% 100%, rgba(99, 102, 241, 0.08), rgba(99, 102, 241, 0) 65%);
    opacity: 0.95;
    z-index: 0;
    transition: opacity 0.3s ease;
}
.discovery-screen--search-first .discovery-smart-shell:focus-within .discovery-smart-shell__glow {
    opacity: 1;
}
.discovery-screen--search-first .discovery-smart-shell > :not(.discovery-smart-shell__glow) {
    position: relative;
    z-index: 1;
}

/* --- Hint-Avatar mit Atom/Orbit-Symbol ----------------------------------
   Avatar zeigt drei rotierte Ellipsen-Bahnen mit Mittelpunkt - klassischer
   Atom-/Orbit-Look. Geometrisch klar erkennbar, transportiert "intelligente
   Verarbeitung" ohne plumpes Sparkle-Klischee. CI-Blau-Violett-Gradient
   im Hintergrund, Container pulst sanft (Skalierung + Glow). Das innere
   SVG hat keine eigene Animation - der Container-Pulse liefert die
   Lebendigkeit, das Symbol bleibt ruhig und seriös. */
.discovery-screen--search-first .discovery-smart-hint__avatar--orbit {
    background: linear-gradient(135deg, #191d93 0%, #4f46e5 45%, #7c3aed 100%);
    box-shadow:
        0 6px 14px -4px rgba(79, 70, 229, 0.55),
        0 2px 4px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    animation: discovery-hero-sparkle-pulse 2.4s ease-in-out infinite;
}

/* --- AI-Item in der Trust-Bar (vorher: AI-Badge im Hint) -----------------
   Das AI-Echtzeit-Element sitzt jetzt als letztes Trust-Item in der
   Trust-Bar (neben IITR), nicht mehr oben rechts im Hint-Bereich.
   Im Hint hat es mit dem dritten Metric-Chip um Platz konkurriert und
   wirkte verschoben. Unten in der Trust-Bar harmoniert es als feines
   Pulse-Akzent mit den uebrigen Trust-Items. */
.discovery-smart-trust__item--ai {
    color: #4f46e5;
}
.discovery-smart-trust__item--ai strong {
    color: #4338ca;
}
.discovery-smart-trust__ai-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7c3aed;
    box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.18);
    animation: discovery-hero-badge-dot 1.8s ease-in-out infinite;
    flex-shrink: 0;
}

/* --- Groesseres Eingabefeld fuer Magnetwirkung --------------------------- */
.discovery-screen--search-first .discovery-smart-input-wrap {
    min-height: 72px;
    padding-right: 8px;
}
.discovery-screen--search-first .discovery-smart-input {
    padding: 22px 12px 22px 52px;
    min-height: 72px;
    font-size: 17px;
    font-weight: 500;
    letter-spacing: -0.005em;
}
.discovery-screen--search-first .discovery-smart-input::placeholder {
    color: #9ca3af;
    font-weight: 400;
    opacity: 1;
    transition: opacity 0.2s ease;
}
.discovery-screen--search-first .discovery-smart-shell:focus-within .discovery-smart-input::placeholder {
    opacity: 0.55;
}
.discovery-screen--search-first .discovery-smart-icon {
    top: 24px;
    left: 18px;
    width: 22px;
    height: 22px;
}

/* --- Enter-Hint: sichtbar, sobald Text getippt wurde --------------------- */
.discovery-smart-enter-hint {
    display: none;
    align-items: center;
    gap: 4px;
    margin-right: 6px;
    padding: 4px 8px;
    border-radius: 6px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(248, 250, 252, 0.9);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    flex-shrink: 0;
    align-self: center;
    user-select: none;
    pointer-events: none;
}
.discovery-smart-enter-hint__arrow {
    font-size: 12px;
    line-height: 1;
    color: #94a3b8;
}
.discovery-screen--search-first .discovery-smart-input-wrap:has(textarea.discovery-smart-input:not(:placeholder-shown)) .discovery-smart-enter-hint {
    display: inline-flex;
}
@media (max-width: 560px) {
    .discovery-smart-enter-hint {
        display: none !important;
    }
}

/* --- Send-Button: groesser, Gradient, Shimmer ---------------------------- */
.discovery-screen--search-first .discovery-smart-btn--hero-cta {
    position: relative;
    overflow: hidden;
    width: 48px;
    height: 48px;
    margin: 12px 12px 12px 0;
    /* Blau-Violett-Verlauf im CI: dunkles Indigo -> Violett-Highlight. */
    background: linear-gradient(135deg, #191d93 0%, #4f46e5 55%, #7c3aed 100%);
    border: none;
    box-shadow:
        0 8px 20px -6px rgba(79, 70, 229, 0.55),
        0 2px 6px rgba(15, 23, 42, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
    transition: transform 0.12s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta:hover {
    transform: translateY(-1px) scale(1.03);
    filter: brightness(1.08);
    box-shadow:
        0 12px 26px -8px rgba(124, 58, 237, 0.68),
        0 4px 10px rgba(15, 23, 42, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta:active {
    transform: translateY(0) scale(0.97);
}
/* Chat-State: Hero-CTA zurueckfahren - er darf nicht mit "Filter anwenden"
   in der Chat-Bubble konkurrieren. Ghost-Style mit dezentem Outline statt
   Gradient-Knall. Aktiver Primary-CTA ist jetzt der "Filter anwenden"-Button. */
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-btn--hero-cta {
    width: 40px;
    height: 40px;
    margin: 8px 10px 8px 0;
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.5);
    color: #4f46e5;
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-btn--hero-cta:hover {
    border-color: rgba(99, 102, 241, 0.55);
    color: #191d93;
    transform: none;
    filter: none;
    box-shadow:
        0 2px 6px rgba(79, 70, 229, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-btn--hero-cta .discovery-smart-btn__shine {
    display: none;
}
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-btn--hero-cta svg {
    filter: none;
}
/* Follow-up-Input im Chat-State darf kompakter wirken, damit die
   Haupt-Card (mit "Filter anwenden") die Attention behaelt. */
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-input-wrap {
    min-height: 52px;
}
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-input {
    padding: 14px 12px 14px 48px;
    min-height: 52px;
    font-size: 15px;
}
.discovery-screen--search-first .discovery-smart-shell.is-chat-active .discovery-smart-icon {
    top: 16px;
}
.discovery-smart-btn__shine {
    position: absolute;
    top: 0;
    left: 0;
    width: 35%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0) 100%);
    transform: translateX(-160%) skewX(-20deg);
    animation: discovery-hero-btn-shine 3.6s ease-in-out infinite;
    animation-delay: 0.8s;
    pointer-events: none;
}
.discovery-screen--search-first .discovery-smart-btn--hero-cta svg {
    position: relative;
    z-index: 1;
    filter: drop-shadow(0 1px 1px rgba(15, 23, 42, 0.2));
}

/* --- "Oder lass dich inspirieren" als Divider-Label ---------------------- */
.discovery-screen--search-first .discovery-also-searched-label--hero {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 16px;
    margin-top: 8px;
    color: #94a3b8;
    font-weight: 500;
    font-size: 0.8rem;
    letter-spacing: 0.02em;
    text-transform: none;
}
.discovery-also-searched-label__divider {
    flex: 0 1 80px;
    height: 1px;
    background: linear-gradient(90deg, rgba(148, 163, 184, 0) 0%, rgba(148, 163, 184, 0.45) 50%, rgba(148, 163, 184, 0) 100%);
}
.discovery-also-searched-label__text {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* --- Reduced Motion: Animationen deaktivieren ---------------------------- */
@media (prefers-reduced-motion: reduce) {
    .discovery-screen--search-first .discovery-smart-search--hero::before,
    .discovery-screen--search-first::before,
    .discovery-screen--search-first::after,
    .discovery-screen--search-first .discovery-smart-hint__avatar--orbit,
    .discovery-smart-trust__ai-dot,
    .discovery-smart-btn__shine {
        animation: none !important;
    }
    .discovery-screen--search-first .discovery-smart-search--hero::before {
        opacity: 0.5;
    }
}

/* --- Fallback: Browser ohne @property (Safari < 16.4 etc.) --------------- */
@supports not (background: conic-gradient(from var(--x, 0deg), red, blue)) {
    .discovery-screen--search-first .discovery-smart-search--hero::before {
        background: linear-gradient(135deg, #191d93, #4f46e5, #7c3aed, #6d28d9, #3d42b5);
        animation: discovery-hero-halo-breathe 5s ease-in-out infinite;
    }
    .discovery-screen--search-first .discovery-smart-search--hero::after {
        display: none;
    }
}

/* ==========================================================================
   Smart Loading State: "Das System denkt wirklich nach"
   Ziel: Waehrend die KI arbeitet soll der User einen intelligenten,
   hochwertigen Eindruck bekommen - keine cramped 3-Pixel-Punkte am Rand.
   ========================================================================== */

@keyframes aiSmartDotWave {
    0%, 60%, 100% {
        transform: translateY(0) scaleY(1);
        opacity: 0.4;
    }
    30% {
        transform: translateY(-6px) scaleY(1.35);
        opacity: 1;
    }
}

@keyframes aiSmartTextShimmer {
    0%   { background-position: -220% 0; }
    100% { background-position: 220% 0; }
}

@keyframes aiSmartOrbit {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes aiSmartHaloBreathe {
    0%, 100% { opacity: 0.35; transform: scale(1); }
    50%      { opacity: 0.7;  transform: scale(1.12); }
}

/* Container: mehr Luft, zentriert, mit dezentem Halo dahinter */
.discovery-screen--search-first .ai-search-loading {
    position: relative;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    padding: 18px 24px 22px;
    isolation: isolate;
}
.discovery-screen--search-first .ai-search-loading::before {
    content: '';
    position: absolute;
    left: 12px;
    top: 50%;
    width: 120px;
    height: 120px;
    z-index: -1;
    border-radius: 50%;
    background:
        radial-gradient(closest-side, rgba(124, 58, 237, 0.18), rgba(124, 58, 237, 0) 70%),
        radial-gradient(closest-side, rgba(25, 29, 147, 0.12), rgba(25, 29, 147, 0) 80%);
    transform: translateY(-50%);
    animation: aiSmartHaloBreathe 2.6s ease-in-out infinite;
    pointer-events: none;
}

/* Denkender Avatar links: rotierender Ring um einen Sparkle-Kern.
   Blau -> Violett -> Blau fuer einen markenkonformen, aber fancy Flow. */
.ai-search-loading::after {
    content: '';
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background:
        radial-gradient(closest-side, #ffffff 58%, transparent 60%),
        conic-gradient(
            from 0deg,
            rgba(25, 29, 147, 0) 0deg,
            #191d93 90deg,
            #4f46e5 160deg,
            #7c3aed 220deg,
            #6d28d9 280deg,
            rgba(25, 29, 147, 0) 360deg
        );
    box-shadow:
        inset 0 0 0 1px rgba(79, 70, 229, 0.1),
        0 4px 12px -4px rgba(79, 70, 229, 0.4);
    animation: aiSmartOrbit 2.2s linear infinite;
    position: relative;
    order: -1;
}
/* Sparkle-Kern: kleines Zentrum im Avatar mit subtilem Pulsieren */
.discovery-screen--search-first .ai-search-loading {
    position: relative;
}

/* Bar-Wave statt Mini-Dots: wirkt wie "das System denkt intensiv nach" */
.discovery-screen--search-first .ai-search-loading-dots {
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    height: 22px;
    padding: 0;
    flex-shrink: 0;
}
.discovery-screen--search-first .ai-search-loading-dots span {
    width: 4px;
    height: 22px;
    background: linear-gradient(180deg, #7c3aed 0%, #4f46e5 55%, #191d93 100%);
    border-radius: 3px;
    transform-origin: bottom center;
    animation: aiSmartDotWave 1.25s ease-in-out infinite;
    opacity: 0.4;
}
.discovery-screen--search-first .ai-search-loading-dots span:nth-child(1) { animation-delay: 0s; }
.discovery-screen--search-first .ai-search-loading-dots span:nth-child(2) { animation-delay: 0.18s; }
.discovery-screen--search-first .ai-search-loading-dots span:nth-child(3) { animation-delay: 0.36s; }

/* Shimmer-Text: die Buchstaben leuchten rhythmisch von links nach rechts,
   damit der User merkt: es passiert etwas - aktiv, nicht stehen geblieben.
   Shimmer-Farbe verlaeuft durch Blau -> Violett fuer markenkonforme Dynamik. */
.discovery-screen--search-first .ai-search-loading-text {
    font-size: 0.95rem;
    font-weight: 500;
    color: #0f172a;
    background: linear-gradient(
        90deg,
        #334155 0%,
        #334155 32%,
        #191d93 44%,
        #4f46e5 50%,
        #7c3aed 56%,
        #334155 68%,
        #334155 100%
    );
    background-size: 220% 100%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: aiSmartTextShimmer 2.4s linear infinite;
    line-height: 1.5;
    letter-spacing: -0.005em;
    max-width: 34rem;
    flex: 1 1 auto;
    min-width: 0;
}

/* Chat-State beim Warten auf eine neue Antwort: die gesamte alte Antwort
   (Bubble-Content) wird als Historie behandelt - gedimmt, entsaettigt,
   nicht klickbar. Der aktuelle Status wird ueber zwei andere Kanaele
   kommuniziert: den Shell-Hint oben ("Antwort wird vorbereitet ...") und
   den .ai-search-loading-Block darunter ("Denke nach..." mit Shimmer-Text
   und Wave-Bars). So ist klar getrennt: oben laeuft das Neue, in der Mitte
   steht die alte Anfrage als Kontext.

   Vorher lief auf .ai-search-chat-text ein Violett-Shimmer, der faelschlich
   auf dem ALTEN Anfrage-Text ("Zahnarztpraxen...") lief und so aussah, als
   waere das die aktuelle Suche - genau das war das Irritations-Problem. */
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting {
    opacity: 1;
}
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-icon,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-text,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-intent-badge,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-warnings,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-suggestions,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-filters-count,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-filters-preview,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-narrative,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-actions {
    opacity: 0.45;
    filter: saturate(0.35) grayscale(0.2);
    transition: opacity 0.2s ease, filter 0.2s ease;
    pointer-events: none;
}
/* .ai-search-chat-text explizit auf Grau-Flat zuruecksetzen, falls der
   Shimmer-Gradient noch irgendwo durchschlaegt. Wichtig: -webkit-text-fill-
   color ueberschreiben, damit der Text wieder normal rendert. */
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-text {
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-text-fill-color: currentColor;
    color: #475569;
    animation: none;
}
/* Reset-Link ("Von vorne anfangen") soll trotz Dimming klickbar bleiben -
   Escape-Hatch fuer haengende Requests. */
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-reset,
.discovery-screen--search-first .ai-search-chat-bubble.is-waiting [data-ai-cancel] {
    pointer-events: auto;
    opacity: 0.8;
    filter: none;
}

/* Chat-Icon im Hero-Kontext: farbig statt grau, passt zum Sparkle-Avatar */
.discovery-screen--search-first .ai-search-chat-icon {
    background: linear-gradient(135deg, #191d93 0%, #4f46e5 55%, #7c3aed 100%);
    color: #ffffff;
    box-shadow:
        0 4px 10px -3px rgba(79, 70, 229, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

/* Mehr Atemraum auf der Chat-Bubble im Hero-Kontext */
.discovery-screen--search-first .ai-search-chat-bubble {
    padding: 18px 24px 14px;
    gap: 14px;
}
.discovery-screen--search-first .ai-search-chat-text {
    font-size: 0.95rem;
}

@media (max-width: 640px) {
    .discovery-screen--search-first .ai-search-loading {
        padding: 14px 18px 18px;
        gap: 12px;
    }
    .ai-search-loading::after {
        width: 30px;
        height: 30px;
    }
    .discovery-screen--search-first .ai-search-chat-bubble {
        padding: 14px 18px 10px;
    }
}

/* Reduced Motion: die Wave bleibt fuer erkennbare Aktivitaet stehen,
   aber Orbit und Shimmer werden ruhiger. */
@media (prefers-reduced-motion: reduce) {
    .ai-search-loading::after,
    .discovery-screen--search-first .ai-search-loading::before,
    .discovery-screen--search-first .ai-search-loading-text,
    .discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-text {
        animation: none !important;
    }
    .discovery-screen--search-first .ai-search-loading-text,
    .discovery-screen--search-first .ai-search-chat-bubble.is-waiting .ai-search-chat-text {
        -webkit-text-fill-color: #334155;
        color: #334155;
        background: none;
    }
}

/* ===========================================================================
   MOBILE REDESIGN -- OVERRIDE LAYER
   ===========================================================================
   Scoped: nur unter 768px aktiv. Desktop (>= 769px) bleibt pixelgenau.
   Diese Regeln stehen am Ende des Files und gewinnen via Cascade-Reihenfolge
   gegen die alten Mobile-Bloecke (z.B. Zeilen ~12970 und ~15686). Wenn etwas
   bricht: kompletten Block loeschen = Zustand vor Mobile-Redesign.
   =========================================================================== */

/* Default (Desktop): Lang-Variante der Action-Bar-Texte sichtbar,
   Kurz-Variante versteckt. Im Mobile-Block unten genau umgekehrt. */
.search-action-bar-text-full { display: inline; }
.search-action-bar-text-short { display: none; }

@media (max-width: 768px) {

    /* --- 1. Sticky Action-Bar unten (Datenvorschau / Suche speichern) --- */
    /* .search-action-bar war auf Mobile vorher eine normale Flex-Zeile am
       Ende der Page und konnte ausserhalb des Sichtfelds liegen. Jetzt fixed
       am unteren Rand mit Safe-Area-Schutz fuer iOS Home-Indicator. */
    .search-action-bar {
        position: fixed !important;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1020;
        background: #ffffff;
        border-top: 1px solid #e5e7eb;
        box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.08);
        padding: 0.65rem 0.85rem max(0.65rem, env(safe-area-inset-bottom));
        margin: 0;
        gap: 0.5rem;
        flex-wrap: nowrap;
        align-items: center;
    }
    .search-action-bar .search-action-bar-btn {
        flex: 1 1 0;
        min-width: 0;
        justify-content: center;
        padding: 0.55rem 0.4rem;
        font-size: 0.8125rem;
        height: 48px;
        gap: 0.3rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* Primary-CTA bekommt 1.6x den Platz der Sekundaer-Buttons,
       damit "Vorschau" prominent bleibt aber Sekundaer-Labels lesbar sind. */
    .search-action-bar .search-action-bar-primary {
        flex: 1.6 1 0;
        font-weight: 600;
    }
    /* Sekundaer-Buttons (Suche speichern, Gespeicherte Suchen) bleiben
       als Icon + KURZES Label sichtbar. Icon-only ist UX-schwach, weil
       Hover-Tooltips auf Touch nicht funktionieren. */
    .search-action-bar .search-action-bar-deemph {
        flex: 1 1 0;
        padding: 0.55rem 0.3rem;
        font-size: 0.75rem;
    }
    .search-action-bar .search-action-bar-deemph .search-action-bar-btn-icon {
        font-size: 1rem;
        margin: 0;
    }
    /* Auf Mobile wird der lange Text versteckt, der kurze Text wird sichtbar.
       Auf Desktop genau umgekehrt (Standard ohne Mobile-Overrides). */
    .search-action-bar-text-short {
        display: inline;
    }
    .search-action-bar-text-full {
        display: none;
    }
    /* Trenner zwischen Primary und Sekundaer-Buttons im Sticky-Bar verstecken */
    .search-action-bar .search-action-bar-divider {
        display: none !important;
    }
    /* Filter-Reset-Statusmessage soll die Bar nicht in 2 Reihen brechen */
    .search-action-bar .filter-reset-message {
        flex: 1 1 100%;
        order: 99;
        font-size: 0.75rem;
    }

    /* Body bekommt Bottom-Padding damit der letzte Content nicht hinter
       der Sticky-Bar verschwindet. Gescoped auf #custom-container, das nur
       auf der Search3-Seite existiert -- andere Mobile-Seiten unbetroffen. */
    #custom-container {
        padding-bottom: 88px;
    }

    /* --- 2. Results-Header kompakt --- */
    /* Vorher: Zahl 2.3rem + Subtitle 2 Zeilen + Datum-Zeile = ~150px Vertikal.
       Neu: alles in 2 kompakte Zeilen, Zahl bleibt prominent aber kleiner. */
    .command-headline {
        padding-bottom: 8px !important;
        margin-bottom: 10px !important;
    }
    .command-headline-row {
        flex-wrap: wrap;
        gap: 4px 8px !important;
        align-items: baseline !important;
    }
    .command-headline-count {
        font-size: 1.75rem !important;
        line-height: 1 !important;
    }
    .command-headline-label {
        font-size: 0.95rem !important;
        line-height: 1.3 !important;
    }
    .command-headline-subtitle {
        font-size: 0.8125rem !important;
        line-height: 1.4 !important;
        margin-top: 2px !important;
    }
    .command-headline-meta {
        margin-top: 6px !important;
        font-size: 0.75rem !important;
    }
    .command-meta-date,
    .command-meta-date--fresh {
        font-size: 0.75rem !important;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    /* --- 3. Suggestion-Box Layout-Bug ("ergaenzen"-Overlap) --- */
    /* Vorher konnten lange Labels und die "+ ergaenzen"-Action ineinander
       laufen. Jetzt klares Flex-Layout mit Action-Pill am Ende. */
    .ai-search-result-feedback {
        padding: 0.75rem !important;
        border-radius: 12px;
    }
    .ai-search-result-feedback__suggestions {
        gap: 0.4rem !important;
        padding: 0.4rem !important;
    }
    .ai-search-result-feedback__suggestions-label {
        font-size: 0.7rem !important;
        font-weight: 700;
        letter-spacing: 0.05em;
    }
    /* WICHTIG: .__suggestion-extra ist die Klasse fuer die VERSTECKTEN
       Chips ab Index 3 (siehe search3-smart-search.js Zeile 4886). Diese
       sollen auf Mobile genau wie auf Desktop nur dann sichtbar werden,
       wenn der "Mehr (n)"-Toggle geklickt wurde. Wir verwenden daher
       :not(.__suggestion-extra), damit unsere Layout-Regeln nicht das
       display: none der -extra-Klasse aushebeln. */
    .ai-search-result-feedback__suggestion:not(.ai-search-result-feedback__suggestion-extra) {
        align-items: center;
        gap: 0.35rem !important;
        font-size: 0.8125rem !important;
        line-height: 1.3 !important;
        padding: 0.35rem 0.55rem !important;
        max-width: 100% !important;
        min-width: 0;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    /* Versteckte Extra-Chips bleiben auch auf Mobile per Default versteckt.
       Aufgeklappt werden sie weiterhin ueber den "Mehr (n)"-Toggle, der die
       Klasse .__suggestions--expanded am Parent setzt (CSS Zeile ~15456). */
    .ai-search-result-feedback__suggestion-extra {
        display: none !important;
    }
    .ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestion-extra {
        display: inline-flex !important;
        align-items: center;
        gap: 0.35rem;
        font-size: 0.8125rem !important;
        line-height: 1.3 !important;
        padding: 0.35rem 0.55rem !important;
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    /* Auch der ::-Trenner zwischen versteckten Chips bleibt versteckt */
    .ai-search-result-feedback__suggestions-sep.ai-search-result-feedback__suggestion-extra {
        display: none !important;
    }
    .ai-search-result-feedback__suggestions--expanded .ai-search-result-feedback__suggestions-sep.ai-search-result-feedback__suggestion-extra {
        display: inline !important;
    }
    /* X-Schliessen klar tappbar machen */
    .ai-search-result-feedback__dismiss {
        width: 32px;
        height: 32px;
        flex-shrink: 0;
    }

    /* --- 4. Action-Buttons in einer Zeile (Rueckgaengig / KI / Analysieren) --- */
    /* Vorher 3 vollbreite Buttons untereinander = ~140px Vertikal.
       Jetzt 1 Zeile: Rueckgaengig als Icon-Button, KI primary, Analyse outline. */
    .ai-search-result-feedback__mode-toggle {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 0.4rem !important;
        align-items: stretch;
        margin-top: 0.5rem !important;
    }
    .ai-search-result-feedback__undo {
        flex: 0 0 38px;
        padding: 0.45rem !important;
        min-width: 0;
        justify-content: center;
    }
    .ai-search-result-feedback__undo span:not(.visually-hidden) {
        display: none;
    }
    .ai-search-result-feedback__mode {
        flex: 1 1 0 !important;
        min-width: 0;
        padding: 0.45rem 0.4rem !important;
        font-size: 0.78rem !important;
        line-height: 1.2 !important;
        justify-content: center !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .ai-search-result-feedback__mode svg {
        width: 14px;
        height: 14px;
        flex-shrink: 0;
    }

    /* --- 5. Datenverfuegbarkeit-Cards (.refine-checkbox-item) kompakter --- */
    /* Vorher ~60px pro Item * 7 Items = ~420px. Jetzt ~44px pro Item. */
    .refine-checkbox-item {
        padding: 0.55rem 0.65rem !important;
        min-height: 44px;
        gap: 0.55rem !important;
    }
    .refine-checkbox-icon {
        width: 18px !important;
        height: 18px !important;
        flex-shrink: 0;
    }
    .refine-checkbox-icon svg {
        width: 16px;
        height: 16px;
    }
    .refine-checkbox-title {
        font-size: 0.875rem !important;
        line-height: 1.3 !important;
        font-weight: 500;
    }
    .refine-avail {
        font-size: 0.8125rem !important;
    }
    .refine-avail-num {
        font-size: 0.875rem !important;
        font-weight: 700 !important;
    }
    /* Disabled-Items (Mobilnummern, Handelsregister) visuell zurueckhaltend */
    .refine-checkbox-item.is-disabled,
    .refine-checkbox-item[aria-disabled="true"] {
        opacity: 0.65;
    }

    /* --- 6. Datenqualitaet-Toggles: 1-Spalter ab 768px statt 575px --- */
    /* Im Tablet-Range (576-768px) brachen die Toggle-Labels mehrzeilig und
       kollidierten mit i-Icons. 1-Spalter ist hier sauberer. */
    #qualityOptimizeGrid.refine-quality-grid {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        padding: 4px 8px !important;
    }
    .refine-quality-cell {
        padding: 0.5rem 0 !important;
        border-bottom: 1px solid #EDF0F4;
    }
    .refine-quality-cell:last-child {
        border-bottom: none;
    }
    .refine-quality-label {
        gap: 0.6rem !important;
        align-items: center !important;
    }
    .refine-quality-text {
        font-size: 0.875rem !important;
        line-height: 1.35 !important;
        white-space: normal !important;
    }

    /* --- 7. Pricing-Panel ("Ihre Auswahl") kompakter --- */
    .pricing-panel {
        padding: 0.85rem 0.85rem 0.95rem !important;
        margin-top: 0.85rem;
    }
    .pricing-panel-title {
        font-size: 0.95rem !important;
    }
    .pricing-panel-status {
        font-size: 0.7rem !important;
        padding: 0.2rem 0.5rem !important;
    }
    .pricing-unit-hero {
        margin: 0.5rem 0 0.4rem !important;
    }
    .pricing-unit-hero-value {
        font-size: 1.5rem !important;
        font-weight: 800;
    }
    .pricing-unit-hero-label {
        font-size: 0.8125rem !important;
    }
    .pricing-records {
        font-size: 0.8125rem !important;
        margin-bottom: 0.4rem !important;
    }
    .pricing-limit-control {
        margin: 0.5rem 0 !important;
    }
    .limit-slider-value {
        font-size: 0.85rem !important;
    }
    .limit-slider {
        height: 4px !important;
    }
    .limit-slider-exact-btn {
        font-size: 0.75rem !important;
        padding: 0.2rem 0.45rem !important;
    }
    .pricing-total {
        padding: 0.6rem 0.75rem !important;
    }
    .pricing-total-label {
        font-size: 0.8125rem !important;
    }
    .pricing-total-value,
    #discountPrice {
        font-size: 1.25rem !important;
    }

    /* --- 8. Filter-Modal: kompakter Header + Sticky Apply-Footer --- */
    /* Markup-seitig wurde "modal-fullscreen-sm-down" hinzugefuegt (greift <576px).
       Hier kompaktieren wir Header/Body und machen den Footer sticky am Boden. */
    #comprehensiveFilterModal .modal-header {
        padding: 0.75rem 0.85rem !important;
        min-height: auto !important;
    }
    #comprehensiveFilterModal .modal-title,
    #comprehensiveFilterModal #comprehensiveFilterModalLabel {
        font-size: 1.05rem !important;
        line-height: 1.3;
    }
    #comprehensiveFilterModal .filter-modal-header-main {
        gap: 0.65rem !important;
    }
    #comprehensiveFilterModal .modal-description {
        font-size: 0.78rem !important;
        line-height: 1.4 !important;
    }
    #comprehensiveFilterModal .btn-close {
        padding: 0.85rem;
        margin: -0.5rem -0.25rem -0.5rem 0;
    }
    #comprehensiveFilterModal .modal-body {
        padding: 0.75rem 0.85rem !important;
        max-height: none !important;
        /* In Fullscreen-Modus auf Mobile: Body fuellt verfuegbaren Raum,
           Footer ist via flex-Layout natuerlich am unteren Rand. */
        flex: 1 1 auto;
        overflow-y: auto;
    }
    #comprehensiveFilterModal .modal-footer {
        padding: 0.65rem 0.85rem max(0.65rem, env(safe-area-inset-bottom)) !important;
        gap: 0.5rem;
        background: #ffffff;
        border-top: 1px solid #e5e7eb;
        box-shadow: 0 -2px 8px rgba(15, 23, 42, 0.06);
    }
    #comprehensiveFilterModal .modal-footer .btn {
        flex: 1 1 0;
        padding: 0.65rem 0.5rem;
        font-size: 0.875rem;
        min-height: 44px;
    }
    #comprehensiveFilterModal .modal-footer .btn-primary {
        flex: 2 1 0;
        font-weight: 600;
    }
}

/* === Sehr-klein-Geraete (iPhone SE, kleine Androids) === */
@media (max-width: 480px) {

    /* Subtitle der Result-Headline ausblenden -- Information ist
       redundant zur Hauptzeile, spart auf 360-380px Geraeten ~30px Vertikal. */
    .command-headline-subtitle {
        display: none !important;
    }
    .command-headline-count {
        font-size: 1.5rem !important;
    }
    .command-headline-label {
        font-size: 0.875rem !important;
    }

    /* Action-Buttons noch kompakter */
    .ai-search-result-feedback__mode {
        font-size: 0.72rem !important;
        padding: 0.4rem 0.3rem !important;
    }

    /* Pricing-Hero einzeilig kompakter */
    .pricing-unit-hero-value {
        font-size: 1.35rem !important;
    }

    /* Sticky Action-Bar: Text-Button noch kuerzer falls nicht passend */
    .search-action-bar .search-action-bar-btn {
        font-size: 0.8125rem;
    }
}