From 24fd50abe9891bb849d6831351d477fe2845de9b Mon Sep 17 00:00:00 2001
From: ners <ners@gmx.ch>
Date: Mon, 1 Jun 2026 20:58:46 +0200
Subject: [PATCH] Add dark mode support via color-scheme

---
 html/hoogle.css        |  71 ++++++++++++-----------
 html/hoogle.png        | Bin 1962 -> 554 bytes
 html/plugin/chosen.css | 128 ++++++++++++++++++++---------------------
 3 files changed, 102 insertions(+), 97 deletions(-)

diff --git a/html/hoogle.css b/html/hoogle.css
index f6ae92bd..8a3196cf 100644
--- a/html/hoogle.css
+++ b/html/hoogle.css
@@ -3,6 +3,7 @@
 */
 
 html {
+    color-scheme: light dark;
     height: 100%;
 }
 
@@ -28,11 +29,11 @@ a img {
 }
 
 a:hover {
-    background-color: #ffb;
+    background-color: light-dark(#ffb, #443300);
 }
 
 a {
-    color: #C4451D;
+    color: light-dark(#C4451D, #e06840);
     text-decoration: none;
 }
 
@@ -41,9 +42,9 @@ a {
 */
 
 #links {
-    background: none repeat scroll 0 0 #293845;
-    border-top: 5px solid #4E6272;
-    color: #DDDDDD;
+    background: none repeat scroll 0 0 light-dark(#293845, #1a2530);
+    border-top: 5px solid light-dark(#4E6272, #3a4e5e);
+    color: light-dark(#DDDDDD, #cccccc);
     text-align: right;
     padding: 0.2em;
 }
@@ -72,7 +73,7 @@ a {
 }
 
 #top-menu li a:hover {
-    background-color: #4e6272;
+    background-color: light-dark(#4e6272, #3a4e5e);
     text-decoration: underline;
 }
 
@@ -80,6 +81,10 @@ form {
     margin-bottom: 0px;
 }
 
+#logo:hover {
+    background-color: initial;
+}
+
 #logo img {
     vertical-align: bottom;
 }
@@ -141,7 +146,7 @@ form {
 }
 
 #left a {
-    color: #C4451D;
+    color: light-dark(#C4451D, #e06840);
     text-decoration: none;
     background-repeat: no-repeat;
 }
@@ -150,7 +155,7 @@ form {
     padding-right: 16px;
     background-image: url(more_small.png);
     background-position: center right;
-    color: #0E774A;
+    color: light-dark(#0E774A, #2aaf6e);
 }
 
 #left .pad {
@@ -158,7 +163,7 @@ form {
 }
 
 #left .minus {
-    color: #770E00;
+    color: light-dark(#770E00, #cc4422);
     padding-left: 16px;
     background-image: url(less_small.png);
     background-position: center left;
@@ -170,9 +175,9 @@ form {
 */
 
 #footer {
-    background: none repeat scroll 0 0 #DDDDDD;
-    border-top: 1px solid #AAAAAA;
-    color: #666666;
+    background: none repeat scroll 0 0 light-dark(#DDDDDD, #333333);
+    border-top: 1px solid light-dark(#AAAAAA, #555555);
+    color: light-dark(#666666, #aaaaaa);
     width: 100%;
     padding: 1.3em 0;
     text-align: center;
@@ -205,7 +210,7 @@ p {
 */
 
 .error {
-    border-bottom: 2px solid red;
+    border-bottom: 2px solid light-dark(red, #ff6666);
     text-decoration: none;
     white-space: pre;
 }
@@ -216,10 +221,10 @@ p {
     margin-bottom: 20px;
     padding: 3px;
     width: 400px;
-    border: 2px solid #cc0;
-    color: black;
-    background-color: #F5F5F5;
-    border: 1px solid #E5E5E5;
+    border: 2px solid light-dark(#cc0, #998800);
+    color: light-dark(black, #e8e8e8);
+    background-color: light-dark(#F5F5F5, #232323);
+    border: 1px solid light-dark(#E5E5E5, #2c2c2c);
     text-align: left;
 }
 
@@ -239,7 +244,7 @@ p {
 }
 
 .result.active {
-    background-color: #f7f5c0;
+    background-color: light-dark(#f7f5c0, #3a3820);
 }
 
 .from, .doc {
@@ -258,41 +263,41 @@ a.dull, a.dull:hover {
 }
 
 .ans {
-    background: none repeat scroll 0 0 #F0F0F0;
-    border-top: 1px solid #CCCCCC;
+    background: none repeat scroll 0 0 light-dark(#F0F0F0, #252525);
+    border-top: 1px solid light-dark(#CCCCCC, #444444);
     font-size: 16px;
     padding: 0.2em 0.5em;
 }
 
 .ans a {
-    color: black;
+    color: light-dark(black, #e8e8e8);
 }
 .ans .name {
-    color: #C4451D;
+    color: light-dark(#C4451D, #e06840);
 }
 
 .links {
     float: right;
-    color: #CCCCCC;
+    color: light-dark(#CCCCCC, #444444);
 }
 .links a {
-    color: #888;
+    color: light-dark(#888, #999999);
     font-size: 12px;
 }
 
-.c0{background-color: #fcc;}
-.c1{background-color: #cfc;}
-.c2{background-color: #ccf;}
-.c3{background-color: #ffc;}
-.c4{background-color: #fcf;}
-.c5{background-color: #cff;}
+.c0{background-color: light-dark(#fcc, #4a1a1a);}
+.c1{background-color: light-dark(#cfc, #1a4a1a);}
+.c2{background-color: light-dark(#ccf, #1a1a4a);}
+.c3{background-color: light-dark(#ffc, #4a4a1a);}
+.c4{background-color: light-dark(#fcf, #4a1a4a);}
+.c5{background-color: light-dark(#cff, #1a4a4a);}
 
 .more, .more:visited {
     padding-left: 16px;
     background-image: url(more_blue.png);
     background-repeat: no-repeat;
     background-position: center left;
-    color: blue;
+    color: light-dark(blue, #6699ff);
 }
 
 /** PARENTS **/
@@ -300,7 +305,7 @@ a.dull, a.dull:hover {
 .from a, .p1, .p2 {
     white-space: nowrap;
     text-decoration: none;
-    color: #0E774A;
+    color: light-dark(#0E774A, #2aaf6e);
 }
 
 /** DOCS **/
@@ -318,7 +323,7 @@ docs may be in one of three states:
     margin-bottom: 1.0em;
 }
 .doc, .doc a {
-    color: #888;
+    color: light-dark(#888, #999999);
 }
 .doc h1, .doc h2, .doc h3, .doc h4, .doc h5, .doc h6 {
     font-size: 11px;
diff --git a/html/hoogle.png b/html/hoogle.png
index eb0830585e8789361fbcd88dfac039e11b898786..baa8371629700fe17473b2ce95d745972fa36048 100644
GIT binary patch
delta 541
zcmV+&0^<Fu52^%^7=Ho-0000=T)LY8000b7OjJdV0FHwIgMk2nfB=9laqzqV000DZ
zQchC?MUwa@W)$fF00GHKL_t(|+U?UZZqz^+hT+#9ZCtq6Diqu75qtw|(bCXtPQW#g
zEm6`?AWi^9l7b5$jXT<<ph{yQ8q&l<E+)a_kBk(tn^9JB9e?F5tw*EzXU07Bm|GBK
z)Pi-yt(%#!+|Goyp9fR9xp162%rq0`nhA}nc`#LT0Iog(N2kEz!_j*ZwZQ5(F-)We
ztU9Rm(u1}TKJMV<*_j+mX~0M$sdVAN_K-`%4u%}1<bzg~OY#s%A&oJ#(-%?bT<uyP
z<w@kA9@bL?6Mt=untDjom5$nzUX7r}sJai0K&@KJzV0bJ=HeEMM9qKrW3#a?^H6_R
z#d@$?mY(dJFcYY~e>~X;#ZSS~*_Paszg1;C&tjOn04K=r;POS-p!6X8vj>YrZ5Cj2
zc*U?so}(_nOCq@2W8Ja#yutQn`dksgy{XHA(({#aFn<$7aQ_?&kM%eTm#ShB!9?3M
z+zjfLx{^;EYk&KZB7)ePaM#nhS|j}(%|I^f^+`1K{_DZ&-I(=c>PjhsyZ7i}b()Vw
zN2)%TCL);bUN|gW*@3D=`o&$zrh?;Fd;g4SDBN)cufyUTF1tBV&x|rj-CWo(C#!2_
f73O>Dkrwq2Mk<mpGbFdk00000NkvXXu0mjfJhTS~

delta 1960
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

diff --git a/html/plugin/chosen.css b/html/plugin/chosen.css
index fe43ff49..f89d385f 100644
--- a/html/plugin/chosen.css
+++ b/html/plugin/chosen.css
@@ -33,10 +33,10 @@ This file is generated by `grunt build`, do not edit it by hand.
   left: -9999px;
   z-index: 1010;
   width: 100%;
-  border: 1px solid #aaa;
+  border: 1px solid light-dark(#aaa, #555555);
   border-top: 0;
-  background: #fff;
-  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
+  background: light-dark(#fff, #1e1e1e);
+  box-shadow: 0 4px 5px light-dark(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.5));
 }
 .chosen-container.chosen-with-drop .chosen-drop {
   left: 0;
@@ -53,23 +53,23 @@ This file is generated by `grunt build`, do not edit it by hand.
   overflow: hidden;
   padding: 0 0 0 8px;
   height: 25px;
-  border: 1px solid #aaa;
+  border: 1px solid light-dark(#aaa, #555555);
   border-radius: 5px;
-  background-color: #fff;
-  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4));
-  background: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
-  background: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
-  background: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
-  background: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
+  background-color: light-dark(#fff, #1e1e1e);
+  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, light-dark(#ffffff, #1e1e1e)), color-stop(50%, light-dark(#f6f6f6, #222222)), color-stop(52%, light-dark(#eeeeee, #282828)), color-stop(100%, light-dark(#f4f4f4, #242424)));
+  background: -webkit-linear-gradient(top, light-dark(#ffffff, #1e1e1e) 20%, light-dark(#f6f6f6, #222222) 50%, light-dark(#eeeeee, #282828) 52%, light-dark(#f4f4f4, #242424) 100%);
+  background: -moz-linear-gradient(top, light-dark(#ffffff, #1e1e1e) 20%, light-dark(#f6f6f6, #222222) 50%, light-dark(#eeeeee, #282828) 52%, light-dark(#f4f4f4, #242424) 100%);
+  background: -o-linear-gradient(top, light-dark(#ffffff, #1e1e1e) 20%, light-dark(#f6f6f6, #222222) 50%, light-dark(#eeeeee, #282828) 52%, light-dark(#f4f4f4, #242424) 100%);
+  background: linear-gradient(top, light-dark(#ffffff, #1e1e1e) 20%, light-dark(#f6f6f6, #222222) 50%, light-dark(#eeeeee, #282828) 52%, light-dark(#f4f4f4, #242424) 100%);
   background-clip: padding-box;
-  box-shadow: 0 0 3px white inset, 0 1px 1px rgba(0, 0, 0, 0.1);
-  color: #444;
+  box-shadow: 0 0 3px light-dark(white, #1e1e1e) inset, 0 1px 1px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.4));
+  color: light-dark(#444, #bbbbbb);
   text-decoration: none;
   white-space: nowrap;
   line-height: 24px;
 }
 .chosen-container-single .chosen-default {
-  color: #999;
+  color: light-dark(#999, #777777);
 }
 .chosen-container-single .chosen-single span {
   display: block;
@@ -124,8 +124,8 @@ This file is generated by `grunt build`, do not edit it by hand.
   width: 100%;
   height: auto;
   outline: 0;
-  border: 1px solid #aaa;
-  background: white url('chosen-sprite.png') no-repeat 100% -20px;
+  border: 1px solid light-dark(#aaa, #555555);
+  background: light-dark(white, #1e1e1e) url('chosen-sprite.png') no-repeat 100% -20px;
   background: url('chosen-sprite.png') no-repeat 100% -20px;
   font-size: 1em;
   font-family: sans-serif;
@@ -145,7 +145,7 @@ This file is generated by `grunt build`, do not edit it by hand.
 /* @end */
 /* @group Results */
 .chosen-container .chosen-results {
-  color: #444;
+  color: light-dark(#444, #bbbbbb);
   position: relative;
   overflow-x: hidden;
   overflow-y: auto;
@@ -169,22 +169,22 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .chosen-container .chosen-results li.disabled-result {
   display: list-item;
-  color: #ccc;
+  color: light-dark(#ccc, #444444);
   cursor: default;
 }
 .chosen-container .chosen-results li.highlighted {
-  background-color: #3875d7;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
-  background-image: -webkit-linear-gradient(#3875d7 20%, #2a62bc 90%);
-  background-image: -moz-linear-gradient(#3875d7 20%, #2a62bc 90%);
-  background-image: -o-linear-gradient(#3875d7 20%, #2a62bc 90%);
-  background-image: linear-gradient(#3875d7 20%, #2a62bc 90%);
-  color: #fff;
+  background-color: light-dark(#3875d7, #4a8ae8);
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, light-dark(#3875d7, #4a8ae8)), color-stop(90%, light-dark(#2a62bc, #3a72cc)));
+  background-image: -webkit-linear-gradient(light-dark(#3875d7, #4a8ae8) 20%, light-dark(#2a62bc, #3a72cc) 90%);
+  background-image: -moz-linear-gradient(light-dark(#3875d7, #4a8ae8) 20%, light-dark(#2a62bc, #3a72cc) 90%);
+  background-image: -o-linear-gradient(light-dark(#3875d7, #4a8ae8) 20%, light-dark(#2a62bc, #3a72cc) 90%);
+  background-image: linear-gradient(light-dark(#3875d7, #4a8ae8) 20%, light-dark(#2a62bc, #3a72cc) 90%);
+  color: light-dark(#fff, #1e1e1e);
 }
 .chosen-container .chosen-results li.no-results {
-  color: #777;
+  color: light-dark(#777, #999999);
   display: list-item;
-  background: #f4f4f4;
+  background: light-dark(#f4f4f4, #242424);
 }
 .chosen-container .chosen-results li.group-result {
   display: list-item;
@@ -209,13 +209,13 @@ This file is generated by `grunt build`, do not edit it by hand.
   width: 100%;
   height: auto !important;
   height: 1%;
-  border: 1px solid #aaa;
-  background-color: #fff;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
-  background-image: -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%);
-  background-image: -moz-linear-gradient(#eeeeee 1%, #ffffff 15%);
-  background-image: -o-linear-gradient(#eeeeee 1%, #ffffff 15%);
-  background-image: linear-gradient(#eeeeee 1%, #ffffff 15%);
+  border: 1px solid light-dark(#aaa, #555555);
+  background-color: light-dark(#fff, #1e1e1e);
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, light-dark(#eeeeee, #282828)), color-stop(15%, light-dark(#ffffff, #1e1e1e)));
+  background-image: -webkit-linear-gradient(light-dark(#eeeeee, #282828) 1%, light-dark(#ffffff, #1e1e1e) 15%);
+  background-image: -moz-linear-gradient(light-dark(#eeeeee, #282828) 1%, light-dark(#ffffff, #1e1e1e) 15%);
+  background-image: -o-linear-gradient(light-dark(#eeeeee, #282828) 1%, light-dark(#ffffff, #1e1e1e) 15%);
+  background-image: linear-gradient(light-dark(#eeeeee, #282828) 1%, light-dark(#ffffff, #1e1e1e) 15%);
   cursor: text;
 }
 .chosen-container-multi .chosen-choices li {
@@ -235,7 +235,7 @@ This file is generated by `grunt build`, do not edit it by hand.
   border: 0 !important;
   background: transparent !important;
   box-shadow: none;
-  color: #999;
+  color: light-dark(#999, #777777);
   font-size: 100%;
   font-family: sans-serif;
   line-height: normal;
@@ -245,20 +245,20 @@ This file is generated by `grunt build`, do not edit it by hand.
   position: relative;
   margin: 3px 5px 3px 0;
   padding: 3px 20px 3px 5px;
-  border: 1px solid #aaa;
+  border: 1px solid light-dark(#aaa, #555555);
   max-width: 100%;
   border-radius: 3px;
-  background-color: #eeeeee;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
-  background-image: -webkit-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: -moz-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: -o-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
+  background-color: light-dark(#eeeeee, #282828);
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, light-dark(#f4f4f4, #242424)), color-stop(50%, light-dark(#f0f0f0, #252525)), color-stop(52%, light-dark(#e8e8e8, #2a2a2a)), color-stop(100%, light-dark(#eeeeee, #282828)));
+  background-image: -webkit-linear-gradient(light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: -moz-linear-gradient(light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: -o-linear-gradient(light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: linear-gradient(light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
   background-size: 100% 19px;
   background-repeat: repeat-x;
   background-clip: padding-box;
-  box-shadow: 0 0 2px white inset, 0 1px 0 rgba(0, 0, 0, 0.05);
-  color: #333;
+  box-shadow: 0 0 2px light-dark(white, #1e1e1e) inset, 0 1px 0 light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.2));
+  color: light-dark(#333, #cccccc);
   line-height: 13px;
   cursor: default;
 }
@@ -280,17 +280,17 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .chosen-container-multi .chosen-choices li.search-choice-disabled {
   padding-right: 5px;
-  border: 1px solid #ccc;
-  background-color: #e4e4e4;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
-  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
-  color: #666;
+  border: 1px solid light-dark(#ccc, #444444);
+  background-color: light-dark(#e4e4e4, #2e2e2e);
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, light-dark(#f4f4f4, #242424)), color-stop(50%, light-dark(#f0f0f0, #252525)), color-stop(52%, light-dark(#e8e8e8, #2a2a2a)), color-stop(100%, light-dark(#eeeeee, #282828)));
+  background-image: -webkit-linear-gradient(top, light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: -moz-linear-gradient(top, light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: -o-linear-gradient(top, light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  background-image: linear-gradient(top, light-dark(#f4f4f4, #242424) 20%, light-dark(#f0f0f0, #252525) 50%, light-dark(#e8e8e8, #2a2a2a) 52%, light-dark(#eeeeee, #282828) 100%);
+  color: light-dark(#666, #aaaaaa);
 }
 .chosen-container-multi .chosen-choices li.search-choice-focus {
-  background: #d4d4d4;
+  background: light-dark(#d4d4d4, #3c3c3c);
 }
 .chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close {
   background-position: -42px -10px;
@@ -301,7 +301,7 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .chosen-container-multi .chosen-drop .result-selected {
   display: list-item;
-  color: #ccc;
+  color: light-dark(#ccc, #444444);
   cursor: default;
 }
 
@@ -309,20 +309,20 @@ This file is generated by `grunt build`, do not edit it by hand.
 /* @group Active  */
 .chosen-container-active .chosen-single {
   border: 1px solid #5897fb;
-  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 0 5px light-dark(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.6));
 }
 .chosen-container-active.chosen-with-drop .chosen-single {
-  border: 1px solid #aaa;
+  border: 1px solid light-dark(#aaa, #555555);
   -moz-border-radius-bottomright: 0;
   border-bottom-right-radius: 0;
   -moz-border-radius-bottomleft: 0;
   border-bottom-left-radius: 0;
-  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
-  background-image: -webkit-linear-gradient(#eeeeee 20%, #ffffff 80%);
-  background-image: -moz-linear-gradient(#eeeeee 20%, #ffffff 80%);
-  background-image: -o-linear-gradient(#eeeeee 20%, #ffffff 80%);
-  background-image: linear-gradient(#eeeeee 20%, #ffffff 80%);
-  box-shadow: 0 1px 0 #fff inset;
+  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, light-dark(#eeeeee, #282828)), color-stop(80%, light-dark(#ffffff, #1e1e1e)));
+  background-image: -webkit-linear-gradient(light-dark(#eeeeee, #282828) 20%, light-dark(#ffffff, #1e1e1e) 80%);
+  background-image: -moz-linear-gradient(light-dark(#eeeeee, #282828) 20%, light-dark(#ffffff, #1e1e1e) 80%);
+  background-image: -o-linear-gradient(light-dark(#eeeeee, #282828) 20%, light-dark(#ffffff, #1e1e1e) 80%);
+  background-image: linear-gradient(light-dark(#eeeeee, #282828) 20%, light-dark(#ffffff, #1e1e1e) 80%);
+  box-shadow: 0 1px 0 light-dark(#fff, #1e1e1e) inset;
 }
 .chosen-container-active.chosen-with-drop .chosen-single div {
   border-left: none;
@@ -333,10 +333,10 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .chosen-container-active .chosen-choices {
   border: 1px solid #5897fb;
-  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+  box-shadow: 0 0 5px light-dark(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.6));
 }
 .chosen-container-active .chosen-choices li.search-field input[type="text"] {
-  color: #222 !important;
+  color: light-dark(#222, #dddddd) !important;
 }
 
 /* @end */
@@ -408,7 +408,7 @@ This file is generated by `grunt build`, do not edit it by hand.
 }
 .chosen-rtl .chosen-search input[type="text"] {
   padding: 4px 5px 4px 20px;
-  background: white url('chosen-sprite.png') no-repeat -30px -20px;
+  background: light-dark(white, #1e1e1e) url('chosen-sprite.png') no-repeat -30px -20px;
   background: url('chosen-sprite.png') no-repeat -30px -20px;
   direction: rtl;
 }