.schedule-shell{
--schedule-time-column:40px;
--schedule-day-min:0px;
width:100% !important;
max-width:none !important;
box-sizing:border-box !important;
}#schedule .schedule-shell{
margin-left:5px;
margin-right:5px;
width:calc(100% - 10px) !important;
max-width:none !important;
box-sizing:border-box !important;
display:flex;
flex-direction:column;
height:calc(108.69565vh - 140px);
min-height:0;
overflow:hidden;
}#schedule .schedule-table-body{
overflow:auto;
flex:1 1 auto;
min-height:0;
max-height:none;
box-sizing:border-box;
padding:2.5vh 1.2vh;
}.schedule-table-header{
flex:0 0 auto;
width:100%;
box-sizing:border-box;
padding:0 1.2vh;
overflow:hidden;
}.schedule-table-header-grid{
display:grid;
grid-template-columns:var(--schedule-time-column) repeat(7, minmax(var(--schedule-day-min), 1fr));
gap:0;
margin:0;
width:100%;
max-width:none;
padding:0;
border-left:1px solid transparent;
border-right:1px solid transparent;
box-sizing:border-box;
}.schedule-table-header-grid .schedule-header-cell:first-child{
border-right:1px solid rgba(15, 23, 42, 0.06);
}.schedule-table-header-grid .schedule-header-cell:last-child{
border-right:1px solid rgba(15, 23, 42, 0.06);
}.schedule-table-body-inner{
width:100%;
min-width:100%;
box-sizing:border-box;
}.schedule-grid{
display:grid;
grid-template-columns:var(--schedule-time-column) repeat(7, minmax(var(--schedule-day-min), 1fr));
grid-auto-rows:1px;
gap:0;
position:relative;
background:#fff;
border-radius:16px;
padding:0;
border:1px solid rgba(0, 0, 0, 0.05);
margin:0;
width:100%;
max-width:none;
box-sizing:border-box;
}.schedule-lesson-card{
background:#e9f2ff !important;
border-left:3px solid #2563eb !important;
border-radius:4px;
padding:10px 6px;
margin:0;
width:100%;
box-sizing:border-box;
display:flex;
flex-direction:column;
justify-content:flex-start;
gap:10px;
font-size:12px !important;
overflow:hidden;
transition:background-color 0.2s ease, border-color 0.2s ease;
cursor:pointer;
z-index:10;
}.schedule-lesson-card *{
font-size:12px !important;
line-height:1.2 !important;
text-transform:none !important;
}.schedule-lesson-card div,
.schedule-lesson-card span{
font-weight:600 !important;
}.schedule-lesson-card i{
font-weight:900 !important;
color:#000 !important;
}.schedule-lesson-card::before{
display:none !important;
}.schedule-lesson-class{
color:#0f172a;
margin:0;
}.schedule-lesson-subject{
color:#0f172a;
margin:0;
}.schedule-lesson-teacher{
color:#0f172a;
display:flex;
align-items:center;
gap:8px;
margin-top:auto;
padding-top:0;
font-size:8px !important;
}.schedule-lesson-teacher i{
color:#0f172a;
font-size:10px !important;
}html[data-page=\"schedule\"] .main-content{
overflow:hidden !important;
}select.schedule-pill{
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba%28255, 255, 255, 0.8%29' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
background-repeat:no-repeat;
background-position:right 12px center;
background-size:12px;
padding-right:32px !important;
padding-left:16px !important;
height:34px;
line-height:32px;
border:1px solid rgba(255, 255, 255, 0.18);
border-radius:999px;
background-color:rgba(255, 255, 255, 0.1);
color:rgba(255, 255, 255, 0.95);
font-weight:700;
font-size:13px;
cursor:pointer;
outline:none;
box-sizing:border-box;
transition:background-color 0.15s ease, border-color 0.15s ease;
}select.schedule-pill:hover{
background-color:rgba(255, 255, 255, 0.15);
border-color:rgba(255, 255, 255, 0.28);
}select.schedule-pill option{
color:#0f172a;
background-color:#ffffff;
}.schedule-card-header{
flex:0 0 auto;
display:grid;
grid-template-columns:1fr auto 1fr;
align-items:center;
padding:8px 12px;
border-bottom:1px solid rgba(15, 23, 42, 0.08);
background:#ffffff;
}.schedule-period-wrapper{
display:flex;
justify-content:flex-end;
}.schedule-today-header-btn{
display:inline-flex;
align-items:center;
justify-content:center;
width:auto !important;
margin:0 !important;
justify-self:start !important;
height:28px;
padding:0 10px;
font-size:11px;
font-weight:700;
color:#1c77ff;
background:#ffffff;
border:1.2px solid #1c77ff;
border-radius:999px;
cursor:pointer;
box-sizing:border-box;
transition:background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
white-space:nowrap;
}.schedule-today-header-btn:hover{
background:rgba(28, 119, 255, 0.05);
}.schedule-today-header-btn.active{
border-width:2px;
font-weight:800;
background:#ffffff;
color:#1c77ff;
cursor:default;
}.schedule-date-display{
display:inline-flex;
align-items:center;
gap:8px;
cursor:pointer;
font-size:14px;
font-weight:800;
color:#0f172a;
user-select:none;
padding:6px 12px;
border-radius:999px;
transition:background 0.15s ease;
}.schedule-date-display:hover{
background:rgba(15, 23, 42, 0.05);
}.schedule-nav-arrow-btn{
background:none;
border:none;
cursor:pointer;
color:#1c77ff;
padding:6px 10px;
font-size:14px;
border-radius:999px;
display:inline-flex;
align-items:center;
justify-content:center;
transition:background 0.15s ease;
}.schedule-nav-arrow-btn:hover{
background:rgba(28, 119, 255, 0.08);
}.schedule-period-select{
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba%2815, 23, 42, 0.7%29' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
background-repeat:no-repeat;
background-position:right 12px center;
background-size:10px;
padding-right:28px !important;
padding-left:14px !important;
height:34px;
line-height:32px;
border:1px solid rgba(15, 23, 42, 0.12);
border-radius:999px;
font-weight:700;
font-size:13px;
color:#0f172a;
background-color:#ffffff;
cursor:pointer;
box-sizing:border-box;
outline:none;
transition:background-color 0.15s ease, border-color 0.15s ease;
}.schedule-period-select:hover{
background-color:rgba(15, 23, 42, 0.02);
border-color:rgba(15, 23, 42, 0.2);
}.schedule-header-cell{
padding:4px 8px !important;
min-height:44px !important;
}.schedule-day-title{
font-size:12px;
color:rgba(15, 23, 42, 0.55);
font-weight:800;
text-transform:none;
display:flex;
flex-direction:column !important;
align-items:center;
gap:2px !important;
}.schedule-day-title .dow-label{
font-size:12px;
font-weight:900;
color:rgba(15, 23, 42, 0.75);
transition:color 0.15s ease;
}.schedule-day-title.is-today .dow-label{
color:#1c77ff !important;
}.schedule-date-pill{
display:inline-flex;
align-items:center;
justify-content:center;
height:22px;
padding:0 10px;
border-radius:999px;
background:transparent !important;
color:#0f172a !important;
font-weight:600;
font-size:13px;
width:max-content;
transition:background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}.schedule-date-pill.is-today{
background:#1c77ff !important;
color:#ffffff !important;
}#schedule-view-mode.schedule-pill{
min-width:140px !important;
}#schedule-view-value.schedule-pill{
min-width:180px !important;
}

/* ── Lightweight grid overlay (replaces 48 individual .schedule-cell divs per day) ── */
.schedule-day-overlay {
  pointer-events: auto;
  cursor: cell;
  z-index: 2 !important;
  background: transparent;
}
/* Lesson card containers stay above overlay so they receive clicks first */
.schedule-lesson-card {
  position: relative;
  z-index: 10;
}
/* Hour-only time labels */
.schedule-time-label {
  font-size: 10px;
  color: rgba(15,23,42,0.35);
  font-weight: 500;
  display: flex;
  align-items: flex-start;
  padding-top: 2px;
  user-select: none;
}
/* Hour grid lines only */
.schedule-grid-line.hour {
  border-top: 1px solid rgba(15,23,42,0.07);
  grid-column: 2 / -1;
  pointer-events: none;
}

/* Weekly timetable layout: keep the working area close to the reference UI. */
#schedule {
  background: linear-gradient(180deg, #0f68f8 0%, #287df0 58%, #0f68f8 100%);
  min-height: 100%;
  padding-bottom: 24px;
}
#schedule .section-header {
  display: block;
  margin-top: -12px;
  padding: 0 8px 6px;
}
#schedule .section-title {
  display: none;
}
#schedule .schedule-tabs {
  display: flex;
  align-items: center;
  gap: 0;
  min-height: 38px;
  border: 0;
  margin-bottom: 16px;
}
#schedule .schedule-tab {
  position: relative;
  min-height: 34px;
  padding: 8px 12px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255,255,255,0.58);
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
}
#schedule .schedule-tab:hover,
#schedule .schedule-tab.active {
  color: #ffffff;
}
#schedule .schedule-tab.active::after {
  display: none;
}
#schedule .schedule-tab.active {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 8px;
}
#schedule .schedule-tab:first-child {
  padding-left: 0;
}
#schedule .schedule-frame {
  padding: 0 8px 12px;
}
#schedule .schedule-top-controls {
  margin-bottom: 14px !important;
}
#schedule .schedule-pill {
  min-width: 160px;
  height: 38px;
  border-radius: 8px;
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.26);
}
#schedule .schedule-zoom .scale-pill {
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  padding: 4px;
}
#schedule .schedule-zoom .scale-option {
  min-width: 54px;
  height: 30px;
  border-radius: 999px;
}
#schedule .schedule-zoom .scale-option.active {
  background: #ffffff;
  color: #1767d8;
}
#schedule .schedule-shell {
  margin: 0 !important;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(10, 57, 133, 0.18);
}
#schedule .schedule-card-header {
  min-height: 58px;
  padding: 8px 14px;
  border-radius: 14px 14px 0 0;
}
#schedule .schedule-table-body {
  padding: 0;
  display: flex;
  align-items: stretch;
}
#schedule .schedule-table-body-inner {
  display: flex;
  align-items: stretch;
  width: 100%;
  min-width: 100%;
  min-height: 100%;
}
#schedule .schedule-table-header {
  padding: 0 14px;
}
#schedule .schedule-grid {
  grid-template-rows: none !important;
  grid-auto-rows: 0.2px;
  flex: 1 0 auto;
  min-width: 100%;
  min-height: 100%;
  border-radius: 8px;
  border-color: rgba(15,23,42,0.08);
}
#schedule .schedule-grid-line {
  border-top: 1px dashed rgba(15,23,42,0.07);
  grid-column: 2 / -1;
  pointer-events: none;
}
#schedule .schedule-grid-line.hour {
  border-top-style: solid;
  border-top-color: rgba(15,23,42,0.14);
}
#schedule .schedule-time-label {
  color: rgba(15,23,42,0.5);
  font-size: 11px;
  font-weight: 600;
  justify-content: center;
}
#schedule .schedule-lesson-card {
  background: #f1f3f7 !important;
  border: 1px solid rgba(15,23,42,0.06) !important;
  border-left: 1px solid rgba(15,23,42,0.06) !important;
  border-radius: 12px;
  padding: 8px 10px;
  gap: 5px;
  justify-content: space-between;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
#schedule .schedule-lesson-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 20px;
}
#schedule .schedule-lesson-card.has-schedule-group .schedule-lesson-meta {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 4px;
}
#schedule .schedule-lesson-card.has-schedule-group {
  padding-left: 5px;
}
#schedule .schedule-lesson-card.has-schedule-group .schedule-lesson-bubbles {
  width: auto;
  max-width: 100%;
}
#schedule .schedule-lesson-card.has-schedule-group .schedule-lesson-class {
  width: auto;
  max-width: 100%;
  justify-content: center;
  font-size: 9px !important;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}
#schedule .schedule-lesson-card.has-schedule-group .schedule-lesson-number {
  padding-left: 2px;
}
#schedule .schedule-lesson-class {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 7px;
  border-radius: 999px;
  font-size: 11px !important;
  font-weight: 800 !important;
}
#schedule .schedule-lesson-bubbles {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
#schedule .schedule-lesson-group {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  max-width: 120px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(56, 189, 248, 0.18);
  color: #111111;
  margin-left: 5px;
  font-size: 9px !important;
  font-weight: 800 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#schedule .schedule-lesson-number {
  color: rgba(15,23,42,0.6);
  font-size: 9px;
  font-weight: 700;
  white-space: nowrap;
}
#schedule .schedule-lesson-subject {
  margin-top: auto;
  color: #111827;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#schedule .schedule-lesson-teacher {
  display: none;
}

/* ── Schedule lesson popover icons ── */
#modal-schedule-lesson .schedule-popover-chip {
  background: #edf5ff;
  border-color: #cfe3ff;
  color: #234d92;
  box-shadow: inset 0 0 0 1px rgba(35, 77, 146, 0.06);
}
#modal-schedule-lesson .schedule-popover-chip i,
#modal-schedule-lesson .schedule-popover-chip i.fa-solid.fa-user,
#modal-schedule-lesson .schedule-popover-chip i.fa-solid.fa-user svg,
#modal-schedule-lesson .schedule-popover-chip i.fa-solid.fa-user path,
#modal-schedule-lesson .schedule-popover-chip i.fa-solid.fa-user * {
  color: inherit !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}
#modal-schedule-lesson .schedule-popover-chip span {
  color: inherit;
}
#modal-schedule-lesson .schedule-popover-linkrow i {
  width: 26px;
  min-width: 26px;
  text-align: center;
  font-size: 19px;
  color: #1c77ff;
  transform: scaleX(1.25);
}

@media (max-width: 900px) {
  #schedule .schedule-shell {
    --schedule-day-min: 140px;
  }

  #schedule .schedule-table-header,
  #schedule .schedule-table-body-inner {
    min-width: calc(var(--schedule-time-column) + (var(--schedule-day-min) * 7));
  }

  #schedule .schedule-tabs {
    gap: 0;
    overflow-x: auto;
  }
  #schedule .schedule-top-controls {
    align-items: stretch !important;
    flex-direction: column;
  }
  #schedule .schedule-left-controls,
  #schedule .schedule-inline-menu {
    flex-wrap: wrap;
  }
  #schedule .schedule-zoom {
    justify-content: space-between;
  }
  #schedule .schedule-pill {
    flex: 1 1 140px;
  }
}

/* ── Journal Notebook Squared Grid Background (Імітація клітинок такого ж розміру як звичайні) ── */
#gradebook-view .gb-wrapper,
#gradebook-view .gb-zoom-surface,
#gradebook-view .gb-zoom-inner {
  background-color: #f8fbff !important;
  background-image:
    linear-gradient(to right, rgba(28, 119, 255, 0.12) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(28, 119, 255, 0.12) 1px, transparent 1px) !important;
  background-size: 62px 36px !important;
  background-position: 0 0 !important;
}

/* Планування — білий фон без клітинок */
#gradebook-view .planning-table-wrap,
#gradebook-view .planning-grid-scroll {
  background-color: #ffffff !important;
  background-image: none !important;
}

/* Звичайні клітинки таблиці — білий фон */
#gradebook-view .gb-table,
#gradebook-view #gb-table,
#gradebook-view #att-table,
#gradebook-view .gb-table tbody td {
  background-color: #ffffff !important;
  background-image: none !important;
}

#gradebook-view .gb-table tbody tr:hover td:not(.gb-sticky-col-2):not(.gb-sticky-col):not(.gb-sticky-avg) {
  background-color: rgba(28, 119, 255, 0.05) !important;
}

#gradebook-view .gb-table thead th:not(.gb-sticky-col-2):not(.gb-sticky-col):not(.gb-sticky-avg) {
  background-color: #f8fbff !important;
}

#gradebook-view .gb-table thead th.gb-sticky-col,
#gradebook-view .gb-table thead th.gb-sticky-col-2,
#gradebook-view .gb-table thead th.gb-sticky-avg,
#gradebook-view .gb-table tbody td.gb-sticky-col,
#gradebook-view .gb-table tbody td.gb-sticky-col-2,
#gradebook-view .gb-table tbody td.gb-sticky-avg {
  background-color: #ffffff !important;
}

/* Номер, ПІБ і середня оцінка — єдиний зафіксований блок */
#gradebook-view #gb-table th.gb-sticky-col,
#gradebook-view #gb-table td.gb-sticky-col,
#gradebook-view #gb-table th.gb-sticky-col-2,
#gradebook-view #gb-table td.gb-sticky-col-2,
#gradebook-view #gb-table th.gb-sticky-avg,
#gradebook-view #gb-table td.gb-sticky-avg {
  border-left: 0 !important;
  border-right: 0 !important;
}

#gradebook-view #gb-table th.gb-sticky-col:first-of-type,
#gradebook-view #gb-table td.gb-sticky-col:first-of-type {
  border-left: 1px solid rgba(229, 231, 235, 0.95) !important;
}

#gradebook-view #gb-table th.gb-sticky-avg:last-of-type,
#gradebook-view #gb-table td.gb-sticky-avg:last-of-type {
  border-right: 1px solid rgba(229, 231, 235, 0.95) !important;
}

/* Прокрутка відбувається в .gb-content; clip зберігає rounded corners і не ламає sticky. */
#gradebook-view .gb-wrapper,
#gradebook-view .gb-header-content-wrap {
  overflow: clip !important;
}

#gradebook-view #gb-table th.gb-sticky-col,
#gradebook-view #gb-table td.gb-sticky-col {
  position: sticky !important;
  left: 0 !important;
}

#gradebook-view #gb-table th.gb-sticky-col-2,
#gradebook-view #gb-table td.gb-sticky-col-2 {
  position: sticky !important;
  left: var(--gb-sticky-col-1-w) !important;
}

#gradebook-view #gb-table th.gb-sticky-avg,
#gradebook-view #gb-table td.gb-sticky-avg {
  position: sticky !important;
  left: calc(var(--gb-sticky-col-1-w) + var(--gb-sticky-col-2-w)) !important;
  border-left: 1px solid rgba(229, 231, 235, 0.95) !important;
  border-right: 1px solid rgba(229, 231, 235, 0.95) !important;
}