/* Catalog. Doar tokeni din tokens.css; componentele comune (.button, .text-link, .modal, .notice, .empty) vin din components.css.
   Breakpoint-uri: 1100 / 900 / 580 / 380. Nimic sub var(--type-label); nicio tinta sub var(--control-size). */
.grades-shell{--student-col:220px;--week-col:44px;--mark-col:136px;--final-col:116px;padding-top:var(--space-4);padding-bottom:var(--section-y);min-width:0}
.grades-shell .button{min-height:var(--control-size)}

/* Antet */
.grades-heading{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:var(--space-4) var(--space-8);padding-bottom:var(--space-6);border-bottom:1px solid var(--line);margin-bottom:var(--space-6)}
.grades-heading>div:first-child{flex:1 1 330px;min-width:0}
.grades-heading .text-link{display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--control-size)}
.grades-heading>div:first-child>.text-link{margin-bottom:var(--space-2)}
.grades-heading .eyebrow{margin-bottom:var(--space-3)}
.grades-heading h1{font-size:var(--display-2);line-height:var(--leading-tight);margin:0 0 var(--space-3)}
.grades-heading>div>p:last-child{font-size:var(--type-copy);line-height:var(--leading-copy);margin:0;max-width:var(--measure)}
.grades-course-field{flex:1 1 280px;max-width:360px;min-width:0;display:grid;gap:var(--space-2)}
.grades-course-field label,.grades-field label{font:700 var(--type-small)/1.5 var(--sans);color:var(--ink)}
.grades-course-field select,.grades-field input,.grades-field select,.grades-field textarea,.grades-search input{border:1px solid var(--control-border);background:var(--surface);color:var(--ink);border-radius:var(--radius-sm);padding:var(--space-3);min-height:var(--control-size);font-size:var(--type-ui);width:100%;max-width:100%}
.grades-course-field>.text-link{justify-self:start}
[data-grades-notice]:not(:empty){margin-bottom:var(--space-6)}
[data-grades-notice] .text-link{display:inline-flex;align-items:center;min-height:var(--control-size)}

/* Blocuri */
.grades-block-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4) var(--space-5);margin-bottom:var(--space-4)}
.grades-block-heading h2{font-size:var(--display-3);line-height:1.2;margin:0}
.grades-block-heading h3{font:700 var(--type-reading)/1.3 var(--sans);letter-spacing:-.02em;margin:0}
.grades-block-heading p{font-size:var(--type-small);line-height:var(--leading-copy);margin:var(--space-1) 0 0}
.grades-block-heading .button{white-space:nowrap}
.grades-formula{margin-bottom:var(--space-5);padding-bottom:var(--space-5);border-bottom:1px solid var(--line)}
.grades-formula .grades-block-heading{margin-bottom:var(--space-3)}
.grades-formula-expression{font-size:var(--type-ui);line-height:var(--leading-copy);overflow-wrap:anywhere;margin:var(--space-2) 0;font-variant-numeric:tabular-nums}
.grades-table-help{font-size:var(--type-small);max-width:var(--measure);line-height:var(--leading-copy);margin:0}
.grades-empty-columns{list-style:none;padding:0;margin:var(--space-4) 0}
.grades-empty-columns li{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;padding:var(--space-3) 0;border-bottom:1px solid var(--line)}
.grades-empty-columns li>span{flex:1 1 180px;font-size:var(--type-ui);overflow-wrap:anywhere}

/* Stat strip (Quillspace, remapat pe albastru-soft): 3 cifre, fara umbre, fara pictograme */
.grades-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 var(--space-5);padding:var(--space-4) var(--space-6);background:var(--blue-soft);border:1px solid var(--line);border-radius:var(--radius-lg)}
.grades-stat{margin:0;padding:0 var(--space-6);min-width:0}
.grades-stat:first-child{padding-left:0}
.grades-stat+.grades-stat{border-left:1px solid var(--line)}
.grades-stat dt{font:700 var(--type-label)/1.4 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.grades-stat dd{margin:var(--space-2) 0 0;font:400 var(--display-3)/1.1 var(--serif);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.grades-stat dd small{display:block;margin-top:var(--space-1);font:400 var(--type-small)/1.5 var(--sans);letter-spacing:0;color:var(--muted)}

/* Unelte */
.grades-catalog-tools{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);margin-bottom:var(--space-3)}
.grades-catalog-tools .grades-section-picker{margin:0}
.grades-catalog-help{margin-bottom:var(--space-4)}
.grades-section-picker{display:flex;gap:var(--space-2);flex-wrap:wrap}
.grades-section-picker button{min-height:var(--control-size);padding:var(--space-2) var(--space-4);border:1px solid var(--control-border);border-radius:var(--radius-sm);background:transparent;color:var(--muted);font-size:var(--type-ui);line-height:1.4;display:flex;align-items:center;gap:var(--space-2);transition:border-color var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.grades-section-picker button[aria-pressed=true]{background:var(--blue-soft);border-color:var(--blue);color:var(--blue);font-weight:700}
.grades-section-picker button:hover{border-color:var(--blue);color:var(--blue)}
.grades-search{width:min(100%,290px)}
.grades-search input::placeholder{color:var(--muted)}

/* Grupe: panel alb cu hairline si umbre de derulare (background-attachment local/scroll, fara JS) */
.grades-group{margin:0 0 var(--space-5);min-width:0}
.grades-group-heading{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-3)}
.grades-group-heading h3{font:400 var(--type-reading-large)/1.3 var(--serif);letter-spacing:-.02em;margin:0;overflow-wrap:anywhere}
.grades-group-heading span,.grades-group-heading small{font-size:var(--type-small);color:var(--muted)}
.grades-group-heading small{margin-left:auto}
.grades-table-wrapper{--grades-scroll-shadow:rgb(var(--shadow-color)/.18);max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-1);scroll-padding-inline:var(--student-col) var(--final-col);background-image:linear-gradient(90deg,var(--surface) 40%,transparent),linear-gradient(270deg,var(--surface) 40%,transparent),linear-gradient(90deg,var(--grades-scroll-shadow),transparent),linear-gradient(270deg,var(--grades-scroll-shadow),transparent);background-position:left,right,left,right;background-size:48px 100%,48px 100%,18px 100%,18px 100%;background-repeat:no-repeat;background-attachment:local,local,scroll,scroll;background-color:var(--surface)}
:root[data-theme="dark"] .grades-table-wrapper{--grades-scroll-shadow:rgb(var(--shadow-color)/.5)}
.grades-table{width:100%;min-width:calc(var(--student-col) + var(--grades-weeks,0)*var(--week-col) + var(--grades-marks,0)*var(--mark-col) + var(--final-col));border-collapse:separate;border-spacing:0;font-size:var(--type-small);table-layout:fixed;font-variant-numeric:tabular-nums}
.grades-table th,.grades-table td{padding:0;text-align:center;border-bottom:1px solid var(--line)}
.grades-table thead th{height:48px;font:400 var(--type-label)/1.4 var(--sans);color:var(--muted);background:var(--panel)}
.grades-table thead abbr{text-decoration:none}
.grades-table tbody tr:last-child>*{border-bottom:0}
.grades-unified-table .grades-student-col{width:var(--student-col)}
.grades-unified-table .grades-week-col{width:var(--week-col)}
.grades-unified-table .grades-mark-col{width:var(--mark-col)}
.grades-unified-table .grades-final-col{width:var(--final-col)}
.grades-unified-table .grades-table-band th{height:36px;font-weight:700}
/* Eticheta de banda la stanga, lipita langa coloana studentului: vizibila fara derulare si in timpul derularii */
.grades-unified-table .grades-band-label{text-align:left;padding-inline:var(--space-3)}
.grades-band-label>span{display:inline-block;position:sticky;left:calc(var(--student-col) + var(--space-3))}
.grades-unified-table .grades-column-heading{padding:var(--space-2);border-left:1px solid var(--line);overflow-wrap:anywhere}
.grades-column-heading>span{display:block;line-height:1.45;color:var(--ink)}
.grades-column-heading>strong{display:block;color:var(--blue);margin:var(--space-1) 0;font-weight:700}
.grades-column-heading>div{display:flex;justify-content:center;align-items:center;gap:var(--space-1)}
.grades-column-heading button{border:0;background:transparent;color:var(--muted);font-size:var(--type-label);padding:0 var(--space-2);min-height:var(--control-size);min-width:var(--control-size);border-radius:var(--radius-sm)}
.grades-column-heading button:hover{color:var(--blue);background:var(--blue-soft)}
.grades-column-heading button:last-child{font-size:var(--type-reading)}

/* Coloana studentului (sticky) si selectia non-cromatica */
.grades-table .grades-student-column{width:var(--student-col);text-align:left;position:sticky;left:0;z-index:2;background:var(--surface);border-right:1px solid var(--line)}
.grades-table thead .grades-student-column{padding-left:var(--space-4);background:var(--panel);z-index:3}
.grades-student-column button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;min-height:56px;border:0;background:transparent;padding:var(--space-2) var(--space-4);text-align:left;gap:2px;color:var(--ink)}
.grades-student-column button span{font-size:var(--type-ui);line-height:1.4;overflow-wrap:anywhere}
.grades-student-column button small{font-size:var(--type-label);line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.grades-student-column button:hover span{color:var(--blue)}
.grades-student-column button:focus-visible{outline-offset:-3px}
.grades-table tr.is-selected .grades-student-column{background:var(--blue-soft)}
.grades-student-column button[aria-current="true"]{box-shadow:inset 3px 0 0 var(--blue)}
.grades-student-column button[aria-current="true"] span{font-weight:700;color:var(--blue)}

/* Prezenta */
.grades-attendance{width:100%;min-height:56px;display:grid;place-content:center;border:0;background:transparent;font:400 var(--type-ui)/1 var(--sans);position:relative;color:var(--muted);font-variant-numeric:tabular-nums}
button.grades-attendance:hover{background:var(--blue-soft)}
.grades-attendance:focus-visible{outline-offset:-3px}
.grades-status-present{color:var(--success);font-weight:700}
.grades-status-absent{color:var(--ink);font-weight:700}
.grades-status-excused{color:var(--blue);font-weight:700}
.grades-status-unset{color:var(--muted);font-size:var(--type-reading)}

/* Note si nota finala */
.grades-unified-table .grades-mark-cell{border-left:1px solid var(--line)}
.grades-inline-mark{display:block;width:100%;min-height:56px;border:0;border-radius:0;padding:var(--space-2);text-align:center;font:700 var(--type-ui)/1.4 var(--sans);background:transparent;color:var(--ink);font-variant-numeric:tabular-nums}
.grades-inline-mark:hover,.grades-inline-mark:focus-visible{background:var(--blue-soft)}
.grades-inline-mark:focus-visible{outline:var(--focus-ring);outline-offset:-3px}
.grades-inline-mark::placeholder{color:var(--muted)}
.grades-inline-mark[aria-invalid="true"]{outline:2px solid var(--danger);outline-offset:-2px;background:var(--danger-soft);color:var(--danger)}
/* Nota finala lipita la dreapta (peste 580 px): ramane vizibila oricate coloane de note ar fi */
.grades-table .grades-final-cell,.grades-table .grades-final-heading{background:var(--blue-soft);border-left:1px solid var(--line);position:sticky;right:0;z-index:1}
.grades-final-cell>strong{font:700 var(--type-copy)/1.4 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
.grades-final-cell>small{display:block;font-size:var(--type-label);line-height:1.4;color:var(--muted);padding:var(--space-1) var(--space-2)}

/* Celula in curs de salvare: punct pulsant, restul tabelului ramane activ */
.grades-table td.is-saving{position:relative;cursor:progress}
.grades-table td.is-saving>*{opacity:.7}
.grades-table td.is-saving::after{content:'';position:absolute;right:6px;bottom:6px;width:6px;height:6px;border-radius:50%;background:var(--blue);animation:grades-pulse 1s var(--ease) infinite}
@keyframes grades-pulse{50%{opacity:.25}}
.grades-empty-inline{padding:var(--space-6) 0;font-size:var(--type-ui);line-height:var(--leading-copy)}

/* Umbrele coloanelor lipite: fundalurile opace acopera umbrele wrapper-ului, deci fiecare coloana lipita isi poarta umbra pe marginea dinspre continut,
   vizibila doar cand exista continut derulat dedesubt (timeline de derulare; tabel fara derulare = timeline inactiv = fara umbra). Fara suport: coloanele raman lipite, fara umbra. */
@supports (animation-timeline:scroll()){
.grades-table-wrapper{scroll-timeline:--grades-x x}
.grades-table .grades-student-column::after,.grades-table .grades-final-cell::before,.grades-table .grades-final-heading::before{content:'';position:absolute;top:0;bottom:-1px;width:14px;pointer-events:none;opacity:0;animation-duration:1ms;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--grades-x}
.grades-table .grades-student-column::after{left:100%;background:linear-gradient(90deg,var(--grades-scroll-shadow),transparent);animation-name:grades-edge-start}
.grades-table .grades-final-cell::before,.grades-table .grades-final-heading::before{right:100%;background:linear-gradient(270deg,var(--grades-scroll-shadow),transparent);animation-name:grades-edge-end}
}
@keyframes grades-edge-start{from{opacity:0}4%,to{opacity:1}}
@keyframes grades-edge-end{from,96%{opacity:1}to{opacity:0}}

/* Stare */
.grades-inline-status{font-size:var(--type-small);min-height:20px;margin:var(--space-4) 0 0;color:var(--muted)}
.grades-inline-status.is-error{color:var(--danger)}

/* Fisa studentului (h2-ul cu tabindex=-1 pastreaza inelul global :focus-visible; :focus cu mouse-ul e acoperit de regula globala) */
.grades-student-detail{margin-top:var(--stack-lg);padding-top:var(--space-6);border-top:1px solid var(--line)}
.grades-student-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:var(--space-5)}
.grades-student-heading .eyebrow{margin-bottom:var(--space-2)}
.grades-student-heading h2{font-size:var(--display-3);margin:0 0 var(--space-2);overflow-wrap:anywhere}
.grades-student-heading>div>p:last-child{font-size:var(--type-small);margin:0}
.grades-student-group{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-4);font-size:var(--type-ui)}
.grades-project{min-width:0}
.grades-student-detail>.grades-project{margin-top:var(--space-5);max-width:680px}
.grades-project-status{font-size:var(--type-small);font-weight:700;color:var(--blue);margin:var(--space-5) 0 var(--space-2)}
.grades-project h4{font-size:var(--type-reading);font-weight:700;line-height:1.5;margin:var(--space-2) 0 0;overflow-wrap:anywhere}
.grades-project-facts{margin:var(--space-4) 0 0;display:grid;gap:var(--space-3)}
.grades-project-facts>div{display:flex;gap:var(--space-5);justify-content:space-between;padding-bottom:var(--space-3);border-bottom:1px solid var(--line)}
.grades-project-facts dt{font-size:var(--type-small);color:var(--muted)}
.grades-project-facts dd{font-size:var(--type-ui);margin:0;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.grades-record-note{font-size:var(--type-ui);line-height:var(--leading-copy);white-space:pre-wrap;overflow-wrap:anywhere;margin:var(--space-3) 0 0;max-width:var(--measure)}

/* Eroare de incarcare */
.grades-error{padding:var(--space-6) 0}
.grades-error h2{font-size:var(--display-3);margin:0 0 var(--space-4)}
.grades-error p{font-size:var(--type-copy);line-height:var(--leading-copy);max-width:var(--measure);margin:0 0 var(--space-6)}
.grades-error .button{margin-right:var(--space-3)}

/* Dialog: doar ce nu acopera componenta .modal comuna */
.grades-dialog{width:min(520px,calc(100% - 28px))}
.grades-dialog>.eyebrow{padding-right:var(--control-size);margin-bottom:var(--space-3);overflow-wrap:anywhere}
.grades-dialog fieldset{min-width:0;border:0;padding:0;margin:0}
.grades-dialog fieldset>p{font-size:var(--type-ui);line-height:var(--leading-copy)}
.grades-dialog .grades-field-help{font-size:var(--type-small);margin:calc(-1*var(--space-1)) 0 var(--space-4);line-height:var(--leading-copy)}
.grades-field{display:grid;gap:var(--space-2);margin-bottom:var(--space-4);min-width:0}
.grades-field textarea{resize:vertical;line-height:var(--leading-copy);min-height:90px}
.grades-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.grades-dialog-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-2);flex-wrap:wrap}
.grades-form-error{border:1px solid var(--danger);background:var(--danger-soft);color:var(--ink);font-size:var(--type-ui);line-height:var(--leading-copy);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);margin:0 0 var(--space-4);overflow-wrap:anywhere}
.grades-dialog fieldset:disabled{opacity:.7;cursor:progress}

@media(max-width:1100px){.grades-heading{gap:var(--space-6)}}
@media(max-width:900px){.grades-shell{--student-col:180px}.grades-catalog-tools{align-items:stretch;flex-direction:column;gap:var(--space-4)}.grades-search{width:100%}.grades-block-heading{align-items:flex-start;flex-direction:column;gap:var(--space-4)}.grades-course-field{max-width:none}}
@media(max-width:580px){.grades-shell{--student-col:156px}.grades-table-wrapper{scroll-padding-inline:var(--student-col) var(--space-3)}.grades-table .grades-final-cell,.grades-table .grades-final-heading{position:static}.grades-table .grades-final-cell::before,.grades-table .grades-final-heading::before{content:none}.grades-heading{display:block;padding-bottom:var(--space-5);margin-bottom:var(--space-5)}.grades-course-field{margin-top:var(--space-4)}.grades-stats{grid-template-columns:1fr;gap:var(--space-4);padding:var(--space-4) var(--space-5)}.grades-stat{padding:0}.grades-stat+.grades-stat{border-left:0;border-top:1px solid var(--line);padding-top:var(--space-4)}.grades-student-column button{padding:var(--space-2) var(--space-3)}.grades-table thead .grades-student-column{padding-left:var(--space-3)}.grades-group-heading small{margin-left:0}.grades-student-detail{padding-top:var(--space-5)}}
@media(max-width:380px){.grades-form-row{grid-template-columns:1fr;gap:0}.grades-student-heading{display:block}}
@media(prefers-reduced-motion:reduce){.grades-table td.is-saving::after{animation:none}.grades-section-picker button{transition:none}}
@media print{.grades-shell{padding:0}.grades-heading .text-link,.grades-course-field,.grades-search,.grades-section-picker,.grades-block-heading .button,.grades-dialog,.grades-table-help,.grades-inline-status,.grades-column-heading>div{display:none}.grades-table-wrapper{overflow:visible;border-radius:0;box-shadow:none;background-image:none}.grades-table{min-width:0;font-size:var(--type-label)}.grades-table .grades-student-column{position:static;width:140px}.grades-table .grades-final-cell,.grades-table .grades-final-heading{position:static}.grades-table .grades-student-column::after,.grades-table .grades-final-cell::before,.grades-table .grades-final-heading::before{content:none}.grades-stats,.grades-student-detail{break-inside:avoid}}
