/* =========================================================
   THEME: MIDNIGHT MINIMALIST (V10 Final - Purified)
   File: /static/css/themes/theme-midnight.css
   ========================================================= */

:root {
  /* --- 1. GLOBAL APP COLORS (Feeds the UI & AI Assistant) --- */
  --bv-bg-glass: rgba(15, 23, 42, 0.95); /* Deep dark blue glass */
  --wall: #020617; 
  --bv-bg-main: #0f172a;
  --bv-bg-panel: #0f172a;
  --bv-bg-card: #1e293b;
  --bv-bg-card-hover: #334155;
  --bv-bg-input: #1e293b;
  
  /* High contrast text */
  --bv-text-main: #f8fafc;
  --bv-text-subtle: #94a3b8;
  
  /* Borders & Accents */
  --bv-border-main: #334155;
  --bv-border-subtle: #1e293b;
  --bv-accent-primary: #38bdf8; /* Sleek neon blue */

  /* --- 2. BUTTON PAINT (Neon Ghost Style) --- */
  
  /* Resting State: Stealthy and sleek */
  --btn-bg: rgba(30, 41, 59, 0.4); 
  --btn-text: #e2e8f0; 
  --btn-border-width: 1px;
  --btn-border-style: solid;
  --btn-border-color: #475569; 
  --btn-radius: 8px; 
  --btn-padding: 8px 18px;
  --btn-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --btn-weight: 600;
  --btn-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);

  /* Hover State: The Neon Glow */
  --btn-hover-bg: rgba(56, 189, 248, 0.08); 
  --btn-hover-text: #38bdf8; 
  --btn-hover-border: #38bdf8; 
  --btn-hover-transform: translateY(-1px); 
  --btn-hover-shadow: 0 4px 12px rgba(56, 189, 248, 0.15); 
}

/* --- 3. FRAME PAINT (Edge-to-Edge Microfiche) --- */
.viewer-stage {
  background-color: var(--wall);
  background-image: none;
  padding: 0 !important; 
}

.book-frame {
  width: 100%;       
  max-width: 100%;
  padding: 0;        
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

#canvasContainer {
  width: 100%;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

#pdfCanvas {
  margin: 0 auto; 
  /* Inverts the PDF to dark mode, keeps images mostly intact */
  filter: invert(1) hue-rotate(180deg) brightness(0.85); 
}

/* --- 4. APP CONTAINER FLAT LOOK --- */
.terminal-plate {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.tab {
  padding: 0 !important; 
}

/* --- 5. LIBRARY CARDS FIX (GOD MODE SPECIFICITY) --- */
/* Force the resting state to be dark */
html body #bookList .book-card, 
html body #bookList .book-mini,
html body #bookList .book-info,
html body #bookList .result {
  background: var(--bv-bg-card) !important;
  border-color: var(--bv-border-main) !important;
}

/* Force ALL text inside the cards to be light */
html body #bookList .book-card *, 
html body #bookList .book-mini *,
html body #bookList .book-info *,
html body #bookList .result * {
  color: var(--bv-text-main) !important;
}

/* 🔥 THE HOVER FIX: Defeat the white/transparent flash forever 🔥 */
html body #bookList .book-card:hover, 
html body #bookList .book-mini:hover,
html body #bookList .book-info:hover,
html body #bookList .result:hover {
  background: var(--bv-bg-card-hover) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important; 
  transform: translateY(-2px) !important; 
}

/* Force the text to STAY light when hovered */
html body #bookList .book-card:hover *, 
html body #bookList .book-mini:hover * {
  color: #ffffff !important; 
}

/* Fix the Open/Edit Buttons so they stay visible */
html body #bookList .book-card button,
html body #bookList .book-mini button {
  background: var(--bv-bg-input) !important;
  color: var(--bv-accent-primary) !important;
  border: 1px solid var(--bv-border-main) !important;
}

html body #bookList .book-card button:hover,
html body #bookList .book-mini button:hover {
  background: var(--bv-bg-main) !important;
  color: #ffffff !important;
}

/* --- 6. NAVIGATION MENU HOVER CONTRAST --- */
html body nav button,
html body .nav-btn,
html body #themeSwitcher {
  background: var(--bv-bg-card) !important;
  color: var(--bv-text-subtle) !important;
  border: 1px solid var(--bv-border-main) !important;
  border-bottom: 2px solid var(--bv-border-main) !important;
  transition: all 0.2s ease !important;
}

html body nav button:hover,
html body .nav-btn:hover,
html body #themeSwitcher:hover {
  background: var(--bv-bg-card-hover) !important;
  color: #ffffff !important; 
  border-color: var(--bv-border-subtle) !important;
  border-bottom: 2px solid var(--bv-accent-primary) !important; 
}

/* --- 7. SEMANTIC COLOR-CODED BUTTONS --- */
/* Default / Navigation Buttons (Prev, Next, Go) */
html body button,
html body .bv-btn {
  background: var(--bv-bg-input) !important; 
  color: #f8fafc !important; 
  border: 1px solid var(--bv-border-main) !important;
  transition: all 0.2s ease !important;
}

html body button:hover,
html body .bv-btn:hover {
  background: var(--bv-bg-card-hover) !important;
  border-color: var(--bv-accent-primary) !important;
  color: var(--bv-accent-primary) !important; 
  transform: translateY(-1px) !important;
}

/* Primary Action Buttons (Save, Search, Submit) */
html body button.primary,
html body .bv-btn--primary,
html body #btnSaveSelection,
html body button[onclick="viewerRunSearch()"] {
  background: rgba(56, 189, 248, 0.15) !important; 
  color: #38bdf8 !important; 
  border: 1px solid #38bdf8 !important;
}

html body button.primary:hover,
html body .bv-btn--primary:hover,
html body #btnSaveSelection:hover,
html body button[onclick="viewerRunSearch()"]:hover {
  background: #38bdf8 !important; 
  color: #0f172a !important; 
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.4) !important; 
}

/* Destructive / Clear Buttons (Clear Underlines) */
html body button.clear-last,
html body button.clear-all,
html body #btnClearLastUnderline,
html body #btnClearUnderlines {
  background: rgba(239, 68, 68, 0.1) !important; 
  color: #ef4444 !important; 
  border: 1px solid rgba(239, 68, 68, 0.5) !important;
}

html body button.clear-last:hover,
html body button.clear-all:hover,
html body #btnClearLastUnderline:hover,
html body #btnClearUnderlines:hover {
  background: #ef4444 !important;
  color: #ffffff !important;
  border-color: #ef4444 !important;
  box-shadow: 0 0 12px rgba(239, 68, 68, 0.4) !important; 
}

/* Utility Actions (Copy, Download, Restore) */
html body button.restore-crop,
html body #btnCopySelection,
html body #btnDownloadSelection {
  background: rgba(167, 139, 250, 0.1) !important; 
  color: #a78bfa !important; 
  border: 1px solid rgba(167, 139, 250, 0.5) !important;
}

html body button.restore-crop:hover,
html body #btnCopySelection:hover,
html body #btnDownloadSelection:hover {
  background: #a78bfa !important;
  color: #ffffff !important;
  border-color: #a78bfa !important;
  box-shadow: 0 0 12px rgba(167, 139, 250, 0.4) !important;
}

/* --- 8. NAV BAR THEME FIX --- */
html body nav {
  background: var(--bv-bg-main) !important;
  border-bottom: 1px solid var(--bv-border-main) !important;
}
/* --- 9. THE PILL FIX (ABSOLUTE GLOBAL BLANKET) --- */
/* Catches every single variation of pills, INCLUDING .bv-pill */
html body div.pill,
html body span.pill,
html body a.pill,
html body button.pill,
html body .pill,
html body .bv-pill, /* <-- THE SMOKING GUN */
html body #tagCloud span, 
html body #tagCloud a,
html body #tagCloud div,
html body .book-tag,
html body .badge-unfiled,
html body #bookList .book-card-pills > *,
html body #bookList .book-card-tag-pills > *,
html body #bookList .book-card-meta .pill,
html body #bookList .book-card .pill,
html body .archive-wrap .pill {
  background-color: var(--bv-bg-input) !important;
  background: var(--bv-bg-input) !important;
  color: var(--bv-text-subtle) !important;
  border: 1px solid var(--bv-border-main) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body div.pill:hover,
html body span.pill:hover,
html body a.pill:hover,
html body button.pill:hover,
html body .pill:hover,
html body .bv-pill:hover, /* <-- HOVER FIX */
html body #tagCloud span:hover, 
html body #tagCloud a:hover,
html body #tagCloud div:hover,
html body .book-tag:hover,
html body .badge-unfiled:hover,
html body #bookList .book-card-pills > *:hover,
html body #bookList .book-card-tag-pills > *:hover,
html body #bookList .book-card-meta .pill:hover,
html body #bookList .book-card .pill:hover,
html body .archive-wrap .pill:hover {
  background-color: var(--bv-bg-card-hover) !important;
  background: var(--bv-bg-card-hover) !important;
  color: #ffffff !important;
  border-color: var(--bv-accent-primary) !important;
  transform: translateY(-1px) !important;
}

/* Failsafe for D3.js SVG Text */
html body #tagCloud text {
  fill: var(--bv-text-main) !important;
}
html body #tagCloud text:hover {
  fill: var(--bv-accent-primary) !important;
}
/* =========================================================
   11. AI ASSISTANT PANEL BEAUTIFICATION
========================================================= */

/* --- A. Segmented Header Tabs --- */
html body .bv-side-assist__switcher {
  background: var(--bv-bg-main) !important;
  border: 1px solid var(--bv-border-main) !important;
  border-radius: 12px !important;
  padding: 4px !important;
  display: flex !important;
  gap: 4px !important;
}

html body .bv-side-assist__tab {
  border-radius: 8px !important;
  border: none !important;
  background: transparent !important;
  color: var(--bv-text-subtle) !important;
  font-weight: 700 !important;
  transition: all 0.2s ease !important;
}

html body .bv-side-assist__tab.is-active {
  background: var(--bv-bg-card-hover) !important;
  color: var(--bv-text-main) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2) !important;
}

/* --- B. Toolbar & Switches --- */
html body .bv-ai-toolbar {
  padding: 16px !important;
  gap: 16px !important;
}

html body .bv-ai-mode {
  background: var(--bv-bg-main) !important;
  border-radius: 8px !important;
  padding: 4px !important;
}

html body .bv-ai-mode button {
  border-radius: 6px !important;
  border: none !important;
}

/* Make the active Scan/Memory mode pop with neon */
html body .bv-ai-mode button.is-active {
  background: var(--bv-accent-primary) !important;
  color: #0f172a !important; /* Dark text on neon background */
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.3) !important;
}

/* --- C. Terminal Chat Bubbles --- */
html body .bv-chat-answer {
  background: rgba(30, 41, 59, 0.6) !important; /* Slightly transparent card */
  border: 1px solid var(--bv-border-main) !important;
  border-left: 3px solid var(--bv-accent-primary) !important; /* Neon blue accent line */
  border-radius: 4px 12px 12px 12px !important; /* Sleek, directional bubble shape */
  padding: 16px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

html body .bv-chat-answer__label {
  color: var(--bv-accent-primary) !important;
  font-weight: 800 !important;
  margin-bottom: 8px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  font-size: 11px !important;
}

/* --- D. Modern Input Row --- */
html body .bv-ai-inputbar {
  background: var(--bv-bg-panel) !important;
  border-top: 1px solid var(--bv-border-main) !important;
  padding: 16px !important;
  display: flex !important; /* Forces them onto one line */
  flex-direction: row !important;
  gap: 12px !important;
  align-items: stretch !important; /* Makes button match input height */
}

html body .bv-ai-inputbar input {
  flex: 1 !important;
  background: var(--bv-bg-input) !important;
  border: 1px solid var(--bv-border-main) !important;
  border-radius: 24px !important; /* Pill shape */
  padding: 12px 20px !important;
  color: var(--bv-text-main) !important;
  font-size: 14px !important;
  transition: all 0.2s ease !important;
}

html body .bv-ai-inputbar input:focus {
  border-color: var(--bv-accent-primary) !important;
  box-shadow: 0 0 0 2px rgba(56, 189, 248, 0.15) !important;
  outline: none !important;
}

html body .bv-ai-inputbar button {
  background: var(--bv-accent-primary) !important;
  color: #0f172a !important; /* Deep dark text for contrast */
  border-radius: 24px !important; /* Pill shape */
  padding: 0 24px !important;
  font-weight: 800 !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(56, 189, 248, 0.3) !important; /* Neon glow */
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html body .bv-ai-inputbar button:hover {
  filter: brightness(1.15) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(56, 189, 248, 0.45) !important;
}
/* --- E. Remove Blocky Chat Separators --- */
/* Kills the background on the full-width message wrappers */
html body .bv-chat-msg,
html body .bv-chat-msg--user,
html body .bv-chat-msg--ai,
html body .bv-chat-msg--system {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 8px 0 !important; /* Gives the floating bubbles room to breathe */
}

/* Ensure the "Insufficient Credits" error bubble also floats cleanly */
html body .bv-chat-error,
html body .bv-chat-notification {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* If the error text itself has a box, make it sleek */
html body .bv-chat-error span,
html body .bv-chat-notification span {
  background: rgba(239, 68, 68, 0.1) !important; /* Soft crimson */
  border: 1px dashed rgba(239, 68, 68, 0.4) !important;
  color: #ef4444 !important;
  padding: 8px 16px !important;
  border-radius: 8px !important;
}
/* --- 12. MODAL HEADER CONTRAST FIX --- */
html body .bv-modal__header {
  background: var(--bv-bg-panel) !important;
  border-bottom: 1px solid var(--bv-border-main) !important;
}

html body .bv-modal__header .bv-modal__title,
html body .bv-modal__header h3 {
  color: var(--bv-text-main) !important;
}

html body .bv-modal__header .bv-text-subtle {
  color: var(--bv-text-subtle) !important;
}
/* --- 13. CLAIM CARD BUTTON HOVER FIX --- */
html body .claim-row .bv-btn:hover,
html body .claim-card-actions button:hover,
html body .bv-card__actions .bv-btn:hover {
  background: var(--bv-accent-primary) !important; /* Fills with neon blue */
  color: #0f172a !important; /* Forces the text to be deep dark slate for massive contrast */
  border-color: var(--bv-accent-primary) !important;
  box-shadow: 0 4px 12px rgba(56, 189, 248, 0.3) !important; /* Adds the neon glow */
  transform: translateY(-1px) !important;
}

/* Ensure the text is bright white when NOT hovering */
html body .claim-row .bv-btn,
html body .claim-card-actions button,
html body .bv-card__actions .bv-btn {
  color: var(--bv-text-main) !important;
}