/* =========================================================
   جهانی — کامپوننت‌های مرحله دوم
   بعد از jahani.css بارگذاری شود. فقط از توکن‌های :root همان فایل استفاده می‌کند.
   ========================================================= */

/* ---------- چیدمان ---------- */
.stack{display:grid;gap:var(--s-5)}
.stack-lg{display:grid;gap:var(--s-8)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3)}
.row--between{justify-content:space-between}
.with-aside{display:grid;gap:var(--s-6)}
.with-aside__side{display:grid;gap:var(--s-5);align-content:start}
@media (min-width:960px){
  /* beside the 272px sidebar a 280px filter column left the list ~410px wide at 1100px: narrower until there is room */
  .with-aside{grid-template-columns:220px minmax(0,1fr);gap:var(--s-6);align-items:start}
  .with-aside__side{position:sticky;top:var(--s-6)}
}
@media (min-width:1360px){.with-aside{grid-template-columns:280px minmax(0,1fr);gap:var(--s-8)}}
.split{display:grid;gap:var(--s-6)}
@media (min-width:960px){.split{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s-7);align-items:start}}
.page-head__actions{display:flex;flex:none;gap:var(--s-2)}
.back-link{display:inline-flex;align-items:center;gap:var(--s-1);min-height:var(--tap);margin-bottom:var(--s-1);color:var(--c-text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium)}
.back-link:hover{color:var(--c-text)}
.count{font-size:var(--fs-sm);color:var(--c-text-2)}
button.link{color:var(--c-accent)}
button.link:hover{color:var(--c-accent-hover)}

/* ---------- تب زیرخط‌دار ---------- */
.tabs{display:flex;gap:var(--s-1);margin-inline:calc(var(--s-5) * -1);padding-inline:var(--s-5);overflow-x:auto;border-bottom:1px solid var(--c-border);scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs__btn{position:relative;display:inline-flex;align-items:center;flex:none;min-height:52px;padding:0 var(--s-4);color:var(--c-text-2);font-size:var(--fs-body);font-weight:var(--fw-medium);white-space:nowrap}
.tabs__btn:hover{color:var(--c-text)}
.tabs__btn::after{content:"";position:absolute;inset-inline:var(--s-4);bottom:-1px;height:2px;border-radius:2px;background:var(--c-accent);transform:scaleX(0);transition:transform var(--dur-2) var(--ease-out)}
.tabs__btn.is-active{color:var(--c-text);font-weight:var(--fw-bold)}
.tabs__btn.is-active::after{transform:scaleX(1)}
@media (min-width:960px){.tabs{margin-inline:0;padding-inline:0}}

/* ---------- فیلتر ---------- */
.filters{display:grid;gap:var(--s-2)}
.filters__label{font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--c-text-2)}
.chips{display:flex;gap:var(--s-2);margin-inline:calc(var(--s-5) * -1);padding-inline:var(--s-5);overflow-x:auto;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
@media (min-width:960px){.chips{flex-wrap:wrap;margin-inline:0;padding-inline:0;overflow:visible}}
.chip{display:inline-flex;align-items:center;gap:6px;flex:none;min-height:var(--tap);padding:0 var(--s-4);border:1px solid var(--c-border-strong);border-radius:var(--r-pill);color:var(--c-text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);white-space:nowrap;transition:transform var(--dur-1) var(--ease-out)}
.chip:hover{border-color:var(--c-border-hover);color:var(--c-text)}
.chip:active{transform:scale(.96)}
.chip.is-on{background:var(--c-accent-soft);border-color:var(--c-accent);color:var(--c-accent);font-weight:var(--fw-bold)}

/* ---------- فرم ---------- */
.fieldset{display:grid;gap:var(--s-2);min-width:0;margin:0;padding:0;border:0}
.fieldset legend{padding:0;margin-bottom:var(--s-2)}
.input--area{min-height:132px;padding:var(--s-3) var(--s-4);line-height:1.9;resize:vertical}
.select{appearance:none;-webkit-appearance:none;padding-inline-end:48px;cursor:pointer}
.select-wrap{position:relative}
.select-wrap .icon{position:absolute;inset-inline-end:16px;top:50%;width:18px;height:18px;color:var(--c-text-2);pointer-events:none;transform:translateY(-50%) rotate(-90deg)}
.input-wrap--end .input{padding-inline-end:56px}
.input-wrap__btn{position:absolute;inset-inline-end:4px;top:50%;display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:var(--r-sm);color:var(--c-text-2);transform:translateY(-50%)}
.input-wrap__btn:hover{color:var(--c-text)}
.input-wrap__btn .icon{position:static;width:22px;height:22px;transform:none}
.input-suffix{position:absolute;inset-inline-end:16px;top:50%;font-size:var(--fs-sm);color:var(--c-text-2);pointer-events:none;transform:translateY(-50%)}
.input-wrap--suffix .input{padding-inline-end:72px}
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:var(--s-2)}
.choice{display:flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:52px;padding:0 var(--s-3);border:1px solid var(--c-border-strong);border-radius:var(--r-md);background:var(--c-bg);color:var(--c-text-2);font-size:var(--fs-sm);font-weight:var(--fw-medium);text-align:center;transition:transform var(--dur-1) var(--ease-out)}
.choice:hover{border-color:var(--c-border-hover);color:var(--c-text)}
.choice:active{transform:scale(.97)}
.choice.is-on{border-color:var(--c-accent);box-shadow:inset 0 0 0 1px var(--c-accent);color:var(--c-text);font-weight:var(--fw-bold)}
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);width:100%;min-height:72px;padding-block:var(--s-3);border-bottom:1px solid var(--c-border);text-align:start}
.switch-row:last-child{border-bottom:0}
.switch-row__text{display:grid;gap:2px}
.switch-row__title{font-weight:var(--fw-bold)}
.switch-row__meta{font-size:var(--fs-sm);color:var(--c-text-2)}
.switch{position:relative;flex:none;width:52px;height:32px;border-radius:var(--r-pill);background:var(--c-surface-3)}
.switch::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:26px;height:26px;border-radius:50%;background:var(--c-text);transition:transform var(--dur-2) var(--ease-out)}
[aria-checked="true"] .switch{background:var(--c-accent)}
[aria-checked="true"] .switch::after{background:var(--c-on-accent);transform:translateX(-20px)}
.alert{display:flex;align-items:flex-start;gap:var(--s-3);padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--c-surface-2);font-size:var(--fs-sm);line-height:1.7;animation:view-in var(--dur-3) var(--ease-out) both}
.alert .icon{width:20px;height:20px;margin-top:2px}
.alert--bad{background:var(--c-bad-soft);color:var(--c-bad)}
.alert--warn{background:var(--c-warn-soft);color:var(--c-warn)}
.alert--ok{background:var(--c-ok-soft);color:var(--c-ok)}
.spinner{display:inline-block;flex:none;width:20px;height:20px;border:2.5px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.btn.is-busy{pointer-events:none;opacity:.85}
.btn--danger{--btn-bg:var(--c-bad);--btn-fg:var(--c-on-accent)}
.btn--danger:hover{opacity:.9}

/* ---------- فهرست ---------- */
.list__row--link{color:var(--c-text);transition:transform var(--dur-1) var(--ease-out)}
.list__row--link:hover{color:var(--c-text)}
.list__row--link:active{transform:scale(.99)}
.list__row--link .list__chev{transition:transform var(--dur-2) var(--ease-out)}
.list__row--link:hover .list__chev{transform:translateX(-3px)}
.list__end--stack{flex-direction:column;align-items:flex-end;gap:var(--s-1)}
.kv{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:52px;border-bottom:1px solid var(--c-border)}
.kv:last-child{border-bottom:0}
.kv dt{color:var(--c-text-2);font-size:var(--fs-sm)}
.kv dd{font-weight:var(--fw-bold)}
.big-num{font-size:1.25rem;font-weight:var(--fw-black);white-space:nowrap}
.group{display:grid;gap:var(--s-3)}
.group__title{padding-inline:var(--s-1);font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-2)}
.nav-item--danger,.nav-item--danger:hover{color:var(--c-bad)}

/* ---------- دکمه شناور (فقط موبایل) ---------- */
.fab{position:fixed;inset-inline-end:var(--s-5);bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + var(--s-4));z-index:35;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:var(--c-accent);color:var(--c-on-accent);box-shadow:var(--shadow-1);transition:transform var(--dur-2) var(--ease-out)}
.fab:hover{color:var(--c-on-accent);transform:translateY(-2px)}
.fab:active{transform:scale(.94)}
.fab .icon{width:28px;height:28px;stroke-width:2.2}
@media (min-width:960px){.fab{display:none}}

/* ---------- کشوی فرم / مودال / پیام کوتاه ---------- */
.sheet__body{display:grid;gap:var(--s-5);padding:0 var(--s-2)}
.sheet__foot{display:grid;gap:var(--s-2);padding-top:var(--s-2)}
@keyframes dialog-in{from{opacity:0;transform:scale(.96)}}
@media (min-width:960px){
  .sheet--dialog{inset:0;width:min(560px,calc(100% - 48px));height:fit-content;max-height:88vh;margin:auto;padding:var(--s-6);border:1px solid var(--c-border-strong);border-radius:var(--r-xl);box-shadow:var(--shadow-2);animation-name:dialog-in}
  .sheet--dialog .sheet__grab{display:none}
}
.modal{position:fixed;inset:0;z-index:51;display:grid;gap:var(--s-3);width:min(440px,calc(100% - 32px));height:fit-content;max-height:86vh;margin:auto;padding:var(--s-7) var(--s-6) var(--s-6);overflow-y:auto;background:var(--c-surface);border:1px solid var(--c-border-strong);border-radius:var(--r-xl);box-shadow:var(--shadow-2);animation:dialog-in var(--dur-3) var(--ease-out) both}
.modal__icon{display:grid;place-items:center;width:56px;height:56px;margin-bottom:var(--s-2);border-radius:50%;background:var(--c-bad-soft);color:var(--c-bad)}
.modal__icon--accent{background:var(--c-accent-soft);color:var(--c-accent)}
.modal__title{font-size:var(--fs-h3);font-weight:var(--fw-black);line-height:1.45}
.modal__text{color:var(--c-text-2);text-wrap:pretty}
.modal__actions{display:grid;gap:var(--s-2);margin-top:var(--s-4)}
@media (min-width:600px){.modal__actions{grid-template-columns:1fr 1fr}}
.toast{position:fixed;inset-inline:var(--s-4);bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + var(--s-4));z-index:60;display:flex;align-items:center;gap:var(--s-3);width:fit-content;max-width:calc(100% - 32px);min-height:52px;margin-inline:auto;padding:var(--s-2) var(--s-5);background:var(--c-surface-3);border:1px solid var(--c-border-strong);border-radius:var(--r-pill);box-shadow:var(--shadow-1);font-size:var(--fs-sm);font-weight:var(--fw-bold);animation:toast-in var(--dur-3) var(--ease-out) both}
.toast .icon{color:var(--c-ok)}
.toast--bad .icon{color:var(--c-bad)}
.toast--high{bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 240px)}
@keyframes toast-in{from{opacity:0;transform:translateY(16px)}}
@media (min-width:960px){.toast,.toast--high{bottom:var(--s-7)}}

/* ---------- حالت‌ها ---------- */
.state{display:grid;justify-items:center;gap:var(--s-2);padding:var(--s-9) var(--s-5);text-align:center}
.state__icon{display:grid;place-items:center;width:64px;height:64px;margin-bottom:var(--s-3);border-radius:50%;background:var(--c-surface-2);color:var(--c-text-2)}
.state__icon .icon{width:28px;height:28px}
.state--bad .state__icon{background:var(--c-bad-soft);color:var(--c-bad)}
.state--ok .state__icon{background:var(--c-ok-soft);color:var(--c-ok)}
.state__title{font-size:var(--fs-h3);font-weight:var(--fw-black);line-height:1.45}
.state__text{max-width:34ch;font-size:var(--fs-sm);color:var(--c-text-2);text-wrap:pretty}
.state__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s-2);margin-top:var(--s-4)}
.skel{display:block;border-radius:var(--r-sm);background:var(--c-surface-2);animation:skel 1.4s var(--ease-in-out) infinite}
.skel--line{width:58%;height:14px}
.skel--short{width:34%;height:12px}
.skel--circle{flex:none;width:40px;height:40px;border-radius:50%}
.skel--block{height:132px;border-radius:var(--r-lg)}
.skel-row{display:flex;align-items:center;gap:var(--s-3);min-height:68px;border-bottom:1px solid var(--c-border)}
.skel-row:last-child{border-bottom:0}
.skel-stack{display:grid;flex:1;gap:var(--s-2)}
@keyframes skel{50%{opacity:.4}}

/* ---------- قفل Pro ---------- */
.lock{position:relative;display:grid}
.lock__preview{grid-area:1/1;opacity:.18;pointer-events:none;user-select:none}
.lock__card{position:relative;z-index:1;grid-area:1/1;align-self:start;justify-self:center;display:grid;justify-items:center;gap:var(--s-3);width:min(460px,100%);margin-top:var(--s-6);padding:var(--s-8) var(--s-6) var(--s-6);background:var(--c-surface);border:1px solid var(--c-accent);border-radius:var(--r-xl);box-shadow:var(--shadow-2);text-align:center;animation:rise-in var(--dur-4) var(--ease-out) both}
.lock__icon{display:grid;place-items:center;width:56px;height:56px;margin-bottom:var(--s-2);border-radius:50%;background:var(--c-accent-soft);color:var(--c-accent)}
.lock__title{font-size:var(--fs-h2);font-weight:var(--fw-black);line-height:1.3}
.lock__text{color:var(--c-text-2);text-wrap:pretty}
.lock__price{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:var(--s-2);margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--c-text-2)}
.lock__price strong{font-size:1.5rem;font-weight:var(--fw-black);color:var(--c-accent)}
.lock__actions{display:grid;gap:var(--s-2);width:100%;margin-top:var(--s-3)}

/* ---------- نمودار ---------- */
.chart--fluid{width:100%;height:180px;overflow:visible}
.chart__line--muted{stroke:var(--c-text-3);stroke-width:2;stroke-dasharray:5 6}
.chart-x{display:flex;justify-content:space-between;margin-top:var(--s-2);font-size:var(--fs-xs);color:var(--c-text-2)}
.legend{display:flex;flex-wrap:wrap;gap:var(--s-4);font-size:var(--fs-xs);color:var(--c-text-2)}
.legend__item{display:inline-flex;align-items:center;gap:var(--s-2)}
.legend__mark{width:16px;height:3px;border-radius:2px;background:var(--c-accent)}
.legend__mark--muted{background:var(--c-text-3)}

/* ---------- ورود و ثبت‌نام ---------- */
.auth{display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:var(--s-6) var(--gutter) var(--s-9)}
.auth__box{display:grid;gap:var(--s-8);width:100%;max-width:420px}
.auth__top{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.auth__head{display:grid;gap:var(--s-2)}
.auth__title{font-size:var(--fs-h1);font-weight:var(--fw-black);line-height:1.2}
.auth__form{display:grid;gap:var(--s-5)}

/* ---------- پرونده شاگرد ---------- */
.profile-head{display:grid;gap:var(--s-5);padding:var(--s-5) 0 var(--s-6)}
.profile-head__who{display:flex;align-items:center;gap:var(--s-4)}
.avatar--xl{width:72px;height:72px;font-size:1.625rem}
.profile-head__name{font-size:clamp(1.875rem,1.5rem + 1.4vw,2.5rem);font-weight:var(--fw-black);line-height:1.25}
.profile-head__meta{color:var(--c-text-2)}
.profile-head__tags{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-2)}
.tab-panel{padding-top:var(--s-6);animation:view-in var(--dur-3) var(--ease-out) both}
.rec__time{font-size:1.125rem;font-weight:var(--fw-black);direction:ltr;unicode-bidi:isolate;white-space:nowrap}
.note{display:grid;gap:var(--s-1);padding-block:var(--s-4);border-bottom:1px solid var(--c-border)}
.note:last-child{border-bottom:0}
.note__date{font-size:var(--fs-xs);color:var(--c-text-2)}
.note__text{line-height:1.9;text-wrap:pretty}
.cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.cal__dow{padding-bottom:var(--s-1);font-size:var(--fs-xs);color:var(--c-text-3);text-align:center}
.cal__day{display:grid;place-items:center;aspect-ratio:1;max-height:56px;border-radius:var(--r-sm);font-size:var(--fs-sm);color:var(--c-text-3)}
.cal__day--ok{background:var(--c-ok-soft);color:var(--c-ok);font-weight:var(--fw-bold)}
.cal__day--warn{background:var(--c-warn-soft);color:var(--c-warn);font-weight:var(--fw-bold)}
.cal__day--bad{background:var(--c-bad-soft);color:var(--c-bad);font-weight:var(--fw-bold)}
.cal__day--plan{color:var(--c-text);box-shadow:inset 0 0 0 1px var(--c-border-strong)}
.cal__day--today{color:var(--c-text);font-weight:var(--fw-bold);box-shadow:inset 0 0 0 2px var(--c-accent)}

/* ---------- حضور و غیاب روزانه ---------- */
.attn{display:grid;gap:var(--s-5);padding-bottom:250px}
@media (min-width:960px){.attn{grid-template-columns:minmax(0,1fr) 380px;align-items:start;gap:var(--s-7);padding-bottom:0}}
/* the session card of the weekly sessions page: one big button with only time, title and status */
.sess-list{display:grid;gap:var(--s-3)}
.sess-card{display:flex;align-items:center;gap:var(--s-4);width:100%;min-height:92px;padding:var(--s-5);text-align:start;color:var(--c-text);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);transition:transform var(--dur-1) var(--ease-out),background var(--dur-1) var(--ease-out)}
.sess-card:hover{background:var(--c-surface-2)}
.sess-card:active{transform:scale(.99)}
.sess-card__time{flex:none;min-width:4.75rem;font-size:var(--fs-h3);font-weight:var(--fw-black);font-variant-numeric:tabular-nums}
.sess-card__time--none{font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--c-text-2)}
.sess-card__title{flex:1;min-width:0;font-size:var(--fs-body);font-weight:var(--fw-bold);line-height:1.6;overflow-wrap:anywhere}
.sess-card--done .sess-card__time,.sess-card--done .sess-card__title{color:var(--c-text-2)}
.attn>.stack{min-width:0;grid-template-columns:minmax(0,1fr)}
.attn .btn--block{white-space:normal;line-height:1.5;padding-block:var(--s-3)}
.ticks{display:grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px}
.tick{height:6px;border-radius:3px;background:var(--c-surface-3)}
.tick--ok{background:var(--c-ok)}
.tick--warn{background:var(--c-warn)}
.tick--bad{background:var(--c-bad)}
.attn-list{display:grid;gap:2px}
.attn-row{display:flex;align-items:center;gap:var(--s-3);width:100%;min-height:64px;padding:var(--s-2) var(--s-3);border-radius:var(--r-md);text-align:start;transition:transform var(--dur-1) var(--ease-out)}
.attn-row:hover{background:var(--c-surface)}
.attn-row:active{transform:scale(.99)}
.attn-row.is-current{background:var(--c-surface-2);box-shadow:inset 0 0 0 1px var(--c-accent)}
.attn-row__name{flex:1;min-width:0;font-weight:var(--fw-bold)}
.attn-row__empty{font-size:var(--fs-sm);color:var(--c-text-3)}
.pad{position:fixed;inset-inline:0;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom));z-index:35;display:grid;gap:var(--s-3);padding:var(--s-4) var(--s-4) var(--s-3);background:var(--c-glass);border-top:1px solid var(--c-border);-webkit-backdrop-filter:saturate(1.4) blur(20px);backdrop-filter:saturate(1.4) blur(20px)}
.pad__who{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:32px}
.pad__name{font-size:1.125rem;font-weight:var(--fw-black)}
.pad__btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2)}
.pad__btn{min-height:68px;border:1px solid transparent;border-radius:var(--r-lg);font-size:1.0625rem;font-weight:var(--fw-bold);transition:transform var(--dur-1) var(--ease-out)}
.pad__btn:active{transform:scale(.95)}
.pad__btn--ok{background:var(--c-ok-soft);border-color:var(--c-ok);color:var(--c-ok)}
.pad__btn--warn{background:var(--c-warn-soft);border-color:var(--c-warn);color:var(--c-warn)}
.pad__btn--bad{background:var(--c-bad-soft);border-color:var(--c-bad);color:var(--c-bad)}
@media (min-width:960px){
  .pad{position:sticky;top:var(--s-6);inset:auto;padding:var(--s-6);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-xl);-webkit-backdrop-filter:none;backdrop-filter:none}
  .pad__btns{grid-template-columns:1fr}
}

/* ---------- تمرین‌نویسی ---------- */
.steps{display:flex;align-items:center;gap:var(--s-2);font-size:var(--fs-sm);color:var(--c-text-3)}
.step{display:flex;align-items:center;gap:var(--s-2);white-space:nowrap}
.step__n{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--c-border-strong);border-radius:50%;font-size:var(--fs-xs);font-weight:var(--fw-bold)}
.step.is-active{color:var(--c-text);font-weight:var(--fw-bold)}
.step.is-active .step__n{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-on-accent)}
.step.is-done{color:var(--c-text-2)}
.step.is-done .step__n{border-color:var(--c-accent);color:var(--c-accent)}
.steps__sep{flex:1;max-width:48px;height:1px;background:var(--c-border-strong)}
.review{display:grid;gap:var(--s-3)}
.review__item{display:flex;align-items:flex-start;gap:var(--s-3);font-size:var(--fs-sm);line-height:1.8}
.review__item .icon{width:20px;height:20px;margin-top:3px;color:var(--c-ok)}
.review__item--warn .icon{color:var(--c-warn)}
.set__edit{display:flex;align-items:center;gap:var(--s-1)}

/* ---------- بانک تمرین ---------- */
.drills{display:grid;gap:var(--s-3)}
@media (min-width:1200px){.drills{grid-template-columns:repeat(2,minmax(0,1fr))}}
.drill{display:grid;gap:var(--s-3);padding:var(--s-5);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--r-lg);transition:transform var(--dur-2) var(--ease-out)}
.drill:hover{transform:translateY(-2px)}
.drill__top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3)}
.drill__title{font-size:1.125rem;font-weight:var(--fw-bold);line-height:1.5}
.drill__open{display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:start;cursor:pointer}
.drill__sets{margin-top:2px;font-size:var(--fs-sm);color:var(--c-text-2)}
.drill__foot{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2)}
.drill__m{margin-inline-start:auto;font-weight:var(--fw-black)}

/* ---------- جلسات ---------- */
.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--s-1)}
.day{display:grid;justify-items:center;gap:2px;min-height:72px;padding:var(--s-2) 0;border-radius:var(--r-md);color:var(--c-text-2);transition:transform var(--dur-1) var(--ease-out)}
.day:hover{background:var(--c-surface)}
.day:active{transform:scale(.95)}
.day__name{font-size:12px}
.day__num{font-size:1.25rem;font-weight:var(--fw-bold);line-height:1.3;color:var(--c-text)}
.day__dot{width:5px;height:5px;border-radius:50%;background:var(--c-text-3)}
.day__dot--none{opacity:0}
.day--today .day__name{color:var(--c-accent);font-weight:var(--fw-bold)}
.day.is-active,.day.is-active:hover{background:var(--c-accent);color:var(--c-on-accent)}
.day.is-active .day__num,.day.is-active .day__name{color:var(--c-on-accent)}
.day.is-active .day__dot{background:var(--c-on-accent)}
.sess{border-bottom:1px solid var(--c-border)}
.sess:last-child{border-bottom:0}
.sess__sum{display:flex;align-items:center;gap:var(--s-3);min-height:76px;list-style:none;cursor:pointer}
.sess__sum::-webkit-details-marker{display:none}
.sess__chev{color:var(--c-text-3);transform:rotate(-90deg);transition:transform var(--dur-2) var(--ease-out)}
.sess[open] .sess__chev{transform:rotate(90deg)}
.sess__body{display:grid;gap:var(--s-4);padding-bottom:var(--s-5);animation:view-in var(--dur-3) var(--ease-out) both}
.sess--done .session__time,.sess--done .list__title{color:var(--c-text-2)}

/* ---------- مالی ---------- */
.summary{display:grid;gap:var(--s-4)}
@media (min-width:600px){.summary{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.summary__label{font-size:var(--fs-sm);color:var(--c-text-2)}
.summary__value{font-size:clamp(2rem,1.7rem + 1.2vw,2.75rem);font-weight:var(--fw-black);line-height:1.25}
.summary__value--accent{color:var(--c-accent)}
.summary__value--sm{font-size:clamp(1.5rem,1.3rem + .8vw,2rem)}
.summary__unit{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-2)}

/* ---------- بیشتر / حساب ---------- */
.account{display:flex;align-items:center;gap:var(--s-4)}
.account__name{font-size:var(--fs-h3);font-weight:var(--fw-black);line-height:1.4}
.account__meta{font-size:var(--fs-sm);color:var(--c-text-2)}

/* ---------- پورتال اولیا ---------- */
.portal{width:100%;max-width:640px;margin-inline:auto;padding:0 var(--s-5) var(--s-10)}
.portal-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:var(--header-h)}
.portal-child{display:grid;gap:var(--s-1);padding:var(--s-8) 0 var(--s-6)}
.portal-child__name{font-size:var(--fs-h1);font-weight:var(--fw-black);line-height:1.2}
.portal-child__meta{color:var(--c-text-2)}
.portal__tabs{position:sticky;top:var(--s-3);z-index:5}
.portal__panel{display:grid;gap:var(--s-5);padding-top:var(--s-6)}
.portal__panel.is-entering{animation:view-in var(--dur-3) var(--ease-out) both}
.portal__panel[hidden]{display:none}
.portal .seg__btn{padding-inline:var(--s-2);font-size:var(--fs-xs)}
.portal-arrow{font-size:1.5rem;line-height:1}
.portal-foot{display:grid;justify-items:center;gap:var(--s-3);padding-top:var(--s-10);font-size:var(--fs-xs);color:var(--c-text-2);text-align:center}

/* ---------- گالری حالت‌ها ---------- */
.gallery{display:grid;gap:var(--s-5)}
@media (min-width:860px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gallery__item{display:grid;gap:var(--s-3);align-content:start}
.gallery__label{font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--c-text-2)}
.gallery__stage{position:relative;min-height:320px;overflow:hidden;background:var(--c-bg);border:1px solid var(--c-border);border-radius:var(--r-xl)}
.gallery__center{display:grid;place-items:center;min-height:320px;padding:var(--s-5)}
.modal--inline{position:relative;inset:auto;z-index:auto;width:100%;max-width:420px;margin:0;animation:none;box-shadow:none}
.toast--inline{position:relative;inset:auto;z-index:auto;margin:0;animation:none;box-shadow:none}
.toast--flat{bottom:var(--s-6)}

/* =========================================================
   پنل ادمین
   ========================================================= */
:root{
  --c-mod-surface:#12181C;
  --c-mod-aqua:#0F2629;
  --c-mod-green:#13241B;
  --c-mod-amber:#272013;
  --c-mod-rose:#281817;
  --bar-h:168px;
}
.sidebar__brand{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.admin-top{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:var(--header-h)}
.admin-top + .page-head{padding-top:var(--s-4)}
.badge--outline{background:transparent;border:1px solid var(--c-border-strong);color:var(--c-text-2)}
.btn--danger-ghost{--btn-fg:var(--c-bad)}
.btn--danger-ghost:hover{--btn-bg:var(--c-bad-soft)}

.dash{display:grid;gap:var(--s-5)}
.dash__row{display:grid;gap:var(--s-5)}
@media (min-width:960px){.dash{gap:var(--s-6)}.dash__row{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);align-items:stretch}}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
@media (min-width:960px){.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-4)}}
.stat{display:grid;gap:var(--s-1);align-content:start;min-width:0}
.stat__label{font-size:var(--fs-sm);font-weight:var(--fw-medium);color:var(--c-text-2)}
.stat__value{font-size:clamp(2rem,1.7rem + 1.2vw,2.75rem);font-weight:var(--fw-black);line-height:1.2}
.stat__value--warn{color:var(--c-warn)}
.stat__meta{font-size:var(--fs-xs);color:var(--c-text-2)}

.bars-wrap{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-2) var(--s-3)}
.bars-y{display:flex;flex-direction:column;justify-content:space-between;height:var(--bar-h);font-size:var(--fs-xs);color:var(--c-text-2);line-height:1}
.bars{position:relative;display:grid;grid-template-columns:repeat(30,minmax(0,1fr));align-items:end;gap:3px;height:var(--bar-h);border-bottom:1px solid var(--c-border-strong)}
.bars::before{content:"";position:absolute;inset-inline:0;top:0;border-top:1px dashed var(--c-border)}
.bar{display:block;height:100%;border-radius:4px 4px 0 0;background:var(--c-accent);transform-origin:50% 100%;animation:bar-grow var(--dur-4) var(--ease-out) both}
.bar--0{background:var(--c-border-strong);transform:scaleY(.02);animation:none}
.bar--1{transform:scaleY(.2)}
.bar--2{transform:scaleY(.4)}
.bar--3{transform:scaleY(.6)}
.bar--4{transform:scaleY(.8)}
.bar--5{transform:scaleY(1)}
@keyframes bar-grow{from{transform:scaleY(0)}}
.bars-x{grid-column:2;display:flex;justify-content:space-between;font-size:var(--fs-xs);color:var(--c-text-2)}

.list-tools{display:grid;gap:var(--s-3)}
@media (min-width:960px){.list-tools{grid-template-columns:minmax(0,380px) auto;justify-content:space-between;align-items:center}}
.card--flush{padding:0;overflow:hidden}
.dtable{display:grid}
.dtable__row{display:grid;grid-template-columns:var(--cols);align-items:center;gap:var(--s-4);min-height:64px;padding:var(--s-2) var(--s-5);border-bottom:1px solid var(--c-border);font-size:var(--fs-sm)}
.dtable__row > *{min-width:0}
.dtable__row--head{min-height:48px;font-size:var(--fs-xs);font-weight:var(--fw-medium);color:var(--c-text-2)}
.dtable [role="rowgroup"]:last-child .dtable__row:last-child{border-bottom:0}
.dtable [role="rowgroup"] .dtable__row:hover{background:var(--c-surface-2)}
.dtable [role="rowgroup"]:first-child .dtable__row:hover{background:transparent}
.dtable--coaches{--cols:minmax(0,1.7fr) minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.6fr) minmax(0,.6fr) 104px}
.dtable--codes{--cols:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) 96px}
.dtable__strong{overflow:hidden;font-size:var(--fs-body);font-weight:var(--fw-bold);white-space:nowrap;text-overflow:ellipsis}
.cell{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-2)}
.cards{display:grid;gap:var(--s-3)}
.item-card{display:grid;gap:var(--s-2)}
.item-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3)}
.impact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-1) var(--s-4);margin:0;padding:var(--s-3) var(--s-4);border-radius:var(--r-md);background:var(--c-surface-2);font-size:var(--fs-sm)}
.impact div{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2);min-width:0}
.impact dt{color:var(--c-text-2)}
.impact dd{margin:0;font-weight:var(--fw-bold)}
.impact--wait{display:block}
.item-card__foot{padding-top:var(--s-2);border-top:1px solid var(--c-border)}
.code{font-family:var(--font-mono);font-size:var(--fs-body);font-weight:var(--fw-bold);letter-spacing:.04em;direction:ltr;unicode-bidi:isolate;white-space:nowrap}
.code-cell{display:flex;align-items:center;gap:var(--s-1)}

.swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-2)}
.swatch{display:grid;justify-items:center;gap:6px;min-height:var(--tap);padding:var(--s-2) var(--s-1);border:1px solid var(--c-border-strong);border-radius:var(--r-md);color:var(--c-text-2);font-size:var(--fs-xs);font-weight:var(--fw-medium);transition:transform var(--dur-1) var(--ease-out)}
.swatch:hover{border-color:var(--c-border-hover);color:var(--c-text)}
.swatch:active{transform:scale(.96)}
.swatch.is-on{border-color:var(--c-accent);box-shadow:inset 0 0 0 1px var(--c-accent);color:var(--c-text);font-weight:var(--fw-bold)}
.swatch__chip{width:32px;height:32px;border-radius:50%;border:1px solid var(--c-border-hover)}
.mod--surface{background:var(--c-mod-surface)}
.mod--aqua{background:var(--c-mod-aqua)}
.mod--green{background:var(--c-mod-green)}
.mod--amber{background:var(--c-mod-amber)}
.mod--rose{background:var(--c-mod-rose)}
.list__title--wrap{white-space:normal;overflow:visible;text-overflow:clip}
.mod-dot{flex:none;width:40px;height:40px;border-radius:var(--r-sm);border:1px solid var(--c-border-hover)}
.mod-preview{display:grid;align-content:end;justify-items:start;gap:var(--s-2);min-height:132px;margin-top:var(--s-2);padding:var(--s-5);border:1px solid var(--c-border-strong);border-radius:var(--r-lg)}
.mod-preview__title{font-size:1.125rem;font-weight:var(--fw-black);line-height:1.5}
.mod-preview__text{font-size:var(--fs-sm);color:var(--c-text-2)}
.skel--value{width:50%;height:40px}
.skel--chart{height:280px}

/* the live regions of the toasts hold no box of their own */
.toast-region{display:contents}
.badge.soon{font-weight:var(--fw-medium)}
.plain-list{display:grid;gap:var(--s-2);margin:0;padding-inline-start:var(--s-5);font-size:var(--fs-body)}

/* ---------- small helpers (they replace the last static style attributes) ---------- */
.u-white{color:#fff}
.u-gap-xs{gap:.4rem}
.u-gap-sm{gap:.5rem}
.u-gap-lg{gap:1rem}
.u-center-pad{text-align:center;padding:1rem 0}
.u-small{font-size:.92rem}
/* the student row on a wide screen: the due badge sits above the two buttons, so the name and details keep the width */
@media (min-width:960px) and (max-width:1359px){.student-item .list__end{flex-wrap:wrap;justify-content:flex-end;width:96px}}
