.dk-resultsPage__intro {
    margin-top: 18px;
}

.dk-resultsPage__sidebarCard {
    padding: 24px;
}

.dk-resultsPage__sidebarActions {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 18px;
}

.dk-resultsPage__sidebarLink,
.dk-resultsPage__sidebarBtn.ui-button {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

.dk-resultsPage__listFieldset {
    margin-top: 6px;
}

.dk-resultsPage__compareTable {
    width: 100%;
    border-collapse: collapse;
}

.dk-resultsPage__compareTable td {
    padding: 6px 4px;
    vertical-align: top;
}

.dk-resultsPage__removeLink {
    color: red;
    font-weight: bold;
}

.dk-resultsPage__compareProvider {
    font-weight: bold;
}

.dk-resultsPage__listLinkWrap {
    margin-top: 10px;
}

.dk-resultsPage__providerHint {
    margin-top: 8px;
}

.dk-resultsPage__providerBox {
    text-align: center;
    background-color: white;
    padding: 15px;
    border-radius: 18px;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .04);
    margin-top: 18px;
}

.dk-resultsPage .dk-resultsHeader__actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
}

.dk-resultsPage .dk-mobileFilterToggle__button.ui-button {
    border-radius: 999px !important;
}

@media (max-width: 700px) {
    .dk-resultsPage .dk-resultsHeader__top {
        flex-wrap: wrap;
        row-gap: 6px;
        align-items: flex-start;
    }

    .dk-resultsPage .dk-resultsHeader__title {
        flex: 0 0 100%;
    }

    .dk-resultsPage .dk-resultsHeader__meta {
        flex: 0 0 100%;
        text-align: right;
    }

    .dk-resultsPage .dk-resultsHeader__actions {
        justify-content: space-between;
    }
}

@media (max-width: 960px) {
    .dk-resultsPage__sidebarActions {
        margin-bottom: 14px;
    }
}

.dk-resultsToolbar{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px 20px;
    flex-wrap:wrap;
    margin-top:12px;
}

.dk-resultsToolbar__filters{
    display:flex;
    align-items:center;
    gap:12px 18px;
    flex-wrap:nowrap;
    min-width:0;
}

.dk-resultsToolbar__filterItemWrap{
    display:block;
}

.dk-resultsToolbar__filterItem{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.dk-resultsToolbar__label{
    white-space:nowrap;
}

.dk-resultsToolbar__select{
    font-size: 12px;
}

.dk-resultsToolbar__select.ui-selectonemenu{
    min-width: 190px;
}

.dk-resultsToolbar__select .ui-selectonemenu-label{
    min-width: 180px;
}

.dk-resultsToolbar__panel{
    font-size:12px;
}

.dk-resultsToolbar__actions{
    margin-left:auto;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-shrink:0;
}

.dk-resultsToolbar__changeBtn.ui-button{
    display:none;
    white-space:nowrap;
}

.dk-resultsToolbar__filterIcon{
    display:none !important;
    min-width:44px !important;
    width:44px !important;
    height:44px !important;
    padding:0 !important;
    border-radius:999px !important;
}

.dk-resultsToolbar__filterIcon .ui-button-text{
    display:none !important;
}

.dk-resultsToolbar__filterIcon .ui-button-icon-left,
.dk-resultsToolbar__filterIcon .ui-button-icon{
    position:static !important;
    left:auto !important;
    top:auto !important;
    margin:0 !important;
    transform:none !important;
    line-height:1 !important;
}

.dk-resultsToolbar__views{
    display:flex;
    align-items:center;
    gap:10px;
}
.dk-resultsPage__mobileOnly{
    display:none;
}

/* Wenn wenig Platz wird, sollen die Umschaltbuttons nach unten rutschen */
@media (max-width: 1180px){
    .dk-resultsToolbar__actions{
        flex:0 0 100%;
        margin-left:0;
        justify-content:flex-end;
    }
}

/* Ab hier Angaben ändern links von den Umschaltbuttons */
@media (max-width: 960px){
    .dk-resultsToolbar__changeBtn.ui-button{
        display:inline-flex;
    }

    .dk-resultsToolbar__actions{
        flex:0 0 100%;
        justify-content:flex-end;
    }
}

/* Ab hier Filter-Selects ausblenden, dafür Filter-Icon zwischen Angaben ändern und Viewswitch */
@media (max-width: 770px){
    .dk-resultsToolbar__desktopFilters{
        display:none;
    }

    .dk-resultsToolbar__changeBtn.ui-button{
        display:inline-flex;
    }

    .dk-resultsToolbar__filterIcon{
        display:inline-flex !important;
        align-items:center;
        justify-content:center;
    }

    .dk-resultsToolbar__actions{
        flex:0 0 100%;
        justify-content:flex-end;
        gap:10px;
    }

    .dk-resultsPage__mobileOnly{
        display:block;
    }
}

/* Ganz schmal: wenn nötig dürfen auch die Aktionsbuttons umbrechen */
@media (max-width: 520px){
    .dk-resultsToolbar__actions{
        flex-wrap:wrap;
        justify-content:flex-end;
    }
}

.dk-resultsPage__desktopOnly{
    display:block;
}

.dk-resultsPage__mobileOnly{
    display:none;
}

@media (max-width: 770px){
    .dk-resultsPage__desktopOnly{
        display:none;
    }

    .dk-resultsPage__mobileOnly{
        display:block;
    }
}

.dk-resultsPage__desktopOnlyUnder900 {
    display: block;
}

.dk-resultsPage__desktopFiltersOnly {
    display: flex;
}

.dk-resultsPage__filterBtn.ui-button {
    display: none;
    background: var(--dk-green-100) !important;
    border: 0 !important;
    box-shadow: none !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    align-items: center;
    justify-content: center;
}

.dk-resultsPage__filterBtn.ui-button .ui-button-text {
    display: none !important;
}

.dk-resultsPage__filterBtn.ui-button .ui-button-icon-left,
.dk-resultsPage__filterBtn.ui-button .ui-button-icon,
.dk-resultsPage__filterBtn.ui-button .ui-button-icon-right {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    margin: 0 !important;
    transform: none !important;
    line-height: 1 !important;
    color: var(--dk-green) !important;
    font-size: 20px !important;
}

.dk-resultsToolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px 20px;
    flex-wrap: wrap;
    margin-top: 12px;
}

.dk-resultsToolbar__filters {
    display: flex;
    align-items: center;
    gap: 12px 18px;
    flex-wrap: nowrap;
    min-width: 0;
}

.dk-resultsToolbar__filterItemWrap {
    display: block;
}

.dk-resultsToolbar__filterItem {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.dk-resultsToolbar__select {
    font-size: 12px;
}

.dk-resultsToolbar__select.ui-selectonemenu {
    min-width: 190px;
}

.dk-resultsToolbar__select .ui-selectonemenu-label {
    min-width: 180px;
}

.dk-resultsToolbar__panel {
    font-size: 12px;
}

.dk-resultsToolbar__updateBtn.ui-button {
    white-space: nowrap;
}

.dk-resultsPage .dk-resultsHeader__actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.dk-resultsPage__changeBtn.ui-button {
    display: none;
    white-space: nowrap;
}

/* Sidebar für Anbieter-Seiten: gleicher Breakpoint wie Grid-Collapse (960px) */
.dk-resultsPage__desktopOnlyUnder960 {
    display: block;
}

@media (max-width: 960px) {
    .dk-resultsPage__desktopOnlyUnder960 {
        display: none;
    }

    .dk-resultsPage__changeBtn.ui-button {
        display: inline-flex;
    }
}

@media (max-width: 900px) {
    .dk-resultsPage__desktopOnlyUnder900 {
        display: none;
    }
}

@media (max-width: 700px) {
    .dk-resultsPage .dk-resultsHeader__top {
        flex-wrap: wrap;
        row-gap: 6px;
        align-items: flex-start;
    }

    .dk-resultsPage .dk-resultsHeader__title {
        flex: 0 0 100%;
    }

    .dk-resultsPage .dk-resultsHeader__meta {
        flex: 0 0 100%;
        text-align: right;
    }

    .dk-resultsPage__desktopFiltersOnly {
        display: none;
    }

    .dk-resultsPage__filterBtn.ui-button {
        display: inline-flex;
    }

    .dk-resultsPage .dk-resultsHeader__actions {
        width: 100%;
        justify-content: flex-end;
    }
}



/* =============================================================
   TOOLBAR SELECT-FIX
   Problem: .ui-selectonemenu hat bereits einen Border von Saga.
   overrides.css setzt auf .ui-selectonemenu.ui-widget einen Border.
   Zusammen ergibt das zwei Rahmen.
   Lösung: nur border-radius und box-shadow anpassen,
   den Border von overrides.css für diese Selects überschreiben
   indem wir den Wrapper-Border auf transparent setzen.
   Der sichtbare Border kommt vom .ui-selectonemenu-label innen.
   ============================================================= */

/* Wrapper: nur Form (pill), kein sichtbarer Border */
.ui-selectonemenu.dk-resultsToolbar__select.ui-widget {
  border-radius: 999px !important;
  border:        1px solid rgba(29,29,29,.22) !important;
  box-shadow:    none !important;
  background:    #fff !important;
  min-height:    0 !important;
}
/* Label: kein eigener Border (sonst doppelt) */
.ui-selectonemenu.dk-resultsToolbar__select .ui-selectonemenu-label {
  border:      none !important;
  box-shadow:  none !important;
  min-height:  0 !important;
  font-size:   14px !important;
  padding:     8px 40px 8px 14px !important;
  color:       var(--dk-text, #1d1d1d) !important;
  background:  transparent !important;
}
.ui-selectonemenu.dk-resultsToolbar__select.ui-state-hover.ui-widget {
  border-color: rgba(135,135,135,.8) !important;
}
.ui-selectonemenu.dk-resultsToolbar__select.ui-state-focus.ui-widget {
  border-color: var(--dk-green, #339900) !important;
  box-shadow:   0 0 0 3px rgba(51,153,0,.18) !important;
}
.ui-selectonemenu.dk-resultsToolbar__select .ui-selectonemenu-trigger {
  border-left: none !important;
  background:  transparent !important;
}
/* Speed-Select filterItemWrap bleibt inline im Flex-Row */
.dk-resultsToolbar__filterItemWrap {
  display: inline-flex !important;
  align-items: center !important;
}


/* =============================================================
   dk-iconbtn – runde Icon-Buttons (Filter, View-Switch)
   ============================================================= */
button.ui-button.dk-iconbtn,
a.ui-button.dk-iconbtn,
.ui-button.dk-iconbtn {
  width:           44px !important;
  height:          44px !important;
  min-width:       44px !important;
  padding:         0 !important;
  border-radius:   999px !important;
  background:      var(--dk-green-tint, #e0f0d9) !important;
  border:          none !important;
  box-shadow:      none !important;
  display:         inline-flex !important;
  align-items:     center !important;
  justify-content: center !important;
  color:           var(--dk-green, #339900) !important;
}
button.ui-button.dk-iconbtn.is-active,
a.ui-button.dk-iconbtn.is-active,
.ui-button.dk-iconbtn.is-active {
  outline: 2px solid var(--dk-green, #339900) !important;
}
button.ui-button.dk-iconbtn .ui-button-text,
.ui-button.dk-iconbtn .ui-button-text {
  display: none !important;
}
button.ui-button.dk-iconbtn .ui-button-icon-left,
.ui-button.dk-iconbtn .ui-button-icon-left,
.ui-button.dk-iconbtn i {
  position:  static !important;
  margin:    0 !important;
  color:     var(--dk-green, #339900) !important;
  font-size: 18px !important;
}
a.dk-iconbtn {
  width:           44px;
  height:          44px;
  border-radius:   999px;
  background:      var(--dk-green-tint, #e0f0d9);
  border:          none;
  display:         inline-flex;
  align-items:     center;
  justify-content: center;
  color:           var(--dk-green, #339900);
  font-size:       18px;
  text-decoration: none;
}
a.dk-iconbtn.is-active {
  outline: 2px solid var(--dk-green, #339900);
}


/* =============================================================
   SICHTBARKEIT: Angaben ändern + Filter-Button
   ============================================================= */

/* "Angaben ändern": nur bei <= 960px sichtbar */
.ui-button.dk-resultsPage__changeBtn,
button.ui-button.dk-resultsPage__changeBtn {
  display: none !important;
}
@media (max-width: 960px) {
  .ui-button.dk-resultsPage__changeBtn,
  button.ui-button.dk-resultsPage__changeBtn {
    display: inline-flex !important;
  }
}

/* Filter-Button: nur bei <= 700px sichtbar */
.ui-button.dk-resultsPage__filterBtn,
button.ui-button.dk-resultsPage__filterBtn {
  display: none !important;
}
@media (max-width: 700px) {
  .ui-button.dk-resultsPage__filterBtn,
  button.ui-button.dk-resultsPage__filterBtn {
    display: inline-flex !important;
  }
}


/* =============================================================
   GAP FIX
   ============================================================= */
.dk-compareLayout {
  row-gap: 8px !important;
}
.dk-compareLayout__results {
  align-self:  start !important;
  padding-top: 0 !important;
  margin-top:  0 !important;
}



/* =============================================================
   CHECKER-SEITE
   ============================================================= */

/* Layout-Container: zentriert, max-width, einspaltig by default */
.dk-checker__layout {
  max-width:     600px;
  margin:        0 auto;
}

/* Zweispaltig wenn Ergebnisse vorhanden (ab 860px) */
@media (min-width: 860px) {
  .dk-checker__layout--split {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   24px;
    max-width:             1100px;
    align-items:           start;
  }
}

/* Inputkarte: volle Höhe der Grid-Zelle */
.dk-checker__inputCard {
  height: fit-content;
}

/* Ergebniskarte: ebenfalls fit-content */
.dk-checker__resultsCard {
  height: fit-content;
}

/* Fix 1: SelectOneMenu-Panel – Breite auf Viewport begrenzen (Mobile)
   Verhindert dass das Strassen-Dropdown breiter als der Bildschirm wird */
.dk-checkerPanel {
  max-width:   calc(100vw - 32px) !important;
  box-sizing:  border-box !important;
  white-space: normal !important;
}

.dk-checkerPanel .ui-selectonemenu-item {
  white-space:   normal !important;
  overflow-wrap: break-word !important;
  line-height:   1.4 !important;
  padding:       8px 10px !important;
}

/* Fix 2: Filter-Input im Panel ebenfalls full-width */
.dk-checkerPanel .ui-selectonemenu-filter-container {
  width: 100% !important;
  box-sizing: border-box !important;
}
.dk-checkerPanel .ui-selectonemenu-filter {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Ergebnisliste */
.dk-checkerResults {
  display:        flex;
  flex-direction: column;
  gap:            2px;
  margin-top:     4px;
}

.dk-checkerResult {
  display:       flex;
  align-items:   flex-start;
  gap:           12px;
  padding:       10px 0;
  border-bottom: 1px solid #efefef;
  font-size:     15px;
  line-height:   1.45;
}

.dk-checkerResult:last-child {
  border-bottom: none;
}

.dk-checkerResult__icon {
  flex:       0 0 20px;
  color:      var(--dk-green, #339900);
  font-size:  18px;
  margin-top: 2px;
}

.dk-checkerResult__body {
  flex: 1;
}

.dk-checkerResult__body strong {
  color: var(--dk-text, #1d1d1d);
}