/* ============================================================
   RESPONSIVE — Single breakpoint at 700px for mobile.
   No other breakpoints required.
   ============================================================ */

/* Library spine grid responsive breakpoints */
@media (max-width: 1100px) {
  .spine-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .spine-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
  .spine-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filter-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }
}

@media (max-width: 700px) {
  .sidebar {
    width: 52px;
  }

  /* Hide all text labels in the sidebar */
  .nd-name,
  .nd-role,
  .sidebar-label,
  .nav-item span,
  .sidebar-footer span:last-child {
    display: none;
  }

  /* Centre the nav dot when text is hidden */
  .nav-item {
    justify-content: center;
    padding: 10px;
  }

  /* Reduce chat area and input bar horizontal padding */
  .chat-area,
  .input-bar {
    padding-left: 16px;
    padding-right: 16px;
  }

  /* Contact grid stacks to single column */
  .contact-grid {
    grid-template-columns: 1fr;
  }
}