/* v4: Elektron jurnal və qiymətləndirmə, mesajlar, imtahan rejimi, mobil düzəlişlər */

/* ---------- Vahid jurnal ---------- */
.jx-tb{flex-wrap:wrap;align-items:flex-end}
.jx-tb .fld{min-width:0}
.jx-tabs{margin:12px 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.jx-tabs::-webkit-scrollbar{display:none}
.jx{min-height:120px}
.jx>.card{overflow:hidden}
.jx .card-h{align-items:flex-start;gap:12px}
.jx .card-h small.mut{display:block;line-height:1.5;margin-top:2px;max-width:880px}
.jtw4{max-height:70vh;overflow:auto;overscroll-behavior-x:contain}
.jt4{border-collapse:separate;border-spacing:0;width:100%}
.jt4 th,.jt4 td{white-space:nowrap}
.jt4 thead th{position:sticky;top:0;z-index:2;background:var(--surface-2,var(--surface))}
.jt4 thead th.stk{z-index:4;left:0}
.jt4 td.stk{z-index:1}
.jt4 th.jl{padding:4px;text-align:center;vertical-align:bottom}
.jt4 .colh{display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:none;cursor:pointer;padding:4px 6px;border-radius:6px;color:var(--ink-2);font:inherit;margin:0 auto}
.jt4 .colh:hover{background:var(--primary-soft);color:var(--primary)}
.jt4 .colh b{font-size:12px}
.jt4 .colh span{font-size:10.5px;font-weight:500;display:inline-flex;align-items:center;gap:3px}
.jt4 .colh svg{width:10px;height:10px}
.jt4 th.k-seminar .colh span{color:#2F6FB2}
.jt4 th.k-lab .colh span{color:#7A4FB5}
.jt4 td.num input{width:58px;height:28px;padding:0 4px;text-align:center;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit;font-size:13px}
.jt4 td.num input:focus{outline:2px solid color-mix(in srgb,var(--primary) 35%,transparent);border-color:var(--primary)}
.jt4.narrow{width:auto;min-width:340px}
.jt4 .c-auto small{font-weight:400}
.jt4 .meter{min-width:70px;margin-top:4px}
.stu-b{display:block;width:100%;border:0;background:none;padding:0;margin:0;text-align:left;cursor:pointer;color:inherit;font:inherit;border-radius:8px}
.stu-b:hover b{color:var(--primary);text-decoration:underline}
.stu-b:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.stu-b .who{min-width:0}
.jt4 .stk{max-width:240px}
.jt4 .stk .who b{overflow:hidden;text-overflow:ellipsis;display:block;max-width:180px}
.bad-t{color:var(--danger,#B42318)}
.cs-staff{color:var(--ink-3)}
.jx+.hint{margin-top:10px}

/* Davamiyyət vərəqi */
.sh-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.sh-l{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.sh-r{display:flex;align-items:center;gap:10px;padding:8px 10px;border-top:1px solid var(--line)}
.sh-r:first-child{border-top:0}
.sh-r.fixed{background:color-mix(in srgb,var(--danger-soft,#FDE6E6) 45%,transparent)}
.sh-r .who small{font-size:11.5px}
.sh-seg button{min-width:48px;min-height:34px;font-weight:600}
.att .i,.att svg{width:11px;height:11px}
.att.lk{gap:3px}

/* Dərs pəncərəsi, tarixçə */
.pf-r{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.pf-r span{color:var(--ink-2)}
.hist{display:flex;flex-direction:column;gap:6px}
.hist .hi{display:flex;flex-direction:column;gap:2px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;font-size:13px}
.hist .hi span{color:var(--ink-3);font-size:12px}
.hist .hi small{color:var(--ink-2)}
.hist svg{width:12px;height:12px;vertical-align:-1px}

/* Tələbə kartı */
.sc-h{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.sc-h b{display:block;font-size:15px}
.sc-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.sc-b{border:1px solid var(--line);border-radius:10px;padding:9px 11px;display:flex;flex-direction:column;gap:2px;background:var(--surface)}
.sc-b small{color:var(--ink-3);font-size:11.5px}
.sc-b b{font-size:15px;font-variant-numeric:tabular-nums}
.sc-b span{color:var(--ink-3);font-size:11.5px}

/* Admin: model və müəllimlər */
.ck{display:flex;align-items:center;gap:8px;font-size:13px;grid-column:1/-1}
.sw-l{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.sw-t{display:grid;grid-template-columns:1fr 90px auto;gap:6px;align-items:center}
.st-s{min-width:160px}

/* ---------- "Ətraflı məlumat": açılıb bağlanan izahlar ---------- */
.more-t{display:none}
.more-b{overflow:hidden;transition:max-height .28s var(--ease,ease),opacity .2s ease}
@media (max-width:760px){
  .more-t{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:4px 0;margin:2px 0 0;color:var(--primary);font:600 12.5px/1.2 inherit;cursor:pointer}
  .more-t svg{width:14px;height:14px;transition:transform .2s ease}
  .more-t[aria-expanded="true"] svg{transform:rotate(180deg)}
  .more-w.shut .more-b{max-height:0!important;opacity:0}
}

/* ---------- Mobil: jurnal ---------- */
@media (max-width:760px){
  .jx-tb{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .jx-tb .fld:first-child{grid-column:1/-1}
  .jx-tb .grow,.jx-tb .saved{display:none}
  .jx-tb .btn{justify-content:center}
  .cstrip{gap:4px 12px;padding:10px 12px;font-size:12.5px}
  .cs-staff{flex-basis:100%}
  .jx .card-h{flex-wrap:wrap}
  .jx .card-h .btn{margin-left:auto}
  .jtw4{max-height:none}
  .jt4 .stk{max-width:150px;min-width:130px}
  .jt4 .stk .av{display:none}
  .jt4 .stk .who b{max-width:130px;font-size:13px}
  .jt4 .stk .who small{font-size:11px}
  .jt4 th,.jt4 td{padding:7px 8px}
  .jt4 td.num input{width:52px;height:32px;font-size:14px}
  .jc input{height:32px;font-size:14px}
  .att{min-width:32px;height:30px}
  .modal.sheet{align-self:flex-end;width:100%;max-width:100%;border-radius:16px 16px 0 0;max-height:92dvh;animation:sheetUp .24s var(--ease,ease) both}
  .mroot:has(.modal.sheet){align-items:flex-end;padding:0}
  .modal.sheet .m-f{position:sticky;bottom:0;background:var(--surface);padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  .sw-t{grid-template-columns:1fr 70px auto}
}
@keyframes sheetUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- Mesajlar ---------- */
.msgs>.mi{display:flex;flex-direction:column}
.msgs>.mi>.bub.me{align-self:flex-end}
.msgs>.mi>.dsep{align-self:center}
.bub small{display:flex;align-items:center;justify-content:flex-end;gap:3px}
.bub .st{display:inline-flex;align-items:center}
.bub .tk{width:14px;height:12px;display:block}
.bub .tk.rd{width:18px;color:#7FD4FF}
.bub:not(.me) .tk.rd{color:var(--primary)}
.bub.img-only .tk.rd{color:var(--primary)}
.bub.tmp.sending{opacity:.92}
.bub.tmp.failed{box-shadow:inset 0 0 0 1.5px var(--danger,#B42318)}
.bub.me.tmp.failed{background:color-mix(in srgb,var(--primary) 78%,#000)}
.bub-fail{display:block;font-size:12px;margin-top:4px}
.bub-fail button{border:0;background:rgba(255,255,255,.22);color:inherit;font:600 12px/1 inherit;padding:5px 8px;border-radius:6px;cursor:pointer}
.bub:not(.me) .bub-fail button{background:var(--surface-2)}
/* Şəkil qutusu sabit ölçüdədir: şəkil yüklənəndə söhbət sıçramır */
.att-img{display:block;position:relative;width:240px;max-width:100%;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--surface-2)}
.att-img img{display:block;width:100%;height:100%;max-height:none;object-fit:cover}
.att-img.up img{filter:saturate(.85) brightness(.92)}
.att-img .upl,.att-file.up::after{position:absolute;right:8px;bottom:8px;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.55);border-top-color:#fff;animation:spin .8s linear infinite;content:''}
.att-file{position:relative}
.att-file.up::after{border-color:color-mix(in srgb,currentColor 30%,transparent);border-top-color:currentColor;right:10px;top:calc(50% - 9px);bottom:auto}
@keyframes spin{to{transform:rotate(360deg)}}
.att-pend img{width:40px;height:40px;border-radius:8px;object-fit:cover;flex:none}
.att-pend .fx{width:36px;height:36px;font-size:9.5px;flex:none}
#att-pend-w:empty{display:none}
#att-pend-w .att-pend{margin:8px 12px 0}
.composer textarea{overflow-y:auto}
.th-h .grow{min-width:0}
.th-h .grow b,.th-h .grow small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (max-width:640px){
  body.chat-full .chat.has-open{position:fixed;left:0;right:0;top:var(--vvt,0);height:var(--vvh,100dvh);z-index:60;border-radius:0;border:0;margin:0;box-shadow:none;display:flex;flex-direction:column}
  body.chat-full .chat.has-open .thread{flex:1;min-height:0}
  body.chat-full .top{visibility:hidden}
  body.chat-full .th-h{padding:6px 10px;gap:8px;padding-top:calc(6px + env(safe-area-inset-top))}
  body.chat-full .th-h .av{width:32px;height:32px;font-size:12px}
  body.chat-full .th-h b{font-size:14.5px}
  body.chat-full .th-h small{font-size:11.5px}
  body.chat-full .msgs{padding:10px 10px 6px;overscroll-behavior:contain}
  body.chat-full .composer{padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:6px}
  body.chat-full .composer textarea{font-size:16px;min-height:40px}
  .bub{max-width:84%}
  .att-img{width:210px}
}
.bub.img-only small{color:var(--ink-3)}

/* ---------- Mobil: əsas səhifə kompakt ---------- */
@media (max-width:640px){
  .hero{min-height:0;padding:14px 16px;border-radius:16px;margin-bottom:14px;align-items:flex-start}
  .hero::before{opacity:.1}
  .hero .av{width:40px;height:40px;font-size:14px;margin-right:12px;border-width:2px}
  .hero-t{min-width:0;flex:1}
  .hero h1{font-size:17.5px;line-height:1.25;margin:0 0 2px}
  .hero p{font-size:12.5px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .hero .chips{flex-wrap:nowrap;gap:5px;margin-top:8px;overflow-x:auto;scrollbar-width:none;margin-left:-52px}
  .hero .chips::-webkit-scrollbar{display:none}
  .hero .chip{padding:3px 9px;font-size:12px;white-space:nowrap;flex:none}
  .hero-a{margin-top:0;gap:8px}
  .hero-a .btn{padding:7px 12px;font-size:13px}
  .stats{gap:8px}
  .stat{padding:11px 13px}
  .stat .l{font-size:12px}
  .stat .v{font-size:21px;margin-top:2px}
  .stat .n{font-size:11.5px;margin-top:3px}
}

/* ---------- Rəsmi imtahan rejimi: menyu, başlıq və bildirişlər gizlənir ---------- */
body.exam-mode .side,body.exam-mode .top,body.exam-mode .scrim,body.exam-mode #toasts .pop{display:none!important}
body.exam-mode .shell{grid-template-columns:minmax(0,1fr)!important}
body.exam-mode .content{max-width:920px;padding-top:18px}
body.exam-mode .take{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.ex-bar{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:8px 12px;border-radius:10px;background:var(--surface);border:1px solid var(--line)}
.ex-l{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13px;color:var(--primary)}
.ex-l svg{width:14px;height:14px}
.ex-warn{position:fixed;left:50%;top:14px;transform:translateX(-50%);z-index:200;display:flex;align-items:center;gap:12px;max-width:min(640px,calc(100% - 24px));padding:12px 14px;border-radius:12px;background:#FFF1F0;color:#7A1212;border:1px solid #F3B7B2;box-shadow:0 12px 32px rgba(0,0,0,.18);font-size:14px;line-height:1.4;transition:opacity .25s,transform .25s}
.ex-warn b svg{width:18px;height:18px;color:#B42318;display:block}
.ex-warn .btn{flex:none}
.ex-warn.hide{opacity:0;pointer-events:none;transform:translate(-50%,-12px)}
.ex-warn.shake{animation:exShake .4s}
@keyframes exShake{0%,100%{margin-left:0}25%{margin-left:-6px}75%{margin-left:6px}}
@media (max-width:640px){.ex-warn{top:auto;bottom:calc(14px + env(safe-area-inset-bottom));left:12px;right:12px;max-width:none;transform:none;font-size:13px}.ex-warn.hide{transform:translateY(12px)}}
@media (max-width:760px){.top-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
.shell:not(.mini) .side .nav button[data-view="journal"]{white-space:normal}
.shell:not(.mini) .side .nav button[data-view="journal"] span{white-space:normal;line-height:1.25}
[hidden]{display:none!important}