/*
 * Vertical Header Styles (Frontend Only)
 * 
 * Custom CSS for vertical sidebar header layout on desktop/tablet.
 * This file is enqueued only on the frontend to avoid interfering with
 * the Block Editor experience.
 * 
 * Version: 02.22.26
 * Author: Tim Taricco
 */

/*** GenerateBlocks 2.0 Vertical Sidebar Header - Desktop Only
–––––––––––––––––––––––––––––––––––––––––––––––––– ***/

@media (min-width: 768px) {
	/* Main header - FIXED position anchored to body-wrapper left edge */
	.gb-site-header {
		position: fixed !important;
		left: max(0px, calc(50% - (var(--body-wrapper-desktop) / 2))) !important;
		top: 0 !important;
		height: 100vh !important;
		width: 60px !important;
		z-index: 999 !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	
	/* Adjust for WP Admin Bar when logged in */
	.admin-bar .gb-site-header {
		top: 32px !important;
		height: calc(100vh - 32px) !important;
	}
	
	/* Outer container - position context for absolute children */
	.gb-site-header > div {
		position: relative !important;
		display: block !important;
		height: 100% !important;
		width: 100% !important;
		padding: 0 !important;
	}
	
	/* Logo container - ABSOLUTE positioned at VERY BOTTOM */
	.gb-site-header .gb-element-1ceed24f {
		position: absolute !important;
		bottom: 20px !important;
		left: 0 !important;
		right: 0 !important;
		top: auto !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		margin: 0 !important;
		padding: 0 !important;
		height: 50px !important; /* Explicit height */
	}
	
	/* Text container - ABSOLUTE positioned ABOVE logo with 20px gap */
	.gb-site-header .gb-element-12583090 {
		position: absolute !important;
		bottom: calc(20px + 50px) !important; /* bottom padding + logo height + gap */
		left: 0 !important;
		right: 0 !important;
		top: auto !important;
		display: flex !important;
		justify-content: center !important;
		align-items: center !important;
		margin: 0 !important;
		padding: 0 0 20px 0 !important;
		gap: 0 !important;
		column-gap: 0 !important;
	}
	
	/* Navigation container - ABSOLUTE positioned at TOP */
	.gb-site-header .gb-element-c27b733c {
		position: absolute !important;
		top: 20px !important;
		bottom: auto !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: center !important;
		align-items: center !important;
		margin: 0 !important;
		margin-left: 0 !important;
		padding: 0 !important;
		column-gap: 0 !important;
		gap: 0 !important;
	}
	
	/* "Tim Taricco" text - vertical */
	.gb-site-header .gb-text-8e008a0f {
		writing-mode: vertical-rl !important;
		text-orientation: mixed !important;
		transform: rotate(180deg) !important;
	}
	
	/* Navigation element itself */
	.gb-site-header .gb-navigation--mobile {
		display: flex !important;
		justify-content: center !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	
	/* Slide-out menu container - anchored to body-wrapper */
	.gb-site-header .gb-menu-container--mobile {
		position: fixed !important;
		left: max(0px, calc(50% - (var(--body-wrapper-desktop) / 2))) !important;
		top: 0 !important;
		height: 100vh !important;
		z-index: 998 !important;
	}
	
	/* Adjust slide-out menu for WP Admin Bar */
	.admin-bar .gb-site-header .gb-menu-container--mobile {
		top: 32px !important;
		height: calc(100vh - 32px) !important;
	}
	
	/* Clone menu toggle button inside slide-out (if present) */
	.gb-site-header .gb-menu-toggle--clone {
		position: absolute !important;
		top: 20px !important;
		left: 20px !important;
	}
	
	/* Offset #page content to make room for header */
	#page {
		margin-left: calc(var(--margin-sm) + 60px);
		margin-right: var(--margin-sm);
	}
}

/* WP Admin Bar adjustment for smaller screens */
@media screen and (max-width: 782px) {
	.admin-bar .gb-site-header .gb-menu-container--mobile {
		top: 46px !important;
		height: calc(100vh - 46px) !important;
	}
}