/* Member and host pages. Builds on style.css tokens. */
.members { padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(4rem, 8vw, 6rem); }
.members h1 { font-size: clamp(2.2rem, 4.6vw, 3.4rem); margin-bottom: 1rem; }
.members h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin: 0 0 1.2rem; }
.panel { margin-top: 2.6rem; }
.signin { max-width: 520px; }
.list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.item { background: var(--paper); border: 2px solid var(--navy); border-radius: 18px; box-shadow: 4px 4px 0 var(--navy); padding: 1.1rem 1.3rem; display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; align-items: center; justify-content: space-between; }
.item h3 { font-size: 1.3rem; margin: 0; }
.item p { margin: 0; font-size: .95rem; }
.meta { font-family: var(--accent); font-style: italic; color: var(--forest); }
.actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.button-small { padding: .6rem 1.1rem; font-size: .9rem; }
.button-small.button-primary { box-shadow: 3px 3px 0 var(--navy); }
.pill { display: inline-block; font-size: .85rem; font-weight: 600; padding: .2rem .7rem; border-radius: 999px; border: 1.5px solid var(--navy); background: var(--butter); color: var(--navy); }
.pill-paid { background: var(--tea); } .pill-refunded, .pill-cancelled { background: var(--lilac); }
.empty { font-family: var(--accent); font-style: italic; font-size: 1.1rem; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.demo-note { background: var(--butter); border: 2px solid var(--navy); border-radius: 12px; padding: .5rem 1rem; font-size: .9rem; margin: 0 0 1.5rem; }
.roster { width: 100%; border-collapse: collapse; margin-top: .4rem; font-size: .95rem; }
.roster th, .roster td { text-align: left; padding: .45rem .5rem; border-bottom: 1px solid rgba(30,42,74,.2); }
.roster-wrap { flex-basis: 100%; overflow-x: auto; }
.tabs { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1.5rem 0 0; }
.tabs .button[aria-current="true"] { background: var(--navy); color: var(--cream); }
[hidden] { display: none !important; }
.edit-form { flex-basis: 100%; }
select.inline { width: auto; padding: .5rem .7rem; }
@media (max-width: 560px) { .grid-2 { grid-template-columns: 1fr; } .item { padding: 1rem; } }
/* Instructors and reviews panels (admin.html) */
.panel-intro { max-width: 44rem; margin: -.4rem 0 1.2rem; }
.item > div:first-child { min-width: 0; flex: 1 1 22rem; }
.review-item blockquote { margin: .5rem 0; padding-left: .9rem; border-left: 4px solid var(--gum); white-space: pre-line; overflow-wrap: anywhere; }
.review-item .rating { gap: .6rem; }
.item > .form-note, .link-fallback { flex-basis: 100%; margin: 0; }
.link-fallback label { font-size: .9rem; }
.pill-approved { background: var(--tea); } .pill-hidden { background: var(--lilac); }
.members .admin-more { margin-top: 2rem; border: 0; }
.members .admin-more summary { font-size: 1.4rem; color: var(--navy); padding: .6rem 2.5rem .6rem 0; }
.members .admin-more summary::after { color: var(--navy); top: .3rem; }
.members .admin-more[open] summary { margin-bottom: 1rem; }
.members .admin-more p { color: var(--forest); margin: 0; }
.members .admin-more .meta { color: var(--forest); }
.item > .form-note:empty { display: none; }
/* private lessons panel */
.check-line { display: flex; align-items: center; gap: .55rem; font-weight: 500; margin: .35rem 0 .8rem; }
.check-line input { width: 1.15rem; height: 1.15rem; margin: 0; padding: 0; accent-color: var(--forest); flex: none; }
.paid-toggle { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; }
.paid-toggle input { width: 1.1rem; height: 1.1rem; margin: 0; padding: 0; }
.cancel-box { grid-column: 1 / -1; display: grid; gap: .5rem; margin-top: .6rem; padding: .9rem; border: 2px dashed var(--navy); border-radius: 14px; }
.cancel-box label { font-weight: 500; display: flex; gap: .5rem; align-items: center; }
.cancel-box input[type="checkbox"] { width: 1.1rem; height: 1.1rem; margin: 0; }
.email-preview { width: 100%; height: 720px; border: 2px solid var(--navy); border-radius: 14px; background: #fff; }
/* tokens: account and admin */
.token-summary { display: grid; grid-template-columns: auto 1fr; gap: 1.6rem; align-items: center; margin-bottom: 1rem; }
.token-balance { display: grid; place-items: center; width: 132px; height: 164px; background: var(--paper); border: 3px solid var(--navy); border-radius: 18px; box-shadow: 8px 10px 0 var(--tea), 8px 10px 0 3px var(--navy); text-align: center; }
.token-count { font: 400 3.4rem/1 var(--display); color: var(--navy); font-variant-numeric: tabular-nums; }
.token-label { font-family: var(--accent); font-style: italic; color: var(--forest); margin-top: -1.2rem; }
.token-how h3 { margin-top: 0; }
.token-how .muted { opacity: .6; }
.token-wins { font-weight: 600; color: var(--navy); }
.token-item .actions { align-items: center; }
.token-plus { font: 400 1.5rem/1 var(--display); color: var(--forest); font-variant-numeric: tabular-nums; }
.place-badge { font: 700 .8rem/1 var(--body); padding: .35rem .6rem; border: 2px solid var(--navy); border-radius: 999px; background: var(--butter); color: var(--navy); }
.place-badge.place_1 { background: var(--orange); }
.place-badge.place_2 { background: var(--butter); }
.place-badge.place_3 { background: var(--peach); }
.switch-card { margin-bottom: 1.4rem; }
.table-wrap { overflow-x: auto; }
.results-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.results-table th, .results-table td { text-align: left; padding: .6rem .5rem; border-bottom: 1px solid rgba(30,42,74,.18); vertical-align: middle; }
.results-table th { font-size: .8rem; letter-spacing: .04em; color: var(--forest); }
.results-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.results-table select { width: auto; min-width: 5.5rem; }
.results-table .check-line { margin: 0; }
.results-box { grid-column: 1 / -1; display: grid; gap: .8rem; margin-top: .6rem; padding-top: .8rem; border-top: 2px dashed rgba(30,42,74,.35); }
.walkin { display: grid; gap: .5rem; }
.walkin label { font-weight: 600; font-size: .9rem; }
.walkin .button { justify-self: start; }
@media (max-width: 560px) { .token-summary { grid-template-columns: 1fr; justify-items: center; text-align: left; } }
@media (max-width: 560px) {
  .results-box .results-table thead { display: none; }
  .results-box .results-table tr { display: grid; grid-template-columns: 1fr auto; gap: .4rem 1rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid rgba(30,42,74,.18); }
  .results-box .results-table td { border: 0; padding: 0; }
  .results-box .results-table td:first-child { grid-column: 1 / -1; }
}
/* sign-in: password first, email link optional */
.signin-title { font-size: 1.6rem; margin: 0 0 1rem; }
.pw-wrap { display: flex; gap: .5rem; align-items: stretch; }
.pw-wrap input { flex: 1; min-width: 0; }
.show-pw { flex: none; min-width: 64px; min-height: 48px; border: 2px solid var(--navy); border-radius: 12px; background: var(--paper); color: var(--navy); font: 600 .95rem/1 var(--body); cursor: pointer; }
.show-pw:hover { background: var(--butter); }
.signin-links { margin: .8rem 0 0; font-size: 1rem; }
.link-button { background: none; border: 0; padding: .35rem 0; min-height: 44px; font: 600 1rem/1.3 var(--body); color: var(--navy); text-decoration: underline; text-decoration-color: var(--gum); text-decoration-thickness: 2px; text-underline-offset: 3px; cursor: pointer; }
.link-button:hover { text-decoration-color: var(--orange); }
#signin-form input { font-size: 1.1rem; min-height: 48px; }
/* restaurant outreach */
.outreach-find { margin-bottom: 1.6rem; }
.outreach-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 1.4rem; align-items: start; }
.outreach-queue .chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .4rem 0 .8rem; }
.outreach-queue .chip { font: 600 .9rem/1 var(--body); padding: .55rem .8rem; border-radius: 999px; border: 2px solid var(--navy); background: var(--paper); color: var(--navy); cursor: pointer; }
.outreach-queue .chip[aria-pressed="true"] { background: var(--navy); color: var(--cream); }
.queue { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; max-height: 70vh; overflow-y: auto; }
.queue-item { width: 100%; text-align: left; display: grid; gap: .2rem; padding: .8rem .9rem; border: 2px solid var(--navy); border-radius: 14px; background: var(--paper); color: var(--navy); cursor: pointer; font: inherit; }
.queue-item:hover { background: var(--cream); }
.queue-item.open { background: var(--butter); box-shadow: 4px 4px 0 var(--navy); }
.qi-name { font-family: var(--display); font-size: 1.1rem; }
.qi-meta { font-size: .85rem; color: var(--forest); overflow-wrap: anywhere; }
.queue-item .pill { justify-self: start; }
.pill-draft { background: var(--paper); } .pill-scheduled { background: var(--butter); } .pill-sent { background: var(--tea); } .pill-failed { background: var(--peach); } .pill-sending { background: var(--ice); }
.outreach-editor { position: sticky; top: 1rem; }
.oe-facts { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; margin: 0 0 .8rem; font-size: .95rem; }
.oe-facts dt { font-weight: 600; color: var(--forest); }
.oe-facts dd { margin: 0; overflow-wrap: anywhere; }
.oe-notes { white-space: pre-line; font-size: .92rem; background: var(--cream); border-radius: 10px; padding: .6rem .8rem; }
.oe-warn { background: var(--peach); border: 2px solid var(--navy); border-radius: 10px; padding: .6rem .8rem; font-weight: 600; }
.oe-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin: .4rem 0; }
.oe-delete { margin-left: auto; }
.oe-confirm { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: .8rem 0; padding: .8rem; border: 2px dashed var(--navy); border-radius: 12px; }
.oe-confirm p { margin: 0; flex-basis: 100%; font-weight: 600; }
.oe-confirm input { width: auto; }
.oe-preview { border: 2px solid var(--navy); border-radius: 12px; background: #fff; padding: 1rem 1.1rem; font-family: Helvetica, Arial, sans-serif; font-size: 15px; line-height: 1.55; color: var(--navy); overflow-wrap: anywhere; }
.oe-preview .oe-subject { font-weight: 700; font-size: 1.05rem; }
@media (max-width: 900px) { .outreach-layout { grid-template-columns: 1fr; } .outreach-editor { position: static; } }
/* emails tab */
.email-group { margin-top: 2rem; }
.email-group > h3 { margin: 0 0 .8rem; }
.email-item h4 { font-family: var(--display); font-weight: 400; font-size: 1.2rem; color: var(--navy); margin: 0 0 .2rem; }
.email-item .meta { overflow-wrap: anywhere; }
.pill-live { background: var(--tea); } .pill-soon { background: var(--paper); }
.email-preview-box { flex-basis: 100%; min-width: 0; display: grid; gap: .6rem; }
.email-subject { font-weight: 600; color: var(--navy); overflow-wrap: anywhere; }
.view-toggle { display: flex; gap: .4rem; }
.frame-wrap { background: var(--ice); border: 2px solid var(--navy); border-radius: 14px; padding: .8rem; overflow: hidden; }
.email-frame { display: block; width: 100%; max-width: 680px; height: 820px; margin: 0 auto; border: 0; border-radius: 8px; background: #fff; }
.email-frame.phone { width: 375px; max-width: 100%; }
.members details.plain-text { border: 0; }
.members .plain-text summary { font-family: var(--body); font-weight: 600; font-size: 1rem; color: var(--navy); padding: .5rem 2rem .5rem 0; }
.members .plain-text summary::after { color: var(--navy); top: .1rem; font-size: 1.5rem; }
.plain-text pre { margin: .4rem 0 0; padding: .9rem 1rem; background: var(--cream); border: 1.5px solid rgba(30,42,74,.3); border-radius: 10px; font: .92rem/1.55 ui-monospace, Menlo, Consolas, monospace; color: var(--navy); white-space: pre-wrap; overflow-wrap: anywhere; }
/* suggest a change */
#admin { padding-bottom: 4.5rem; }
.feedback-fab { position: fixed; right: 1rem; bottom: 1rem; z-index: 20; }
.feedback-panel { position: fixed; right: 1rem; bottom: 5rem; z-index: 21; width: min(440px, calc(100vw - 2rem)); max-height: calc(100vh - 7rem); overflow-y: auto; background: var(--paper); border: 3px solid var(--navy); border-radius: 20px; box-shadow: 6px 6px 0 var(--navy); padding: 1.1rem 1.2rem 1.3rem; }
.feedback-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.members .feedback-panel h2 { font-size: 1.6rem; margin: 0 0 .3rem; }
.feedback-panel h3 { font-size: 1.25rem; margin: 1.4rem 0 .6rem; }
.feedback-panel .meta { margin: 0 0 .8rem; }
.feedback-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.feedback-item { border: 2px solid var(--navy); border-radius: 14px; padding: .7rem .8rem; background: #fff; }
.feedback-top { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.feedback-top .meta { margin: 0; font-size: .9rem; }
.feedback-body { margin: .4rem 0; white-space: pre-line; overflow-wrap: anywhere; color: var(--navy); }
.feedback-note { margin: 0 0 .3rem; background: var(--cream); border-radius: 8px; padding: .4rem .6rem; font-size: .95rem; }
.feedback-item .meta { margin: 0; }
.feedback-edit { display: grid; gap: .5rem; }
.feedback-edit .button { justify-self: start; }
.pill-fb-new { background: var(--butter); } .pill-fb-in-progress { background: var(--ice); } .pill-fb-done { background: var(--tea); } .pill-fb-not-doing { background: var(--lilac); }
@media (max-width: 560px) { .feedback-panel { right: .75rem; left: .75rem; width: auto; bottom: 4.5rem; } .feedback-fab { right: .75rem; bottom: .75rem; } .email-frame { height: 700px; } .frame-wrap { padding: .4rem; } }
.host-link { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1.2rem; margin: 0 0 1.6rem; background: var(--butter); }
.host-link p { margin: 0; }
/* lesson booking tab */
.sample-inline { display: inline-block; background: var(--butter); border: 2px solid var(--navy); border-radius: 12px; padding: .45rem 1rem; font-weight: 600; font-size: .95rem; color: var(--navy); margin: 0 0 1rem; }
#booking-panel h3 { font-size: 1.6rem; margin: 1.6rem 0 .8rem; }
#booking-panel .item h3 { font-size: 1.3rem; margin: 0; }
#booking-panel .button-small, #booking-panel .link-button { min-height: 44px; }
.slot-line { margin: .3rem 0 !important; color: var(--navy); }
.ready-flag { font-weight: 700; color: var(--orange); }
.slot-item.is-ready { box-shadow: 4px 4px 0 var(--orange); }
.slot-item > .cancel-box, .slot-item > .table-wrap, .slot-item > .signup-empty, .poll-item > .poll-grid-box, .poll-item > .cancel-box { flex-basis: 100%; min-width: 0; }
.cancel-box p { margin: 0; }
.signup-table td, .signup-table th { font-size: .95rem; }
.signup-table a { overflow-wrap: anywhere; }
.signup-table .sg-note { max-width: 16rem; }
.signup-table tr.is-off td { opacity: .6; }
.sg-name .pill { margin-left: .4rem; }
.poll-grid { border-collapse: collapse; font-size: .95rem; min-width: 100%; }
.poll-grid th, .poll-grid td { padding: .5rem .6rem; border-bottom: 1px solid rgba(30,42,74,.2); text-align: center; white-space: nowrap; }
.poll-grid th[scope="row"] { text-align: left; font-weight: 600; color: var(--navy); }
.poll-grid thead th { font-size: .85rem; color: var(--forest); vertical-align: bottom; }
.poll-grid .best { background: rgba(170,204,150,.45); }
.poll-grid thead th.best { color: var(--navy); box-shadow: inset 0 3px 0 var(--forest); }
.poll-grid .booked { background: var(--butter); }
.poll-grid tfoot th, .poll-grid tfoot td { font-weight: 700; color: var(--navy); border-bottom: 0; }
.grid-email { display: block; font-weight: 400; font-size: .8rem; color: var(--forest); }
.tick { font-size: 1.2rem; font-weight: 700; color: var(--forest); }
.who-list { display: grid; gap: 0; }
.who-list .check-line { margin: .2rem 0; min-height: 44px; }
.booking-form .field input, .booking-form .field select { min-height: 46px; }
.option-rows { list-style: none; padding: 0; margin: 0 0 .8rem; display: grid; gap: .6rem; }
.option-row { display: grid; grid-template-columns: 4.5rem 1.2fr 1fr 1fr auto; gap: .6rem; align-items: end; padding: .6rem .8rem; border: 1.5px dashed rgba(30,42,74,.45); border-radius: 12px; }
.option-row .field { margin: 0; }
.opt-n { font-family: var(--accent); font-style: italic; color: var(--forest); padding-bottom: .8rem; }
#tp-link { display: grid; gap: .5rem; margin-top: 1rem; padding: .9rem; border: 2px solid var(--navy); border-radius: 14px; background: var(--butter); }
#tp-link p { margin: 0; font-weight: 600; }
#tp-link .button { justify-self: start; }
@media (max-width: 700px) {
  .option-row { grid-template-columns: 1fr 1fr; }
  .option-row .opt-n, .option-row .field:first-of-type { grid-column: 1 / -1; }
  .opt-n { padding: 0; }
  .signup-table thead { display: none; }
  .signup-table tr { display: grid; grid-template-columns: 1fr auto; gap: .3rem 1rem; padding: .8rem 0; border-bottom: 1px solid rgba(30,42,74,.25); }
  .signup-table td { border: 0; padding: 0; }
  .signup-table td:first-child, .signup-table .sg-note { grid-column: 1 / -1; max-width: none; }
  .signup-table td:first-child { font-weight: 700; color: var(--navy); font-size: 1.05rem; }
  .signup-table td[data-label]::before { content: attr(data-label) ": "; }
}
#booking-panel .list > li { min-width: 0; }
#booking-panel .table-wrap { position: relative; }
/* instructor view: booking-page link */
.book-link { flex-direction: row; }
.book-link a { overflow-wrap: anywhere; }
/* waiting for a group, making a group, lesson prices (2026-09-29) */
.wl-filters { display: flex; flex-wrap: wrap; gap: .4rem 1rem; }
.wl-filters .field { margin: 0; min-width: 10rem; }
.wl-filters select { min-height: 44px; }
.wl-table td, .wl-table th { font-size: .92rem; vertical-align: top; }
.wl-table .wl-name strong { display: block; color: var(--navy); }
.wl-table .wl-name .pill { margin: .25rem 0; }
.wl-contact { display: block; font-size: .85rem; overflow-wrap: anywhere; }
.wl-table .wl-note { max-width: 14rem; }
.wl-table .wl-admin-note input { min-width: 9rem; min-height: 40px; padding: .4rem .6rem; }
.wl-table tr.is-invited { background: rgba(239,206,123,.18); }
.wl-tick { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; margin: -.4rem 0 0 -.4rem; cursor: pointer; }
.wl-tick input { width: 1.4rem; height: 1.4rem; margin: 0; accent-color: var(--forest); }
.wl-actions { margin: .8rem 0 0; }
.warn { margin: .5rem 0 0; padding: .5rem .8rem; background: var(--peach); border: 2px solid var(--navy); border-radius: 10px; font-weight: 600; color: var(--navy); }
.group-banner { margin: 0 0 1.2rem; padding: .9rem 1rem; background: var(--butter); border: 2px solid var(--navy); border-radius: 14px; }
.group-banner p { margin: 0 0 .4rem; font-weight: 600; color: var(--navy); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 1rem; align-items: end; }
.grid-3 > div:last-child { grid-column: 1 / -1; }
@media (max-width: 760px) {
  .grid-3 { grid-template-columns: 1fr; }
  .wl-table thead { display: none; }
  .wl-table tr { display: grid; grid-template-columns: auto 1fr; gap: .25rem .8rem; padding: .8rem 0; border-bottom: 1px solid rgba(30,42,74,.25); }
  .wl-table td { border: 0; padding: 0; }
  .wl-table td.wl-pick { grid-row: span 2; }
  .wl-table td:not(.wl-pick):not(.wl-name) { grid-column: 2; }
  .wl-table td[data-label]:not(:empty)::before { content: attr(data-label) ": "; font-weight: 600; color: var(--forest); }
  .wl-table td[data-label]:empty { display: none; }
  .wl-table .wl-admin-note input { width: 100%; }
}
.wl-table td.wl-name { min-width: 11rem; }
.wl-table .wl-name .pill { display: inline-block; border-radius: 10px; line-height: 1.3; padding: .2rem .55rem; white-space: normal; }
.price-fields { border-top: 2px dashed rgba(30,42,74,.3); margin: .4rem 0 1rem; padding-top: .8rem; }
.price-fields .grid-2 { align-items: end; }
