/* link styles */
a {
    color:#0be;
}

a:hover,
a:focus {
    color:#0be;
}

/* button styles */
/* default buttons (grey in default theme) */
    .btn-default {
        color:#000;
        background-color:#b7b7b7;
    }

    /* default hover/active/focused */
    .btn-default:focus,
    .btn-default.focus,
    .btn-default:hover,
    .btn-default:active,
    .btn-default.active,
    .open > .dropdown-toggle.btn-default,
    .btn-default:active:hover,
    .btn-default.active:hover,
    .open > .dropdown-toggle.btn-default:hover,
    .btn-default:active:focus,
    .btn-default.active:focus,
    .open > .dropdown-toggle.btn-default:focus,
    .btn-default:active.focus,
    .btn-default.active.focus,
    .open > .dropdown-toggle.btn-default.focus {
        color:#000;
        background-color:#c8c8c8;
    }

    /* default disabled */
    .btn-default.disabled,
    .btn-default[disabled],
    fieldset[disabled] .btn-default,
    .btn-default.disabled:hover,
    .btn-default[disabled]:hover,
    fieldset[disabled] .btn-default:hover,
    .btn-default.disabled:focus,
    .btn-default[disabled]:focus,
    fieldset[disabled] .btn-default:focus,
    .btn-default.disabled.focus,
    .btn-default[disabled].focus,
    fieldset[disabled] .btn-default.focus,
    .btn-default.disabled:active,
    .btn-default[disabled]:active,
    fieldset[disabled] .btn-default:active,
    .btn-default.disabled.active,
    .btn-default[disabled].active,
    fieldset[disabled] .btn-default.active {
        color:#acacac;
        background-color:#ddd;
    }

/* primary buttons (red in default theme) */
    .btn-primary {
        color:#fff;
        background-color:#bb2124;
    }
    /* primary hover/active/focused */
    .btn-primary:focus,
    .btn-primary.focus,
    .btn-primary:hover,
    .btn-primary:active,
    .btn-primary.active,
    .open > .dropdown-toggle.btn-primary,
    .btn-primary:active:hover,
    .btn-primary.active:hover,
    .open > .dropdown-toggle.btn-primary:hover,
    .btn-primary:active:focus,
    .btn-primary.active:focus,
    .open > .dropdown-toggle.btn-primary:focus,
    .btn-primary:active.focus,
    .btn-primary.active.focus,
    .open > .dropdown-toggle.btn-primary.focus {
        color:#fff;
        background-color:#d31115;
    }
    /* primary disabled */
    .btn-primary.disabled,
    .btn-primary[disabled],
    fieldset[disabled] .btn-primary,
    .btn-primary.disabled:hover,
    .btn-primary[disabled]:hover,
    fieldset[disabled] .btn-primary:hover,
    .btn-primary.disabled:focus,
    .btn-primary[disabled]:focus,
    fieldset[disabled] .btn-primary:focus,
    .btn-primary.disabled.focus,
    .btn-primary[disabled].focus,
    fieldset[disabled] .btn-primary.focus,
    .btn-primary.disabled:active,
    .btn-primary[disabled]:active,
    fieldset[disabled] .btn-primary:active,
    .btn-primary.disabled.active,
    .btn-primary[disabled].active,
    fieldset[disabled] .btn-primary.active {
        color:#acacac;
        background-color:#ddd;
    }

/* link buttons, a simple hyperlink-styled button */
    .btn-link {
        color:#bb2124;
    }
    /* link hover/active/focused */
    .btn-link:focus,
    .btn-link.focus,
    .btn-link:hover,
    .btn-link:active,
    .btn-link.active,
    .open > .dropdown-toggle.btn-link,
    .btn-link:active:hover,
    .btn-link.active:hover,
    .open > .dropdown-toggle.btn-link:hover,
    .btn-link:active:focus,
    .btn-link.active:focus,
    .open > .dropdown-toggle.btn-link:focus,
    .btn-link:active.focus,
    .btn-link.active.focus,
    .open > .dropdown-toggle.btn-link.focus {
        color:#d31115;
    }



/* form styles */
    .form-control {
        color:#222;
        background-color:#fff;
        border-color:#b7b7b7;
    }

    .form-control:focus {
        border-color:#444;
    }

    /* default placeholder text colors */
    .form-control::-moz-placeholder {
        color:#999;
    }
    .form-control:-ms-input-placeholder {
        color:#999;
    }
    .form-control::-webkit-input-placeholder {
        color:#999;
    }


    /* generic error/invalid form colours */
    .has-error .help-block,
    .has-error .control-label,
    .has-error .radio,
    .has-error .checkbox,
    .has-error .radio-inline,
    .has-error .checkbox-inline,
    .has-error.radio label,
    .has-error.checkbox label,
    .has-error.radio-inline label,
    .has-error.checkbox-inline label {
        color:#bb2124;
    }
    .has-error .form-control,
    .form-control.ng-invalid {
        border-color:#bb2124;
    }
    .has-error .form-control:focus {
        border-color:#671215;
    }


/* buttons attached to input boxes */
    .input-group-btn .btn {
        border-color:#b7b7b7;
        color:#444;
        background-color:#fff;
    }

    .input-group-btn .btn:hover,
    .input-group-btn .btn:active,
    .input-group-btn .btn:focus {
        color:#444;
        background-color:#e0e0e0;
    }

    .input-group-btn .btn[disabled],
    .input-group-btn .btn[disabled]:hover,
    .input-group-btn .btn[disabled]:active,
    .input-group-btn .btn[disabled]:focus {
        border-color:#b7b7b7;
    }

    .has-error .input-group-btn .btn {
        border-color:#bb2124;
    }



/* generic table styles */
    .table > thead > tr > th {
        border-bottom-color:#ddd;
    }

    .table > thead > tr > th,
    .table > tbody > tr > th,
    .table > tfoot > tr > th,
    .table > thead > tr > td,
    .table > tbody > tr > td,
    .table > tfoot > tr > td {
        border-top-color:#ddd;
    }


/* site styles */
body {
    color:#000;
    background-color:#f4f4f4;
}

/* dropdown menu styles */
.dropdown-menu {
    background-color:#fff;
}

.dropdown-menu > li > a {
    color:#000;
    border-bottom-color:#eaeaea;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    color:#000;
    background-color:#eaeaea;
}


.dropdown-header {
    color:#acacac;
}

/* unchecked checkbox style */
.dropdown-checkboxes > .checkable > a span.unchecked {
    background-color:#fff;
    color:#999;
}
/* checked checkbox style */
.dropdown-checkboxes > .checkable > a span.checked {
    background-color:#fff;
}


/* navbar */
.navbar-default {
    background-color:#000;
}

.navbar-default .navbar-nav > li > a {
    background-color:#000;
    color:#fff;
    border-left-color:#555;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color:#fff;
    background-color:#671215;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
    background-color:#fff;
    color:#000;
}

/* the username has no anchor; it needs to be styled independently */
.navbar-default .navbar-nav > li.nav-user > span {
    background-color:#000;
    color:#fff;
    border-left-color:#555;
}

/* colored navbar items */
/* alerts */
.navbar-default .navbar-nav > li.nav-alerts > a {
    color:#f2c811;
}


/* brand text/image */
.navbar-default .navbar-brand {
    color:#fff;
}


.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:active,
.navbar-default .navbar-brand:focus {
    color:#fff;
}

/* to display a logo instead of text, set
    span.text to display:none;
        and
    span.logo to display:block;
*/
.navbar-default .navbar-brand span.text {
    /*display:none;*/
}

.navbar-default .navbar-brand span.logo {
    /*display:block;*/
}


/* toolbar */
.toolbar {
    background-color:#444;
    border-bottom-color:#d9d9d9;
    color:#fff;
}

.toolbar .nav > li > a,
.toolbar .nav > li > button,
.toolbar .nav > li > .btn-upload {
    background-color:#444;
    color:#fff;
}

.toolbar .nav > li > a:hover,
.toolbar .nav > li > a:focus,
.toolbar .nav > li > button:hover:enabled,
.toolbar .nav > li > button:focus:enabled,
.toolbar .nav > li > .btn-upload:hover {
    background-color:#555;
}

.toolbar .nav > li > a.active,
.toolbar .nav > li > a.active:hover,
.toolbar .nav > li > a.active:focus {
    background-color:#bb2124;
}

.toolbar .nav > .open > a,
.toolbar .nav > .open > a:focus,
.toolbar .nav > .open > a:hover {
    background-color:#fff;
    color:#000;
}


/* search box */
.toolbar .nav-search {
    border-color:#333;
}

.toolbar .nav-search .input-group {
    border-color:#333;
}

.toolbar .nav-search input {
    background-color:#333;
    color:#fff;
}




/* form placeholder text color */
/* have to declare 'em separately because... browsers.... */
.toolbar .nav-search input::-webkit-input-placeholder {
    color:#999;
}
.toolbar .nav-search input::-moz-placeholder {
    color:#999;
}
.toolbar .nav-search input:-ms-input-placeholder {
    color:#999;
}



.toolbar .nav-search input:focus {
    color:#fff;
}

.toolbar .nav-search button {
    color:#fff;
    background-color:#333;
}

.toolbar .nav-search button:hover,
.toolbar .nav-search button:focus,
.toolbar .nav-search button:active {
    color:#fff;
    background-color:#444;
}

.toolbar .nav-move button:disabled,
.toolbar .nav-delete button:disabled {
    background-color: transparent;
    color: #acacac;
    cursor: not-allowed;
}

/* tooltips */
.tooltip-inner {
    background-color:#fff;
    color:#222;
}

/* breadcrumbs */
section.breadcrumbs {
    background-color:#fff;
}

    section.breadcrumbs .links a {
        color:#00aeef;
    }

    section.breadcrumbs .links a:hover,
    section.breadcrumbs .links a:active,
    section.breadcrumbs .links a:focus {
        color:#00aeef;
    }

    section.breadcrumbs .links .separator {
        color:#888;
    }

    section.breadcrumbs .links .current {
        color:#000;
    }



/* browse/favorites styles */
    /* header text (current folder; section (KPIs, Reports) titles) */
    div.browser header h2 {
        color:#222;
    }

        /* number of items label */
        div.browser header .count {
            color:#acacac;
        }





/* tile context menu button (...) */
/* and 'favorite' star */
/* these styles can be overridden on a per-item type basis *
/* tile context menu/favorite */
.tiles a.context {
    color:#000;
    background-color:transparent;
}

.tiles a.context:hover,
.tiles a.context:focus,
.tiles a.context:active {
    background-color:rgba(255,255,255,0.3);
}


/* modal dialog styles */
.modal-backdrop {
    background-color:#fff;
}

.modal-content {
    border-color:#c8c8c8;
    background-color:#fff;
    color:#444;
}

    .modal-header .close {
        color:#000;
    }

/* sometimes a dialog box is used as a folder browser */
    .modal-browse .modal-body.browse {
        background-color:#eaeaea;
    }

    .modal-browse section.folders {
        background-color:#fff;
    }


/* document header */
section.header {
    background-color:#fff;
    border-bottom-color:#e3e3e3;
}

    section.header  header h2 {
        color:#222;
    }




/* folder tiles */
/* the background/hover color is applied to the <li> element for folders */
section.folders .tiles a.tile {
    color:#000;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.folders .tiles a.tile:hover,
section.folders .tiles a.tile:active,
section.folders .tiles a.tile:focus {
    border-color:#000;
}

/* folders context menu */
section.folders .tiles a.context {
    color:#444;
}

section.folders .tiles a.context:hover,
section.folders .tiles a.context:focus,
section.folders .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}




/* KPI tiles */
/* good -- usually green */
.kpi-good {
    background-color:#4fb443;
}
/* bad -- usually red */
.kpi-bad {
    background-color:#de061a;
}
/* neutral -- usually yellow/amber */
.kpi-neutral {
    background-color:#d9b42c;
}
/* none -- usually grey */
.kpi-none {
    background-color:#333;
}

/* KPI tile text color */
.kpi a.tile {
    color:#fff;
}

/* outer tile border */
.kpi a.tile .overlay {
    border-color:#000;
    opacity:0.15;
}

/* inner tile border */
.kpi a.tile .overlay .inner {
    border-color:#fff;
}

/* kpis context menu */
.kpi a.context {
    color:#fff;
}

.kpi a.context:hover,
.kpi a.context:focus,
.kpi a.context:active {
    color:#fff;
    background-color:rgba(255,255,255,0.2);
}


/* mobile reports */
section.mobile-reports .tiles a.tile {
    color:#222;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.mobile-reports .tiles a.tile:hover,
section.mobile-reports .tiles a.tile:active,
section.mobile-reports .tiles a.tile:focus {
    color:#000;
    border-color:#000;
}

section.mobile-reports .tiles a.tile .text {
    border-bottom-color:#d9d9d9;
}

/* mobile reports context menu */
section.mobile-reports .tiles a.context {
    color:#444;
}

section.mobile-reports .tiles a.context:hover,
section.mobile-reports .tiles a.context:focus,
section.mobile-reports .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}



/* reports */
section.reports .tiles a.tile {
    color:#000;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.reports .tiles a.tile:hover,
section.reports .tiles a.tile:active,
section.reports .tiles a.tile:focus {
    border-color:#000;
}


/* reports context menu */
section.reports .tiles a.context {
    color:#444;
}

section.reports .tiles a.context:hover,
section.reports .tiles a.context:focus,
section.reports .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}




/* data sources */
section.datasources .tiles a.tile {
    color:#000;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.datasources .tiles a.tile:hover,
section.datasources .tiles a.tile:active,
section.datasources .tiles a.tile:focus {
    border-color:#000;
}

/* data sources context menu */
section.datasources .tiles a.context {
    color:#444;
}

section.datasources .tiles a.context:hover,
section.datasources .tiles a.context:focus,
section.datasources .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}


/* resources */
section.resources .tiles a.tile {
    color:#000;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.resources .tiles a.tile:hover,
section.resources .tiles a.tile:active,
section.resources .tiles a.tile:focus {
    border-color:#000;
}

/* resources context menu */
section.resources .tiles a.context {
    color:#444;
}

section.resources .tiles a.context:hover,
section.resources .tiles a.context:focus,
section.resources .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}

/* resources */
section.datasets .tiles a.tile {
    color:#000;
    background-color:#fff;
    border-color:#d9d9d9;
}

section.datasets .tiles a.tile:hover,
section.datasets .tiles a.tile:active,
section.datasets .tiles a.tile:focus {
    border-color:#000;
}

/* datasets context menu */
section.datasets .tiles a.context {
    color:#444;
}

section.datasets .tiles a.context:hover,
section.datasets .tiles a.context:focus,
section.datasets .tiles a.context:active {
    color:#000;
    background-color:rgba(0,0,0,0.1);
}


/* Search results */
    .search header.message {
        background-color:#fff;
        border-color:#e3e3e3;
    }

        .search header.message button.exit {
            border-color:#e3e3e3;
            color:#444;
        }
            .search header.message button.exit:hover,
            .search header.message button.exit:focus,
            .search header.message button.exit:active {
                background-color:#e3e3e3;
            }

        /* 'showing results for:' label */
        .search header.message p.text {
            color:#aaa;
        }

            /* message search query */
            .search header.message p.text b {
                color:#000;
            }

/* Search results: folder tile overrides */
    .search section.folders {
        background-color:transparent;
    }
        .search section.folders .tiles a.tile {
            color:#000;
            background-color:#fff;
            border-color:#d9d9d9;
        }

        .search section.folders .tiles a.tile:hover,
        .search section.folders .tiles a.tile:active,
        .search section.folders .tiles a.tile:focus {
            borde-color:#000;
        }

        .search section.folders .tiles a.context {
            color:#454545;
        }

        .search section.folders .tiles a.context:hover,
        .search section.folders .tiles a.context:focus,
        .search section.folders .tiles a.context:active {
            color:#000;
            background-color:rgba(0,0,0,0.1);
        }


/* popover */
    /* the little box that appears when a tile's context button is clicked */

    /* smaller form-factors render this box fullscreen */
    /* this is the semi-opaque background behind the popover */
    .popover-wrapper.fullscreen {
        background-color:rgba(0,0,0,0.68);
    }

    .popover {
        border-color:#eaeaea;
        background-color:#fff;
    }

    /*
    /* a popover's stem is the little arrow pointing to the context button on an item tile */

    /* .popover-wrapper.top should have color values the same as .metadata footer background-color (see below) */
    .popover-wrapper.top .popover {
        border-bottom-color:#f4f4f4;
    }
    .popover-wrapper.top .stem {
        border-top-color:#f4f4f4;
    }
    /* .popover-wrapper.bottom should have color values the same as the .popover background-color (see above) */
    .popover-wrapper.bottom .popover {
        border-top-color:#fff;
    }
    .popover-wrapper.bottom .stem {
        border-bottom-color:#fff;
    }


    /* metadata: the content of the popover */
    section.metadata button.close {
        color:#000;
    }

    section.metadata footer {
        background-color:#fff;
    }

            section.metadata footer a {
                color:#000;
            }

            section.metadata footer a:hover,
            section.metadata footer a:active,
            section.metadata footer a:focus {
                background-color: #f4f4f4;
            }

    /* fullscreen popovers display the footer links stacked vertically, not horizontally */
    .popover-wrapper.fullscreen .metadata footer a {
        border-top-color:#eaeaea;
    }




/* management section */
/* when clicking on a tile's 'manage' link, the user is directed
to the management section, itself containing several subsections */
section.management header {
    border-bottom-color:#e3e3e3;
    background-color:#fff;
}

    section.management header h2 {
        color:#000;
    }


/* management subsections have a sidebar containing links to other subsections */
section.management section.sidebar {
    background-color:#444;
}

    section.management section.sidebar nav button {
        color:#fff;
    }

    section.management section.sidebar nav li button:hover,
    section.management section.sidebar nav li button:focus {
        background-color:#555;
        color:#fff;
    }

    section.management section.sidebar nav li.active button{
        background-color:#555;
        border-left-color:#bb2124;
    }

    section.management section.sidebar nav li button:disabled {
        color:#acacac;
    }

/* the 'details' area of each management subsection is where the main content is rendered */
section.management > .content .details {
    background-color:#eaeaea;
}


/* some subsections have an 'action' toolbar above the details area */
    section.management .actions {
        background-color:#eaeaea;
        border-bottom-color:#c8c8c8;
    }

        section.management .actions li {
            border-right-color:#c8c8c8;
        }


        section.management .actions a,
        section.management .actions .btn-replace {
            color:#444;
            background-color:transparent;
            border-right-color:#c8c8c8;
        }

        section.management .actions a:hover,
        section.management .actions a:active,
        section.management .actions a:focus,
        section.management .actions .btn-replace:hover,
        section.management .actions .btn-replace:active,
        section.management .actions .btn-replace:focus {
            color:#444;
            background-color:#fff;
        }


/* some subsections have specific background colors */
section.management .cache-refresh-plans,
section.management .security,
section.management .security-edit,
section.management .subscriptions,
section.management .subscriptions-edit,
section.management .site-settings,
section.management .site-general,
section.management .schedules {
    background-color:#f8f8f8;
}

/* branding & runtime styles */
    /* for aesthetic purposes, the brand package name/runtime version is rendered in a disabled input field */
    /* but it shouldn't appear greyed out */
    section.management .branding .current input[disabled],
    section.management .runtime .current input[disabled] {
        color:#222;
        background-color:#fff;
    }



/* KPI creation/editing subsection */
/* override the Bootstrap default colors */
section.management .editkpi input,
section.management .editkpi select,
section.management .editkpi textarea,
section.management .editkpi option {
    color:#222;
}

/* for aesthetic purposes, a 'not set' value is rendered with a semi-opaque disabled input field */
section.management .editkpi .form-inactive .form-control[disabled] {
    background-color:#fff;
    opacity:0.25;
}

/* also for aesthetic purposes, a dataset field or trend that has yet to be set is rendered with a disable input field */
/* this input field contains the text 'not set' and urges the user to set a value */
section.management .editkpi .form-dataset .form-control[disabled] {
    color:#222;
    background-color:#fff;
}

/* Visualization selector elements */
/* the glyphs are taken from a 32-bit PNG spritesheet which cannot be customized. The foreground colour is white */
/* therefore a dark background should be used */
ul.visualizations li a {
    background-color:#888;
}

ul.visualizations li a.enabled:hover {
    background-color:#555;
}

/* the <i> element is rendered as a colored frame around a selected glyph */
ul.visualizations li i {
    border-color:#bb2124;
}

ul.visualizations li.selected a {
    background-color:#333;
}

/* some form elements have tooltips/hints denoted by a question mark */
.has-tooltip span.hint {
    color: #fff;
    background-color: #5bc0de;
}


/* the browse for dataset dialog box uses many styles defined above in the dialog box section but it still requires some specific styles */
/* once a dataset is picked, the user is presented with a table from which they can select the appriopriate column */
.modal-browse section.select {
    border-top-color:#eaeaea;
}

    .modal-browse section.select th.selected,
    .modal-browse section.select td.selected {
        background-color:#f4f4f4;
    }



/* ***************************************************************** */
/* mobile-only styles */
@media (max-width: 767px) {
    /* hamburger toggle button */
    .mobilenav-toggle,
    .mobilenav-toggle:focus {
        color:#fff;
        background-color:#000;
    }

    .mobilenav-toggle:hover {
        color:#fff;
        background-color:#671215;
    }

    .mobilenav-toggle.open,
    .mobilenav-toggle.open:focus,
    .mobilenav-toggle.open:hover {
        color:#000;
        background-color:#fff;
    }

    .dropdown-menu {
        border-bottom-color:#444;
    }

    /* alerts icon in dropdown menu */
    .dropdown-menu > li.nav-alerts > a > .glyphui-warning {
        color:#f2c811;
    }

    .dropdown-menu .glyphui-chevron-right.pull-right {
        color:#acacac;
    }
}