/* Grid study page (administrable/application_fee_grids) ------------------- */
.admin-grid__note {
  max-width: 64rem;
  margin: 0 0 var(--spacing-md);
  color: var(--text-secondary);
  font-size: var(--font-sm);
}

.admin-grid__strips {
  display: grid;
  gap: 1px;
  margin-bottom: var(--spacing-lg);
  background: var(--color-border-neutral);
  border: 1px solid var(--color-border-neutral);
  border-radius: var(--rounded-xs);
  overflow: hidden;
}

.admin-grid__strip {
  display: grid;
  grid-template-columns: 11rem 1fr;
  background: #fff;
}

.admin-grid__strip-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: var(--spacing-xs) var(--spacing-sm);
  border-right: 1px solid var(--color-border-neutral);
  color: var(--text-secondary);
  font-size: 12px;
}

.admin-grid__strip-head strong {
  color: var(--text-primary);
  font-family: var(--font-family-bricolage);
  font-size: var(--font-md);
}

.admin-grid__cells {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-3xs);
  padding: var(--spacing-3xs);
}

.admin-grid__cell {
  display: flex;
  flex: 1 1 8.5rem;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-width: 8.5rem;
  padding: var(--spacing-2xs) var(--spacing-3xs);
  border-radius: var(--rounded-3xs);
  font-size: 12px;
  text-align: center;
}

.admin-grid__cell--open { background: #eaf4e5; }
.admin-grid__cell--closed { background: #ece9f6; outline: 2px solid #4a3aa7; outline-offset: -2px; }
.admin-grid__cell--later { background: #fff; outline: 1px dashed #b6bab4; outline-offset: -2px; opacity: 0.8; }

.admin-grid__ask {
  font-size: var(--font-md);
  font-weight: var(--font-weight-semibold);
  font-variant-numeric: tabular-nums;
}

.admin-grid__share { color: #4a3aa7; }
.admin-grid__cell--closed .admin-grid__state { color: #4a3aa7; }

.admin-grid__state {
  color: var(--text-secondary);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.admin-grid__acceptance {
  margin-top: var(--spacing-4xs);
  font-size: var(--font-md);
}

.admin-grid__detail {
  color: var(--text-secondary);
  font-size: 11px;
}

.admin-grid__detail--todo {
  margin-top: var(--spacing-4xs);
  font-style: italic;
}

.admin-grid__curves {
  position: relative;
  margin: 0;
}

.admin-grid__curves svg {
  display: block;
  width: 100%;
}

.admin-grid__axis-title {
  fill: #656965;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-grid__curves .admin-chart__tooltip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 12px;
}

.admin-grid__heat {
  border-collapse: separate;
  border-spacing: 3px;
  font-size: 12px;
}

.admin-grid__heat th {
  padding: var(--spacing-4xs) var(--spacing-3xs);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: var(--font-weight-medium);
  text-align: center;
  white-space: nowrap;
}

.admin-grid__heat th[scope="row"] {
  min-width: 8rem;
  text-align: left;
}

.admin-grid__heat th[scope="row"] strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--font-sm);
}

.admin-grid__heat td {
  padding: 0;
}

.admin-grid__heat-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  min-width: 5.5rem;
  min-height: 3.6rem;
  padding: var(--spacing-3xs);
  border-radius: var(--rounded-3xs);
  font-variant-numeric: tabular-nums;
}

.admin-grid__heat-cell strong { font-size: var(--font-sm); }
.admin-grid__heat-cell span { font-size: 11px; opacity: 0.85; }
.admin-grid__heat-cell--thin { outline: 1px dashed #656965; outline-offset: -2px; }
.admin-grid__heat-cell--planned { box-shadow: inset 0 0 0 2px #008300; }
.admin-grid__heat-cell--empty { color: #008300; background: #fff; }
.admin-grid__heat-cell--none { background: #f4f5f2; }

@media (max-width: 720px) {
  .admin-grid__strip { grid-template-columns: 1fr; }
  .admin-grid__strip-head { flex-direction: row; flex-wrap: wrap; gap: var(--spacing-2xs); border-right: 0; border-bottom: 1px solid var(--color-border-neutral); }
}

.admin-grid__curves .admin-chart__tooltip[hidden] {
  display: none;
}
