/*********************************************************************************************
 *
 *  LOHNDIREKT THEME — Corporate Design 2026
 *  ==========================================
 *
 *  Brand Palette (Styleguide 2026):
 *    Orange (primary brand):   #f26401   — Herzstück der Markenidentität
 *    Orange hover:             #d95a01
 *    Petrol (secondary):       #2C4E61   — Ruhe, Sicherheit, Expertise
 *    Petrol dark:              #1f3a4a
 *    Anthrazit (text):         #333333
 *    Mittelgrau (meta text):   #666666
 *    Hellgrau (borders):       #e0e0e0
 *    Background:               #f9f9f9
 *    Selection:                #fde8d4
 *    Selection light:          #fef5eb
 *
 *  Font: Fira Sans (400, 500, 600, 700)
 *
 *********************************************************************************************/

/* Web font, served locally (no request to Google). Latin subset of Fira Sans 4.203,
 * SIL Open Font License 1.1, see ../fonts/OFL.txt */
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/FiraSans-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/FiraSans-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/FiraSans-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/FiraSans-Bold.woff2') format('woff2');
}

/* Global font override */
body, .x-panel, .x-grid3, .x-toolbar, .x-menu, .x-form-text, .x-btn button,
.x-tab-strip span, .x-tree-node, input, textarea, select, button {
  font-family: 'Fira Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/*********************************************************************************************
 * LOGIN SCREEN
 *********************************************************************************************/

body.login #form-container #content,
#loading-mask #form-container #content {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 16px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4),
              0 0 0 1px rgba(255, 255, 255, 0.1);
}

body.login #form-container .left,
#loading-mask #form-container .left {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

body.login #form-container h1,
#loading-mask #form-container h1 {
  color: #333333;
  font-weight: 600;
  letter-spacing: -0.5px;
}

body.login > #form-container label {
  color: #666666;
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

body.login > #form-container input[type="text"],
body.login > #form-container input[type="password"] {
  border: 1.5px solid #e0e0e0;
  border-radius: 8px;
  padding: 0 12px;
  height: 36px;
  font-size: 14px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  background: #ffffff !important;
}
body.login > #form-container input[type="text"]:focus,
body.login > #form-container input[type="password"]:focus {
  border-color: #f26401;
  box-shadow: 0 0 0 3px rgba(242, 100, 1, 0.12);
  outline: none;
}

/* Sign-in button */
body.login #form-container #submitbutton,
#loading-mask #form-container #submitbutton {
  background: linear-gradient(135deg, #f26401 0%, #d95a01 100%);
  border: none;
  border-radius: 10px;
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.3px;
  color: #ffffff;
  cursor: pointer;
  box-shadow: 0 4px 14px -3px rgba(242, 100, 1, 0.5);
  transition: all 0.2s ease;
  min-width: 100px;
}
body.login #form-container #submitbutton:hover,
#loading-mask #form-container #submitbutton:hover {
  background: linear-gradient(135deg, #d95a01 0%, #c05000 100%) !important;
  box-shadow: 0 6px 20px -3px rgba(242, 100, 1, 0.6);
  transform: translateY(-1px);
}
body.login #form-container #submitbutton:active,
#loading-mask #form-container #submitbutton:active {
  background: linear-gradient(135deg, #c05000 0%, #a84700 100%) !important;
  transform: translateY(0);
  box-shadow: 0 2px 8px -2px rgba(242, 100, 1, 0.5);
}

/* Error messages */
body.login > #form-container #error {
  color: #dc2626;
  font-size: 12px;
  font-weight: 500;
  padding: 8px 12px;
  background: #fef2f2;
  border-radius: 6px;
  border: 1px solid #fecaca;
  margin-bottom: 4px;
}

/* Without a message (no login error, caps lock off) the box stays hidden */
body.login > #form-container #error:empty {
  display: none;
}

/*********************************************************************************************
 * TOP MENU BAR
 *********************************************************************************************/

body #zarafa-mainmenu {
  border-color: #1f3a4a;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct {
  background: linear-gradient(180deg, #2C4E61 0%, #1f3a4a 100%);
}

body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .x-btn button.x-btn-text {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Hover / active / selected states */
body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .x-btn.x-btn-over,
body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .x-btn.x-btn-over.x-btn-click,
body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .zarafa-maintabbar-maintab-active,
body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .zarafa-maintabbar-maintab-active.x-btn-over,
body #zarafa-mainmenu.zarafa-maintabbar > .x-toolbar-ct .zarafa-maintabbar-maintab-active.x-btn-over.x-btn-click {
  background: linear-gradient(180deg, #f26401 0%, #d95a01 100%) !important;
  border-radius: 6px;
  box-shadow: 0 2px 8px -2px rgba(242, 100, 1, 0.5);
}

/*********************************************************************************************
 * MAIN TOOLBAR (logo area below top bar)
 *********************************************************************************************/
.zarafa-maintoolbar {
  border-bottom: 1px solid #e0e0e0 !important;
}

/*********************************************************************************************
 * WELCOME DIALOG
 *********************************************************************************************/
.zarafa-welcome-body > .x-panel-bwrap > .x-panel-body div.zarafa-welcome-title {
  background: linear-gradient(135deg, #2C4E61 0%, #1f3a4a 100%);
  border-left: 1px solid #2C4E61;
  border-right: 1px solid #2C4E61;
}

/*********************************************************************************************
 * ACTION BUTTONS (Send, Save, etc.)
 *********************************************************************************************/

.x-btn.zarafa-action .x-btn-small,
.x-btn.zarafa-action .x-btn-medium,
.x-btn.zarafa-action .x-btn-large {
  background: linear-gradient(135deg, #f26401 0%, #d95a01 100%) !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 6px -2px rgba(242, 100, 1, 0.4);
  transition: all 0.15s ease;
}

.x-btn.zarafa-action.x-btn-over .x-btn-small,
.x-btn.zarafa-action.x-btn-over .x-btn-medium,
.x-btn.zarafa-action.x-btn-over .x-btn-large {
  background: linear-gradient(135deg, #d95a01 0%, #c05000 100%) !important;
  box-shadow: 0 4px 12px -3px rgba(242, 100, 1, 0.5);
}

.x-btn.zarafa-action.x-btn-focus .x-btn-small,
.x-btn.zarafa-action.x-btn-focus .x-btn-medium,
.x-btn.zarafa-action.x-btn-focus .x-btn-large {
  background: linear-gradient(135deg, #f26401 0%, #d95a01 100%) !important;
  box-shadow: 0 0 0 3px rgba(242, 100, 1, 0.2);
}

/*********************************************************************************************
 * NORMAL BUTTONS
 *********************************************************************************************/

.x-btn .x-btn-small,
.x-btn .x-btn-medium,
.x-btn .x-btn-large {
  border-radius: 6px;
  transition: all 0.15s ease;
}

.x-btn.x-btn-over .x-btn-small,
.x-btn.x-btn-over .x-btn-medium,
.x-btn.x-btn-over .x-btn-large {
  background-color: #f0f0f0;
  border-color: #d0d0d0;
}

.x-btn.x-btn-over.x-btn-click .x-btn-small,
.x-btn.x-btn-over.x-btn-click .x-btn-medium,
.x-btn.x-btn-over.x-btn-click .x-btn-large,
.x-btn.x-btn-click .x-btn-small,
.x-btn.x-btn-click .x-btn-medium,
.x-btn.x-btn-click .x-btn-large {
  background-color: #e0e0e0 !important;
}

/* Fade block in titlebar of dialog header */
.x-window .x-window-tl .x-window-tr .x-window-tc .x-window-header .fade,
.x-panel-ghost .x-window-tl .x-window-tr .x-window-tc .x-window-header .fade {
  background: linear-gradient(to right, rgba(249, 249, 249, 0) 0%, #f9f9f9 50%, #f9f9f9 100%);
}

/*********************************************************************************************
 * PANELS & HEADERS
 *********************************************************************************************/

.x-panel .x-panel-header {
  border-color: #e0e0e0;
}

#zarafa-navigationpanel .x-panel-header,
.zarafa-widgetpanel .x-panel-header {
  background-color: #f9f9f9;
  border-color: #e0e0e0;
  color: #333333;
  font-weight: 600;
}

/*********************************************************************************************
 * TABS
 *********************************************************************************************/

#zarafa-mainpanel > .x-tab-panel-header > .x-tab-strip-wrap > ul.x-tab-strip li:not(.x-tab-strip-active) {
  border-color: #e0e0e0 !important;
}
#zarafa-mainpanel > .x-tab-panel-header > .x-tab-strip-wrap > ul.x-tab-strip li:not(.x-tab-strip-active) .x-tab-right {
  background: #f9f9f9;
}
#zarafa-mainpanel > .x-tab-panel-header > .x-tab-strip-wrap > ul.x-tab-strip li:not(.x-tab-strip-active):hover {
  border-color: #fde8d4 !important;
}
#zarafa-mainpanel > .x-tab-panel-header > .x-tab-strip-wrap > ul.x-tab-strip li:not(.x-tab-strip-active):hover .x-tab-right {
  background: #fef5eb;
}

ul.x-tab-strip li,
ul.x-tab-strip li.x-tab-strip-active {
  border-color: #e0e0e0 !important;
}

/*********************************************************************************************
 * GRIDS & MAIL LIST
 *********************************************************************************************/

.x-grid3-row-over {
  background-color: #fafafa !important;
}

.x-grid3-row.x-grid3-row-selected,
.x-grid3 .x-grid3-row-selected .zarafa-grid-button-container {
  background-color: #fde8d4 !important;
  border-color: #fde8d4;
}

.x-grid3-header {
  border-color: #e0e0e0;
}

.x-grid3-hd-row td .x-grid3-hd-inner {
  color: #666666;
  font-weight: 600;
}

.x-grid3-row .k-conversation-count {
  color: #f26401;
  font-weight: 600;
}

/*********************************************************************************************
 * HIERARCHY / FOLDER TREE
 *********************************************************************************************/

.x-tree-node .zarafa-hierarchy-node.x-tree-selected {
  background-color: #fde8d4 !important;
  border-color: #fde8d4;
  border-radius: 4px;
}

.zarafa-hierarchy-node-total-count span.zarafa-hierarchy-node-counter,
.zarafa-hierarchy-node-unread-count span.zarafa-hierarchy-node-counter {
  color: #f26401;
  font-weight: 700;
}

/*********************************************************************************************
 * PREVIEW PANEL
 *********************************************************************************************/

.preview-header {
  border-color: #e0e0e0;
}

.preview-header-extrainfobox,
.preview-header-extrainfobox-item,
.k-appointmentcreatetab .zarafa-calendar-appointment-extrainfo div,
.k-taskgeneraltab .zarafa-calendar-appointment-extrainfo div,
.zarafa-mailcreatepanel > .x-panel-bwrap > .x-panel-body .zarafa-mailcreatepanel-extrainfo div {
  background: #fef5eb !important;
  color: #d95a01;
  border-radius: 6px;
}

.preview-header-sender-initial {
  color: #333333;
  font-weight: 700;
}

/*********************************************************************************************
 * FORM ELEMENTS
 *********************************************************************************************/

.x-form-text,
textarea.x-form-field {
  border-color: #e0e0e0;
  border-radius: 6px;
}

.x-form-text.x-form-focus:not(.x-trigger-noedit) {
  border-color: #f26401 !important;
  box-shadow: 0 0 0 3px rgba(242, 100, 1, 0.1);
}

.x-form-field-wrap.x-trigger-wrap-focus:not(.x-freebusy-userlist-container) {
  border-color: #f26401;
}

input.x-form-text.x-form-field.x-form-focus {
  border-color: #f26401 !important;
}

.x-form-field-trigger-wrap .x-form-trigger,
.x-form-field-wrap .x-form-trigger {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * MENUS
 *********************************************************************************************/

.x-menu {
  border-color: #e0e0e0;
  border-radius: 8px;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.x-menu-item-active {
  background-color: #f9f9f9;
}

.x-menu-item-selected {
  background-color: #fde8d4;
  border-radius: 4px;
}

.x-menu .x-menu-list li.x-menu-sep-li .x-menu-sep {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * DATE PICKER
 *********************************************************************************************/

.x-date-picker {
  border-color: #e0e0e0;
  border-radius: 8px;
  box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.08);
}

.x-date-picker .x-date-inner th {
  border-color: #e0e0e0;
  color: #666666;
  font-weight: 600;
}

.x-date-picker .x-date-inner td.x-date-today a {
  background: #f26401 !important;
  border-color: #f26401;
  color: #ffffff !important;
  border-radius: 6px;
}

.x-date-picker .x-date-inner td.x-date-selected:not(.x-date-today) a,
.x-date-picker .x-date-inner td.x-date-selected:not(.x-date-today) a:hover {
  background-color: #fde8d4 !important;
  border-color: #fde8d4;
  border-radius: 6px;
}

.x-date-picker .x-date-mp table td.x-date-mp-sel a {
  background: #f26401 !important;
  border-color: #f26401;
  border-radius: 4px;
}

.x-date-picker .x-date-inner td.x-date-weeknumber a {
  color: #f26401;
}

.x-date-picker .x-date-inner td.x-date-weeknumber {
  border-right-color: #e0e0e0;
}

.x-date-picker .x-date-mp table tr.x-date-mp-btns td button.x-date-mp-ok {
  background: #f26401 !important;
  border-radius: 4px;
}
.x-date-picker .x-date-mp table tr.x-date-mp-btns td button.x-date-mp-ok:hover {
  background: #d95a01 !important;
}

.x-date-picker .x-date-bottom,
.x-date-picker .x-date-mp table td.x-date-mp-sep,
.x-date-picker .x-date-mp table tr.x-date-mp-btns td {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * CALENDAR
 *********************************************************************************************/

.zarafa-calendar-tabarea-stroke.zarafa-calendar-tab-selected {
  border-top-color: #f26401;
}

.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-header .x-freebusy-header-body .x-freebusy-timeline-day.x-freebusy-timeline-day-current table tr.x-freebusy-timeline-day td {
  background: #f26401 !important;
}
.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-header .x-freebusy-header-body .x-freebusy-timeline-day.x-freebusy-timeline-day-current,
.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-body .x-freebusy-background .x-freebusy-timeline-day.x-freebusy-timeline-day-current {
  border-right-color: #f26401;
  border-color: #f26401;
}
.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-header .x-freebusy-header-body .x-freebusy-timeline-day.x-freebusy-timeline-day-current table tr.x-freebusy-timeline-hour td:first-child,
.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-body .x-freebusy-background .x-freebusy-timeline-day.x-freebusy-timeline-day-current td:first-child {
  border-left-color: #f26401;
}

.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-header .x-freebusy-header-body div.x-freebusy-timeline-day,
.zarafa-freebusy-panel .x-freebusy-timeline-container .x-freebusy-body .x-freebusy-background .x-freebusy-timeline-day {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * BOXFIELDS (recipient fields, etc.)
 *********************************************************************************************/

.x-zarafa-boxfield ul .x-zarafa-boxfield-item-focus,
.x-zarafa-boxfield ul .x-zarafa-boxfield-recipient-item.x-zarafa-boxfield-item-focus {
  background-color: #fde8d4 !important;
  border-color: #f5b882;
  border-radius: 4px;
}

.x-zarafa-boxfield ul .x-zarafa-boxfield-item {
  border-color: #e0e0e0;
  border-radius: 4px;
}

/*********************************************************************************************
 * SELECTED ITEMS (misc)
 *********************************************************************************************/

div.zarafa-contact-cardview-selected,
.zarafa-note-iconview-selected {
  background-color: #fde8d4 !important;
  border-color: #fde8d4;
}

.contact-characterstrip .x-btn-pressed .x-btn-small {
  background-color: #fde8d4;
  border-color: #f5b882;
  border-radius: 4px;
}

.k-selection {
  background-color: #fde8d4 !important;
}

/*********************************************************************************************
 * SETTINGS PANEL
 *********************************************************************************************/

#zarafa-mainpanel-contentpanel-settings .zarafa-settings-category-panel .zarafa-settings-category-tab-active {
  background-color: #fde8d4 !important;
  border-color: #fde8d4;
}

#zarafa-mainpanel-contentpanel-settings .zarafa-settings-category-widget-panel .zarafa-settings-about-text a {
  background-color: #2C4E61;
  border-radius: 6px;
  transition: background-color 0.15s ease;
}
#zarafa-mainpanel-contentpanel-settings .zarafa-settings-category-widget-panel .zarafa-settings-about-text a:hover {
  background-color: #f26401;
}

#zarafa-mainpanel-contentpanel-settings .zarafa-settings-category-widget-panel .zarafa-settings-keyboard-shortcut-row {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * BORDER COLORS (global)
 *********************************************************************************************/

#zarafa-navigationpanel,
.zarafa-widgetpanel,
.x-panel,
.x-panel .x-panel-body,
.x-tab-panel-body,
.x-toolbar,
.x-fieldset,
.preview-header,
.zarafa-hierarchy-treepanel-bottombar,
.zarafa-search-toolbox,
.zarafa-freebusy-panel .x-panel.suggestionlist .x-btn.zarafa-freebusy-suggestionrow .x-btn-small {
  border-color: #e0e0e0;
}

.x-panel-noborder .x-panel-tbar-noborder .x-toolbar,
.x-panel-bbar .x-toolbar,
.x-panel-tbar .x-toolbar {
  border-color: #e0e0e0;
}

#zarafa-mainpanel-contentpanel-mail.zarafa-preview-right .zarafa-context-mainpanel,
#zarafa-mainpanel-contentpanel-mail.zarafa-preview-right #zarafa-main-content-mail-preview,
#zarafa-mainpanel-contentpanel-mail.zarafa-preview-bottom .zarafa-context-mainpanel,
#zarafa-mainpanel-contentpanel-mail.zarafa-preview-bottom #zarafa-main-content-mail-preview {
  border-color: #e0e0e0;
}

.mce-panel {
  border-color: #e0e0e0 !important;
}

.x-grid3-row,
.x-grid3-row-over,
.x-grid3-hd-row td .x-grid3-hd-inner .x-grid3-hd-btn {
  border-color: #e0e0e0;
}

.x-window .x-window-bwrap .x-window-body > div > .x-panel > .x-panel-header,
.x-panel-ghost .x-window-bwrap .x-window-body > div > .x-panel > .x-panel-header {
  border-color: #e0e0e0;
}

/*********************************************************************************************
 * UNREAD ITEMS BORDER
 *********************************************************************************************/

.theme-themelohndirekt.k-unreadborders .x-grid3-row.x-grid3-row-collapsed.mail_unread > table,
.theme-themelohndirekt.k-unreadborders .x-grid3-row.x-grid3-row-expanded.mail_unread > table {
  border-left: 4px solid #f26401 !important;
}

.theme-themelohndirekt .x-grid3-row.x-grid3-row-expanded.mail_read.x-grid3-row-selected > table {
  border-left: 4px solid #f5b882 !important;
}

.theme-themelohndirekt .x-grid3-row.x-grid3-row-expanded.mail_read.x-grid3-row-selected.x-grid3-row-over > table,
.theme-themelohndirekt .x-grid3-row.x-grid3-row-collapsed.mail_read.x-grid3-row-selected > table {
  border-left: 4px solid #f5b882 !important;
}

/*********************************************************************************************
 * WINDOWS / DIALOGS
 *********************************************************************************************/

.x-window {
  border-radius: 10px;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.2);
}

.x-window .x-panel-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-small,
.x-window .x-panel-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-medium,
.x-window .x-panel-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-large,
.x-window .x-panel-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-small,
.x-window .x-panel-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-medium,
.x-window .x-panel-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-large,
.x-window .x-window-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-small,
.x-window .x-window-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-medium,
.x-window .x-window-footer .x-toolbar-left-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-large,
.x-window .x-window-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-small,
.x-window .x-window-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-medium,
.x-window .x-window-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-large {
  border-radius: 6px !important;
}

.k-reminderpanel .x-panel-footer .x-toolbar-right-row .x-toolbar-cell:not(.x-hide-offsets) .x-btn:not(.zarafa-normal) .x-btn-small {
  border-radius: 6px !important;
}

/*********************************************************************************************
 * SCROLLBARS (WebKit/Blink)
 *********************************************************************************************/

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #c0c0c0;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #999999;
}

/*********************************************************************************************
 * MAIL CREATE PANEL
 *********************************************************************************************/

.zarafa-mailcreatepanel > .x-panel-bwrap > .x-panel-body .zarafa-mailcreatepanel-field-subject {
  border-color: #e0e0e0;
}

.zarafa-appointmentcreatetab .field-to,
.zarafa-appointmentcreatetab .subject-panel,
.zarafa-appointmentcreatetab .location-panel,
.zarafa-appointmentcreatetab .datetime-panel table tr:nth-child(2),
.zarafa-appointmentcreatetab .busystatus-panel,
.zarafa-appointmentcreatetab .label-panel,
.zarafa-appointmentcreatetab .attachments-panel {
  border-color: #e0e0e0;
}