:root {
  /* Fluid dashboard unit: 1vw on ~16:9 screens, but capped by viewport
     height so wide-but-short windows (laptops with browser chrome, half
     screens, maximized-with-taskbar) scale down instead of overflowing
     vertically. 1.83vh == 1vw at a 1.83:1 viewport, so fullscreen 16:9
     (1.78:1) stays pixel-identical and anything shorter shrinks. Use as
     calc(N * var(--bde-fvw, 1vw)) wherever a dashboard was sized with Nvw. */
  --bde-fvw: min(1vw, 1.83vh);
  --bde-refresh-blue: #0f81d1;
  --bde-refresh-blue-dark: #0a6fb5;
  --bde-refresh-blue-border: #84b9de;
  --bde-refresh-blue-soft: #d8effd;
  --bde-refresh-blue-softer: #edf8ff;
  --bde-refresh-surface: #f5f9fd;
  --bde-refresh-panel: #fbfdff;
  --bde-refresh-border: #c6d8e8;
  --bde-refresh-text: #16324b;
  --bde-refresh-muted: #587089;
  --bde-refresh-gray: #8f9daa;
  --bde-refresh-shadow: 0 2px 8px rgba(36, 74, 112, 0.12);
  --bde-refresh-action-shadow: 0 2px 7px rgba(36, 74, 112, 0.1);
}

.machine-dashboard-slide-tabs,
.energy-diagram-view-tabs,
.production-reporting-page-content .tabs,
.washing-programs-page-content .tabs,
.washing-programs-page-content .machines-tabs {
  border-color: var(--bde-refresh-blue-border) !important;
  border-radius: 8px !important;
  background: var(--bde-refresh-blue-softer) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.machine-dashboard-slide-tab,
.energy-diagram-view-tab,
.production-reporting-page-content .production-reporting-tab-button,
.washing-programs-page-content .tab-button,
.washing-programs-page-content .machine-tab-button,
.washing-programs-page-content .machines-tab-button {
  border-right-color: var(--bde-refresh-blue-border) !important;
  background: linear-gradient(180deg, #fafdff 0%, #eaf6ff 100%) !important;
  color: #154768 !important;
  transition: background 0.14s ease, box-shadow 0.14s ease, color 0.14s ease;
}

.machine-dashboard-slide-tab:focus,
.energy-diagram-view-tab:focus,
.production-reporting-page-content .production-reporting-tab-button:focus,
.washing-programs-page-content .tab-button:focus,
.washing-programs-page-content .machine-tab-button:focus,
.washing-programs-page-content .machines-tab-button:focus,
.add-washing-program-button:focus,
#open_upload_video_modal:focus,
#upload_video_ok:focus,
.export-button:focus,
.automated-emails-save-button:focus,
.ant-picker-ok .ant-btn-primary:focus,
.clear-search-button:focus,
.close-upload-video-modal-footer-button:focus {
  outline: none !important;
}

.machine-dashboard-slide-tab:hover,
.energy-diagram-view-tab:hover,
.production-reporting-page-content .production-reporting-tab-button:hover:not(.active),
.washing-programs-page-content .tab-button:hover:not(.active),
.washing-programs-page-content .machine-tab-button:hover:not(.active),
.washing-programs-page-content .machines-tab-button:hover:not(.active) {
  background: var(--bde-refresh-blue-soft) !important;
  color: #123a58 !important;
}

.machine-dashboard-slide-tab.active,
.machine-dashboard-theme-page .machine-dashboard-slide-tab.active,
.energy-diagram-view-tab.active,
.production-reporting-page-content .production-reporting-tab-button.active,
.washing-programs-page-content .tab-button.active,
.washing-programs-page-content .machine-tab-button.active,
.washing-programs-page-content .machines-tab-button.active {
  background: var(--bde-refresh-blue-soft) !important;
  color: #102f48 !important;
  box-shadow:
    inset 0 0 0 1px rgba(15, 129, 209, 0.18),
    inset 0 -3px 0 var(--bde-refresh-blue);
}

.production-reporting-page-content,
.washing-programs-page-content,
.videos-page-content,
.shifts-page-content,
.automated-emails-page-content,
.energy_diagram_content {
  background: linear-gradient(180deg, #f5f9fd 0%, #eef5fb 100%) !important;
  border-color: var(--bde-refresh-border) !important;
  border-radius: 8px !important;
}

.production-reporting-tab-content,
.washing-programs-page-content .tab-content,
.washing-programs-page-content .machine-tab-content,
.washing-programs-page-content .machines-tab-content,
.videos-page-content .videos-page-body,
.shifts-page-content .shifts-page-body,
.automated-emails-card,
.override-panel {
  background: var(--bde-refresh-panel) !important;
  border-color: var(--bde-refresh-border) !important;
  border-radius: 8px !important;
  box-shadow: var(--bde-refresh-shadow);
}

.programs-tab-header .programs-search input,
#search_machine_input,
#search_videos_input,
.automated-emails-language-select,
.washing-programs-page-content input,
.washing-programs-page-content select,
.ant-picker {
  border-color: var(--bde-refresh-blue-border) !important;
  border-radius: 8px !important;
  color: var(--bde-refresh-text) !important;
  background: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.programs-tab-header .programs-search input:hover,
.programs-tab-header .programs-search input:focus,
#search_machine_input:hover,
#search_machine_input:focus,
#search_videos_input:hover,
#search_videos_input:focus,
.automated-emails-language-select:hover,
.automated-emails-language-select:focus,
.washing-programs-page-content input:hover,
.washing-programs-page-content input:focus,
.washing-programs-page-content select:hover,
.washing-programs-page-content select:focus,
.ant-picker-focused,
.ant-picker:hover {
  border-color: var(--bde-refresh-blue) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 8px rgba(15, 129, 209, 0.14) !important;
  outline: none;
}

.search-icon,
.programs-tab-header .programs-search .search-icon,
.videos-search .search-icon {
  color: #426b8e !important;
}

.add-washing-program-button,
#open_upload_video_modal,
#upload_video_ok,
.export-button,
.automated-emails-save-button,
.ant-picker-ok .ant-btn-primary {
  border: 1px solid var(--bde-refresh-blue-border) !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #fafdff 0%, #eaf6ff 100%) !important;
  color: var(--bde-refresh-blue) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    var(--bde-refresh-action-shadow) !important;
}

.add-washing-program-button:hover,
#open_upload_video_modal:hover,
#upload_video_ok:hover,
.export-button:hover,
.automated-emails-save-button:hover,
.ant-picker-ok .ant-btn-primary:hover {
  border-color: var(--bde-refresh-blue) !important;
  background: var(--bde-refresh-blue-soft) !important;
  color: #0b659f !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 8px rgba(15, 129, 209, 0.14) !important;
}

.add-washing-program-button:focus,
#open_upload_video_modal:focus,
#upload_video_ok:focus,
.export-button:focus,
.automated-emails-save-button:focus,
.ant-picker-ok .ant-btn-primary:focus,
.clear-search-button:focus,
.close-upload-video-modal-footer-button:focus {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 0 0 2px rgba(15, 129, 209, 0.16) !important;
}

.add-washing-program-button:active,
#open_upload_video_modal:active,
#upload_video_ok:active,
.export-button:active,
.automated-emails-save-button:active,
.ant-picker-ok .ant-btn-primary:active {
  background: #cde8fb !important;
  box-shadow: inset 0 1px 3px rgba(13, 71, 112, 0.12) !important;
}

.add-washing-program-button svg,
#open_upload_video_modal svg,
#upload_video_ok svg,
.export-button svg,
.automated-emails-save-button svg,
.ant-picker-ok .ant-btn-primary svg {
  color: currentColor !important;
  fill: currentColor !important;
}

.add-washing-program-button svg path:not([fill="none"]),
#open_upload_video_modal svg path:not([fill="none"]),
#upload_video_ok svg path:not([fill="none"]),
.export-button svg path:not([fill="none"]),
.automated-emails-save-button svg path:not([fill="none"]),
.ant-picker-ok .ant-btn-primary svg path:not([fill="none"]) {
  fill: currentColor !important;
}

.export-button .material-icons,
.add-washing-program-button .material-icons,
#open_upload_video_modal .material-icons,
#upload_video_ok .material-icons {
  color: currentColor !important;
}

.clear-search-button,
.close-upload-video-modal-footer-button,
#close_disable_shift_modal,
#close_enable_shift_modal,
.washing-programs-page-content #close_remove_program_modal,
.washing-programs-page-content #close_remove_machine_modal,
.washing-programs-page-content .close-add-program-modal-footer-button {
  border: 1px solid #aebdca !important;
  border-radius: 8px !important;
  background: #f7fbff !important;
  color: var(--bde-refresh-muted) !important;
  box-shadow: var(--bde-refresh-action-shadow) !important;
}

.clear-search-button:hover,
.close-upload-video-modal-footer-button:hover,
#close_disable_shift_modal:hover,
#close_enable_shift_modal:hover,
.washing-programs-page-content #close_remove_program_modal:hover,
.washing-programs-page-content #close_remove_machine_modal:hover,
.washing-programs-page-content .close-add-program-modal-footer-button:hover {
  border-color: var(--bde-refresh-blue-border) !important;
  background: var(--bde-refresh-blue-soft) !important;
  color: var(--bde-refresh-text) !important;
}

.table-header,
.production-reporting-page-content .table-header,
.production-reporting-page-content .table-footer,
.washing-programs-page-content .table-header,
.shifts-page-body .shifts-table .shifts-header {
  background: #96a5b3 !important;
  border-radius: 8px !important;
}

.table-row,
.shifts-body .body-row {
  border-radius: 8px !important;
  transition: background 0.14s ease, box-shadow 0.14s ease;
}

.table-row:hover,
.production-reporting-page-content .table-row:hover,
.washing-programs-page-content .table-row:hover,
.shifts-body .body-row:hover,
.video-thumbnail:hover {
  background-color: var(--bde-refresh-blue-soft) !important;
  box-shadow: inset 0 0 0 1px rgba(15, 129, 209, 0.12);
}

.add-program-modal-content,
.upload-video-modal-content,
.play-video-modal-content,
.delete-video-modal-content,
.delete-shift-modal-content {
  border-color: var(--bde-refresh-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 32px rgba(16, 38, 59, 0.2) !important;
}

.video-thumbnail-preview,
.video-thumbnail {
  border-color: var(--bde-refresh-blue) !important;
  border-radius: 8px !important;
}

.reporting-month-dropdown,
#wimmer_report_month_select,
#employee_report_month_select,
#energy_report_month_select,
#energy_month_select,
#analysis_month_select {
  border: 1px solid var(--bde-refresh-border) !important;
  border-radius: 8px !important;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(18, 45, 72, 0.18) !important;
}

.reporting-month-dropdown span:hover,
#wimmer_report_month_select span:hover,
#employee_report_month_select span:hover,
#energy_report_month_select span:hover,
#energy_month_select span:hover,
#analysis_month_select span:hover {
  background: var(--bde-refresh-blue-soft) !important;
  color: var(--bde-refresh-text) !important;
}

.automated-emails-language-select--native {
  display: none !important;
}

.automated-emails-language-picker {
  position: relative;
  width: clamp(270px, 20vw, 320px);
  flex: 0 0 clamp(270px, 20vw, 320px);
  min-width: 0;
}

.automated-emails-language-button {
  width: 100%;
  height: 40px;
  border: 1px solid var(--bde-refresh-blue-border);
  border-radius: 8px;
  background: #ffffff;
  color: var(--bde-refresh-text);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 12px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.automated-emails-language-button:hover,
.automated-emails-language-picker.is-open .automated-emails-language-button {
  background: var(--bde-refresh-blue-soft);
  border-color: var(--bde-refresh-blue);
}

.automated-emails-language-button:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.automated-emails-language-caret {
  flex: 0 0 auto;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 4px;
  transform: rotate(45deg);
  transition: transform 0.14s ease;
}

.automated-emails-language-picker.is-open .automated-emails-language-caret {
  transform: rotate(225deg);
}

.automated-emails-language-options {
  position: absolute;
  z-index: 950;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: min(360px, 55vh);
  overflow-y: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  border: 1px solid var(--bde-refresh-blue-border);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(18, 45, 72, 0.22);
  display: none;
}

.automated-emails-language-picker.is-open .automated-emails-language-options {
  display: block;
}

.automated-emails-language-option {
  border-radius: 6px;
  color: var(--bde-refresh-text);
  cursor: pointer;
  font-weight: 700;
  padding: 8px 10px;
  white-space: nowrap;
}

.automated-emails-language-option:hover,
.automated-emails-language-option:focus,
.automated-emails-language-option.is-selected {
  background: var(--bde-refresh-blue-soft);
  color: var(--bde-refresh-text);
  outline: none;
}

@media only screen and (min-width: 1000px) {
  .automated-emails-header-row {
    grid-template-columns: minmax(215px, 0.7fr) minmax(575px, 1.7fr) auto !important;
    align-items: center !important;
  }

  .automated-emails-language-row {
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
  }

  .automated-emails-save-button {
    justify-self: end !important;
  }
}

@media only screen and (max-width: 760px) {
  .automated-emails-language-picker {
    width: 100%;
  }
}