/* ============================================================
   app-native.core.css — TÜM MODÜLLERDE ORTAK
   OTOMATİK ÜRETİLDİ — app-native.css'ten ayrıştırıldı (143 kural)
   Kaynak dosya SİLİNMEDİ: shared/css/app-native.css
   Bu dosyaya elle yazılan kurallar SADECE bu modülü etkiler.
   ============================================================ */

/* ============================================================
   APP-NATIVE.CSS — Teachmate Mobil Uygulama Kabuğu
   ------------------------------------------------------------
   • Gerçek uygulama (APK) hissi: sabit kabuk, alt sekme çubuğu,
     kaymayan sayfa, dokunma geri bildirimi, güvenli alanlar.
   • Doygun, kendinden emin renk paleti (soluk griler bitti).
   • Her sayfaya EN SON link olarak eklenir (clean katmanını ezer).
   Tema kuralı:
     AYDINLIK = html[data-theme="light"] (ve .dark sınıfı yoksa)
     KARANLIK = html.dark  veya  data-theme="light" olmayan html
   ============================================================ */

/* ── 0. SABİTLER + MODÜL KİMLİĞİ ───────────────────────────── */


:root{
  --tabbar-h:64px;
  --topbar-h:56px;
  --blue:#0A7AFF;   --blue2:#3D97FF;   --blue-glow:rgba(10,122,255,.12);
  --accent:#0A7AFF; --accent2:#00C2D7; --accent-glow:rgba(10,122,255,.12);
  --green:#10B569;  --green-glow:rgba(16,181,105,.12);
  --amber:#FF9500;  --red:#FF3B30;     --purple:#7C5CFC;
  --teal:#00BFA6;   --orange:#FF7A1A;  --violet:#7C5CFC; --sky:#00A3E0;
  --m-accent:var(--blue);
  --m-accent-soft:rgba(10,122,255,.10);
  --m-grad:linear-gradient(135deg,#0A7AFF 0%,#00C2D7 100%);
}

/* ── 1. AYDINLIK PALET (doygun) ────────────────────────────── */


html[data-theme="light"]:not(.dark){
  --bg0:#EDF1F9; --bg1:#FFFFFF; --bg2:#F4F7FC; --bg3:#E6EBF5;
  --border:#DCE3EF; --border2:#C7D2E4;
  --text:#0C1424; --text2:#46546B; --text3:#7C8AA0;
  --glass:#FFFFFF; --glass2:#FBFCFE;
  --chrome:rgba(255,255,255,.93);
  --shadow-sm:0 1px 2px rgba(12,20,36,.05),0 2px 8px rgba(12,20,36,.05);
  --shadow-md:0 6px 20px rgba(12,20,36,.08);
  --shadow-lg:0 14px 40px rgba(12,20,36,.14);
  --shadow:var(--shadow-md);
}

/* ── 1b. KARANLIK PALET (doygun aksanlar korunur) ──────────── */


html.dark, html:not([data-theme="light"]){
  --bg0:#0B1220; --bg1:#131C2F; --bg2:#1A2438; --bg3:#26334E;
  --border:rgba(148,170,210,.15); --border2:rgba(148,170,210,.26);
  --text:#EDF2FB; --text2:#9FB0C9; --text3:#67768F;
  --glass:rgba(255,255,255,.04); --glass2:rgba(255,255,255,.07);
  --chrome:rgba(12,19,33,.92);
  --shadow-sm:0 2px 8px rgba(0,0,0,.4);
  --shadow-md:0 8px 26px rgba(0,0,0,.45);
  --shadow-lg:0 16px 48px rgba(0,0,0,.55);
  --shadow:var(--shadow-md);
  --blue2:#5AA8FF;
}

/* ── 2. UYGULAMA KABUĞU — sayfa hiçbir yöne kaymaz ─────────── */


html{
  height:100%;
  overflow:hidden;                 /* belge düzeyinde kaydırma yok */
  -webkit-text-size-adjust:100%;
}

body{
  height:100dvh; min-height:0 !important;
  overflow-y:auto; overflow-x:hidden;        /* tek kaydırıcı: body */
  overscroll-behavior:none;                  /* lastik bant / çekme yok */
  touch-action:pan-y;                        /* yatay pan kilitli */
  -webkit-overflow-scrolling:touch;
  position:relative;
  background:var(--bg0);
  background-image:none;
}

body.has-tabbar{ padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px) + 12px) !important; }

*{ -webkit-tap-highlight-color:transparent; }

/* Uygulama içi metin seçimi: form alanları hariç kapalı (native his) */


.topbar, .tm-tabbar, .btn, button, .perf-mnav, .step-pill, #class-tabs, header{
  -webkit-user-select:none; user-select:none;
}

input, textarea, select, [contenteditable]{ -webkit-user-select:text; user-select:text; }

/* ── 3. ÜST BAR ────────────────────────────────────────────── */


.topbar{
  position:sticky; top:0; z-index:200;
  min-height:var(--topbar-h);
  height:auto;
  padding-top:env(safe-area-inset-top,0px);
  background:var(--chrome) !important;
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--border);
  box-shadow:none;
}

.topbar::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:var(--m-grad); opacity:.9; pointer-events:none;
}

.topbar-title,.topbar-page{ font-weight:800 !important; letter-spacing:-.01em; color:var(--text); }

.topbar .logout-btn{ min-height:36px; padding:6px 14px; border-radius:999px; font-weight:700; }

.topbar .logout-btn:active{ transform:scale(.95); }

/* ── 4. ALT SEKME ÇUBUĞU (native gezinme) ──────────────────── */


.tm-tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:500;
  height:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px));
  padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));
  display:flex; align-items:stretch; justify-content:space-around; gap:2px;
  background:var(--chrome);
  backdrop-filter:blur(20px) saturate(170%);
  -webkit-backdrop-filter:blur(20px) saturate(170%);
  border-top:1px solid var(--border);
  box-shadow:0 -6px 24px rgba(12,20,36,.07);
}

.tm-tab{
  flex:1 1 0; max-width:96px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  border:none; background:none; text-decoration:none; cursor:pointer;
  color:var(--text3); border-radius:14px;
  font:700 10.5px/1.1 'Plus Jakarta Sans','Inter',sans-serif;
  letter-spacing:.01em;
  transition:transform .1s ease, color .15s ease;
  padding:4px 2px;
}

.tm-tab svg{ width:23px; height:23px; stroke-width:2; }

.tm-tab:active{ transform:scale(.92); }

.tm-tab-ico{ display:flex; align-items:center; justify-content:center; width:46px; height:28px; border-radius:999px; transition:background .15s; }

.tm-tab.active{ color:var(--tab-c,var(--blue)); }

.tm-tab.active .tm-tab-ico{ background:var(--tab-bg,rgba(10,122,255,.12)); }

.tm-tab[data-c="blue"]  { --tab-c:#0A7AFF; --tab-bg:rgba(10,122,255,.14); }

.tm-tab[data-c="violet"]{ --tab-c:#7C5CFC; --tab-bg:rgba(124,92,252,.14); }

.tm-tab[data-c="orange"]{ --tab-c:#FF7A1A; --tab-bg:rgba(255,122,26,.14); }

.tm-tab[data-c="teal"]  { --tab-c:#00B399; --tab-bg:rgba(0,191,166,.14); }

.tm-tab[data-c="ink"]   { --tab-c:var(--text); --tab-bg:rgba(125,140,170,.16); }

/* ── 5. DOKUNMA HEDEFLERİ & GERİ BİLDİRİM ──────────────────── */


@media (pointer:coarse){
  .btn{ min-height:46px; }
  .btn-sm{ min-height:44px; } .btn-xs{ min-height:40px; }
  input.inp, select.inp, .perf-select,
  input[type="text"], input[type="number"], select, textarea{
    min-height:46px; font-size:16px !important;   /* iOS odak zoom'unu önler */
  }
}

.btn, button{ touch-action:manipulation; }

.btn:active{ transform:scale(.97); }

.btn{ border-radius:13px; font-weight:700; letter-spacing:-.01em; }

/* ── 6. DOYGUN BİLEŞENLER (clean katmanını ezer) ───────────── */


[data-theme="light"] .btn-primary, .btn-primary, [data-theme="light"] button.primary{
  background:var(--m-grad) !important;
  border:none !important; color:#fff !important;
  box-shadow:0 6px 16px -4px var(--m-accent) !important;
}

.btn-primary:active{ filter:brightness(.94); }

[data-theme="light"] .btn-success, .btn-success{
  background:linear-gradient(135deg,#10B569,#00C27A) !important;
  border:none; color:#fff;
  box-shadow:0 6px 16px -6px rgba(16,181,105,.7) !important;
}

[data-theme="light"] .btn-danger, .btn-danger{
  background:linear-gradient(135deg,#FF3B30,#FF2D55) !important;
  border:none; color:#fff;
  box-shadow:0 6px 16px -6px rgba(255,59,48,.6) !important;
}

.btn-ghost{
  background:var(--bg1);
  border:1.5px solid var(--border2);
  color:var(--text) !important;
}

.btn-ghost:active{ border-color:var(--m-accent); color:var(--m-accent) !important; }

[data-theme="light"] .card, .card, [data-theme="light"] .panel, .panel{
  border:1px solid var(--border) !important;
  border-radius:18px;
  box-shadow:var(--shadow-sm) !important;
  background:var(--bg1) !important;
}

.section-title{ color:var(--text); font-weight:800; letter-spacing:-.02em; }

[data-theme="light"] .inp, .inp,
[data-theme="light"] input, [data-theme="light"] select, [data-theme="light"] textarea{
  border:1.5px solid var(--border2) !important;
  border-radius:13px !important;
  background:var(--bg1) !important;
  color:var(--text) !important;
  transition:border-color .15s, box-shadow .15s;
}

.inp:focus, input:focus, select:focus, textarea:focus{
  outline:none !important;
  border-color:var(--m-accent) !important;
  box-shadow:0 0 0 3px var(--m-accent-soft) !important;
}

input[type="checkbox"], input[type="radio"]{
  min-height:0; accent-color:var(--m-accent);
  width:20px; height:20px; border-radius:6px;
}

[data-theme="light"] .alert-info, .alert-info{
  background:var(--m-accent-soft) !important;
  border:1px solid color-mix(in srgb,var(--m-accent) 30%,transparent) !important;
  color:var(--text2) !important;
  border-radius:14px;
}

/* ── 7. GİRİŞ EKRANI (tüm modüller) ────────────────────────── */


#login-screen{
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(0,194,215,.35), transparent 60%),
    radial-gradient(800px 600px at -10% 110%, rgba(124,92,252,.30), transparent 55%),
    linear-gradient(160deg,#0A5BD8 0%,#0A7AFF 45%,#0090E8 100%);
}

#login-screen .login-box{
  background:rgba(255,255,255,.97);
  border:none;
  border-radius:28px;
  box-shadow:0 30px 80px -20px rgba(4,28,80,.55);
  padding:42px 34px;
}

#login-screen .login-box h2{
  background:none; -webkit-text-fill-color:initial;
  color:#0C1424; font-size:1.45rem; font-weight:800;
}

#login-screen .login-box .login-sub{ color:#46546B; }

#login-screen .login-box .login-ver{ color:#7C8AA0; }

/* ── 8. MAARİF PERFORMANS — modül cilası ───────────────────── */


.perf-mnav{
  position:sticky; top:calc(var(--topbar-h) + env(safe-area-inset-top,0px) + 8px); z-index:150;
  display:flex; gap:6px;
  margin:10px 12px 2px; padding:5px;
  background:var(--bg3); border-radius:999px;
  box-shadow:inset 0 1px 3px rgba(12,20,36,.08);
}

.perf-mnav button{
  flex:1; border:none; cursor:pointer;
  background:transparent; color:var(--text2);
  font:700 .82rem/1 'Plus Jakarta Sans','Inter',sans-serif;
  padding:11px 8px; border-radius:999px;
  transition:all .15s;
}

.perf-mnav button.active, .perf-mnav button:active{
  background:var(--bg1); color:var(--m-accent);
  box-shadow:0 2px 8px rgba(12,20,36,.12);
}

.perf-layout{ padding:12px; gap:12px; }

.perf-panel{
  border-radius:18px;
  border:1px solid var(--border);
  background:var(--bg1);
  box-shadow:var(--shadow-sm);
  padding:16px;
  scroll-margin-top:calc(var(--topbar-h) + 66px);
}

.perf-panel-title{
  display:flex; align-items:center; gap:8px;
  color:var(--text);
  font-size:.86rem; letter-spacing:.02em;
}

.perf-panel-title::before{
  content:""; width:4px; height:16px; border-radius:4px;
  background:var(--m-grad); display:inline-block; flex:0 0 auto;
}

.perf-ai-badge{
  font-size:.7rem; font-weight:800; padding:5px 11px; border-radius:999px;
  background:var(--m-accent-soft); color:var(--m-accent);
  border:1px solid color-mix(in srgb,var(--m-accent) 25%,transparent);
  white-space:nowrap;
}

.perf-select{
  min-height:46px; border-radius:13px;
  border:1.5px solid var(--border2);
  font-weight:600;
  background-color:var(--bg1);
  color:var(--text);
}

#perf-cloud-load{
  background:var(--m-grad); color:#fff !important;
  border:none !important; font-weight:800;
  min-height:48px;
  box-shadow:0 6px 16px -4px var(--m-accent);
}

#perf-cloud-load:active{ transform:scale(.98); }

.perf-student-item{
  min-height:50px; border-radius:13px !important;
  border:1.5px solid var(--border) !important;
  background:var(--bg1) !important;
  transition:transform .1s, border-color .15s, background .15s;
}

.perf-student-item:active{ transform:scale(.98); }

.perf-student-item.active{
  border-color:var(--m-accent) !important;
  background:var(--m-accent-soft) !important;
  box-shadow:none !important;
}

.perf-student-item.active .perf-student-name{ color:var(--m-accent); }

.perf-student-no{
  min-width:34px; height:26px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--bg3); border-radius:8px; color:var(--text2);
  font-family:var(--mono); font-size:.72rem;
}

.perf-student-item.active .perf-student-no{ background:var(--m-accent); color:#fff !important; }

.perf-card{
  border-radius:16px;
  border:1.5px solid var(--border);
  background:var(--bg1);
  box-shadow:var(--shadow-sm);
}

.perf-card-score{ color:var(--m-accent); }

.perf-card-src{ color:var(--m-accent); }

.perf-grade-avg{
  border-radius:16px; background:var(--m-grad); color:#fff;
  box-shadow:0 10px 26px -8px var(--m-accent);
}

.perf-hint{ color:var(--text2); }

.perf-link{ color:var(--m-accent); font-weight:700; }

/* ── 9. ÖĞRENCİLER — modül cilası ──────────────────────────── */


.module-container{ padding:12px; }

#class-tabs > div{
  min-height:48px; border-radius:14px !important;
  border:1.5px solid var(--border) !important;
  font-weight:700;
  transition:all .15s;
}

#class-tabs > div:active{ transform:scale(.97); }

#student-table td:nth-child(2){ color:var(--m-accent); font-weight:700; }

#student-table th{ color:var(--text3); text-transform:uppercase; font-size:.66rem; letter-spacing:.06em; }

/* ── 10. DETAYLAR ──────────────────────────────────────────── */


::-webkit-scrollbar{ width:0px; height:0px; }

            /* native: görünmez */


@media (pointer:fine){
  ::-webkit-scrollbar{ width:8px; height:8px; }
  ::-webkit-scrollbar-thumb{ background:var(--border2); border-radius:8px; }
  ::-webkit-scrollbar-track{ background:transparent; }
}

.sep{ border-color:var(--border); }

a{ -webkit-touch-callout:none; }

/* Tablet: içerik genişliği */


@media (min-width:700px) and (max-width:1100px){
  .module-container, .perf-layout{ max-width:980px; margin:0 auto; }
}

/* ── 11. ANA SAYFA (dashboard) — doygun modül kartları ─────── */


#main-app-content > header::after, body > header.sticky::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background:var(--m-grad); opacity:.9; pointer-events:none; z-index:1;
}

.hub-module-card{ border-radius:22px; }

.hub-module-card:active{ transform:scale(.98) !important; }

.hub-module-card .w-12.h-12{
  width:52px; height:52px;
  border-radius:16px;
  color:#fff;
  box-shadow:0 8px 18px -6px var(--hub-c,#0A7AFF);
  background:var(--hub-g,linear-gradient(135deg,#0A7AFF,#00C2D7));
}

a[href^="ogrenciler"].hub-module-card        { --hub-c:#0A7AFF; --hub-g:linear-gradient(135deg,#0A7AFF,#00C2D7); }

a[href^="sinav-editoru"].hub-module-card     { --hub-c:#00BFA6; --hub-g:linear-gradient(135deg,#00BFA6,#00C2D7); }

a[href^="calisma-kagidi"].hub-module-card    { --hub-c:#F59E0B; --hub-g:linear-gradient(135deg,#F59E0B,#FF7A1A); }

a[href^="maarif-performans"].hub-module-card { --hub-c:#7C5CFC; --hub-g:linear-gradient(135deg,#7C5CFC,#B14DFF); }

a[href^="yazili-okuma"].hub-module-card      { --hub-c:#FF7A1A; --hub-g:linear-gradient(135deg,#FF7A1A,#FF3D71); }

a[href^="cizim-defteri"].hub-module-card     { --hub-c:#18C964; --hub-g:linear-gradient(135deg,#18C964,#00BFA6); }

.hub-module-card:hover{ box-shadow:0 16px 36px -14px var(--hub-c,#0A7AFF) !important; }

/* ── 12. YAZILI OKUMA — adım göstergesi & vurgu ────────────── */


/* ── 13. ÜST BAR — telefon düzeltmeleri ────────────────────── */


.topbar{ gap:8px; padding-left:12px; padding-right:12px; }

.topbar-title, .topbar-page{
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  min-width:0; max-width:46vw;
}

.theme-toggle{ flex:0 0 auto; }

.topbar .user-badge{ flex-shrink:0; }

/* Boş avatar: kırık resim ikonu gösterme */


.topbar img[src=""], img#topbar-avatar[src=""]{ display:none; }

@media (max-width:599px){
  .topbar svg[aria-label="teachmate"]{ height:24px; }
  .topbar .uname{ display:none; }
  .topbar-title, .topbar-page{ font-size:.88rem; max-width:38vw; }
}

/* Maarif üst barı: rozet sığsın */


.topbar-inner{ display:flex; align-items:center; gap:8px; width:100%; min-width:0; }

.topbar-left{ display:flex; align-items:center; min-width:0; flex:1; }

.topbar-right{ flex-shrink:0; }

.perf-ai-badge{ max-width:150px; overflow:hidden; text-overflow:ellipsis; }

/* ── 14. YAZILI — adım şeridi kendi içinde kayar, sayfa taşmaz ─ */


/* Başlık tek satır */


/* Modül kimliği: ana eylem düğmeleri turuncu gradyan */


/* ── 15. SINIF ÇİPLERİ — ad ile sayaç arası boşluk ─────────── */


#class-tabs > div > span:last-child{ margin-left:10px; }

/* ── 16. GENEL: yatay taşma sigortası ──────────────────────── */


.module-container, .perf-layout, main, section{ min-width:0; max-width:100%; }

/* Adım şeridi: kendi içinde yatay kayar, SAYFA asla kaymaz */


/* Yazılı üst barı: dar ekranda yinelenen bağlantıyı gizle (alt barda var) */


/* Çalışma Kağıdı & Sınav Editörü: telefonda sabit 320px+1fr ızgara tek sütuna iner */


@media (max-width:760px){
  html[data-module="calisma"] div[style*="grid-template-columns:320px 1fr"],
  html[data-module="sinav"]   div[style*="grid-template-columns:320px 1fr"]{
    grid-template-columns:1fr;
  }
}

/* Izgara öğeleri min-content nedeniyle taşmasın */


.ogr-layout > div, .perf-layout > div{ min-width:0; }

.card, .perf-panel{ max-width:100%; overflow-wrap:break-word; }

textarea.inp{ max-width:100%; }

/* Sınav Editörü: telefonda 260px+1fr ızgara tek sütuna iner; yinelenen üst bar bağlantısı gizlenir */


@media (max-width:760px){
  html[data-module="sinav"]   .topbar a[href*="ogrenciler"],
  html[data-module="calisma"] .topbar a[href*="ogrenciler"]{ display:none; }
}

/* Maarif hızlı kayıt çipleri */


.evid-chip{
  border:1.5px solid var(--border2); background:var(--bg1); color:var(--text2);
  font:700 .76rem/1 'Plus Jakarta Sans','Inter',sans-serif;
  padding:9px 12px; border-radius:999px; cursor:pointer;
  transition:all .12s; min-height:38px;
}

.evid-chip:active{ transform:scale(.95); }

.evid-chip[data-neg="1"]:active, .evid-chip[data-neg="1"]:hover{
  border-color:#FF9500; color:#E07F00; background:rgba(255,149,0,.1);
}

.evid-chip[data-neg="0"]:active, .evid-chip[data-neg="0"]:hover{
  border-color:#10B569; color:#0C9A57; background:rgba(16,181,105,.1);
}