/* === utilities.css =======================================================
   Hasznos segédosztályok és apró utilok
========================================================================= */

/* Színek / állapotok */
.muted{ color:var(--muted); }
.success{ color:#166534; }
.error{ color:#991b1b; }

/* Láthatóság */
.hidden{ display:none !important; }
.sr-only{
  position:absolute !important;
  width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); border:0;
}

/* Igazítások */
.text-right{ text-align:right; }
.text-center{ text-align:center; }
.text-nowrap{ white-space:nowrap; }

/* Margók (csak a leggyakoribbak) */
.mt-0{ margin-top:0 !important; }
.mt-8{ margin-top:8px !important; }
.mt-12{ margin-top:12px !important; }
.mt-16{ margin-top:16px !important; }
.mb-0{ margin-bottom:0 !important; }
.mb-8{ margin-bottom:8px !important; }
.mb-12{ margin-bottom:12px !important; }
.mb-16{ margin-bottom:16px !important; }

/* Paddingok */
.p-0{ padding:0 !important; }
.p-8{ padding:8px !important; }
.p-12{ padding:12px !important; }
.p-16{ padding:16px !important; }

/* Flex segédek */
.flex{ display:flex; }
.flex-col{ flex-direction:column; }
.items-center{ align-items:center; }
.justify-between{ justify-content:space-between; }
.gap-8{ gap:8px; }
.gap-12{ gap:12px; }

/* Állapot jelöléshez egyszerű badge (komponens-badges részletesebb) */
.badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 8px;
  border-radius:999px;
  font-size:.8rem;
  border:1px solid var(--border);
  background:#f9fafb;
}
.badge.success{ color:#166534; border-color:#bbf7d0; background:#f0fdf4; }
.badge.warn{ color:#7a4a00; border-color:#ffd591; background:#fff7e6; }
.badge.info{ color:#1e40af; border-color:#bfdbfe; background:#eff6ff; }

/* Kattintható sorok táblázatban */
tr[data-href]{ cursor:pointer; transition:background-color .15s ease; }
tr[data-href]:hover{ background:#f5f5f5; }

/* .clickable-row alias a meglévő tr[data-href] utilhoz */
.clickable-row{ transition:background .15s; cursor:pointer; }
.clickable-row:hover{ background:#fafafa; }