/* Custom styles for WFP Data Quality Automation docs */

/* Improve grid spacing for cards */
.grid {
  gap: 1.5rem;
}

/* Style code blocks */
pre {
  border-left: 3px solid var(--bs-primary, #007DBC);
  border-radius: 4px;
}

/* Enhance callout boxes */
.callout {
  border-radius: 6px;
  margin: 1.5rem 0;
}

/* Improve table styling */
table {
  font-size: 0.95em;
}

/* Add spacing for mermaid diagrams */
.mermaid {
  margin: 2rem 0;
}

/* Style the home page cards */
.g-col-12 {
  padding: 1.5rem;
  border-left: 4px solid var(--bs-primary, #007DBC);
  background: #f8f9fa;
  border-radius: 4px;
  transition: transform 0.2s, box-shadow 0.2s;
}

.g-col-12:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Better code copy button positioning */
.code-copy-button {
  opacity: 0.7;
}

.code-copy-button:hover {
  opacity: 1;
}

/* Improve sidebar navigation */
.sidebar-navigation .sidebar-item {
  font-size: 0.95em;
}

/* Style metadata labels in docs */
dt {
  font-weight: 600;
  color: var(--bs-primary, #007DBC);
}

/* Add visual hierarchy to headings */
h2 {
  margin-top: 2rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #e9ecef;
}

h3 {
  margin-top: 1.5rem;
  color: #495057;
}

/* Improve link styling */
a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* Style for the quick reference tables */
.quick-reference table {
  width: 100%;
}

/* Better mobile responsiveness */
@media (max-width: 768px) {
  .g-col-12 {
    margin-bottom: 1rem;
  }
}

/* Make navbar logo link to WFP website */
.navbar-brand {
  cursor: pointer;
}