/**
 * Komarko Savet stručnjaka – moderan callout na frontu.
 * Koristi Blocksy varijable (boje, border-radius, transition).
 */

.wp-block-komarko-savet-strucnjaka.komarko-savet-block {
	--komarko-savet-radius: var(--theme-border-radius, 8px);
	--komarko-savet-accent: var(--theme-palette-color-2);
	border-radius: var(--komarko-savet-radius);
	overflow: hidden;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	border: 1px solid var(--theme-border-color, rgba(0, 0, 0, 0.08));
	background: var(--theme-content-background-color, #fff);
}

.komarko-savet-block__header {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 1rem 1.25rem;
	background: var(--komarko-savet-accent);
	color: #fff;
}

.komarko-savet-block__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.25);
	flex-shrink: 0;
}

/* Ikona sijalice (CSS data URI – uvek vidljiva i u editoru i na frontu) */
.komarko-savet-block__icon::before {
	content: '';
	display: block;
	width: 1rem;
	height: 1rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12 2a7 7 0 0 1 6.9 6.2 5.5 5.5 0 0 1-1.5 10.8v1.5a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1v-1.5A5.5 5.5 0 0 1 5.1 8.2 7 7 0 0 1 12 2zm0 2a5 5 0 0 0-4.9 4.2 3.5 3.5 0 0 0 1 6.8l.2.1h7.4l.2-.1a3.5 3.5 0 0 0 1-6.8A5 5 0 0 0 12 4zm-2 9v1h4v-1h-4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.komarko-savet-block__title {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	color: inherit;
}

.komarko-savet-block__content {
	padding: 1.25rem 1.25rem;
	color: var(--theme-text-color);
	line-height: 1.6;
}

.komarko-savet-block__content p {
	margin: 0 0 0.75em 0;
}

.komarko-savet-block__content p:last-child {
	margin-bottom: 0;
}

.komarko-savet-block__content a {
	color: var(--theme-link-initial-color);
	transition: var(--theme-transition, color 0.2s ease);
}

.komarko-savet-block__content a:hover {
	color: var(--theme-link-hover-color);
}

.komarko-savet-block__content ul,
.komarko-savet-block__content ol {
	margin: 0.75em 0;
	padding-inline-start: 1.5em;
}

.komarko-savet-block__content h1,
.komarko-savet-block__content h2,
.komarko-savet-block__content h3 {
	margin: 1em 0 0.5em 0;
	color: var(--theme-headings-color, var(--theme-text-color));
}

.komarko-savet-block__content h1:first-child,
.komarko-savet-block__content h2:first-child,
.komarko-savet-block__content h3:first-child {
	margin-top: 0;
}