/*
    HelloIoT is a dashboard creator for MQTT
    Copyright (C) 2017-2019 Adrián Romero Corchado.

    This file is part of HelloIot.

    HelloIot is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    HelloIot is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with HelloIot.  If not, see <http://www.gnu.org/licenses/>.
*/

.maincontainer {
    -fx-background-container: -fx-background;      
    -fx-separator-fill: -fx-box-border;
    
    -fx-border-unit: #e0e0e0;
    -fx-background-unit: #fafafa;
    
    -fx-button-fill: #f2f2f2;
    -fx-buttonarmed-fill: derive(-fx-button-fill, -30%);/*#a4a4a4; */
    -fx-buttonhover-fill:  derive(-fx-button-fill, -12%); /*#d0d0d0; */
    -fx-selected-fill: #b9f2fa;

    
    
    -fx-background-title: white;    
    -fx-text-fill-title: #353535;
    
    -fx-border-fill: #909090;

    -fx-info-fill: #707070;
    -fx-level-fill: #353535;          
}

.header {
    -fx-background-insets: 0,1 0 1 0;
    -fx-background-color: -fx-separator-fill, -fx-background-title;
}

.headertitle {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 18px;
    -fx-text-fill: -fx-text-fill-title;  
}

.headerbutton {
    -fx-background-color:  -fx-border-fill, -fx-button-fill;
    -fx-background-insets: 0, 1;
    -fx-background-radius: 16px, 15px;
    -fx-text-fill: -fx-text-fill-title;
    -fx-alignment: center;
    -fx-padding: 8px 12px 8px 12px; 
}

.headerbutton:armed {
    -fx-background-color: -fx-border-fill,  -fx-buttonarmed-fill;  
}

.menubutton {
    -fx-background-color:  transparent;     
}

.menubutton:armed  {
    -fx-background-color:  -fx-buttonarmed-fill;       
}

.currenttime {
    -fx-font-family: 'Source Sans Pro Regular';
    -fx-font-size: 16px;
    -fx-text-fill: -fx-info-fill;   
}

.labelsection {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 16px;
}

.unitinput {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 14px;   
}

.unitinputview {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 36px;    
}

.editviewsmall .unitinputview {
    -fx-font-size: 24px;
}

.comboinput {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 14px;    
}

.comboinput > .arrow-button {
    -fx-text-fill: -fx-text-fill-title;    
    -fx-background-color: -fx-button-fill;  
    -fx-background-insets: 1;
    -fx-alignment: center;
}

.comboinput > .arrow-button > .arrow {
    -fx-background-color: black;
    -fx-fill: -fx-buttoncontent-fill;
}

.unittitle {
    -fx-font-family: 'Source Sans Pro Regular';
    -fx-font-size: 16px;   
    -fx-text-fill: -fx-info-fill;   
}

.unitfooter {
    -fx-padding: 4px 0px 0px 0px;
    -fx-alignment: top-right;
}

.unitfooter .styledtext {
    -fx-fill: -fx-info-fill;
    -fx-font-family: 'Source Sans Pro Regular';
    -fx-font-size: 12px;       
}

.unitmaintext {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 36px;
}

.unitsempty {
    -fx-font-size: 48px;
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-text-fill: -fx-info-fill; 
}

.keypadtext {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 42px;     
    -fx-stroke: white;
    -fx-stroke-width: 1px;
    -fx-fill: linear-gradient(to bottom, #0000dd 0%, #000088 50%, #0000dd 100%);
}

.keypadbutton {
    -fx-text-fill: -fx-text-fill-title;
    -fx-pref-width: 100px;
    -fx-background-radius: 15;
    -fx-background-color:  -fx-border-fill, -fx-button-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center; 
}
.keypadbutton:armed {
    -fx-background-color: -fx-border-fill,  -fx-buttonarmed-fill;             
}
.keypadbuttonleft {
    -fx-background-radius: 15 2 2 15;
}
.keypadbuttoncenter {
    -fx-background-radius: 2;
}
.keypadbuttonright {
    -fx-background-radius: 2 15 15 2;
}
.keypadbuttondelete {
    -fx-background-radius: 2 2 2 2;    
    -fx-padding: 12px;    
}
.keypadinput {
    -fx-background-radius: 2 2 2 2;
    -fx-background-color:  -fx-border-fill, #efefef;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center; 
}

.unitbutton {
    -fx-text-fill: -fx-text-fill-title;    
    -fx-background-color:  -fx-border-fill, -fx-button-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center;
}
.unitbutton:armed {
    -fx-background-color: -fx-border-fill,  -fx-buttonarmed-fill;             
}

.unittogglebutton {
    -fx-text-fill: -fx-text-fill-title;    
    -fx-background-color:  -fx-border-fill, -fx-button-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center;
}
.unittogglebutton:armed {
    -fx-background-color: -fx-border-fill,  -fx-buttonarmed-fill;             
}
.unittogglebutton:selected {
    -fx-text-fill: -fx-text-fill-title;    
    -fx-background-color:  -fx-border-fill, -fx-buttonhover-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center;
}
.unittogglebutton:selected:armed {
    -fx-background-color: -fx-border-fill,  -fx-buttonarmed-fill;             
}


.buttonbase {
    -fx-font-family: 'Source Sans Pro Bold';
    -fx-font-size: 18px;
    -fx-text-fill: -fx-text-fill-title;
    -fx-background-radius: 10;
    -fx-background-color:  -fx-border-fill, -fx-button-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center;    
}
.buttonbase:armed {
    -fx-background-color: -fx-border-fill, -fx-buttonarmed-fill;             
}
.buttonup {
}
.buttondown {
}

/* Dialog styles */
.dialog-close-button:armed {
    -fx-background-color: -fx-buttonarmed-fill;
}
.dialog-title-text {
    -fx-font-size: 14;
    -fx-font-weight: bold;
    -fx-text-fill: -fx-text-fill-title;           
}
.dialog-title {
    -fx-background-color: -fx-separator-fill, -fx-background-title;
    -fx-background-insets: 0, 0 0 1 0;
    -fx-padding: 5 10 5 10;
}
.dialog-buttonlist .button {
    -fx-font-family: 'Source Sans Pro Regular';
    -fx-font-size: 18px;
    -fx-text-fill: -fx-text-fill-title;
    -fx-background-radius: 20;
    -fx-background-color:  -fx-border-fill, -fx-button-fill;  
    -fx-background-insets: 0, 1;
    -fx-alignment: center;        
}
.dialog-buttonlist .button:armed {
    -fx-background-color: -fx-border-fill, -fx-buttonarmed-fill;             
}
.dialog-buttonlist .button:default {
    -fx-background-color: -fx-border-fill, -fx-selected-fill;    
}
.dialog-buttonlist .button:default:armed {
    -fx-background-color: -fx-border-fill, derive(-fx-selected-fill, 40%);         
}
.dialog-label {
    -fx-font-family: 'Source Sans Pro Regular';
    -fx-text-fill: -fx-info-fill;
    -fx-font-size: 20px;    
}

/* Slider styles */
.slider .thumb {
    -fx-background-color: -fx-border-fill, -fx-button-fill;
    -fx-background-insets: 0, 1;
    -fx-background-radius: 1.5em; /* makes sure this remains circular */
    -fx-padding: 1.5em /*1.583333em*/;    
}
.slider .thumb:pressed {
    -fx-background-color: -fx-border-fill, -fx-buttonarmed-fill;
}
.slider .track {
    -fx-background-color: -fx-border-fill,  derive(-fx-button-fill, 15%);
    -fx-background-insets: 0, 1;
    -fx-background-radius: 0.25em, 0.25em, 0.166667em;  
    -fx-padding: 1.0em;   
}

/* Progresss style */
.unitbar > .bar {
    -fx-background-insets: 1;    
    -fx-background-radius: 2;
    -fx-padding: 0.75em;
}
.unitbar:indeterminate > .bar {
    -fx-background-color: linear-gradient(to left, transparent, -fx-accent);
}
.unitbar > .track {
    -fx-background-color: -fx-border-fill,  derive(-fx-button-fill, 20%);
    -fx-background-insets: 0, 1;    
    -fx-background-radius: 2;    
}

.messagestitle {
    -fx-font-family: 'Source Sans Pro Regular';   
}

.unittoolbar {
    -fx-background-color: -fx-background-container;
}

.messageview {
    -fx-font-family: 'Source Code Pro Bold';
    -fx-font-size: 14px;  
}

.messagefooter {
    -fx-font-family: 'Source Sans Pro Regular';    
}

.badge {
    -fx-font-family: 'Source Sans Pro Regular';    
}