/* =============================================================
   Öğrenci Paneli — student-app
   Tüm seçiciler .okt-student-app altında scope'lanır.
   Tasarım dili: Online Koçunuz design tokens.
   Mobil öncelikli; sekmeler mobilde yatay kaydırılan bar.
   ============================================================= */

.okt-student-app{
  --sa-primary:#3B5BFF;
  --sa-primary-700:#1E3AE2;
  --sa-accent:#C6F25A;
  --sa-ink-900:#0B0F1A;
  --sa-ink-700:#1A1F2E;
  --sa-ink-500:#4B5468;
  --sa-ink-300:#8E97AB;
  --sa-border:#E6E8EF;
  --sa-border-strong:#CDD2DF;
  --sa-surface:#FFFFFF;
  --sa-surface-2:#F6F7FB;
  --sa-success:#1F9D55;
  --sa-success-bg:#E6F6EC;
  --sa-danger:#D43A4F;
  --sa-danger-bg:#FCE9EC;
  --sa-warning:#E59A1F;
  --sa-warning-bg:#FDF4E2;
  --sa-radius:14px;
  --sa-radius-sm:10px;

  font-family:'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color:var(--sa-ink-700);
  -webkit-font-smoothing:antialiased;
}
.okt-student-app *{ box-sizing:border-box; }
.okt-student-app .num{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }

/* ---------- GİRİŞ GEREKİYOR ---------- */
.okt-student-app .okt-sa-guard{
  display:flex; justify-content:center; padding:48px 20px;
}
.okt-student-app .okt-sa-guard-inner{
  max-width:520px; width:100%; text-align:center;
  background:var(--sa-surface); border:1px solid var(--sa-border);
  border-radius:var(--sa-radius); padding:40px 28px;
  box-shadow:0 1px 2px rgba(11,15,26,.04), 0 6px 20px -8px rgba(30,58,226,.10);
}
.okt-student-app .okt-sa-guard-pill{
  display:inline-block; font-size:12px; font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; color:var(--sa-primary-700);
  background:#EEF1FF; padding:5px 12px; border-radius:999px; margin-bottom:16px;
}
.okt-student-app .okt-sa-guard-title{ font-size:26px; font-weight:700; letter-spacing:-.01em; margin:0 0 10px; color:var(--sa-ink-900); }
.okt-student-app .okt-sa-guard-sub{ font-size:15px; color:var(--sa-ink-500); margin:0 0 24px; line-height:1.55; }
.okt-student-app .okt-sa-guard-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ---------- YÜKLENİYOR ---------- */
.okt-student-app .okt-sa-loading{ text-align:center; padding:64px 20px; color:var(--sa-ink-500); }
.okt-student-app .okt-sa-spinner{
  width:32px; height:32px; margin:0 auto 14px; border-radius:50%;
  border:3px solid var(--sa-border); border-top-color:var(--sa-primary);
  animation:okt-sa-spin .8s linear infinite;
}
@keyframes okt-sa-spin{ to{ transform:rotate(360deg); } }

/* ---------- ÜST BAŞLIK ---------- */
.okt-student-app .okt-sa-top{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:18px 0; margin-bottom:4px;
}
.okt-student-app .okt-sa-top-id{ display:flex; align-items:center; gap:12px; }
.okt-student-app .okt-sa-avatar{
  width:44px; height:44px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; color:#fff; font-size:16px; letter-spacing:-.01em;
  background:radial-gradient(circle at 30% 30%, #8FA5FF 0%, #3B5BFF 50%, #1E2A8A 100%);
  box-shadow:0 0 0 2px rgba(255,255,255,.6), 0 0 14px rgba(91,123,255,.25);
}
.okt-student-app .okt-sa-hello{ font-size:18px; font-weight:700; color:var(--sa-ink-900); letter-spacing:-.01em; }
.okt-student-app .okt-sa-badge{
  display:inline-block; margin-top:3px; font-size:11px; font-weight:700;
  letter-spacing:.04em; color:var(--sa-primary-700); background:#EEF1FF;
  border:1px solid #C9D2FF; padding:2px 8px; border-radius:8px;
}
.okt-student-app .okt-sa-top-cta{ margin-left:auto; }

/* ---------- SEKMELER ---------- */
.okt-student-app .okt-sa-tabs{
  display:flex; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:6px; margin:0 0 18px;
  background:var(--sa-surface-2); border:1px solid var(--sa-border);
  border-radius:var(--sa-radius); scrollbar-width:thin;
}
.okt-student-app .okt-sa-tabs::-webkit-scrollbar{ height:6px; }
.okt-student-app .okt-sa-tabs::-webkit-scrollbar-thumb{ background:var(--sa-border-strong); border-radius:999px; }
.okt-student-app .okt-sa-tab{
  display:inline-flex; align-items:center; gap:7px; white-space:nowrap;
  padding:9px 14px; border:0; border-radius:var(--sa-radius-sm); cursor:pointer;
  background:transparent; color:var(--sa-ink-500);
  font-family:inherit; font-size:14px; font-weight:600; line-height:1.2;
  transition:background .15s, color .15s;
}
.okt-student-app .okt-sa-tab:hover{ color:var(--sa-ink-900); }
.okt-student-app .okt-sa-tab.is-active{
  background:var(--sa-surface); color:var(--sa-primary-700);
  box-shadow:0 1px 2px rgba(11,15,26,.06);
}
.okt-student-app .okt-sa-tab-ic{ font-size:13px; line-height:1; }

/* ---------- PANEL ---------- */
.okt-student-app .okt-sa-panel{ display:none; }
.okt-student-app .okt-sa-panel.is-active{ display:block; }

.okt-student-app .okt-sa-error{
  background:var(--sa-danger-bg); color:#99213A; border:1px solid #F5C6CE;
  border-radius:var(--sa-radius-sm); padding:12px 16px; margin-bottom:16px; font-size:14px;
}

/* ---------- KART / BAŞLIK ---------- */
.okt-student-app .okt-sa-card{
  background:var(--sa-surface); border:1px solid var(--sa-border);
  border-radius:var(--sa-radius); padding:20px; margin-bottom:16px;
  box-shadow:0 1px 2px rgba(11,15,26,.04);
}
.okt-student-app .okt-sa-h2{ font-size:22px; font-weight:700; letter-spacing:-.01em; color:var(--sa-ink-900); margin:0 0 4px; }
.okt-student-app .okt-sa-h3{ font-size:17px; font-weight:700; letter-spacing:-.005em; color:var(--sa-ink-900); margin:0 0 14px; }
.okt-student-app .okt-sa-h4{ font-size:14px; font-weight:700; color:var(--sa-ink-700); margin:16px 0 10px; }
.okt-student-app .okt-sa-muted{ font-size:14px; color:var(--sa-ink-500); margin:0; }
.okt-student-app .okt-sa-eyebrow{
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  color:var(--sa-primary-700);
}
.okt-student-app .okt-sa-empty{
  padding:24px; text-align:center; color:var(--sa-ink-300); font-size:14px;
  background:var(--sa-surface-2); border:1px dashed var(--sa-border-strong); border-radius:var(--sa-radius-sm);
}
.okt-student-app .okt-sa-loading-inline{ padding:24px; text-align:center; color:var(--sa-ink-300); font-size:14px; }
.okt-student-app .okt-sa-count{ font-size:13px; color:var(--sa-ink-300); }

.okt-student-app .okt-sa-row-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.okt-student-app .okt-sa-row{ display:flex; align-items:center; gap:12px; }
.okt-student-app .okt-sa-dot{ display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:8px; vertical-align:middle; }

/* ---------- DASHBOARD (GENEL) ---------- */
.okt-student-app .okt-sa-dash-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-bottom:16px; }
.okt-student-app .okt-sa-dash-grid .okt-sa-card{ margin-bottom:0; }
.okt-student-app .okt-sa-dash-coach{ background:linear-gradient(135deg,#0B0F1A,#1A1F2E); color:#fff; border-color:#1A1F2E; }
.okt-student-app .okt-sa-dash-coach .okt-sa-eyebrow{ color:#8FA5FF; }
.okt-student-app .okt-sa-dash-status{ font-size:22px; font-weight:800; letter-spacing:-.01em; margin:8px 0 2px; }
.okt-student-app .okt-sa-dash-coachname{ font-size:15px; font-weight:600; color:#CDD2DF; }
.okt-student-app .okt-sa-dash-coachmeta{ display:flex; flex-wrap:wrap; gap:14px; margin-top:10px; font-size:13px; color:#B7BECC; }
.okt-student-app .okt-sa-dash-coachmeta b{ color:#fff; }
.okt-student-app .okt-sa-dash-mini .okt-sa-stat{ font-size:32px; font-weight:800; letter-spacing:-.02em; color:var(--sa-ink-900); margin:6px 0 2px; }

.okt-student-app .okt-sa-week{ display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:18px; }
.okt-student-app .okt-sa-weekstat-label{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--sa-ink-300); margin-bottom:4px; }
.okt-student-app .okt-sa-weekstat-val{ font-size:26px; font-weight:800; letter-spacing:-.02em; }
.okt-student-app .okt-sa-weekstat-unit{ font-size:12px; font-weight:600; color:var(--sa-ink-300); margin-left:4px; }

/* durum renkleri */
.okt-student-app .okt-sa-status-active{ color:var(--sa-success); }
.okt-student-app .okt-sa-status-pending{ color:var(--sa-warning); }
.okt-student-app .okt-sa-status-expired,
.okt-student-app .okt-sa-status-none{ color:var(--sa-ink-300); }
.okt-student-app .okt-sa-status-paused{ color:var(--sa-warning); }
.okt-student-app .okt-sa-dash-coach .okt-sa-dash-status.okt-sa-status-none,
.okt-student-app .okt-sa-dash-coach .okt-sa-dash-status.okt-sa-status-expired{ color:#8E97AB; }
.okt-student-app .okt-sa-dash-coach .okt-sa-dash-status.okt-sa-status-active{ color:#8FE0A8; }

/* ---------- ÇALIŞMA (ÇST) ---------- */
.okt-student-app .okt-sa-cst-card{
  background:linear-gradient(135deg,#0B0F1A,#131826); color:#fff;
  border-radius:var(--sa-radius); padding:32px 28px; text-align:center;
  position:relative; overflow:hidden;
}
.okt-student-app .okt-sa-cst-card::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(120% 80% at 50% 0%, rgba(91,123,255,.30), transparent 60%);
  pointer-events:none;
}
.okt-student-app .okt-sa-cst-head{ position:relative; }
.okt-student-app .okt-sa-cst-card .okt-sa-eyebrow{ color:#8FA5FF; }
.okt-student-app .okt-sa-cst-card .okt-sa-h2{ color:#fff; margin:8px 0; }
.okt-student-app .okt-sa-cst-card .okt-sa-muted{ color:#B7BECC; max-width:560px; margin:0 auto 22px; }
.okt-student-app .okt-sa-cst-active{
  position:relative; display:inline-flex; align-items:center; gap:14px;
  background:rgba(255,255,255,.06); border:1px solid rgba(143,165,255,.30);
  border-radius:var(--sa-radius-sm); padding:14px 20px; margin:0 auto 22px; text-align:left;
}
.okt-student-app .okt-sa-cst-active-dot{ width:10px; height:10px; border-radius:50%; background:#5BE08C; box-shadow:0 0 12px #5BE08C; animation:okt-sa-pulse 1.6s ease-in-out infinite; }
@keyframes okt-sa-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
.okt-student-app .okt-sa-cst-active-label{ font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:#8FA5FF; font-weight:700; }
.okt-student-app .okt-sa-cst-active-subj{ font-size:15px; font-weight:700; color:#fff; }
.okt-student-app .okt-sa-cst-active-time{ font-size:22px; font-weight:800; letter-spacing:-.01em; color:#8FA5FF; }
.okt-student-app .okt-sa-cst-go{ position:relative; }

/* ---------- TABLO ---------- */
.okt-student-app .okt-sa-table-wrap{ overflow-x:auto; }
.okt-student-app .okt-sa-table{ width:100%; border-collapse:collapse; font-size:14px; }
.okt-student-app .okt-sa-table th,
.okt-student-app .okt-sa-table td{ padding:10px 12px; text-align:left; border-bottom:1px solid var(--sa-border); white-space:nowrap; }
.okt-student-app .okt-sa-table th{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--sa-ink-300); }
.okt-student-app .okt-sa-table .okt-sa-num{ text-align:right; font-variant-numeric:tabular-nums; }
.okt-student-app .okt-sa-table .okt-sa-strong{ font-weight:700; color:var(--sa-ink-900); }
.okt-student-app .okt-sa-table tfoot .okt-sa-foot td{ font-weight:700; color:var(--sa-ink-900); border-top:2px solid var(--sa-border-strong); border-bottom:0; }
.okt-student-app .okt-sa-table .okt-sa-td-action{ text-align:right; }
.okt-student-app .okt-sa-del{
  width:28px; height:28px; border:1px solid var(--sa-border); border-radius:8px;
  background:#fff; color:var(--sa-ink-300); cursor:pointer; font-size:14px; line-height:1;
  transition:color .15s, border-color .15s;
}
.okt-student-app .okt-sa-del:hover{ color:var(--sa-danger); border-color:#F5C6CE; }

/* ---------- FORM ---------- */
.okt-student-app .okt-sa-form{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.okt-student-app .okt-sa-field{ display:flex; flex-direction:column; gap:6px; }
.okt-student-app .okt-sa-field-full{ grid-column:1/-1; }
.okt-student-app .okt-sa-field>span{ font-size:12px; font-weight:600; color:var(--sa-ink-500); }
.okt-student-app .okt-sa-field input,
.okt-student-app .okt-sa-field select{
  height:40px; padding:0 12px; border:1px solid var(--sa-border); border-radius:var(--sa-radius-sm);
  font-family:inherit; font-size:14px; color:var(--sa-ink-700); background:#fff; outline:none;
  transition:border-color .15s, box-shadow .15s;
}
.okt-student-app .okt-sa-field input:focus,
.okt-student-app .okt-sa-field select:focus{ border-color:var(--sa-primary); box-shadow:0 0 0 3px rgba(59,91,255,.12); }
.okt-student-app .okt-sa-form-foot{ grid-column:1/-1; display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:4px; }
.okt-student-app .okt-sa-form-msg{ font-size:13px; font-weight:600; }
.okt-student-app .okt-sa-form-msg.is-error{ color:var(--sa-danger); }
.okt-student-app .okt-sa-form-msg.is-success{ color:var(--sa-success); }
.okt-student-app .okt-sa-form-msg.is-info{ color:var(--sa-ink-500); }

.okt-student-app .okt-sa-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.okt-student-app .okt-sa-grid2 .okt-sa-card{ margin-bottom:0; }

.okt-student-app .okt-sa-quick{ display:flex; gap:8px; }

/* ---------- DENEME: skor satırları ---------- */
.okt-student-app .okt-sa-exam-scores{ display:flex; flex-direction:column; gap:8px; margin-bottom:8px; }
.okt-student-app .okt-sa-score-row{ display:grid; grid-template-columns:1fr 64px 64px 64px; gap:8px; align-items:center; }
.okt-student-app .okt-sa-score-name{ font-size:13px; font-weight:600; color:var(--sa-ink-700); }
.okt-student-app .okt-sa-score-row input{
  height:38px; padding:0 8px; border:1px solid var(--sa-border); border-radius:8px;
  font-family:inherit; font-size:14px; text-align:center; outline:none;
}
.okt-student-app .okt-sa-score-row input:focus{ border-color:var(--sa-primary); box-shadow:0 0 0 3px rgba(59,91,255,.12); }

/* ---------- KAYNAK / ÖDEV liste kartları ---------- */
.okt-student-app .okt-sa-res-list,
.okt-student-app .okt-sa-asg-list{ display:flex; flex-direction:column; gap:10px; }
.okt-student-app .okt-sa-res,
.okt-student-app .okt-sa-asg{
  display:flex; align-items:center; gap:14px;
  background:var(--sa-surface); border:1px solid var(--sa-border);
  border-left:4px solid var(--sa-primary); border-radius:var(--sa-radius-sm);
  padding:14px 16px; box-shadow:0 1px 2px rgba(11,15,26,.04);
}
.okt-student-app .okt-sa-res-main,
.okt-student-app .okt-sa-asg-main{ flex:1; min-width:0; }
.okt-student-app .okt-sa-res-name,
.okt-student-app .okt-sa-asg-title{ font-size:15px; font-weight:700; color:var(--sa-ink-900); }
.okt-student-app .okt-sa-res-meta,
.okt-student-app .okt-sa-asg-meta{ font-size:13px; color:var(--sa-ink-500); margin-top:2px; }
.okt-student-app .okt-sa-asg-status{ font-weight:600; color:var(--sa-primary-700); }
.okt-student-app .okt-sa-asg.is-done{ opacity:.7; }
.okt-student-app .okt-sa-asg.is-done .okt-sa-asg-title{ text-decoration:line-through; color:var(--sa-ink-500); }
.okt-student-app .okt-sa-asg-check{
  width:30px; height:30px; flex-shrink:0; border-radius:50%;
  background:var(--sa-success-bg); color:var(--sa-success);
  display:flex; align-items:center; justify-content:center; font-weight:800;
}

/* ---------- KOÇLUK satırları ---------- */
.okt-student-app .okt-sa-kc-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--sa-border); font-size:15px; }
.okt-student-app .okt-sa-kc-row:last-child{ border-bottom:0; }
.okt-student-app .okt-sa-kc-row>span{ color:var(--sa-ink-500); }
.okt-student-app .okt-sa-kc-row>b{ color:var(--sa-ink-900); font-weight:700; }
.okt-student-app .okt-sa-kc-cta{ text-align:center; }
.okt-student-app .okt-sa-kc-cta p{ margin:0 0 14px; color:var(--sa-ink-500); font-size:14px; }

/* ---------- buton boyutları (tema .btn üzerine küçük destek) ---------- */
.okt-student-app .btn-sm{ padding:6px 12px; font-size:13px; }

/* =============================================================
   MOBİL
   ============================================================= */
@media (max-width:720px){
  .okt-student-app .okt-sa-grid2{ grid-template-columns:1fr; }
  .okt-student-app .okt-sa-top-cta{ margin-left:0; width:100%; }
  .okt-student-app .okt-sa-top-cta .btn{ width:100%; }
  .okt-student-app .okt-sa-h2{ font-size:20px; }
  .okt-student-app .okt-sa-card{ padding:16px; }
  .okt-student-app .okt-sa-cst-card{ padding:24px 18px; }
  .okt-student-app .okt-sa-tab span:last-child{ display:inline; }
}

@media (prefers-reduced-motion:reduce){
  .okt-student-app .okt-sa-spinner,
  .okt-student-app .okt-sa-cst-active-dot{ animation:none; }
}
