/*
 * SPDX-FileCopyrightText: 2024 Nicco Kunzmann and Open Web Calendar Contributors <https://open-web-calendar.quelltext.eu/>
 *
 * SPDX-License-Identifier: GPL-2.0-only
 */


:root {
    --owc-menu-background-color: var(--dhx-scheduler-container-background);
    --owc-menu-box-shadow-color : var(--dhx-scheduler-base-colors-secondary);
    --owc-menu-item-text-color: var(--dhx-scheduler-base-colors-text-base);
    --owc-menu-item-backgroud-color: var(--dhx-scheduler-event-background);
}

/* Styling of the dhtmlx.html file.
 *
 */

.status-window {
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: 60;
}

.status-window .item {
    min-width: 1em;
    min-height: 1em;
    padding: 0.2em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

#infoIcon {
    background-color: rgba(0,0,0,0.1);
}

#errorStatusIcon {
    display: none;
    background-color: #ff7777;
}

#errorStatusIcon.onError {
    display: inline-block;
    z-index: 150;
}

#errorWindow {
    background-color: rgba(255, 208, 208, 0.9);
    z-index: 50;
    overflow-y: auto;
    height: 100%;
    position: absolute;
}

.fullsize {
    top: 0px;
    left: 0px;
    width: 100%;
    min-height: 100%;
}

#errorWindow .closeButton {
    position: absolute;
    top: 0px;
    right: 0px;
    min-width: 1em;
    min-height: 1em;
    padding: 0.2em;
    text-align: center;
    background-color: #ff7777;
    color: black;
    border-bottom-left-radius: 0.2em;
    z-index: 100;
}

#errorWindow iframe {
    width: 100%;
    border-width: 0px;
}

#errorWindow .item {
    border-color: #ff7777;
    border-style: solid;
    border-bottom-width: 0.2em;
    text-decoration: none;
}

.hidden, #scheduler_here .error {
    display: none;
}

#errorWindow .errorFrame {
    /* The iframe in case of an error. */
    height: 40em;
}

#loader {
    height: 100px;
    z-index: 40;
    position: absolute;
}

.dhx_cal_qi_controls {
  /* hide the delete and details button */
  /*display: none*/
  flex-direction: column;
  align-items: start;
  padding-top: 0em;
  gap: 0em;
}

.dhx_qi_big_icon {
    /* justify-content: start; */
    white-space: nowrap;
    margin-left: -10px !important;
    padding: 0em;
}

div.dhx_agenda_line > span {
    /* fixes vanishing of calendar entries in agenda view at narrow mobile viewport sizes */
	display: block ruby !important;
	text-overflow: ellipsis;
	overflow: hidden;
}

@media only screen and (max-width: 480px) {
    .event {
        height: 4.17vw;
        font-size: 2.92vw;
    }

    .dhx_month_head {
        height: 6.5vw;
        font-size: 2.5vw;
        line-height: 3.75vw;
    }
}

/* The possible link in the title. */
.dhx_cal_qi_tcontent a {
  color: inherit;
}

/* Scheduler added a resize bar at the bottom. We do not allow edits so we remove it. */

.dhx_event_resize.dhx_footer {
    display: none;
}

.dhx_menu_icon {
    /* see https://www.w3schools.com/cssref/css3_pr_background-size.php */
    /* background-image: url('/img/icons/event-subscribe.svg');  
    background-repeat: no-repeat;
    background-size: 100%; */
    /* see https://codepen.io/noahblon/post/coloring-svgs-in-css-background-images */
    /*mask: url('/img/icons/subscribe.svg');*/
    /* see https://css-tricks.com/change-color-of-svg-on-hover/ */
    background-color: var(--dhx-scheduler-base-colors-icons);
}

:root[data-scheduler-theme="material"] .dhx_cal_scale_placeholder {
    /* Remove the box shadow because it does not always work
       See https://github.com/niccokunzmann/open-web-calendar/issues/449
       We might be able to remove this once this is fixed:
       https://github.com/DHTMLX/scheduler/issues/75
    */
    box-shadow: none;
}


.participants {
    overflow-y: auto;
    --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-base-colors-primary);
}
/* Styling of all participants */
/* .PARTICIPANT {} */

.participants .icon {
    mask: url('/img/icons/type/unknown.svg');
}

/* RFC CUTYPE */
.PARTICIPANT-INDIVIDUAL .icon.type {
    mask: url('/img/icons/type/individual.svg');
}
.PARTICIPANT-GROUP .icon.type {
    mask: url('/img/icons/type/group.svg');
}
.PARTICIPANT-RESOURCE .icon.type {
    mask: url('/img/icons/type/resource.svg');
}
.PARTICIPANT-ROOM .icon.type {
    mask: url('/img/icons/type/room.svg');
}
.PARTICIPANT-UNKNOWN .icon.type {
    mask: url('/img/icons/type/unknown.svg');
}

/* RFC 5545 ROLE */
.PARTICIPANT-CHAIR .icon.role {
    mask: url('/img/icons/role/chair.svg');
}
.PARTICIPANT-REQ-PARTICIPANT .icon.role {
    mask: url('/img/icons/role/req-participant.svg');
}
.PARTICIPANT-OPT-PARTICIPANT .icon.role {
    mask: url('/img/icons/role/opt-participant.svg');
}
.PARTICIPANT-NON-PARTICIPANT .icon.role {
    mask: url('/img/icons/role/non-participant.svg');
}
/* special organizer role */
.PARTICIPANT-ORGANIZER .icon.role {
    mask: url('/img/icons/role/organizer.svg');
}

/* RFC 5545 STATUS */
.PARTICIPANT-ACCEPTED .icon.status {
    mask: url('/img/icons/status/accepted.svg');
}
.PARTICIPANT-DECLINED .icon.status {
    mask: url('/img/icons/status/declined.svg');
}
.PARTICIPANT-DELEGATED .icon.status {
    mask: url('/img/icons/status/delegated.svg');
}
.PARTICIPANT-NEEDS-ACTION .icon.status {
    mask: url('/img/icons/status/needs-action.svg');
}
/* special organizer role */
.PARTICIPANT-TENTATIVE .icon.status {
    mask: url('/img/icons/status/tentative.svg');
}


/* icons */
.participants .icon {
    display: inline-block;
    mask-size: 100% !important;
    user-select: none;
    background-color: var(--dhx-scheduler-base-colors-icons);
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    vertical-align: bottom;
}

.participants li a {
    width: 100%;
    color: var(--dhx-scheduler-base-colors-icons);
    text-decoration: none;
    
}

.participants li::marker {
    content: "";
}

.participants li {
    white-space: nowrap;
}

.participants ol {
    padding-left: 0em;
}

#email-signup {
    position: absolute;
    z-index: 30;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: rgba(255,255,255,0.7);
}

#email-signup.hidden {
    display: none;
}

.sign-up-content {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 0.3em;
    padding: 1em;
    background: var(--dhx-scheduler-base-colors-background);
    border-radius: var(--dhx-scheduler-border-radius);
    border-color: var(--dhx-scheduler-base-colors-border);
    border-style: solid;
}

.sign-up-content .item {
    max-width: 30em;
    padding: 0.1em;
}

.row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.cannot-sign-up .icon_signup {
    display: none;
}

.dhx_title .categories {
    /* deactivate the tags in the week view */
    display: none;
}

.no-controls .dhx_cal_navline {
    /* hide the navline if we have no controls */
    display: none;
}

.no-controls {
    /* hide the navline if we have no controls */
    --dhx-scheduler-toolbar-height: 0px;
}

/* START Burger Menu
 * See https://alvarotrigo.com/blog/hamburger-menu-css/ - 6. Snappy Sliding Hamburger Menu
 */

.menu__toggle {
  opacity: 0;
}
.menu__toggle:checked + .menu__btn > span {
  transform: rotate(45deg);
}
.menu__toggle:checked + .menu__btn > span::before {
  top: 0;
  transform: rotate(0deg);
}
.menu__toggle:checked + .menu__btn > span::after {
  top: 0;
  transform: rotate(90deg);
}
.menu__toggle:checked ~ .menu__box {
  left: 0 !important;
  display: block !important;
}
.menu__btn {
  position: fixed;
  top: 20px;
  left: 20px;
  width: 26px;
  height: 26px;
  cursor: pointer;
  z-index: 2;
}
.menu__btn > span,
.menu__btn > span::before,
.menu__btn > span::after {
  display: block;
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: var(--dhx-scheduler-btn-color-hover);
  transition-duration: 0.25s;
}
.menu__btn > span::before {
  content: "";
  top: -8px;
}
.menu__btn > span::after {
  content: "";
  top: 8px;
}
.menu__box {
  display: none;
  position: fixed;
  top: 0;
  left: -100%;
  width: 300px;
  max-width: 90%;
  height: 100%;
  margin: 0;
  padding: var(--dhx-scheduler-toolbar-height) 1em;
  list-style: none;
  background-color: var(--owc-menu-background-color);
  box-shadow: 2px 2px 6px var(--owc-menu-box-shadow-color);
  transition-duration: 0.25s;
  /* further customization */
  z-index: 2;
  cursor: default;
}
.menu__item {
  display: block;
  padding: 12px 24px;
  color: var(--owc-menu-item-text-color);
  background-color: var(--owc-menu-item-backgroud-color);
  /* font-size: 20px;
  font-weight: 600; */
  text-decoration: none;
  transition-duration: 0.25s;
}
/* .menu__item:hover {
  background-color: #cfd8dc;
} */

/* adjust for DTHMLX Scheduler */

.owc_nav_burger_menu {
    z-index: 2;
    min-width: 0px !important;
    border-width: 0px;
    text-transform: none;
    visibility: hidden;
}

.owc_nav_burger_menu .calendar-description {
    font-weight: normal;
}

.burger-menu-label {
    visibility: visible;
}

/* END Burger Menu */