/*
TestLink Open Source Project - http://testlink.sourceforge.net/
@filesource testlink.css

Purpose: Default TestLink CSS

*/

/* ***** GLOBAL HTML ***************************************************************** */
body, body.testlink {
	background:  	#EEE!important; 
	font-family: 	'Trebuchet MS', Arial, Verdana, sans-serif;
	font-size: 		small;
	margin:			0px;
	padding:		0px;
}

/** 
use together with #header-wrap, to create a section on top of body
that remain always visible while rest of body content scrolls,
giving visual experience that body goes under the section on top
*/
body.fixedheader {
	padding-top:	120px !important;
	padding-top:	0; /* IE 6 does not understand fixed */
}

img {
	border: 		none;
}

pre
{
	font-family : 	Arial, Helvetica, sans-serif;
}

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

/* h1.title - To avoid problems with ext js css */
/* 20080529 - franciscom - font-size reduced */
h1, h1.title {
	background:		#059;
	border: 		1px solid black;
	color:			white;
	margin:			0px 0px 4px 0px;
	padding: 		3px;
	text-align: 	left;
	font-size:		85%;
	font-weight:    bold;
}


h2 {
	font-size:		110%;
	font-weight:    bold;
}

h3, h3.testlink {
	font-size:		105%;
	margin-bottom:	2px;
	padding: 		2px;
}

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

/* 20100225 - eloff - BUGID 3217 - Ext removes bullets from all lists, re-add bullets to our lists */
.workBack ol {
    margin: 1em 40px;
    list-style-type: decimal;
}
.workBack ul {
    margin: 1em 40px;
    list-style-type: disc;
    list-style-position: outside;
}

/* ***** Links ***** */
/* A Visited link is still blue, except if class is btn-primary from bootstrap */

a:not(.btn-primary){
	color: 			#059;
	text-decoration: none;
}

/* A link being hovered over is red*/
a:hover   {
	color: 			#900;
	text-decoration: none;
}

/* ***** Menu bar specific ******************************************* */
div.menu_title {
	margin-left:	135px;
	padding:		3px;
}

div.menu_bar {
	background: 	#CDE;
	background-image: url(../images/navbar.gif);
	border-style:	groove;
	border-width:	thin;
	padding: 		1px 5px;
	margin:			0px 3px;
	
}

select.menu_combo {
	background: 	#EEE;
	border-style:	none;
	font-size:	 	smaller;
	font-weight:    bold;
}


/* ***** Main page specific ***************************************** */

div.testproject_title{
	background:		#059;
	border: 		1px solid black;
	color:			white;
	font-size:		110%;
	padding: 		2px;
}



/* **** general classes ************************************* */

/** 
use together with body.fixedheader, to create a section on top of body
that remain always visible while rest of body content scrolls,
giving visual experience that body goes under the section on top.

Added z-index to solve issue regaring content generated by EXT-JS library
present on page (example grid())

On chrome seems not work
*/
#header-wrap {
	background:		#eee;
	border-bottom:	1px solid #000;
	height: 100px;
	position: fixed;
	top:  0;
	width:  100%;
	z-index:  999;
}

/* background for working area (tables and forms) */
div.workBack {
	text-align: 	left;
	margin: 		3px;
	background: 	#CDE;
	padding: 		3px 3px 50px 3px;
	border-style:	groove;
	border-width:	thin;
}

/* .label is used to magnify label for active objects */
.bold, .label {
	font-weight:    bold;
}

.italic {
	font-style: 	italic;
}

.onright {
	float: 			right;
}

span.form_label {
	font-weight:    bold;
	width:			200px; 
	float:			left;
}

/* **** Navigation, menu and buttons ************************************* */

/* for tree menu */
div.tree {
	background: 	#EEE;
	padding: 		3px;
	border: 		1px solid #808080;
	margin:			3px;
	overflow: 		auto; /* BUGID: SF1243287 */
}

div.groupBtn {
	padding:		5px;
}

div.vertical_menu {
	background: 	#EEE;
	font-size:      90%;
	margin: 		3px;
	padding: 		2px;
	padding-bottom:	1px;
	width:			300px;
}

div.vertical_menu h2 {
	background:     #FFC;
	border-style:	none;
	color:			black;
	font-weight:    bold;
}

div.vertical_menu a {
	font-weight:    normal;
}

div.menu_bubble {
  background:		#c8dce8;
  padding:			3px;
}

div.menu_bubble h3{
	margin: 0px 0px 8px 8px;
	line-height:1.4em;
}

/** Buttons
 * Give buttons, submit, reset a gradient 3d look and other components
 * text/password-input, textarea and select a flat appearance.
 */
input[type="button"],
input[type="password"],
input[type="reset"],
input[type="submit"],
input[type="text"],
select,
textarea,
button {
   background: url(../images/navbar.gif);
   background-position: 0 0;
   border: 1px solid #888;
   margin: 4px 0 0 0;
   font-size: 9pt;
   color: black;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
}

/* Reset to flat background */
input[type="password"],
input[type="text"],
select,
textarea {
	background: #f8f8f8;
}


/* Animate */
input[type="reset"]:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover {
   background-position: 0 -3px;
   border-color: #444;
}

input[type="reset"]:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
button:active,
button:focus {
   background-position: 0 -10px;
   border: 1px solid #123;
}

input[type="password"]:focus,
input[type="text"]:focus,
select:focus,
textarea:focus {
	background: #fff;
	border: 1px solid #123;
}

fieldset.groupBtn {
	border: 0;
	margin-left: 5px;
	padding: 0 0 0.5em 1em;
}

fieldset.groupBtn h2 {
	font-size: 10pt;
	display: block;
	margin: 0 0 0 -1em;
	padding: 0;
}
fieldset.groupBtn form {
	display: inline;
}

/* ***** Help ***************************************************************************
 * This allows link help from text e.g. instruction
 * Using: <span class="help" onclick="javascript:open_popup('../help/glosary.html#testspec');">
 * 			Test Specification</span>
 */
img.help {
	vertical-align: top;
	float:			right;
}
span.help
{
	cursor: 		help;
	text-decoration: underline;
}

#tlhelp {
	position: 		absolute; 
	z-index:		100; 
	padding:		5px; 
	right:			50px; 
	top:			50px; 
	width: 			500px; 
	height:			auto;
	background: 	#059;
	color:			white;
	font-size:		80%; 
	border: 		medium solid #808080;
}

#tlhelp h2 {
	font-weight: bold;
	font-size: 120%;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #aaa;
}

#tlhelp p {
	margin: 0 0 1em 0.5em;
}


/* ***** Messages ******************************************************* */
/* show results of SQL actions or important information for user */
.error, .info, .warning, div.user_feedback {
	font-size:		110%;
	text-align:		center;
	font-weight:    bold;
	padding: 		3px;
}

.tab-error, .tab-warning, .tab-success{
	text-align:		left;
	font-weight:    bold;
}


.error, .tab-error {
	color:			#B22222; /* firebrick (red) */
}

.warning, .tab-warning {
	color:			#FF6600; /* safety orange */
}

.success, .tab-success {
	color:			#006400; /* darkgreen */
}

.info, div.user_feedback{
	color:			black;
}

div.messages {
	background-color:	#059;
	color:				white;
	margin: 			3px;
	padding:			3px;
}

div.messages_rounded {
	background-color:	#059;
	color:				white;
	margin: 			3px;
	padding:			3px;
    border-style:solid;
    border-color:#059;
    border-radius: 10px;
}

/***** tabbed menu ******************************************************************* */
/* TODO havlatm: remove tabbed menu to be compliant with other design */
/* add under h1 tag */

div.tabMenu {
	margin-top:		0px;
	padding:		0px 30px 10px 30px;
}

span.selected, span.unselected {
	border: 		1px solid black;
	border-top-style: none;
	font-weight:    bold;
	padding: 		5px;
}

span.selected {
	background:		#059;
	color:			white;
}

span.unselected:hover {
	background:		#BCD;
}

span.unselected a, span.unselected a:visited {
	color:    		black;
}



/***** Tables ***************************************************************************
*
* Standard table classes:
*
* "common" 		- often used for view arrays
* "simple" 		- often used for forms
* "smallGrey" 	- often used for options / filters
* "invisible" 	- no borders
* !!! Do not add new table kinds !!! (there is bunch of wild table definitions below)
*/

/* ***** Common ********************* */
table.common {
	background:     #EEE;
	border: 		1px solid black;
	margin-bottom:	20px;
	min-width:		50%;
}

table.common th, table.simple th, table.simple_tableruler th{
  	overflow:		hidden;
  	color:			#15428b;
  	font:			bold 11px tahoma,arial,verdana,sans-serif;
  	padding:		5px 3px 4px 5px;
  	border:			1px solid #99bbe8;
  	line-height:	15px;
  	background:		transparent url(../images/white-top-bottom.gif) repeat-x 0 -1px;
  	background-color: #CDDEF3;
}

table.common td,th{
	padding:		3px;
}

table.common td, table.simple td, table.simple_tableruler td, th{
	vertical-align: top;
}

/* Margin fix for paragraphs in steps table */
table.common td p:first-child, table.simple td p:first-child,
simple_tableruler td p:first-child{
	margin-top: 0;
}

table.common caption, table.smallGrey caption {
	background:     #CCC;
	border: 		1px solid black;
	border-bottom-style: none;
	font-weight:    bold;
}


/* ***** Simple Table (often used to show data) ***************** */
table.simple, table.simple_tableruler {
	background:     #EEE;
	border: 		thin solid black;
	font-size:		90%;
	margin:			5px;
	width:			99%;
}

table.simple caption, table.simple_tableruler caption{
	background:     #CCC;
	border: 		thin solid black;
	border-bottom-style: none;
	font-weight:    bold;
}

table.simple_tableruler tr:hover{
    background-color: #CDDEF3 !important;
}

table.tableruler tbody tr:hover{
    background-color: #FFF !important;
}

/* Used for filters and options settings */
table.smallGrey {
	background:     #EEE;
	border: 		1px solid black;
	font-size:		smaller;
	margin-bottom:	10px;
	margin-right:	0px;
}


table.invisible {
	border: 		0px none;
	font-size:		90%;
	margin:			5px 0px;
	width:			auto;
}

table.mainTable{
	background: 	#EEE;
	border: 		1px double black;
	min-width:		200px;
}

table.mainTable td th {
	border: 		thin dotted black;
}

table.mainTable th {
	background:     #FFC;
}

table.link_and_exec {
	background:     #EEE;
	border: 		1px solid black;
	margin-bottom:	10px;
	margin-right:	0px;
}

table.link_and_exec th {
	background:     #CCC;
}

/* *****  Table Execution History ********* */
table.exec_history {
	background:     #EEE;
	border: 		thin solid black;
	font-size:		90%;
	margin:			20px;
	width:			95%;
}

table.exec_history th {
	background:     #CCC;
	border-bottom:	1px solid black;
	padding:		2px;
}


/* >>>> Martin: @TODO REMOVE! do not use tables to structure page <<<<<<< */
table.notesBox td
{
	vertical-align: top;
}
td.checkbox_cell{
	width: 			1px;
}
td.tcase_id_cell{
	width: 			25px;
}
table.srs_view td {
	border: 		1px solid black;
}

table.test_exec {
	background: 	#FFC;
	color: 			black;
	padding: 		12px;
	width: 			100%;
}



/* ***** Execution & Results ********************************************************* */
div.passed, div.failed, div.blocked, div.not_run {
	color: 			white;
	margin: 		8px;
	padding: 		6px;
	text-align: 	center;
}

div.passed {
	background:		#006400; /* darkgreen */
}

div.failed {
	background:		#B22222; /* firebrick (red) */
}

div.blocked {
	background:		#00008B; /* darkblue */
}

div.not_run {
	background:		black;
}


/* ***** execution tree coloring ************************* */
span.light_passed, span.light_failed, span.light_blocked,
span.light_not_run, span.light_not_available, span.light_unknown
{
	color:				black;
	padding:			3px;
}


span.light_passed {
	background:			#D5EED5; /* green */
}

span.light_failed {
	background: 		#EED5D5; /* red */
}

span.light_blocked {
	background: 		#D5D5EE; /* blue */
}

span.light_not_run {
	background: 		#E8E8E8; /* grey */
}

span.light_not_available {
	background: 		#F8EEDD; /* yellow */
}

span.light_unknown {
	background: 		#DDFFFF; /* cyan; */
}

/* ***** render test result status (coloring background) ************************* */
.passed {
	color: 			white;
	background:		#006400; /* darkgreen */
}

.failed {
	color: 			white;
	background:		#B22222; /* firebrick (red) */
}

.blocked {
	color: 			white;
	background:		#00008B; /* darkblue */
}

.not_run {
	color: 			white;
	background:		black;
}

.not_available {
	color: 			black;
	background:		#DAA520; /* goldenyellow */
}

.unknown {
	color: 			black;
	background:		#00FFFF; /* cyan; */
}

/* ***** render test result status (coloring text) ************************* */
.passed_text {
	color:    #006400; /* darkgreen */
  font-weight: bold;
}

.failed_text {
	color:		#B22222; /* firebrick (red) */
  font-weight: bold;
}

.blocked_text {
	color:		#00008B; /* darkblue */
  font-weight: bold;
}

.not_run_text {
	color:    black;
  font-weight: bold;
}

.not_available_text {
	color:    black;
  font-weight: bold;
}

.unknown_text {
	color: 			#00FFFF; /* cyan; */
  font-weight: bold;
}


/* ***** MISC ************************************************************************ */
/* Please, be carefull to be consistent if you add a new definition */

/* execution boxes (result, test scenario, notes) */
div.resultBox {
	background: 	white;
	border: 		medium solid #808080;
	color: 			black;
	margin: 		0px 12px 12px 12px;
	padding: 		12px;
}

div.resultBox img:hover {
	cursor:		pointer;	
}

img.arrow {
	width: 			16px;
	height: 		9px;
}

div.exec_history {
	background:		#FFF;
	padding: 		0px 3px;
}

span.type1 {
	background:		#059;
	border: 		1px solid black;
	color:			white;
	font-size:		110%;
	margin-bottom:	4px;
	padding: 		2px;
	text-align: 	left;
}


div.fullpage_head {
	text-align: 	center;
	width: 			100%;
	background: 	#CDE;
	margin: 		0px;
	padding: 		5px 0px;
	font-weight : 	bold;
	font-variant : 	small-caps;
	letter-spacing: 5px;
}

/* For the HTML forms */
div.forms {
	text-align: 	left;
	margin: 		20%;
	margin-top: 	20px;
	background: 	#CDE;
	padding: 		25px;
	border: 		1px;
}

/* Martin: @TODO clean-up required */
.hint, .time_stamp_creation, .time_stamp_last_change  {
	font-style: 	italic;
}

/* Martin: @TODO clean-up required ; use .label */
.legend_container, .labelHolder, div.show_hide_title {
	font-weight: bold;
}

/* added padding to allow good effect with Nifty */
div.exec_history_title {
	font-weight:	bold;
	padding: 		2px;
}

div.notes{
	background: 	#F5F5F5; 	/* whitesmoke */
	border: 		1px solid black;
	color: 			black;
	margin: 		1px;
	padding: 		1px;
	width: 			100%;
}

div.test_exec {
	background: 	#FFC;
	border: 		thin dashed black;
	color: 			black;
	padding: 		12px;
	width: 			100%;
}

div.exec_test_spec {
	background: 	#FFC;
	color: 			black;
	padding: 		12px;
}


div.login_title {
	text-align: 	center;
	width: 			80%;
	background: 	#CDE;
	margin: 		0px;
	padding: 		5px 0px;
	font-weight : 	bold;
	letter-spacing: 2px;
}

div.login_form {
	text-align: 	left;
	width: 			30%;
	margin: 		35%;
	margin-top: 	60px;
	background: 	#CDE;  /* CDE */
	padding: 		30px;
	border: 		1px;
    border-style:solid;
    border-color:#CDE;
    border-radius: 15px;
}

div.login_form.large { 
	border-color:#FFF;	
	font-size: large;
}


div.login_form.medium { 
    border: 4px;
    border-style:solid;
	border-color:#FFF;	
	font-size: medium;
}
/*
div.login_form.medium { 
    border-style:solid;
	border-color:#FFF;	
	font-size: medium;
}
*/


.big_button{
	width: 80px; height : 30px; 
}


.custom_field_container {
  border: thin solid white;
  padding: 5px;
}

.option_transfer_container {
  border: thin solid white;
  padding: 5px;
}


.clickable_icon
{
  padding: 			2px;
  width: 			5px;
  text-align: 		center;
  vertical-align: 	middle;
}

.icon_cell
{
  width: 			5px;
  text-align: 		center;
  vertical-align: 	middle;
}

/* havlatm: @TODO title must be header markup */
.exec_tc_title {
	background:		#059;
	color:			white;
	margin-bottom:	4px;
	padding: 		3px;
	text-align: 	left;
}

.exec_additional_info{
	background-color: 	#F0F4F0; /* whitesmoke=F0F4F0, #FFC*/
	color: 			black;
	margin-bottom:	10px;
	padding-left:	10px;
	width: 			98%;
}

.exec_testsuite_details {
  border: 			thin solid black;
  padding: 			5px;
}

.exec_tcstep_note
{
  padding:2px;
  width:5px;
}


/* 20071227 - franciscom - to avoid problems
   with third party css
*/
input.tl-input{
  margin:2px;
  padding:2px;
}

table.mainTable-x th {
  overflow:hidden;
  color:#15428b;
  font:bold 11px tahoma,arial,verdana,sans-serif;
  padding:5px 3px 4px 5px;
  border:1px solid #99bbe8;
  line-height:15px;
  background:transparent url(../images/white-top-bottom.gif) repeat-x 0 -1px;
}

/* 20080127 - franciscom - to avoid problem with ext-js css */
th.testlink, td.testlink, tr.testlink td {
  padding: 1px;
  margin: 1px;
}

.clickable
{
	cursor:pointer;
}

/* 
@since 1.9.6
@internal notice: 
!important is CRITIC because without it, the alternate row color of ext-js grid will take precedence

@internal revisions
20121230 - franciscom - used on ext-js table implementation of users view 

*/
.roleCode9 
{
  background-color: acqua !important;
  color: black;
}

.roleCode8 
{
  background-color: white !important;
  color: black;
}

.roleCode7 
{
  background-color: wheat !important;
  color: black;
}

.roleCode6 
{
  background-color: #FFA !important;
  color: black;
}

.roleCode5 
{
  background-color: pink !important;
  color: black;
}

.roleCode4 
{
  background-color: cyan !important;
  color: black;
}

.roleCode3 
{
  background-color: grey !important;
  color: black;
}

.roleCode2 
{
  background-color: yellow !important;
  color: black;
}

.roleCode1 
{
  background-color: yellow !important;
  color: black;
}

.roleCode0 
{
  background-color: seashell !important;
  color: black;
}



/** Fix for buttons in date picker */
.x-date-mp-btns button {
    background: inherit;
}

.x-date-middle button {
	background: transparent;
}

.x-date-picker table th,
.x-date-picker table td {
    border: inherit;
    padding: inherit;
	vertical-align: center;
}

/* *********************************************************************************** */
/* Taken from Ext JS, and adapted */

.x-tl-panel{border-style:solid;border-color:#99bbe8;border-width:0;}
.x-tl-panel-header{overflow:hidden;color:#15428b;font:bold 11px tahoma,arial,verdana,sans-serif;
                   padding:2px 1px 1px 2px;border:1px solid #99bbe8;line-height:15px;
                   background:transparent url(../images/white-top-bottom.gif) repeat-x 0 -1px;}
.x-tl-panel-body{border:1px solid #99bbe8;border-top:0 none;overflow:hidden;background:white;}
.x-tl-panel-bbar {border:1px solid #99bbe8;border-top:0 none;overflow:hidden;padding:2px;}
.x-tl-panel-tbar {border:1px solid #99bbe8;border-top:0 none;overflow:hidden;padding:2px;}
.x-tl-panel-tbar-noheader .x-toolbar,.x-tl-panel-mc .x-tl-panel-tbar .x-toolbar{border-top:1px solid #99bbe8;
                                                                          border-bottom:0 none;}
.x-tl-panel-body-noheader,.x-tl-panel-mc .x-tl-panel-body{border-top:1px solid #99bbe8;}
.x-tl-panel-header{overflow:hidden;}
.x-tl-panel-tl .x-tl-panel-header{color:#15428b;font:bold 11px tahoma,arial,verdana,sans-serif;
                               padding:5px 0 4px 0;border:0 none;background:transparent;}
.x-tl-panel-tl .x-tl-panel-icon,.x-window-tl .x-tl-panel-icon{padding-left:20px!important;background-repeat:no-repeat;
                                                        background-position:0 4px;}
.x-tl-panel-inline-icon{width:16px;height:16px;background-repeat:no-repeat;background-position:0 0;
                        vertical-align:middle;margin-right:4px;margin-top:-1px;margin-bottom:-1px;}
.x-tl-panel-tc{background:transparent url(../images/top-bottom.gif) repeat-x 0 0;overflow:hidden;}
.x-tl-panel-tl{background:transparent url(../images/corners-sprite.gif) no-repeat 0 0;
               padding-left:6px;border-bottom:1px solid #99bbe8;}
.x-tl-panel-tr{background:transparent url(../images/corners-sprite.gif) no-repeat right 0;
               padding-right:6px;}
.x-tl-panel-bc{background:transparent url(../images/top-bottom.gif) repeat-x 0 bottom;}
.x-tl-panel-bl{background:transparent url(../images/corners-sprite.gif) no-repeat 0 bottom;
               padding-left:6px;}
.x-tl-panel-br{background:transparent url(../images/corners-sprite.gif) no-repeat right bottom;
               padding-right:6px;}
.x-tl-panel-mc{border:0 none;padding:0;margin:0;font:normal 11px tahoma,arial,helvetica,sans-serif;
               padding-top:6px;background:#dfe8f6;}
.x-tl-panel-mc .x-tl-panel-body{background:transparent;border:0 none;}
.x-tl-panel-ml{background:#fff url(../images/left-right.gif) repeat-y 0 0;padding-left:6px;}
.x-tl-panel-mr{background:transparent url(../images/left-right.gif) repeat-y right 0;
               padding-right:6px;}
.x-tl-panel-bc .x-tl-panel-footer{padding-bottom:6px;}
.x-tl-panel-nofooter .x-tl-panel-bc{height:6px;font-size:0;line-height:0;}
.x-tl-panel-bwrap{overflow:hidden;}
.x-tl-panel-body{overflow:hidden;}
.x-tl-panel-collapsed .x-resizable-handle{display:none;}
.tbar-sort-desc {background-image: url("../images/sort_desc.gif") !important;
                background-position: 4px 7px !important;}
.tbar-sort-asc{background-image: url("../images/sort_asc.gif") !important;
               background-position: 4px 7px !important;}
.tbar-default-state {
	background-image: url("../images/edit-undo.png") !important;
}
.tbar-info{
	background-image: url("../images/question16_16.gif") !important;
}
.tbar-reset-filters{
	background-image: url("../images/reset_filter.png") !important;
}
.x-progress-wrap.left-align .x-progress-text {
    text-align:left;
}

/* From ACE */
.page-content {
    margin: 0 0 10px;
    padding: 8px 8px 24px;
    position: relative;
}

/* To adjust Bootstrap tables */
.table {
  font-size: 12px;
}

.table th, .table tr, .table td {
   height: 10px;
}

.table .thead-dark th {
  color: #fff;
  background-color: #212529;
  border-color: #32383e;
}

.table .thead-light th {
  color: #495057;
  background-color: #e9ecef;
  border-color: #dee2e6;
}

/* ----- END ------------------------------------------------------------------------- */