@CHARSET "ISO-8859-1";
:root {
  --cb-primary: #3B1C8C;
  --cb-highlight: #FFD60A;
  --cb-hover: #2A1066;
  --cb-green: #B7ABFC;
  --cb-grey: #888;
  --cb-pink: #4E2BA8;
  --cb-success: #468847;
  --cb-alert: #C09853;
  --cb-error: #CC0000;
}

@font-face {
  font-family: "GT-Walsheim-Regular";
  src: url("../fonts/GT-Walsheim-Regular.eot"); /* IE9 Compat Modes */
  src: url("../fonts/GT-Walsheim-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/GT-Walsheim-Regular.woff") format("woff");
}
@font-face {
  font-family: "Noe Display Regular";
  src: url("../fonts/Noe Display Regular.eot"); /* IE9 Compat Modes */
  src: url("../fonts/Noe Display Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Noe Display Regular.woff") format("woff");
}
@font-face {
  font-family: "BabelStoneFlags";
  src: url("/components/com_jbooka/assets/fonts/BabelStoneFlags/BabelStoneFlags.woff") format("woff"); /* IE9 Compat Modes */
  src: url("/components/com_jbooka/assets/fonts/BabelStoneFlags/BabelStoneFlags.woff2") format("woff2"); /* Modern Browsers */
}
/* Opt in to allowing animations to/from keywords eg. auto */
:root {
  interpolate-size: allow-keywords;
}

* {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.cb-rotate-90 {
  transform: rotate(90deg);
}

/* Animations */
@keyframes wobble10 {
  0% {
    transform: rotate(0deg);
  }
  5% {
    transform: rotate(10deg);
  }
  15% {
    transform: rotate(-10deg);
  }
  20% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(10deg);
  }
  35% {
    transform: rotate(-10deg);
  }
  40% {
    transform: rotate(0deg);
  }
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  35% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.75);
  }
  50% {
    transform: scale(1.4);
  }
  55% {
    transform: scale(1.75);
  }
  65% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}
html {
  background-color: #ede1ee; /* fallback for the body gradient */
}

body {
  /*color: #333;*/
  background: linear-gradient(135deg, #ede1ee 0%, #f3eaf2 35%, #e6ecf2 75%, #dde7f0 100%) fixed;
  min-height: 100vh;
  padding: 0;
  margin: 0;
  line-height: 1.7em;
  font-family: "GT-Walsheim-Regular", sans-serif;
  font-size: 14px;
  font-weight: 300;
  color: var(--cb-primary);
}

a {
  text-decoration: none;
  /* color: #fef86d; */
  color: var(--cb-primary);
  -moz-transition: all 0.5s ease 0s;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  cursor: pointer;
}

input, select, textarea {
  color: rgba(0, 0, 0, 0.6);
}

input:focus, select:focus, textarea:focus {
  color: rgba(0, 0, 0, 0.87);
}

button, html, input, select, textarea {
  font-family: "GT-Walsheim-Regular", sans-serif;
}

p {
  line-height: 21px;
  margin-bottom: 8px;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  font-size: 18px;
  color: white;
  line-height: 70px;
}

h2 {
  font-size: 16px;
}

h3 {
  font-size: 14px;
}

img {
  border: none;
  border: 0;
  max-width: 100%;
  height: auto;
}

textarea {
  box-sizing: border-box;
}

table {
  /* border-collapse: collapse; */
  border-spacing: 0;
}

th {
  padding: 5px;
  font-size: 16px;
}

td {
  padding: 5px;
}

div#system-debug {
  padding-left: 250px;
}

.nowrap {
  white-space: nowrap;
}

.invisible {
  visibility: hidden;
}

:focus {
  outline: none;
}

ul, li {
  list-style: none;
}

ul.cb-bullets li {
  list-style-type: disc !important;
  list-style-position: inside !important;
  text-indent: -20px;
  margin-left: 20px;
}

.left_modules {
  width: 270px;
  position: relative;
  transition: width 0.4s;
}

.left_modules_fixed {
  background-color: white;
  width: 270px;
  transition: width 0.4s;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
}

.md-button.md-raised.md-accent:not([disabled]) {
  color: white;
}
.md-button.md-raised.md-accent:not([disabled]) md-icon {
  color: white;
}

md-sidenav.cb-main-menu {
  width: 275px;
  min-width: 275px;
  max-width: 275px;
  /* Prevent main menu from spilling into lower content in sidebar */
}
md-sidenav.cb-main-menu > div:last-child > *:not(:first-child) {
  background-color: white;
  z-index: 2;
}

.md-sidemenu-wrapper {
  transition-delay: 2s;
}
.md-sidemenu-wrapper.md-active {
  transition-delay: 0s;
}

.cb-header-desktop-left {
  height: 80px;
  width: 250px;
  min-width: 250px;
  padding: 24px;
  transition: padding 0.4s;
}

img#logo {
  height: 32px;
}

.md-sidemenu {
  padding: 0;
  transition: padding 0.4s;
}
.md-sidemenu.menu1 {
  border-top: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
}
.md-sidemenu .md-button {
  padding: 0 27px;
  /* transition: padding 0.4s; */
}
.md-sidemenu .md-button span {
  max-width: 175px;
  opacity: 1;
  transition: max-width 0.4s, opacity 0.4s;
  overflow: hidden;
  white-space: nowrap;
}

.md-sidemenu-toggle md-icon:last-child {
  color: #adadad;
  overflow: hidden;
  transition: width 0.4s, opacity 0.4s;
  font-size: 16px;
  line-height: 16px;
  height: 16px;
  min-height: 16px;
  width: 16px;
  min-width: 16px;
}

.md-sidemenu-toggle md-icon:first-child,
.md-sidemenu-button md-icon:first-child {
  margin-left: 4px;
  margin-right: 20px;
  /* Workaround for lack of ability to directly apply 's18' CSS style to icons within angular-material-sidemenu group elements */
  height: 18px;
  width: 18px;
  min-height: 18px;
  min-width: 18px;
}

#providerSelectForm select {
  width: calc(100% - 10px);
  border: none;
  border-bottom: 1px solid var(--cb-primary);
  margin: 5px;
  padding: 8px;
  color: var(--cb-primary);
  opacity: 1;
  transition: opacity 0.4s;
}

.cb-copyright {
  opacity: 1;
  transition: opacity 0.4s;
  white-space: nowrap;
  overflow: hidden;
  text-align: center;
}

/* Menu collapsing */
.cb-menu-collapse-trigger {
  position: relative;
  cursor: pointer;
  transform: translateX(0) rotate(0deg);
  transform-origin: left center;
  opacity: 1;
  transition: transform 0.3s, opacity 0.4s;
}
.cb-menu-collapse-trigger md-icon {
  fill: #adadad;
}
.cb-menu-collapse-trigger.cb-menu-collapsed {
  transform: translateX(-118px) rotate(-180deg);
  transform-origin: left center;
  transition: transform 0.3s, opacity 0.4s;
}

.cb-menu-collapsed {
  /* .cb-header-desktop-left {
  	padding: 20px 15px;
  	transition: padding 0.4s;
  } */
  /* .md-sidemenu .md-button {
  	transition: padding 0.4s;
  	padding: 0 27px;
  } */
}
.cb-menu-collapsed .left_modules,
.cb-menu-collapsed .left_modules_fixed {
  width: 80px;
  transition: width 0.4s;
}
.cb-menu-collapsed .left_modules_fixed .cb-menu-collapse-trigger.cb-menu-collapsed {
  opacity: 0;
  transition: transform 0.3s, opacity 0.4s;
}
.cb-menu-collapsed .md-sidemenu .md-button span {
  max-width: 0;
  opacity: 0;
  transition: max-width 0.4s, opacity 0.4s;
}
.cb-menu-collapsed .md-sidemenu-toggle md-icon:last-child {
  min-width: 0;
  min-height: 0;
  width: 0;
  opacity: 0;
  transition: width 0.4s, opacity 0.4s;
}
.cb-menu-collapsed #providerSelectForm select {
  opacity: 0;
  transition: opacity 0.4s;
}
.cb-menu-collapsed .cb-copyright {
  opacity: 0;
  transition: opacity 0.4s;
}

/* Submenu */
.cb-submenu-wrapper {
  background-color: var(--cb-hover);
  width: auto !important;
}

.cb-have-menu-items .cb-submenu-wrapper {
  box-shadow: 6px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.cb-have-menu-items .cb-submenu-wrapper .cb-submenu-title {
  height: 80px;
  padding: 30px;
  overflow: hidden;
  white-space: nowrap;
}

.cb-submenu-wrapper-inner {
  position: relative;
  height: 100vh;
  overflow-y: auto;
  background-color: var(--cb-hover);
}

.cb-submenu-pullout-tab {
  display: none;
  position: fixed;
  width: 30px;
  height: 50px;
  top: 92px;
  background-color: var(--cb-pink);
  z-index: 10;
  border-top-right-radius: 50%;
  border-bottom-right-radius: 50%;
  box-shadow: 3px 0px 6px 1px rgba(0, 0, 0, 0.2);
}
.cb-submenu-pullout-tab md-icon {
  fill: white;
}

.cb-have-menu-items .cb-submenu-pullout-tab {
  display: flex;
}

cb-submenu-item {
  min-width: 200px;
  min-height: 40px;
  margin: 0 20px;
}
cb-submenu-item .md-button {
  text-transform: none;
  border-radius: 4px;
  margin: 0 8px;
}
cb-submenu-item .md-button md-icon {
  fill: color-mix(in srgb, var(--cb-primary), white 60%) !important;
  margin: 0 5px;
}
cb-submenu-item .md-button.cb-submenu-item-active {
  background-color: var(--cb-primary) !important;
}
cb-submenu-item .md-button.cb-submenu-item-active md-icon {
  fill: white;
}
cb-submenu-item .md-button span {
  margin: 0 15px;
}
cb-submenu-item .md-button span.cb-submenu-subtitle {
  line-height: 12px;
  font-size: 12px;
  margin-bottom: 8px;
  opacity: 80%;
}

.cb-layout-sm cb-submenu-item {
  margin: 0;
}

cb-submenu-nav button.md-button {
  white-space: normal;
  line-height: initial;
  min-height: 52px;
}
cb-submenu-nav button.md-button.cb-nav-disabled {
  visibility: hidden;
}
cb-submenu-nav.cb-bottom-submenu-nav button {
  margin: 20px 10px;
}

.cb-layout-xs cb-submenu-nav button.md-button {
  font-size: 12px !important;
}

/***** 
 ***** Main column
 *****/
.cb-main-column {
  min-height: 100vh;
  color: white;
}

.cb-homepage {
    color: var(--cb-primary);
}

.cb-layout-xs .cb-main-column,
.cb-layout-sm .cb-main-column {
  min-height: 0;
}

/* Header section */
.cb-browser-notice {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  max-height: 100px;
  opacity: 1;
  transition: max-height 0.3s ease, opacity 0.3s ease;
}
.cb-browser-notice md-icon {
  margin-left: 5px;
  cursor: pointer;
}
.cb-browser-notice.cb-hide-browser-notice {
  max-height: 0;
  opacity: 0;
}
.cb-browser-notice .cb-browser-notice-inner {
  background-color: #adadad;
  border: 1px solid #5a707f;
  color: white;
  padding: 2px 10px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  max-width: 90%;
}

subheader {
  height: 80px;
  padding: 0 40px;
  background-color: var(--cb-primary);
}

.cb-page-heading h1 {
  font-size: 18px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* User Menu */
.cb-user-menu {
  margin: 20px 0 20px 22px;
}
.cb-user-menu > md-menu > .md-button {
  text-transform: none;
}
.cb-user-menu > md-menu > .md-button:not([disabled]):hover {
  background: none !important;
}
.cb-user-menu > md-menu > .md-button md-icon {
  fill: color-mix(in srgb, var(--cb-primary), white 50%);
}
.cb-user-menu avatar md-icon {
  fill: var(--cb-highlight);
  box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  border-radius: 25px;
}

.cb-layout-xs .cb-user-menu {
  margin-right: 10px;
}
.cb-layout-xs .cb-user-menu > md-menu > .md-button md-icon {
  fill: #adadad;
}
.cb-layout-xs .cb-user-menu > md-menu > .md-button span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.cb-notifications-button {
  overflow: visible;
}
.cb-notifications-button md-icon {
  color: white !important;
}
.cb-notifications-button.cb-new-notifications md-icon {
  animation: wobble10 2s infinite;
  fill: rgb(255, 128, 171) !important;
}

md-menu.md-open .cb-notifications-button {
  background-color: white;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.cb-notification {
  color: var(--cb-grey) !important;
  max-width: 250px;
  min-width: 250px;
  padding: 12px;
}
.cb-notification.new {
  background-color: rgba(0, 255, 0, 0.1);
}
.cb-notification .cb-notification-info {
  font-size: 10px;
  line-height: 10px;
}
.cb-notification .cb-notification-info .cb-notification-date {
  color: #AAA;
  text-align: right;
}

.cb-show-tooltips-menu-item md-icon {
  margin-right: 16px;
}
.cb-show-tooltips-menu-item md-switch {
  margin: 0;
}
.cb-show-tooltips-menu-item md-switch.md-inverted .md-container {
  margin-left: 16px;
}

@media (max-width: 600px) {
  .md-panel-inner-wrapper {
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: initial !important;
  }
  md-tooltip.md-tooltip.md-show {
    max-height: 75vh !important;
  }
}
/* Main content body */
.cb-dashboard-content-wrapper {
  position: relative;
}

.cb-dashboard-content {
  padding: 40px;
  width: 100%;
  position: relative; /* Allows absolutely positioned overlays to cover the content area such as for listing preview */
  /* Allow full width content body */
}
.cb-dashboard-content > * {
  max-width: 1020px;
  width: 100%;
  transition: max-width 0.6s;
  margin: 0 auto;
}
.cb-dashboard-content > .cb-fullwidth {
  max-width: 100%;
  transition: max-width 0.6s;
}
.cb-dashboard-content tr td {
  border-bottom: 1px solid #E0E0E0;
}

.cb-content-column-wrapper {
  overflow-x: hidden;
}

header.cb-header-mobile {
  padding: 10px 20px;
  background-color: white;
}
header.cb-header-mobile img#logo {
  height: 30px;
}
header.cb-header-mobile h1 {
  line-height: 30px;
  color: var(--cb-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0 20px;
  overflow: hidden;
}
header.cb-header-mobile .md-button.md-icon-button {
  margin: 0;
  height: 30px;
  padding: 3px;
  width: 30px;
}

.cb-layout-xs subheader,
.cb-layout-xs .cb-dashboard-content {
  padding: 20px 10px;
}

.cb-layout-xs .cb-dashboard-content,
.cb-layout-sm .cb-dashboard-content {
  padding: 20px 10px;
  margin-bottom: 100px;
}

/* Bottom nav (for small screens) */
bottom-nav {
  position: fixed;
  bottom: 0px;
  background-color: var(--cb-hover);
  width: 100%;
  padding: 0;
  z-index: 21;
  opacity: 0.95;
  box-shadow: 0px -3px 3px 0 rgba(0, 0, 0, 0.2);
}
bottom-nav .md-button {
  margin: 0;
  padding: 12px;
  border-radius: 0;
  background-color: var(--cb-hover);
  color: white;
}
bottom-nav .md-button md-icon {
  color: white;
}
bottom-nav .md-button md-icon[md-svg-icon^=cb-] {
  stroke: white;
}
bottom-nav .md-button span {
  line-height: 20px;
}
bottom-nav .cb-bottom-nav-menu .md-button {
  min-width: 80px;
  border: 1px solid var(--cb-hover);
}
bottom-nav .cb-bottom-nav-menu .md-button span {
  display: none;
  line-height: 24px;
  font-size: 12px;
}

.cb-layout-xs bottom-nav .md-button md-icon {
  height: 18px;
  width: 18px;
  min-height: 18px;
  min-width: 18px;
}

/* Footer section */
.footer {
  /* background:#0c143a; */
  color: white;
  padding: 25px;
  margin: 35px 0 0;
}

/* System message box formatting. */
h4.alert-heading, a.close {
  display: none;
}

joomla-alert {
  font-size: 150%;
  background-color: #FCF8E3;
  border: 0;
  border-left: 5px solid var(--cb-alert);
  padding: 8px 25px;
  max-width: 970px;
  margin: 10px auto;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  text-align: center;
  color: var(--cb-alert);
}
joomla-alert h4 {
  color: #C09853;
}

joomla-alert[type=success] {
  background-color: #DFF0D8;
  border-color: var(--cb-success);
  color: var(--cb-success);
}

/* Other stuff */
.cb-hide-tools-menu .cb-tools-menu {
  display: none;
}

.cb-notification-count {
  position: absolute;
  top: 22px;
  left: 24px;
  font-size: 8px;
  background-color: seagreen;
  border-radius: 50%;
  line-height: 8px;
  padding: 4px 2px 2px 2px;
  min-width: 10px;
  text-align: center;
  color: white;
  overflow: visible;
  z-index: 100;
}

.cb-align-self-start {
  align-self: flex-start;
}

.cb-align-self-end {
  align-self: flex-end;
}

/* Hide content article headnigs within dashboard */
.page-header h2[itemprop=headline] {
  display: none;
}

/* Add some bottom margin for checkboxes if next sibling is not a checkbox */
md-checkbox:has(+ :not(md-checkbox):not(.hint)) {
  margin-bottom: 20px;
}

:not(md-input-container) > md-checkbox:first-child {
  margin-top: 20px;
}

/*** Child records table ***/
.cb-child-records .cb-expand-trigger-wrapper {
  margin-right: 20px;
  min-width: 24px;
}
.cb-child-records md-icon.cb-status-icon {
  padding: 4px 3px 0 0;
}
.cb-child-records:not(.cb-multiple-children) .cb-multiple-children-only, .cb-child-records.cb-multiple-children .cb-single-schedule-only {
  display: none;
}
.cb-child-records:not(.cb-multiple-children) .cb-multiple-children-only .cb-child-record, .cb-child-records.cb-multiple-children .cb-single-schedule-only .cb-child-record {
  border-top: none;
}
.cb-child-records .cb-child-record {
  color: #999fae;
  border: none;
  border-top: 1px solid #E0E0E0;
  border-radius: 0;
  padding-bottom: 5px;
  font-size: 12px;
}
.cb-child-records .cb-child-record row:first-child {
  cursor: pointer;
}
.cb-child-records .cb-child-record:last-child {
  border-bottom: 1px solid #E0E0E0;
  margin-bottom: 20px;
}
.cb-child-records .cb-child-record .md-headline {
  color: var(--cb-primary);
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
}
.cb-child-records .cb-child-record .cb-ordering {
  margin-right: 20px;
  min-width: 24px;
}
.cb-child-records .cb-child-record.cb-menu-item md-switch {
  margin: 8px 16px;
  transform: scale(0.8);
}
.cb-child-records .cb-child-record.cb-menu-item .cb-menu-item-type {
  margin-right: 8px;
}

.cb-layout-xs .cb-child-records .cb-child-record row:not(:first-child):not([class*=-edit-row]) {
  margin-left: 30px;
}
.cb-layout-xs .cb-child-records .cb-child-record row.cb-table-menu-toolbar {
  margin-left: 0;
}
.cb-layout-xs .cb-child-records .cb-child-record row md-switch {
  margin-top: 8px;
}
.cb-layout-xs .cb-child-records .cb-child-record .cb-ordering,
.cb-layout-xs .cb-child-records .cb-child-record .cb-expand-trigger-wrapper {
  margin-right: 10px;
}
.cb-layout-xs .cb-child-records .cb-child-record .cb-published {
  margin: 0;
}

/****** CB-Bookings Popup List *****/
.cb-popup-list-container {
  position: relative; /* Allows the pop-up invoice details box to overflow the containers properly */
  display: inline-block;
}
.cb-popup-list-container .invoiceDetails {
  display: none;
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: white;
  padding: 10px;
  z-index: 500;
  width: 250px;
  font-size: 80%;
  white-space: normal;
}
.cb-popup-list-container:hover div.invoiceDetails {
  display: block;
}
.cb-popup-list-container .invoiceDetail {
  border: 1px solid silver;
  border-radius: 3px;
  background-color: #eee;
  margin-bottom: 10px;
  cursor: pointer;
}
.cb-popup-list-container .invoiceDetail:hover {
  border-color: gray;
}
.cb-popup-list-container .invoiceDetail:last-child {
  margin-bottom: 0;
}
.cb-popup-list-container .invoiceHeader {
  background-color: #d5d5d5;
  font-weight: bold;
  padding: 7px;
}
.cb-popup-list-container .invoiceContent {
  padding: 7px;
}
.cb-popup-list-container .invoiceNr {
  font-size: 130%;
}
.cb-popup-list-container .invoiceItem hr {
  border: 0;
  height: 1px;
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
  margin: 7px 0px;
}
.cb-popup-list-container .itemLabelListing {
  font-size: 120%;
}

/***** File Inputs *****/
/* File input styling solution found here: https://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/ */
.inputfile {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
.inputfile + label {
  min-width: 150px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  padding: 8px 16px;
  color: #f1e5e6;
  background-color: var(--cb-primary);
  border-radius: 3px;
}
.inputfile + label svg {
  width: 1em;
  height: 1em;
  vertical-align: middle;
  fill: currentColor;
  margin-top: -0.25em;
  margin-right: 0.25em;
}
.inputfile:focus + label, .inputfile.has-focus + label {
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
  background-color: var(--cb-hover);
}
.inputfile + label:hover {
  background-color: var(--cb-hover);
}

cb-field .inputfile + label {
  padding: 8px;
  color: white !important;
  border-radius: 3px;
  transform: none !important;
  position: relative !important;
  margin: 2px 0;
  pointer-events: all !important;
  min-width: 150px;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
}
cb-field md-input-container .cb-field-label {
  transform-origin: left top !important;
  transform: translate3d(0, 6px, 0) scale(0.75) !important;
}
cb-field .cb-field-instance.cb-field-multichoice md-checkbox {
  margin-top: 8px;
  margin-bottom: 0px;
}
cb-field .cb-field-instance.cb-field-multichoice md-input-container {
  margin-top: 0;
}
cb-field .cb-field-instance.cb-field-phone md-input-container {
  position: relative;
}
cb-field .cb-field-instance.cb-field-phone md-input-container .cb-country-flag {
  position: absolute;
  top: 8px;
  left: 5px;
  font-family: "BabelStoneFlags";
  font-size: 14px;
}
cb-field .cb-field-instance.cb-field-phone md-input-container input {
  padding-left: 30px;
}
cb-field .cb-field-instance.cb-field-radio md-input-container label {
  position: relative;
}

/**** Saving indicator, used on listing and organisation profile pages ****/
.cb-saving-indicator {
  position: fixed;
  left: 280px;
  bottom: 30px;
  padding: 0 10px;
  opacity: 0.9;
  background-color: white;
  color: var(--cb-primary);
  font-size: 120%;
  /* font-weight: bold; */
  border-radius: 25px;
  /*min-width: 150px;
  min-height: 50px;*/
  box-shadow: 0 0 40px 10px white;
  z-index: 75;
}
.cb-saving-indicator.saving {
  z-index: 1000;
}
.cb-saving-indicator.saved {
  opacity: 0;
  transition: opacity 10s ease;
}

.cb-menu-collapsed .cb-saving-indicator {
  left: 95px;
}

.cb-layout-xs .cb-saving-indicator,
.cb-layout-sm .cb-saving-indicator {
  left: initial;
  right: 20px;
  box-shadow: none;
  bottom: 70px;
}

/***** RSVP Forms *****/
.cb-rsvp-form md-input-container .md-errors-spacer {
  min-height: 0px;
}
.cb-rsvp-form md-input-container.md-icon-left {
  padding-left: 40px !important;
}
.cb-rsvp-form md-input-container.md-icon-left md-icon {
  padding: 0 4px;
}
.cb-rsvp-form .cb-rsvp-item-card {
  color: var(--cb-grey) !important;
  margin: 0 16px 16px 0;
  padding: 6px 26px 6px 6px;
  position: relative;
}
.cb-rsvp-form .cb-rsvp-item-card .cb-remove-rsvp-item {
  position: absolute;
  right: -12px;
  top: -6px;
}
.cb-rsvp-form .cb-rsvp-item-card > div {
  padding: 6px;
}
.cb-rsvp-form .cb-rsvp-item-card > div md-icon {
  margin-right: 8px;
}
.cb-rsvp-form .cb-multiple-item-inputs {
  padding: 4px 12px 20px;
  background-color: #f5f8ff;
  border-radius: 3px;
  font-style: italic;
}
.cb-rsvp-form .cb-rsvp-dialog md-list-item.cb-selected {
  background-color: rgba(158, 158, 158, 0.2);
}
.cb-rsvp-form .cb-rsvp-dialog md-list-item p {
  font-size: 13px;
}

/***** Email Template Picker *****/
.cb-email-template-choice {
  margin: 0 8px;
  transition: box-shadow 0.4s linear;
}
.cb-email-template-choice img {
  max-height: 150px;
}
.cb-email-template-choice span {
  padding-top: 8px;
  color: #a0a0a0;
}
.cb-email-template-choice:hover {
  box-shadow: 0px 1px 3px 2px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.2s linear;
}
.cb-email-template-choice.cb-template-selected {
  box-shadow: 0px 1px 10px 2px rgba(0, 0, 0, 0.15);
  border-radius: 3px;
  background-color: white;
}

/***** Custom Reports Dialog *****/
.cb-report-dlg {
  overflow: hidden;
}
.cb-report-dlg md-dialog-actions {
  min-height: 69px;
}
.cb-report-dlg md-dialog-content {
  max-width: 600px;
  padding: 16px;
}
.cb-report-dlg md-tabs {
  padding-bottom: 8px;
}
.cb-report-dlg md-tabs md-tabs-wrapper {
  display: none;
}
.cb-report-dlg md-select {
  margin-top: 0;
}
.cb-report-dlg md-checkbox .md-container {
  top: 0;
  -webkit-transform: none;
  transform: none;
}
.cb-report-dlg div[class^="cb-field-custom_fields."] .cb-dl-field-label,
.cb-report-dlg md-select-menu div[class^="cb-field-custom_fields."] .cb-dl-field-label {
  font-style: italic;
}
.cb-report-dlg .cb-field-group-label,
.cb-report-dlg md-option .cb-field-group-label {
  font-size: 12px;
  color: #888;
}
.cb-report-dlg #download-sortable-container {
  position: relative;
}
.cb-report-dlg .as-sortable-item md-icon {
  fill: #0c143a;
}
.cb-report-dlg .as-sortable-item md-icon.cb-remove-export-field {
  cursor: pointer;
}
.cb-report-dlg .as-sortable-item {
  padding: 6px 10px;
  border: none;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12);
  min-height: auto;
}
.cb-report-dlg .as-sortable-placeholder {
  padding: 6px 10px;
  min-height: 30px;
}
.cb-report-dlg md-input-container.md-icon-left {
  margin-left: 4px !important;
}
.cb-report-dlg .cb-report-filter-criterion {
  color: #888;
  margin: 10px 20px;
}
.cb-report-dlg .cb-report-filter-criterion md-checkbox {
  min-width: 30px;
}
.cb-report-dlg .cb-criterion-value {
  margin-left: 20px;
  font-style: italic;
}
.cb-report-dlg .cb-criterion-filled .cb-criterion-value {
  color: var(--cb-pink);
}
.cb-report-dlg .cb-criterion-enabled .cb-criterion-label {
  color: #333;
}
.cb-report-dlg .cb-cancel-dlg {
  max-width: 500px;
}
.cb-report-dlg tr.cb-customer-status_ANONYMISED td {
  color: #999fae !important;
}
.cb-report-dlg .cb-dl-field-label:after {
  display: block;
  font-size: 12px;
  font-style: normal;
  color: #888;
}
.cb-report-dlg .cb-field-custom_fields\.customer .cb-dl-field-label:after {
  content: "Adds ALL customer-level custom fields to your download file";
}
.cb-report-dlg .cb-field-custom_fields\.participant_profile .cb-dl-field-label:after {
  content: "Adds ALL attendee-level custom fields to your download file";
}
.cb-report-dlg .cb-search-form md-icon[md-svg-icon^=cb-] {
  stroke: currentColor !important;
}
.cb-report-dlg .cb-download-field-selections md-checkbox {
  min-height: 26px;
  min-width: 34px;
}
.cb-report-dlg .cb-download-field-selections md-checkbox .md-container {
  margin: 4px 12px 4px 4px;
}
.cb-report-dlg .cb-export-field .cb-duplicate-export-field-button {
  margin: 0 8px;
  opacity: 0;
  transition: opacity 0.2s linear;
}
.cb-report-dlg .cb-export-field:hover .cb-duplicate-export-field-button {
  opacity: 0.7;
}
.cb-report-dlg .cb-export-field-group-customer {
  background-color: color-mix(in srgb, var(--cb-primary), white 85%);
}
.cb-report-dlg .cb-export-field-group-invoice {
  background-color: color-mix(in srgb, var(--cb-highlight), white 65%);
}
.cb-report-dlg .cb-export-field-group-invoice_item {
  background-color: color-mix(in srgb, var(--cb-green), white 70%);
}
.cb-report-dlg .cb-export-field-group-participant {
  background-color: color-mix(in srgb, var(--cb-pink), white 75%);
}
.cb-report-dlg cb-event-filters > div {
  padding-right: 8px;
}

/***** JSON Schema Forms *****/
schema-form {
  position: relative;
}
schema-form schema-form:not(.cb-array-layout-row):not(.cb-object-layout-row) {
  padding: 16px 0 0 16px;
  position: relative;
  overflow: hidden;
}
schema-form schema-form:not(.cb-array-layout-row):not(.cb-object-layout-row):before {
  content: "";
  top: 0;
  width: 10px;
  left: 0;
  bottom: calc(100% - 28px);
  border-bottom: 1px solid silver;
  border-left: 1px solid silver;
  position: absolute;
  display: block;
}
schema-form schema-form:not(.cb-array-layout-row):not(.cb-object-layout-row):not(:last-child):after {
  content: "";
  bottom: 0;
  width: 10px;
  left: 0;
  top: 28px;
  border-left: 1px solid silver;
  position: absolute;
  display: block;
}
schema-form schema-form.cb-array-layout-row,
schema-form schema-form.cb-object-layout-row {
  padding-left: 8px;
}
schema-form schema-form > div.cb-schema-form-array .md-button.md-icon-button {
  padding: 0 8px;
  height: initial;
  min-height: 24px;
}
schema-form .cb-element-controls {
  position: absolute;
  right: 8px;
  top: 32px;
  z-index: 20;
}
schema-form .cb-element-controls > * {
  margin: 0 12px;
}
schema-form .cb-element-controls .cb-remove-button md-icon {
  color: darkred;
}
schema-form .cb-element-controls .cb-sort-button-wrapper {
  width: 16px;
}
schema-form .cb-schema-form-scalar .cb-element-controls {
  right: 4px;
  top: 16px;
}
schema-form .cb-schema-form-scalar:has(md-select) .cb-element-controls {
  right: -10px;
  top: 36px;
}
schema-form .cb-schema-form-scalar input {
  padding-right: 20px;
}
schema-form .cb-property-name-input-wrapper,
schema-form .cb-property-name-list-wrapper {
  padding-left: 8px;
  border-left: 1px solid silver;
}
schema-form .cb-property-name {
  font-style: italic;
}
schema-form .md-button.md-icon-button.cb-add-object-property-button,
schema-form .md-button.md-icon-button.cb-add-array_entry-button {
  margin: 8px 0;
}
schema-form input:not(.md-input)::placeholder {
  font-style: italic;
  color: silver;
  font-size: 90%;
}
schema-form .cb-tod input {
  max-width: 60px;
}
schema-form input.ng-invalid {
  border-color: rgb(221, 44, 0);
}
schema-form > div > div[ng-switch-when] {
  padding: 4px;
}
schema-form > div.cb-schema-form-scalar > div[ng-switch-when]:not(.cb-schema-input-type-basic) {
  border: 1px solid silver;
  border-radius: 3px;
  margin-right: 20px;
}
schema-form .cb-collapsible-label * {
  cursor: pointer;
}
schema-form .cb-collapsible.cb-collapsed > div > .cb-collapse-toggle {
  transform: rotate(270deg);
}
schema-form .cb-collapsed .cb-hide-when-collapsed {
  display: none;
}
schema-form md-input-container .md-errors-spacer {
  min-height: 0px;
}
schema-form.cb-array > div {
  padding: 10px;
}
schema-form.cb-array > div > .cb-collapsible {
  background-color: rgb(230, 255, 255);
  padding: 16px;
  box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.2);
}
schema-form md-input-container {
  margin-bottom: 0;
}
schema-form .cb-schema-form-boolean md-input-container {
  margin: 0;
}
schema-form .cb-additional-property {
  overflow: visible !important;
}
schema-form .cb-additional-property .cb-schema-node.cb-popup-edit-property {
  box-shadow: rgba(0, 0, 0, 0.18) 0px 0px 0px;
  padding: 0 4px 0 8px;
  margin: 2px 4px;
  border-radius: 8px;
  transition: margin linear 0.2s, box-shadow linear 0.2s;
  cursor: pointer;
  position: relative;
}
schema-form .cb-additional-property .cb-schema-node.cb-popup-edit-property .cb-element-controls {
  top: 16px;
}
schema-form .cb-additional-property .cb-schema-node.cb-popup-edit-property:hover {
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  margin: 2px 0px;
}

.cb-schema-item-dlg > schema-form {
  padding: 16px 0 0 16px;
}

/********* Collapsible Target directive related styles */
.collapse-trigger md-icon.collapse-trigger-icon svg {
  transition: transform 0.4s ease-in-out;
  transform: rotate(0deg);
}
.collapse-trigger.collapsed md-icon.collapse-trigger-icon svg {
  transform: rotate(-90deg);
}

.collapse-trigger-icon {
  cursor: pointer;
}

.collapse-wrapper {
  overflow-y: clip;
  opacity: 1;
  transition: all 0.4s ease-in-out;
  height: max-content;
}
.collapse-wrapper.collapsed {
  opacity: 0;
  height: 0px;
}

/* End: Collapsible Target directive related styles */
/****** CB Plugins management ******/
.cb-plugin-dlg {
  max-width: min(90vw, 1000px);
  min-width: max(300px, 40vw);
}
.cb-plugin-dlg ul {
  padding-left: 20px;
}
.cb-plugin-dlg ul li {
  list-style: circle inside none;
}

md-input-container.cb-extension-search {
  max-height: 34px;
  opacity: 1;
  transition: max-height ease-out 0.5s, opacity ease-out 0.5s, margin ease-out 0.5s;
}
md-input-container.cb-extension-search .md-errors-spacer {
  min-height: 0;
}

h1.cb-extension-title {
  margin-bottom: 8px;
}
h1.cb-extension-title md-icon {
  fill: var(--cb-primary) !important;
}
h1.cb-extension-title span {
  color: var(--cb-primary) !important;
  line-height: 40px;
  margin: 0 8px;
}

md-list-item .cb-extension-label {
  color: var(--cb-primary) !important;
}
md-list-item .cb-extension-summary {
  font-size: 13px !important;
}

.cb-extension-select {
  max-width: 65vw;
}

.cb-extension-list img.md-avatar {
  width: 80px;
  height: 80px;
  border-radius: 10%;
  margin: 0 16px 0 0 !important;
}
.cb-extension-list md-icon.md-avatar {
  width: 80px !important;
  height: 80px;
  margin: 0 16px 0 0 !important;
}

plugin md-icon.md-avatar,
plugin img.md-avatar {
  height: 80px;
  width: 80px;
  border-radius: 10%;
  margin: 0 16px 0 0 !important;
}
plugin.cb-global-plugin {
  background-color: lavender;
  font-style: italic;
}
plugin.cb-global-plugin.cb-overridden-plugin {
  font-style: normal;
  background-color: #F6F6FD;
}

/****** CB Micro-styles management ******/
.cb-style-parameter {
  background-color: rgb(230, 255, 255);
  padding: 16px;
  box-shadow: 1px 1px 8px 0px rgba(0, 0, 0, 0.2);
  margin-top: 24px;
}
.cb-style-parameter .cb-style-parameter-name {
  font-weight: bold;
}

h1.cb-style-title {
  margin-bottom: 8px;
}
h1.cb-style-title md-icon {
  fill: var(--cb-primary) !important;
}
h1.cb-style-title span {
  color: var(--cb-primary) !important;
  line-height: 40px;
  margin: 0 8px;
}

/****** Extensions management ******/
md-list.cb-extension-list {
  column-width: 400px;
  column-gap: 26px;
  /* Prevent icons on right side of the list items from being cut off */
}
md-list.cb-extension-list md-list-item button.md-button.md-icon-button.cb-extension-uses-tool {
  position: absolute;
  right: 0;
  background: rgba(255, 255, 255, 0.8);
  padding: 16px;
  height: 56px;
  width: 56px;
  display: none;
}
md-list.cb-extension-list md-list-item:hover button.md-button.md-icon-button.cb-extension-uses-tool {
  display: block;
}
md-list.cb-extension-list .md-button.md-icon-button {
  min-width: 40px;
}

/* iOS Safari workaround */
body.cb-browser-Safari.cb-os-iOS .md-dialog-container {
  height: 100% !important;
  position: fixed !important;
  top: 0px !important;
}

.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.visually-hidden:not(caption),
.visually-hidden-focusable:not(:focus):not(:focus-within):not(caption) {
  position: absolute !important;
}

input.button, button {
  background-color: #ff5990;
  min-height: 23px;
  padding: 0 14px;
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 13px;
}

hr.cb-subsection {
  margin: 15px 25%;
  border: 1px solid;
}

hr.cb-section-divider {
  margin: 45px 0 45px;
  border: none;
  border-top: 1px solid var(--cb-hover);
  position: relative;
  left: -2000px;
  width: calc(100% + 4000px);
}

.cb-info-text {
  color: #999fae;
}

.cb-info-box {
  border-top: 2px solid var(--cb-primary);
  border-bottom: 2px solid var(--cb-primary);
  background-color: color-mix(in srgb, var(--cb-primary), white 85%);
  /* border-radius: 4px; */
  padding: 15px;
  margin: 15px 0;
}
.cb-info-box p {
  margin-bottom: 10px;
}
.cb-info-box ul li {
  list-style-type: disc !important;
  list-style-position: inside !important;
  text-indent: -20px;
  margin-left: 20px;
}
.cb-info-box > md-icon,
.cb-info-box > img {
  margin: 0 15px 15px 0;
  float: left;
  color: var(--cb-primary);
}
.cb-info-box .cb-privacy-notice {
  margin: 20px 0;
}
.cb-info-box .cb-privacy-notice md-icon, .cb-info-box .cb-privacy-notice img {
  margin-bottom: 0;
}
.cb-info-box.cb-warn {
  border-top: 2px solid var(--cb-alert);
  border-bottom: 2px solid var(--cb-alert);
  background-color: color-mix(in srgb, var(--cb-alert), white 60%);
  color: var(--cb-alert);
}
.cb-info-box.cb-warn md-icon, .cb-info-box.cb-warn img {
  color: var(--cb-alert);
}

md-icon.cb-error-icon {
  fill: var(--cb-error);
}

md-icon.cb-alert-icon {
  fill: orange;
}

/* Charts */
.cb-charts-container {
  min-height: 400px;
}

.cb-chart-controls {
  min-height: 40px;
  margin-bottom: 25px;
}
.cb-chart-controls md-select {
  padding: 0 5px;
  margin: 0 0 10px 0;
}

.cb-layout-xs .cb-chart-controls {
  min-height: 0;
  margin-bottom: 15px;
}
.cb-layout-xs .cb-chart-controls md-select {
  margin-top: 0px;
}

cb-chart .cb-chart-nodata {
  width: 100%;
  height: 200px;
  padding: 90px 0;
  font-size: 16px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center center;
}

/******** Registration/Login pages */
.wrpRegistrationForm {
  margin-top: 100px;
  padding: 40px;
  padding-top: 30px;
  max-width: 600px;
}
.wrpRegistrationForm .cb-logo-large {
  height: 64px;
  margin-bottom: 25px;
}
.wrpRegistrationForm h2, .wrpRegistrationForm p {
  margin-bottom: 25px !important;
}
.wrpRegistrationForm md-input-container {
  font-size: 200% !important;
  line-height: 40px;
}
.wrpRegistrationForm md-input-container .md-errors-spacer {
  min-height: 0;
}
.wrpRegistrationForm md-input-container .md-input, .wrpRegistrationForm md-input-container.md-default-theme:not(.md-input-invalid).md-input-focused .md-input, .wrpRegistrationForm md-input-container:not(.md-input-invalid).md-input-focused .md-input {
  padding-bottom: 10px;
  height: 40px;
}
.wrpRegistrationForm .md-button {
  font-size: 140% !important;
  padding: 8px 30px;
  margin: 0;
}
@media (max-width: 600px) {
  .wrpRegistrationForm {
    margin-top: 25px;
  }
  .wrpRegistrationForm .hint {
    margin-top: 25px;
  }
  .wrpRegistrationForm md-input-container {
    font-size: 150% !important;
  }
}
.wrpRegistrationForm .cb-forgot-password-link {
  font-size: 12px;
  cursor: pointer;
}

/******** General MD overrides */
[class*=md-whiteframe-] {
  border-radius: 2px;
}

/* .cb-dashboard-content :not(md-card):not(md-steppers-header):not(md-toolbar):not(md-table-container)[class*="md-whiteframe-"] { */
.cb-pad30 {
  padding: 30px;
}

.cb-pad10-left {
  padding-left: 10px;
}

.cb-pad10-right {
  padding-right: 10px;
}

.cb-mar10-left {
  margin-left: 10px;
}

.cb-mar10-right {
  margin-right: 10px;
}

[class*=md-whiteframe-],
.cb-primary-content-container {
  color: var(--cb-primary);
  background-color: white;
}

[class*=md-whiteframe-] h2,
[class*=md-whiteframe-] h3,
.md-subheader + * h3 {
  color: var(--cb-primary) !important;
}

md-menu-content {
  max-height: 700px;
}

md-select .md-select-icon {
  color: #bbbbbb;
}

md-switch .md-bar {
  height: 16px;
  width: 33px;
}
md-switch .md-thumb-container {
  top: 7px;
  left: 4px;
}
md-switch .md-thumb {
  height: 12px;
  width: 12px;
  box-shadow: none;
}
md-switch.md-checked:not([disabled]).md-primary .md-bar {
  background-color: #21b746;
  box-shadow: 0 0 10px #21b746;
}
md-switch.md-checked:not([disabled]).md-primary .md-thumb {
  background-color: white;
}

md-input-container {
  /* Workaround for textarea dynamic height adjustment not applying when textarea is initially invisible eg. when in a collapsed section */
}
md-input-container .md-input,
md-input-container md-select .md-select-value {
  color: rgba(0, 0, 0, 0.6);
}
md-input-container textarea.md-input {
  min-height: 30px;
}
md-input-container.md-default-theme > md-icon,
md-input-container > md-icon {
  color: rgba(0, 0, 0, 0.55);
}

md-input-container.md-default-theme label.md-required:after, md-input-container label.md-required:after {
  color: rgb(221, 44, 0) !important;
}

md-table-container,
md-table-container table {
  overflow: visible !important;
}

md-autocomplete input {
  font-style: italic;
}
md-autocomplete.cb-item-selected input {
  font-style: normal;
  font-weight: bold;
  color: var(--cb-primary);
}

md-tooltip {
  background-color: #151515 !important;
  height: auto !important;
  max-width: 250px;
  white-space: normal !important;
  border: 1px solid grey;
  line-height: 18px !important;
  padding-top: 5px;
  padding-bottom: 10px;
}
md-tooltip p {
  line-height: 18px;
}
md-tooltip p:not(:last-child) {
  margin-bottom: 10px;
}
md-tooltip ul li {
  list-style-type: disc !important;
  list-style-position: inside !important;
  text-indent: -20px;
  margin-left: 20px;
}

@media (max-width: 600px) {
  md-tooltip.md-tooltip.md-show, md-tooltip.md-tooltip.md-hide {
    top: 0px !important;
    left: 0 !important;
    right: 0 !important;
    width: calc(100% - 48px);
    max-width: 100%;
    margin: 6px;
    max-height: 250px;
    overflow-y: auto;
  }
}
@media (min-width: 960px) {
  .md-tooltip {
    font-size: 14px;
    padding-right: 16px;
    padding-left: 16px;
  }
}
.hide-tooltips md-tooltip,
.hide-tooltips .cb-tooltip-anchor {
  display: none !important;
}

.md-button.md-primary.md-raised:not([class*=mdp-clock]):not(.cwp-daybtn):not(.md-icon-button):not(.group-btn) {
  font-size: 14px;
  letter-spacing: 1.5px;
  padding: 8px 20px;
}
.md-button.md-primary.md-raised:not([class*=mdp-clock]):not(.cwp-daybtn):not(.md-icon-button):not([disabled]) {
  color: white;
  background-color: var(--cb-primary);
}
.md-button.md-primary.md-raised:not([class*=mdp-clock]):not(.cwp-daybtn):not(.md-icon-button):not([disabled]):hover {
  background-color: var(--cb-hover);
}
.md-button.md-primary.md-raised:not([class*=mdp-clock]):not(.cwp-daybtn):not(.md-icon-button):not([disabled]) md-icon {
  color: white;
  margin-top: -3px;
  height: 22px;
  width: 22px;
  min-height: 22px;
  min-width: 22px;
}

md-dialog[role=alertdialog] {
  max-width: 600px;
}
md-dialog md-toolbar md-icon:first-child {
  margin-right: 12px;
}
md-dialog md-toolbar md-icon.cb-close-x {
  margin-left: 12px;
}
md-dialog md-dialog-content h2 {
  margin-bottom: 10px;
  font-weight: bold;
}
md-dialog .md-actions, md-dialog md-dialog-actions {
  padding: 0;
  margin: 8px;
}
md-dialog .md-actions .md-button, md-dialog md-dialog-actions .md-button {
  padding: 8px 20px 9px 20px;
}

.md-subheader {
  box-shadow: 1px -1px 1px 0 rgba(0, 0, 0, 0.2);
  font-size: 16px;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  background-color: white;
  color: var(--cb-primary);
  padding: 14px 14px 30px 14px;
}
.md-subheader .md-subheader-inner {
  flex: 1;
}
.md-subheader.md-primary, .md-subheader.md-default-theme.md-primary {
  color: var(--cb-primary);
}
.md-subheader .md-subheader-content {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.md-subheader md-icon {
  fill: var(--cb-primary);
  margin-right: 10px;
}

cb-subheader {
  font-size: 16px;
  color: var(--cb-primary);
  padding: 14px 14px 30px 14px;
}
cb-subheader md-icon {
  fill: var(--cb-primary);
  margin-right: 10px;
}

.cb-whiteframe {
  border-radius: 2px;
  background-color: white;
  box-shadow: 1px 2px 3px 0 rgba(0, 0, 0, 0.2);
}
.cb-whiteframe > *:not(.md-subheader):not(md-toolbar) {
  color: var(--cb-primary);
  padding: 0 30px 20px 30px;
}

.cb-always-float label {
  transform: translate3d(0px, 6px, 0px) scale(0.75) !important;
}

[cb-submenu-tabs] {
  border-radius: 2px;
  background-color: white;
  box-shadow: 1px 2px 3px 0 rgba(0, 0, 0, 0.2);
}
[cb-submenu-tabs] md-tabs-canvas {
  display: none;
}
[cb-submenu-tabs] md-tab-content .cb-submenu-tab-content > *:not(.md-subheader):not(md-toolbar) {
  color: var(--cb-primary);
  padding: 0 30px 20px 30px;
}

md-icon {
  fill: currentColor;
  margin: 0;
}
md-icon[md-svg-icon^=cb-] {
  stroke: currentColor;
}

a md-icon {
  color: var(--cb-primary);
}

md-icon.cb-help-circle,
md-icon.cb-not-supported {
  fill: var(--cb-primary);
}

.md-button md-icon,
.md-button.md-raised:not([disabled]) md-icon {
  color: var(--cb-primary);
}
.md-button md-icon[md-svg-icon^=cb-],
.md-button.md-raised:not([disabled]) md-icon[md-svg-icon^=cb-] {
  stroke: var(--cb-primary);
  fill: white;
}

.md-button:not([class*=md-sidemenu-]) md-icon {
  fill: currentColor;
}

.md-icon-button md-icon {
  margin: auto; /* Ensure dots icon is horizontally centered within button */
}

.md-fab md-icon {
  margin: 10px auto;
}

.md-fab[class^=cb-new-], .md-fab[class*=" cb-new-"] {
  position: fixed;
  bottom: 90px;
  right: 30px;
  z-index: 21;
}
@media (min-width: 960px) {
  .md-fab[class^=cb-new-], .md-fab[class*=" cb-new-"] {
    bottom: 30px;
  }
}
.md-fab[class^=cb-new-].mdi:before, .md-fab[class*=" cb-new-"].mdi:before {
  line-height: 56px;
}
.md-fab[class^=cb-new-] md-icon, .md-fab[class*=" cb-new-"] md-icon {
  color: white;
}

.cb-layout-xs .md-fab[class^=cb-new-], .cb-layout-xs .md-fab[class*=" cb-new-"] {
  bottom: 55px;
  right: 20px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  min-height: 0;
  padding: 0;
}
.cb-layout-xs .md-fab[class^=cb-new-] md-icon, .cb-layout-xs .md-fab[class*=" cb-new-"] md-icon {
  margin: 2px auto;
}
.cb-layout-xs .md-fab[class^=cb-new-].mdi:before, .cb-layout-xs .md-fab[class*=" cb-new-"].mdi:before {
  line-height: 40px;
}

label.cb-md-fixed-label {
  transform: translate3d(0, 6px, 0) scale(0.75) !important;
}

.cb-field-label {
  color: rgba(0, 0, 0, 0.54);
}

.hint {
  font-size: 12px;
  color: #adadad;
}

md-content {
  background: none;
}

.md-table-pagination md-select:not([disabled]):focus .md-select-value {
  color: rgba(255, 255, 255, 0.54) !important;
}

md-icon.s12 {
  height: 12px;
  width: 12px;
  min-height: 12px;
  min-width: 12px;
}
md-icon.s14 {
  height: 14px;
  width: 14px;
  min-height: 14px;
  min-width: 14px;
}
md-icon.s16 {
  height: 16px;
  width: 16px;
  min-height: 16px;
  min-width: 16px;
}
md-icon.s18 {
  height: 18px;
  width: 18px;
  min-height: 18px;
  min-width: 18px;
}
md-icon.s30 {
  height: 30px;
  width: 30px;
}
md-icon.s36 {
  height: 36px;
  width: 36px;
}
md-icon.s48 {
  height: 48px;
  width: 48px;
}
md-icon.s72 {
  height: 72px;
  width: 72px;
}
md-icon.published {
  fill: green;
}
md-icon.unpublished {
  fill: red;
}

button.md-icon-button md-icon.s30 {
  position: absolute;
  top: 4px;
  left: 4px;
}
button.md-icon-button md-icon.s36 {
  position: absolute;
  top: 2px;
  left: 2px;
}

md-menu-content {
  /* Temporary fix while awaiting https://github.com/angular/material/issues/9100 */
  /* background-color: darkblue; */
  padding: 0;
}
md-menu-content md-menu-item {
  color: var(--cb-primary);
}
md-menu-content.cb-compact-menu md-menu-item {
  height: 40px;
  min-height: 40px;
}
md-menu-content.cb-compact-menu md-menu-item > .md-button {
  font-size: 13px;
  padding-top: 0;
}
md-menu-content.cb-inverted-menu md-menu-item > .md-button md-icon {
  margin: auto 0 auto 16px;
}

md-menu.cb-context-menu > button.md-button md-icon {
  fill: #adadad !important;
}

mdp-date-picker md-input-container {
  flex: 1 0;
  margin-left: 0 !important;
}

cb-csv-chips .md-errors-spacer {
  min-height: 0px;
}

@media (max-width: 599px) {
  .cb-layout-wrap-xs {
    flex-wrap: wrap;
  }
}
/* Input Container Group related styles */
.cb-input-container-group {
  position: relative;
}
.cb-input-container-group md-input-container md-checkbox {
  margin-top: 8px;
}
.cb-input-container-group.cb-multichoice-checkboxes md-checkbox {
  margin-top: -10px;
  margin-bottom: 0px;
}
.cb-input-container-group.cb-multichoice-checkboxes md-checkbox:first-of-type {
  margin-top: 0px;
}

.cb-advanced-fields .cb-input-container-group {
  /* border-top-left-radius: 5px;
     border-top: 1px solid #212f71; */
  margin-top: 20px;
}

/* Material icon stuff */
.mdi.published {
  color: #008800;
}

.mdi.unpublished {
  color: #770000;
}

button i.mdi {
  margin-right: 5px;
}

input.md-input:-webkit-autofill,
input.md-input:-webkit-autofill:hover,
input.md-input:-webkit-autofill:focus {
  /*border: 1px solid green;
  -webkit-text-fill-color: green;*/
  -webkit-box-shadow: 0 0 0px 1000px rgba(255, 255, 255, 0.2) inset;
  transition: background-color 5000s ease-in-out 0s;
}

/* Fix for Angular Material/Chrome autofill bug - see here: https://github.com/angular/material/issues/1376 */
input.md-input:-webkit-autofill ~ label:not(.md-no-float) {
  transform: translate3d(0, 6px, 0) scale(0.75);
  transition: transform cubic-bezier(0.25, 0.8, 0.25, 1) 0.4s, width cubic-bezier(0.25, 0.8, 0.25, 1) 0.4s;
  width: calc((100% - 18px) / 0.75);
}

/* Fix for angular-material-sidemenu collapsing bug in IE/Edge */
.md-sidemenu-wrapper {
  margin-top: -200px;
}

.cb-toolbar md-select:not([disabled]):focus .md-select-value {
  color: white;
}

/********* File Uploader styles */
.cb-img-upload-actions {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 10px;
  z-index: 9;
}
.cb-img-upload-actions md-icon {
  background-color: white;
  border-radius: 20px;
  margin: 10px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
}
.cb-img-upload-actions .cb-action-crop md-icon {
  padding: 3px;
  fill: var(--cb-primary);
}
.cb-img-upload-actions .cb-action-delete md-icon {
  fill: darkred;
}
.cb-img-upload-actions unsplash-search md-icon {
  padding: 5px;
}

.cb-img-preview img {
  width: 100%;
  border-radius: 2px;
}
.cb-img-preview md-progress-circular {
  position: absolute;
  top: 20px;
}

.cb-file-drop-zone {
  border: dotted 3px #5e637c;
  min-height: 140px;
  width: 210px;
  text-align: center;
  padding: 15px;
  margin: 10px;
  background-color: whitesmoke;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  position: relative;
}
.cb-file-drop-zone .cb-upload-info {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 5;
}
.cb-file-drop-zone .cb-upload-info > div {
  color: black;
  text-shadow: 0 0 5px white;
  border-radius: 20px;
  max-width: 80%;
  background: none;
  box-shadow: none;
  transition: background 0.5s ease, box-shadow 0.5s ease;
}
.cb-file-drop-zone .cb-upload-info > div .hint {
  line-height: 1.4em;
  transition: color 0.5s ease, box-shadow 0.5s ease;
}
.cb-file-drop-zone .cb-upload-info > div:hover {
  background: rgba(255, 255, 255, 0.7);
  box-shadow: 0 0 30px 20px rgba(255, 255, 255, 0.7);
}
.cb-file-drop-zone .cb-upload-info > div:hover .hint {
  color: var(--cb-grey);
  text-shadow: 0 0 5px white;
}
.cb-file-drop-zone .cb-upload-info .cb-img-label {
  font-size: 16px;
}
.cb-file-drop-zone .cb-upload-info label {
  text-shadow: none;
  opacity: 1;
  transition: opacity 0.5s ease;
}
.cb-file-drop-zone.cb-have-image {
  border: solid 2px #dadada;
}
.cb-file-drop-zone.cb-have-image .cb-upload-info > div:not(:hover) .hint {
  color: rgba(255, 255, 255, 0);
  text-shadow: none;
}
.cb-file-drop-zone.cb-have-image .cb-upload-info > div:not(:hover) .cb-img-label {
  text-shadow: 0 0 5px black;
  color: white;
}
.cb-file-drop-zone.cb-have-image .cb-upload-info > div:not(:hover) label {
  opacity: 0;
}

.nv-file-over {
  border: dotted 3px red;
} /* Default class applied to drop zones on over */
.file-drop-zone .hint {
  line-height: 1.3em;
  margin: 7px 10px 12px;
}

.cb-crop-container {
  width: 500px;
  position: relative;
}

@media (max-width: 599px) {
  .cb-crop-container {
    width: 75vw;
  }
}
.cb-crop-info {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 10px;
  color: white;
  text-shadow: 0 0 5px black;
  pointer-events: none;
}

/* Feedback button */
.feedback-btn {
  font-family: "GT-Walsheim-Regular", sans-serif !important;
  font-size: 12px !important;
  padding: 0 5px !important;
  transform: rotate(270deg);
  bottom: 200px !important;
  right: -35px !important;
  box-shadow: 0px 0px 16px rgba(255, 255, 255, 0.5) !important;
  opacity: 0.7;
}

/**** Button Groups ****/
button-group.cb-btngrp button {
  margin: 0 0 1px 1px;
  padding: 0 5px;
  border-radius: 0;
  min-height: 30px;
  line-height: 30px;
  font-size: 80%;
}
button-group.cb-btngrp button:first-child {
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
}
button-group.cb-btngrp button:last-child {
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  margin-right: 0;
}
button-group.cb-btngrp .is-default button {
  opacity: 0.6;
}
button-group .md-button.group-btn-active {
  background-color: white !important;
  box-shadow: none !important;
}
button-group .md-button.group-btn-active md-icon {
  fill: var(--cb-primary);
}
button-group .group-btn-divider {
  min-width: 15px;
  background-color: #eeeeee;
  margin-bottom: 1px;
  border-right: 1px solid #ebebeb;
  box-sizing: border-box;
  text-align: center;
  line-height: 36px;
  min-height: 36px;
}
button-group .group-btn-divider span:after {
  content: "..";
  color: #999999;
}

[class*=md-whiteframe-] .md-button.group-btn-active, .cb-primary-content-container .md-button.group-btn-active, [cb-submenu-tabs] .md-button.group-btn-active, md-dialog-content .md-button.group-btn-active {
  background-color: var(--cb-primary) !important;
}
[class*=md-whiteframe-] .md-button.group-btn-active md-icon, .cb-primary-content-container .md-button.group-btn-active md-icon, [cb-submenu-tabs] .md-button.group-btn-active md-icon, md-dialog-content .md-button.group-btn-active md-icon {
  fill: white;
}

/* Pagination buttons */
button-group.cb-pagination-buttons button {
  min-width: 48px;
  width: 48px;
  min-height: 48px;
  line-height: 48px;
  margin-left: 0;
  border-right: 1px solid #ebebeb;
  color: color-mix(in srgb, var(--cb-primary), white 65%) !important;
  box-shadow: none !important;
}
button-group.cb-pagination-buttons .md-button.group-btn-active {
  background-color: #eaedfe !important;
  color: var(--cb-primary) !important;
  font-weight: bold;
}
button-group.cb-pagination-buttons .group-btn-divider {
  line-height: 48px;
  min-height: 48px;
}

/******** Other general stuff *******/
.cb-section-header {
  margin-bottom: 15px;
}

.cb-reveal-link:before {
  content: "[";
}
.cb-reveal-link:after {
  content: "]";
}

[cb-entity-link] {
  cursor: pointer;
}

textarea.cb-css-rules,
textarea.cb-json {
  font-family: monospace;
  font-size: 12px;
  border-width: 1px !important;
  line-height: 18px;
  max-height: 90vh;
  overflow-y: scroll;
}

.cb-backdrop-image-uploader md-slider-container {
  margin: 0 20px;
}

.cb-field-text input {
  color: var(--cb-grey);
}

.cb-footnote-symbol {
  color: var(--cb-primary) !important;
  font-size: 24px;
  vertical-align: middle;
  line-height: 18px;
}

/* listing cards */
.cb-listings .cb-listing-cards {
  column-width: 300px;
  column-gap: 26px;
}
.cb-listings .cb-listing-cards .cb-listing-searchable,
.cb-listings .cb-listing-cards .cb-listing-nonsearchable {
  position: relative;
  left: -12px;
}
.cb-listings .cb-listing-dropdown-menu {
  text-align: right;
}
.cb-listings .cb-listing-dropdown-menu button.md-button.md-icon-button {
  margin: 0;
}
.cb-listings .cb-listing-dropdown-menu button.md-button.md-icon-button md-icon {
  fill: #999fae;
}
.cb-listings .md-headline {
  color: var(--cb-primary);
  font-size: 16px;
  font-weight: normal;
  line-height: 24px;
}
.cb-listings .cb-event-details {
  color: #999fae;
  font-size: 12px;
  line-height: 18px;
}
.cb-listings .cb-event-details md-icon {
  fill: #adadad;
}
.cb-listings .cb-event-details md-icon[md-svg-icon^=cb-] {
  stroke: #adadad;
}
.cb-listings .cb-event-details .cb-listing-dates,
.cb-listings .cb-event-details .cb-listing-sales {
  white-space: nowrap;
}
.cb-listings md-card {
  display: inline-block;
  width: 100%;
  margin: 0 0 25px 0;
}
.cb-listings md-card .cb-event-details > span {
  padding: 1px 0;
}
.cb-listings md-card .cb-event-details md-icon {
  margin-right: 10px;
}
.cb-listings md-card .cb-event-details .cb-listing-sales {
  margin-top: 8px;
}
.cb-listings md-card md-card-content {
  padding: 16px 24px;
}
.cb-listings md-card md-card-actions {
  border-top: 1px solid #ebebeb;
  margin: 0;
  padding: 0 30px;
}
.cb-listings md-card md-card-actions .cb-listing-draft {
  margin: 14px 0;
}
.cb-listings md-icon.cb-status-icon {
  padding: 4px 8px 0 0;
}
.cb-listings .cb-event-tag {
  color: white;
  background-color: var(--cb-primary);
  text-transform: uppercase;
  border-radius: 1px;
  font-size: 11px;
  line-height: 16px;
  padding: 0 7px;
  letter-spacing: 1px;
}
.cb-listings .cb-listing-tile,
.cb-listings .cb-listing-row {
  cursor: pointer;
}
.cb-listings table .cb-event-details > * {
  margin-right: 15px;
}
.cb-listings table td.md-cell {
  padding: 24px 5px !important;
  border-top: none !important;
}
.cb-listings table td.md-cell:first-child {
  padding: 24px 15px 24px 24px !important;
}
.cb-listings table md-switch {
  margin: 0;
}
.cb-listings .cb-listing-searchable,
.cb-listings .cb-listing-nonsearchable {
  cursor: default;
}
.cb-listings .cb-listing-nonsearchable md-icon {
  fill: #AAAAAA;
}
.cb-listings .cb-listing-nonsearchable md-icon:after {
  content: "";
  position: relative;
  border-bottom: 2px solid #444444;
  width: 100%;
  display: block;
  transform: rotate(135deg);
  top: -12px;
}
.cb-listings .cb-listing-searchable md-icon {
  fill: #21b746;
}
.cb-listings cb-pagination {
  margin-top: 50px;
}
.cb-listings .cb-listing-draft {
  padding: 8px 0;
}
.cb-listings .cb-listing-draft span {
  color: #999fae;
  text-transform: uppercase;
  border-radius: 10px;
  font-size: 11px;
  line-height: 16px;
  padding: 0 7px;
  letter-spacing: 1px;
  border: 1px solid #999fae;
}

.cb-layout-xs listings table td.md-cell {
  vertical-align: top;
}
.cb-layout-xs listings table td.md-cell:first-child {
  padding: 20px 5px 24px 30px !important;
}

.cb-listing-menu-wrapper {
  position: relative;
}

/* Custom field management */
cb-fields-list {
  position: relative;
}
cb-fields-list button-group {
  white-space: nowrap;
}

.cb-cust-field span.cb-cust-field-label {
  margin: 5px 10px;
  text-align: right;
}
.cb-cust-field span.cb-cust-field-label md-icon {
  margin: 0 10px;
}
.cb-cust-field .md-button.cb-field-action-btn {
  margin: 0;
  opacity: 0;
  transition: opacity 0.5s;
  padding: 4px 4px;
  min-height: 32px;
  height: 32px;
  width: 32px;
}
.cb-cust-field .md-button.cb-field-action-btn.cb-action-delete md-icon {
  fill: darkred;
}
.cb-cust-field:hover .md-button.cb-field-action-btn {
  opacity: 1;
}
.cb-cust-field .as-sortable-item-handle {
  margin: 4px;
}

.cb-layout-xs .cb-cust-field span.cb-cust-field-label md-icon {
  margin: 0 10px 0 20px;
}
.cb-layout-xs .cb-cust-field .md-button.cb-field-action-btn {
  opacity: 1;
}

.cb-custom-field-dlg {
  min-width: 320px;
}
.cb-custom-field-dlg md-dialog-content {
  padding: 20px 20px 0 20px;
}
.cb-custom-field-dlg md-tabs-wrapper {
  display: none;
}
.cb-custom-field-dlg md-list-item.md-2-line {
  min-height: 50px;
}
.cb-custom-field-dlg md-list-item.md-2-line::before,
.cb-custom-field-dlg md-list-item.md-2-line > .md-no-style,
.cb-custom-field-dlg md-list-item.md-2-line .md-no-style::before {
  min-height: 50px;
}
.cb-custom-field-dlg md-list-item:hover {
  background-color: rgba(0, 0, 0, 0.1);
}
.cb-custom-field-dlg md-list-item.cb-custom-field {
  border-radius: 5px;
  border-left: 3px solid var(--cb-pink);
  border-right: 3px solid var(--cb-pink);
}
.cb-custom-field-dlg md-list-item .cb-hint-text {
  margin-left: 10px;
  font-style: italic;
  font-size: 90%;
}
.cb-custom-field-dlg md-list-item h3 .cb-fieldname {
  margin-left: 10px;
  font-style: italic;
  font-size: 80%;
  opacity: 0.5;
}
.cb-custom-field-dlg md-list-item.cb-in-use {
  background-color: rgba(0, 0, 0, 0.08);
}
.cb-custom-field-dlg md-list-item.cb-in-use .md-list-item-inner {
  font-style: italic;
  opacity: 0.6;
  cursor: default;
}
.cb-custom-field-dlg md-list-item .md-secondary-container button {
  margin: 0;
}
.cb-custom-field-dlg md-list-item .md-secondary-container button:not(.cb-stay-visible) {
  opacity: 0;
  transition: opacity 0.5s;
}
.cb-custom-field-dlg md-list-item:hover .md-secondary-container button {
  opacity: 1;
}

.md-button.cb-add-field-btn {
  margin: 5px 140px 5px 0;
}

.cb-layout-xs .md-button.cb-add-field-btn {
  margin: 5px 114px 5px 0;
}

/* table row menus */
.cb-table-menu-toolbar.md-row {
  height: 0 !important;
}
.cb-table-menu-toolbar.md-row td {
  min-height: 0 !important;
  height: 0 !important;
  padding: 0;
  transition: height 0.1s ease-in;
  border-bottom: none;
}
.cb-table-menu-toolbar.md-row.cb-menu-open td {
  height: 50px !important;
  max-height: 50px !important;
  transition: height 0.1s ease-in;
}
.cb-table-menu-toolbar .md-button {
  padding: 0;
  background-color: #eaeaea;
  min-height: 0 !important;
  height: 0 !important;
  transition: height 0.1s ease-in;
  overflow: hidden;
  padding: 0 !important;
  border-radius: 0px !important;
  margin: 0 !important;
}
.cb-table-menu-toolbar.cb-menu-open .md-button {
  border: 1px solid #E0E0E0;
  height: 50px !important;
  max-height: 50px !important;
  transition: height 0.1s ease-in;
}

.cb-table-menu button.cb-table-menu-trigger md-icon,
.cb-table-menu-toolbar .md-button md-icon {
  margin: 0 auto !important;
  fill: #9e9e9e !important;
}
.cb-table-menu button.cb-table-menu-trigger md-icon[md-svg-icon^=cb-],
.cb-table-menu-toolbar .md-button md-icon[md-svg-icon^=cb-] {
  stroke: #9e9e9e;
}

.cb-table-menu-toolbar .md-button md-icon {
  margin: 16px auto !important;
}

/* Context menus */
table.md-table:not(.md-row-select) td.md-cell:not(.cb-result-count).cb-context-menu-cell {
  padding: 0 !important;
  white-space: nowrap;
}
table.md-table:not(.md-row-select) td.md-cell:not(.cb-result-count).cb-context-menu-cell md-menu > button {
  margin: 0 !important;
}

/******* toolbars *******/
.cb-toolbar-background {
  background-color: var(--cb-hover);
  position: absolute;
  top: 0;
  width: 100%;
  height: 60px;
  display: none;
}

.cb-toolbar {
  margin-bottom: 30px;
  height: 60px;
  max-height: 60px;
}
.cb-toolbar md-icon {
  color: white;
}
.cb-toolbar md-switch {
  margin: 14px 0;
}
.cb-toolbar [class^=cb-tool-],
.cb-toolbar [class*=" cb-tool-"] {
  height: 60px;
  min-height: 60px;
  min-width: 60px;
}
.cb-toolbar .cb-tool-button {
  border-left: 1px solid var(--cb-primary);
  border-right: 1px solid var(--cb-primary);
  border-radius: 0;
  width: 60px;
  margin: 0;
}
.cb-toolbar .cb-tool-button md-icon {
  margin: 0 auto;
}
.cb-toolbar .cb-tool-button-toggle-on,
.cb-toolbar .cb-tool-button-toggle-on:hover {
  background-color: color-mix(in srgb, var(--cb-primary), white 80%) !important;
}
.cb-toolbar md-select .md-select-value {
  border-bottom: none !important;
}
.cb-toolbar md-select:not(:focus) .md-select-value .md-select-icon {
  color: white;
}

/* listing search filter control */
.cb-tool-search {
  padding: 0 18px;
  transition: all 0.5s ease;
}
.cb-tool-search > div {
  position: relative;
}
.cb-tool-search input {
  border: none;
  max-width: 20px;
  min-width: 20px;
  border-radius: 4px;
  padding-left: 0;
  height: 26px;
  opacity: 0;
  z-index: 3;
  cursor: pointer;
  transition: all 0.5s ease;
  position: relative;
}
.cb-tool-search input::-ms-clear {
  display: none;
}
.cb-tool-search md-icon {
  position: absolute;
  z-index: 2;
  left: 0px;
  top: 0px;
  transition: all 0.5s ease;
}
.cb-tool-search.cb-tool-search-active input {
  max-width: 150px;
  min-width: 150px;
  padding-left: 25px;
  opacity: 1;
  z-index: 1;
  cursor: text;
}
.cb-tool-search.cb-tool-search-active md-icon {
  left: 5px;
  top: 5px;
  fill: var(--cb-primary);
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
}

/******* sort control *******/
cb-sort-options md-select {
  margin: 0;
}
cb-sort-options .cb-sort-buttons button.group-btn {
  border-radius: 2px !important;
  padding: 0;
  height: 18px;
  min-height: 18px;
  width: 18px;
  min-width: 18px;
  margin: 0 !important;
}
cb-sort-options .cb-sort-buttons {
  margin-left: 6px;
}

/******* booking status chips *******/
span[class^=cb-status-], div[class*=" cb-status-"] {
  border-radius: 15px;
  padding: 5px 10px;
  margin: 2px;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.9);
  line-height: 16px;
  font-size: 10px;
  max-height: 26px;
  display: inline-block;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
}

table span[class^=cb-status-]:not(.cb-status-dot), div[class*=" cb-status-"]:not(.cb-status-dot) {
  box-sizing: border-box;
  width: 100%;
}

.cb-status-dot {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  margin-right: 10px;
  padding: 0 !important;
}

td .cb-status-dot {
  display: inline-block;
}

/* Booking statii */
.cb-status-awaiting_payment, .cb-status-pending_approval {
  background-color: var(--cb-highlight);
  color: #252c4e !important;
}

.cb-status-accepted {
  background-color: #468847;
}

.cb-status-unpaid,
.cb-status-replaced {
  background-color: orange;
}

.cb-status-partially_cancelled {
  background: #468847; /* Old browsers */
  background: -moz-linear-gradient(left, #468847 0%, #e91e63 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #468847 0%, #e91e63 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #468847 0%, #e91e63 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  color: #DFF0D8 !important;
}

.cb-status-cancelled {
  background-color: rgb(233, 30, 99);
  color: rgb(255, 200, 230);
}

.cb-status-rejected {
  background-color: rgb(233, 131, 30);
  color: rgb(255, 200, 230);
}

/* Customer statii */
.cb-status-active {
  background-color: #468847;
  border: 1px solid color-mix(in srgb, #468847, black 20%);
}

.cb-status-anonymised {
  background-color: var(--cb-grey);
  border: 1px solid color-mix(in srgb, var(--cb-grey), black 20%);
}

.cb-status-blocked {
  background-color: orange;
  border: 1px solid color-mix(in srgb, orange, black 20%);
}

/* Article statii */
.cb-status-published {
  background-color: #468847;
  border: 1px solid color-mix(in srgb, #468847, black 20%);
}

.cb-status-unpublished,
.cb-status-inactive {
  background-color: rgb(158, 158, 158);
  border: 1px solid color-mix(in srgb, rgb(158, 158, 158), black 20%);
}

.cb-status-trashed {
  background-color: rgb(233, 30, 99);
  color: rgb(255, 200, 230);
}

.panel {
  background-color: rgba(255, 255, 255, 0.1);
  padding: 0 10px;
  margin: 20px;
}

.cb-child-records mdp-date-picker > div,
.cb-child-records mdp-time-picker > div,
.cb-child-records md-input-container.cb-icon-input-container {
  border: 1px solid #d5d8de;
  border-radius: 3px;
  margin: 25px 10px 0 0;
}
.cb-child-records mdp-date-picker md-input-container,
.cb-child-records mdp-time-picker md-input-container,
.cb-child-records md-input-container.cb-icon-input-container .md-input {
  margin: 14px 0;
}
.cb-child-records md-input-container:not(.md-input-invalid).md-input-focused,
.cb-child-records mdp-date-picker.md-input-focused > div,
.cb-child-records mdp-time-picker.md-input-focused > div {
  /* Note, this is supported by mdpDatePicker and mdpTimePicker directives in template.js */
  border-color: rgb(63, 81, 181);
}
.cb-child-records md-input-container.cb-icon-input-container {
  padding-left: 40px;
}
.cb-child-records mdp-date-picker md-input-container .md-errors-spacer,
.cb-child-records mdp-time-picker md-input-container .md-errors-spacer,
.cb-child-records md-input-container.cb-icon-input-container .md-errors-spacer {
  min-height: 0;
}
.cb-child-records mdp-date-picker md-input-container input.md-input,
.cb-child-records mdp-time-picker md-input-container input.md-input,
.cb-child-records md-input-container.cb-icon-input-container input.md-input {
  border-bottom: none;
  color: #999fae;
  min-width: 120px;
}
.cb-child-records md-input-container.cb-icon-input-container.cb-number-container input.md-input {
  min-width: initial;
}
.cb-child-records mdp-date-picker md-input-container[disabled],
.cb-child-records mdp-time-picker md-input-container[disabled],
.cb-child-records md-input-container.cb-icon-input-container[disabled] {
  background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.38) 0, rgba(0, 0, 0, 0.38) 33%, transparent 0);
  background-position: bottom left;
  background-size: 4px 1px;
  background-repeat: repeat-x;
  border-color: transparent;
}
.cb-child-records md-input-container.cb-icon-input-container[disabled] .md-errors-spacer:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 1px;
  width: 100%;
  background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.38) 0, rgba(0, 0, 0, 0.38) 33%, transparent 0);
  background-position: top left;
  background-size: 4px 1px;
  background-repeat: repeat-x;
}
.cb-child-records md-input-container.cb-icon-input-container[disabled]:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 1px;
  height: 100%; /* This and the 'bottom' setting were not working for some reason... */
  width: 1px;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.38) 0, rgba(0, 0, 0, 0.38) 33%, transparent 0);
  background-size: 1px 4px;
  background-repeat: repeat-y;
}
.cb-child-records md-input-container.cb-icon-input-container[disabled]:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1px;
  height: 100%;
  width: 1px;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.38) 0, rgba(0, 0, 0, 0.38) 33%, transparent 0);
  background-position: bottom;
  background-size: 1px 4px;
  background-repeat: repeat-y;
}
.cb-child-records mdp-date-picker md-input-container[disabled] input.md-input,
.cb-child-records mdp-time-picker md-input-container[disabled] input.md-input,
.cb-child-records md-input-container.cb-icon-input-container[disabled] input.md-input,
.cb-child-records mdp-date-picker md-input-container[disabled] md-icon,
.cb-child-records mdp-time-picker md-input-container[disabled] md-icon,
.cb-child-records md-input-container.cb-icon-input-container[disabled] md-icon {
  color: rgba(0, 0, 0, 0.38);
}
.cb-child-records mdp-date-picker .md-button.md-icon-button,
.cb-child-records mdp-time-picker .md-button.md-icon-button {
  margin: 12px 0 0;
}
.cb-child-records md-input-container.cb-icon-input-container md-icon {
  margin: 0;
  padding: 8px;
  top: 12px;
  left: 0;
}
.cb-child-records mdp-date-picker md-input-container label:not(.md-no-float),
.cb-child-records mdp-time-picker md-input-container label:not(.md-no-float) {
  -webkit-transform: translate3d(-38px, -12px, 0) scale(0.75) !important;
  transform: translate3d(-38px, -12px, 0) scale(0.75) !important;
  width: calc(133% - 5px) !important;
  max-width: 133% !important;
}
.cb-child-records md-input-container.cb-icon-input-container label:not(.md-no-float) {
  -webkit-transform: translate3d(-36px, 2px, 0) scale(0.75) !important;
  transform: translate3d(-36px, 2px, 0) scale(0.75) !important;
  width: calc(133% - 5px) !important;
  max-width: 133% !important;
}

/****** Customer/Event search forms ********/
.cb-search-form md-input-container {
  margin-left: 0 !important;
  padding-right: 8px;
}
.cb-search-form mdp-date-picker .md-button.md-icon-button {
  padding: 2px 8px 0 2px;
  width: 34px;
}
.cb-search-form md-input-container .md-errors-spacer {
  min-height: 0;
}
.cb-search-form > div > md-input-container {
  min-width: 200px;
}
.cb-search-form md-icon[md-svg-icon^=cb-] {
  stroke: currentColor !important;
}
.cb-search-form .cb-event-search > md-icon {
  margin: 24px 8px 0 2px;
}
.cb-search-form .cb-filter-criterion-wrapper,
.cb-search-form .cb-filter-criteria-wrapper {
  min-width: 50%;
  max-width: 100%;
}
@media (max-width: 500px) {
  .cb-search-form .cb-filter-criteria-wrapper {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
}

/******* success animation *******/
@keyframes scaleAnimation {
  0% {
    opacity: 0;
    transform: scale(1.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes drawCircle {
  0% {
    stroke-dashoffset: 151px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes drawCheck {
  0% {
    stroke-dashoffset: 36px;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.successAnimationCircle {
  stroke-dasharray: 151px 151px;
  stroke: var(--cb-primary);
  stroke-width: 3;
}

.successAnimationCheck {
  stroke-dasharray: 36px 36px;
  stroke: var(--cb-primary);
  stroke-width: 3;
}

.successAnimationResult {
  fill: var(--cb-primary);
  stroke: #FFF;
  opacity: 0;
  stroke-width: 3;
}

.successAnimation.animated {
  animation: 1s ease-out 0s 1 both scaleAnimation;
}
.successAnimation.animated .successAnimationCircle {
  animation: 1s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 both drawCircle, 0.3s linear 0.9s 1 both fadeOut;
}
.successAnimation.animated .successAnimationCheck {
  animation: 1s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 both drawCheck, 0.3s linear 0.9s 1 both fadeOut;
}
.successAnimation.animated .successAnimationResult {
  animation: 0.3s linear 0.9s both fadeIn;
}

button.md-accent md-icon .successAnimationCircle {
  stroke: white;
}
button.md-accent md-icon .successAnimationCheck {
  stroke: white;
}
button.md-accent md-icon .successAnimationResult {
  fill: white;
  stroke: var(--cb-pink);
}

/* ng-sortable: Fix mobile touch scrolling - see https://github.com/a5hik/ng-sortable/issues/98 */
.as-sortable-item {
  -ms-touch-action: auto;
  touch-action: auto;
  -webkit-touch-callout: inherit;
}

.as-sortable-item-handle {
  -ms-touch-action: none;
  touch-action: none;
  /* to disable context menu on iOS devices */
  -webkit-touch-callout: none;
}

.searchclear {
  fill: #ccc !important;
  cursor: pointer;
  font-size: 14px;
  height: 14px;
  margin: auto;
  position: absolute !important;
  right: 5px;
  z-index: 99999999;
}

.cb-result-count {
  font-size: 90% !important;
  font-style: italic;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  cursor: default !important;
}

md-toolbar.cb-unsplash-dlg-header md-icon[md-svg-icon=cb-unsplash] {
  background-color: white;
  padding: 4px;
  border-radius: 2px;
}

unsplash-search {
  cursor: pointer;
}

.cb-unsplash-dlg {
  width: 460px;
  min-height: 400px;
}
.cb-unsplash-dlg md-input-container {
  margin: 30px 22px -10px 22px !important;
}
.cb-unsplash-dlg md-progress-circular {
  margin-top: 40px;
}
.cb-unsplash-dlg .cb-unsplash-thumb {
  border-radius: 16px;
  object-fit: cover;
  width: 200px;
  height: 150px;
}
.cb-unsplash-dlg button-group {
  border: 1px solid #DDDDDD;
  margin-top: 10px;
  margin-bottom: 20px;
}
.cb-unsplash-dlg button-group button {
  font-size: 20px;
  font-weight: 900;
}
.cb-unsplash-dlg button-group button.group-btn-active {
  font-size: 24px;
}

.cb-layout-xs .cb-unsplash-dlg {
  width: 100%;
}
.cb-layout-xs .cb-unsplash-dlg .cb-unsplash-thumb {
  border-radius: 16px;
  object-fit: cover;
  width: 170px;
  height: 128px;
}

.cb-json-editor {
  min-height: 200px;
  position: relative;
}
.cb-json-editor textarea {
  font-family: "Courier New", Courier, monospace;
}
.cb-json-editor textarea[disabled] {
  background-color: #EEEEEE;
}
.cb-json-editor .cb-json-editor-edit-toggle {
  cursor: pointer;
  position: absolute;
  top: -20px;
  left: calc(100% - 18px);
}
/* Menu item edit dialog (cbMenuItemsList / cbMenuItem directives).
   Copied from tmpl/listing/form.css so the dialog is styled outside the listing form. (Updated by Claude) */
.cb-menu-item-dlg .cb-menu-item-options {
  min-width: 300px;
}
.cb-menu-item-dlg .cb-menu-item-preview iframe {
  border: 1px solid silver;
  padding: 8px;
  max-width: 400px;
}

.cb-article-alias {
  font-size: 80%;
  color: rgba(0, 0, 0, 0.4);
}
