/* My New IT Vault - Dark theme MNIT charte graphique
 * Palette: #0d0d0d bg / #3DB52C green primary / #00ff88 neon accent
 * Override Casdoor's default light theme
 */

/* === Base === */
html, body, #root {
  background: #0d0d0d !important;
  color: #e6e6e6 !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(61,181,44,0.02) 2px, rgba(61,181,44,0.02) 4px);
  pointer-events: none;
  z-index: 0;
}

/* === Login/Signup containers === */
.loginBackground, .signupBackground,
.login-content, .signup-content, .login-page, .signup-page,
.ant-layout, .ant-layout-content,
.login-form, .signup-form {
  background: transparent !important;
}

/* Casdoor's actual top-level layout wrapper */
.loginBackground {
  background: #0d0d0d !important;
  min-height: 100vh !important;
}

/* Bug fix 2026-05-11 : .login-panel ET .ant-form coexistent (nested)
 * => double card. On rend l'outer .login-panel transparent, seul l'inner
 * .ant-form porte le visuel "carte" dark MNIT. */
.login-panel, .signup-panel {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 100vh !important;
}

.ant-layout-content > div > div {
  background: transparent !important;
}

/* === Login/Signup CARD === */
.ant-form,
.login-form > .ant-form,
.signup-form > .ant-form,
form.ant-form {
  background: #141414 !important;
  padding: 36px !important;
  border-radius: 14px !important;
  box-shadow:
    0 0 0 1px rgba(61,181,44,0.15),
    0 20px 60px rgba(0,0,0,0.7),
    0 0 40px rgba(61,181,44,0.04) !important;
  max-width: 440px !important;
  margin: 60px auto !important;
  border: 1px solid rgba(61,181,44,0.18) !important;
  position: relative;
  z-index: 1;
}

/* === Logo (panel principal en haut de la card) ===
 * Bug fix 2026-05-11 : sans width:auto + object-fit:contain, Casdoor force
 * width:250px sur le logo 1024x1024 -> stretching horizontal. */
.panel-logo,
img.panel-logo,
.login-logo-box img, .signup-logo-box img,
.login-form img:not(.provider-img), .signup-form img:not(.provider-img),
.login-form-logo img, .signup-form-logo img,
img[alt*="logo"], img[alt*="Logo"] {
  width: auto !important;
  max-width: 240px !important;
  height: auto !important;
  max-height: 96px !important;
  object-fit: contain !important;
  margin: 0 auto 24px auto !important;
  display: block !important;
  filter: drop-shadow(0 4px 20px rgba(61,181,44,0.35));
}

/* === Titre " My New IT — Password Manager " sous le logo ===
 * Inject via JS dans index.html (MutationObserver) car la page signup
 * n'a pas de .signup-logo-box wrapper sur le logo. Le DIV genere a
 * classe .mnit-brand-title. */
.mnit-brand-title {
  display: block !important;
  margin: -4px auto 24px auto !important;
  text-align: center !important;
  color: #e6e6e6 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0.4px !important;
  text-shadow: 0 0 16px rgba(0, 255, 136, 0.08) !important;
}

/* === Footer "Powered by ..." (logo MNIT en bas, mini) === */
.footer img,
footer img,
[class*="footer"] img,
[class*="Footer"] img,
.ant-layout-footer img {
  width: auto !important;
  height: auto !important;
  max-width: 28px !important;
  max-height: 20px !important;
  object-fit: contain !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin: 0 4px !important;
}

/* === Titles === */
h1, h2, h3,
.login-content h1, .signup-content h1,
.login-form h1, .signup-form h1 {
  color: #e6e6e6 !important;
  text-align: center !important;
  font-size: 22px !important;
  margin-bottom: 8px !important;
  font-weight: 600 !important;
}

/* === Form labels === */
.ant-form-item-label > label {
  color: #b8b8b8 !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}

/* === Inputs === */
.ant-input,
.ant-input-affix-wrapper,
.ant-input-password,
input.ant-input,
input[type="text"], input[type="email"], input[type="password"] {
  background: #0a0a0a !important;
  border: 1px solid #2a2a2a !important;
  color: #e6e6e6 !important;
  height: 46px !important;
  border-radius: 8px !important;
  padding: 0 14px !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

.ant-input-affix-wrapper > input.ant-input,
.ant-input-password input,
.ant-input-affix-wrapper input.ant-input {
  background: transparent !important;
  border: 0 !important;
  color: #e6e6e6 !important;
  padding: 0 !important;
  height: auto !important;
  box-shadow: none !important;
}

.ant-input::placeholder,
.ant-input-affix-wrapper input::placeholder {
  color: #5a5a5a !important;
}

.ant-input:hover,
.ant-input-affix-wrapper:hover {
  border-color: #3DB52C !important;
}

.ant-input:focus,
.ant-input-focused,
.ant-input-affix-wrapper-focused,
.ant-input-affix-wrapper:focus-within {
  border-color: #3DB52C !important;
  box-shadow: 0 0 0 2px rgba(61,181,44,0.2) !important;
}

.ant-input-prefix,
.ant-input-suffix,
.ant-input-password-icon {
  color: #888 !important;
}

/* === Divider === */
.ant-divider,
.ant-divider-horizontal {
  border-top-color: #2a2a2a !important;
  color: #666 !important;
  margin: 20px 0 !important;
}

.ant-divider-inner-text {
  color: #888 !important;
  font-size: 12px !important;
  padding: 0 16px !important;
  background: #141414 !important;
}

/* === Provider buttons (Discord, GitHub, etc.) ===
 * Bug fix 2026-05-11 : la vraie classe Casdoor est `.provider-link`,
 * pas `.login-style-provider`. Sans full button styling, on voit juste
 * une icone 24x24 invisible sur fond noir. */
a.provider-link,
a.login-style-provider, a.signup-style-provider,
a[class*="login-style"], a[class*="signup-style"],
button.provider-button,
.provider-list a, .provider-list button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  height: 48px !important;
  background: #5865F2 !important;
  border: 0 !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  border-radius: 10px !important;
  margin: 0 auto 16px auto !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  padding: 0 16px !important;
  position: relative !important;
  text-align: center !important;
}

a.provider-link img.provider-img,
a.provider-link .provider-img,
.provider-img,
.login-style-provider img,
.signup-style-provider img,
a[class*="provider"] img {
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  object-fit: contain !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-block !important;
  vertical-align: middle !important;
  filter: none !important; /* keep Discord native colors */
  border-radius: 4px !important;
}

/* Discord-specific text injection via ::after (Casdoor n'affiche que l'icone par defaut) */
a.provider-link[href*="discord"]::after,
a.provider-link[href*="provider_discord"]::after,
a.login-style-provider[href*="discord"]::after,
a.signup-style-provider[href*="discord"]::after {
  content: "Continuer avec Discord";
  color: #fff;
  font-weight: 600;
  letter-spacing: 0.2px;
}

a.provider-link:hover,
a[class*="provider"]:hover, button[class*="provider"]:hover,
.login-style-provider:hover, .signup-style-provider:hover {
  background: #4752C4 !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(88,101,242,0.4) !important;
  color: #fff !important;
}

/* Fix layout: Forgot password / Auto sign in row
 * Bug fix 2026-05-11 : Sign In button width: 30px (compresse par flex parent),
 * overlap avec "Forgot password?". On force chaque row sur sa propre ligne. */
.login-form .ant-form-item:has(.ant-checkbox-wrapper) {
  margin-bottom: 16px !important;
}

/* Force Sign In button to be on its own line, full width */
.ant-form-item-control-input-content button.ant-btn-primary,
.ant-form-item-control-input button.ant-btn-primary,
.login-form-button, .signup-form-button,
button.ant-btn-primary[type="submit"],
button[type="submit"].ant-btn {
  display: block !important;
  width: 100% !important;
  min-width: 200px !important;
  margin: 16px auto 0 auto !important;
}

/* La row "Auto sign in + Forgot password" doit etre proprement aligned, et
 * le bouton "Sign In" doit etre EN DESSOUS sur sa propre ligne complete. */
.login-form .ant-form-item:has(.login-link),
.login-form .ant-form-item:has(a[href*="forget"]),
.login-form .ant-form-item:has(a[href*="forgot"]) {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 4px !important;
}

/* Clean float/positioning of "Forgot password?" link */
.login-form a.login-link,
.login-form a[class*="forgot"],
.login-form a[href*="forget"],
.login-form a[href*="forgot"],
a[class*="ForgotPassword"] {
  display: inline-block !important;
  margin: 0 !important;
  float: none !important;
  font-size: 13px !important;
  text-align: right !important;
}

/* === Primary button (Sign In / Sign Up) === */
button.ant-btn-primary,
.login-form-button, .signup-form-button,
button[type="submit"].ant-btn {
  background: #3DB52C !important;
  border: 0 !important;
  height: 46px !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #0d0d0d !important;
  text-shadow: none !important;
  width: 100% !important;
  letter-spacing: 0.3px !important;
}

button.ant-btn-primary:hover,
.login-form-button:hover, .signup-form-button:hover,
button[type="submit"].ant-btn:hover {
  background: #00ff88 !important;
  box-shadow: 0 0 24px rgba(0,255,136,0.4) !important;
  color: #0d0d0d !important;
}

/* === Default buttons (links) === */
.ant-btn-default,
.ant-btn:not(.ant-btn-primary):not([class*="provider"]) {
  background: transparent !important;
  border: 1px solid #2a2a2a !important;
  color: #e6e6e6 !important;
  height: 40px !important;
  border-radius: 8px !important;
}

.ant-btn-default:hover {
  border-color: #3DB52C !important;
  color: #00ff88 !important;
}

/* === Checkbox === */
.ant-checkbox-wrapper {
  color: #b8b8b8 !important;
}

.ant-checkbox-inner {
  background: #0a0a0a !important;
  border-color: #2a2a2a !important;
}

.ant-checkbox-checked .ant-checkbox-inner {
  background: #3DB52C !important;
  border-color: #3DB52C !important;
}

.ant-checkbox:hover .ant-checkbox-inner {
  border-color: #3DB52C !important;
}

/* === Links === */
a {
  color: #3DB52C !important;
  text-decoration: none !important;
}

a:hover {
  color: #00ff88 !important;
  text-shadow: 0 0 8px rgba(0,255,136,0.3);
}

/* === Tabs (Password / Code / WebAuthn) === */
.ant-tabs-tab {
  color: #888 !important;
}

.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #00ff88 !important;
}

.ant-tabs-ink-bar {
  background: #3DB52C !important;
}

.ant-tabs-top > .ant-tabs-nav::before {
  border-bottom-color: #2a2a2a !important;
}

/* === Footer === */
.footer, [class*="footer"] {
  background: transparent !important;
  color: #5a5a5a !important;
}

/* === Casdoor splash side panel: hide === */
.login-panel-left, .signup-panel-left,
.login-content > div:first-child:not(:has(.ant-form)),
.signup-content > div:first-child:not(:has(.ant-form)) {
  display: none !important;
}

/* === Header (top nav after login) === */
.ant-layout-header {
  background: #0a0a0a !important;
  border-bottom: 1px solid rgba(61,181,44,0.15) !important;
}

.ant-menu-dark, .ant-menu-dark .ant-menu-sub {
  background: #0a0a0a !important;
}

/* === Tables (admin pages) === */
.ant-table {
  background: #141414 !important;
  color: #e6e6e6 !important;
}

.ant-table-thead > tr > th {
  background: #1a1a1a !important;
  color: #b8b8b8 !important;
  border-bottom: 1px solid #2a2a2a !important;
}

.ant-table-tbody > tr > td {
  background: #141414 !important;
  border-bottom: 1px solid #2a2a2a !important;
}

.ant-table-tbody > tr:hover > td {
  background: #1a1a1a !important;
}

/* === Cards & panels === */
.ant-card, .ant-card-bordered {
  background: #141414 !important;
  border-color: #2a2a2a !important;
  color: #e6e6e6 !important;
}

/* === Tooltips / popovers === */
.ant-tooltip-inner, .ant-popover-inner {
  background: #1a1a1a !important;
  color: #e6e6e6 !important;
  border: 1px solid #2a2a2a !important;
}

/* === Scrollbar === */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: #0d0d0d;
}
::-webkit-scrollbar-thumb {
  background: #2a2a2a;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #3DB52C;
}

/* ============================================================
   RESPONSIVE FIX MEN-171 (idp.mynewit.com 3px overflow on mobile)
   Login form had width 380px on viewport 375. Cap to 100%.
   ============================================================ */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}
.loginBackground,
.login-content,
.login-panel,
.login-form,
.login-form .ant-form-item,
.login-form .ant-input,
.login-form .ant-input-affix-wrapper,
.login-form .ant-btn {
  max-width: 100% !important;
  box-sizing: border-box !important;
}
@media (max-width: 480px) {
  .login-panel { padding-left: 16px !important; padding-right: 16px !important; }
}

/* === MEN-178 footer Casdoor branding suppression (14/05/2026) === */
/* Cache le "Powered by Casdoor" footer qui leak la marque sous le formulaire de login */
.App-footer,
footer.footer,
contentinfo,
[class*="Footer"]:has(a[href*="casdoor"]),
.ant-layout-footer:has(a[href*="casdoor"]) {
  display: none !important;
}
/* Au cas ou le selecteur :has() ne match pas (Safari ancien), fallback texte */
a[href*="casdoor.org"],
a[href*="casbin.org"] {
  display: none !important;
}
/* Padding bas pour compenser absence de footer */
body {
  padding-bottom: 32px !important;
}