/* BEL AI Lab Green Theme — #005640 = rgb(0, 86, 64) */

/* ===== Override green palette to BEL green #005640 ===== */
:root, html {
  --brand-purple: #005640 !important;
  --green-500: #005640;
  --green-600: #004733;
  --green-700: #003826;
  --green-800: #002A1A;
}
.dark {
  --brand-purple: #005640 !important;
  --green-500: #005640;
  --green-600: #004733;
  --green-700: #003826;
  --green-800: #002A1A;
}

/* ===== Login page background ===== */

/* Login page: 1/3 blanc en haut, vague ondulée, 2/3 vert #005640 en bas */
.relative.flex.min-h-screen.flex-col.bg-white,
.relative.flex.min-h-screen.flex-col.dark\:bg-gray-900,
.relative.flex.min-h-screen.flex-col {
  background-color: #005640 !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0,0 L0,80 Q180,120 360,80 T720,80 T1080,80 T1440,80 L1440,0 Z' fill='%23ffffff'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: top center !important;
  background-size: 100% 38% !important;
}

/* Login card: frosted glass effect */
.relative.flex.min-h-screen .w-authPageWidth {
  background: rgba(255, 255, 255, 0.88) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0, 86, 64, 0.2) !important;
  box-shadow: 0 8px 32px rgba(0, 86, 64, 0.12), 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  border-radius: 0.75rem !important;
}
.dark .relative.flex.min-h-screen .w-authPageWidth {
  background: rgba(10, 30, 22, 0.85) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0, 86, 64, 0.3) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(0, 86, 64, 0.1) !important;
}

/* ===== Social login button (Microsoft) ===== */
[data-testid="openid"] {
  background-color: #005640 !important;
  border-color: #005640 !important;
  color: white !important;
  border-radius: 0.75rem !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 8px rgba(0, 86, 64, 0.25) !important;
}
[data-testid="openid"]:hover {
  background-color: #004733 !important;
  box-shadow: 0 4px 16px rgba(0, 86, 64, 0.35) !important;
  transform: translateY(-1px) !important;
}
[data-testid="openid"] p {
  color: white !important;
}
/* Hide default OpenID icon and replace with BEL logo */
[data-testid="openid"] svg {
  display: none !important;
}
[data-testid="openid"]::before {
  content: '';
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url('/assets/Logo_Entreprise_Bel_2019.svg') no-repeat center center;
  background-size: contain;
  flex-shrink: 0;
}

/* ===== Logo: much bigger on login page (x4) ===== */
.mt-6.h-10.w-full.bg-cover {
  height: 12rem !important;
}

/* ===== Sidebar logo — bigger ===== */
#chat-history-nav::before {
  content: '';
  display: block;
  width: 100%;
  height: 80px;
  margin-bottom: 4px;
  background: url('/assets/logo.svg') no-repeat center center;
  background-size: contain;
  flex-shrink: 0;
}

/* ===== Hide footer version text ===== */
[role="contentinfo"] {
  display: none !important;
}

/* ===== Login page title ===== */
h1.text-center {
  color: #005640 !important;
}
.dark h1.text-center {
  color: #4dbd8e !important;
}

/* ===== Sidebar — vert forêt #005640 uni ===== */

/* Light mode sidebar: fond vert #005640 */
[data-testid="nav"],
.bg-surface-primary-alt {
  background-color: #005640 !important;
}

/* Conversation hover */
[data-testid="nav"] .hover\:bg-surface-hover:hover,
.bg-surface-primary-alt .hover\:bg-surface-hover:hover {
  background-color: rgba(255, 255, 255, 0.10) !important;
}

/* Active/selected conversation: barre blanche à gauche + fond légèrement éclairci */
[data-testid="nav"] .bg-surface-active,
.bg-surface-primary-alt .bg-surface-active {
  background-color: rgba(255, 255, 255, 0.15) !important;
  border-left: 3px solid white !important;
}

/* Texte sidebar en blanc pour lisibilité sur fond vert foncé */
/* Exclure les popovers/modals qui s'ouvrent par-dessus */
[data-testid="nav"],
[data-testid="nav"] *:not(.popover-ui):not(.popover-ui *):not(.account-settings-popover):not(.account-settings-popover *):not([role="dialog"]):not([role="dialog"] *) {
  color: white !important;
}
[data-testid="nav"] svg:not(.popover-ui svg):not(.account-settings-popover svg) {
  color: white !important;
}

/* Dark mode sidebar: même vert */
.dark [data-testid="nav"],
.dark .bg-surface-primary-alt {
  background-color: #005640 !important;
}

/* Dark mode conversation hover */
.dark [data-testid="nav"] .hover\:bg-surface-hover:hover,
.dark .bg-surface-primary-alt .hover\:bg-surface-hover:hover {
  background-color: rgba(255, 255, 255, 0.12) !important;
}

/* Dark mode active conversation */
.dark [data-testid="nav"] .bg-surface-active,
.dark .bg-surface-primary-alt .bg-surface-active {
  background-color: rgba(255, 255, 255, 0.15) !important;
  border-left: 3px solid white !important;
}

/* Barre de recherche: fond blanc semi-transparent pour être visible sur vert */
[data-testid="nav"] .group.relative.my-1,
[data-testid="nav"] .rounded-lg.border-2 {
  background-color: rgba(255, 255, 255, 0.15) !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}
[data-testid="nav"] .group.relative.my-1:hover,
[data-testid="nav"] .rounded-lg.border-2:hover,
[data-testid="nav"] .group.relative.my-1:focus-within,
[data-testid="nav"] .rounded-lg.border-2:focus-within {
  background-color: rgba(255, 255, 255, 0.25) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}
[data-testid="nav"] .group.relative.my-1 input::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
}
[data-testid="nav"] .group.relative.my-1 input {
  color: white !important;
}

/* Supprimer les dégradés gris sur les noms de conversations */
[data-testid="nav"] .bg-gradient-to-l,
[data-testid="nav"] [class*="bg-gradient"] {
  background-image: none !important;
  background: transparent !important;
}
[data-testid="nav"] .from-gray-50,
[data-testid="nav"] .from-gray-200,
[data-testid="nav"] .from-gray-800,
.dark [data-testid="nav"] .from-gray-800 {
  --tw-gradient-from: transparent !important;
  --tw-gradient-to: transparent !important;
  background-image: none !important;
}