@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

@font-face {
    font-family: 'FontAwesome';
    src: url('../../fonts/fontawesome-webfont.eot?v=4.4.0');
    src: url('../../fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../../fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../../fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.btn {
    border: double 1px #006699;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #006699; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.ebtn {
    border: double 1px #642EFE;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    background-color: #642EFE; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.nebtn {
    border: double 1px #07b410;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #07b410; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.lgbtn {
    border: double 1px #07b410;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 11px;
    background-color: #07b410; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.cancelbtn {
    border: double 1px #ed9b07;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #ed9b07; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.canbtn {
    border: double 1px #ed9b07;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 11px;
    background-color: #ed9b07; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.pbtn {
    border: double 1px #709;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 11px;
    color: #ffffff;
    background-color: #709; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.lbtn {
    /*border:double 1px #006699;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    background-color: #709;
    background-position: 50% bottom;
    padding: 1px;
    cursor: pointer;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.editbtn {
    border: double 1px #642EFE;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #642EFE; /* #ff6600;*/ /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.delbtn {
    border: double 1px red;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 11px;
    background-color: red; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.updbtn {
    border: double 1px #6c0767;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    background-color: #6c0767; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 3px 2px 3px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.updatebtn {
    border: double 1px #6c0767;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #6c0767; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}


.srchbtn {
    border: double 1px #0099ff;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: #0099ff; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.deletebtn {
    border: double 1px red;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    font-size: 14px;
    background-color: red; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 10px 15px 10px 15px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.ceditbtn {
    border: double 1px #642EFE;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    background-color: #642EFE; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 5px 2px 5px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.modbtn {
    border: double 1px #642EFE;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: 500;
    color: #ffffff;
    background-color: #642EFE; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom;
    padding: 2px 5px 2px 5px;
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    /*height: 33px;*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.cbtn {
    border: solid 1px #0026ff; /*border-style:none;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    padding: 2px 3px 2px 3px;
    font-size: 11px;
    font-weight: 500;
    color: #ffffff;
    background-color: #0026ff; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom; /*padding:1px 10px 1px 10px;*/
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.bbtn {
    border: solid 1px #0026ff; /*border-style:none;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    padding: 2px 3px 2px 3px;
    font-size: 11px;
    font-weight: 500;
    color: #ffffff;
    background-color: #0026ff; /*background-image: url(images/bt_register.png);*/
    background-position: 50% bottom; /*padding:1px 10px 1px 10px;*/
    cursor: pointer; /*border-style:none;*/ /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    text-decoration: none;
}

.buttonload {
    background-color: #4CAF50; /* Green background */
    border: none; /* Remove borders */
    color: white; /* White text */
    /*padding: 8px 12px;*/ /* Some padding */
    /*font-size: 16px;*/ /* Set a font size */
    padding: 3px 5px 3px 5px;
    margin-left: 0px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
    text-decoration: none;
    font-weight: bold;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
}

#panel .content input.bt_register {
    display: block;
    float: left;
    clear: left;
    height: 24px;
    text-align: center;
    cursor: pointer;
    border: none;
    font-weight: bold;
    margin: 10px 0;
}

#panel .content input.bt_login {
    width: 74px;
    background: transparent url(../images/bt_login.png) no-repeat 0 0;
}

#panel .content input.bt_register {
    width: 94px;
    color: white;
    background: transparent url(../images/bt_register.png) no-repeat 0 0;
}

.field {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 12px;
    padding: 3px; /*--Bottom Right rounded corner--*/
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.tabtxtfield {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 16px;
    font-weight: bold;
    padding: 3px;
    height: 35px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.drpfield {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 12px;
    padding: 2px;
    width: 156px;
    height: 27px; /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.drpsmallfield {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 12px;
    padding: 2px;
    /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    height: 27px;
}

.drpCurrfield {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 12px;
    padding: 3px;
    width: auto;
    height: 25px; /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.heading_text {
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #0e3537;
    text-align: right;
}

.lheading_text {
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #0e3537;
    text-align: left;
}

.lheading_text_cust {
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #0099ff;
    text-align: left;
}

.lblust {
    font-weight: normal;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #006699;
    text-align: left;
}

.lcust_text {
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #0000ff;
    text-align: left;
}

#nav ul li a {
    color: #FFFFFF;
    display: block;
    float: left;
    font-family: 'Archivo Narrow',sans-serif;
    font-size: 14px;
    font-weight: 500;
    padding: 0 45px;
    text-decoration: none;
    /*text-transform: uppercase;*/
}

.td_heading_text {
    /*background:#328aa4;*/ /*background: url(images/td_heading.png) repeat-x;*/
    background: #CC6600;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #ffffff;
    text-align: center;
    height: 25px; /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
}

.td_modal_heading {
    /*background: url(images/menu_hover.gif) repeat-x;*/
    background: #006699;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 9pt;
    color: #006699;
    text-align: left;
    height: 35px;
    padding-left: 7px; /*--Bottom Right rounded corner--*/
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.td_headingl_text {
    background: #cccc66;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #0099ff;
    text-align: left;
    height: 25px;
}

.td_rheading_text {
    background: url(images/menu_hover.gif) repeat-x;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #fff;
    text-align: right;
    height: 25px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.td_semiheading_text {
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 9pt;
    color: #0099ff;
    text-align: left;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    /*text-transform: uppercase;*/
}

.td_subheading_text {
    /*background: url(images/menu_hover.gif) repeat-x;*/
    background: #006699;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 9pt;
    color: #fff;
    text-align: left;
    height: 25px;
    padding-left: 7px; /*--Bottom Right rounded corner--*/
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
}

.chkfield {
    font-size: 12px;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
}

.chkfield_ct {
    font-size: 12px;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    padding: 10px;
    line-height: 30px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

.chkfield_cst {
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    color: #006699;
    line-height: 30px;
    /*padding: 10px 20px 10px 10px;*/
    padding: 5px;
}

.chkfield_disabled {
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    color: #fa7d05;
    line-height: 30px;
    /*padding: 10px 20px 10px 10px;*/
    padding: 5px;
}

.tbl_style {
    border: solid 1px #c3cecc; /*--Bottom Right rounded corner--*/ /* -moz-border-radius-bottomright: 5px;     -khtml-border-radius-bottomright: 5px;     -webkit-border-bottom-right-radius: 5px;      -moz-border-radius-bottomleft: 5px;     -khtml-border-radius-bottomleft: 5px;     -webkit-border-bottom-left-radius: 5px;     -moz-border-radius-topright: 5px;     -khtml-border-radius-topright: 5px;     -webkit-border-top-right-radius: 5px;      -moz-border-radius-topleft: 5px;     -khtml-border-radius-topleft: 5px;     -webkit-border-top-left-radius: 5px;*/
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

.subtbl_style {
    border: solid 1px #0099ff;
}

.tbl_style_print {
    /*border-spacing:0px;*/
    border: solid 1px #000;
    padding: 5px 5px 5px 5px;
}

.valdtn_style {
    border: solid 1px #dc143c;
    background-color: #EEE8AA;
    color: Red;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    padding: 2px 2px 2px 2px;
}

.msgshow {
    border: solid 1px #dc143c;
    background-color: #eee8aa;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: Green;
}

.alertmsg {
    background-color: #CC0000;
    color: white;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.alertmsggst {
    background-color: #CC0000;
    color: white;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.successmsg {
    background-color: #07b410;
    color: white;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.grdheader {
    /*background:url(images/gv_header.gif) repeat-x;*/
    background-color: #8369ce;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    height: 25px;
    font-weight: normal; /*padding:7px;*/
}

.test_sign {
    /*background:url(images/gv_header.gif) repeat-x;*/
    background-color: #A55D10;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    height: 25px;
    font-weight: normal; /*padding:7px;*/
}

    .test_sign a {
        text-decoration: none;
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        font-size: 12px;
        height: 25px;
        font-weight: 700; /*padding:7px;*/
        color: #b5bddf;
    }

.test a {
    text-decoration: none;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    height: 25px;
    font-weight: 700; /*padding:7px;*/
    color: #b5bddf;
}

.testc {
    /*background: #328aa4 url(images/tr_back.gif) repeat-x;*/
    background-color: #336666;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    height: 18px;
    font-weight: 700;
    padding: 7px;
}

    .testc a {
        text-decoration: none;
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        font-size: 12px;
        height: 18px;
        font-weight: 700;
        padding: 7px;
        color: #b5bddf;
    }

/* .gvrowcolor
	 {
		background-color:#4aa7c8;
		color:#ffffff;
	 }
	 .gvaltcolor
	 {
		background-color:#d1fafc;
		color:#000000;
	 }*/

.gvrowcolor {
    background-color: #fff;
    color: #000000;
}

    table.gvrowcolor > tbody > tr > td,
    table.gvrowcolor > tbody > tr > th {
        /*padding: 0px 2px 0px 2px;*/
        padding: 0px 5px 0px 5px;
    }

.gvaltcolor {
    /*background-color: #5DE6DE;
    color: #000000;*/
    /*background-color: #ffffff;*/
    /*background-image: linear-gradient(315deg, #f9c5d1 0%, #DEFFE9 74%);*/
    /*background-image: linear-gradient(315deg, #66CCFF 50%, #00FF99 20%);*/
    background: rgb(138,251,206);
    background: linear-gradient(90deg, rgba(138,251,206,1) 0%, rgba(204,255,204,1) 35%, rgba(199,234,251,1) 100%);
}

.gvrow-over {
    background-color: #bce774;
    color: #04010a;
}

.gvrow-out {
    background-color: #ffffff;
}

.gvarow-out {
    background-color: #e5f1f4;
}

.lbltext_style {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: Blue;
}

.page_style {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #0E3537;
    line-height: 25px;
}

.text_style {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #0E3537;
    line-height: 20px;
    text-align: justify;
}

.text_style_custom {
    /*font-family: 'Segoe UI', 'Roboto', sans-serif;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #0E3537;
    line-height: 20px; /*text-align:justify;*/
}

    .text_style_custom td {
        border-color: #c3cecc;
        margin-left: 40px;
    }

.grid_style td {
    vertical-align: middle;
}

.text_style_lnk {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #006699;
}

    .text_style_lnk a {
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        font-size: 12px;
        font-weight: 500;
        color: #006699;
    }

.lbl_style {
    /*border:solid 1px red;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: red;
    padding: 1px 5px 1px 5px;
    font-weight: 500;
}

.field_set_style {
    border: 1px solid #c3cecc;
    padding: 10px; /*--Bottom Right rounded corner--*/
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.legend_style {
    padding: 3px 5px 3px 5px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-weight: 500;
    color: blue;
    border: solid 1px blue;
    /*text-transform: uppercase;*/
}

/*----------------------------------Sign_Up------------------------------------*/

#sign_up {
    width: 650px;
    height: 542px;
    padding: 50px 0 0 65px;
    background: url(images/signup_bg.png) no-repeat;
    text-align: left;
}

    #sign_up h1 {
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        font-size: 30px;
        color: #fff;
        font-weight: bold;
    }

.signup_txt {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: right;
    width: 50px;
}

.signup_form_txt {
    width: 100%;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: left;
}

.verify_txt {
    width: 100%;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: left;
}

.signup_form_area {
    width: 350px;
}

.signup_form_input {
    width: 300px;
    background: #fff;
    height: 25px;
    border: #023c83 1px solid;
    color: #000;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
}

/*----------------------------------Login------------------------------------*/

#login {
    width: 424px;
    height: 355px;
    background: url(images/login_bg.png) no-repeat;
    padding: 50px 0 0 58px;
    text-align: left;
}

    #login h1 {
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        font-size: 30px;
        color: #fff;
        font-weight: bold;
    }

.login_txt {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: right;
    width: 84px;
    font-weight: 500;
}

.form_area {
    width: 235px;
}

.form_input {
    width: 220px;
    background: #002e66;
    height: 25px;
    border: #023c83 1px solid;
    color: #FFF;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
}

.form_txt {
    width: 50%;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #FFF;
    text-align: left;
}

.Ajax_text {
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 8pt;
    font-weight: bold;
}

.mtbl_style {
    border-top: 1px solid #c3cecc;
    border-left: 1px solid #c3cecc;
}

    .mtbl_style td {
        border-right: 1px solid #c3cecc;
    }

.lbl_text {
    font-weight: 100;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    color: #0e3537;
    text-align: right;
}

.topFolderCreatearea {
    background: #eee;
    padding: 4px 5px;
    border: none;
    position: relative;
}

.folderName {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 12px;
    margin-left: 0;
    padding: 9px 5px;
    width: 300px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.createFolderBTN {
    background-color: #006699;
    color: #ffffff;
    cursor: pointer;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: bold;
    height: 33px;
    margin-left: 0;
    padding: 2px 10px 3px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border: none;
}

.browseBTN {
    background: #c3cecc;
    border: solid #c3cecc 1px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    height: 28px;
    margin-left: 0;
    padding: 2px 10px 3px;
}

.browseBTN_new {
    background: #C3CECC;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    height: 28px;
    margin-left: 0;
    padding: 2px 10px 3px;
}

.browseArea {
    position: absolute;
    z-index: 999;
    left: 670px;
    top: 11px;
}

.MultiFile-remove {
    font-family: 'FontAwesome';
    font-size: 14px;
    color: #C21818;
    text-decoration: none;
}

.MultiFile-label {
    padding: 10px;
    background: #eee;
    color: #666;
    margin-top: 1px;
    border-bottom: 1px solid #ccc;
}

.MultiFile-title {
    padding: 5px 0;
    font-size: 12px;
}

.FolderArea {
    width: 100%;
    padding: 20px 1%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: table;
    position: relative;
}

    .FolderArea table {
        width: 100%;
    }

        .FolderArea table td {
            width: 20%;
        }

.folderBook {
    width: 98%;
    margin: 0 1%;
    float: left;
    text-align: center;
}

    .folderBook a {
        text-decoration: none;
        color: #eee;
        font-size: 14px;
        font-weight: bold;
        position: relative;
        padding: 1px;
        display: block;
        height: 100px;
        line-height: 120px;
        font-family: 'Segoe UI', 'Roboto', sans-serif;
        background: #53718C;
        border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
    }

        .folderBook a::after {
            position: absolute;
            font-family: 'FontAwesome';
            color: rgba(0,0,0,0.3);
            font-size: 25px;
            top: -20px;
            left: 43%;
            content: '\f114';
            z-index: 9999;
        }

        .folderBook a:hover {
            background: #666;
            color: #eee;
            transition: linear 0.2s;
            -moz-transition: linear 0.2s;
            -webkit-transition: linear 0.2s;
        }

.tabfield {
    border: 1px solid #c3cecc;
    height: 30px;
    width: 150px;
    color: #333333;
    font-size: 18px;
    padding: 3px; /*--Bottom Right rounded corner--*/
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.tabBTN {
    background-color: #006699;
    color: #ffffff;
    cursor: pointer;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-weight: bold;
    font-size: 20px;
    /*width: 150px;*/
    margin-left: 0;
    padding: 2px 10px 3px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border: none;
    /*text-transform: uppercase;*/
}

.tabdrpfield {
    border: 1px solid #c3cecc;
    color: #333333;
    font-size: 16px;
    font-weight: bold;
    padding: 2px;
    width: 156px;
    height: 35px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.alert_style {
    /*border:solid 1px red;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 11px;
    color: red;
    /*padding: 1px 5px 1px 5px;*/
    font-weight: 500;
    /*text-transform: uppercase;*/
}

.success_style {
    /* border:solid 1px green;*/
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 11px;
    color: green;
    /*padding: 1px 5px 1px 5px;*/
    font-weight: 500;
    /*text-transform: uppercase;*/
}

/***********Priti */

.grdheaderNew {
    /*background:url(images/gv_header.gif) repeat-x;*/
    /*background-color: #7077c7;*/
    /*background-image: linear-gradient(315deg, #1fd1f9 0%, #b621fe 74%);*/
    /*background-color: #006699;*/
    /*font-family: 'Segoe UI', 'Roboto', sans-serif;*/
    background-color: #009999;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 11px;
    height: 30px;
    font-weight: 500;
    /*padding:7px;*/
    /*text-transform: uppercase;*/
}

.td_lheading_text {
    /*background-color: #a4508b;*/
    /*background-image: linear-gradient(326deg, #a4508b 0%, #5f0a87 74%);*/
    /*background-image: linear-gradient(326deg, #f3118a 0%, #5f0a87 74%);*/
    /*background-image: linear-gradient(326deg, #d8368d 0%, #5f0a87 60%);*/
    /*background-image: linear-gradient(326deg, #ea083c 0%, #5f0a87 50%);*/
    /*Independence special*/
    /*background-image: linear-gradient(#FF9933, #FFFFFF, #138808);*/
    /*background-image: linear-gradient(326deg, #b3a123 50%, #2e0854 50%);*/
    /*background: rgb(8,103,242);
    background: linear-gradient(90deg, rgba(8,103,242,1) 21%, rgba(134,8,230,1) 36%, rgba(134,8,230,1) 72%, rgba(227,157,64,1) 100%);*/
    /*background: rgb(63,94,251);
    background: linear-gradient(90deg, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%);*/
    /*background: rgb(113,6,235);
    background: linear-gradient(90deg, rgba(113,6,235,1) 40%, rgba(8,170,203,1) 100%);*/
    /*background: rgb(63,94,251);
    background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%);*/
    /*background: rgb(0,139,153);
    background: linear-gradient(90deg, rgba(0,139,153,1) 0%, rgba(0,139,153,1) 35%, rgba(0,139,153,1) 100%);*/
    /*new*/
    /*background: rgb(255,153,51);
    background: linear-gradient(90deg, rgba(255,153,51,1) 0%, rgba(255,255,255,1) 34%, rgba(255,255,255,1) 66%, rgba(19,136,8,1) 100%);*/
    /*background: linear-gradient(90deg, rgba(255,153,51,1) 0%, rgba(255,255,255,1) 38%, rgba(255,255,255,1) 62%, rgba(19,136,8,1) 100%);*/
    height: 18px;
    /*background-color: #009999;*/
    /*border: 1px solid teal;*/
    background-color: steelblue;
    /*background-color: #138808;*/
    font-weight: 500;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 12px;
    color: #FFFFFF;
    text-align: left;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*text-transform: uppercase;*/
    padding: 4px;
}


.grid_pager span {
    color: #ffffff;
    font-weight: 500;
    border: 1px solid #ffffff;
    background-color: #006699;
    padding: 1px 5px;
    height: 25px;
}

.grid_pager a {
    border: 1px solid #006699;
    background-color: #FFF;
    padding: 1px 5px;
}

.logout {
    font-size: .8em;
    font-family: 'Oswald', sans-serif;
    position: relative;
    right: -18px;
    bottom: -4px;
    overflow: hidden;
    letter-spacing: 3px;
    opacity: 0;
    transition: opacity .45s;
    -webkit-transition: opacity .35s;
    float: right;
    margin-right: 20px;
    margin-top: 20px;
    width: 80px;
    height: 30px;
}

#containerLogin {
    /*position: absolute;*/
    width: 540px;
    /*height: 320px;*/
    /*top: 50%;
    left: 50%;
    margin-top: -145px;
    margin-left: -284px;*/
    background: #fff;
    border-radius: 3px;
    border: 1px solid #ccc;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    border: 1px solid #c7d0d2;
    border-radius: 2px;
    box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .4), 0 0 0 5px #f5f7f8;
}

.fieldlogin {
    color: #777;
    padding-left: 10px;
    margin: 10px;
    margin-top: 12px;
    margin-left: 18px;
    width: 290px;
    height: 35px;
    border: 1px solid #c7d0d2;
    border-radius: 2px;
}

.btnlogin {
    /*float: right;
    margin-right: 20px;
    margin-top: 20px;*/
    width: 80px;
    height: 30px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #acd6ef; /*IE fallback*/
    background-image: -webkit-gradient(linear, left top, left bottom, from(#c3acef), to(#6e79e8));
    background-image: -moz-linear-gradient(top left 90deg, #acd6ef 0%, #6ec2e8 100%);
    background-image: linear-gradient(top left 90deg, #acd6ef 0%, #6ec2e8 100%);
    border-radius: 30px;
    border: 1px solid #66add6;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3), inset 0 1px 0 rgba(255, 255, 255, .5);
    cursor: pointer;
    /*margin-top: -39px;*/
}

.checkLogged {
    margin-left: -2px;
    margin-top: 30px;
}

.lblLogin {
    color: #555;
    display: inline-block;
    margin-left: 18px;
    padding-top: 15px;
    font: 'Segoe UI', 'Roboto', sans-serif;
    font-size: 14px;
    margin-top: 10px;
    font-weight: 600;
    /*text-transform: uppercase;*/
}

/*.btn-grad {background-image: linear-gradient(to right, #D1913C 0%, #FFD194 51%, #D1913C 100%)}
.btn-grad:hover { background-position: right center; }*/


/* for Gridview Skin*/

.erp-gridview {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #d0d0d0;
    margin-top: 10px;
}

.erp-header > th {
    background-color: #3C8DBC;
    color: white;
    /*padding: 10px;*/
    font-weight: 600;
    /*text-align: left;*/
}

.erp-row > td, .erp-alt-row > td {
    /*padding: 8px 10px;*/
    border-bottom: 1px solid #eaeaea;
}

.erp-alt-row {
    background-color: #f9f9f9;
}

.erp-selected-row {
    background-color: #cbe6f5 !important;
}

.erp-pager {
    padding: 10px;
    font-size: 12px;
}

    .erp-pager a, .erp-pager span {
        margin: 0 3px;
        padding: 6px 10px;
        background-color: #ffffff;
        border: 1px solid #ccc;
        color: #007bff;
        text-decoration: none;
    }

    .erp-pager span {
        font-weight: bold;
        background-color: #e0f0ff;
    }


/*======================================*/

/* Gridview Indian Flag Theme */
.erp-gridview-indian {
    border-collapse: collapse;
    width: 100%;
    border: 1px solid #d0d0d0;
    margin-top: 10px;
    font-family: 'Segoe UI', 'Roboto', sans-serif;
}

/* Header - Saffron + Ashoka Chakra watermark */
.erp-header-indian > th {
    background-color: #FF9933; /* Saffron */
    color: white;
    font-weight: 600;
    position: relative;
    /*background-image: url('/images/ashoka-chakra-light.png');*/ /* your chakra PNG path */
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px; /* small, subtle */
    opacity: 0.95; /* slightly transparent for soft feel */
}

/* Row Styles */
.erp-row-indian > td, .erp-alt-row-indian > td {
    border-bottom: 1px solid #eaeaea;
}

/* Alternate Row - Light Green */
.erp-alt-row-indian {
    background-color: #e6ffe6; /* soft green tint */
}

/* Selected Row - Navy Blue (Ashoka Chakra color) */
.erp-selected-row-indian {
    background-color: #003366 !important;
    color: white;
}

/* Pager - White with tricolor borders */
.erp-pager-indian {
    padding: 10px;
    font-size: 12px;
    border-top: 3px solid #FF9933;
    border-bottom: 3px solid #138808; /* Green */
}

    .erp-pager-indian a, .erp-pager-indian span {
        margin: 0 3px;
        padding: 6px 10px;
        background-color: #ffffff;
        border: 1px solid #ccc;
        color: #003366; /* Navy Blue */
        text-decoration: none;
    }

.erp-pager-indian span {
        font-weight: bold;
        background-color: #e0f0ff;
    }


/* ========================================================================== */
/* ET-ERP ENTERPRISE THEME 2026                                               */
/* Compatibility layer: legacy selectors above are intentionally retained.   */
/* ========================================================================== */

/* 1. Theme variables ------------------------------------------------------- */
:root {
    --erp-primary: #1f5f7a;
    --erp-primary-hover: #174b62;
    --erp-primary-soft: #eaf3f7;
    --erp-secondary: #5b6878;
    --erp-success: #2f7d5b;
    --erp-warning: #ad6b12;
    --erp-danger: #b83b3b;
    --erp-info: #2f6f91;
    --erp-page-bg: #f3f6f8;
    --erp-panel-bg: #ffffff;
    --erp-text: #263746;
    --erp-text-muted: #687784;
    --erp-border: #d6e0e6;
    --erp-border-strong: #b9c8d1;
    --erp-radius: 6px;
    --erp-shadow: 0 2px 8px rgba(30, 53, 67, 0.08);
    --erp-focus-shadow: 0 0 0 3px rgba(31, 95, 122, 0.16);
    --erp-space-1: 4px;
    --erp-space-2: 8px;
    --erp-space-3: 12px;
    --erp-space-4: 16px;
    --erp-space-5: 20px;
    --erp-input-height: 36px;
    --erp-button-height: 36px;
    --erp-font: "Segoe UI", Arial, Helvetica, sans-serif;
}

/* ========================================================================== */
/* ET-ERP PUBLIC HOME PAGE                                                    */
/* Page-specific selectors keep the standalone Home.aspx layout isolated.    */
/* ========================================================================== */

/* Home page shell: overrides the legacy fixed-width public layout safely. */
.et-home-page {
    min-width: 0;
    overflow-x: hidden;
    background: var(--erp-page-bg, #f3f6f8);
    color: var(--erp-text, #263746);
}

.et-home-page .container {
    width: calc(100% - 32px);
    max-width: 1180px;
    margin-right: auto;
    margin-left: auto;
}

/* Home header: clean brand alignment with a compact enterprise login action. */
.et-home-page #header_content_area.et-home-header {
    width: 100%;
    height: auto;
    min-height: 72px;
    padding: 0;
    border-bottom: 1px solid var(--erp-border, #d6e0e6);
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: 0 2px 7px rgba(30, 53, 67, 0.06);
}

.et-home-page .et-home-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 72px;
}

.et-home-page .et-home-brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    color: var(--erp-text, #263746);
    text-decoration: none;
}

.et-home-page .et-home-brand__logo {
    display: block;
    float: none;
    width: auto;
    height: 42px;
}

.et-home-page .et-home-brand__subtitle {
    padding-left: 14px;
    border-left: 1px solid var(--erp-border, #d6e0e6);
    color: var(--erp-text-muted, #687784);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.et-home-page .container a.orange_button.et-home-login,
.et-home-page .container a.orange_button.et-home-login:hover {
    float: none;
    height: 36px;
    margin: 0;
    padding: 8px 16px;
    border: 1px solid var(--erp-primary, #1f5f7a);
    border-radius: var(--erp-radius, 6px);
    background: var(--erp-primary, #1f5f7a);
    box-shadow: none;
    color: #ffffff;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    text-shadow: none;
    text-transform: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.et-home-page .container a.orange_button.et-home-login:hover {
    border-color: var(--erp-primary-hover, #174b62);
    background: var(--erp-primary-hover, #174b62);
    box-shadow: 0 2px 5px rgba(30, 53, 67, 0.16);
}

.et-home-page .container a.orange_button.et-home-login:active {
    box-shadow: inset 0 2px 4px rgba(15, 43, 56, 0.18);
}

/* Home navigation: responsive enterprise navigation with persistent active state. */
.et-home-page #menu_content_area.et-home-navigation {
    width: 100%;
    height: auto;
    min-height: 44px;
    padding: 0;
    background: #173f57;
    text-transform: none;
}

.et-home-page .top_menu ul {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    margin: 0;
    padding: 0;
    list-style: none;
}

.et-home-page .top_menu ul li {
    float: none;
    height: auto;
    margin: 0;
    background: none;
    color: #edf5f8;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
}

.et-home-page .top_menu ul li a,
.et-home-page .top_menu ul li a:hover {
    display: block;
    float: none;
    height: auto;
    min-height: 44px;
    padding: 13px 18px 11px;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: #edf5f8;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
    line-height: 17px;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.et-home-page .top_menu ul li a:hover {
    border-bottom-color: #8bc8d1;
    background: #245f78;
    color: #ffffff;
}

.et-home-page .top_menu ul li a.is-active,
.et-home-page .top_menu ul li a[aria-current="page"] {
    border-bottom-color: #a1e0d8;
    background: #205f70;
    color: #ffffff;
}

.et-home-page .top_menu ul li a:active {
    background: #174b62;
}

.et-home-page .top_menu ul li a.is-disabled,
.et-home-page .top_menu ul li a[aria-disabled="true"] {
    border-bottom-color: transparent;
    background: #294858;
    color: #9fb0ba;
    cursor: not-allowed;
    pointer-events: none;
}

/* Home welcome section: balanced text and capability summary without decorative imagery. */
.et-home-page #slider_content_area.et-home-hero {
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 46px 0;
    border-bottom: 1px solid var(--erp-border, #d6e0e6);
    background: var(--erp-primary-soft, #eaf3f7);
}

.et-home-page .et-home-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    align-items: center;
    gap: 42px;
}

.et-home-page .et-home-hero__content {
    min-width: 0;
}

.et-home-page .et-home-eyebrow {
    display: block;
    margin-bottom: 8px;
    color: var(--erp-primary, #1f5f7a);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 16px;
    text-transform: uppercase;
}

.et-home-page .et-home-hero h1 {
    max-width: 680px;
    margin: 0 0 16px;
    color: #173f57;
    font-size: 36px;
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.18;
}

.et-home-page .et-home-hero__content > p {
    max-width: 650px;
    margin: 0;
    color: #526673;
    font-size: 15px;
    line-height: 1.65;
}

/* Home actions: shared interaction states for public links and buttons. */
.et-home-page .et-home-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
}

.et-home-page .et-home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-radius: var(--erp-radius, 6px);
    font-size: 12px;
    font-weight: 650;
    line-height: 20px;
    text-align: center;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.et-home-page .et-home-button--primary {
    border-color: var(--erp-primary, #1f5f7a);
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
}

.et-home-page .et-home-button--primary:hover {
    border-color: var(--erp-primary-hover, #174b62);
    background: var(--erp-primary-hover, #174b62);
    color: #ffffff;
    box-shadow: 0 3px 7px rgba(23, 75, 98, 0.18);
    transform: translateY(-1px);
}

.et-home-page .et-home-button--secondary {
    border-color: var(--erp-border-strong, #b9c8d1);
    background: var(--erp-panel-bg, #ffffff);
    color: var(--erp-primary, #1f5f7a);
}

.et-home-page .et-home-button--secondary:hover {
    border-color: var(--erp-primary, #1f5f7a);
    background: #f4f8fa;
    color: var(--erp-primary-hover, #174b62);
    box-shadow: 0 3px 7px rgba(30, 53, 67, 0.10);
    transform: translateY(-1px);
}

.et-home-page .et-home-button:active,
.et-home-page .et-home-button.is-selected {
    box-shadow: inset 0 2px 4px rgba(15, 43, 56, 0.18);
    transform: none;
}

.et-home-page .et-home-button.is-disabled,
.et-home-page .et-home-button[aria-disabled="true"] {
    border-color: #cbd4da;
    background: #e4e9ec;
    box-shadow: none;
    color: #7a8790;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
}

/* Home summary panel: compact operational overview using meaningful accents. */
.et-home-page .et-home-summary {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--erp-border, #d6e0e6);
    border-radius: 8px;
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: 0 4px 14px rgba(30, 53, 67, 0.10);
}

.et-home-page .et-home-summary__heading {
    margin-bottom: 14px;
    padding-bottom: 13px;
    border-bottom: 1px solid #e1e8ec;
}

.et-home-page .et-home-summary__label {
    display: block;
    margin-bottom: 3px;
    color: var(--erp-text-muted, #687784);
    font-size: 11px;
    line-height: 16px;
}

.et-home-page .et-home-summary__heading strong {
    display: block;
    color: var(--erp-text, #263746);
    font-size: 15px;
    font-weight: 650;
    line-height: 21px;
}

.et-home-page .et-home-summary__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.et-home-page .et-home-summary__item {
    min-width: 0;
    padding: 11px 12px;
    border: 1px solid var(--summary-border, #c9dce6);
    border-left: 4px solid var(--summary-color, #2f6f91);
    border-radius: 5px;
    background: var(--summary-soft, #eef6fa);
}

.et-home-page .et-home-summary__item span,
.et-home-page .et-home-summary__item strong {
    display: block;
    overflow-wrap: anywhere;
}

.et-home-page .et-home-summary__item span {
    margin-bottom: 2px;
    color: var(--summary-color, #2f6f91);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 14px;
    text-transform: uppercase;
}

.et-home-page .et-home-summary__item strong {
    color: #334a5b;
    font-size: 12px;
    font-weight: 600;
    line-height: 17px;
}

.et-home-page .et-home-summary__item--blue {
    --summary-color: #2f6f91;
    --summary-border: #bfd5e1;
    --summary-soft: #eef6fa;
}

.et-home-page .et-home-summary__item--teal {
    --summary-color: #2b7d80;
    --summary-border: #bed9d9;
    --summary-soft: #edf7f6;
}

.et-home-page .et-home-summary__item--amber {
    --summary-color: #9a6514;
    --summary-border: #ead2a5;
    --summary-soft: #fff8e8;
}

.et-home-page .et-home-summary__item--purple {
    --summary-color: #735492;
    --summary-border: #d3c5df;
    --summary-soft: #f5f0f9;
}

/* Home content: removes the old decorative body image and fixed paragraph width. */
.et-home-page #content_area.et-home-content {
    min-height: 0;
    margin: 0;
    padding: 46px 0 52px;
    background: transparent;
    color: var(--erp-text, #263746);
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 13px;
    line-height: 1.55;
    text-align: left;
}

.et-home-page #content_area.et-home-content p {
    width: auto;
    margin: 0;
}

.et-home-page .et-home-section-heading {
    max-width: 760px;
    margin-bottom: 22px;
}

.et-home-page .et-home-section-heading h2,
.et-home-page .et-home-information h2,
.et-home-page .et-home-support h2 {
    margin: 0 0 8px;
    color: #263746;
    font-size: 23px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.25;
}

.et-home-page .et-home-section-heading p,
.et-home-page .et-home-information p,
.et-home-page .et-home-support p {
    color: var(--erp-text-muted, #687784);
    font-size: 13px;
    line-height: 1.65;
}

/* Home capability cards: balanced section colors with reusable states. */
.et-home-page .et-home-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.et-home-page .et-home-card {
    min-width: 0;
    min-height: 188px;
    padding: 18px;
    border: 1px solid var(--card-border, #c9dce6);
    border-top: 4px solid var(--card-color, #2f6f91);
    border-radius: 7px;
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: var(--erp-shadow, 0 2px 8px rgba(30, 53, 67, 0.08));
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.et-home-page .et-home-card:hover {
    border-color: var(--card-color, #2f6f91);
    box-shadow: 0 5px 14px rgba(30, 53, 67, 0.12);
    transform: translateY(-2px);
}

.et-home-page .et-home-card.is-selected {
    border-color: var(--card-color, #2f6f91);
    background: var(--card-soft, #eef6fa);
    box-shadow: 0 0 0 2px var(--card-border, #c9dce6);
}

.et-home-page .et-home-card.is-disabled {
    border-color: #d7dfe4;
    background: #f2f4f5;
    box-shadow: none;
    color: #88939a;
    opacity: 0.78;
    transform: none;
}

.et-home-page .et-home-card__tag {
    display: inline-block;
    margin-bottom: 18px;
    padding: 3px 7px;
    border-radius: 4px;
    background: var(--card-soft, #eef6fa);
    color: var(--card-color, #2f6f91);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.035em;
    line-height: 15px;
    text-transform: uppercase;
}

.et-home-page .et-home-card h3 {
    margin: 0 0 8px;
    color: #263746;
    font-size: 15px;
    font-weight: 650;
    line-height: 21px;
}

.et-home-page .et-home-card p {
    color: #687784;
    font-size: 12px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.et-home-page .et-home-card--blue {
    --card-color: #2f6f91;
    --card-border: #bfd5e1;
    --card-soft: #eef6fa;
}

.et-home-page .et-home-card--teal {
    --card-color: #2b7d80;
    --card-border: #bed9d9;
    --card-soft: #edf7f6;
}

.et-home-page .et-home-card--amber {
    --card-color: #9a6514;
    --card-border: #ead2a5;
    --card-soft: #fff8e8;
}

.et-home-page .et-home-card--purple {
    --card-color: #735492;
    --card-border: #d3c5df;
    --card-soft: #f5f0f9;
}

/* Home information panel: combines access guidance with a concise workflow. */
.et-home-page .et-home-information {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.9fr);
    align-items: center;
    gap: 34px;
    margin-top: 22px;
    padding: 24px;
    border: 1px solid var(--erp-border, #d6e0e6);
    border-radius: 8px;
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: var(--erp-shadow, 0 2px 8px rgba(30, 53, 67, 0.08));
}

.et-home-page .et-home-information__content {
    min-width: 0;
}

.et-home-page .et-home-process {
    display: grid;
    gap: 8px;
}

.et-home-page .et-home-process__step {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid #d9e3e8;
    border-radius: 5px;
    background: #f7fafb;
}

.et-home-page .et-home-process__step > span {
    display: inline-flex;
    flex: 0 0 32px;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--erp-primary-soft, #eaf3f7);
    color: var(--erp-primary, #1f5f7a);
    font-size: 10px;
    font-weight: 700;
}

.et-home-page .et-home-process__step div,
.et-home-page .et-home-process__step strong,
.et-home-page .et-home-process__step small {
    display: block;
    min-width: 0;
}

.et-home-page .et-home-process__step strong {
    color: #334a5b;
    font-size: 12px;
    line-height: 17px;
}

.et-home-page .et-home-process__step small {
    color: var(--erp-text-muted, #687784);
    font-size: 11px;
    line-height: 16px;
}

/* Home support panel: provides a clear final action without adding new behavior. */
.et-home-page .et-home-support {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 22px;
    padding: 22px 24px;
    border: 1px solid #bed9d9;
    border-left: 5px solid #2b7d80;
    border-radius: 7px;
    background: #edf7f6;
}

.et-home-page .et-home-support > div:first-child {
    min-width: 0;
}

.et-home-page .et-home-support .et-home-actions {
    flex: 0 0 auto;
    margin-top: 0;
}

/* Home footer: removes legacy fixed heights and table layout. */
.et-home-page #footerarea,
.et-home-page #footer_c {
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    background: var(--erp-panel-bg, #ffffff);
}

.et-home-page #footer_c {
    padding: 20px 0;
    border-top: 1px solid var(--erp-border, #d6e0e6);
    box-shadow: 0 -2px 7px rgba(30, 53, 67, 0.05);
    color: var(--erp-text-muted, #687784);
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 11px;
    line-height: 17px;
}

.et-home-page .et-home-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}

.et-home-page .et-home-footer__links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
}

.et-home-page #footer_c a {
    color: var(--erp-primary, #1f5f7a);
    font-weight: 600;
    text-decoration: none;
}

.et-home-page #footer_c a:hover {
    color: var(--erp-primary-hover, #174b62);
    text-decoration: underline;
}

.et-home-page #footer_c p {
    margin: 0;
    color: var(--erp-text-muted, #687784);
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 11px;
    line-height: 17px;
    text-align: right;
}

/* Home laptop layout: reduces card columns and hero spacing. */
@media (max-width: 1024px) {
    .et-home-page .et-home-hero__grid {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 0.85fr);
        gap: 28px;
    }

    .et-home-page .et-home-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .et-home-page .et-home-card {
        min-height: 0;
    }
}

/* Home tablet layout: stacks major panels and maintains comfortable controls. */
@media (max-width: 760px) {
    .et-home-page .et-home-header__inner {
        min-height: 66px;
    }

    .et-home-page .et-home-brand__logo {
        height: 37px;
    }

    .et-home-page .et-home-brand__subtitle {
        display: none;
    }

    .et-home-page .et-home-hero {
        padding: 34px 0;
    }

    .et-home-page .et-home-hero__grid,
    .et-home-page .et-home-information {
        grid-template-columns: minmax(0, 1fr);
    }

    .et-home-page .et-home-hero h1 {
        font-size: 30px;
    }

    .et-home-page .et-home-information {
        gap: 22px;
    }

    .et-home-page .et-home-support,
    .et-home-page .et-home-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .et-home-page #footer_c p {
        text-align: left;
    }
}

/* Home mobile layout: wraps navigation, stacks cards, and expands tap targets. */
@media (max-width: 520px) {
    .et-home-page .container {
        width: calc(100% - 20px);
    }

    .et-home-page .et-home-header__inner {
        gap: 10px;
    }

    .et-home-page .et-home-brand__logo {
        height: 34px;
    }

    .et-home-page .container a.orange_button.et-home-login,
    .et-home-page .container a.orange_button.et-home-login:hover {
        min-width: 104px;
        padding-right: 12px;
        padding-left: 12px;
    }

    .et-home-page .top_menu ul li {
        flex: 1 1 50%;
    }

    .et-home-page .top_menu ul li a,
    .et-home-page .top_menu ul li a:hover {
        min-height: 42px;
        padding: 11px 10px 10px;
        text-align: center;
    }

    .et-home-page #slider_content_area.et-home-hero {
        padding: 28px 0;
    }

    .et-home-page .et-home-hero h1 {
        font-size: 26px;
    }

    .et-home-page .et-home-hero__content > p {
        font-size: 14px;
    }

    .et-home-page .et-home-actions,
    .et-home-page .et-home-support .et-home-actions {
        width: 100%;
    }

    .et-home-page .et-home-button {
        flex: 1 1 100%;
        width: 100%;
    }

    .et-home-page .et-home-summary {
        padding: 14px;
    }

    .et-home-page .et-home-summary__grid,
    .et-home-page .et-home-card-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .et-home-page #content_area.et-home-content {
        padding: 34px 0 38px;
    }

    .et-home-page .et-home-section-heading h2,
    .et-home-page .et-home-information h2,
    .et-home-page .et-home-support h2 {
        font-size: 20px;
    }

    .et-home-page .et-home-card,
    .et-home-page .et-home-information,
    .et-home-page .et-home-support {
        padding: 17px;
    }

    .et-home-page .et-home-card__tag {
        margin-bottom: 12px;
    }
}

/* 2. Base and typography --------------------------------------------------- */
.erp-shell {
    margin: 0;
    background: #f3f6f8;
    background: var(--erp-page-bg, #f3f6f8);
    color: #263746;
    color: var(--erp-text, #263746);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 13px;
    line-height: 1.45;
}

.erp-shell *,
.erp-shell *::before,
.erp-shell *::after {
    box-sizing: border-box;
}

.erp-shell a {
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
}

.erp-shell a:focus-visible,
.erp-shell button:focus-visible,
.erp-shell input:focus-visible,
.erp-shell select:focus-visible,
.erp-shell textarea:focus-visible {
    outline: 2px solid #1f5f7a;
    outline: 2px solid var(--erp-primary, #1f5f7a);
    outline-offset: 2px;
}

.erp-shell .heading_text,
.erp-shell .lheading_text,
.erp-shell .lheading_text_cust,
.erp-shell .lblust,
.erp-shell .lcust_text,
.erp-shell .lbl_text,
.erp-shell .lbltext_style,
.erp-shell .page_style,
.erp-shell .text_style,
.erp-shell .text_style_custom,
.erp-shell .text_style_lnk,
.erp-shell .chkfield,
.erp-shell .chkfield_ct,
.erp-shell .chkfield_cst,
.erp-shell .chkfield_disabled {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
}

.erp-shell .heading_text,
.erp-shell .lheading_text,
.erp-shell .lbl_text {
    color: #334a5b;
    font-size: 12px;
    font-weight: 600;
}

.erp-shell .text_style,
.erp-shell .text_style_custom,
.erp-shell .page_style {
    color: #263746;
    color: var(--erp-text, #263746);
    font-size: 12px;
    font-weight: 400;
}

/* 3. Application layout --------------------------------------------------- */
.erp-shell #total_container {
    width: 100%;
    min-width: 0;
    background: #f3f6f8;
    background: var(--erp-page-bg, #f3f6f8);
}

.erp-shell .container {
    width: 100%;
    min-width: 0;
    background: transparent;
}

.erp-shell .erp-content {
    min-height: 69vh;
    padding: 12px 16px 22px;
    background: #f3f6f8;
    background: var(--erp-page-bg, #f3f6f8);
}

.erp-shell--account .erp-account-content {
    min-height: 74vh;
    display: block;
    padding: 0 16px 24px;
}

.erp-shell--account .login-page {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.erp-shell--account #containerLogin {
    width: 540px;
    max-width: 100%;
    margin: 0 auto;
    padding: 10px 18px 16px;
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(30, 53, 67, 0.10);
}

.erp-shell--account #containerLogin .login-form-table {
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    padding: 8px;
    border-collapse: separate;
    border-spacing: 0 4px;
}

.erp-shell--account #containerLogin .login-form-table td {
    padding: 5px 6px;
    vertical-align: middle;
}

.erp-shell--account #containerLogin .login-form-table td:first-child {
    width: 120px;
    color: #334a5b;
    font-size: 12px;
    font-weight: 600;
    text-align: right;
    white-space: nowrap;
}

.erp-shell--account #containerLogin .login-form-table td:last-child {
    width: 22px;
    text-align: left;
}

.erp-shell--account #containerLogin td.lblLogin {
    display: table-cell;
    margin: 0;
    padding: 5px 6px;
    color: #536472;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 500;
}

.erp-shell--account #containerLogin .fieldlogin {
    display: block;
    width: 100%;
    max-width: 320px;
    margin: 0;
}

.erp-shell--account #containerLogin .checkLogged {
    margin: 0;
}

.erp-shell--account #containerLogin td.login-option-cell,
.erp-shell--account #containerLogin td.login-action-cell,
.erp-shell--account #containerLogin td.login-recovery-cell {
    text-align: center;
}

.erp-shell--account #containerLogin .login-submit-image {
    display: inline-block;
    margin: 4px auto;
    border-radius: 5px;
    vertical-align: middle;
}

.erp-shell--account #containerLogin a {
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
    font-weight: 600;
}

.erp-page,
.erp-content-container {
    width: 100%;
    margin: 0 auto;
}

.erp-page-header {
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid #d6e0e6;
    border: 1px solid var(--erp-border, #d6e0e6);
    border-left: 4px solid #1f5f7a;
    border-left-color: var(--erp-primary, #1f5f7a);
    border-radius: 6px;
    border-radius: var(--erp-radius, 6px);
    background: #ffffff;
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: 0 2px 8px rgba(30, 53, 67, 0.08);
    box-shadow: var(--erp-shadow, 0 2px 8px rgba(30, 53, 67, 0.08));
}

.erp-page-header h1,
.erp-page-header h2 {
    margin: 0;
    color: #263746;
    color: var(--erp-text, #263746);
    font-size: 18px;
    font-weight: 600;
}

/* Existing table-cell page headings used across legacy pages. */
.erp-shell .td_lheading_text {
    height: auto;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    background: #1f5f7a;
    background: linear-gradient(120deg, #173f5b 0%, #216a79 60%, #2b8784 100%);
    box-shadow: 0 3px 10px rgba(25, 61, 83, 0.13);
    color: #ffffff;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    letter-spacing: -0.005em;
    text-align: left;
}

.erp-shell .td_lheading_text a,
.erp-shell .td_lheading_text span,
.erp-shell .td_lheading_text label {
    color: #ffffff;
}

.erp-shell .td_heading_text,
.erp-shell .td_subheading_text,
.erp-shell .td_modal_heading {
    height: 32px;
    padding: 6px 10px;
    border-radius: 4px;
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
}

.erp-shell .td_headingl_text,
.erp-shell .td_semiheading_text {
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
    font-weight: 600;
}

/* 4. Header --------------------------------------------------------------- */
.erp-shell #header_content_area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 62px;
    min-height: 62px;
    padding: 0 16px 8px;
    border-bottom: 0;
    background: #ffffff;
    color: #263746;
    color: var(--erp-text, #263746);
    box-shadow: none;
}

.erp-header-brand {
    display: flex;
    align-items: center;
    min-width: 0;
}

.erp-header-brand .container {
    display: flex;
    align-items: center;
}

.erp-logo {
    display: block;
    width: auto;
    max-width: 220px;
    height: 30px;
}

.erp-header-user {
    display: flex;
    align-items: center;
    margin-left: auto;
    text-align: right;
}

.erp-header-user table {
    border-collapse: collapse;
}

.erp-header-user td {
    color: #334a5b;
}

.erp-welcome-label,
.erp-user-name {
    color: #334a5b;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
}

.erp-welcome-label {
    font-weight: 400;
    color: #687784;
    color: var(--erp-text-muted, #687784);
}

.erp-user-name {
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
    font-weight: 600;
}

.erp-company-name {
    color: #8f2929;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.erp-header-user input[type="image"] {
    width: 24px;
    height: 24px;
    padding: 3px;
    border-radius: 4px;
    vertical-align: middle;
}

.erp-header-user input[type="image"]:hover {
    background: #eaf3f7;
    background: var(--erp-primary-soft, #eaf3f7);
}

.erp-header-user .text_style_lnk,
.erp-header-user .text_style_lnk a {
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
}

/* 5. Navigation ----------------------------------------------------------- */
.erp-shell #menu_content_area {
    width: 100%;
    height: auto;
    min-height: 36px;
    padding: 0 10px;
    border-bottom: 1px solid #15394e;
    background: #173f57;
}

.erp-shell #menu_content_area::after {
    display: table;
    clear: both;
    content: "";
}

.erp-shell .ddsmoothmenu {
    width: 100%;
    background: transparent;
    font: 500 12px "Segoe UI", Arial, Helvetica, sans-serif;
}

.erp-shell .ddsmoothmenu ul li a,
.erp-shell .ddsmoothmenu ul li a:link,
.erp-shell .ddsmoothmenu ul li a:visited {
    min-height: 36px;
    padding-top: 9px;
    padding-bottom: 9px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    background: #173f57;
    color: #edf5f8;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    line-height: 18px;
    text-decoration: none;
    white-space: normal;
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.erp-shell #smoothmenu1 > ul > li > a {
    padding-left: 10px !important;
    font-weight: 600;
}

.erp-shell .ddsmoothmenu ul li a:hover,
.erp-shell .ddsmoothmenu ul li a:focus,
.erp-shell .ddsmoothmenu ul li a.selected {
    background: #245f78;
    color: #ffffff;
}

.erp-shell .ddsmoothmenu ul li a:focus {
    outline: 2px solid #8bc8d1;
    outline-offset: -2px;
}

.erp-shell #smoothmenu1 > ul > li > a.current-parent {
    background: #205f70;
    box-shadow: inset 0 -3px 0 #70c8c1;
    color: #ffffff;
}

.erp-shell #smoothmenu1 > ul > li > a.current {
    background: #2b7d80;
    box-shadow: inset 0 -3px 0 #a1e0d8;
    color: #ffffff;
}

.erp-shell .ddsmoothmenu ul li ul {
    padding: 4px 0;
    border: 1px solid #c7d4dc;
    border-radius: 0 0 5px 5px;
    background: #ffffff;
    box-shadow: 0 6px 16px rgba(23, 54, 72, 0.18);
}

.erp-shell .ddsmoothmenu ul li ul li a,
.erp-shell .ddsmoothmenu ul li ul li a:link,
.erp-shell .ddsmoothmenu ul li ul li a:visited {
    min-height: 30px;
    min-width: 180px;
    padding: 6px 10px;
    border: 0;
    border-bottom: 1px solid #e4ebef;
    background: #ffffff;
    color: #334a5b;
    line-height: 18px;
}

.erp-shell .ddsmoothmenu ul li ul li a:hover,
.erp-shell .ddsmoothmenu ul li ul li a:focus,
.erp-shell .ddsmoothmenu ul li ul li a.selected {
    background: #e7f2f4;
    box-shadow: inset 3px 0 0 #438b95;
    color: #174b62;
    color: var(--erp-primary-hover, #174b62);
}

.erp-shell .ddsmoothmenu ul li ul li a.current-parent {
    background: #edf6f6;
    box-shadow: inset 3px 0 0 #6ba5ab;
    color: #174b62;
    font-weight: 600;
}

.erp-shell .ddsmoothmenu ul li ul li a.current {
    background: #d8ecec;
    box-shadow: inset 3px 0 0 #2b7d80;
    color: #123f4f;
    font-weight: 600;
}

.erp-shell .downarrowclass {
    top: 14px;
    opacity: 0.8;
}

.erp-shell .rightarrowclass {
    top: 10px;
    opacity: 0.85;
    filter: invert(45%);
}

/* 6. Forms and labels ----------------------------------------------------- */
.erp-shell input.field,
.erp-shell textarea.field,
.erp-shell input.tabtxtfield,
.erp-shell input.tabfield,
.erp-shell input.fieldlogin,
.erp-shell select.drpfield,
.erp-shell select.drpsmallfield,
.erp-shell select.drpCurrfield,
.erp-shell select.tabdrpfield,
.erp-shell .erp-control {
    height: 36px;
    height: var(--erp-input-height, 36px);
    padding: 6px 9px;
    border: 1px solid #b9c8d1;
    border-color: var(--erp-border-strong, #b9c8d1);
    border-radius: 5px;
    outline: none;
    background: #ffffff;
    color: #263746;
    color: var(--erp-text, #263746);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 400;
    line-height: 20px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.erp-shell select.drpfield,
.erp-shell select.drpsmallfield,
.erp-shell select.drpCurrfield,
.erp-shell select.tabdrpfield,
.erp-shell select.erp-control {
    padding-right: 28px;
    line-height: normal;
}

textarea.field,
.erp-shell textarea.erp-control {
    height: auto;
    min-height: 72px;
    resize: both;
}

.erp-shell select[multiple].drpfield,
.erp-shell select[multiple].drpsmallfield,
.erp-shell select[multiple].erp-control,
.erp-shell .erp-listbox {
    height: auto;
    min-height: 84px;
    padding: 4px;
}

.erp-shell input.field:focus,
.erp-shell textarea.field:focus,
.erp-shell input.tabtxtfield:focus,
.erp-shell input.tabfield:focus,
.erp-shell input.fieldlogin:focus,
.erp-shell select.drpfield:focus,
.erp-shell select.drpsmallfield:focus,
.erp-shell select.drpCurrfield:focus,
.erp-shell select.tabdrpfield:focus,
.erp-shell .erp-control:focus {
    border-color: #1f5f7a;
    border-color: var(--erp-primary, #1f5f7a);
    box-shadow: 0 0 0 3px rgba(31, 95, 122, 0.16);
    box-shadow: var(--erp-focus-shadow, 0 0 0 3px rgba(31, 95, 122, 0.16));
}

.erp-shell input[readonly],
.erp-shell textarea[readonly],
.erp-shell .read-only-input,
.erp-shell .readonly-grid-text {
    border-color: #d6e0e6;
    background: #f5f7f8;
    color: #536472;
    cursor: default;
}

.erp-shell input:disabled,
.erp-shell select:disabled,
.erp-shell textarea:disabled,
.erp-shell .aspNetDisabled,
.erp-shell .chkfield_disabled {
    border-color: #dce3e7;
    background: #eef2f4;
    color: #82909a;
    cursor: not-allowed;
    opacity: 1;
}

.erp-shell .chkfield,
.erp-shell .chkfield_ct,
.erp-shell .chkfield_cst,
.erp-shell .erp-check,
.erp-shell .erp-radio {
    color: #334a5b;
    font-size: 12px;
    font-weight: 400;
}

.erp-shell .chkfield input[type="checkbox"],
.erp-shell .chkfield input[type="radio"],
.erp-shell .chkfield_ct input[type="checkbox"],
.erp-shell .chkfield_cst input[type="checkbox"],
.erp-shell .erp-check input,
.erp-shell .erp-radio input {
    width: 16px;
    height: 16px;
    margin: 0 5px 0 0;
    vertical-align: -3px;
    accent-color: #1f5f7a;
}

.erp-shell input[type="file"],
.erp-shell .erp-file-upload {
    min-height: 36px;
    max-width: 100%;
    padding: 4px;
    border: 1px solid #b9c8d1;
    border-color: var(--erp-border-strong, #b9c8d1);
    border-radius: 5px;
    background: #ffffff;
    color: #536472;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
}

.erp-shell input[type="file"]::file-selector-button {
    min-height: 26px;
    margin-right: 8px;
    padding: 4px 10px;
    border: 0;
    border-radius: 4px;
    background: #5b6878;
    background: var(--erp-secondary, #5b6878);
    color: #ffffff;
    cursor: pointer;
}

.erp-shell .select2-container .select2-choice,
.erp-shell .SumoSelect > .CaptionCont {
    min-height: 36px;
    border-color: #b9c8d1;
    border-color: var(--erp-border-strong, #b9c8d1);
    border-radius: 5px;
    background: #ffffff;
    color: #263746;
    color: var(--erp-text, #263746);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
}

.erp-shell .select2-container .select2-choice {
    padding-top: 4px;
    line-height: 26px;
}

.erp-shell .select2-container-active .select2-choice,
.erp-shell .SumoSelect:focus > .CaptionCont,
.erp-shell .SumoSelect:hover > .CaptionCont {
    border-color: #1f5f7a;
    border-color: var(--erp-primary, #1f5f7a);
    box-shadow: 0 0 0 3px rgba(31, 95, 122, 0.16);
    box-shadow: var(--erp-focus-shadow, 0 0 0 3px rgba(31, 95, 122, 0.16));
}

/* 7. Buttons -------------------------------------------------------------- */
.erp-shell .btn,
.erp-shell .nebtn,
.erp-shell .cancelbtn,
.erp-shell .editbtn,
.erp-shell .updatebtn,
.erp-shell .srchbtn,
.erp-shell .deletebtn,
.erp-shell .tabBTN,
.erp-shell .erp-button {
    display: inline-block;
    min-width: 72px;
    height: 36px;
    height: var(--erp-button-height, 36px);
    margin: 0;
    padding: 0 13px;
    border: 1px solid transparent;
    border-radius: 5px;
    box-shadow: none;
    color: #ffffff;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 600;
    line-height: 34px;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.erp-shell .ebtn,
.erp-shell .lgbtn,
.erp-shell .canbtn,
.erp-shell .pbtn,
.erp-shell .lbtn,
.erp-shell .delbtn,
.erp-shell .updbtn,
.erp-shell .ceditbtn,
.erp-shell .modbtn,
.erp-shell .cbtn,
.erp-shell .bbtn,
.erp-shell .erp-button--compact {
    display: inline-block;
    min-width: 0;
    min-height: 26px;
    margin: 1px 0;
    padding: 3px 8px;
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: none;
    color: #ffffff;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.erp-shell .btn,
.erp-shell .srchbtn,
.erp-shell .updatebtn,
.erp-shell .updbtn,
.erp-shell .tabBTN,
.erp-shell .erp-button--primary {
    border-color: #1f5f7a;
    border-color: var(--erp-primary, #1f5f7a);
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
}

.erp-shell .btn:hover,
.erp-shell .srchbtn:hover,
.erp-shell .updatebtn:hover,
.erp-shell .updbtn:hover,
.erp-shell .tabBTN:hover,
.erp-shell .erp-button--primary:hover {
    border-color: #174b62;
    border-color: var(--erp-primary-hover, #174b62);
    background: #174b62;
    background: var(--erp-primary-hover, #174b62);
}

.erp-shell .nebtn,
.erp-shell .lgbtn,
.erp-shell .erp-button--success {
    border-color: #2f7d5b;
    border-color: var(--erp-success, #2f7d5b);
    background: #2f7d5b;
    background: var(--erp-success, #2f7d5b);
}

.erp-shell .editbtn,
.erp-shell .ebtn,
.erp-shell .ceditbtn,
.erp-shell .modbtn,
.erp-shell .bbtn,
.erp-shell .erp-button--edit {
    border-color: #526f8a;
    background: #526f8a;
}

.erp-shell .cancelbtn,
.erp-shell .canbtn,
.erp-shell .cbtn,
.erp-shell .pbtn,
.erp-shell .lbtn,
.erp-shell .erp-button--secondary {
    border-color: #5b6878;
    border-color: var(--erp-secondary, #5b6878);
    background: #5b6878;
    background: var(--erp-secondary, #5b6878);
}

.erp-shell .deletebtn,
.erp-shell .delbtn,
.erp-shell .erp-button--danger {
    border-color: #b83b3b;
    border-color: var(--erp-danger, #b83b3b);
    background: #b83b3b;
    background: var(--erp-danger, #b83b3b);
}

.erp-shell .btn:hover,
.erp-shell .nebtn:hover,
.erp-shell .cancelbtn:hover,
.erp-shell .editbtn:hover,
.erp-shell .updatebtn:hover,
.erp-shell .srchbtn:hover,
.erp-shell .deletebtn:hover,
.erp-shell .ebtn:hover,
.erp-shell .lgbtn:hover,
.erp-shell .canbtn:hover,
.erp-shell .pbtn:hover,
.erp-shell .lbtn:hover,
.erp-shell .delbtn:hover,
.erp-shell .updbtn:hover,
.erp-shell .ceditbtn:hover,
.erp-shell .modbtn:hover,
.erp-shell .cbtn:hover,
.erp-shell .bbtn:hover,
.erp-shell .erp-button:hover {
    box-shadow: 0 2px 5px rgba(28, 51, 65, 0.18);
    filter: brightness(0.94);
    color: #ffffff;
}

.erp-shell input[type="button"]:disabled,
.erp-shell input[type="submit"]:disabled,
.erp-shell button:disabled,
.erp-shell .erp-button.aspNetDisabled {
    border-color: #cbd4da;
    background: #cbd4da;
    color: #73808a;
    box-shadow: none;
    cursor: not-allowed;
    filter: none;
}

/* 8. GridViews and data tables ------------------------------------------- */
.erp-table-scroll,
.erp-grid-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.erp-shell table.erp-gridview,
.erp-shell table.gvrowcolor,
.erp-shell table.erp-gridview-indian {
    width: 100%;
    margin: 8px 0 12px;
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-collapse: collapse;
    background: #ffffff;
    background: var(--erp-panel-bg, #ffffff);
    color: #263746;
    color: var(--erp-text, #263746);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
}

.erp-shell .erp-header > th,
.erp-shell .grdheaderNew > th,
.erp-shell table.gvrowcolor > tbody > tr:first-child > th,
.erp-shell .erp-header-indian > th {
    height: 34px;
    padding: 7px 8px;
    border: 1px solid #174b62;
    border-color: var(--erp-primary-hover, #174b62);
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    vertical-align: middle;
}

.erp-shell .erp-header > th a,
.erp-shell .grdheaderNew > th a,
.erp-shell table.gvrowcolor > tbody > tr:first-child > th a {
    color: #ffffff;
    text-decoration: none;
}

.erp-shell .erp-row > td,
.erp-shell .erp-alt-row > td,
.erp-shell table.gvrowcolor > tbody > tr > td,
.erp-shell .erp-row-indian > td,
.erp-shell .erp-alt-row-indian > td {
    height: 30px;
    padding: 5px 8px;
    border: 1px solid #e0e7eb;
    color: #263746;
    color: var(--erp-text, #263746);
    line-height: 18px;
    vertical-align: middle;
}

.erp-shell .erp-row > td,
.erp-shell table.gvrowcolor > tbody > tr > td {
    background: #ffffff;
}

.erp-shell .erp-alt-row > td,
.erp-shell tr.gvaltcolor > td,
.erp-shell .erp-alt-row-indian > td {
    background: #f7f9fa;
}

.erp-shell table.erp-gridview > tbody > tr:not(.erp-header):not(.erp-pager):hover > td,
.erp-shell table.gvrowcolor > tbody > tr:not(.grdheaderNew):not(.grid_pager):hover > td {
    background: #edf5f8;
}

.erp-shell .erp-selected-row > td,
.erp-shell .erp-selected-row-indian > td,
.erp-shell .gvrow-over > td {
    background: #dcecf3;
    color: #183b4e;
    font-weight: 600;
}

.erp-shell table.erp-gridview tfoot td,
.erp-shell table.gvrowcolor tfoot td {
    padding: 6px 8px;
    border-top: 2px solid #b9c8d1;
    background: #eef3f5;
    font-weight: 600;
}

.erp-shell .erp-pager,
.erp-shell .grid_pager,
.erp-shell .erp-pager-indian {
    height: auto;
    padding: 7px 8px;
    border: 0;
    background: #eef3f5;
    text-align: right;
}

.erp-shell .erp-pager table,
.erp-shell .grid_pager table,
.erp-shell .erp-pager-indian table {
    margin-left: auto;
}

.erp-shell .erp-pager a,
.erp-shell .erp-pager span,
.erp-shell .grid_pager a,
.erp-shell .grid_pager span,
.erp-shell .erp-pager-indian a,
.erp-shell .erp-pager-indian span {
    display: inline-block;
    min-width: 28px;
    height: 28px;
    margin: 0 2px;
    padding: 4px 7px;
    border: 1px solid #c7d3da;
    border-radius: 4px;
    background: #ffffff;
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
    font-size: 11px;
    line-height: 18px;
    text-align: center;
    text-decoration: none;
}

.erp-shell .erp-pager span,
.erp-shell .grid_pager span,
.erp-shell .erp-pager-indian span {
    border-color: #1f5f7a;
    border-color: var(--erp-primary, #1f5f7a);
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
    font-weight: 600;
}

.erp-shell table.erp-gridview > tbody > tr > td[colspan],
.erp-shell table.gvrowcolor > tbody > tr > td[colspan] {
    max-width: none;
}

/* 9. Panels, fieldsets, and sections ------------------------------------- */
.erp-shell .tbl_style,
.erp-shell .subtbl_style,
.erp-shell .erp-panel,
.erp-card {
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-radius: 6px;
    border-radius: var(--erp-radius, 6px);
    background: #ffffff;
    background: var(--erp-panel-bg, #ffffff);
    box-shadow: 0 2px 8px rgba(30, 53, 67, 0.08);
    box-shadow: var(--erp-shadow, 0 2px 8px rgba(30, 53, 67, 0.08));
}

.erp-shell .tbl_style {
    border-collapse: separate;
    border-spacing: 0;
}

.erp-card,
.erp-panel {
    padding: 14px;
}

.erp-shell .field_set_style,
.erp-shell fieldset {
    min-width: 0;
    padding: 12px;
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-radius: 6px;
    border-radius: var(--erp-radius, 6px);
    background: #ffffff;
}

.erp-shell .legend_style,
.erp-shell fieldset legend {
    padding: 2px 7px;
    border: 0;
    background: #ffffff;
    color: #1f5f7a;
    color: var(--erp-primary, #1f5f7a);
    font-size: 12px;
    font-weight: 600;
}

/* 10. Tabs --------------------------------------------------------------- */
.erp-tabs,
.erp-shell .ajax__tab_xp .ajax__tab_header {
    min-height: 34px;
    border-bottom: 1px solid #c8d5dc;
    background: transparent;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
}

.erp-shell .ajax__tab_xp .ajax__tab_tab,
.erp-tab {
    min-height: 33px;
    padding: 7px 12px;
    border: 1px solid #c8d5dc;
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
    background: #eef3f5;
    color: #536472;
    font-size: 12px;
    line-height: 18px;
}

.erp-shell .ajax__tab_xp .ajax__tab_active .ajax__tab_tab,
.erp-tab.is-active {
    border-color: #1f5f7a;
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
}

.erp-shell .ajax__tab_xp .ajax__tab_body,
.erp-tab-panel {
    padding: 12px;
    border: 1px solid #c8d5dc;
    border-top: 0;
    background: #ffffff;
}

/* 11. Modal popups -------------------------------------------------------- */
.erp-shell .modalBackground,
.erp-shell .ModalPopupBG {
    background: #17232b;
    opacity: 0.58;
}

.erp-shell .modalPopup,
.erp-modal {
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 40px);
    overflow: auto;
    border: 1px solid #c7d4dc;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 12px 32px rgba(17, 38, 50, 0.28);
    color: #263746;
    color: var(--erp-text, #263746);
}

.erp-modal__header,
.erp-shell .modalPopup .logotext {
    padding: 9px 12px;
    border-bottom: 1px solid #d6e0e6;
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
}

.erp-modal__body {
    padding: 14px;
    overflow: auto;
}

/* 12. Alerts and validation ---------------------------------------------- */
.erp-shell .alertmsg,
.erp-shell .alertmsggst,
.erp-shell .successmsg,
.erp-shell .msgshow,
.erp-alert {
    display: inline-block;
    padding: 7px 10px;
    border: 1px solid transparent;
    border-radius: 5px;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
}

.erp-shell .alertmsg,
.erp-shell .alertmsggst,
.erp-alert--error {
    border-color: #e3baba;
    background: #faeeee;
    color: #8f2929;
}

.erp-shell .successmsg,
.erp-shell .msgshow,
.erp-alert--success {
    border-color: #bad9ca;
    background: #edf7f1;
    color: #246247;
}

.erp-alert--warning {
    border-color: #ead2aa;
    background: #fff7e8;
    color: #805010;
}

.erp-alert--info {
    border-color: #bfd8e5;
    background: #eef6fa;
    color: #245d79;
}

.erp-shell .valdtn_style,
.erp-shell .alert_style {
    border: 0;
    background: transparent;
    color: #b83b3b;
    color: var(--erp-danger, #b83b3b);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 11px;
    font-weight: 600;
}

.erp-shell .success_style {
    color: #2f7d5b;
    color: var(--erp-success, #2f7d5b);
    font-size: 11px;
    font-weight: 600;
}

.erp-validation-summary,
.erp-shell [class*="validation-summary"] {
    margin: 8px 0;
    padding: 9px 12px;
    border: 1px solid #e3baba;
    border-radius: 5px;
    background: #faeeee;
    color: #8f2929;
}

/* 13. Loading indicators ------------------------------------------------- */
.erp-shell [id*="UpdateProgress"] {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 20000;
    min-width: 110px;
    padding: 12px 16px;
    border: 1px solid #c7d4dc;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(17, 38, 50, 0.24);
    color: #334a5b;
    text-align: center;
    transform: translate(-50%, -50%);
}

.erp-shell [id*="UpdateProgress"] table {
    margin: 0 auto;
}

.erp-shell [id*="UpdateProgress"] img {
    max-width: 32px;
    max-height: 32px;
}

.erp-shell .Ajax_text {
    padding-top: 5px;
    color: #536472;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 11px;
    font-weight: 500;
}

.erp-loading-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 19990;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(23, 35, 43, 0.4);
}

.erp-spinner {
    width: 30px;
    height: 30px;
    border: 3px solid #dce8ed;
    border-top-color: #1f5f7a;
    border-top-color: var(--erp-primary, #1f5f7a);
    border-radius: 50%;
    animation: erp-spin 0.8s linear infinite;
}

@keyframes erp-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .erp-spinner { animation: none; }
}

/* 14. Utilities ----------------------------------------------------------- */
.erp-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 12px;
    align-items: start;
}

.erp-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.erp-muted { color: #687784; color: var(--erp-text-muted, #687784); }
.erp-text-right { text-align: right; }
.erp-text-center { text-align: center; }
.erp-no-wrap { white-space: nowrap; }
.erp-hidden { display: none; }

/* Opt-in control skins ---------------------------------------------------- */
.erp-calendar,
.erp-detailsview,
.erp-formview {
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-collapse: collapse;
    background: #ffffff;
    color: #263746;
    color: var(--erp-text, #263746);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
}

.erp-calendar td,
.erp-calendar th,
.erp-detailsview td,
.erp-detailsview th {
    padding: 5px 7px;
    border-color: #e0e7eb;
}

.erp-calendar__title,
.erp-detailsview__header,
.erp-formview__header {
    padding: 7px 9px;
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
    font-weight: 600;
}

.erp-calendar__day-header {
    background: #eef3f5;
    color: #536472;
    font-weight: 600;
}

.erp-calendar__day a {
    color: #263746;
    text-decoration: none;
}

.erp-calendar__selected-day {
    background: #1f5f7a;
    background: var(--erp-primary, #1f5f7a);
    color: #ffffff;
}

.erp-calendar__today {
    background: #eaf3f7;
    background: var(--erp-primary-soft, #eaf3f7);
    font-weight: 600;
}

.erp-calendar__other-month { color: #9aa6ae; }
.erp-detailsview__alt-row { background: #f7f9fa; }
.erp-detailsview__footer,
.erp-formview__footer { background: #eef3f5; }

.erp-menu__item a,
.erp-treeview__node a {
    display: block;
    padding: 6px 9px;
    border-radius: 4px;
    color: #334a5b;
    text-decoration: none;
}

.erp-menu__item a:hover,
.erp-menu__item--selected a,
.erp-treeview__node--hover a,
.erp-treeview__node--selected a {
    background: #eaf3f7;
    background: var(--erp-primary-soft, #eaf3f7);
    color: #174b62;
    color: var(--erp-primary-hover, #174b62);
}

/* 15. Footer -------------------------------------------------------------- */
.erp-shell #footerarea {
    display: block;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    border-top: 1px solid #cbd8df;
    background: #f5f8fa;
    background: linear-gradient(180deg, #f8fafb 0%, #f2f6f8 100%);
    box-shadow: 0 -3px 12px rgba(30, 53, 67, 0.05);
}

.erp-shell #footer_c {
    width: 100%;
    height: auto;
    min-height: 56px;
    margin: 0;
    padding: 0;
    border-top: 0;
    background: transparent;
    box-shadow: none;
    color: #334a59;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-family: var(--erp-font, "Segoe UI", Arial, Helvetica, sans-serif);
    font-size: 12px;
    line-height: 1.45;
}

.erp-shell .erp-footer__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 56px;
    padding: 10px 16px;
}

.erp-shell .erp-footer__links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.erp-shell #footer_c .erp-footer__link {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 12px;
    color: #1f5f7a;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none;
}

.erp-shell #footer_c .erp-footer__link:first-child {
    padding-left: 0;
}

.erp-shell #footer_c .erp-footer__link + .erp-footer__link {
    border-left: 1px solid #b8c8d1;
}

.erp-shell #footer_c a:hover {
    color: #123f54;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.erp-shell #footer_c a:focus-visible {
    border-radius: 4px;
    outline: 2px solid #2f7da3;
    outline-offset: 2px;
}

.erp-shell #footer_c .erp-footer__copyright {
    margin: 0;
    color: #3f5360;
    font-weight: 500;
    text-align: right;
    white-space: nowrap;
}

.erp-shell #footer_c .erp-footer__company {
    color: #234f65;
    font-weight: 700;
    text-decoration: none;
}

/* 16. Responsive rules ---------------------------------------------------- */
@media (max-width: 1200px) {
    .erp-form-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
    .erp-shell .erp-content { padding-right: 12px; padding-left: 12px; }
}

@media (max-width: 1024px) {
    .erp-shell #header_content_area { padding-right: 12px; padding-left: 12px; }
    .erp-shell #menu_content_area { padding-right: 4px; padding-left: 4px; }
    .erp-shell .ddsmoothmenu ul li a { padding-right: 10px; padding-left: 10px; }
    .erp-form-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
    .erp-shell .modalPopup,
    .erp-modal { width: auto; max-width: calc(100vw - 24px); }
}

@media (max-width: 760px) {
    .erp-shell #header_content_area {
        height: auto;
        min-height: 54px;
        flex-wrap: wrap;
        gap: 6px;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .erp-header-user { width: 100%; justify-content: flex-end; }
    .erp-shell .erp-content { padding: 8px; }
    .erp-shell--account .erp-account-content { padding: 0 8px 18px; }
    .erp-shell--account #containerLogin { padding: 8px; }
    .erp-shell--account #containerLogin .login-form-table { padding: 2px; }
    .erp-shell--account #containerLogin .login-form-table td:first-child { width: 96px; }
    .erp-shell .td_lheading_text {
        padding: 7px 10px;
        border-radius: 6px;
        font-size: 13px;
        line-height: 18px;
    }
    .erp-form-grid { grid-template-columns: 1fr; }
    .erp-form-actions { align-items: stretch; }
    .erp-shell .erp-footer__inner {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
        padding: 10px 12px;
    }
    .erp-shell #footer_c .erp-footer__copyright {
        text-align: left;
        white-space: normal;
    }
}

/* AppBillCancel.aspx ------------------------------------------------------ */
.erp-shell .bill-cancel-page {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    padding: 10px 0 30px;
}

.erp-shell .bill-cancel-hero {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 92px;
    padding: 18px 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: linear-gradient(120deg, #173f5b 0%, #216a79 60%, #2b8784 100%);
    box-shadow: 0 8px 22px rgba(25, 61, 83, 0.16);
    color: #ffffff;
}

.erp-shell .bill-cancel-hero::after {
    content: "";
    position: absolute;
    top: -68px;
    right: -42px;
    width: 180px;
    height: 180px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
}

.erp-shell .bill-cancel-hero__icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.erp-shell .bill-cancel-hero__content {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.erp-shell .bill-cancel-hero__eyebrow {
    display: block;
    margin-bottom: 3px;
    color: rgba(255, 255, 255, 0.75);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.11em;
    line-height: 1.3;
    text-transform: uppercase;
}

.erp-shell .bill-cancel-hero__title {
    margin: 0;
    color: #ffffff;
    font-size: 22px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.erp-shell .bill-cancel-hero__subtitle {
    margin: 4px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 12px;
    line-height: 1.45;
}

.erp-shell .bill-cancel-message {
    display: block;
    margin: 14px 0 0;
    padding: 11px 13px;
    border: 1px solid #bad9ca;
    border-radius: 8px;
    background: #edf7f1;
    color: #246247;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.45;
}

.erp-shell .bill-cancel-card {
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid #d6e0e6;
    border-color: var(--erp-border, #d6e0e6);
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(30, 53, 67, 0.09);
}

.erp-shell .bill-cancel-card__header {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 64px;
    padding: 13px 18px;
    border-bottom: 1px solid #dce5ea;
    background: #f8fafb;
}

.erp-shell .bill-cancel-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #fdecee;
    color: #aa3f47;
    font-size: 16px;
    font-weight: 800;
}

.erp-shell .bill-cancel-card__title {
    margin: 0;
    color: #29465a;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.erp-shell .bill-cancel-card__subtitle {
    margin: 2px 0 0;
    color: #6b7e8b;
    font-size: 11px;
    line-height: 1.4;
}

.erp-shell .bill-cancel-card__body {
    padding: 20px;
}

.erp-shell .bill-cancel-notice {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 18px;
    padding: 10px 12px;
    border: 1px solid #ead2aa;
    border-radius: 8px;
    background: #fff7e8;
    color: #74501c;
    font-size: 11px;
    line-height: 1.5;
}

.erp-shell .bill-cancel-notice__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    margin-top: 1px;
    border-radius: 50%;
    background: #d08a29;
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
}

.erp-shell .bill-cancel-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 7px;
}

.erp-shell .bill-cancel-label {
    color: #2d4658;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.erp-shell .bill-cancel-required {
    padding: 2px 7px;
    border-radius: 10px;
    background: #f4e7e8;
    color: #9f3941;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.5;
    text-transform: uppercase;
}

.erp-shell textarea.bill-cancel-reason {
    display: block;
    width: 100% !important;
    min-height: 142px;
    padding: 11px 12px;
    border-radius: 8px;
    line-height: 1.5;
    resize: vertical;
}

.erp-shell .bill-cancel-field__footer {
    min-height: 20px;
    margin-top: 6px;
}

.erp-shell .bill-cancel-help {
    margin: 0;
    color: #71818d;
    font-size: 10px;
    line-height: 1.45;
}

.erp-shell .bill-cancel-validation {
    display: block;
    margin-top: 5px;
}

.erp-shell .bill-cancel-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 17px;
    padding-top: 15px;
    border-top: 1px solid #e1e8ec;
}

.erp-shell .bill-cancel-submit {
    min-width: 132px;
    border-radius: 6px;
    box-shadow: 0 4px 10px rgba(184, 59, 59, 0.16);
}

.erp-shell .bill-cancel-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(184, 59, 59, 0.22);
}

@media (max-width: 600px) {
    .erp-shell .bill-cancel-page {
        padding-top: 6px;
        padding-bottom: 18px;
    }

    .erp-shell .bill-cancel-hero {
        min-height: 82px;
        gap: 11px;
        padding: 15px;
        border-radius: 9px;
    }

    .erp-shell .bill-cancel-hero__icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        border-radius: 11px;
        font-size: 20px;
    }

    .erp-shell .bill-cancel-hero__title {
        font-size: 19px;
    }

    .erp-shell .bill-cancel-hero__subtitle {
        font-size: 11px;
    }

    .erp-shell .bill-cancel-card {
        margin-top: 10px;
        border-radius: 9px;
    }

    .erp-shell .bill-cancel-card__header {
        padding: 12px;
    }

    .erp-shell .bill-cancel-card__body {
        padding: 14px 12px;
    }

    .erp-shell .bill-cancel-notice {
        margin-bottom: 15px;
    }

    .erp-shell .bill-cancel-actions {
        margin-top: 14px;
        padding-top: 13px;
    }

    .erp-shell .bill-cancel-submit {
        width: 100%;
        min-width: 0;
        min-height: 42px;
    }
}

/* JournalCancel.aspx ----------------------------------------------------- */
.erp-shell .journal-cancel-expired {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-top: 14px;
    padding: 17px 18px;
    border: 1px solid #e7c6c8;
    border-radius: 10px;
    background: #fff5f5;
    box-shadow: 0 4px 14px rgba(104, 46, 50, 0.07);
    color: #6f3438;
}

.erp-shell .journal-cancel-expired__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #b83b3b;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1;
}

.erp-shell .journal-cancel-expired__title {
    margin: 0;
    color: #7f3036;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.erp-shell .journal-cancel-expired__text {
    margin: 3px 0 0;
    color: #765459;
    font-size: 11px;
    line-height: 1.5;
}

.journal-cancel-progress {
    position: fixed;
    z-index: 10000;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(18, 38, 51, 0.66);
    backdrop-filter: blur(2px);
}

.journal-cancel-progress.is-visible {
    display: flex;
}

.journal-cancel-progress__card {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    max-width: 290px;
    padding: 25px 22px 23px;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 18px 45px rgba(10, 28, 38, 0.28);
    color: #29465a;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    text-align: center;
}

.journal-cancel-progress__spinner {
    width: 38px;
    height: 38px;
    margin-bottom: 13px;
    border: 4px solid #dbe8ec;
    border-top-color: #237a86;
    border-radius: 50%;
    animation: journal-cancel-spin 0.75s linear infinite;
}

.journal-cancel-progress__title {
    color: #29465a;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
}

.journal-cancel-progress__text {
    margin-top: 4px;
    color: #6b7e8b;
    font-size: 11px;
    line-height: 1.45;
}

@keyframes journal-cancel-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .journal-cancel-progress__spinner {
        animation-duration: 1.5s;
    }
}

@media (max-width: 600px) {
    .erp-shell .journal-cancel-expired {
        gap: 10px;
        margin-top: 10px;
        padding: 14px 12px;
        border-radius: 9px;
    }

    .erp-shell .journal-cancel-expired__icon {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
        border-radius: 8px;
        font-size: 15px;
    }

    .journal-cancel-progress {
        padding: 14px;
    }

    .journal-cancel-progress__card {
        max-width: 270px;
        padding: 22px 18px 20px;
    }
}

@media print {
    .erp-shell { background: #ffffff; color: #000000; }
    .erp-shell #header_content_area,
    .erp-shell #menu_content_area,
    .erp-shell #footerarea { display: none; }
    .erp-shell .erp-content { min-height: 0; padding: 0; background: #ffffff; }
    .erp-shell .tbl_style,
    .erp-card,
    .erp-panel { box-shadow: none; }
}

/* 17. Responsive application extensions ---------------------------------- */
.erp-menu-toggle,
.erp-mobile-menu-header,
.erp-menu-overlay {
    display: none;
}

.responsive-grid-wrapper,
.erp-table-scroll,
.erp-grid-scroll,
.erp-horizontal-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #9aadb8 #eef3f5;
}

.responsive-grid-wrapper {
    margin: 8px 0 12px;
    border-radius: 5px;
}

.responsive-grid-wrapper:focus {
    outline: 2px solid #1f5f7a;
    outline-offset: 2px;
}

.responsive-grid-wrapper > table {
    width: max-content;
    min-width: 100%;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.erp-page-container,
.erp-form-section,
.erp-filter-panel,
.erp-search-panel,
.erp-data-panel,
.erp-summary-panel {
    width: 100%;
    min-width: 0;
}

.erp-form-section,
.erp-filter-panel,
.erp-search-panel,
.erp-data-panel,
.erp-summary-panel {
    margin-bottom: 12px;
    padding: 12px;
    border: 1px solid #d6e0e6;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(30, 53, 67, 0.08);
}

.erp-form-grid--2,
.erp-form-grid--3,
.erp-form-grid--4,
.erp-dashboard-grid,
.erp-summary-grid {
    display: grid;
    gap: 12px;
    align-items: start;
}

.erp-form-grid--2 { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
.erp-form-grid--3 { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
.erp-form-grid--4,
.erp-dashboard-grid,
.erp-summary-grid { grid-template-columns: repeat(4, minmax(160px, 1fr)); }

.erp-field-group {
    min-width: 0;
}

.erp-field-group > label,
.erp-field-label {
    display: block;
    margin-bottom: 4px;
    color: #334a5b;
    font-size: 12px;
    font-weight: 600;
}

.erp-field-group > input:not([type="checkbox"]):not([type="radio"]):not([type="image"]),
.erp-field-group > select,
.erp-field-group > textarea {
    width: 100%;
    max-width: 100%;
}

.erp-button-group,
.erp-toolbar,
.erp-action-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    min-width: 0;
}

.erp-toolbar,
.erp-action-bar {
    justify-content: space-between;
    margin-bottom: 10px;
}

.erp-tabs-scroll,
.erp-shell .ajax__tab_xp .ajax__tab_header {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}

.erp-card,
.erp-dashboard-card,
.erp-summary-card {
    min-width: 0;
    padding: 14px;
    border: 1px solid #d6e0e6;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(30, 53, 67, 0.08);
}

.erp-shell img:not([src*="spacer"]),
.erp-shell svg,
.erp-shell canvas,
.erp-shell video {
    max-width: 100%;
}

.erp-shell img:not([src*="spacer"]),
.erp-shell video {
    height: auto;
}

/*
 * GridView cells often contain legacy layout tables with action icons. Keep
 * those images at their intrinsic/declared width; a percentage max-width can
 * otherwise resolve to zero while the nested table is calculating its width.
 */
.erp-shell table.erp-gridview img:not([src*="spacer"]),
.erp-shell table.gvrowcolor img:not([src*="spacer"]),
.erp-shell table.erp-gridview-indian img:not([src*="spacer"]) {
    max-width: none;
}

.erp-shell iframe,
.erp-shell .erp-map,
.erp-shell .erp-chart {
    max-width: 100%;
}

.erp-shell .erp-content table,
.erp-shell .erp-content fieldset,
.erp-shell .erp-content .tbl_style {
    max-width: 100%;
}

.erp-shell .erp-content input:not([type="checkbox"]):not([type="radio"]):not([type="image"]):not([type="button"]):not([type="submit"]),
.erp-shell .erp-content select,
.erp-shell .erp-content textarea {
    max-width: 100%;
}

.erp-filter-panel,
.erp-search-panel {
    width: 100% !important;
}

.erp-shell .modalPopup,
.erp-modal {
    box-sizing: border-box;
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
    max-height: calc(100vh - 32px) !important;
}

.erp-shell .modalPopup > table,
.erp-modal > table {
    max-width: 100%;
}

.erp-shell .alertmsg,
.erp-shell .alertmsggst,
.erp-shell .successmsg,
.erp-shell .msgshow,
.erp-alert,
.erp-validation-summary,
.erp-shell [class*="validation-summary"] {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
}

@media (max-width: 1280px) {
    .erp-form-grid--4,
    .erp-dashboard-grid,
    .erp-summary-grid {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }
}

@media (max-width: 1024px) {
    .erp-menu-toggle {
        display: inline-flex;
        flex: 0 0 40px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin-right: 10px;
        padding: 0;
        border: 1px solid #c7d4dc;
        border-radius: 5px;
        background: #ffffff;
        color: #173f57;
        cursor: pointer;
    }

    .erp-menu-toggle__bar {
        display: block;
        width: 20px;
        height: 2px;
        margin: 2px 0;
        border-radius: 1px;
        background: currentColor;
    }

    .erp-shell #menu_content_area {
        position: fixed;
        top: 0;
        bottom: 0;
        left: -330px;
        z-index: 12000;
        display: block;
        width: 320px;
        max-width: 86vw;
        height: 100vh;
        min-height: 0;
        padding: 0;
        overflow-x: hidden;
        overflow-y: auto;
        border: 0;
        background: #173f57;
        box-shadow: 8px 0 24px rgba(14, 34, 46, 0.28);
        visibility: hidden;
        transition: left 0.22s ease, visibility 0.22s ease;
        -webkit-overflow-scrolling: touch;
    }

    .erp-shell.erp-menu-open #menu_content_area {
        left: 0;
        visibility: visible;
    }

    .erp-mobile-menu-header {
        position: sticky;
        top: 0;
        z-index: 3;
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 52px;
        padding: 8px 10px 8px 14px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.16);
        background: #12384f;
        color: #ffffff;
        font-size: 14px;
        font-weight: 600;
    }

    .erp-mobile-menu-close {
        width: 36px;
        height: 36px;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, 0.35);
        border-radius: 5px;
        background: transparent;
        color: #ffffff;
        font: 24px/30px Arial, sans-serif;
        cursor: pointer;
    }

    .erp-menu-overlay {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 11990;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        background: rgba(17, 31, 40, 0.54);
        cursor: pointer;
    }

    .erp-shell.erp-menu-open .erp-menu-overlay {
        display: block;
    }

    .erp-shell.erp-menu-open {
        overflow: hidden;
    }

    .erp-shell #smoothmenu1,
    .erp-shell #smoothmenu1 > ul {
        width: 100%;
    }

    .erp-shell #smoothmenu1 ul li {
        display: block;
        float: none;
        width: 100%;
    }

    .erp-shell #smoothmenu1 ul li a,
    .erp-shell #smoothmenu1 ul li a:link,
    .erp-shell #smoothmenu1 ul li a:visited {
        box-sizing: border-box;
        width: 100% !important;
        min-height: 42px;
        padding: 11px 38px 11px 14px !important;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        background: #173f57;
        color: #ffffff;
        line-height: 20px;
    }

    .erp-shell #smoothmenu1 ul li ul {
        position: static !important;
        top: auto !important;
        left: auto !important;
        display: none !important;
        width: 100% !important;
        max-width: none;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none !important;
        visibility: visible !important;
    }

    .erp-shell #smoothmenu1 ul li.erp-submenu-open > ul {
        display: block !important;
    }

    .erp-shell #smoothmenu1 ul li ul li a,
    .erp-shell #smoothmenu1 ul li ul li a:link,
    .erp-shell #smoothmenu1 ul li ul li a:visited {
        min-width: 0;
        min-height: 40px;
        padding-left: 28px !important;
        border-bottom-color: #d7e2e8;
        background: #edf3f6;
        color: #243f50;
    }

    .erp-shell #smoothmenu1 ul li ul li ul li a,
    .erp-shell #smoothmenu1 ul li ul li ul li a:link,
    .erp-shell #smoothmenu1 ul li ul li ul li a:visited {
        padding-left: 42px !important;
        background: #f7fafb;
    }

    .erp-shell #smoothmenu1 .downarrowclass,
    .erp-shell #smoothmenu1 .rightarrowclass {
        top: 15px !important;
        right: 14px !important;
    }

    .erp-form-grid--3,
    .erp-form-grid--4,
    .erp-dashboard-grid,
    .erp-summary-grid {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}

@media (max-width: 768px) {
    .erp-shell #header_content_area {
        flex-wrap: nowrap;
        min-height: 60px;
    }

    .erp-logo {
        max-width: 160px;
        height: auto;
        max-height: 30px;
    }

    .erp-header-user {
        min-width: 0;
        font-size: 11px;
    }

    .erp-header-user table,
    .erp-header-user tbody,
    .erp-header-user tr,
    .erp-header-user td {
        max-width: 100%;
    }

    .erp-form-grid--2,
    .erp-form-grid--3,
    .erp-form-grid--4,
    .erp-dashboard-grid,
    .erp-summary-grid {
        grid-template-columns: 1fr;
    }

    .erp-shell table.erp-form-table-pairs,
    .erp-shell table.erp-form-table-pairs > tbody,
    .erp-shell table.erp-form-table-pairs > tbody > tr {
        display: block;
        width: 100% !important;
    }

    .erp-shell table.erp-form-table-pairs > tbody > tr > td {
        display: block;
        width: 100% !important;
        padding: 4px 2px;
        text-align: left !important;
    }

    .erp-shell table.erp-form-table-pairs > tbody > tr > td:nth-child(3n+2) {
        display: none;
    }

    .erp-shell table.erp-form-table-pairs > tbody > tr > td.heading_text,
    .erp-shell table.erp-form-table-pairs > tbody > tr > td.lheading_text {
        padding-top: 9px;
        padding-bottom: 2px;
        text-align: left;
    }

    .erp-horizontal-scroll-table {
        display: block;
        width: 100% !important;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .responsive-grid-wrapper > table {
        min-width: 680px;
    }

    .erp-shell .erp-content input.field:not([type="checkbox"]):not([type="radio"]):not([type="image"]),
    .erp-shell .erp-content textarea.field,
    .erp-shell .erp-content select.drpfield,
    .erp-shell .erp-content select.drpsmallfield,
    .erp-shell .erp-content select.drpCurrfield,
    .erp-shell .erp-content select.tabdrpfield,
    .erp-shell .erp-content .erp-control {
        width: 100% !important;
        max-width: 100%;
    }

    .erp-shell .responsive-grid-wrapper input.field,
    .erp-shell .responsive-grid-wrapper textarea.field,
    .erp-shell .responsive-grid-wrapper select.drpfield,
    .erp-shell .responsive-grid-wrapper select.drpsmallfield,
    .erp-shell .responsive-grid-wrapper select.drpCurrfield,
    .erp-shell .responsive-grid-wrapper select.tabdrpfield,
    .erp-shell .responsive-grid-wrapper .erp-control {
        width: auto !important;
        max-width: none;
    }

    .erp-button-group,
    .erp-toolbar,
    .erp-action-bar,
    .erp-form-actions {
        align-items: stretch;
    }

    .erp-button-group > .btn,
    .erp-button-group > .nebtn,
    .erp-button-group > .cancelbtn,
    .erp-button-group > .editbtn,
    .erp-button-group > .updatebtn,
    .erp-button-group > .srchbtn,
    .erp-button-group > .deletebtn,
    .erp-button-group > .erp-button,
    .erp-form-actions > .btn,
    .erp-form-actions > .erp-button {
        flex: 1 1 140px;
    }

    .erp-shell .modalPopup,
    .erp-modal {
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100vh - 16px) !important;
    }

}

@media (max-width: 480px) {
    .erp-shell #header_content_area {
        padding-right: 8px;
        padding-left: 8px;
    }

    .erp-logo {
        max-width: 118px;
    }

    .erp-welcome-label {
        display: none;
    }

    .erp-header-user input[type="image"] {
        width: 32px;
        height: 32px;
    }

    .erp-shell .erp-content {
        padding: 7px;
    }

    .responsive-grid-wrapper > table {
        min-width: 600px;
    }

    .erp-form-section,
    .erp-filter-panel,
    .erp-search-panel,
    .erp-data-panel,
    .erp-summary-panel,
    .erp-card,
    .erp-dashboard-card,
    .erp-summary-card {
        padding: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .erp-shell #menu_content_area {
        transition: none;
    }
}

@media print {
    .erp-menu-toggle,
    .erp-mobile-menu-header,
    .erp-menu-overlay {
        display: none !important;
    }

    .responsive-grid-wrapper,
    .erp-table-scroll,
    .erp-grid-scroll,
    .erp-horizontal-scroll {
        overflow: visible;
    }

    .responsive-grid-wrapper > table {
        width: 100%;
        min-width: 0;
    }
}