/*================================================================================
Item Name: Ultimate SMS - Bulk SMS Application For Marketing
Author: Codeglen
Author URL: https://codecanyon.net/user/codeglen
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
form .required:after {
  color: #4f7bff;
  content: "*";
  font-size: 15px;
  position: relative;
  left: 3px;
}

/* Switches */
.form-switch-md .form-check-input {
  width: 4rem !important;
}

.form-switch-lg .form-check-input {
  width: 6rem !important;
}

.form-switch-xl .form-check-input {
  width: 8rem !important;
}

.feather-16 {
  width: 16px;
  height: 16px;
}

.feather-20 {
  width: 20px;
  height: 20px;
}

/* Groupie brand primary buttons (customer portal) */
body.customer-portal {
  --groupie-blue-1: #0b63ff;
  --groupie-blue-2: #18a0ff;
  --groupie-blue-glow: rgba(11, 99, 255, 0.35);
  --bs-primary: #0b63ff;
  --bs-primary-rgb: 11, 99, 255;
  --bs-purple: #0b63ff;
}
body.customer-portal .btn.btn-primary,
body.customer-portal .btn.btn-gradient-primary,
body.customer-portal .btn.btn-gradient,
body.customer-portal .btn-gradient,
body.customer-portal .themeButton {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: transparent !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 10px 22px -14px var(--groupie-blue-glow) !important;
}
body.customer-portal .btn.btn-primary:hover,
body.customer-portal .btn.btn-primary:focus,
body.customer-portal .btn.btn-gradient-primary:hover,
body.customer-portal .btn.btn-gradient-primary:focus,
body.customer-portal .btn.btn-gradient:hover,
body.customer-portal .btn.btn-gradient:focus,
body.customer-portal .btn-gradient:hover,
body.customer-portal .btn-gradient:focus,
body.customer-portal .themeButton:hover,
body.customer-portal .themeButton:focus {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
body.customer-portal .btn.btn-primary:active,
body.customer-portal .btn.btn-gradient-primary:active,
body.customer-portal .btn.btn-gradient:active,
body.customer-portal .btn-gradient:active,
body.customer-portal .themeButton:active {
  filter: brightness(0.98);
  transform: translateY(0);
}

/* Global primary color overrides (customer portal) */
body.customer-portal .text-primary,
body.customer-portal .link-primary,
body.customer-portal a.text-primary {
  color: var(--groupie-blue-1) !important;
}
body.customer-portal .bg-primary {
  background-color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .border-primary {
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .badge-light-primary,
body.customer-portal .badge.bg-light-primary {
  background: rgba(11, 99, 255, 0.14) !important;
  color: var(--groupie-blue-1) !important;
  border-color: rgba(11, 99, 255, 0.25) !important;
}
body.customer-portal .form-check-input:checked {
  background-color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .pagination .page-item.active .page-link,
body.customer-portal .page-item.active .page-link {
  background-color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .nav-pills .nav-link.active,
body.customer-portal .nav-pills .show > .nav-link {
  background-color: var(--groupie-blue-1) !important;
}

/* Page load progress bar (pace) */
html[data-portal="customer"] body.customer-portal .pace .pace-progress,
html[data-portal="customer"] body.customer-portal .pace .pace-activity {
  background: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
}

/* Outline primary (buttons/tabs) */
body.customer-portal .btn.btn-outline-primary,
body.customer-portal .btn-outline-primary,
body.customer-portal .btn.btn-outline-primary:hover,
body.customer-portal .btn.btn-outline-primary:focus,
body.customer-portal .btn.btn-outline-primary:active,
body.customer-portal .btn.btn-outline-primary.active,
body.customer-portal .btn.btn-outline-primary:not(:disabled):not(.disabled):active,
body.customer-portal .btn-outline-primary:hover,
body.customer-portal .btn-outline-primary:focus,
body.customer-portal .btn-outline-primary:active,
body.customer-portal .btn-outline-primary.active,
body.customer-portal .btn-outline-primary:not(:disabled):not(.disabled):active,
body.customer-portal .nav-pills .nav-link,
body.customer-portal .nav-tabs .nav-link {
  color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .btn.btn-outline-primary:hover,
body.customer-portal .btn.btn-outline-primary:focus,
body.customer-portal .btn.btn-outline-primary:active,
body.customer-portal .btn.btn-outline-primary.active,
body.customer-portal .btn-outline-primary:hover,
body.customer-portal .btn-outline-primary:focus,
body.customer-portal .btn-outline-primary:active,
body.customer-portal .btn-outline-primary.active,
body.customer-portal .nav-pills .nav-link.active,
body.customer-portal .nav-tabs .nav-link.active,
body.customer-portal .nav-pills .nav-link:hover,
body.customer-portal .nav-tabs .nav-link:hover {
  background: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px -14px var(--groupie-blue-glow) !important;
  border-color: transparent !important;
}

@keyframes groupieGlowPulse {
  0% {
    box-shadow: 0 4px 10px rgba(11, 99, 255, 0.18), 0 0 0 rgba(11, 99, 255, 0);
    filter: drop-shadow(0 2px 6px rgba(11, 99, 255, 0.12));
  }
  50% {
    box-shadow: 0 8px 18px rgba(11, 99, 255, 0.32), 0 0 12px rgba(24, 160, 255, 0.28);
    filter: drop-shadow(0 6px 10px rgba(11, 99, 255, 0.28));
  }
  100% {
    box-shadow: 0 4px 10px rgba(11, 99, 255, 0.18), 0 0 0 rgba(11, 99, 255, 0);
    filter: drop-shadow(0 2px 6px rgba(11, 99, 255, 0.12));
  }
}

body.customer-portal .btn.btn-primary:not(:disabled):not(.disabled),
body.customer-portal .btn.btn-gradient-primary:not(:disabled):not(.disabled),
body.customer-portal .btn.btn-gradient:not(:disabled):not(.disabled),
body.customer-portal .btn-gradient:not(:disabled):not(.disabled),
body.customer-portal .themeButton:not(:disabled):not(.disabled) {
  animation: groupieGlowPulse 2.6s ease-in-out infinite !important;
}

/* Groupie brand navigation active state (customer portal) */
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.active > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.open > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li > a:active,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li > a:focus {
  position: relative;
  background: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: var(--groupie-blue-1) !important;
  box-shadow: 0 12px 26px rgba(11, 99, 255, 0.35), 0 0 18px rgba(24, 160, 255, 0.35) !important;
  filter: drop-shadow(0 8px 14px rgba(11, 99, 255, 0.35)) !important;
  color: #fff !important;
  z-index: 1;
  overflow: visible;
}
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.active > a {
  animation: groupieGlowPulse 1.8s ease-in-out infinite !important;
}
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.active > a::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(11, 99, 255, 0.55), rgba(24, 160, 255, 0.35));
  filter: blur(6px);
  opacity: 0.55;
  z-index: 0;
  animation: groupieGlowPulse 1.8s ease-in-out infinite;
  pointer-events: none;
}

/* Parent item (has sub-menu) active state: lighter gradient */
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.active > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.active:not(.open) > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.open > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub > a[aria-expanded="true"] {
  background: linear-gradient(90deg, rgba(11, 99, 255, 0.22) 0%, rgba(24, 160, 255, 0.32) 100%) !important;
  background-image: linear-gradient(90deg, rgba(11, 99, 255, 0.22) 0%, rgba(24, 160, 255, 0.32) 100%) !important;
  background-color: rgba(11, 99, 255, 0.2) !important;
  box-shadow: 0 6px 14px rgba(11, 99, 255, 0.18) !important;
  color: #e6f0ff !important;
  animation: none !important;
}
/* Ensure parent items never take the "full" active state */
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.active > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.open > a,
html[data-portal="customer"] body.customer-portal .main-menu-content .navigation-main .nav-item.has-sub.active > a {
  animation: none !important;
}
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.active > a::before,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.has-sub.open > a::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(11, 99, 255, 0.18), rgba(24, 160, 255, 0.18));
  filter: blur(4px);
  opacity: 0.35;
  z-index: 0;
  pointer-events: none;
}
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.active {
  overflow: visible;
}

/* Submenu active state (customer portal) */
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active > a:hover,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active > a:focus,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active > a:active,
html[data-portal="customer"] body.customer-portal .main-menu-content .navigation-main .menu-content .active > a,
html[data-portal="customer"] body.customer-portal .semi-dark-layout .main-menu-content .navigation-main .menu-content .active > a {
  position: relative;
  background: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: var(--groupie-blue-1) !important;
  box-shadow: 0 10px 22px rgba(11, 99, 255, 0.3), 0 0 16px rgba(24, 160, 255, 0.3) !important;
  filter: drop-shadow(0 6px 12px rgba(11, 99, 255, 0.3)) !important;
  color: #fff !important;
  z-index: 1;
  overflow: visible;
}
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active > a::before,
html[data-portal="customer"] body.customer-portal .main-menu-content .navigation-main .menu-content .active > a::before,
html[data-portal="customer"] body.customer-portal .semi-dark-layout .main-menu-content .navigation-main .menu-content .active > a::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(11, 99, 255, 0.5), rgba(24, 160, 255, 0.3));
  filter: blur(5px);
  opacity: 0.5;
  z-index: 0;
  pointer-events: none;
}
html[data-portal="customer"] body.customer-portal .main-menu-content .navigation-main .menu-content .active,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li ul .active {
  overflow: visible;
}

/* Keep customer buttons rectangular (override pill buttons only) */
body.customer-portal .btn.rounded-pill {
  border-radius: 0.357rem !important;
}
body.customer-portal .btn,
body.customer-portal .btn.btn-round,
body.customer-portal .btn.btn-rounded,
body.customer-portal .btn.btn-pill,
body.customer-portal .btn-rounded,
body.customer-portal .btn-pill,
body.customer-portal .rounded-pill {
  border-radius: 0.357rem !important;
}

.feather-24 {
  width: 24px;
  height: 24px;
}

.feather-32 {
  width: 32px;
  height: 32px;
}

/* Purple purge (customer portal) */
body.customer-portal .btn-link {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}
body.customer-portal .text-primary,
body.customer-portal .text-purple,
body.customer-portal .link-primary,
body.customer-portal a.text-primary,
body.customer-portal a.link-primary {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}
body.customer-portal .border-primary,
body.customer-portal .border-purple,
body.customer-portal .btn-outline-primary,
body.customer-portal .btn-outline-primary:focus,
body.customer-portal .btn-outline-primary:hover {
  border-color: var(--groupie-blue-1) !important;
  color: var(--groupie-blue-1) !important;
}
body.customer-portal .bg-primary,
body.customer-portal .badge.bg-primary,
body.customer-portal .nav-pills .nav-link.active,
body.customer-portal .nav-tabs .nav-link.active,
body.customer-portal .pagination .page-item.active .page-link {
  background-color: var(--groupie-blue-1) !important;
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
}
body.customer-portal .bg-gradient-primary,
body.customer-portal .btn-gradient-primary {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: var(--groupie-blue-1) !important;
}
body.customer-portal .btn-outline-primary {
  border-color: var(--groupie-blue-1) !important;
  color: var(--groupie-blue-1) !important;
}
body.customer-portal .btn-outline-primary:hover,
body.customer-portal .btn-outline-primary:focus,
body.customer-portal .btn-outline-primary:active {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: var(--groupie-blue-1) !important;
  color: #fff !important;
}

/* Primary borders/icons switch to blue (no purple) */
body.customer-portal .border-primary,
body.customer-portal .border-purple,
body.customer-portal .btn-outline-primary,
body.customer-portal .page-item.active .page-link,
body.customer-portal .form-check-input:checked,
body.customer-portal .form-switch .form-check-input:checked {
  border-color: var(--groupie-blue-1) !important;
}
body.customer-portal .btn-primary,
body.customer-portal .btn-gradient,
body.customer-portal .btn-gradient-primary,
body.customer-portal .bg-primary,
body.customer-portal .badge.bg-primary {
  background-image: linear-gradient(90deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: var(--groupie-blue-1) !important;
}
