/* === 7Bee Theme - Teal Brand Override === */

/* ----- Login page ----- */
/* Dark background */
.min-h-screen.bg-n-brand\/5 {
  background: #111 !important;
}
/* Logo bigger and always show both (light hidden by default, force show) */
.min-h-screen > section:first-child img {
  height: 5rem !important;
  width: auto !important;
}
/* Hide the teal icon logo on dark bg, show white logo instead */
.min-h-screen > section:first-child img.dark\:hidden {
  display: none !important;
}
.min-h-screen > section:first-child img.dark\:block {
  display: block !important;
}
/* Title and text white on dark bg */
.min-h-screen > section:first-child .text-n-slate-12 {
  color: #fff !important;
}
.min-h-screen > section:first-child .text-n-slate-11 {
  color: rgba(255, 255, 255, 0.7) !important;
}
/* Form card: white bg, black text for labels and inputs */
.min-h-screen > section.bg-white {
  background-color: #fff !important;
  border-radius: 12px !important;
}
.min-h-screen > section.bg-white .text-n-slate-12 {
  color: #1a1a1a !important;
}
.min-h-screen > section.bg-white .text-n-slate-11 {
  color: #444 !important;
}
.min-h-screen > section.bg-white input {
  color: #1a1a1a !important;
}
.min-h-screen > section.bg-white .text-link {
  color: rgb(0, 133, 115) !important;
}

/* ----- Override n-brand from blue (#2781F6) to teal ----- */

/* Background */
.bg-n-brand {
  background-color: rgb(18, 165, 148) !important;
}
.bg-n-brand\/5 {
  background-color: rgba(18, 165, 148, 0.08) !important;
}
.bg-n-brand\/10 {
  background-color: rgba(18, 165, 148, 0.1) !important;
}
.bg-n-brand\/20 {
  background-color: rgba(18, 165, 148, 0.2) !important;
}
.hover\:bg-n-brand:hover {
  background-color: rgb(18, 165, 148) !important;
}
.hover\:bg-n-brand\/90:hover {
  background-color: rgba(18, 165, 148, 0.9) !important;
}
.hover\:bg-n-brand\/10:hover {
  background-color: rgba(18, 165, 148, 0.1) !important;
}

/* Text */
.text-n-brand {
  color: rgb(0, 133, 115) !important;
}
.hover\:text-n-brand:hover {
  color: rgb(0, 133, 115) !important;
}
.group-hover\:text-n-brand:hover {
  color: rgb(0, 133, 115) !important;
}

/* Outline/Border */
.outline-n-brand {
  outline-color: rgb(0, 133, 115) !important;
}
.\!outline-n-brand {
  outline-color: rgb(0, 133, 115) !important;
}
.focus\:outline-n-brand:focus {
  outline-color: rgb(0, 133, 115) !important;
}
.focus-within\:outline-n-brand:focus-within {
  outline-color: rgb(0, 133, 115) !important;
}
.dark .dark\:outline-n-brand {
  outline-color: rgb(0, 133, 115) !important;
}
.dark .dark\:focus\:outline-n-brand:focus {
  outline-color: rgb(0, 133, 115) !important;
}
.dark .dark\:focus-within\:outline-n-brand:focus-within {
  outline-color: rgb(0, 133, 115) !important;
}

/* Pseudo-elements (tabs active indicator etc) */
.after\:bg-n-brand::after {
  background-color: rgb(18, 165, 148) !important;
}

/* ----- Blue accent overrides (used as brand throughout) ----- */
.text-n-blue-11 {
  color: rgb(0, 133, 115) !important;
}
.text-n-blue-10 {
  color: rgb(13, 155, 138) !important;
}
.hover\:bg-n-blue-10:hover {
  background-color: rgb(13, 155, 138) !important;
}
.bg-n-blue-9 {
  background-color: rgb(18, 165, 148) !important;
}

/* Links */
.text-link {
  color: rgb(0, 133, 115) !important;
}

/* ----- Blue border overrides ----- */
:root {
  --border-blue: 18, 165, 148, 0.5;
}
.dark {
  --border-blue: 18, 165, 148, 0.5;
}
