/* ID Image Overlay */

/* IDVE: move visual settings from the block wrapper to .idio-wrapper.
   Margin is kept on the block for layout spacing. */
.idve-block-id_image_overlay {
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    background: none !important;
}

.idio-wrapper {
    position: relative;
    display: inline-block;
    max-width: 100%;
    line-height: 0;
    overflow: hidden;
}

.idio-link {
    display: block;
    text-decoration: none;
    border-radius: inherit;
    overflow: hidden;
}

.idio-image-container {
    position: relative;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    border-radius: inherit;
}

.idio-image {
    display: block;
    max-width: 100%;
    height: auto;
}

/* Full overlay layer */
.idio-full-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
    border-radius: inherit;
}

.idio-overlay {
    position: absolute;
    max-width: 80%;
    box-sizing: border-box;
    line-height: 1.4;
    z-index: 2;
}

/* Full coverage - text container has no background */
.idio-coverage-full .idio-overlay {
    max-width: 90%;
}

.idio-text {
    display: inline-block;
}

/* Position: Top */
.idio-position-top-left .idio-overlay {
    top: 10px;
    left: 10px;
}

.idio-position-top-center .idio-overlay {
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
}

.idio-position-top-right .idio-overlay {
    top: 10px;
    right: 10px;
}

/* Position: Middle */
.idio-position-middle-left .idio-overlay {
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
}

.idio-position-middle-center .idio-overlay {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.idio-position-middle-right .idio-overlay {
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}

/* Position: Bottom */
.idio-position-bottom-left .idio-overlay {
    bottom: 10px;
    left: 10px;
}

.idio-position-bottom-center .idio-overlay {
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
}

.idio-position-bottom-right .idio-overlay {
    bottom: 10px;
    right: 10px;
}