/*********
 * Icons *
 *********/

 .flat .flat-error-o,
 .flat .flat-help {
     color: #2196f3;
     font-size: 17px;
     vertical-align: middle;
     cursor: help;
 }

 .flat .flat-error-o {
     color: #e700d4;
 }

/************
 * Logentry *
 ************/

.flat .Logentry {
    border: 1px solid #DDDDDD;
    border-left: 5px solid #DDDDDD;
    background-color: #fff;
    color: inherit;
    color: initial;
    padding: 8px;
    padding-left: 40px;
    overflow: hidden;
    position: relative;
    transition: border-left-width 250ms,
                padding 250ms;
    -moz-transition: none;
    transform: translate3d(0, 0, 0);
}

.flat .Logentry::before {
    font-family: 'flat-icon';
    position: absolute;
    left: 10px; /* center align */
    font-size: 20px;
    top: 18px;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: left 250ms, font-size 250ms;
    -moz-transition: none;
    /*-moz-transition: font-size 250ms;*/

}

.flat .Logentry:hover,
.flat .Logentry:focus {
    border-left-width: 8px;
    padding-left: 37px;
    /*padding-right: 6px;*/
}


.flat .Logentry:hover::before,
.flat .Logentry:focus::before {
    left: 4px;
    font-size:26px;
}


.flat .Logentry .Time,
.flat .Logentry .sideNote {
    float: right;
    font-size: 0.9em;
    color: #AAA;
}

 .flat .LogentryFull {
     margin: -8px -9px 10px;
 }

 .flat .LogentryPadded {
     padding-top: 1.5rem;
     padding-bottom: 1.5rem;
 }

.flat .LogentryPadded::before {
    top: 28px;
}

/* Message */
.flat .Logentry_message {
    border-left-color: #2aa252;
}

.flat .Logentry_message::before {
    color: #2aa252;
    content: "\f00c"; /* √ */
}

/* Info */
.flat .Logentry_info {
    border-left-color: #2196f3;
}

.flat .Logentry_info::before {
    color: #2196f3;
    font-weight: bold;
    font-family: 'Courier New', monospace;
    content: "i"; /* I */
}

/* Warning */
.flat .Logentry_warning {
    border-left-color: #f5c33c;
}

.flat .Logentry_warning::before {
    color: #f5c33c;
    content: "\f018"; /* ( ! ) */
}

/* Partial */
.flat .Logentry_partial {
    border-left-color: #f5c33c;
}

.flat .Logentry_partial::before {
    color: #f5c33c;
    content: "\f017"; /* (!) */
}

/* Error */
.flat .Logentry_error {
    border-left-color: #e77e23;
}

.flat .Logentry_error::before {
    color: #e77e23;
    content: "\f019"; /* /!\ */
}

/* confirm */
.flat .Logentry_confirm {
    border-left-color: #e700d4;
}

.flat .Logentry_confirm::before {
    color: #e700d4;
    content: "\f018"; /* ( ! ) */
}

/* Fatal */
.flat .Logentry_fatal {
    border-left-color: #d03e2f;
}

.flat .Logentry_fatal::before {
    color: #d03e2f;
    content: "\f019"; /* <!> */
}

/************
 * LEDs *
 ************/

.LED {
    width: 16px;
    height: 16px;
    border: 1px solid #999;
    border-top-color: #666;
    border-bottom-color: #AAA;
    border-radius: 8px;
    background-color: #CCC;
    background: radial-gradient(ellipse at center 6px, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.3) 30%, rgba(255, 255, 255, 0) 40%, rgba(0, 0, 0, 0.5) 85%, rgba(0, 0, 0, 0.6) 200%);
    background-repeat: no-repeat;
    transition: background-color 1s;
}

.LED.green {
    background-color: #adff2f;
    box-shadow: 0px 0px 6px #adff2f;
}

.LED.amber {
    background-color: #ffef2f;
    box-shadow: 0px 0px 6px #ffef2f;
}

.LED.pulsating {
    background-color: #d6d6d6;
    box-shadow: 0px 0px 6px #d6d6d6;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% { transform: scale(0.9) }
    70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(#d6d6d6, 0); }
    100% { transform: scale(0.9); box-shadow: 0 0 0 0 rgba(#d6d6d6, 0); }
}

.LED.red {
    background-color: orangered;
    box-shadow: 0px 0px 6px orangered;
}

/************
 * Notifier *
 ************/

.flat .dcdNotifier {
    border: 0;
}

.flat .dcdNotifier .dcdMenuNoItemCenter {
    padding: 0;
}

.flat .dcdNotifierPane {
    margin: 0;
    max-height: 320px;
    overflow: auto;
    padding: 0;
    width: 300px;
}

.flat .dcdNotifierButton {
    margin: 0;
}

.flat .dcdNotifierButton .dijitButtonText {
    box-sizing: border-box;
    text-align: center;
    width: 100%;
}

.flat .dcdNotifierButton .dijitButtonNode:hover,
.flat .dcdNotifierButton .dijitButtonNode:focus,
.flat .dcdNotifierButton .dijitButtonNode:active {
    transform: none;
}

.level_message::after { background-color: #2aa252; }
.level_info::after { background-color: #2196f3; }
.level_warning::after { background-color: #f5c33c; }
.level_error::after { background-color: #e77e23; }
.level_fatal::after { background-color: #d03e2f; }


/**********************************
 * Inline Notifier (UserSettings) *
 **********************************/

.dcdInlineNotification::before {
    font-family: 'flat-icon';
    font-size: 0.85rem;
    font-weight: bold;
    margin-right: 0.5rem;
}

.dcdInlineNotification.info {color: #2196f3;}
.dcdInlineNotification.message {color: #2aa252;}
.dcdInlineNotification.warning {color: #f5c33c;}
.dcdInlineNotification.progress {color: #f5c33c;}
.dcdInlineNotification.error {color: #e77e23;}
.dcdInlineNotification.fatal {color: #d03e2f;}

.dcdInlineNotification.info::before {  content: "\f04a"; /* I */ }
.dcdInlineNotification.message::before {content: "\f00c"; /* √ */ }
.dcdInlineNotification.warning::before {content: "\f018"; /* (!) */ }
.dcdInlineNotification.progress::before {content: "\f01d"; /* (~)*/ }
.dcdInlineNotification.error::before {content: "\f019"; /* /!\ */ }
.dcdInlineNotification.fatal::before {content: "\f019"; /* <!> */ }


/**********
 * Colors *
 **********/

.color-red { color: #d03e2f; }
.color-green { color: #2aa252; }

.alarm-ok {}
.alarm-firing {
    color: orangered
}