.information-content { padding: 24px; height: 100%; overflow-y: auto; box-sizing: border-box; }
.information-content h1 { font-size: 22px; overflow-wrap: anywhere; }
.information-form { display: grid; gap: 16px; }
.information-form > label { display: grid; gap: 6px; font-weight: 600; }
.information-form input[type=text], .information-form textarea { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #b9c9bf; border-radius: 6px; font: inherit; }
.information-form textarea { resize: vertical; }
.information-form fieldset { display: grid; gap: 10px; border: 1px solid #b9c9bf; border-radius: 8px; padding: 14px; }
.information-choice { display: flex; align-items: center; gap: 8px; }
.information-choice input { width: 18px; height: 18px; }
.information-staff-list { max-height: 250px; overflow: auto; }
.information-staff-list .information-choice { padding: 6px 0; }
.information-form button, .information-download { padding: 10px 16px; border: 1px solid #83b994; border-radius: 6px; background: #f0f8f2; cursor: pointer; font: inherit; }
.information-form .information-send { background: #277b42; color: white; justify-self: end; min-width: 110px; }
.information-form button:disabled { opacity: .5; cursor: wait; }
.information-memo { white-space: pre-wrap; overflow-wrap: anywhere; }
.information-file-names { overflow-wrap: anywhere; margin: 0; }
.information-download { display: block; margin: 8px 0; overflow-wrap: anywhere; max-width: 100%; }
.notice-row.information-row { grid-template-columns: 160px minmax(0, 1fr) 30px; gap: 8px; width: 100%; text-align: left; cursor: pointer; padding: 8px 10px; }
.information-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.information-row:hover, .information-row:focus-visible { background: #eff8f1; }
.information-card .pager button:disabled { opacity: .35; cursor: default; }
@media (max-width: 840px) {
  .notice-row.information-row { grid-template-columns: max-content minmax(0, 1fr) auto; align-items: center; }
  .information-row span:first-child { grid-column: 1; grid-row: 1; }
  .information-row span:nth-child(2) { grid-column: 2; grid-row: 1; }
  .information-row img { grid-column: 3; grid-row: 1; }
  .information-content { padding: 16px; }
}
.notice-row.information-row { display: grid; border: 1px solid #cbd8ce; border-radius: 7px; background: white; font: inherit; }
.information-row img { width: 26px; height: auto; }
.information-content select { font: inherit; padding: 8px; border: 1px solid #b9c9bf; border-radius: 6px; margin-left: 8px; max-width: 100%; }
.information-content .information-choice { margin: 8px 0; }
.information-page-status { display: block; text-align: right; font-size: 12px; color: #58675e; margin-top: 8px; }
.information-card .notice-list { max-height: none; overflow-y: visible; }
.auth-account + button { padding: 10px; font: inherit; cursor: pointer; }

.information-read-status { margin-top: 20px; border-top: 1px solid #ccd5dc; padding-top: 12px; }
.information-read-status summary { cursor: pointer; font-weight: 700; }
.information-read-status > div { overflow-x: auto; }
.information-read-status table { width: 100%; border-collapse: collapse; font-size: 14px; }
.information-read-status th, .information-read-status td { padding: 8px; text-align: left; border-bottom: 1px solid #dde3e8; }
.information-read-status td:last-child { white-space: nowrap; }

@media (max-width: 840px) {
  .information-card { container-type: inline-size; }
  .information-card .panel-heading {
    grid-template-columns: minmax(0, 1fr) clamp(76px, 22cqw, 101px) auto;
    gap: 6px;
  }
  .information-card .panel-title {
    grid-column: 1;
    min-width: 0;
    gap: 4px;
  }
  .information-card .panel-title img {
    width: clamp(22px, 6cqw, 32px);
    height: auto;
    flex-shrink: 0;
  }
  .information-card .panel-title h1 {
    font-size: clamp(12px, 4.4cqw, 25px);
    white-space: nowrap;
  }
  .information-card .create-button { grid-column: 2; width: 100%; }
  .information-card .pager { grid-column: 3; gap: 6px; }
  .information-card .pager .image-button { width: 28px; height: 28px; }
}

.information-thread-message { padding: 12px; border: 1px solid #cbd8ce; border-radius: 7px; margin-bottom: 12px; background: #fff; }
.information-reply-tree { list-style: none; padding: 0 0 0 12px; margin: 0; border-left: 2px solid #83b994; }
.information-reply-tree > li { position: relative; }
.information-reply-tree > li::before { content: ''; position: absolute; top: 22px; left: -12px; width: 12px; border-top: 2px solid #83b994; }
.information-reply-context { font-size: 12px; color: #58675e; }
.information-reply-form { margin-top: 12px; }
.information-reply-button { font: inherit; padding: 7px 16px; border: 1px solid #83b994; border-radius: 6px; background: #f0f8f2; cursor: pointer; }

@media (max-width: 840px) {
  /* Place INFO detail between its list and Today's without changing desktop columns. */
  .admin-layout:has(> .detail-panel > .information-content) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
  }
  .admin-layout:has(> .detail-panel > .information-content) > .dashboard-stack {
    display: contents;
  }
  .admin-layout:has(> .detail-panel > .information-content) .schedule-card { order: 1; }
  .admin-layout:has(> .detail-panel > .information-content) .information-card { order: 2; }
  .admin-layout:has(> .detail-panel > .information-content) > .detail-panel {
    order: 3;
    grid-column: 1;
    height: auto;
    margin: 0;
  }
  .admin-layout:has(> .detail-panel > .information-content) .students-card { order: 4; }
  .students-card .student-row-empty {
    display: block;
    white-space: nowrap;
  }
}

.information-visibility-button { margin: 8px 0; padding: 7px 12px; font: inherit; border: 1px solid #83b994; border-radius: 6px; background: #f0f8f2; color: #234d30; cursor: pointer; }
.information-visibility-button:disabled { opacity: .5; cursor: wait; }