/* =============================================================================
   Janus Web Interface - Dinia.ai Design System & Sovereign Modern Aesthetic
   ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Montserrat:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap');

/*
 * Theme: light/dark is driven by .dark class and [data-theme] on <html>.
 * Dinia Standard: Dark background #030712, Light background #F8FAFC.
 */
:root,
:root[data-theme="dark"],
html.dark {
  /* Arrière-plans & Surfaces Dinia Dark */
  --janus-bg: #030712;
  --janus-surface: #0F172A;
  --janus-surface-hover: #1E293B;
  --janus-border: #1E293B;
  --janus-border-focus: #334155;

  /* Dinia Umbrella & Suite Brand Tokens */
  --dinia-ikb: #002FA7;
  --dinia-sky: #60A5FA;
  --dinia-slate: #1D283A;
  --dinia-atlas: #33CCB1;
  --dinia-janus: #0891B2;
  --dinia-kairos: #A159A6;
  --dinia-iris: #644DB3;
  --dinia-suada: #CC9F33;

  /* Couches mémorielles Janus */
  --janus-project: #0891B2;
  --janus-project-hover: #0E7490;
  --janus-project-bg: rgba(8, 145, 178, 0.12);
  --janus-project-glow: rgba(8, 145, 178, 0.35);

  --janus-profile: #A776E4;
  --janus-profile-bg: rgba(167, 118, 228, 0.15);
  --janus-profile-glow: rgba(167, 118, 228, 0.35);

  --janus-friendship: #644DB3;
  --janus-friendship-bg: rgba(100, 77, 179, 0.15);
  --janus-friendship-glow: rgba(100, 77, 179, 0.35);

  --janus-idea: #CC9F33;
  --janus-idea-bg: rgba(204, 159, 51, 0.15);
  --janus-idea-glow: rgba(204, 159, 51, 0.35);

  --janus-system: #64748B;
  --janus-system-bg: rgba(100, 116, 139, 0.15);

  --janus-success: #10B981;
  --janus-danger: #EF4444;
  --janus-warning: #F59E0B;

  /* Typographie Dinia Dark */
  --janus-text: #F8FAFC;
  --janus-muted: #94A3B8;
  --janus-subtle: #64748B;

  /* Scrollbar & Overlays */
  --janus-scrollbar-thumb: var(--janus-border);
  --janus-scrollbar-thumb-hover: var(--janus-muted);
  --janus-overlay-scrim: rgba(3, 7, 18, 0.80);

  --shadow-main: 0 10px 30px -5px rgba(0, 0, 0, 0.6), 0 0 0 1px var(--janus-border);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.40);

  /* Brand gradient */
  --janus-brand-gradient: linear-gradient(
    135deg,
    rgba(8, 145, 178, 0.15) 0%,
    rgba(0, 47, 167, 0.12) 100%
  );
}

:root[data-theme="light"],
html:not(.dark) {
  /* Surfaces Dinia Light (Slate-50, Slate-100, Slate-200) */
  --janus-bg: #F8FAFC;
  --janus-surface: #FFFFFF;
  --janus-surface-hover: #F1F5F9;
  --janus-border: #E2E8F0;
  --janus-border-focus: #CBD5E1;

  /* Dinia Umbrella & Suite Brand Tokens */
  --dinia-ikb: #002FA7;
  --dinia-sky: #60A5FA;
  --dinia-slate: #1D283A;
  --dinia-atlas: #33CCB1;
  --dinia-janus: #0891B2;
  --dinia-kairos: #A159A6;
  --dinia-iris: #644DB3;
  --dinia-suada: #CC9F33;

  /* Couches mémorielles */
  --janus-project: #0891B2;
  --janus-project-hover: #0E7490;
  --janus-project-bg: rgba(8, 145, 178, 0.10);
  --janus-project-glow: rgba(8, 145, 178, 0.20);

  --janus-profile: #7C3AED;
  --janus-profile-bg: rgba(124, 58, 237, 0.10);
  --janus-profile-glow: rgba(124, 58, 237, 0.20);

  --janus-friendship: #533DA0;
  --janus-friendship-bg: rgba(100, 77, 179, 0.10);
  --janus-friendship-glow: rgba(100, 77, 179, 0.20);

  --janus-idea: #B88B24;
  --janus-idea-bg: rgba(204, 159, 51, 0.10);
  --janus-idea-glow: rgba(204, 159, 51, 0.20);

  --janus-system: #64748B;
  --janus-system-bg: rgba(100, 116, 139, 0.10);

  --janus-success: #059669;
  --janus-danger: #DC2626;
  --janus-warning: #D97706;

  /* Text Dinia Light */
  --janus-text: #1D283A;
  --janus-muted: #64748B;
  --janus-subtle: #94A3B8;

  /* Scrollbar */
  --janus-scrollbar-thumb: #CBD5E1;
  --janus-scrollbar-thumb-hover: #94A3B8;
  --janus-overlay-scrim: rgba(15, 23, 42, 0.45);

  --shadow-main: 0 10px 30px -8px rgba(15, 23, 42, 0.12), 0 0 0 1px var(--janus-border);
  --shadow-card: 0 4px 18px rgba(15, 23, 42, 0.06);

  --janus-brand-gradient: linear-gradient(
    135deg,
    rgba(8, 145, 178, 0.08) 0%,
    rgba(0, 47, 167, 0.05) 100%
  );
}

:root {
  /* Tokens communs Dinia */
  --radius-sm: 8px;
  --radius-md: 0.75rem;
  --radius-card: 0.75rem;
  --radius-lg: 0.75rem;
  --radius-xl: 24px;
  --transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Reset & Base */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Dinia Section 1.2 — Règle d'or Anti-Bande Blanche (Dark Mode) */
html {
  min-height: 100%;
  background-color: #F8FAFC;
}

html.dark,
html[data-theme="dark"] {
  background-color: #030712 !important;
  color-scheme: dark;
}

body {
  min-height: 100vh;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background-color: #F8FAFC;
  color: #1D283A;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  display: flex;
  overflow-x: hidden;
  transition: background-color 0.2s ease, color 0.2s ease;
}

html.dark body,
html[data-theme="dark"] body {
  background-color: #030712 !important;
  color: #F8FAFC;
}

code,
pre,
.font-mono {
  font-family: 'JetBrains Mono', monospace;
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-display,
.brand-font,
.card-title,
.page-title {
  font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
  letter-spacing: -0.015em;
}

.font-sans {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--janus-scrollbar-thumb);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--janus-scrollbar-thumb-hover);
}

/* Lucide Icons Integration */
.lucide,
i[data-lucide],
svg.lucide {
  width: 1.1em;
  height: 1.1em;
  stroke-width: 2px;
  vertical-align: -0.15em;
  display: inline-block;
  flex-shrink: 0;
}

.icon-sm,
.icon-sm svg.lucide {
  width: 0.9em;
  height: 0.9em;
}

.icon-lg,
.icon-lg svg.lucide {
  width: 1.3em;
  height: 1.3em;
}

/* Dinia Auto-Hébergé Badge */
.badge-dinia-onprem {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: var(--radius-sm);
  background: rgba(8, 145, 178, 0.10);
  color: #0891b2;
  border: 1px solid rgba(8, 145, 178, 0.30);
  letter-spacing: 0.2px;
}
:root[data-theme="dark"] .badge-dinia-onprem,
html.dark .badge-dinia-onprem {
  background: rgba(8, 145, 178, 0.18);
  color: #22d3ee;
  border-color: rgba(8, 145, 178, 0.45);
}