/* responsive-global-2026.css
   Shtrese globale, additive, e skopuar per mobile/tablet.
   Synon: tabela qe rrjeshqasin ne vend qe te priten, imazhe me max-width,
   dhe parandalim i overflow-it horizontal nga elemente dekorative.
   MOS prek desktop-in: pothuajse gjithcka brenda @media (max-width:768px).
*/

/* Mbrojtje globale imazhesh (e sigurt edhe ne desktop) */
img { max-width: 100%; height: auto; }

/* Parandalim overflow horizontal nga dekori (hero-mesh/blob me px fikse) */
html, body { overflow-x: hidden; }

/* Wrapper-i automatik i tabelave (i shtuar nga JS) */
.tbl-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

@media (max-width: 768px) {
  /* Tabelat brenda nje wrapper-i rrjeshqasin horizontalisht */
  .tbl-scroll table { min-width: 540px; }

  /* Nese ndonje tabele mbetet pa wrapper, sigurohu qe te kete scroll-in e vet */
  table:not(.no-responsive) {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* Kur tabela eshte tashme brenda nje wrapper-i scroll-i, lere te jete tabele normale */
  .tbl-scroll > table:not(.no-responsive),
  [style*="overflow-x"] > table:not(.no-responsive) {
    display: table;
  }
}