/*
// ============================================================================
// Project : 普羅米修斯工作室
// File    : admin.css
// Author  : 林文川 <steven_lin@outlook.com>
// Created : 2024年3月29日 下午8:51:30
// ============================================================================/* 
Created on : 2024年3月29日, 下午8:51:30
Author     : stevenlin
*/

html, body {
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    background-color: #fafafa ;    
}

table {
    width: 100% ;
}

td {
    vertical-align: middle !important;
}

div {
    margin: 0px;
    padding: 0px;
}

textarea {
    width: 100%;
    height: 100px;
    resize: none ;
    border-radius: 4px;    
}

INPUT[type="text"], INPUT[type="password"] {
    border:solid 1px silver;
    outline:solid 0px black;
    background-color: white;
    width:100%;
    height: 28px;
    color:black;
    border-radius: 4px;    
}

INPUT[type="text"]:focus, INPUT[type="password"]:focus {
    border:solid 1px blue;
    outline:solid 0px black;
    background-color: #d8ecf0;
    color:black;
}

INPUT[type="text"].Number {
    width: 100px !important;
    text-align: right;
    padding-right: 5px;	
}

INPUT[type="text"].Numeric {
    width: 100px !important;
    text-align: right;
    padding-right: 5px;	
}

INPUT[type="text"].Date {
    width: 100px !important;
}


INPUT[type="text"].IDCode {
    width: 200px !important;
}

INPUT[type="text"].AsNumberLabel {
    padding-right: 5px;	
    border-width: 0px;
    text-align: right;
    width: 80px !important;
    background-color:white;
}

INPUT[type="text"].AsNumberLabel:focus {
    border-width: 0px;
    background-color: white;
    color: black;
}

INPUT[type="text"].AsLabel {
    background-color: white;
    border-width: 0px;
}

INPUT[type="text"].AsLabel:focus {
    border-width: 0px;
    background-color: white;
    color: black;
}


SELECT {
    -webkit-appearance: menulist-button;
    font-size:11pt;
    width:100%;
    height:28px;
    color:black;
}

SELECT.Year, SELECT.Month, SELECT.Day, SELECT.Date {
    width:80px;
}

select::-moz-focus-inner { /*Remove button padding in FF*/ 
    border: 0;
    padding: 0;
}


SELECT.Region1, SELECT.Region2 {
    width:100px;
}

SELECT.DataSelector {
    width: 100%; 
    height: 100%; 
    background-color: #FFF8DC;
    line-height:40px !important;
}

OPTION {
    padding:1px 0;
}

A { 
    text-decoration: none; 
}

.Disabled {
    background-color:#e9eef3 !important;
    color:gray !important;	
}


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

div #Container {
    width: 100%; 
    height: 100%;
    padding: 0px; 
    background-color: #fafafa ;    
}

table#TopMenu {
    background-color: #2e8893;
    width: 100%;
    height: 100%;
    margin: 0px;
    font-size: 12pt;
}

table#TopMenu td {
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
}

table#TopMenu td.Logout {
    width: 120px;
    font-size: 12pt ;
    color: white;
    text-align: right;
    padding-right: 20px;
}

table#TopMenu td:hover {
    color: yellow;
    cursor: pointer ;
}



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

div#GridHead {
    background-color: #fafafa ;    
}

table#GridPager {
    height: 40px !important;
}

table#GridQuery {
}

table#GridPager td.Title {
    font-size: 16pt ;
    font-weight: bold ;
    text-align: left ;    
    padding-left: 10px;
}

table#GridPager td.Pager {
    padding: 0px;
    padding-right: 20px;
    text-align: right ;
    vertical-align: top;
    width: 500px;
}

div#GridHead {
}

table#GridQuery {
    margin-bottom: 10px;
}

table#GridQuery td.HeadButton {
    width: 70px;
}

table#GridQuery button {
    height: 26px !important;
    line-height: 10px !important;
}

table#GridQuery td.RecordCount {
    width: 170px;
    font-family: "Arial";
    font-size: 11pt ;
    font-weight: bold ;
    text-align: left ;
    padding-left: 10px;
    color: maroon ;
}

table#GridQuery table.QuerySection {
    margin: 0 auto;
    width: 400px;
}

table.QuerySection td.QueryLabel {
    width: 80px;
    font-size: 11pt;
    text-align: right;
}

table.QuerySection td.QueryField {
    width: 100px;
}

table.QuerySection td.QueryValue {
    margin-left: 5px;
    margin-right: 5px;
    padding-left: 5px;
    padding-right: 10px;
}

table.QuerySection td.QueryButton {
    width: 64px;
}

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

div#FormHead {
    height: 100px;
}

div#FormHead td.Title{
    font-size: 16pt ;
    font-weight: bold ;
    color: navy ;
    padding-left: 10px;
}

div#FormHead td.Hint {
    font-size: 10pt ;
    text-align: right ;
    padding-right: 10px;
    color: brown ;
}

div#formContainer {
    margin: 10px;
}

div#formContainer td {
    border: 1px solid #cdcdcd;    
    height: 30px;
}


div#formContainer td.Caption {
    width: 100px;
    font-size: 11pt ;
    font-weight: bold ;
    text-align: right ;
}

div#formContainer td.Nullable {
    color: silver !important;
}

div#ProgressView {
    position: absolute ;
    top: 20px ;
    left: 70px ; 
    width: 160px;
    heught: 160px;
    z-index: 999 ;
    background-color: transparent ; /* rgba(0,0,0, 0.3) ;*/
}

div#ProgressOverlay {
    position: absolute;
    top: 0 ;
    left: 0 ;
    width: 300px; 
    height: 200px;
    opacity: 1 ;
    cursor: zoom-in ;
    background-color: rgba(0,0,0,.5) ;
    -webkit-transition: .3s ;
    transition: .3s ;        
    z-index: 99 ;
}

/*
//=============================================
//
//=============================================
*/
div#GridBody {
    background-color: white ;
    margin-left: 10px; margin-right: 10px;
}

div#GridBody td {
    border: 1px solid #cdcdcd;    
}

div#GridBody tr.GridHeader {
    font-size:11pt ;
    font-weight: bold ;
    text-align: center ;
    background-color: #eeeeee !important;
}

div#GridBody .Button {
    width: 50px;
    padding:2px;
}

div#GridBody button {
    width:100%;
}

div#GridBody td.MOBILE {
    width: 120px;
}

div#GridBody td.NUMERIC {
    width: 100px;
    text-align: right ;
    padding-right: 5px;
}

div#GridBody td.CURRENCY {
    width: 100px;
    text-align: right ;
    padding-right: 5px;
}

div#GridBody td.STATE {
    width: 70px;
    text-align: center ;
}

div#GridBody td.DISTRICT {
    width: 180px;
}

div#GridBody td.REALNAME {
    width: 90px;
}

div#GridBody font.ONLINE {
    color: dodgerblue;
}

div#GridBody font.OFFLINE {
    color: firebrick;
}

div#GridBody td.DATE {
    width: 90px;
    text-align: center ;
}

div#GridBody td.INDEX {
    width: 40px;
    text-align: right ;
    font-weight: bold ;
    color: maroon ;
}