/* ======================================================
   PlusCare Design Tokens — Dark Theme (VS Code-inspired)
   Matching agl_login.php design by Mellwvn
   ====================================================== */
:root {
  --pc-bg-page: #1e1e1e;
  --pc-bg-surface: #252526;
  --pc-bg-surface-alt: #2d2d30;
  --pc-bg-input: #1e1e1e;
  --pc-bg-input-focus: #1b1b1b;
  --pc-text-primary: #d4d4d4;
  --pc-text-secondary: #9f9f9f;
  --pc-text-heading: #e0e0e0;
  --pc-border: #3c3c3c;
  --pc-border-strong: #4d4d4d;
  --pc-accent: #007acc;
  --pc-accent-hover: #0a84ff;
  --pc-accent-active: #0064c8;
  --pc-error: #f48771;
  --pc-success: #4ec9b0;
  --pc-danger: #ff4757;
  --pc-warning: #dcdcaa;
  --pc-font: "Segoe UI", "Segoe UI Symbol", Arial, sans-serif;
}

@font-face {
    font-family: 'MuseoSans500Regular';
    src: url('fonts/MuseoSans_500-webfont.eot');
    src: url('fonts/MuseoSans_500-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/MuseoSans_500-webfont.woff') format('woff'),
         url('fonts/MuseoSans_500-webfont.ttf') format('truetype'),
         url('fonts/MuseoSans_500-webfont.svg#MuseoSans500Regular') format('svg');
    font-weight: normal;
    font-style: normal;

}
					
html, body {
	background-color: var(--pc-bg-page);
	margin:0;
	font: normal 11px var(--pc-font); text-indent:0pt; 
	word-spacing:0.2pt; letter-spacing:0.1pt;
	color: var(--pc-text-primary);
}

h1	{ font: bold 10pt var(--pc-font);
	margin-left:0pt; margin-top:0pt; margin-bottom:0pt; 
  	text-align:left; color: var(--pc-text-heading);
	}

h2	{ font: bold 16pt var(--pc-font);
	margin-left:0pt; margin-top:5pt; margin-bottom:0pt; letter-spacing:1pt; 
  	text-align:left; color: var(--pc-accent);
	}

h3	{ font: bold 10pt var(--pc-font); 
	text-align:center; color:#ffffff
	}


p	{ font: normal 9pt var(--pc-font); 
	color: var(--pc-text-primary); text-indent:0pt; 
    	line-height:11pt; word-spacing:0.6pt; letter-spacing:0.6pt; 
    	margin-top:5pt; margin-bottom:5pt; margin-left:0pt; margin-right:10pt 
	}


form {font: bold 11px var(--pc-font);
	margin-left:0px; margin-top:0px;
	}

label {
	color: var(--pc-text-primary);
	font-weight: bold;
	display: block;
	width: 130px;
	float: left;
	text-align:left;
	margin-bottom:-3px;
}
label:after { content: ": " }

label.type1 {
	color: var(--pc-text-secondary); 
	font: normal 11px var(--pc-font);
}

input.dialogbox{
	height:40px;
	font-family: var(--pc-font);
	font-size:15px;
	background-color: var(--pc-bg-input);
	border: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
	width:100%;
}

input.inbox{
	height:20px;
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border:0;
	border-bottom: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
	width:100%;
}
input.nobox{
	height:32px;
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
	width:100%;
}

input.outbox{
	height:25px;
	font-family: var(--pc-font);
	font-size:11px;
	background-color: var(--pc-bg-surface-alt);
	border:0;
	border:1px solid var(--pc-border);
	color: var(--pc-text-secondary);
	width:100%;
}

input.locked{
	height:20px;
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-surface-alt);
	border-top:transparent;
	border-left:0px;
	border-right:0px;
	border-bottom: 1px solid var(--pc-border);
	color: var(--pc-text-secondary);
}

textarea.inbox{
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
}

textarea.nobox{
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
}

select.inbox{
	height:24px;
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border:0px;
	border-bottom: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
}

select.nobox{
	height:32px;
	font-family: var(--pc-font);
	font-size:12px;
	background-color: var(--pc-bg-input);
	border: 1px solid var(--pc-border);
	color: var(--pc-text-primary);
	width:100%;
	padding-top:10px;
}

select.outbox{
	height:25px;
	font-family: var(--pc-font);
	font-size:11px;
	background-color: var(--pc-bg-surface-alt);
	border:0;
	border:1px solid var(--pc-border);
	color: var(--pc-text-secondary);
	width:100%;
}

A:link {text-decoration: none; color: var(--pc-accent);}
A:visited {text-decoration: none; color: var(--pc-accent);}
A:active {text-decoration: none; color: var(--pc-accent-hover);}
A:hover {text-decoration: underline; color: var(--pc-accent-hover);}

A.formbtn { 
  color:#FFFFFF; 
  font: bold 11px var(--pc-font); 
  background-color: var(--pc-accent);
  border:0px; 
  height:40px;
  margin-left:1px;
}

input.formbtn { 
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  background: var(--pc-accent);
  border:0px; 
  height:32px;
  float:right;
  margin-left:1px;
}

button.formbtn { 
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  background: var(--pc-accent);
  border:0px; 
  height:40px;
  float:right;
  margin-left:1px;
}

input.menubtn { 
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  background:transparent;
  border:0px; 
  height:32px;
  float:right;
  margin-left:1px;
}

button.menubtn { 
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  background:transparent;
  border:0px; 
  height:40px;
  float:right;
  margin-left:1px;
}

button.searchbtn { 
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  background: var(--pc-bg-surface-alt);
  border: 1px solid var(--pc-border);
  height:40px;
  float:right;
  margin-left:1px;
}

button.rowbtn { 
  color:#FFFFFF;
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  font: bold 11px var(--pc-font); 
  background: var(--pc-accent);
  border:0px; 
  height:22px;
  text-align:center;
}

button.panelbtn {
  color:#fff; 
  font: bold 11px var(--pc-font);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  width:100%;
  border:0px; 
  border-top:1px solid var(--pc-border);
  border-bottom:1px solid var(--pc-border-strong);
  height:40px;
  float:right;
  margin-left:1px;
  background: var(--pc-bg-surface-alt);
}

button.dialogbtn { 
  color:#FFF;
  background: var(--pc-accent);
  text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
  font: bold 12px var(--pc-font); 
  border:0px;
  height:48px;
  text-align:center;
}

button.tabSelected { 
  color:#FFFFFF; 
  font: bold 90% var(--pc-font); 
  background-color: var(--pc-bg-surface); 
  border:1px solid var(--pc-border); 
  border-bottom: 2px solid var(--pc-accent);
}

button.tabUnselected { 
  color: var(--pc-text-secondary); 
  font: bold 90% var(--pc-font); 
  background-color: var(--pc-bg-surface-alt); 
  border:1px solid var(--pc-border); 
}

.curvy {
height: 5em;
width: 12em;
border-radius: 1em 4em 1em 4em;
}

table {
	font-family: var(--pc-font);
	font-size: 11px;
	text-align: left;
	color: var(--pc-text-primary);
}
td {height:26px;}

table tr.datagrid_title td {
	padding: 4px;
	color: var(--pc-text-heading);
	background-color:transparent;
	font-family: var(--pc-font);
	font-size:22px;
	font-weight:600;
	border-bottom:1px solid var(--pc-border);
	height:30px;
}

table tr.datagrid_header td {
	padding: 5px;background-color: var(--pc-bg-surface-alt);color: var(--pc-text-primary);font-family: var(--pc-font);font-size:11px;font-weight:900;height:30px;
}
table tr.datagrid_white td {
	background-color: var(--pc-bg-surface);
	color: var(--pc-text-primary);
}
table tr.datagrid_trans td {
	background:transparent;
}
table tr.datagrid_black td {
	background-color: var(--pc-bg-surface-alt);
	color: var(--pc-text-primary);
	font-weight:bold;
}
table tr.datagrid_color td {
	background-color: var(--pc-bg-page);
}
table tr.datagrid_field td {
	height:18px;
	background: var(--pc-bg-surface-alt);
}

table.datagrid {	font-family: var(--pc-font);background-color: var(--pc-border);margin:0px 0pt 15px;font-size: 11px;width: 100%;text-align: left;border-spacing:1px;}
table.datagrid thead tr th {padding: 5px;background-color: var(--pc-bg-surface-alt);color: var(--pc-accent);font-family: var(--pc-font);font-size:11px;font-weight:500;height:30px;}
table.datagrid tfoot tr th {padding: 5px;background-color: var(--pc-bg-surface-alt);color: var(--pc-text-primary);font-family: var(--pc-font);font-size:11px;font-weight:600;border-bottom:1px solid var(--pc-border-strong);height:30px;}
table.datagrid tbody td {padding: 5px;background-color: var(--pc-bg-surface);color: var(--pc-text-primary);vertical-align: middle;height:30px;}
table.datagrid tr.datagrid_header td {padding: 5px;background-color: var(--pc-bg-surface-alt);color: var(--pc-text-primary);border-bottom:1px solid var(--pc-border);font-family: var(--pc-font);font-size:12px;font-weight:600;height:30px;}
table.datagrid tbody tr.datagrid_white td {background-color: var(--pc-bg-surface);}
table.datagrid tbody tr.datagrid_color td {background-color: var(--pc-bg-page);}
table.datagrid tbody tr.datagrid_total td {background-color: var(--pc-bg-surface-alt);font-weight:bold;}
table.datagrid tbody td.hilightgreen {background-color:#DCFFB1;color:#3C3C3C;}
table.datagrid tbody td.hilightred {background-color:#F4BCB5;color:#3C3C3C;}
table.datagrid tbody td.hilightblue {background-color:#C2D2F2;color:#3C3C3C;}
table.datagrid tbody td.hilightdarkblue {background-color:#ABC0CC;color:#3C3C3C;}
table.datagrid tbody td.hilightyellow {background-color:#FFFEA1;color:#3C3C3C;}
table.datagrid tbody td.hilightorange {background-color:#FFECA1;color:#3C3C3C;}
table.datagrid tbody td.disable {background-color: var(--pc-bg-surface-alt);}
table.datagrid tbody td.edit {text-align:center;width:40px;}
table.datagrid thead tr .headerSortDown, table.datagrid thead tr .headerSortUp {background-color: #264f78;}

table.form_container {
	font-family: var(--pc-font);
	font-weight:bold;
	background-color: transparent;
	margin:0px 0pt 0px;
	font-size: 11px;
	width: 100%;
	text-align: left;
	border-spacing:0px;
	border:0px;
}

table.form_container tr.datagrid_header td {
	padding: 4px;
	background-color: var(--pc-bg-surface-alt);
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:12px;
	font-weight:600;
	border-bottom:0.5px solid var(--pc-border);
	height:30px;
}

table.form_container thead tr th {
	padding: 4px;
	background-color:transparent;
	color: var(--pc-accent);
	font-family: var(--pc-font);
	font-size:12px;
	font-weight:600;
	border-bottom:1px solid var(--pc-border);
	height:30px;
}

table.form_container tfoot tr th {
	padding: 4px;
	background-color: var(--pc-bg-surface-alt);
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
	border-bottom:1px solid var(--pc-border);
	height:30px;
}

table.form_container tbody td {
	color: var(--pc-text-primary);
	padding: 4px;
	vertical-align: middle;
	height:30px;
}

table.form_container tr.datagrid_white td {
	color: var(--pc-text-primary);
	padding: 4px;
	background-color: var(--pc-bg-surface);
	vertical-align: middle;
	height:30px;
}

table.form_container tbody td.flabel {
	color: var(--pc-text-secondary);
	font-family:MuseoSans500Regular;
	width:150px;
	padding-right:10px;
	font-weight:normal;
}

table.form_container tbody td.hilightgreen {
	background-color:#DCFFB1;color:#3C3C3C;
}

table.form_container tbody td.hilightred {
	background-color:#F4BCB5;color:#3C3C3C;
}

table.form_container tbody td.hilightblue {
	background-color:#C2D2F2;color:#3C3C3C;
}

table.form_container tbody td.hilightyellow {
	background-color:#FFFEA1;color:#3C3C3C;
}


TD.rptHeader{
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
	border-bottom:1px dotted var(--pc-border);
}

.tool_bar, .tool_bar TD, .tool_bar TH
{
	text-align:right;
	color: var(--pc-text-secondary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:500;
	background-color: var(--pc-bg-surface-alt);
	height:56px;
	padding-top:7px;
	vertical-align:top;
}
.tool_option, .tool_option TD, .tool_option TH
{
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:500;
}

.skyhigh, .skyhigh TD, .skyhigh TH
{
	background-color: var(--pc-bg-surface);
	color: var(--pc-accent);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
}

.deepsea, .deepsea TD, .deepsea TH
{
	background-color: var(--pc-bg-surface-alt);
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
}
.day, .day TD, .day TH
{
	background-color:#F5DEA5;
	color:#4D4D4D;
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
	text-align:center;
}
.weekday, .weekday TD
{
	background-color:#C2D2E6;
	color:black;
	font-family: var(--pc-font);
	font-size:11px;
	text-align:center;
}

.weekend, .weekend TD
{
	background-color:#A2B3C7;
	color:black;
	font-family: var(--pc-font);
	font-size:11px;
	text-align:center;
}
.holiday, .holiday TD
{
	background-color:#393EE1;
	color:white;
	font-family: var(--pc-font);
	font-size:11px;
	text-align:center;
}
.peak, .peak TD
{
	background-color:#FFC0CB;
	color:black;
	font-family: var(--pc-font);
	font-size:11px;
	text-align:center;
}

td.fieldtitle { font:normal 11px var(--pc-font);
	word-spacing:0.2pt; letter-spacing:0.2pt; color: var(--pc-text-secondary); width: 150px;
}

.folio_subtotal, .folio_subtotal TD
{
	color: var(--pc-text-primary);
	background-color: var(--pc-bg-surface-alt);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
	text-align:right;
}

.flabel, .flabel TD, .flabel TH
{
	color: var(--pc-text-secondary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:500;
	text-align:left;
}

TD.flabel
{
	color: var(--pc-text-secondary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:500;
	text-align:left;
	width:150px;
}


#icon {
    font: bold 10pt var(--pc-font);
	text-align: right;
    width:600px;
    height:80px;
    position: absolute; top: 40px; right: 5px;
    margin-top:0px;
}

#page_title {
    font: bold 22px var(--pc-font);
    color: var(--pc-text-heading);
    position: absolute; top: 16px; left: 5px;
    float:left;
    margin-top:0px;
}

div.subform {
	position:absolute;
	top:20px;
	left:0;
	right:0;
	margin: 0 auto;
	width:900px;
	border:1px solid var(--pc-border);
	font-size: 10pt;
	visibility: visible; 
	font-family: var(--pc-font); 
	background-color: var(--pc-bg-surface); text-align: center;
}

div.dialog {
	border: 1px solid var(--pc-border);
	position:absolute;
	padding-right: 0px; 
	padding-left: 0px; 
	font-size: 10pt;
	visibility: visible; 
	width: 400px ;
	height: 280px;
	margin: -200px 0 0 -200px;
	left: 50%;
	top: 50%;
	padding-top: 0px; 
	font-family: var(--pc-font); 
	background-color: var(--pc-bg-surface); text-align: center;
}

div.dialogTitle {position:absolute;width:100%;height:100px;background-color: var(--pc-accent);text-align:center;color:#FFF;font:bold 18pt var(--pc-font);padding-top:20px;}
div.dialogForm {position:absolute;width:100%;height:100px;top:100px;text-align:center;color: var(--pc-text-primary);font-weight:bold;font-size: 12pt;font-family: var(--pc-font);padding-top:50px;}
div.dialogControl {position:absolute;width:100%;height:60px;bottom:10px;text-align:center;color:#FFF;font:bold 12pt var(--pc-font);padding-top:20px;}



div.mnavbtn { 
	position:absolute;width: 139px; height: 40px; padding: 0.5em;
	border: 1px solid var(--pc-border);
	box-shadow: 0 0 10px rgba(0,0,0,0.3);text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
}

div.mnavbtn p {
	color: var(--pc-text-primary);
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:700;
}

div.biwidget { 
	position:absolute;width: 360px; height: 250px; padding: 0.5em;
	border: 1px solid var(--pc-border);
	box-shadow: 0 0 10px rgba(0,0,0,0.3);text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
	padding-top:5px;
	text-align:left;
}

.col_option {
	position:absolute;
	display:none;
	top:40px;
	left:5px;
	width:200px;
	height:288px;
	background-color: var(--pc-bg-surface);
	border: 1px solid var(--pc-border);
}

.col_option .table_box {
	width:178px;
	height:220px;
	overflow-y:scroll;
	margin-top:10px;
	margin-left:10px;
	border:1px solid var(--pc-border)
}

.col_option .button_box {
	width:180px;
	height:50px;
	margin-top:10px;
	margin-left:10px;
}

#vertmenu {
font-family: var(--pc-font);
font-size: 120%;
width: 100%;
padding: 0px;
margin: 0px;
background-color:transparent;
}

#vertmenu h1 {
display: block;
background-color: var(--pc-bg-surface-alt);
height:18px;
color: #FFFFFF;
margin: 0px;
padding-top:11px;
padding-bottom:11px;
width:100%;
}

#vertmenu ul {
list-style: none;
margin: 0px;
padding: 0px;
border: none;
}
#vertmenu ul li {
margin: 0px;
padding: 0px;
}
#vertmenu ul li a {
font-size: 100%;
font-weight:bold;
display: block;
border-bottom: 1px solid var(--pc-border);
padding: 12px 2px 2px 4px;
text-decoration: none;
color: var(--pc-text-primary);
width:95%;
height:30px;
}

#vertmenu ul li a:hover, #vertmenu ul li a:focus {
color: #ffffff;
background-color: var(--pc-bg-surface-alt);
}

/* Module Main Navigation */

.frameclass {
	position: fixed;
	left: 240px;
	top: 0px;
	width: calc(100% - 240px);
	height:100%;
	border:0;
	z-index:101;
}

#dockarea {
	position:fixed;
	left:240px;
	bottom:0px;
	width:calc(100% - 240px);
	height:28px;
}

.wrapper {
	position:absolute;
	top:56px;
	left:0px;
	overflow: hidden;
	width:240px;
	display:none;
	padding-left:10px;
	padding-right:10px;
	background-color: var(--pc-bg-surface-alt);
}

div.navtitle {
	position:relative;
	float:left;
	height: 70px;
	width:220px;
	color: var(--pc-accent);
	border-bottom:1px solid var(--pc-accent);
	padding-top:30px;
	padding-left:7px;
	font-family:"MuseoSans500Regular","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:1.5em;
	font-weight:500;
}

div.navbtn {
	padding: 0.5em;
	text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);
	padding-top:5px;
	text-align:left;
	position:relative;
	float:left;
	height: 60px;
	width:220px;
	border-bottom:1px solid var(--pc-border);
	color:#FFFFFF;
	background: var(--pc-bg-surface-alt);
}

div.navbtn p {
	color:#FFF;
	font-family: var(--pc-font);
	font-size:11px;
	font-weight:600;
}

div.navbtn p.counter {	text-align:right;font:bold 18px var(--pc-font);color:#FFFF00;}

div.navbtn .minitoolbar {
	position:absolute;display:none;
	top: 12px; left: 173px; right: 0;
	width:50px;height:40px;background-color: var(--pc-bg-surface-alt)}

div.navbtn .minitoolbar button {height:100%;width:50px;border:0;background:transparent}

div.navbtn div.contentbox {
	position:absolute;
	top: 16px; left: 173px; right: 0;
	width:50px;
	height:29px;
	padding-top:7px;
	text-align:center;
	color: var(--pc-success);
	font-size:12px;
	font-weight:500;
	text-shadow:0 1px 1px rgba(0, 0, 0, 0.5);
}
div.navbtn div.textbox {
	position:absolute;
	left:0px;
	top:0px;
	padding-top:10px;
	padding-left:7px;
	width:180px;
	height:60px;
	text-align:left;
	font-size:11px;
	font-weight:500;
	text-shadow:0 1px 1px rgba(0, 0, 0, 0.5);
}

div.navbtn div.subbox {
	color: var(--pc-success);
}

div.navbtn div.selected {
	color:#FFCB00;
}

div.navbtn p.counter {
	position:absolute;
	left:160px;
	top:0px;
	font:bold 12px var(--pc-font);
}
		
#panelbg {
	position:absolute;
	left:0px;
	top:0px;
	width: 240px;
	height: -moz-calc(100%);
	height: -webkit-calc(100%);
	height: calc(100%);
	background-color: var(--pc-bg-surface-alt);
	
	/*z-index:-1;*/
}

.panelmenu {width:100%}
.panelmenu ul{list-style: none;border-bottom:1px solid var(--pc-border);padding: 0;margin:0;list-style-type: none;text-align:left;}
.panelmenu li {
	list-style-type: none;
	float:left;
	background: var(--pc-bg-surface-alt);
	font-family:"MuseoSans500Regular","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:1.0em;
	font-weight:500;
	padding:12px 0px 5px 16px;
	border-top:1px solid var(--pc-border);
	border-bottom:1px solid #1e1e1e;
	text-decoration:none;
	text-shadow:0 -1px 2px #111;
	color:#FFFFFF;
	line-height:32px;
	width:60px;
}

.panelmenu li.menu {
	background: var(--pc-bg-surface-alt);
	font-family:"MuseoSans500Regular","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:1.0em;
	font-weight:500;
	
}

.panelmenu li.subtitle {
	background: var(--pc-bg-page);
	font-family:"MuseoSans500Regular","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:1.5em;
	font-weight:700;
	display:block;
	padding:0.2em 5%;
	border-top:1px solid var(--pc-border);
	border-bottom:1px solid #1e1e1e;
	text-decoration:none;
	text-shadow:0 -1px 2px #111;
	color:#FFFFFF;
	line-height:38px
}

.panelmenu li.menu:hover,.panelmenu li.menu:focus{
	background: var(--pc-accent);
}

.panelmenu li.curr{
	background: var(--pc-accent);
}

.panelmenu img {
	width:24px;
	height:24px;
}

/* Modern Login Page Styles */
.login-container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 20px;
    background: transparent;
    margin: 0;
}

.login-card {
    background: var(--pc-bg-surface);
    border: 1px solid var(--pc-border);
    box-shadow: none;
    width: 100%;
    max-width: 520px;
    padding: 36px;
    margin: 0;
}

.login-header {
    text-align: center;
    margin-bottom: 28px;
}

.login-header h1 {
    color: var(--pc-text-primary);
    font-size: 28px;
    font-weight: 700;
    margin: 0;
    letter-spacing: -0.5px;
	text-align: center;
}

.login-header p {
    color: var(--pc-text-secondary);
    font-size: 16px;
    margin-top: 8px;
    font-weight: 400;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    color: var(--pc-text-primary);
    font-size: 13px;
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--pc-border);
    font-size: 14px;
    transition: border-color 0.15s ease;
    background-color: var(--pc-bg-input);
    color: var(--pc-text-primary);
    height: 42px;
    box-sizing: border-box;
}

.form-group input:focus,
.form-group select:focus {
    outline: none;
    border-color: var(--pc-accent);
    background-color: var(--pc-bg-input-focus);
}

.form-group input::placeholder,
.form-group select::placeholder {
    color: var(--pc-text-secondary);
}

.login-button {
    width: 100%;
    padding: 12px 14px;
    background: var(--pc-accent);
    color: #ffffff;
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease;
    margin-top: 10px;
    min-height: 42px;
    appearance: none;
    -webkit-appearance: none;
}

.login-button:hover {
    background: var(--pc-accent-hover);
}

.login-button:active {
    background: var(--pc-accent-active);
}

.login-options {
    text-align: center;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid var(--pc-border);
}

.login-options p {
    color: var(--pc-text-secondary);
    font-size: 14px;
    margin-bottom: 16px;
}

.login-options a {
    color: var(--pc-accent);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.15s ease;
}

.login-options a:hover {
    text-decoration: underline;
    color: var(--pc-accent-hover);
}

.sso-button {
    display: inline-block;
    width: auto;
    min-width: 240px;
    padding: 12px 14px;
    background: var(--pc-accent);
    color: #ffffff;
    border: 1px solid transparent;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.15s ease;
    margin-bottom: 16px;
    text-align: center;
    text-decoration: none;
    min-height: 42px;
    line-height: 42px;
    appearance: none;
    -webkit-appearance: none;
}

.sso-button:hover {
    background: var(--pc-accent-hover);
    color: #ffffff;
}

.sso-button:active {
    background: var(--pc-accent-active);
}

/* Responsive Design */
@media (max-width: 768px) {
    .login-card {
        padding: 30px 20px;
        margin: 10px;
    }
    
    .login-header h1 {
        font-size: 24px;
    }
    
    .login-header p {
        font-size: 14px;
    }
    
    .form-group input,
    .form-group select {
        padding: 10px 12px;
        font-size: 14px;
    }
    
    .login-button,
    .sso-button {
        padding: 12px;
        font-size: 14px;
    }
}

/* Accessibility improvements */
.login-card:focus-within {
    outline: 2px solid var(--pc-accent);
    outline-offset: 2px;
}

/* Form validation states */
.form-group.error input,
.form-group.error select {
    border-color: var(--pc-danger);
}

.form-group.success input,
.form-group.success select {
    border-color: var(--pc-success);
}

/* Loading state */
.login-button.loading {
    opacity: 0.7;
    cursor: not-allowed;
}

/* SSO section styling */
.sso-section {
    background: var(--pc-bg-surface);
    border: 1px solid var(--pc-border);
    box-shadow: none;
    padding: 30px;
    margin: 20px 0;
    text-align: center;
}

.sso-section h3 {
    color: var(--pc-text-primary);
    font-size: 20px;
    margin-bottom: 20px;
    font-weight: 600;
}

.sso-section p {
    color: var(--pc-text-secondary);
    font-size: 14px;
    margin-bottom: 20px;
    line-height: 1.5;
}

/* Tab navigation styling */
.tab-navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 24px;
    gap: 8px;
}

.tab-button {
    padding: 12px 18px;
    margin: 0;
    background: var(--pc-bg-surface-alt);
    border: 1px solid var(--pc-border);
    color: var(--pc-text-primary);
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    font-size: 14px;
}

.tab-button.active {
    background: var(--pc-bg-surface);
    border-bottom: 2px solid var(--pc-accent);
    color: #ffffff;
}

.tab-button:hover:not(.active) {
    background: #303033;
}

/* Form layout adjustments */
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.form-grid .form-group {
    margin-bottom: 0;
}

/* Footer links */
.login-footer {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.login-footer a {
    color: var(--pc-text-secondary);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
}

.login-footer a:hover {
    color: #ffffff;
    text-decoration: underline;
}

/* Animation for form elements */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Focus states for accessibility */
input:focus,
select:focus,
button:focus {
    outline: 2px solid var(--pc-accent);
    outline-offset: 2px;
}

/* ============================================
   DARK THEME GLOBAL OVERRIDE — Added for consistency
   Applied last to override any remaining light values
   ============================================ */

/* Page backgrounds */
body, html,
#content, #main, #workspace,
.content-area, .workspace, .main-content,
div[id*="content"], div[id*="workspace"],
div[id*="main"], div[id*="body"] {
	background-color: #1e1e1e !important;
	background-image: none !important;
	color: #d4d4d4 !important;
}

/* Remove any remaining background images (often source of blue gradient) */
body {
	background-image: none !important;
	background: #1e1e1e !important;
}

/* Toolbar areas */
.tool_bar, .toolbar, [class*="toolbar"],
.header_bar, [class*="headerbar"] {
	background-color: #2d2d30 !important;
	background-image: none !important;
	border-color: #3c3c3c !important;
}

/* Table cells catch-all */
td, th {
	border-color: #3c3c3c !important;
}

/* Force legacy datagrids and presentational bgcolor tables to dark */
table, table tr, table td, table th,
table.datagrid tr td,
.datagrid_header td,
.datagrid_subheader td {
	background-color: #252526 !important;
	color: #d4d4d4 !important;
	border-color: #3c3c3c !important;
}

.datagrid_body td,
.datagrid_alt td {
	background-color: #1e1e1e !important;
}

tr:hover td {
	background-color: #2d2d30 !important;
}

/* ================================================
   TABLE BORDER SYSTEM — Dark Theme
   Applied globally to ensure all tables are readable
   ================================================ */

/* Base table: always collapsed borders */
table {
	border-collapse: collapse !important;
	border-spacing: 0 !important;
}

/* ALL td and th get borders */
td, th {
	border: 1px solid #3c3c3c !important;
	padding: 4px 8px !important;
}

/* Datagrid header — accent top border, slightly lighter background */
table.datagrid th,
.datagrid_header td,
.datagrid_header th,
td.datagrid_header,
th.datagrid_header {
	background-color: #2d2d30 !important;
	color: #d4d4d4 !important;
	border: 1px solid #3c3c3c !important;
	border-bottom: 2px solid #007acc !important;
	font-weight: 600 !important;
}

/* Datagrid body rows */
.datagrid_body td,
tr.datagrid_body td {
	background-color: #1e1e1e !important;
	color: #d4d4d4 !important;
	border: 1px solid #3c3c3c !important;
}

/* Alternating rows */
.datagrid_alt td,
tr.datagrid_alt td,
tr:nth-child(even) td {
	background-color: #252526 !important;
	color: #d4d4d4 !important;
	border: 1px solid #3c3c3c !important;
}

/* Row hover */
table.datagrid tr:hover td,
tr.datagrid_body:hover td,
tr.datagrid_alt:hover td {
	background-color: #2d2d30 !important;
	border-color: #007acc !important;
}

/* Subheader rows (group headers within table) */
.datagrid_subheader td,
td.datagrid_subheader {
	background-color: #252526 !important;
	color: #9f9f9f !important;
	border: 1px solid #3c3c3c !important;
	font-size: 10px !important;
}

/* Selected row */
.datagrid_selected td,
tr.datagrid_selected td {
	background-color: #0064c8 !important;
	color: #ffffff !important;
	border-color: #007acc !important;
}

/* Form container tables (used in detail forms) */
table.form_container td,
table.form_container th {
	border: 1px solid #3c3c3c !important;
	background-color: #1e1e1e !important;
	color: #d4d4d4 !important;
}

/* Field title cells */
td.fieldtitle,
.fieldtitle {
	color: #9f9f9f !important;
	background-color: #252526 !important;
	border: 1px solid #3c3c3c !important;
	font-weight: 600 !important;
}

/* Status highlight cells — keep functional colors but ensure they have borders */
td.hilightgreen  { border: 1px solid #3c3c3c !important; }
td.hilightred    { border: 1px solid #3c3c3c !important; }
td.hilightblue   { border: 1px solid #3c3c3c !important; }
td.hilightyellow { border: 1px solid #3c3c3c !important; }
td.hilightorange { border: 1px solid #3c3c3c !important; }

/* ================================================
   INPUT FIELDS — Dark Theme Consistency
   Ensures all form inputs match dark theme
   ================================================ */

input[type="text"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="date"],
input.inbox,
input.outbox,
input.nobox,
input.locked,
textarea.inbox,
textarea.nobox,
select.inbox,
select.outbox,
select.nobox {
	background-color: #1e1e1e !important;
	color: #d4d4d4 !important;
	border: 1px solid #3c3c3c !important;
	padding: 4px 6px !important;
}

/* Focused state */
input[type="text"]:focus,
input.inbox:focus,
select.inbox:focus,
textarea.inbox:focus {
	background-color: #1b1b1b !important;
	border-color: #007acc !important;
	outline: none !important;
	color: #d4d4d4 !important;
}

/* Disabled/readonly fields */
input.locked,
input[readonly],
input[disabled] {
	background-color: #2d2d30 !important;
	color: #9f9f9f !important;
	border-color: #3c3c3c !important;
	cursor: not-allowed !important;
}

/* Checkboxes — ensure visible on dark bg */
input[type="checkbox"] {
	accent-color: #007acc !important;
	width: 14px !important;
	height: 14px !important;
}
