/* ==========================================
   FORCE UPPER-LEFT LOGO REPLACEMENT
   ========================================== */

/* 1. Target the modern PatternFly Brand Image Element */
.pf-v5-c-brand,
.pf-v6-c-brand,
.pf-c-brand {
  content: url("../img/logo-white.svg") !important;
  height: 36px !important; /* Adjust height to fit the top bar */
  width: 80px !important;
}

/* 2. Target the fallback container/link in the Masthead */
.pf-v5-c-masthead__brand img,
.pf-v6-c-masthead__brand img,
.pf-c-masthead__brand img,
a[aria-label="Go to home page"] img {
  content: url("../img/logo-white.svg") !important;
  margin-top: 8px;
  height: 36px !important;
  width: 80px !important;
}

/* 3. Give the brand container some breathing room if needed */
.pf-v5-c-masthead__brand,
.pf-v6-c-masthead__brand,
.pf-c-masthead__brand {
  display: flex !important;
  align-items: center !important;
  padding-left: 10px !important;
}
/* ==========================================
   CHANGING THE TOP HEADER BAR COLOR
   ========================================== */
header[data-testid="page-header"] {
	background-color: #9ea1a2;
}

header[data-testid="page-header"] * {
	color: #fff;	
	background-color: #9ea1a2;
}

/* --- 1. Top Header Bar styling --- */
.pf-v5-c-page__header,
.pf-v6-c-page__header {
  background-color: #0f4349 !important; /* Deepest teal for the top brand bar */
}

/* --- 2. Sidebar Container background --- */
.pf-v5-c-page__sidebar,
.pf-v6-c-page__sidebar,
#api-sidebar,
.pf-v5-c-nav,
.pf-v6-c-nav {
  background-color: #333333 !important; /* Rich, dark teal body */
}

/* --- 3. Default Nav Links (Text and Icons) --- */
.pf-v5-c-nav__link,
.pf-v6-c-nav__link {
  color: rgba(255, 255, 255, 0.8) !important; /* Bright white-teal text for readability */
}
.pf-v5-c-nav__link .pf-v5-c-nav__link-icon,
.pf-v6-c-nav__link .pf-v6-c-nav__link-icon {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* --- 4. Hover State --- */
.pf-v5-c-nav__link:hover,
.pf-v6-c-nav__link:hover {
  background-color: rgba(255, 255, 255, 0.1) !important; /* Semi-transparent white overlay */
  color: #ffffff !important;
}

/* --- 5. Active / Selected Tab State --- */
.pf-v5-c-nav__link.pf-m-current,
.pf-v6-c-nav__link.pf-m-current,
[class*="nav__link"][class*="current"] {
  background-color: #26a7b6 !important; /* Your EXACT teal color as the active tab background */
  color: #ffffff !important;             /* Crisp white text on active tab */
  font-weight: 600;
}

.pf-v5-c-nav__link.pf-m-current .pf-v5-c-nav__link-icon,
.pf-v6-c-nav__link.pf-m-current .pf-v6-c-nav__link-icon {
  color: #ffffff !important;
}

/* --- 6. Scrollbar tuning (Optional but keeps it clean) --- */
.pf-v5-c-page__sidebar-body::-webkit-scrollbar-thumb,
.pf-v6-c-page__sidebar-body::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2) !important;
}