/*
 * Shared page header for analytics, site, managed data, and reports.
 * Left-aligned workspace banner (not a marketing hero).
 */

.sofia-page-header {
	--sofia-page-header-ink: #18212f;
	--sofia-page-header-muted: #607086;
	--sofia-page-header-border: #e6ebf2;
	--sofia-page-header-accent: #c44900;
	--sofia-page-header-blue: #28637e;
	position: relative;
	padding: 18px 24px;
	border-radius: 14px;
	background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
	border: 1px solid var(--sofia-page-header-border);
	border-left: 4px solid var(--sofia-page-header-blue);
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.05);
	text-align: left;
	color: var(--sofia-page-header-ink);
	font-size: inherit;
}

.sofia-page-header-eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--sofia-page-header-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 6px;
	line-height: 1.3;
	text-align: left;
}

.sofia-page-header-eyebrow .fa {
	margin-right: 0;
	font-size: 13px;
	color: var(--sofia-page-header-blue);
}

.sofia-page-header-title {
	margin: 0;
	padding: 0;
	font-size: 26px;
	font-weight: 700;
	color: var(--sofia-page-header-ink);
	line-height: 1.2;
	text-align: left;
}

.sofia-page-header-title strong {
	font-weight: 700;
	color: inherit;
}

.sofia-page-header-subtitle {
	margin: 8px 0 0;
	max-width: min(100%, max(50%, 72ch));
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--sofia-page-header-muted);
	text-align: left;
}

/* Breathing room between the page blurb and refresh / filter meta */
.sofia-page-header-subtitle ~ .data-refresh-date,
.sofia-page-header-subtitle ~ .sofia-page-header-meta {
	margin-top: 20px;
}

.sofia-page-header-subtitle ~ .sofia-header-current-view .cvs-bar,
.sofia-page-header-subtitle ~ .sofia-header-current-view > .row,
.sofia-page-header-subtitle ~ .sofia-header-current-view > .cvs-comparative,
.sofia-page-header-subtitle ~ .sofia-header-current-view > .sofia-header-toolbar {
	margin-top: 20px;
}

/*
 * Last Data Refresh / Refreshes meta row inside the shared page banner.
 * Pages keep defining ui:insert name="refresh-date-time" with .data-refresh-date.
 */
.sofia-page-header .data-refresh-date,
.sofia-page-header-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid #eef1f4;
	justify-content: flex-start;
	font-size: 13px;
	line-height: 1.4;
	color: var(--sofia-page-header-muted);
	text-align: left;
}

.sofia-page-header .data-refresh-date strong,
.sofia-page-header-meta strong {
	color: #304454;
	font-weight: 600;
}

.sofia-page-header .data-refresh-date form,
.sofia-page-header-meta form {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
}

.sofia-page-header .data-refresh-date .btn,
.sofia-page-header-meta .btn {
	margin: 0;
	vertical-align: middle;
}

.sofia-page-header .data-refresh-date .fa-refresh,
.sofia-page-header-meta .fa-refresh {
	color: #9aa5ae;
}

/* Report banner meta row (R03/R04 Last Data Refreshes, etc.) */
.sofia-report-header-meta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	width: 100%;
}

.sofia-report-header-stat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	color: #4a5b68;
	background-color: #f4f6f8;
	border: 1px solid #dde4ea;
	border-radius: 14px;
	padding: 4px 12px;
}

.sofia-report-header-stat-label {
	color: #8a97a3;
	font-weight: 600;
}

.sofia-report-header-stat-source {
	color: #28637e;
	font-weight: 700;
}

.sofia-report-header-stat strong {
	color: #304454;
	font-weight: 600;
}

.sofia-report-header-refresh {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
	font-size: 13px;
	color: var(--sofia-page-header-muted);
}

.sofia-report-header-refresh .fa {
	color: #9aa5ae;
}

.sofia-report-header-refresh .btn {
	margin: 0;
}

.sofia-report-header-refresh form {
	display: inline;
	margin: 0;
	padding: 0;
	border: 0;
}

@media (max-width: 767px) {
	.sofia-report-header-refresh {
		margin-left: 0;
		width: 100%;
	}
}

/* Legacy "Menu • Page" separators inside page-name inserts */
.sofia-page-header-title > img,
.sofia-page-header-title img[src*="Dot-Separator"] {
	display: inline-block;
	vertical-align: middle;
	margin: 0 8px;
	height: 6px;
	width: 6px;
	opacity: 0.55;
}

.sofia-page-header.page-name-with-help {
	padding-right: clamp(5.5rem, 12vw, 7.5rem);
}

.sofia-page-header.page-name-with-help .page-help-wrap {
	top: 16px;
	right: 16px;
	transform: none;
}

.sofia-page-header .btn.btn-link.context-help-btn {
	color: var(--sofia-page-header-accent);
	background: rgba(196, 73, 0, 0.04);
	border: 1px solid rgba(196, 73, 0, 0.14);
	border-radius: 8px;
	padding: 0.28rem 0.65rem;
}

.sofia-page-header .btn.btn-link.context-help-btn:hover,
.sofia-page-header .btn.btn-link.context-help-btn:focus {
	color: #9a3600;
	background-color: rgba(196, 73, 0, 0.08);
	border-color: rgba(196, 73, 0, 0.22);
	text-decoration: none;
}

/* Pages with sofia-admin-hero use that hero for title/actions. Hide the template title
 * chrome, but keep refresh + Current View / Filter when present (Cyber Analytics). */
body:has(.sofia-admin-hero) .sofia-page-header-row .sofia-page-header-eyebrow,
body:has(.sofia-admin-hero) .sofia-page-header-row .sofia-page-header-title,
body:has(.sofia-admin-hero) .sofia-page-header-row .sofia-page-header-subtitle {
	display: none !important;
}

body:has(.sofia-admin-hero) .sofia-page-header-row:not(:has(.cvs-bar)):not(:has(.data-refresh-date)):not(:has(.sofia-header-toolbar)) {
	display: none !important;
}

/* Workspace home has its own Security Overview hero */
body:has(.workspace-landing) .sofia-page-header-row,
body:has(.workspace-landing) .sofia-page-header-row + .row {
	display: none !important;
}

/* Auth / public pages that clear page-name-row should not leave an empty banner gap */
.sofia-page-header-row:not(:has(.sofia-page-header)):not(:has(h1)):not(:has(img)):not(:has(strong)) {
	display: none !important;
}

@media (max-width: 767px) {
	.sofia-page-header {
		padding: 16px;
		border-left-width: 3px;
	}

	.sofia-page-header-title {
		font-size: 22px;
	}

	.sofia-page-header-subtitle {
		max-width: none;
		font-size: 13px;
	}

	.sofia-page-header .data-refresh-date,
	.sofia-page-header-meta {
		font-size: 12px;
	}

	.sofia-page-header.page-name-with-help .page-help-wrap {
		top: 12px;
		right: 12px;
	}
}