Aywas Dark Mode (WIP!) by xenephos

/* ==UserStyle==
@name         Aywas Dark Mode (WIP!)
@version      20221019.01.08
@namespace    userstyles.world/user/xenephos
@description  Aywas dark mode
@author       xenephos
@license      No License
==/UserStyle== */

@-moz-document regexp("https?://www\\.aywas\\.com/(?!up|pp/page).*") {
/*Main Rules 
These rules apply to most of the site 

NONE OF THIS STYLE CODE WILL APPLY TO USER PROFILES - this would break a lot of custom CSS and I'm not that mean

Please report any bugs/issues to Xenephos#55335 on Aywas EXCEPT the following which I cannot fix for some reason or another:
- Welcome Back Page containers - these are themed by staff and are entirely made up of images, which I do not want to edit
- Usernames being illegible on top of some vistas
- Default UPs being kinda ugly
- White BGs/oversizing with some items - again, something I don't want to fix b/c it would bloat this CSS & my imgur account a lot more
*/

@namespace url(http://www.w3.org/1999/xhtml);
    
/* Sets majority of text colors to white and the main container background/border to a dark grey*/
#content {
    color: #fff;
    background-color:#282828 !important;
    width:780px;
}

h1, h2 {
    color: #fff;
    letter-spacing: -1px
}

.question-wrapper h5 {
    color: #fff;
    font-size: 1em;
}

div#side, em, #page-header #page-nav li h2, label.label {
    color:#fff !important
}

#page-time, .gobuy .usd-item .back, div.message-text, #quick-inventory-modal, .modal-dialog, #divToToggle input, div#confirmation-body {
    color: #fff 
}

#page-header {
    background: none;
}

#dashboard_index #content, #dashboard_index #main{
    background: #282828 !important;
  }

div#backdrop {
    background-color: #282828;
    border: 2px solid #0A0A0A
}

div.pagination, #item-search, tr.category-title th.no-align {
    background-color: #101010
}

/* Makes Search Boxes legible */
input, button, textarea, select, optgroup, option, .question-wrapper.odd li.odd, .question-wrapper.even li.odd, span.tag.is-light {
    color:#fff !important
}

select, span.tag.is-light, input.input, textarea.textarea {
    background-color: #101010 !important
    
}

/* Sitewide link color; does not apply to most usernames or button links */
a:not(a.user-name, a.a-button, #question .button, .ctabtn.large a), a:link, a:visited{
    color: #38CCFF !important
}

table#user-notice-table a {
    color: #38CCFF !important
}

/* Makes premium silver, contributor purple, & default brown usernames a bit more legible and brightens all UNs on hover.
Unfortunately, there's not much I can do about legibility of UNs on top of vistas*/

a.user-name[style="color: #333333;"] {
    color: #CDCDCD !important;
}

a.user-name[style="color: #5500C4;"] {
    color:#8845E0 !important
}

a.user-name[style="color: #5C1C1C;"] {
    color:#A97339 !important
}

a.user-name[style="color: #33335A;"]  {
    color:#38CCFF !important
}

a.user-name[style="color: #CC9900;"] {
    color:#FFEF00 !important
}

a.user-name[style="color: #2D9E00;"] {
    color:#2FFF00 !important
}

a.user-name[style="color: #3284c9;"] {
    color:#008AFF !important
}

a.user-name[style="color: #009177;"] {
    color:#00FFD1 !important
}

a.user-name[style="color: #D66000;"] {
    color:#FF7200 !important
}

a.user-name[style="color: #E30792;"] {
    color:#FF42B9 !important
}

a.user-name:hover {
    filter: brightness(200%);
}

/* Makes all button links black & hovered buttons legible*/
a.a-button, input[type="button"].a-button, input[type="submit"].a-button, #question .button, input[name="hatch"], input[name="incubate"] {
    color: #fff;
    background-color: #0A0A0A !important;
    text-shadow: none;
}

a.a-button:hover, input[type="button"].a-button:hover, input[type="submit"].a-button:hover {
    background-color: #595959;
}

div.form input[type="submit"]:hover, div.form input[type="text"]:focus, div.form input[type="text"]:hover, div.form textarea:focus, div.form textarea:hover {
    background-color: #595959 !important;
    color: #fff;
    text-shadow: none;
}

/* Changes most yellow buttons to blue */
.ctabtn, .ctabtn > button, .ctabtn > input, .ctabtn > span {
    background: url(https://i.imgur.com/j7Ver4n.png);
    color: #002C47 !important
}

/* Notices*/

.notice.row-1 {
    color: #fff
}

div.page-notice.success {
  color: #1F4168;
  background-color: #729AC9;
  border: 2px solid #1F4168;
}

div.page-notice.success a {
  color: #000
}

div.page-notice.error {
  color: #b30000;
  background-color: #ffb4a8;
  border: 2px solid #b30000;
}

/* Wardrobe page customization */
.wardrobe-left .preview-layers li {
  background-color: #0A0A0A;
  margin: 0 0 5px 0;
  font-size: 10px;
}
.wardrobe-left .preview-layers li.active {
  background-color: #2FA0C7;
  margin: 0 0 5px 0;
  font-size: 10px;
}

.wardrobe-left .preview-layers li:hover {
    background-color: #3A3A3A;
}

.wardrobe-right .drawer-tabs li:hover {
    background-color:#0A0A0A
}

.panel-block[data-v-f2d11090], .panel-block.is-active[data-v-f2d11090] {
    color: #fff;
    background-color:#0A0A0A
}

/* Changes most bi-colored tables i.e. quick stock, forums, etc. */

table.y-tables {
        border: 1px solid #2FA0C7
}
table.css3 tr:nth-child(2n+1) td, table.y-tables tr td.highlight, table.y-tables tr.highlight, table.y-tables tr.row-2, table.y-tables tr.row-even {
    background-color: #101010;

}

table.y-tables tr th.highlight, table.y-tables tr.highlight th {
    background-color:#0A0A0A
}

input, button, textarea, select, optgroup, option, .question-wrapper.odd li.odd, .question-wrapper.even li.odd {
    color: #fff;
    background-color:#101010
}

.item-thumb:hover {
    background-color:#000
}

td[style="background-color: #FFD3D3"] {
    background-color:#661D1E !important;
}

td[style="background-color: #FFECEC"] {
    background-color: #9C2F31 !important;
}


/* Makes the Page Navigation dropdowns dark */
#page-nav li .sub-nav .sub-nav-cap, #page-nav li .sub-nav {
    background: url(https://i.imgur.com/kWbIpWI.png) bottom right no-repeat;
}

/*Formatting for user options panel and lair sort tabs*/
div#ucp-side, div#ucp-manage-panel {
    background-color:#0A0A0A
}

div#ucp-manage-panel div.col {
    background-color: #282828
}

div#ucp-manage-panel div.panel {
    background-color: #595959
}

div.form select {
    background-color: #0A0A0A
}

/* Makes Achievements list easier on the eyes */
.achievement-list li {
    background-color: #4D8FB8
}

/* Makes the liked pets tabs stand out a bit more */
.likes-folders ul li {
    background-color:#101010;
    border:none;
}
.droppable.ui-droppable.highlight {
    background-color:#595959;
    border:none;
}

/* Changes some highlighted, seemingly important text & some timer colors */
.note, p.adoption-timer, p.center.gen-med{
    color: #E7EC47 !important
}

/* Makes text on highlight-on-hover objects (such as the text entry boxes on Edit Pet pages) legible when active */
div.form input[type="submit"]:hover, div.form input[type="text"]:focus, div.form input[type="text"]:hover, div.form textarea:focus, div.form textarea:hover, .quick-list .item:hover {
    background-color: #000;
}

a.panel-block[data-v-f2d11090]:hover, label.panel-block[data-v-f2d11090]:hover, div#ucp-side li a:hover, #att-table tr:hover, .bdp .bdpc, .recipe.unlocked:hover, .item-thumb.highlight, .item-thumb.highlight:hover  {
    background-color: #595959;
}

.pure-g a.user-name {
    color: #fff
}

/* Training Hall monster select tweaks */
.bdp {
    background-color: #000;
    border: 1px solid #000;
}

/*Makes the hover on the draggable panels of the Profile Layout page match the theme */
div.panel:hover {
    border: 1px solid #38CCFF
}

/* Trivia Page tweaks */

.question-wrapper{
    background: url(https://i.imgur.com/7uGCeuK.png) no-repeat 20px 35px;
}

.question-wrapper.odd {
    color: #38CCFF;
    border-color: #38CCFF;
}

.question-wrapper.even {
  border-color: #00FF65;
  color: #00FF65;
}

.question-wrapper h4, .question-wrapper h5 {
    border-bottom: solid 1px #4D8FB8;
}

/* Keno tweaks */

div#keno-board {
    background-color: #135279;
}

div#keno-board a {
    background-color: #4D8FB8;
    }

div#keno-board a.selected {
    background-color:  #6422DB
}

/*Campground Tweaks */
.modal2 .modal2-content {
    background-color:#0A0A0A
}

.campground-view .dialog {
    background-color:#282828
}

/* Misc item BG tweaks */
.item-list .item {
    background-color:#101010
}

/* NPC Quest BG tweaks */
.npc-quest-container .quest-content {
    background-color:#101010
}

/*Adventure*/
#avt-dialogue, #avt-modal-content {
    background-color:#101010
}

/* NPC Shops */

.store-view .store-npc .npc-dialogue, .stock .inner {
    background-color:#101010
}

.stock .stats .title {
    background-color:#0A0A0A
}

.store-view .store-stock .stock .details .attributes > li > .title {
    background-color:#000
}

.stock .stat {
    overflow: hidden
}

.store-view .barter-notice {
    font-weight: bold;
    background-color:#4D8FB8;
    border: 1px solid #75CAFF
}

/* Fixes non page-referencing popups */
.modal, div#modal-backdrop, .modal-dialog {
    background-color: #101010 !important;
    border: 1px solid white !important
}

div#modal-backdrop div#modal-padding div#modal-content, div#modal-padding, div#modal-content, div#fishing-modal div.content {
    background-color: #101010 !important;
    border: none
}




/* Donation Box */

.donation-list .item:hover, .pagination .pagination-goto input[type="number"] {
    background-color: #101010 !important;
}

.pagination .btn.active, .pagination .btn:hover, .pagination .btn[type="button"] {
    background-color: #193C65 !important;
    color:#002C47 !important
}

/* Shop Search & Trading Post */
.search_tab, .search_tab.active-tab, .lot-offer {
    background-color: #101010
}

/* USD Shop */
.gobuy .usd-item, .gobuy #checkout-modal .checkout {
    background-color: #101010
}

/* Aywapedia */
div#aywapedia-content dt {
    background-image: url(https://i.imgur.com/yKgtrkG.png);
}
    
/* For...