/* ================================================
   AltiSigma Hibrit Portal — Ortak Tasarim Dili (3 portal: Yonetici/Ogretmen/Ogrenci)
   H0.2: token'lar TEK kaynak (admin.html/ogretmen.html inline :root ile AYNI degerler — additive, gorsel degisim yok).
   Yeni paylasilan bilesenler "hp-" onekli (mevcut inline .panel/.tablo/.durum ile CAKISMAZ; cutover H9'da inline silinir).
   Kurum renkleri lacivert #0d1a36 + kirmizi #cc2229 KORUNUR (HAVSAN tasarim DILI devsirilir, marka degil).
   ================================================ */
:root {
  --lacivert: #0d1a36; --lacivert-2: #142348; --lacivert-3: #1e2f5c;
  --kirmizi: #cc2229; --kirmizi-hover: #b3171f;
  --gri: #e5e7eb; --gri-acik: #f7f8fa; --gri-orta: #9ca3af;
  --metin: #1f2937; --metin-2: #4b5563;
  --basari: #10b981; --uyari: #f59e0b; --hata: #ef4444;
  --radius: 10px; --radius-lg: 16px;
  --baslik-font: 'Poppins', 'Inter', sans-serif;
  --golge: 0 1px 3px rgba(10,37,64,.08), 0 4px 14px rgba(10,37,64,.07);
  --golge-buyuk: 0 10px 34px rgba(10,37,64,.14);
  --bosluk-1: 4px; --bosluk-2: 8px; --bosluk-3: 16px; --bosluk-4: 24px; --bosluk-5: 40px;
}

/* ---- hp-toast: sag-altta otomatik kaybolan bildirim (alert yerine) ---- */
#hpToastKok { position: fixed; right: 18px; bottom: 18px; z-index: 100000; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.hp-toast { background: var(--lacivert); color: #fff; border-radius: 10px; padding: 10px 16px; font-size: .86rem; font-weight: 600;
  box-shadow: 0 8px 24px rgba(10,37,64,.3); opacity: 0; transform: translateY(8px); transition: opacity .2s, transform .2s; max-width: 360px; }
.hp-toast.goster { opacity: 1; transform: none; }
.hp-toast.basari { background: var(--basari); } .hp-toast.hata { background: var(--kirmizi); } .hp-toast.uyari { background: var(--uyari); color: #1f2937; }

/* ---- hp-modal: ortali kip pencere (confirm yerine) ---- */
.hp-ortu { position: fixed; inset: 0; z-index: 99996; background: rgba(10,37,64,.5); display: none; align-items: center; justify-content: center; padding: 16px; }
.hp-ortu.acik { display: flex; }
.hp-kutu { background: #fff; border-radius: var(--radius-lg); width: 100%; max-width: 520px; max-height: 92vh; overflow: auto;
  box-shadow: var(--golge-buyuk); animation: hpGir .18s ease; }
@keyframes hpGir { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.hp-kutu-bas { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; border-bottom: 1px solid var(--gri); position: sticky; top: 0; background: #fff; }
.hp-kutu-bas h3 { margin: 0; font-family: var(--baslik-font); font-size: 1.05rem; color: var(--lacivert); font-weight: 800; }
.hp-kapat { background: none; border: none; font-size: 1.5rem; line-height: 1; color: var(--gri-orta); cursor: pointer; }
.hp-kutu-govde { padding: 16px 20px; }
.hp-kutu-alt { display: flex; gap: 8px; justify-content: flex-end; padding: 12px 20px; border-top: 1px solid var(--gri); }

/* ---- hp-sticky: alt sabit aksiyon cubugu (Ileri/Geri her zaman gorunur — wiz-alt sorununu cozer) ---- */
.hp-sticky { position: sticky; bottom: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  background: #fff; border-top: 1px solid var(--gri); box-shadow: 0 -4px 14px rgba(10,37,64,.06); padding: 12px 16px; margin-top: 1rem; flex-wrap: wrap; }
.hp-sticky .hp-sticky-sag { margin-left: auto; display: flex; gap: 8px; }

/* ---- hp-btn: ortak dugme ---- */
.hp-btn { border: none; border-radius: var(--radius); padding: 10px 18px; font-family: inherit; font-size: .9rem; font-weight: 700; cursor: pointer; }
.hp-btn.birincil { background: var(--kirmizi); color: #fff; } .hp-btn.birincil:hover { background: var(--kirmizi-hover); }
.hp-btn.ikincil { background: var(--gri-acik); color: var(--lacivert); border: 1px solid var(--gri); }
.hp-btn:disabled { opacity: .55; cursor: default; }

/* ---- hp-sekme: ders-bazli sekme seridi (H4) ---- */
.hp-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; border-bottom: 2px solid var(--gri); margin-bottom: 1rem; }
.hp-sekme { background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -2px; padding: 8px 14px;
  font-family: inherit; font-size: .88rem; font-weight: 600; color: var(--metin-2); cursor: pointer; }
.hp-sekme.aktif { color: var(--kirmizi); border-bottom-color: var(--kirmizi); }

/* ---- hp-rozet: durum rozeti (mevcut .durum renk dilini paylasir) ---- */
.hp-rozet { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .72rem; font-weight: 700; }
.hp-rozet.olumlu { background: rgba(16,185,129,.14); color: #047857; }
.hp-rozet.olumsuz { background: rgba(239,68,68,.14); color: #b91c1c; }
.hp-rozet.bekleme { background: rgba(245,158,11,.16); color: #b45309; }

/* ---- hp-spin: kaydet/yukleme gostergesi ---- */
.hp-spin { display: inline-block; width: 12px; height: 12px; margin-right: 6px; vertical-align: -1px;
  border: 2px solid rgba(71,85,105,.25); border-top-color: var(--lacivert); border-radius: 50%; animation: hpDon .6s linear infinite; }
@keyframes hpDon { to { transform: rotate(360deg); } }
