:root {
  --darkBlue: #013a68;
  --darkerBlue: #012c4f;
  --lightBlue: #cee2f2;
  --lightestBlue: #e3eefc;
  --gold: #deb857;
  --darkGold: #bc9f57;
  --lightGrey: #eee;
  --grey: #ccc;
  --darkGrey: #666;
  --red: #AF2020;
  --green: #5cb85c;
  --white: #FFF;
  --text: #212529;
  --teal: #4dc0b5;
  --darkTeal: #10a2b4;
}

/* Summernote modal tweaks */
.note-modal .modal-title {
  text-align: left !important;
}
.note-modal .modal-header {
  text-align: left !important;
}
.note-modal .modal-dialog .modal-content .modal-header .close{
  display:none;
}

.note-link-dialog .checkbox,
.note-modal .checkbox {
  margin-right: 8px;
}
.note-link-dialog .checkbox label,
.note-modal .checkbox label {
  margin-right: 8px;
}

.sn-checkbox-open-in-new-window input[type='checkbox'] {
  margin-right: 8px;
}

.sn-checkbox-use-protocol input[type='checkbox'] {
  margin-right: 8px;
}
.gold {
  color:var(--gold);
}
.blue {
  color:var(--darkBlue);
}

.clear {
  clear:both;
}
.referralBox {
  background-color:var(--gold);
  color:var(--darkBlue);
  font-size:1.2em;
  padding:10px;
}


.crm-circle {
    width: 7px;
    height: 7px;
    border-radius: 50%;
  position:relative;
  float:left;
  margin-top:9px;
  margin-right:10px;
}


.chat-button {
    position: fixed;
    bottom: 20px;
    right: 10px;
    background-color: transparent;
    border: none;
    cursor: pointer;
}

.chat-box {
    display: none; /* Initially hidden */
    position: fixed;
    bottom: 90px; /* Height of the button plus some margin */
    right: 20px;
    width: 350px; /* Adjust as needed */
    height: 500px; /* Adjust as needed */
    background-color: white;
    border: none;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5);

    /* Add more styling as needed */
}
.chat-box-top {
  background-color:var(--darkBlue);
  color:#fff;
  padding:15px;
}
.chat-box-bottom {
  padding:15px;
}
.chat-button:focus {
    outline: none;
}


@font-face {
	font-family: 'The Working Tools';
	src: url('/fonts/BrandonGrotesque-Regular.woff2') format('woff2'), url('/fonts/BrandonGrotesque-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'The Working Tools';
	src: url('/fonts/BrandonGrotesque-Bold.woff2') format('woff2'), url('/fonts/BrandonGrotesque-Bold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}


html {
  height: 100%;
}
body {
  font-size:1em; 
  background-color:var(--lightGrey);
  font-family: 'The Working Tools';
  min-height:100vh!important;
}
#app {
  position:relative;
  height:100%;
}

textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
	-webkit-appearance: none;
	border-radius: 0;
}

.btn {
  font-size:1em;
}
.btn-blue {
  background-color:var(--darkBlue);
  color:var(--gold)!important;
}
.btn-blue:hover {
  background-color:var(--darkerBlue);
  color:var(--gold)!important;
}

.btn-gold {
  background-color:var(--gold);
  color:var(--darkBlue);
}
.btn-green {
  background-color:var(--green);
  color:var(--white);
}
.btn-gold:hover {
  background-color:var(--darkGold);
  color:var(--darkBlue);
}

.btn-red {
  background-color:var(--red);
  color:var(--white)!important;
}

.btn-red-outline {
  border:1px solid var(--red);
  color:var(--red)!important;
}
.btn-red-outline:hover {
  background-color:var(--red);
  color:var(--white)!important;
}

.btn-blue-outline {
  border:1px solid var(--darkBlue);
  color:var(--darkBlue)!important;
}
.btn-blue-outline:hover {
  background-color:var(--darkBlue);
  color:var(--white)!important;
}

.btn-grey-outline {
  border:1px solid var(--grey);
  color:var(--grey)!important;
}
.btn-grey-outline:hover {
  background-color:var(--grey);
  color:var(--white)!important;
}

.btn-slim {
  padding-top:1px;
  padding-bottom:1px;
}
.form-control {
  color:var(--darkBlue);
  font-weight:bold;
}
.form-group label {
  font-size:0.8em;
  color:var(--darkGrey);
  margin-bottom:0px;
}
.form-group  {
  margin-bottom:7px;
}
small {
  color:var(--red);
  font-weight:bold;
}
.nav-highlight {
  color:var(--gold)!important;
}
.errorBar {
  text-align:center;
  display:block;
  background-color:var(--red);
  color:var(--white);
  z-index:90;
  padding:15px;
}

.successBar {
  text-align:center;
  display:block;
  background-color:var(--green);
  color:var(--white);
  z-index:90;
  padding:15px;
}

.faq {
  background-color:var(--white);
  width:100%;
  margin-bottom:5px;
  padding:0px;
}
.faq-question {
  background-color:var(--darkBlue);
  color:var(--white);
  padding:5px 10px;
  cursor:pointer;
  width:100%;
}
.faq-answer {
  background-color:var(--white);
  padding:10px;
}

#mobilenav a {
  color:var(--gold);
}

@media only screen and (max-width: 992px) {

body {
    font-size:1em;
}
  
.btn {
    font-size:1em!important;
}
  
.nav-highlight {
  color:var(--darkBlue)!important;
  background-color:var(--gold);
  padding:3px 20px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

  
}

.seat {
  border:none;
  width:100%;
  height:auto;
  position:relative;
  float:left;
}
.emptySeat {
  border: 1px dashed var(--grey);
  color:var(--grey);
  padding:2px 5px;
  margin-bottom:3px;
}

.unallocatedPeople {
  padding-left:0px;
  padding:5px 0px;
}
.unallocatedPeople li {
  display:inline-block;
  margin-left:5px;
}
.person {
  background-color:var(--darkBlue);
  border-radius:5px;
  padding:5px 10px;
  color:var(--gold);
  list-style:none;
  margin-bottom:3px;
}

.personAttendance1 {
  background-color:var(--grey);
  color:var(--darkBlue);
}
.personAttendance2 {
  background-color:var(--red);
  color:#fff;
}
.personAttendance3 {
  background-color:var(--darkBlue);
}
  
.dragBg {
  background-color:var(--gold);
  color:var(--darkBlue);
}
.tableTitle {
  text-align:center;
  font-weight:bold;
  color:var(--darkBlue);
  border-bottom:solid 3px var(--gold);
}
.followTack {
  position:absolute;
  bottom:10px;
  right:10px;
  color:var(--grey);
  cursor:pointer;
}
.followTack:hover {
  color:var(--darkGrey);
}

.fixedScroller {
  position:fixed;
  top:120px;
  z-index:99;
  -webkit-box-shadow: 4px 0px 17px -9px rgba(0,0,0,0.8);
  -moz-box-shadow: 4px 0px 17px -9px rgba(0,0,0,0.8);
  box-shadow: 4px 0px 17px -9px rgba(0,0,0,0.8);
  max-width:40%;
}

.hiddenItem {
  opacity:0.4;
}

.colSortInactive {
  position:absolute;
  right:10px;
  font-size:1.1em;
  color:var(--grey);
  padding-top:4px;
  cursor:pointer;
}
.colSortInactive:hover {
  color:var(--darkGrey);
}




.StripeElement {
    box-sizing: border-box;
    height: 40px;
    padding: 10px 12px;
    border: 1px solid transparent;
    background-color: white;
    box-shadow: 0 1px 3px 0 var(--darkGrey);
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
    font-family: "Helvetica Neue", Helvetica, sans-serif;
    -webkit-font-smoothing:antialiased;
  font-size:16px;
}
.StripeElement--focus {
    box-shadow: 0 1px 3px 0 var(--darkBlue);
}
.StripeElement--invalid {
    border-color: #fa755a;
}
.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}