/* Opaque, readable navigation submenus on phones and small tablets. */
@media (max-width: 900px) {
  body .accounting-submenu,
  body .clients-submenu,
  body .tools-submenu {
    box-sizing: border-box;
    max-width: calc(100vw - 16px);
    max-height: calc(100dvh - 100px);
    overflow: auto;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px;
    border: 1px solid #475569;
    border-radius: 12px;
    background: #14182b;
    color: #f8fafc;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
  }

  body .accounting-submenu .btn,
  body .clients-submenu .btn,
  body .tools-submenu .btn {
    max-width: 100%;
    white-space: normal;
    background: #263447;
    color: #f8fafc;
    border-color: #64748b;
  }

  body .accounting-submenu .btn:hover,
  body .clients-submenu .btn:hover,
  body .tools-submenu .btn:hover,
  body .accounting-submenu .btn:focus-visible,
  body .clients-submenu .btn:focus-visible,
  body .tools-submenu .btn:focus-visible {
    background: #334155;
    color: #f8fafc;
  }
}