:root {
	--primary-color  : #696969;
	--secondary-color: white;
	--vendor-color: #8e418e;
	--vendor-color-light: #e8b7e8;
	--vendor-color-dark: #491949;
	--bs-body-font-family: 'Roboto';
}

/* Theme override */
a {
	text-decoration: none;
}
/* Color */
a,
.btn-outline-primary,
.btn-outline-primary.disabled, .btn-outline-primary:disabled,
.btn-link,
.page-link,
.navbar-light .navbar-nav .nav-link {
	color: var(--primary-color);
}
/* Color with !important */
.text-primary {
	color: var(--primary-color) !important;
}
/* Faded color */
a:hover,
.btn-link:hover,
.page-link:hover {
	color: var(--primary-color);
	/*filter: brightness(80%);*/ /* Causes animation problems */
}
/* Background color */
.dropdown-item.active, .dropdown-item:active,
.custom-range::-webkit-slider-thumb,
.custom-range::-moz-range-thumb,
.custom-range::-ms-thumb,
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link,
.badge-primary,
.progress-bar {
	background-color: var(--primary-color);
}
/* Background color with !important */
.bg-primary {
	background-color: var(--primary-color) !important;
}
/* Border color */
.btn-outline-primary {
	border-color: var(--primary-color);
}
/* Border color with !important */
.border-primary {
	border-color: var(--primary-color) !important;
}
/* Background & Border colors */
.btn-primary,
.btn-primary.disabled, .btn-primary:disabled,
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle,
.custom-control-input:checked ~ .custom-control-label::before,
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before,
.page-item.active .page-link,
.list-group-item.active {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.animate {
	transition: all 1s ease;
}


/* Lists */
ul.multi-column-selection {
	list-style: none; padding: 0;
}
@media (min-width: 768px) {
	ul.multi-column-selection { columns: 2; }
}
@media (min-width: 1200px) {
	ul.multi-column-selection { columns: 3; }

	/* Container */
	.container-fluid {
		padding: 0 2rem;
	}
}

/* Multi column list using container sizing */
.multi-columns {
	container-type: inline-size;
}
.multi-columns ul {
	list-style: none; padding: 0;
}
@container (min-width: 650px) {
	.multi-columns ul { columns: 2; }
}
@container (min-width: 1000px) {
	.multi-columns ul { columns: 3; }

	/* Container */
	.container-fluid {
		padding: 0 2rem;
	}
}

/* Breadcrumb styling */
.breadcrumb { border: 0; box-shadow: none; padding: 0; }

@media (min-width: 768px) {
	.breadcrumb-side { float: right; margin-top: -60px; }
}


.bg-grey { background-color: #aaa; }
.bg-vendor, .bg-vendor td, .bg-vendor th {
	background-color: var(--vendor-color-light) !important;
}
button.bg-vendor:hover {
	background-color: var(--vendor-color) !important;
}
#registration-search-cards .badge_area {
	background: #0085bd no-repeat left top;
}
#registration-search-cards .vendor .badge_area {
	background: var(--vendor-color);
}
mark.highlight, span.highlight {
	background-color: yellow;
	padding: 0;
}

.icon24 { width: 24px; height: 24px; }
.icon32 { width: 32px; }
.icon50 { width: 50px; height: 50px; object-fit: contain; }
.icon64 { width: 64px; }
.icon100 { width: 100px; }

/* Custom CSS */

body {
	font-family: 'Roboto', sans-serif;
}
body[data-env="DEV"] #headertop {
	border-bottom: 5px solid var(--bs-gray-600);
	background-image: url("/images/backgrounds/bg-subtle-grey.png");
}
body[data-env="STAGING"] #headertop {
	border-bottom: 5px solid var(--bs-warning);
	background-image: url("/images/backgrounds/bg-cubes.png");
}
#headertop {
	padding: 0;
}
#headertop .navbar-brand {
	font-family: Raleway, sans-serif;
	min-height: 70px;
	line-height: 60px;
}
#headertop .nav-link {
	line-height: 25px;
	padding: .9rem .7rem;
}
#headertop .nav-link {
	color: white;
	text-shadow: 1px 1px 2px #515151;
}
#headertop .nav-link .fa.fa-2x {
	font-size: 24px; /* Matches with material font size */
	vertical-align: middle;
	margin-right: 3px;
}
#headertop .icon24 {
	margin: 0 5px;
}
#headertop .logo {
	max-height: 36px;
	max-width: 200px;
}
.navbar span.square-icon {
	width: 24px; height: 24px;
	display: inline-block;
	float: left;
	margin-right: 7px;
}

/* XXL screens have not full navbar */
@media (min-width: 1400px) {
	#headertop .container-fluid { max-width: 1320px; }
}

/* Tables */
.table .btn {
	white-space: nowrap;
}
tr.expired td:not(.action), tr.inactive td:not(.action)  {
	color: rgba(var(--bs-emphasis-color-rgb), .4);
}
table tr.active td:first-of-type {
	border-left: 10px solid var(--bs-success);
}
table tr.inactive td:first-of-type {
	border-left: 10px solid var(--bs-warning);
}
table tr.expired td:first-of-type {
	border-left: 10px solid var(--bs-gray);
}
table.table-spacious {
/*	line-height: 32px;*/
}

@media (min-width:1400px) {
	.table-spacious th, .table-spacious td {
		min-height: 40px;
	}
}

.tooltip {
	--bs-tooltip-max-width: 700px;
}
.product-tooltip .tooltip-inner {
	text-align: left;
	min-width: 300px;
}
.tooltip-inner img {
	max-width: 100%;
}

abbr[data-bs-toggle="tooltip"] {
	cursor: help;
	text-decoration: underline dotted;
	text-decoration-skip-ink: none;
}

#customer_name {
	font-weight: bold;
	font-family: Raleway, sans-serif;
}
#customer_name .accent {
	color: rgb(241,243,247,0.48);
}

.username, .customer_name, .company_name {
	font-family: Raleway, sans-serif;
}

.postal_code {
	text-transform: uppercase;
}

.profile-photo { position: relative; }
.profile-photo__image { position: relative; z-index: 1; }
.profile-photo__initials {
	position: absolute;
	z-index: 0;
	top: 5px;
	width: 48px; height: 48px; line-height: 48px;
	color: var(--primary-color);
	text-align: center;
	text-transform: uppercase;
	font-size: 24px;
}
.profile-photo a {
	position: relative;
	z-index: 9;
}

/* Chat Box - Customer comments */
.chat-box {
	max-width: calc(100% - 150px);
	/*background: #fff;*/
	text-align: left;
	padding: 0 7px;
	position: relative;
	border-radius: 5px;
	font-size: .9em;
}
.chat-box-right:before {
	content: "";
	width: 0px;
	height: 0px;
	position: absolute;
	border-left: 7px solid var(--bs-alert-bg);
	border-right: 7px solid transparent;
	border-top: 7px solid var(--bs-alert-bg);
	border-bottom: 7px solid transparent;
	right: -12px;
	top: 7px;
}
#customer-comments .meta {
	line-height: 13px;
	font-size: 14px;
}

/* Integrations */
img.logo-listing {
	width: 200px;
	height: 90px;
	object-fit: contain;
}
#integration-selector a {
	box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
	margin: 0 16px 16px 0;
	display: inline-block;
	padding: 10px 20px;
}

/* Coupons */
.coupon_code { font-family: monospace;  }

/* Zephyr theme fix */
.input-group-text {
	background-color: var(--bs-tertiary-bg);
}

/* Dark Mode */
[data-bs-theme="dark"] body[data-env="DEV"] #headertop {
}
[data-bs-theme="dark"] .bg-vendor,
[data-bs-theme="dark"] .bg-vendor td,
[data-bs-theme="dark"] .bg-vendor th {
	background-color: var(--vendor-color-dark) !important;
}

[data-bs-theme="dark"] tr.table-light > * {
	background-color: var(--bs-gray-800);
	color: var(--bs-gray-200);
	border-bottom: 1px solid var(--bs-gray-700);
}

[data-bs-theme="dark"] mark.highlight, [data-bs-theme="dark"] span.highlight {
	background-color: #737337;
}

/* Draggable */
.draggable {
	cursor: move;
}
tr.sort-placeholder > *, div.sort-placeholder {
	background-color: var(--bs-warning);
}

/* Programs */
.program-image {
	height: 75px; width: 125px;
	object-fit: cover;
}

/* Guests */
.guest-profile-image {
	height: 75px; width: 75px;
	object-fit: cover;
}

div.vertical-center, span.vertical-center {
	display: flex;
	align-items: center;
}
td.vertical-center {
	vertical-align: middle;
}

/* Quote Style by Catalin Rosu: https://codepen.io/catalinred/pen/YzBPadm */
.blockquote {
	margin-top: 1rem;
	padding-left: 2rem;
	position: relative;
	overflow: hidden;
}
.blockquote::before, .blockquote::after {
	position: absolute;
	color: var(--bs-tertiary-color);
}
.blockquote p {
	margin: 0;
}
.blockquote p + p {
	margin-top: 1rem;
}
.blockquote::before {
	top: -10px;
	content: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='%23777777'><path d='M9.983 3v7.391C9.983 16.095 6.252 19.961 1 21l-.995-2.151C2.437 17.932 4 15.211 4 13H0V3h9.983zM24 3v7.391c0 5.704-3.748 9.571-9 10.609l-.996-2.151C16.437 17.932 18 15.211 18 13h-3.983V3H24z'/></svg>");
	left: 0;
	opacity: .6;
}
.blockquote::after {
	content: "";
	left: 5px;
	top: 15px;
	width: 1px;
	height: 100%;
	background-color: var(--bs-tertiary-color);
}
/* End Quote Style */

/* Print layout */
@media print {
	#headertop, header, footer, .breadcrumb { display: none; }
}