/*
   =================================================================================
   Estilos para los Controles de varios tipos ...
   ================================================================================
*/
/*
  Estilos genericos para las solapas
  las solapas propiamente dichas se definen dentro de un div class="TabCtrl" usando una lista ul y links
  el contenido de cada solapa en un div class="TabContent"
*/
.TabCtrl {
    padding:3px 0; padding-top:1em;margin:0px; margin-bottom:0px; margin-top:0em; ;
    background-color: AliceBlue;
}
.TabCtrl li {
   list-style: none;
   display: inline;
   margin: 0; margin-left:0px;
}
.TabCtrl li a {
   padding: 3px 1em; margin-left: 3px;
   border: 1px solid #778; border-bottom: none;
   background: white; color: gray ;
}
.TabCtrl li.current a {
   background:  #CCCCFF ; padding:6px;
   border: 0px solid SkyBlue ;
   border-top: 1px solid AliceBlue ;
   border-right: 2px solid Gray ;
   font-weight: bold; color: Black ;
}
.TabsContainer {
   border: 1px solid #CCCCFF; border-top: 6px solid #CCCCFF ;
   clear: both; width:100%;
}
.TabContent {
   border: 0px solid red;
   width:100%;
}
.TabContentEnd {
   clear: both; width:100%;height:0px;
}
.Container {
   border: 0px solid red; padding:0px;
   float:left; clear:none; width:70%;
}

/*
   Estilos genericos para los hints
   El link define el abrir o cerrar del hint, su "href" contiene el "name" del hint a mostrar
   El link debe ser de la clase "HintCtrl"
*/
/*-- el control (link) que "prende" o "apaga" el Hint */
.HintCtrl {
}

/*-- area donde se muestra el Hint */
.HintDisplay {
   border-style: solid; border-color: #CCCCCC; border-width:0px; border-left-width: 2px;
   margin: 6px; padding:4px;
   float: right; width:25%; clear:none;
}
.HintDisplay h5 {
   margin:0px; padding: 2px; font-weight: bold;
}
.HintDisplay p {
   margin:0px; padding: 2px;
}
.HintDisplay b {
   font-weight:bold; font-style:italic;
}
.HintDisplay em {
   font-weight:bold; background: Lavender ; font-style:normal;
   padding-left:4px;padding-right:4px; border: none;
}

/*-- lista de contenidos de todos los hints para el form activo */
.HintsContentsSet {
   display:none;
}

/*
   Estilos genericos para los TextCtrl
*/
.StringCtrl, .SelectCtrl, .TextCtrl {
   background-color:none; padding:0px;margin:0px;
}
.TextCtrl textarea {
   background-color:white; padding:0px;margin:0px;
}

/*
   Estilos para varios botones de uso frecuente: Buscar, etc ...
*/
.SearchBtnCtrl.loading, .popupOkCtrl.loading {
	border-width: 0px;
	background-color: #ffffff;
	background-image: url(../images/working-circle.gif);
	background-repeat: no-repeat;
	background-position: center;
	width: 25px;
	height: 18px;
}

/* ------------------------------------------------------------------------------------------
   Estilos para el campo Field que contiene Controles y otros
*/
.Field {
   width:100%;
   border:1px dotted gray;
}
.Field label {
   display:block;
   font-weight:bold;
   text-align:right;
   width:120px;
   float:left;
   padding:2px;
   border:1px dotted cyan;
}
.Field HintPane {
   clear:both;
   width:100%;
   margin-left:126px; padding:2px;
   text-align:left;
   border-left:1px solid gray;
}

/* ------------------------------------------------------------------------------------------
   Estilos para el formulario principal, contenedor de todos los otros
*/
table.DocForm  {
   border-spacing: 0px;
   border-collapse:collapse;
   padding:0px;
   width:100%;
}
table.DocForm td {
   padding:2px; margin:0px;
   border-bottom: 1px solid SkyBlue;
}
table.DocForm td.index {
   padding:4px;
   width:5%; text-align:right; font-weight:bold; border-width:0px;
   border-top: 1px solid white;
   background-color: #CCCCFF ;
}
table.DocForm tr.buttons td {
   padding:4px;
   border-bottom: 0px solid white;
   background-color: #CCCCFF ;
}
/*-- label del campo */
table.DocForm td.fields label {
   display:block;
   font-weight:bold;
   text-align:right;
   width:12em;
   clear:both;float:left;
   border:0px dotted cyan;
   padding:0px;padding-right:6px;
}

table.DocForm td p {
   padding:4px; margin:0px; margin-bottom:4px;
}
div.hseparator {
   padding:0px;margin:0px;width:100%;height:1px;border-bottom:1px solid #CCCCFF;
}
table.DocForm td i {
   padding:0px;margin:0px;padding-bottom:14px;font-style:italic;color:gray;
}
/* -- comentario al pie de un campo del formulario */
table.DocForm p.FieldFooterCtrl {
   padding:0px;margin:0px;
   font-style:italic; font-size:0.8em;color:gray;
}

table.DocForm table td {
   padding:2px; margin:0px;
   border-bottom: 0px;
}

/* ------------------------------------------------------------------------------------------
   Estilos para el Control TableCtrl y sus variantes y subcontroles
*/
/*-- estilos de la tabla propiamente dicha */
.TableCtrl table  {
   border-spacing: 0px;
   border-collapse:collapse;
   margin: 0px;padding:0px; margin-top:4px;
   border: 1px solid gray;
   horizontal-align:left;
   background-color: white ;
   width:98%;
}
tr.tDef {
   display:none;
}
tr.tHead th {
   border-style: solid; border-color: #CCCCCC; border-width:1px;
   background-color: #AFEEEE ;
   margin: 0px; padding:2px; font-weight:bold;
   text-align:center; vertical-align:middle;
}
tr.tData td {
   margin: 0px; padding:2px;
   border: 1px solid #CCCCCC;
}
tr.tGastos td {
   margin: 0px; padding:2px;
   border: 1px solid #CCCCCC;
}

.inEdition {
   background-color: LightGray ;
}
/*-- el control (link) que "agrega" una fila a la tabla */
.RowInsertCtrl {
   padding-left:2px;padding-right:2px; margin-left:2px;margin-right:2px;
   background: Lavender ;
   border-top: 1px solid  #778;
   border-left: 1px solid #778 ;
   border-right: 2px solid Gray ;
   border-bottom: 2px solid Gray ;
   text-decoration: none;
}
a.RowInsertCtrl:link { color:black; text-decoration:none; }
a.RowInsertCtrl:visited { color:black; text-decoration:none; }
a.RowInsertCtrl:hover { color:red; text-decoration:none; background-color: yellow;  }

/*-- el control (link) que "prende" o "apaga" el RowEditorForm */
.RowTitle a {
    padding-right:12px;
    background-image:url(../images/popup.gif);
    background-position:center right;
    background-repeat:no-repeat;
}
.RowTitle a:link { color:blue; font-weight:bold; text-decoration:none; }
.RowTitle a:visited { color:black; text-decoration:none; }
.RowTitle a:hover { color:black; text-decoration:underline; background-color:yellow; }


/* ------------------------------------------------------------------------------------------
   Estilos para Validacion y Activacion de  controles o secciones
*/
.invalid {
  background-color: Red ;
  padding:2px; font-size:1.5em; font-weight:bold; color:white;
  /* border: 2px dashed red ; */
}
.required {
    border-right:4px solid red ;
}
.delegate {
   display:none; background-color:green;
}

/* ------------------------------------------------------------------------------------------
   Estilos para el area RowEditor (donde trabaja el RowEditorForm)
*/

/*-- area donde se muestra el Hint */
.RowEditor, .PopupEditor {
   margin:0px;padding:4px;
   background-color: AliceBlue ;
   border: 1px solid Gray;
   horizontal-align:left;
   /**/
   position:absolute; left:300; top:100;
   z-index:1002;
   visibility:hidden;
}
.RowEditor h5, .PopupEditor h5 {
   padding: 2px; font-weight: bold;
   background-color: AliceBlue ;
   border-bottom-style: solid; border-bottom-color: gray; border-bottom-width: 1px;
}
.RowEditor button, .PopupEditor button {
   margin:0px; padding: 0px; font-size: 0.9em; background-color: #F0F0F0 ;
}
.RowEditor p, .PopupEditor p {
   margin:0px; padding: 2px;
}
.RowEditor div, .PopupEditor div {
   margin:0px; padding: 2px;
}
.RowEditor .field, .PopupEditor .field {
   border-bottom-style: solid; border-bottom-color: LightBlue; border-bottom-width: 1px;
}