/* Ajustes para que el panel no se comprima en teléfonos. */
@media (max-width: 560px) {
  html, body { overflow-x: hidden; }
  .topbar { min-height: 58px; height: auto; padding: 8px 14px; gap: 8px; }
  .breadcrumb { min-width: 0; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .topbar-right { flex: 0 0 auto; gap: 5px; }
  .topbar-right .back-public-site { padding: 7px 8px; font-size: 10px; }
  .view { padding: 22px 14px 48px; }
  .page-heading { display: flex; flex-direction: column; align-items: stretch; gap: 14px; margin-bottom: 20px; }
  .page-heading > div:first-child { width: 100%; }
  .page-heading h1 { font-size: 25px; line-height: 1.1; }
  .page-heading p:not(.eyebrow) { font-size: 13px; }
  .page-actions { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .page-actions .button, .page-actions > button { width: 100%; min-width: 0; min-height: 42px; padding: 8px 7px; font-size: 11px; line-height: 1.18; white-space: normal; }
  .metric-grid { gap: 12px; }
  .metric-card { padding: 16px; }
  .dashboard-grid { gap: 12px; margin-top: 12px; }
  .panel { padding: 16px; }
  .list-panel { padding: 0; }
  .panel-title { align-items: flex-start; }
  #dashboardView .page-actions { grid-template-columns: 1fr 1fr; }
  #dashboardView .page-actions > :last-child:nth-child(odd) { grid-column: 1 / -1; }
}

@media (max-width: 360px) {
  .topbar-right .back-public-site { font-size: 0; padding: 8px; }
  .topbar-right .back-public-site::before { content: '↔'; font-size: 15px; }
  .page-actions { grid-template-columns: 1fr; }
}
