/* ----------------------------------------------------------------------- */
/* Base                                                                    */
/* ----------------------------------------------------------------------- */
:root {
    --bg: #f7f7f8;
    --surface: #ffffff;
    --ink: #1a1a1a;
    --muted: #6b6b6b;
    --line: #e3e3e6;
    --accent: #2b5cdb;
    --accent-ink: #ffffff;
    --good: #1f7a3e;
    --warn: #b87a00;
    --bad: #b3261e;
    --radius: 8px;
    --shadow: 0 1px 2px rgba(0,0,0,.04), 0 4px 16px rgba(0,0,0,.06);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: var(--ink);
    background: var(--bg);
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { line-height: 1.25; }
h1 { font-size: 1.6rem; margin: 0 0 .5rem; }
h2 { font-size: 1.2rem; margin: 1.2rem 0 .4rem; }
hr { border: none; border-top: 1px solid var(--line); margin: 1.25rem 0; }
code { background: #eef0f4; padding: 1px 5px; border-radius: 4px; font-size: .9em; }

.main { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }

/* ----------------------------------------------------------------------- */
/* Header                                                                  */
/* ----------------------------------------------------------------------- */
.admin-header {
    background: #1a1a1a;
    color: #fff;
    padding: .75rem 0;
}
.admin-header__inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.admin-header__brand { color: #fff; font-weight: 600; letter-spacing: .01em; }
.admin-header__nav { display: flex; gap: 1.25rem; align-items: center; }
.admin-header__nav a { color: #fff; opacity: .85; }
.admin-header__nav a:hover { opacity: 1; }

/* ----------------------------------------------------------------------- */
/* Cards / panels                                                          */
/* ----------------------------------------------------------------------- */
.card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1.25rem 1.5rem;
    margin-bottom: 1.25rem;
}
.card h2:first-child, .card h1:first-child { margin-top: 0; }
.card--narrow { max-width: 480px; margin: 4rem auto; }

.subtle { color: var(--muted); }
.muted-block { color: var(--muted); font-size: .92rem; }

/* ----------------------------------------------------------------------- */
/* Forms                                                                   */
/* ----------------------------------------------------------------------- */
.form-row { margin-bottom: 1rem; }
.form-row label { display: block; font-weight: 600; margin-bottom: .25rem; font-size: .95rem; }
.form-row .hint { display: block; color: var(--muted); font-size: .85rem; margin-top: .25rem; }
.form-row input[type=text],
.form-row input[type=password],
.form-row input[type=email],
.form-row input[type=tel],
.form-row input[type=url],
.form-row input[type=date],
.form-row select,
.form-row textarea {
    width: 100%;
    padding: .55rem .65rem;
    border: 1px solid var(--line);
    border-radius: 6px;
    font: inherit;
    background: #fff;
}
.form-row textarea { min-height: 4rem; resize: vertical; }
.form-row input:focus, .form-row textarea:focus, .form-row select:focus {
    outline: 2px solid var(--accent);
    outline-offset: 1px;
    border-color: var(--accent);
}
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
@media (max-width: 700px) { .form-grid { grid-template-columns: 1fr; } }

.btn {
    display: inline-block;
    padding: .55rem 1rem;
    border: 1px solid var(--ink);
    border-radius: 6px;
    background: var(--ink);
    color: #fff;
    font: inherit;
    cursor: pointer;
}
.btn:hover { background: #000; text-decoration: none; }
.btn--primary { background: var(--accent); border-color: var(--accent); }
.btn--primary:hover { background: #1f4ec3; }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: #ececef; }
.btn--danger { background: var(--bad); border-color: var(--bad); }
.btn--success { background: var(--good); border-color: var(--good); }
.btn--big { padding: .75rem 1.4rem; font-size: 1.05rem; }

.link-button {
    background: none; border: none; padding: 0;
    color: inherit; cursor: pointer; font: inherit;
    opacity: .85;
}
.link-button:hover { opacity: 1; text-decoration: underline; }
.inline-form { display: inline; }

.button-row { display: flex; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; }

/* ----------------------------------------------------------------------- */
/* Flash messages                                                          */
/* ----------------------------------------------------------------------- */
.flash-stack { max-width: 1100px; margin: .75rem auto 0; padding: 0 1.25rem; }
.flash {
    padding: .65rem .9rem;
    border-radius: 6px;
    margin-bottom: .5rem;
    border: 1px solid transparent;
}
.flash--success { background: #e6f4ea; border-color: #c5e3cf; color: #0f5d2c; }
.flash--error   { background: #fdecea; border-color: #f3c2bf; color: #8c1f19; }
.flash--info    { background: #eaf2fd; border-color: #c0d4f5; color: #1f3e8a; }
.flash--warn    { background: #fcf2dd; border-color: #f0d99a; color: #7a5400; }

/* ----------------------------------------------------------------------- */
/* Tables                                                                  */
/* ----------------------------------------------------------------------- */
.table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1rem;
}
.table th, .table td {
    text-align: left;
    padding: .6rem .75rem;
    border-bottom: 1px solid var(--line);
    vertical-align: top;
}
.table th { font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); font-weight: 600; }
.table tbody tr:hover { background: #fafafb; }

.status-pill {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: .8rem;
    border: 1px solid var(--line);
    background: #fff;
}
.status-pill--pending   { background: #f4f4f6; color: #555; }
.status-pill--emailed   { background: #eaf2fd; color: #1f3e8a; }
.status-pill--confirmed { background: #e6f4ea; color: #0f5d2c; }
.status-pill--corrected { background: #fcf2dd; color: #7a5400; }
.status-pill--withdrawn { background: #f4d6d4; color: #6b1612; }

.drift-flag { color: var(--warn); font-weight: 600; }

/* ----------------------------------------------------------------------- */
/* Stats summary                                                           */
/* ----------------------------------------------------------------------- */
.stats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: .75rem;
    margin-bottom: 1.25rem;
}
@media (max-width: 700px) { .stats { grid-template-columns: repeat(2, 1fr); } }
.stat {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: .85rem 1rem;
}
.stat__label { font-size: .8rem; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.stat__value { font-size: 1.6rem; font-weight: 600; }

/* ----------------------------------------------------------------------- */
/* Badge mockup                                                            */
/* ----------------------------------------------------------------------- */
.badge-mock {
    background: #fff;
    border: 2px solid var(--ink);
    border-radius: 12px;
    padding: 1.5rem 1.5rem 1.25rem;
    max-width: 420px;
    margin: 0 auto 1rem;
    box-shadow: var(--shadow);
    text-align: center;
}
.badge-mock__chip {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--muted);
    margin-bottom: .75rem;
}
.badge-mock__first-name {
    font-size: 2.75rem;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.01em;
    margin: .15rem 0 .1rem;
    word-break: break-word;
}
.badge-mock__full-name {
    font-size: 1.05rem;
    font-weight: 500;
    color: var(--ink);
    margin-bottom: .35rem;
    word-break: break-word;
}
.badge-mock__pronouns {
    color: var(--muted);
    font-size: .9rem;
    margin-bottom: .85rem;
}
.badge-mock__title {
    font-size: 1.05rem;
    margin-top: .5rem;
}
.badge-mock__employer {
    font-size: 1rem;
    color: var(--muted);
    margin-top: .15rem;
    word-break: break-word;
}

/* ----------------------------------------------------------------------- */
/* Attendee preview page                                                   */
/* ----------------------------------------------------------------------- */
.preview-wrap { max-width: 720px; margin: 1rem auto; }
.preview-data dt {
    font-weight: 600;
    margin-top: .65rem;
    font-size: .9rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .04em;
}
.preview-data dd { margin: 0; padding: 0 0 .25rem; word-break: break-word; }
.preview-data dd.empty { color: var(--muted); font-style: italic; }
.preview-actions {
    display: flex;
    gap: .75rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 1.5rem;
}
.preview-note {
    background: #fcf2dd;
    border: 1px solid #f0d99a;
    border-radius: 6px;
    padding: .65rem .9rem;
    font-size: .92rem;
    margin-top: 1rem;
}

/* ----------------------------------------------------------------------- */
/* Checkbox lists and conditional blocks (edit form)                       */
/* ----------------------------------------------------------------------- */
.conditional-block {
    margin: -.25rem 0 1rem;
    padding: .85rem 1rem;
    background: #fcfcfd;
    border: 1px solid var(--line);
    border-radius: 8px;
}
.conditional-block .hint {
    display: block;
    margin-bottom: .5rem;
    color: var(--muted);
    font-size: .9rem;
}
.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .35rem .9rem;
}
@media (max-width: 600px) {
    .checkbox-grid { grid-template-columns: 1fr; }
}
.checkbox-row {
    display: flex;
    gap: .55rem;
    align-items: flex-start;
    padding: .25rem 0;
    cursor: pointer;
    line-height: 1.35;
}
.checkbox-row input[type=checkbox] {
    margin-top: .2rem;
    flex-shrink: 0;
}
.checkbox-row span { flex: 1; }
.checkbox-row:hover span { color: var(--accent); }

/* ----------------------------------------------------------------------- */
/* Chip list (selected dietary/accessibility options on preview)           */
/* ----------------------------------------------------------------------- */
.chip-list {
    list-style: none;
    padding: 0;
    margin: .15rem 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}
.chip {
    display: inline-block;
    padding: .15rem .65rem;
    border-radius: 999px;
    background: #eef2f9;
    border: 1px solid #d8e0ed;
    font-size: .88rem;
    color: #1a3265;
}

/* ----------------------------------------------------------------------- */
/* Contact blocks (mobile phone + emergency contact on attendee preview)   */
/* ----------------------------------------------------------------------- */
.contact-block {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: .85rem 1rem;
    margin-top: 1rem;
    background: #fbfbfc;
}
.contact-block__head {
    font-size: .8rem;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: .35rem;
}
.contact-block__value {
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: .01em;
    margin: .1rem 0;
    word-break: break-word;
}
.contact-block__note {
    color: var(--muted);
    font-size: .82rem;
    margin-top: .35rem;
}
.contact-block__missing {
    background: #fff5f5;
    border: 1px solid #f3c2bf;
    border-radius: 6px;
    padding: .65rem .85rem;
    color: #8c1f19;
    font-size: .95rem;
    line-height: 1.4;
}
.contact-block__missing strong { display: block; margin-bottom: .15rem; }

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: .75rem 1rem;
    margin-top: .35rem;
}
@media (max-width: 600px) {
    .contact-grid { grid-template-columns: 1fr; }
}
.contact-grid__label {
    font-size: .75rem;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: .1rem;
}
.contact-grid__value {
    font-size: 1.05rem;
    font-weight: 500;
    word-break: break-word;
}
.contact-grid__value.is-missing {
    color: #b3261e;
    font-style: italic;
    font-weight: 400;
}

/* ----------------------------------------------------------------------- */
/* Field mapping UI                                                        */
/* ----------------------------------------------------------------------- */
.mapping-row {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: .75rem;
    align-items: center;
    padding: .5rem 0;
    border-bottom: 1px solid var(--line);
}
.mapping-row__label { font-weight: 600; }
.mapping-row select { width: 100%; padding: .4rem; border: 1px solid var(--line); border-radius: 4px; }

/* ----------------------------------------------------------------------- */
/* Diff display                                                            */
/* ----------------------------------------------------------------------- */
.diff-old { background: #fdecea; padding: 1px 4px; border-radius: 3px; }
.diff-new { background: #e6f4ea; padding: 1px 4px; border-radius: 3px; }
.diff-arrow { color: var(--muted); margin: 0 .35rem; }

/* ----------------------------------------------------------------------- */
/* Accessibility helpers                                                    */
/* ----------------------------------------------------------------------- */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    background: #fff;
    color: #003049;
    padding: .6rem 1rem;
    z-index: 100;
    border-radius: 0 0 6px 0;
    font-weight: 700;
}
.skip-link:focus { left: 0; }

a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, [tabindex]:focus-visible {
    outline: 3px solid #3b94b7;
    outline-offset: 2px;
}

/* ----------------------------------------------------------------------- */
/* Admin niceties                                                           */
/* ----------------------------------------------------------------------- */
.btn--xs { padding: .2rem .6rem; font-size: .82rem; }
.import-bar {
    margin: 1.1rem 0 .25rem;
    padding: .9rem 1rem;
    background: #f4f9f9;
    border: 1px dashed #9fcfca;
    border-radius: 8px;
}
.import-bar__label { display: block; font-weight: 600; margin-bottom: .5rem; }
.import-bar__controls { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; margin-bottom: .4rem; }
.stats { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 900px) { .stats { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .stats { grid-template-columns: repeat(2, 1fr); } }

/* ----------------------------------------------------------------------- */
/* Conference theme: SC26 "Better Together"                                 */
/* Palette: orange #f89826 · teal #1aa495 · light teal #2cafa4              */
/*          blue #3b94b7 · navy #003049 — primary font Lato                 */
/* ----------------------------------------------------------------------- */
.theme-sc26 {
    --bg: #f4f8f9;
    --ink: #0d2b3e;
    --muted: #51626e;
    --line: #d8e4e8;
    --accent: #003049;          /* navy: links, primary buttons (AA on white) */
    --teal: #1aa495;
    --teal-deep: #0d7c70;       /* dark enough for white text */
    --orange: #f89826;
    --blue: #3b94b7;
    --navy: #003049;
    --radius: 12px;
    font-family: 'Lato', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.theme-sc26 .main { max-width: 760px; padding: 1.25rem 1rem 4rem; }

.brand-header {
    background: var(--navy, #003049);
    text-align: center;
    padding: 1.4rem 1rem 1.1rem;
    border-bottom: 4px solid #f89826;
}
.brand-header__logo {
    max-width: 250px;
    width: 60%;
    height: auto;
    display: block;
    margin: 0 auto;
}
.brand-header__event {
    color: #bfe3df;
    font-size: .95rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin: .75rem 0 0;
    font-weight: 700;
}
@media (max-width: 480px) {
    .brand-header__logo { width: 70%; max-width: 210px; }
    .brand-header__event { font-size: .8rem; }
}

.theme-sc26 h1 { color: var(--navy); font-weight: 900; font-size: 1.45rem; }
.theme-sc26 .preview-lede { font-size: 1.05rem; }
.theme-sc26 .preview-wrap { max-width: 640px; }

.section-card { border-top: 4px solid var(--teal); }
.section-card h2 {
    display: flex;
    align-items: center;
    gap: .6rem;
    color: var(--navy);
    font-weight: 900;
    font-size: 1.12rem;
}
.section-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--teal);
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
}

/* Branded badge mockup */
.badge-mock--brand {
    border: 2px solid var(--navy);
    padding-top: 0;
    overflow: hidden;
}
.badge-mock--brand .badge-mock__band {
    height: 26px;
    margin: 0 -1.5rem 1rem;
    background: url('sc26/weave.png') repeat-x center / auto 100%;
    border-bottom: 3px solid var(--orange);
}
.badge-mock--brand .badge-mock__first-name {
    color: var(--navy);
    font-weight: 900;
}
.badge-mock--brand .badge-mock__employer { color: var(--muted); font-size: 1.05rem; }

/* Session rows */
.session-list { list-style: none; margin: .25rem 0 0; padding: 0; }
.session-row {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .25rem;
    border-bottom: 1px solid var(--line);
}
.session-row:last-child { border-bottom: none; }
.session-row__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    flex-shrink: 0;
    border-radius: 50%;
    font-weight: 900;
}
.session-row__icon.is-yes { background: #def3f0; color: #0d7c70; }
.session-row__icon.is-no  { background: #eceff1; color: #51626e; }
.session-row__label { flex: 1; font-weight: 700; color: var(--ink); }
.session-row__value { text-align: right; }
@media (max-width: 480px) {
    .session-row { flex-wrap: wrap; }
    .session-row__value { flex-basis: 100%; text-align: left; padding-left: 2.35rem; margin-top: -.3rem; }
}

.theme-sc26 .chip { background: #e2f2f0; border-color: #b5ded9; color: #0a4f47; font-size: .95rem; padding: .3rem .85rem; }
.dietary-none { color: var(--muted); margin: .25rem 0 0; }

/* Buttons */
.theme-sc26 .btn { border-radius: 10px; }
.theme-sc26 .btn--success { background: var(--teal-deep); border-color: var(--teal-deep); font-weight: 700; }
.theme-sc26 .btn--success:hover { background: #09665c; }
.theme-sc26 .btn--primary { background: var(--navy); border-color: var(--navy); font-weight: 700; }
.theme-sc26 .btn--primary:hover { background: #00253a; }
.btn--outline {
    background: #fff;
    color: #003049;
    border: 2px solid #003049;
    font-weight: 700;
}
.btn--outline:hover { background: #eef4f7; }
.btn--full { width: 100%; text-align: center; }
.theme-sc26 .preview-actions { flex-direction: column; align-items: stretch; gap: .65rem; }
.theme-sc26 .preview-actions .inline-form { display: block; }
.theme-sc26 .btn--big { padding: .95rem 1.4rem; font-size: 1.1rem; min-height: 52px; }
.button-row--stack { flex-direction: column; }
.button-row--stack .btn { text-align: center; }

.theme-sc26 .preview-note {
    background: #fff4e2;
    border-color: #f4cf94;
    color: #5d3c00;
    font-size: 1rem;
    text-align: center;
}
.preview-help { color: var(--muted); text-align: center; font-size: .92rem; margin-top: 1.25rem; }

/* Radio cards (session answers on edit form) */
.radio-fieldset {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: .85rem 1rem 1rem;
    margin: 0 0 1.1rem;
}
.radio-fieldset legend {
    font-weight: 700;
    padding: 0 .4rem;
    color: var(--ink, #1a1a1a);
}
.radio-options { display: flex; flex-direction: column; gap: .5rem; margin-top: .35rem; }
.radio-card {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .7rem .85rem;
    border: 2px solid var(--line);
    border-radius: 10px;
    cursor: pointer;
    min-height: 48px;
}
.radio-card input { width: 1.15rem; height: 1.15rem; flex-shrink: 0; accent-color: #0d7c70; }
.radio-card:has(input:checked) { border-color: #0d7c70; background: #f0faf8; }
.radio-card span { font-weight: 600; }
.theme-sc26 .checkbox-row { min-height: 44px; align-items: center; }
.theme-sc26 .checkbox-row input[type=checkbox] { width: 1.1rem; height: 1.1rem; accent-color: #0d7c70; }

/* Pre-conference section */
.section-sub { font-size: .85em; font-weight: 700; color: var(--muted, #6b6b6b); }
.precon-info { color: var(--muted, #6b6b6b); font-size: .95rem; margin: .85rem 0 0; }
.precon-fee-note {
    background: #fff4e2;
    border: 1px solid #f4cf94;
    border-radius: 8px;
    color: #5d3c00;
    font-size: .92rem;
    padding: .6rem .8rem;
    margin: .4rem 0 .75rem;
}
.radio-card--precon { align-items: flex-start; }
.radio-card--precon input { margin-top: .2rem; }
.precon-meta { display: block; color: var(--muted, #6b6b6b); font-weight: 400; margin-top: .1rem; }
.radio-card.is-locked { border-color: #b5ded9; background: #f4faf9; cursor: default; }
.radio-card.is-locked input { accent-color: #0d7c70; }
.precon-meta--locked { color: #0d7c70; font-weight: 700; }
