/* Base Image Utilities */
/* Required for ImageHero, ImageTextAside, and other image blocks */

.img {
  display: block;
  position: relative;
  width: 100%;
}

.img-img {
  display: block;
  height: auto;
  max-width: 100%;
  /* width: 100%; */  /* Removed - conflicts with inline width attributes */
}

.img-img--center {
  margin-left: auto;
  margin-right: auto;
}

.img-img--left {
  margin-right: auto;
}

.img-img--right {
  margin-left: auto;
}

/* React Medium Image Zoom (data-rmiz attributes) */
[data-rmiz] {
  position: relative;
}

[data-rmiz-content] img {
  display: block;
  height: auto;
  max-width: 100%;
}

[data-rmiz-ghost] {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  pointer-events: none;
}

[data-rmiz-btn-zoom] {
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.6);
  border: none;
  border-radius: 4px;
  color: white;
  cursor: pointer;
  padding: 8px;
  transition: background 0.2s;
}

[data-rmiz-btn-zoom]:hover {
  background: rgba(0, 0, 0, 0.8);
}

[data-rmiz-btn-zoom] svg {
  display: block;
  height: 16px;
  width: 16px;
}