/* Header: App Bar. Logo left, menu centered, search + buttons right; phones get a labeled Menu button. */
.cc-appbar-wrap { --cc-appbar-ink: var(--color-black, #111); }
.cc-appbar [hidden] { display: none !important; }
.cc-appbar.header { height: auto; width: 100%; max-width: none; display: flex; align-items: center; gap: 24px; padding: 14px clamp(16px, 2.5vw, 40px); background: var(--cc-appbar-bg); color: var(--cc-appbar-ink); box-sizing: border-box; }
.cc-appbar--ink-dark { --cc-appbar-ink: var(--color-black, #111); }
.cc-appbar--ink-light { --cc-appbar-ink: #fff; }
.cc-appbar a:not(.button), .cc-appbar button:not(.button) { color: inherit; }
.header-fixed .cc-appbar.header { height: auto !important; }

/* Glass */
.cc-appbar--glass { background: color-mix(in srgb, var(--cc-appbar-bg) 72%, transparent); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); }
.cc-appbar--glass.cc-appbar--ink-dark { background: color-mix(in srgb, var(--cc-appbar-bg, var(--color-white, #fff)) 72%, transparent); }
@supports not (backdrop-filter: blur(1px)) { .cc-appbar--glass { background: var(--cc-appbar-bg); } }
.cc-appbar--glass.cc-appbar--ink-dark[style*="transparent"] { background: color-mix(in srgb, var(--color-white, #fff) 70%, transparent); }
.cc-appbar--glass.cc-appbar--ink-light[style*="transparent"] { background: color-mix(in srgb, #000 35%, transparent); }
@supports not (backdrop-filter: blur(1px)) {
	.cc-appbar--glass.cc-appbar--ink-dark[style*="transparent"] { background: var(--color-white, #fff); }
	.cc-appbar--glass.cc-appbar--ink-light[style*="transparent"] { background: #000; }
}

/* Scrolled transparent headers (theme-init adds .header-display) */
.cc-appbar.header-display { --cc-appbar-bg: var(--color-white, #fff); --cc-appbar-ink: var(--color-black, #111); background: var(--cc-appbar-bg); }

/* Compact on scroll */
.header-wrapper:not(.header-static) .cc-appbar.header.header-compact { height: auto !important; padding-top: 8px !important; padding-bottom: 8px !important; }
.header-wrapper:not(.header-static) .cc-appbar.header-compact .cc-appbar__logo { scale: var(--cc-hdr-logo-scale, .8); transform-origin: 0 50%; }
.cc-appbar__logo { flex: 0 0 auto; margin: 0; }
.cc-appbar__logo a { display: inline-flex; align-items: center; font-family: var(--font-titles, inherit); font-weight: 700; text-decoration: none; }

/* Menu */
.cc-appbar__nav { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; }
.cc-appbar .main-nav { width: auto; text-align: center; margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 22px; }
.cc-appbar .main-nav > li { display: inline-flex; position: relative; margin: 0; }
.cc-appbar .main-nav > li > a { color: inherit; padding: 8px 2px; }
.cc-appbar .main-nav .sub-menu { display: none; }
.cc-appbar .main-nav li:hover > .sub-menu, .cc-appbar .main-nav li:focus-within > .sub-menu { display: block; }

/* Actions */
.cc-appbar__actions { margin-left: auto; display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.cc-appbar__buttons { display: flex; align-items: center; gap: 10px; }
.cc-appbar__icon, .cc-appbar__menu-btn, .cc-appbar-search__close, .cc-appbar-menu__close { appearance: none; background: transparent; border: 0; cursor: pointer; min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px; border-radius: 999px; font: inherit; font-weight: 600; }
.cc-appbar__svg { display: block; width: 24px; height: 24px; }
.cc-appbar__menu-label { font-size: 1.5rem; line-height: 1; }
.cc-appbar a:focus-visible, .cc-appbar button:focus-visible, .cc-appbar-search a:focus-visible, .cc-appbar-search button:focus-visible, .cc-appbar-search input:focus-visible,
.cc-appbar-menu a:focus-visible, .cc-appbar-menu button:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Phones and tablets */
@media (max-width: 1099.98px) {
	.cc-appbar__nav, .cc-appbar__buttons, .cc-appbar__mode { display: none !important; }
	.cc-appbar__menu-btn { padding-inline: 12px; }
	.cc-appbar-nojs { display: block; padding: 8px 16px; background: var(--color-white, #fff); }
	.cc-appbar-nojs ul { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 0; list-style: none; }
}
@media (min-width: 1100px) {
	.cc-appbar__menu-btn, .cc-appbar-nojs { display: none !important; }
}

/* Dialogs */
html.cc-appbar-locked { overflow: hidden; }
.cc-appbar-search { position: fixed; inset: 0 0 auto 0; margin: 0; width: 100%; max-width: none; border: 0; padding: clamp(20px, 4vw, 48px) clamp(16px, 4vw, 48px); background: var(--color-white, #fff); color: var(--color-black, #111); box-sizing: border-box; }
.cc-appbar-search::backdrop, .cc-appbar-menu::backdrop { background: rgba(0, 0, 0, .5); }
.cc-appbar-search__form { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-right: 56px; }
.cc-appbar-search__label { flex: 1 0 100%; font-weight: 700; font-size: 1.6rem; }
.cc-appbar-search input[type="search"] { flex: 1 1 260px; min-height: 52px; font-size: 1.8rem; padding: 0 16px; border: 2px solid currentColor; background: transparent; color: inherit; border-radius: 8px; }
.cc-appbar-search__close { position: absolute; top: 12px; right: 12px; }
.cc-appbar-menu { position: fixed; inset: 0 0 0 auto; margin: 0; width: min(420px, 100%); max-width: none; height: 100dvh; max-height: none; border: 0; padding: 0 0 32px; background: var(--color-white, #fff); color: var(--color-black, #111); overflow: auto; box-sizing: border-box; }
@media (max-width: 599.98px) { .cc-appbar-menu { width: 100%; } }
.cc-appbar-menu__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; }
.cc-appbar-menu__name { font-family: var(--font-titles, inherit); font-weight: 700; font-size: 1.8rem; }
.cc-appbar-menu nav, .cc-appbar-menu__buttons, .cc-appbar-menu > .ct-cm-toggle, .cc-appbar-menu > button:not(.cc-appbar-menu__close) { margin: 12px 20px 0; }
.cc-appbar-menu__list { list-style: none; margin: 0; padding: 0; }
.cc-appbar-menu__list li { margin: 0; border-bottom: 1px solid color-mix(in srgb, currentColor 15%, transparent); }
.cc-appbar-menu__list a { display: block; padding: 14px 0; font-size: 2rem; font-weight: 600; color: inherit; text-decoration: none; }
.cc-appbar-menu__list .sub-menu { list-style: none; margin: 0 0 8px; padding: 0 0 0 16px; }
.cc-appbar-menu__list .sub-menu a { font-size: 1.7rem; font-weight: 400; padding: 8px 0; }
.cc-appbar-menu__buttons { display: grid; gap: 10px; }
.cc-appbar-nojs ul { list-style: none; }

@media (prefers-reduced-motion: reduce) { .cc-appbar, .cc-appbar * , .cc-appbar-search, .cc-appbar-menu { transition: none !important; animation: none !important; } }
