* { 
	box-sizing: border-box;
}

html, body {
  overflow-y:hidden;
	min-height: 100%;
	background: #fff;
	color: #000;
}

body, ul, ol, dl {
	margin: 0;
}

a {
	color: inherit;
	text-decoration: inherit;
}
a:hover{
	color:inherit;
	text-decoration: underline;	
}
a.no-hover:hover {
	text-decoration: none;
}

/* BOOTSTRAP OVERRIDES */
.card{
    border: 1px #0088C5 solid;
}

/* END OF BOOTSTRAP OVERRIDES */
.wrapper {
    display: flex;
    width: 100%;
}
.pdr-1 {
	padding-right: 1em;
}

/* Scrollable table body */
/* COMMENTED OUT - conflicts with DataTables scrollX + scrollY:
   width/table-layout:fixed overrides DataTables column sizing.
   .table thead .table-invoicing and .table thead th .table-invoicing were dead selectors
   (class is on <table>, not inside thead/th).
   scrollable-tbody display:block conflicts with DataTables DOM management.
   DataTables now handles both axes via scrollX: true and scrollY.
.table-invoicing {
  width: 80vw;
  table-layout: fixed;
}

.table thead .table-invoicing{
  display: table;
  min-width: 80vw;
  table-layout: fixed;
}

.table tbody.scrollable-tbody {
    display: block;
    height: calc(100vh - 321px);
    width: 80vw;
    overflow-y: auto;
}

.table tbody.scrollable-tbody tr {
  display: table;
  width: 80vw;
  table-layout: fixed;
}

Sticky headers
.table thead th .table-invoicing{
  position: sticky;
  top: 0;
  background-color: #fff;
  z-index: 1;
}
*/

table.dataTable div.dt-column-header {
  flex-direction: row-reverse;
  text-align: left;
} 

/* DataTables 2.3.2 controls */
/* COMMENTED OUT - using DataTables 1.x class names, replaced below with 2.x equivalents.
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
  margin-bottom: 1rem;
} 

.dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 0.25em 0.5em;
  margin: 0 0.1em;
  border-radius: 4px;
}

.dataTables_wrapper .dataTables_length select {
  border-radius: 4px;
}
*/

/* DataTables 2.x controls */
.dt-length,
.dt-search,
.dt-info,
.dt-paging {
  margin-bottom: 1rem;
}

.dt-paging .page-link {
  padding: 0.25em 0.5em;
  margin: 0 0.1em;
  border-radius: 4px;
}

.dt-length select {
  border-radius: 4px;
}

/* Button spacing in Actions column */
.table .btn {
  margin-right: 0.5rem;
}

/* Table cell alignment */
.table th,
.table td {
  padding: 0.75rem;
  vertical-align: middle;
  white-space: nowrap;
}
 
table {
  width: 100%;
}

#sidebar {
    height: 100vh;
    background: #0088C5;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

#main-content {
    min-height: 100vh;
    top: 0;
    right: 0;
}

#psuedo-nav-bar{
    width: 100%;
    background-color: #0088C5;
    height: 100px;
}

.material-symbols-outlined.mso-light{
	color: white;
}

.material-symbols-outlined.mso-blue{
	color:#0088C5;
}

.material-symbols-outlined.mso-lt-grey{
	color: lightgray;
}

.material-symbols-outlined.mso-32{
	font-size: 32px;
}

.material-symbols-outlined.mso-16{
	font-size: 16px;
}

#user-nav {
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: 1em auto;
}

.nav-container {
	width: 75%;
}

#nav-bar-logo {
	margin: 2em;
}

.dashboard-header{
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.pagination-btn{
	padding-top: 1em;
}

.current{
	text-decoration: underline;
}

.lead-info-header{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding-bottom: 2em;
}

.info-details {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}

.info-key {
	width:25%;
	padding-right:1em;
}

.info-value {
    width: 70%;
}

.lead-info-wrapper{
	display:flex;
	flex-direction: row;
}

.customer-info-wrapper {
	display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.staff-info {
	width: 30%;
}

.staff-info-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.customer-info.lead-detail-block {
    width: 65%;
}

.current-page{
	font-weight: bold;
}

.header-wrapper {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
}

.lead-details-header{
	display: flex;
    align-items: center;
}

#lead-details-company{
	width: 85%;
}

#add-note-container{
	margin-left: auto;
    margin-right: 0;
}

.pinned-note-text{
	margin-bottom: 2em;
    padding-bottom: 0.5em;
    border-bottom: solid 1px lightgray;
}