:root:has(.BKYC),
html:has(.BKYC),
body.BKYC {
    margin: 0px;
    border-width: 0px;
    padding: 0px;
    /* overflow: hidden; */
    min-height: var(--parent-dedicated-height);
    position: relative;
}

/* Position */
/* Size */
/* Layout */
/* Text */
/* Appearance */
/* Transition */


/* Debug */
.BKYC.debug *,
.BKYC .debug * {
    border: 1px dashed hsl(194, 100%, 50%);

}

/* #region Fonts */
/*      Parisienne */
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');

/*      Lato */
/*          latin-ext */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh7USSwaPGR_p.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/*          latin */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 300;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6u9w4BMUTPHh7USSwiPGQ.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*          latin-ext */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/*          latin */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/lato/v24/S6uyw4BMUTPHjx4wXg.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/*      Trajan Pro */
@font-face {
    font-family: 'TrajanPro';
    font-style: normal;
    font-weight: 400;
    src: url("trajanpro.woff") format('woff');
}

/*      Adobe Garamond Regular */
@font-face {
    font-family: 'AGaramond';
    font-style: normal;
    font-weight: 400;
    src: url("agaramond_regular.woff") format('woff');
}


/* #endregion Fonts */

.BKYC {
    /* Colors */
    --col-pg-bg: hsl(0, 0%, 90%);
    --col-01: hsl(219, 43%, 22%);
    --col-01-highlight: hsl(219, 43%, 32%);
    --col-02: hsl(352, 74%, 44%);
    --col-02-highlight: hsl(352, 74%, 50%);
    --col-03: hsl(201, 97%, 30%);
    --col-04: hsl(207, 30%, 54%);

    /* Text */
    --text-color-01: hsl(0, 0%, 0%);
    --text-color-02: hsl(0, 0%, 100%);
    --text-font-01: 'Lato';

    --bk-text-font-heading: "Trajan Pro";
    --bk-text-font-sansserif: "Lato";
    --bk-text-font-serif: "EB Garamond,sans-serif";
    --bk-text-font-fancy: 'Parisienne', cursive;
    --bk-text-color-error: rgb(255, 81, 0);



    /* Shadows */
    /* offset-x | offset-y | blur-radius | spread-radius | color */
    --shadow-00: 0px 0px 0px 0px hsla(0, 0%, 33%, 0);
    --shadow-01: 0px 0px 12px 1px hsla(0, 0%, 0%, 0.5);
    --shadow-02: 0px 0px 8px 1px hsla(0, 0%, 0%, 0.95);

    /* Rounding */
    --border-radius: 10px;

    /* Sizing */
    --size-00: 14px;
    --size-01: 16px;
    --size-01-5: 20px;
    --size-02: 24px;
    --size-03: 32px;
    --size-04: 40px;
    --size-05: 48px;
    --size-06: 56px;

    & * {
        user-select: none;
    }


    /* #region Themes */

    /*      Default */
    --theme-primary: var(--col-01);
    --theme-color: var(var(--text-color-02));
    --theme-pop-bg: hsl(0, 0%, 100%);

    & .theme-blue {
        --theme-primary: var(--col-01);
        --theme-color: var(var(--text-color-02));
        --theme-pg-bg: var(--theme-pop-bg);
    }

    & .theme-red {
        --theme-primary: var(--col-02);
        --theme-color: var(var(--text-color-02));
        --theme-pg-bg: var(--theme-pop-bg);
    }


    & .btn {
        /* Position */
        position: relative;

        /* Size */
        border-width: 0px;
        padding: 1em;
        margin: var(--size-03);

        /* Layout */
        display: inline-block;

        /* Text */
        color: var(--text-color-02);
        font-weight: 500;
        letter-spacing: 1px;
        text-decoration: none;

        /* Appearance */
        background-color: var(--theme-primary);
        cursor: pointer;
        filter: brightness(100%);
        box-shadow: var(--shadow-01);

        /* Transitions */
        transition:
            background-color 150ms linear 0ms,
            box-shadow 100ms linear 0ms,
            transform 100ms linear 0ms,
            filter 100ms linear 0ms;
    }

    & .btn:hover {
        /* Text */
        color: var(--text-color-02);

        /* Appearance */
        filter: brightness(110%);
        box-shadow: var(--shadow-02);

    }

    & .btn:active {
        /* Text */
        color: var(--text-color-02);

        /* Appearance */
        box-shadow:
            var(--shadow-01),
            inset 0px 0px 8px 0px hsla(0, 0%, 0%, 50%);

        /* Transition */
        transition:
            background-color 50ms linear 0ms,
            box-shadow 50ms linear 0ms,
            transform 150ms linear 0ms;
    }

}