/*
 * ITAdmin – a saját blokkok megjelenése (látogatói oldal és szerkesztő).
 */

/* ---------- Ikon ---------- */
.wp-block-itadmin-icon { display: inline-block; line-height: 1; font-size: 1.6rem; }
.wp-block-itadmin-icon .bi { display: block; }

/* ---------- Cégadat ---------- */
p.wp-block-itadmin-cegadat { margin: 0; }
.wp-block-itadmin-cegadat a { text-decoration: none; }

/* E-mail-cím helyén álló gomb: úgy néz ki, mint egy link (lásd email-vedelem.php) */
button.itadmin-email {
	font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
	text-align: inherit; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px;
}
button.itadmin-email:hover { text-decoration-style: solid; }
button.itadmin-email[aria-busy="true"] { cursor: progress; opacity: .6; }

/* Hiányzó adat jelzése (csak bejelentkezett szerkesztőknek látszik) */
.itadmin-hianyzo { background: #fff3cd; color: #664d03; padding: .1em .4em; border-radius: 4px; font-size: .9em; }

/* ---------- Ábra ---------- */
.wp-block-itadmin-diagram { position: relative; margin-top: 4rem; }
.wp-block-itadmin-diagram::before {
	content: ""; position: absolute; inset: 6% 2% -4%; border-radius: 40px; z-index: 0;
	background: linear-gradient(90deg, #5aa9ff, #2dd4bf 35%, #b5e655 70%, #ffd166);
	filter: blur(42px); opacity: .55;
}
/* A szerkesztőben a blokk kétszer van becsomagolva: a belső ne kapjon még egy ragyogást. */
.wp-block-itadmin-diagram .wp-block-itadmin-diagram { margin-top: 0; }
.wp-block-itadmin-diagram .wp-block-itadmin-diagram::before { display: none; }

.itadmin-diagram {
	position: relative; z-index: 1; margin: 0; border-radius: 28px; overflow: hidden;
	height: clamp(240px, 38vw, 480px);
	background:
		radial-gradient(60% 80% at 85% 20%, rgba(255, 255, 255, .28), transparent 60%),
		linear-gradient(120deg, #0b5c73 0%, #0f7490 35%, #1aa39b 70%, #8fd3a6 100%);
}
.itadmin-diagram .net { position: absolute; inset: 0; }
.itadmin-diagram .net > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.itadmin-diagram line { stroke: rgba(255, 255, 255, .55); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.itadmin-diagram .node {
	position: absolute; transform: translate(-50%, -50%);
	display: flex; align-items: center; gap: .6rem; white-space: nowrap;
	background: rgba(255, 255, 255, .96); color: #202020; border-radius: 500px;
	padding: .45rem 1.1rem .45rem .45rem;
	font-family: var(--wp--preset--font-family--heading, sans-serif); font-weight: 600; font-size: .95rem; line-height: 1.2;
	box-shadow: 0 12px 30px -14px rgba(5, 40, 50, .55);
}
.itadmin-diagram .node .ikon {
	width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; flex: none;
	background: #d9ebef; color: var(--wp--preset--color--brand, #0f7490); font-size: 1.05rem;
}
.itadmin-diagram .node.core { padding: .6rem 1.4rem .6rem .6rem; font-size: 1.05rem; }
.itadmin-diagram .node.core .ikon { width: 2.8rem; height: 2.8rem; background: var(--wp--preset--color--brand, #0f7490); color: #fff; font-size: 1.3rem; }
@media (max-width: 767.98px) {
	.itadmin-diagram .node { padding: .35rem; }
	.itadmin-diagram .node > span:not(.ikon) { display: none; }
	.itadmin-diagram .node .ikon { width: 2.5rem; height: 2.5rem; }
	.itadmin-diagram .node.core { padding: .4rem; }
}