/*
Template Name: The Full Room Platform
Author: inspect
Version: 2.0
Contact: akram@inspect-agency.com
File: Override variables & global props
*/

[data-bs-theme="dark"] {
  color-scheme: dark;
  --bs-secondary-bg: #1e1f22;
  --bs-secondary-bg-rgb: 30, 31, 34;
  --bs-header-bg: #2b2d31;
  --bs-topbar-search-bg: #1E1F22;
  --bs-header-item-color: #B5BAC1;
  --bs-body-bg: #313338;
  --bs-body-bg-rgb: 49, 51, 56;

  --bs-body-color: #ced4da;
  --bs-body-color-rgb: 206, 212, 218;
  --bs-emphasis-color: #fff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: rgba(206, 212, 218, 0.75);
  --bs-secondary-color-rgb: 206, 212, 218;
  --bs-tertiary-color: rgba(206, 212, 218, 0.5);
  --bs-tertiary-color-rgb: 206, 212, 218;
  --bs-tertiary-bg: #32394e;
  --bs-tertiary-bg-rgb: 50, 57, 78;
  --bs-primary-text-emphasis: #a1a8e5;
  --bs-secondary-text-emphasis: #f2f4f5;
  --bs-success-text-emphasis: #67c8c2;
  --bs-info-text-emphasis: #88c8fb;
  --bs-warning-text-emphasis: #fbd27c;
  --bs-danger-text-emphasis: #f48fa0;
  --bs-light-text-emphasis: #f8f9fa;
  --bs-dark-text-emphasis: #dee2e6;
  --bs-primary-bg-subtle: #272c55;
  --bs-secondary-bg-subtle: #5d5e60;
  --bs-success-bg-subtle: #01423d;
  --bs-info-bg-subtle: #164263;
  --bs-warning-bg-subtle: #63480f;
  --bs-danger-bg-subtle: #5e1c27;
  --bs-light-bg-subtle: #2a3042;
  --bs-dark-bg-subtle: #151821;
  --bs-primary-border-subtle: #3b427f;
  --bs-secondary-border-subtle: #8c8e8f;
  --bs-success-border-subtle: #01625c;
  --bs-info-border-subtle: #226295;
  --bs-warning-border-subtle: #956c16;
  --bs-danger-border-subtle: #8e293a;
  --bs-light-border-subtle: #343b51;
  --bs-dark-border-subtle: #2a3042;
  --bs-heading-color: #fff;
  --bs-link-color: #a1a8e5;
  --bs-link-hover-color: #b4b9ea;
  --bs-link-color-rgb: 161, 168, 229;
  --bs-link-hover-color-rgb: 180, 185, 234;
  --bs-code-color: #f18bba;
  --bs-border-color: #343b51;
  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
  --bs-form-valid-color: #67c8c2;
  --bs-form-valid-border-color: #67c8c2;
  --bs-form-invalid-color: #f48fa0;
  --bs-form-invalid-border-color: #f48fa0;

  --bs-light: #343b51;
  --bs-light-rgb: 52, 59, 81;
  --bs-dark: #343b51;
  --bs-dark-rgb: 52, 59, 81;
  --bs-footer-bg: #36394c;
  --bs-boxed-body-bg: #222736;
  --bs-rightbar-bg: #2a3042;
  --bs-header-item-color-dark: #dee2e6;
}

/* Done Start */
[data-bs-theme=dark][data-sidebar=dark] {
  --bs-sidebar-dark-bg: #2b2d31;
  --bs-sidebar-dark-menu-item-active-bg: #404249;
  --bs-sidebar-dark-menu-item-active-color: #F2F3F5;
  --bs-sidebar-dark-menu-item-hover-color: #DBDEE1;
  --bs-sidebar-dark-menu-item-color: #949BA4;
  --bs-sidebar-dark-menu-sub-item-color: #949BA4;
  --bs-sidebar-dark-menu-item-icon-color: #949BA4; 
}
/* Done End */

:root,
[data-bs-theme="light"] {
  --bs-header-bg: #f2f3f5;
  --bs-sidebar-bg: #f2f3f5;
  --bs-body-bg: #f2f4f7;
  --bs-topbar-search-bg: #E3E5E8;
  --bs-header-item-color: #313338;
  --bs-sidebar-menu-item-active-bg: #D7D9DC;
  --bs-sidebar-menu-item-active-color: #060607;
  --bs-sidebar-menu-item-hover-color: #313338;
  --bs-sidebar-menu-item-color: #5C5E66;
  --bs-sidebar-menu-sub-item-color: #5C5E66;
  --bs-sidebar-menu-item-icon-color: #5C5E66;

  --bs-secondary-bg: rgba(227,229,232, .2);

  --bs-white-text: #fff;
  --bs-secondary: #e9ecef;
  --bs-header-item-sub-color: var(--bs-secondary-color);
  --bs-topbar-user-bg: #f8f9fa;
  --bs-boxed-body-bg: #f8f9fa;
  --bs-topnav-bg: #fff;
  --bs-topnav-item-color: #545b62;
  --bs-topnav-item-color-active: var(--bs-primary);
  --bs-twocolumn-menu-iconview-bg: #fff;
  --bs-twocolumn-menu-bg: #fff;
  --bs-list-group-bg: #fff;
  --bs-rightbar-bg: #fff;
  --bs-footer-bg: #f8f9fa;  
}

[data-bs-theme="light"] .modal .form-control, [data-bs-theme="light"] .modal .select2-container .select2-selection--single{
  background-color: #fff;
}

body[data-sidebar=light] .vertical-menu
{
  background-color: #fff;
}

.card{
  --bs-card-bg: #2b2d31;
}

body[data-sidebar=light] .card{
  --bs-card-bg: #fff;
}

body[data-topbar="dark"] #page-topbar {
  background-color: #2b2d31;
}

body[data-topbar=dark] .header-item, body[data-topbar=dark] .noti-icon i{
  color: #B5BAC1 !important;
}

body[data-sidebar=light] #sidebar-menu ul li a:hover{
  background-color: #DFE1E5;
}
body[data-sidebar=dark] #sidebar-menu ul li a:hover{
  background-color: #35373C;
}

body[data-bs-theme=dark] .menu-title, body[data-bs-theme=light] .menu-title{
  color: #a1a8e5 !important;
  opacity: .9;
}

body[data-bs-theme=dark].vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a{
  background-color: #35373C;
}
body[data-bs-theme=light].vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a{
  background-color: #DFE1E5;
}

body[data-bs-theme=dark] .searchWrapper input, body[data-sidebar=dark] .searchWrapper .select2-container .select2-selection--single{
  background-color: var(--bs-topbar-search-bg);
}

body[data-bs-theme=light] .searchWrapper input, body[data-bs-theme=dark] .searchWrapper .select2-container .select2-selection--single{
  background-color: var(--bs-topbar-search-bg);
}

.dropdown-menu{
  --bs-dropdown-bg: var(--bs-body-bg);
  --bs-dropdown-link-hover-bg: #404249;
  --bs-dropdown-link-active-bg: #3f4149;
}

body[data-bs-theme=light] .select2-dropdown{
  background-color: white;
}

body[data-bs-theme=light] .dropdown-menu{
  --bs-dropdown-link-hover-bg: #DFE1E5;
  --bs-dropdown-link-active-bg: #d5d7db;
}

[data-bs-theme="dark"] .table{
  --bs-table-bg: #2B2D31;
  --bs-table-striped-bg: #313338;
  --bs-table-hover-bg:rgba(255, 255, 255, 0.05);
  /* --bs-table-hover-bg:#313338; */
}

.table{
  --bs-table-hover-bg:rgba(0, 0, 0, 0.05);
}

.table.dataTable thead .sorting:after, .table.dataTable thead .sorting_asc:after, .table.dataTable thead .sorting_asc_disabled:after, .table.dataTable thead .sorting_desc:after, .table.dataTable thead .sorting_desc_disabled:after{
  right: 1em !important;
}
.pagination .page-item:last-child .page-link{
  border-top-right-radius: 50px !important;
  border-bottom-right-radius: 50px !important;
}

.pagination .page-item:first-child .page-link{
  border-top-left-radius: 50px !important;
  border-bottom-left-radius: 50px !important;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination{
  margin-top: 12px;
}

.pagination .page-item .page-link{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width:32px;
  height: 32px;
}

.pagination .page-item a{
  font-size: 12px !important;
}

.btn-close:focus{
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.modal{
  --bs-modal-bg: #292a2e;
}

.modal .modal-footer, .modal .modal-header{
  background-color: #232428;
}

[data-bs-theme="light"] .modal{
  --bs-modal-bg: #f7f7f7;
}

[data-bs-theme="light"] .modal .modal-footer, [data-bs-theme="light"] .modal .modal-header{
  background-color: #f2f2f2;
}

table.dataTable>tbody>tr.child ul.dtr-details{
  width: 100%;
}

.swal2-styled.swal2-confirm, .swal2-styled.swal2-cancel{
  border-radius: 50px;
  font-size: 14px;
}

[data-bs-theme="dark"] .swal2-popup{
  background-color: #292a2e !important;
}

.swal2-popup{
  background-color: #f7f7f7;
}

.swal2-icon.swal2-error{
  border-color: #ec4561;
  color: #ec4561;
}

.swal2-icon.swal2-error [class^=swal2-x-mark-line]{
  background-color: #ec4561;
}

[data-bs-theme="dark"] .datepicker table tr td span.focused, [data-bs-theme="dark"] .datepicker table tr td span:hover, [data-bs-theme="dark"] .datepicker table tr td.day.focused, [data-bs-theme="dark"] .datepicker table tr td.day:hover{
  background-color: var(--bs-primary) !important;
  /* color: #232428 !important; */
}

[data-bs-theme="dark"] .datepicker .datepicker-switch:hover,[data-bs-theme="dark"] .datepicker .next:hover,[data-bs-theme="dark"] .datepicker .prev:hover,[data-bs-theme="dark"] .datepicker tfoot tr th:hover{
  background-color: var(--bs-primary) !important;
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled.disabled, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover.disabled, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active.disabled:hover:hover, .datepicker table tr td span.active.disabled:hover[disabled], .datepicker table tr td span.active.disabled[disabled], .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover.disabled, .datepicker table tr td span.active:hover:active, .datepicker table tr td span.active:hover:hover, .datepicker table tr td span.active:hover[disabled], .datepicker table tr td span.active[disabled]{
  background-color: var(--bs-primary) !important;
}

.datepicker table tr td span.active, .datepicker table tr td span.active.disabled, .datepicker table tr td span.active.disabled:hover, .datepicker table tr td span.active:hover{
  background-image: none !important;
}

span.input-group-text{
  font-size: 12px;
  font-style: italic;
  background-color: inherit !important;
}

[data-bs-theme="light"] .offcanvas{
  background-color: rgb(227 229 232);
}