/* Full-width image with editable caption and source */
@layer horeca.components {
  :where(figure).horeca-blog-image,
  .horeca-blog-image figure {
    margin: var(--horeca-space-6) 0;
    max-width: var(--horeca-wide-width);
  }

  .horeca-blog-image img {
    border-radius: var(--horeca-radius-sm);
    display: block;
    height: auto;
    margin: 0;
    width: 100%;
  }

  .horeca-blog-image :where(figcaption, .horeca-blog-image__caption) {
    border-bottom: 1px solid var(--horeca-line);
    color: var(--horeca-muted);
    font-size: 0.875rem;
    line-height: 1.5;
    margin: 0;
    padding: 0.7rem 0;
  }

  .horeca-blog-image .horeca-sursa-poza,
  .horeca-blog-image__source {
    color: var(--horeca-muted);
    font-style: normal;
    font-weight: 500;
  }

  @media (max-width: 48rem) {
    :where(figure).horeca-blog-image,
    .horeca-blog-image figure { margin: 2.25rem 0; }

    .horeca-blog-image :where(figcaption, .horeca-blog-image__caption) {
      font-size: 0.8125rem;
      padding: 0.6rem 0;
    }
  }
}

/*
 * Override-uri în afara @layer — ca în simulare / galerie.
 * Pluginul „Sursa poză” și stilurile core pot muta sau stiliza legenda.
 */
html body #article-single-content figure.horeca-blog-image,
html body figure.horeca-blog-image,
html body #article-single-content .horeca-blog-image figure,
html body .horeca-blog-image figure {
	display: block !important;
	margin: 2.5rem 0 !important;
	max-width: 64rem !important;
}

html body #article-single-content .horeca-blog-image img,
html body .horeca-blog-image img {
	border-radius: 0.25rem !important;
	display: block !important;
	float: none !important;
	height: auto !important;
	margin: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
}

/*
 * Imagini sub ~780px lățime nativă: nu le scala la lățimea coloanei (evită pixelare).
 * Clasa + --horeca-img-native-w sunt setate din render_block / editor.
 */
html body #article-single-content figure.horeca-blog-image.is-compact,
html body figure.horeca-blog-image.is-compact {
	max-width: min(100%, var(--horeca-img-native-w, 100%)) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

html body #article-single-content .horeca-blog-image.is-compact img,
html body .horeca-blog-image.is-compact img {
	width: 100% !important;
	max-width: 100% !important;
}

html body #article-single-content .horeca-blog-image figcaption,
html body .horeca-blog-image figcaption,
html body #article-single-content .horeca-blog-image .horeca-blog-image__caption,
html body .horeca-blog-image .horeca-blog-image__caption {
	background: none !important;
	border-bottom: 1px solid #d9dcde !important;
	bottom: auto !important;
	color: #62676b !important;
	display: block !important;
	float: none !important;
	font-family: Roboto, Arial, Helvetica, sans-serif !important;
	font-size: 0.875rem !important;
	font-style: normal !important;
	font-weight: 400 !important;
	inset: auto !important;
	left: auto !important;
	line-height: 1.5 !important;
	margin: 0 !important;
	max-width: none !important;
	padding: 0.7rem 0 !important;
	position: static !important;
	right: auto !important;
	text-align: left !important;
	top: auto !important;
	width: 100% !important;
}

html body #article-single-content .horeca-blog-image .horeca-blog-image__source,
html body .horeca-blog-image .horeca-blog-image__source {
	color: #62676b !important;
	font-style: normal !important;
	font-weight: 500 !important;
}

@media (max-width: 48rem) {
	html body #article-single-content .horeca-blog-image figcaption,
	html body .horeca-blog-image figcaption {
		font-size: 0.8125rem !important;
		padding: 0.6rem 0 !important;
	}
}