/*

      Data Card CSS

      [Modified: 06/04/2019]

*/

.tabular span
{
  text-overflow:ellipsis;
}

span.super
{
  vertical-align:super;
  font-size:smaller;
}

div.wizard-step
{
  font-size: 14pt;
  white-space: nowrap;
}
div.wizard-step span.this-step
{
  font-style: italic;
}

div.wizard-step span.label
{
  color: black;
}

span.uk-vehicle-registration-plate
{
  color:black;
  font-family: sans-serif;
  font-size: 12pt !important;
  font-weight:bold;
  background-color: yellow;
  border: 1px solid black;
  border-radius: 4px;
  padding: 2px 6px 2px 6px;
}

div.bounded
{
  border: 1px solid #ff4208 !important;
}

h1
{
  font-family: Arial,Helvetica,sans-serif; 
  font-size: 18pt; 
  color: #ff4208;
}

th.registration
{
  vertical-align:middle;
  font-size: x-large;
}

i.fa.icon
{
  color: #ff4208;
}

i.fa-spin
{
  visibility:hidden;
}

._busy i.fa-spin.__collapsed
{
  display:block;
}

._busy i.fa-spin
{
  visibility:visible;
}

.__collapsed 
{
  display:none;
}

i.fa.error
{
  color: Red;
  font-size: larger;
}

div.result
{
  padding:8px;
  font-family: Arial,Helvetica,sans-serif; 
  font-weight: bold;
  font-size: 10pt; 
  text-align:center;
  white-space:nowrap;
  color: #ff4208;
}

div.section
{
  font-family: Arial,Helvetica,sans-serif; 
  font-size: 18pt; 
  vertical-align:middle;
  white-space:nowrap;
  border: none;
  color: #ff4208;
}

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

.data-card input , .data-card textarea , .data-card select { border:1px solid #ff4208; padding: 8px; }


/*
div.section
{
  vertical-align:middle;
  font-size: x-large;
  white-space:nowrap;
  border: none;
  color: #ff4208;
}
*/


/*
div.progress
{
  vertical-align:middle;
  font-size:14pt;
  color: #ff4208;
}
*/

table.data-card
{
  border-collapse:collapse;
  /*height: 220px;*/
}

.data-card
{
  font-family: Arial,Helvetica,sans-serif; 
  font-size: 10pt; 
}

.data-card input[readonly]
{
  border: 1px solid silver;
}

.data-card caption
{
  /*
  white-space:nowrap;
  border: none;
  padding: 12px;
  color:white;
  cursor:default;
  */
}

.data-card label
{
  color: #ff4208;
  white-space:nowrap;
}

button.card-action
{
  cursor: pointer;
  border-radius: 12px;
  background-color: transparent;
  border: 1px solid #ff4208;
  padding: 12px;
  font-size:8pt;
  color: #ff4208;
}

button.card-action *
{
  pointer-events: none !important;
}

button.card-action:focus
{
  outline: none;
}

button.card-action:hover
{
  border-style: dashed;
}

button.card-action i.fa
{
  vertical-align:middle;
  background-color: transparent;
  font-size:13pt;
}

button.card-refresh
{
  cursor:pointer;
  font-size:14pt;
  background-color: transparent;
  border: 1px solid transparent;
  color: #ff4208;
}

button.card-refresh:hover
{
  border: 1px dashed #ff4208;
}

button.card-refresh:focus
{
  outline:none;
}

.data-card tbody.detail td i[data-error]
{
  visibility:hidden;
  font-size: 11pt;
  cursor: pointer; 
  float:right;
  color:red;
}

.data-card tbody.detail td i._error
{
  visibility:visible;
}

.data-card ._invalid
{
  border: solid 2px Red;
  color: Red;
}

.data-card div.http-service-error
{
  padding: 20px;
  vertical-align:middle;
}

.data-card div.http-service-error i.fa
{
  font-size: 18pt;
  color:red;
}

.data-card div.http-service-error span.http-status-code
{
  padding: 8px 4px 8px 14px;
  font-family: Arial,Helvetica,sans-serif; 
}

.data-card div.http-service-error span.http-status-text
{
  font-family: Arial,Helvetica,sans-serif; 
  padding:8px;
}

.data-card .tooltip
{
  position: relative;
  display: inline-block;
  padding-left:6px;
}

.data-card .tooltiptext
{
  font-family: Arial,Helvetica,sans-serif; 
  font-size: 8pt !important;
  padding:40px;
  border: 1px solid silver;
  visibility:hidden;
  background-color: #ff4208;
  width: 200px;
  color: white;
  text-align: center;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 205%; 
}

.data-card .tooltip:hover .tooltiptext 
{
  visibility: visible;
}

.data-card thead
{
  font-size: 8pt;
  color:  #ff4208;
}
.data-card thead th
{
  text-align:left;
}

.data-card button._action
{
  cursor:pointer;
  vertical-align:middle;
  border: none;
  font-size:8pt;
  background-color: #ff4208;
  color: white;
}

button.card-action *
{
  pointer-events: none !important;
}

.data-card button._action i.fa
{
  font-size:14pt;
}

div.section-footer 
{
  cursor: default;
  color: white;
  background-color: #ff4208;
  padding: 8px;
  font-family: Questrial, sans-serif;
  font-size: 14px;
}

span.pound:not(:empty):before
{
  content: "£"
}