@media (prefers-color-scheme: dark) {
    /* DISABLE DARK MODE */
:root {
    --primary: #79aec8;
    --secondary: #417690;
    --accent: #f5dd5d;
    --primary-fg: #fff;
  
    --body-fg: #333;
    --body-bg: #fff;
    --body-quiet-color: #666;
    --body-loud-color: #000;
  
    --header-color: #ffc;
    --header-branding-color: var(--accent);
    --header-bg: var(--secondary);
    --header-link-color: var(--primary-fg);
  
    --breadcrumbs-fg: #c4dce8;
    --breadcrumbs-link-fg: var(--body-bg);
    --breadcrumbs-bg: var(--primary);
  
    --link-fg: #447e9b;
    --link-hover-color: #036;
    --link-selected-fg: #5b80b2;
  
    --hairline-color: #e8e8e8;
    --border-color: #ccc;
  
    --error-fg: #ba2121;
  
    --message-success-bg: #dfd;
    --message-warning-bg: #ffc;
    --message-error-bg: #ffefef;
  
    --darkened-bg: #f8f8f8; /* A bit darker than --body-bg */
    --selected-bg: #e4e4e4; /* E.g. selected table cells */
    --selected-row: #ffc;
  
    --button-fg: #fff;
    --button-bg: var(--primary);
    --button-hover-bg: #609ab6;
    --default-button-bg: var(--secondary);
    --default-button-hover-bg: #205067;
    --close-button-bg: #888; /* Previously #bbb, contrast 1.92 */
    --close-button-hover-bg: #747474;
    --delete-button-bg: #ba2121;
    --delete-button-hover-bg: #a41515;
  
    --object-tools-fg: var(--button-fg);
    --object-tools-bg: var(--close-button-bg);
    --object-tools-hover-bg: var(--close-button-hover-bg);
  }
}

body {
    color: #000;
}

.inline {
    display: inline;
}

#header {
    background: var(--primary-color);
}

#user-tools {
    color: #fff;
}

#user-tools a:focus,
#user-tools a:hover {
    color: #fff;
    border-bottom-color: #fff;
}

div.breadcrumbs {
    background: var(--primary-color);
    border-top: dashed white 1.8px;
}

.module h2,
.module caption,
.inline-group h2 {
    background: var(--primary-color);
}

#content-related .module h2 {
    color: #000;
}

#content-related h3 {
    color: #000;
}

#changelist table thead th:first-child {
    width: inherit;
}

a:link,
a:visited {
    color: var(--primary-color);
}

a:hover {
    color: #000;
}

.selector-chosen h2 {
    background: var(--primary-color) !important;
}

.quiet {
    color: #000;
}

h1,
h2,
h3,
h4,
h5 {
    font-weight: 600;
    color: #000;
}

div.breadcrumbs {
    color: #fff;
}

div.breadcrumbs a:focus,
div.breadcrumbs a:hover {
    text-decoration: underline;
    color: #fff;
    font-weight: 600;
}

.object-tools a:link,
.object-tools a:visited {
    background: #fff;
    color: var(--primary-color);
    border: solid 2px var(--primary-color);
    font-weight: 600;
    transition: 0.1s;
}

.object-tools a:hover {
    background: #000;
    color: #fff;
    border: solid 2px #000;
    transition: 0.1s;
}

#changelist-filter {
    background: var(--primary-color) !important;
}

#changelist-filter ul {
    border-bottom: 1px solid #fff !important;
}

#changelist-filter h3 {
    font-weight: 600 !important;
    color: #fff;
}

#changelist-filter li.selected {
    color: #fff !important;
    border-left: 5px solid #fff !important;
}

#changelist-filter li a {
    color: #fff !important;
}

#changelist-filter li.selected a {
    color: #fff !important;
    text-decoration: underline;
    font-weight: 600;
}

#changelist-filter li a:focus,
#changelist-filter li a:hover,
#changelist-filter li.selected a:focus,
#changelist-filter li.selected a:hover {
    text-decoration: underline !important;
}

.green {
    background-color: #72b01d !important;
}

.lightblue {
    background-color: #c3dcff !important;
}

.blue {
    background-color: #3185fc !important;
}

.grey {
    background-color: #a8a8a8 !important;
}

.orange {
    background-color: #faa72a !important;
}

.filters-header {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1.8px dashed #fff !important;
    height: 40px !important;
}

.filters-header h2 {
    margin: 0 !important;
    font-size: 16px !important;
}

.filters-header .remove_filters {
    color: white !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    border: solid 2px white !important;
    border-radius: 15px;
    transition: 0.1s;
    margin-right: 10px;
    padding: 5px 10px;
    cursor: pointer;
}

.filters-header .remove_filters:hover {
    color: var(--primary-color) !important;
    background-color: white !important;
    text-decoration: none !important;
}

th,
td {
    padding: 0.25rem;
}

thead tr th,
tr div {
    box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

p.datetime {
    color: white !important;
}


/* -- LOGIN PAGE -- */

@media only screen and (min-width: 500px) {
    .login #container {
        width: 36em !important;
    }
}

h1.login {
    margin-bottom: 5px !important;
}

hr.login-divider {
    margin-bottom: 10px;
    background-color: #000;
    height: 1px;
}

div.login-note {
    margin-top: 12px;
    text-align: center;
}

#login-button {
    display: inline-block;
    text-align: center;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.gplay-wrapper {
    width: 100%;
    display: inline-block;
    text-align: center;
    overflow: hidden;
}

.gplay-badge {
    width: 80%;
}

.ios-wrapper {
    display: inline-block;
    text-align: center;
    overflow: hidden;
    border-radius: 13px;
    width: 100%;
    margin-top: -15px;
}

.ios-badge {
    border-radius: 13px;
    width: 70%;
}

#login-button-image {
    max-width: 80%;
}

#logout_form {
    display: inline-block;
}

#logout_button {
    display: inline-block;
    padding: 0;
    background: none;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    font-size: 11px;
    font-weight: 300;
    border-radius: 0;
}

#logout_button:hover {
    border-bottom: 1px solid rgb(255, 255, 255);
}

#top_scroll_wrapper,
#bottom_scroll_wrapper {
    overflow-x: scroll/* make both top and bottom scrollbars scrollable */
}

#top_scroll_wrapper {
    z-index: 1000;
    position: sticky;
    top: 0;
    background-color: white;
}

#bottom_scroll_wrapper {
    margin-top: -34px;
}

#top_scrollbar {
    height: 5px;
    background-color: white
}

#header_scroll_wrapper {
    overflow: auto;
    overflow-x: hidden;
    position: sticky;
    top: 13px;
    z-index: 1000;
}

.text_area_choices {
    max-width: 300px;
}

.module.aligned.dynamic label {
    float: none;
    width: auto;
}

.dynamic-property-label {
    font-size: 14px;
    font-weight: bold;
  }
  
.required::before {
    content: '*';
    color: red;
}