/* Centered adaptive card distribution for the authenticated dashboard. */

.dashboard-page {
  overflow-x: clip !important;
  overflow-y: auto !important;
}

.dashboard-page[data-dashboard-page-fit="true"] {
  overflow-y: hidden !important;
}

.dashboard-page .page-shell {
  height: auto !important;
  min-height: calc(100dvh - 8rem);
  overflow: visible !important;
}

.dashboard-page[data-dashboard-page-fit="true"] .page-shell {
  min-height: 0;
}

.dashboard-page .site-footer {
  display: block !important;
}

.dashboard-page .teachflow-dashboard {
  height: auto !important;
  min-height: 0;
  grid-template-rows: auto auto !important;
  align-content: start;
}

.teachflow-dashboard__dynamic-grid {
  --dashboard-card-padding: clamp(0.85rem, 1.5vw, 1.25rem);
  --dashboard-card-gap: clamp(0.55rem, 1vw, 0.9rem);
  --dashboard-item-padding: clamp(0.45rem, 0.8vw, 0.72rem);
  --dashboard-column-gap: clamp(0.65rem, 1vw, 1rem);
  --dashboard-row-gap: clamp(0.42rem, 0.7vw, 0.68rem);
  --dashboard-row-unit: 1px;

  width: min(100%, 78rem);
  min-width: 0;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: var(--dashboard-row-unit);
  grid-auto-flow: row dense;
  justify-content: center;
  align-items: start;
  column-gap: var(--dashboard-column-gap);
  row-gap: var(--dashboard-row-gap);
}

.teachflow-dashboard__dynamic-grid[data-dashboard-measuring="true"] {
  grid-auto-rows: auto;
  grid-auto-flow: row dense;
}

.dashboard-dynamic-card {
  min-width: 0;
  align-self: start;
  grid-column: var(--dashboard-card-column-start, auto) / span
    var(--dashboard-card-columns, 4);
  grid-row: var(--dashboard-card-row-start, auto) / span
    var(--dashboard-card-rows, 1);
  container-name: dashboard-card;
  container-type: inline-size;
}

.teachflow-dashboard__dynamic-grid[data-dashboard-measuring="true"]
  .dashboard-dynamic-card,
.teachflow-dashboard__dynamic-grid[data-dashboard-layout-ready="false"]
  .dashboard-dynamic-card {
  grid-column: span var(--dashboard-card-columns, 4);
  grid-row: auto;
}

.dashboard-dynamic-card[data-dashboard-card="current-day"] {
  --dashboard-card-columns: 4;
}

.dashboard-dynamic-card[data-dashboard-card="next-day"] {
  --dashboard-card-columns: 5;
}

.dashboard-dynamic-card[data-dashboard-card="quote"] {
  --dashboard-card-columns: 3;
}

.dashboard-dynamic-card[data-dashboard-card="appointments"] {
  --dashboard-card-columns: 5;
}

.dashboard-dynamic-card[data-dashboard-card="exams"] {
  --dashboard-card-columns: 7;
}

.teachflow-dashboard__dynamic-grid .dashboard-day-card,
.teachflow-dashboard__dynamic-grid .dashboard-panel,
.teachflow-dashboard__dynamic-grid .dashboard-quote-card {
  width: 100%;
  height: auto;
  min-height: 0;
  padding: var(--dashboard-card-padding);
  gap: var(--dashboard-card-gap);
  overflow: visible;
}

.teachflow-dashboard__dynamic-grid .dashboard-panel {
  grid-template-rows: auto auto;
  align-content: start;
}

.teachflow-dashboard__dynamic-grid .dashboard-week-list,
.teachflow-dashboard__dynamic-grid .dashboard-exam-list {
  max-height: none;
  overflow: visible;
}

.teachflow-dashboard__dynamic-grid .dashboard-agenda__item,
.teachflow-dashboard__dynamic-grid .dashboard-week-list__item,
.teachflow-dashboard__dynamic-grid .dashboard-exam-list__item {
  min-height: 0;
  padding: var(--dashboard-item-padding);
}

.teachflow-dashboard__dynamic-grid .dashboard-quote-card {
  display: grid !important;
  align-content: space-between;
}

.teachflow-dashboard__dynamic-grid .dashboard-quote-card[hidden] {
  display: none !important;
}

.teachflow-dashboard__dynamic-grid[data-dashboard-density="compact"] {
  --dashboard-card-padding: clamp(0.72rem, 1.15vw, 1rem);
  --dashboard-card-gap: clamp(0.42rem, 0.7vw, 0.7rem);
  --dashboard-item-padding: clamp(0.36rem, 0.6vw, 0.56rem);
  --dashboard-column-gap: clamp(0.5rem, 0.8vw, 0.75rem);
  --dashboard-row-gap: clamp(0.32rem, 0.55vw, 0.5rem);
}

.teachflow-dashboard__dynamic-grid[data-dashboard-density="tight"] {
  --dashboard-card-padding: clamp(0.58rem, 0.9vw, 0.82rem);
  --dashboard-card-gap: clamp(0.3rem, 0.55vw, 0.55rem);
  --dashboard-item-padding: clamp(0.28rem, 0.48vw, 0.44rem);
  --dashboard-column-gap: clamp(0.38rem, 0.65vw, 0.58rem);
  --dashboard-row-gap: clamp(0.24rem, 0.42vw, 0.4rem);
}

.teachflow-dashboard__dynamic-grid[data-dashboard-density="compact"]
  .dashboard-agenda,
.teachflow-dashboard__dynamic-grid[data-dashboard-density="compact"]
  .dashboard-week-list,
.teachflow-dashboard__dynamic-grid[data-dashboard-density="compact"]
  .dashboard-exam-list {
  gap: 0.32rem;
}

.teachflow-dashboard__dynamic-grid[data-dashboard-density="tight"]
  .dashboard-agenda,
.teachflow-dashboard__dynamic-grid[data-dashboard-density="tight"]
  .dashboard-week-list,
.teachflow-dashboard__dynamic-grid[data-dashboard-density="tight"]
  .dashboard-exam-list {
  gap: 0.22rem;
}

.teachflow-dashboard__dynamic-grid[data-dashboard-density="tight"]
  .dashboard-quote-card__mark {
  font-size: 7rem;
}

.dashboard-dynamic-card .teachflow-dashboard__eyebrow {
  font-size: clamp(0.58rem, 2.1cqi, 0.72rem);
}

.dashboard-dynamic-card .dashboard-card-heading h2 {
  font-size: clamp(1.02rem, 5cqi, 1.55rem);
}

.dashboard-dynamic-card .dashboard-card-heading time,
.dashboard-dynamic-card .dashboard-card-heading p,
.dashboard-dynamic-card .dashboard-card-heading--panel > a {
  font-size: clamp(0.62rem, 2.2cqi, 0.8rem);
}

.dashboard-dynamic-card .dashboard-agenda__content strong,
.dashboard-dynamic-card .dashboard-week-list__content strong,
.dashboard-dynamic-card .dashboard-exam-list__content strong {
  font-size: clamp(0.68rem, 2.7cqi, 0.84rem);
}

.dashboard-dynamic-card .dashboard-agenda__content span,
.dashboard-dynamic-card .dashboard-agenda__location,
.dashboard-dynamic-card .dashboard-week-list__content span,
.dashboard-dynamic-card .dashboard-week-list__meta span,
.dashboard-dynamic-card .dashboard-exam-list__content span,
.dashboard-dynamic-card .dashboard-exam-list__date span {
  font-size: clamp(0.56rem, 2.2cqi, 0.72rem);
}

.dashboard-dynamic-card .dashboard-agenda__time,
.dashboard-dynamic-card .dashboard-week-list__date,
.dashboard-dynamic-card .dashboard-week-list__meta strong,
.dashboard-dynamic-card .dashboard-exam-list__date strong {
  font-size: clamp(0.6rem, 2.35cqi, 0.76rem);
}

.dashboard-dynamic-card.dashboard-quote-card h2 {
  font-size: clamp(0.92rem, 4.5cqi, 1.25rem);
}

.dashboard-dynamic-card.dashboard-quote-card blockquote {
  font-size: clamp(0.82rem, 4.3cqi, 1.35rem);
  line-height: 1.38;
}

.dashboard-dynamic-card.dashboard-quote-card__source,
.dashboard-dynamic-card .dashboard-quote-card__source {
  font-size: clamp(0.56rem, 2cqi, 0.7rem);
}

@container dashboard-card (max-width: 25rem) {
  .dashboard-card-heading {
    gap: 0.5rem;
  }

  .dashboard-day-card__counts {
    gap: 0.08rem;
  }

  .dashboard-agenda__item {
    grid-template-columns: auto auto minmax(0, 1fr);
  }

  .dashboard-agenda__location {
    grid-column: 3;
    max-width: none;
    justify-self: start;
  }

  .dashboard-week-list__item {
    grid-template-columns: minmax(4.2rem, auto) minmax(0, 1fr);
  }

  .dashboard-week-list__meta {
    grid-column: 2;
    justify-self: start;
    text-align: left;
  }

  .dashboard-exam-list__item {
    grid-template-columns: auto minmax(5.6rem, auto) minmax(0, 1fr);
  }

  .dashboard-exam-list__arrow {
    display: none;
  }
}

@container dashboard-card (max-width: 20rem) {
  .dashboard-card-heading {
    display: grid;
  }

  .dashboard-day-card__counts {
    justify-self: start;
    grid-template-columns: repeat(2, auto);
    text-align: left;
  }

  .dashboard-card-heading--panel > a {
    justify-self: start;
  }

  .dashboard-agenda__item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .dashboard-agenda__kind {
    display: none;
  }

  .dashboard-agenda__content,
  .dashboard-agenda__location {
    grid-column: 2;
  }

  .dashboard-exam-list__item {
    grid-template-columns: minmax(5.4rem, auto) minmax(0, 1fr);
  }

  .dashboard-exam-list__number {
    display: none;
  }
}

@media (max-width: 88rem) {
  .teachflow-dashboard__dynamic-grid {
    width: min(100%, 72rem);
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
}

@media (max-width: 64rem) {
  .teachflow-dashboard__dynamic-grid {
    width: min(100%, 58rem);
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
}

@media (max-width: 44rem) {
  .dashboard-page,
  .dashboard-page[data-dashboard-page-fit="true"] {
    overflow-y: auto !important;
  }

  .dashboard-page .page-shell,
  .dashboard-page[data-dashboard-page-fit="true"] .page-shell {
    min-height: 0;
  }

  .teachflow-dashboard__dynamic-grid {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
    grid-auto-flow: row;
  }

  .teachflow-dashboard__dynamic-grid .dashboard-dynamic-card {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  .teachflow-dashboard__dynamic-grid .dashboard-quote-card[hidden] {
    display: grid !important;
  }

  .teachflow-dashboard__dynamic-grid .dashboard-card-heading--panel > a,
  .teachflow-dashboard__dynamic-grid .dashboard-card-heading--panel p {
    display: initial;
  }

  .teachflow-dashboard__dynamic-grid .dashboard-week-list,
  .teachflow-dashboard__dynamic-grid .dashboard-exam-list {
    max-height: none;
    overflow: visible;
  }
}

@media (prefers-reduced-motion: reduce) {
  .teachflow-dashboard__dynamic-grid .dashboard-agenda__item,
  .teachflow-dashboard__dynamic-grid .dashboard-week-list__item,
  .teachflow-dashboard__dynamic-grid .dashboard-exam-list__item {
    transition: none;
  }
}
