/*#region Public Card*/

/*.fpmreveal-host:has(> .fpmpublic-card) {
    padding: clamp(1rem, 4vw, 4rem);
}*/

.fpmpublic-card.e-card {
    align-items: center;
    border: 0;
    border-radius: .875rem;
    box-shadow: 0 .875rem 2.5rem rgb(53 66 82 / 17%);
    display: flex;
    flex: 1 1 100%;
    justify-content: center;
    margin: 0 auto;
    min-height: 0;
    overflow: hidden;
/*    padding: clamp(1rem, 4vw, 4rem);
    width: min(100%, 44rem);
*/}

    .fpmpublic-card.e-card > .e-card-content {
        align-items: center;
        display: flex;
        flex: 1 1 100%;
        flex-direction: column;
        justify-content: flex-start;
        overflow: visible;
        padding: clamp(2rem, 6vw, 4rem) !important;
        text-align: center;
    }

/*#endregion*/

/*#region Public Card Components*/

.fpmpublic-eyebrow {
    color: var(--fpm-blue-base);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .12em;
    margin-bottom: .5rem;
    text-transform: uppercase;
}

.fpmpublic-page-title {
    color: var(--fpm-blue-dark);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 650;
    line-height: 1.15;
    margin: 0 0 1rem;
}

.fpmpublic-page-message {
    box-sizing: border-box;
    color: var(--fpm-gray-dark);
    font-size: 1.05rem;
    line-height: 1.65;
    margin: 0 auto 1.5rem;
    /*max-width: 35rem;*/
    width: 100%;
}

.fpmpublic-page-guidance {
    background-color: var(--fpm-lightgray-light);
    border: 1px solid var(--fpm-lightgray-base);
    border-radius: var(--fpm-border-radius);
    box-sizing: border-box;
    color: var(--fpm-gray-dark);
    line-height: 1.55;
    margin: 0 auto 1.5rem;
    max-width: 35rem;
    padding: 1rem 1.25rem;
    text-align: left;
    width: 100%;
}

/*#endregion*/

/*#region Public Card Action Button*/

.fpmpublic-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: center;
}

.fpmpublic-page-action.e-btn {
    border-radius: .5rem;
    font-weight: 600;
    min-width: 12rem;
    padding: .7rem 1.5rem;
}

    .fpmpublic-page-action.e-btn.e-primary {
        background-color: var(--fpm-blue-base) !important;
        border-color: var(--fpm-blue-base) !important;
        color: var(--fpm-white) !important;
    }

        .fpmpublic-page-action.e-btn.e-primary:hover,
        .fpmpublic-page-action.e-btn.e-primary:active,
        .fpmpublic-page-action.e-btn.e-primary.e-active {
            background-color: var(--fpm-blue-dark) !important;
            border-color: var(--fpm-blue-dark) !important;
            color: var(--fpm-white) !important;
        }

        .fpmpublic-page-action.e-btn.e-primary:focus,
        .fpmpublic-page-action.e-btn.e-primary:focus-visible {
            box-shadow: 0 0 0 .25rem rgb(94 117 144 / 40%) !important;
        }

/*#endregion*/

/*#region Error Icon*/

.fpmerror-icon {
    background-color: var(--fpm-orange-light);
    border-radius: 50%;
    display: grid;
    height: 5rem;
    margin: 0 auto 1.5rem;
    place-items: center;
    width: 5rem;
}

    .fpmerror-icon::before {
        background-color: var(--fpm-orange-base);
        content: "";
        display: block;
        height: 3rem;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16Zm-1-5h2v2h-2v-2Zm0-8h2v6h-2V7Z'/%3E%3C/svg%3E") center / contain no-repeat;
        width: 3rem;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm0 18a8 8 0 1 1 0-16 8 8 0 0 1 0 16Zm-1-5h2v2h-2v-2Zm0-8h2v6h-2V7Z'/%3E%3C/svg%3E") center / contain no-repeat;
    }

/*#endregion*/

@media (max-width: 600px), (max-height: 700px) {
    .fpmreveal-host:has(> .fpmpublic-card) {
        padding: .75rem;
    }

    .fpmpublic-card.e-card {
        align-items: flex-start;
        padding: .75rem;
    }

        .fpmpublic-card.e-card > .e-card-content {
            justify-content: flex-start;
            overflow: visible;
        }

    .fpmpublic-page-actions {
        flex-direction: column;
    }

    .fpmpublic-page-action.e-btn {
        min-width: 0;
        width: 100%;
    }
}