:root {
  --tblr-primary: #3db87a;
  --tblr-primary-rgb: 61, 184, 122;
  --tblr-font-sans-serif: Inter, "Segoe UI", system-ui, sans-serif;
  --tblr-body-bg: #fff;
  --tblr-body-font-size: 0.875rem;
}

.app-body {
  margin: 0;
  background: #fff;
  color: #1d2730;
  font-family: Inter, "Segoe UI", system-ui, sans-serif;
  font-size: .875rem;
}

.app-body .page {
  display: grid;
  grid-template-columns: 17rem minmax(0, 1fr);
  align-items: start;
  min-height: 100vh;
  min-width: 0;
}

.app-body .navbar-vertical {
  --tblr-navbar-bg: #10271f;
  --tblr-navbar-color: rgba(255, 255, 255, .78);
  --tblr-navbar-border-color: transparent;
  position: sticky;
  top: 0;
  right: auto;
  bottom: auto;
  left: auto;
  align-self: start;
  width: 17rem;
  min-width: 17rem;
  height: 100vh;
  min-height: 100vh;
  padding: 0;
  overflow-y: auto;
  background: #10271f !important;
  box-shadow: none;
}

.app-body .navbar-vertical .container-fluid {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  padding: 1rem .75rem 1rem;
}

.app-body .navbar-vertical .navbar-brand {
  margin: 0 0 1rem;
  padding: .25rem .5rem;
  justify-content: flex-start;
}

.app-body .navbar-vertical .navbar-collapse {
  flex: 1 1 auto;
  display: flex !important;
  flex-direction: column;
  width: 100%;
}

.app-body .navbar-vertical .navbar-nav,
.app-body .navbar-vertical .side-nav {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.app-body .navbar-vertical .nav-item {
  display: block;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: inherit;
  font-weight: inherit;
}

.app-body .navbar-vertical .nav-item > span {
  width: auto;
  height: auto;
  border: 0;
  background: transparent;
  font: inherit;
  color: inherit;
}

.app-body .navbar-vertical .nav-item-divider {
  height: 1px;
  margin: .65rem .7rem;
  background: rgba(255, 255, 255, .1);
}

.app-body .navbar-vertical .nav-link {
  display: grid !important;
  grid-template-columns: 1.15rem minmax(0, 1fr) 1.15rem;
  align-items: center;
  column-gap: .55rem;
  min-height: 2.15rem !important;
  height: 2.15rem !important;
  padding: 0 .65rem !important;
  color: rgba(255, 255, 255, .8);
  border: 0;
  border-radius: .5rem;
  font-size: 12px !important;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap !important;
}

.app-body .navbar-vertical .nav-link-title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  line-height: 1.15rem;
}

.app-body .navbar-vertical .nav-unread {
  display: grid;
  place-items: center;
  box-sizing: border-box;
  justify-self: end;
  width: 1.15rem;
  height: 1.15rem;
  padding: 0;
  margin: 0;
  color: #fff;
  background: #3db87a;
  border: 0;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  position: static;
  top: auto;
  transform: none;
}

.app-body .navbar-vertical .nav-link:hover {
  color: #fff;
  background: rgba(255, 255, 255, .06);
}

.app-body .navbar-vertical .nav-link.active {
  color: #fff;
  font-weight: 600;
  background: rgba(61, 184, 122, .22);
}

.app-body .navbar-vertical .nav-link-icon {
  width: 1.15rem;
  height: 1.15rem;
  display: grid;
  place-items: center;
  color: inherit;
  opacity: .9;
}

.app-body .navbar-vertical .nav-link-icon i {
  display: block;
  font-size: 15px;
  line-height: 1;
}

.app-body .navbar-vertical .nav-group {
  margin: 0;
  padding: 0;
}
.app-body .navbar-vertical .nav-group > details {
  margin: 0;
}
.app-body .navbar-vertical .nav-group-toggle {
  cursor: pointer;
  user-select: none;
  width: 100%;
}
.app-body .navbar-vertical .nav-group-toggle .nav-link-icon,
.app-body .navbar-vertical .nav-group-toggle .nav-group-caret {
  pointer-events: none;
}
.app-body .navbar-vertical .nav-group-toggle::-webkit-details-marker { display: none; }
.app-body .navbar-vertical .nav-group-toggle::marker { content: ""; }
.app-body .navbar-vertical .nav-group.is-current > details > .nav-group-toggle {
  color: #fff;
  font-weight: 600;
  background: transparent;
}
.app-body .navbar-vertical .nav-group-caret {
  justify-self: end;
  width: 1.15rem;
  height: 1.15rem;
  display: grid;
  place-items: center;
  font-size: 14px;
  line-height: 1;
  opacity: .75;
  transition: transform .15s ease;
}
.app-body .navbar-vertical .nav-group details[open] > .nav-group-toggle .nav-group-caret {
  transform: rotate(180deg);
}
.app-body .navbar-vertical .nav-group-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 2px 0 4px;
  padding: 0 0 0 .7rem;
  list-style: none;
}
.app-body .navbar-vertical .nav-group-list .nav-item {
  padding: 0;
}
.app-body .navbar-vertical .nav-group-list .nav-link {
  min-height: 1.7rem !important;
  height: 1.7rem !important;
  padding: 0 .45rem !important;
  border-radius: .35rem;
  font-size: 11px !important;
  font-weight: 500;
}
.app-body .navbar-vertical .nav-group-list .nav-link.active {
  font-weight: 600;
  background: rgba(61, 184, 122, .24);
}

.app-body .sidebar-user {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
  padding: .35rem .5rem;
  color: #fff;
}
.app-body .sidebar-user .avatar {
  --tblr-avatar-bg: #3db87a;
  width: 2rem;
  height: 2rem;
  flex: 0 0 2rem;
  color: #fff;
  background: #3db87a;
  font-size: .75rem;
  font-weight: 700;
}
.app-body .sidebar-user-meta {
  min-width: 0;
  line-height: 1.2;
}
.app-body .sidebar-user-meta strong {
  display: block;
  overflow: hidden;
  font-size: .8125rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-body .sidebar-user-meta small {
  color: rgba(255, 255, 255, .55);
  font-size: .7rem;
}
.app-body .navbar-vertical .sidebar-user .btn-icon {
  width: 2rem;
  height: 2rem;
  min-height: 2rem !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, .85) !important;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: .5rem;
  box-shadow: none !important;
}
.app-body .navbar-vertical .sidebar-user .btn-icon i {
  font-size: 1.05rem;
  line-height: 1;
}

.pandaria-brand {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
  color: #fff;
  text-decoration: none;
}

.pandaria-brand-mark {
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  background: #3db87a;
  border-radius: .5rem;
}

.pandaria-brand-mark img { width: 1.05rem; height: 1.05rem; }

.pandaria-brand-text {
  font-family: "Bricolage Grotesque", Inter, sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: .04em;
}

.app-body .page-wrapper {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  background: #fff;
}
.app-body .navbar-vertical ~ .page-wrapper { margin-left: 0; }

.app-body .app-topbar {
  display: flex;
  align-items: center;
  height: 3.5rem;
  margin: 0;
  padding: 0;
  background: #fff;
  border-bottom: 1px solid #e6ebe8;
}
.app-body .app-topbar .container-xl { width: 100%; }
.app-body .app-topbar .form-select { min-width: 8.5rem; }

.app-body .app-topbar .form-select,
.app-body .app-topbar .btn {
  height: 36px;
  min-height: 36px;
  width: auto;
}

.app-body .page-body {
  min-width: 0;
  padding: 1.25rem 0 3rem;
}
.app-body .page-body > .container-xl {
  min-width: 0;
}

.app-body .page-pretitle {
  margin: 0;
  color: #1b8756;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.app-body .page-title {
  font-family: "Bricolage Grotesque", Inter, sans-serif;
  letter-spacing: -.02em;
}

.app-body .card,
.app-body .stat,
.app-body .kine-stat,
.app-body .ds-tile,
.app-body .empty-state,
.app-body .ds-empty {
  background: #fff !important;
  border: 1px solid #e6ebe8 !important;
  border-radius: 12px;
  box-shadow: none;
}

.app-body .card { padding: 0 !important; margin-bottom: 1rem; overflow: visible; }
.app-body .card-body { padding: 1.25rem; overflow: visible; }
.app-body .card-header {
  display: flex;
  align-items: center;
  padding: 1rem 1.25rem;
  background: #fff;
  border-bottom: 1px solid #e6ebe8;
}
.app-body .card-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.app-body .btn,
.app-body .btn.sm {
  min-height: 36px;
  padding: .4rem .85rem;
  color: #fff !important;
  background: #3db87a !important;
  border: 1px solid #3db87a !important;
  border-radius: 8px;
  font-size: .8125rem;
  font-weight: 600;
  box-shadow: none !important;
  transform: none !important;
}
.app-body .btn-sm,
.app-body .btn.sm { min-height: 32px; padding: .25rem .7rem; }
.app-body .btn:hover,
.app-body .btn.j:hover,
.app-body .btn-primary:hover {
  background: #2fa66b !important;
  border-color: #2fa66b !important;
  color: #fff !important;
  transform: none !important;
}
.app-body .btn-primary,
.app-body .btn.j { color: #fff !important; background: #3db87a !important; border-color: #3db87a !important; }
.app-body .btn.scal-move-pick-exit,
.app-body a.btn.scal-move-pick-exit,
.app-body #scal-move-pick-exit {
  color: #fff !important;
  background: #2f6fed !important;
  border-color: #2f6fed !important;
  box-shadow: 0 6px 16px rgba(47, 111, 237, .22) !important;
}
.app-body .btn.scal-move-pick-exit:hover,
.app-body .btn.scal-move-pick-exit:focus-visible,
.app-body a.btn.scal-move-pick-exit:hover,
.app-body a.btn.scal-move-pick-exit:focus-visible,
.app-body #scal-move-pick-exit:hover,
.app-body #scal-move-pick-exit:focus-visible {
  color: #fff !important;
  background: #1f5ad6 !important;
  border-color: #1f5ad6 !important;
}
.app-body .btn-outline-secondary,
.app-body .btn.ghost,
.app-body .btn.secondary {
  color: #3d4a44 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
}
.app-body .btn-outline-secondary:hover,
.app-body .btn-outline-secondary:focus-visible {
  color: #fff !important;
  background: #2fa66b !important;
  border-color: #2fa66b !important;
}
.app-body .lnf-draft-calendar-banner [data-lnf-draft-dismiss].btn-outline-secondary:hover,
.app-body .lnf-draft-calendar-banner [data-lnf-draft-dismiss].btn-outline-secondary:focus-visible,
.app-body .lnf-draft-return [data-lnf-draft-dismiss].btn-outline-secondary:hover,
.app-body .lnf-draft-return [data-lnf-draft-dismiss].btn-outline-secondary:focus-visible {
  color: #fff !important;
  background: #e24b4b !important;
  border-color: #e24b4b !important;
}
.app-body .scal-modal .lnf-person-card-actions .lnf-card-btn-edit:hover,
.app-body .scal-modal .lnf-person-card-actions .lnf-card-btn-edit:focus-visible {
  background: #2f6fed !important;
  border-color: #2f6fed !important;
  color: #fff !important;
}
.app-body .scal-modal .lnf-person-card-actions .lnf-card-btn-remove:hover,
.app-body .scal-modal .lnf-person-card-actions .lnf-card-btn-remove:focus-visible {
  background: #e24b4b !important;
  border-color: #e24b4b !important;
  color: #fff !important;
}

.app-body .form-select,
.app-body .form-control,
.app-body input:not([type=checkbox]):not([type=radio]),
.app-body select,
.app-body textarea {
  min-height: 36px;
  border-radius: 8px;
  border-color: #d5ddd8;
  background: #fff;
  font-size: .875rem;
}
.app-body .form-label,
.app-body .ds-field > label,
.app-body fieldset legend {
  margin-bottom: .35rem;
  color: #4b5a53;
  font-size: .75rem;
  font-weight: 600;
}
.app-body .ds-fieldset {
  margin: 0 0 1rem;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
}
.app-body .ds-filterbar {
  background: #fff !important;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
}

.app-body table:not(.scal-month) {
  width: 100%;
  font-size: .8125rem;
  border-spacing: 0;
}
.app-body table:not(.scal-month) th,
.app-body table:not(.scal-month) td {
  padding: .7rem .75rem;
  font-size: .8125rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  vertical-align: middle;
}
.app-body table:not(.scal-month) th {
  color: #6b7c74;
  background: #fff;
  font-weight: 600;
}
.app-body .table-fixed-metrics {
  table-layout: fixed;
}
.app-body .table-fixed-metrics th,
.app-body .table-fixed-metrics td {
  width: 12.5%;
  text-align: center;
}
.app-body .table-fixed-metrics th:first-child,
.app-body .table-fixed-metrics td:first-child {
  width: 25%;
  text-align: left;
}

.app-body .page-head,
.app-body .ds-page-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.25rem;
  padding: 0;
  background: transparent;
  border: 0;
}
.app-body main .page-header {
  margin: 0 0 1.25rem;
  padding: 0;
  background: transparent;
  border: 0;
}
.app-body main .page-header + .stu-media-tabs,
.app-body main .admin-lessons-chrome .stu-media-tabs {
  margin-top: 0;
  margin-bottom: 1.25rem;
}
.app-body main .admin-lessons-chrome .page-header {
  margin-bottom: 0;
  min-height: 5.5rem;
}
.app-body .groups-list td form { margin: 0; }
.app-body .groups-list .form-select,
.app-body .groups-list .form-select-sm,
.app-body .groups-list .btn,
.app-body .groups-list .btn-sm {
  height: 32px;
  min-height: 32px;
  padding-top: 0;
  padding-bottom: 0;
}
.app-body .groups-list .form-select,
.app-body .groups-list .form-select-sm { width: 100%; min-width: 0; }
.app-body .groups-students {
  display: flex;
  align-items: center;
  gap: .5rem;
  white-space: nowrap;
}
.app-body .page-head h1,
.app-body .ds-page-intro h1,
.app-body .page-title {
  margin: 0;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -.02em;
}
.app-body .page-kicker,
.app-body .ds-overline,
.app-body .tch-overline,
.app-body .scal-overline {
  display: block;
  margin: 0 0 .25rem;
  color: #1b8756 !important;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.app-body .page-kicker::before { display: none !important; }
.app-body .page-head p,
.app-body .ds-page-intro p,
.app-body .text-secondary {
  max-width: 72ch;
  color: #66756e;
  font-size: .8125rem;
}

.app-body .student-section-head > div > span { display: none; }
.app-body .student-section-head h2,
.app-body .ds-section > h2 {
  margin: 0 0 .75rem;
  color: #1d2730;
  font-size: .95rem;
  font-weight: 600;
}
.app-body .kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.app-body .kpi-grid > .card {
  min-width: 0;
  width: 100%;
}
.app-body .kpi-card,
.app-body .row-cards > [class*="col"] > .card {
  height: 100%;
  min-height: 8.25rem;
  margin-bottom: 0;
}
.app-body .kpi-card .card-body,
.app-body .row-cards .card-body {
  display: flex;
  flex-direction: column;
  padding: 1rem 1.15rem;
}
.app-body .kpi-label,
.app-body .kpi-card .subheader,
.app-body .row-cards .subheader {
  margin: 0 0 .35rem;
  color: #6b7c74;
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .04em;
  line-height: 1.3;
  text-transform: uppercase;
  white-space: nowrap;
}
.app-body .kpi-value,
.app-body .kpi-card .h1,
.app-body .row-cards .h1 {
  margin: 0;
  color: #1d2730;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  font-family: Inter, "Segoe UI", sans-serif;
}
.app-body .kpi-hint,
.app-body .kpi-card .text-secondary,
.app-body .row-cards .text-secondary {
  margin-top: auto;
  padding-top: .35rem;
  max-width: none;
  font-size: .75rem;
  line-height: 1.35;
}

.app-body .empty-state,
.app-body .ds-empty {
  padding: 2rem 1.25rem;
  text-align: center;
  justify-items: center;
}
.app-body .badge,
.app-body .pill,
.app-body .status-pill,
.app-body .lead-pill,
.app-body .ds-tag {
  display: inline-flex;
  align-items: center;
  padding: .2rem .5rem;
  border-radius: 6px;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.app-body .pill.active { color: #1b8756; background: #e8f7ef; }
.app-body .nav-pills .nav-link { color: #4b5a53; }
.app-body .nav-pills .nav-link.active { color: #fff; background: #3db87a; }

.app-body .kine-dash,
.app-body .marketing-kpis,
.app-body .grid.grid-4 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-bottom: 1rem;
}
.app-body .stat .big,
.app-body .kine-stat b,
.app-body .ds-tile b { font-size: 1.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.app-body .table-responsive { overflow-x: auto; overflow-y: hidden; }

.app-body .kpi-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199.98px) {
  .app-body .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .app-body .kpi-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .app-body .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.app-body .report-period {
  overflow: visible;
  padding: 0;
  padding-left: 0;
  margin-left: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.app-body .report-period-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .85rem;
  padding: 0;
}
.app-body .report-period-field { min-width: 11rem; }
.app-body .dp-modes,
.app-body .dp-hint { display: none; }
.app-body .report-period-field .form-select,
.app-body .report-period-field .form-control,
.app-body .report-period-field .dp-toggle,
.app-body .report-period-field .btn {
  height: 40px;
  min-height: 40px;
  width: 100%;
}
.app-body .dp {
  position: relative;
  z-index: 1;
}
.app-body .dp:has(.dp-panel:not([hidden])) {
  z-index: 80;
}
.app-body .dp-modes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .4rem;
  margin-bottom: .75rem;
}
.app-body .dp-mode {
  min-height: 2.1rem;
  color: #1d2730 !important;
  background: #f4f7f5 !important;
  border: 0 !important;
  border-radius: 8px;
  font-size: .8125rem;
  font-weight: 600;
}
.app-body .dp-mode.is-on {
  color: #fff !important;
  background: #3db87a !important;
}
.app-body .dp-hint {
  margin-top: .65rem;
  color: #6b7c74;
  font-size: .75rem;
}
.app-body .dp-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 40px;
  padding: .5rem .75rem;
  color: #1d2730;
  background: #fff;
  border: 1px solid #d5ddd8;
  border-radius: 8px;
  font-size: .9375rem;
  text-align: left;
}
.app-body .dp-panel {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  width: 22rem;
  padding: 1rem;
  background: #fff;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(16, 39, 31, .16);
}
.app-body .dp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .85rem;
}
.app-body .dp-head b { font-size: 1.05rem; }
.app-body .dp-head button {
  width: 2.25rem;
  height: 2.25rem;
  color: #1d2730 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
  border-radius: 8px;
}
.app-body .dp-months,
.app-body .dp-days {
  display: grid;
  gap: .4rem;
}
.app-body .dp-months { grid-template-columns: repeat(3, 1fr); }
.app-body .dp-days { grid-template-columns: repeat(7, 1fr); }
.app-body .dp-wd {
  color: #6b7c74;
  font-size: .7rem;
  font-weight: 600;
  text-align: center;
}
.app-body .dp-cell {
  min-height: 2.6rem;
  padding: .4rem .25rem;
  color: #1d2730 !important;
  background: #f4f7f5 !important;
  border: 0 !important;
  border-radius: 8px;
  font-size: .9rem;
  font-weight: 600;
}
.app-body .dp-cell:hover { background: #e8f7ef !important; }
.app-body .dp-cell.is-on {
  color: #fff !important;
  background: #3db87a !important;
}
.app-body .dp-cell.is-muted { opacity: .4; }
.app-body .dp-today {
  display: block;
  width: 100%;
  margin-top: .75rem;
  color: #1b8756 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: .8125rem;
}
.app-body .dp-panel-time { padding: .75rem; }
.app-body .dp-time {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
}
.app-body .dp-time-col {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  max-height: 14rem;
  overflow-y: auto;
  padding: .15rem;
}
.app-body .dp-time-col b {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: .15rem 0 .35rem;
  color: #6b7c74;
  background: #fff;
  font-size: .7rem;
  font-weight: 700;
  text-align: center;
}
.app-body .dp-time-col .dp-cell {
  min-height: 2.1rem;
  padding: .25rem;
}
.app-body .scal-book-body .dp-toggle {
  min-height: 2.75rem;
  padding: .7rem .9rem;
  border-radius: 10px;
  font-size: .9375rem;
}

.skip-link { position: absolute; left: -999px; }
.skip-link:focus { left: 12px; top: 12px; z-index: 2000; }

@media (max-width: 991.98px) {
  .app-body .page {
    grid-template-columns: minmax(0, 1fr);
  }
  .app-body .navbar-vertical {
    position: relative;
    top: auto;
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 0;
    overflow-y: visible;
  }
  .app-body .navbar-vertical .container-fluid { min-height: 0; }
  .app-body .navbar-vertical .navbar-collapse { display: none !important; }
  .app-body .navbar-vertical .navbar-collapse.show { display: flex !important; }
}



.app-body .scal-date-nav {
  display: block;
  margin: 0 0 1rem;
}
.app-body .scal-date-nav-main {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .5rem;
}
.app-body .scal-date-nav .btn {
  flex: 0 0 auto;
  width: auto;
  min-height: 36px;
  height: 36px;
  padding: 0 .9rem;
}
.app-body .scal-date-nav .btn-icon {
  flex: 0 0 36px;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
  color: #1d2730 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
  box-shadow: none !important;
}
.app-body .scal-date-nav .dp {
  display: block;
  flex: 0 0 12.5rem;
  width: 12.5rem;
  z-index: 20;
}
.app-body .scal-date-nav .dp input {
  position: absolute !important;
  width: 1px !important;
}
.app-body .scal-date-nav .dp-toggle {
  height: 36px;
  min-height: 36px;
}
.app-body .scal-hub-toolbar {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin: 0 !important;
  padding: .75rem 1rem !important;
}
.app-body .scal-hub-card.card {
  padding: 0 !important;
}
.app-body .scal-hub-card,
.app-body .scal-hub-card .card-body,
.app-body .scal-hub-card .card-header {
  overflow: visible;
}
.app-body .scal-view-btns {
  display: flex;
  gap: .4rem;
  margin: 0;
}
.app-body .scal-view-btns .btn {
  min-height: 36px;
  height: 36px;
  padding: 0 .9rem;
  border-radius: 8px !important;
}
.app-body .scal-view-btns .btn-outline-secondary {
  color: #2f6f52 !important;
  background: #fff !important;
  border-color: #cfe4d8 !important;
}
.app-body .scal-view-btns .btn-outline-secondary:hover {
  color: #1d2730 !important;
  background: #f3f8f5 !important;
  border-color: #3db87a !important;
}
.app-body .scal-view-btns .btn-primary {
  color: #fff !important;
  background: #3db87a !important;
  border-color: #3db87a !important;
}
.app-body .scal-hub .dropdown-menu-card {
  width: 17.5rem;
  max-height: calc(100dvh - 6.5rem);
  padding: 0;
  border: 0;
  background: transparent;
  overflow: hidden;
}
.app-body .scal-hub .dropdown-menu-card.show {
  display: flex;
}
.app-body .scal-hub .dropdown-menu-card .card {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: calc(100dvh - 6.5rem);
  min-height: 0;
}
.app-body .scal-hub .dropdown-menu-card .card-header {
  flex: 0 0 auto;
  padding: .45rem .7rem;
}
.app-body .scal-hub .dropdown-menu-card .card-title {
  margin: 0;
  font-size: .875rem;
}
.app-body .scal-hub .dropdown-menu-card .card-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: .55rem .7rem;
  overflow-y: auto;
}
.app-body .scal-hub .dropdown-menu-card .card-footer {
  flex: 0 0 auto;
  padding: .45rem .7rem;
}
.app-body .scal-hub .dropdown-menu-card .mb-3 {
  margin-bottom: .5rem !important;
}
.app-body .scal-filter-actions {
  display: flex;
  gap: .5rem;
  align-items: center;
}
.app-body .scal-filter-actions .btn {
  flex: 1 1 0;
  min-width: 0;
}
.app-body .scal-hub .dropdown-menu-card .btn-outline-secondary {
  color: #3d4a44 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
}
.app-body .scal-hub .dropdown-menu-card .form-label {
  margin-bottom: .15rem;
  font-size: .75rem;
}
.app-body .scal-hub .dropdown-menu-card .form-select,
.app-body .scal-hub .dropdown-menu-card .form-control {
  min-height: 32px;
  height: 32px;
  padding: .2rem .5rem;
  font-size: .8125rem;
}
.app-body .scal-hub .dropdown-menu-card .btn {
  min-height: 32px;
  height: 32px;
  padding: 0 .65rem;
  font-size: .8125rem;
}
.app-body .scal-hub .scal-month {
  border-spacing: 6px !important;
}
.app-body .scal-hub .scal-month th {
  padding: 8px 6px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}
.app-body .scal-hub .scal-month td {
  height: 112px !important;
  overflow: hidden;
  border-radius: 16px !important;
}
.app-body .scal-hub .scal-month td.outside.scal-free-yes,
.app-body .scal-hub .scal-month td.outside.scal-has-lessons {
  box-shadow: inset 0 0 0 2px #3db87a !important;
  background: #fff !important;
  border-color: #3db87a !important;
}
.app-body .scal-hub .scal-month td.outside.scal-free-no {
  box-shadow: inset 0 0 0 2px #d63939 !important;
  background: #fff !important;
  border-color: #d63939 !important;
}
.app-body .scal-hub .scal-month td.past,
.app-body .scal-hub .scal-month td.past.scal-free-yes,
.app-body .scal-hub .scal-month td.past.scal-free-no,
.app-body .scal-hub .scal-month td.past.scal-has-lessons,
.app-body .scal-hub .scal-month td.outside.past {
  background: #eef0f2 !important;
  border-color: #d5d9dc !important;
  box-shadow: inset 0 0 0 1px #d5d9dc !important;
  color: #8a9399;
}
.app-body .scal-hub .scal-month td.past:hover {
  background: #e6e9ec !important;
}
.app-body .scal-hub .scal-month td.past .scal-daynum {
  color: #8a9399 !important;
}
.app-body .scal-filter-btn {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: .45rem;
  height: auto !important;
  min-height: 36px;
  max-width: 20rem;
  padding: .4rem .9rem !important;
  line-height: 1.2;
  text-align: left;
}
.app-body .scal-filter-btn::after { display: none !important; }
.app-body .scal-filter-btn > .ti {
  flex: 0 0 auto;
  font-size: 1rem;
  line-height: 1;
  opacity: .9;
}
.app-body .scal-filter-btn[aria-expanded="true"] > .ti { transform: rotate(180deg); }
.app-body .scal-filter-btn-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}
.app-body .scal-filter-btn-title { font-weight: 600; }
.app-body .scal-filter-btn-hint {
  display: block;
  max-width: 14rem;
  overflow: hidden;
  color: inherit;
  font-size: .6875rem;
  font-weight: 500;
  opacity: .88;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-body .scal-filter-acc { margin: 0 0 .75rem; }
.app-body .scal-filter-acc > .form-label {
  margin-bottom: .3rem;
}
.app-body .scal-filter-acc details {
  overflow: hidden;
  background: #fff;
  border: 1px solid #d5ddd8;
  border-radius: 8px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.app-body .scal-filter-acc details:hover {
  border-color: #3db87a;
}
.app-body .scal-filter-acc details[open] {
  border-color: #8fd4b0;
}
.app-body .scal-filter-acc details[open]:hover {
  border-color: #3db87a;
}
.app-body .scal-filter-acc details > summary {
  display: flex;
  align-items: center;
  gap: .4rem;
  list-style: none;
  padding: .5rem .7rem;
  color: #1d2730;
  background: #fff;
  border: 0;
  cursor: pointer;
}
.app-body .scal-filter-acc details > summary::-webkit-details-marker { display: none; }
.app-body .scal-filter-acc details > summary::marker { content: ""; }
.app-body .scal-filter-acc-val {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #1d2730;
  font-size: .875rem;
  font-weight: 500;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-body .scal-filter-acc details > summary .ti {
  flex: 0 0 auto;
  font-size: 1rem;
  color: #6b7c74;
  transition: transform .15s ease;
}
.app-body .scal-filter-acc details[open] > summary {
  border-bottom: 1px solid #e4ece7;
}
.app-body .scal-filter-acc details[open] > summary .ti { transform: rotate(180deg); }
.app-body .scal-filter-search-wrap {
  padding: .35rem .3rem .2rem;
}
.app-body .scal-filter-search {
  height: 2rem !important;
  min-height: 2rem !important;
  padding: .2rem .55rem !important;
  font-size: .8125rem !important;
}
.app-body .scal-filter-checks {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-height: 8.5rem;
  overflow-y: auto;
  padding: .25rem;
  border: 0;
  background: #fff;
}
.app-body .scal-filter-opt {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  height: 2rem;
  margin: 0;
  padding: 0 .6rem;
  overflow: hidden;
  border-radius: 6px;
  color: #1d2730;
  font-size: .8125rem;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
}
.app-body .scal-filter-opt:hover {
  background: #f3f8f5;
}
.app-body .scal-filter-opt:has(input:checked) {
  background: #e8f6ee;
}
.app-body .scal-filter-opt input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  appearance: none;
  pointer-events: none;
}
.app-body .scal-filter-opt span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-body .scal-hub .form-check-label {
  font-size: .8125rem;
  font-weight: 500;
  color: #1d2730;
}
.app-body .scal-hub .scal-month td.scal-has-lessons {
  box-shadow: inset 0 0 0 2px #3db87a;
  background: #fff !important;
}
.app-body .scal-hub .scal-cell-link:hover,
.app-body .scal-hub .scal-cell-link:focus {
  background: transparent !important;
}
.app-body .scal-hub .scal-month td:hover {
  background: #f3f8f5 !important;
}
.app-body .scal-hub .scal-cell-link,
.app-body .scal-cell-link {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-height: 0 !important;
  height: 100%;
  padding: 10px 10px 8px !important;
}
.app-body .scal-cell-free {
  position: absolute;
  top: 8px;
  right: 8px;
  max-width: calc(100% - 2.6rem);
  margin: 0 !important;
  text-align: right;
  white-space: nowrap;
}
.app-body .scal-hub .scal-daynum,
.app-body .scal-daynum {
  margin: 0 0 6px !important;
  padding-right: 4.8rem;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.1;
}
.app-body .scal-hub .scal-month td.past,
.app-body .scal-hub .scal-month td.past.scal-free-yes,
.app-body .scal-hub .scal-month td.past.scal-free-no,
.app-body .scal-hub .scal-month td.past.scal-has-lessons,
.app-body .scal-hub .scal-month td.outside.past,
.app-body .scal-hub .scal-month td.past:hover {
  background: #eef0f2 !important;
  border-color: #d5d9dc !important;
  box-shadow: inset 0 0 0 1px #d5d9dc !important;
  color: #8a9399;
}
.app-body .scal-hub .scal-month td.past .scal-daynum,
.app-body .scal-hub .scal-month td.past .scal-cell-link {
  color: #8a9399 !important;
}
.app-body .scal-hub .scal-month td.past .scal-cell-link:hover {
  background: transparent !important;
}
.app-body .scal-hub .scal-tag,
.app-body .scal-tag {
  display: inline-flex;
  margin-top: 0 !important;
  padding: 3px 8px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.25;
}

.app-body .scal-week-grid {
  grid-template-columns: repeat(7, minmax(180px, 1fr)) !important;
  gap: 12px !important;
  overflow-x: auto;
}
.app-body .scal-week-day {
  min-height: 22rem;
  padding: 14px !important;
  background: #fff !important;
}
.app-body .scal-week-day h3 { font-size: 1rem !important; }
.app-body .scal-day-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.app-body .scal-modal .scal-day {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.app-body .scal-day-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
  margin: 0 0 1rem;
}
.app-body .scal-stat {
  display: flex;
  align-items: center;
  min-height: 3.25rem;
  padding: .75rem 1rem;
  color: #1d2730 !important;
  text-decoration: none !important;
  background: #fff;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  font-size: .9375rem;
  font-weight: 600;
}
.app-body .scal-stat strong {
  font-size: 1.05rem;
  font-weight: 700;
}
.app-body .scal-stat.is-on {
  background: #f3f8f5;
  border-color: #3db87a;
}
.app-body .scal-stat:only-child { grid-column: 1 / -1; }
.app-body .scal-modal .scal-day-toolbar {
  display: flex;
  margin: 0 0 1rem;
}
.app-body .scal-modal .scal-timegrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(5.4rem, 1fr));
  gap: .5rem;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
  background: transparent;
}
.app-body .scal-modal .scal-tcell {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-height: 4.4rem;
  padding: .65rem .55rem;
  color: #1d2730;
  text-decoration: none;
  background: #fff;
  border: 1px solid #e6ebe8;
  border-radius: 10px;
}
.app-body .scal-modal .scal-tcell b {
  font-size: .95rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.app-body .scal-modal .scal-tcell-meta {
  display: flex;
  flex-direction: column;
  gap: 1px;
  color: #6b7c74;
  font-size: .7rem;
  line-height: 1.25;
}
.app-body .scal-modal .scal-tcell.is-free {
  background: #e8f6ee;
  border-color: #cfe4d8;
}
.app-body .scal-modal .scal-tcell.is-mixed {
  background: #eef6f1;
  border-color: #3db87a;
}
.app-body .scal-modal .scal-tcell.is-busy {
  background: #f6f7f6;
}
.app-body .scal-modal .scal-tcell.is-empty {
  color: #8a9891;
  opacity: .55;
}
.app-body .scal-modal .scal-tcell:hover {
  border-color: #3db87a;
  box-shadow: none;
  transform: none;
}
.app-body .scal-modal .scal-day-section-label {
  padding-left: 1rem;
  margin-bottom: .55rem;
  color: #1d2730 !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
}
.app-body .scal-day-list {
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.app-body .scal-day-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .75rem;
  padding: 1.25rem 1rem;
  text-align: center;
  background: #fff;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
}
.app-body .scal-modal .scal-lesson-group {
  margin: 0;
  overflow: visible;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  box-shadow: none;
}
.app-body .scal-modal .scal-lesson-group > .card-header {
  padding: .85rem 1rem;
  border-bottom: 1px solid #eef2f0;
}
.app-body .scal-modal .scal-lesson-group .card-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 650;
}
.app-body .scal-modal .scal-lesson-group .card-subtitle {
  margin: .15rem 0 0;
  color: #6b7c74;
  font-size: .8125rem;
}
.app-body .scal-modal .scal-lesson-group > .card-body {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  padding: .85rem 1rem 1rem;
}
.app-body .scal-modal .scal-lesson-card {
  margin: 0;
  border: 1px solid #3db87a !important;
  border-radius: 10px !important;
  box-shadow: none;
}
.app-body .scal-modal .scal-free-block-title {
  margin-bottom: .55rem;
  color: #4b5a53;
  font-size: .8125rem;
  font-weight: 650;
}
.app-body .scal-modal .scal-slots {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.app-body .scal-modal .scal-slot {
  min-height: 2.85rem;
  padding: .65rem 1.15rem !important;
  color: #1d2730 !important;
  background: #fff !important;
  border: 1px solid #cfe4d8 !important;
  border-radius: 10px !important;
  font-size: 1.05rem !important;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.app-body .scal-modal .scal-slot.unset {
  color: #5f6e66 !important;
  background: #f7faf8 !important;
  border-style: dashed !important;
}
.app-body .scal-modal button.scal-slot {
  cursor: pointer;
}
.app-body .scal-hub .scal-lesson-group {
  margin: 0;
  overflow: visible;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  box-shadow: none;
}
.app-body .scal-hub .scal-lesson-group > .card-header {
  align-items: flex-start;
  padding: .9rem 1.1rem;
  border-bottom: 1px solid #eef2f0;
}
.app-body .scal-hub .scal-lesson-group .card-title {
  font-size: 1rem;
  font-weight: 650;
}
.app-body .scal-hub .scal-lesson-group .card-subtitle {
  margin: .15rem 0 0;
  color: #6b7c74;
  font-size: .8125rem;
}
.app-body .scal-hub .scal-lesson-group > .card-body {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  padding: .85rem 1.1rem 1.1rem;
}
.app-body .scal-hub .scal-lesson-card,
.app-body .kine-preview-page .scal-lesson-card {
  margin: 0;
  padding: 0 !important;
  border: 1px solid #3db87a !important;
  border-left-width: 1px !important;
  border-left-color: #3db87a !important;
  border-radius: 10px !important;
  box-shadow: none;
  background: #fff !important;
}
.app-body .scal-hub .scal-lesson-card > .card-body,
.app-body .kine-preview-page .scal-lesson-card > .card-body {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  padding: .9rem 1rem;
}
.app-body .scal-lesson-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .75rem;
}
.app-body .scal-lesson-time {
  color: #1d2730;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.2;
}
.app-body .scal-lesson-who {
  color: #1d2730;
  font-size: .9375rem;
  font-weight: 600;
}
.app-body .scal-lesson-who a {
  color: #2f6f52;
  font-weight: 650;
  text-decoration: none;
}
.app-body .scal-lesson-actions,
.app-body .scal-modal .scal-lesson-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  overflow: visible;
}
.app-body .scal-lesson-card .card-body { overflow: visible; }
.app-body .scal-lesson-actions .btn-outline-secondary {
  color: #3d4a44 !important;
  background: #fff !important;
  border-color: #d5ddd8 !important;
}
.app-body .scal-lesson-actions .btn-primary {
  color: #fff !important;
  background: #3db87a !important;
  border-color: #3db87a !important;
}
.app-body .scal-hub .scal-lesson-card.is-archive,
.app-body .scal-modal .scal-lesson-card.is-archive,
.app-body .kine-preview-page .scal-lesson-card.is-archive {
  background: #f3f4f5 !important;
  border-color: #c5c9cc !important;
  border-left-color: #9aa3a8 !important;
}
.app-body .scal-lesson-card.is-archive .btn,
.app-body .scal-lesson-card.is-archive .btn-primary,
.app-body .scal-lesson-card.is-archive .btn-outline-secondary,
.app-body .scal-lesson-card.is-archive .scal-lesson-actions .btn-primary,
.app-body .scal-lesson-card.is-archive .scal-lesson-actions .btn-outline-secondary {
  color: #5b6368 !important;
  background: #e8eaec !important;
  border-color: #c5c9cc !important;
}
.app-body .scal-lesson-card.is-archive .btn:hover,
.app-body .scal-lesson-card.is-archive .btn-primary:hover {
  color: #3d4448 !important;
  background: #dde0e3 !important;
  border-color: #b4b9bd !important;
}
.app-body .scal-lesson-card.is-archive .badge.bg-green-lt {
  color: #5b6368;
  background: #e4e6e8;
}
.app-body .scal-hub .kine-room,
.app-body .kine-preview-page .kine-room { margin: 0; }
.app-body .scal-hub .kine-status,
.app-body .kine-preview-page .kine-status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .45rem;
  color: #3d4a44;
  font-size: .8125rem;
  font-weight: 500;
}
.app-body .scal-hub .kine-wait,
.app-body .kine-preview-page .kine-wait {
  margin: .15rem 0 0;
  color: #6b7c74;
  font-size: .8125rem;
}
.app-body .scal-hub .kine-actions:not(:has(a, button)),
.app-body .kine-preview-page .kine-actions:not(:has(a, button)) { display: none; }
.app-body .scal-modal .kine-lesson-tab .kine-room {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "status actions"
    "wait actions";
  align-items: center;
  column-gap: .75rem;
  row-gap: .15rem;
}
.app-body .scal-modal .kine-lesson-tab .kine-status { grid-area: status; }
.app-body .scal-modal .kine-lesson-tab .kine-wait { grid-area: wait; margin: 0; }
.app-body .scal-modal .kine-lesson-tab .kine-actions {
  grid-area: actions;
  margin-top: 0;
  justify-content: flex-end;
}
.app-body .scal-modal .kine-lesson-acc {
  margin: 0 0 .75rem;
  overflow: hidden;
}
.app-body .scal-modal .kine-lesson-acc > .card-body {
  border-top: 1px solid rgba(26, 22, 32, .08);
}
.app-body .scal-modal .kine-lesson-acc-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .75rem;
  list-style: none;
  cursor: pointer;
  padding: .95rem 1.1rem;
  user-select: none;
}
.app-body .scal-modal .kine-lesson-acc-summary::-webkit-details-marker { display: none; }
.app-body .scal-modal .kine-lesson-acc-title {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--jade-ink, #0c5b42);
  font-size: .9875rem;
  font-weight: 750;
}
.app-body .scal-modal .kine-lesson-acc-title .ti {
  font-size: 1.1rem;
  color: #2f6f52;
}
.app-body .scal-modal .kine-lesson-acc-hint {
  color: #6b7c74;
  font-size: .8125rem;
  font-weight: 500;
}
.app-body .scal-modal .kine-lesson-acc-chevron {
  margin-left: auto;
  color: #8a9690;
  font-size: 1.05rem;
  transition: transform .18s ease;
}
.app-body .scal-modal .kine-lesson-acc[open] .kine-lesson-acc-chevron {
  transform: rotate(180deg);
}
.app-body .scal-modal .kine-lesson-acc:hover {
  border-color: rgba(61, 184, 122, .35);
}
.app-body .scal-modal .kine-share-block {
  display: grid;
  gap: .45rem;
  margin-top: .85rem;
}
.app-body .scal-modal .kine-share-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .35rem .65rem;
}
.app-body .scal-modal .scal-lesson-ops {
  display: flex;
  flex-direction: column;
  gap: .65rem;
  margin-top: .25rem;
}
.app-body .scal-modal .scal-lesson-ops-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
}
.app-body .scal-modal .scal-lesson-ops-row .btn {
  min-height: 2.35rem;
  border-radius: 10px;
}
.app-body .scal-modal .scal-status-edit {
  margin: .35rem 0 .15rem;
}
.app-body .scal-modal .scal-status-edit .btn[aria-pressed="true"] {
  pointer-events: none;
}
.app-body .scal-modal .tsched-drop {
  position: relative;
  height: auto;
  overflow: visible;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: min(100%, 16rem);
}
.app-body .scal-modal .tsched-drop[open] {
  z-index: 30;
  flex: 1 1 100%;
}
.app-body .scal-modal .tsched-drop > summary.btn {
  list-style: none;
  display: inline-flex;
  align-items: center;
}
.app-body .scal-modal .tsched-drop > summary.btn::-webkit-details-marker { display: none; }
.app-body .scal-modal .tsched-drop > summary.btn::marker { content: ""; }
.app-body .scal-modal .tsched-drop > form,
.app-body .scal-modal .tsched-drop > .tsched-drop-body {
  position: static !important;
  z-index: 1;
  display: grid;
  gap: 6px;
  width: 100%;
  max-width: 22rem;
  margin: 8px 0 0;
  padding: 12px;
  background: #fff;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  box-shadow: none;
}
.app-body .scal-modal:has(.tsched-drop[open]),
.app-body .scal-modal-body:has(.tsched-drop[open]),
.app-body .scal-modal .scal-panel:has(.tsched-drop[open]) {
  overflow: visible;
}
.app-body .scal-modal .tsched-drop > form label,
.app-body .scal-modal .tsched-drop > .tsched-drop-body label {
  margin: 0;
  color: #6b7c74;
  font-size: .75rem;
  font-weight: 600;
}
.app-body .scal-modal .tsched-drop > form textarea,
.app-body .scal-modal .tsched-drop > form input[type="datetime-local"],
.app-body .scal-modal .tsched-drop > .tsched-drop-body textarea,
.app-body .scal-modal .tsched-drop > .tsched-drop-body input[type="datetime-local"] {
  width: 100%;
  min-height: 2.25rem;
  padding: .4rem .55rem;
  border: 1px solid #d7e6dc;
  border-radius: 8px;
}
.app-body .kine-preview-page .badge.kine-chip {
  padding: 4px 10px;
  border: 0;
  border-radius: 100rem;
  background-image: none;
  font-size: 13px;
  font-weight: 700;
}
.app-body .kine-preview-page .kine-stat .card-body {
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.app-body .kine-preview-page .kine-stat b {
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.app-body .kine-preview-page .kine-stat span {
  color: #667078;
  font-size: .75rem;
  font-weight: 600;
}
.app-body .scal-modal.kine-stage {
  width: min(44rem, calc(100vw - 2rem)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: min(36rem, calc(100vh - 2.5rem)) !important;
}
.app-body .kine-fake-player {
  min-height: 14rem;
  margin: 0;
  padding: 1.5rem;
  border: 1px dashed #d5ddd8;
  border-radius: 10px;
  background: #f7faf8;
  text-align: center;
}
.app-body .scal-free-count {
  color: #6b7c74;
  font-size: .8125rem;
}
.app-body .scal-free-bar {
  display: flex;
  align-items: center;
  gap: .75rem;
}
.app-body .scal-free-bar-title {
  font-size: 1rem;
  font-weight: 650;
}
.app-body .scal-free-bar .btn-icon {
  width: 2.25rem;
  height: 2.25rem;
  min-height: 2.25rem !important;
  padding: 0 !important;
  color: #2f6f52 !important;
  background: #fff !important;
  border: 1px solid #cfe4d8 !important;
}
.app-body .scal-hub .scal-day-free {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.app-body .scal-hub .scal-free-teacher > .card-header {
  padding: 1.1rem 1.25rem;
}
.app-body .scal-hub .scal-free-teacher .card-title {
  font-size: 1.15rem;
}
.app-body .scal-hub .scal-free-teacher > .card-body {
  padding: 1.1rem 1.25rem 1.25rem;
}
.app-body .scal-free-block {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  padding-top: .35rem;
}
.app-body .scal-free-block-title {
  color: #4b5a53;
  font-size: .8125rem;
  font-weight: 650;
}
.app-body .scal-hub .scal-free-block .scal-slots {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin: 0;
}
.app-body .scal-hub .scal-free-block .scal-slot,
.app-body .scal-hub .scal-day-free .scal-slot {
  min-height: 2.6rem;
  padding: .55rem 1rem !important;
  border-radius: 8px !important;
  font-size: .9375rem !important;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
}
.app-body .scal-hub .scal-free-block button.scal-slot {
  color: #3d4a44 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
}
.app-body .scal-hub .scal-free-block button.scal-slot:hover,
.app-body .scal-hub .scal-free-block a.scal-slot:hover {
  color: #1d2730 !important;
  background: #f3f8f5 !important;
  border-color: #3db87a !important;
}

.app-body .scal-modal {
  width: min(36rem, calc(100vw - 2rem)) !important;
  height: min(40rem, calc(100vh - 2.5rem)) !important;
  max-height: min(40rem, calc(100vh - 2.5rem)) !important;
  min-height: min(40rem, calc(100vh - 2.5rem)) !important;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid #e6ebe8 !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 50px rgba(29, 39, 48, .16) !important;
}
.app-body .scal-modal-kicker { display: none !important; }
.app-body .scal-modal-head {
  align-items: center !important;
  padding: .9rem 1.1rem !important;
  background: #fff !important;
  border-bottom: 1px solid #e6ebe8 !important;
}
.app-body .scal-modal-head h3 {
  margin: 0 !important;
  margin-right: .35rem !important;
  color: #1d2730 !important;
  font-size: 1.05rem !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}
.app-body #scal-modal-aside {
  display: flex;
  align-items: center;
  min-width: 0;
}
.app-body .scal-modal-close {
  margin-left: auto;
}
.app-body .sbf-timer {
  font-weight: 600;
}
.app-body .sbf-timer.low {
  color: #9b1c1c !important;
  background: #fff5f5 !important;
}
.app-body .form-label-optional {
  margin-left: .35rem;
  color: #8a9891;
  font-size: .75rem;
  font-weight: 500;
}
.app-body .scal-book-body {
  display: flex;
  flex-direction: column;
}
.app-body .scal-modal-close {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 2.25rem !important;
  height: 2.25rem !important;
  min-height: 2.25rem !important;
  padding: 0 !important;
  color: #3d4a44 !important;
  background: #fff !important;
  border: 1px solid #d5ddd8 !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
}
.app-body .scal-modal-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 1rem 1.15rem 1.25rem !important;
  background: #fff !important;
  overflow: auto;
}
.app-body .scal-modal-body:has(.scal-book-types) {
  overflow: hidden;
}
.app-body .scal-modal-body:has(.scal-book-types) .scal-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.app-body .scal-panel {
  display: block;
  height: auto;
  min-height: 0;
}
.app-body .scal-book-types {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.app-body .scal-book-teachers-pane {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.app-body .scal-book-teachers-pane > .form-label {
  flex: 0 0 auto;
  margin-bottom: .45rem;
}
.app-body .scal-book-toolbar {
  display: flex;
  align-items: center;
  gap: .65rem;
  margin-bottom: 1rem;
}
.app-body .scal-modal [data-panel-back],
.app-body .scal-sheet-back {
  width: 2.25rem;
  height: 2.25rem;
  min-height: 2.25rem !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  color: #2f6f52 !important;
  background: #fff !important;
  border: 1px solid #cfe4d8 !important;
  border-radius: 8px !important;
}
.app-body .scal-book-when {
  margin: 0 0 0 auto;
  color: #6b7c74;
  font-size: .75rem;
  font-weight: 500;
  white-space: nowrap;
}
.app-body .scal-book-body .scal-book-when {
  flex: 1;
  min-width: 0;
  font-size: .6875rem;
  line-height: 1.3;
  white-space: nowrap;
  overflow: visible;
  text-align: right;
}
.app-body .scal-modal .scal-sheet-card {
  margin: 0 0 .75rem;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  box-shadow: none;
}
.app-body .scal-modal .scal-sheet-card > .card-body {
  padding: .9rem 1rem;
}
.app-body .scal-modal .scal-panel-status {
  display: grid;
  grid-template-columns: minmax(9.5rem, 0.95fr) minmax(0, 1.05fr);
  gap: .45rem .7rem;
  margin: 0;
}
.app-body .scal-modal .scal-panel-status dt {
  color: #6b7c74;
  font-size: .75rem;
  font-weight: 600;
}
.app-body .scal-modal .scal-status-hint {
  margin: 0 0 .75rem;
  font-size: .8125rem;
}
.app-body .scal-modal .scal-status-picks {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.app-body .scal-modal .scal-status-pick {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin: 0;
  padding: .85rem 1rem;
  border: 1px solid #e6ebe8;
  border-radius: 12px;
  cursor: pointer;
  background: #fff;
}
.app-body .scal-modal .scal-status-pick:has(input:checked) {
  border-color: #2f6f52;
  background: #f3faf6;
}
.app-body .scal-modal .scal-status-pick input {
  width: 1.15rem;
  height: 1.15rem;
  margin: .2rem 0 0;
  flex-shrink: 0;
  accent-color: #2f6f52;
}
.app-body .scal-modal .scal-status-pick span {
  display: flex;
  flex-direction: column;
  gap: .15rem;
}
.app-body .scal-modal .scal-status-pick b {
  color: #10271f;
  font-size: .9375rem;
  font-weight: 650;
}
.app-body .scal-modal .scal-status-pick small {
  color: #6b7c74;
  font-size: .75rem;
}
.app-body .scal-modal .scal-status-form .scal-sheet-actions {
  margin-top: .85rem;
}
.app-body .scal-modal .scal-panel-status a {
  color: #2f6f52 !important;
  font-weight: 650;
  text-decoration: none;
}
.app-body .scal-modal .scal-panel-status a:hover {
  text-decoration: underline;
}
.app-body .scal-modal .scal-panel-recent {
  margin: 0;
  padding-left: 1.15rem;
}
.app-body .scal-book-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .25rem;
  margin-bottom: 1rem;
}
.app-body .scal-book-type-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.app-body .scal-book-teacher-list {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: .65rem;
  min-height: 0;
  max-height: none !important;
  margin-bottom: 0;
  padding: .65rem;
  overflow: auto !important;
  border: 1px solid #3db87a;
  border-radius: 10px;
  background: #fff;
}
.app-body .scal-book-unassigned-slot {
  flex: 0 0 auto;
  margin-top: .85rem;
}
.app-body .scal-finder-list {
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.app-body .scal-finder-hit {
  cursor: default;
}
.app-body .scal-finder-book {
  margin-top: .65rem;
}
.app-body .scal-book-teacher-item { margin: 0; }
.app-body .scal-book-teacher-card,
.app-body .scal-book-unassigned-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .15rem;
  width: 100%;
  padding: .9rem 1rem !important;
  text-align: left;
  text-decoration: none !important;
  color: #1d2730 !important;
  background: #fff !important;
  border: 1px solid #3db87a !important;
  border-radius: 10px !important;
  cursor: pointer;
}
.app-body .scal-book-teacher-card:hover {
  background: #f3f8f5 !important;
}
.app-body .scal-book-kv {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  width: 100%;
}
.app-body .scal-book-k {
  flex: 0 0 8.4rem;
  color: #6b7c74;
  font-size: .75rem;
  font-weight: 600;
}
.app-body .scal-book-v {
  min-width: 0;
  font-size: .9375rem;
  font-weight: 650;
}
.app-body .scal-book-teacher-plain .scal-book-teacher-name { font-size: .95rem; font-weight: 650; }
.app-body .scal-book-teacher-plain .scal-book-teacher-time { color: #6b7c74; font-size: .8125rem; }
.app-body .scal-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.app-body .sbf-timer.low {
  color: #9b1c1c;
  background: #fff5f5;
}
.app-body .scal-modal .sbf-form.card,
.app-body .scal-modal form.card,
.app-body .scal-modal .card.sbf-form {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.app-body .scal-book-body .form-control,
.app-body .scal-book-body .form-select {
  min-height: 2.75rem !important;
  height: auto !important;
  padding: .7rem .9rem !important;
  font-size: .9375rem !important;
  border-radius: 10px !important;
  line-height: 1.35;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.app-body .scal-book-body .form-control:hover,
.app-body .scal-book-body .form-select:hover,
.app-body .scal-modal .tcab-people .form-control:hover {
  border-color: #3db87a !important;
}
.app-body .scal-book-body .form-control:focus,
.app-body .scal-book-body .form-select:focus,
.app-body .scal-modal .tcab-people .form-control:focus {
  border-color: #3db87a !important;
  box-shadow: 0 0 0 3px rgba(61, 184, 122, .18) !important;
  outline: none;
}
.app-body .scal-book-body .lnf-phone-input.form-control,
.app-body .scal-modal .lnf-phone-input.form-control {
  padding-left: 3.75rem !important;
}
.app-body .scal-book-body textarea.form-control {
  min-height: 7.5rem !important;
}
.app-body .sbf-student-search {
  position: relative;
}
.app-body .sbf-people-list {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  max-height: 12.5rem;
  overflow-y: auto;
  margin: .45rem 0 0;
  padding: .35rem;
  border: 1px solid #d7e6dc;
  border-radius: 10px;
  background: #f7fbf8;
}
.app-body .sbf-person {
  display: block;
  width: 100%;
  margin: 0;
  padding: .55rem .75rem;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #1d2730;
  font-size: .875rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
}
.app-body .sbf-person:hover,
.app-body .sbf-person:focus-visible {
  background: #e8f6ee;
}
.app-body .sbf-student-tabs {
  display: inline-flex !important;
  flex-wrap: nowrap;
  width: fit-content;
  max-width: 100%;
  gap: .35rem;
  margin: 0 0 1rem;
  padding: .25rem;
  background: #e8f6ee;
  border-radius: 10px;
}
.app-body .sbf-student-tabs .btn {
  min-height: 36px;
  height: 36px;
  padding: 0 .9rem;
  border-radius: 8px !important;
  white-space: nowrap;
}
.app-body .sbf-actions {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start !important;
  gap: .4rem;
  margin-top: 1rem;
}
.app-body .sbf-actions .sbf-cancel-form,
.app-body .sbf-actions .inline-form {
  display: contents;
}
.app-body .sbf-actions .btn,
.app-body .sbf-actions .btn.j,
.app-body .sbf-actions .btn.ghost {
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 .9rem !important;
  border-radius: 8px !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}
.app-body .sbf-actions .btn-outline-secondary {
  color: #2f6f52 !important;
  background: #fff !important;
  border-color: #cfe4d8 !important;
}
.app-body .sbf-actions .btn-primary {
  color: #fff !important;
  background: #3db87a !important;
  border-color: #3db87a !important;
}

@media (max-width: 991.98px) {
  .app-body .scal-hub .scal-month td,
  .app-body .scal-month td {
    height: 88px !important;
    border-radius: 12px !important;
  }
}