/* Minimalna wysokość widoku (dla starszych układów) */
#urlsum-app { min-height: calc(100vh - 120px); }

/* Lista po lewej */
#urlsum-list .list-group-item { cursor: pointer; border-left: 3px solid transparent; }

/* Aktywna pozycja – bez bielenia tekstu, pogrubienie i border */
#urlsum-list .list-group-item.active {
  background: var(--bs-light) !important;
  color: inherit !important;
  border-left: 3px solid var(--bs-primary);
  font-weight: 600;
}

/* Jedna / dwie linie z elipsą – TYLKO w obrębie urlsum */
#urlsum-app .truncate-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#urlsum-app .truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Przycisk „Otwórz stronę” – może zawijać długi URL */
#urlsum-open { white-space: normal; word-break: break-word; }

/* Tryb SINGLE – ograniczamy liczbę linii po lewej */
#urlsum-app[data-mode="single"] .truncate-1,
#urlsum-app[data-mode="single"] .truncate-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#urlsum-app[data-mode="single"] .truncate-1 { -webkit-line-clamp: 1; }
#urlsum-app[data-mode="single"] .truncate-2 { -webkit-line-clamp: 2; }

/* Tryb ARCHIVE – pełne streszczenia w liście */
#urlsum-app[data-mode="archive"] .sum-full { white-space: normal; }

/* SUMMARY po prawej – pogrubione */
#urlsum-sum { font-weight: 600; }

/* --- Desktop: dwie niezależne strefy scrollu i pasek między nimi --- */
@media (min-width: 992px){
  #urlsum-app{
    display:flex;
    flex-wrap:nowrap;        /* nic nie zawija się pod spód */
    align-items:stretch;     /* lewa, divider i prawa mają tę samą wysokość */
    height: 100vh;           /* pełna wysokość okna dla niezależnych scrolli */
  }

  /* nadpisujemy szerokości siatki Bootstrapa – steruje flex */
  #urlsum-list-wrap,
  #urlsum-detail-wrap{
    width:auto !important;
    max-width:none !important;
    min-width:0;             /* zapobiega rozpychaniu prawej kolumny */
  }

  /* LEWA kolumna = kolumna flex (nagłówek + LISTA (scroll) + loader) */
  #urlsum-list-wrap{
    flex:0 0 35%;
    min-width:260px;
    display:flex;
    flex-direction:column;
    overflow:hidden;         /* ukryj nadmiar, scroll jest tylko w #urlsum-list */
  }

  /* Sama lista ma WŁASNY scroll i wypełnia wysokość kolumny */
  #urlsum-list{
    flex:1 1 auto;
    min-height:0;            /* <- klucz, by scroll działał wewnątrz listy */
    overflow:auto !important;/* <- WYMUSZAMY scroll listy (izolacja od innych CSS) */
    -webkit-overflow-scrolling: touch;
  }

  /* PRAWY panel – jak „iframe”: nagłówek na górze + body z własnym scrollem */
  #urlsum-detail-wrap{
    flex:1 1 65%;
    display:flex;
    flex-direction:column;
    overflow:hidden;         /* scroll tylko w .detail-body */
  }
  #urlsum-detail-wrap .detail-body{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;           /* niezależny scroll w treści po prawej */
  }

  /* Pasek do przeciągania – pełna wysokość */
  #urlsum-divider{ flex:0 0 6px; align-self:stretch; }
}

/* Pasek do przeciągania (desktop) */
#urlsum-divider{
  width:6px;
  cursor:col-resize;
  background:rgba(0,0,0,.06);
}
#urlsum-divider:hover,
body.resizing #urlsum-divider{
  background:rgba(0,0,0,.15);
}

/* --- Mobile: klasyczny stack --- */
@media (max-width: 991.98px){
  #urlsum-app{ display:block; height:auto; }
  #urlsum-divider{ display:none; }

  /* przełączanie paneli w mobile */
  #urlsum-detail-wrap { display:none; }
  #urlsum-detail-wrap.open { display:block; }
  #urlsum-list-wrap.hidden { display:none; }

  #urlsum-list-wrap, #urlsum-detail-wrap{
    flex: initial !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* Z-indexy i dropdowny tylko w obrębie URLSUM */
#urlsum-list-wrap .sticky-top { z-index: 1; } /* zamiast 1020 */
#urlsum-list-wrap .dropdown { position: relative; z-index: 2001; }
#urlsum-list-wrap .dropdown-menu { z-index: 2002; }

/* NIE DOTYKAJ kontenera listy ani wrappera overflow’em.
   Jeśli coś ma nie być ucinane (np. dropdown), podnieś overflow tylko na itemach: */
#urlsum-list-wrap .list-group-item,
#urlsum-list-wrap .card,
#urlsum-list-wrap .col-12 {
  overflow: visible;
}

/* (opcjonalnie) Safari – jawnie oś Y */
@supports (-webkit-touch-callout: none) {
  @media (min-width: 992px){
    #urlsum-list { overflow-y:auto !important; overflow-x:hidden; }
  }
}