@font-face {
    font-family: 'Garamond';
    src: url('/static/fonts/Garamond/Garamond-Classico-Bold.ttf');
    font-weight: 300;
    font-style: normal;
}

body{
    margin:0px !important;
}

body {
    overflow:hidden
}

body * {    
    font-family: 'Roboto', sans-serif;
}

.htmx-indicator {
    visibility: hidden;
    opacity: 0;
    transition: opacity 500ms ease-in;
}

.htmx-request {
    visibility: visible;
}

#top-htmx-indicator {
    visibility: hidden;
    opacity: 0;
    transition: opacity 500ms ease-in;
}

.navbar-collapse {
    z-index: 1059;
}

#page_load_indicator {
    height: 20%;
    width: 20%;
    position: fixed;
    top: 40%;
    left: 40%;
    z-index: 11111;
}

.disconnected_indicator {
    height: 100%;
    width: 100%;
    padding-top: 40%;
    text-align: center;
    background: rgba(211, 211, 211, 0.4);
    z-index: 1061;
    position: absolute;
}


.whole_page_disconnected_indicator_content {
    height: 20%;
    width: 20%;
    position: absolute;
    top: 40%;
    left: 40%;
}

.whole_page_disconnected_indicator {
    background: rgba(211, 211, 211, 0.4);
    top: 60PX;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    width: 100vw;
    height: 100vh;
    z-index: 1071;
}

.dropdown-menu {
    z-index: 1070;
}

.generic_modal_contents {
    position: relative;
    overflow-y: auto;
    padding: 15px;
    max-height: 70vh;
}

.required{
    color:red;
    margin-left:2px
}
/* custom scrollbar */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

 ::-webkit-scrollbar-track {
    background-color: transparent;
}

 ::-webkit-scrollbar-thumb {
    background-color: #808080;
    border-radius: 10px;
    border: 2px solid transparent;
    background-clip: content-box;
}

 ::-webkit-scrollbar-thumb:hover {
    background-color: #a8bbbf;
}


/* custom scrollbar */

.no-chevron-button::after,
.no-chevron-button:not(.collapsed)::after {
    background-image: unset;
    background-repeat: unset;
    background-size: unset;
    flex-shrink: unset;
    width: unset;
    height: unset;
    margin-left: unset;
    content: unset;
}

.badge-sm {
    padding-top: 0.175em;
    padding-right: 0.325em;
    padding-bottom: 0.175em;
    padding-left: 0.325em;
    font-size: 12px !important;
}

.elipses-overflow {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hidden-overflow {
    overflow: hidden;
    text-overflow: hidden;
}

.fa-light {
    min-width:16px
}


.btn-primary {
    color: #fff;
    background-color: #1c84ee;
    border-color: #1c84ee;
}
.btn-secondary {
    color: #fff;
    background-color: #74788d;
    border-color: #74788d;
}
.btn-success {
    color: #fff;
    background-color: #34C353;
    border-color: #34C353;
}
.btn-info {
    color: #fff;
    background-color: #16daf1;
    border-color: #16daf1;
}
.btn-warning {
    color: #fff;
    background-color: #ffcc5a;
    border-color: #ffcc5a;
}
.btn-danger {
    color: #fff;
    background-color: #ef6767;
    border-color: #ef6767;
}
.btn-dark {
    color: #fff;
    background-color: #2b3940;
    border-color: #2b3940;
}
.btn-light {
    color: #000;
    background-color: #f6f6f6;
    border-color: #f6f6f6;
}


*/ .nav-link {
    color: white
}
.fixed_top_buttons {
    top: 0;
    padding: 5px;
    margin-top: 0px;
    position: fixed;
    background-color: rgba(33, 37, 41, 0.5) !important;
    height: 50px;
    display: flex;
    flex-wrap: wrap;
    flex: 0 0 auto;
    width: 83.33333333%;
}

.card-highlight{
    box-shadow: 0 0.25rem 0.75rem rgb(18 38 63 / 8%);
    background-color: #FFF !important;
    border: none!important;
    border-radius: 7px;
}

.card-highlight .card-header{
    border-top-left-radius: 7px !important;
    border-top-right-radius: 7px !important;
}
.card-highlight .card-body{
    border-bottom-left-radius: 7px !important;
    border-bottom-right-radius: 7px !important;
}

.below_fixed_top_buttons {
    margin-top: 50px !important;
}
.card-header {
    padding: 1.25rem 1.25rem;
    margin-bottom: 0;
}
#content>* {
}

#content {
    padding: 10px;
    padding-bottom: 50px;
    /* top: 7vh; */
    height: calc(100vh - 60px) !important;
    
    /* position: fixed; */
    overflow-y: scroll;
    margin: 0;
    height: 100vh;
}


#content::after {
    /* background: #efe7dd url(/static/img/background2.png) repeat; */
    background-size: 90px !important;
    content: "";
    opacity: 0.40;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
    min-height: 100vh;
    height:100%
}
/* .cartoon-background::after {
    background: #efe7dd url(/static/img/background2.png) repeat;
    background-size: 90px !important;
    content: "";
    opacity: 0.40;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: -1;
    min-height: 100vh;
} */

#topnav {
    padding: 0px;
    height: 60px;
}
.app_picture {
    image-rendering: auto;
    object-fit: cover;
    height: auto;
    width: 100%;
}
.nowrap {
    white-space: nowrap;
}

/* Add a black background color to the top navigation */

/* Style the links inside the navigation bar */
.row {
    width: 100%;
    margin: 0px;
}
.no-bullet {
    list-style-type: none;
}
.modal {
    text-align: center;
    padding: 0!important;
}
.modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}
.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}
.nowrap {
    white-space: nowrap;
}
.badge>* {
    vertical-align: middle;
}
.user-select {
    text-align: center;
    cursor: pointer;
}
.pointer {
    cursor: pointer;
}
.help {
    cursor: help;
}
.current-user-highlight {
    background-color: rgba(25, 135, 84, 0.3) !important;
    border: rgba(25, 135, 84, 0.8) !important;
}
#booking-type:checked~#booking-type-span-one {
    color: green
}
.badge {
    text-shadow: none;
    font-size: .9em;
    font-weight: 400;
}
.layout-margin-8 {
    margin: 3% 8%;
}
.filter-card-img-top-custom {
    width: 50%;
    margin: 0 auto;
}
.img-top {
    width: 300px;
    height: 100%;
    object-fit: contain;
    /*magic*/
}
.filter-card-shadow {
    -webkit-box-shadow: 0px 0px 28px 14px rgba(232, 232, 232, 1);
    -moz-box-shadow: 0px 0px 28px 14px rgba(232, 232, 232, 1);
    box-shadow: 0px 0px 28px 14px rgba(232, 232, 232, 1);
}
.filter-card-deck {
    display: flex;
    justify-content: space-around;
    flex-flow: row wrap;
    align-items: stretch;
}
.filter-card {
    padding: 3% 1.5%;
    border: none;
    flex-grow: 1;
}
@media (min-width: 768px) {
    .filter-form-control {
        width: 100% !important;
        height: 50px;
    }
}
.bg-blue {
    background-color: #005EB8;
}
.layout-margin-custom {
    margin: 10px;
    margin-top: 60px;
}
.left {
    text-align: left;
}
.center {
    text-align: center;
}
.right {
    text-align: right;
}
.badge>* {
    vertical-align: middle;
}
.user-select {
    text-align: center;
    cursor: pointer;
}
.current-user-highlight {
    background-color: rgba(25, 135, 84, 0.3) !important;
    border: rgba(25, 135, 84, 0.8) !important;
    border-radius: 25px;
}
#booking-type:checked~#booking-type-span-one {
    color: green
}
.badge {
    text-shadow: none;
    font-size: .9em;
    font-weight: 400;
}
.borderless {
    border: unset !important;
}

.bg-success-trans {
    background-color: rgba(var(--bs-success-rgb), 0.6) !important;
}
.bg-primary-trans {
    background-color: rgba(var(--bs-primary-rgb), 0.6) !important;
}
.bg-secondary-trans {
    background-color: rgba(var(--bs-secondary-rgb), 0.6) !important;
}
.bg-danger-trans {
    background-color: rgba(var(--bs-danger-rgb), 0.6) !important;
}
.bg-warning-trans {
    background-color: rgba(var(--bs-warning-rgb), 0.6) !important;
}
.bg-success-trans-80 {
    background-color: rgba(var(--bs-success-rgb), 0.8) !important;
}
.bg-primary-trans-80 {
    background-color: rgba(var(--bs-primary-rgb), 0.8) !important;
}
.bg-secondary-trans-80 {
    background-color: rgba(var(--bs-secondary-rgb), 0.8) !important;
}
.bg-danger-trans-80 {
    background-color: rgba(var(--bs-danger-rgb), 0.8) !important;
}
.bg-warning-trans-80 {
    background-color: rgba(var(--bs-warning-rgb), 0.8) !important;
}
.bg-light-trans-80 {
    background-color: rgba(var(--bs-light-rgb), 0.8) !important;
}
.bg-success-trans-20 {
    background-color: rgba(var(--bs-success-rgb), 0.2) !important;
}
.bg-primary-trans-20 {
    background-color: rgba(var(--bs-primary-rgb), 0.2) !important;
}
.bg-secondary-trans-20 {
    background-color: rgba(var(--bs-secondary-rgb), 0.2) !important;
}
.bg-danger-trans-20 {
    background-color: rgba(var(--bs-danger-rgb), 0.2) !important;
}
.bg-warning-trans-20 {
    background-color: rgba(var(--bs-warning-rgb), 0.2) !important;
}

.bg-secondary-trans-50 {
    background-color: rgba(var(--bs-secondary-rgb), 0.5) !important;
}
.bg-success-trans-50 {
    background-color: rgba(var(--bs-success-rgb), 0.5) !important;
}
.bg-primary-trans-50 {
    background-color: rgba(var(--bs-primary-rgb), 0.5) !important;
}

.complete-tr {
    background-color: rgba(var(--bs-success-rgb), 0.2) !important;
}
.warning-tr {
    background-color: rgba(var(--bs-warning-rgb), 0.2) !important;
}
.danger-tr {
    background-color: rgba(var(--bs-danger-rgb), 0.2) !important;
}
.success-tr {
    background-color: rgba(var(--bs-success-rgb), 0.2) !important;
}


.btn-danger-subtle{
   background-color: var(--bs-danger-bg-subtle)
}

.sorting {
    cursor: pointer
}

/* start dark joined buttons */
.btn-secondary,
.note-btn-group .btn-default {
    color: #545454;
    background-color: #fff;
    border-color: #ccc;
}
.btn-group>.btn.btn-dark:first-child,
.input-group-append>.btn.btn-dark:first-child,
.input-group-btn>.btn.btn-dark:first-child,
.input-group-prepend>.btn.btn-dark:first-child {
    border-left-color: transparent;
}
.btn-group>.btn.btn-dark,
.input-group-append>.btn.btn-dark,
.input-group-btn>.btn.btn-dark,
.input-group-prepend>.btn.btn-dark {
    border-left-color: #4a4a4a;
    border-right-color: #4a4a4a;
}
.btn-group-vertical>.btn,
.btn-group>.btn {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}
[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled),
button:not(:disabled) {
    cursor: pointer;
}
.btn-dark {
    color: #fff;
    background-color: #545454;
    border-color: #545454;
}

/* end dark joined buttons */

/* start light joined buttons */
.btn-group>.btn-group:not(:first-child),
.btn-group>.btn:not(:first-child) {
    margin-left: -1px;
}

/* end dark joined buttons */
.primary_td_layer,
.primary_td_layer>* {
    font-size: 16px;
    /* color: #000000; */
}
.secondary_td_layer,
.secondary_td_layer>*:not(button) {
    font-size: 13px;
    color: #999;
}
.legend-indicator {
    display: inline-block;
    width: .5rem;
    height: .5rem;
    background-color: #bdc5d1;
    border-radius: 50%;
    margin-right: .4375rem;
}
.btn-sm {
    font-size: 13px;
}
.notes_table {
    overflow-y: scroll;
    display: block;
    height: 300px;
}
tr.odd td {
    background-color: unset
}
.htmx-request #top-htmx-indicator {
    opacity: 1
}
.htmx-request#top-htmx-indicator {
    opacity: 1
}

.invert {
    height: 30px;
    margin: 0px;
    filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(87deg) brightness(119%) contrast(119%);
    transition: opacity 50ms ease-in !important;
}

/* .row {
    background-color: unset;
} */
[data-bs-theme="light"] #body {
    background-color: #f4f5f8 !important;
}
[data-bs-theme="light"] .card-highlight .card-header {
    background-color:#fff;
}

/* [data-bs-theme="dark"] .analytics-card {
    background-color:rgbs(var(--bs-light-rgb), 0.1) !important;
} */
[data-bs-theme="dark"] .card-highlight {
    background-color:unset !important;
}
[data-bs-theme="dark"] .select2-dropdown, .select2-dropdown *, table, .select2, .select2 *{
    background-color: var(--bs-body-bg) !important;
    color: var(--bs-text-bg) !important;
}
[data-bs-theme="dark"] canvas, #page_load_indicator {
    filter: invert(1) hue-rotate(180deg);
}


td, th{
    background-color: unset !important;
}
/* FL TABLE */
.table-wrapper {
    margin: 10px 70px 70px;
    box-shadow: 0px 35px 50px rgba( 0, 0, 0, 0.2);
}
.fl-table {
    border-radius: 5px;
    font-size: 12px;
    font-weight: normal;
    font-weight: 400;
    border: none;
    border-collapse: collapse;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    background-color: white;
}
.fl-table td,
.fl-table th {
    text-align: center;
    padding: 2px;
}
.fl-table td {
    border-right: 1px solid #f8f8f8;
    font-size: 12px;
}
.fl-table thead th {
    color: #ffffff;
    background: #4FC3A1;
}
.fl-table thead th:nth-child(odd) {
    color: #ffffff;
    background: #324960;
}
.fl-table tr:nth-child(even) {
    background: #F8F8F8;
}

/* Responsive */
@media (max-width: 767px) {
    .fl-table {
        display: block;
        width: 100%;
    }
    
    .table-wrapper:before {
        content: "Scroll horizontally >";
        display: block;
        text-align: right;
        font-size: 11px;
        color: white;
        padding: 0 0 10px;
    }
    
    .fl-table thead,
    .fl-table tbody,
    .fl-table thead th {
        display: block;
    }
    
    .fl-table thead th:last-child {
        border-bottom: none;
    }
    
    .fl-table thead {
        float: left;
    }
    
    .fl-table tbody {
        width: auto;
        position: relative;
        overflow-x: auto;
    }
    
    .fl-table td,
    .fl-table th {
        padding: 20px .625em .625em .625em;
        height: 60px;
        vertical-align: middle;
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: auto;
        width: 120px;
        font-size: 13px;
        text-overflow: ellipsis;
    }
    
    .fl-table thead th {
        text-align: left;
        border-bottom: 1px solid #f7f7f9;
    }
    
    .fl-table tbody tr {
        display: table-cell;
    }
    
    .fl-table tbody tr:nth-child(odd) {
        background: none;
    }
    
    .fl-table tr:nth-child(even) {
        background: transparent;
    }
    
    .fl-table tr td:nth-child(odd) {
        background: #F8F8F8;
        border-right: 1px solid #E6E4E4;
    }
    
    .fl-table tr td:nth-child(even) {
        border-right: 1px solid #E6E4E4;
    }
    
    .fl-table tbody td {
        display: block;
        text-align: center;
    }
}

/* END FL TABLE */
.over_header {
    opacity: 0.7;
}
.bg-light-border {
    border: 1px solid #ced4da;
}
.bg-light {
    color: black
}
.btn-space-with-history {
    min-width: 80px
}

.highlight-100 {
    background: rgba(231, 0, 0, 0.05)
}
.highlight-80 {
    background: rgba(231, 36, 29, 0.05)
}
.highlight-60 {
    background: rgba(239, 131, 44, 0.05)
}
.highlight-40 {
    background: rgba(255, 253, 70, 0.05)
}
.highlight-20 {
    background: rgba(156, 250, 64, 0.05)
}
.highlight-0 {
    background: rgba(96, 248, 61, 0.05)
}
.col-md-auto {
    flex: 0 0 auto;
    width: auto;
}
#profile-nav-section {
    position: absolute;
    bottom: 0;
    left: 0;
}
.show_small {
    display: none;
}
@media (max-width: 500px) {
    .hide_small {
        display: none;
    }
    
    .show_small {
        display: flex;
    }
    
    .navbar-brand,
    .side_nav_hr,
    .hide_small {
        display: none;
    }
    
    .side_nav {
        width: 500px;
        height: unset;
        min-height: unset;
        flex: unset;
    }
    
    #profile-nav-section {
        position: unset;
    }
}
.side_nav_button {
    font-size: unset
}
.side_nav_logo {
    width: 100%
}
.btn-xs {
    padding: 2px 2px;
    font-size: 11px;
    line-height: 1.2em;
}
.form-control-xs {
    padding: 2px 2px;
    font-size: 11px;
    line-height: 1.2em;
}
.column_metadata {
    background-color: white;
    margin: 4px;
    padding: 4px;
    border-radius: 5px;
}
.lead_claimed_img_wrapper {
    position: absolute;
    bottom: 40.5%;
    right: 4%;
}
.lead_card_warning_wrapper {
    position: absolute;
    bottom: 43%;
    right: 20.3%;
}

.lead_notes_button_wrapper {
    position: absolute;
    bottom: 25%;
    right: 5%;
}
.lead_edit_button_wrapper {
    position: absolute;
    bottom: 25%;
    right: 20%;
}

.popover {
    max-width:450px
}

.analytics-card {
    /* min-width: 350px; */
    margin: 10px;
}
.chart_wrapper {
    position: relative;
    height: 100%;
    width: 100%;
}
.chart_canvas {
    max-height: 30vh !important;
}
#top-htmx-indicator {
    height: 30px;
}
.messaging_site_accordion{
    width:200px;
}

.analytics_col{
    padding:4px;
}

.select2-styling {
    height:28px;
    font-size:10px;
}


#site_list_wrapper, #phone_list_wrapper{
    min-width:350px
}

#campaign_category_pk{
    min-width:350px
}

#campaign_list_wrapper{
    min-width:450px
}


.sortable_drag{
    height:100%;
}
.lead-hidden{
    height:0px;
    margin:0px;
    padding:0px;
}

#users_online_leads{
    min-width:300px;
}

.generic_modal_body_dropdown {
    z-index: 10050 !important;
}

@media (max-width: 992px) {
    .navbar-collapse {
        background-color: #212529!important;
    }
}


@keyframes flash {
0% {opacity: 1;}
50% {opacity: 0; }
100% {opacity: 1;}
}