/* Header bar */
.site-header {
  background:#fff;
  border-bottom:1px solid #e5e7eb;
  position:sticky;
  top:0;
  z-index:1000;
}

.site-header__inner {
  display:flex;
  align-items:center;
  justify-content:space-between;

}

/* Brand */
.brand {
  display:flex;
  align-items:center;
  gap:.5rem;
  text-decoration:none;
  color:#111827;
}

.brand__logo {
  display:block;
  height:48px;   /* <- force the visual size */
  width:auto;    /* keep aspect ratio */
  /* remove any old width:250px here */
}

/* User box */
.userbox { position:relative; }
.userbox__button {
  display:flex; align-items:center; gap:.5rem;
  border:0; background:transparent; cursor:pointer; padding:.25rem .5rem;
  border-radius:.5rem;
}
.userbox__button:hover { background:#f3f4f6; }
.userbox__name { color:#111827; font-weight:600; }
.chev { color:#6b7280; }

/* Avatar */
.avatar { width:32px; height:32px; border-radius:50%; background:#e2efff; color:#000;
  display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; }
.avatar--initials { line-height:1; }


/* Dropdown menu */
.userbox__menu {
  position:absolute; right:0; top:calc(100% + .35rem);
  background:#fff; border:1px solid #e5e7eb; border-radius:.5rem;
  min-width:160px; box-shadow:0 12px 30px rgba(0,0,0,.12);
  padding:.35rem; display:none;
}
.userbox__menu.show { display:block; }
.userbox__menu a {
  display:block; padding:.5rem .6rem; border-radius:.35rem; text-decoration:none; color:#111827;
}
.userbox__menu a:hover { background:#f3f4f6; }

/* …keep your existing styles… */
.userbox__menu .disclosure {
  width: 100%; display:flex; align-items:center; justify-content:space-between;
  padding:.5rem .75rem; border-radius:6px; background:transparent; border:0; cursor:pointer;
}
.userbox__menu .disclosure:hover { background:#f3f4f6; }
.chev-sm { width:14px; height:14px; transition:transform .18s ease; transform:rotate(-90deg); }
.chev-sm.rot { transform:rotate(0deg); } /* down */
.userbox__collapse { display:none; padding:.25rem 0 .35rem; }
.userbox__collapse.show { display:block; }
.userbox__menu a.subitem { padding:.4rem .75rem .4rem 1.75rem; }
.userbox__menu a.active { font-weight:600; }

/* Make "Calendars" match Settings/Logout style */
.userbox__menu .disclosure {
  background: transparent;
  color: #111827;         /* same as the links */
  font: inherit;
  font-weight: normal;
}

/* Submenu text a bit smaller */
.userbox__menu a.subitem {
  font-size: 0.9rem;
}
/* Calendar context bar (only shows when viewing someone else's) */
.context-bar {
  background:#f9fafb;
  border-bottom:1px solid #e5e7eb;
}

.context-bar__link {
  text-decoration:none;
  font-weight:600;
  color:#111827;
}
.context-bar__link:hover { text-decoration:underline; }

/* 1) Center the “currently viewing …” bar (works the same in Firefox & Chrome) */
.context-bar__inner {
  text-align: center;
  padding: 0.4rem 0;
  font-size: 0.9rem;
  color: #4b5563;
}

/* 2) Normalize the Calendars disclosure row inside the menu (Firefox was styling it like a big primary button) */
.userbox__menu .disclosure {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #111827;
  font: inherit;
  line-height: 1.2;
  padding: .5rem .75rem;
  border-radius: 6px;
  appearance: none;
  -moz-appearance: none;
}
.userbox__menu .disclosure:hover { background:#f3f4f6; }

/* --- Fix 1: center the viewing bar in all browsers --- */
.context-bar .context-bar__inner {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 0.4rem 0;
  font-size: 0.9rem;
  color: #4b5563;
  text-align: center;
}

/* --- Fix 2: make the Calendars disclosure look like a menu row (Firefox was styling it like a primary button) --- */
.userbox__menu .disclosure {
  all: unset;                      /* nuke UA + Pico button styles (incl. Firefox) */
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: .5rem .75rem;
  border-radius: 6px;
  cursor: pointer;
  color: #111827;
  line-height: 1.2;
}

.userbox__menu .disclosure:hover { background: #f3f4f6; }
.userbox__menu .disclosure:focus { outline: 2px solid #93c5fd; outline-offset: 2px; } /* optional focus */

/* --- Fix 3: keep the Calendars chevron aligned neatly --- */
.userbox__menu .disclosure {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;                /* space between text and arrow */
  padding: .5rem .75rem;
}

.userbox__menu .disclosure svg.chev-sm {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  color: #6b7280;
  transition: transform .18s ease;
}

.userbox__menu .disclosure svg.chev-sm.rot {
  transform: rotate(0deg);    /* down */
}

/* Bring the Calendars chevron back beside the text */
.userbox__menu .disclosure {
  width: auto !important;
  justify-content: flex-start !important;
  gap: .45rem !important;      /* space between text and arrow */
  padding: .5rem .75rem !important;
}

.userbox__menu .disclosure .chev-sm {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Make the logo actually fill the header */
.site-header img.brand__logo {
  height: 64px !important;   /* tweak 64/72 until it feels right */
  width: auto !important;
  max-height: none !important;
  display: block;
}

body > header.site-header {
  padding-block: 0;        /* shorthand for padding-top & padding-bottom */
}
