:root {
  --bs-primary: #337ab7;
  --bs-blue: #337ab7;
  --bs-success: #5CB85C;
  --bs-green: #5CB85C;
}

.text-blue { 
  color: var(--bs-blue);
}

.text-green {
  color: var(--bs-green);
}

.btn-primary, .btn-primary:hover {
  background-color: var(--bs-primary);
  border: none;
}

.btn-success, .btn-success:hover {
  background-color: var(--bs-success);
  border: none;
}

.badge-green {
  background-color: var(--bs-green);
}

.ws-card-button {
  background-color: var(--bs-primary);
}

.ws-design-succeeded {
  color: #3c763d;
  background-color: #dff0d8;
  border-color: #d6e9c6;
}

.ws-design-failed {
  color: #a94442;
  background-color: #f2dede;
  border-color: #ebccd1;

}

.ws-warning {
  color: #8a6d3b;
  background-color: #fcf8e3;
  border-color: #faebcc;
}

.selector-nav-pills .selector-nav-link {
  color: black;
  background-color:white;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.selector-nav-link:hover {
  background-color: #eee;
}

.selector-nav-pills .selector-nav-link.active, .selector-nav-pills .show>.nav-link {
  color: white;
  background-color: var(--bs-blue);
}

body {
  min-height: 100vh;
  min-height: -webkit-fill-available;
  background-color: #f8f8f8;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
  font-display: swap;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
}

html {
  height: -webkit-fill-available;
}

main {
  display: flex;
}

a { 
  text-decoration: none;
}

.table-borderless td,
.table-borderless th {
    border: 0;
}

.vertical-divider {
  flex-shrink: 0;
  width: 0.5rem;
  height: 100vh;
  background-color: #f8f8f8;
  /*border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);*/
}

.modal-body-shadow {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.card-shadow {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.card-shadow:hover {
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.25), 0 2px 2px rgba(0, 0, 0, 0.22);
}

.button-shadow {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 2px 4px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.button-shadow:hover {
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.25), 0 2px 2px rgba(0, 0, 0, 0.22);
}

/*****************************************************************************/
/*
/* File Explorer
/*
/*****************************************************************************/
.file-explorer-body{
   height: 400px;
   overflow-y: auto;
}

#file-explorer-table tr:not(:first-child):hover{
   background-color: #ffff99;
   cursor: pointer;
}

/*****************************************************************************/
/*
/* Shape selector modal dialog behavior
/*
/*****************************************************************************/
.shapes-selector-dialog {
   overflow-y: initial !important
}

.shapes-selector-body {
   height: 400px;
   overflow-y: auto;
}

.shape-table tr:hover {
   background-color: #ffff99;
   cursor: pointer;
}

/*****************************************************************************/
/*
/* Material selector modal dialog behavior
/*
/*****************************************************************************/
.material-selector-body {
   height: 400px;
   overflow-y: auto;
}

.material-table tr:hover {
   background-color: #ffff99;
   cursor: pointer;
}

.material-list-group .list-group-item:hover {
   background-color: #ffff99;
 }

/* remove line between table heading and first row */
table.wood-material-table thead>tr>th {
   vertical-align: bottom;
   border-bottom: 0px solid hsl(0, 0%, 87%);
}

table.wood-material-table tr>td {
   border-top: 0px solid hsl(0, 0%, 87%);
}

table.wood-material-info-table {
  background-color: #d9edf7;
}

table.wood-material-info-table thead>tr>td {
  border: none;
}

/*****************************************************************************/
/*
/* Load selector modal dialog behavior
/*
/*****************************************************************************/
#load-selector-table tr:hover{
   background-color: #ffff99;
   cursor: pointer;
}

/*****************************************************************************/
/*
/* Load combination dialog behavior
/*
/*****************************************************************************/
#load-combination-table tr:hover{
   background-color: #ffff99;
   cursor: pointer;
}

.modal-design-dialog{
   overflow-y: initial !important
}

.load-combination-body {
   height: 250px;
   overflow-y: scroll;
}

/***********************
*
* sidebar
*
************************/
.sidebar {
  width: 280px;
  min-width: 200px;
  margin: 55px 10px 10px 10px;
}

@media (max-width: 993px) {
  .sidebar {
    display: none;
  }
}

/***********************
*
* main content
*
************************/
.main-content {
  width: 95%;
  max-width: 900px;
  margin-top: 55px;
  margin-left: 10px;
  /*margin-right: 10px;*/
  /*margin-left: auto;*/
  /*margin-right: auto;*/
}

/***********************
*
* print
*
************************/
@media print {

  /*#beam-disp-graph, #beam-shear-graph, #beam-moment-graph {
    max-width:800px;
  }*/

  .hidden-print {
    display: none !important;
  }
  
  .main-content {
    margin-top: 0;
  }

  .sidebar {
    width: 0px;
    min-width: 0px;
    margin: 0px;
  }

  /*#plots-div {
    width: 900px;
  }*/

  /*#beam-disp-graph {
    width: 900px;
  }*/

  .page-break-before {
    page-break-before: always;
  }

  .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
       float: left;
  }
  .col-12 {
       width: 100%;
  }
  .col-11 {
       width: 91.66666667%;
  }
  .col-10 {
       width: 83.33333333%;
  }
  .col-9 {
       width: 75%;
  }
  .col-8 {
       width: 66.66666667%;
  }
  .col-7 {
       width: 58.33333333%;
  }
  .col-6 {
       width: 50%;
  }
  .col-5 {
       width: 41.66666667%;
  }
  .col-4 {
       width: 33.33333333%;
  }
  .col-3 {
       width: 25%;
  }
  .col-2 {
       width: 16.66666667%;
  }
  .col-1 {
       width: 8.33333333%;
  }
}