/* JFK MUN portal: a compact school web portal with restrained 2010-era styling. */
.portal-body {
  --portal-blue: #20578e;
  --portal-blue-dark: #153d68;
  --portal-border: #c9d5e2;
  --portal-muted: #596b7e;
  --portal-panel: #eef3f8;
  background: #f3f5f7;
  color: #243548;
  font-family: var(--serif-body);
  line-height: 1.55;
}
.portal-body *, .portal-body *::before, .portal-body *::after { box-sizing: border-box; }
.portal-body [hidden] { display: none !important; }
.portal-body h1, .portal-body h2, .portal-body h3 { font-family: var(--serif-display); color: #172b43; line-height: 1.2; }
.portal-body h1 { font-size: clamp(2.2rem, 4vw, 3rem); }
.portal-body h2 { font-size: 1.5rem; }
.portal-body h3 { font-size: 1.25rem; }
.portal-body p { line-height: 1.55; }
.portal-body button, .portal-body input, .portal-body select, .portal-body textarea { font: inherit; }
.portal-body button { cursor: pointer; }
.portal-body a { color: var(--portal-blue); }
.portal-body .eyebrow, .portal-body .summary-grid { display: none; }
.portal-body .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.portal-body .portal-shell { max-width: 1100px; margin: 0 auto; padding: 104px 28px 72px; min-height: 70vh; }
.portal-body .portal-notice { background: #e8f1fa; border: 1px solid #aac5dd; border-left: 4px solid var(--portal-blue); color: #193e64; padding: 10px 14px; margin: 0 0 22px; }
.portal-body .portal-notice.error { background: #fff1ed; border-color: #e5b8aa; border-left-color: #a53f2a; color: #7b2b1f; }
.portal-body .page-lead { display: flex; align-items: end; justify-content: space-between; gap: 20px;  padding: 0 0 17px; margin-bottom: 0px; }
.portal-body .page-lead h1 { margin: 0 0 4px; }
.portal-body .page-lead p { color: var(--portal-muted); margin: 0; }
.portal-body .section-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin: 28px 0 12px; }
.portal-body .section-heading h2 { margin: 0; }
.portal-body .section-heading p { color: var(--portal-muted); font-size: .92rem; margin: 0; }
.portal-body .muted, .portal-body .field-help { color: var(--portal-muted); font-size: .92rem; }
.portal-body .field-help { font-weight: normal; }
.portal-body .conference-filters { display: flex; gap: 4px; border-bottom: 1px solid #9fb7ce; margin: 6px 0 16px; }
.portal-body .conference-filters button { background: #e7edf3; border: 1px solid #afc1d1; border-bottom: 0; border-radius: 3px 3px 0 0; padding: 8px 15px; color: #344d66; font-size: .95rem; }
.portal-body .conference-filters button[aria-pressed="true"] { background: #fff; color: var(--portal-blue-dark); font-weight: 700; position: relative; top: 1px; }
.portal-body .conference-filters button span { font-size: .82rem; margin-left: 5px; color: var(--portal-muted); }
.portal-body .search-field { display: block; position: relative; max-width: 360px; margin: 0 0 18px; }
.portal-body .search-field input { display: block; width: 100%; height: 38px; background: #fff; color: #243548; border: 1px solid #9db1c4; border-radius: 2px; padding: 7px 12px 7px 34px; font-size: .94rem; }
.portal-body .search-field input:focus { outline: 2px solid #8db5dc; outline-offset: 1px; }
.portal-body .search-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-52%); color: #57718b; line-height: 1; font: 22px Arial, sans-serif; pointer-events: none; }
.portal-body .conference-grid { background: #fff; border: 1px solid var(--portal-border); border-top: 3px solid var(--portal-blue); }
.portal-body .conference-card { padding: 18px 21px 16px; border-bottom: 1px solid #d7e0e8; background: #fff; }
.portal-body .conference-card:nth-child(even) { background: #f9fbfd; }
.portal-body .conference-card:last-child { border-bottom: 0; }
.portal-body .conference-card:hover { background: #f0f5fa; }
.portal-body .conference-top { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; margin-bottom: 4px; }
.portal-body .conference-top h3 { margin: 0; }
.portal-body .conference-card p { color: #4c5f73; margin: 0 0 8px; max-width: 780px; }
.portal-body .conference-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; color: var(--portal-muted); font-size: .86rem; margin-top: 7px; }
.portal-body .conference-footer button { border: 0; background: none; color: var(--portal-blue); padding: 0; text-decoration: underline; font-weight: 600; }
.portal-body .conference-footer button:hover { color: var(--portal-blue-dark); }
.portal-body .status { color: #455b70; font-size: .82rem; font-weight: 700; white-space: nowrap; }
.portal-body .status::before { content: '■'; font: 8px Arial, sans-serif; margin-right: 7px; vertical-align: 1px; }
.portal-body .status.open::before, .portal-body .status.assigned::before { color: #378059; }
.portal-body .status.submitted::before { color: #477da9; }
.portal-body .status.pending::before, .portal-body .status.closed::before { color: #8794a0; }
.portal-body .meta-row { display: flex; flex-wrap: wrap; gap: 0; color: var(--portal-muted); font-size: .86rem; }
.portal-body .meta-chip + .meta-chip::before { content: ' · '; white-space: pre; color: #7d8c9a; }
.portal-body .empty-state { padding: 35px 22px; text-align: center; color: var(--portal-muted); }
.portal-body .empty-state strong { display: block; color: #243548; font-size: 1.08rem; }
.portal-body .empty-state p { margin: 5px 0 0; }
.portal-body .back-button, .portal-body .link-button { border: 0; background: none; color: var(--portal-blue); text-decoration: underline; padding: 0; }
.portal-body .back-button { display: inline-block; margin-bottom: 21px; }
.portal-body .detail-header { border-bottom: 2px solid var(--portal-blue); padding: 0 0 17px; margin-bottom: 20px; }
.portal-body .detail-header h1 { margin: 9px 0 6px; }
.portal-body .detail-header p { color: var(--portal-muted); white-space: pre-wrap; margin: 0 0 12px; }
.portal-body .detail-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(260px, 1fr); gap: 18px; align-items: start; }
.portal-body .detail-grid > div, .portal-body .detail-grid aside { min-width: 0; }
.portal-body .surface, .portal-body .contact-panel { background: #fff; border: 1px solid var(--portal-border); border-radius: 2px; margin-bottom: 17px; }
.portal-body .surface { padding: 17px 19px 19px; }
.portal-body .surface h2 { font-size: 1.3rem; background: var(--portal-panel); border-bottom: 1px solid var(--portal-border); margin: -17px -19px 14px; padding: 10px 18px; }
.portal-body .surface > p:last-child { margin-bottom: 0; }
.portal-body .contact-panel { padding: 0; margin: 0 0 25px; }
.portal-body .contact-panel > summary { cursor: pointer; list-style: none; display: block; background: var(--portal-panel); padding: 10px 14px; font-weight: 700; }
.portal-body .contact-panel > summary::-webkit-details-marker, .portal-body .edit-details > summary::-webkit-details-marker { display: none; }
.portal-body .contact-panel > summary::before { content: '▸'; color: var(--portal-blue); margin-right: 8px; }
.portal-body .contact-panel[open] > summary::before { content: '▾'; }
.portal-body .contact-panel > summary span { color: var(--portal-muted); font-size: .87rem; font-weight: 400; margin-left: 7px; }
.portal-body .contact-form { padding: 16px; display: grid; gap: 13px; }
.portal-body .contact-form p { margin: 0; }
.portal-body .contact-form button { justify-self: start; }
.portal-body .two-col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.portal-body .form-grid { display: grid; gap: 14px; }
.portal-body .form-grid label, .portal-body .contact-form label, .portal-body .auth-card label, .portal-body .assignment-form label { display: grid; gap: 5px; font-weight: 600; font-size: .92rem; }
.portal-body input:not([type="checkbox"]), .portal-body select, .portal-body textarea { border: 1px solid #9fb0bf; border-radius: 2px; background: #fff; color: #243548; padding: 8px 9px; min-width: 0; width: 100%; }
.portal-body textarea { min-height: 85px; resize: vertical; }
.portal-body input:focus, .portal-body select:focus, .portal-body textarea:focus { outline: 2px solid #93bce2; outline-offset: 1px; }
.portal-body .primary-button, .portal-body .outline-button, .portal-body .google-button { border: 1px solid #164577; border-radius: 2px; padding: 8px 13px; background: linear-gradient(#3a78b3, #20578e); color: #fff; font-size: .92rem; font-weight: 600; line-height: 1.35; }
.portal-body .primary-button:hover, .portal-body .outline-button:hover, .portal-body .google-button:hover { background: #245f99; }
.portal-body .primary-button:disabled { opacity: .55; cursor: wait; }
.portal-body .outline-button, .portal-body .google-button { background: linear-gradient(#fff, #e8eef4); color: #1d4f7e; border-color: #98aec2; }
.portal-body .outline-button:hover, .portal-body .google-button:hover { background: #e9f2fa; color: #153d68; }
.portal-body .google-button { display: flex; justify-content: center; align-items: center; gap: 9px; width: 100%; }
.portal-body .auth-layout { max-width: 430px; margin: 30px auto; }
.portal-body .auth-card { padding: 20px; }
.portal-body .auth-card h2 { margin: 0 0 7px; font-size: 1.65rem; background: none; border: 0; padding: 0; }
.portal-body .auth-card > p { color: var(--portal-muted); margin: 0 0 19px; }
.portal-body .auth-card form { display: grid; gap: 12px; }
.portal-body .auth-actions { display: flex; gap: 9px; }
.portal-body .auth-actions button { flex: 1; }
.portal-body .auth-card .link-button { margin-top: 13px; }
.portal-body .divider { display: flex; align-items: center; gap: 10px; margin: 16px 0; color: var(--portal-muted); font-size: .85rem; }
.portal-body .divider::before, .portal-body .divider::after { content: ''; flex: 1; height: 1px; background: var(--portal-border); }
.portal-body .answer-block, .portal-body .assignment-item { border-top: 1px solid #d9e1e9; padding: 10px 0; }
.portal-body .answer-block:first-child, .portal-body .assignment-item:first-child { border: 0; }
.portal-body .answer-block strong, .portal-body .assignment-item strong { display: block; }
.portal-body .answer-block p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 2px 0 0; }
.portal-body .assignment-item small { display: block; color: var(--portal-muted); }
.portal-body .resource-list { list-style: none; padding: 0; margin: 0; }
.portal-body .resource-list li + li { border-top: 1px solid #d9e1e9; }
.portal-body .resource-list a { display: block; padding: 8px 0; text-decoration: underline; overflow-wrap: anywhere; }
.portal-body .resource-list a span { font-family: Arial, sans-serif; font-size: .8em; }
.portal-body .panel-toolbar { display: flex; justify-content: space-between; align-items: start; gap: 15px; }
.portal-body .panel-toolbar h2 { margin: -17px 0 12px -19px; }
.portal-body .panel-toolbar > button { white-space: nowrap; }
.portal-body .application-row { border-top: 1px solid #d9e1e9; }
.portal-body .application-row > summary { display: flex; gap: 15px; align-items: center; cursor: pointer; padding: 10px 0; list-style: none; }
.portal-body .application-row > summary::-webkit-details-marker { display: none; }
.portal-body .application-row > summary::before { content: '▸'; color: var(--portal-blue); }
.portal-body .application-row[open] > summary::before { content: '▾'; }
.portal-body .application-row > summary strong, .portal-body .application-row > summary small { display: block; }
.portal-body .application-row > summary small, .portal-body .application-summary, .portal-body .app-contact { color: var(--portal-muted); font-size: .85rem; }
.portal-body .application-summary { margin-left: auto; max-width: 170px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-body .application-body { border-left: 2px solid #b5cce0; padding: 0 0 15px 15px; margin-left: 6px; }
.portal-body .application-body .answer-block { border: 0; padding: 7px 0; }
.portal-body .assignment-form { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 8px; margin-top: 10px; }
.portal-body .member-confirmed { color: #2d6a46; font-weight: 600; }
.portal-body .member-add-inline { margin: 7px 0; }
.portal-body .member-row { position: relative; padding-right: 80px; }
.portal-body .member-row .danger-button { position: absolute; right: 0; top: 11px; }
.portal-body .danger-button { border: 0; background: none; color: #91413a; text-decoration: underline; padding: 0; }
.portal-body #add-conference-member { border-top: 1px solid #d9e1e9; padding-top: 14px; margin-top: 10px; }
.portal-body #add-conference-member button { justify-self: start; }
.portal-body .edit-details > summary { cursor: pointer; color: var(--portal-blue); text-decoration: underline; }
.portal-body .edit-details[open] > summary { margin-bottom: 15px; }
.portal-body .editor-panel { max-width: 780px; }
.portal-body .editor-panel h1 { margin: 0 0 5px; font-size: 1.9rem; }
.portal-body .editor-panel > p { color: var(--portal-muted); margin-bottom: 18px; }
.portal-body .roster-controls { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 16px; }
.portal-body .roster-controls > div { display: flex; align-items: center; gap: 15px; }
.portal-body .roster-controls label { display: flex; align-items: center; gap: 6px; font-size: .88rem; }
.portal-body .roster-sheet { background: #fff; border: 1px solid var(--portal-border); padding: 18px; }
.portal-body .roster-heading { display: flex; justify-content: space-between; gap: 15px; align-items: end; border-bottom: 2px solid var(--portal-blue); padding-bottom: 10px; margin-bottom: 12px; }
.portal-body .roster-heading h1 { font-size: 1.75rem; margin: 0 0 3px; }
.portal-body .roster-heading p { color: var(--portal-muted); margin: 0; }
.portal-body .roster-heading > strong { font-size: .9rem; white-space: nowrap; }
.portal-body .roster-table-wrap { overflow-x: auto; }
.portal-body .roster-table { width: 100%; border-collapse: collapse; background: #fff; box-shadow: none; border: 0; border-radius: 0; font-size: .82rem; line-height: 1.3; }
.portal-body .roster-table thead { background: #e8eef5; box-shadow: none; }
.portal-body .roster-table th, .portal-body .roster-table td { text-align: left; border-bottom: 1px solid #d9e1e9; padding: 7px 8px; vertical-align: top; }
.portal-body .roster-table th { color: #244663; font-weight: 700; }
.portal-body .roster-table tbody tr:nth-child(even) { background: #f7f9fb; }
.portal-body .roster-table .contact-column { display: none; }
.portal-body .show-contacts .contact-column { display: table-cell; }
.portal-body .roster-empty { text-align: center !important; color: var(--portal-muted); padding: 24px !important; }
.portal-body .nav-action { border: 0; background: none; color: var(--text); padding: 8px 14px; font-size: .925rem; }
.portal-body .nav-action:hover { color: var(--blue-dark); text-decoration: underline; }
.portal-body .nav-links [hidden] { display: none !important; }
@media (max-width: 900px) {
  .portal-body .detail-grid { grid-template-columns: 1fr; }
  .portal-body .nav-action { font-size: 1.25rem; padding: 10px 20px; }
}
@media (max-width: 650px) {
  .portal-body .portal-shell { padding: 94px 16px 45px; }
  .portal-body .page-lead, .portal-body .section-heading, .portal-body .roster-controls, .portal-body .roster-heading { align-items: start; flex-direction: column; }
  .portal-body .page-lead button { align-self: start; }
  .portal-body .section-heading p { margin-top: 5px; }
  .portal-body .conference-filters button { padding: 8px 10px; font-size: .87rem; }
  .portal-body .conference-card { padding: 15px; }
  .portal-body .conference-top { align-items: start; }
  .portal-body .conference-top h3 { font-size: 1.13rem; }
  .portal-body .contact-panel > summary span { display: block; margin: 4px 0 0 20px; }
  .portal-body .two-col, .portal-body .assignment-form { grid-template-columns: 1fr; }
  .portal-body .auth-actions, .portal-body .roster-controls > div { flex-direction: column; align-items: stretch; }
  .portal-body .application-row > summary { flex-wrap: wrap; }
  .portal-body .application-summary { margin-left: 20px; }
  .portal-body .panel-toolbar { display: block; }
  .portal-body .panel-toolbar h2 { margin-right: -19px; }
  .portal-body .panel-toolbar > button { margin-bottom: 12px; }
}
@media print {
  @page { size: landscape; margin: 10mm; }
  .portal-body { background: #fff !important; }
  .portal-body #navbar, .portal-body .roster-controls, .portal-body #notice { display: none !important; }
  .portal-body .portal-shell { max-width: none; padding: 0 !important; }
  .portal-body #admin-directory, .portal-body #create-view, .portal-body #admin-conference-view { display: none !important; }
  .portal-body #roster-view { display: block !important; }
  .portal-body .roster-sheet { border: 0; padding: 0; }
  .portal-body .roster-table { font-size: 9pt; }
  .portal-body .roster-table tr { break-inside: avoid; }
}
/* Keep the search control's icon spacing after the general form rule. */
.portal-body label.search-field input[type="search"] { height: 38px; padding: 7px 12px 7px 34px; }

/* Editable all-delegate roster. */
.portal-body .admin-top-actions { display:flex; gap:8px; flex-wrap:wrap; }
.portal-body .master-roster-wrap { overflow-x:auto; background:#fff; border:1px solid var(--portal-border); }
.portal-body .master-roster { min-width:1040px; width:100%; border-collapse:collapse; font: .84rem var(--ui-font, Arial, sans-serif); }
.portal-body .master-roster th, .portal-body .master-roster td { text-align:left; padding:9px; border-bottom:1px solid #d9e1e9; vertical-align:middle; }
.portal-body .master-roster input, .portal-body .master-roster select { font-size:.84rem; padding:6px; }
.portal-body .master-roster .roster-email { overflow-wrap:anywhere; max-width:190px; }
.portal-body .assignment-edit { margin:8px 0; }
.portal-body .assignment-edit summary { cursor:pointer; color:var(--portal-blue); }
.portal-body .edit-assignment-form { margin-top:9px; max-width:360px; }
.portal-body .edit-assignment-form button { justify-self:start; }
@media print { .portal-body #master-roster-view { display:none !important; } }

.portal-body .form-list-section { display:grid; gap:9px; border:1px solid var(--portal-border); background:#f8fafc; padding:12px; }
.portal-body .form-list-heading { display:grid; gap:2px; }
.portal-body .resource-fields, .portal-body .question-fields { display:grid; gap:9px; }
.portal-body .resource-row { display:grid; grid-template-columns:minmax(110px,1fr) minmax(180px,2fr) auto; gap:9px; align-items:end; }
.portal-body .question-row { display:grid; grid-template-columns:1fr auto; gap:9px; align-items:end; }
.portal-body .remove-row { margin-bottom:8px; }
.portal-body .form-list-section > button { justify-self:start; }
@media(max-width:650px){.portal-body .resource-row { grid-template-columns:1fr; }.portal-body .remove-row { justify-self:start; }}

/* Conference editor spans the full content area. */
.portal-body #admin-conference-detail > .surface { max-width: 780px; }
.portal-body .form-list-section { min-width:0; }
.portal-body .resource-row, .portal-body .question-row { min-width:0; }
.portal-body .resource-row > label, .portal-body .question-row > label { min-width:0; }
@media(max-width:650px) { .portal-body .resource-row, .portal-body .question-row { grid-template-columns:1fr; } }

.portal-body #admin-conference-list.conference-grid { border:0; background:transparent; }
.portal-body .conference-directory-table { min-width:760px; }
.portal-body .conference-directory-table td:first-child { min-width:220px; }
.portal-body .conference-directory-table td small { display:block; color:var(--portal-muted); max-width:280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.portal-body .conference-directory-table tbody tr:nth-child(even) { background:#f9fbfd; }
.portal-body .conference-directory-table tbody tr:hover { background:#eef5fb; }
