// Form Builder styles.
//
// Admin popup + Form congrats wizard.
//
// @since 1.8.0

.charitable-admin-popup-container.charitable-admin-popup-congrats-wizard {
	background-color: rgba( 0, 0, 0, .5 );
	display: none;
	height: 100vh;
	left: 0;
	overflow: hidden;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 100100; // Inside (related to) the #wpwrap.


    .charitable-admin-popup {
        background-color: white;
        border-radius: $border_radius_m;
        -moz-box-shadow: 0 0 40px 0 rgba( 0, 0, 0, .2 );
        -webkit-box-shadow: 0 0 40px 0 rgba( 0, 0, 0, .2 );
        box-shadow: 0 0 40px 0 rgba( 0, 0, 0, .2 );
        display: block !important;
        left: 50%;
        max-width: 560px;
        min-width: 560px;
        position: absolute;
        text-align: center;
        top: 50%;
        transform: translate( -50%, -50% );
        overflow: visible;
    }

    .charitable-admin-popup-content {
        padding: 30px 40px 25px 40px;

        @include font_smoothing();

        h3 {
            color: $color_primary_text;
            font-size: 20px;
            line-height: 22px;
            font-weight: 600;
            letter-spacing: 0;
            margin: 5px auto;
            text-align: center;
        }
        h4 {
            color: $color_primary_text;
            font-size: 20px;
            line-height: 22px;
            font-weight: 600;
            letter-spacing: 0;
            margin: 5px auto;
            text-align: center;
        }

        p {
            color: $color_secondary_text;
            font-size: $font_size_m;
            letter-spacing: 0;
            line-height: 22px;
            margin: 0 0 15px 0;
            text-align: center;

            &.no-gap {
                margin-bottom: 0;
            }

            &.secondary {
                font-size: 13px;
                line-height: 22px;
                margin: 0;
                &.see-more {
                    margin-top: 15px;
                }
            }

            &.icon {
                font-size: 32px;
                line-height: 32px;
            }
        }

        b {
            font-weight: 600;
        }

        .charitable-admin-campaign-link {
            font-size: 15px;
            line-height: 15px;
            &.no-style {
                text-decoration: none;
            }
        }
        a:not(.charitable-admin-congrats-popup-btn) {
            color: #777777;
            text-decoration-line: underline;
        }

    }

    .charitable-admin-congrats-popup-btn {
        background-color: #F8F8F9;
        border: 1px solid #D7D7DB;
        border-radius: 5px;
        box-shadow: none;
        color: #5C5F6A;
        cursor: pointer;
        display: inline-block;
        font-size: 16px;
        font-weight: 700;
        line-height: 19px;
        max-width: calc( 50% - 15px );
        width: auto;
        overflow: hidden;
        padding: 10px 20px;
        text-align: center;
        text-decoration: none;
        vertical-align: middle;
        white-space: nowrap;
        margin: 20px auto 15px auto;
        text-decoration-line: none;

        &:hover {
            background-color: #DBDBDE;
        }

        .popup_icon {
            margin-left: 6px;
            margin-bottom: -2px;
            filter: brightness(50%);
        }

        &:disabled {
            cursor: default;
            opacity: .5;

            &:hover {
                background-color: $color_orange;
            }
        }
    }

    .charitable-admin-popup-close {
        cursor: pointer;
        display: block;
        position: absolute;
        right: 25px;
        top: 25px;
        img {
            width: 15px;
            height: 15px;
        }

        &:hover {
            color: $color_close_hover;
        }
    }

    .charitable-admin-popup-embed {
        margin: 10px 0 10px 0;
        padding-bottom: 20px;
    }

    .charitable-admin-popup-enhancements {
        margin: 10px 0 0 0;
        p {
            margin-top: 2px;
            margin-bottom: 2px;
        }
    }

    .charitable-admin-popup-bottom {
        margin: 10px 0 0 10px;
    }


    .charitable-admin-popup-whats-next {

        color: #474A57;
        font-weight: 700;
        text-align: left;

        border: 1px solid #F6F6F6;
        border-radius: 5px;

        .charitable-admin-popup-whats-next-title {
            text-align: left;
            border-bottom: 1px solid #F6F6F6;
            padding: 0 20px;
            min-height: 46px;
            text-align: left;

            p {
                margin: 0;
                text-align: left;
                line-height: 46px;
                font-size: 13px;
            }
        }

        .charitable-admin-popup-whats-next-item {

            margin-left: 20px;
            margin-right: 20px;
            padding-bottom: 25px;
            border-bottom: 1px solid #F6F6F6;
            clear: both;
            display: table;
            padding-top: 30px;

            .charitable-admin-popup-whats-next-item-icon {
                float: left;
                width: 27px;
                margin-right: 20px;
            }
            .charitable-admin-popup-whats-next-item-text {
                float: left;
                text-align: left;
                width: 390px;
                h5 {
                    color: #474A57;
                    font-weight: 700;
                    margin: 0 0 10px 0;
                    font-size: 14px;
                    line-height: 14px;
                }
                p {
                    color: #8C8E96;
                    font-weight: 400;
                    text-align: left;
                    font-size: 13px;
                    line-height: 22px;
                    letter-spacing: 0;
                }
                a {
                    font-weight: 700;
                    text-decoration: underline;
                }
            }

        }

    }

}