/* === SIDEBAR ACCORDION - THEME 3: Minimal & Modern === */

/* Root container */
.mantine-Accordion-root {
  background-color: #f8fafc; /* Sidebar background */
  border: none;
  padding: 5px 0; /* Add some padding top/bottom */
}

/* Individual accordion item */
.mantine-Accordion-item {
  background-color: transparent; /* Use root background */
  border: none; /* Remove all borders */
  margin-bottom: 2px; /* Minimal space between items */
}

/* Control (the clickable header) */
.mantine-Accordion-control {
  background-color: transparent;
  color: #374151;       /* Gray-700 */
  padding: 10px 12px;   /* Adjust padding */
  font-size: 14px;
  font-weight: 500;
  border-radius: 5px;    /* Round corners for hover effect */
  transition: background-color 0.15s ease, color 0.15s ease;
}

.mantine-Accordion-control:hover {
  background-color: #e5e7eb; /* Gray-200 for subtle hover */
  color: #111827;       /* Gray-900 */
}

/* Control when its panel is open (active) */
.mantine-Accordion-control[data-active] {
  background-color: transparent; /* No background change */
  color: #1e293b;       /* Darker text when active */
  font-weight: 600;      /* Bolder when active */
}

/* Chevron icon */
.mantine-Accordion-chevron {
  color: #9ca3af; /* Gray-400 */
  transition: transform 0.2s ease;
}
/* Chevron when panel is open */
.mantine-Accordion-control[data-active] .mantine-Accordion-chevron {
  transform: rotate(180deg);
  color: #1e293b; /* Darker chevron */
}

/* Panel containing the links */
.mantine-Accordion-panel {
  background-color: transparent; /* Use root background */
  color: #4b5563;       /* Gray-600 */
  padding: 4px 12px 8px 26px; /* Indent content, less vertical padding */
}

/* === END THEME 3 === */