/* Groupie Brand Lock: remove purple, enforce blue gradient */

html[data-portal="customer"] body.customer-portal {
  --groupie-blue-1: #2f6bff;
  --groupie-blue-2: #2563eb;
  --groupie-blue-3: #60a5fa;
  --groupie-blue-glow: rgba(47, 107, 255, 0.45);
  --primary: var(--groupie-blue-1);
  --primary-hover: var(--groupie-blue-2);
  --primary-shadow: var(--groupie-blue-glow);
  --bs-primary: #2f6bff;
  --bs-primary-rgb: 47, 107, 255;
}

/* Buttons */
html[data-portal="customer"] body.customer-portal .btn-primary,
html[data-portal="customer"] body.customer-portal .btn-gradient-primary,
html[data-portal="customer"] body.customer-portal .theme-button,
html[data-portal="customer"] body.customer-portal button.btn-primary,
html[data-portal="customer"] body.customer-portal input.btn-primary {
  background-image: linear-gradient(135deg, 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 -12px var(--groupie-blue-glow) !important;
}

html[data-portal="customer"] body.customer-portal .btn-primary:hover,
html[data-portal="customer"] body.customer-portal .btn-gradient-primary:hover,
html[data-portal="customer"] body.customer-portal .theme-button:hover {
  filter: brightness(1.04);
}

html[data-portal="customer"] body.customer-portal .btn-outline-primary {
  color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
  background: transparent !important;
}

html[data-portal="customer"] body.customer-portal .btn-outline-primary:hover,
html[data-portal="customer"] body.customer-portal .btn-outline-primary:focus {
  color: #fff !important;
  border-color: transparent !important;
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  box-shadow: 0 10px 22px -12px var(--groupie-blue-glow) !important;
}

html[data-portal="customer"] body.customer-portal .btn-link,
html[data-portal="customer"] body.customer-portal .text-primary,
html[data-portal="customer"] body.customer-portal .text-primary:hover,
html[data-portal="customer"] body.customer-portal a.text-primary,
html[data-portal="customer"] body.customer-portal a.btn-link {
  color: var(--groupie-blue-1) !important;
}

/* Badges + pills */
html[data-portal="customer"] body.customer-portal .badge-primary,
html[data-portal="customer"] body.customer-portal .badge-light-primary,
html[data-portal="customer"] body.customer-portal .badge-soft-primary,
html[data-portal="customer"] body.customer-portal .pill-primary {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Nav / tabs */
html[data-portal="customer"] body.customer-portal .nav-pills .nav-link.active,
html[data-portal="customer"] body.customer-portal .nav-pills .show > .nav-link,
html[data-portal="customer"] body.customer-portal .nav-tabs .nav-link.active {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 22px -12px var(--groupie-blue-glow) !important;
}

/* Sidebar active item */
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation > li.active > a {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
}

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.active > a * {
  color: #fff !important;
}

/* Sidebar open/active states */
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.sidebar-group-active > a,
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 .menu-content .active > a,
html[data-portal="customer"] body.customer-portal .main-menu.menu-dark .navigation .menu-content .active > a * {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
}

/* Pagination */
html[data-portal="customer"] body.customer-portal .pagination .page-item.active .page-link {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* Progress bars */
html[data-portal="customer"] body.customer-portal .progress-bar.bg-primary {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
}

/* Dropdown active */
html[data-portal="customer"] body.customer-portal .dropdown-item.active,
html[data-portal="customer"] body.customer-portal .dropdown-item:active {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
}

/* Links that used purple border */
html[data-portal="customer"] body.customer-portal .border-primary {
  border-color: var(--groupie-blue-1) !important;
}

html[data-portal="customer"] body.customer-portal .bg-primary {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  background-color: transparent !important;
}

html[data-portal="customer"] body.customer-portal .link-primary,
html[data-portal="customer"] body.customer-portal a.link-primary {
  color: var(--groupie-blue-1) !important;
}

html[data-portal="customer"] body.customer-portal .form-check-input:checked,
html[data-portal="customer"] body.customer-portal .form-switch .form-check-input:checked {
  background-color: var(--groupie-blue-1) !important;
  border-color: var(--groupie-blue-1) !important;
}

html[data-portal="customer"] body.customer-portal .nav-link.active,
html[data-portal="customer"] body.customer-portal .nav-link:active,
html[data-portal="customer"] body.customer-portal .nav-link.show {
  color: #fff !important;
}

html[data-portal="customer"] body.customer-portal .list-group-item.active,
html[data-portal="customer"] body.customer-portal .list-group-item.active:focus,
html[data-portal="customer"] body.customer-portal .list-group-item.active:hover {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* Dark layout overrides */
html.dark-layout[data-portal="customer"] body.customer-portal a:hover,
html.dark-layout[data-portal="customer"] body.customer-portal .dropdown-item:focus,
html.dark-layout[data-portal="customer"] body.customer-portal .dropdown-item:hover {
  color: var(--groupie-blue-1) !important;
}

html.dark-layout[data-portal="customer"] body.customer-portal .dropdown-item.active,
html.dark-layout[data-portal="customer"] body.customer-portal .dropdown-item:active,
html.dark-layout[data-portal="customer"] body.customer-portal .nav-pills .nav-item .nav-link.active {
  background-image: linear-gradient(135deg, var(--groupie-blue-1) 0%, var(--groupie-blue-2) 100%) !important;
  color: #fff !important;
}

/* Forms focus */
html[data-portal="customer"] body.customer-portal .form-control:focus,
html[data-portal="customer"] body.customer-portal .form-select:focus {
  border-color: rgba(47, 107, 255, 0.5) !important;
  box-shadow: 0 0 0 0.2rem rgba(47, 107, 255, 0.2) !important;
}
