/* Theme variables are scoped to organisation pages and the CMS preview. */
.event-update { padding: 0 0 20px; }
.event-update + .event-update { border-top: 1px solid var(--line); padding-top: 20px; }
.update-timestamp { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.update-timestamp-relative { font: 600 .85rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.update-timestamp-relative[hidden] { display: none; }
.update-timestamp .update-timestamp-full { font: 400 .8rem/1.5 var(--organisation-font, Helvetica, Arial, sans-serif); opacity: .75; }
.update-body { overflow-wrap: anywhere; }
.update-body pre { white-space: pre-wrap; }
.update-body h1, .update-body h2, .update-body h3, .update-body h4 { font: var(--highlight); }
.update-body table { display: block; max-width: 100%; overflow-x: auto; }
.create-field { margin: 0 0 24px; min-width: 0; }
.create-field-preview { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px 20px; }
.create-field-preview[hidden], .create-field-inputs[hidden] { display: none; }
.create-field [data-create-value] { white-space: pre-line; overflow-wrap: anywhere; }
.create-field [data-create-value]:empty { display: none; }
.create-field[data-kind="title"] [data-create-value] { font: var(--title); letter-spacing: -.045em; color: var(--organisation-title); }
.create-field[data-kind="all_day"] [data-create-value] { font-weight: 700; font-size: 1.4rem; }
.create-field-inputs { padding: 16px; border: 1px solid var(--line); background: #fff; color: #171717; }
.create-field-inputs .field { margin: 0 0 16px; }
.create-profile .field input:not([type="checkbox"]):not([type="radio"]), .create-profile .field textarea, .create-profile .field select { max-width: 100%; }
.create-contributors { margin: 24px 0; }
.create-contributors .related-editor { background: #fff; color: #171717; padding: 16px; }
.create-profile > .inline-save-actions { margin: 24px 0; }
.public-site[style], .organisation-preview {
  --title: 400 clamp(2.5rem, 5.8vw, 4.5rem)/1.08 var(--organisation-font, Helvetica, Arial, sans-serif);
  --subtitle: 400 clamp(1.5rem, 2.5vw, 1.875rem)/1.25 var(--organisation-font, Helvetica, Arial, sans-serif);
  --body: 400 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif);
  --highlight: 700 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif);
  --paper: var(--light-paper); --ink: var(--light-ink);
  --accent: var(--ink); --organisation-title: var(--light-title);
  --line: color-mix(in srgb, var(--ink) 22%, transparent);
}
@media (prefers-color-scheme: dark) {
  .public-site[style], .organisation-preview {
    --paper: var(--dark-paper); --ink: var(--dark-ink);
    --organisation-title: var(--dark-title);
  }
}
/* Shared profile layout for public pages and the CMS settings preview. */
.organisation-preview {
  --title: 400 clamp(2.5rem, 5.8vw, 4.5rem)/1.08 var(--organisation-font, Helvetica, Arial, sans-serif);
  --body: 400 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif);
  --highlight: 700 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif);
  background: var(--paper); color: var(--ink); padding: 32px;
  font: var(--body); overflow-wrap: anywhere;
}
.organisation-profile { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 24px 32px; margin: 0 0 48px; }
.profile-logo { grid-column: 1; grid-row: 1; align-self: center; }
.profile-logo img { display: block; width: 96px; height: 96px; max-width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; }
.profile-heading { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 20px; min-width: 0; }
.profile-heading h1 { font: var(--title); letter-spacing: -.045em; color: var(--organisation-title); margin: 0; flex: 0 1 auto; min-width: 0; max-width: 100%; }
.profile-heading > form { display: flex; align-items: center; flex: none; margin: 0; }
.profile-heading > form[hidden] { display: none; }
.profile-heading .follow-button, .profile-follow-actions .follow-button, .series-heading .follow-button { border: 1px solid #d5d5d5; border-radius: 8px; padding: 8px 20px; color: #171717; background: #f1f1f1; text-decoration: none; font: var(--highlight); cursor: pointer; }
.follow-button:disabled { opacity: .5; cursor: wait; }
.profile-details { grid-column: 2; min-width: 0; }
.profile-field { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 16px; }
.profile-field:empty { display: none; }
.profile-field > div { flex: 1 1 260px; }
.profile-field p { margin: 0 0 12px; }
.profile-field p:last-child { margin-bottom: 0; }
.organisation-profile a, .profile-settings a { color: var(--ink); }
.profile-edit { display: inline-block; font: var(--highlight); border: 1px solid currentColor; border-radius: 8px; padding: 4px 10px; text-decoration: none; background: transparent; color: var(--ink); cursor: pointer; }
.profile-logo-controls { grid-column: 1; grid-row: 2; }
.profile-logo-controls .profile-edit { width: 100%; text-align: center; }
.profile-contact, .profile-links { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.profile-contact > .profile-field, .profile-links > .profile-field { min-width: 0; max-width: 100%; margin: 0; }
.profile-contact { margin-bottom: 16px; }
.profile-links > p { margin: 0; flex-basis: 100%; }
.social-link { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.social-icon { flex: none; width: 24px; height: 24px; }
.follow-notice { padding: 16px 20px; background: color-mix(in srgb, var(--ink) 8%, var(--paper)); color: var(--ink); margin: 0 0 24px; }
.follow-notice a { color: inherit; }
.profile-settings { border-top: 1px solid var(--line); padding-top: 24px; }
@media (max-width: 700px) {
  .organisation-profile { grid-template-columns: 64px minmax(0, 1fr); gap: 20px; }
  .profile-logo img { width: 64px; height: 64px; }
  .profile-details { grid-column: 1 / -1; }
  .profile-heading h1 { font-size: 2.5rem; }
  .profile-heading { gap: 16px; }
  .organisation-preview { padding: 20px; }
}
.inline-editor { flex-basis: 100%; width: 100%; min-width: 0; margin: 12px 0; padding: 16px; border: 1px solid var(--line); }
.inline-editor .field { margin: 0 0 16px; }
.inline-editor > form { display: block; min-width: 0; margin: 0; }
.inline-editor-actions, .inline-save-actions, .inline-colour-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.inline-editor-actions { gap: 24px 32px; }
.inline-colour-actions { margin-left: auto; justify-content: flex-end; }
.inline-editor [data-inline-status]:empty { display: none; }
.inline-editor button { background: #f1f1f1; color: #171717; border: 1px solid #d5d5d5; border-radius: 8px; padding: 8px 16px; font: var(--highlight, inherit); }
.inline-editor input, .inline-editor textarea { color: #171717; }
.organisation-profile > .inline-editor { grid-column: 1 / -1; }
.profile-field > .inline-editor { flex: 1 0 100%; }
.profile-heading:has(.inline-editor) { align-content: start; }

.profile-field [data-delete-link] { margin: 0; }

.organisation-page-settings { --highlight: 700 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif); display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 20px 32px; margin: 32px 0; }
.organisation-page-settings dt { font-weight: 600; padding-top: 5px; }
.organisation-page-settings dd { margin: 0; min-width: 0; align-items: center; }
.organisation-public-url { flex-basis: 100%; overflow-wrap: anywhere; }
@media (max-width: 600px) {
  .organisation-page-settings { grid-template-columns: 1fr; gap: 8px; }
  .organisation-page-settings dd { margin-bottom: 16px; }
}

.cms input[type="color"] { width: 80px; height: 48px; padding: 4px; cursor: pointer; }

.organisation-preview[data-preview-mode="light"] { --paper: var(--light-paper); --ink: var(--light-ink); --organisation-title: var(--light-title); }
.organisation-preview[data-preview-mode="dark"] { --paper: var(--dark-paper); --ink: var(--dark-ink); --organisation-title: var(--dark-title); }
.profile-settings h2 { font: 400 1.875rem/1.25 var(--organisation-font, Helvetica, Arial, sans-serif); margin: 0 0 24px; }
.branding-preview-toggle:not([hidden]) { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; }
.branding-preview-toggle .preview-mode-switch { position: relative; flex: none; width: 56px; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.preview-mode-switch::before { content: ''; position: absolute; inset: 8px 0; border: 1px solid var(--ink); border-radius: 20px; background: color-mix(in srgb, var(--ink) 15%, var(--paper)); }
.preview-mode-switch::after { content: ''; position: absolute; top: 12px; left: 4px; width: 20px; height: 20px; border-radius: 50%; background: var(--ink); }
.preview-mode-switch[aria-checked="true"]::before { background: var(--ink); }
.preview-mode-switch[aria-checked="true"]::after { transform: translateX(28px); background: var(--paper); }

.branding-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.branding-table th, .branding-table td { text-align: left; vertical-align: middle; padding: 16px 8px; border-bottom: 1px solid var(--line); }
.branding-table th { font: var(--highlight); }
.branding-table th:first-child { width: 28%; padding-left: 0; }
.branding-colour-cell { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.branding-colour-swatch { display: inline-block; flex: none; width: 32px; height: 32px; border: 1px solid var(--ink); border-radius: 4px; }

.organisation-details-title { font: inherit; font-weight: 600; letter-spacing: normal; }
.organisation-preview-frame { border: 1px solid #d5d5d5; border-radius: 8px; overflow: hidden; margin: 24px 0; }
.organisation-preview-frame > .organisation-details-title { margin: 0; padding: 16px 24px; background: var(--brand-canvas); color: #171717; border-bottom: 1px solid #d5d5d5; }

.series-row { padding: 24px 0; border-bottom: 1px solid var(--line); }
.series-row:first-child { padding-top: 0; }
.series-row:last-child { border-bottom: 0; }
.series-heading { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; margin-bottom: 16px; }
.series-heading h3 { margin: 0; font-weight: 400; }

/* Branding controls stay neutral; only the Details canvas previews the palette. */
.organisation-branding { --ink: #000; --line: #d5d5d5; --highlight: 700 1.125rem/1.65 var(--organisation-font, Helvetica, Arial, sans-serif); background: #fff; color: #000; }
.branding-controls { padding: 24px; }
.public-site[style] .follow-button { color: var(--ink); border-color: var(--ink); background: color-mix(in srgb, var(--ink) 8%, var(--paper)); }
.cms button, .cms .button, .cms .profile-edit { background: #fff; color: #000; border-color: #000; }

.series-profile { margin: 0 0 48px; }
.series-organisation { display: inline-flex; align-items: center; gap: 12px; font: var(--body); margin-bottom: 24px; }
.series-organisation img { width: 40px; height: 40px; flex: none; object-fit: cover; border-radius: 50%; }
.series-profile .profile-heading { margin-bottom: 24px; }
.series-description { max-width: 720px; }

.cms .series-image { max-width: 100%; max-height: 300px; object-fit: contain; }
.series-related h3 { margin: 24px 0 12px; }
.series-related h3:first-child { margin-top: 0; }
.series-sharing { overflow-wrap: anywhere; }
.sharing-qr { display: block; max-width: 100%; height: auto; }
.inline-editor input[type=radio] { display: inline-block; width: auto; margin: 0 8px 0 0; }
.series-visibility-option { margin-bottom: 24px; }
.series-visibility-option label { display: flex; align-items: center; gap: 10px; }
[data-series-visibility-form] input[type=radio] { appearance: auto; display: inline-block; flex: none; width: auto; height: auto; padding: 0; border: initial; border-radius: initial; margin: 0; }
.series-visibility-description { margin: 4px 0 0 23px; color: #626262; font-weight: 400; }

.series-attachments { margin-top: 0; }
.series-attachments > ul { margin-top: 0; }
.series-sharing h3 { margin: 24px 0 12px; }
.series-sharing h3:first-child { margin-top: 0; }

.public-site .organisation-title-link, .organisation-preview .organisation-title-link { color: var(--organisation-title, var(--ink)); }
.organisation-preview h2 { font: 400 clamp(1.5rem, 2.5vw, 1.875rem)/1.25 var(--organisation-font, Helvetica, Arial, sans-serif); margin: 0 0 24px; }
.organisation-preview h3 { font: var(--highlight); }
.event-profile-section { margin-top: 32px; }
.event-profile .event-who { margin: 0; }
.event-profile .profile-field > p { margin: 0; }
.organisation-preview .contributor-profile { display: flex; gap: 24px; margin: 24px 0; }
.organisation-preview .contributor-image { width: 80px; height: 80px; object-fit: cover; }

[data-event-time-mode] input[type=radio], input[type=radio][data-event-time-mode] { appearance: auto; display: inline-block; width: auto; padding: 0; margin: 0 10px 0 0; }
.event-location-links { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 24px; }
.event-contributors { list-style: none; padding: 0; margin: 0; }
.event-contributors li { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.event-contributors img, .contributor-avatar { width: 40px; height: 40px; object-fit: cover; border-radius: 50%; }
.event-action { margin-bottom: 24px; }
.event-action .follow-button { border: 1px solid var(--ink); border-radius: 8px; padding: 8px 20px; background: color-mix(in srgb, var(--ink) 8%, var(--paper)); color: var(--ink); text-decoration: none; font: var(--highlight); }
.event-cancelled-time { text-decoration: line-through; }

.organisation-preview .event-series, .organisation-preview .event-updates, .organisation-preview .event-contributor-section, .organisation-preview .file-section { display: grid; grid-template-columns: 1fr 2fr; gap: 32px; border-top: 1px solid var(--line); padding: 32px 0; }
@media (max-width: 700px) { .organisation-preview .event-series, .organisation-preview .event-updates, .organisation-preview .event-contributor-section, .organisation-preview .file-section { grid-template-columns: 1fr; gap: 16px; } }

.event-when-where { margin-bottom: 32px; }
.event-when p { font: 700 clamp(1.25rem, 2vw, 1.5rem)/1.5 var(--organisation-font, Helvetica, Arial, sans-serif); }
.event-when .event-timezone, .event-contributor-role, .event-download-caption { font: 400 .875rem/1.5 var(--organisation-font, Helvetica, Arial, sans-serif); color: color-mix(in srgb, var(--ink) 65%, var(--paper)); }
.event-location { gap: 8px 24px; }
.event-location .event-location-links { margin: 0; gap: 8px 16px; font: 400 .875rem/1.5 var(--organisation-font, Helvetica, Arial, sans-serif); }
.event-location-links .social-link { font: inherit; }
.event-location-links svg { width: 16px; height: 16px; }
.event-actions .event-action[hidden] { display: none; }
.event-actions .follow-button { display: inline-block; cursor: pointer; }

.follow-dialog { position:static; width:100%; max-width:620px; margin:20px 0; padding:28px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink); font:var(--body); }
.follow-dialog:modal { position:fixed; margin:auto; width:calc(100% - 32px); max-height:calc(100dvh - 32px); overflow-y:auto; box-shadow:0 16px 64px rgb(0 0 0 / 25%); }
.follow-dialog::backdrop { background:rgb(0 0 0 / 45%); }
.follow-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.follow-dialog-header h2 { color:var(--organisation-title, var(--ink)); margin:0; }
.follow-dialog a { color:var(--ink); }
body .follow-dialog .button-primary { background:var(--ink); color:var(--paper); border-color:var(--ink); }
body .follow-dialog .button-primary:hover { background:color-mix(in srgb, var(--ink) 85%, var(--paper)); color:var(--paper); border-color:var(--ink); }
body .follow-dialog .button-secondary { color:var(--ink); background:transparent; border-color:var(--ink); }
body .follow-dialog .button-secondary:hover { background:color-mix(in srgb, var(--ink) 10%, var(--paper)); color:var(--ink); border-color:var(--ink); }
body .follow-dialog :focus-visible { outline-color:var(--ink); }
.follow-dialog .calendar-options > p:first-child { display:flex; flex-wrap:wrap; gap:12px; }
@media(max-width:480px) { .follow-dialog { padding:20px; } .follow-dialog-header { align-items:flex-start; } }

.follow-dialog-actions { display:flex; justify-content:flex-end; margin-top:24px; }
body .follow-dialog [hidden] { display:none; }
.event-follow-options { margin:24px 0 32px; }
.event-follow-choice { margin-bottom:18px; }
.event-follow-choice form { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; }
.event-follow-choice .meta { margin:6px 0 0; font-size:.875rem; opacity:.8; }
.event-follow-choice .follow-button { border:1px solid var(--ink); border-radius:8px; padding:8px 16px; font:inherit; text-decoration:none; }

.profile-follow-actions { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.profile-follow-actions form { margin:0; }
.profile-follow-actions .follow-help-trigger { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border:1px solid currentColor; border-radius:50%; color:var(--ink); font:var(--highlight); text-decoration:none; }
.profile-follow-actions .follow-help-trigger:hover { background:color-mix(in srgb, var(--ink) 10%, var(--paper)); }

.follow-dialog h2[tabindex="-1"]:focus { outline:none; }

.event-follow-options > .follow-button, .event-follow-options > [data-follow-target] .follow-button { display:inline-block; border:1px solid var(--ink); border-radius:8px; padding:8px 16px; font:inherit; text-decoration:none; }
.event-calendar-status { margin:0 0 12px; }
.follow-suggestions { margin:24px 0; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.follow-suggestions h3 { font:var(--highlight); margin:0 0 16px; }

/* Keep each follow's explanation and action together, separate from other follows. */
.manage-follows-dialog > .event-follow-choice { display:grid; gap:8px; margin:0; }
.manage-follows-dialog > .event-follow-choice + .event-follow-choice { margin-top:24px; padding-top:24px; border-top:1px solid var(--line); }
.manage-follows-dialog > .event-follow-choice > p { margin:0; }
.manage-follows-dialog > .event-follow-choice > form { margin-top:6px; }
.manage-follows-dialog > .event-follow-choice > [data-follow-status]:empty { display:none; }

.event-contributor-details { min-width:0; overflow-wrap:anywhere; }
.event-contributor-role { display:block; }

/* Font titles share one live sample rather than repeating preview sentences. */
.branding-font-preview { padding:16px 0; font-size:1.5rem; line-height:1.5; }
.branding-font-groups { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:24px; }
.branding-font-groups fieldset { min-width:0; margin:0; padding:0; border:0; }
.branding-font-groups legend { font-weight:600; margin-bottom:12px; }
.branding-font-options { display:grid; gap:8px; }
.branding-font-option { display:flex; align-items:center; gap:10px; padding:8px; border:1px solid var(--brand-grey); border-radius:8px; cursor:pointer; }
.branding-font-option input { flex:none; margin:0; }
