body, form {
    margin: 0 auto;
    font-family: 'Segoe UI';
    font-size: 11px;
    text-transform: uppercase;
}

select {
    text-transform: uppercase;
}

    select option {
        text-transform: uppercase;
    }


.externalborder {
    border: 2px solid black !important;
}

.leftborder {
    border-left: 2px solid black !important;
}

.topborder {
    border-top: 2px solid black !important;
}

.bottomborder {
    border-bottom: 2px solid black !important;
}

.rightborder {
    border-right: 2px solid black !important;
}

.prodDiv {
    position: fixed;
    right: 324px;
    margin-top: 10px;
    width: 100px;
    background-color: #d5edf6;
    color: black;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold !important;
}

    .prodDiv > span {
        position: absolute;
        top: 6px;
        left: 40px;
        width: 100%;
        height: 100%;
        display: table;
    }

.today {
    border-radius: 5px;
    text-align: right; /* Right-align text */
    padding-top: 6px; /* Add top padding */
    padding-bottom: 6px; /* Add bottom padding */
    padding-right: 7px;
    color: white; /* White text color */
    font-weight: bold !important;
}

.prodQDiv {
    position: fixed;
    right: 230px;
    margin-top: 10px;
    width: 75px;
    color: black;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold !important;
}

    .prodQDiv > span {
        position: absolute;
        top: 6px;
        left: 40px;
        width: 100%;
        height: 100%;
        display: inline;
    }

.todayq {
    border-radius: 5px !important;
    text-align: right; /* Right-align text */
    padding-top: 6px; /* Add top padding */
    padding-bottom: 6px; /* Add bottom padding */
    padding-right: 7px;
    color: white; /* White text color */
    font-weight: bold !important;
    width: 90px !important;
}

.produnrderr {
    position: fixed;
    right: 433px;
    margin-top: 10px;
    width: 40px;
    height: 20px;
    color: black;
    text-align: right;
    border-radius: 30px;
    cursor: pointer;
    font-weight: bold !important;
}

    .produnrderr > span {
        position: absolute;
        top: 6px;
        left: 40px;
        width: 100%;
        height: 100%;
        display: inline;
    }

.todayure {
    border-radius: 30px;
    text-align: center;
    margin-left: 5px; /* Right-align text */
    padding-top: 6px; /* Add top padding */
    padding-bottom: 6px; /* Add bottom padding */
    padding-right: 0px;
    color: #700e01; /* White text color */
    font-weight: 900 !important;
}


.pat-tag {
    display: block;
    margin: 10px 10px 0px 0px;
    max-width: 211px;
}

    .pat-tag span {
        color: #fff;
    }

    .pat-tag .pat-data {
        background-color: #2EA2CC;
        color: white;
        padding: 0.2em 0.6em 0.3em;
        border-top-left-radius: 0.25em;
        border-bottom-left-radius: 0.25em;
    }

    .pat-tag .pat-rmv {
        background-color: #2e95cc;
        color: white;
        border-top-right-radius: 0.25em;
        border-bottom-right-radius: 0.25em;
        cursor: pointer;
        margin-left: -5px;
        padding: 0.2em 0.3em 0.3em;
    }

        .pat-tag .pat-rmv:hover {
            background-color: #2EA2CC;
        }

.arPatSelcted {
    width: 60%;
    background: none repeat scroll 0% 0% #2EA2CC;
    color: white;
    display: block;
    margin: 5px;
    margin-bottom: 0px;
    padding-left: 20px;
}

.DelPatARBtn {
    display: inline-block;
    margin-bottom: 0;
    text-align: center;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 12px;
    border-radius: 15px;
    margin-right: 10%;
    color: #FFF;
    background: none repeat scroll 0% 0% #2EA2CC;
    box-shadow: 0px 1px 0px rgba(120, 200, 230, 0.5) inset, 0px 1px 0px rgba(0, 0, 0, 0.15);
    border: none;
    padding-left: 20px;
}

td, div, a, select, option {
    font-size: 11px;
    font-family: 'Segoe UI';
}

.rightalign {
    text-align: right;
    padding-right: 10px;
}

.loginbox {
    background: #eee;
    margin: 10px;
    padding: 10px;
    box-shadow: 0 0 9px rgba(0,0,0,.3);
    position: relative;
    border: 2px solid threedface;
}


.container {
    margin: 0;
    padding: 0px;
    background: #F0F0F0;
    height: auto;
    width: 100%;
}

.inboxclass {
    font-weight: bold;
    color: darkblue;
}

.hr-sep {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 0;
    width: 100%;
    border-top: 1px solid #d6d2d2;
}


.footer {
    background-color: #ccc;
    text-align: center;
    float: left;
    width: 100%;
    padding: 10px;
    position: fixed;
    bottom: 0;
}

.pageWrap {
    background-color: #F5F5F5;
    float: left;
    width: 100%;
}

.PageContent {
    margin: 0 auto;
    padding: 20px;
}

.listbox {
    border-style: solid;
    border-width: 1px;
}

.Header {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    background: #99CCFF;
    overflow: visible;
}



.pageHeading {
    font-size: 14px;
    margin: 0px 0px 10px;
    border-bottom: 1px dashed #DDD;
    padding: 0px 0px 5px;
}

.NoBorderTable {
    border-collapse: collapse;
    border-spacing: 0px;
}

    .NoBorderTable td {
        padding-right: 10px;
    }

.NoBorderFormTable {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0px;
}


    .NoBorderFormTable tr td {
        text-align: left;
    }

    .NoBorderFormTable td:nth-child(2n+1) {
        text-align: left;
    }


.GridHeader {
    //background-color: #99CCFF;
    background-color: #DFEFFF;
    color: black;
    border: 1px solid #000066;
}

.GridContentWhite {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0px;
    border: 1px solid #E1E1E1;
}

.GridContent {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0px;
    border: 1px solid #E1E1E1;
}

    .GridContent thead {
        background-color: #AED7FF;
        font-weight: 700;
        color: black;
        text-align: center;
    }

    .GridContent th {
        border: none;
        text-align: left;
/*        border: 1px solid #E2E2E2;
*/        border-bottom: 1px solid #E2E2E2;
        background-color: #e1e5ea;
    }



    .GridContent tr {
        border: solid 1px #E1E1E1;
    }

        .GridContent tr td {
        }








.ddsmoothmenu {
    font-weight: 600;
    background: #99CCFF; /*background of menu bar (default state)*/
    width: 100%;
}

    .ddsmoothmenu ul {
        z-index: 100;
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

        /*Top level list items*/
        .ddsmoothmenu ul li {
            position: relative;
            display: inline;
            float: left;
        }

            /*Top level menu link items style*/
            .ddsmoothmenu ul li a {
                display: block;
                background: #99CCFF; /*background of menu items (default state)*/
                color: white;
                padding: 4px 8px 5px 8px;
                border-right: 1px solid #99CCFF;
                color: #2D2B2B;
                text-decoration: none;
            }

            * html .ddsmoothmenu ul li a { /*IE6 hack to get sub menu links to behave correctly*/
                display: inline-block;
            }

                .ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited {
                    color: #330000;
                    font-weight: 500;
                }

                .ddsmoothmenu ul li a.selected {
                    /*CSS class that's dynamically added to the currently active menu items' LI A element*/
                    background: #5BADFF !important;
                    color: black;
                }

                .ddsmoothmenu ul li a:hover {
                    background: #5BADFF; /*background of menu items during onmouseover (hover state)*/
                    color: black;
                }

            /* sub menus */
            .ddsmoothmenu ul li ul {
                position: absolute;
                left: -3000px;
                display: none; /*collapse all sub menus to begin with*/
                visibility: hidden;
            }

                /*Sub level menu list items (alters style from Top level List Items)*/
                .ddsmoothmenu ul li ul li {
                    display: list-item;
                    float: none;
                }

                    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
                    .ddsmoothmenu ul li ul li ul {
                        top: 0;
                    }

                    /* Sub level menu links style */
                    .ddsmoothmenu ul li ul li a {
                        font: normal 13px Verdana;
                        width: 160px; /*width of sub menus*/
                        padding: 5px;
                        margin: 0;
                        border-top-width: 0;
                        border-bottom: 1px solid #5BADFF;
                    }

/* Holly Hack for IE \*/
* html .ddsmoothmenu {
    height: 1%;
}
/*Holly Hack for IE7 and below*/


/* ######### CSS classes applied to down and right arrow images  ######### */

.downarrowclass {
    position: absolute;
    top: 12px;
    right: 7px;
}

.rightarrowclass {
    position: absolute;
    top: 6px;
    right: 5px;
}

/* ######### CSS for shadow added to sub menus  ######### */

.ddshadow {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    background-color: #ccc; /* generally should be just a little lighter than the box-shadow color for CSS3 capable browsers */
}

.toplevelshadow {
    margin: 5px 0 0 5px; /* in NON CSS3 capable browsers gives the offset of the shadow */
    opacity: 0.8; /* shadow opacity mostly for NON CSS3 capable browsers. Doesn't work in IE */
}

.ddcss3support .ddshadow.toplevelshadow {
    margin: 0; /* in CSS3 capable browsers overrides offset from NON CSS3 capable browsers, allowing the box-shadow values in the next selector to govern that */
    /* opacity: 1; */ /* optionally uncomment this to remove partial opacity for browsers supporting a box-shadow property which has its own slight gradient opacity */
}

.ddcss3support .ddshadow {
    background-color: transparent;
    box-shadow: 5px 5px 5px #aaa; /* box-shadow color generally should be a little darker than that for the NON CSS3 capable browsers background-color */
    -moz-box-shadow: 5px 5px 5px #aaa;
    -webkit-box-shadow: 5px 5px 5px #aaa;
}


.productName {
    font-family: 'segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 800;
    line-height: 1em;
    color: #ea7624;
    font-size: 20px;
    text-shadow: -3px 2px 4px #C4C4C4;
    font-variant: small-caps;
}

/********************** UI Multi select ****************/
/* Multiselect
----------------------------------*/
.ui-multiselect {
    padding: 2px 0 2px 4px;
    text-align: left;
    background-color: white;
}

    .ui-multiselect span.ui-icon {
        float: right;
    }

.ui-multiselect-single .ui-multiselect-checkboxes input {
    position: absolute !important;
    top: auto !important;
    left: -9999px;
}

.ui-multiselect-single .ui-multiselect-checkboxes label {
    padding: 5px !important;
}

.ui-multiselect-header {
    margin-bottom: 3px;
    padding: 3px 0 3px 4px;
}

    .ui-multiselect-header ul {
        font-size: 0.9em;
    }

        .ui-multiselect-header ul li {
            float: left;
            padding: 0 10px 0 0;
        }

    .ui-multiselect-header a {
        text-decoration: none;
    }

        .ui-multiselect-header a:hover {
            text-decoration: underline;
        }

    .ui-multiselect-header span.ui-icon {
        float: left;
    }

    .ui-multiselect-header li.ui-multiselect-close {
        float: right;
        text-align: right;
        padding-right: 0;
    }

.ui-multiselect-menu {
    display: none;
    padding: 3px;
    position: absolute;
    z-index: 10000;
    background-color: white;
    border: 1px solid #999 !important;
}

.ui-multiselect-checkboxes {
    position: relative /* fixes bug in IE6/7 */;
    overflow-y: scroll;
  
}

    .ui-multiselect-checkboxes label {
        cursor: default;
        display: block;
        border: 1px solid transparent;
        padding: 3px 1px;
    }

        .ui-multiselect-checkboxes label input {
            position: relative;
            top: 1px;
        }

    .ui-multiselect-checkboxes li {
        clear: both;
        font-size: 0.9em;
        padding-right: 3px;
    }

        .ui-multiselect-checkboxes li.ui-multiselect-optgroup-label {
            text-align: center;
            font-weight: bold;
            border-bottom: 1px solid;
        }

            .ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a {
                display: block;
                padding: 3px;
                margin: 1px 0;
                text-decoration: none;
            }

    /* remove label borders in IE6 because IE6 does not support transparency */
    * html .ui-multiselect-checkboxes label {
        border: none;
    }

.ui-multiselect-hasfilter ul {
    position: relative;
    top: 2px;
}

.ui-multiselect-filter {
    float: left;
    margin-right: 10px;
    font-size: 11px;
}

    .ui-multiselect-filter input {
        width: 100px;
        font-size: 10px;
        margin-left: 5px;
        height: 15px;
        padding: 2px;
        border: 1px solid #292929;
        -webkit-appearance: textfield;
        -webkit-box-sizing: content-box;
    }



/*******************************UI Multiselect ends *****************************/




div.pagination {
    padding: 3px;
    margin: 3px;
}

    div.pagination a {
        padding: 2px 5px 2px 5px;
        margin: 2px;
        border: 1px solid #AAAADD;
        text-decoration: none; /* no underline */
        color: #000099;
    }

        div.pagination a:hover, div.pagination a:active {
            border: 1px solid #000099;
            color: #000;
        }

    div.pagination span.current {
        padding: 2px 5px 2px 5px;
        margin: 2px;
        border: 1px solid #000099;
        font-weight: bold;
        background-color: #000099;
        color: #FFF;
    }

    div.pagination span.disabled {
        padding: 2px 5px 2px 5px;
        margin: 2px;
        border: 1px solid #EEE;
        color: #DDD;
    }



.sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 60%;
}

    .sortable li {
        margin: 0 3px 3px 3px;
        padding: 0.4em;
        padding-left: 1.5em;
        font-size: 1.4em;
        height: 18px;
    }

        .sortable li span {
            position: absolute;
            margin-left: -1.3em;
        }



.arrow {
    margin-right: 10px;
}

    .arrow a {
        float: left;
        font-size: 12px;
        height: 24px;
        line-height: 24px;
        margin: 0;
        padding: 0 10px 0 24px;
        position: relative;
        text-decoration: none;
    }

    .arrow .blue {
        background: none repeat scroll 0 0 #13A1CB;
        color: #FFFFFF;
    }


    .arrow .gray {
        background: none repeat scroll 0 0 #C0C0C0;
        color: black;
    }

    .arrow .blue:after {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #13A1CB;
    }


    .arrow .gray:after {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #C0C0C0;
    }

    .arrow a:before {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #F5F5DE;
        border-style: solid;
        border-width: 12px 0 12px 12px;
        content: "";
        height: 0;
        left: 0;
        position: absolute;
        top: 0;
        width: 0;
    }

    .arrow a:after {
        border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #0AC92B;
        border-style: solid;
        border-width: 12px 0 12px 12px;
        content: "";
        float: left;
        height: 0;
        position: absolute;
        right: -12px;
        top: 0;
        width: 0;
    }

.GridContent tr td a {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    color: blue;
    line-height: 1;
    vertical-align: baseline;
    white-space: nowrap;
    text-align: center;
   /* background-color: white;*/
    border-radius: 10px;
   /* background-color: #C0392B;*/
}

.GridContent1 tr td a {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 11px;
    color: #000;
    line-height: 1;
    vertical-align: baseline;
    white-space: nowrap;
    text-align: center;
   /* background-color: #999;*/
    border-radius: 10px;
   /* background-color: #C0392B;*/
}

.DocumentClass {
    display: inline-block;
    min-width: 10px;
    font-size: 10px;
    color: #FFF;
    line-height: 1;
    vertical-align: baseline;
    white-space: nowrap;
    text-align: center;
    background-color: transparent !important;
    border-radius: 10px;
}




.GridContent1 tr td a:hover {
    text-decoration: none;
   /* background: #ccc;*/
    color: #333;
}
/*.arrow a:hover
        {
            background: none repeat scroll 0 0 #555555;
        }

            .arrow a:hover:after
            {
                border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #555555;
            }*/

.paging {
    float: right;
    margin-top: -46px;
    white-space: nowrap;
}

    .paging select {
        width: auto;
    }

.paging-header {
}

.highlighttext {
    color: #000066;
    font-weight: lighter;
    text-shadow: 0px 0px -1px #555;
    font-weight: bold;
}

div#trackerContainer div#workFlow1:nth-child(1) div.timerWFlink, div#trackerContainer div#workFlow1:nth-child(1) div.workflowdetails {
    margin-top: 0px;
}

#trackerContainer {
    margin: 0 auto;
    opacity: 0.1;
    margin-top: 46px;
    width: 30px;
    height: 30px;
    border-left: solid;
    border-color: transparent;
    border-width: 12px;
    margin: 0 auto;
    opacity: 0.1;
}

    #trackerContainer div {
        /*  width: 930px;*/
        float: left;
    }

        #trackerContainer div.timelineLink {
            height: 30px;
            width: 20px;
            border-bottom: dotted;
            border-color: white;
            border-width: 1px;
            float: left;
        }

        #trackerContainer div.headerinfo {
            width: 890px;
            height: 125px;
            border-radius: 0px;
            background-color: white;
            float: left;
            padding-top: 10px;
            padding-left: 6px;
            /*-webkit-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            -moz-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);*/
            color: black;
            border: thin solid white;
            margin-left: -30px;
        }

        #trackerContainer div.dynamichtcalc div.timerWFlink {
            height: 50px;
            width: 20px;
            border-bottom: dotted;
            border-color: gray;
            border-width: 1px;
            border-color: lightgray;
            float: left;
            margin-top: 20px;
        }

        #trackerContainer div .workflowdetails {
            width: 800px;
            height: 100px;
            border-radius: 10px;
            float: left;
            margin-top: 20px;
            overflow: hidden;
        }

        #trackerContainer div .wfinpgressfunc {
            background-color: #13A1CB;
            color: white;
        }

        #trackerContainer div .wfigray {
            background-color: white;
            color: #333333;
        }

        #trackerContainer div .wfinpgressfunc:hover {
            width: 800px;
            height: 100px;
            border-radius: 10px;
            background-color: #13A1CB;
            float: left;
            margin-top: 20px;
            color: white;
            -webkit-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            -moz-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
        }

        #trackerContainer div .wfigray:hover {
            width: 800px;
            height: 100px;
            border-radius: 10px;
            background-color: #C0C0C0;
            float: left;
            margin-top: 20px;
            color: #333333;
            -webkit-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            -moz-box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            box-shadow: 1px 1px 9px 0px rgba(50, 50, 50, 0.75);
            cursor: pointer;
        }


        #trackerContainer div .workflowdetails div .photocircle {
            float: left;
            margin: 5px;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background-color: lightgray;
            text-align: center;
            vertical-align: middle;
            line-height: 80px;
        }

        #trackerContainer div .workflowdetails div .photopersonrole {
            float: left;
            width: 140px;
            height: 70px;
            text-align: left;
            margin-top: 30px;
        }


.blinkDiv {
    background-color: violet;
    font-weight: bold;
}

/*SmartSearchControl StyleSheet*/
.ac_results {
    padding: 0px;
    border: 1px solid black;
    background-color: white;
    overflow: hidden;
    z-index: 1000000000 !important;
    text-align: left;
}

    .ac_results ul {
        width: 100%;
        list-style-position: outside;
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .ac_results li {
        margin: 0px;
        padding: 2px 5px;
        cursor: default;
        display: block; /*  	if width will be 100% horizontal scrollbar will apear  	when scroll mode will be used 	*/ /*width: 100%;*/
        font: menu;
        font-size: 12px; /*  	it is very important, if line-height not setted or setted  	in relative units scroll will be broken in firefox 	*/
        line-height: 16px;
        overflow: hidden;
    }

.ac_loading {
    background: white url( 'indicator.gif' ) right center no-repeat;
}

.ac_odd {
    background-color: #eee;
}

.ac_over {
    background-color: #0A246A;
    color: white;
}

/* smart search style sheet ends */


.SmartTextDiv {
    width: 280px; /*follow your image's size*/
    height: 10px; /*follow your image's size*/
    padding: 0px;
    margin: 0px;
    position: relative; /*important*/
    display: inline;
}

.TextBox {
    border: 1px solid #CCCCCC;
    padding: 4px 4px 4px 2px; /*important*/
    top: 0px;
    left: 1px;
    width: 156px;
    height: 15px;
    vertical-align: middle;
}

    .TextBox:focus {
        border-left: 4px solid #3366FF;
        border-style: solid;
        border-width: 1px 1px 1px 4px;
        border-color: #0000FF;
        background-color: #FFFF99;
    }

.SmartText {
    border: 1px solid #CCCCCC;
    background: #FFFFFF url(../images/search.png) no-repeat 4px 4px;
    padding: 4px 4px 4px 22px; /*important*/
    top: 0px;
    left: 1px;
    width: 156px;
    /*height: 15px;*/
    vertical-align: middle;
}

    .SmartText:focus {
        border-left: 4px solid #3366FF;
        border-style: solid;
        border-width: 1px 1px 1px 4px;
        border-color: #0000FF;
        background-color: #FFFF99;
    }

.LoadST {
    border: 1px solid #CCCCCC;
    background: #999999 url(../images/STLoad.gif) no-repeat 4px 4px;
    padding: 4px 4px 4px 22px; /*important*/
    top: 0px;
    left: 1px;
    width: 156px;
    vertical-align: middle;
}

.ac_loading {
    border: 1px solid #CCCCCC;
    background: #999999 url(../images/STLoad.gif) no-repeat 4px 4px;
    padding: 4px 4px 4px 22px; /*important*/
    top: 0px;
    left: 1px;
    width: 256px;
    height: 20px;
    vertical-align: middle;
}

.SmartTextDel {
    border: 0px none;
    background-color: transparent;
    top: -3px;
    width: 15px;
    height: 15px;
    vertical-align: middle;
    float: right;
    margin-top: -19px;
    z-index: 200000000000 !important;
    position: relative;
    right: 13px;
}

.SmartTextDelS {
    border: 0px; /*important*/
    background-color: transparent; /*important*/ /*important*/
    top: 0px;
    width: 27px;
    height: 27px;
    vertical-align: middle;
}

.SmartTextDiv2 {
    height: 40px; /*follow your image's size*/
    padding: 0px;
    margin: 0px;
    position: relative; /*important*/
}


.SmartText2 {
    background: #FFFFFF url(../images/search.png) no-repeat 4px 4px;
    padding: 4px 4px 4px 22px;
    position: absolute;
    border: 1px solid #CCCCCC;
    width: 105px;
    top: 0px;
    left: 1px;
    height: 20px;
}

.SmartTextDel2 {
    border: 1px solid #CCCCCC;
    top: 1px;
    left: 106px;
    height: 20px;
    position: absolute;
}


.arrow-right {
    width: 0;
    height: 0;
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 30px solid green;
}

.arrow-left {
    width: 0;
    height: 0;
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-right: 30px solid green;
}

.small-arrow-right {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid green;
}

.small-arrow-left {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid green;
}

.first-column {
    background-color: darkgray !important;
}

/* This is your new, reusable icon class */
.icon-search {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23FFF' viewBox='0 0 16 16'%3e%3cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important; /* Adjust position as needed */
    padding-left: 30px !important; /* Add space for the icon. Use !important if needed to override defaults. */
    /* Optional: To make the text align better */
    vertical-align: middle;
    text-transform: uppercase;
}


/*.icon-add {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='white' viewBox='0 0 24 24'%3e%3cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v-9a3 3 0 0 1 3-3V4a2 2 0 0 0-2-2zM7 9h6a1 1 0 0 1 0 2H7a1 1 0 0 1 0-2zm0 4h6a1 1 0 0 1 0 2H7a1 1 0 0 1 0-2zm0 4h2a1 1 0 0 1 0 2H7a1 1 0 0 1 0-2z'/%3e%3cpath fill-rule='evenodd' d='M22 14a2 2 0 0 1-2 2h-6a2 2 0 0 1-2-2v-6a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v6z M19 16h-2v-2h-2v2h-2v2h2v2h2v-2h2v-2z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 38px !important;
    vertical-align: middle;
}
*/
/* This is your new BOLD & FILLED "add new" icon */
/*.icon-add {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='white' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm.5-10.5h-1v3h-3v1h3v3h1v-3h3v-1h-3v-3z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 38px !important;
    vertical-align: middle;
}*/

/* This class uses the exact SVG you provided for the "add new" icon */
.icon-add {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white' viewBox='0 0 114.314 122.881'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M69.879,71.653h35.781c4.762,0,8.654,3.897,8.654,8.653v33.92 c0,4.761-3.898,8.654-8.654,8.654H69.879c-4.76,0-8.652-3.894-8.652-8.654v-33.92C61.227,75.551,65.119,71.653,69.879,71.653 L69.879,71.653L69.879,71.653z M26.264,78.121c-1.728,0-3.167-1.564-3.167-3.455c0-1.934,1.397-3.456,3.167-3.456h16.635 c1.728,0,3.168,1.564,3.168,3.456c0,1.933-1.399,3.455-3.168,3.455H26.264L26.264,78.121L26.264,78.121z M101.449,59.661h-6.951 V8.105c0-0.329-0.125-0.617-0.33-0.823c-0.205-0.205-0.494-0.329-0.822-0.329H8.064c-0.329,0-0.618,0.124-0.822,0.329 C7.034,7.488,6.911,7.775,6.911,8.105v96.35c0,0.329,0.124,0.616,0.329,0.822c0.206,0.205,0.494,0.329,0.822,0.329h37.108v6.951 c-44.6,0-7.982,0-37.067,0c-2.222,0-4.278-0.906-5.717-2.386C0.905,108.69,0,106.675,0,104.453V8.105 c0-2.222,0.905-4.278,2.387-5.719C3.867,0.905,5.883,0,8.104,0h85.283c2.221,0,4.279,0.905,5.719,2.386 c1.48,1.481,2.385,3.497,2.385,5.719C101.49,47.892,101.449-1.153,101.449,59.661L101.449,59.661z M26.223,33.117 c-1.728,0-3.167-1.564-3.167-3.457c0-1.933,1.399-3.456,3.167-3.456h48.922c1.729,0,3.166,1.564,3.166,3.455 c0,1.934-1.396,3.457-3.166,3.457L26.223,33.117L26.223,33.117L26.223,33.117z M26.223,55.619c-1.728,0-3.167-1.564-3.167-3.455 c0-1.934,1.399-3.456,3.167-3.456l48.922,0c1.729,0,3.166,1.563,3.166,3.456c0,1.933-1.396,3.455-3.166,3.455L26.223,55.619 L26.223,55.619L26.223,55.619z M77.186,100.626c-1.854,0-3.357-1.503-3.357-3.356s1.504-3.356,3.357-3.356h7.225v-7.231 c0-1.854,1.504-3.356,3.357-3.356c1.852,0,3.355,1.503,3.355,3.356v7.231h7.232c1.852,0,3.355,1.503,3.355,3.356 s-1.504,3.356-3.355,3.356h-7.227v7.231c0,1.854-1.504,3.356-3.355,3.356c-1.854,0-3.357-1.503-3.357-3.356v-7.231H77.186 L77.186,100.626L77.186,100.626z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    /* You may need to adjust the position since this icon's viewBox is not square */
    background-position: 12px center !important;
    background-size: 12px 12px; /* Explicitly set size for consistency */
    padding-left: 30px !important;
    vertical-align: middle;
    text-transform: uppercase;
}



/*.icon-save {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2.5 2.5h8l3 3v8.5a1 1 0 0 1-1 1h-10a1 1 0 0 1-1-1v-10.5a1 1 0 0 1 1-1z'/%3e%3cpath d='M5.5 13.5v-4h5v4'/%3e%3cpath d='M8.5 2.5v3'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 38px !important;
    vertical-align: middle;
}*/

/* This is a balanced and modern STROKED save icon */
.icon-save {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2.5 2.5h8l3 3v8.5a1 1 0 0 1-1 1h-10a1 1 0 0 1-1-1v-10.5a1 1 0 0 1 1-1z'/%3e%3cpath d='M5.5 2.5v3h5v-3'/%3e%3cpath d='M5.5 13.5v-4h5v4'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

input[type=submit][disabled=disabled] + .icon-save,
input[type=submit][disabled=disabled] ~ .icon-save {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2.5 2.5h8l3 3v8.5a1 1 0 0 1-1 1h-10a1 1 0 0 1-1-1v-10.5a1 1 0 0 1 1-1z'/%3e%3cpath d='M5.5 2.5v3h5v-3'/%3e%3cpath d='M5.5 13.5v-4h5v4'/%3e%3c/svg%3e") !important;
}

.fntsize {

}

.icon-close {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white' viewBox='0 0 24 24'%3e%3cpath d='M18.3 5.71a1 1 0 0 0-1.41 0L12 10.59 7.11 5.7A1 1 0 0 0 5.7 7.11L10.59 12l-4.9 4.89a1 1 0 1 0 1.41 1.41L12 13.41l4.89 4.9a1 1 0 0 0 1.41-1.41L13.41 12l4.9-4.89a1 1 0 0 0-.01-1.4z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* match your clear icon size */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

/* This class uses the "edit" icon you provided */
.icon-clear {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='white'  viewBox='0 0 256 256'%3e%3cpath d='M63.5,103.8L10,152.2l3.9,6.6L41,136.4l-23.5,24.3l4.3,5l32.7-35.4l-31.5,37.3l24.7-17.5L27.4,170l3.1,3.1l11.7-9.9l-8.6,13.1l3.1,3.7l30.9-41.7l-28.4,44.2l2.5,3.7l18.5-20.5l-15.4,22.4L72.5,157l-24.7,34.2l2.5,1.9l21.6-26.1L54,195.5l1.8,2.7L91.7,157l-33.4,43.5l3.1,3.1l9.9-11.2l-6.8,14.9l22.9-26.1l-19.8,28l2.5,3.7l22.9-20.5l-19.8,23l1.9,3.1l36.5-32.4c2.6-2.6,4.4-4.2,4.9-4.3l-4.9,4.3c-10.5,10.4-34.1,36.1-34.1,36.1l3.7,3.7l31.5-28.6l-27.1,31.7l3.1,2.5l38.3-41.1l-34.6,44.2l3.1,4.4l53.9-52.6L63.5,103.8z M175.1,211.2c-14.2-10.5-22.3,22.7-35.1,23.4C174.1,249.5,190.2,222.4,175.1,211.2z M243.9,19c0,0-41.2-7.6-50.8,6.5l-41.7,59.2c0,0-11.4,26-37.6,4.6C95,62.8,83.6,78.4,83.6,78.4S69.7,95.9,69.3,96.3l86.4,86.5c0.3-0.3,15.4-15.1,15.4-15.1c16.4-15-2.6-24.9-2.6-24.9c-19.4-20.1,7.7-39,7.7-39l61.1-38.1C251.6,50,243.9,19,243.9,19z M219.9,48.1c-4.8,0-8.7-3.9-8.7-8.7c0-4.8,3.9-8.7,8.7-8.7s8.7,3.9,8.7,8.7S224.7,48.1,219.9,48.1z M224.4,202.9c-10.9-6.8-15.7,17.7-25.1,19C225,230.7,236,210.2,224.4,202.9z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-SaveLoad {
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12' height='12'  viewBox='0 0 394.497 394.497' xml:space='preserve'%3E%3Cg fill='%23fff'%3E%3Cpath d='M181.239,84.373c-30.412,30.413-30.412,79.896,0,110.309c15.206,15.206,35.18,22.809,55.154,22.809 s39.948-7.603,55.154-22.809c30.412-30.413,30.412-79.896,0-110.309C261.136,53.961,211.651,53.961,181.239,84.373z M295,174.026 v-68.998C307.48,126.239,307.48,152.817,295,174.026z M285,91.994v95.067c-0.177,0.181-0.343,0.37-0.522,0.55 c-26.514,26.512-69.652,26.514-96.168,0c-3.953-3.953-7.302-8.281-10.076-12.862H184c2.762,0,5-2.239,5-5s-2.238-5-5-5h-10.747 c-3.926-9.869-5.447-20.475-4.576-30.92H208c2.762,0,5-2.239,5-5s-2.238-5-5-5h-37.742c2.653-11.26,8.213-21.961,16.66-30.92H251 c2.762,0,5-2.239,5-5s-2.238-5-5-5h-52.269c11.361-7.562,24.51-11.349,37.662-11.349c17.413,0,34.827,6.628,48.084,19.885 C284.657,91.624,284.823,91.813,285,91.994z'/%3E%3Cpath d='M389.225,266.902l-72.44-72.44c11.022-16.057,16.958-35.038,16.958-54.935c0-26.002-10.127-50.449-28.514-68.835 c-7.583-7.583-16.125-13.624-25.229-18.177V7.749c0-2.761-2.238-5-5-5H55.69c-1.326,0-2.598,0.527-3.535,1.464l-50.69,50.68 C0.527,55.831,0,57.103,0,58.429v328.32c0,2.761,2.238,5,5,5h270c2.762,0,5-2.239,5-5V226.54c3.882-1.941,7.658-4.157,11.303-6.649 l72.467,72.467c3.509,3.509,8.117,5.264,12.728,5.264c4.608,0,9.219-1.755,12.728-5.264c3.4-3.399,5.272-7.92,5.272-12.728 C394.497,274.822,392.625,270.302,389.225,266.902z M323.742,139.527c0,23.332-9.086,45.267-25.584,61.764 c-34.059,34.058-89.471,34.057-123.529,0c-16.498-16.498-25.584-38.433-25.584-61.764s9.086-45.267,25.584-61.764 c17.029-17.028,39.396-25.542,61.765-25.542s44.735,8.514,61.765,25.542C314.656,94.261,323.742,116.196,323.742,139.527z M50.69,19.817v33.611H17.073L50.69,19.817z M270,381.749H10V63.429h45.69c2.762,0,5-2.239,5-5v-45.68H270v35.448 c-34.511-12.638-74.79-5.156-102.441,22.496c-6.161,6.161-11.389,13.005-15.625,20.357h-46.932c-2.762,0-5,2.239-5,5s2.238,5,5,5 h41.922c-2.822,6.557-4.91,13.424-6.224,20.5H48.5c-2.762,0-5,2.239-5,5s2.238,5,5,5h90.871c-0.213,2.64-0.326,5.301-0.326,7.979 c0,4.222,0.271,8.401,0.797,12.521H93c-2.762,0-5,2.239-5,5s2.238,5,5,5h48.656c1.676,7.109,4.145,13.978,7.364,20.5H48.5 c-2.762,0-5,2.239-5,5s2.238,5,5,5h106.222c3.678,5.64,7.964,10.941,12.836,15.814c1.642,1.642,3.343,3.186,5.07,4.686H155.5 c-2.762,0-5,2.239-5,5s2.238,5,5,5h30.89c15.335,9.179,32.667,13.781,50.004,13.781c11.394,0,22.781-2.006,33.606-5.971V381.749z M305.229,208.363c1.899-1.899,3.705-3.866,5.426-5.89l51.275,51.275l-11.314,11.314l-51.295-51.295 C301.341,212.053,303.322,210.269,305.229,208.363z M382.154,285.287c-3.119,3.119-8.195,3.119-11.314,0l-13.154-13.154 L369,260.819l13.154,13.154c1.511,1.511,2.343,3.52,2.343,5.657S383.665,283.776,382.154,285.287z'/%3E%3Cpath d='M48.5,101.049h40.001c2.762,0,5-2.239,5-5s-2.238-5-5-5H48.5c-2.762,0-5,2.239-5,5S45.738,101.049,48.5,101.049z'/%3E%3Cpath d='M48.5,162.049h27.501c2.762,0,5-2.239,5-5s-2.238-5-5-5H48.5c-2.762,0-5,2.239-5,5S45.738,162.049,48.5,162.049z'/%3E%3Cpath d='M48.5,223.049h92.301c2.762,0,5-2.239,5-5s-2.238-5-5-5H48.5c-2.762,0-5,2.239-5,5S45.738,223.049,48.5,223.049z'/%3E%3Cpath d='M231.5,243.549H86.501c-2.762,0-5,2.239-5,5s2.238,5,5,5H231.5c2.762,0,5-2.239,5-5S234.262,243.549,231.5,243.549z'/%3E%3Cpath d='M48.5,253.549h22.001c2.762,0,5-2.239,5-5s-2.238-5-5-5H48.5c-2.762,0-5,2.239-5,5S45.738,253.549,48.5,253.549z'/%3E%3Cpath d='M231.5,304.549h-94.499c-2.762,0-5,2.239-5,5s2.238,5,5,5H231.5c2.762,0,5-2.239,5-5S234.262,304.549,231.5,304.549z'/%3E%3Cpath d='M48.5,314.549h72.801c2.762,0,5-2.239,5-5s-2.238-5-5-5H48.5c-2.762,0-5,2.239-5,5S45.738,314.549,48.5,314.549z'/%3E%3Cpath d='M231.5,335.049H178c-2.762,0-5,2.239-5,5s2.238,5,5,5h53.5c2.762,0,5-2.239,5-5S234.262,335.049,231.5,335.049z'/%3E%3Cpath d='M163.101,335.049h-89.5c-2.762,0-5,2.239-5,5s2.238,5,5,5h89.5c2.762,0,5-2.239,5-5S165.862,335.049,163.101,335.049z'/%3E%3Cpath d='M58.501,335.049H48.5c-2.762,0-5,2.239-5,5s2.238,5,5,5h10.001c2.762,0,5-2.239,5-5S61.263,335.049,58.501,335.049z'/%3E%3Cpath d='M231.5,274.049h-30.499c-2.762,0-5,2.239-5,5s2.238,5,5,5H231.5c2.762,0,5-2.239,5-5S234.262,274.049,231.5,274.049z'/%3E%3Cpath d='M48.5,284.049h135c2.762,0,5-2.239,5-5s-2.238-5-5-5h-135c-2.762,0-5,2.239-5,5S45.738,284.049,48.5,284.049z'/%3E%3Cpath d='M251,123.829h-17.5c-2.762,0-5,2.239-5,5s2.238,5,5,5H251c2.762,0,5-2.239,5-5S253.762,123.829,251,123.829z'/%3E%3Cpath d='M251,164.749h-46c-2.762,0-5,2.239-5,5s2.238,5,5,5h46c2.762,0,5-2.239,5-5S253.762,164.749,251,164.749z'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-Newbtn {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2.5 2.5h8l3 3v8.5a1 1 0 0 1-1 1h-10a1 1 0 0 1-1-1v-10.5a1 1 0 0 1 1-1z'/%3e%3cpath d='M5.5 2.5v3h5v-3'/%3e%3cpath d='M8 9.5v4'/%3e%3cpath d='M6 11.5h4'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-ExportExcel {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3e%3cdefs%3e%3cpattern id='checkerPattern' width='8' height='8' patternUnits='userSpaceOnUse'%3e%3crect width='4' height='4' fill='white'/%3e%3crect x='4' y='4' width='4' height='4' fill='white'/%3e%3c/pattern%3e%3cmask id='x-hole'%3e%3crect x='4' y='8' width='16' height='14' fill='white'/%3e%3cpath d='M9 12 l6 6 M15 12 l-6 6' stroke='black' stroke-width='3.5' /%3e%3c/mask%3e%3c/defs%3e%3cpath d='M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z M14 2v6h6'/%3e%3crect x='4' y='8' width='16' height='14' fill='url(%23checkerPattern)' mask='url(%23x-hole)'/%3e%3cpath d='M9 12 l6 6 M15 12 l-6 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-CompletedWithoutQA {
    /* Icon: Complete (without QA) - Minimalist */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3e%3ccircle cx='8' cy='8' r='8' fill='%23dc3545'/%3e%3cpath d='M10.5 5.5l-5 5m0-5l5 5' stroke='white' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-CompletedwithQA {
    /* Icon: QA Completed - Minimalist */
    background-image: url("data:image/svg+xml,%3Csvg fill='none' width='12' height='12' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='10' r='3' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3Cpolyline points='5.79 13.57 3 17.56 6.03 18.46 7.91 21 10.79 16.89' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3Cpolyline points='18.21 13.57 21 17.56 17.97 18.46 16.09 21 13.21 16.89' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3Ccircle cx='12' cy='10' r='7' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-upload {
    /* Icon: QA Completed - Minimalist */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2.5 11.5v2h11v-2'/%3e%3cpath d='M8 11.5V2.5m-3.5 4 3.5-4 3.5 4'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-draft {
    /* Icon: QA Completed - Minimalist */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3e%3cpath fill='white' d='M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83l3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z'/%3e%3cpath fill='white' d='M5 13l2.5-2.5l2 2L7 15l-2-2m10-8l4 4l-7 7l-4-4l7-7z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 12px !important;
}
.icon-CopyNotes {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 22 16' fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M8.5 13.5H2.5a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1h6'/%3e%3cpath d='M10.5 13.5h-6a1 1 0 0 1-1-1V2.5a1 1 0 0 1 1-1h3l3 3v8a1 1 0 0 1-1 1z'/%3e%3cpath d='M6 7h3m-3 2h3m-3 2h2'/%3e%3cpath d='M14 8h6m-2-2l2 2-2 2'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 16px 16px; /* Ensure consistent sizing */
    padding-left: 30px !important;
    vertical-align: middle;
    text-transform: uppercase;
}

/*.icon-sync {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M2 4.5a1.5 1.5 0 0 1 1.5-1.5h5.5l-2-2 4.5 3.5-4.5 3.5 2-2H3.5A1.5 1.5 0 0 1 2 4.5z'/%3e%3cpath d='M14 11.5a1.5 1.5 0 0 1-1.5 1.5h-5.5l2 2-4.5-3.5 4.5-3.5-2 2h5.5a1.5 1.5 0 0 1 1.5 1.5z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 38px !important;
    vertical-align: middle;
    text-transform: uppercase;
}*/

.icon-sync {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M2 7L2 1Q2 0 3 0L9 0L15 4L9 8L3 8Q2 8 2 7Z'/%3e%3cpath d='M14 9L14 15Q14 16 13 16L7 16L1 12L7 8L13 8Q14 8 14 9Z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

/*.icon-download {*/
/* The core of the icon is this inline SVG, URL-encoded for CSS. */
/* It features a tray and a downward-pointing arrow. */
/*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd' d='M13.5 2H2.5C1.4 2 1 2.4 1 3.5v6C1 11.5 3 13 5.5 13h5c2.5 0 4.5-1.5 4.5-3.5v-6C15 2.4 14.6 2 13.5 2zm0 7.5c0 1-1.5 2-3 2h-5c-1.5 0-3-1-3-2v-5h11v5z'/%3e%3cpath d='M7 3h2v4h1.5L8 9.5 5.5 7H7V3z'/%3e%3c/svg%3e") !important;*/
/* These properties are similar to your example to ensure consistent styling. */
/*background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 38px !important;
    vertical-align: middle;
    text-transform: uppercase;
}*/

.icon-download {
    /* The SVG here is modified to create a download icon with a downward-pointing arrow. */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3e%3cpolyline points='7 10 12 15 17 10'/%3e%3cline x1='12' y1='15' x2='12' y2='3'/%3e%3c/svg%3e") !important;
    /* These properties are kept consistent for uniform styling. */
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}


.icon-warning {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3e%3cline x1='12' y1='9' x2='12' y2='13'/%3e%3cline x1='12' y1='17' x2='12.01' y2='17'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-Delete {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M3 6h18M5 6v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M10 11v6M14 11v6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-UnReadException {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3e%3cline x1='12' y1='9' x2='12' y2='13'/%3e%3cline x1='12' y1='17' x2='12.01' y2='17'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    color: white !important
}

.icon-custom-a-shape {
    /* SVG with a custom path to create the specific 'a' shape */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.5 21H11.2C6.7 21 3 17.3 3 12.8C3 8.3 6.7 4.6 11.2 4.6S19.4 8.3 19.4 12.8V21zM11.2 6.5C7.8 6.5 5.1 9.2 5.1 12.8C5.1 16.3 7.8 19 11.2 19H17.5V12.8C17.5 9.2 14.7 6.5 11.2 6.5z' fill='white'/%3e%3c/svg%3e") !important;
    /* Control the size of the icon */
    background-size: 13px 13px;
    /* Styles copied from your example for consistent layout */
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    color: white !important;
}





.btnpadd {
    padding: 4px 12px !important;
}


.alignright {
    text-align: right !important;
}

.alignleft {
    text-align: left !important;
}

.email-icon {
  
    width: 12px;
    height: 12px;
    /* URL-encoded version of the path-based SVG */
    background-image: url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"%3e%3ccircle cx="12" cy="12" r="4"%3e%3c/circle%3e%3cpath d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"%3e%3c/path%3e%3c/svg%3e');
    background-repeat: no-repeat;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.nowraplbl{
    white-space:nowrap;
   
}

.icon {
    /* Sizing and positioning */

    width: 14px; /* Adjust size as needed */
    height: 14px; /* Adjust size as needed */
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-tick {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='20 6 9 17 4 12'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-no {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cline x1='18' y1='6' x2='6' y2='18'/%3e%3cline x1='6' y1='6' x2='18' y2='18'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-arrow-right {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='9 18 15 12 9 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 12px) center !important; /* Positions icon to the right */
    padding-right: 30px !important; /* Adds padding to the right for the icon */
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-arrow-left {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='15 18 9 12 15 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-cart {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3ccircle cx='9' cy='21' r='1'/%3e%3ccircle cx='20' cy='21' r='1'/%3e%3cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-Upgrade {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M12 16V3 M5 10l7-7 7 7 M4 18h16 M4 23h16'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.reload-icon {
    background-image: url("data:image/svg+xml,%3Csvg fill='%23ffffff' xmlns='http://www.w3.org/2000/svg' width='13' height='13' stroke='white' viewBox='0 0 29.211 29.727'%3E%3Cpath d='M17.368 10.298c.136.242.456.435.732.436l10.348.058c.268.002.512-.138.652-.366.141-.228.145-.517.023-.755l-4.719-9.23c-.126-.248-.409-.429-.685-.438-.278-.012-.606.085-.752.321l-1.447 2.347c-2.09-1.181-4.488-1.874-7.056-1.874C6.489.795 0 7.285 0 15.261c0 7.977 6.489 14.466 14.466 14.466 7.976 0 14.465-6.489 14.465-14.466 0-.873-.09-1.725-.239-2.556-.08.007-.156.029-.237.029h-.021l-4.858-.014c.226.81.355 1.659.355 2.54 0 5.219-4.246 9.466-9.465 9.466C9.246 24.727 5 20.479 5 15.261c0-5.22 4.246-9.466 9.466-9.466 1.605 0 3.11.415 4.435 1.125l-1.58 2.563c-.146.236-.087.572.047.815z'/%3E%3C/svg%3E")!important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}

.icon-Update {
    background-image: url("data:image/svg+xml,%3Csvg fill='none' width='13' height='13' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 12A8 8 0 0 1 18.93 8' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M20 12A8 8 0 0 1 5.07 16' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpolyline points='14 8 19 8 19 3' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3Cpolyline points='10 16 5 16 5 21' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-Key {
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' fill='none' width='13' height='13' viewBox='0 0 32 32'%3E%3Cpath fill='none' stroke='%23ffffff' stroke-width='2' stroke-miterlimit='10' d='M20 4c-4.4 0-8 3.6-8 8 0 .6.1 1.2.2 1.8L4 22v6h5v-3h3v-3h3v-3h1.1c1.1.6 2.5 1 3.9 1 4.4 0 8-3.6 8-8S24.4 4 20 4z'/%3E%3Ccircle cx='22' cy='10' r='2'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-Select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' width='13' height='13' viewBox='0 0 1024 1024'%3E%3Cpath fill='white' d='M77.248 415.04a64 64 0 0190.496 0l226.304 226.304L846.528 188.8a64 64 0 1190.56 90.496l-543.04 543.04-316.8-316.8a64 64 0 010-90.496z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    text-transform: uppercase;
    font-size: 13px !important;
}
.icon-AbacusSideBar {
    background-image: url("data:image/svg+xml,%3csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='none' stroke='%232EA2CC' stroke-width='11' stroke-linecap='round'%3e%3cline x1='80' y1='65' x2='80' y2='100' /%3e%3cg transform='rotate(25 50 65)'%3e%3cpath d='M 72, 81.58 A 30,30 0 1,1 75, 48.42' /%3e%3c/g%3e%3c/g%3e%3c/svg%3e") !important;
    background-size: 40px;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    padding-left: 30px !important;
    width: 60px;
    height: 40px;
    display: inline-flex !important;
    align-items: center !important;
    vertical-align: middle !important;
    text-transform: uppercase !important;
    font-size: 13px !important;
    color: white !important;
}


body, td, th, p, span, label, .dropdown ,.GridContent {
    text-transform: uppercase !important;
}
.btn btn-secondary,.dropdown-toggle {
    text-transform: uppercase !important;
}