/* ============================================================================
   rz-extras.css  —  footer bar + brand logo + topbar avatar photo
   Load AFTER rz-layout.css:
       <link rel="stylesheet" href="~/css/rz-extras.css" asp-append-version="true" />
   ============================================================================ */

/* Brand: small logo + company name in the sidebar header */
.rzl-brand .rzl-logo-img {
	width: 60px; height: 60px; object-fit: contain; border-radius: 6px; background: #fff;
}
.rzl-brand .rzl-txt b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 170px; }

/* Topbar avatar as a photo (falls back to initials span if no photo) */
.rzl-avatar-img {
	width: 34px; height: 34px; border-radius: 50%; object-fit: cover; flex: none;
	border: 1px solid var(--rzl-border); background: #eef0f3; display: block;
}

/* ── Footer bar ──────────────────────────────────────────────────────────── */
.rzl-footer {
	position: fixed; left: var(--rzl-rail); right: 0; bottom: 0; height: 30px; z-index: 1025;
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 0 14px; background: var(--rzl-surface); border-top: 1px solid var(--rzl-border);
	font-size: 11.5px; color: var(--rzl-text-muted); white-space: nowrap; overflow: hidden;
	transition: left .18s ease;
}
body.rzl-pinned .rzl-footer { left: var(--rzl-panel); }
.rzl-footer .rzl-foot-l, .rzl-footer .rzl-foot-r { display: flex; align-items: center; gap: 16px; overflow: hidden; }
.rzl-footer .rzl-foot-l span, .rzl-footer .rzl-foot-r span { display: inline-flex; align-items: center; gap: 5px; }
.rzl-footer b { color: var(--rzl-text); font-weight: 600; }
.rzl-footer a { color: var(--rzl-primary); text-decoration: none; }
.rzl-footer a:hover { text-decoration: underline; }
.rzl-footer .rzl-foot-logo { height: 20px; width: auto; object-fit: contain; }

/* keep page content clear of the fixed footer */
.rzl-container { padding-bottom: 48px; }

@media (max-width: 992px) {
	.rzl-footer { left: 0; font-size: 11px; padding: 0 10px; }
	.rzl-footer .rzl-foot-l, .rzl-footer .rzl-foot-r { gap: 10px; }
	/* on small screens, hide the less-critical date chips to avoid overflow */
	.rzl-footer .rzl-foot-hide-sm { display: none; }
}
