/* ==========================================================================
 * Proje: HIZIRBEY Portal
 * Paket: HIZIRBEY Design System
 * Bileşen: StatusIndicator
 * Dosya: themes/default/assets/css/hds/components/status-indicator/base.css
 * Açıklama: Sistem ve kayıt durumlarının canonical public sunumu.
 * Ownership: Public HDS StatusIndicator component presentation
 * Root: .hds-status-indicator
 * Children: .hds-status-indicator__icon, .hds-status-indicator__text
 * States: neutral, info, success, warning, danger, compact, pill, link
 * Güncellendi: 23.10.2026 (pill, link)
 * Sürüm: 1.1.0
 * ========================================================================= */

/* =========================================================================
 * >>> Status Indicator Base
 * ========================================================================= */

.hds-status-indicator {
  --hds-status-indicator-color: var(--color-text-muted, #64748b);
  display: inline-flex;
  align-items: baseline;
  gap: 0.38rem;
  min-width: 0;
  max-width: 100%;
  color: var(--hds-status-indicator-color);
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.35;
  vertical-align: middle;
}

.hds-status-indicator__icon {
  flex: 0 0 auto;
  color: currentColor;
  font-size: 0.72em;
  line-height: 1;
  transform: translateY(-0.04em);
}

.hds-status-indicator__text {
  min-width: 0;
  overflow-wrap: anywhere;
}

/* <<< Status Indicator Base */

/* =========================================================================
 * >>> Status Indicator Tones
 * ========================================================================= */

.hds-status-indicator--neutral { --hds-status-indicator-color: var(--color-text-muted, #64748b); }
.hds-status-indicator--info { --hds-status-indicator-color: var(--color-info, #176da6); }
.hds-status-indicator--success { --hds-status-indicator-color: var(--color-success, #16794a); }
.hds-status-indicator--warning { --hds-status-indicator-color: var(--color-warning, #9a6700); }
.hds-status-indicator--danger { --hds-status-indicator-color: var(--color-danger, #b42318); }

/* <<< Status Indicator Tones */

/* =========================================================================
 * >>> Compact Status Indicator
 * ========================================================================= */

.hds-status-indicator--compact {
  gap: 0.28rem;
  font-size: 0.72rem;
}

/* <<< Compact Status Indicator */

/* =========================================================================
 * >>> Pill Status Indicator (23.10.2026)
 * Tonlu açık zemin; tablo hücresinde durum (ör. ücret: Ödedi / Kısmen / Ödemedi).
 * ========================================================================= */

.hds-status-indicator--pill {
  align-items: center;
  padding: 0.22rem 0.7rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--hds-status-indicator-color) 12%, #ffffff);
  white-space: nowrap;
}

a.hds-status-indicator--link {
  text-decoration: none;
}

a.hds-status-indicator--link:hover {
  background: color-mix(in srgb, var(--hds-status-indicator-color) 20%, #ffffff);
  text-decoration: none;
}

a.hds-status-indicator--link:focus-visible {
  outline: 2px solid var(--hds-status-indicator-color);
  outline-offset: 2px;
}

/* <<< Pill Status Indicator */

/* =========================================================================
 * >>> Status Indicator Responsive
 * ========================================================================= */

@media (max-width: 480px) {
  .hds-status-indicator { white-space: normal; }
}

/* <<< Status Indicator Responsive */