/* ===================================================================
   شجره طیبه — Design System سمت کلاینت (پایه)
   فونت Vazirmatn + توکن‌های برند — زیرِ همه‌ی صفحات کلاینت می‌نشیند
   نسخه 2.1.7
   =================================================================== */

/* فونت Vazirmatn — محلی (روی خودِ سایت، بدون گوگل) */
@font-face{
  font-family:'Vazirmatn';font-style:normal;font-weight:400;font-display:swap;
  src:url('../../assets/fonts/Vazirmatn-Regular.woff2') format('woff2');
}
@font-face{
  font-family:'Vazirmatn';font-style:normal;font-weight:500;font-display:swap;
  src:url('../../assets/fonts/Vazirmatn-Medium.woff2') format('woff2');
}
@font-face{
  font-family:'Vazirmatn';font-style:normal;font-weight:700;font-display:swap;
  src:url('../../assets/fonts/Vazirmatn-Bold.woff2') format('woff2');
}
@font-face{
  font-family:'Vazirmatn';font-style:normal;font-weight:800;font-display:swap;
  src:url('../../assets/fonts/Vazirmatn-ExtraBold.woff2') format('woff2');
}

:root{
  --stp-green:#28a745;
  --stp-green-d:#1b7a33;
  --stp-green-dd:#14532a;
  --stp-green-l:#e8f5e9;
  --stp-green-ll:#f1f8e9;
  --stp-gold:#d4a017;
  --stp-gold-l:#fff8e1;
  --stp-ink:#1f2d23;
  --stp-muted:#6b7c72;
  --stp-line:#e3ece5;
  --stp-radius:14px;
  --stp-shadow:0 4px 18px rgba(20,83,42,.08);
  --stp-shadow-h:0 10px 30px rgba(20,83,42,.16);
  --stp-font:'Vazirmatn','Vazir','IRANSans','Tahoma',sans-serif;
}

/* فونت یکدست روی همه‌ی محفظه‌های کلاینتِ شجره طیبه */
[class^="stp-"],[class*=" stp-"]{font-family:var(--stp-font)}
[class^="stp-"] *,[class*=" stp-"] *{font-family:var(--stp-font);box-sizing:border-box}
.stp-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* عنوان‌ها */
[class^="stp-"] h1,[class^="stp-"] h2,[class^="stp-"] h3,
[class*=" stp-"] h1,[class*=" stp-"] h2,[class*=" stp-"] h3{color:var(--stp-green-dd)}

/* ── اجزای مشترکِ قابلِ‌استفاده در صفحاتِ کلاینت ──────────────── */
.stp-c-card{
  background:#fff;border:1px solid var(--stp-line);border-radius:var(--stp-radius);
  padding:18px 20px;box-shadow:var(--stp-shadow);margin-bottom:16px
}
.stp-c-btn{
  display:inline-flex;align-items:center;gap:6px;background:var(--stp-green);color:#fff;
  border:0;border-radius:10px;padding:10px 20px;font-weight:700;font-size:14px;cursor:pointer;
  text-decoration:none;transition:background .15s,transform .15s;font-family:var(--stp-font)
}
.stp-c-btn:hover{background:var(--stp-green-d);transform:translateY(-1px);color:#fff}
.stp-c-btn--gold{background:var(--stp-gold)}
.stp-c-btn--gold:hover{background:#b8860b}
.stp-c-pill{display:inline-block;padding:3px 12px;border-radius:999px;font-size:12px;font-weight:700;
  background:var(--stp-green-l);color:var(--stp-green-dd)}

/* ── سربرگ برندِ صفحاتِ کلاینت (اختیاری) ─────────────────────── */
.stp-c-hero{
  background:linear-gradient(135deg,var(--stp-green-d),var(--stp-green-dd));
  color:#fff;border-radius:var(--stp-radius);padding:20px 22px;margin-bottom:18px;
  box-shadow:var(--stp-shadow);position:relative;overflow:hidden
}
.stp-c-hero::after{content:"🌳";position:absolute;left:-6px;bottom:-20px;font-size:90px;opacity:.12;line-height:1}
.stp-c-hero h2{color:#fff!important;margin:0;font-size:20px;font-weight:800}
.stp-c-hero p{margin:5px 0 0;opacity:.92;font-size:13px}

/* اسکرول‌بار ملایم در محفظه‌های اسکرول‌دار */
[class^="stp-"]::-webkit-scrollbar{height:8px;width:8px}
[class^="stp-"]::-webkit-scrollbar-thumb{background:var(--stp-green-l);border-radius:8px}

/* ===================================================================
   خانه‌ی دانش‌آموز + درختِ کلاینت — فاز B (نسخه 2.4.0)
   =================================================================== */
.stp-home{max-width:760px;margin:0 auto}
.stp-home-hero{background:linear-gradient(135deg,var(--stp-green-d),var(--stp-green-dd));color:#fff;
  border-radius:var(--stp-radius);padding:20px 22px;margin-bottom:16px;position:relative;overflow:hidden}
.stp-home-hero::after{content:"🌳";position:absolute;left:-6px;bottom:-18px;font-size:88px;opacity:.13}
.stp-home-hero h2{color:#fff!important;margin:0;font-size:20px;font-weight:800}
.stp-home-hero p{margin:5px 0 0;opacity:.92;font-size:13px}

.stp-home-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(98px,1fr));gap:10px;margin-bottom:18px}
.stp-hs{background:#fff;border:1px solid var(--stp-line);border-radius:12px;padding:12px 8px;text-align:center;box-shadow:var(--stp-shadow)}
.stp-hs .n{font-size:23px;font-weight:800;color:var(--stp-green-dd);line-height:1}
.stp-hs .l{font-size:11px;color:var(--stp-muted);margin-top:4px}
.stp-hs .ic{font-size:16px;display:block;margin-bottom:3px}
.stp-hs.soon{opacity:.6}
.stp-hs.soon .n{font-size:13px;color:var(--stp-muted);padding-top:6px}

.stp-rank{display:inline-flex;align-items:center;gap:7px;background:var(--stp-gold-l);color:#8a6100;
  border-radius:999px;padding:6px 14px;font-weight:700;font-size:13px;margin-bottom:16px}

.stp-home h4{color:var(--stp-green-dd);margin:18px 0 10px;font-size:15px}

/* درختِ کلاینت (همان رندرر مشترک) */
.stp-trees-c{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.stp-tree-card{display:block;background:#fff;border:1px solid var(--stp-line);border-radius:var(--stp-radius);
  padding:12px 12px 16px;box-shadow:var(--stp-shadow);text-decoration:none;color:inherit;text-align:center;
  transition:transform .15s,box-shadow .15s}
a.stp-tree-card:hover{transform:translateY(-3px);box-shadow:var(--stp-shadow-h)}
.stp-tree-svg{width:100%;height:auto;max-height:280px;display:block}
.stp-tree-meta h3{margin:4px 0 2px;font-size:14px;font-weight:700;color:var(--stp-ink)}
.stp-tree-meta p{margin:0 0 7px;font-size:12px;color:var(--stp-muted)}
.stp-tree-prog span{font-size:12px;color:var(--stp-green-dd);font-weight:600}
.stp-tree-prog .bar{height:6px;background:var(--stp-green-l);border-radius:99px;overflow:hidden;margin-top:5px}
.stp-tree-prog .bar i{display:block;height:100%;background:linear-gradient(90deg,#5cb85c,#1b7a33)}

.stp-tree-legend-c{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--stp-muted);
  background:var(--stp-green-ll);border-radius:10px;padding:8px 14px;margin-bottom:12px}
.stp-tree-legend-c .dot{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:-1px;margin-left:4px}

/* ── پوستهٔ بازی‌گونهٔ پنل — نسخهٔ 3.34.8 ───────────────────────── */
.stp-app{background:radial-gradient(circle at 12% 8%,#f4fbe8 0,#f7fbf8 36%,#eef7f0 100%)}
.stp-app-body{background:transparent}
.stp-app-body .stp-c-card{border:1px solid rgba(52,120,61,.14);border-radius:18px;box-shadow:0 8px 22px rgba(29,92,42,.08);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.stp-app-body a.stp-c-card:hover{transform:translateY(-3px);border-color:#8bcf91;box-shadow:0 12px 28px rgba(29,92,42,.14)}
.stp-app-body .stp-c-btn{box-shadow:0 4px 0 rgba(20,92,38,.18)}
.stp-app-body .stp-c-btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(20,92,38,.18)}
.stp-home-hero{background:linear-gradient(135deg,#196b39 0%,#2e9a58 55%,#75be58 100%);box-shadow:0 12px 26px rgba(25,107,57,.22);border:1px solid rgba(255,255,255,.18)}
.stp-home-hero:before{content:"✦  ✧  ✦";position:absolute;right:18px;top:12px;color:rgba(255,255,255,.55);font-size:13px;letter-spacing:8px}
.stp-home-stats .stp-hs{border:1px solid rgba(52,120,61,.16);box-shadow:0 6px 16px rgba(29,92,42,.08)}
.stp-home-stats .stp-hs:hover{transform:translateY(-2px);background:#fbfff7}
.stp-rank{box-shadow:0 4px 0 rgba(138,97,0,.12)}
.stp-tree-card{background:linear-gradient(180deg,#fff 0%,#f7fff5 100%);border-color:#cbe6c5;box-shadow:0 8px 18px rgba(29,92,42,.09)}
.stp-tree-card:after{content:"🌱";display:block;font-size:12px;opacity:.65;margin-top:5px}
.stp-app-nav{background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:2px solid #d9efd8}
.stp-nav-item{padding-top:8px;position:relative}
.stp-nav-item.active:before{content:"";position:absolute;top:-2px;left:25%;right:25%;height:3px;border-radius:0 0 8px 8px;background:#e8b923}
.stp-nav-item.active .ic{filter:none;animation:stp-nav-bounce .8s ease both}
@keyframes stp-nav-bounce{0%,100%{transform:translateY(-1px)}50%{transform:translateY(-5px)}}
.stp-lesson-sessions{margin:18px auto;max-width:900px;background:linear-gradient(135deg,#fffdf0,#f3faec);border:1px solid #e8d78b;border-radius:18px;padding:14px;box-shadow:0 8px 20px rgba(138,97,0,.10)}
.stp-lesson-sessions h3{margin:0 0 10px;color:#856404;font-size:15px}
.stp-lesson-sessions .stp-c-card{margin-bottom:9px;padding:13px 14px}
@media(max-width:540px){.stp-app-body{padding:12px 10px 18px}.stp-home-hero{padding:18px 16px}.stp-home-stats{gap:7px}.stp-home-stats .stp-hs{padding:10px 5px}.stp-trees-c{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stp-tree-card{padding:8px 7px 11px}.stp-tree-meta h3{font-size:12px}.stp-tree-meta p{font-size:10px}.stp-nav-item .lb{font-size:10px}}

/* ── کارت‌های کشویی دانش‌آموزانِ مربی — نسخهٔ 3.34.14 ─────────── */
.stp-coach-student-card{padding:10px 12px!important;background:linear-gradient(135deg,#fff 0%,#f8fcf7 100%)}
.stp-coach-student-accordion>summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:48px;cursor:pointer;user-select:none;padding:7px 8px;border-radius:12px;transition:background .15s,transform .15s}
.stp-coach-student-accordion>summary::-webkit-details-marker{display:none}
.stp-coach-student-accordion>summary:before{content:"＋";display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--stp-green-l);color:var(--stp-green-dd);font-size:18px;font-weight:700;flex:0 0 28px}
.stp-coach-student-accordion[open]>summary:before{content:"−";background:var(--stp-gold-l);color:#8a6100}
.stp-coach-student-accordion>summary:hover{background:#eef8ed;transform:translateY(-1px)}
.stp-coach-student-name{font-size:15px;font-weight:800;color:var(--stp-green-dd);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stp-coach-student-meta{font-size:11px;color:var(--stp-muted);white-space:nowrap;background:#f1f8e9;border-radius:999px;padding:4px 8px}
.stp-coach-student-details{border-top:1px dashed #cfe2d0;margin:8px 8px 0;padding:4px 0 2px;animation:stp-student-open .16s ease-out}
@keyframes stp-student-open{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:540px){.stp-coach-student-card{padding:8px!important}.stp-coach-student-accordion>summary{gap:7px;padding:6px 4px}.stp-coach-student-name{font-size:14px}.stp-coach-student-meta{font-size:10px;padding:3px 6px}.stp-coach-student-details{margin-right:4px;margin-left:4px}}
