:root {
    --orange: #EF5F0E;
    --orange-light: #ff7f37;
    --orange-dark: #BD4400;
    --orange-rgb: 239, 95, 14;
    --orange-light-rgb: 255, 127, 55;
    --orange-dark-rgb: 189, 68, 0;
    --white: #FFF;
    --gray: #CCC;
    --light-blue: #17A2B8;
    --green: #28A745;
    --light-gray: #6C757D;
}

main > .container {
    max-width: 2440px !important;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}

.table-orange > *, .table-orange > tr > *{
    border-color: var(--orange) !important;
    background-color: var(--orange) !important;
    color: var(--white);
}

.table-orange > tr a {
    text-decoration: none;
    color: var(--white);
}

.dataTables_info {
    margin-right: 5px;
}

.dataTables_length {
    margin-top: 7px;
}

.header-list-container p {
    margin-bottom: 0;
}

.header-list-container div {
    width: 18%;
    margin: 0 8px;
}

.header-list-container .title {
    border-top: solid 1px var(--gray);
}


.header-list-container .total {
    font-size: 1.5rem;
}

.pagination > li {
    display: inline-block;
    margin-right: 10px;
}

.dataTables_wrapper.no-footer .dataTables_paginate span,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.previous {
    margin-right: 8px;
}

.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button {
	padding: 6px 12px;
	border: 1px solid #ddd;
	color: #333;
	text-decoration: none;
	background: unset;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.pagination > li > a,
.pagination > li > span {
    padding: 6px 12px;
    border: 1px solid #ddd;
    color: #333;
    text-decoration: none;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button:hover {
    background: var(--orange-light);
    border-color: var(--orange-light);
    color: #fff;
}

.pagination > li > a:focus,
.pagination > li > span:focus,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button:focus,
.pagination > li > a:focus-visible,
.pagination > li > span:focus-visible,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button:focus-visible {
	box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
	-webkit-box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
	-moz-box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
	color: var(--orange-dark);
    outline: none;
}

.pagination > .active > a,
.pagination > .active > span,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.current {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff !important;
}

.pagination > .active > a:hover,
.pagination > .active > span:hover,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.current:hover {
    background: var(--orange-dark);
    border-color: var(--orange-dark);
    color: #fff !important;
    box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
    -webkit-box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
    -moz-box-shadow: 0 0 0 0.25rem rgba(var(--orange-light-rgb), 0.5);
}

.pagination > .disabled > span,
.pagination > .disabled > a,
.pagination > .disabled > span:hover,
.pagination > .disabled > a:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a:focus,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper.no-footer .dataTables_paginate .paginate_button.disabled:focus {
    color: #777 !important;
    cursor: not-allowed;
    background-color: transparent;
    border-color: #ddd;

}

.btn-dash {
    border: 2px dashed #ced4da;
}

.btn-regnskab-primary {
    color: white;
    background-color: var(--orange);
    border-color: var(--orange);
    padding: 0.375rem 0.75rem;
}

.btn-regnskab-primary:hover, .datepicker.datepicker-dropdown span.year:hover, .btn-regnskab-primary:focus {

    color: white;
    background-color: var(--orange-light);
    border-color: var(--orange-light);
}

.btn-regnskab-primary:active, .datepicker.datepicker-dropdown span.year.active {
    color: white;
    background-color: var(--orange-dark);
    border-color: var(--orange-dark);
    background-image: unset;
}

.btn-regnskab-primary:focus-visible {
    box-shadow: rgba(239, 95, 14, 0.5) 0px 0px 0px 4px;
    color: white;
    background-color: var(--orange-dark);
}

.btn-regnskab-primary.disabled, .btn-regnskab-primary:disabled, fieldset:disabled .btn-regnskab-primary, .datepicker.datepicker-dropdown span.year.focused {
    color: black;
    pointer-events: none;
    background-color: var(--orange-light);
    border-color: var(--orange-light);
    opacity: 0.65;
}

.btn-xl {
    padding: 1rem 1.5rem;
    border-radius: 4.8px;
}

/*for <a> buttons */
a.btn-secondary {
    align-content: center;
}

.sub-table-danger {
    background-color: #f8d7da !important;
}

.form-check-input:checked {
    background-color: var(--orange);
    border-color: var(--orange);
}

.form-check-input:focus, .form-control:focus, .form-select:focus {
    border-color: var(--orange-light);
    outline: 0;
    box-shadow: rgba(var(--orange-light-rgb), 0.5) 0px 0px 0px 4px
}

.form-check-input:focus-visible, .form-control:focus-visible, .form-select:focus-visible {
    border-color: var(--orange-light);
    outline: 0;
    box-shadow: rgba(var(--orange-light     -rgb), 0.5) 0px 0px 0px 4px
}

#transaction-table th.sorting {
	padding: 0.5rem;
}

/* Select2 and dropdown overrides */
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable, .dropdown-item:focus, .dropdown-item:hover {
    background-color: var(--orange-light);
    color: white;
}

.dropdown-item:focus {
    border-color: var(--orange-light);
    outline: 0;
    box-shadow: rgba(var(--orange-light-rgb), 0.5) 0px 0px 0px 4px;
}

/* BS5.3 Form-label override */

.form-label {
	font-size: 0.875rem;
	margin-bottom: 0.25rem;
}

.text-bold {
    font-weight: bold;
}

.th-orange {
    background-color: var(--orange) !important;
    color: #fff !important;
}

.th-light-blue {
    background-color: var(--light-blue) !important;
    color: #fff !important;
}

.th-green {
    background-color: var(--green) !important;
    color: #fff !important;
}

.th-gray {
    background-color: var(--bs-gray) !important;
    color: #fff !important;
}

.th-light-gray {
    background-color: var(--light-gray) !important;
    color: #fff !important;
}

.td-gray {
    background-color: #E5E5E5 !important;
}

.thead-light-blue th {
    background-color: var(--light-blue) !important;
    color: #fff !important;
}

.flatpickr-wrapper {
    width: 100%;
}