Unsplash - Dark X by Saadski

/* ==UserStyle==
@name         Unsplash - Dark X
@version      20250314.21.25
@namespace    https://userstyles.world/user/Saadski
@description  Dark theme for Unsplash.
@author       Saadski
@license      No License
==/UserStyle== */

@-moz-document domain("unsplash.com") {
/* Unsplash */
/*Presets*/
:root
{
    --dark0: rgb(33, 33, 33);
    --dark: rgb(28, 28, 28);
    --dark1: rgb(27, 27, 27);
    --darker: rgb(18, 18, 18);
    --darker2: rgb(12, 12, 12);
    --darker3: rgb(8, 8, 8);
    --bw: rgb(67, 67, 67);
    --light: rgb(166, 166, 166);
    --lightl: rgb(146, 146, 146);
    --light1: rgb(193, 193, 193);
    --lighter: rgb(233, 233, 233);
    --accent: rgb(95, 95, 95);
    --shadow: rgba(0, 0, 0, 0.07);
    --tp: #fff0;
    --ol: #090909F2;
}

.Xa5QZ,
.H8pLI,
*,
.UyVIg
{
    --font-smoothing: auto;
    --background-color: var(--darker3);
    --button-primary-background-color: #111;
    --button-primary-text-color: #fff;
    --faded-text-color: #d1d1d1;
    --form-input-radio-button-border-color: #d1d1d1;
    --form-input-radio-button-checked-border-color: #007fff;
    --form-input-radio-button-checked-dot-color: #007fff;
    --link-text-color-hover: var(--accent) !important;
    --link-text-color: #767676;
    --placeholder-background-color: #0000000d;
    --plus-disclaimers-highlighted-discount: #c0c;
    --plus-pricing-options-discount-pill-text-color: #007fff;
    --plus-pricing-options-discount-pill-background: #00e0ff33;
    --plus-pricing-options-discount-pill-border-color: #0000;
    --small-faded-text-color: #767676;
    --text-color: #111;
}

:root
{
    --body-bg: rgb(255, 255, 255);
    --body-image: none;
    --body-bg-rgb: 255, 255, 255;
    --body-border: rgb(230, 230, 230);
    --body-primary-color: #1a1a1a;
    --body-secondary-color: #737373;
    --body-reaction-bg: var(--darker);
    --body-reaction-text-color: rgb(64, 64, 64);
    --body-toc-active-border: #737373;
    --body-toc-inactive-border: #f2f2f2;
    --body-toc-inactive-color: #737373;
    --body-toc-active-font-weight: 400;
    --body-table-border: rgb(204, 204, 204);
    --body-color: hsl(0, 0%, 0%);
    --footer-bg: var(--darker2);
    --footer-image: none;
    --footer-border: rgb(230, 230, 230);
    --footer-color: hsl(211, 10%, 61%);
    --header-bg: rgb(17, 17, 17);
    --header-image: none;
    --header-color: hsl(0, 0%, 100%);
    --collection-card-bg: rgb(255, 255, 255);
    --collection-card-image: none;
    --collection-card-color: hsl(0, 0%, 7%);
    --card-bg: rgb(255, 255, 255);
    --card-border-color: rgb(230, 230, 230);
    --card-border-inner-radius: 6px;
    --card-border-radius: 8px;
    --card-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --search-bar-border-radius: 10px;
    --search-bar-width: 100%;
    --ticket-blue-bg-color: #dce1f9;
    --ticket-blue-text-color: #334bfa;
    --ticket-green-bg-color: #d7efdc;
    --ticket-green-text-color: #0f7134;
    --ticket-orange-bg-color: #ffebdb;
    --ticket-orange-text-color: #b24d00;
    --header-height: 245px;
    --header-subheader-background-color: ;
    --header-subheader-font-color: ;
    --content-block-color: hsl(0, 0%, 0%);
    --content-block-button-color: hsl(0, 0%, 0%);
    --content-block-button-radius: nullpx;
    --primary-color: hsl(0, 0%, 7%);
    --primary-color-alpha-10: hsla(0, 0%, 7%, 0.1);
    --primary-color-alpha-60: hsla(0, 0%, 7%, 0.6);
    --text-on-primary-color: #ffffff;
}

::placeholder
{
    color: var(--light) !important;
}

/*SCROLLBAR*/
/* width */
::-webkit-scrollbar
{
    height: 10px !important;
    width: 10px !important;
}

/* Track */
/* Scrollbar Corner */
::-webkit-scrollbar-track,
::-webkit-scrollbar-corner
{
    background: #141414 !important;
}

/* Handle */
::-webkit-scrollbar-thumb
{
    background: #3A3A3A !important;
    border-radius: 1px !important;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover
{
    background: #3A3A3A !important;
}

::selection
{
    background: #353535B0 !important;
    color: #000 !important;
}

.Olora:focus,
.Olora:hover,
:is(.qT3N_, a):hover
{
    color: var(--link-text-color-hover)!important
}

*,
[class="btn btn-default btn-block-level btn-facebook js-login-with-facebook"]
{
    color: var(--lighter)!important
}

a .pill,
a:hover .pill,
svg
{
    color: var(--light)!important
}

*
{
    border-color: var(--dark0)!important;
    text-shadow: 1px 1px 2px var(--dark0);
}

.ZketX,
.cJK05
{
    border-color: var(--tp)!important;
    border-top-color: var(--tp)!important;
    border-bottom-color: var(--tp)!important
}

body,
html
{
    background: var(--darker3)!important
}

.ESead,
.GD3rC,
.GD3rC:active,
.GD3rC:focus,
.GD3rC:hover,
.navbar,
.p1cWU,
.uFivT,
.xWFB_,
.gDzQS,
.vActZ,
.hVtO9,
.Dsu5v
{
    background: #0000004d!important;
    backdrop-filter: blur(12px);
    z-index: 1
}

.b4j4s,
.navigation,
.k13Nq,
.dCpDW,
.fvfEL
{
    background: #0000007D!important;
    backdrop-filter: blur(12px);
    z-index: 1
}

.D9k_6,
.Ha8Q_,
.IquXd:focus,
.Jmx3T,
.KfefF,
.QgmcV,
.SHqxb:hover,
.ZHxHR,
.btn--small.btn-icon,
.btn-group-sm > .btn-icon.btn,
.ePF7z.pVbsY,
.ob_1e
{
    background: var(--dark)
}

.IquXd:hover
{
    background: var(--tp)!important
}

.D1hjc,
.IYEj0,
.NaIoK,
.UwY3R,
.Xfs7k,
.Zkqb_,
.btn,
.cGPoK,
.callout-flex-group,
.f4Se1,
.gcMAO,
.jjyKV:hover,
.l_Ro7,
.lfdvq,
.nC7we,
.q18A5,
.u9nHg,
[class="UdjLS oXw2J RzFNi VpdIv"],
[style="background-color: rgb(255, 255, 255);"]
{
    background: var(--darker)!important
}

.Mk1iL:hover,
.iXtuW,
.login__alt-cta,
.mm8Y2,
.oUncV,
.ppE6r,
.slide__container
{
    background: var(--darker2)
}

.NTfdD,
.fBS9b
{
    background: var(--darker3)
}

.SX05e
{
    background: linear-gradient(180deg, #fff0, var(--darker2))
}

svg
{
    fill: var(--light)!important
}

.CnNKA,
.login__logo
{
    filter: invert(1)
}

.oLiNE
{
    box-shadow: inset 0 -1px var(--dark0)
}

.HTP5W
{
    box-shadow: inset 0 -2px var(--bw)
}

.tFjg6
{
    background: var(--ol)
}

.fBS9b
{
    box-shadow: 0 0 9px 1px var(--dark)
}

.LCoFy,
.SXSYh,
.KchnC,
.vBq9w
{
    margin-left: -2px;
    background: #000000C2;
    border-radius: 10px;
    backdrop-filter: blur(5px)!important
}

.i52RW
{
    stroke: var(--accent)
}

.PTz06,
.navbar__logo
{
    filter: invert(1) contrast(.9)
}

.RzaUE
{
    background-color: var(--darker);
    box-shadow: 0 0 0 40px var(--darker)
}

.wynHU
{
    background-color: #00000087
}

.Oo8Aa
{
    color: #e25c3d!important
}

.J1ChR,
.RpNxp
{
    color: #3cb46e!important
}

.xXiXE
{
    box-shadow: inset 0 -40px 40px -30px var(--dark)
}

.EMC2J
{
    background: var(--tp)
}

.jOI2U
{
    background-color: #f15151!important
}

.jOI2U:hover
{
    background-color: #e04c4c!important
}

#modal-portal > div > div > div > div.Lvlem.fBS9b > div > div > div:first-child > div.IDj6P.voTTC > header > div.EdCFo > button.xFNhr.slPFO.DQBsa.p1cWU.jpBZ0.EzsBC.KHq0c.IKU9M.zhYdL.I0aPD.dEcXu > svg > path,
.zAWsW
{
    fill: var(--darker3)!important
}

.slPFO
{
    background-color: #3cb46e!important;
    color: var(--darker3)!important
}

.OHtll:hover,
.Olora:hover,
.p1cWU:hover
{
    border: 1px solid var(--light)!important
}

.Ha8Q_:hover
{
    background-color: var(--dark)
}

.D6U1i,
.H6Xmx,
.J7rXh,
.post-card
{
    background: var(--darker)
}

.kq21W,
.zSoNm:hover
{
    background-color: var(--darker2)
}

.JCGkV
{
    background-image: radial-gradient(#0000, var(--darker2))
}

.kq21W
{
    background-color: var(--darker3);
    background-image: linear-gradient(180deg, #0000 4px, var(--darker) 0), linear-gradient(90deg, var(--darker) 2px, #0000 0), linear-gradient(90deg, #0000 4px, var(--darker) 0), linear-gradient(180deg, var(--darker) 2px, #0000 0);
    background-position: 50%;
    background-size: 10px 10px, 50px 50px;
    display: flex
}

.zSoNm:not(:last-child)
{
    box-shadow: inset 0 -1px 0 0 var(--dark0)
}

.zSoNm:not(:last-child):hover
{
    box-shadow: inset 0 -1px 0 0 var(--bw)
}

.post-card:hover
{
    box-shadow: 0 35px 80px -20px rgba(255, 255, 255, .08), 0 30px 60px -30px rgba(255, 255, 255, .08);
}

.cjqKA
{
    border-bottom-color: var(--bw) !important;
}

.mNDtF
{
    box-shadow: 0 0 0 1px var(--dark0);
    display: flex;
}

.ITLOu
{
    background-color: var(--dark0);
    height: 32px;
    width: 1px;
}

.Mk1iL:not([disabled]):hover
{
    background-color: var(--dark);
}

.E7rbd
{
    background: var(--darker)
}

/* Backgrounds */
.zTt6Y,
.otUs3,
.qAqFb,
.t5Ax6,
.zzh3I,
._U1OW,
.qlgyw,
.KP_BS,
.L44vd
{
    background: #0000004f;
    backdrop-filter: blur(10px) !important;
    border-radius: 5px
}

.JfMHf,
.wYp1o,
.Be84Z,
.XI0Vr,
.nS6GG,
.form-group .input-group-checkboxes label:hover,
.IQamC,
.KP_BS,
.L44vd
{
    background: var(--darker)
}

.v1X5A,
.V1p2c
{
    background: var(--darker3)
}

.xacVX,
.IudAw,
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control
{
    background-color: hsla(0, 0%, 0%, 0);
}

.tUO8a:nth-child(odd),
.n4y25
{
    background: var(--dark)
}

.gD68C
{
    background: var(--darker2)
}

/* Search */
.hZmMf,
.hZmMf:hover,
.QKAcJ,
.QKAcJ:hover
{
    background: #0000004f !important;
    box-shadow: 0 0 0 1px var(--dark0) !important;
}

.a2oW6,
.tbiYu
{
    background: var(--darker);
    backdrop-filter: blur(10px) !important;
}

/* Buttons */
.ZGh7S,
.flB1q,
.m3Vko,
.cDy10,
.GqBKy,
.Ypz1Q:hover,
.Ypz1Q:focus
{
    background: linear-gradient(180deg, transparent 50%, rgba(10, 20, 30, .02)), var(--darker);
}

.ZGh7S:hover,
.flB1q:hover,
.OEAR9:hover,
.db6YM:focus,
.db6YM:hover,
.cDy10:hover,
.GqBKy:hover,
.uZFqZ
{
    background: linear-gradient(180deg, transparent 50%, rgba(10, 20, 30, .02)), var(--dark);
}

.TYpvC,
.FTKrh:hover
{
    background: var(--darker)
}

.TYpvC:hover,
.FTKrh
{
    background: var(--dark)
}

.d0fuK
{
    box-shadow: inset 0 0 0 1px var(--bw);
}

.Z8Fbg:focus,
.Z8Fbg:hover,
.WUsSf
{
    background: var(--dark)
}

button.x_EXo[disabled]
{
    background: var(--darker);
    color: var(--light) !important
}

.q9Rpd._MBaO,
.download-history__item:hover,
table
{
    backgrou...