// STATES
// -----------------------------------------------------------------------------
.text-muted {
    color: $color-muted !important;
}

// COLORs
// -----------------------------------------------------------------------------
.text-light {
    color: #FFF !important;

    &.wpb_text_column p {
        color: #FFF !important;
    }
}

// WEIGHTS
// -----------------------------------------------------------------------------
.font-weight-light,
.text-weight-light {
    font-weight: $font-weight-light;
    * {
        font-weight: $font-weight-light;
    }
}
.font-weight-normal,
.text-weight-normal {
    font-weight: $font-weight-normal;
    * {
        font-weight: $font-weight-normal;
    }
}
.font-weight-semibold,
.text-weight-semibold {
    font-weight: $font-weight-semibold;
    * {
        font-weight: $font-weight-semibold;
    }
}
.font-weight-bold,
.text-weight-bold {
    font-weight: $font-weight-bold;
    * {
        font-weight: $font-weight-bold;
    }
}

// TEXT OTHERS
// -----------------------------------------------------------------------------
.text-uppercase {
    text-transform: uppercase;
}

.text-lowercase {
    text-transform: lowercase;
}

.text-capitalize {
    text-transform: capitalize;
}

/* Close */
.mfp-close,
.mfp-close-btn-in .mfp-close {
    font-weight: $font-weight-semibold;
    font-size: 22px;
    color: #838383;
}

.mfp-wrap {
    direction: ltr;

    html.browser-rtl & {
        direction: rtl;
    }
}

.mfp-content {
    direction: if-ltr(ltr, rtl);
}

/* No Margins */
.mfp-no-margins {
    img.mfp-img {
        padding: 0;
    }
    .mfp-figure:after {
        top: 0;
        bottom: 0;
    }
    .mfp-container {
        padding: 0;
    }
}

.mfp-content {
    .mfp-figure figure:before {
        background: #f3f3f3;
        content: "";
        position: absolute;
        width: 100%;
        top: 40px; bottom: 40px;
    }
    .mfp-figure img.mfp-img {
        position: relative;
    }
}

/* Zoom */
.mfp-with-zoom {
    .mfp-container, &.mfp-bg {
        opacity: 0.001;
        -webkit-backface-visibility: hidden;
        @include transition(all 0.3s ease-out);
    }
    &.mfp-ready {
        .mfp-container {
            opacity: 1;
        }
        &.mfp-bg {
            opacity: 0.8;
        }
    }
    &.mfp-removing {
        .mfp-container, &.mfp-bg {
            opacity: 0;
        }
    }
}

/* Animnate */
.my-mfp-zoom-in {
    .zoom-anim-dialog {
        opacity: 0;
        @include transition(all 0.2s ease-in-out);
        @include transform(scale(0.8));
    }
    &.mfp-ready .zoom-anim-dialog {
        opacity: 1;
        @include transform(scale(1));
    }
    &.mfp-removing .zoom-anim-dialog {
        @include transform(scale(0.8));
        opacity: 0;
    }
    &.mfp-bg {
        opacity: 0.001;
        /* Chrome opacity transition bug */
        @include transition(opacity 0.3s ease-out);
    }
    &.mfp-ready.mfp-bg {
        opacity: 0.8;
    }
    &.mfp-removing.mfp-bg {
        opacity: 0;
    }
}

.my-mfp-slide-bottom {
    .zoom-anim-dialog {
        opacity: 0;
        @include transition(all 0.2s ease-out);
        @include transform(translateY(-20px) perspective(600px) rotateX(10deg));
    }
    &.mfp-ready .zoom-anim-dialog {
        opacity: 1;
        @include transform(translateY(0) perspective(600px) rotateX(0));
    }
    &.mfp-removing .zoom-anim-dialog {
        opacity: 0;
        @include transform(translateY(-10px) perspective(600px) rotateX(10deg));
    }
    &.mfp-bg {
        opacity: 0.01;
        @include transition(opacity 0.3s ease-out);
    }
    &.mfp-ready.mfp-bg {
        opacity: 0.8;
    }
    &.mfp-removing.mfp-bg {
        opacity: 0;
    }
}

/* Popup Block */
.dialog {
    padding: 20px 25px;
    text-align: $left;
    max-width: 600px;
    margin: 40px auto;
    position: relative;

    &.dialog-xs {
        max-width: 200px;
    }
    &.dialog-sm {
        max-width: 400px;
    }
    &.dialog-md {
        max-width: 600px;
    }
    &.dialog-lg {
        max-width: 900px;
    }
}

/* White Popup Block */
.white-popup-block {
    background: #fff;
    padding: 20px 30px;
    text-align: left;
    max-width: 600px;
    margin: 40px auto;
    position: relative;
    &.white-popup-block-xs {
        max-width: 200px;
    }
    &.white-popup-block-sm {
        max-width: 400px;
    }
    &.white-popup-block-md {
        max-width: 600px;
    }
    &.white-popup-block-lg {
        max-width: 900px;
    }
}

/* Popup */
.popup-inline-content,
.mfp-content .ajax-container {
    margin: 40px auto;
    max-width: 1170px;
    padding: 20px 25px;
    position: relative;
    text-align: $left;
    display: none;

    @media #{$screen-medium} {
        padding: 20px 12px;
    }
}

.mfp-content .ajax-container {
    display: block;
}

.mfp-wrap .popup-inline-content {
    display: block;
}