/*
 * High-contrast mode, active when <html> has the class a11y-contrast.
 * Spec: specs/run/A1-digitalna-pristupacnost/session-2-high-contrast.md
 *
 * Scheme: black background, white text, yellow underlined links, white frames, yellow focus ring.
 *   text #fff, secondary text #ddd, links #ffff00, inverted state (hover, selected, active) #000 on #fff,
 *   disabled #aaa with a dashed frame, focus 3px solid #ffff00 with a 2px offset,
 *   semantic frames (never text): success #00ff00, warning #ffff00, danger #ff5555, info #66ccff.
 *
 * Conventions:
 *  - Every rule starts with html.a11y-contrast, and the whole file sits inside one @media screen block. That block
 *    keeps printouts black on white: Bootstrap's @media print rules (* { color: #000 !important }) would lose to the
 *    !important declarations below. Nothing is added for print (section 11).
 *  - !important throughout: this file overrides a 7000-line theme, widget stylesheets and inline styles. The only
 *    declarations without it create something new (color-scheme, the sort-arrow triangles of the grids).
 *  - Only colours change and nothing moves. A frame is the element's existing 1px border in white plus an inset
 *    box-shadow (2px in total), or an inset box-shadow alone where the theme draws no border (.btn, .alert, tiles);
 *    a dashed frame (disabled) and the day states of the calendars are outlines drawn inside the box. None of these
 *    changes the size of a box.
 *  - Images, logos and scans stay untouched (no filter, no inversion). Icon sprites that are dark on transparent
 *    (select2, jQuery UI) get a white backing instead.
 *  - Sections follow the spec: 1 Base, 2 Chrome, 3 Forms, 4 Buttons, 5 Tables, 6 Navigation inside pages,
 *    7 Feedback, 8 Widgets, 9 Login screen, 10 eSavjetnik layout, 11 Print.
 */

@media screen {

/* ---------- 1. Base ---------- */

html.a11y-contrast {
	background-color: #000 !important;
	color-scheme: dark;
}

html.a11y-contrast body {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
}

html.a11y-contrast ::selection {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/*
 * Inline styles (46 view files set colours in style="..."): the recurring ones are a grey, yellow, green or red
 * background and red, green or grey text. They lose their colour and get a frame instead. Placed first, so that the
 * component rules of the later sections win where an element has both.
 */
html.a11y-contrast [style*="background"] {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast [style*="color"] {
	color: #fff !important;
}

html.a11y-contrast a[style*="color"] {
	color: #ffff00 !important;
}

/* Secondary text */
html.a11y-contrast small,
html.a11y-contrast .small,
html.a11y-contrast .text-muted,
html.a11y-contrast blockquote small,
html.a11y-contrast .dropdown-header,
html.a11y-contrast table.detail-view .null {
	color: #ddd !important;
}

/* Contextual text colours: the text stays white, the meaning is in the words */
html.a11y-contrast .text-primary,
html.a11y-contrast .text-success,
html.a11y-contrast .text-danger,
html.a11y-contrast .text-warning,
html.a11y-contrast .text-info {
	color: #fff !important;
}

/* Links, in every state */
html.a11y-contrast a {
	color: #ffff00 !important;
	text-decoration: underline !important;
}

html.a11y-contrast a:hover,
html.a11y-contrast a:focus,
html.a11y-contrast a:active {
	background-color: #ffff00 !important;
	color: #000 !important;
	text-decoration: underline !important;
}

html.a11y-contrast a small,
html.a11y-contrast a .small,
html.a11y-contrast a .text-muted {
	color: inherit !important;
}

html.a11y-contrast hr {
	border-color: #fff !important;
}

html.a11y-contrast abbr[title],
html.a11y-contrast abbr[data-original-title] {
	border-bottom-color: #fff !important;
}

html.a11y-contrast blockquote {
	border-color: #fff !important;
}

html.a11y-contrast code,
html.a11y-contrast pre,
html.a11y-contrast kbd,
html.a11y-contrast samp {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
	text-shadow: none !important;
}

html.a11y-contrast pre code {
	box-shadow: none !important;
}

/* Highlighted text: black on yellow (19.6:1) */
html.a11y-contrast mark,
html.a11y-contrast .highlighted {
	background-color: #ffff00 !important;
	color: #000 !important;
}

html.a11y-contrast .img-thumbnail,
html.a11y-contrast .thumbnail {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .thumbnail .caption {
	color: #fff !important;
}

html.a11y-contrast a.thumbnail:hover,
html.a11y-contrast a.thumbnail:focus {
	background-color: #ffff00 !important;
	border-color: #fff !important;
}

html.a11y-contrast a.thumbnail:hover .caption,
html.a11y-contrast a.thumbnail:focus .caption {
	color: #000 !important;
}

html.a11y-contrast .page-header,
html.a11y-contrast fieldset,
html.a11y-contrast legend {
	border-color: #fff !important;
}

html.a11y-contrast legend {
	color: #fff !important;
}

/*
 * Documents shown in an iframe (reports) are written for white paper and keep a white backing: a transparent
 * document with black text would otherwise be black on black.
 */
html.a11y-contrast iframe {
	background-color: #fff !important;
}

/* Focus: a 3px yellow ring on every focusable element. Never remove it. */
html.a11y-contrast :focus {
	outline: 3px solid #ffff00 !important;
	outline-offset: 2px !important;
}

/* Elements that are focused by script only (a modal, a skip target) would otherwise get a ring around the viewport */
html.a11y-contrast .modal:focus,
html.a11y-contrast .modal-dialog:focus,
html.a11y-contrast [tabindex="-1"]:not(a):not(button):not(input):not(select):not(textarea):focus {
	outline: 0 !important;
}

/* ---------- 2. Chrome ---------- */

/* Navbar (both copies in header.php and main.php use .navbar-default; .navbar-inverse is covered for completeness) */
html.a11y-contrast .navbar-default,
html.a11y-contrast .navbar-inverse {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 -1px 0 #fff !important;
}

html.a11y-contrast .navbar-default .navbar-collapse,
html.a11y-contrast .navbar-default .navbar-form,
html.a11y-contrast .navbar-inverse .navbar-collapse,
html.a11y-contrast .navbar-inverse .navbar-form {
	border-color: #fff !important;
	box-shadow: none !important;
}

html.a11y-contrast .navbar-default .navbar-text,
html.a11y-contrast .navbar-inverse .navbar-text {
	color: #fff !important;
}

/* Hovered, focused, open and current menu item: #000 on #fff */
html.a11y-contrast .navbar-default .navbar-nav > li > a:hover,
html.a11y-contrast .navbar-default .navbar-nav > li > a:focus,
html.a11y-contrast .navbar-default .navbar-nav > li:hover > a,
html.a11y-contrast .navbar-default .navbar-nav > .open > a,
html.a11y-contrast .navbar-default .navbar-nav > .open > a:hover,
html.a11y-contrast .navbar-default .navbar-nav > .open > a:focus,
html.a11y-contrast .navbar-default .navbar-nav > .active > a,
html.a11y-contrast .navbar-default .navbar-nav > .active > a:hover,
html.a11y-contrast .navbar-default .navbar-nav > .active > a:focus,
html.a11y-contrast .navbar-default .navbar-brand:hover,
html.a11y-contrast .navbar-default .navbar-brand:focus,
html.a11y-contrast .navbar-default .navbar-link:hover,
html.a11y-contrast .navbar-inverse .navbar-nav > li > a:hover,
html.a11y-contrast .navbar-inverse .navbar-nav > li > a:focus,
html.a11y-contrast .navbar-inverse .navbar-nav > .open > a,
html.a11y-contrast .navbar-inverse .navbar-nav > .active > a {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .navbar-default .navbar-nav > .disabled > a,
html.a11y-contrast .navbar-default .navbar-nav > .disabled > a:hover,
html.a11y-contrast .navbar-default .navbar-nav > .disabled > a:focus {
	background-color: #000 !important;
	color: #aaa !important;
	text-decoration: none !important;
}

/* Carets are drawn with borders: white on the black bar, black inside an inverted item */
html.a11y-contrast .caret,
html.a11y-contrast .nav .caret,
html.a11y-contrast .nav .dropdown-toggle .caret,
html.a11y-contrast .dropdown-submenu > a > .caret,
html.a11y-contrast .btn .caret {
	border-top-color: #fff !important;
	border-bottom-color: #fff !important;
}

html.a11y-contrast .navbar-default .navbar-nav > li > a:hover .caret,
html.a11y-contrast .navbar-default .navbar-nav > li > a:focus .caret,
html.a11y-contrast .navbar-default .navbar-nav > li:hover > a .caret,
html.a11y-contrast .navbar-default .navbar-nav > .open > a .caret,
html.a11y-contrast .navbar-default .navbar-nav > .active > a .caret,
html.a11y-contrast .dropdown-menu > li > a:hover .caret,
html.a11y-contrast .dropdown-menu > li > a:focus .caret,
html.a11y-contrast .dropdown-menu > .active > a .caret,
html.a11y-contrast .btn:hover .caret,
html.a11y-contrast .btn:focus .caret,
html.a11y-contrast .btn.active .caret,
html.a11y-contrast .btn-primary .caret,
html.a11y-contrast .open > .dropdown-toggle .caret,
html.a11y-contrast .nav .open > a .caret,
html.a11y-contrast .nav-tabs > li.active > a .caret,
html.a11y-contrast .nav-pills > li.active > a .caret {
	border-top-color: #000 !important;
	border-bottom-color: #000 !important;
}

html.a11y-contrast .btn-primary:hover .caret,
html.a11y-contrast .btn-primary:focus .caret {
	border-top-color: #fff !important;
	border-bottom-color: #fff !important;
}

/* The triangles that apprrrPgList/_search.php draws with borders in its own <style> block */
html.a11y-contrast .arrow-up {
	border-bottom-color: #fff !important;
}

html.a11y-contrast .arrow-down {
	border-top-color: #fff !important;
}

/* Hamburger button of the collapsed navbar */
html.a11y-contrast .navbar-default .navbar-toggle,
html.a11y-contrast .navbar-inverse .navbar-toggle {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .navbar-default .navbar-toggle:hover,
html.a11y-contrast .navbar-default .navbar-toggle:focus,
html.a11y-contrast .navbar-inverse .navbar-toggle:hover,
html.a11y-contrast .navbar-inverse .navbar-toggle:focus {
	background-color: #fff !important;
}

html.a11y-contrast .navbar-default .navbar-toggle .icon-bar,
html.a11y-contrast .navbar-inverse .navbar-toggle .icon-bar {
	background-color: #fff !important;
}

html.a11y-contrast .navbar-default .navbar-toggle:hover .icon-bar,
html.a11y-contrast .navbar-default .navbar-toggle:focus .icon-bar,
html.a11y-contrast .navbar-inverse .navbar-toggle:hover .icon-bar,
html.a11y-contrast .navbar-inverse .navbar-toggle:focus .icon-bar {
	background-color: #000 !important;
}

/* Dropdown menus, including the nested .dropdown-submenu */
html.a11y-contrast .dropdown-menu {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .dropdown-menu .divider,
html.a11y-contrast .nav .nav-divider,
html.a11y-contrast .smallDivider {
	background-color: #fff !important;
}

html.a11y-contrast .dropdown-menu > li > a:hover,
html.a11y-contrast .dropdown-menu > li > a:focus,
html.a11y-contrast .dropdown-menu > li:hover > a,
html.a11y-contrast .dropdown-menu > .active > a,
html.a11y-contrast .dropdown-menu > .active > a:hover,
html.a11y-contrast .dropdown-menu > .active > a:focus,
html.a11y-contrast .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
html.a11y-contrast .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,
html.a11y-contrast .navbar-default .navbar-nav .open .dropdown-menu > .active > a {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
}

html.a11y-contrast .dropdown-menu > .disabled > a,
html.a11y-contrast .dropdown-menu > .disabled > a:hover,
html.a11y-contrast .dropdown-menu > .disabled > a:focus {
	background-color: #000 !important;
	color: #aaa !important;
	text-decoration: none !important;
}

/* Small marks inside menu items (counters) follow the item */
html.a11y-contrast .dropdown-menu > li > a:hover .badge,
html.a11y-contrast .dropdown-menu > li > a:focus .badge {
	background-color: #000 !important;
	color: #fff !important;
}

/* Page header and footer */
html.a11y-contrast .footer {
	border-color: #fff !important;
}

html.a11y-contrast .badge {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast a.badge:hover,
html.a11y-contrast a.badge:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* The accessibility bar itself (css/accessibility.css): already dark, now with the frames and states of this scheme */
html.a11y-contrast #a11y-bar {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 -2px 0 #fff !important;
}

html.a11y-contrast #a11y-bar .a11y-btn,
html.a11y-contrast #a11y-bar-expand {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
	text-decoration: none !important;
	opacity: 1 !important;
}

html.a11y-contrast #a11y-bar .a11y-btn:hover,
html.a11y-contrast #a11y-bar .a11y-btn[aria-pressed="true"],
html.a11y-contrast #a11y-bar-expand:hover {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast #a11y-bar .a11y-btn[disabled],
html.a11y-contrast #a11y-bar .a11y-btn[disabled]:hover {
	background-color: #000 !important;
	color: #aaa !important;
	border-color: transparent !important;
	box-shadow: none !important;
	outline: 2px dashed #aaa !important;
	outline-offset: -2px !important;
}

/* The bar clips its content (overflow: hidden), so its ring is 3px without the offset: it still fits into the 34px */
html.a11y-contrast #a11y-bar .a11y-btn:focus,
html.a11y-contrast #a11y-bar-expand:focus {
	outline: 3px solid #ffff00 !important;
	outline-offset: 0 !important;
}

@media (max-width: 767px) {
	/* On small screens the bar sits at the bottom of the window */
	html.a11y-contrast #a11y-bar {
		box-shadow: inset 0 2px 0 #fff !important;
	}
}

/* ---------- 3. Forms ---------- */

/* Every text-like control: black, white text, white 2px frame (1px border + 1px inset). The height stays as it is. */
html.a11y-contrast .form-control,
html.a11y-contrast input:not([type]),
html.a11y-contrast input[type="text"],
html.a11y-contrast input[type="password"],
html.a11y-contrast input[type="email"],
html.a11y-contrast input[type="number"],
html.a11y-contrast input[type="search"],
html.a11y-contrast input[type="tel"],
html.a11y-contrast input[type="url"],
html.a11y-contrast input[type="date"],
html.a11y-contrast input[type="datetime-local"],
html.a11y-contrast input[type="month"],
html.a11y-contrast input[type="time"],
html.a11y-contrast input[type="week"],
html.a11y-contrast select,
html.a11y-contrast textarea {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
	text-shadow: none !important;
}

html.a11y-contrast option,
html.a11y-contrast optgroup {
	background-color: #000 !important;
	color: #fff !important;
}

/* Read-only fields (the date fields that open a calendar) are not disabled: same frame, a slightly lighter black */
html.a11y-contrast .form-control[readonly],
html.a11y-contrast input[readonly],
html.a11y-contrast textarea[readonly] {
	background-color: #1a1a1a !important;
}

/*
 * Disabled: #aaa text on a dashed 2px frame. The frame is an outline drawn inside the box over the theme's 1px border,
 * which is made transparent: a real 2px border would widen the columns of tables with automatic layout.
 */
html.a11y-contrast .form-control[disabled],
html.a11y-contrast fieldset[disabled] .form-control,
html.a11y-contrast input:not([type])[disabled],
html.a11y-contrast input[type="text"][disabled],
html.a11y-contrast input[type="password"][disabled],
html.a11y-contrast input[type="email"][disabled],
html.a11y-contrast input[type="number"][disabled],
html.a11y-contrast input[type="search"][disabled],
html.a11y-contrast input[type="tel"][disabled],
html.a11y-contrast input[type="url"][disabled],
html.a11y-contrast input[type="date"][disabled],
html.a11y-contrast select[disabled],
html.a11y-contrast textarea[disabled] {
	background-color: #000 !important;
	color: #aaa !important;
	border-color: transparent !important;
	box-shadow: none !important;
	outline: 2px dashed #aaa !important;
	outline-offset: -2px !important;
	opacity: 1 !important;
}

/* Placeholders: #ddd, and Firefox must not dim them (::placeholder is enough for current browsers) */
html.a11y-contrast ::-webkit-input-placeholder {
	color: #ddd !important;
	opacity: 1 !important;
}

html.a11y-contrast ::placeholder {
	color: #ddd !important;
	opacity: 1 !important;
}

/* Native check boxes and radio buttons stay native. In the light scheme they are white on the black page (in the dark one, dark grey). */
html.a11y-contrast input[type="checkbox"],
html.a11y-contrast input[type="radio"] {
	color-scheme: light !important;
}

/*
 * The button of a file field is a pseudo-element with the browser's own colours: white text on #6b6b6b in the dark scheme, 5.3:1.
 * It gets the look of a button (section 4). The browser's 2px outset border keeps its width and only changes style and colour, so the field keeps its size.
 */
html.a11y-contrast input[type="file"]::file-selector-button {
	background-color: #000 !important;
	color: #fff !important;
	border-style: solid !important;
	border-color: #fff !important;
}

html.a11y-contrast input[type="file"]:not([disabled])::file-selector-button:hover {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast input[type="file"][disabled]::file-selector-button {
	background-color: #000 !important;
	color: #aaa !important;
	border-style: dashed !important;
	border-color: #aaa !important;
}

/* Their labels */
html.a11y-contrast label,
html.a11y-contrast .control-label,
html.a11y-contrast .checkbox,
html.a11y-contrast .radio,
html.a11y-contrast .checkbox-inline,
html.a11y-contrast .radio-inline {
	color: #fff !important;
}

html.a11y-contrast .help-block {
	color: #ddd !important;
}

html.a11y-contrast .input-group-addon {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

/* Validation states: the frame carries the meaning (3px), the text stays white */
html.a11y-contrast .has-success .form-control,
html.a11y-contrast .has-success .input-group-addon {
	border-color: #00ff00 !important;
	box-shadow: inset 0 0 0 2px #00ff00 !important;
}

html.a11y-contrast .has-warning .form-control,
html.a11y-contrast .has-warning .input-group-addon {
	border-color: #ffff00 !important;
	box-shadow: inset 0 0 0 2px #ffff00 !important;
}

html.a11y-contrast .has-error .form-control,
html.a11y-contrast .has-error .input-group-addon {
	border-color: #ff5555 !important;
	box-shadow: inset 0 0 0 2px #ff5555 !important;
}

html.a11y-contrast .has-success .control-label,
html.a11y-contrast .has-warning .control-label,
html.a11y-contrast .has-error .control-label,
html.a11y-contrast .has-success .input-group-addon,
html.a11y-contrast .has-warning .input-group-addon,
html.a11y-contrast .has-error .input-group-addon {
	color: #fff !important;
}

html.a11y-contrast .has-success .help-block,
html.a11y-contrast .has-warning .help-block,
html.a11y-contrast .has-error .help-block {
	color: #ddd !important;
}

/* Yii error output: the field itself gets the red frame from the .error rule of section 7 */
html.a11y-contrast .errorMessage {
	color: #fff !important;
}

html.a11y-contrast fieldset.fieldset-styled,
html.a11y-contrast fieldset.fieldset-styled-light {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: none !important;
}

html.a11y-contrast fieldset.fieldset-styled.disabled {
	color: #aaa !important;
	border-style: dashed !important;
	border-color: #aaa !important;
	opacity: 1 !important;
}

/* ---------- 4. Buttons ---------- */

/* Every button: black, white text, white 2px frame. The theme draws no border on .btn, so the frame is an inset shadow. */
html.a11y-contrast .btn,
html.a11y-contrast button,
html.a11y-contrast input[type="submit"],
html.a11y-contrast input[type="button"],
html.a11y-contrast input[type="reset"],
html.a11y-contrast .myButton,
html.a11y-contrast .submitButton {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
	text-shadow: none !important;
	text-decoration: none !important;
}

/* Buttons without a class keep the browser's 2px outset border: it is the frame, drawn solid */
html.a11y-contrast button:not([class]),
html.a11y-contrast input[type="submit"]:not([class]),
html.a11y-contrast input[type="button"]:not([class]),
html.a11y-contrast input[type="reset"]:not([class]) {
	border-style: solid !important;
	box-shadow: none !important;
}

/* Hovered, focused, pressed: #000 on #fff */
html.a11y-contrast .btn:hover,
html.a11y-contrast .btn:focus,
html.a11y-contrast .btn:active,
html.a11y-contrast .btn.active,
html.a11y-contrast .btn[aria-pressed="true"],
html.a11y-contrast .open .dropdown-toggle.btn,
html.a11y-contrast button:hover,
html.a11y-contrast input[type="submit"]:hover,
html.a11y-contrast input[type="button"]:hover,
html.a11y-contrast input[type="reset"]:hover,
html.a11y-contrast .myButton:hover,
html.a11y-contrast .myButton.active {
	background-color: #fff !important;
	color: #000 !important;
}

/* Primary actions are inverted at rest and flip on hover */
html.a11y-contrast .btn-primary,
html.a11y-contrast .submitButton {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .btn-primary:hover,
html.a11y-contrast .btn-primary:focus,
html.a11y-contrast .btn-primary:active,
html.a11y-contrast .submitButton:hover,
html.a11y-contrast .submitButton:focus {
	background-color: #000 !important;
	color: #fff !important;
}

/* Semantic buttons: the frame is 3px in the colour of the meaning */
html.a11y-contrast .btn-success {
	border-color: #00ff00 !important;
	box-shadow: inset 0 0 0 3px #00ff00 !important;
}

html.a11y-contrast .btn-warning {
	border-color: #ffff00 !important;
	box-shadow: inset 0 0 0 3px #ffff00 !important;
}

html.a11y-contrast .btn-danger {
	border-color: #ff5555 !important;
	box-shadow: inset 0 0 0 3px #ff5555 !important;
}

html.a11y-contrast .btn-info {
	border-color: #66ccff !important;
	box-shadow: inset 0 0 0 3px #66ccff !important;
}

/* A button that looks like a link */
html.a11y-contrast .btn-link {
	background-color: #000 !important;
	color: #ffff00 !important;
	box-shadow: none !important;
	text-decoration: underline !important;
}

html.a11y-contrast .btn-link:hover,
html.a11y-contrast .btn-link:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Disabled: #aaa on black, dashed frame (an outline, so nothing moves; the focus ring still wins on a focused link) */
html.a11y-contrast .btn.disabled,
html.a11y-contrast .btn[disabled],
html.a11y-contrast fieldset[disabled] .btn,
html.a11y-contrast .btn.disabled:hover,
html.a11y-contrast .btn[disabled]:hover,
html.a11y-contrast fieldset[disabled] .btn:hover,
html.a11y-contrast .btn.disabled:focus,
html.a11y-contrast .btn.disabled:active,
html.a11y-contrast .btn[disabled]:active,
html.a11y-contrast button[disabled],
html.a11y-contrast input[type="submit"][disabled],
html.a11y-contrast input[type="button"][disabled],
html.a11y-contrast .btn-link[disabled],
html.a11y-contrast .btn-link.disabled {
	background-color: #000 !important;
	color: #aaa !important;
	box-shadow: none !important;
	opacity: 1 !important;
	text-decoration: none !important;
}

html.a11y-contrast .btn.disabled:not(:focus),
html.a11y-contrast .btn[disabled]:not(:focus),
html.a11y-contrast fieldset[disabled] .btn:not(:focus),
html.a11y-contrast button[disabled]:not(:focus),
html.a11y-contrast input[type="submit"][disabled]:not(:focus),
html.a11y-contrast input[type="button"][disabled]:not(:focus) {
	outline: 2px dashed #aaa !important;
	outline-offset: -2px !important;
}

/* The close button of alerts and modals */
html.a11y-contrast .close {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-decoration: none !important;
	opacity: 1 !important;
}

html.a11y-contrast .close:hover,
html.a11y-contrast .close:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Home page tiles (.metro-button) and the coloured variants (.metro-<name>): black tiles, colour dropped */
html.a11y-contrast .metro-button,
html.a11y-contrast [class^="metro-"],
html.a11y-contrast [class*=" metro-"] {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
	text-decoration: none !important;
	opacity: 1 !important;
}

html.a11y-contrast .metro-button:hover,
html.a11y-contrast .metro-button:focus {
	background-color: #fff !important;
	color: #000 !important;
}

/* Icon tiles (.tile, .tile-<name>) of the admin index and the reports index, with the title (.transformer) below */
html.a11y-contrast .tile,
html.a11y-contrast [class^="tile-"],
html.a11y-contrast [class*=" tile-"] {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
	text-decoration: none !important;
	opacity: 1 !important;
}

/* .tile-white has a 1px border of its own, so the shadow is 1px to make the same 2px */
html.a11y-contrast .tile-white {
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .tile:hover,
html.a11y-contrast .transformer:hover .tile,
html.a11y-contrast .transformer:focus .tile {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .transformer h4,
html.a11y-contrast .transformer h5,
html.a11y-contrast [class*="transformer-"] h4,
html.a11y-contrast [class*="transformer-"] h5 {
	color: #ffff00 !important;
}

html.a11y-contrast .transformer:hover h4,
html.a11y-contrast .transformer:hover h5,
html.a11y-contrast .transformer:focus h4,
html.a11y-contrast .transformer:focus h5 {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Coloured chips (calendar entries): black with a 1px frame, the type is in the icon and the text */
html.a11y-contrast [class^="color-scheme-"],
html.a11y-contrast [class*=" color-scheme-"] {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .color-scheme-91 a {
	background-color: #000 !important;
}

html.a11y-contrast .color-scheme-91 a:hover,
html.a11y-contrast .color-scheme-91 a:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* ---------- 5. Tables ---------- */

html.a11y-contrast .table,
html.a11y-contrast .table .table,
html.a11y-contrast .table-responsive > .table {
	background-color: #000 !important;
	color: #fff !important;
}

/* Cell borders 1px #fff, the header underline (2px) keeps its width */
html.a11y-contrast .table > thead > tr > th,
html.a11y-contrast .table > tbody > tr > th,
html.a11y-contrast .table > tfoot > tr > th,
html.a11y-contrast .table > thead > tr > td,
html.a11y-contrast .table > tbody > tr > td,
html.a11y-contrast .table > tfoot > tr > td,
html.a11y-contrast .table tbody + tbody,
html.a11y-contrast .table-bordered,
html.a11y-contrast .table-responsive {
	border-color: #fff !important;
}

html.a11y-contrast .table caption {
	color: #ddd !important;
}

/* Striped rows: #000 and #1a1a1a alternate (Bootstrap stripes the odd rows, Yii marks them .odd) */
html.a11y-contrast .table-striped > tbody > tr:nth-child(2n+1) > td,
html.a11y-contrast .table-striped > tbody > tr:nth-child(2n+1) > th,
html.a11y-contrast .grid-view table.items tr.odd,
html.a11y-contrast .grid-view table.items tr.odd > td,
html.a11y-contrast table.detail-view tr.odd,
html.a11y-contrast table.detail-view tr.odd > td,
html.a11y-contrast table.detail-view tr.odd > th {
	background-color: #1a1a1a !important;
	color: #fff !important;
}

html.a11y-contrast .grid-view table.items tr.even,
html.a11y-contrast .grid-view table.items tr.even > td,
html.a11y-contrast table.detail-view tr.even,
html.a11y-contrast table.detail-view tr.even > td,
html.a11y-contrast table.detail-view tr.even > th {
	background-color: #000 !important;
	color: #fff !important;
}

/* Contextual rows and cells: black, the meaning is a 4px bar on the first cell (a 3px frame around a single cell) */
html.a11y-contrast .table tr.success > td,
html.a11y-contrast .table tr.success > th,
html.a11y-contrast .table tr.warning > td,
html.a11y-contrast .table tr.warning > th,
html.a11y-contrast .table tr.danger > td,
html.a11y-contrast .table tr.danger > th,
html.a11y-contrast .table td.success,
html.a11y-contrast .table th.success,
html.a11y-contrast .table td.warning,
html.a11y-contrast .table th.warning,
html.a11y-contrast .table td.danger,
html.a11y-contrast .table th.danger,
html.a11y-contrast .warningTd,
html.a11y-contrast .errorTd {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .table tr.success > td:first-child,
html.a11y-contrast .table tr.success > th:first-child {
	box-shadow: inset 4px 0 0 #00ff00 !important;
}

html.a11y-contrast .table tr.warning > td:first-child,
html.a11y-contrast .table tr.warning > th:first-child {
	box-shadow: inset 4px 0 0 #ffff00 !important;
}

html.a11y-contrast .table tr.danger > td:first-child,
html.a11y-contrast .table tr.danger > th:first-child {
	box-shadow: inset 4px 0 0 #ff5555 !important;
}

html.a11y-contrast .table td.success,
html.a11y-contrast .table th.success {
	box-shadow: inset 0 0 0 3px #00ff00 !important;
}

html.a11y-contrast .table td.warning,
html.a11y-contrast .table th.warning,
html.a11y-contrast .warningTd {
	box-shadow: inset 0 0 0 3px #ffff00 !important;
}

html.a11y-contrast .table td.danger,
html.a11y-contrast .table th.danger,
html.a11y-contrast .errorTd {
	box-shadow: inset 0 0 0 3px #ff5555 !important;
}

/*
 * Rows coloured by status in the <style> blocks of five Yii views (businessTripBilling, businessTripPlan,
 * dailyActivityListRequest, internoEMotrenje, internoEvpg: tr.gray, .yellow, .green, .orange, .red on light
 * backgrounds). With rowCssClassExpression, CGridView gives these rows no odd / even class, so white text stood on the
 * light colour. Black like every row; the status stays as a 4px bar on the first cell. Added in session 4.
 */
html.a11y-contrast .table tr.gray,
html.a11y-contrast .table tr.yellow,
html.a11y-contrast .table tr.green,
html.a11y-contrast .table tr.orange,
html.a11y-contrast .table tr.red {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .table tr.gray > td:first-child {
	box-shadow: inset 4px 0 0 #aaa !important;
}

html.a11y-contrast .table tr.yellow > td:first-child {
	box-shadow: inset 4px 0 0 #ffff00 !important;
}

html.a11y-contrast .table tr.green > td:first-child {
	box-shadow: inset 4px 0 0 #00ff00 !important;
}

html.a11y-contrast .table tr.orange > td:first-child {
	box-shadow: inset 4px 0 0 #ff9900 !important;
}

html.a11y-contrast .table tr.red > td:first-child {
	box-shadow: inset 4px 0 0 #ff5555 !important;
}

/* Inactive records: dimmed to #aaa (9.0:1), links included; a hovered link is a link again */
html.a11y-contrast tr.inactive td,
html.a11y-contrast tr.inactive td a,
html.a11y-contrast a.inactive {
	color: #aaa !important;
}

html.a11y-contrast tr.inactive td a:hover,
html.a11y-contrast tr.inactive td a:focus,
html.a11y-contrast a.inactive:hover,
html.a11y-contrast a.inactive:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Selected, active and hovered rows invert: #000 on #fff */
html.a11y-contrast .table tr.active > td,
html.a11y-contrast .table tr.active > th,
html.a11y-contrast .table td.active,
html.a11y-contrast .table th.active,
html.a11y-contrast .grid-view table.items tr.selected,
html.a11y-contrast .grid-view table.items tr.selected > td,
html.a11y-contrast .grid-view table.items tr:hover.selected,
html.a11y-contrast .grid-view table.items tr:hover.selected > td,
html.a11y-contrast .table-hover > tbody > tr:hover > td,
html.a11y-contrast .table-hover > tbody > tr:hover > th,
html.a11y-contrast .table-hover tr > td.success:hover,
html.a11y-contrast .table-hover tr > th.success:hover,
html.a11y-contrast .table-hover tr > td.warning:hover,
html.a11y-contrast .table-hover tr > th.warning:hover,
html.a11y-contrast .table-hover tr > td.danger:hover,
html.a11y-contrast .table-hover tr > th.danger:hover,
html.a11y-contrast .table-hover tr.success:hover > td,
html.a11y-contrast .table-hover tr.success:hover > th,
html.a11y-contrast .table-hover tr.warning:hover > td,
html.a11y-contrast .table-hover tr.warning:hover > th,
html.a11y-contrast .table-hover tr.danger:hover > td,
html.a11y-contrast .table-hover tr.danger:hover > th,
html.a11y-contrast .grid-view table.items tbody tr:hover,
html.a11y-contrast .grid-view table.items tbody tr:hover > td,
html.a11y-contrast .grid-view table.items tbody tr:hover > th,
html.a11y-contrast .list-unstyled li:hover {
	background-color: #fff !important;
	color: #000 !important;
}

/* The grid lines of an inverted row turn black, or they would vanish into the white row */
html.a11y-contrast .table tr.active > td,
html.a11y-contrast .table tr.active > th,
html.a11y-contrast .grid-view table.items tr.selected > td,
html.a11y-contrast .table-hover > tbody > tr:hover > td,
html.a11y-contrast .table-hover > tbody > tr:hover > th,
html.a11y-contrast .grid-view table.items tbody tr:hover > td,
html.a11y-contrast .grid-view table.items tbody tr:hover > th {
	border-color: #000 !important;
}

/* Inside an inverted row the links, marks and buttons follow */
html.a11y-contrast .table tr.active a,
html.a11y-contrast .grid-view table.items tr.selected a,
html.a11y-contrast .table-hover > tbody > tr:hover a,
html.a11y-contrast .grid-view table.items tbody tr:hover a,
html.a11y-contrast .list-unstyled li:hover a {
	color: #000 !important;
}

html.a11y-contrast .table tr.active .text-muted,
html.a11y-contrast .grid-view table.items tr.selected .text-muted,
html.a11y-contrast .table-hover > tbody > tr:hover .text-muted,
html.a11y-contrast .table-hover > tbody > tr:hover small,
html.a11y-contrast .grid-view table.items tbody tr:hover .text-muted,
html.a11y-contrast .grid-view table.items tbody tr:hover small {
	color: #000 !important;
}

html.a11y-contrast .table-hover > tbody > tr:hover .btn:hover,
html.a11y-contrast .table-hover > tbody > tr:hover .btn:focus,
html.a11y-contrast .grid-view table.items tbody tr:hover .btn:hover,
html.a11y-contrast .grid-view table.items tbody tr:hover .btn:focus,
html.a11y-contrast .grid-view table.items tr.selected .btn:hover {
	box-shadow: inset 0 0 0 2px #000 !important;
}

/* CGridView (Yii): header, filters, sort arrows, summary */
html.a11y-contrast .grid-view table.items,
html.a11y-contrast table.detail-view {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .grid-view table.items th,
html.a11y-contrast .grid-view table.items td,
html.a11y-contrast table.detail-view th,
html.a11y-contrast table.detail-view td {
	border-color: #fff !important;
}

html.a11y-contrast .grid-view table.items th {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
}

html.a11y-contrast .grid-view table.items th a,
html.a11y-contrast .list-view .sorter a {
	color: #ffff00 !important;
}

html.a11y-contrast .grid-view table.items th a:hover,
html.a11y-contrast .grid-view table.items th a:focus,
html.a11y-contrast .list-view .sorter a:hover,
html.a11y-contrast .list-view .sorter a:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* The sort arrows are dark GIFs meant for a blue header: drawn as a triangle in the colour of the link instead */
html.a11y-contrast .grid-view table.items th a.asc,
html.a11y-contrast .grid-view table.items th a.desc,
html.a11y-contrast .list-view .sorter a.asc,
html.a11y-contrast .list-view .sorter a.desc {
	position: relative;
	background-image: none !important;
}

html.a11y-contrast .grid-view table.items th a.asc::after,
html.a11y-contrast .list-view .sorter a.asc::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -3px;
	border-right: 4px solid transparent;
	border-bottom: 5px solid currentColor;
	border-left: 4px solid transparent;
}

html.a11y-contrast .grid-view table.items th a.desc::after,
html.a11y-contrast .list-view .sorter a.desc::after {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -3px;
	border-top: 5px solid currentColor;
	border-right: 4px solid transparent;
	border-left: 4px solid transparent;
}

html.a11y-contrast .grid-view .filters input,
html.a11y-contrast .grid-view .filters select {
	border-color: #fff !important;
}

/* Report tables and small layout tables of fixes.css */
html.a11y-contrast table.hoursReportMainTable,
html.a11y-contrast table.hoursReportMainTable th,
html.a11y-contrast table.hoursReportMainTable td,
html.a11y-contrast .hoursReportMainTableHeaderColor,
html.a11y-contrast .hoursReportMainTableHeaderDays,
html.a11y-contrast .hoursReportTableHeaderWeekend,
html.a11y-contrast .hoursReportSignatureTableTdLarge,
html.a11y-contrast .poljoprivrednaVrstaHead {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .hoursReportGreenText {
	color: #fff !important;
}

html.a11y-contrast .hoursReportDivHeaderLeft,
html.a11y-contrast .hoursReportDivHeaderRight,
html.a11y-contrast .hoursReportDivHeaderMonth,
html.a11y-contrast .hoursReportSignatureTableThSmall,
html.a11y-contrast .BusinessTripPlanDivider {
	border-color: #fff !important;
}

html.a11y-contrast .sideBarTrip,
html.a11y-contrast .wellWhite {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

/* ---------- 6. Navigation inside pages ---------- */

html.a11y-contrast .nav-tabs {
	border-color: #fff !important;
}

html.a11y-contrast .nav-tabs > li > a,
html.a11y-contrast .nav-tabs-justified > li > a {
	background-color: #000 !important;
	border-color: #fff !important;
}

html.a11y-contrast .nav-tabs > li > a:hover,
html.a11y-contrast .nav-tabs > li > a:focus,
html.a11y-contrast .nav > li > a:hover,
html.a11y-contrast .nav > li > a:focus,
html.a11y-contrast .nav .open > a,
html.a11y-contrast .nav .open > a:hover,
html.a11y-contrast .nav .open > a:focus,
html.a11y-contrast .nav-tabs > li.active > a,
html.a11y-contrast .nav-tabs > li.active > a:hover,
html.a11y-contrast .nav-tabs > li.active > a:focus,
html.a11y-contrast .nav-tabs > .active > a,
html.a11y-contrast .nav-tabs > .active > a:hover,
html.a11y-contrast .nav-tabs > .active > a:focus,
html.a11y-contrast .nav-pills > li.active > a,
html.a11y-contrast .nav-pills > li.active > a:hover,
html.a11y-contrast .nav-pills > li.active > a:focus {
	background-color: #fff !important;
	border-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .nav > li.disabled > a,
html.a11y-contrast .nav > li.disabled > a:hover,
html.a11y-contrast .nav > li.disabled > a:focus {
	background-color: #000 !important;
	color: #aaa !important;
	text-decoration: none !important;
}

/* Pills have no border in this theme: a 1px inset frame */
html.a11y-contrast .nav-pills > li > a {
	background-color: #000 !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .nav-tabs.nav-justified > .active > a,
html.a11y-contrast .nav-tabs-justified > .active > a {
	border-color: #fff !important;
}

/* A button inside a nav list (li.pull-right > a.btn.btn-primary on the list pages) keeps the look of a button, not of a tab */
html.a11y-contrast .nav > li > a.btn {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
	text-decoration: none !important;
}

html.a11y-contrast .nav > li > a.btn-primary {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .nav > li > a.btn:hover,
html.a11y-contrast .nav > li > a.btn:focus,
html.a11y-contrast .nav > li > a.btn.active {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .nav > li > a.btn-primary:hover,
html.a11y-contrast .nav > li > a.btn-primary:focus {
	background-color: #000 !important;
	color: #fff !important;
}

/* Marks inside an inverted tab or pill */
html.a11y-contrast .nav-pills > .active > a > .badge,
html.a11y-contrast .nav-tabs > .active > a > .badge,
html.a11y-contrast a.list-group-item.active > .badge {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .breadcrumb {
	background-color: #000 !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .breadcrumb > li + li::before {
	color: #fff !important;
}

html.a11y-contrast .breadcrumb > .active {
	color: #ddd !important;
}

/* Pagination: Bootstrap (.pagination, .pager) and Yii's CLinkPager (ul.yiiPager, its markup sits inside .pager) */
html.a11y-contrast .pagination > li > a,
html.a11y-contrast .pagination > li > span,
html.a11y-contrast .pager li > a,
html.a11y-contrast .pager li > span,
html.a11y-contrast ul.yiiPager a:link,
html.a11y-contrast ul.yiiPager a:visited {
	background-color: #000 !important;
	border-color: #fff !important;
}

html.a11y-contrast .pagination > li > span,
html.a11y-contrast .pager li > span {
	color: #fff !important;
}

html.a11y-contrast .pagination > li > a:hover,
html.a11y-contrast .pagination > li > a:focus,
html.a11y-contrast .pager li > a:hover,
html.a11y-contrast .pager li > a:focus,
html.a11y-contrast ul.yiiPager a:hover,
html.a11y-contrast ul.yiiPager a:focus,
html.a11y-contrast .pagination > .active > a,
html.a11y-contrast .pagination > .active > span,
html.a11y-contrast .pagination > .active > a:hover,
html.a11y-contrast .pagination > .active > span:hover,
html.a11y-contrast .pagination > .active > a:focus,
html.a11y-contrast .pagination > .active > span:focus,
html.a11y-contrast .pagination .active > a,
html.a11y-contrast .pagination .active > a:hover,
html.a11y-contrast ul.yiiPager .selected a,
html.a11y-contrast ul.yiiPager .selected a:hover {
	background-color: #fff !important;
	border-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .pagination > .disabled > span,
html.a11y-contrast .pagination > .disabled > a,
html.a11y-contrast .pagination > .disabled > a:hover,
html.a11y-contrast .pagination > .disabled > a:focus,
html.a11y-contrast .pager .disabled > a,
html.a11y-contrast .pager .disabled > a:hover,
html.a11y-contrast .pager .disabled > a:focus,
html.a11y-contrast .pager .disabled > span,
html.a11y-contrast ul.yiiPager .hidden a:link,
html.a11y-contrast ul.yiiPager .hidden a:visited,
html.a11y-contrast ul.yiiPager .hidden a:hover {
	background-color: #000 !important;
	border-color: #aaa !important;
	border-style: dashed !important;
	color: #aaa !important;
	text-decoration: none !important;
}

/* Toolbars above lists */
html.a11y-contrast .action-bar,
html.a11y-contrast .action-bar-2 {
	background-color: #000 !important;
	box-shadow: inset 0 1px 0 #fff, inset 0 -1px 0 #fff !important;
}

/* ---------- 7. Feedback ---------- */

html.a11y-contrast .alert {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 3px #fff !important;
	text-shadow: none !important;
}

html.a11y-contrast .alert-success {
	box-shadow: inset 0 0 0 3px #00ff00 !important;
}

html.a11y-contrast .alert-info {
	box-shadow: inset 0 0 0 3px #66ccff !important;
}

html.a11y-contrast .alert-warning {
	box-shadow: inset 0 0 0 3px #ffff00 !important;
}

html.a11y-contrast .alert-danger {
	box-shadow: inset 0 0 0 3px #ff5555 !important;
}

html.a11y-contrast .alert hr {
	border-color: #fff !important;
}

/*
 * The notification blocks printed by Core::echoNotificationsIfAny() and the extra-days notice are plain div.error,
 * div.warning, div.success and p.warning (fixes.css defines them without a parent). The same class names sit on
 * fields and rows, so the rule is deliberately generic.
 */
html.a11y-contrast .error,
html.a11y-contrast .info,
html.a11y-contrast .warning,
html.a11y-contrast .success,
html.a11y-contrast .errors,
html.a11y-contrast .errorSummary,
html.a11y-contrast .msgDiv,
html.a11y-contrast .notification,
html.a11y-contrast .warningTrip,
html.a11y-contrast .packageExpensesWarning,
html.a11y-contrast .packageExpensesNotification {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 3px #fff !important;
}

html.a11y-contrast .error,
html.a11y-contrast .errors,
html.a11y-contrast .errorSummary,
html.a11y-contrast .msgDiv.error,
html.a11y-contrast .packageExpensesWarning {
	box-shadow: inset 0 0 0 3px #ff5555 !important;
}

html.a11y-contrast .warning,
html.a11y-contrast .warningTrip {
	box-shadow: inset 0 0 0 3px #ffff00 !important;
}

html.a11y-contrast .success,
html.a11y-contrast .packageExpensesNotification {
	box-shadow: inset 0 0 0 3px #00ff00 !important;
}

html.a11y-contrast .info {
	box-shadow: inset 0 0 0 3px #66ccff !important;
}

html.a11y-contrast .errors li {
	color: #fff !important;
}

/* Labels: black pills with a frame; the semantic ones in the colour of the meaning */
html.a11y-contrast .label {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .label-success {
	box-shadow: inset 0 0 0 2px #00ff00 !important;
}

html.a11y-contrast .label-info {
	box-shadow: inset 0 0 0 2px #66ccff !important;
}

html.a11y-contrast .label-warning {
	box-shadow: inset 0 0 0 2px #ffff00 !important;
}

html.a11y-contrast .label-danger {
	box-shadow: inset 0 0 0 2px #ff5555 !important;
}

html.a11y-contrast a.label:hover,
html.a11y-contrast a.label:focus,
html.a11y-contrast .label[href]:hover,
html.a11y-contrast .label[href]:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Progress bars: white fill on a framed black track, the value text inside the fill is black */
html.a11y-contrast .progress {
	background-color: #000 !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .progress-bar,
html.a11y-contrast .progress-bar-success,
html.a11y-contrast .progress-bar-info,
html.a11y-contrast .progress-bar-warning,
html.a11y-contrast .progress-bar-danger {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	box-shadow: none !important;
}

html.a11y-contrast .well,
html.a11y-contrast .jumbotron {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .well blockquote {
	border-color: #fff !important;
}

html.a11y-contrast .panel {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: none !important;
}

html.a11y-contrast .panel-heading,
html.a11y-contrast .panel-default > .panel-heading,
html.a11y-contrast .panel-primary > .panel-heading,
html.a11y-contrast .panel-success > .panel-heading,
html.a11y-contrast .panel-warning > .panel-heading,
html.a11y-contrast .panel-danger > .panel-heading,
html.a11y-contrast .panel-info > .panel-heading,
html.a11y-contrast .panel-footer {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .panel-success {
	border-color: #00ff00 !important;
	box-shadow: inset 0 0 0 2px #00ff00 !important;
}

html.a11y-contrast .panel-info {
	border-color: #66ccff !important;
	box-shadow: inset 0 0 0 2px #66ccff !important;
}

html.a11y-contrast .panel-warning {
	border-color: #ffff00 !important;
	box-shadow: inset 0 0 0 2px #ffff00 !important;
}

html.a11y-contrast .panel-danger {
	border-color: #ff5555 !important;
	box-shadow: inset 0 0 0 2px #ff5555 !important;
}

html.a11y-contrast .panel > .panel-body + .table,
html.a11y-contrast .panel-group .panel-heading + .panel-collapse .panel-body,
html.a11y-contrast .panel-group .panel-footer + .panel-collapse .panel-body {
	border-color: #fff !important;
}

html.a11y-contrast .list-group-item {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast a.list-group-item .list-group-item-heading {
	color: inherit !important;
}

html.a11y-contrast a.list-group-item:hover,
html.a11y-contrast a.list-group-item:focus,
html.a11y-contrast .list-group-item.active,
html.a11y-contrast .list-group-item.active:hover,
html.a11y-contrast .list-group-item.active:focus {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .list-group-item.active .list-group-item-heading,
html.a11y-contrast .list-group-item.active .list-group-item-text {
	color: #000 !important;
}

/* Modal: black content, 2px frame, no drop shadow; the backdrop stays as it is */
html.a11y-contrast .modal-content {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .modal-header,
html.a11y-contrast .modal-footer {
	border-color: #fff !important;
}

/* Tooltips and popovers: framed, with the arrow in the colour of the frame */
html.a11y-contrast .tooltip-inner {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .tooltip.top .tooltip-arrow,
html.a11y-contrast .tooltip.top-left .tooltip-arrow,
html.a11y-contrast .tooltip.top-right .tooltip-arrow {
	border-top-color: #fff !important;
}

html.a11y-contrast .tooltip.right .tooltip-arrow {
	border-right-color: #fff !important;
}

html.a11y-contrast .tooltip.left .tooltip-arrow {
	border-left-color: #fff !important;
}

html.a11y-contrast .tooltip.bottom .tooltip-arrow,
html.a11y-contrast .tooltip.bottom-left .tooltip-arrow,
html.a11y-contrast .tooltip.bottom-right .tooltip-arrow {
	border-bottom-color: #fff !important;
}

html.a11y-contrast .popover {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .popover-title {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .popover.top .arrow {
	border-top-color: #fff !important;
}

html.a11y-contrast .popover.right .arrow {
	border-right-color: #fff !important;
}

html.a11y-contrast .popover.bottom .arrow {
	border-bottom-color: #fff !important;
}

html.a11y-contrast .popover.left .arrow {
	border-left-color: #fff !important;
}

html.a11y-contrast .popover.top .arrow::after {
	border-top-color: #000 !important;
}

html.a11y-contrast .popover.right .arrow::after {
	border-right-color: #000 !important;
}

html.a11y-contrast .popover.bottom .arrow::after {
	border-bottom-color: #000 !important;
}

html.a11y-contrast .popover.left .arrow::after {
	border-left-color: #000 !important;
}

/* ---------- 8. Widgets ---------- */

/* -- select2 3.x. Its sprite (arrows, clear mark, magnifier) is dark grey on transparent: it gets a white backing. -- */

html.a11y-contrast .select2-container .select2-choice {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

/* A select2 that is also .form-control is framed by the container; a plain one is framed here */
html.a11y-contrast .select2-container:not(.form-control) .select2-choice {
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .select2-container .select2-choice:hover,
html.a11y-contrast .select2-container .select2-choice:focus {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .select2-container .select2-choice > .select2-chosen {
	color: #fff !important;
}

html.a11y-contrast .select2-default {
	color: #ddd !important;
}

html.a11y-contrast .select2-container .select2-choice .select2-arrow {
	background-color: #fff !important;
	background-image: none !important;
	border-color: #fff !important;
}

html.a11y-contrast .select2-container .select2-choice abbr,
html.a11y-contrast .select2-search-choice-close {
	background-color: #fff !important;
}

/* The ring goes around the whole control while it is active or open */
html.a11y-contrast .select2-container-active {
	outline: 3px solid #ffff00 !important;
	outline-offset: 2px !important;
}

html.a11y-contrast .select2-container-active .select2-choice,
html.a11y-contrast .select2-container-active .select2-choices,
html.a11y-contrast .select2-dropdown-open .select2-choice,
html.a11y-contrast .select2-dropdown-open .select2-choices,
html.a11y-contrast .form-control.select2-container.select2-dropdown-open {
	border-color: #fff !important;
	box-shadow: none !important;
	background-image: none !important;
}

html.a11y-contrast .select2-container:not(.form-control).select2-container-active .select2-choice,
html.a11y-contrast .select2-container:not(.form-control).select2-dropdown-open .select2-choice {
	box-shadow: inset 0 0 0 1px #fff !important;
}

/* The helper elements select2 keeps off-screen (1px, clipped) must not gain the frame of a disabled control */
html.a11y-contrast input.select2-offscreen,
html.a11y-contrast input.select2-offscreen[disabled],
html.a11y-contrast select.select2-offscreen,
html.a11y-contrast select.select2-offscreen[disabled] {
	border: 0 !important;
	box-shadow: none !important;
}

/* The scripted focus target of the single select is off-screen: its ring must not appear */
html.a11y-contrast .select2-container .select2-focusser:focus,
html.a11y-contrast .select2-container .select2-input:focus {
	outline: 0 !important;
}

html.a11y-contrast .select2-drop {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .select2-drop-active,
html.a11y-contrast .select2-drop.select2-drop-above,
html.a11y-contrast .select2-drop.select2-drop-above.select2-drop-active,
html.a11y-contrast .select2-drop-auto-width {
	border-color: #fff !important;
}

html.a11y-contrast .select2-search input {
	background-color: #000 !important;
	color: #fff !important;
	border-color: #fff !important;
}

/* The magnifier is decorative; the busy spinner of a loading search stays, on black instead of the light gradient */
html.a11y-contrast .select2-search input:not(.select2-active) {
	background-image: none !important;
}

html.a11y-contrast .select2-search input.select2-active {
	background-image: url("../js/select2/select2-spinner.gif") !important;
	background-repeat: no-repeat !important;
	background-position: 100% !important;
}

html.a11y-contrast .select2-container-multi .select2-choices .select2-search-field input.select2-active {
	background-color: #000 !important;
}

html.a11y-contrast .select2-results {
	background-color: transparent !important;
	color: #fff !important;
}

html.a11y-contrast .select2-results .select2-highlighted {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .select2-results .select2-highlighted ul {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .select2-results .select2-no-results,
html.a11y-contrast .select2-results .select2-searching,
html.a11y-contrast .select2-results .select2-selection-limit,
html.a11y-contrast .select2-more-results {
	background-color: #000 !important;
	color: #ddd !important;
}

html.a11y-contrast .select2-results .select2-disabled,
html.a11y-contrast .select2-results .select2-disabled.select2-highlighted {
	background-color: #000 !important;
	color: #aaa !important;
	text-decoration: line-through !important;
}

html.a11y-contrast .select2-results li em {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Multiple select: the chips are inverted (white on black) so that their dark close mark shows */
html.a11y-contrast .select2-container-multi .select2-choices {
	background-color: #000 !important;
	background-image: none !important;
	border-color: #fff !important;
}

html.a11y-contrast .select2-container-multi:not(.form-control) .select2-choices {
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .select2-container-multi .select2-choices .select2-search-choice {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	border-color: #fff !important;
	box-shadow: none !important;
}

html.a11y-contrast .select2-container-multi .select2-choices .select2-search-choice-focus {
	background-color: #ffff00 !important;
}

html.a11y-contrast .select2-container-multi .select2-choices .select2-search-field input {
	background-color: transparent !important;
	color: #fff !important;
	border: 0 !important;
	box-shadow: none !important;
}

/* Disabled select2: dimmed, dashed frame drawn as an outline (see the disabled controls of section 3) */
html.a11y-contrast .select2-container-disabled {
	border-color: transparent !important;
	box-shadow: none !important;
	outline: 2px dashed #aaa !important;
	outline-offset: -2px !important;
}

html.a11y-contrast .select2-container.select2-container-disabled .select2-choice,
html.a11y-contrast .select2-container-multi.select2-container-disabled .select2-choices,
html.a11y-contrast .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
	background-color: #000 !important;
	color: #aaa !important;
	border-color: #aaa !important;
	box-shadow: none !important;
}

html.a11y-contrast .select2-container.select2-container-disabled .select2-choice .select2-arrow {
	background-color: #aaa !important;
}

html.a11y-contrast .select2-container.select2-container-disabled .select2-choice > .select2-chosen {
	color: #aaa !important;
}

/* -- bootstrap-datepicker (js/bootstrap-datepicker.js): a .dropdown-menu, see section 2 for its frame -- */

html.a11y-contrast .datepicker {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .datepicker table tr td,
html.a11y-contrast .datepicker table tr th {
	color: #fff !important;
}

html.a11y-contrast .datepicker thead tr:first-child th:hover,
html.a11y-contrast .datepicker td.day:hover,
html.a11y-contrast .datepicker td span:hover {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* Days of the neighbouring months, and days that cannot be picked (struck through) */
html.a11y-contrast .datepicker td.old,
html.a11y-contrast .datepicker td.new,
html.a11y-contrast .datepicker td span.old {
	color: #aaa !important;
}

html.a11y-contrast .datepicker td.day.disabled,
html.a11y-contrast .datepicker td.day.disabled:hover {
	background-color: #000 !important;
	color: #aaa !important;
	text-decoration: line-through !important;
}

/* Selected day: inverted. Today (where a plugin marks it): a white frame. */
html.a11y-contrast .datepicker td.active,
html.a11y-contrast .datepicker td.active:hover,
html.a11y-contrast .datepicker td.active:focus,
html.a11y-contrast .datepicker td.active.active,
html.a11y-contrast .datepicker td span.active,
html.a11y-contrast .datepicker td span.active:hover {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	text-shadow: none !important;
}

html.a11y-contrast .datepicker td.today {
	outline: 2px solid #fff !important;
	outline-offset: -2px !important;
}

/*
 * Day states set by js/daily-activity.js: ok_days (past days, complete), more_hours (hours still missing), office.
 * Three different outlines, so they differ by shape and not only by colour.
 */
html.a11y-contrast .datepicker td.day.ok_days {
	background-color: #000 !important;
	color: #fff !important;
	outline: 2px solid #00ff00 !important;
	outline-offset: -2px !important;
}

html.a11y-contrast .datepicker td.day.more_hours {
	background-color: #000 !important;
	color: #fff !important;
	outline: 2px dashed #ff5555 !important;
	outline-offset: -2px !important;
}

html.a11y-contrast .datepicker td.day.office {
	background-color: #000 !important;
	color: #fff !important;
	outline: 2px dotted #ffff00 !important;
	outline-offset: -2px !important;
}

/* A day with a state still reacts to the pointer */
html.a11y-contrast .datepicker td.day.ok_days:hover,
html.a11y-contrast .datepicker td.day.more_hours:hover,
html.a11y-contrast .datepicker td.day.office:hover {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* The pointer of the popup is drawn with two borders: white outline, black fill */
html.a11y-contrast .datepicker::before,
html.a11y-contrast .daterangepicker.opensleft::before,
html.a11y-contrast .daterangepicker.opensright::before,
html.a11y-contrast .bootstrap-timepicker-widget.dropdown-menu::before {
	border-bottom-color: #fff !important;
}

html.a11y-contrast .datepicker::after,
html.a11y-contrast .daterangepicker.opensleft::after,
html.a11y-contrast .daterangepicker.opensright::after,
html.a11y-contrast .bootstrap-timepicker-widget.dropdown-menu::after {
	border-bottom-color: #000 !important;
}

/* -- bootstrap-timepicker (docs/bootstrap-timepicker.js) -- */

html.a11y-contrast .bootstrap-timepicker-widget table td a {
	color: #ffff00 !important;
	border-color: transparent !important;
}

html.a11y-contrast .bootstrap-timepicker-widget table td a:hover,
html.a11y-contrast .bootstrap-timepicker-widget table td a:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
	border-color: #fff !important;
}

/* -- daterangepicker (js/daterangepicker.js) -- */

html.a11y-contrast .daterangepicker {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .daterangepicker .calendar {
	background-color: #000 !important;
	border-color: #fff !important;
}

html.a11y-contrast .daterangepicker .ranges label {
	color: #fff !important;
	text-shadow: none !important;
}

html.a11y-contrast .daterangepicker .ranges li {
	background-color: #000 !important;
	color: #ffff00 !important;
	border-color: #fff !important;
}

html.a11y-contrast .daterangepicker .ranges li:hover,
html.a11y-contrast .daterangepicker .ranges li.active {
	background-color: #fff !important;
	color: #000 !important;
	border-color: #fff !important;
}

html.a11y-contrast .daterangepicker td,
html.a11y-contrast .daterangepicker th {
	color: #fff !important;
}

html.a11y-contrast .daterangepicker td.off,
html.a11y-contrast .daterangepicker td.disabled,
html.a11y-contrast .daterangepicker td.week,
html.a11y-contrast .daterangepicker th.week {
	color: #aaa !important;
}

html.a11y-contrast .daterangepicker td.available:hover,
html.a11y-contrast .daterangepicker th.available:hover {
	background-color: #ffff00 !important;
	color: #000 !important;
}

html.a11y-contrast .daterangepicker td.in-range {
	background-color: #1a1a1a !important;
	color: #fff !important;
	outline: 1px dotted #fff !important;
	outline-offset: -1px !important;
}

html.a11y-contrast .daterangepicker td.active,
html.a11y-contrast .daterangepicker td.active:hover {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	text-shadow: none !important;
}

/* -- jQuery UI (autocomplete, and the date picker of the CGridView filters). The theme sprites are dark: white backing. -- */

html.a11y-contrast .ui-widget,
html.a11y-contrast .ui-widget-content,
html.a11y-contrast .ui-widget-header,
html.a11y-contrast .ui-menu,
html.a11y-contrast .ui-autocomplete,
html.a11y-contrast .ui-datepicker {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .ui-autocomplete,
html.a11y-contrast .ui-datepicker {
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .ui-state-default,
html.a11y-contrast .ui-widget-content .ui-state-default,
html.a11y-contrast .ui-widget-header .ui-state-default,
html.a11y-contrast .ui-button {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	text-decoration: none !important;
}

html.a11y-contrast .ui-state-default a,
html.a11y-contrast .ui-state-default a:link,
html.a11y-contrast .ui-state-default a:visited,
html.a11y-contrast a.ui-state-default {
	color: #fff !important;
	text-decoration: none !important;
}

html.a11y-contrast .ui-state-hover,
html.a11y-contrast .ui-widget-content .ui-state-hover,
html.a11y-contrast .ui-widget-header .ui-state-hover,
html.a11y-contrast .ui-state-focus,
html.a11y-contrast .ui-widget-content .ui-state-focus,
html.a11y-contrast .ui-widget-header .ui-state-focus,
html.a11y-contrast .ui-state-active,
html.a11y-contrast .ui-widget-content .ui-state-active,
html.a11y-contrast .ui-widget-header .ui-state-active,
html.a11y-contrast .ui-menu .ui-menu-item a.ui-state-focus,
html.a11y-contrast .ui-menu .ui-menu-item a.ui-state-active {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	border-color: #fff !important;
}

html.a11y-contrast .ui-state-hover a,
html.a11y-contrast .ui-state-hover a:hover,
html.a11y-contrast .ui-state-hover a:link,
html.a11y-contrast .ui-state-hover a:visited,
html.a11y-contrast .ui-state-active a,
html.a11y-contrast .ui-state-active a:link,
html.a11y-contrast .ui-state-active a:visited {
	color: #000 !important;
}

/* Today in the jQuery UI calendar: a frame, and the selected day inverts */
html.a11y-contrast .ui-state-highlight,
html.a11y-contrast .ui-widget-content .ui-state-highlight,
html.a11y-contrast .ui-widget-header .ui-state-highlight {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
}

html.a11y-contrast .ui-state-highlight a,
html.a11y-contrast .ui-widget-content .ui-state-highlight a {
	color: #fff !important;
}

html.a11y-contrast .ui-state-error,
html.a11y-contrast .ui-widget-content .ui-state-error,
html.a11y-contrast .ui-widget-header .ui-state-error {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #ff5555 !important;
	box-shadow: inset 0 0 0 2px #ff5555 !important;
}

html.a11y-contrast .ui-state-error a,
html.a11y-contrast .ui-state-error-text,
html.a11y-contrast .ui-widget-content .ui-state-error-text {
	color: #fff !important;
}

html.a11y-contrast .ui-state-disabled,
html.a11y-contrast .ui-widget-content .ui-state-disabled,
html.a11y-contrast .ui-widget-header .ui-state-disabled {
	color: #aaa !important;
	opacity: 1 !important;
	text-decoration: line-through !important;
}

html.a11y-contrast .ui-priority-secondary,
html.a11y-contrast .ui-widget-content .ui-priority-secondary,
html.a11y-contrast .ui-widget-header .ui-priority-secondary {
	opacity: 1 !important;
}

html.a11y-contrast .ui-icon {
	background-color: #fff !important;
}

html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td a,
html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td span {
	color: #fff !important;
	text-decoration: none !important;
}

html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td a:hover,
html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td a:focus {
	background-color: #ffff00 !important;
	color: #000 !important;
}

html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td a.ui-state-active {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .ui-datepicker-other-month a,
html.a11y-contrast .ui-datepicker-other-month span,
html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-unselectable span {
	color: #aaa !important;
}

/* The empty cells before the first and after the last day of the month are .ui-state-disabled cells holding a no-break space: struck through, they would show as short dashes */
html.a11y-contrast .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-other-month {
	text-decoration: none !important;
}

html.a11y-contrast .ui-widget-overlay,
html.a11y-contrast .ui-widget-shadow {
	background-color: #000 !important;
	background-image: none !important;
	opacity: 0.7 !important;
}

/* -- jEditable (docs/jeditable): its inline form uses plain inputs and buttons, covered in sections 3 and 4 -- */

/* -- jOrgChart (org chart of the organisation) -- */

html.a11y-contrast div.orgChart .structure-level-2,
html.a11y-contrast div.orgChart .structure-level-4 {
	background-color: #1a1a1a !important;
}

html.a11y-contrast div.orgChart tr.lines td.top,
html.a11y-contrast div.orgChart tr.lines td.left,
html.a11y-contrast div.orgChart tr.lines td.right {
	border-color: #fff !important;
}

html.a11y-contrast div.orgChart div.node,
html.a11y-contrast div.orgChart div.hasChildren {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
}

html.a11y-contrast div.orgChart div.node.hover {
	background-color: #ffff00 !important;
	color: #000 !important;
}

/* -- Course and activity calendars (tpl/daily-activity-list.php, views/karticaTecaja/courseCalendarView.php) -- */

html.a11y-contrast .month-view .day,
html.a11y-contrast .course-month-view .day,
html.a11y-contrast .list-view .day,
html.a11y-contrast .course-list-view .day {
	background-color: #000 !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

/* Weekends and holidays: a slightly lighter black, the holiday name stays in the cell */
html.a11y-contrast .month-view .day.weekend-day,
html.a11y-contrast .course-month-view .day.weekend-day,
html.a11y-contrast .month-view .day.holiday-day,
html.a11y-contrast .course-month-view .day.holiday-day,
html.a11y-contrast .day.holiday-day {
	background-color: #1a1a1a !important;
}

html.a11y-contrast .date-label,
html.a11y-contrast .holiday-date,
html.a11y-contrast .weekend-day .date-label,
html.a11y-contrast .weekday-title.weekend-day,
html.a11y-contrast .holiday-day .date-label {
	color: #fff !important;
}

html.a11y-contrast .day.today,
html.a11y-contrast .month-view .day.today,
html.a11y-contrast .course-month-view .day.today {
	outline: 2px solid #fff !important;
	outline-offset: -2px !important;
}

/* In the course calendar the courses of today are the lighter blue (color-scheme-7), the others royal blue (-8) */
html.a11y-contrast .course-month-view .color-scheme-7,
html.a11y-contrast .course-list-view .color-scheme-7 {
	background-color: #fff !important;
	color: #000 !important;
}

html.a11y-contrast .course-month-view .color-scheme-7 a,
html.a11y-contrast .course-list-view .color-scheme-7 a {
	color: #000 !important;
}

html.a11y-contrast .daily-activities {
	border-color: #fff !important;
}

/* ---------- 9. Login screen (tpl/login.php inside the normal header and footer) ---------- */

html.a11y-contrast body.login {
	background-color: #000 !important;
}

/* The white inner glow of fixes.css becomes a solid 2px frame */
html.a11y-contrast .login-box .well {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
}

html.a11y-contrast .login-box input[type="text"],
html.a11y-contrast .login-box input[type="password"] {
	background-color: #000 !important;
	color: #fff !important;
}

html.a11y-contrast .login .footer {
	color: #fff !important;
}

/* ---------- 10. eSavjetnik layout (views/layouts/esavjetnik.php, css/esavjetnik.css) ---------- */

/* The layout dims labels, notes and links with opacity (0.5 to 0.7): back to full strength */
html.a11y-contrast .mainDiv label,
html.a11y-contrast .allDatesDiv label,
html.a11y-contrast .allDatesDiv h5,
html.a11y-contrast .table th,
html.a11y-contrast .table td::before,
html.a11y-contrast .notification,
html.a11y-contrast .footer,
html.a11y-contrast .month,
html.a11y-contrast .otherData,
html.a11y-contrast .control-label,
html.a11y-contrast .formMainDiv label,
html.a11y-contrast .dropdownTitle,
html.a11y-contrast .coursesAllDiv a,
html.a11y-contrast .coursesAllDiv a:hover,
html.a11y-contrast input[type="radio"] {
	opacity: 1 !important;
}

html.a11y-contrast .formMainDiv .row span label,
html.a11y-contrast .iconSpan {
	color: #fff !important;
}

/*
 * A course entry is one link around several blocks. The yellow background of a hovered link is not painted behind
 * blocks, so the black text of the hover state would land on the black page: the entry keeps yellow text, and the
 * arrow of esavjetnik.css (shown on hover) and the underline mark it.
 */
html.a11y-contrast .coursesAllDiv a:hover,
html.a11y-contrast .coursesAllDiv a:focus,
html.a11y-contrast .coursesAllDiv a:active {
	background-color: #000 !important;
	color: #ffff00 !important;
}

html.a11y-contrast .courseDivider,
html.a11y-contrast #containerWebDivider,
html.a11y-contrast .flex-parent,
html.a11y-contrast .line,
html.a11y-contrast .dateDivider,
html.a11y-contrast .arrow {
	border-color: #fff !important;
}

/* Filter dropdowns of the course lists */
html.a11y-contrast .dropdownDiv > div {
	background-color: #000 !important;
	color: #fff !important;
	box-shadow: inset 0 0 0 2px #fff !important;
}

/* Custom check boxes: the real input is invisible (0 x 0), so the frame, the state and the focus ring sit on .checkmark */
html.a11y-contrast .checkmark {
	background-color: #000 !important;
	border-color: #fff !important;
	box-shadow: inset 0 0 0 1px #fff !important;
}

html.a11y-contrast .containerCheckBox:hover input ~ .checkmark {
	background-color: #ffff00 !important;
}

html.a11y-contrast .containerCheckBox input:checked ~ .checkmark {
	background-color: #fff !important;
	border-color: #fff !important;
}

html.a11y-contrast .containerCheckBox .checkmark::after {
	border-color: #000 !important;
}

html.a11y-contrast .containerCheckBox input:focus ~ .checkmark {
	outline: 3px solid #ffff00 !important;
	outline-offset: 2px !important;
}

html.a11y-contrast .containerCheckBox input:focus {
	outline: 0 !important;
}

/* The stacked table of narrow screens (esavjetnik.css, up to 500px) stripes every second row; only the tables inside .mainDiv and .tableDiv (views/tecaj) are its own */
@media (max-width: 500px) {
	html.a11y-contrast .mainDiv .table tbody tr:nth-child(2n),
	html.a11y-contrast .tableDiv .table tbody tr:nth-child(2n) {
		background-color: #1a1a1a !important;
	}
}

/* ---------- 11. Print ---------- */

/*
 * Nothing is added. The whole file is inside @media screen, so Bootstrap's print rules (black on white) stay in
 * charge, and the bar is hidden by css/accessibility.css.
 */

}
