/* ==UserStyle==
@name           [Oli Bros] Customisation: Cloudflare
@namespace      The Oliver Bros
@version        0.0.9
@description    Dark theme for Cloudflare dashboard
==/UserStyle== */

@-moz-document domain("dash.cloudflare.com") {

/*==============================
//	VARIABLES
//============================*/

:root {
    --border-color: #666;
}

/*==============================
//	MAIN
//============================*/

html, body, button {
    color: #EEE;
}

body,
.c_b,
.c_dj {
    background-color: #333;
}

/*==============================
//	HEADER
//============================*/

/* Logo */
a[data-testid="link-homepage"] svg path[fill="#404242"] {
    fill: #fff;
}

/*==============================
//	NAV (BOTH)
//============================*/

/* Both navs - text */
.c_dw {
    color: #CCC;
}

/* Both navs - active page */
.c_fk {
    color: #fff;
}

/*==============================
//	NAV (MAIN)
//============================*/

/* Main nav */
nav[data-testid="zone-navigation"].c_dm {
    background-color: #333;
}

/* Main nav text */
.c_dv {
    color: #EEE;
}

/* Main nav - hover text */
.c_eg:hover {
    color: #FFF
}

/* Main nav icon */
nav[data-testid="zone-navigation"] .c_aj {
    color: #fff;
}

/* Main nav - active icon background */
.c_fj {
    background-color: #fff;
}

/* Main nav icon */
nav[data-testid="zone-navigation"] .c_fj .c_aj {
    color: rgb(44, 124, 176)
}

/*==============================
//	NAV (SUB)
//============================*/

/* Sub nav */
.c_dn {
    background-color: #444;
}

/*==============================
//	GENERIC
//============================*/


/* Module header */
.mod-header {
    background-color: #444;
}

/* Module right-hand boxes */
.c_dm {
    background-color: #444;
}

/* DNS records box */
.c_ol {
    border-color: var(--border-color);
}

/* Borders of multiple elements */
.c_l,
.c_gg,
.c_gy,
.c_fw,
.c_agu,
.c_mz,
.c_bfb,
.c_cu{
    border-color: var(--border-color)
}

/* Dialog boxes */
.c_hz {
    background-color: #333;
}

/* Analytics and firewall boxes */
.c_mk {
    border-color: var(--border-color)
}

/*==============================
//	TEXT
//============================*/

.c_e {
    color: #EEE;
}

.c_by {
    color: #CCC !important;
}

.c_il {
    color: #FFF;
}


/*==============================
//	ANALYTICS / MINI CHARTS
//============================*/

/* Analytics titles*/
.c_aeu {
    color: #EEE;
}

/* Analytics main numbers */
.c_fj {
    color: #FFF;
}

/* Analytics data point title and firewall event item */
.c_ln,
.c_ps,
.c_pf {
    color: #DDD;
}

/* Mini bar chart */
div[data-hover-hide="true"] > div > div {
    background-color: #222;
}

/* Mini bar chart hover */ 
.c_bb:hover {
    background-color: #222;
}

/*==============================
//	SVG GRAPHS
//============================*/

/* Graph axis labels */
svg text[color="#f7f7f8"] {
    fill: #EEE !important;
}

/* Graph axis lines */
svg line[stroke="rgba(0,0,0,0.1)"] {
    stroke: rgba(255,255,255,0.1);
}


/*==============================
//	TABLES
//============================*/

/* Table even rows */
table {
    background-color: #333;
}

thead {
    background-color: #333;
}

thead, thead a {
    color: #FFF;
}

/* Table odd rows */
.table-striped tbody>tr:nth-child(odd)>td, .table-striped tbody>tr:nth-child(odd)>th {
    background-color: #444;
}

}