/*** 2023 DNN Incentives Styles 25 ***/

/*#region Basic Wrapper */

:placeholder-shown {
    color: orange;
}

/* module wrapper */
.wmcssbase {
    margin-top: 1rem;
    padding: 0 .5rem;
    /*min-height:calc(100vh - 100px);*/
}

    .wmcssbase p, .wmcssbase li, .wmcssbase .normal, .wmcssbase .Normal, .wmcssbase table {
    }

    .wmcssbase h1, .wmcssbase h2, .wmcssbase h3, .wmcssbase h4, .wmcssbase h5, .wmcssbase h6 {
    }

    .wmcssbase div, .wmcssbase p, .wmcssbase ul, .wmcssbase li, .wmcssbase fieldset {
        box-sizing: border-box;
    }

/* Quick hide on mobile, can be used anywhere */
@media screen and (max-width: 992px) {
    .wmhideontablet {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .wmhideonmobile {
        display: none;
    }
}

@media screen and (max-width: 420px) {
    .wmhideonmini {
        display: none;
    }
}

/* Reset dnn float left class*/
.dnnLeft {float:unset;
}

/*#endregion*/

/*#region Dashboard boxes */
.wmdashitems {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

    .wmdashitems > div {
        border: 1px solid #dbdbdb;
        border-radius: 12px;
        margin: .2rem;
        flex-basis: 150px;
        flex: 1;
        padding: .5rem .7rem;
    }

        .wmdashitems > div > div:nth-child(1) {
            font-size: 1rem;
            font-weight: 700;
        }

        .wmdashitems > div > div:nth-child(2) {
            font-size: 1.6rem;
            font-weight: 700;
            display: inline-block;
            color: cornflowerblue;
        }

        .wmdashitems > div > div:nth-child(3) {
            font-size: 12px;
            display: inline-block;
            padding-left: 7px;
            line-height: 120%;
        }

        .wmdashitems > div > div:nth-child(4) {
            font-size: .9rem;
        }

        .wmdashitems > div > div:nth-child(5) {
            font-size: 1.6rem;
            font-weight: 700;
            display: inline-block;
            color: cornflowerblue;
        }

        .wmdashitems > div > div:nth-child(6) {
            font-size: 12px;
            display: inline-block;
            padding-left: 7px;
            line-height: 120%;
        }


        /* For Checkin box */
        .wmdashitems > div > div > span, .wmdashitemslist > div > div > div > span {
            float: right;
            font-size: 16px;
            color: #00a1da;
        }


/* For lists */
.wmdashitemslist {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

    .wmdashitemslist > div {
        border: 1px solid #dbdbdb;
        border-radius: 12px;
        margin: .2rem;
        flex-basis: 150px;
        flex: 1;
        padding: .5rem 1rem;
        font-size: 12px;
    }

.wmdashmerch {
}

    .wmdashmerch > div:nth-child(1) {
        font-size: 1rem;
        font-weight: 700;
    }

    .wmdashmerch > div:nth-child(2) {
        font-size: 1.5rem;
        font-weight: 700;
        display: inline-block;
        color: cornflowerblue;
    }

    .wmdashmerch > div:nth-child(3) {
        font-size: 12px;
        display: inline-block;
        padding-left: 7px;
    }

    .wmdashmerch > div:nth-child(4) {
        font-size: .9rem;
    }

.wmdashmerchcounts {
    vertical-align: top;
    margin-top: .5rem;
    background: whitesmoke;
    border-radius: 10px;
    padding: 5px;
}

    .wmdashmerchcounts > div {
        padding: 0 10px 0 10px;
        white-space: nowrap;
    }

.wmdashitemstotal {
    text-align: right;
    padding: .5rem 1rem;
    font-size: 1rem;
    font-weight: bold;
}

/* For Charts */
.wmdashchartcontainer {
    max-width: 97%;
    width: 100%;
    height: 200px;
    margin: 0 auto;
    padding: 0px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    position: relative;
}

/* For QR Attendees */

.wmdashitems > div.wmqrattendees > div:nth-child(1) {
    font-size: 1rem;
    font-weight: 700;
}

.wmdashitems > div.wmqrattendees > div:nth-child(2) {
    font-size: 1rem;
    font-weight: 700;
    display: inline-block;
    color: cornflowerblue;
    line-height: 100%;
}

.wmdashitems > div.wmqrattendees > div:nth-child(3) {
    font-size: 12px;
    display: inline-block;
    padding-left: 7px;
    line-height: 100%;
}

.wmdashitems > div.wmqrattendees > div:nth-child(4) {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    display: inline-block;
    color: cornflowerblue !important;
    line-height: 100%;
}

.wmdashitems > div.wmqrattendees > div:nth-child(5) {
    font-size: 1rem;
    font-weight: 700;
    display: inline-block;
    color: cornflowerblue;
    line-height: 100%;
    margin-bottom: 10px;
}

.wmdashitems > div.wmqrattendees > div:nth-child(6) {
    font-size: 12px;
    display: inline-block;
    padding-left: 7px;
    line-height: 100%;
}

.wmdashitems > div.wmqrattendees > div:nth-child(7) {
    font-size: .9rem;
    display: block;
    line-height: 100%;
}



/*#endregion*/

/*#region Typography */
/* Typography */
.wmlead {
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 125%;
}

.wmsmall {
    font-size: .8rem;
}

.wmsmaller {
    font-size: 11px;
}

/* Horz Rule Style */
hr.wmhr {
    border: 0;
    border-top: 2px solid #d5d5d5;
    margin: 2rem 0;
}

/*#endregion*/

/*#region Error/Info Messages */
/* error, system, success, warning, info messages, use on error control or divs */

.msg_error, .msg_warning, .msg_system, .msg_success, .msg_info {
    margin: 20px 0px;
    border-width: 1px;
    border-style: solid;
    font-size: 14px;
    color: #444444;
    border-radius: 12px;
    padding: 11px 10px 10px 44px !important;
    display: block;
    position: relative;
}

    .msg_error::before, .msg_warning::before, .msg_system::before, .msg_success::before, .msg_info::before {
        font-family: 'Font Awesome 7 Free';
        font-size: 20px;
        margin: 0 .8rem 0 0;
        font-weight: 900;
        position: absolute;
        top: 10px;
        left: 12px;
    }

.msg_error {
    background-color: #fbecec; /*pink/red */
    border-color: #C10000;
}

    .msg_error::before {
        content: '\f28d';
        color: #C10000;
    }

.msg_warning {
    background-color: #f9f2e4; /* orange/amber */
    border-color: #ffb01c;
}

    .msg_warning::before {
        content: '\f071';
        color: #ffb01c;
    }

.msg_info {
    background-color: #fbfbec; /* yellow/light */
    border-color: #ebde7a;
}

    .msg_info::before {
        content: '\f05a';
        color: #ebde7a;
    }

.msg_system {
    background-color: #e8f3ff;
    border-color: #549ceb;
}

    .msg_system::before {
        content: '\f06a';
        color: #549ceb;
    }

.msg_success {
    background-color: #edffef; /* lt green, green */
    border-color: #57B161;
}

    .msg_success::before {
        content: '\f058';
        color: #57B161;
    }
/*#endregion*/

/*#region Forms */

.wmform {
}

    .wmform > div { /* acts as container around div label and div field, allows for css flexibility in forms, creating columns, can include multiple pairs (groups them for columns). 
        e.g.    <div>
                    <div class="wmlabel">Name:</div>
                    <div class="wmfield">Input</div>
                <div>*/
        break-inside: avoid;
    }

    .wmform .wmformiteminline { /* use on form element container to control wrap behavior.*/
        display: inline-block;
    }

    .wmform .wmlabel {
        font-size: 13px;
        font-weight: 600;        
        margin: 0px 3px;
    }

    .wmform .wmfield {
        margin-bottom: .9rem;
    }

    .wmform input[type=checkbox], .wmform input[type=radio] {
        box-sizing: border-box;
        padding: 0;
        margin-right: .5rem;
    }

        .wmform input[type=checkbox] + label, .wmform input[type=radio] + label {
            margin-right: 1rem;
        }

    .wmform input[type=text], input[type=password], .wmform select, .wmform textarea {
        border: 1px solid #d1d1d1;
        border-radius:4px;
        padding: 5px 5px;
        margin: 1px 3px;
        /*color:blue;*/
    }
    .wmform select {
        padding: 4px 5px;        
    }

        .wmform input[type=text].wminputwide, .wmform input[type=password].wminputwide, .wmform select.wminputwide, wmform textarea.wminputwide {
            width: 98%;
            max-width: 98%;
        }

        /*mmj.240207*/
        .wmform input[type=text].wmreq, .wmform input[type=password].wmreq, .wmform select.wmreq {
            /*height: 28px;*/
            margin: 1px 0;
            border-width: 1px 1px 1px 5px;
            border-color: #d1d1d1 #d1d1d1 #d1d1d1 red;
        }

    .wmform textarea.wmreq {
        margin: 1px 0;
        border-width: 1px 1px 1px 5px;
        border-color: #d1d1d1 #d1d1d1 #d1d1d1 red;
    }


    /* Form as row */
    .wmform.wmformrow {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

        .wmform.wmformrow > div {
            margin-right: 1rem;
        }


.wmformtable {
    /* centers table if used */
    display: table;
    margin: auto;
}

.wmrequired {
    color: red;
}

/* Class for some text areas, adapt to mobile */
.wmtextarea {
    width: 100%;
    min-height: 100px;
}




/*#endregion*/

/*#region Fancy Toggle */
/* The switch - the box around the slider */
.wmtogglebox {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 26px;
}

    /* Hide default HTML checkbox */
    .wmtogglebox input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The toggle */
.wmtoggle {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .wmtoggle:before {
        position: absolute;
        content: "";
        height: 20px;
        width: 20px;
        left: 4px;
        bottom: 3px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .wmtoggle {
    background-color: #2196F3;
}

input:focus + .wmtoggle {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .wmtoggle:before {
    -webkit-transform: translateX(22px);
    -ms-transform: translateX(22px);
    transform: translateX(22px);
}

/* Rounded toggle */
.wmtoggle.round {
    border-radius: 20px;
}

    .wmtoggle.round:before {
        border-radius: 50%;
    }


/*#endregion */

/*#region Quick Columns */
.wm2column {
    column-count: 2;
}

.wm3column {
    column-count: 3;
}

.wm4column {
    column-count: 4;
}

    .wm2column > div, .wm3column > div, .wm4column > div { /* acts as container around non-breakable content blocks, allows for css flexibility in creating columns*/
        break-inside: avoid;
    }


@media screen and (max-width:992px) {

    .wm3column {
        column-count: 2;
    }

    .wm4column {
        column-count: 2;
    }
}

@media screen and (max-width:768px) {

    .wm2column, .wm3column, .wm4column {
        margin: auto;
        display: table;
    }

    .wm2column {
        column-count: 1;
    }

    .wm3column {
        column-count: 1;
    }

    .wm4column {
        column-count: 1;
    }
}
/*#endregion*/

/*#region Buttons */
/* Buttons */
.wmbtnstyle1,
input[type="submit"].wmbtnstyle1, input[type="button"].wmbtnstyle1, a.wmbtnstyle1, a:link.wmbtnstyle1, a:visited.wmbtnstyle1 {
    border: 1px solid #00a1da;
    text-transform: none;
    font-weight: 700;
    font-size: 13px;
    border-radius: 7px;
    background: #00a1da;
    color: #fff;
    padding: 7px 1rem 7px;
    box-shadow: none;
}
    .wmbtnstyle1:hover,
    input[type="submit"].wmbtnstyle1:hover, input[type="button"].wmbtnstyle1:hover, a.wmbtnstyle1:hover {
        border: 1px solid #0271ab;
        background: #0271ab;
        color: #fff;
        box-shadow: none;
    }



/* Secondary style     */
.wmbtnstyle2,
input[type="submit"].wmbtnstyle2, input[type="button"].wmbtnstyle2, a.wmbtnstyle2, a:link.wmbtnstyle2, a:visited.wmbtnstyle2 {
    border: 1px solid #dcdcdc;
    text-transform: none;
    font-weight: 700;
    font-size: 13px;
    border-radius: 7px;
    background: #ededed;
    color: #444;
    padding: 7px 1rem 7px;
    box-shadow: none;
}

    .wmbtnstyle2:hover,
    input[type="submit"].wmbtnstyle2:hover, input[type="button"].wmbtnstyle2:hover, a.wmbtnstyle2:hover {
        border: 1px solid #00a1da;
        background: #00a1da;
        color: #fff;
        box-shadow: none;
    }

/* smaller button, such as within grid row */
    .wmbtnstyle1.wmbtnsmall, .wmbtnstyle2.wmbtnsmall {
        font-size: 13px !important;
        padding: 4px 1rem 4px !important;
        text-decoration:none !important;
    }

.wmbtnright {
    float: right;
}

/* Delete Button, used with .wmbtnstyleX */
.wmbtndelete, a.wmbtndelete, input[type=submit].wmbtndelete {
    border-color: #777;
    padding: 0.1rem 0.6rem 0.2rem;
    font-size: 0.9rem;
    font-weight: 400;
    color: #777;
    background: #f2f2f2;
}

    .wmbtndelete:hover, a.wmbtndelete:hover, input[type=submit].wmbtndelete:hover {
        border-color: #e1810a;
        color: #fff;
        background: #df8b24;
    }

/*mmj.230410*/
.btn-disable {
    cursor: not-allowed;
    pointer-events: none;
    /*Button disabled - CSS color class*/
    color: #c0c0c0;
    background-color: #ffffff !important;
}

/*#endregion*/

/*#region Tabs */
.wmtabs {
    display: flex;
    justify-content: flex-start;
    padding: 0px;
    margin: 0 0 1rem 0;
    border-bottom: 1px solid #d5d5d5;
    clear: both;
}

    .wmtabs div {
        font-size: .9rem;
        border: 1px solid #d2d7e7;
        padding: 0.3rem 1rem;
        border-radius: 5px 5px 0 0;
        margin-bottom: -1px;
        background-color: #f5f6f9;
    }

        .wmtabs div:first-child {
            margin-left: 0.5rem;
        }

        .wmtabs div, .wmtabs div a:link, .wmtabs div a:visited, .wmtabs div a:hover {
            font-weight: 550;
        }

            .wmtabs div a:hover {
                color: blue;
                text-decoration: none;
            }

    .wmtabs .active {
        background: #ffffff;
        border-bottom: 1px solid #ffffff;
    }

@media screen and (max-width:992px) {
    .wmtabs {
        flex-wrap: wrap;
        border-bottom: 0px solid #d2d7e7;
    }

        .wmtabs div:first-child {
            margin-left: 5px;
        }

        .wmtabs .wmtab, .wmtabs .wmtab.active {
            flex-basis: calc(50% - 10px);
            margin: 5px;
            border-radius: 5px;
            text-align: center;
            border: 1px solid #d2d7e7;
        }
}








/*#endregion*/

/*#region Bullets */
/* Font Awesome Bullets 1 */
ul .wmfabullets1 {
    padding-left: 0rem;
    list-style: none;
    margin-left: 0;
}

    ul.wmfabullets1 > li {
        margin-bottom: .7rem;
    }

        ul.wmfabullets1 > li::before {
            font-family: 'Font Awesome 7 Free';
            content: '\f152';
            margin: 0 .8rem 0 0;
            color: #d5d5d5;
            font-weight: 900;
        }

/* Font Awesome Bullets 2 */
ul.wmfabullets2 {
    padding-left: 0rem;
    list-style: none;
    margin-left: 0;
}

    ul.wmfabullets2 > li {
        margin-bottom: .7rem;
    }

        ul.wmfabullets2 > li::before {
            font-family: 'Font Awesome 7 Free';
            content: '\f152';
            margin: 0 .8rem 0 0;
            color: #f2f2f2;
            font-weight: 900;
        }

/* Font Awesome Bullets 3 */
ul.wmfabullets3 {
    padding-left: 0rem;
    list-style: none;
    margin-left: 0;
}

    ul.wmfabullets3 > li {
        margin-bottom: .7rem;
    }

        ul.wmfabullets3 > li::before {
            font-family: 'Font Awesome 7 Free';
            content: '\f0da';
            margin: 0 .8rem 0 0;
            /*color: #dfc383;*/
            font-weight: 900;
            margin-left: -1.2rem;
        }

/* Font Awesome Bullets 4 */
ul.wmfabullets4 {
    padding-left: .4rem;
    list-style: none;
    margin-left: 0;
}

    ul.wmfabullets4 > li {
        margin-bottom: .4rem;
    }

        ul.wmfabullets4 > li::before {
            font-family: 'Font Awesome 7 Free';
            content: '\f152';
            margin: 0 .8rem 0 0;
            color: #d5d5d5;
            font-weight: 900;
        }

/* Font Awesome Bullets 5 */
ul.wmfabullets5 {
    padding-left: 1.2rem;
    list-style: none;
    margin-left: 0;
}

    ul.wmfabullets5 > li {
        margin-bottom: .4rem;
    }

        ul.wmfabullets5 > li::before {
            font-family: 'Font Awesome 7 Free';
            content: '\f152';
            margin: 0 .5rem 0 0;
            color: #549ceb;
            font-weight: 900;
            margin-left: -1.2rem;
        }


/* Small bullets, can use for all fabullets */
ul.wmfabulletssmall > li {
    font-size: .8rem !important;
}

/*#endregion*/

/*#region Gridview */
.wmgrid {
    width: 100%;
    border-color: #d5d5d5;
    margin-bottom: 1rem;
}

    .wmgrid td {
        padding: .2rem .3rem;
        font-size: 0.8rem;
    }

.wmgridlg td {
    font-size: 1rem;
    padding: .5rem .5rem;
}

.wmgridheader {
    background-color: #ededed;
}

    .wmgridheader th, .wmgridheader th a, .wmgridheader th a:link, .wmgridheader th a:visited {
        padding: .2rem .3rem;
        font-size: 0.8rem;
        font-weight: 600;
        color: #777;
        vertical-align: middle;
    }

        .wmgridheader th a::after {
            content: "\f0dc";
            font-size: 12px;
            font-weight: 900;
            font-family: 'Font Awesome 7 Free';
            color: #c1c1c1;
            padding: 0 0 0 5px;
            top: 1px;
            position: relative;
            display: inline-block;
        }

/*#region Grid Header colors/styles */

.wmgridheadercolor1 { /* lt orange */
    background-color: #E6C18A;
}

    .wmgridheadercolor1 th, .wmgridheadercolor1 th a, .wmgridheadercolor1 th a:link, .wmgridheadercolor1 th a:visited {
        color: #333;
    }

        .wmgridheadercolor1 th a::after {
            color: #333;
        }

.wmgridheadercolor2 { /* lt gold */
    background-color: #E6E68A;
}

    .wmgridheadercolor2 th, .wmgridheadercolor2 th a, .wmgridheadercolor2 th a:link, .wmgridheadercolor2 th a:visited {
        color: #333;
    }

        .wmgridheadercolor2 th a::after {
            color: #333;
        }

.wmgridheadercolor3 { /* lt red */
    background-color: #e7c7c7;
}

    .wmgridheadercolor3 th, .wmgridheadercolor3 th a, .wmgridheadercolor3 th a:link, .wmgridheadercolor3 th a:visited {
        color: #333;
    }

        .wmgridheadercolor3 th a::after {
            color: #333;
        }

.wmgridheadercolor4 { /* lt blue */
    background-color: #97c7e7;
}

    .wmgridheadercolor4 th, .wmgridheadercolor4 th a, .wmgridheadercolor4 th a:link, .wmgridheadercolor4 th a:visited {
        color: #333;
    }

        .wmgridheadercolor4 th a::after {
            color: #333;
        }

.wmgridheadercolor5 { /* lt green */
    background-color: #a2e1c1;
}

    .wmgridheadercolor5 th, .wmgridheadercolor5 th a, .wmgridheadercolor5 th a:link, .wmgridheadercolor5 th a:visited {
        color: #333;
    }

        .wmgridheadercolor5 th a::after {
            color: #333;
        }

.wmgridheadercolor6 { /* lt mauve */
    background-color: #c0ace1;
}

    .wmgridheadercolor6 th, .wmgridheadercolor6 th a, .wmgridheadercolor6 th a:link, .wmgridheadercolor6 th a:visited {
        color: #333;
    }

        .wmgridheadercolor6 th a::after {
            color: #333;
        }

.wmgridheadercolor7 { /* lt teal */
    background-color: #8cd6d9;
}

    .wmgridheadercolor7 th, .wmgridheadercolor7 th a, .wmgridheadercolor7 th a:link, .wmgridheadercolor7 th a:visited {
        color: #333;
    }

        .wmgridheadercolor7 th a::after {
            color: #333;
        }
/*#endregion */


.wmgridrow {
    background-color: #ffffff;
}

.wmgridrowalt {
    background-color: #f5f6f9;
}

.wmgridtopleft {
    text-align: left;
    vertical-align: top;
}

.wmgridtopcenter {
    text-align: center;
    vertical-align: top;
}

.wmgridtopright {
    text-align: right;
    vertical-align: top;
}

.wmgridmiddlecenter {
    text-align: center;
    vertical-align: middle;
}

.wmgridempty {
    text-align: center;
    padding: 20px;
    color: #508BCD;
    font-size: 1rem;
    font-weight: 550;
    margin: 1rem;
    border: 1px solid #ededed;
    border-radius: 7px;
    background-color: #e8f3ff; /* light blue */
    border-color: #549ceb;
}

.wmgrid .fas {
    font-size: 1rem;
   /* color: #65718d;*/
}

.wmgridborder {
    border-color: #ffffff;
}

    .wmgridborder > tbody > tr {
        border-bottom: 1px solid #d5d5d5;
    }

/* For smaller text on busy grids */
.wmgrid.wmgridsmalltext td {
    padding: 2px 3px;
    font-size: 11px;
}

    /* Colored link on small grid */
    .wmgrid.wmgridsmalltext td a {
        color: #2577bf;
    }

/* Grid Header 2 - style change */
.wmgridheader2 {
    background-color: transparent;
}

    .wmgridheader2 th, .wmgridheader2 th a, .wmgridheader2 th a:link, .wmgridheader2 th a:visited {
        padding: .2rem .3rem;
        font-size: 1rem;
        font-weight: 550;
        color: #1f5789;
        vertical-align: middle;
    }

        .wmgridheader2 th a::after {
            content: "\f0dc";
            font-size: 12px;
            font-weight: 900;
            font-family: 'Font Awesome 7 Free';
            color: #1f5789;
            padding: 0 0 0 5px;
            top: 1px;
            position: relative;
            display: inline-block;
        }

/* Grid Header 3 - style change */
.wmgridheader3 {
    background-color: #e0e3eb;
}

    .wmgridheader3 th, .wmgridheader3 th a, .wmgridheader3 th a:link, .wmgridheader3 th a:visited {
        padding: .2rem .3rem;
        font-size: .9rem;
        font-weight: 550;
        color: #1f5789;
        vertical-align: middle;
    }

        .wmgridheader3 th a::after {
            content: "\f0dc";
            font-size: 12px;
            font-weight: 900;
            font-family: 'Font Awesome 7 Free';
            color: #1f5789;
            padding: 0 0 0 5px;
            top: 1px;
            position: relative;
            display: inline-block;
        }

.wmgridgroupheader, .helper_group_header {
    font-weight: bold;
    background-color: #c6cfe5;
}

.wmgridstyle2 {
}

    .wmgridstyle2 .wmgridheader {
        background-color: #d2d7e1;
    }

        .wmgridstyle2 .wmgridheader th, .wmgridstyle2 .wmgridheader th a, .wmgridstyle2 .wmgridheader th a:link, .wmgridstyle2 .wmgridheader th a:visited {
            padding: .2rem .3rem;
            font-size: 0.8rem;
            font-weight: 600;
            color: #444444;
        }

            .wmgridstyle2 .wmgridheader th a::after {
                content: "\f0dc";
                font-size: 12px;
                font-weight: 900;
                font-family: 'Font Awesome 7 Free';
                color: #444444;
                padding: 0 0 0 5px;
                top: 1px;
                position: relative;
                display: inline-block;
            }


/*#endregion*/

/*#region Gridview pager */
.wmgridpager {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.3rem;
}

    .wmgridpager > div {
        font-size: .8rem;
    }


/*#endregion*/

/*#region GridView Popup Help */
.wmgridpopuphelp a {
    position: relative;
    text-decoration: none;
}

    .wmgridpopuphelp a span {
        display: none;
        text-decoration: none !important;
    }

    .wmgridpopuphelp a:hover span {
        display: block;
        position: absolute;
        top: 13px;
        left: 20px;
        width: 400px;
        height: auto;
        padding: 10px;
        margin: 0px;
        color: #444444;
        background: #fffcf5;
        border: 1px solid #d1d1d1;
        border-radius: 4px;
        text-align: left;
        z-index: 1000 !important;
        text-decoration: none !important;
    }

    .wmgridpopuphelp a span hr {
        border: 0px;
        border-bottom: 1px solid #d1d1d1;
    }

/*#endregion*/

/*#region Helpbox, Feature box, Softbox */
/* Help box, is a fieldset */
.wmhelpbox {
    font-size: .8rem;
    background-color: #fffcf5;
    border: 1px solid #d1d1d1;
    border-radius: 10px;
    padding: 1rem;
    width: 100%;
    margin-bottom: 1rem;
box-sizing:border-box;
}

    .wmhelpbox legend {
        display: inline-block;
        padding: 0 0.3rem;
        font-size: 1.1rem;
        width: auto;
        font-weight: 500;
    }

    /* auto styled bullets for helpbox */
    .wmhelpbox ul {
        padding-left: 0rem;
        list-style: none;
        margin-left: 1.2rem;
        ;
    }

        .wmhelpbox ul > li {
            margin-bottom: .7rem;
        }

            .wmhelpbox ul > li::before {
                font-family: 'Font Awesome 7 Free';
                content: '\f0da';
                margin: 0 0.8rem 0 -1.2rem;
                color: #dfc383;
                font-weight: 900;
            }

/* Feature box, is a fieldset */
.wmfeaturebox {
    font-size: .8rem;
    background-color: #fcfdff;
    border: 1px solid #dbdbdb;
    border-radius: 10px;
    padding: 0.5rem 1rem 0.7rem;
    margin-bottom: 1rem;
}

@media screen and (max-width:768px) {
    .wmfeaturebox {
        padding: 0.5rem 0.3rem 0.7rem;
    }
}

.wmfeaturebox legend {
    display: inline-block;
    padding: 0 0.3rem;
    font-size: 1.2rem;
    width: auto;
    font-weight: 700;
    margin-bottom: 0;
}

    .wmfeaturebox legend i {
        color: #00a1da;
    }

.wmfeaturebox .wmlegendsmall {font-size:.9rem;
}

.wmsoftbox {
    background-color: aliceblue;
    border: 1px solid #dbdbdb;
    border-radius: 10px;
    padding: 0.5rem 1rem 0.7rem;
    margin-bottom: 1rem;
}
/*#endregion */

/* for scrollable gridview */
.wmgridscroll {
    overflow-y: auto;
    overflow-x: auto;
}
/* for short scroll on gridview */
.wmgridscrollsmall {
    overflow-y: auto;
    overflow-x: auto;
    max-height: 300px;
}

/*Removes selective borders for nice style on inner table*/
.wmgridinner {
    border-width: 0;
}

    .wmgridinner tr th, .wmgridinner tr td {
        border-top-width: 0;
    }

        .wmgridinner tr th:first-child, .wmgridinner tr td:first-child {
            border-left-width: 0;
        }

        .wmgridinner tr th:last-child, .wmgridinner tr td:last-child {
            border-right-width: 0;
        }

/*#region OWTF Account page for mobile, reshape table data  */

/* Mobile / narrow layout for Account page (? 768px) */

/*@media (max-width: 768px) {

    .wmgrid {
        margin-bottom: 0;
        border-bottom: none;
    }

        .wmgrid.wmgridouter {
            border-bottom: none;
        }

        .wmgrid.wmgridreg.wmgridouter > tbody > .wmgridheader + .wmgridrow > td:first-child {
            background: #97c7e7;
            vertical-align: middle;
        }

            .wmgrid.wmgridreg.wmgridouter > tbody > .wmgridheader + .wmgridrow > td:first-child .wmsmaller {
                font-size: 1.2rem !important;
            }*/


    /* Outer rows become card-like, keep borders only here */
    /*.wmgridreg .wmgrid .wmgridrow,
    .wmgridreg .wmgrid .wmgridrowalt {
        display: block;
        margin: 0;
        overflow: hidden;
    }*/

    /* Remove all inner borders — only outer card border remains */
    /*.wmgrid td,
    .wmgrid th,
    .wmgridinner td,
    .wmgridinner th {
        border: none !important;
    }*/

    /* Outer cell ? full-width blocks */
    /*.wmgridrow > td,
    .wmgridrowalt > td {
        display: block;
        border: none;
        padding: 3px 5px;
        border-bottom: 1px solid #e0e0e0;
    }

    .wmgridreg .wmgridrow > td:first-child,
    .wmgridreg .wmgridrowalt > td:first-child {
        font-weight: bold;
        border-bottom: 0px solid #e0e0e0;
    }*/

    /* Inner table area — no padding around it */
    /*.wmgridrow > td:last-child,
    .wmgridrowalt > td:last-child {
        padding: 0;
    }

    .wmgridrow > td img {
        margin-top: 10px;
    }

    .wmgrid tr.wmgridrow, .wmgrid tr.wmgridrowalt {
        border-bottom: 1px solid #dbdbdb;
    }*/

    /* Flatten inner table into stacked rows */
    /*.wmgridinner,
    .wmgridinner tbody,
    .wmgridinner tr,
    .wmgridinner td {
        display: block;
    }


        .wmgridinner tr.wmgridrow, .wmgridinner tr.wmgridrowalt {
            display: block;
            border-bottom: 1px solid #dbdbdb;
        }

            .wmgridinner tr.wmgridrow td, .wmgridinner tr.wmgridrowalt td {
                display: block;
                padding: 3px 12px;
                border: none;
                text-align: left;
                min-height: 2.3em;
            }

    .wmgridreg.wmgridinner tr.wmgridrow td:last-child, .wmgridreg.wmgridinner tr.wmgridrowalt td:last-child {
        border-bottom: 1px solid #dbdbdb !important;
    }*/

    /* Hide all headers on mobile */
    /*.wmgridheader, .wmgridinner .wmgridheader {
        display: none !important;
    }*/

    /* Force left alignment everywhere on mobile */
    /*.wmgridinner td, .wmgridinner td * {
        text-align: left !important;
    }*/

    /* Special treatment for wmgridreg */
    /*.wmgridreg.wmgridinner tr.wmgridrow td:nth-child(4), .wmgridreg.wmgridinner tr.wmgridrowalt td:nth-child(4) {
        display: flex;
        align-items: baseline;
        gap: 10px;
    }

        .wmgridreg.wmgridinner tr.wmgridrow td:nth-child(4)::before, .wmgridreg.wmgridinner tr.wmgridrowalt td:nth-child(4)::before {
            content: "Add-ons & Sizes: ";
            font-weight: bold;
            flex-shrink: 0;
        }
}*/


/*#endregion */

/*#region Range Slider */
.range-slider {
    margin: 0px 0 0px 0;
}

.range-slider {
    width: 100%;
}

.range-slider__range {
    -webkit-appearance: none;
    width: calc(100% - (73px));
    height: 10px;
    border-radius: 5px;
    background: #d7dcdf;
    outline: none;
    padding: 0;
    margin: 0;
}

    .range-slider__range::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background: #2c3e50;
        cursor: pointer;
        -webkit-transition: background 0.15s ease-in-out;
        transition: background 0.15s ease-in-out;
    }

        .range-slider__range::-webkit-slider-thumb:hover {
            background: #1abc9c;
        }

    .range-slider__range:active::-webkit-slider-thumb {
        background: #1abc9c;
    }

    .range-slider__range::-moz-range-thumb {
        width: 20px;
        height: 20px;
        border: 0;
        border-radius: 50%;
        background: #2c3e50;
        cursor: pointer;
        -moz-transition: background 0.15s ease-in-out;
        transition: background 0.15s ease-in-out;
    }

        .range-slider__range::-moz-range-thumb:hover {
            background: #1abc9c;
        }

    .range-slider__range:active::-moz-range-thumb {
        background: #1abc9c;
    }

    .range-slider__range:focus::-webkit-slider-thumb {
        box-shadow: 0 0 0 3px #fff, 0 0 0 6px #1abc9c;
    }

.range-slider__value {
    display: inline-block;
    position: relative;
    width: 60px;
    color: #fff;
    line-height: 20px;
    text-align: center;
    border-radius: 3px;
    background: #2c3e50;
    padding: 5px 10px;
    margin-left: 8px;
}

    .range-slider__value:after {
        position: absolute;
        top: 8px;
        left: -7px;
        width: 0;
        height: 0;
        border-top: 7px solid transparent;
        border-right: 7px solid #2c3e50;
        border-bottom: 7px solid transparent;
        content: "";
    }

::-moz-range-track {
    background: #d7dcdf;
    border: 0;
}

input::-moz-focus-inner,
input::-moz-focus-outer {
    border: 0;
}

/*#endregion */

/*#region Ajax Modal Popup Dialog */
.wmmodalpopup {
    text-align: center;
    /*font-size: 13px;*/
    background-color: #f5f6f9;
    border: 1px solid #d2d7e7;
    padding: 20px 30px 20px 30px;
    max-width: 900px;
    margin: auto;
    border-radius: 7px;
    z-index: 10000;
    position: relative;
    font-family: Arial, Helvetica, sans-serif;
}

    .wmmodalpopup a {
    }

        .wmmodalpopup a:hover {
        }

.wmmodalbackground {
    background-color: Black;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    opacity: 0.6;
}

.wmmodalpopupTC {
    overflow: auto;
    height: 500px;
    font-size: 11px;
}

    .wmmodalpopupTC p, .wmmodalpopupTC li {
        font-size: 11px;
    }

/* reset z-index on dialogs */
.ui-dialog {
    max-width: 90%;
}

.ui-widget-content {
    z-index: 1000;
    overflow-y: scroll;
}

body .ui-widget-overlay {
    opacity: 0.8;
    background-color: #000000;
}

.ui-dialog-buttonpane {
    text-align: center !important;
    float: none !important;
}

.ui-dialog-buttonset {
    float: none !important;
}

.ui-dialog .ui-dialog-buttonpane {
    padding: .3rem 1rem 0.5rem 1rem !important;
}
/*#endregion*/

/*#region Register Group and navbar, possibly move to skin.*/
.registerGroup {
    text-align: center;
    display: block;
    flex-grow: 1;
    margin-bottom: 0.5rem;
}

@media screen and (max-width:992px) {

    .registerGroup ul.buttonGroup .userDisplayName {
        display: none;
    }
}

/*@media screen and (max-width: 768px) {
    .navbar-brand img {
        max-height: unset !important;
    }
}*/

/*#endregion */

/*#region Slider Panel */
/* ------------------------------------------- */
.wmslidepanel {
    position: relative;
    margin: 0;
    padding: 0;
}

.wmslideheader {
}

    .wmslideheader a {
        display: block;
        padding: 0px;
        margin: 0px;
    }

        .wmslideheader a:hover {
        }

.wmslidebody {
    padding: 0;
    margin: 0px;
    display: none;
}

/* Slider Panel Help style */
.wmslidepanel.wmslidehelp {
    /*margin-top: -1rem;*/
}

.wmslidehelp .wmslideheader {
    text-align: right;
}

    /*Slider Panel - Help Ico  */
    .wmslidehelp .wmslideheader a {
        padding: 0px 0.5rem 0px 0px;
        display: block;
        color: gold;
    }

        .wmslidehelp .wmslideheader a i {
            color: #5192c9;
        }

.wmslidevar2 .wmslideheader a:hover {
}

.wmslidevar2 .wmslidebody {
    padding: 5px 0 15px 0;
    display: none;
}

/* slide var 3, attach with slidepanel */
.wmslidevar3 .wmslideheader a {
    background: url(icons/warrow-down-dark-25.png) no-repeat right center;
}
/*#endregion*/

/*#region  Slide Var 5 -  no margins, gray panel */
.wmslidevar5 .wmslidepanel {
    position: relative;
    margin: 0;
    padding: 0;
    clear: both;
}

.wmslidevar5 .wmslideheader {
    background: aliceblue; /*$GlobalColor4;*/
    border-top: 1px solid unquote($GlobalColor2 + '52'); /* adds about 50% transparency */
    text-align: left;
}

    .wmslidevar5 .wmslideheader:hover {
        background: $GlobalColor2;
    }

    .wmslidevar5 .wmslideheader a {
        font-size: 1.1rem;
        padding: 1rem;
        margin: auto;
        display: block;
    }

        .wmslidevar5 .wmslideheader a:hover {
            color: #ffffff;
        }

        .wmslidevar5 .wmslideheader a::before {
            font-family: 'Font Awesome 7 Free';
            content: "\f13a";
            font-weight: 900;
            font-size: 1.2rem;
            margin: 0 .5rem;
            color: unquote($FontColorDefault + '52');
            transition: transform 0.3s ease;
            display: inline-block;
        }

        .wmslidevar5 .wmslideheader a:hover::before {
            color: #ffffff75;
        }

    .wmslidevar5 .wmslideheader.wmslideheaderactive {
        background: $GlobalColor2;
        color: #ffffff;
    }

        .wmslidevar5 .wmslideheader.wmslideheaderactive a::before {
            transform: rotate(-180deg);
            color: #ffffff75;
        }

.wmslidevar5 .wmslidebody {
    padding: 0 0 0 2.5rem;
    margin: 1rem auto;
    display: none;
}
/*#endregion */

/*#region  Slide Var 6 -  Simple title with arrow (old) */
/*.wmslidevar6 .wmslidepanel {
    position: relative;
    margin: 0;
    padding: 0;
    clear: both;
}

.wmslidevar6 .wmslideheader {
    background: transparent;
    border: 0px solid #ededed;
    text-align: left;
}

    .wmslidevar6 .wmslideheader:hover {
        background: transparent;
    }

    .wmslidevar6 .wmslideheader a {
        font-size: 1.1rem;
        padding: 0rem;
        margin: auto;
        display: block;
    }

        .wmslidevar6 .wmslideheader a:hover {
            color: blue;
        }

        .wmslidevar6 .wmslideheader a::before {
            font-family: 'Font Awesome 7 Free';
            content: "\f13a";
            font-weight: 900;
            font-size: 1.2rem;
            margin: 0 .5rem;
            color: unquote($FontColorDefault + '52');
            transition: transform 0.3s ease;
            display: inline-block;
        }

        .wmslidevar6 .wmslideheader a:hover::before {
            color: #44444475;
        }

    .wmslidevar6 .wmslideheader.wmslideheaderactive {
        background: transparent;
        color: #777777;
    }

        .wmslidevar6 .wmslideheader.wmslideheaderactive a::before {
            transform: rotate(-180deg);
            color: #44444475;
        }

.wmslidevar6 .wmslidebody {
    padding: 0;
    margin: 0rem auto;
    display: none;
}*/
/*#endregion */

/*#region  Slide Var 6 -  Simple title with arrow (new) works with tabs */
.wmslidevar6 .wmslidepanel {
    margin-bottom: 0.3rem;
}

.wmslidevar6 .wmslideheader a {
    font-size: 1rem;
    padding: 0.6rem 1rem;
    display: flex;
    align-items: center;
    background: whitesmoke;
    font-weight: 700;
    border-radius: 7px;
    color: #333;
    text-decoration: none;
    transition: all 0.5s ease;
}
.wmslidevar6 .wmslideheader.wmslideheaderactive a {
    background: #00a1da !important;
    color: #ffffff !important;
    border-radius: 7px 7px 0 0;
}

.wmslidevar6 .wmslideheader a:hover {
    color: #0066cc;
    background: #f8f9fa;
}

.wmslidevar6 .wmslideheader a::before {
    font-family: "Font Awesome 7 Free";
    content: "\f107";
    font-weight: 900;
    margin-right: 0.7rem;
    color: #00a1da;
    transition: transform 0.35s ease;
}

.wmslidevar6 .wmslideheader.wmslideheaderactive a::before {
    transform: rotate(-180deg);
    color: #ffffff;
}

.wmslidevar6 .wmslidebody {
    padding: .5rem 1rem;
    background: #fdfdfd;
    border: 1px solid #eee;
    border-top: 0;
    border-bottom: 10px solid #00a1da;
    border-radius: 0 0 7px 7px;
    display: none;
    transition: all 0.5s ease;
}
/*#endregion*/

/*#region  Slide Var 7 -  Simple title with arrow */
.wmslidevar7 .wmslidepanel {
    position: relative;
    margin: 0;
    padding: 0;
    clear: both;
}

.wmslidevar7 .wmslideheader {
    background: transparent;
    border: 0px solid #ededed;
    text-align: left;
}

    .wmslidevar7 .wmslideheader:hover {
        background: transparent;
    }

    .wmslidevar7 .wmslideheader a {
        /*font-size: 1.1rem;*/
        padding: 0rem;
        margin: auto;
        display: block;
    }

        .wmslidevar7 .wmslideheader a:hover {
            /*color: blue;*/
        }

        .wmslidevar7 .wmslideheader a::before {
            font-family: 'Font Awesome 7 Free';
            content: "\f13a";
            font-weight: 900;
            font-size: 13px;
            margin: 0 .5rem 0 0;
            color: unquote($FontColorDefault + '52');
            transition: transform 0.3s ease;
            display: inline-block;
        }

        .wmslidevar7 .wmslideheader a:hover::before {
            /* color: #44444475;*/
        }

    .wmslidevar7 .wmslideheader.wmslideheaderactive {
        background: transparent;
        /*color: #777777;*/
    }

        .wmslidevar7 .wmslideheader.wmslideheaderactive a::before {
            transform: rotate(-180deg);
            /*color: #44444475;*/
        }

.wmslidevar7 .wmslidebody {
    padding: 0;
    margin: 0rem auto;
    display: none;
}
/*#endregion */

/*#region Handy Padding */

/* top and bottom */
.wmpadv5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.wmpadv7 {
    padding-top: 7px;
    padding-bottom: 7px;
}

.wmpadv10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.wmpadv15 {
    padding-top: 15px;
    padding-bottom: 15px;
}

.wmpadv20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.wmpadv30 {
    padding-top: 30px;
    padding-bottom: 30px;
}
/* top */
.wmpadt5 {
    padding-top: 5px;
}

.wmpadt7 {
    padding-top: 7px;
}

.wmpadt10 {
    padding-top: 10px;
}

.wmpadt15 {
    padding-top: 15px;
}

.wmpadt20 {
    padding-top: 20px;
}

.wmpadt30 {
    padding-top: 30px;
}

/* bottom */
.wmpadb5 {
    padding-bottom: 5px;
}

.wmpadb7 {
    padding-bottom: 7px;
}

.wmpadb10 {
    padding-bottom: 10px;
}

.wmpadb15 {
    padding-bottom: 15px;
}

.wmpadb20 {
    padding-bottom: 20px;
}

.wmpadb30 {
    padding-bottom: 30px;
}
/* left */
.wmpadl5 {
    padding-left: 5px;
}

.wmpadl7 {
    padding-left: 7px;
}

.wmpadl10 {
    padding-left: 10px;
}

.wmpadl15 {
    padding-left: 15px;
}

.wmpadl20 {
    padding-left: 20px;
}

.wmpadl30 {
    padding-left: 30px;
}

/* right */
.wmpadr5 {
    padding-right: 5px;
}

.wmpadr7 {
    padding-right: 7px;
}

.wmpadr10 {
    padding-right: 10px;
}

.wmpadr15 {
    padding-right: 15px;
}

.wmpadr20 {
    padding-right: 20px;
}

.wmpadr30 {
    padding-right: 30px;
}

/*#endregion*/

/*#region adminEmployee Password strength */

#password-strength-status {
    font-size: .8rem;
}

.weak-password {
    color: red;
}

.medium-password {
    color: #00a1ff;
}

.strong-password {
    color: green;
}

/*#endregion */

/*#region Styles for Tab/Accordion feature */
.controls {
    margin: 2px 0;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
    border: 1px solid #dcdcdc;
    font-size: 12px;
    font-weight: 500;
    padding: 4px 1rem 2px;
    border-radius: 5px;
}

.mode-toggle, .expand-all {
    cursor: pointer;
    user-select: none;
    padding: 5px .5rem;
    border-radius: 5px;
    background: #f0f0f0;
}

    .mode-toggle:hover, .expand-all:hover {
        background: #e0e0e0;
    }

    .mode-toggle.active {
        background: #d0e8ff;
        font-weight: 600;
    }

/* Tabs styles */

.mode-tabs .headers-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-bottom: .3rem;
}

.mode-tabs .wmslideheader {
    flex: 1 1 auto;
    min-width: 100px;
}

    .mode-tabs .wmslideheader a {
        border-radius: 7px 7px 0 0;
        justify-content: center;
        background: #e9ecef;
        text-align: center;
        padding: 0.3rem .5rem;
        font-size:.85rem;
    }

    .mode-tabs .wmslideheader.wmslideheaderactive a {
        background: white;
        /*border-bottom: 3px solid #0066cc;*/
        color: #0066cc;
        font-weight: bold;
        padding: 0.3rem .5rem;
    }

    .mode-tabs .wmslideheader a::before {
        display: none;
    }

.mode-tabs .wmslidepanel {
    display: none;
}

    .mode-tabs .wmslidepanel.active {
        display: block;
    }
        .mode-tabs .wmslidepanel.active .wmslideheader a {
            background: #00a1da;
            color:#ffffff;
            text-align: left;
            justify-content:left;
            font-size:1rem;
            padding-left:1rem;
        }

.mode-tabs .wmslidebody {
    display: block !important;
    border: 1px solid #dee2e6;
    border-top: 0;
    border-radius: 0 0 7px 7px;
    border-bottom: 10px solid #00a1da;
}

/*#endregion */

/*#region JQuery UI Date Picker */
.ui-widget-content {
    overflow-y: auto;
}
/*#endregion */

/*#region Incentives - Points in grid */
/*.wmgridpoints, .wmgrid td.wmgridpoints {
    vertical-align: middle;
    text-align: center;
    font-weight: 600;
    font-size: 1rem;
}*/
    /* for approavl que points column */
    /*.wmgrid td.wmgridpoints.wmgridtopcenter.wmgridforcetop {
        vertical-align: top !important;
    }*/
/*#endregion*/

/*#region FQ App layout */

.wmcontrols {
    margin: 2px 0;    
    border: 1px solid #dcdcdc;
    font-size: 12px;
    font-weight: 500;
    padding: 4px 1rem 2px;
    border-radius: 7px;
    display:inline-block;
}
/* use when inline with top controls, slightly taller input */
.wmform .wmfield.wmfieldcontrolsize input[type=text], .wmform .wmfield.wmfieldcontrolsize select {
    padding: 6px 5px;
    border-radius: 7px;
}

/* FQ status colors */
.wmDraft {
    color: orange;
    font-weight: 600;
}
.wmSubmitted {
    color: Blue;
    font-weight: 600;
}
.wmInReview {
    color: Green;
    font-weight: 600;
}
.wmCancelled {
    color: red;
    font-weight: 600;
}
.wmRejected {
    color: red;
    font-weight: 600;
}


/* FQ Section headings */
.wmapplabel {font-size:1.1rem; font-weight:550;padding:.5rem .3rem;
}
.wmapplabelinfo {
    background: #d8ecf3;
    padding: .5rem;
    font-size: 0.85rem;
    font-weight: 400;
    margin: .5rem 0;
    width: 100%;
    border-radius: 7px;
}
/*#endregion */

/*#region FQ Status colors for top bar */

.wmDraft {
    color: orange;
    font-weight: 600;
}

.wmSubmitted {
    color: Blue;
    font-weight: 600;
}

.wmInReview {
    color: Green;
    font-weight: 600;
}

.wmCancelled {
    color: red;
    font-weight: 600;
}

.wmRejected {
    color: red;
    font-weight: 600;
}

/* For swatch, such as in grid */

.wmswatchDraft {
display:inline-block;
width:10px;
height:10px;
background:orange;
}
.wmswatchSubmitted {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #4ea5e5;
}
.wmswatchApproved {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: green;
}

.wmswatchSubmitted {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #4ea5e5;
}



/*#endregion*/

/*#region FQ Simple donut graph */
.tiny-donut {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: conic-gradient( #00a1da var(--progress), /* completed - change color as needed */
    #e0e0e0 var(--progress) /* remaining */
    );
    position: relative;
    display: inline-block;
    vertical-align:middle;
    margin-top:-3px;
}

    /* Creates the donut hole */
    .tiny-donut::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 12px; /* controls hole size → thinner ring if smaller */
        height: 12px;
        background: #ffffff; /* change to match your page background */
        border-radius: 50%;
    }
/*#endregion*/

/*#region FQ Mark Complete boxes */

.row.wmsectionactions {
    align-items: center;
    text-align: center;
    /*border-bottom: 10px solid #00a1da;*/
    border-radius: 0px;
    margin: 1rem 0;
    padding: 1rem 0 2rem;
    width: 98%;
}

.wmcompletecontainer {
    padding: .5rem 1.5rem;
    border-radius: 7px;
    transition: all 0.3s ease;
    display: inline-block;
    line-height: 100%;
    font-size: .8rem;
    font-style: italic;
}
.wmcompletecontainer label{
    vertical-align:text-top;    
}

.wmcompletechecked {
    background-color: #ecfdf0;
    border: 1px solid #b7ebc3;
}

.wmcompleteunchecked {
    background-color: transparent;
    border: 1px solid #ededed;
}

/*#endregion*/

/*mmj.230130*/
a.disabled {
    pointer-events: none;
    cursor: default;
}
/* ----------------------- */
/*[id$='lblDateCalc'] {
    display: block;
    font-size: .85rem;
}*/

/*#region Ajax Textbox Extender */
/* Ajax Textbox Extender */
.watermarkText {
    color: #BBB;
}

.watermarkDisabled {
    color: #000;
}


/*#endregion */


/* ------------------------- */
/* Pop up window */
.wmodmap {
    position: relative;
}

.wmodpop {
    display: none;
    z-index: 2;
    width: auto;
    max-width: 500px;
    position: fixed;
    top: 20vh;
    left: 10vw;
    right: 10vw;
    margin: auto;
    box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.2);
    border: 1px solid #777777;
    border-radius: 5px;
    background: #ededed;
    padding: 10px;
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 18%, #e8e8da 100%);
    background: -webkit-linear-gradient(top, #ffffff 18%,#e8e8da 100%);
    background: linear-gradient(to bottom, #ffffff 18%,#e8e8da 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e8e8da',GradientType=0 );
}


.wmodpopclose {
    color: red;
    font-size: 1.5em;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
}

.required:after {
    content: " *";
    color: red;
}

#dialogConfirm fieldset {
    padding: .35em .625em .75em;
    margin: 0 2px;
    border: 1px solid silver;
}

@media print {
    /*personaBarContainer {
        display: none;
    }
    body.personabar-visible {
        margin-left: 0;
    }*/
}

/*** ------------------------------ ***/
/*** Values from old css/Global.css ***/
/*** ------------------------------ ***/

/* -------------------------------------------------------- */
/* -------------------------------------------------------- */
/* Menu Blanks */
a.cursorDefault {
    cursor: default;
}

.ui-dialog {
    z-index: 200;
}
/* Ajax Textbox Extender */
.watermarkText {
    color: #BBB;
}

.watermarkDisabled {
    color: #000;
}
/* Used on product pages for watermark in texboxes */
.watermarkSmall {
    color: #BBB;
    font-size: 11px !important;
    width: 150px;
}

/*#endregion */