
@function is_dark(){
    $color-brightness: round((red($background_color) * 299) + (green($background_color) * 587) + (blue($background_color) * 114) / 1000);
    $light-color: round((red(#ffffff) * 299) + (green(#ffffff) * 587) + (blue(#ffffff) * 114) / 1000);
    @if abs( $color-brightness ) < ( $light-color / 2 ){
        @return true;
    }
    @else {
        @return false;
    }
}
/**
 * Gradient
 * @include bg-gradient;
 * @since removed @if( $header_background_gradient_color != $header_bg_color )
 */
@mixin bg-gradient($angle: 90deg) {
    background-image: -ms-linear-gradient($angle, var(--thm_header_bg_color), var(--thm_header_background_gradient_color) );
    background: -o-linear-gradient($angle,  var(--thm_header_bg_color), var(--thm_header_background_gradient_color));
    background: linear-gradient($angle,  var(--thm_header_bg_color), var(--thm_header_background_gradient_color) );
}
/**
 * Contrast Color
 * @include text-color( $background_color )
 */
@mixin text-color( $background_color ) {
    $color-brightness: round((red($background_color) * 299) + (green($background_color) * 587) + (blue($background_color) * 114) / 1000);
    $light-color: round((red(#ffffff) * 299) + (green(#ffffff) * 587) + (blue(#ffffff) * 114) / 1000);
    @if abs($color-brightness) < ($light-color/2){
        color: #ffffff;
    }
    @else {
        color: #333333;
    }
}
/**
 * Clearfix
 * @include clearfix;
 */
@mixin clearfix {
    &:before,
        &:after {
        content: " ";
        display: table;
    }
    &:after {
        clear: both;
    }
}
/**
 * hide when not focus or hover
 * @include clip;
 */
@mixin clip{
    clip:rect(1px,1px,1px,1px);
    clip-path:polygon(0px 0px,0px 0px,0px 0px,0px 0px);
    height:1px;
    overflow:hidden;
    white-space:nowrap;
    width:1px;
    &:hover,
        &:focus {
        clip:auto!important;
        clip-path:none;
        display:block;
        height:auto;
        width:auto;
        z-index:100000;
    }
}
/**
 * font size
 * @include font_size(1);
 */
@mixin font_size( $level , $margin: default-margin) {
    $line-heights: (
        6: $content_line_height,  // h6
        5: $content_line_height,  // H5
        4: $common_line_height,      // H4
        0: $content_line_height,      // p
        3: $common_line_height,  // H3
        2: $common_line_height,   // H2
        1: $common_line_height,      // H1
        );
    @if $heading_font_scale == 'xxx' {
        $type-scale: (
            6: $heading_font_base * 0.6875px,  // h6
            5: $heading_font_base * 0.8125px,  // H5
            4: $heading_font_base * 1px,      // H4
            0: 1rem,      // p
            3: $heading_font_base * 1.5px,  // H3
            2: $heading_font_base * 2px,   // H2
            1: $heading_font_base * 3px     // H1
            );
    } @else {
        $type-scale: (
            6: $heading_font_base * 0.6875px,  // h6
            5: $heading_font_base * 0.8125px,  // H5
            4: $heading_font_base * 1px,      // H4
            0: 1rem,      // p
            3: $heading_font_base * 1.17px,  // H3
            2: $heading_font_base * 1.4px,   // H2
            1: $heading_font_base * 2px      // H1
            );
    }
    font-size: map-get($type-scale, $level);
    line-height:map-get($line-heights, $level);
    @if( 'default-margin' == $margin) {
        margin-top: map-get($type-scale, $level) * 1.5;
        margin-bottom: map-get($type-scale, $level) * .75;
    }
}
/**
 * Basic Block Elements
 * @extend %block;
 */
%block {
    width: var(--thm_content_width, 720px );
    max-width:100%;
    margin:1.5rem auto .75rem;
    padding-left:var( --thm_content_gap, 24px );
    padding-right:var( --thm_content_gap, 24px );
    box-sizing:border-box;
    &.has-background{
        // width: calc( var(--thm_content_width, 720px) - var(--thm_content_gap, 24px) * 2);
    }

}
/**
 * Wide Block Elements
 * @extend %block_wide;
 */
%block_wide {
    width:calc( var(--thm_content_width, 720px) + var(--thm_align_offset) );
    max-width:100%;
    margin:1.5rem auto .75rem;
    padding-left:var( --thm_content_gap, 24px );
    padding-right:var( --thm_content_gap, 24px );
    box-sizing:border-box;
}
/**
 * Wide Block Elements
 * @extend %block_main_wide;
 */
%block_main_wide {
    width: var( --thm_main_width, 1280px );
    margin-top:1.5rem;
    margin-bottom:.75rem;
    padding-left:var( --thm_content_gap, 24px );
    padding-right:var( --thm_content_gap, 24px );
    box-sizing:border-box;
}
/**
 * Grid Template
 * @extend %grid;
 * .grid
 */
%grid{
    margin-top:var(--thm_content_gap, 24px);
    display:flex;
    align-items:stretch;
    flex-wrap:wrap;
    overflow:visible;// change auto to visible firefox scrollbar issue
    padding:0;
    max-width:100%;
    .article-wrapper{
        flex:1 1 auto;
        width: var(--thm_content_width, 296px );
        align-self:stretch;
        margin: var( --thm_box_gap,3px);
        article{
            display:flex;
            align-items: center;
            flex-direction:column;
            align-items:stretch;
            max-width:100%;
            height:100%;
            header{
                flex:0 1 auto;
                align-self: flex-start;
                margin-top:0;

            }
            footer{
                flex:0 0 auto;
                align-self: flex-end;
                margin-bottom:var( --thm_content_gap, 24px );
                height:auto;
                display:flex;
                justify-content:flex-end;
                margin-top:0;
                min-height:0;
                span{
                    display:flex;
                    display:inline-flex;
                    justify-content:flex-end;
                    flex:0 0 auto;
                    align-self: flex-end;
                    width:auto;
                    height:100%;
                    margin-left:calc( var(--thm_box_gap, 3px) * 2 );
                    a{
                        flex:0 0 auto;
                        justify-content:flex-end;
                        display:inline-block;
                        vertical-align:baseline;
                        max-height:calc( 3rem - 2px);
                    }
                }


            }
            footer:empty{
                margin:0;
            }
        }
    }
}
/**
 * @extend %hyphenate;
 */
%hyphenate {
    -ms-word-break: break-all;
    //word-break: break-all;
    word-break: break-word;
    overflow-wrap:break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}
/**
 * Box Shadow
 * @extend %boxshadow
 *
 * Already outdated
 */
%boxshadow {
    -webkit-box-shadow:var(--thm_box_shadow);
    -moz-box-shadow:var(--thm_box_shadow);
    box-shadow:var(--thm_box_shadow);
}

/**
 * @extend %fulltext
*/

%fulltext {
    &.blog{
        .entry-content{
            .content-excerpt:not(:empty){
                padding-bottom:3rem;
            }
        }
    }
    &.home{
        &.page{
            article{
                header{
                    display:none;
                    &.show-post-image{
                        display:block;
                    }
                }
            }
        }
    }
    article{
        & > header{
            .entry-title{
                max-width:calc( var(--thm_content_width, 720px) + var(--thm_align_offset) );
                margin-left:auto;
                margin-right:auto;
            }
        }
        & > .entry-content{
            .content-excerpt:empty{
                display:none;
            }
        }
        & > footer{
            padding-left:0;
            padding-right:0;
            min-height:6rem;
            &:empty{
                display:none;
            }
        }
    }
    .wp-block-latest-comments{
        .wp-block-latest-comments__comment{
            footer{
                min-height:0;
            }
            article{
                width:auto;

            }
        }
    }
    &.search article.has-post-thumbnail,
    &.home article.has-post-thumbnail,
    &.archive article.has-post-thumbnail{
        border:none;
    }
}
/**
 * alignleft
 * @extend %alignleft
 */
%alignleft {
    box-sizing:border-box;
    clear:left;
    float:left;
    max-width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );
    width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );
    margin-right:1rem;
    margin-left:var(--thm_content_gap, 24px);
    margin-top:1.5rem;
    margin-bottom:.75rem;
    padding:0;
    &.wp-block-embed{
        width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );
    }
    & > figure{
        margin-top:0;
        margin-bottom:0;
    }
    .alignleft,
    .alignright{
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
        float:none;
    }
    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
    }
}
/**
 * alignright
 * @extend %alignright
 */
%alignright {
    box-sizing:border-box;
    clear:right;
    float:right;
    max-width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );
    width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );

    margin-left:var(--thm_content_gap, 24px);
    margin-right:1rem;
    margin-top:1.5rem;
    margin-bottom:.75rem;
    padding:0;
    &.wp-block-embed{
        width:calc( 50% - var(--thm_content_gap, 24px) - 1rem );
    }
    & > figure{
        margin-top:0;
        margin-bottom:0;
    }
    &.wp-block-media-text{
        p{
            max-width:100%;
        }
    }
    .alignleft,
    .alignright{
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
        float:none;
    }
    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
    }
}
/**
 * aligncenter
 * @extend %aligncenter
 */
%aligncenter {
    box-sizing:border-box;
    clear:both;
    float:none;
    width:calc( var(--thm_content_width, 720px) - var(--thm_align_offset) );
    max-width:100%;
    margin:1.5rem auto .75rem;

    @media screen and ( max-width : 640px ) {
        // static break point
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
    }
}
/**
 * alignwide
 * @extend %alignwide;
 */
%alignwide{
    width:calc( var(--thm_content_width, 720px) + var(--thm_align_offset) );
    position: relative;
    left:0;
    margin-left:auto;
    margin-right:auto;
    max-width:100%
}
/**
 * has sidebar alignfull
 * @extend %has-sidebar-alignfull;
 */
%has-sidebar-alignfull{
    position:relative;
    width:100%;

}
/**
 * no sidebar alignfull
 * @extend %no-sidebar-alignfull;
 */
%no-sidebar-alignfull{
    width:100vw;
    position:relative;
    overflow:visible;

    @media screen and ( min-width : 1280px ) {

        // Limit width
        width:1600px;
        margin-left:auto;
        margin-right:auto;
        max-width:100%;
    }
}
/**
 * no sidebar alignfull
 * @extend %die-aligns;
 */
%die-aligns{
    .emulsion-full,
    .remove-aligns{
        float:none;
        clear:both;
        position:static;
        display:block;
        max-width:100%;
        margin-left:auto;
        margin-right:auto;
        overflow:visible;
        padding-left:0;
        padding-right:0;
        flex:none;
        background-size:cover;
    }
    ul,ol{
        li:not(.wp-block-gallery){
            @extend .remove-aligns;
            display: list-item;
            width:100%;
        }
    }
    [class|="wp-block"]:not(.wp-block-gallery){
        &.size1of2,
        &.size1of3,
        &.size2of3,
        &.size1of4,
        &.size3of4,
        &.size1of5,
        &.size2of5,
        &.size3of5,
        &.size4of5,
        &.alignleft,
        &.alignright,
        &.alignwide,
        &.alignfull{
            @extend .remove-aligns;
        }
        &.alignfull{
            .alignfull{
                @extend .remove-aligns;
            }
        }
        .size1of2,
        .size1of3,
        .size2of3,
        .size1of4,
        .size3of4,
        .size1of5,
        .size2of5,
        .size3of5,
        .size4of5{
            @extend .remove-aligns;
            width:100%;
        }
        .alignnone,
        .aligncenter,
        .alignleft,
        .alignright,
        .alignwide,
        .alignfull{
            @extend .remove-aligns;
            max-width:100%;
        }
    }
    .alignnone,
    .aligncenter,
    .alignleft,
    .alignright,
    .alignwide,
    .alignfull{
        @extend .remove-aligns;
        max-width:100%;
    }
    .wp-block-column {
        width:100%;
        max-width:100%;
    }
    .shortcode-wrapper,
    .wp-block-media-text,
    .wp-block-pullquote,
    .wp-block-cover{
        height:auto;
        overflow-y:visible;
        &.aligncenter,
        &.alignleft,
        &.alignright,
        &.alignwide,
        &.alignfull{
            @extend .remove-aligns;
            max-width:100%;
            margin-left:0;
            margin-right:0;
            padding-left:0;
            padding-right:0;
            // position:static;
            position:relative;
            left:0;
            background-size:cover;
        }
        &.alignwide{
            margin-left:auto;
            margin-right:auto;
        }
        &:before{
            display:none!important;
        }
    }
}
/**
 * Download button file type
 * @extend %download-button-file-type
 */
%download-button-file-type{
    font-size:var(--thm_meta_data_font_size, 13px);
    text-transform:var(--thm_meta_data_font_transform);
    display:inline-block;
    margin:auto 1rem;
    padding:3px 6px;
    border-bottom-color:var(--thm_common_border, rgba(188,188,188,.5));
    border-bottom-style:var(--thm_common_border_style);
    border-bottom-width:var(--thm_common_border_width);
}
/**
 * Block editor list presentation
 * @extend %list-effect-editor
 */
%list-effect-editor{

    ol:not(.list-style-initial):not(.wp-list-comments):not(.is-style-list-style-initial){
        &.circle{
            li:before{
                border-radius:50%;
            }
        }
        &.is-style-list-style-none,
        &.list-style-none{
            li{
                margin-left:0;
                list-style-type:none;
                text-indent:0;
                &:before{
                    content:''!important;
                    display:none!important;
                }
            }
        }
        counter-reset: emulsion-counter;
        li{
            list-style-type:none;
            text-indent:-24px;
            *:not(li){
                text-indent:0;
            }
            &:before{
                text-indent:0;
                margin-right:1rem;
                counter-increment: emulsion-counter;
                content: counter( emulsion-counter );
                font-size:var(--thm_meta_data_font_size, 13px);
                background: var(--thm_default_bullet_color, #3498db);
                color: var(--thm_white_color,#ffffff);
                display:inline-block;
                text-align:center;
                width: calc(1rem * var(--thm_content_line_height ) );
                line-height: calc(1rem * var(--thm_content_line_height ) );
            }
            ol{
                counter-reset: emulsion-counter-lv1;
                padding-left: calc( 1rem * var(--thm_content_line_height ) +  1rem );
                li{
                    margin-left:0;
                    list-style-type:none;
                    &:before{
                        counter-increment: emulsion-counter-lv1;
                        content: counter( emulsion-counter-lv1 );
                        width: calc(1rem * var(--thm_content_line_height ) );
                        line-height: calc(1rem * var(--thm_content_line_height ) );
                    }
                    ol{
                        counter-reset: emulsion-counter-lv2;
                        padding-left: calc(1rem * var(--thm_content_line_height ) + 1rem );
                        margin:0;
                        & > li{
                            margin-left:0;
                            list-style-type:none;
                            &:before{
                                counter-increment: emulsion-counter-lv2;
                                content: counter( emulsion-counter-lv2 );
                                width: calc(1rem * var(--thm_content_line_height ) );
                                line-height: calc(1rem * var(--thm_content_line_height ) );
                            }
                        }
                    }
                    ul{
                        margin-top:0;
                        margin-bottom:0;
                    }
                }
            }
            ul{
                padding-left:40px;
                li{
                    list-style-type:none;
                    margin-left:0;
                    &:before{
                        counter-increment: none;
                        background: var(--thm_default_bullet_color, #3498db);
                        color: var(--thm_white_color,#ffffff);
                        content:' ';
                        width: calc(1rem / 3 );
                        height: calc(1rem / 3 );
                        border-radius:50%;
                        vertical-align:middle;
                    }
                    ul{
                        padding-left: calc(1rem * var(--thm_content_line_height ) + 1rem );
                        margin:0;
                        li{
                            margin-left:0;
                            list-style-type:none;
                            &:before{
                                counter-increment: none;
                                background:rgba(147,147,147,1);
                                content:' ';
                                width: calc(1rem / 3 );
                                height: calc(1rem / 3 );
                                border-radius:0;
                                vertical-align:middle;
                            }
                        }
                    }
                    ol{
                        margin-top:0;
                        margin-bottom:0;
                    }
                }
            }
        }
        &.circle li:before{
            border-radius:50%;
        }
    }
    .wp-block-gallery{
        li{
            list-style-type:none;
            text-indent:0;
            margin-left:0;
            &:before{
                content:''!important;
                display:none!important;
            }
        }
    }
    .wp-block-navigation ul{
        li{
            margin-left:1rem;
            list-style-type:none;
            text-indent:0;
            margin-left:0;
            &:before{
                content:''!important;
                display:none!important;
            }
        }
    }

    ul.wp-block:not(.list-style-initial):not(.is-style-list-style-initial){
        &.is-style-list-style-none,
        &.list-style-none{
            li{
                margin-left:1rem;
                list-style-type:none;
                text-indent:0;
                &:before{
                    content:''!important;
                    display:none!important;
                }
            }
        }
        li{
            list-style-type:none;
            text-indent:-24px;
            *:not(li){
                text-indent:0;
            }
            &:before{
                margin-right:1rem;
                content:' ';

                display:inline-block;
                text-align:center;
                width: calc(1rem / 3 );
                height: calc(1rem / 3 );
                border-radius:50%;
                vertical-align:middle;
                background: var(--thm_default_bullet_color, #3498db);
                color: var(--thm_white_color);

            }
            ul{
                padding-left: calc(1rem * var(--thm_content_line_height ) +  1rem );
                padding-right:0;
                margin-top:0;
                margin-bottom:0;
                li{
                    margin-left:0;
                    list-style-type:none;
                    &:before{
                        counter-increment: none;
                        background:rgba(147,147,147,1);
                        content:' ';
                        width: calc(1rem / 3 );
                        height: calc(1rem / 3 );
                        border-radius:0;
                        vertical-align:middle;
                    }
                    ul{
                        padding-left: calc(1rem * var(--thm_content_line_height ) + 1rem );
                        padding-right:0;
                        li{
                            margin-left:0;
                            padding-left:0;
                            padding-right:0;
                            list-style-type:none;
                            &:before{
                                counter-increment: none;
                                background:rgba(147,147,147,1);
                                content:' ';
                                width: calc(1rem / 3 );
                                height: calc(1rem / 3 );
                                border-radius:50%;
                                vertical-align:middle;
                            }
                        }
                    }
                }
            }
            ol{
                counter-reset: emulsion-counter-lv1;
                padding-left: calc(1rem * var(--thm_content_line_height ) + 1rem );
                margin-top:0;
                margin-bottom:0;
                li{
                    margin-left:0;
                    list-style-type:none;
                    &:before{
                        counter-increment: emulsion-counter-lv1;
                        content: counter( emulsion-counter-lv1 );
                        width: calc(1rem * var(--thm_content_line_height ) );
                        line-height: calc(1rem * var(--thm_content_line_height ) );
                        height:1.5rem;
                        border-radius:0;
                        background: var(--thm_default_bullet_color, #3498db);
                        color: var(--thm_white_color);
                    }
                    ol{
                        counter-reset: emulsion-counter-lv2;
                        padding-left: calc(1rem * var(--thm_content_line_height ) + 1rem );
                        li{
                            margin-left:0;
                            list-style-type:none;
                            &:before{
                                counter-increment: emulsion-counter-lv2;
                                content: counter( emulsion-counter-lv2 );
                                width: calc(1rem * var(--thm_content_line_height ) );
                                line-height: calc(1rem * var(--thm_content_line_height ) );
                            }
                        }
                    }
                }
            }
        }
        &.circle{
            li:before{
                border-radius:50%;
            }
        }
    }
    ol[reversed],
    ol[start],
    ol.is-style-list-style-initial,
    ol.list-style-initial{
        padding-left:calc( var(--thm_content_gap, 24px) * 3 );
        padding-right:var(--thm_content_gap, 24px);
        li{
            margin-left:0;
            list-style-type:decimal!important;
            text-indent:0!important;
            color:var(--thm_general_text_color);
            &:before{
                display:none!important;
            }
            ol{
                li{
                    text-indent:initial;
                    list-style-type:decimal ;
                    &:before{
                        display:none!important;
                    }
                    ol{
                        li{
                            list-style-type:decimal;
                            &:before{
                                display:none!important;
                            }
                        }
                        ol{
                            li{
                                list-style-type:decimal;
                                &:before{
                                    display:none!important;
                                }
                            }
                        }
                    }
                }
            }
            ul{
                li{
                    list-style-type:initial;
                    &:before{
                        display:none;
                    }
                    ul{
                        li{
                            &:before{
                                display:none;
                            }
                        }
                    }
                }
            }
        }
    }
    ul.is-style-list-style-initial,
    ul.list-style-initial{
        padding-left:calc( var(--thm_content_gap, 24px) * 3 );
        padding-right:var(--thm_content_gap, 24px);
        li{
            list-style-type:initial;
            text-indent:initial;
            &:before{
                display:none;
            }
            ul{
                li{
                    list-style-type:initial;
                    &:before{
                        display:none;
                    }
                    ul{
                        li{
                            &:before{
                                display:none;
                            }
                        }
                    }
                }
            }
            ol{
                li{
                    list-style-type:decimal;
                    text-indent:initial;
                    &:before{
                        display:none;
                    }
                    ol{
                        li{
                            list-style-type:decimal;
                            &:before{
                                display:none;
                            }
                        }
                        ol{
                            li{
                                list-style-type:decimal;
                                &:before{
                                    display:none;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    .is-style-list-style-inline:not(.list-style-initial):not(.is-style-list-style-initial),
        .list-style-inline:not(.list-style-initial):not(.is-style-list-style-initial){
        @include clearfix;
        //@extend %block;
        font-size:var(--thm_meta_data_font_size, 13px);
        margin-top:1.5rem;
        margin-bottom:.75rem;
        padding:0;
        display:flex;
        flex-wrap:wrap;
        justify-content: center;
        align-items: center;
        font-size:1rem;
        padding-left:var(--thm_content_gap, 24px);
        padding-right:var(--thm_content_gap, 24px);
        li{
            z-index:2;
            list-style-type:none;
            display:inline-block;
            text-align:center;
            list-style:none;
            width: -moz-fit-content;
            width:fit-content;
            margin:var( --thm_box_gap,3px );
            flex:1 1 auto;
            text-indent:0;
            &:before{
                content:none;
                display:none ! important;
            }
            &:hover{
                a{
                    cursor:pointer;
                }
            }
        }
    }
}
/**
 * Block editor list presentation
 * @extend %narrow-space-block-and-elements
 */
%narrow-space-block-and-elements{
    .wp-block-columns{
        display:block;
        padding-left:0;
        padding-right:0;
        .wp-block-column{
            padding-left:0;
            padding-right:0;
            margin-left:0;
        }
    }
    ul{
        padding-left:0;
        margin-left:0;
        li{
            text-indent:0;
        }
    }
}
@function str-replace($string, $search, $replace: '') {
  $index: str-index($string, $search);

  @if $index {
    @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
  }

  @return $string;
}

