/* =========================
   Fara Image Widget (Clean)
   ========================= */

.fara-image-widget{
  /* Defaults (قابل override با کنترل‌های المنتور) */
  --fara-image-corner-size-width: 120px;
  --fara-image-corner-size-height: 120px;
  --fara-image-cut-radius: 40px;

  --fara-image-corner-bg: #f7f7f7;

  --fara-image-bubble-size: 60px;
  --fara-image-bubble-bg: transparent;

  --fara-image-bubble-shadow-x: 30px;
  --fara-image-bubble-shadow-x: 30px;
  --fara-image-bubble-shadow-blur: 0px;
  --fara-image-bubble-shadow-color: #f7f7f7;
}

.fara-image-widget .fara-image-figure{
  margin: 0;
}

.fara-image-widget .fara-image-wrapper{
  position: relative;
  display: inline-block;
  line-height: 0;
  overflow: hidden; /* مهم: کرو فقط داخل باکس دیده شود */
}

.fara-image-widget img.fara-image-img{
  display: block;
  width: 100%;
  height: auto;
}

/* -----------
   Corner Base
   ----------- */
.fara-image-widget .fara-image-corner{
  position: absolute;
  width: var(--fara-image-corner-size-width);
  height: var(--fara-image-corner-size-height);
  background: var(--fara-image-corner-bg);
  z-index: 2;
  pointer-events: none;

  /* داخلی‌ها */
  --_bubble-size: var(--fara-image-bubble-size);
  --_shadow-x: var(--fara-image-bubble-shadow-x);
  --_shadow-y: var(--fara-image-bubble-shadow-x);
}

.fara-image-widget .fara-image-corner::before,
.fara-image-widget .fara-image-corner::after{
  content: "";
  position: absolute;
  width: var(--_bubble-size);
  height: var(--_bubble-size);
  background: var(--fara-image-bubble-bg);
  border-radius: 50%;
  box-shadow: var(--_shadow-x) var(--_shadow-y) var(--fara-image-bubble-shadow-blur) var(--fara-image-bubble-shadow-color);
}

/* ---------------------
   Bottom Right (default)
   --------------------- */
.fara-image-widget .fara-corner-bottom-right{
  right: 0;
  bottom: 0;
  border-top-left-radius: var(--fara-image-cut-radius);
  --_shadow-x: var(--fara-image-bubble-shadow-x);
  --_shadow-y: var(--fara-image-bubble-shadow-x);
}
.fara-image-widget .fara-corner-bottom-right::before{
  right: 0;
  top: calc(var(--_bubble-size) * -1);
}
.fara-image-widget .fara-corner-bottom-right::after{
  left: calc(var(--_bubble-size) * -1);
  bottom: 0;
}

/* ------------
   Bottom Left
   ------------ */
.fara-image-widget .fara-corner-bottom-left{
  left: 0;
  bottom: 0;
  border-top-right-radius: var(--fara-image-cut-radius);
  --_shadow-x: calc(var(--fara-image-bubble-shadow-x) * -1);
  --_shadow-y: var(--fara-image-bubble-shadow-x);
}
.fara-image-widget .fara-corner-bottom-left::before{
  left: 0;
  top: calc(var(--_bubble-size) * -1);
}
.fara-image-widget .fara-corner-bottom-left::after{
  right: calc(var(--_bubble-size) * -1);
  bottom: 0;
}

/* ----------
   Top Right
   ---------- */
.fara-image-widget .fara-corner-top-right{
  right: 0;
  top: 0;
  border-bottom-left-radius: var(--fara-image-cut-radius);
  --_shadow-x: var(--fara-image-bubble-shadow-x);
  --_shadow-y: calc(var(--fara-image-bubble-shadow-x) * -1);
}
.fara-image-widget .fara-corner-top-right::before{
  right: 0;
  bottom: calc(var(--_bubble-size) * -1);
}
.fara-image-widget .fara-corner-top-right::after{
  left: calc(var(--_bubble-size) * -1);
  top: 0;
}

/* ---------
   Top Left
   --------- */
.fara-image-widget .fara-corner-top-left{
  left: 0;
  top: 0;
  border-bottom-right-radius: var(--fara-image-cut-radius);
  --_shadow-x: calc(var(--fara-image-bubble-shadow-x) * -1);
  --_shadow-y: calc(var(--fara-image-bubble-shadow-x) * -1);
}
.fara-image-widget .fara-corner-top-left::before{
  left: 0;
  bottom: calc(var(--_bubble-size) * -1);
}
.fara-image-widget .fara-corner-top-left::after{
  right: calc(var(--_bubble-size) * -1);
  top: 0;
}

/* Caption */
.fara-image-widget .fara-image-caption{
  line-height: 1.5;
}