UNPKG

dhtmlx-scheduler

Version:

JavaScript event calendar. Allows to manage events and appointments in different views

997 lines 133 kB
@charset "UTF-8"; @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuOKfMZg.ttf) format('truetype'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuLyfMZg.ttf) format('truetype'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuI6fMZg.ttf) format('truetype'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuGKYMZg.ttf) format('truetype'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/inter/v18/UcCO3FwrK3iLTeHuS_nVMrMxCp50SjIw2boKoduKmMEVuFuYMZg.ttf) format('truetype'); } /* default terrace theme is here */ :root { --dhx-scheduler-theme: terrace; --dhx-scheduler-font-family: Inter, Helvetica, Arial, sans-serif; --dhx-scheduler-font-size: 14px; --dhx-scheduler-heading-font-size: calc(var(--dhx-scheduler-font-size) + 2px); --dhx-scheduler-heading-font-weight: 600; --dhx-scheduler-important-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-important-line-height: 142%; --dhx-scheduler-important-font-weight: 500; --dhx-scheduler-regular-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-regular-font-weight: 400; --dhx-scheduler-regular-line-height: 142%; --dhx-scheduler-caption-font-size: calc(var(--dhx-scheduler-font-size) - 2px); --dhx-scheduler-caption-font-weight: 400; --dhx-scheduler-caption-line-height: 132%; --dhx-scheduler-base-colors-primary: #537CFA; --dhx-scheduler-base-colors-primary-hover: #4269E0; --dhx-scheduler-base-colors-primary-active: #3365fb; --dhx-scheduler-base-colors-primary-lighter: #537cfa33; --dhx-scheduler-base-colors-warning: #FAB936; --dhx-scheduler-base-colors-error: #E3334E; --dhx-scheduler-base-colors-error-hover: #D3233E; --dhx-scheduler-base-colors-error-active: #C3132E; --dhx-scheduler-base-colors-error-lighter: #E3334E33; --dhx-scheduler-base-colors-error-text: #FFFFFF; --dhx-scheduler-base-colors-success: #1BC297; --dhx-scheduler-base-colors-secondary: rgba(0, 0, 0, 0.04); --dhx-scheduler-base-colors-secondary-hover: rgba(0, 0, 0, 0.1); --dhx-scheduler-base-colors-white: #FFFFFF; --dhx-scheduler-base-colors-select: #EFF3FF; --dhx-scheduler-base-colors-hover-color: #e0e0e0; --dhx-scheduler-base-colors-border: #D0DBE3; --dhx-scheduler-base-colors-icons: #A1A4A6; --dhx-scheduler-base-colors-icons-active: #8b8e90; --dhx-scheduler-base-colors-icons-hover: #76787a; --dhx-scheduler-base-colors-disabled: #E9E9E9; --dhx-scheduler-base-colors-readonly: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-base-colors-text-light: #44494E; --dhx-scheduler-base-colors-text-base: #23272A; --dhx-scheduler-base-colors-background: #FFFFFF; --dhx-scheduler-container-background: var(--dhx-scheduler-base-colors-background); --dhx-scheduler-container-color: var(--dhx-scheduler-base-colors-text-base); --dhx-scheduler-container-background-alt: rgba(0, 0, 0, 0.4); --dhx-scheduler-base-transition: 0.2s ease; --dhx-scheduler-box-shadow-s: 0px 4px 24px 0px rgba(44, 47, 60, 0.08); --dhx-scheduler-box-shadow-m: 0px 4px 24px 0px rgba(44, 47, 60, 0.36); --dhx-scheduler-box-shadow-l: 0px 4px 24px 0px rgba(44, 47, 60, 0.56); --dhx-scheduler-base-module: 4px; --dhx-scheduler-base-padding: 4px; --dhx-scheduler-border-radius: var(--dhx-scheduler-base-module); --dhx-scheduler-event-colors-primary: #537CFA; --dhx-scheduler-event-text-primary: rgba(255, 255, 255, 0.9); --dhx-scheduler-toolbar-height: 40px; --dhx-scheduler-transition: all 0.3s; --dhx-scheduler-navline-font-color: var(--dhx-scheduler-base-colors-text-light); --dhx-scheduler-default-border: 1px solid var(--dhx-scheduler-base-colors-border); --dhx-scheduler-header-border: var(--dhx-scheduler-default-border); --dhx-scheduler-halfhour-border: 1px dotted var(--dhx-scheduler-base-colors-border); /* events */ --dhx-scheduler-event-background-primary: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-event-blue: linear-gradient(180deg, #527CFF 0%, #9751FC 100%); --dhx-scheduler-event-green: linear-gradient(180deg, #12D979 0%, #1ECDEB 100%); --dhx-scheduler-event-violet: linear-gradient(180deg, #D071EF 0%, #EE71D5 100%); --dhx-scheduler-event-yellow: linear-gradient(180deg, #FFB725 0%, #FFBB25 31.25%, #FAEA27 100%); --dhx-scheduler-event-title-font-size: var(--dhx-scheduler-caption-font-size); --dhx-scheduler-event-title-line-height: var(--dhx-scheduler-caption-line-height); --dhx-scheduler-event-text-font-size: var(--dhx-scheduler-regular-font-size); --dhx-scheduler-event-text-line-height: var(--dhx-scheduler-regular-line-height); --dhx-scheduler-event-text-font-weight: var(--dhx-scheduler-regular-font-weight); --dhx-scheduler-event-bar-font-size: var(--dhx-scheduler-caption-font-size); --dhx-scheduler-event-bar-line-height: var(--dhx-scheduler-caption-line-height); --dhx-scheduler-event-menu-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-event-menu-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-event-background: var(--dhx-scheduler-event-blue); --dhx-scheduler-event-border: none; --dhx-scheduler-event-color: var(--dhx-scheduler-event-text-primary); --dhx-scheduler-event-line-text: var(--dhx-scheduler-container-color); --dhx-scheduler-event-marker-color: var(--dhx-scheduler-event-background); --dhx-scheduler-popup-background: var(--dhx-scheduler-container-background); --dhx-scheduler-popup-color: var(--dhx-scheduler-container-color); --dhx-scheduler-popup-border: none; --dhx-scheduler-popup-border-radius: var(--dhx-scheduler-border-radius); /* form */ --dhx-scheduler-control-height: 32px; --dhx-scheduler-checkbox-height: 20px; --dhx-scheduler-lightbox_font-family: var(--dhx-scheduler-font-family); --dhx-scheduler-lightbox-font-size: var(--dhx-scheduler-important-font-size); --dhx-scheduler-lightbox-font-weight: var(--dhx-scheduler-important-font-weight); --dhx-scheduler-lightbox-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-lightbox-border: var(--dhx-scheduler-popup-border); --dhx-scheduler-lightbox-control-border: var(--dhx-scheduler-default-border); --dhx-scheduler-lightbox-color: var(--dhx-scheduler-popup-color); --dhx-scheduler-lightbox-title-background: var(--dhx-scheduler-base-colors-select); --dhx-scheduler-lightbox-title-color: var(--dhx-scheduler-lightbox-color); --dhx-scheduler-lightbox-title-font-size: var(--dhx-scheduler-heading-font-size); --dhx-scheduler-lightbox-max-width: 496px; --dhx-scheduler-lightbox-wide-max-width: 738px; --dhx-scheduler-lightbox-width: var(--dhx-scheduler-lightbox-max-width); /* week */ --dhx-scheduler-scale-color: var(--dhx-scheduler-container-color); --dhx-scheduler-timescale-background: var(--dhx-scheduler-container-background); --dhx-scheduler-timescale-today-background: var(--dhx-scheduler-base-colors-select); --dhx-scheduler-hours-font-size: var(--dhx-scheduler-caption-font-size); --dhx-scheduler-hours-font-weight: var(--dhx-scheduler-caption-font-weight); /* month */ --dhx-scheduler-inactive-month-color: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-month-header-color: var(--dhx-scheduler-container-color); --dhx-scheduler-month-day-header-padding: var(--dhx-scheduler-base-padding) calc(var(--dhx-scheduler-base-padding) * 2); --dhx-scheduler-month-event-marker-size: calc(var(--dhx-scheduler-base-module) * 2); /* year */ /* agenda */ --dhx-scheduler-list-line-height: 36px; --dhx-scheduler-agenda-date-column-width: 188px; /* grid */ --dhx-scheduler-grid-event-background: transparent; --dhx-scheduler-grid-event-text: initial; /* timeline */ --dhx-scheduler-timeline-folder-background: var(--dhx-scheduler-base-colors-disabled); --dhx-scheduler-timeline-folder-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-treetimeline-level-padding: 16px; /* markers */ --dhx-scheduler-blocked-time-background: var(--dhx-scheduler-base-colors-disabled); --dhx-scheduler-today-marker-color: var(--dhx-scheduler-base-colors-error); /* datepicker */ --dhx-scheduler-datepicker-width: 250px; --dhx-scheduler-datepicker-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-datepicker-family: var(--dhx-scheduler-font-family); --dhx-scheduler-datepicker-cell-size: 28px; --dhx-scheduler-datepicker-header-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-datepicker-header-font-weight: 500; --dhx-scheduler-datepicker-padding: 5px; --dhx-scheduler-datepicker-inactive-month-color: var(--dhx-scheduler-inactive-month-color); --dhx-scheduler-datepicker-cell-color: var(--dhx-scheduler-popup-color); --dhx-scheduler-datepicker-cell-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-datepicker-today-color: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-datepicker-today-background: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-datepicker-weekend-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-datepicker-weekend-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-datepicker-disabled-color: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-datepicker-disabled-background: var(--dhx-scheduler-base-colors-disabled); --dhx-scheduler-datepicker-hover-color: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-datepicker-hover-background: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-datepicker-prevnext-color: var(--dhx-scheduler-inactive-month-color); --dhx-scheduler-datepicker-prevnext-background: var(--dhx-scheduler-popup-background); /* buttons */ --dhx-scheduler-btn-background: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-background-disabled: var(--dhx-scheduler-base-colors-disabled); --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: var(--dhx-scheduler-base-colors-disabled); --dhx-scheduler-btn-outline-background: transparent; --dhx-scheduler-btn-outline-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-outline-border-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-outline-background-hover: var(--dhx-scheduler-base-colors-primary-lighter); --dhx-scheduler-btn-outline-color-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-outline-border-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-outline-background-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-outline-color-active: var(--dhx-scheduler-base-colors-white); --dhx-scheduler-btn-outline-border-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-outline-background-disabled: transparent; --dhx-scheduler-btn-outline-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-outline-border-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-text-transform: none; /* scheduler.xy values */ --dhx-scheduler-xy-scale_width: 50px; --dhx-scheduler-xy-bar_height: 24; --dhx-scheduler-xy-month_head_height: 26; --dhx-scheduler-xy-scale_height: 24px; --dhx-scheduler-xy-scroll_width: 18px; /* modals */ --dhx-scheduler-info-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-info-color: var(--dhx-scheduler-popup-color); --dhx-scheduler-info-border: var(--dhx-scheduler-popup-border); --dhx-scheduler-info-shadow: var(--dhx-scheduler-box-shadow-m); --dhx-scheduler-modal-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-modal-color: var(--dhx-scheduler-popup-color); --dhx-scheduler-modal-border: var(--dhx-scheduler-popup-border); --dhx-scheduler-modal-padding: 16px; --dhx-scheduler-modal-width: 320px; --dhx-scheduler-modal-border-radius: var(--dhx-scheduler-popup-border-radius); /* undo delete */ --dhx-scheduler-undo-delete-background: var(--dhx-scheduler-base-colors-text-base); --dhx-scheduler-undo-delete-color: var(--dhx-scheduler-event-color); } :root[data-scheduler-theme='dark'] { --dhx-scheduler-theme: dark; --dhx-scheduler-base-colors-disabled: #3d3d3d; --dhx-scheduler-base-colors-text-light: #AAA; --dhx-scheduler-base-colors-text-base: rgba(255, 255, 255, 0.9); --dhx-scheduler-base-colors-background: #000000; --dhx-scheduler-base-colors-border: #4B4B4B; --dhx-scheduler-navline-font-color: var(--dhx-scheduler-base-colors-text-base); --dhx-scheduler-base-colors-primary: #3B72F8; --dhx-scheduler-base-colors-primary-hover: #1D5AEE; --dhx-scheduler-base-colors-primary-active: #0e50ea; --dhx-scheduler-base-colors-primary-lighter: #3B72F833; --dhx-scheduler-base-colors-error: #EB284F; --dhx-scheduler-base-colors-error-hover: #D9264A; --dhx-scheduler-base-colors-error-active: #ba0a24; --dhx-scheduler-base-colors-error-lighter: #EB284F33; --dhx-scheduler-base-colors-select: #2A2A2A; --dhx-scheduler-base-colors-hover-color: #2A2A2A; --dhx-scheduler-base-colors-icons: #AAAAAA; --dhx-scheduler-scale-color: var(--dhx-scheduler-base-colors-text-light); --dhx-scheduler-popup-background: #1B1B1C; --dhx-scheduler-popup-border: 1px solid #4B4B4B; --dhx-scheduler-btn-font-weight: 600; --dhx-scheduler-undo-delete-background: var(--dhx-scheduler-popup-background); } :root[data-scheduler-theme='flat'] { --dhx-scheduler-theme: flat; --dhx-scheduler-font-family: Segoe UI,Arial,san-serif; --dhx-scheduler-base-colors-primary: #0288D1; --dhx-scheduler-base-colors-primary-hover: #007cbf; --dhx-scheduler-base-colors-primary-active: #00659b; --dhx-scheduler-base-colors-primary-lighter: #edf8ff; --dhx-scheduler-event-background: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-base-colors-border: #cecece; --dhx-scheduler-halfhour-border: 1px solid #e8e8e8; --dhx-scheduler-event-title-font-size: 12px; --dhx-scheduler-event-text-font-size: 14px; --dhx-scheduler-event-text-font-weight: 500; --dhx-scheduler-heading-font-size: 22px; --dhx-scheduler-heading-font-weight: 300; --dhx-scheduler-caption-font-size: 14px; --dhx-scheduler-caption-font-weight: 400; --dhx-scheduler-hours-font-size: 12px; --dhx-scheduler-scale-color: #767676; --dhx-scheduler-border-radius: 0; --dhx-scheduler-timeline-folder-background: #ebeced; --dhx-scheduler-box-shadow-s: 0 3px 5px 0 rgba(0, 0, 0, 0.1); --dhx-scheduler-box-shadow-m: 0px 4px 24px 0px rgba(44, 47, 60, 0.36); --dhx-scheduler-box-shadow-l: 0px 4px 24px 0px rgba(44, 47, 60, 0.56); --dhx-scheduler-config-form_wide: 1; --dhx-scheduler-xy-scale_height: 35px; } :root[data-scheduler-theme='flat'] .dhx_cal_navline { --dhx-scheduler-btn-outline-border-color: transparent; --dhx-scheduler-btn-outline-border-hover: transparent; --dhx-scheduler-btn-outline-border-color-disabled: transparent; } :root[data-scheduler-theme='flat'] .dhx_scale_hour { justify-content: center; } :root[data-scheduler-theme='flat'] .dhx_cal_tab { min-width: 90px; } :root[data-scheduler-theme='flat'] .dhx_cal_navline > div { order: 1; } :root[data-scheduler-theme='flat'] .dhx_cal_navline .dhx_cal_next_button { order: 6; } :root[data-scheduler-theme='flat'] .dhx_cal_navline .dhx_cal_today_button { order: 5; border-color: transparent; } :root[data-scheduler-theme='flat'] .dhx_cal_navline .dhx_cal_prev_button { order: 4; } :root[data-scheduler-theme='flat'] .dhx_cal_navline .dhx_cal_date { order: 3; } :root[data-scheduler-theme='flat'] .dhx_cal_navline .dhx_cal_date { margin-left: auto; margin-right: auto; } :root[data-scheduler-theme='flat'] .dhx_data_table.folder .dhx_matrix_cell { border-right: 0; } :root[data-scheduler-theme='flat'] .dhx_timeline_scale_header { border-right: none; } :root[data-scheduler-theme='flat'] .dhx_cal_container_rtl .dhx_timeline_scale_header { border-left: unset; } :root[data-scheduler-theme='flat'] .dhx_scale_hour { display: flex; flex-direction: row; } :root[data-scheduler-theme='flat'] .dhx_scale_hour .dhx_scale_h { font-size: 22px; line-height: 44px; font-weight: lighter; } :root[data-scheduler-theme='flat'] .dhx_scale_hour .dhx_scale_m { font-size: 11px; line-height: 35px; align-self: end; font-weight: lighter; transform: translateY(-2px); } :root[data-scheduler-theme='flat'] .scheduler_popup_title { text-transform: uppercase; } :root[data-scheduler-theme='material'] { --dhx-scheduler-theme: material; --dhx-scheduler-font-family: Roboto, Helvetica, Arial, sans-serif; --dhx-scheduler-base-colors-primary: #0288D1; --dhx-scheduler-base-colors-primary-hover: #007cbf; --dhx-scheduler-base-colors-primary-active: #00659b; --dhx-scheduler-base-colors-primary-lighter: #edf8ff; --dhx-scheduler-event-background: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-base-colors-border: #e0e0e0; --dhx-scheduler-event-title-font-size: calc(var(--dhx-scheduler-font-size) - 2px); --dhx-scheduler-event-text-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-event-text-font-weight: 500; --dhx-scheduler-heading-font-size: 20px; --dhx-scheduler-caption-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-caption-font-weight: 500; --dhx-scheduler-btn-font-weight: 500; --dhx-scheduler-heading-font-weight: 500; --dhx-scheduler-hours-font-size: calc(var(--dhx-scheduler-font-size) - 2px); --dhx-scheduler-base-colors-text-base: rgba(0, 0, 0, 0.75); --dhx-scheduler-header-border: 1px solid transparent; --dhx-scheduler-scale-color: rgba(0, 0, 0, 0.54); --dhx-scheduler-border-radius: 0; --dhx-scheduler-btn-text-transform: uppercase; --dhx-scheduler-btn-padding: 1px 20px 0; --dhx-scheduler-halfhour-border: none; --dhx-scheduler-timeline-folder-background: #ebeced; --dhx-scheduler-box-shadow-s: 0 3px 5px 0 rgba(0, 0, 0, 0.1); --dhx-scheduler-box-shadow-m: 0px 4px 24px 0px rgba(44, 47, 60, 0.36); --dhx-scheduler-box-shadow-l: 0px 4px 24px 0px rgba(44, 47, 60, 0.56); --dhx-scheduler-lightbox-title-background: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-lightbox-title-color: #FFFFFF; --dhx-scheduler-lightbox-title-font-size: var(--dhx-scheduler-font-size); --dhx-scheduler-lightbox-wide-max-width: 540px; --dhx-scheduler-config-form_wide: 1; } :root[data-scheduler-theme='material'] .dhx_scale_hour { justify-content: center; } :root[data-scheduler-theme='material'] .dhx_cal_tab { min-width: 90px; } :root[data-scheduler-theme='material'] .dhx_cal_navline > div { order: 1; } :root[data-scheduler-theme='material'] .dhx_cal_navline .dhx_cal_next_button { order: 6; } :root[data-scheduler-theme='material'] .dhx_cal_navline .dhx_cal_today_button { order: 5; border-color: transparent; } :root[data-scheduler-theme='material'] .dhx_cal_navline .dhx_cal_prev_button { order: 4; } :root[data-scheduler-theme='material'] .dhx_cal_navline .dhx_cal_date { order: 3; } :root[data-scheduler-theme='material'] .dhx_cal_navline .dhx_cal_date { margin-left: auto; margin-right: auto; } :root[data-scheduler-theme='material'] .dhx_data_table.folder .dhx_matrix_cell { border-right: 0; } :root[data-scheduler-theme='material'] .dhx_timeline_scale_header { border-right: none; } :root[data-scheduler-theme='material'] .dhx_cal_container_rtl .dhx_timeline_scale_header { border-left: unset; } :root[data-scheduler-theme='material'] .dhx_cal_scale_placeholder { position: absolute; z-index: 2; box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.1); left: 0; pointer-events: none; } :root[data-scheduler-theme='material'] .dhx_year_box .dhx_year_month { font-weight: 500; color: var(--dhx-scheduler-base-colors-primary); } :root[data-scheduler-theme='material'] .dhx_year_box .dhx_month_head.dhx_year_event::after { content: none; } :root[data-scheduler-theme='material'] .dhx_year_box .dhx_year_event { --dhx-scheduler-datepicker-cell-color: var(--dhx-scheduler-datepicker-hover-color); --dhx-scheduler-datepicker-cell-background: var(--dhx-scheduler-datepicker-hover-background); } :root[data-scheduler-theme='material'] .dhx_cal_ltitle { font-weight: 400; text-transform: uppercase; } :root[data-scheduler-theme='material'] .dhx_cal_ltitle_controls { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-lightbox-title-color); } :root[data-scheduler-theme='material'] .dhx_timeline_scale_header { font-size: var(--dhx-scheduler-caption-font-size); font-weight: var(--dhx-scheduler-caption-font-weight); color: var(--dhx-scheduler-scale-color); line-height: 133%; } :root[data-scheduler-theme='material'] .scheduler_popup_title { text-transform: uppercase; } :root[data-scheduler-theme='contrast-white'] { --dhx-scheduler-theme: contrast-white; --dhx-scheduler-base-colors-disabled: #C2C2C2; --dhx-scheduler-base-colors-text-light: #303030; --dhx-scheduler-base-colors-text-base: #303030; --dhx-scheduler-base-colors-background: #FFFFFF; --dhx-scheduler-base-colors-border: #4D595B; --dhx-scheduler-base-colors-primary: #0A47CD; --dhx-scheduler-base-colors-primary-hover: #093fb3; --dhx-scheduler-base-colors-primary-active: #08379b; --dhx-scheduler-base-colors-primary-lighter: #0A47CD; --dhx-scheduler-event-background: #0A47CD; --dhx-scheduler-event-color: #FFF; --dhx-scheduler-event-border: 1px solid rgba(0, 0, 0, 0.1); --dhx-scheduler-base-colors-warning: #FCBA2E; --dhx-scheduler-base-colors-success: #77D257; --dhx-scheduler-base-colors-error: #FFA7A0; --dhx-scheduler-base-colors-error-hover: #d88d88; --dhx-scheduler-base-colors-error-active: #cd8984; --dhx-scheduler-base-colors-error-lighter: #FFA7A0; --dhx-scheduler-base-colors-error-text: #141414; --dhx-scheduler-btn-color: #FFFFFF; --dhx-scheduler-btn-color-hover: #FFFFFF; --dhx-scheduler-btn-color-active: #FFFFFF; --dhx-scheduler-base-colors-select: #E7E5E5; --dhx-scheduler-base-colors-hover-color: #E7E5E5; --dhx-scheduler-base-colors-icons: #303030; --dhx-scheduler-scale-color: var(--dhx-scheduler-base-colors-text-light); --dhx-scheduler-popup-background: #FFF; --dhx-scheduler-popup-border: 1px solid #4D595B; --dhx-scheduler-font-size: 16px; --dhx-scheduler-heading-font-size: 24px; --dhx-scheduler-important-font-size: 16px; --dhx-scheduler-regular-font-size: 16px; --dhx-scheduler-caption-font-size: 16px; --dhx-scheduler-btn-outline-color-hover: #FFFFFF; --dhx-scheduler-btn-outline-color-active: #FFFFFF; } :root[data-scheduler-theme='contrast-black'] { --dhx-scheduler-theme: contrast-black; --dhx-scheduler-base-colors-disabled: #3d3d3d; --dhx-scheduler-base-colors-text-light: #cfcfcf; --dhx-scheduler-base-colors-text-base: #FFFFFFCC; --dhx-scheduler-base-colors-background: #141414; --dhx-scheduler-base-colors-border: rgba(255, 255, 255, 0.8); --dhx-scheduler-base-colors-primary: #A395FF; --dhx-scheduler-base-colors-primary-hover: #C5BCFF; --dhx-scheduler-base-colors-primary-active: #C5BCFF; --dhx-scheduler-base-colors-primary-lighter: #C5BCFF; --dhx-scheduler-event-background: #A395FF; --dhx-scheduler-event-color: #141414; --dhx-scheduler-event-border: 1px solid rgba(0, 0, 0, 0.1); --dhx-scheduler-base-colors-warning: #694E02; --dhx-scheduler-base-colors-success: #115700; --dhx-scheduler-base-colors-error: #FFA7A0; --dhx-scheduler-base-colors-error-hover: #fb9891; --dhx-scheduler-base-colors-error-active: #fe8b83; --dhx-scheduler-base-colors-error-lighter: #ffa6a03e; --dhx-scheduler-base-colors-error-text: #141414; --dhx-scheduler-btn-color: #141414; --dhx-scheduler-btn-color-hover: #141414; --dhx-scheduler-btn-color-active: #141414; --dhx-scheduler-base-colors-select: #2A2A2A; --dhx-scheduler-base-colors-hover-color: #2A2A2A; --dhx-scheduler-base-colors-icons: #AAAAAA; --dhx-scheduler-scale-color: var(--dhx-scheduler-base-colors-text-light); --dhx-scheduler-popup-background: #1B1B1C; --dhx-scheduler-undo-delete-background: var(--dhx-scheduler-popup-background); --dhx-scheduler-undo-delete-color: var(--dhx-scheduler-base-colors-text-base); --dhx-scheduler-popup-border: 1px solid #4B4B4B; --dhx-scheduler-font-size: 16px; --dhx-scheduler-heading-font-size: 24px; --dhx-scheduler-important-font-size: 16px; --dhx-scheduler-regular-font-size: 16px; --dhx-scheduler-caption-font-size: 16px; --dhx-scheduler-btn-outline-color-hover: #141414; --dhx-scheduler-btn-outline-color-active: #141414; } @font-face { font-family: "dhx-scheduler-icons"; /* src: url("src/dhx-scheduler-icons.woff?7d3dc8d31762f76ad3c385c23e9afbc6") format("woff"), url("src/dhx-scheduler-icons.woff2?7d3dc8d31762f76ad3c385c23e9afbc6") format("woff2"); */ src: url("data:font/woff;base64,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") format("woff"), url("data:font/woff2;base64,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") format("woff2"); } .scheduler_icon:before, .dhx_menu_icon:before { font-family: dhx-scheduler-icons !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: flex; justify-content: center; align-items: center; color: var(--dhx-scheduler-base-colors-icons); } .scheduler_icon.alert:before, .dhx_menu_icon.icon_alert:before { content: "\f101"; } .scheduler_icon.arrow_down:before, .dhx_menu_icon.icon_arrow_down:before { content: "\f102"; } .scheduler_icon.arrow_left:before, .dhx_menu_icon.icon_arrow_left:before { content: "\f103"; font-size: 24px; } .scheduler_icon.arrow_right:before, .dhx_menu_icon.icon_arrow_right:before { content: "\f104"; font-size: 24px; } .scheduler_icon.arrow_up:before, .dhx_menu_icon.icon_arrow_up:before { content: "\f105"; } .scheduler_icon.calendar:before, .dhx_menu_icon.icon_calendar:before { content: "\f106"; } .scheduler_icon.cancel:before, .dhx_menu_icon.icon_cancel:before { content: "\f107"; } .scheduler_icon.check:before, .dhx_menu_icon.icon_check:before { content: "\f108"; } .scheduler_icon.chevron_down:before, .dhx_menu_icon.icon_chevron_down:before { content: "\f109"; font-size: 24px; } .scheduler_icon.chevron_left:before, .dhx_menu_icon.icon_chevron_left:before { content: "\f10a"; font-size: 24px; } .scheduler_icon.chevron_right:before, .dhx_menu_icon.icon_chevron_right:before { content: "\f10b"; font-size: 24px; } .scheduler_icon.chevron_up:before, .dhx_menu_icon.icon_chevron_up:before { content: "\f10c"; font-size: 24px; } .scheduler_icon.clock:before, .dhx_menu_icon.icon_clock:before { content: "\f10d"; } .scheduler_icon.close:before, .dhx_menu_icon.icon_close:before { content: "\f10e"; } .scheduler_icon.delete:before, .dhx_menu_icon.icon_delete:before { content: "\f10f"; font-size: 18px; } .scheduler_icon.details:before, .dhx_menu_icon.icon_details:before { content: "\f110"; } .scheduler_icon.dots_h:before, .dhx_menu_icon.icon_dots_h:before { content: "\f111"; } .scheduler_icon.dots_v:before, .dhx_menu_icon.icon_dots_v:before { content: "\f112"; } .scheduler_icon.drag_horizontal:before, .dhx_menu_icon.icon_drag_horizontal:before { content: "\f113"; } .scheduler_icon.drag_vertical:before, .dhx_menu_icon.icon_drag_vertical:before { content: "\f114"; } .scheduler_icon.drag:before, .dhx_menu_icon.icon_drag:before { content: "\f115"; } .scheduler_icon.edit:before, .dhx_menu_icon.icon_edit:before { content: "\f116"; } .scheduler_icon.form:before, .dhx_menu_icon.icon_form:before { content: "\f117"; } .scheduler_icon.iclose:before, .dhx_menu_icon.icon_iclose:before { content: "\f118"; } .scheduler_icon.loading:before, .dhx_menu_icon.icon_loading:before { content: "\f119"; } .scheduler_icon.menu:before, .dhx_menu_icon.icon_menu:before { content: "\f11a"; } .scheduler_icon.menu_down:before, .dhx_menu_icon.icon_menu_down:before { content: "\f11b"; } .scheduler_icon.menu_right:before, .dhx_menu_icon.icon_menu_right:before { content: "\f11c"; } .scheduler_icon.ok:before, .dhx_menu_icon.icon_ok:before { content: "\f11d"; } .scheduler_icon.plus:before, .dhx_menu_icon.icon_plus:before { content: "\f11e"; } .scheduler_icon.save:before, .dhx_menu_icon.icon_save:before { content: "\f11f"; } .scheduler_icon.sort_asc:before, .dhx_menu_icon.icon_sort_asc:before { content: "\f120"; } .scheduler_icon.sort_desc:before, .dhx_menu_icon.icon_sort_desc:before { content: "\f121"; } .button { background: var(--dhx-scheduler-btn-background); color: var(--dhx-scheduler-btn-color); border: 1px solid var(--dhx-scheduler-btn-border-color); border-radius: var(--dhx-scheduler-border-radius); height: var(--dhx-scheduler-control-height); padding: var(--dhx-scheduler-btn-padding, 0 20px); display: flex; justify-content: center; align-items: center; box-sizing: border-box; gap: 4px; flex-shrink: 0; font-weight: 500; font-size: var(--dhx-scheduler-font-size); font-family: var(--dhx-scheduler-font-family); font-weight: var(--dhx-scheduler-btn-font-weight, normal); line-height: 142%; text-transform: var(--dhx-scheduler-btn-text-transform); cursor: pointer; } .button:hover { background: var(--dhx-scheduler-btn-background-hover); color: var(--dhx-scheduler-btn-color-hover); border-color: var(--dhx-scheduler-btn-border-hover); } .button:active { background: var(--dhx-scheduler-btn-background-active); color: var(--dhx-scheduler-btn-color-active); border-color: var(--dhx-scheduler-btn-border-active); } .button:disabled { background: var(--dhx-scheduler-btn-background-disabled); color: var(--dhx-scheduler-btn-color-disabled); border-color: var(--dhx-scheduler-btn-border-disabled); } .button-outline { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-btn-color); --dhx-scheduler-btn-background: var(--dhx-scheduler-btn-outline-background); --dhx-scheduler-btn-color: var(--dhx-scheduler-btn-outline-color); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-btn-outline-border-color); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-btn-outline-background-hover); --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-btn-outline-color-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-btn-outline-border-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-btn-outline-background-active); --dhx-scheduler-btn-color-active: var(--dhx-scheduler-btn-outline-color-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-btn-outline-border-active); --dhx-scheduler-btn-background-disabled: var(--dhx-scheduler-btn-outline-background-disabled); --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-btn-outline-color-disabled); --dhx-scheduler-btn-border-color-disabled: var(--dhx-scheduler-btn-outline-border-color-disabled); } .button-danger { --dhx-scheduler-btn-background: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error-text); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-error-active); } .button-danger-outline { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-btn-color); --dhx-scheduler-btn-background: transparent; --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-error-lighter); --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-background-disabled: transparent; --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: var(--dhx-scheduler-base-colors-icons); } .button-danger-link { padding: 6px 0; --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background: transparent; --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-border-color: transparent; --dhx-scheduler-btn-background-hover: transparent; --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: transparent; --dhx-scheduler-btn-background-active: transparent; --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: transparent; --dhx-scheduler-btn-background-disabled: transparent; --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: transparent; } .button-link { padding: 6px 0; --dhx-scheduler-btn-background: transparent; --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-border-color: transparent; --dhx-scheduler-btn-background-hover: transparent; --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-border-hover: transparent; --dhx-scheduler-btn-background-active: transparent; --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-border-active: transparent; --dhx-scheduler-btn-background-disabled: transparent; --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: transparent; } .button-icon { padding: 8px; min-width: 32px; height: 32px; border-radius: 50%; padding: 6px 0; --dhx-scheduler-btn-background: transparent; --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-border-color: transparent; --dhx-scheduler-btn-background-hover: transparent; --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-border-hover: transparent; --dhx-scheduler-btn-background-active: transparent; --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-border-active: transparent; --dhx-scheduler-btn-background-disabled: transparent; --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: transparent; } .button-icon:hover { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-base-colors-icons-hover); } .button-icon:active { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-base-colors-icons-active); } .button-icon:disabled { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-btn-color-disabled); } .dhx_cal_btn, .dhx_cal_btn_danger, .dhx_cal_btn_outline, .dhx_cal_btn_danger_outline, .dhx_cal_btn_danger_link, .dhx_btn_set, .dhx_cal_tab, .dhx_qi_big_icon, .dhx_cal_today_button, .dhx_cal_tab_standalone { background: var(--dhx-scheduler-btn-background); color: var(--dhx-scheduler-btn-color); border: 1px solid var(--dhx-scheduler-btn-border-color); border-radius: var(--dhx-scheduler-border-radius); height: var(--dhx-scheduler-control-height); padding: var(--dhx-scheduler-btn-padding, 0 20px); display: flex; justify-content: center; align-items: center; box-sizing: border-box; gap: 4px; flex-shrink: 0; font-weight: 500; font-size: var(--dhx-scheduler-font-size); font-family: var(--dhx-scheduler-font-family); font-weight: var(--dhx-scheduler-btn-font-weight, normal); line-height: 142%; text-transform: var(--dhx-scheduler-btn-text-transform); cursor: pointer; } .dhx_cal_btn:hover, .dhx_cal_btn_danger:hover, .dhx_cal_btn_outline:hover, .dhx_cal_btn_danger_outline:hover, .dhx_cal_btn_danger_link:hover, .dhx_btn_set:hover, .dhx_cal_tab:hover, .dhx_qi_big_icon:hover, .dhx_cal_today_button:hover, .dhx_cal_tab_standalone:hover { background: var(--dhx-scheduler-btn-background-hover); color: var(--dhx-scheduler-btn-color-hover); border-color: var(--dhx-scheduler-btn-border-hover); } .dhx_cal_btn:active, .dhx_cal_btn_danger:active, .dhx_cal_btn_outline:active, .dhx_cal_btn_danger_outline:active, .dhx_cal_btn_danger_link:active, .dhx_btn_set:active, .dhx_cal_tab:active, .dhx_qi_big_icon:active, .dhx_cal_today_button:active, .dhx_cal_tab_standalone:active { background: var(--dhx-scheduler-btn-background-active); color: var(--dhx-scheduler-btn-color-active); border-color: var(--dhx-scheduler-btn-border-active); } .dhx_cal_btn:disabled, .dhx_cal_btn_danger:disabled, .dhx_cal_btn_outline:disabled, .dhx_cal_btn_danger_outline:disabled, .dhx_cal_btn_danger_link:disabled, .dhx_btn_set:disabled, .dhx_cal_tab:disabled, .dhx_qi_big_icon:disabled, .dhx_cal_today_button:disabled, .dhx_cal_tab_standalone:disabled { background: var(--dhx-scheduler-btn-background-disabled); color: var(--dhx-scheduler-btn-color-disabled); border-color: var(--dhx-scheduler-btn-border-disabled); } .scheduler_popup_button { background: var(--dhx-scheduler-btn-background); color: var(--dhx-scheduler-btn-color); border: 1px solid var(--dhx-scheduler-btn-border-color); border-radius: var(--dhx-scheduler-border-radius); height: var(--dhx-scheduler-control-height); padding: var(--dhx-scheduler-btn-padding, 0 20px); display: flex; justify-content: center; align-items: center; box-sizing: border-box; gap: 4px; flex-shrink: 0; font-weight: 500; font-size: var(--dhx-scheduler-font-size); font-family: var(--dhx-scheduler-font-family); font-weight: var(--dhx-scheduler-btn-font-weight, normal); line-height: 142%; text-transform: var(--dhx-scheduler-btn-text-transform); cursor: pointer; } .scheduler_popup_button:hover { background: var(--dhx-scheduler-btn-background-hover); color: var(--dhx-scheduler-btn-color-hover); border-color: var(--dhx-scheduler-btn-border-hover); } .scheduler_popup_button:active { background: var(--dhx-scheduler-btn-background-active); color: var(--dhx-scheduler-btn-color-active); border-color: var(--dhx-scheduler-btn-border-active); } .scheduler_popup_button:disabled { background: var(--dhx-scheduler-btn-background-disabled); color: var(--dhx-scheduler-btn-color-disabled); border-color: var(--dhx-scheduler-btn-border-disabled); } .scheduler_popup_button:not(.scheduler_ok_button):not(.scheduler_rec_ok_button) { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-btn-color); --dhx-scheduler-btn-background: var(--dhx-scheduler-btn-outline-background); --dhx-scheduler-btn-color: var(--dhx-scheduler-btn-outline-color); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-btn-outline-border-color); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-btn-outline-background-hover); --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-btn-outline-color-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-btn-outline-border-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-btn-outline-background-active); --dhx-scheduler-btn-color-active: var(--dhx-scheduler-btn-outline-color-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-btn-outline-border-active); --dhx-scheduler-btn-background-disabled: var(--dhx-scheduler-btn-outline-background-disabled); --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-btn-outline-color-disabled); --dhx-scheduler-btn-border-color-disabled: var(--dhx-scheduler-btn-outline-border-color-disabled); } .scheduler_ok_button { --dhx-scheduler-btn-background: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error-text); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-error-active); } .dhx_cal_btn_outline, .dhx_cal_btn_danger_outline { --dhx-scheduler-base-colors-icons: var(--dhx-scheduler-btn-color); --dhx-scheduler-btn-background: var(--dhx-scheduler-btn-outline-background); --dhx-scheduler-btn-color: var(--dhx-scheduler-btn-outline-color); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-btn-outline-border-color); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-btn-outline-background-hover); --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-btn-outline-color-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-btn-outline-border-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-btn-outline-background-active); --dhx-scheduler-btn-color-active: var(--dhx-scheduler-btn-outline-color-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-btn-outline-border-active); --dhx-scheduler-btn-background-disabled: var(--dhx-scheduler-btn-outline-background-disabled); --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-btn-outline-color-disabled); --dhx-scheduler-btn-border-color-disabled: var(--dhx-scheduler-btn-outline-border-color-disabled); } .dhx_cal_button_danger { --dhx-scheduler-btn-background: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error-text); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-error-active); } .dhx_cal_button_danger_outline { --dhx-scheduler-btn-background: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-error-text); --dhx-scheduler-btn-border-color: var(--dhx-scheduler-base-colors-error); --dhx-scheduler-btn-background-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-border-hover: var(--dhx-scheduler-base-colors-error-hover); --dhx-scheduler-btn-background-active: var(--dhx-scheduler-base-colors-error-active); --dhx-scheduler-btn-border-active: var(--dhx-scheduler-base-colors-error-active); } .dhx_cal_button_link, .dhx_qi_big_icon { padding: 6px 0; --dhx-scheduler-btn-background: transparent; --dhx-scheduler-btn-color: var(--dhx-scheduler-base-colors-primary); --dhx-scheduler-btn-border-color: transparent; --dhx-scheduler-btn-background-hover: transparent; --dhx-scheduler-btn-color-hover: var(--dhx-scheduler-base-colors-primary-hover); --dhx-scheduler-btn-border-hover: transparent; --dhx-scheduler-btn-background-active: transparent; --dhx-scheduler-btn-color-active: var(--dhx-scheduler-base-colors-primary-active); --dhx-scheduler-btn-border-active: transparent; --dhx-scheduler-btn-background-disabled: transparent; --dhx-scheduler-btn-color-disabled: var(--dhx-scheduler-base-colors-icons); --dhx-scheduler-btn-border-color-disabled: transparent; } .dhx