:root {
  --blue: #1a73e8; /* deeper, less saturated */
  --dark-blue: #1558b0;
  --red: #e53935;
  --dark-red: #b71c1c;
  --moon-grey: #f0f0f0;

  --icon-red: #c0392b;
  --icon-orange: #e67e22;
  --icon-yellow: #f1c40f;
  --icon-green: #27ae60;
  --icon-blue: #2980b9;
  --icon-violet: #8e44ad;

  --input-red: rgb(255, 230, 230); /* gentler than before */
  --input-green: rgb(224, 247, 230); /* soft green */

  --item-selected: #000; /* better contrast on light bg */

  --action: rgb(66, 66, 66); /* softer than dark steel blue */

  --background: rgb(245, 245, 245); /* softened white */
  --surfacePrimary: rgb(255, 255, 255);
  --surfaceSecondary: rgb(235, 235, 235);
  --divider: rgba(0, 0, 0, 0.04);
  --iconPrimary: var(--icon-blue);
  --iconSecondary: rgb(80, 80, 80);
  --iconTertiary: rgb(180, 180, 180);
  --textPrimary: rgb(80, 80, 80); /* softer text */
  --textSecondary: rgb(30, 30, 30);
  --hover: rgba(0, 0, 0, 0.05);
  --borderPrimary: rgba(0, 0, 0, 0.07);
  --borderSecondary: rgba(0, 0, 0, 0.15);
  --dividerPrimary: rgba(0, 0, 0, 0.05);
  --dividerSecondary: rgba(0, 0, 0, 0.1);
}

:root.dark {
  --input-red: rgb(90, 30, 30);
  --input-green: rgb(20, 90, 50);

  --action: rgb(230, 230, 230);

  --background: rgb(5, 5, 5);
  --surfacePrimary: rgb(12, 12, 12);
  --surfaceSecondary: rgb(18, 18, 18);
  --textPrimary: rgba(255, 255, 255, 0.6);
  --textSecondary: rgba(255, 255, 255, 0.85);
  --divider: rgba(255, 255, 255, 0.04);
  --iconPrimary: rgb(220, 220, 220);
  --iconSecondary: rgb(160, 160, 160);
  --iconTertiary: rgb(100, 100, 100);
  --hover: rgba(255, 255, 255, 0.03);
  --borderPrimary: rgba(255, 255, 255, 0.05);
  --borderSecondary: rgba(255, 255, 255, 0.10);
  --dividerPrimary: rgba(40, 40, 40, 0.2);
  --dividerSecondary: rgba(40, 40, 40, 0.3);
}

.input {
  border-radius: .5em;
}

.button {
  border-radius: .5em;
}

.card {
  border-radius: .5em;
}

.dashboard .row .column {
  width: 100%;
}

/* remove a bit of padding from the file list entries */
#listing.list .item {
  padding: 0.7em;
}

#listing.mosaic .item {
    border-radius: .5em;
}

/* packed files - colorize and change icon */
#listing .item[aria-label$=".7z"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".7z"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".7z"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".arj"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".arj"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".arj"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".zip"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".zip"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".zip"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".gz"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".gz"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".gz"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".tar"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".tar"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".tar"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".bz"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".bz"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".bz"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".bz2"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".bz2"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".bz2"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".xz"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".xz"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".xz"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

#listing .item[aria-label$=".tbz"] div i {
  color: #a268a1;
}
#listing .item[aria-label$=".tbz"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".tbz"] .material-icons::before {
  content: "archive";
  visibility: visible;
}

/* office files */
/* PDF - colorize and change icon /*
/* Note: This is yellow because I use SumatraPDF */
#listing .item[aria-label$=".pdf"] div i {
  color: #ffee00;
}
#listing .item[aria-label$=".pdf"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".pdf"] .material-icons::before {
  content: "picture_as_pdf";
  visibility: visible;
}

/* word processors - colorize and change icon */
/* Word */
#listing .item[aria-label$=".doc"] div i {
  color: #185abd;
}
#listing .item[aria-label$=".doc"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".doc"] .material-icons::before {
  content: "description";
  visibility: visible;
}

#listing .item[aria-label$=".docx"] div i {
  color: #185abd;
}
#listing .item[aria-label$=".docx"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".docx"] .material-icons::before {
  content: "description";
  visibility: visible;
}

/* OpenOffice Writer */
#listing .item[aria-label$=".odt"] div i {
  color: #185abd;
}
#listing .item[aria-label$=".odt"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".odt"] .material-icons::before {
  content: "description";
  visibility: visible;
}

/* LibreOffice Writer */
#listing .item[aria-label$=".sxw"] div i {
  color: #185abd;
}
#listing .item[aria-label$=".sxw"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".sxw"] .material-icons::before {
  content: "description";
  visibility: visible;
}

/* PowerPoint */
#listing .item[aria-label$=".ppt"] div i {
  color: #d35230;
}
#listing .item[aria-label$=".pptx"] div i {
  color: #d35230;
}
#listing .item[aria-label$=".pps"] div i {
  color: #d35230;
}
/* OpenOffice Impress */
#listing .item[aria-label$=".odp"] div i {
  color: #d35230;
}

/* Excel */
#listing .item[aria-label$=".xls"] div i {
  color: #107c41;
}
#listing .item[aria-label$=".xlsx"] div i {
  color: #107c41;
}
#listing .item[aria-label$=".ods"] div i {
  color: #107c41;
}
#listing .item[aria-label$=".sxc"] div i {
  color: #107c41;
}
#listing .item[aria-label$=".wri"] div i {
  color: #336eff;
}

/* sound files - colorize */
#listing .item[data-type="audio"] div i {
  color: #f47900;
}

/* video files - colorize */
#listing .item[data-type="video"] div i {
  color: #f47900;
}

/* text files - change icon*/
#listing .item[aria-label$=".txt"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".txt"] .material-icons::before {
  content: "description";
  visibility: visible;
}
#listing .item[aria-label$=".md"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".md"] .material-icons::before {
  content: "description";
  visibility: visible;
}

/* various other files*/
/* iCal - change icon*/
#listing .item[aria-label$=".ics"] .material-icons {
  visibility: hidden;
}
#listing .item[aria-label$=".ics"] .material-icons::before {
  content: "event";
  visibility: visible;
}