/*
 * HUCIAL final integration layer.
 * Loaded after extension styles on purpose, so validated extensions retain
 * their functionality while receiving the HUCIAL visual language.
 */

/* ---------- Forum Portal 1.2.x ---------- */
body .forumportal-shell,
body .forumportal-page {
	color: var(--hucial-ink);
	font-family: inherit;
}

body .forumportal-page {
	max-width: var(--hucial-content);
	margin-inline: auto;
}

body .forumportal-topbar {
	margin-bottom: 18px;
	padding: 16px 18px !important;
	border: 1px solid var(--hucial-mist) !important;
	border-radius: 16px !important;
	background: var(--hucial-white) !important;
	box-shadow: var(--hucial-shadow-sm) !important;
	color: var(--hucial-ink) !important;
}

body .forumportal-topbar__eyebrow {
	color: var(--hucial-teal) !important;
	font-weight: 850 !important;
	letter-spacing: .08em;
}

body .forumportal-page__title,
body .forumportal-section-head__title,
body .forumportal-card__title,
body .forumportal-story__title,
body .forumportal-sidecard__title,
body .forumportal-hero__title {
	color: var(--hucial-ink) !important;
	font-family: inherit !important;
	letter-spacing: -.015em;
}

body .forumportal-page__title {
	font-size: clamp(1.85rem, 4vw, 2.45rem) !important;
	font-weight: 760 !important;
}

body .forumportal-topbar__link,
body .forumportal-section-head a,
body .forumportal-headlines__link,
body .forumportal-card__title a,
body .forumportal-story__title a,
body .forumportal-hero__title a {
	color: var(--hucial-teal) !important;
	text-decoration-color: rgba(0, 124, 120, .35) !important;
}

body .forumportal-topbar__link:hover,
body .forumportal-headlines__link:hover,
body .forumportal-card__title a:hover,
body .forumportal-story__title a:hover,
body .forumportal-hero__title a:hover {
	color: var(--hucial-midnight) !important;
}

body .forumportal-layout {
	gap: 20px !important;
}

body .forumportal-hero,
body .forumportal-card,
body .forumportal-sidecard,
body .forumportal-story,
body .forumportal-mostread,
body .forumportal-headlines,
body .forumportal-custom-html {
	border: 1px solid var(--hucial-mist) !important;
	border-radius: 16px !important;
	background: var(--hucial-white) !important;
	box-shadow: var(--hucial-shadow-sm) !important;
	color: var(--hucial-ink) !important;
}

body .forumportal-hero {
	overflow: hidden;
}

body .forumportal-hero__media,
body .forumportal-card__media,
body .forumportal-story__media {
	background: var(--hucial-cloud) !important;
}

body .forumportal-hero__content,
body .forumportal-card__content,
body .forumportal-sidecard,
body .forumportal-story {
	color: var(--hucial-ink) !important;
}

body .forumportal-hero__excerpt,
body .forumportal-card__excerpt,
body .forumportal-story__meta,
body .forumportal-story__excerpt,
body .forumportal-sidecard__period,
body .forumportal-sidecard__text,
body .forumportal-headlines__meta {
	color: var(--hucial-slate) !important;
}

body .forumportal-hero__cta,
body .forumportal-topbar__actions a.button,
body .forumportal-pagination a {
	border-color: var(--hucial-teal) !important;
	border-radius: 10px !important;
	background: var(--hucial-teal) !important;
	color: var(--hucial-white) !important;
	font-weight: 760 !important;
	box-shadow: none !important;
}

body .forumportal-hero__cta:hover,
body .forumportal-topbar__actions a.button:hover,
body .forumportal-pagination a:hover {
	border-color: var(--hucial-teal-bright) !important;
	background: var(--hucial-teal-bright) !important;
	color: var(--hucial-ink) !important;
}

body .forumportal-card__badge,
body .forumportal-hero__labels > *,
body .forumportal-story__date {
	border-color: transparent !important;
	background: var(--hucial-coral) !important;
	color: var(--hucial-ink) !important;
	font-weight: 820 !important;
}

body .forumportal-story__icon {
	border-color: var(--hucial-mist) !important;
	background: var(--hucial-cloud) !important;
	color: var(--hucial-teal) !important;
}

body .forumportal-section-head {
	margin-top: 24px !important;
	margin-bottom: 10px !important;
	padding-bottom: 9px !important;
	border-bottom: 1px solid var(--hucial-mist) !important;
}

body .forumportal-headlines__item,
body .forumportal-mostread__item {
	border-color: var(--hucial-mist) !important;
}

body .forumportal-pagination__links {
	gap: 6px !important;
}

body .forumportal-pagination .active,
body .forumportal-pagination [aria-current="page"] {
	border-color: var(--hucial-teal) !important;
	background: var(--hucial-teal) !important;
	color: var(--hucial-white) !important;
}

/* ---------- phpBB Pages / extension-neutral content ---------- */
body .phpbb_pages,
body .pages-page,
body .pages-content,
body [class*="pages-"] .panel {
	color: var(--hucial-ink);
}

/* ---------- Generic extension harmonisation ---------- */
body .panel-container,
body .extension-panel,
body .marketplace-panel,
body [class*="marketplace"] .panel {
	border-color: var(--hucial-mist);
	background: var(--hucial-white);
	color: var(--hucial-ink);
}

/* Do not allow third-party themes to erase the keyboard focus treatment. */
body :focus-visible {
	outline: 3px solid var(--hucial-teal) !important;
	outline-offset: 3px !important;
}

@media (max-width: 760px) {
	body .forumportal-layout {
		gap: 14px !important;
	}

	body .forumportal-topbar,
	body .forumportal-hero,
	body .forumportal-card,
	body .forumportal-sidecard,
	body .forumportal-story,
	body .forumportal-mostread,
	body .forumportal-headlines,
	body .forumportal-custom-html {
		border-radius: 12px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body .forumportal-page *,
	body .forumportal-page *::before,
	body .forumportal-page *::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}

/* ---------- HUCIAL 1.0.1 refinements ---------- */

/* Semantic homepage title requested for the forum index. */
.hucial-board-home-header {
	margin: 4px 0 22px;
}

.hucial-board-home-title {
	margin: 0;
	color: var(--hucial-ink);
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -.025em;
}

.hucial-board-home-title > span:first-child {
	color: var(--hucial-teal);
}

.hucial-title-separator {
	color: var(--hucial-slate);
	font-weight: 650;
}

/* phpBB's language-specific online ribbon must render once, never as a tile. */
body .post.online,
body .online {
	background-repeat: no-repeat !important;
	background-position: 100% 0 !important;
}

/* Keep both navigation rows inside their own viewport on narrow screens.
   This prevents the whole page/footer from being shifted horizontally. */
#nav-main {
	max-width: 100%;
}

@media (max-width: 760px) {
	.hucial-product-nav-inner,
	#page-header > .navbar > .inner,
	.hucial-page-header > .navbar > .inner {
		max-width: 100%;
	}

	.hucial-product-nav-inner {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.hucial-product-nav-inner::-webkit-scrollbar {
		display: none;
	}

	#nav-main {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: visible;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	#nav-main::-webkit-scrollbar {
		display: none;
	}

	#nav-main > li,
	#nav-main > li.rightside {
		float: none !important;
		flex: 0 0 auto;
		margin-left: 0;
	}

	.hucial-board-home-header {
		margin-bottom: 18px;
	}

	.hucial-board-home-title {
		font-size: clamp(1.9rem, 9vw, 2.55rem);
	}

	body .post.online,
	body .online {
		background-size: 58px 58px !important;
	}
}

/* A final containment guard for long third-party extension content. */
.hucial-shell,
.hucial-page-header,
.page-body,
#page-body,
.hucial-footer {
	max-width: 100%;
}

/* Portal buttons must use the HUCIAL action palette, even when the extension
   ships more specific blue button rules. */
body .forumportal-page a.button,
body .forumportal-page .button,
body .forumportal-page button.button,
body .forumportal-page [class*="button"] {
	border-color: var(--hucial-teal) !important;
	background-color: var(--hucial-teal) !important;
	color: var(--hucial-white) !important;
}

body .forumportal-page a.button:hover,
body .forumportal-page .button:hover,
body .forumportal-page button.button:hover,
body .forumportal-page [class*="button"]:hover {
	border-color: var(--hucial-teal-bright) !important;
	background-color: var(--hucial-teal-bright) !important;
	color: var(--hucial-ink) !important;
}


/* ---------- HUCIAL 1.0.2 final mobile refinements ---------- */
@media (max-width: 760px) {
	#nav-main {
		flex-wrap: wrap !important;
		overflow: visible !important;
	}

	#nav-main > li,
	#nav-main > li.rightside {
		flex: 0 1 auto !important;
	}
}

/* HUCIAL 1.0.2 accessibility-first forum index. */
.hucial-board-home-header {
	margin: 18px 0 18px !important;
}

.hucial-board-home-title {
	margin: 0 !important;
	padding-left: 14px !important;
	border-left: 5px solid var(--hucial-teal) !important;
	color: var(--hucial-ink) !important;
	font-size: clamp(2rem, 5vw, 2.8rem) !important;
	font-weight: 820 !important;
	line-height: 1.08 !important;
	letter-spacing: -.028em !important;
	white-space: nowrap !important;
}

.hucial-forum-category-title {
	margin: 0 !important;
	color: inherit !important;
	font: inherit !important;
	font-size: 1rem !important;
	font-weight: 780 !important;
	line-height: 1.25 !important;
	letter-spacing: 0 !important;
}

.hucial-forum-category-title a {
	color: inherit !important;
	text-decoration: none !important;
}

/* Natural editorial CTA sizing inside Portal cards. */
body .forumportal-card a.button,
body .forumportal-story a.button,
body .forumportal-hero a.button:not(.forumportal-topbar__link) {
	display: inline-flex !important;
	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;
	min-height: 44px !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 9px 14px !important;
	border-radius: 10px !important;
	line-height: 1.2 !important;
}

@media (max-width: 760px) {
	.hucial-board-home-header {
		margin: 14px 0 16px !important;
	}

	.hucial-board-home-title {
		padding-left: 11px !important;
		border-left-width: 4px !important;
		font-size: clamp(1.95rem, 9vw, 2.35rem) !important;
		white-space: nowrap !important;
	}
}

@media (max-width: 380px) {
	.hucial-board-home-title {
		font-size: 1.85rem !important;
	}
}

/* ---------- HUCIAL 1.0.3: mobile native navigation containment ---------- */
/* Keep the native phpBB navigation; only fix its layout on narrow screens. */
@media (max-width: 760px) {
	#page-header > .navbar,
	.hucial-page-header > .navbar,
	#page-header > .navbar > .inner,
	.hucial-page-header > .navbar > .inner {
		max-width: 100% !important;
		min-width: 0 !important;
	}

	#page-header > .navbar > .inner,
	.hucial-page-header > .navbar > .inner {
		overflow: hidden !important;
	}

	#nav-main {
		box-sizing: border-box !important;
		display: flex !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		align-content: flex-start !important;
		gap: 2px 4px !important;
		overflow: visible !important;
		white-space: normal !important;
	}

	#nav-main > li,
	#nav-main > li.rightside,
	#nav-main > li.rightside:first-of-type {
		float: none !important;
		box-sizing: border-box !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
		max-width: 100% !important;
		margin: 0 !important;
		white-space: normal !important;
	}

	#nav-main > li > a,
	#nav-main .header-avatar {
		box-sizing: border-box !important;
		max-width: 100% !important;
		min-width: 0 !important;
		white-space: normal !important;
		overflow-wrap: anywhere !important;
		word-break: normal !important;
	}
}

/* ---------- HUCIAL 1.0.5: remove duplicate service navigation ---------- */
/* The same destinations are already exposed by the primary HUCIAL/phpBB navigation.
   Hide only this duplicate product/service row; routes and extension links remain untouched. */
.hucial-product-nav {
	display: none !important;
}

/* ---------- HUCIAL 1.0.6: mobile HUCIAL hamburger + semantic breadcrumbs ---------- */
.hucial-primary-nav-controller {
	width: 100%;
}

.hucial-mobile-menu-toggle {
	display: none;
}

.hucial-native-nav,
.hucial-breadcrumb-nav {
	display: block;
	width: 100%;
}

@media (max-width: 760px) {
	.hucial-menu-enhanced .hucial-primary-nav-controller {
		box-sizing: border-box;
		width: min(calc(100% - 24px), var(--hucial-content));
		margin: 0 auto;
		padding: 8px 0;
	}

	.hucial-menu-enhanced .hucial-mobile-menu-toggle {
		display: inline-flex;
		box-sizing: border-box;
		min-height: 46px;
		align-items: center;
		gap: 8px;
		padding: 9px 14px;
		border: 1px solid var(--hucial-mist);
		border-radius: 10px;
		background: var(--hucial-white);
		color: var(--hucial-ink);
		font: inherit;
		font-weight: 750;
		line-height: 1.2;
		cursor: pointer;
	}

	.hucial-menu-enhanced .hucial-mobile-menu-toggle .icon {
		color: var(--hucial-teal);
	}

	.hucial-menu-enhanced .hucial-mobile-menu-toggle:hover,
	.hucial-menu-enhanced .hucial-mobile-menu-toggle:focus-visible,
	.hucial-menu-enhanced .hucial-mobile-menu-toggle[aria-expanded="true"] {
		background: var(--hucial-cloud);
		color: var(--hucial-teal);
	}

	.hucial-menu-enhanced .hucial-primary-menu-slot:not(.is-open) {
		display: none !important;
	}

	.hucial-menu-enhanced .hucial-primary-menu-slot.is-open {
		display: block !important;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		margin-top: 8px;
		overflow: hidden;
	}

	/* Extension-provided primary menu: make its opened state fit the viewport
	   regardless of whether it uses a list, flex row or native phpBB linklist. */
	.hucial-primary-menu-slot.is-open nav,
	.hucial-primary-menu-slot.is-open ul,
	.hucial-primary-menu-slot.is-open .linklist,
	.hucial-primary-menu-slot.is-open .inner {
		box-sizing: border-box;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.hucial-primary-menu-slot.is-open ul,
	.hucial-primary-menu-slot.is-open .linklist {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 2px !important;
		width: 100% !important;
		white-space: normal !important;
		overflow: visible !important;
	}

	.hucial-primary-menu-slot.is-open li,
	.hucial-primary-menu-slot.is-open li.rightside {
		float: none !important;
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
	}

	.hucial-primary-menu-slot.is-open a {
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		min-height: 44px;
		white-space: normal !important;
		overflow-wrap: anywhere;
	}

	/* Breadcrumb is a separate navigation landmark after both menus. */
	.hucial-breadcrumb-nav {
		clear: both;
	}
}

@media (max-width: 480px) {
	.hucial-menu-enhanced .hucial-primary-nav-controller {
		width: min(calc(100% - 20px), var(--hucial-content));
	}
}
