:root,
[data-bs-theme=light] {
--bs-primary: #9D162E !important; /*use CCIA red bule #1B84FF;*/
--bs-primary-rgb: 157, 22, 46; /*bule 27, 132, 255;*/
--bs-primary-active: #801225 !important;/*use CCIA red old:#107EFF;*/
--bs-app-sidebar-dark-bg-color: #404040 !important;
.pagination{
  --bs-pagination-active-bg:var(--bs-primary) !important;
}
}

@media (prefers-reduced-motion: reduce) {
    .collapsing {
        transition-property: height, visibility;
        transition-duration: .35s;
    }
}

.badge-secondary {
  color: var(--bs-success-inverse);
  background-color: #a3a3a3;
}
  
.title_icon{
	padding-right:8px;
}
.toggleOption.selected {
  color: var(--bs-primary) !important;
}

.menu_attrction {
  color: var(--bs-primary) !important;
}

.toggleSwitchCon {
   background-color: var(--bs-primary) !important;
}

#kt_app_header_container {
	border-bottom: 0.25rem solid var(--bs-primary) !important;
}


.card-header:not(.collapsible) {
	border-bottom: 0.20rem solid var(--bs-primary) !important;
}

.collapse.show {
	border-top: 0.20rem solid var(--bs-primary) !important;
}


.table-dark {
	  --bs-table-bg: #404040;
}

/*Make text boxes and dropdowns darker*/
.form-control, .form-select {
	background-color: var(--bs-gray-200) !important;
	border: 1px solid var(--bs-gray-500) !important;
}

.form-control:focus, .form-select:focus, .form-select.form-select-solid:focus {
  border: 2px solid var(--bs-gray-500) !important;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), 0 0 8px rgba rgb(128, 128, 64, 0.2);
  background-color: var(--bs-gray-300) !important;
}

.uppercase {
  text-transform: uppercase;
}

table.dataTable th.dt-type-numeric{
	text-align: left !important;
}

table.dataTable th.dt-type-date{
	text-align: left !important;
}

/* Notes */
.note_headline{
    margin: 0;
    padding: 3px 1px 0;
}
.note_headline a:link {text-decoration: none; cursor: pointer;}
.note_headline a:hover {text-decoration: underline;}
.note_content{
    margin: 0;
    padding: 3px 15px 3px;
}
.note_time{
    color: rgba(0, 39, 59, 0.7);
    font-size: 12px;
    font-weight: 500;
}
.note_edit{
	float: right;
	padding-right:5px;	
	display: none;
	background-repeat: no-repeat;
	background-position: 0px center;
}

.note_edit  a {
    color: blue;
    text-decoration: none;
}

.note_edit a:hover {
	color: blue;
    text-decoration: underline;
}
/* Notes */

/* Phone input width */
select.phone {flex: 0 1 200px;}
input.phone {flex: 0 1 200px;}
input.ext {flex: 0 1 100px;}
input.contact {flex: 0 1 200px;}

/* Password rules */
.checkmark {
    display: inline-block;
    background-color: transparent;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    position: relative;
}

.checkmark::before {
    content: '✓';
    font-size: 13px;
	font-weight: bolder;
    color: var(--bs-white);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Add border to dropdown input*/
.form-select.form-select-solid {
	border: 1px solid var(--bs-gray-300) !important;
}

/* Add border to disabled input text */
.form-control.form-control-solid {
	border: 1px solid var(--bs-gray-300) !important;
}

/* Add highlight to menu links in header */
.guest-menu {
	background-color: #F1F1F4 !important;
}

/* Sidebar scrollbar color */
[data-kt-app-layout=dark-sidebar] .app-sidebar .scroll-y:hover,
[data-kt-app-layout=dark-sidebar] .app-sidebar .hover-scroll-y:hover {
  scrollbar-color: #BEBEBE transparent !important;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .scroll-y:hover::-webkit-scrollbar-thumb,
[data-kt-app-layout=dark-sidebar] .app-sidebar .hover-scroll-y:hover::-webkit-scrollbar-thumb {
  background-color: #BEBEBE !important;
}

/* Sidebar menu link active */
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
    background-color: var(--bs-primary) !important;
}

/* Add border and cursor pointer on checkbox and radiobutton */
.form-check-input {
    cursor: pointer;
}

/*radio button darker background*/
.form-check-input:not(:checked) {
  background-color: var(--bs-gray-100) !important;
  border: 0.4em solid var(--bs-gray-500) !important;
}

/*Sidebar menu bullet*/
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-bullet .bullet {
    background-color: #ffffff !important;
}

/*Sidebar menu hover*/
.app-sidebar-wrapper .menu-link:hover {
	background-color: #d45b6b !important;
}

/*Sidebar submenu hover*/
.app-sidebar-wrapper .menu-sub-indention .menu-item .menu-item .menu-link {
	margin-right: 1rem;
}

/*Deactivated Event*/

.deactivated { text-decoration: line-through; }

/*Change color of 'Choose File' button to red in input file*/
.form-control::file-selector-button {
	color: var(--bs-primary-inverse) !important;
	background-color: var(--bs-primary) !important;
}

.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
    color: var(--bs-primary-inverse) !important;
	background-color: var(--bs-primary-active) !important;
}

/*Hide CCIA contact info in header for smaller screens*/
@media (max-width: 1366px){
  .header-contact {
    display: none !important;
  }
}

/*Add styling to non-menu tabs*/
.non-menu-tabs {
  border-bottom-width: 2px !important;
  border-bottom-style: solid !important;
  border-bottom-color: var(--bs-gray-300) !important;
}

.non-menu-tabs .nav-item .nav-link {
  color: #ffffff !important;
  border: 0 !important;
  transition: color 0.2s ease !important;
  margin: 0 1rem !important;
  background: var(--bs-app-sidebar-dark-bg-color) !important;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x) !important;
}

.non-menu-tabs .nav-item.show .nav-link,
.non-menu-tabs .nav-item .nav-link:hover:not(.disabled) {
    background-color: #d45b6b !important;
    border: 0 !important;
    transition: color 0.2s ease !important;
    color: white !important;
}

.non-menu-tabs .nav-item .nav-link.active {
    background-color: var(--bs-primary) !important;
}

/*Additional styling to make required fields more visible*/
.required {
	font-weight: bold;
    color: var(--bs-danger-active);
    text-transform: uppercase;
}


/*Change placeholder text color for multiple Select2*/
.select2-container--bootstrap5 .select2-selection--multiple .select2-search__field::placeholder {
	color: var(--bs-gray-700) !important;
}

/*Set font size to small for table td since it became too large after Thymeleaf migration*/
td {
	font-size: small !important;
}

/*Set accordion transition effects*/
.collapse {
    overflow: hidden;
    transition: max-height 0.5s ease;
    max-height: 0;
}

.collapse.show {
  	max-height: none;
}

.card-toolbar {
    transition: transform 0.3s ease;
}

.card-toolbar.rotate-180 {
    transform: rotate(180deg);
}