/* Period based planning, using TeachTally's existing visual identity. */
.calendar-scroll{height:auto;max-height:calc(100dvh - 310px);min-height:300px;background:#fff}
.calendar-scroll.empty-timetable{min-height:400px;display:grid;align-items:center}
.calendar-header{flex-wrap:wrap}.calendar-header>#edit-timetable{font-size:11px;min-height:40px;border:1px solid #dce5df}
.calendar-views{margin-left:0}.calendar-legend{display:none}.calendar-timezone{font-size:10px}
.timetable-content{width:100%}.timetable-empty{text-align:center;padding:60px 24px;max-width:520px;margin:auto}.timetable-empty h2{font-size:25px;letter-spacing:-.035em;margin:14px 0}.timetable-empty p{font-size:13px;line-height:1.7;color:var(--muted);margin-bottom:24px}.timetable-empty .empty-icon{font-size:38px;color:var(--deep)}
.teaching-grid{display:grid;grid-template-columns:110px repeat(var(--tt-days,5),minmax(0,1fr));min-width:780px}
.teaching-grid[data-columns="1"]{min-width:0;grid-template-columns:100px minmax(0,1fr)}
.tt-corner,.tt-day{position:sticky;top:0;z-index:4;background:#fafcfb;border:0;border-right:1px solid #e3ebe6;border-bottom:1px solid #d7e3dc;height:74px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;font-size:10px;color:var(--muted)}
.tt-day span{font-size:11px;font-weight:700}.tt-day b{font-size:17px;font-weight:400;color:var(--deep)}.tt-day.is-today{background:#e9f5ee}.tt-day.is-today b{font-weight:800}.tt-day:hover{background:#e3f0e8}
.tt-period{display:flex;align-items:center;justify-content:center;padding:13px;font-size:11px;font-weight:700;color:var(--deep);background:#f8fbf9;border-right:1px solid #e3ebe6;border-bottom:1px solid #e3ebe6;min-height:110px;overflow-wrap:anywhere}
.tt-cell{padding:8px;border-right:1px solid #e3ebe6;border-bottom:1px solid #e3ebe6;min-width:0;min-height:110px;display:flex;align-items:stretch}
.tt-lesson{display:flex;flex-direction:column;justify-content:center;text-align:left;gap:8px;border:1px solid color-mix(in srgb,var(--class-colour) 40%,white);border-left:4px solid var(--class-colour);border-radius:11px;width:100%;min-height:94px;padding:13px 11px;background:color-mix(in srgb,var(--class-colour) 13%,white);color:#213d32;overflow-wrap:anywhere}
.tt-lesson strong{font-size:12px;line-height:1.45}.tt-lesson>span{font-size:11px;line-height:1.5;color:#536b60}.tt-lesson small{font-size:9px;color:#5f7669}.tt-lesson.has-plan>span{color:#243e33;font-weight:700}.tt-lesson:hover{background:color-mix(in srgb,var(--class-colour) 22%,white);box-shadow:0 2px 7px #193f3012}
.tt-free,.outside{align-items:center;justify-content:center;font-size:10px;color:#85978b;background:#fdfefd}.outside{background:#f5f8f6}.tt-period.break,.tt-break{min-height:50px;background:#f4f7f5}.tt-break{display:grid;place-items:center;font-size:10px;color:#7c9082;padding:10px}
.timetable-outside{padding:15px 22px;background:#fbf6e8;font-size:12px;color:#716039}.timetable-outside .text-button{font-size:12px}
#unplaced-section{margin-top:24px;padding:22px}#unplaced-section h2{font-size:18px}#unplaced-section .small{font-size:11px}
.lesson-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
input[type=color]{appearance:none;-webkit-appearance:none;min-height:42px;width:58px;padding:4px;border:1px solid #cbdcd3;border-radius:9px;background:#fff;cursor:pointer}
.timetable-dialog{width:min(1250px,calc(100vw - 40px));max-width:1250px;max-height:calc(100dvh - 40px);padding:26px 28px;border-radius:20px;overflow:auto}
.timetable-dialog .modal-header{margin-bottom:20px}.timetable-dialog h2{font-size:27px;letter-spacing:-.035em}.timetable-dialog .eyebrow{font-size:9px}
.timetable-settings{display:grid;grid-template-columns:1fr 1fr 1fr;gap:18px;border-bottom:1px solid #e0e9e3;padding-bottom:20px}.timetable-settings>div{min-width:0}.timetable-settings label,.builder-class-tools label{font-size:11px;margin-bottom:8px}.timetable-settings input,.timetable-settings select{width:100%;min-width:0;max-width:100%;font-size:13px;min-height:44px;padding:10px;border:1px solid #cbdcd3;border-radius:8px;background:#fff}
.builder-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:18px 0}.builder-toolbar .button{min-height:40px;font-size:11px;padding:9px 12px;border:1px solid #d5e2d9}.builder-toolbar>div:last-child{display:flex;gap:8px}
.builder-tabs{display:flex;border-radius:9px;background:#edf4ef;padding:3px}.builder-tabs button{border:0;border-radius:6px;background:transparent;font-size:11px;padding:9px 13px;min-height:36px;color:#5e7669;font-weight:700}.builder-tabs button[aria-pressed=true]{background:white;color:var(--deep);box-shadow:0 1px 5px #183e3010}
.builder-class-tools{display:flex;align-items:end;gap:14px;background:#f1f7f3;border:1px solid #d7e5dc;border-radius:12px;padding:14px 16px}.builder-class-tools>div:first-child{min-width:160px;flex:1;max-width:240px}.builder-class-tools select{font-size:12px;min-height:42px;width:100%;padding:9px;border:1px solid #cbdcd3;border-radius:8px}.builder-class-tools .button{min-height:42px;font-size:11px;padding:10px 12px}.builder-class-tools p{flex:1;color:#5f7769;font-size:11px;margin:0;line-height:1.6;max-width:300px}.builder-instruction{font-size:10px;color:var(--muted);margin:16px 0 12px}
.builder-grid{overflow:auto;max-height:48dvh;border:1px solid #d9e5dc;border-radius:12px;scrollbar-width:thin;overscroll-behavior:contain}.builder-head,.builder-row{display:grid;grid-template-columns:215px repeat(5,minmax(110px,1fr));min-width:820px;gap:10px;padding:10px 12px}.builder-head{position:sticky;top:0;z-index:5;background:#fbfdfb;border-bottom:1px solid #d9e5dc;padding-top:15px;padding-bottom:15px;align-items:center}.builder-head b{font-size:11px;text-align:center;color:var(--deep)}.builder-head>span{font-size:10px;color:var(--muted);padding-left:8px}.builder-row{border-bottom:1px solid #e7eee9;min-height:90px;background:white}.builder-row:last-child{border-bottom:0}.builder-row.break{min-height:52px;background:#f7faf8}.builder-row.break .builder-period input{font-weight:400;background:#f7faf8}
.builder-period{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px;align-items:center;align-content:center;padding-right:8px}.builder-period input{font-size:12px;min-height:32px;border:1px solid transparent;background:white;padding:4px;min-width:0;max-width:100%;width:100%;font-weight:700;color:var(--deep)}.builder-period input:hover,.builder-period input:focus{border-color:#cadbd0;border-radius:5px}.drag-grip{touch-action:none;user-select:none;cursor:grab;border:0;background:transparent;color:#7a9181;font-size:23px;line-height:1;padding:2px;min-height:36px}.drag-grip:active{cursor:grabbing}.period-actions{grid-column:2;display:flex;gap:4px}.period-actions button{border:1px solid #dce6df;border-radius:5px;background:white;color:#65806f;min-width:29px;min-height:27px;font-size:14px;padding:2px}.period-actions button:disabled{opacity:.3}.builder-row.dragging{opacity:.6}.builder-row.drop-target{outline:2px solid var(--teal);outline-offset:-2px;background:#edf7f1}
.builder-slot{min-width:0;overflow-wrap:anywhere;min-height:64px;text-align:center;border:1px solid #e1e9e3;border-radius:10px;background:#f4f7f5;color:#7d9183;padding:12px 8px;font-size:11px;line-height:1.5}.builder-slot.assigned{color:#264b3b;background:color-mix(in srgb,var(--class-colour) 15%,white);border:1px solid color-mix(in srgb,var(--class-colour) 50%,white);border-top:3px solid var(--class-colour);font-weight:700}.builder-slot:hover{box-shadow:inset 0 0 0 1px var(--deep)}.builder-break{display:grid;place-items:center;font-size:10px;line-height:1.5;color:#7c9081}
.builder-footer{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:20px;background:#fff;position:sticky;bottom:-26px;padding:14px 0 5px;border-top:1px solid #dce6df;z-index:10}.builder-footer p{font-size:10px;line-height:1.6;margin:0;max-width:700px}.builder-footer .button{min-width:130px;min-height:44px;font-size:13px}
@media(max-width:1000px){.calendar-header{gap:10px}.calendar-scroll{max-height:calc(100dvh - 340px)}.timetable-dialog{padding:22px 20px}.builder-class-tools{flex-wrap:wrap}.builder-class-tools p{max-width:none;flex-basis:100%}.builder-footer{bottom:-22px}.lesson-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.timetable-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:20px 14px;border-radius:15px}.timetable-settings{grid-template-columns:1fr 1fr;gap:14px}.timetable-settings>div:last-child{grid-column:1/-1}.timetable-settings input,.timetable-settings select{font-size:16px}.builder-toolbar{flex-wrap:wrap;gap:12px}.builder-toolbar .button{font-size:10px;padding:8px 10px}.builder-class-tools{gap:10px;padding:12px}.builder-class-tools>div:first-child{min-width:130px}.builder-class-tools .button{font-size:10px}.builder-class-tools select{font-size:16px}.builder-class-tools p{font-size:10px}.builder-footer{gap:10px;bottom:-20px;padding-top:12px;align-items:flex-end}.builder-footer p{font-size:9px}.builder-footer .button{min-width:100px;padding:12px;font-size:12px}.builder-grid{max-height:38dvh}.builder-head,.builder-row{grid-template-columns:180px repeat(5,minmax(110px,1fr))}.timetable-empty{padding:45px 18px}.timetable-empty h2{font-size:22px}.calendar-header{grid-template-columns:1fr auto}.calendar-header .calendar-period{grid-column:1/-1}.calendar-header>#edit-timetable{grid-column:1/-1;justify-self:start}.calendar-scroll{max-height:calc(100dvh - 350px);min-height:260px}.calendar-scroll.empty-timetable{min-height:340px}.calendar-timezone{font-size:9px}.teaching-grid[data-columns="1"]{grid-template-columns:80px minmax(0,1fr)}.tt-period{font-size:10px;padding:8px}.tt-day span{font-size:10px}.tt-lesson strong{font-size:13px}.tt-lesson>span{font-size:12px}.lesson-fields{grid-template-columns:minmax(0,1fr)}}

.tt-week-label{padding:16px 22px;margin:0;background:#f1f7f3;border-top:1px solid #d7e3dc;border-bottom:1px solid #d7e3dc;font-size:13px;font-weight:700;color:var(--deep)}

.timetable-dialog>.modal-header{position:sticky;top:-26px;background:white;z-index:20;padding:12px 0}.builder-grid{max-height:40dvh}@media(max-width:600px){.timetable-dialog>.modal-header{top:-20px}.builder-grid{max-height:32dvh}}

.class-card[data-colour]{border-top:3px solid var(--event-accent)}

.builder-period{position:sticky;left:0;z-index:2;background:#fff}.builder-row.break .builder-period{background:#f7faf8}.builder-head>span{position:sticky;left:0;background:#fbfdfb;z-index:6}

/* Each week uses the available viewport; vertical scrolling is between weeks only. */
.calendar-scroll{height:auto;max-height:none;min-height:0;overflow-x:auto;overflow-y:clip}
.calendar-scroll.empty-timetable{min-height:300px}
.teaching-grid{grid-auto-rows:0;align-items:stretch;overflow:hidden}
.tt-corner,.tt-day{position:static;height:auto;min-height:0;gap:3px;padding:5px}
.tt-day span{font-size:10px}.tt-day b{font-size:14px}
.tt-period,.tt-cell,.tt-period.break,.tt-break{min-height:0;height:auto;overflow:hidden}
.tt-period{padding:7px}.tt-cell{padding:5px}
.tt-lesson{min-height:0;height:100%;padding:8px;gap:5px;overflow:hidden}
.tt-lesson strong,.tt-lesson>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex-shrink:0}
.tt-lesson strong{font-size:11px}.tt-lesson>span{font-size:10px}.tt-lesson small{font-size:9px}
.tt-week-label{height:42px;padding:10px 18px;display:flex;align-items:center}
.tt-compact .tt-lesson{padding:6px 8px;gap:3px}.tt-compact .tt-lesson small{display:none}
.tt-dense .tt-cell{padding:2px 4px}.tt-dense .tt-lesson{padding:3px 6px;gap:1px;border-radius:6px}
.tt-dense .tt-lesson strong,.tt-dense .tt-lesson>span{font-size:9px;line-height:1.2;white-space:nowrap;display:block;text-overflow:ellipsis}
.tt-dense .tt-period{font-size:9px;padding:4px}.tt-dense .tt-break{font-size:9px;padding:2px}
@media(max-width:600px){.tt-period{font-size:10px}.tt-lesson strong{font-size:11px}.tt-lesson>span{font-size:10px}}
