:root {
    --bs-primary: #d05612;
    --bs-primary-darker: #a4440e;
    --bs-primary-light: #d4e1da;
    --bs-nav-pills-link-active-bg: #d05612;
    --bs-light: #eee;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem #FC691799;
    --workday-area: #007dbc;
    --workday-office: #00967f;
    --workday-mixed: #02558b;
    --workday-free: #3eb049;
    --workday-special: #f99d25;
    --visit-standard: #007dbc;
    --visit-standard-inactive: #59849E99;
    --visit-service: #7514a5;
    --visit-service-inactive: #594B617A;
    --notification: #198c9b;
    --notification-inactive: #305C6182;
    --darkred: #a31c1c;
    --lightgray: #f3f3f3;
    --gray: #dedede;
    --darkgray: #b4b4b4;
    --semidark: #999;
}

html {
  font-size: 15px;
}

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

a {
  color: var(--bs-primary);
}

a:hover {
  color: var(--bs-primary-darker);
}

.text-primary {
  color: var(--bs-primary) !important;
}

.bg-primary {
  background-color: var(--bs-primary) !important;
}

.bg-light {
  background-color: var(--lightgray) !important;
}

.bg-gray {
  background-color: var(--gray);
}

.text-gray {
  color: var(--darkgray);
}

.text-semidark {
  color: var(--semidark);
}

.border-semidark {
  border-color: var(--semidark);
}

.btn {
  border-radius: 2px;
}

.btn:focus {
  box-shadow: var(--bs-btn-active-shadow);
}

.btn img {
  width: 1.2em;
  margin-top: -0.2em;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary-darker);
    --bs-btn-hover-border-color: var(--bs-primary-darker);
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--bs-primary-darker);
    --bs-btn-active-border-color: var(--bs-primary-darker);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background-color: var(--bs-primary-light);
  color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.btn-workday-area,
.btn-workday-area:hover,
.btn-workday-area:focus,
.btn-workday-area:disabled {
  color: #fff;
  background-color: var(--workday-area);
  border-color: var(--workday-area);
}

.btn-workday-office,
.btn-workday-office:hover,
.btn-workday-office:focus,
.btn-workday-office:disabled {
  color: #fff;
  background-color: var(--workday-office);
  border-color: var(--workday-office);
}

.btn-workday-mixed,
.btn-workday-mixed:hover,
.btn-workday-mixed:focus,
.btn-workday-mixed:disabled {
  color: #fff;
  background-color: var(--workday-mixed);
  border-color: var(--workday-mixed);
}

.btn-workday-free,
.btn-workday-free:hover,
.btn-workday-free:focus,
.btn-workday-free:disabled {
  color: #fff;
  background-color: var(--workday-free);
  border-color: var(--workday-free);
}

.btn-workday-special,
.btn-workday-special:hover,
.btn-workday-special:focus,
.btn-workday-special:disabled {
  color: #fff;
  background-color: var(--workday-special);
  border-color: var(--workday-special);
}

.btn-workday-area:disabled,
.btn-workday-office:disabled,
.btn-workday-mixed:disabled,
.btn-workday-free:disabled,
.btn-workday-special:disabled {
  opacity: 1;
}

.btn-workday-outline {
  color: var(--bs-secondary) !important;
  background-color: transparent !important;
  border: 1px solid var(--bs-secondary) !important;
}

.form-control, .form-select {
  border-radius: 2px;
  box-shadow: none;
}

.form-control:focus,
.form-select:focus {
  border: 1px solid #000;
  box-shadow: 0 1px 3px #0003;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted,
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected, .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
  background-color: var(--bs-primary);
  color: #fff;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus,
.select2-container--bootstrap-5.select2-container--focus .select2-selection, .select2-container--bootstrap-5.select2-container--open .select2-selection {
  box-shadow: 0 1px 3px #0003;
}
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus {
  border-color: #000;
}

.text-danger input {
  color: var(--bs-danger-rgb);
}

.sidebar-title {
  letter-spacing: 1px;
}

.nav-tabs .nav-link {
  color: var(--bs-primary);
}

.nav-pills .nav-link {
  padding: 6px 20px;
  font-size: 1.1rem;
  letter-spacing: 0.03em;
}

.nav-pills .nav-link img {
  display: inline-block;
  max-width: 0.8em;
  margin-top: -3px;
  margin-right: 4px;
}

.nav-group-title {
  padding: 8px 20px;
  color: #777;
  text-transform: uppercase;
}

.nav-pills .nav-link:hover {
  color: var(--bs-primary) !important;
}

.nav-pills .nav-link.active,
.nav-pills .nav-link.active:hover {
  background: var(--bs-primary);
  -webkit-background-clip: border-box;
  -webkit-text-fill-color: #fff;
}

.pagination {
  --bs-pagination-color: var(--bs-primary);
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(24, 124, 58, 0.25);
  --bs-pagination-active-bg: var(--bs-primary);
}

.page-link {
  color: var(--bs-pagination-color);
}
.page-link:hover,
.page-link:focus {
  color: var(--bs-primary);
}

.page-item.active .page-link:hover,
.page-item.active .page-link:focus {
  color: #FFF;
}

@media (min-width: 992px) {
  .content-wrapper {
    margin-left: 270px;
  }

  .offcanvas-wrapper {
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 270px;
  }
}

.container-narrow {
  margin-left: auto;
  margin-right: auto;
  max-width: 1050px;
}

.app_calendar_show .container-narrow {
  max-width: 1600px;
}

.app_calendar_show .modal {
  pointer-events: none;
}

.required:before {
  content: "* ";
  color:red;
}

.form-check-label.required:before {
  content: '';
}

.neutral {
  background-color: white;
  border-style: solid;
  border-color: white;
  border-width: 3px 5px 3px 5px;
}

.workday-type-area {
  color: var(--workday-area);
}
.workday-type-office {
  color: var(--workday-office);
}
.workday-type-mixed {
  color: var(--workday-mixed);
}
.workday-type-free {
  color: var(--workday-free);
}
.workday-type-special {
  color: var(--workday-special);
}

.holiday-type-state-holiday {
  border-style: solid;
  border-color: red;
  border-width: 0 0 2px 0;
  text-align: center;
}

.holiday-type-shopping-sunday {
  border-style: solid;
  border-color: green;
  border-width: 0 0 2px 0;
}

.holiday-type-sunday {
  border-style: solid;
  border-color: orange;
  border-bottom-width: 2px;
}

.holiday-type-limited-hours {
  border-style: solid;
  border-color: yellow;
  border-width: 0 0 2px 0;
}

.holiday-type-saturday {
  border-style: solid;
  border-color: blue;
  border-width: 0 0 2px 0;
}

.error {
  color: darkred;
} 

.change-workday-type {
  float:right;
  width:150px;
}

/* To be implemented after receiving graphic designs */
.notification-new {
}
.notification-read {
}

.notification-framed {
  border-style: solid;
  border-color: rgb(188, 188, 188);
  border-width: 1px 1px 3px 1px;
  margin-bottom:3px;
 }

/* To be implemented after receiving graphic designs */
.visit-type-standard {
}
.visit-type-service {
}

.notifications {
  z-index: 1000;
  position: absolute;
  top: 101%;
  left: 50%;
  transform: translateX(-100px);
  width: 200px;
  background-color: #fff;
}

.important-notification {
  background-color: #9ff8b1 !important;
}

.hidden {
  display: none;
}

.user-dropdown {
  border-radius: 0;
  left: auto !important;
  right: 0 !important;
}

@media (min-width: 900px) {
  .user-dropdown {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
  }
}

.soh-list, .soh-list__item {
  margin:0;
  padding: 0;
  text-indent: 0;
  list-style-type: none;
}

.soh-list__item .soh-list__item-inner {
  display: block;
  padding: 10px 0;
  color: inherit;
  text-decoration: none;
  border-top: 3px solid #fff;
}

.soh-list__link,
.soh-list__link:hover {
  text-decoration: none;
  color: inherit;
}

.visit-status-finished,
.visit-status-postponed {
  color: #777;
}

.visit-status-canceled,
.visit-status-not_take_place {
  color: darkred;
}

.icon-button-lg img {
  width: 2rem;
}

.alert-danger {
  background-color: transparent;
  border: 1px solid #c10c0c;
  color: var(--darkred);
}

/* Calendar */

.fc-view-container {
  overflow-x: scroll !important;
}

.fc-timeGridWeek-view.fc-view,
.fc-dayGridMonth-view.fc-view {
  min-width: 800px !important;
}


.fc-toolbar.fc-header-toolbar {
  flex-wrap: wrap !important;
}

@media (max-width: 1024px) {
  .fc-toolbar.fc-header-toolbar .fc-left {
    order: 2;
  }

  .fc-toolbar.fc-header-toolbar .fc-center {
    width: 100%;
    order: 1;
    margin-bottom: 15px;
  }

  .fc-toolbar.fc-header-toolbar .fc-right {
    order: 3;
  }
}

.fc-view-container,
.fc-timeGridDay-view .fc-today {
  background-color: var(--gray) !important;
}

.fc-today {
  background-color: #c8d7d2 !important;
}

.fc-unthemed .fc-divider {
  background-color: #fff !important;
  border: none !important;
  opacity: 1 !important;
  height: 2px !important;
}

.fc-timeGridDay-view td:first-of-type,
.fc-timeGridWeek-view td:first-of-type,
.fc-timeGridDay-view th:first-of-type,
.fc-timeGridWeek-view th:first-of-type
{
  width: 30px !important;
  text-align: center !important;
}

.fc-dayGridMonth-view .fc-day-top .fc-day-number {
  display: block;
  width: 100%;
  padding: 8px 2px;
  text-align: center;
}

.fc-event {
  cursor: pointer;
}

.fc-event.day-past {
  opacity: 0.45 !important;
}

.fc-timeGridDay-view .event-notification,
.fc-timeGridWeek-view .event-notification,
.fc-timeGridDay-view .event-visit,
.fc-timeGridWeek-view .event-visit,
.fc-timeGridDay-view .event-activity,
.fc-timeGridWeek-view .event-activity,
.fc-timeGridWeek-view .event-free-time,
.fc-timeGridDay-view .event-free-time {
  text-align: left !important;
  padding: 4px !important;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  color: #fff !important;
  border-color: transparent !important;
}

.fc-timeGridDay-view .event-notification,
.fc-timeGridWeek-view .event-notification {
  background-color: var(--notification) !important;
}

.fc-timeGridDay-view .event-notification.read,
.fc-timeGridWeek-view .event-notification.read {
  background-color: var(--notification-inactive) !important;
}

.fc-timeGridDay-view .event-visit.standard,
.fc-timeGridWeek-view .event-visit.standard{
  background-color: var(--visit-standard) !important;
}

.fc-timeGridDay-view .event-visit.standard.visit-inactive,
.fc-timeGridWeek-view .event-visit.standard.visit-inactive {
  background-color: var(--visit-standard-inactive) !important;
}

.fc-timeGridDay-view .event-visit.service,
.fc-timeGridWeek-view .event-visit.service {
  background-color: var(--visit-service) !important;
}

.fc-timeGridDay-view .event-visit.service.visit-inactive,
.fc-timeGridWeek-view .event-visit.service.visit-inactive {
  background-color: var(--visit-service-inactive) !important;
}

.fc-timeGridDay-view .event-activity.office,
.fc-timeGridWeek-view .event-activity.office {
  background-color: var(--workday-office) !important;
}

.fc-timeGridDay-view .event-activity.special,
.fc-timeGridWeek-view .event-activity.special {
  background-color: var(--workday-special) !important;
}

.fc-timeGridDay-view .event-free-time,
.fc-timeGridWeek-view .event-free-time {
  background-color: var(--workday-free) !important;
}

.fc-dayGridMonth-view .event-notification,
.fc-dayGridMonth-view .event-visit,
.fc-dayGridMonth-view .event-activity,
.fc-dayGridMonth-view .event-free-time {
  border-color: transparent !important;
  background-color: transparent !important;
  color: #000 !important;
  padding-left: 7px;
  position: relative;
}

.fc-dayGridMonth-view .event-notification:before,
.fc-dayGridMonth-view .event-visit:before,
.fc-dayGridMonth-view .event-activity:before,
.fc-dayGridMonth-view .event-free-time:before {
  content: '';
  position: absolute;
  top: 6px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
}

.fc-dayGridMonth-view .event-visit.standard:before {
  background-color: var(--visit-standard);
}

.fc-dayGridMonth-view .event-visit.service:before {
  background-color: var(--visit-service);
}

.fc-dayGridMonth-view .event-notification::before {
  background-color: var(--notification);
}

.fc-dayGridMonth-view .event-activity.office:before {
  background-color: var(--workday-office);
}

.fc-dayGridMonth-view .event-activity.special:before {
  background-color: var(--workday-special);
}

.fc-dayGridMonth-view .event-free-time:before {
  background-color: var(--workday-free);
}

.fc-dayGridMonth-view .event-notification.read,
.fc-dayGridMonth-view .event-visit.visit-inactive {
  color: var(--darkgray) !important;
}

.fc-dayGridMonth-view .event-notification.read:before,
.fc-dayGridMonth-view .event-visit.visit-inactive:before {
  background-color: var(--darkgray) !important;
}

.event-visit .fc-content {
  white-space: normal !important;
}

.fc-unthemed th {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

fc-unthemed .fc-list-view, .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th {
  border-color: #fff !important;
  border-style: solid !important;
}

.calendar-holder .fc-time-grid .fc-slats td {
  height: 2.5em;
}

.calendar-loader {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  align-items: center;
  justify-content: center;
  background-color: #0008;
}

.calendar-loader .spinner-border {
  width: 50px;
  height: 50px;
  border-width: 5px;
}

/* Accordion */

.accordion-button:not(.collapsed) {
  color: var(--bs-primary);
  background-color: var(--bs-primary-light);
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Animations */

.we-soh_fade-in-bottom {
  -webkit-animation: we-soh_fade-in-bottom 0.4s ease-out 0.2s both;
  animation: we-soh_fade-in-bottom 0.4s ease-out 0.2s both;
}

@keyframes we-soh_fade-in-bottom {
  0% {
    -webkit-transform: translateY(10%);
    transform: translateY(10%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

.workday-legend {
  display: flex;
  flex-wrap: wrap;
}

.workday-legend__item {
  display: flex;
  align-items: center;
  margin-right: 16px;
}

.workday-legend__item span {
  margin-top: 2px;
}

.workday-legend__box {
  width: 14px;
  height: 14px;
  border-radius: 3px;
}
.workday-legend__box.area {
  background-color: var(--workday-area);
}

.workday-legend__box.office {
  background-color: var(--workday-office);
}

.workday-legend__box.special {
  background-color: var(--workday-special);
}

/* Datetime input */

.flatpickr-time.time24hr {
  margin-top: 5px;
  background-color: var(--bs-primary);
}

.flatpickr-time.time24hr .numInputWrapper .numInput {
  background-color: var(--bs-primary);
  color: #FFF;
}

.flatpickr-time.time24hr .flatpickr-time-separator {
  color: #FFF;
}

.flatpickr-time.time24hr .numInputWrapper .numInput,
.flatpickr-time.time24hr .flatpickr-time-separator {
  font-size: 1.2em;
  font-weight: normal;
}

.flatpickr-calendar .flatpickr-day.selected {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.flatpickr-calendar .flatpickr-time.time24hr .numInputWrapper span {
  width: 20px;
  opacity: 1;
}

.flatpickr-calendar .flatpickr-time.time24hr .numInputWrapper span.arrowUp::after,
.flatpickr-calendar .flatpickr-time.time24hr .numInputWrapper span.arrowDown::after {
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}

.flatpickr-calendar .flatpickr-time.time24hr .numInputWrapper span.arrowUp::after {
  border-bottom: 6px solid #FFF;
}

.flatpickr-calendar .flatpickr-time.time24hr .numInputWrapper span.arrowDown::after {
  border-top: 6px solid #FFF;
}

/* Dashboard */
.dashboard-nav {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 10px;
}

.dashboard-nav .dashboard-nav__item {
  display: block;
  padding: 20px 5px;
  text-align: center;
  text-decoration: none;
  color: var(--bs-primary);
  background-color: #FFF;
  box-shadow: 0 0.5rem 0.6rem rgba(0, 0, 0, 0.1);
  transition: background-color 0.2s ease;
}

.dashboard-nav .dashboard-nav__item:hover {
  background-color: var(--bs-primary-light);
}

.dashboard-nav .dashboard-nav__item img {
  width: 1.4rem;
}

.dashboard-nav .dashboard-nav__item img.institution-icon {
  width: 1.3rem;
}

.dashboard-nav .dashboard-nav__item span {
  display: block;
  margin-top: 0.6rem;
  text-align: center;
}

@media (min-width: 360px) {
  .dashboard-nav {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .dashboard-nav {
    grid-template-columns: repeat(4, 1fr);
  }
}

.week-time-chart-inner {
  margin-top: 30px;
  margin-bottom: -40px;
}

.week-time-chart {
  width: 250px;
}

.week-time-chart canvas {
  margin-top: -70px;
}

@media (min-width: 768px) {
  .week-time-chart-wrapper {
    padding-bottom: 85px;
    margin-bottom: 85px;
  }

  .week-time-chart-inner {
    position: absolute;
    top: -20px;
    margin-top: 0;
    margin-bottom: 0;
  }
}

/* Reports */

.report-special-day {
  background-color: #ffefef !important;
}

.report-week-sum {
  background-color: #effff9 !important;
}

.report-region-sum,
.report-total {
  border-top: thick double;
}

/* Work day activities */

.activity-type-special {
  color: var(--workday-special);
}

.activity-type-office {
  color: var(--workday-office);
}

/* Institutions table */

@media screen and (max-width: 1200px) {
  table.institutions-table {
    border: 0;
  }

  table.institutions-table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  table.institutions-table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: 0.6em;
  }

  table.institutions-table td {
    border-bottom: 1px solid #ddd;
    display: block;
    text-align: right;
  }

  table.institutions-table td::before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
  }

  table.institutions-table td:last-child:before {
    display: none;
  }

  table.institutions-table td:first-child {
    margin-top: 20px;
  }

  table.institutions-table td:last-child {
    border-bottom: 0;
    padding-top: 20px;
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 500px) {
  table.institutions-table td {
    font-size: 0.9em;
  }
}

/* Visit form  */
@media (min-width: 768px) {
  #institution_info_offcanvas_button {
    margin-top: 2em;
  }
}

/* Password meter */
.password-req-list {
  box-shadow: 0 0 2px #0005;
}

.password-req-item {
  font-size: 14px;
  color: #6F6F6F;
}

.password-req-item:before {
  content: '\2715';
  font-size: 0.8em;
  margin-right: 6px;
}

.password-req-item.valid {
  color: var(--bs-success);
}

.password-req-item.valid:before {
  content: '\2713';
}

.password-strength {
  display: none;
}

.password-strength-label {
  color: #6F6F6F;
}

.password-strength-bar-wrapper {
  position: relative;
  height: 8px;
  border: 1px solid #AAA;
  margin: 4px 0;
}

.password-strength-bar {
  height: 100%;
}

div {
  word-wrap: break-word;
  overflow-wrap: break-word;

-webkit-hyphens: auto;
   -moz-hyphens: auto;
        hyphens: auto;
}