/* style sheet for various wsurveyUtils.js functions wSurvey array to html container (as described in wsurveyUtils.txt*/

.ws_arrayToHtmlTable_colHeaderRow {
    color:blue;
    background-color:#abbaab;
}

.ws_arrayToHtmlTable_topLeft,.ws_arrayToHtmlTable_left1 {     /* background color might be set in style */
  width:3em;
  overflow:hidden;
  font-style:oblique;
  float:left;
  background-color:#abbaab;
}

/* style is used to set width */
.ws_arrayToHtmlTable_main {
   white-space:nowrap;
   overflow:auto;
   border:1px dotted  gray;
}

.ws_arrayToHtmlTable_colHeaderCell,.ws_arrayToHtmlTable_rowCell {      /* background color might be set in style */
   margin-right:5px;
   width:5em;
   min-height:1.1em;
   overflow:hidden;
   float:left;
   background-color:#abbaab;
   text-overflow:ellipsis;
}

.wsArrayToTable_scrollRows {  /* height can be reset on the fly (using style) */
  margin-top:8px;
  height:12em;
  overflow-y:auto;
  border:2px dotted #dbabab ;
}

.wsArrayToTable_noScrollRows {
   xborder-left:3px dashed white;
}

.wsArrayToTable_aScrollRow {     /* bkg color set in style */
   margin-bottom:3px;
}

.wsToggleVal_buttonFormat {
   border-bottom:3px groove gray;
   border-right:2px groove gray;
   border-radius:5px;
   xbackground-color:cyan;
   font-size:80%;
   margin:1px;
   padding:2px;
   width:0.8em;
   overflow:hidden;
}

.wsToggleVal_colorA1   {
   background-color:#e0ffff !important ;
}

.wsToggleVal_colorA2     {
   background-color:#d2b48c !important  ;
}

.wsToggleVal_colorA3     {
   background-color:#a2a4cc !important  ;
}


.wsToggleVal_colorB1{
   background-color:#F5F5DC !important;
}

.wsToggleVal_colorB2 {
   background-color:#F0E68C !important;
}

.ws_arrayToHtmlTable_rowHilite {
   border:2px dotted blue !important ;
   margin:0.5m 3px 0.5em 3px  !important;
   color:#3333ff  !important ;
}
.ws_arrayToHtmlTable_hiliteRowButton {
   color:#3333ff  !important ;
   border-bottom:1px dotted blue !important ;
}

.numberFormat1 {
    width:1em ;
    font-family:monospace;
}
.numberFormat2 {
    width:2em ;
    font-family:monospace;
}
.numberFormat3 {
    width:3em ;
    font-family:monospace;
}
.numberFormat4 {
    width:4em ;
    font-family:monospace;
}
.numberFormat5 {
    width:5em ;
    font-family:monospace;
}
.numberFormat6 {
    width:6em ;
    font-family:monospace;
}
.numberFormat7 {
    width:7em ;
    font-family:monospace;
}
.numberFormat8 {
    width:8em ;
    font-family:monospace;
}


.smallHint {
   font-size:85%;
   background-color: #deeefe;
   margin:1px 3px 4px 3px;
   font-weight:500;
}

.smallHintBold {
   font-size:85%;
   background-color: cyan;
   margin:1px 3px 4px 3px;
   padding:2px 4px 2px 4px;
   font-weight:700;
}

.smallHintTight {
   font-size:85%;
   background-color: cyan;
   border-right:2px solid black;
   margin:1px 3px 4px -4px;
   padding:2px 4px 2px 2px;
   font-weight:700;
}
 
 .strikediag {
  display: inline-block;
  position: relative;
}
.strikediag::before {
  content: '';
  position: absolute;
  left: -0.1em;
  right: -0.1em;
  top: 0.38em;
  bottom: 0.38em;
  background: linear-gradient(to left top, transparent 45.5%, currentColor 47.5%, currentColor 52.5%, transparent 54.5%);
  pointer-events: none;
}

