/* e-grow Components — Flyout menu
   Χρώματα από τη σελίδα «Components» (μεταβλητές --egc-*). Ό,τι δεν έχει οριστεί ακολουθεί το θέμα. */

.egc-fly{
	--_accent: var(--egc-accent, currentColor);
	--_bg: var(--egc-bg, #fff);
	--_border: var(--egc-border, #e2e4e7);
	--_radius: var(--egc-radius, 6px);
	--_hover: rgba(0,0,0,.045);
	--_hover: color-mix(in srgb, var(--_accent) 8%, transparent);
	color: var(--egc-text);
	font-family: var(--egc-font, inherit);
	font-size: inherit;
	font-style: normal;
	font-weight: var(--egc-weight, inherit);
	line-height: 1.4;
	text-align: left;
}
.egc-fly, .egc-fly *{box-sizing:border-box}
.egc-fly ul, .egc-fly li{list-style:none;margin:0;padding:0}
.egc-fly li::before, .egc-fly li::after{content:none}
.egc-fly [hidden], .egc-fly[hidden]{display:none !important}

.egc-fly__title{margin:0;padding:.85em 1em;font-weight:600;border-bottom:1px solid var(--_border)}

/* ---------- Στοιχεία ---------- */
.egc-fly .egc-fly__item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;position:relative}
.egc-fly .egc-fly__list > .egc-fly__item + .egc-fly__item{border-top:1px solid var(--_border)}
.egc-fly .egc-fly__item > a{
	display:block;padding:.75em 1em;
	color:inherit;text-decoration:none;background:none;border:0;box-shadow:none;
	transition:background-color .15s, color .15s;
}
.egc-fly .egc-fly__item > a:hover{background:var(--_hover);color:var(--_accent)}
.egc-fly .is-current > a, .egc-fly .is-current-parent > a{color:var(--_accent);font-weight:600}

.egc-fly .egc-fly__toggle{
	all:unset;box-sizing:border-box;
	display:grid;place-items:center;
	width:2.75em;height:2.75em;cursor:pointer;
	color:inherit;border-radius:var(--_radius);
}
.egc-fly .egc-fly__toggle:hover{background:var(--_hover)}
.egc-fly .egc-ico{display:block;width:1.15em;height:1.15em;transition:transform .2s}

.egc-fly .egc-fly__item > a:focus-visible,
.egc-fly .egc-fly__toggle:focus-visible,
.egc-fly .egc-fly__open:focus-visible,
.egc-fly .egc-fly__close:focus-visible{outline:2px solid var(--_accent);outline-offset:-2px}

/* ---------- Υπομενού: «ακορντεόν» (κινητό, panel) ---------- */
.egc-fly .egc-fly__sub{grid-column:1 / -1;display:none;padding-left:.9em;border-top:1px solid var(--_border)}
.egc-fly .is-open > .egc-fly__sub{display:block}
.egc-fly .egc-fly__sub > .egc-fly__item + .egc-fly__item{border-top:1px solid var(--_border)}
.egc-fly .egc-fly__sub a{font-size:.95em}
.egc-fly .egc-fly__toggle .egc-ico{transform:rotate(90deg)}
.egc-fly .is-open > .egc-fly__toggle .egc-ico{transform:rotate(-90deg)}

/* ---------- Κάθετο ---------- */
.egc-fly--vertical{background:var(--_bg);border:1px solid var(--_border);border-radius:var(--_radius)}

/* υπολογιστής: τα υπομενού ανοίγουν στο πλάι με το ποντίκι */
@media (hover:hover) and (min-width:769px){
	/* κρυφό = display:none, για να μη «σπρώχνει» τη σελίδα και να μη βγάζει οριζόντια κύλιση */
	.egc-fly--vertical .egc-fly__sub{
		display:none;position:absolute;top:-1px;left:100%;z-index:60;
		min-width:230px;padding:.3em 0;
		background:var(--_bg);border:1px solid var(--_border);border-radius:var(--_radius);
		box-shadow:0 12px 32px rgba(0,0,0,.12);
	}
	.egc-fly--vertical .egc-fly__sub > .egc-fly__item + .egc-fly__item{border-top:0}
	.egc-fly--vertical .egc-has-sub:hover > .egc-fly__sub,
	.egc-fly--vertical .egc-has-sub:focus-within > .egc-fly__sub,
	.egc-fly--vertical .egc-has-sub.is-open > .egc-fly__sub{
		display:block;animation:egc-fly-r .16s ease-out both;
	}
	.egc-fly--vertical .egc-fly__toggle .egc-ico,
	.egc-fly--vertical .is-open > .egc-fly__toggle .egc-ico{transform:none}

	/* προς τα αριστερά */
	.egc-fly--dir-left .egc-fly__sub{left:auto;right:100%}
	.egc-fly--dir-left .egc-has-sub:hover > .egc-fly__sub,
	.egc-fly--dir-left .egc-has-sub:focus-within > .egc-fly__sub,
	.egc-fly--dir-left .egc-has-sub.is-open > .egc-fly__sub{animation-name:egc-fly-l}
	.egc-fly--dir-left .egc-fly__toggle .egc-ico,
	.egc-fly--dir-left .is-open > .egc-fly__toggle .egc-ico{transform:rotate(180deg)}

	/* δεν χωράει στην οθόνη → ανοίγει από την άλλη πλευρά (την κλάση τη βάζει το JS) */
	.egc-fly--vertical .egc-has-sub.egc-flip > .egc-fly__sub{left:auto;right:100%;animation-name:egc-fly-l}
	.egc-fly--dir-left .egc-has-sub.egc-flip > .egc-fly__sub{right:auto;left:100%;animation-name:egc-fly-r}
}
@keyframes egc-fly-r{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:none}}
@keyframes egc-fly-l{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}

/* ---------- Panel ---------- */
.egc-fly--panel{display:inline-block}
/* το κουμπί: σκέτο ☰ (και κείμενο, αν δοθεί), χωρίς πλαίσιο */
.egc-fly .egc-fly__open{
	all:unset;box-sizing:border-box;
	display:inline-flex;align-items:center;gap:.5em;
	padding:.35em;cursor:pointer;
	font:inherit;line-height:1.2;color:inherit;
	border-radius:var(--_radius);
	transition:opacity .15s;
}
.egc-fly .egc-fly__open:hover{opacity:.6}
.egc-fly .egc-fly__open .egc-ico{width:1.6em;height:1.6em;stroke-width:1.8}

/* περίγραμμα εστίασης μόνο με πληκτρολόγιο, όχι μετά από κλικ */
.egc-fly .egc-fly__open:focus,
.egc-fly .egc-fly__toggle:focus,
.egc-fly .egc-fly__close:focus{outline:none;box-shadow:none}
.egc-fly .egc-fly__open:focus-visible{outline:2px solid var(--_accent);outline-offset:2px}
.egc-fly .egc-fly__toggle:focus-visible,
.egc-fly .egc-fly__close:focus-visible{outline:2px solid var(--_accent);outline-offset:-2px}

.egc-fly__overlay{
	position:fixed;inset:0;z-index:99998;
	background:rgba(0,0,0,var(--egc-overlay,.75));opacity:0;transition:opacity .35s;
}
.egc-fly__overlay.is-open{opacity:1}
.egc-fly__overlay[hidden]{display:none !important}

.egc-fly.egc-fly__panel{
	position:fixed;top:0;bottom:0;left:0;z-index:99999;
	width:min(var(--egc-panel-w, 420px), 88vw);
	overflow-y:auto;overscroll-behavior:contain;
	background:var(--_bg);color:var(--egc-text, #1d2327);
	box-shadow:0 0 40px rgba(0,0,0,.2);
	transform:translateX(-100%);
	transition:transform .3s cubic-bezier(.2,.8,.2,1);
	padding-bottom:env(safe-area-inset-bottom, 0px);
}
.egc-fly.egc-fly__panel--right{left:auto;right:0;transform:translateX(100%)}
.egc-fly.egc-fly__panel.is-open{transform:none}

.egc-fly__head{
	position:sticky;top:0;z-index:1;
	display:flex;align-items:center;justify-content:space-between;gap:1em;
	padding:calc(.35em + env(safe-area-inset-top, 0px)) .35em .35em 0;
	background:var(--_bg);border-bottom:1px solid var(--_border);
}
.egc-fly__head .egc-fly__title{border:0;padding:.6em 1em}
.egc-fly .egc-fly__close{
	all:unset;box-sizing:border-box;
	display:grid;place-items:center;width:2.75em;height:2.75em;cursor:pointer;
	color:inherit;border-radius:var(--_radius);
}
.egc-fly .egc-fly__close:hover{background:var(--_hover)}

/* ---------- Στυλ «minimal»: χωρίς γραμμές, βελάκι δίπλα στο κείμενο ---------- */
.egc-fly--look-minimal .egc-fly__item{display:flex;flex-wrap:wrap;align-items:center}
.egc-fly--look-minimal .egc-fly__item > a{flex:0 1 auto;padding:.8em .3em .8em 1.6em}
.egc-fly--look-minimal .egc-fly__sub .egc-fly__item > a{padding:.55em .3em .55em 1.6em;font-size:.94em}
.egc-fly--look-minimal .egc-fly__item > a:hover{background:none;color:var(--_accent);opacity:.7}
.egc-fly--look-minimal .egc-fly__toggle{flex:0 0 auto;width:1.9em;height:1.9em}
.egc-fly--look-minimal .egc-fly__toggle:hover{background:none;opacity:.7}
.egc-fly--look-minimal .egc-fly__toggle .egc-ico{width:.8em;height:.8em;stroke-width:3.2}
.egc-fly--look-minimal .egc-fly__item > .egc-fly__sub{flex:1 0 100%;border-top:0;padding:0 0 .4em 1em}
.egc-fly--look-minimal .egc-fly__list > .egc-fly__item + .egc-fly__item,
.egc-fly--look-minimal .egc-fly__sub > .egc-fly__item + .egc-fly__item{border-top:0}
.egc-fly--look-minimal .egc-fly__list{padding:.6em 0 1.5em}
/* στο κάθετο: το υπομενού στο πλάι παίρνει τη δική του εσοχή */
@media (hover:hover) and (min-width:769px){
	.egc-fly--vertical.egc-fly--look-minimal .egc-fly__item > .egc-fly__sub{padding:.4em 0}
	.egc-fly--vertical.egc-fly--look-minimal .egc-fly__sub .egc-fly__item > a{padding-left:1.2em}
}

/* panel minimal: χωρίς γραμμή στην κεφαλίδα, στρογγυλό × */
.egc-fly--look-minimal .egc-fly__head{border-bottom:0;padding-right:.9em}
.egc-fly--look-minimal .egc-fly__head .egc-fly__title{padding:.9em 1.6em .2em}
.egc-fly.egc-fly--look-minimal .egc-fly__close{
	width:2.3em;height:2.3em;margin-top:.5em;
	border:1.5px solid currentColor;border-radius:50%;
}
.egc-fly.egc-fly--look-minimal .egc-fly__close:hover{background:none;opacity:.7}
.egc-fly--look-minimal .egc-fly__close .egc-ico{width:1em;height:1em;stroke-width:2.6}

@media (prefers-reduced-motion:reduce){
	.egc-fly *, .egc-fly.egc-fly__panel, .egc-fly__overlay{transition:none !important;animation:none !important}
}