/* MPower Space Branding Override - Orange (#f68330) to Yellow (#f7c11e) */

/* ===== BORDER COLORS ===== */
.border-netbird,
.border-netbird-400 {
  border-color: rgb(247 193 30 / var(--tw-border-opacity, 1)) !important;
}
.border-netbird-400\/20 {
  border-color: #f7c11e33 !important;
}
.border-netbird-400\/30 {
  border-color: #f7c11e4d !important;
}
.border-netbird-500 {
  border-color: rgb(217 168 16 / var(--tw-border-opacity, 1)) !important;
}
.border-netbird\/60 {
  border-color: #f7c11e99 !important;
}

/* ===== BACKGROUND COLORS ===== */
.bg-netbird {
  background-color: rgb(247 193 30 / var(--tw-bg-opacity, 1)) !important;
}
.bg-netbird-100 {
  background-color: rgb(254 246 208 / var(--tw-bg-opacity, 1)) !important;
}
.bg-netbird-500\/10 {
  background-color: #d9a8101a !important;
}
.bg-netbird-900 {
  background-color: rgb(92 73 10 / var(--tw-bg-opacity, 1)) !important;
}
.bg-netbird-950 {
  background-color: rgb(61 48 5 / var(--tw-bg-opacity, 1)) !important;
}
.bg-netbird\/10 {
  background-color: #f7c11e1a !important;
}
.bg-netbird\/20 {
  background-color: #f7c11e33 !important;
}

/* ===== HOVER BACKGROUNDS ===== */
.hover\:bg-netbird-500:hover {
  background-color: rgb(217 168 16 / var(--tw-bg-opacity, 1)) !important;
}
.hover\:bg-netbird-950\/50:hover {
  background-color: #3d300580 !important;
}
.hover\:bg-netbird\/20:hover {
  background-color: #f7c11e33 !important;
}
.enabled\:hover\:bg-netbird-500:hover:enabled {
  background-color: rgb(217 168 16 / var(--tw-bg-opacity, 1)) !important;
}

/* ===== GRADIENT COLORS ===== */
.from-netbird {
  --tw-gradient-from: #f7c11e var(--tw-gradient-from-position) !important;
  --tw-gradient-to: #f7c11e00 var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-netbird-200 {
  --tw-gradient-from: #ffe680 var(--tw-gradient-from-position) !important;
  --tw-gradient-to: #ffe68000 var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.to-netbird-100 {
  --tw-gradient-to: #fef6d0 var(--tw-gradient-to-position) !important;
}
.to-netbird-400 {
  --tw-gradient-to: #f7c11e var(--tw-gradient-to-position) !important;
}

/* ===== FILL (SVG) COLORS ===== */
.fill-netbird {
  fill: #f7c11e !important;
}
.group\/trigger[data-state=active] .group-data-\[state\=active\]\/trigger\:fill-netbird {
  fill: #f7c11e !important;
}

/* ===== TEXT COLORS ===== */
.text-netbird {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-100 {
  color: rgb(254 246 208 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-150 {
  color: rgb(255 240 179 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-200 {
  color: rgb(255 230 128 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-300 {
  color: rgb(250 213 100 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-400 {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.text-netbird-400\/80 {
  color: #f7c11ecc !important;
}
.text-netbird-500 {
  color: rgb(217 168 16 / var(--tw-text-opacity, 1)) !important;
}

/* ===== HOVER TEXT ===== */
.group\/badge:hover .group-hover\/badge\:text-netbird {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.group:hover .group-hover\:text-netbird {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}

/* ===== ACTIVE STATE ===== */
.data-\[state\=active\]\:text-netbird[data-state=active] {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.group\/trigger[data-state=active] .group-data-\[state\=active\]\/trigger\:text-netbird {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}

/* ===== RING / FOCUS ===== */
.enabled\:focus\:ring-netbird-400\/50:focus:enabled {
  --tw-ring-color: #f7c11e80 !important;
}
.focus\:ring-netbird-400\/50:focus {
  --tw-ring-color: #f7c11e80 !important;
}
.focus\:ring-netbird-500:focus {
  --tw-ring-color: rgb(217 168 16) !important;
}
.focus\:border-netbird-400:focus {
  border-color: rgb(247 193 30) !important;
}

/* ===== DARK MODE ===== */
.dark\:focus\:ring-netbird-600\/50:focus:is(.dark *) {
  --tw-ring-color: #c4950e80 !important;
}
.enabled\:dark\:bg-netbird:is(.dark *):enabled {
  background-color: rgb(247 193 30 / var(--tw-bg-opacity, 1)) !important;
}
.enabled\:dark\:hover\:bg-netbird-500\/80:hover:is(.dark *):enabled {
  background-color: #d9a810cc !important;
}
.dark\:data-\[state\=active\]\:text-netbird[data-state=active]:is(.dark *) {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.dark\:text-netbird:is(.dark *) {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.dark\:text-netbird-400:is(.dark *) {
  color: rgb(247 193 30 / var(--tw-text-opacity, 1)) !important;
}
.dark\:bg-netbird:is(.dark *) {
  background-color: rgb(247 193 30 / var(--tw-bg-opacity, 1)) !important;
}
.dark\:bg-netbird-500:is(.dark *) {
  background-color: rgb(217 168 16 / var(--tw-bg-opacity, 1)) !important;
}
.dark\:border-netbird:is(.dark *) {
  border-color: rgb(247 193 30 / var(--tw-border-opacity, 1)) !important;
}
.dark\:border-netbird-400:is(.dark *) {
  border-color: rgb(247 193 30 / var(--tw-border-opacity, 1)) !important;
}
.dark\:fill-netbird:is(.dark *) {
  fill: #f7c11e !important;
}

/* ===== ACCENT HIGHLIGHT (loading spinner etc) ===== */
.fill-netbird, svg.fill-netbird {
  fill: #f7c11e !important;
}

/* ===== SHADOW OVERRIDE ===== */
.shadow-netbird-500\/50 {
  --tw-shadow-color: #d9a81080 !important;
}
.shadow-netbird\/50 {
  --tw-shadow-color: #f7c11e80 !important;
}

/* ===== SIDEBAR LOGO: Replace NetBird logo with MPower Space logo ===== */
img[src*="netbird-full"] {
  content: url(/assets/mpower-logo.png) !important;
  height: 32px !important;
  width: auto !important;
  object-fit: contain !important;
}

/* ===== SMALL NETBIRD ICON (version, etc): Hue shift orange to yellow ===== */
img[src*="netbird.d41baaa4"] {
  filter: hue-rotate(15deg) saturate(1.2) !important;
}

/* ===== SVG elements with hardcoded orange fill ===== */
svg path[fill="#f68330"],
svg path[fill="#F68330"],
svg rect[fill="#f68330"],
svg rect[fill="#F68330"],
svg circle[fill="#f68330"],
svg circle[fill="#F68330"] {
  fill: #f7c11e !important;
}

/* ===== CATCH-ALL: Override any inline styles with orange ===== */
[style*="rgb(246, 131, 48)"],
[style*="rgb(244, 109, 27)"],
[style*="#f68330"],
[style*="#F68330"],
[style*="#f46d1b"],
[style*="#F46D1B"] {
  color: #f7c11e !important;
}