[data-app-theme="light"] {
    /* 100 */
    --hover-color: #E8F4FC;
    /* 200 */
    --second-color:#c7dcf0;
    /* 300 */
    --third-color: #2568a8;
    --fifth-color: #2568a8;
    /* 400 */
    --thired-color: #274159;
    /* 500 */
    --sixth-color: #486581;
    /* 600 */
    /* --gray-shadow: #206A83; */
    /* 700 */
    --fourth-color: #627D98;
    /* 800 */
    --first-color: #243B53;
    /* 900 */
    --dark-color: #243B53;
    /* 1000 */
    /* --label-text-color: #083850; */


    --primary-color:#243B53; /* 800 */
    --text-color:#243B53; /* 900 */
    --bg-color: #FFFFFF;
    --bg-inverse-color: #000; 
    --bg-header-color: #c7dcf0; 
    --logo-bg1:#243B53;
    --logo-bg2:#243B53;
    --bg-orders-involved:#F9FAFB;
}


[data-app-theme="dark"] {
    /* 100 */
    /* --hover-color:#E8F4FC;    */
    /* 200 */
    --dark-color: #c7dcf0;
    /* 300 */
    --fourth-color: #2568a8;
    /* 400 */
    --second-color: #274159;
    /* 500 */
    --sixth-color: #486581;
    /* 600 */
    --thired-color: #206A83;
    /* 700 */
    --third-color: #627D98;
    --fifth-color: #627D98;
    /* 800 */
    --first-color: #243B53;
    /* 900 */
    --hover-color: #243B53;
    /* 1000 */
    /* --label-text-color: #083850; */
    
    --primary-color:#c7dcf0; /* 200 */
    --text-color:#E8F4FC; /* 100 */
    --bg-color: #101214; 
    --bg-inverse-color: #fff; 
    --bg-header-color: #BCD6F00A; 
    --logo-bg1:#243B53;  /* 900 */
    --logo-bg2:#083850;  /* 10000 */
    --bg-orders-involved:#1A1D21;
}


/* Web Style Code */

.form-group-itz-checkbox input[type="radio"],
.form-group-itz-checkbox input[type="checkbox"],
.form-group-itz-checkbox-after input[type="radio"],
.form-group-itz-checkbox-after input[type="checkbox"]
{
    display: none;
}
.form-group-itz-checkbox-after input[type="radio"]~label::after,
.form-group-itz-checkbox-after input[type="checkbox"]~label::after
{
    content: "";
    margin-right: -3rem !important;
    margin-left: 1rem !important;
    margin-top: .25rem; 
    position: absolute;
    border: 1.5px solid var(--primary-color);
    padding: 0 !important;
    width: .9rem;
    height: .9rem;
    border-radius: .2rem !important;
}
.form-group-itz-checkbox input[type="radio"]~label,
.form-group-itz-checkbox input[type="checkbox"]~label {
    position: relative;
    padding-left: 3rem;
    color: var(--bg-inverse-color);

}
.form-group-itz-checkbox-after input[type="radio"]~label,
.form-group-itz-checkbox-after input[type="checkbox"]~label {
    position: relative;
    padding-right: -3rem;
}

.form-group-itz input:focus,
.form-group-itz textarea:focus {
    outline: none;
}

.form-group-itz input::placeholder,
.form-group-itz textarea::placeholder {
    color: transparent;
}

.form-group-itz input+label,
.form-group-itz textarea+label,
.form-group-itz select+label {
    position: absolute;
    top: 0.5rem;
    left: 1rem;
    padding: 0px .5rem;
    font-size: 0.875rem;
    transition: all 0.2s ease-out;
    pointer-events: none;
    color: var(--label-text-color);
    background-color: var(--bg-color);
}

.form-group-itz input:focus+label,
.form-group-itz input:not(:placeholder-shown)+label,
.form-group-itz textarea:focus+label,
.form-group-itz textarea:not(:placeholder-shown)+label,
.form-group-itz select:focus+label,
.form-group-itz textarea:not(:placeholder-shown)+label,
.form-group-itz select+label {
    top: -.6rem;
}


/* For Checkbox */

.form-group-itz-checkbox input[type="radio"]~label::before,
.form-group-itz-checkbox input[type="checkbox"]~label::before
/* .form-group-itz-checkbox-after input[type="radio"]~label::after,
.form-group-itz-checkbox-after input[type="checkbox"]~label::after  */
{
    content: "";
    /* font-size: 1.5rem; */
    position: absolute;
    border: 1.5px solid var(--primary-color);
    padding: 0 !important;
    width: .9rem;
    height: .9rem;
    margin-left: -2rem;
    margin-top: .3rem; 
    border-radius: .2rem !important;
    margin-right: 0.7rem !important;
}

.form-group-itz-checkbox input[type="radio"]:checked~label::before,
.form-group-itz-checkbox input[type="checkbox"]:checked~label::before,
.form-group-itz-checkbox-after input[type="radio"]:checked~label::after,
.form-group-itz-checkbox-after input[type="checkbox"]:checked~label::after{
    content: "";
    /* font-size: 1.5rem; */
    width: .9rem;
    height: .9rem;
    position: absolute;
    background-color: var(--first-color) !important;
    border: 1.5px solid var(--first-color) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.form-group-itz-checkbox input[type="checkbox"]~.header_selectall_cbox::before {
    background-color: transparent;
    border: 1.5px solid var(--bg-color) !important;
    background-image: none !important;
}
.form-group-itz-checkbox input[type="checkbox"]:checked~.header_selectall_cbox::before {
    background-color: var(--bg-color) !important;
    border: 1.5px solid var(--bg-color) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E") !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

/* For Dark */
/* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E") !important; */
/* For Light */
/* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E"); */


.form-group-itz-checkbox input:checked+label::before {
    /* background-image: url('../../icons_dark/default/chk-box-on.png'); */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E");

}
.form-group-itz-checkbox input:checked+.header_selectall_cbox::before {
    background-image: url('../../icons_light/default/chk-box-off.png');
}

.form-group-itz-checkbox-after input:checked+label::after {
    /* background-image: url('../../icons_dark/default/chk-box-on.png'); */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E");
}

/* Custom Check box */

.cbox[type="checkbox"] {
    display: none;
}

/* Style for the unchecked state */
.cbox+label::before {
    content: "";
    /* font-size: 1.5rem; */
    position: absolute;
    border: 1.5px solid var(--primary-color);
    padding: 0 !important;
    width: .9rem;
    height: .9rem;
    margin-left: -2rem;
    margin-top: .1rem; 
    border-radius: .2rem !important;
    margin-right: 0.7rem !important;
}
.cbox.adjusted+label::before {
    display: block;
    position: relative;
    margin-left: 1rem;
    z-index: 500;
}
/* Style for the checked state */
.cbox:checked+label::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round' d='M4 10l4 4L16 6'/%3E%3C/svg%3E");
}
.table-title-checkbox
{
    color: var(--bg-color) !important;
}
/* Custom Check box */