/* templates/blocks/author-image/style.css */
/* Version: v2.2.0 (add Full Width container + stronger align) */

.pf-author-image-outer {
  display: block;
  max-width: 100%;
  box-sizing: border-box;
}
.pf-author-image-outer--full {
  width: 100% !important;
}
.pf-author-image-outer--fit {
  width: auto;
}
.pf-author-image-outer,
.pf-author-image-outer * {
  box-sizing: border-box;
}
.pf-align-left   { text-align: left !important; }
.pf-align-center { text-align: center !important; }
.pf-align-right  { text-align: right !important; }

.pf-author-image {
  display: var(--pfa-display, inline-block);
  position: relative;
  overflow: hidden;
  line-height: 0;

  width: var(--pfa-width, 100px);
  height: var(--pfa-height, 100px);
  max-width: 100%;

  border-radius: var(--pfa-radius, 50%);
  border: var(--pfa-border, none);
  box-shadow: var(--pfa-box-shadow, none);
  background-color: var(--pfa-bg-color, transparent);
  margin: var(--pfa-margin, 0);
}

/* Khi ảnh để display:block thì text-align không còn tác dụng, nên phải dùng margin auto */
.pf-align-left .pf-author-image   { margin-left: 0 !important; margin-right: auto !important; }
.pf-align-center .pf-author-image { margin-left: auto !important; margin-right: auto !important; }
.pf-align-right .pf-author-image  { margin-left: auto !important; margin-right: 0 !important; }

.pf-author-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center var(--pfa-obj-pos-y, 50%);

  filter: var(--pfa-filter, none);
  mix-blend-mode: var(--pfa-blend, normal);

  transition: filter .3s ease;
}

.pf-author-image:hover img {
  filter: var(--pfa-filter-hover, var(--pfa-filter, none));
}

.pf-author-image-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}


/* v2.2.0: khi bật Full Width, align luôn ăn kể cả theme/builder có CSS đè display */
.pf-author-image-outer--full.pf-align-left .pf-author-image{
  display:block !important;
  margin-left:0 !important;
  margin-right:auto !important;
}
.pf-author-image-outer--full.pf-align-center .pf-author-image{
  display:block !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.pf-author-image-outer--full.pf-align-right .pf-author-image{
  display:block !important;
  margin-left:auto !important;
  margin-right:0 !important;
}
