/*
 Theme Name:   bootScore Child
 Description:  bootScore Child Theme
 Author:       bootScore
 Author URI:   https://bootscore.me
 Template:     bootscore-main
 Version:      5.3.4
 Text Domain:  bootscore
*/

/* 
All style editing is done via scss/_bscore_custom.scss
*/


:root { 
    --bs-font-sans-serif: 'Roboto', sans-serif;
    --nav-link-color: #ffc82e;
    --nav-link-color-hover: #FFF;

    --bg-page: #F3F9FE;
}

body {
    font-weight:300 !important;
}


#page {
    background: var(--bg-page);
}

#masthead {background:none;}

.text-link {
    color: var(--nav-link-color);
}
.nav-link {
    display: block;
    padding: 0;
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--nav-link-color);
    text-decoration: none;
    background: none;
    border-bottom: 1px solid #000;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.nav-link:hover, .nav-link:focus, .nav-link.active, .nav-item.active .nav-link {
    color: var(--nav-link-color-hover);
   
    border-bottom: 1px solid var(--nav-link-color);
    border-radius: 0 !important;
  
    transition: border 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

.logo {
    display:block;
    width:300px;
    height:auto;
}

.svggrey {
    fill: #bababb;
}

.box-shadow {
    box-shadow: 0px 10px 15px 3px rgba(0, 0, 0, 0.1);
}

@media only screen and (max-width: 768px) {
    /* sidebar */
        .sidebar-main {
            max-width: 10em;

            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            transform: translateX(-100%);

            -webkit-transition: 1s -webkit-transform cubic-bezier(0.25, 1, 0.3, 1);
            -moz-transition: 1s -moz-transform cubic-bezier(0.25, 1, 0.3, 1);
            -o-transition: 1s -o-transform cubic-bezier(0.25, 1, 0.3, 1);
            -ms-transition: 1s -ms-transform cubic-bezier(0.25, 1, 0.3, 1);
            transition: 1s transform cubic-bezier(0.25, 1, 0.3, 1), 1s -webkit-transform cubic-bezier(0.25, 1, 0.3, 1);

            z-index: 99;
            opacity: 0.9;
        }
        .sidebar-main.show {
            -webkit-transform: translateX(0%);
            -moz-transform: translateX(0%);
            -o-transform: translateX(0%);
            -ms-transform: translateX(0%);
            transform: translateX(0%);
        }

        .sidebar-main .nav.nav-pills.mb-sm-auto {
            margin-bottom: auto !important;
        }

        .sidebar-toggle {
            position: fixed;
            display: inline-block !important;
            width: 2em;
            height: 2em;;
            top: 1em;;
            left: 0;
            padding-left: 1em;
            text-align: center;
            align-content: center;
            transition: 1s transform cubic-bezier(0.25, 1, 0.3, 1), 1s -webkit-transform cubic-bezier(0.25, 1, 0.3, 1);

            z-index: 99;
        }
        .sidebar-toggle[data-active="true"] {
            -webkit-transform: translateX(10em);
            -moz-transform: translateX(10em);
            -o-transform: translateX(10em);
            -ms-transform: translateX(10em);
            transform: translateX(10em);
        }

        .sidebar-toggle svg {
            display: none;
        }
        .sidebar-toggle:not([data-active="true"]) svg:nth-of-type(2) {
            display: inline-block;
        }
        .sidebar-toggle[data-active="true"] svg:nth-of-type(1)  {
            display: inline-block;
        }

}


:root {

    /* CD */
        --dt-primary--blue--dark: #1C2A51;
        --dt-primary--blue--dark-rgb: 28, 42, 81;
        --dt-primary--blue--middle: #204B88;
        --dt-primary--blue--middle-rgb: 32, 75, 136;
        --dt-primary--blue--light: #4682B4;
        --dt-primary--blue--light-rgb: 70, 130, 180;

        --dt-primary--turquoise--dark: #126E78;
        --dt-primary--turquoise--dark-rgb: 18, 110, 120;
        --dt-primary--turquoise--middle: #1AA1A7;
        --dt-primary--turquoise--middle-rgb: 26, 161, 167;
        --dt-primary--turquoise--light: #56BEC5;
        --dt-primary--turquoise--light-rgb: 86, 190, 197;

        --dt-primary-white: #FFF;
        --dt-primary-white-rgb: 255, 255, 255;

        --dt-secondary--olive: #B1B547;
        --dt-secondary--olive-rgb: 177, 181, 71;
        --dt-secondary--red: #B54B47;
        --dt-secondary--red-rgb: 181, 75, 71;
        --dt-secondary--yellow--gray: #455460;
        --dt-secondary--yellow--gray-rgb: 69, 84, 96;
        --dt-secondary--yellow--purple: #A056C4;
        --dt-secondary--yellow--purple-rgb: 160, 86, 196;

        --dt-font-text: "Nunito Sans Extra Bold", sans-serif;
        --dt-font-text-weight: 300;
        --dt-font-header: "Nunito Sans Light", sans-serif;
        --dt-font-header-weight: 700;

    /* EO CD */
        
        
    --bs-font-sans-serif: var(--dt-font-text);
    --bs-body-color: rgb(129, 129, 129);

    --bs-dark-rgb: 28,42,81; /* #1C2A51;*/
    --bs-white-rgb: 129,129,129; /* #818181*/
    --nav-link-color: var(--dt-primary--turquoise--light);
    /* --bg-page: #003E5303; */
    --bg-page : #DEDEDE;
    --bg-page-rgb : 222, 222, 222;
    --bs-tertiary-bg: var(--bg-page);
    --bs-tertiary-bg-rgb: var(--bg-page-rgb);

    --dt-success-rgb: 92, 184, 92;
    --dt-success: rgba(var(--dt-success-rgb));
    --dt-success-darken-rgb: 33, 77, 33;
    --dt-success-darken: rgb(var(--dt-success-darken-rgb));

    --bg-primary: #FFF;

    /* BS override but useless */
        /* --bs-btn-bg: var(--dt-success);
        --bs-btn-hover-bg: var(--dt-success-darken);
        --bs-btn-hover-border-color: var(--dt-success-darken); */

}
html[data-theme="dark"] {
    --bs-dark-rgb: 18,18,18;
    --bs-body-color: #333;
    --bs-heading-color: var(--bs-body-color);
    --bg-page: #455460;
    --bg-page-rgb: 69, 84, 96;
    --bg-primary: #CCC;
    --bs-border-color: var(--bg-page);
}

/* throbber */
    .throbber-wrapper {
        width: 100%;
        height: 100%;
        position: absolute;
        background-color: rgba(0,0,0,0.5);
        z-index: 1;
    }

    /* @source https://loading.io/css/ */
    .throbber {
        display: inline-block;
        position: relative;
        /* width: 80px; */
        /* height: 80px; */
        /* max-width: 100%; */
        /* max-height: 100%; */
        /* margin: 2em; */
        top: 25%;
        left: calc(50% - 16px * 3);
    }
    .throbber div {
        display: inline-block;
        position: absolute;
        left: 8px;
        width: 16px;
        background: #fff;
        animation: throbber 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
    }
    .throbber div:nth-child(1) {
        left: 8px;
        animation-delay: -0.24s;
    }
    .throbber div:nth-child(2) {
        left: 32px;
        animation-delay: -0.12s;
    }
    .throbber div:nth-child(3) {
        left: 56px;
        animation-delay: 0;
    }
    @keyframes throbber {
        0% {
            top: 8px;
            height: 64px;
        }
        50%, 100% {
            top: 24px;
            height: 32px;
        }
    }

    .fw-600 {
        font-weight: 600;
    }

/** BS Override */
    .btn-primary {
        --bs-btn-bg: var(--dt-primary--blue--dark);
        --bs-btn-border-color: var(--dt-primary--blue--dark);
    }
    .btn-primary:hover {
        background-color: var(--dt-primary--blue--middle);
        border-color: var(--dt-primary--blue--middle);
    }

    .form-switch .form-check-input.enable:checked {
        background-color: var(--dt-secondary--olive); /*var(--dt-success); */
        border-color: var(--dt-secondary--olive); /*var(--dt-success); */
    }

/* Dark Theme */
    :root body.dark-theme {
        --bs-border-color: #262121;

        --bs-dark-rgb: 72, 71, 72; /* 484748 */
        --nav-link-color: #003E54;
        --bg-page : #292929;
        --bs-tertiary-bg-rgb: 41, 41, 41;

        --dt-success-rgb: 0, 95, 83; /* 005F53 */

        --bg-primary : #2f2e2e;
    }
    body.dark-theme {
        .box-shadow {
            box-shadow: 0px 10px 15px 3px rgba(105, 117, 101, 0.05);
        }

    }