/**********************************
Name: cmxform Styles - Optimized
***********************************/
form.cmxform {
    font-size: 13px;
    color: #333;
    max-width: 100%;
}
form.cmxform legend {
    width: 100%;
    background: url(images/line_horizontal.png) left bottom no-repeat;
    padding: 10px 10px 20px 0px;
    font: bold 15px Arial, sans-serif; 
    color: #0449ac;
}
form.cmxform legend a {
    font: bold 14px Arial, sans-serif; 
    color: #0449ac;
}
form.cmxform legend a:hover {
    color: #000;
}
form.cmxform label {
    font-weight: bold;
    width: 140px;
    display: inline-block;
    line-height: 1.8;
    vertical-align: top;
    color: #333;
}
.ico_information, .pst_info {
    padding: 5px 5px 5px 20px; 
    background: url(images/ico_infomation.png) left center no-repeat;
}
.pst_info { background-position: 0px 4px; }
form.cmxform fieldset { border: none; }
form.cmxform input.submit {
    width: 140px; height: 35px; 
    background: #004F8A; /* Chuyển sang màu CSS thay vì dùng ảnh để load nhanh hơn */
    border: none; border-radius: 4px;
    text-align: center; font: bold 13px Tahoma; color: #fff; 
    text-transform: uppercase; cursor: pointer;
    transition: background 0.3s;
}
form.cmxform input.submit:hover { background: #f9a503; color: #fff; }
form.cmxform fieldset fieldset { background: none; }
form.cmxform fieldset p, form.cmxform fieldset fieldset { padding: 3px 10px 5px; }
form a { color: #006599; text-decoration: none; }
form .pad_L { padding-left: 153px; color: #000; }

/* Tối ưu hiển thị lỗi (Validation) */
#signupForm label.error, #doimatkhau label.error, #quenmatkhau label.error, #update_info label.error {
    display: inline-block;
    margin-left: 10px;
    width: auto;
}
form.cmxform label.error, label.error {
    color: #e74c3c;
    font-style: italic;
    text-align: left;
    font-weight: normal;
    font-size: 12px;
}
div.error { display: none; }

/* Tối ưu Input cho Responsive */
input[type="text"], input[type="password"], input[type="email"], select, textarea {
    border: 1px solid #bababa; 
    border-radius: 3px;
    width: 100%; 
    max-width: 250px; 
    font-size: 13px;
    padding: 6px 8px;
    box-sizing: border-box;
}
select.sel_date { max-width: 80px; }
input.checkbox { border: none; width: 14px; height: 14px; vertical-align: middle; }
textarea { max-width: 350px; height: 80px; font-family: Arial, sans-serif; resize: vertical; }
input.radio { border: none; width: 15px; height: 12px; }

input:focus, select:focus, textarea:focus { border-color: #0098fe; box-shadow: 0 0 5px rgba(0,152,254,0.3); outline: none; }
input.error, select.error { border-color: #e74c3c; background-color: #fdf0ed; }
form.cmxform .gray * { color: gray; }