.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

/*Datatable loader*/
.table-loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Helpy brand accents (Plan 2) — overrides Minton teal without editing theme bundles */
:root {
  --helpy-primary: #F76103;
  --helpy-primary-hover: #F98135;
  --helpy-primary-active: #d95403;
  --helpy-primary-focus: rgba(247, 97, 3, 0.35);
}

/* Provider: light logo bar so full Helpy wordmark stays readable on topbar */
.logo-box,
body[data-sidebar-color="brand"]:not([data-layout-mode="detached"]) .logo-box,
body[data-sidebar-color="gradient"]:not([data-layout-mode="detached"]) .logo-box {
  background-color: #ffffff !important;
}

body[data-sidebar-color="dark"]:not([data-layout-mode="detached"]) .logo-box {
  background-color: #2d353e !important;
}

.navbar-custom {
  background-color: #ffffff !important;
  box-shadow: 0 1px 1px rgba(50, 58, 70, 0.1);
}
.navbar-custom .topnav-menu .nav-link {
  color: #6c757d !important;
}
.navbar-custom .dropdown.show .nav-link {
  background-color: rgba(50, 58, 70, 0.03) !important;
}
.navbar-custom .button-menu-mobile,
.navbar-custom .pro-user-name {
  color: #323a46 !important;
}
.navbar-custom .noti-icon {
  color: #6c757d !important;
}

#sidebar-menu > ul > li > a:hover,
#sidebar-menu > ul > li > a:focus,
#sidebar-menu > ul > li > a:active,
#sidebar-menu > ul > li > a.mm-active,
#sidebar-menu .menuitem-active > a,
#sidebar-menu .menuitem-active .active,
body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:hover,
body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:active,
body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li > a:focus,
body[data-sidebar-size="condensed"] .left-side-menu #sidebar-menu > ul > li:hover > a {
  color: var(--helpy-primary) !important;
}

.btn-primary {
  color: #fff;
  background-color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus {
  color: #fff;
  background-color: var(--helpy-primary-hover);
  border-color: var(--helpy-primary-hover);
  box-shadow: 0 0 0 0.15rem var(--helpy-primary-focus);
}
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: var(--helpy-primary-active);
  border-color: var(--helpy-primary-active);
}
.btn-primary.disabled,
.btn-primary:disabled {
  background-color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}

.btn-outline-primary {
  color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled):active {
  color: #fff;
  background-color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}

.bg-primary {
  background-color: var(--helpy-primary) !important;
}
.text-primary {
  color: var(--helpy-primary) !important;
}
.badge-primary {
  background-color: var(--helpy-primary);
}
.page-item.active .page-link {
  background-color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: var(--helpy-primary);
}
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--helpy-primary);
  border-color: var(--helpy-primary);
}