/* =========================================================
   GITLAB CUSTOM BACKGROUND
   ========================================================= */

html,
body {
    min-height: 100vh !important;
    margin: 0 !important;
}

body {
    background:
        linear-gradient(
            rgba(8, 20, 50, 0.25),
            rgba(8, 20, 50, 0.25)
        ),
        url("/custom/gotrust-bg.png") center center / cover no-repeat fixed !important;
}


/* =========================================================
   REMOVE GITLAB DEFAULT BACKGROUNDS
   ========================================================= */

body.application,
.gl-app,
.application,
.page-width,
.gl-layout,
.gl-layout--content,
.gl-bg-default,
.gl-main-content,
.content-wrapper,
#content-body,
.content,
.main-content,
.page-content {
    background-color: transparent !important;
    background-image: none !important;
}


/* =========================================================
   KEEP CUSTOM BACKGROUND VISIBLE
   ========================================================= */

body.application.gl-bg-default {
    background:
        linear-gradient(
            rgba(8, 20, 50, 0.25),
            rgba(8, 20, 50, 0.25)
        ),
        url("/custom/gotrust-bg.png") center center / cover no-repeat fixed !important;
}


/* =========================================================
   GITLAB APPLICATION TEXT
   ========================================================= */

/*
 * Main application text should be WHITE
 */

body.application {
    --gl-text-color-default: #ffffff !important;
    --gl-text-color-heading: #ffffff !important;
    --gl-text-color-subtle: #ffffff !important;
    --gl-text-color-secondary: #ffffff !important;
}


/* Main headings */
body.application h1,
body.application h2,
body.application h3,
body.application h4,
body.application h5,
body.application h6 {
    color: #ffffff !important;
}


/* Main page paragraphs */
body.application .gl-main-content p,
body.application .content-wrapper p,
body.application .page-content p {
    color: #ffffff !important;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

body.application .nav-sidebar a,
body.application .nav-sidebar span,
body.application .nav-sidebar button,
body.application .gl-sidebar a,
body.application .gl-sidebar span,
body.application .gl-sidebar button {
    color: #ffffff !important;
}


/* Sidebar icons */
body.application .nav-sidebar svg,
body.application .nav-sidebar svg *,
body.application .gl-sidebar svg,
body.application .gl-sidebar svg * {
    color: #ffffff !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}


/* Sidebar headings */
body.application .nav-sidebar,
body.application .gl-sidebar {
    color: #ffffff !important;
}


/* =========================================================
   WELCOME TO GITLAB SECTION
   ========================================================= */

body.application .gl-main-content h1,
body.application .gl-main-content h2,
body.application .gl-main-content h3,
body.application .gl-main-content p {
    color: #ffffff !important;
}


/* =========================================================
   BREADCRUMB
   ========================================================= */

body.application .gl-breadcrumb,
body.application .gl-breadcrumb a,
body.application .gl-breadcrumb-item {
    color: #ffffff !important;
}


/* =========================================================
   LINKS OUTSIDE WHITE CARDS
   ========================================================= */

body.application a {
    color: #ffffff !important;
}


/* =========================================================
   GITLAB TEXT UTILITY CLASSES
   ========================================================= */

body.application .gl-text-gray-900,
body.application .gl-text-gray-800,
body.application .gl-text-gray-700,
body.application .gl-text-gray-600,
body.application .gl-text-gray-500,
body.application .gl-text-default,
body.application .gl-text-subtle,
body.application .gl-text-secondary,
body.application .gl-text-heading,
body.application .gl-text-neutral,
body.application .gl-text-primary {
    color: #ffffff !important;
}


/* =========================================================
   WHITE CARDS
   Keep card text BLACK
   ========================================================= */

body.application .gl-card,
body.application .gl-card *,
body.application [class*="card"],
body.application [class*="card"] * {
    color: #303030 !important;
}


/* Card headings */
body.application .gl-card h1,
body.application .gl-card h2,
body.application .gl-card h3,
body.application .gl-card h4,
body.application .gl-card h5,
body.application .gl-card h6,
body.application .gl-card p,
body.application .gl-card span,
body.application .gl-card a {
    color: #303030 !important;
}


/* =========================================================
   DASHBOARD WHITE COMPONENTS
   ========================================================= */

/* Search box */
body.application input,
body.application textarea,
body.application select {
    color: #000000 !important;
    background-color: #ffffff !important;
}


/* Input placeholder */
body.application input::placeholder,
body.application textarea::placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

/* Normal buttons */
body.application button {
    color: #000000 !important;
}


/* =========================================================
   LOGIN PAGE
   ========================================================= */

/*
 * Login page labels/headings/links remain WHITE
 */

.login-page h1,
.login-page h2,
.login-page h3,
.login-page h4,
.login-page h5,
.login-page h6 {
    color: #ffffff !important;
}


.login-page label,
.login-page .gl-label {
    color: #ffffff !important;
}


.login-page p {
    color: #ffffff !important;
}


.login-page a {
    color: #ffffff !important;
}


/* =========================================================
   LOGIN INPUTS
   Username/password entered text = BLACK
   ========================================================= */

.login-page input,
.login-page input[type="text"],
.login-page input[type="email"],
.login-page input[type="password"] {
    color: #000000 !important;
    background-color: #ffffff !important;
}


/* Login input placeholder */
.login-page input::placeholder {
    color: #666666 !important;
    opacity: 1 !important;
}


/* =========================================================
   LOGIN SELECT / TEXTAREA
   ========================================================= */

.login-page textarea,
.login-page select {
    color: #000000 !important;
    background-color: #ffffff !important;
}


/* =========================================================
   LOGIN BUTTON
   ========================================================= */

.login-page button {
    color: #ffffff !important;
}


/* =========================================================
   LOGIN BUTTON TEXT / LINKS
   ========================================================= */

.login-page button span {
    color: #ffffff !important;
}


/* =========================================================
   LOGIN INPUT ICONS
   ========================================================= */

.login-page input + svg,
.login-page svg {
    color: #000000 !important;
}


/* =========================================================
   FINAL LOGIN OVERRIDES
   These are intentionally at the bottom so they win
   ========================================================= */

.login-page input[type="text"],
.login-page input[type="email"],
.login-page input[type="password"] {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    background-color: #ffffff !important;
}


.login-page input[type="text"]::placeholder,
.login-page input[type="email"]::placeholder,
.login-page input[type="password"]::placeholder {
    color: #666666 !important;
    -webkit-text-fill-color: #666666 !important;
}

/* =========================================================
   FINAL FIX - POST LOGIN DASHBOARD WHITE TEXT
   ========================================================= */

/* ---------- LEFT SIDEBAR ---------- */

body.application .nav-sidebar a,
body.application .nav-sidebar span,
body.application .nav-sidebar button,
body.application .nav-sidebar .nav-item,
body.application .nav-sidebar .nav-item-label,
body.application .nav-sidebar .gl-button,
body.application .gl-sidebar a,
body.application .gl-sidebar span,
body.application .gl-sidebar button {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Sidebar icons */
body.application .nav-sidebar svg,
body.application .nav-sidebar svg *,
body.application .gl-sidebar svg,
body.application .gl-sidebar svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}


/* ---------- MAIN DASHBOARD ---------- */

/* Welcome heading */
body.application .gl-main-content h1,
body.application .gl-main-content h2,
body.application .gl-main-content h3,
body.application .gl-main-content > div h1,
body.application .gl-main-content > div h2,
body.application .gl-main-content > div h3 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Welcome description */
body.application .gl-main-content p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ---------- BREADCRUMB ---------- */

body.application .gl-breadcrumb a,
body.application .gl-breadcrumb span,
body.application .gl-breadcrumb-item,
body.application .gl-breadcrumb-item *,
body.application [data-testid="breadcrumb"] * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ---------- HELP / COLLAPSE SIDEBAR ---------- */

body.application .nav-sidebar ~ * a,
body.application [class*="sidebar"] a,
body.application [class*="sidebar"] span {
    color: #ffffff !important;
}


/* =========================================================
   KEEP WHITE CARDS BLACK
   ========================================================= */

body.application .gl-card,
body.application .gl-card *,
body.application [class*="card"],
body.application [class*="card"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* =========================================================
   SEARCH / WHITE INPUTS
   ========================================================= */

body.application input,
body.application textarea,
body.application select {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}


/* Search placeholder */
body.application input::placeholder,
body.application textarea::placeholder {
    color: #666666 !important;
    -webkit-text-fill-color: #666666 !important;
}


/* =========================================================
   ADMIN BUTTON
   ========================================================= */

body.application .gl-button,
body.application button {
    color: #000000 !important;
}


/* =========================================================
   FINAL WHITE TEXT OVERRIDE FOR COMMON GITLAB CLASSES
   ========================================================= */

body.application .gl-text-gray-900,
body.application .gl-text-gray-800,
body.application .gl-text-gray-700,
body.application .gl-text-gray-600,
body.application .gl-text-gray-500,
body.application .gl-text-default,
body.application .gl-text-subtle,
body.application .gl-text-secondary,
body.application .gl-text-heading {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* =========================================================
   FINAL FONT COLOR FIX
   ========================================================= */

/* ---------------------------------------------------------
   FORCE ALL GITLAB APPLICATION TEXT TO WHITE
   --------------------------------------------------------- */

body.application * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ---------------------------------------------------------
   LEFT SIDEBAR - WHITE
   --------------------------------------------------------- */

body.application .nav-sidebar *,
body.application .gl-sidebar *,
body.application [class*="sidebar"] * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Sidebar icons */
body.application .nav-sidebar svg,
body.application .nav-sidebar svg *,
body.application .gl-sidebar svg,
body.application .gl-sidebar svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}


/* ---------------------------------------------------------
   MAIN BLUE AREA - WHITE
   --------------------------------------------------------- */

body.application .gl-main-content *,
body.application .content-wrapper *,
body.application .page-content *,
body.application .main-content * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Welcome heading */
body.application h1,
body.application h2,
body.application h3,
body.application h4,
body.application h5,
body.application h6 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Welcome description */
body.application p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ---------------------------------------------------------
   KEEP WHITE CARDS BLACK
   --------------------------------------------------------- */

body.application .gl-card,
body.application .gl-card *,
body.application [class*="card"],
body.application [class*="card"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* Card headings/text */
body.application .gl-card h1,
body.application .gl-card h2,
body.application .gl-card h3,
body.application .gl-card h4,
body.application .gl-card h5,
body.application .gl-card h6,
body.application .gl-card p,
body.application .gl-card span,
body.application .gl-card a {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* ---------------------------------------------------------
   BREADCRUMB - BLACK ON WHITE
   --------------------------------------------------------- */

body.application .gl-breadcrumb,
body.application .gl-breadcrumb *,
body.application [class*="breadcrumb"],
body.application [class*="breadcrumb"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* ---------------------------------------------------------
   SEARCH BOX - BLACK
   --------------------------------------------------------- */

body.application input,
body.application input *,
body.application textarea,
body.application select {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    background-color: #ffffff !important;
}


/* Search placeholder */
body.application input::placeholder,
body.application textarea::placeholder {
    color: #666666 !important;
    -webkit-text-fill-color: #666666 !important;
}


/* ---------------------------------------------------------
   ADMIN / WHITE BUTTONS - BLACK
   --------------------------------------------------------- */

body.application button,
body.application button *,
body.application .gl-button,
body.application .gl-button * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* ---------------------------------------------------------
   TOP HEADER ICONS
   --------------------------------------------------------- */

body.application header svg,
body.application header svg *,
body.application [class*="header"] svg,
body.application [class*="header"] svg * {
    color: #ffffff !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}


/* ---------------------------------------------------------
   LOGIN PAGE
   Labels/headings = WHITE
   --------------------------------------------------------- */

.login-page,
.login-page h1,
.login-page h2,
.login-page h3,
.login-page h4,
.login-page h5,
.login-page h6,
.login-page p,
.login-page label,
.login-page .gl-label,
.login-page a {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Login username/password = BLACK */
.login-page input,
.login-page input[type="text"],
.login-page input[type="email"],
.login-page input[type="password"] {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    background-color: #ffffff !important;
}


/* Login placeholder */
.login-page input::placeholder {
    color: #666666 !important;
    -webkit-text-fill-color: #666666 !important;
}



/* =========================================================
   FINAL POST-LOGIN FONT COLOR
   ========================================================= */

/* =========================================================
   SIDEBAR - WHITE
   ========================================================= */

.nav-sidebar *,
.gl-sidebar *,
[class*="sidebar"] * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Sidebar icons */
.nav-sidebar svg,
.nav-sidebar svg *,
.gl-sidebar svg,
.gl-sidebar svg *,
[class*="sidebar"] svg,
[class*="sidebar"] svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}


/* =========================================================
   WELCOME / MAIN BLUE AREA - WHITE
   ========================================================= */

.gl-main-content h1,
.gl-main-content h2,
.gl-main-content h3,
.gl-main-content h4,
.gl-main-content h5,
.gl-main-content h6,
.gl-main-content p,
.content-wrapper h1,
.content-wrapper h2,
.content-wrapper h3,
.content-wrapper p,
.page-content h1,
.page-content h2,
.page-content h3,
.page-content p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* =========================================================
   DASHBOARD HEADING - EXTRA STRONG
   ========================================================= */

h1.gl-heading,
h1[class*="gl-heading"],
h2[class*="gl-heading"],
h3[class*="gl-heading"] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* =========================================================
   GITLAB TEXT COLOR UTILITY CLASSES
   ========================================================= */

.gl-text-gray-900,
.gl-text-gray-800,
.gl-text-gray-700,
.gl-text-gray-600,
.gl-text-gray-500,
.gl-text-default,
.gl-text-subtle,
.gl-text-secondary,
.gl-text-heading,
.gl-text-neutral,
.gl-text-primary {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* =========================================================
   BREADCRUMB - BLACK BECAUSE BACKGROUND IS WHITE
   ========================================================= */

.gl-breadcrumb,
.gl-breadcrumb *,
[class*="breadcrumb"],
[class*="breadcrumb"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* =========================================================
   WHITE CARDS - BLACK TEXT
   ========================================================= */

.gl-card,
.gl-card *,
[class*="card"],
[class*="card"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* =========================================================
   SEARCH BOX - BLACK TEXT
   ========================================================= */

input,
input *,
textarea,
select {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}


/* Search placeholder */
input::placeholder,
textarea::placeholder {
    color: #666666 !important;
    -webkit-text-fill-color: #666666 !important;
}


/* =========================================================
   WHITE BUTTONS - BLACK TEXT
   ========================================================= */

button,
.gl-button,
.gl-button * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* =========================================================
   ADMIN DASHBOARD - KEEP CARD CONTENT BLACK
   ========================================================= */

/* Admin dashboard cards */
body.application .gl-card *,
body.application [class*="card"] *,
body.application [class*="Card"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* Card headings */
body.application .gl-card h1,
body.application .gl-card h2,
body.application .gl-card h3,
body.application .gl-card h4,
body.application .gl-card h5,
body.application .gl-card h6,
body.application .gl-card p,
body.application .gl-card span,
body.application .gl-card a {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* Admin dashboard links/text inside light panels */
body.application .admin-dashboard .gl-card *,
body.application .admin-dashboard [class*="card"] * {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
}


/* =========================================================
   KEEP BLUE BACKGROUND TEXT WHITE
   ========================================================= */

body.application .nav-sidebar *,
body.application .gl-sidebar *,
body.application .gl-main-content > h1,
body.application .gl-main-content > h2,
body.application .gl-main-content > h3 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* Sidebar */
body.application .nav-sidebar a,
body.application .nav-sidebar span,
body.application .nav-sidebar button,
body.application .gl-sidebar a,
body.application .gl-sidebar span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* =========================================================
   ADMIN CARD BUTTONS
   ========================================================= */

body.application .gl-card button,
body.application [class*="card"] button {
    color: #303030 !important;
    -webkit-text-fill-color: #303030 !important;
    background-color: #ffffff !important;
}
