/* ============================= */
/* --- Load Google Fonts --- */
/* ============================= */
@import url('https://fonts.googleapis.com/css2?family=Jacquard+12&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');

/* ============================= */
/* --- Body background / text --- */
/* ============================= */
body {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ============================= */
/* --- Sidebar --- */
/* ============================= */
#R-sidebar {
  background-color: #39ff14 !important;
  color: #39ff14 !important;
}

/* Sidebar headings + links */
#R-sidebar h1,
#R-sidebar h2,
#R-sidebar h3,
#R-sidebar h4,
#R-sidebar h5,
#R-sidebar h6,
#R-sidebar a {
  font-family: 'Montserrat', sans-serif !important;
  color: #000000 !important;
}

/* Sidebar links hover */
#R-sidebar a:hover {
  color: #FFFFFF !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
}

/* ============================= */
/* --- Sidebar top header + logo --- */
/* ============================= */
:root {
  --MENU-HEADER-BG-color: #39ff14 !important;
  --MENU-HEADER-BORDER-color: #000000 !important;
  --INTERNAL-LOGO-LINK-color: #000000 !important;
}

/* ============================= */
/* --- Search box colors --- */
/* ============================= */
:root {
  --MENU-SEARCH-BORDER-color: #000000 !important;
  --MENU-SEARCH-color: #000000 !important;
  --MENU-SEARCH-BG-color: rgba(0, 0, 0, 0.15) !important;
}

/* ============================= */
/* --- Sidebar menu dividers --- */
/* ============================= */
:root {
  --MENU-SECTION-SEPARATOR-color: #000000 !important;
}

/* ============================= */
/* --- Top bar --- */
/* ============================= */
#R-topbar {
  background-color: #39ff14 !important;
}

/* Top bar title + text only (not icons) */
#R-topbar h1,
#R-topbar h2,
#R-topbar h3,
#R-topbar .title,
#R-topbar .breadcrumb,
#R-topbar span,
#R-topbar a {
  color: #000000 !important;
  font-family: 'Montserrat', sans-serif !important;
}

#R-topbar a:hover {
  color: #FFFFFF !important;
}

/* ============================= */
/* --- Headers (NO CAPS) --- */
/* ============================= */
h1, h2, h3, h4, h5, h6 {
  text-transform: none !important;
}

h1 {
  font-family: 'Jacquard 12', system-ui !important;
  color: #000000 !important;
}

h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  color: #000000 !important;
}

/* ============================= */
/* --- Body text --- */
/* ============================= */
body,
#R-sidebar {
  color: #000000 !important;
}

.highlight {
  background-color: #39ff14;
  padding: 2px 4px;
  border-radius: 2px;
  color: #000000 !important;
}

/* ============================= */
/* --- Regular links --- */
/* ============================= */
a {
  color: #000000 !important;
  text-decoration: underline;
  text-decoration-color: #39ff14 !important;
}

a:hover {
  color: #39ff14 !important;
}

/* ============================= */
/* --- Sidebar width fix (so text wraps) --- */
/* ============================= */
#R-sidebar {
  width: 280px !important;
  min-width: 280px !important;
}

#R-body-inner,
#R-body {
  margin-left: 280px !important;
}

.logo-title {
  white-space: normal !important;
  word-break: break-word !important;
  display: inline-block !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  color: #000000 !important;
}

/* ============================= */
/* --- Images --- */
/* ============================= */
img {
  max-width: 70% !important;
  height: auto !important;
  display: block !important;
  margin: 1rem auto !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

/* ============================= */
/* --- Code blocks --- */
/* ============================= */
code, pre, .highlight {
  background-color: #1a1a1a !important;
  color: #39ff14 !important;
  font-family: 'Montserrat', monospace !important;
  border-radius: 6px !important;
}

pre {
  padding: 1rem !important;
  border-left: 4px solid #39ff14 !important;
}

/* ============================= */
/* --- Tables --- */
/* ============================= */
table {
  border-collapse: collapse;
  width: 100%;
  margin: 1rem 0;
}

th, td {
  border: 1px solid #dddddd !important;
  padding: 10px;
}

th {
  background-color: #39ff14 !important;
  color: #000000 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
}

td {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* ============================= */
/* --- Buttons --- */
/* ============================= */
.button, button, input[type="submit"] {
  background-color: #39ff14 !important;
  color: #000000 !important;
  border: 1px solid #000000 !important;
  border-radius: 4px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 600 !important;
}

.button:hover, button:hover {
  background-color: #000000 !important;
  color: #39ff14 !important;
}

/* ============================= */
/* --- Footer --- */
/* ============================= */
footer, #footer {
  background-color: #f0f0f0 !important;
  color: #000000 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* ============================= */
/* --- Horizontal rules --- */
/* ============================= */
hr {
  border: none !important;
  height: 2px !important;
  background: linear-gradient(90deg, #39ff14, #000000, #39ff14) !important;
  margin: 1rem 0 !important;
}