﻿/******************************************/
/*  Specifické styly pro modul Plán akcí  */
/******************************************/

/*rozšíření šířky obsahu pro lepší zobrazování kalendáře*/

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/* nastavení maximální šířky všech obrázků tak, aby se zmenšily do kontejneru rodiče a nepřetékaly*/
/* výjimka pro logo */
img:not(.bk-menu-logo img) {
  max-width: 100%;
  height: auto;
}

/* přetékání textu kvůli velikosti modálů u velmi dlouhých řetězců*/
p {
  overflow-wrap: break-word;
}

.bk-middle {
  max-width: 1400px;
}

.dx-widget.dx-scheduler-agenda,
.dx-widget.dx-scheduler-work-space,
.dx-widget.dx-scheduler-header {
  border-radius: 8px;
}

.bk-label-text {
  min-width: 160px;
  font-weight: 400;
}

.dx-scheduler-date-table-cell,
.dx-scheduler-all-day-table-cell {
  pointer-events: none;
}

.dx-scheduler-work-space-month .dx-scheduler-date-table-cell {
  height: 100px;
  color: #566971;
}

.bk-scheduler-bubble {
  background-color: rgb(255, 255, 255);
  color: rgb(67, 83, 89);
  font-size: 14px;
  padding: 12px 16px;
  border-radius: 10px;
  z-index: 9999;
  display: flex;
  justify-content: space-between;
  cursor: default;
  max-width:90vw;
  overflow: hidden;
}

.appointment-tooltip-text-cover-wrapper {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.appointment-tooltip-text-cover-gradient {
    height: 100px;
    width: 100%;
    background: linear-gradient(to bottom, transparent, #F5F6F7);
    transform: translate(0, 1px);
}

.appointment-tooltip-text-cover-info-wrapper {
    width: 100%;
    background-color: #F5F6F7;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}

.appointment-tooltip-text-cover-info {
    margin: 0.5em 1em;
    width: calc(100% - 2em);
    background-color: #DDEEF6;
    border-radius: 4px;
    text-align: center;
    padding: 0.25em;
    font-size: 0.9rem;
    color: #00A2E2;
}

.bk-scheduler-bubble tr td {
  max-width: 400px;
  vertical-align: baseline;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  padding: 2px 6px;
  margin: 6px 0;
}

.bk-scheduler-bubble tr td.bk-popup-label {
  font-weight: 600;
}

// list fixes //
.bk-scheduler-bubble ol li,
.bk-scheduler-bubble ul li,
.dx-popup-content ol li,
.dx-popup-content ul li {
  padding-left: 0;
}

.bk-scheduler-bubble ol,
.bk-scheduler-bubble ul,
.dx-popup-content ol,
.dx-popup-content ul {
  padding-left: 24px;
  margin-bottom: 0;
}

.bk-scheduler-bubble ol ol,
.dx-popup-content ol ol {
  list-style: lower-alpha;
}

.bk-scheduler-bubble ol ol ol,
.dx-popup-content ol ol ol {
  list-style: lower-roman;
}

.bk-scheduler-bubble .dx-button,
.bk-scheduler-bubble .dx-button:hover,
.bk-scheduler-bubble .dx-button:active,
.bk-scheduler-bubble .dx-button:focus {
  color: #00a2e2;
  background-color: transparent;
  box-shadow: none;
  border-color: transparent;
}

.bk-bubble-btn.bk-font-32 .dx-icon {
  font-size: 32px !important;
}

.agenda-appointment-highlight:not(.disabled) {
    border-radius: 3px;
}

.agenda-appointment-highlight:not(.disabled):hover {
    border-color: transparent !important;
}

.bk-scheduler-bubble .bk-popup-title {
  margin-right: 1rem;
  margin-bottom: 5px;
  flex-wrap: wrap;
  overflow: hidden;
  white-space: normal;
  max-height: 60px;
  font-weight: bold;
}

.bk-scheduler-bubble .poppup-headers-wrapper {
  padding: 0 6px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.dx-tooltip-wrapper .dx-overlay-content:before {
    height: 0;
}

.bk-scheduler-bubble .poppup-headers-wrapper > * {
  margin: 6px 0;
}

.active-filter-button-wrapper {
    width: 15rem;
}

.active-filter-button {
    position: absolute;
    top: 0;
    margin-top: 0.3rem;
    margin-left: 0.25rem;
}


.bk-scheduler-bubble .bk-popup-title.title-bigger {
  max-width: 60vw;
  margin-bottom: 6px;
  margin-top: 0.65rem;
  font-size: 16px;
  line-height: 18px;
}

.bk-scheduler-bubble .title-duration {
  display: inline-flex;
  font-weight: 600;
  padding: 2px 8px;
  background: #effcff;
  color: #0090c9;
  border-radius: 3px;
}

.dx-tooltip-wrapper .dx-overlay-content .bk-scheduler-bubble {
    line-height: 1.35715;
}

.appointment-title-type {
    display: inline-flex;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 3px;
}

.bk-scheduler-bubble .bk-popup-text {
  float: none;
  text-align: left;
  width: 100%;
}

.bk-scheduler-bubble .bk-popup-label {
  vertical-align: baseline;
}

.bk-scheduler-bubble .bk-label-text > p {
  margin-bottom: 0;
}

.bk-scheduler-bubble .bk-label-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  min-width: 370px;
  white-space: pre-line;
  text-align: left;
  line-height: 16px;
}

.bk-scheduler-bubble .bk-label-text.description {
  -webkit-line-clamp: unset;
}

.conflicts-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

.conflicts-title {
    font-weight: 300;
    font-size: 1.375rem;
}

.conflicts-message {
    font-weight: 600;
    font-size: 0.875rem;
    text-align: center;
    padding: 0.5rem 0;
    background-color: #F5F6F7;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.conflicts-cancel-icon {
    margin-top: -0.7rem;
    margin-right: -0.7rem;
    font-size: 1.2rem;
    cursor: pointer;
}

.conflicts-divider {
    border-bottom: 1px solid #F5F6F7;
    margin: 0.8rem -20px;
}

.conflicts-content {
    margin: 0.8rem 0;
}

.conflicts-message {
    background-color: #F5F6F7;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    text-align: center;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.5rem 0;
}

.conflicts-detail-label {
    font-weight: 600;
}

.conflict-event-wrapper {
    padding: 1.25rem;
    border: 2px solid #F5F6F7;
    border-top: none;
}

.conflict-event-wrapper:last-child {
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.conflict-event-name {
    font-size: 1rem;
    font-weight: 600;
    color: #354348;
}

.conflict-event-type {
    font-weight: 600;
    display: inline-flex;
    border-radius: 0.1875rem;
    margin-top: 1rem;
    padding: 0.25rem 0.38rem;
}

.conflicting-time {
    margin: 0.4rem 0.4rem 0 0;
    padding: 0.25rem 0.38rem;
    display: inline-flex;
    border-radius: 0.1875rem;
    color: #0090C9;
    background-color: #EFFCFF;
    font-weight: 600;
}

.conflict-table {
    padding-top: 0.75rem;
    display: grid;
    grid-template-columns: 7rem auto;
    gap: 0.5rem;
}

.bk-bubble-btn {
  display: flex;
  width: 40px;
  height: 35px;
  justify-content: center;
}

.bk-bubble-btn.detail .dx-icon-expand:before {
  content: "\e911";
}

.bk-bubble-btn.detail .dx-icon-expand {
  font: 14px/1 baka-webicons;
}

.dx-scheduler-appointment-tooltip-wrapper.dx-tooltip-wrapper
  > .dx-overlay-content {
  max-height: 350px !important;
}

.dx-scheduler-appointment-tooltip-wrapper.dx-tooltip-wrapper
  > .dx-overlay-content
  .dx-popup-content {
  max-height: 348px !important;
  width: auto;
}

#note-scrollview {
  padding-left: 10px;
}

.bk-events-import {
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  margin-top: 20px;
}

.bk-events-import-errors hr {
  margin-top: 0px;
  margin-bottom: 0px;
}

.bk-events-import-errors hr:first-child {
  margin-top: 3rem;
}

.bk-events-import-errors p {
  margin-bottom: 0px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 12px;
}

.data-grid-larger-column {
    margin-right: 1rem;
}

.previously-changed-appointment {
    border-radius: 1px;
    color: #FFFFFF;
}

/*přepsání devextreme stylu kvůli IE*/
#toolbar .dx-button-has-icon .dx-button-content {
  padding: 0px !important;
}

.dx-scheduler-appointment-tooltip-wrapper .dx-list-item {
  table-layout: auto !important;
  width: 100% !important; /* Thirdparty styles css fix */
  min-width: 360px;
}

.dx-scheduler-appointment-tooltip-wrapper .dx-list-item.dx-state-hover,
.dx-scheduler-appointment-tooltip-wrapper .dx-list-item.dx-state-focused,
.dx-scheduler-appointment-tooltip-wrapper .dx-list-item.dx-state-active {
  background-color: transparent !important;
}

/************************************/

/*oprava focus state backgroundu*/
.dx-scheduler-appointment.dx-state-hover,
.dx-scheduler-appointment.dx-state-hover > div {
  background-color: #0090c9 !important;
  color: #fff !important;
}

.dx-scheduler-appointment.dx-state-focused::before,
.dx-scheduler-appointment.dx-state-active::before,
.dx-scheduler-appointment.dx-state-focused > div,
.dx-scheduler-appointment.dx-state-active > div {
  background-color: #00a2e2 !important;
  color: #fff !important;
}

/************************************/

#defaultTimes .dx-field-item-content,
#timesInDatesTab .dx-field-item-content {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

#defaultTimes .dx-field-item,
#timesInDatesTab .dx-datagrid-edit-form-item {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

#list-classes .row {
  display: block !important;
}

#list-classes .row > .d-flex {
  max-width: 100%;
}

.dx-list-static-delete-button.dx-button,
.dx-list-static-delete-button.dx-button.dx-state-focused {
  box-shadow: none;
  border: none;
  background-color: transparent;
}

.dx-list-static-delete-button.dx-button .dx-icon {
  color: #00a2e2 !important;
  font-size: 32px;
}

#list-classes
  .dx-list-item.dx-state-hover
  .dx-list-static-delete-button.dx-button
  .dx-icon {
  color: #fff !important;
}

#report-text {
  min-height: 200px;
  margin-top: 2rem;
  border: 1px solid #ddd;
}

#report-text .dx-button:first-child {
  margin-right: 0;
  margin-left: auto;
}

.dx-item.dx-list-item.dx-state-hover
  .dx-list-static-delete-button.dx-button
  .dx-icon {
  color: #fff !important;
}

.dx-htmleditor-toolbar .dx-button .dx-icon {
  color: #555555;
}

/* Úprava kalendáře */

/* current date color */
.dx-scheduler-date-table-cell.dx-scheduler-date-table-current-date {
  color: #00a2e2;
}

.dx-scheduler-date-table-cell:hover {
  color: #fff;
}
.dx-scheduler-date-table-cell.dx-scheduler-focused-cell,
.dx-scheduler-focused-cell:hover {
  color: #00a2e2;
}

/************************************/

/* oprava hover state v tabulce Časy po dnech */
.dx-datagrid
  .dx-datagrid-rowsview
  .dx-datagrid-content
  .dx-datagrid-table
  .dx-data-row:hover
  > td {
  color: #fff !important;
}

/************************************/

/* button badge height fix */
.dx-scheduler-appointment-collector.dx-button.dx-button-default {
  height: 22px;
}

/************************************/

.dx-popup-content > .datepicker-inline {
  margin: -21px;
  border-radius: 8px;
  overflow: hidden;
}

.datepicker {
    margin: auto;
}

.datepicker-inline .datepicker {
  border-radius: 8px;
}

.datepicker-inline * {
    font-family: Source Sans Pro, sans-serif;
}

.datepicker .datepicker--nav {
  padding: 6px;
}

.datepicker .datepicker--nav-action,
.datepicker .datepicker--nav-title {
  font-weight: 600;
}

.datepicker .datepicker--nav-action:hover,
.datepicker .datepicker--nav-title:hover {
  background: none !important;
}

.datepicker .datepicker--nav-action svg {
  display: none;
}

.datepicker .datepicker--nav-action:before {
  font: 14px/1 baka-webicons;
  font-weight: 600;
  font-size: 25px;
  color: #00a2e2;
}

.datepicker .datepicker--nav-action[data-action="prev"]:before {
  content: "\e930";
}

.datepicker .datepicker--nav-action[data-action="next"]:before {
  content: "\e931";
}

.datepicker .datepicker--day-name {
  font-size: 12px;
  font-weight: 700;
  color: #566971;
  border-bottom: 1px solid #f0f0f0;
  padding-bottom: 7px;
}

.datepicker .datepicker--days-names {
  margin-bottom: 0px;
}

.datepicker .datepicker--content {
  padding-left: 20px;
  padding-right: 20px;
}

.datepicker .datepicker--cell {
  font-size: 12px;
  border-radius: 50px;
}

.datepicker .datepicker--cell {
  height: 27px;
}

.datepicker .datepicker--cell.-selected-,
.datepicker .datepicker--cell.-selected-.-current- {
  /* box-shadow: inset 0px 0px 0px 1px #0090c9; */
  font-weight: bold;
  background-color: #00a2e2;
}

.datepicker--cell.-current- {
  color: #00a2e2;
  font-weight: bold;
  font-size: 13px;
  border: #00a2e2 solid 1px;
}

/* callendat in agenda - not a date picker */

.dx-scheduler-navigator-calendar-popover
  .dx-calendar
  .dx-calendar-body
  .dx-calendar-cell.dx-calendar-today {
  font-weight: bold;
  -webkit-box-shadow: inset 0px 0px 0px 1px #0090c9;
  box-shadow: inset 0px 0px 0px 1px #0090c9;
  -moz-box-shadow: inset 0px 0px 0px 1px #0090c9;
  border-radius: 50px;
  height: 20px;
}

.dx-scheduler-navigator-calendar-popover
  .dx-calendar
  .dx-calendar-body
  .dx-calendar-cell {
  border-radius: 50px !important;
  height: 20px;
}

.dx-scheduler-navigator-calendar-popover
  .dx-calendar
  {
  min-height:240px;
  border-radius:8px;
}

/******************/

.calendar-tip {
  display: flex;
  align-items: center;
  background: #f1fbff;
  border-radius: 5px;
  padding: 12px;
  color: #0190c9;
}

.calendar-tip span {
  font-size: 13px;
  line-height: 16px;
  font-style: italic;
}

.calendar-tip i {
  font-size: 20px;
  margin-right: 16px;
}

.calendar-placeholder {
  color: #c0c6c8;
  border: 1px solid #c0c6c8d2;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 258px;
  height: 273px;
}

.calendar-placeholder .placeholder-text {
  text-align: center;
  font-weight: 600;
  font-size: 14px;
  line-height: 16px;
}

.calendar-placeholder i {
  font-size: 160px;
  color: #c0c6c8ad;
}

.dx-tab-content {
  display: flex;
  align-items: center;
}

.bullet {
  display: inline-flex;
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: grey;
  margin-left: 8px;
}

.dx-tabpanel-container .dx-multiview-item {
  padding-top: 8px; /* Overflow bug fix */
}

#timesInDatesTab {
  padding: 0;
}

#timesInDatesTab .dx-scrollable-content {
  padding: 0;
}

#repeat-to-type .dx-collection {
  display: flex;
  flex-wrap: wrap;
}

#repeat-every .dx-texteditor-input,
#repeat-in-month .dx-texteditor-input {
  text-align: center;
}

#last-occurence .dx-texteditor-input {
  text-align: right;
  padding-right: 0;
}

.repetition-span-section .dx-texteditor-container {
  max-width: 140px;
}

.repetition-type-section .dx-label-h-align {
  padding-right: 0;
}

.table-wrap.row {
  margin-right: 0;
  margin-left: 15px;
}

.noty_body ul {
  margin-bottom: 0;
  margin-left: 1rem;
}

.participants-count {
  display: inline-block;
  margin-left: 0.5rem;
  color: #00a2e2;
}

.dx-datagrid-form-buttons-container {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
  justify-content: space-between;
}

/*templates and types editing popup*/
.dx-datagrid-edit-popup .dx-popup-bottom .dx-toolbar-after {
  display: flex;
  flex-direction: row-reverse;
  width: 100%;
  justify-content: space-between;
}

/*styling cancel button templates, types editing popup*/
.dx-datagrid-edit-popup
  .dx-popup-bottom
  .dx-toolbar-after
  .dx-item:last-child
  .dx-button {
  color: #0090c9;
  background-color: #eceff0;
  border-color: #eceff0;
  box-shadow: none;
}

/*styling cancel button in dx data grid*/
.dx-datagrid-form-buttons-container .dx-button {
  margin-left: 0 !important;
}

.dx-datagrid-form-buttons-container .dx-button:last-child {
  color: #0090c9;
  background-color: #eceff0;
  border-color: #eceff0;
  box-shadow: none;
}

.dx-datagrid-form-buttons-container .dx-button:last-child:hover {
  background-color: #d4dbde;
}

/*styling delete popup buttons*/
.dx-dialog-buttons .dx-toolbar-center {
  display: flex;
  flex-flow: row-reverse;
  justify-content: space-between;
}

.dx-dialog-buttons .dx-toolbar-center .dx-item:last-child .dx-button {
  color: #0090c9;
  background-color: #eceff0;
  border-color: #eceff0;
  box-shadow: none;
  margin-right: 3rem;
}

.dx-dialog-buttons .dx-toolbar-center .dx-item:first-child {
  padding-right: 0;
}

.dx-dialog-message {
  text-align: center;
}

.dx-popup-draggable .dx-popup-title {
  border: none;
}

/* style HTML editor tooltip buttons */
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-before:empty,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-center:empty,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-after:empty {
  width: 0;
}

.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-before,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-center,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-after {
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  padding-left: 0;
}

.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-before
  .dx-toolbar-button,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-center
  .dx-toolbar-button,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-after
  .dx-toolbar-button {
  padding: 0;
}

.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-before
  .dx-toolbar-button:last-of-type
  .dx-button,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-center
  .dx-toolbar-button:last-of-type
  .dx-button,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-after
  .dx-toolbar-button:last-of-type
  .dx-button {
  color: #0090c9;
  background-color: #eceff0;
  border-color: #eceff0;
  box-shadow: none;
}

.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-before
  .dx-toolbar-button:last-of-type
  .dx-button:hover,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-center
  .dx-toolbar-button:last-of-type
  .dx-button:hover,
.dx-popup-draggable
  .dx-popup-bottom
  .dx-toolbar-items-container
  .dx-toolbar-after
  .dx-toolbar-button:last-of-type
  .dx-button:hover {
  background-color: #d4dbde;
  border-color: #d4dbde;
  color: #0090c9;
}

.dx-popup-draggable .dx-popup-content {
  padding: 20px 32px;
}

.dx-dialog-content:not(.nothing) {
  padding: 2.5rem;
}

.dx-dialog-buttons
  .dx-toolbar-center
  .dx-item:last-child
  .dx-button:last-child:hover {
  background-color: #d4dbde;
}

#event-form-tabs .dx-tabpanel-tabs {
  display: none;
}

.dx-field-item-label-location-left {
  padding-right: 2rem;
}

.dx-datagrid-edit-popup .vue-swatches {
  margin-left: 0;
}

/* Label styling*/
.dx-field-item-label > * {
  font-weight: 600 !important;
}

.dx-multiview-wrapper .bk-label-text {
  font-weight: 600 !important;
}

/*Wizard styles*/

.stepper {
  display: flex;
  width: 100%;
  margin: 0 auto 0.5rem auto;
  align-items: start;
  background: #f5f6f7;
  padding-block: 1rem;
  border-radius: 5px;
}

.stepper-step {
  flex: 1;
  position: relative;
}

div.stepper-title {
  margin-top: 0.5rem;
  text-align: center;
  display: block;
  color: #00a2e2;
  font-weight: 600;
  font-size: 1rem;
}

div.stepper-title.stepper-title-last {
  color: #abb9bf;
}

.stepper-title-visited.stepper-title.stepper-title-last {
  color: #37c999;
}

button.stepper-title {
  margin-top: 0.5rem;
  text-align: center;
  display: block;
  color: #abb9bf;
  background: transparent;
  border: none;
  outline: none;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
}

.stepper-left-bar {
  position: absolute;
  top: 1rem;
  height: 4px;
  left: 0;
  right: 50%;
  background-color: #d4dbde;
}

.stepper-right-bar {
  position: absolute;
  top: 1rem;
  height: 4px;
  right: 0;
  left: 50%;
  background-color: #d4dbde;
}

.stepper-circle {
  width: 2rem;
  height: 2rem;
  margin: 0 auto;
  color: white;
  border-radius: 50%;
  text-align: center;
  display: inline-block;
  text-align: center;
  padding-top: 0.25rem;
  background-color: #00a2e2;
  cursor: pointer;
  position: relative;
  z-index: 1;
  font-weight: 600;
  font-size: 1rem;
}

.stepper-circle-current {
  box-shadow: 0 0 0px 5px #c3e6f3;
  background-color: #00a2e2;
  color: white;
  font-weight: 600;
  font-size: 1rem;
}

.stepper-circle-unvisited,
.stepper-circle-unvisited.stepper-circle-last {
  background-color: #d4dbde;
  cursor: pointer;
  font-weight: 600;
  font-size: 1rem;
  color: #8c9fa6;
}

.stepper-circle-unvisited.stepper-circle-last {
  cursor: auto;
}

.stepper-circle-last {
  cursor: auto;
  background-color: #37c999;
}
.stepper-center {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.stepper-bar-visited {
  background-color: #00a2e2;
}

.stepper div:last-child .stepper-left-bar.stepper-bar-visited {
  background: hsla(197, 100%, 44%, 1);

  background-image: linear-gradient(
    90deg,
    rgb(0, 162, 226) 0%,
    rgb(55, 201, 153) 100%
  );
}

button.stepper-title-visited {
  color: #566971;
}

.form-label {
  display: flex;
  align-items: center;
  font-size: 16px;
  margin-bottom: 0.5rem;
  font-weight: 300;
  color: #758d96;
}

.form-label-side-paddings {
    padding: 0 15px;
}

.basic-settings-description {
    margin: 1rem 0;
}

.basic-settings-reveal-options {
    margin-top: -10px;
}

.label-stripe {
  flex: 1;
  border-top: 1px solid #d5d5d5;
  margin-left: 0.5rem;
}

.absence-item {
  display: flex;
  align-items: center;
}

.tooltip-wrapper.tooltip-wrapper .dx-popup-content {
    white-space: pre-line !important;
    background-color: #eceff0;
    text-align: start;
    padding: 0.5rem;
}

.tooltip-icon-inline-margin {
    margin-left: 0.3rem;
}

.tooltip-wrapper {
    z-index: 9999999 !important;
}

.tooltip-wrapper .dx-popover-arrow:after {
  border: 1px solid #eceff0 !important;
  background: #eceff0 !important;
}

.dx-accordion-item-title {
  font-size: 16px;
}

.dx-form-group-caption {
  font-size: 16px;
  font-weight: 300;
  color: #758d96;
  position: relative;
  width: 100%;
  display: block;
  overflow: hidden;
}

.dx-form-group-caption::after {
  content: "";
  height: 1px;
  width: 100%;
  background: #d5d5d5;
  position: absolute;
  top: 12px;
  margin-left: 10px;
}

/**********************/

/*select all participants styling*/

#participants-all-operations {
  font-size: 16px;
  font-weight: 600;
}

/**********************/

/*add by name button hover fix*/

.dx-item.dx-list-item:hover .add_by_name {
  color: white;
}

.dx-item.dx-list-item.dx-list-item-selected {
  color: #435359;
  background: white;
}

.dx-item.dx-list-item.dx-list-item-selected .add_by_name {
  color: #00a2e2;
  background: white;
}

.dx-item.dx-list-item.dx-list-item-selected:hover,
.dx-item.dx-list-item.dx-list-item-selected:hover .add_by_name {
  color: white;
  background: #00a2e2;
}

/**********************/

.dx-item.dx-treeview-item:hover,
.dx-item.dx-treeview-item:hover > div {
  color: white;
  background: #0190c9;
}

/*background color and footer popup fix*/

.dx-overlay-wrapper .dx-popup-wrapper .dx-overlay-modal > .dx-overlay-content,
.dx-popup-wrapper > .dx-overlay-content {
  background-color: #fefefe;
}


.dx-popup-wrapper.dx-tooltip-wrapper .dx-overlay-content,
.dx-popup-wrapper.dx-tooltip-wrapper .dx-overlay-content .bk-scheduler-bubble {
    background-color: #F5F6F7;
}

.dx-popup-wrapper.dx-tooltip-wrapper .dx-overlay-content .dx-popover-arrow:after {
    background-color: #eceff0 !important;
}

.dx-popup-wrapper.dx-tooltip-wrapper .dx-overlay-content .dx-popover-arrow:has( + .bk-scheduler-bubble):after {
    background-color: #F5F6F7 !important;
}

.dx-popup-wrapper.dx-tooltip-wrapper.dx-scheduler-appointment-tooltip-wrapper .dx-overlay-content,
.dx-popup-wrapper.dx-tooltip-wrapper.dx-scheduler-appointment-tooltip-wrapper .dx-overlay-content .bk-scheduler-bubble {
    background-color: #FFFFFF;
}

.dx-popup-wrapper.dx-tooltip-wrapper.dx-scheduler-appointment-tooltip-wrapper .dx-overlay-content .dx-popover-arrow:after {
    background-color: #FFFFFF !important;
}



.dx-toolbar.dx-widget.dx-visibility-change-handler.dx-collection.dx-popup-bottom {
    background-color: #f5f6f7;
    z-index: 1000;
    position: relative;
    padding-inline: 2rem;
}

.dx-tabpanel .dx-multiview-wrapper,
.dx-tabpanel.dx-state-focused .dx-multiview-wrapper,
.dx-multiview-wrapper,
.dx-state-focused .dx-multiview-wrapper {
  border-top: none;
}

.dx-toolbar-label .dx-toolbar-item-content > div {
  color: #566971;
  font-weight: 600;
  font-size: 18px;
  padding-left: 10px;
  padding-top: 10px;
}

/*element height fix after added select all button*/

.bk-nadpis i {
  background-color: #00a2e2;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  margin-right: 1rem;
  color: white;
  font-size: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bk-nadpis {
    height: 4rem;
    padding-inline: 2rem;
    justify-content: flex-start;
}

.appointment-filter-input .dx-tag-container.dx-tag-container {
    padding-right: 0;
}

.print-heading {
    font-weight: 300;
    color: #758D96;
    font-size: 1.125rem;
    margin-bottom: 0.7rem;
}

.print-wrapper {
    position: relative;
    margin-left: 0.7rem;
}

.filter-date-pickers-wrapper {
    padding: 1.5rem 1rem;
    border-radius: 0.5rem 0 0 0.5em;
    border: 1px solid #DFE4E7;
    transform: translate(1.5px, 0);
    border-right-color: white;
    z-index: 1;
    border-right-width: 2px;
    height: 5.4rem;
}

.filter-dates-wrapper {
    align-items: start;
}

.filter-dates-select-wrapper {
    border: 1px solid #DFE4E7;
    padding: 0.5rem 1rem;
    border-radius: 0 0.5rem 0.5rem 0.5rem;
    flex: none;
    width: 15.5rem;
}

.printer-date-picker-wrapper {
    position: absolute
}

.printer-filter-wrapper {
    margin-top: calc(5.4rem + 1rem); 
    width: calc(100% - 17.3rem); 
    position: absolute;
}

.printer-filter-inner-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.printer-remove-filters {
    border-radius: 0.25rem;
    font-size: 0.75rem;
    padding-top: 0.05rem;
    background: rgba(0, 162, 226, 0.10);
    padding: 0.25rem 0.5rem 0.25rem 0.25rem;
    display: flex;
    align-items: center
}

.printer-remove-filters-icon {
    margin-right: 0.38rem;
    background: #00A2E2;
    width: 1.1rem;
    height: 1.1rem;
    color: white;
    display: flex;
    align-items: center;
    border-radius: 50%;
    justify-content: center
}

.printer-remove-filters-text.printer-remove-filters-text.printer-remove-filters-text {
    font-weight: 600;
    color: #0190C9;
    font-size: 0.625rem;
}

.printer-remove-filters-text.printer-remove-filters-text.printer-remove-filters-text a {
    cursor: pointer;
    text-decoration: underline;
}

.scheduler-filter-buttons {
    margin-top: 2rem;
}


/* Participants (add teachers to classes) auto set button */
#participants-auto-set-supervision {
    width: 100%;
    margin-top: 0.8rem;
}

#participants-auto-set-supervision,
#basic-settings-mail {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Source Sans Pro, sans-serif !important;
}

#participants-auto-set-supervision .dx-button-content,
#basic-settings-mail .dx-button-content {
  padding-left: 8px;
}

#participants-auto-set-supervision::before {
  font-size: 1.8rem;
  font-family: baka-webicons-modul !important;
  font-weight: normal !important;
}

#basic-settings-mail::before {
  font-size: 1.8rem;
  font-family: baka-webicons !important;
  font-weight: normal !important;
  padding-left: 12px;
}

.wizard-icon-button {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Source Sans Pro, sans-serif !important;
}

#wizard-right-button,
#save-order-button {
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  flex-direction: row-reverse;
}

#wizard-right-button.dx-state-disabled,
#save-order-button.dx-state-disabled {
  background-color: #00a2e2;
  opacity: 0.7;
}

#wizard-right-button.dx-state-disabled .dx-button-text,
#save-order-button.dx-state-disabled .dx-button-text {
  color: white;
  opacity: 1;
}

.btn-loading::before {
  content: "";
  position: relative;
  width: 16px;
  height: 16px;
  right: -8px;
  margin: 0 12px;
  border: 4px solid transparent;
  border-top-color: #ffffff95;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}

@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}

.wizard-icon-button::before {
  font-size: 1.8rem;
  font-family: baka-webicons !important;
  font-weight: normal !important;
}

#wizard-left-button .dx-button-content {
  font-family: Source Sans Pro, sans-serif !important;
}

#wizard-left-button::before {
  padding: 2px 0 0 0;
  margin-right: -1rem;
}

#wizard-right-button::before {
  padding: 2px 0 0 0;
  margin-left: -1rem;
}

#wizard-right-button .dx-button-content {
  font-family: Source Sans Pro, sans-serif !important;
  color: white;
}

.dx-item-content.dx-multiview-item-content {
  padding-top: 0;
}

#detail-tab-panel .dx-tabpanel-container {
  padding-top: 33px !important;
}

/* Tabs border-bottom fixes */

.dx-tabpanel .dx-tab-selected::before,
.dx-tab-selected::before {
  border-bottom: 1px solid #fefefe;
}

.dx-tabpanel .dx-tabs,
.dx-tabs {
  border-bottom: 1px solid #abb9bf;
}

/* datepicker cell fix */
.datepicker .datepicker--cell {
  height: 30px;
}

.header-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.help-icon {
  margin-right: 1.5rem;
  font-size: 2rem;
  color: #00a2e2;
}

.vue-swatches__container:not(.vue-swatches--inline) {
    box-shadow: none!important;
    filter: drop-shadow(0px 3px 5px rgba(171, 185, 191, 0.4));
    padding: auto;
}

.vue-swatches {
  margin-top: 4px;
  margin-left: 8px;
}

.vue-swatches__trigger__wrapper,
.vue-swatches__swatch {
  position: relative;
}

.vue-swatches__trigger__wrapper::before,
.vue-swatches__swatch::before {
  position: absolute;
  content: "";
  left: 0;
  width: 20px;
  height: 20px;
  right: 0;
  border-radius: 5px;
  background-color: rgba(255, 255, 255, 0.3);
}

.event-reveal-options-wrapper {
    margin: 0.5rem 0;
}

.event-reveal-options-label {
    margin-bottom: 1rem;
}

.dx-scheduler-work-space-month .dx-scheduler-appointment-content {
    line-height: 20px;
}

.dx-field-item-required-mark {
    color: #566971;
}

.event-description-wrapper {
    margin-top: 1.5rem;
}


/* Secondary buttons */
.btn-secondary,
.btn-secondary.dx-button {
    color: #0090c9;
    background-color: #eceff0 !important;
    border-color: #eceff0;
}

.btn-secondary:not(:disabled):not(.disabled):hover,
.btn-secondary.dx-button:not(:disabled):not(.disabled):hover {
  background-color: #d4dbde !important;
  border-color: #d4dbde !important;
  color: #0090c9 !important;
}

#order-button .dx-button-content {
  padding: 7px 9px;
  font-family: Source Sans Pro, sans-serif !important;
}

#order-button::before {
  font-size: 1.8rem;
  font-family: baka-webicons;
  margin-left: 0.5rem;
}

#participant-accordion .dx-list-item .dx-item-content {
  display: flex;
}

#participant-accordion .dx-list-item .dx-item-content * {
  margin: 5px 8px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

#participant-accordion .dx-list-item .dx-item-content *:first-child {
  margin-left: 3px;
  width: 15rem;
}

#participant-accordion .dx-list-item .dx-item-content *:nth-child(2) {
  width: 20rem;
}

.dx-list-item-content {
  padding: 6px 10px;
}

.modal-short {
  max-height: 670px !important;
}

/* details template */

.template-detail-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  line-height: 16px;
}

.template-detail-wrapper > * {
  padding: 18px 24px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  width: 45%;
}

.template-detail-wrapper > * i {
  font-size: 32px;
  margin-right: 24px;
}

.template-detail-absence {
  background-color: #fdefff;
}

.template-detail-reveal {
  background-color: #f1fef0;
}

.event-template-table table td {
  text-align: left !important;
}

.event-template-type {
  border-radius: 3px;
  padding: 2px 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
  position: relative;
  text-align: center;
  min-width: 4rem;
  z-index: 1;
  transform-style: preserve-3D;
}

.dx-row.dx-data-row:hover .event-template-type::before {
  background: white;
  border-radius: 3px;
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: -1;
  transform: translateZ(-1px);
}

.event-template-type.days {
  margin-right: 8px;
  min-width: unset;
}

/* Button dropdown popup */

.dx-dropdownbutton-popup-wrapper .dx-popup-content {
  background-color: #f7f8f9;
}

[id^="tooltip-icons"] .dx-icon {
  color: #00a2e2 !important;
}

/* appointment box shadow */
.dx-scheduler-timeline .dx-scheduler-appointment,
.dx-scheduler-work-space-month .dx-scheduler-appointment,
.dx-scheduler-all-day-appointment {
  -webkit-box-shadow: inset 2px 0px 0px 0px rgba(54, 66, 77, 0.1);
  -moz-box-shadow: inset 2px 0px 0px 0px rgba(54, 66, 77, 0.1);
  box-shadow: inset 2px 0px 0px 0px rgba(54, 66, 77, 0.1);
}

/* repeat weekly dropdown fix */
#weekly-days-selection .dx-texteditor-input {
  padding-right: 0px !important;
  min-width: 280px;
}

.reveal-date {
  font-style: italic;
  font-size: 13px;
  color: #0ba6e3;
}

.popup-title-wrapper {
  display: flex;
  align-items: center;
}

.popup-title-wrapper i {
  color: #00a2e2;
  font-size: 20px;
}

#filter-activated-text {
  border: none;
}

#filter-activated-text input {
  font-weight: 700;
  color: #0098de;
}

.repetition-span-label {
  width: 160px;
}

#last-occurence .dx-texteditor-input {
  text-align: left;
}

#filter-drop-down-button .dx-button {
  width: auto;
}

#filter-drop-down-button.filters-applied .dx-button {
  padding-inline: 8px;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal {
  width: auto;
  margin: 0;
  border: 1px solid #00a2e2;
  border-radius: 0;
  color: #0090C9;
  height: min-content;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal {
  width: auto;
  margin: 0;
  border: 1px solid #00a2e2;
  border-radius: 0;
  color: #0090C9;
  height: min-content;
}

.show-only-my-events-wrapper .dx-button {
    background-color: transparent;
    box-shadow: none;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal:first-child {
    border-bottom-left-radius: 16px;
    border-top-left-radius: 16px;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal:last-child {
  border-bottom-right-radius: 16px;
  border-top-right-radius: 16px;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal.dx-state-hover {
  background-color: #0090C9 !important;
  border-color: #0090C9;
  color: #fff;
}

.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button.dx-button-normal.dx-item-selected {
  background-color: #00A2E2;
  color: #FFFFFF;
}


.show-only-my-events-wrapper .dx-item.dx-buttongroup-item.dx-button-has-text .dx-button-content {
    padding-inline: 12px;
    padding-block: 4px;
  }
  

#options-drop-down-button .dx-button.dx-state-focused,
#options-drop-down-button .dx-button.dx-state-hover {
  background-color: transparent !important;
}

#lists-of-selected .dx-form-group-content {
  max-width: 100%;
  margin: 0;
}

#lists-of-selected .dx-accordion-wrapper .dx-scrollable-wrapper .dx-field-item {
  padding-inline: 0;
}

.calendar-header {
  font-size: 16px;
  font-weight: 300;
  color: #758d96;
  position: relative;
  text-align: center;
  max-width: 260px;
}

.dialog-popup .dx-popup-bottom {
  padding: 16px 25px !important;
}

.dialog-popup-content-wrappper {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  margin: 23px 26px 6px 26px;
  text-align: center;
}

.dialog-popup-content-wrappper h6 {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 17px;
}

/* RESPONSIVENESS BASICS  */
@media (max-width: 1200px) {
  button.stepper-title,
  div.stepper-title {
    font-size: 0.9rem;
  }

  .calendar-tip-spacer {
    display: none !important;
  }

  .dx-layout-manager .dx-tabpanel .dx-multiview-item-content {
    padding-top: 0;
  }

  #weekly-days-selection .dx-texteditor-input {
    min-width: 160px;
  }

  #daily-day-selection {
    max-width: 130px;
  }

  .repetition-span-section
    .dx-field-item-label.dx-field-item-label-location-left {
    width: 160px;
  }

  .repetition-span-section .wrap.row .justify-content-between {
    justify-content: flex-start !important;
  }
}

@media (max-width: 1300px) {
  #substitutions.col-lg-3 {
    max-width: unset;
  }
}

@media only screen and (max-width: 1024px) {
  .dx-popup-normal {
    width: 96% ;
  }

  .dx-formdialog .dx-popup-normal,
  .dx-popup-wrapper .dx-popup-normal {
    width: auto;
  }
}

/* Make scheduler scrollable again */
.dx-scheduler
  .dx-scheduler-work-space-month
  .dx-scheduler-scrollable-fixed-content,
.dx-scheduler
  .dx-scheduler-work-space-month
  > .dx-scrollable-native
  .dx-scrollable-content  {
  height: auto !important;
}

@media only screen and (min-height: 1054px) {
  .dx-scheduler
    .dx-scheduler-work-space-month
    .dx-scheduler-scrollable-fixed-content,
  .dx-scheduler
    .dx-scheduler-work-space-month
    > .dx-scrollable-native
    .dx-scrollable-content  {
    height: 100% !important;
  }
}

#scheduler .dx-scheduler-work-space-month .dx-scheduler-cell-sizes-vertical {
  height: 114px;
}

.dx-scheduler-header-panel {
  margin-top: 0;
}

.dx-scheduler-work-space-week .dx-scheduler-all-day-title,
.dx-scheduler-work-space-work-week .dx-scheduler-all-day-title {
  top: 96px;
}

/* Opravuje, že se bottom border u listu účastníků neukazuje. */
.participants-selected-items-list {
    margin-bottom: 2px; 
}


/* freemodule page height fix */
.main .bk-content {
  height: calc(100% - 56px);
}

/* Vue datepicker styles */
.mx-datepicker-main {
  z-index: 100000; /* WOW! */
}

.mx-icon-double-right,
.mx-icon-double-left {
  display: none;
}

.mx-calendar-content .cell {
  border-radius: 37px;
  font-size: 12px;
  border-radius: 50px;
  height: 30px;
}

.mx-calendar-content .cell.active {
  background-color: #00a2e2;
}

.pick-date {
  justify-content: space-between;
  gap: 1rem;
  display: flex;
}

.datepicker-wrap {
  display: flex;
  align-items: center;
}

.datepicker-wrap .mx-datepicker {
  width: 100%;
  max-width: 120px;
}

.pick-date-content .section-header {
  font-weight: 600;
  font-size: 12px;
  color: #566971;
  margin-bottom: 12px;
}

.pick-date-content .date-select-item {
  font-weight: 600;
  font-size: 14px;
  color: #0090c9;
  margin: 10px 0;
  width: fit-content;
}

.pick-date-content .date-select-item:hover {
  text-decoration: underline;
  cursor: pointer;
}

.pick-date-content .date-select-item.selected-date {
  text-decoration: underline;
}

.pick-date-content .second-col {
}

.pick-date-content .datepicker-label {
  font-weight: 600;
  font-size: 14px;
  line-height: 14px;
  display: flex;
  align-items: center;
  color: #435359;
  min-width: 40px;
}

.datepicker-wrap .dx-icon-event:before {
  color: #0090c9;
}

.mx-calendar {
  font-family: Source Sans Pro, sans-serif;
}

.mx-calendar button:focus {
  outline: none;
}

.mx-icon-left:before,
.mx-icon-right:before,
.mx-icon-double-left:before,
.mx-icon-double-right:before,
.mx-icon-double-left:after,
.mx-icon-double-right:after {
  width: 16px;
  height: 16px;
  color: #00a2e2;
}

.mx-btn:hover {
  border-color: #00a2e2;
  color: inherit;
}

.mx-zoom-in-down-enter-active,
.mx-zoom-in-down-leave-active {
  opacity: 1;

  -webkit-transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1),
    -webkit-transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top;
}
.mx-zoom-in-down-enter,
.mx-zoom-in-down-enter-from,
.mx-zoom-in-down-leave-to {
  opacity: 0;
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

.mx-btn-current-month {
  font-weight: 600;
  text-transform: uppercase;
}

.mx-input:focus,
.mx-input:focus:hover {
  border-color: #00a2e2;
}

.mx-input:hover {
  border-color: #ccc;
}

.mx-input:focus {
  outline: none;
  box-shadow: 0px 0px 0px 3px #00a1d21f;
}

.mx-calendar-decade-separator:after {
  content: "-";
}

.mx-calendar-content .cell.active {
  color: #fff;
  background-color: #00a2d2;
}

.mx-table th {
  padding: 0;
  font-weight: 500;
  vertical-align: middle;
  border-bottom: 1px solid #f2f2f2;
  text-transform: uppercase;
}

.mx-table-date .today {
  border: 1px solid #00a2e2;
  font-weight: 700;
}

.mx-datepicker-popup {
  border-radius: 4px;
  box-shadow: 0 6px 12px rgb(0 0 0 / 10%);
}

.mx-icon-calendar,
.mx-icon-clear {
  right: 2px;
}

.recommended-dates {
  height: calc(100% - 40px);
}

/* event types color picker fix */
.event-types-edit .dx-item-content.dx-multiview-item-content{
    min-height: 290px;
}

/* tooltips under dx-bubble fix */
.ui-tooltip.ui-widget.ui-widget-content {
    z-index: 99999;
}

.hint-link {
    font-size: 1rem;
}

.hint-link:hover {
    text-decoration: none;
}

.mail-poupup-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: 2rem;
}

.mail-pupup-icon {
    background-color: #00A2E2;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    color: white;
    font-size: 5rem;
    padding: 0.5rem;
}

.appointment-toooltip-icons {
    transform: translate(7px);
    display: flex
}

.appointment-template-content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    align-items: center
}

.public-module-content {
    left: 0;
    top: 0;
}


.dx-empty-message {
  border-top: 0px solid #e6e6e6;
  color: #ced6db;
  font-weight: bold;
  margin: 30px;
  text-align: center;
  font-size: 16px;
  padding: 10px 10px;
}

.data-import-error-list {
    margin-bottom: 5px;
    margin-top: 20px;
}

.icon-with-right-margin {
    margin-right: 5px;
}

.appointement-name {
    line-height: 20px;
}

.appointment-tooltip-name {
    padding-inline: 6px;
}

.appointment-tooltip-date {
    padding-left: 6px;
}

.icon-with-right-margin {
    margin-right: 5px;
}

.appointment-tooltip-icon-wrapper {
    display: flex;
    transform: translate(7px);
}

.appointment-remove-icon-before-message {
    padding: 1.8rem;
}

.appointement-tooltip-dropdown-option-icon {
    margin-right: 0.5rem;
}

.event-detail-send-mail-button {
    padding: 20px;
}

.repetition-text-wrapper {
    padding: 20px 40px;
}

.repetition-text-inner-wrapper {
    margin-bottom: 20px;
}

.repetition-date-picker-wrapper {
    margin-top: 20px;
}

.rooms-list-element {
    margin: 3px 0;
}

.event-detail-report-wrapper {
    padding: 10px 20px;
}

.event-wizard-check-icon {
    margin-top: 2px;
}

.mail-popup-icon-wrapper {
    margin-bottom: 2rem;
}

.mail-popup-icon {
  font-size: 2rem;
    background: #00A2E2;
    border-radius: 100%;
    width: 3rem;
    display: flex;
    height: 3rem;
    justify-content: center;
    align-items: center;
    color: white;
}

.mail-popup-want-to-send-mail-text {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 2rem;
}

.basic-settings-col-2 {
    min-width: 17rem;
}

.basic-settings-item-wrapper {
    padding-top: 0;
}

.basic-settings-item-inner-wrapper-checkbox {
    margin-left: 1rem;
    max-width: 3rem;
    min-width: 3rem;
    width: auto;
}

.basic-settings-item-inner-wrapper-no-checkbox {
    margin-left: 1rem;
    width: auto;
    flex: 1 0 13rem;
}

.repetition-type-items-caption-wrapper {
    padding-bottom: 20px;
}

.repetition-type-items-caption {
    padding-left: 14px;
}

.repetition-type-item-wrapper {
    padding-top: 20px;
}

.calendar-tip-spacer {
    min-height: 8px;
    min-width: 160px;
}

.repetition-item-wrapper {
    padding-bottom: 20px;
}

.repetition-item {
    padding-left: 14px;
}

.repetition-span-item-text {
    white-space: nowrap;
}

.date-picker-info-wrapper {
    margin-top: 20px;
}

.calendar-tip-wrapper {
    padding: 0 1rem;
}

.participant-selection-tab-left-side {
    margin-bottom: 10px;
}

.participant-list-item {
    margin: 3px 0;
}

.participants-operations-on-all {
    margin-top: 10px;
}

.participant-group-wrapper {
    text-align: right;
    width: 100%;
}

.participant-list-item-checkbox {
    padding-right: 7px;
}

.class-group-item {
    margin: 3px 0;
    display: flex;
}

.room-tab-field {
    margin: 3px 0;
}

.rooms-left-selection {
    margin-top: 1rem;
}

.room-tab-absence-text {
    white-space: normal;
}

.day-label-text {
    font-size: 14px;
    font-weight: 600;
}

.date-label-bottom-ruler {
    border-top: 1px solid #F2F2F2;
}

.list-selection-name {
    float: left;
    margin: 3px 0;
}

.list-selection-delete-button {
    float: right;
    margin-right: 10px;
}

.event-template-or-type-save-button {
    float: right;
    margin-top: 1rem;
}

.event-template-or-type-save-button-after-element {
    clear: both;
}

.appointment-filter-header {
    color: #758D96;
    text-align: center;
    font-weight: 600;
    margin-bottom: 1rem;
    margin-top: 0.5rem;
}

.appointment-filter-input {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

.appointment-filter-input-label {
    min-width: 5rem; 
    font-weight: 600; 
    font-size: 0.875rem;
}

.appointment-filter-changed-dot {
    width: 0.375rem;
    height: 0.375rem;
    background: #00A2E2;
    border-radius: 50%;
    margin-right: 0.31rem;
    flex: none;
}

.scheduler-filter-scroll-view.scheduler-filter-scroll-view.scheduler-filter-scroll-view {
    height: auto;
    max-height: 30vh;
}


/* oprava dropdownu "více možností" v detailu akce při malé šířce displaye, !important je nezbytné*/
.dx-overlay-wrapper.dx-popup-wrapper.dx-dropdownbutton-popup-wrapper {
    width: 54px !important;
}

.wizard-notification-checkbox-wrapper {
    white-space: nowrap;
    display: flex;
    margin-top: 1.5rem;
    align-items: center;
}

.wizard-notification-checkbox-wrapper-inner {
    margin-right: 0.7rem;
    margin-bottom: 0.2rem;
}

.agenda-small-tooltip-class-list {
    font-style: italic;
}

.centered-inline-icon {
    vertical-align: sub;
    font-size: 1.4rem;
}

.agenda-badge {
    background-color: #E5F6FC;
    border-radius: 0.1875rem;
    padding: 0.0625rem 0.25rem;
    margin-right: 0.3rem;
    flex: 1;
    font-weight: 600;
    color: #0090C9;
    font-size: 0.625rem;
    letter-spacing: 0.03125rem;
    display: inline-block;
    text-transform: lowercase;
}

.agenda-text-next-to-badge {
    margin-right: 1.5rem;
}

.agenda-cell {
    cursor: pointer;
    display: flex;
    background-color: white;
    padding: 0.625rem 0.5rem;
}

.agenda-cell-avatar {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.1875rem;
    margin-right: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    flex: none;
}

.agenda-cell-icon {
    font-size: 0.875rem;
    font-weight: 600;
}

.agenda-cell-icon-note {
    vertical-align: sub;
    font-size: 1.4rem;
}

.agenda-cell-text-part {
    z-index: 2;
    color: #566971
}

.dx-state-hover > div > .agenda-cell-text-part {
    color: #ffffff;
}

.dx-state-focused > div > .agenda-cell-text-part {
    color: #ffffff;
}


.agenda-cell-title {
    font-size: 1rem;
    font-weight: 700;
}

.agenda-cell-description {
   display: flex;
}

.agenda-cell-time-info {
    flex: none;
    margin-right: 1rem;
}


/** Nastavení **/
.page-h3 {
    font-size: 18px;
    font-weight: normal;
    color: #000000;
}

.text-italic {
    color: #758D96;
    font-size: 14px;
    font-style: italic;
    line-height: 16px;
}

.alert-box {
    padding: 16px;
    border-radius: 5px;
    display: flex;
    width: 100%;
}

    .alert-box.success {
        background: rgba(67, 162, 43, 0.1);
    }

        .alert-box.success * {
            color: #43A22B;
        }

        .alert-box.success i[class^=ico32-] {
            background-color: rgba(67, 162, 43, 0.1);
        }

    .alert-box.warning {
        background: rgba(208, 51, 51, 0.15);
    }

        .alert-box.warning * {
            color: #DB0F1D;
        }

        .alert-box.warning i[class^=ico32-] {
            background-color: rgba(208, 51, 51, 0.1);
        }

    .alert-box i[class^=ico32-] {
        margin-right: 32px;
        height: 32px;
        font-weight: bold;
        border-radius: 16px;
        padding: 4px;
        width: 32px;
        font-size: 25px;
    }

    .alert-box .title {
        display: flex;
        font-size: 16px;
        font-weight: 600;
        line-height: 20px;
        align-items: center;
    }

.dx-radiogroup.dx-state-disabled .dx-radiobutton-checked .dx-radiobutton-icon-dot {
    background: #D9D9D9;
}

.dx-scheduler-agenda .dx-scheduler-time-panel-cell > div{
    margin-top: 0px;
}
.agenda-thin-border:after {
    position: absolute;
    content: '';
    border-bottom: 1px solid rgba(230, 230, 230, 0.6);
    width: 100%;
    transform: translateX(-50%);
    bottom: 0px;
    left: 50%;
}
.agenda-thick-border:after {
    position: absolute;
    content: '';
    border-bottom: 4px solid #e6e6e6;
    width: 200%;
    transform: translateX(-62%);
    bottom: -3px;
    left: 50%;
}

/** --------- */
