/* Badgers Claw SaaS v2.2.0-beta.23
   AI Security logo theme.
   Uses /img/ai-security-logo.png. No generated artwork. */
:root {
  --ai-security-logo-url: url('/img/ai-security-logo.png?v=2.2.0-beta.23');
}

.ai-security-logo-img,
img.ai-security-logo-img {
  display: inline-block;
  width: 44px;
  height: 44px;
  object-fit: contain;
  vertical-align: middle;
  filter: drop-shadow(0 0 10px rgba(155, 82, 255, .72)) drop-shadow(0 0 7px rgba(0, 225, 255, .45));
}

.ai-security-logo-sm { width: 24px !important; height: 24px !important; }
.ai-security-logo-md { width: 44px !important; height: 44px !important; }
.ai-security-logo-lg { width: 92px !important; height: 92px !important; }
.ai-security-logo-xl { width: min(180px, 34vw) !important; height: auto !important; }

.ai-security-brand,
.ai-security-title-wrap {
  display: inline-flex;
  align-items: center;
  gap: .65rem;
}

.ai-security-logo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  border: 1px solid rgba(174, 90, 255, .84);
  background:
    radial-gradient(circle at 50% 40%, rgba(157, 70, 255, .22), rgba(0, 0, 0, .18) 62%, rgba(0, 0, 0, .42)),
    rgba(0, 0, 0, .24);
  box-shadow:
    inset 0 0 14px rgba(0, 0, 0, .62),
    0 0 16px rgba(136, 60, 255, .42),
    0 0 10px rgba(0, 221, 255, .20);
  overflow: hidden;
}
.ai-security-logo-badge::before {
  content: '';
  width: 40px;
  height: 40px;
  display: block;
  background-image: var(--ai-security-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 8px rgba(150, 70, 255, .75));
}

/* Dedicated AI Security Monitor page hero/title treatment. */
.ai-security-page > .d-flex:first-child > div:first-child h1,
.ai-security-page h1,
[data-ai-security-title] {
  position: relative;
}
.ai-security-page > .d-flex:first-child > div:first-child h1::before,
[data-ai-security-title]::before {
  content: '';
  display: inline-block;
  width: 62px;
  height: 62px;
  margin-right: .65rem;
  vertical-align: middle;
  background-image: var(--ai-security-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 11px rgba(145, 60, 255, .75));
}

.ai-security-page .bc-card:first-child::before,
.ai-security-page .card:first-child::before {
  content: '';
  float: right;
  width: 74px;
  height: 74px;
  margin-left: 1rem;
  background-image: var(--ai-security-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: .95;
  filter: drop-shadow(0 0 14px rgba(154, 84, 255, .60));
}

/* Sidebar, mega menu, dropdown, and admin links that point to AI Security. */
a[href*="ai-security"],
button[href*="ai-security"],
[data-href*="ai-security"],
.ai-security-link {
  position: relative;
}
a[href*="ai-security"]::before,
button[href*="ai-security"]::before,
[data-href*="ai-security"]::before,
.ai-security-link::before {
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  margin-right: .45rem;
  vertical-align: -5px;
  background-image: var(--ai-security-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 5px rgba(150, 76, 255, .68));
}

/* Topbar or floating AI/security chips. */
.ai-security-chip,
.badger-ai-security-chip,
.badger-ai-security-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: .5rem !important;
}
.ai-security-chip::before,
.badger-ai-security-chip::before,
.badger-ai-security-button::before {
  content: '';
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  background-image: var(--ai-security-logo-url);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: drop-shadow(0 0 6px rgba(157, 75, 255, .70));
}

/* Keep existing circular AI helper button readable but branded when it is AI Security. */
#badger-ai-toggle[data-ai-security="true"],
.ai-fab[data-ai-security="true"],
.floating-ai[data-ai-security="true"] {
  font-size: 0 !important;
  background-image: var(--ai-security-logo-url) !important;
  background-size: 76% auto !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

@media (max-width: 768px) {
  .ai-security-page > .d-flex:first-child > div:first-child h1::before,
  [data-ai-security-title]::before {
    width: 46px;
    height: 46px;
  }
  .ai-security-logo-xl { width: min(140px, 48vw) !important; }
}