@import url(chrome://MonterailFDOverlay/content/skin/icons/css/messenger.css);
@import url(chrome://MonterailFDOverlay/content/skin/icons/css/folder.css);

/* encode-sans-300 - latin-ext_latin */
@font-face {
    font-family: 'EncodeSans';
    font-style: normal;
    font-weight: normal;
    src: local(''),
         url('fonts/encode-sans-v7-latin-ext_latin-300.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/encode-sans-v7-latin-ext_latin-300.woff') format('woff'), /* Modern Browsers */
         url('fonts/encode-sans-v7-latin-ext_latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/encode-sans-v7-latin-ext_latin-300.svg#EncodeSans') format('svg'); /* Legacy iOS */
  }
  
/* encode-sans-600 - latin-ext_latin */
@font-face {
    font-family: 'EncodeSans';
    font-style: normal;
    font-weight: bold;
    src: local(''),
         url('fonts/encode-sans-v7-latin-ext_latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/encode-sans-v7-latin-ext_latin-600.woff') format('woff'), /* Modern Browsers */
         url('fonts/encode-sans-v7-latin-ext_latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/encode-sans-v7-latin-ext_latin-600.svg#EncodeSans') format('svg'); /* Legacy iOS */
}

:root {
    /* Background color Navigation & Folder Pane */
    --background-color: #31363B;
	--background-color-inactive: #393f44;
	
    /* Background Toolbox & Compose*/
	--background-color-light: #838689;
	
    /* Background folder/thread */
    --thread-background-color: #232629;
    --tree-background-color-selected: #3DAEE9;
	--tree-background-color-hover: rgba(255,255,255,.1);
	
	/* Fonts */
    --default-font: 'EncodeSans';
    --message-list-text-color: #fff;
    --link-color: #80CAFE;
	
	/* Message row & Folder row height */
    --message-list-row-height: 40px;
	--folder-tree-row-height: 25px;
	
    /* Scollbar */
    --scrollbar-thumb-color: rgba(127, 127, 127, 0.5);
	--scrollbar-thumb-hover-color: var(--tree-background-color-selected);
	
    /* Message Headers */
    --subject-line-font-size: 150%;
    --headers-background-color: #F2F1F0;
    --headers-text-color: var(--message-list-text-color);

    /* Search Box */
    --search-background-color: var(--background-color);
    --search-text-color: #fff;

    /* Date filter search */
    --dateColor: var(--background-color);
    --barHlColor: var(--tree-background-color-selected);
    --barColor: var(--tree-background-color-selected);
}   

* {
    font-family: var(--default-font);
    text-shadow: none !important; 
}

:root[lwtheme-image]:-moz-lwtheme-brighttext { 
    text-shadow: none !important;
}

#appMenu-mainViewItems {
    background-color: var(--background-color) !important;
}

#mail-toolbar-menubar2,
#mail-bar3 #MsgHeadersToolbar,
#addrbook-toolbar-menubar2,
#ab-bar2,
#FormatToolbar {
    -moz-appearance: none !important;
    border: none !important;
}

toolbar>toolbarbutton {
    margin-right: 10px !important;
    margin-left: 10px !important;
}

box,
hbox,
vbox,
toolbox {
    box-shadow: none !important;
}

splitter {
    border-color: rgba(127, 127, 127, 0.25) !important;
}

.mail-toolbox::after,
.contentTabToolbox::after {
    content: "";
    display: none !important;
    height: 0px !important;
}

menu[disabled="true"] label,
menuitem[disabled="true"] label,
.splitmenu-menuitem[disabled="true"] label,
menucaption[disabled="true"] label,
.chromeclass-toolbar menu[disabled="true"] label,
.chromeclass-toolbar menuitem[disabled="true"] label,
.chromeclass-toolbar .splitmenu-menuitem[disabled="true"] label,
.chromeclass-toolbar menucaption[disabled="true"] label {
    color: grey !important;
}

/* Search Box */
.searchBox, #view-task-edit-field, #unifinder-task-edit-field {
    background-color: var(--search-background-color);
    color: var(--search-text-color);
}

/* Search date filter */
#date-toggle {
    fill: #729fcf;
    color: #ffffff;
    background-image: url("chrome://messenger/skin/icons/timeline.svg") !important;
    background-color: transparent !important;
    -moz-context-properties: fill;
}

.facetious[type="date"][zoomedout="false"] .facet-date-zoom-out {
    background-color: var(--background-color) !important;
    background-image: url("chrome://messenger/skin/icons/zoomout-hover.png") !important;
}

.facetious[type="date"][zoomedout="false"] .facet-date-zoom-out:hover {
    background-color: var(--tree-background-color-selected) !important;
}

#date-toggle:hover {
    fill: var(--tree-background-color-selected) !important;
}

#facet-date text {
    fill: var(--headers-background-color);
}