/**
 * Stellatos Advisory — mega menu.
 *
 * Markup comes from Stellatos_Mega_Menu_Walker (inc/mega-menu.php).
 *
 * Full-width trick: the trigger <li> is `position: static`, so the absolutely
 * positioned panel resolves against the header bar instead — which spans the
 * viewport. That is what makes the dropdown edge-to-edge rather than pinned
 * under the parent item.
 *
 * No JavaScript: :hover drives mouse users, :focus-within drives keyboard
 * users, and on mobile Astra's own accordion toggles the panel (that is why
 * the panel also carries the `sub-menu` class).
 *
 * @package Stellatos_Child
 */

/* -------------------------------------------------------------------------
 * 1. Positioning context
 * ---------------------------------------------------------------------- */

.ast-desktop .ast-primary-header-bar,
.ast-desktop .main-header-bar,
.ast-desktop .ast-above-header-bar,
.ast-desktop .stellatos-mega-bar {
	position: relative;
}

/* Τα panels δεν πρέπει να κόβονται από τα wrappers του Astra. */
.ast-desktop .ast-primary-header-bar,
.ast-desktop .main-header-bar,
.ast-desktop .main-header-bar-wrap,
.ast-desktop .site-primary-header-wrap,
.ast-desktop .ast-main-header-wrap {
	overflow: visible;
}

/* -------------------------------------------------------------------------
 * 2. Trigger
 * ---------------------------------------------------------------------- */

.stellatos-mega > a {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.45em;
}

/* Το βελάκι είναι του Astra (`.dropdown-menu-toggle`) — εμείς μόνο το γυρνάμε. */
.ast-desktop .stellatos-mega > a .ast-arrow-svg {
	transition: transform var(--transition-fast);
}

.ast-desktop .stellatos-mega:hover > a .ast-arrow-svg,
.ast-desktop .stellatos-mega:focus-within > a .ast-arrow-svg {
	transform: rotate(180deg);
}

/* Λεπτή χρυσή υπογράμμιση στο ενεργό/ανοιχτό item. */
.ast-desktop .stellatos-mega > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background-color: var(--color-secondary);
	transform: scaleX(0);
	transition: transform var(--transition-fast);
}

.ast-desktop .stellatos-mega:hover > a::after,
.ast-desktop .stellatos-mega:focus-within > a::after {
	transform: scaleX(1);
}

/* -------------------------------------------------------------------------
 * 3. Panel — desktop
 * ---------------------------------------------------------------------- */

.ast-desktop .main-header-menu .stellatos-mega--full,
.ast-desktop .stellatos-mega-bar__menu .stellatos-mega--full {
	position: static;
}

.ast-desktop .stellatos-mega__panel {
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 900;
	margin: 0;
	padding: 0;
	background-color: var(--color-surface);
	border-top: 1px solid var(--color-border);
	box-shadow: var(--shadow-panel);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-8px);
	transition:
		opacity var(--transition-fast),
		transform var(--transition-fast),
		visibility var(--transition-fast);
}

/* Απλό dropdown (χωρίς εγγόνια): πλάτος κολόνας, όχι edge-to-edge. */
.ast-desktop .stellatos-mega--simple > .stellatos-mega__panel,
.ast-desktop .stellatos-dropdown {
	right: auto;
	width: max-content;
	min-width: 240px;
	max-width: 340px;
}

.ast-desktop .stellatos-mega:hover > .stellatos-mega__panel,
.ast-desktop .stellatos-mega:focus-within > .stellatos-mega__panel {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0);
}

.stellatos-mega__inner {
	max-width: var(--container-width);
	margin-inline: auto;
	padding: var(--space-xl) var(--space-md);
}

/* -------------------------------------------------------------------------
 * 4. Grid
 * ---------------------------------------------------------------------- */

.stellatos-mega__grid {
	display: grid;
	grid-template-columns: repeat(var(--stellatos-mega-cols, 3), minmax(0, 1fr));
	gap: var(--space-xl) var(--space-lg);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (max-width: 1100px) {
	.stellatos-mega__grid {
		grid-template-columns: repeat(min(var(--stellatos-mega-cols, 3), 2), minmax(0, 1fr));
	}
}

.stellatos-mega__section {
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

/* Διαχωριστικό ανάμεσα στις στήλες, όπως στο design. */
.stellatos-mega__grid > .stellatos-mega__section + .stellatos-mega__section {
	border-left: 1px solid var(--color-border);
	padding-left: var(--space-lg);
}

@media (max-width: 1100px) {
	.stellatos-mega__grid > .stellatos-mega__section:nth-child(odd) {
		border-left: 0;
		padding-left: 0;
	}
}

/* -------------------------------------------------------------------------
 * 5. Section title + links
 * ---------------------------------------------------------------------- */

.stellatos-mega__title {
	display: block;
	font-family: var(--font-body);
	font-size: var(--font-size-eyebrow);
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: var(--letter-spacing-wide);
	text-transform: uppercase;
	color: var(--color-secondary);
}

a.stellatos-mega__title:hover,
a.stellatos-mega__title:focus {
	color: var(--color-primary);
}

.stellatos-mega__desc {
	margin: var(--space-xs) 0 0;
	font-size: var(--font-size-small);
	line-height: 1.55;
	color: var(--color-text-muted);
}

.stellatos-mega__links {
	margin: var(--space-md) 0 0;
	padding: 0;
	list-style: none;
}

.stellatos-mega__item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.stellatos-mega__link {
	display: block;
	padding: 0.4em 0;
	font-family: var(--font-body);
	font-size: var(--font-size-small);
	font-weight: 400;
	line-height: 1.45;
	color: var(--color-text);
}

.stellatos-mega__link:hover,
.stellatos-mega__link:focus {
	color: var(--color-secondary);
}

/* -------------------------------------------------------------------------
 * 6. Numbered variant (κλάση `mega-numbered` στο top-level item)
 * ---------------------------------------------------------------------- */

.stellatos-mega__panel--numbered .stellatos-mega__grid {
	counter-reset: stellatos-section;
}

.stellatos-mega__panel--numbered .stellatos-mega__section {
	counter-increment: stellatos-section;
}

.stellatos-mega__panel--numbered .stellatos-mega__title::before {
	content: counter(stellatos-section, decimal-leading-zero);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.1em;
	height: 2.1em;
	margin-right: 0.7em;
	vertical-align: middle;
	border: 1px solid var(--color-secondary);
	border-radius: 50%;
	font-size: 0.95em;
	font-weight: 600;
	letter-spacing: 0;
	color: var(--color-secondary);
}

/* -------------------------------------------------------------------------
 * 7. Standalone mega bar (θέση μενού `mega-menu`, hook astra_masthead_top)
 * ---------------------------------------------------------------------- */

.stellatos-mega-bar {
	background-color: var(--color-bg-cream);
	border-bottom: 1px solid var(--color-border);
}

.stellatos-mega-bar__inner {
	max-width: var(--container-width);
	margin-inline: auto;
	padding-inline: var(--space-md);
}

.stellatos-mega-bar__menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-lg);
	margin: 0;
	padding: 0;
	list-style: none;
}

.stellatos-mega-bar__menu > li > a {
	position: relative;
	display: inline-flex;
	padding: 0.85em 0;
	font-size: var(--font-size-small);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-wide);
	text-transform: uppercase;
	color: var(--color-primary);
}

/* -------------------------------------------------------------------------
 * 8. Mobile — Astra's accordion owns the open/close state
 * ---------------------------------------------------------------------- */

.ast-header-break-point .stellatos-mega__panel {
	position: static;
	width: auto;
	min-width: 0;
	max-width: none;
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: none;
	box-shadow: none;
	border-top: 0;
	background-color: transparent;
}

.ast-header-break-point .stellatos-mega__inner {
	padding: var(--space-sm) 0 var(--space-md);
}

.ast-header-break-point .stellatos-mega__grid {
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-lg);
}

.ast-header-break-point .stellatos-mega__grid > .stellatos-mega__section + .stellatos-mega__section {
	border-left: 0;
	padding-left: 0;
}

.ast-header-break-point .stellatos-mega-bar__inner {
	padding-block: var(--space-sm);
}

/* -------------------------------------------------------------------------
 * 9. Reduced motion
 * ---------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.stellatos-mega__panel,
	.stellatos-mega > a .ast-arrow-svg,
	.stellatos-mega > a::after {
		transition: none;
	}
}
