/* App shell: keep every colour tied to the active theme. */
#legacy-sidebar:not([hidden]) {
  width: 248px !important;
  padding: 12px 10px calc(92px + env(safe-area-inset-bottom)) !important;
  background: var(--appearance-sidebar-nav, var(--appearance-nav, var(--green-dark))) !important;
  color: #ffffff !important;
  border-right: 1px solid color-mix(in srgb, white 15%, transparent) !important;
  box-shadow: 8px 0 24px color-mix(in srgb, var(--ink) 15%, transparent) !important;
  transition: width .2s ease, padding .2s ease;
}
#legacy-sidebar .sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  margin: 0 4px 12px;
  padding: 0 8px;
  font-size: .91rem;
  font-weight: 800;
  letter-spacing: -.025em;
  color: inherit;
}
#legacy-sidebar .sidebar-brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 9px;
  background: var(--appearance-accent, var(--green));
  color: var(--appearance-onaccent, white);
  font-weight: 800;
}
#legacy-sidebar .sidebar-card { padding: 0; background: transparent !important; color: #fff !important; border: 0 !important; box-shadow: none !important; }
#legacy-sidebar .sidebar-label {
  padding: 12px 11px 5px;
  color: #fff;
  opacity: .82;
  font-size: .63rem;
  letter-spacing: .11em;
}
#legacy-sidebar .sidebar-divider {
  height: 1px;
  margin: 10px 9px;
  background: color-mix(in srgb, currentColor 18%, transparent);
}
#legacy-sidebar .sidebar-item {
  min-height: 38px;
  gap: 9px;
  padding: 5px 9px;
  border-radius: 9px;
  color: #fff !important;
  font-size: .8rem;
  line-height: 1.25;
  box-shadow: none;
}
#legacy-sidebar .sidebar-item-icon { width: 27px; height: 27px; color: #fff !important; }
#legacy-sidebar .sidebar-item > span:not(.sidebar-item-icon),
#legacy-sidebar .sidebar-item > span:not(.sidebar-item-icon) * { color: #fff !important; }
#legacy-sidebar .sidebar-item-icon svg { width: 18px; height: 18px; color: #fff; }
#legacy-sidebar .sidebar-item:hover,
#legacy-sidebar .sidebar-item:focus-visible {
  background: color-mix(in srgb, white 12%, transparent);
  color: inherit !important;
  box-shadow: none;
}
#legacy-sidebar .sidebar-item.active,
#legacy-sidebar .sidebar-item[aria-current="page"] {
  background: color-mix(in srgb, white 18%, transparent);
  color: inherit !important;
  font-weight: 750;
}
#legacy-sidebar .sidebar-item.active::before,
#legacy-sidebar .sidebar-item[aria-current="page"]::before {
  content: "";
  position: absolute;
  left: 0;
  width: 3px;
  height: 22px;
  border-radius: 0 3px 3px 0;
  background: var(--appearance-accent, var(--green));
}
#legacy-sidebar .sidebar-item { position: relative; }
#legacy-sidebar .sidebar-item:focus-visible { outline: 2px solid var(--appearance-accent, var(--green)); outline-offset: -2px; }

/* Full → icons → hidden. The reveal button stays at the visible edge. */
body .nav-reveal-left { top: 42%; width: 30px; height: 44px; left: 0; border-radius: 0 10px 10px 0; }
body .nav-reveal-left svg { transform: none !important; }
body .nav-reveal-left[data-nav-state="full"] { left: 248px !important; }
body .nav-reveal-left[data-nav-state="icons"] { left: 68px !important; }
body .nav-reveal-left[data-nav-state="hidden"] { left: 0 !important; }
.legacy-layout.sidebar-icons #legacy-sidebar:not([hidden]) { width: 68px !important; padding-inline: 8px !important; }
.legacy-layout.sidebar-icons .sidebar-brand { justify-content: center; margin-inline: 0 !important; padding: 0 !important; }
.legacy-layout.sidebar-icons .sidebar-brand > span:not(.sidebar-brand-mark),
.legacy-layout.sidebar-icons #legacy-sidebar .sidebar-label,
.legacy-layout.sidebar-icons #legacy-sidebar .sidebar-item > span:not(.sidebar-item-icon) { display: none !important; }
.legacy-layout.sidebar-icons #legacy-sidebar .sidebar-item { justify-content: center; padding-inline: 5px; min-height: 44px; }
.legacy-layout.sidebar-icons #legacy-sidebar .sidebar-item-icon { width: 30px; height: 30px; }
.legacy-layout.sidebar-icons #legacy-sidebar .sidebar-divider { margin: 8px 6px; }
@media (min-width: 1101px) {
  main.fb-layout.legacy-layout.sidebar-expanded { padding-left: 264px !important; }
  main.fb-layout.legacy-layout.sidebar-icons { padding-left: 84px !important; }
  main.fb-layout.legacy-layout:not(.sidebar-expanded):not(.sidebar-icons) { padding-left: 32px !important; }
  main.fb-layout.legacy-layout.event-tools-layout.sidebar-expanded { padding-left: 248px !important; }
  main.fb-layout.legacy-layout.event-tools-layout.sidebar-icons { padding-left: 68px !important; }
}
@media (max-width: 1100px) {
  body .nav-reveal-left[data-nav-state="full"] { left: min(248px, calc(100vw - 52px)) !important; }
  main.fb-layout.legacy-layout.sidebar-icons { padding-left: 78px !important; }
  #legacy-sidebar:not([hidden]) { width: min(248px, calc(100vw - 52px)) !important; }
  .legacy-layout.sidebar-icons #legacy-sidebar:not([hidden]) { width: 68px !important; }
}
.event-tools-bar #toggle-left-nav[data-nav-state="icons"] [data-nav-label] { display: none; }
.event-tools-layout.sidebar-icons #legacy-sidebar:not([hidden]) { width: 68px !important; }

/* Shared workspace language from the public feature previews. */
.fb-center:has(.workspace-nav) { padding: 20px clamp(12px, 2.3vw, 32px) 64px; }
.workspace-nav { margin-bottom: 10px; padding: 4px; border: 1px solid var(--border-soft); border-radius: 12px; background: var(--white); box-shadow: none; }
.workspace-nav a { min-height: 35px; display: inline-flex; align-items: center; padding: 6px 11px; border-radius: 8px; font-size: .78rem; }
.workspace-nav a[aria-current="page"] { background: var(--green-bg); color: var(--ink); border-color: transparent; }
.workspace-page, .drive-workspace {
  border: 1px solid var(--border-soft) !important;
  border-radius: 14px !important;
  background: var(--white) !important;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 6%, transparent) !important;
}
.drive-workspace { padding: 14px clamp(12px, 1.6vw, 22px) 24px !important; }
.drive-workspace .drive-toolbar { gap: 8px 14px; padding-bottom: 10px; border-bottom: 1px solid var(--border-soft); }
.drive-workspace .drive-title { font-size: clamp(1.3rem, 2.1vw, 1.65rem); letter-spacing: -.035em; }
.drive-workspace .drive-toolbar-actions .btn { border-radius: 8px; box-shadow: none; }
.drive-workspace .drive-grid.drive-list { border-radius: 10px; }
.drive-workspace .drive-row { min-height: 55px !important; padding: 7px 10px !important; }
.drive-workspace .drive-row-icon { background: var(--green-bg); color: var(--ink); }
.drive-workspace .drive-row-text strong { font-size: .86rem; }
.drive-workspace .drive-actions button:hover,
.drive-workspace .drive-actions a:hover { background: var(--green-bg); }
.availability-page {
  max-width: 1000px !important;
  margin-inline: auto;
  padding: clamp(14px, 2vw, 28px);
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  background: var(--white);
  color: var(--ink);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 6%, transparent);
}
.availability-page.availability-new { max-width: 760px !important; }
.availability-heading { align-items: center; gap: 12px; margin-bottom: 18px; }
.availability-heading h1 { margin: 0; font-size: clamp(1.35rem, 2vw, 1.75rem); letter-spacing: -.035em; }
.availability-heading p { margin: 3px 0 0; color: var(--ink-soft); font-size: .82rem; }
.availability-heading .btn { flex: 0 0 auto; border-radius: 8px; }
.availability-list { border: 1px solid var(--border-soft); border-radius: 10px; overflow: hidden; }
.availability-list .room-card { margin: 0; padding: 12px 14px; border: 0; border-bottom: 1px solid var(--border-soft); border-radius: 0; box-shadow: none; background: var(--white); }
.availability-list .room-card:last-child { border-bottom: 0; }
.availability-list .room-card:hover { background: var(--green-bg); }
.availability-page > .card { border: 1px solid var(--border-soft); border-radius: 10px; box-shadow: none; }
.availability-page table { width: 100%; }
.availability-page table thead { background: var(--green-bg); }
.availability-page table tbody tr:hover { background: var(--green-bg); }
.availability-page table th, .availability-page table td { vertical-align: middle; }
@media (max-width: 700px) {
  .fb-center:has(.workspace-nav) { padding: 12px 8px 48px; }
  .workspace-nav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
  .workspace-nav a { flex: 0 0 auto; }
  .drive-workspace { padding: 12px 9px 18px !important; }
  .availability-page { padding: 12px 9px; }
  .availability-heading { align-items: flex-start; flex-wrap: wrap; }
  .availability-heading .btn { min-height: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  #legacy-sidebar:not([hidden]) { transition: none; }
}

/* The news feed is one themed reading surface. */
.feed-stream {
  background: var(--feed-bg, var(--beige));
  color: var(--feed-ink, var(--ink));
  border: 1px solid color-mix(in srgb, var(--feed-ink) 20%, transparent);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin: 12px 0 24px;
}
.feed-stream .feed-toolbar {
  margin: 0 !important;
  padding: 14px 18px;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--feed-ink) 20%, transparent) !important;
  border-radius: 0 !important;
  color: var(--feed-ink, var(--ink));
}
.feed-stream .feed-toolbar h1, .feed-stream .feed-toolbar .eyebrow { color: var(--feed-ink, var(--ink)); }
.feed-stream .feed-post {
  background: transparent !important;
  color: var(--feed-ink, var(--ink));
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--feed-ink) 20%, transparent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}
.feed-stream .feed-post:last-of-type { border-bottom: 0 !important; }
.feed-stream .feed-post-author, .feed-stream .feed-post-body,
.feed-stream .feed-post-body a, .feed-stream .feed-action-btn,
.feed-stream .comment-author, .feed-stream .comment-text { color: var(--feed-ink) !important; }
.feed-stream .feed-post-meta, .feed-stream .feed-post-stats,
.feed-stream .comment-time, .feed-stream .text-muted { color: var(--feed-muted) !important; }
.feed-stream .feed-post-actions-bar, .feed-stream .comments-section {
  border-color: color-mix(in srgb, var(--feed-ink) 20%, transparent) !important;
}
.feed-stream .feed-action-btn:hover, .feed-stream .comment-bubble {
  background: color-mix(in srgb, var(--feed-ink) 9%, var(--feed-bg)) !important;
}
.feed-stream .feed-action-btn.liked { color: var(--feed-ink) !important; }
.feed-stream > .card, .feed-stream #post-modal { background: var(--feed-bg, var(--beige)); color: var(--feed-ink, var(--ink)); box-shadow: none; }
.feed-stream > [data-open-composer] { margin: 0 !important; border-radius: 0; color: var(--feed-ink, var(--ink)); }

/* Circular menu: use the selected theme with readable labels on every surface. */
#petal-menu { background: var(--beige) !important; color: var(--feed-ink, var(--ink)) !important; }
#petal-menu .petal-heading h2, #petal-menu .petal-heading p { color: var(--feed-ink, var(--ink)) !important; }
#petal-menu .petal:not([aria-current]) { background: var(--petal-bg, var(--beige)) !important; color: var(--petal-ink, var(--ink)) !important; border-color: color-mix(in srgb, currentColor 25%, transparent) !important; }
#petal-menu .petal:not([aria-current]):hover, #petal-menu .petal:not([aria-current]):focus-visible { background: var(--petal-hover-bg, var(--green-bg)) !important; color: var(--petal-hover-ink, var(--ink)) !important; }
#petal-menu .petal[aria-current] { background: var(--green) !important; color: #fff !important; }
#petal-menu .petal-shortcuts a { background: var(--white) !important; color: var(--petal-shortcut-ink, var(--ink)) !important; }
#petal-menu .petal-shortcuts a[aria-current] { background: var(--green) !important; color: #fff !important; }
#petal-menu .petal-shortcuts a:not([aria-current]):hover { background: var(--petal-hover-bg, var(--green-bg)) !important; color: var(--petal-hover-ink, var(--ink)) !important; }