/**
 * PowerX Site Logo Component Styles
 *
 * TABLE OF CONTENTS:
 * -----------------------------------------------------------------------------
 * 1.0 - Logo Container Scope
 * 2.0 - Logo Hyperlink & Media Display
 * 3.0 - Text Title Fallback
 * =============================================================================
 *
 * @package PowerX_Core
 * @version 0.0.1
 */

/* =============================================================================
   1.0 - LOGO CONTAINER SCOPE
   ============================================================================= */
.px-site-logo-wrap {
	display: block;
	width: 100%;
	line-height: 0;
	font-size: 0;
}

/* =============================================================================
   2.0 - LOGO HYPERLINK & MEDIA DISPLAY
   ============================================================================= */
.px-site-logo-link {
	margin: 0;
	padding: 0;
	line-height: 0;
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	transition: opacity 0.3s ease, filter 0.3s ease;
}

.px-site-logo-img {
	margin: 0;
	padding: 0;
	display: block;
	border: none;
	outline: none;
	max-width: 100%;
	height: auto;
	transition: filter 0.3s ease;
}

/* =============================================================================
   3.0 - TEXT TITLE FALLBACK
   ============================================================================= */
.px-site-title-text {
	font-size: 24px;
	font-weight: 800;
	color: var(--powerx-heading-color, var(--powerx-neutral-900, #212134));
	font-family: inherit;
	text-decoration: none;
	display: inline-block;
	line-height: 1.2;
	transition: color 0.2s ease;
}

.px-site-logo-link:hover .px-site-title-text {
	color: var(--powerx-primary-color, var(--powerx-primary-500, #4945ff));
}