/* override django's widgets.css */
ul.radio-with-help span.help-tooltip,
ul.radio-with-help img.help-tooltip{
    padding-right: 10px;
}

td.delete .inline-deletelink {
    float: left;
    margin-left: 10px;
}

.inline-deletelink {
    background: url("/site_media/admin/img/icon-deletelink.svg") 0 0 no-repeat;
    background-size: 18px;
}

.calendarbox {
    width: 19em;
}

.calendarnav-header {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.calendarnav-next {
    float: right;
    margin-left: 1px;
}

.calendarnav-previous {
    float: left;
    margin-right: 1px;
}

.calendarbox .calendarnav-previous,
.calendarbox .calendarnav-next {
    position: static;
}

.calendar caption, .calendarbox h2 {
    background: var(--header-bg-color);
    color: white;
}

.selector .selector-available input {
    width: auto;
}

.selector .selector-filter input[type="text"] {
    width: 230px;
}

.selector .selector-filter {
    padding: 4px;
    height: 24px;
    vertical-align: middle;
}
.selector .selector-filter label {
    margin: 3px 0 0;
    width: 15px;
}
.selector .selector-chosen .selector-filter {
    line-height: 24px;
}
.selector-available, .selector-chosen {
    width: 300px;
}
.stacked .selector-available, .stacked .selector-chosen {
    width: 300px;
}
.selector-chosen select {
    height: 19.8em;
}
.selector ul.selector-chooser {
    background-color: whitesmoke;
}
.selector select {
    width: 300px;
}
.selector {
    width: 640px;
}
.stacked {
    float: left;
    width: 300px;
}

.selector .display_type {
    padding: 4px 0;
    text-align: left;
}

.selector .display_type label {
    font-size: 11px;
}

.selector .display_type label.vTitle {
    display: inline;
    float: none !important;
    font-weight: bold !important;
}

.ui-datepicker-trigger {
    cursor: pointer;
}

.datetimeshortcuts {
	font-size: 11px;
}

/* easy select CSS */

span.select2-container ul.select2-choices {
    margin-left: auto;
}

.select2-selection__choice {
	padding: 5px 5px 5px !important;
    min-height: 12px;
}
span.select2-container--default
.select2-selection--multiple
.select2-selection__choice {
	border: none;
    color: white;
    background: var( --main-color);
    box-shadow: 0 0 2px #fff inset, 0 1px 0 #fff;

}
span.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: white;
}
span.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: red;
}
span.select2-container--default .select2-selection--multiple {
	min-width: 300px;
	cursor: pointer;
    width: 500px;
    overflow: auto;
    max-height: 100px;
    margin: 8px 0 8px 0;
}

span.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding-top: 2px;
    line-height: 18px;
	box-shadow: 0 2px 3px rgba(0, 0, 0, .15);
	background-image: var(--body-bg);
	text-align: center;
	border-radius: 4px;
}

span.select2-container .select2-selection--single {
    height: 22px;
    font-size: 13px;
	min-width: 13em;
}
span.select2-container .select2-selection--single:hover {
    background-color: var(--hover-bg-color);
}
span.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 20px;
}
.select2-container--open .select2-dropdown--below {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    min-width: 500px;

}

.select2-selection--multiple .select2-search,
.select2-selection--multiple .select2-selection__clear {
     display: block;
 }

.select2-selection__clear {
    display: block;
    width: 100%;
    text-align: right;
    color: red;
    font-weight: normal !important;
    font-size: 14px;
}

.select2-search__field {
    border: 1px black solid;
    width: 50%;
}

select[multiple].select2-hidden-accessible {
    height: 30px;
    width: 300px;
    min-height: unset;
}

/* Styling for checkboxes */
:root {
	--size: 1.2em;
	--height: 10px;
}

input[type="checkbox"] {
	font-size: 10px;
	appearance: none;
	width: 2em;
	height: var(--size);
	background: #9e9e9e;
	border-radius: 3em;
	position: relative;
	cursor: pointer;
	outline: none;
	padding: 0;
	border: none;
	transition: all .2s ease-in-out;
}
.aligned .form-row input[type="checkbox"] {
    margin-bottom: 4px;
}

input[type="checkbox"]:focus {
    outline: none;
}

input[type="checkbox"]:checked {
	background: var(--checkbox-checked-bg-color);
}

input[type="checkbox"]:after {
	position: absolute;
	content: "";
	width: var(--size);
	height: var(--size);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 .25em rgba(0, 0, 0, .3);
	transform: scale(.8);
	left: 0;
	transition: all .2s ease-in-out;
}

input[type="checkbox"]:checked:after {
	left: calc(100% - var(--size));
}

#content input[type='checkbox']:disabled {
    background: #b5b5b5;
    opacity: 0.7;
    cursor: not-allowed;
}
#content input[type='checkbox']:checked:disabled {
    background: #00a513;
    background: var(--checkbox-checked-bg-color);
    opacity: 0.5;
}

input[type='checkbox'] + label {
    margin-left: 0 !important;
    width: auto !important;
}

.iti.iti--allow-dropdown.iti--separate-dial-code .intl-phone-input {
    padding-left: 65px;
}

input.intl-phone-input {
    /* prevent the width from changing with the country */
    width: 246px;
}
input.intl-phone-input::placeholder {
    color: #bbb;
}
.form-row .checkbox-image {
    margin-right: 8px;
    margin-bottom: 2px;
    vertical-align: middle;
}